/* Pristine Dataset — clean-room / assay-sheet direction
   paper: cool blue-white, not cream.  accent: instrument indigo + scarcity amber. */

:root{
  --paper:#EDF0F2;
  --paper-hi:#F8FAFB;
  --ink:#0E1418;
  --ink-soft:#1A2329;
  --slate:#5A6872;
  --rule:#C7D0D6;
  --rule-soft:#DCE3E7;
  --assay:#1F3AD6;
  --yield:#D89400;

  --display:"Archivo","Helvetica Neue",Arial,sans-serif;
  --body:"Newsreader",Georgia,"Times New Roman",serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;

  --gut:clamp(20px,5vw,64px);
  --maxw:1240px;
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--body);
  font-size:clamp(17px,1.05vw,19px);
  line-height:1.62;
  font-optical-sizing:auto;
  background-image:
    linear-gradient(to right,rgba(90,104,114,.055) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(90,104,114,.055) 1px,transparent 1px);
  background-size:96px 96px;
}

.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gut)}

.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--paper);padding:12px 18px;z-index:99}
.skip:focus{left:0}

a{color:inherit}
:focus-visible{outline:2px solid var(--assay);outline-offset:3px}

/* ── type roles ─────────────────────────────────── */
.label,.eyebrow{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--slate);
  font-weight:500;
}
.eyebrow{margin:0 0 22px}
.eyebrow--inv{color:#8C9AA4}

.display{
  font-family:var(--display);
  font-variation-settings:"wdth" 112;
  font-weight:600;
  font-size:clamp(2.5rem,6.2vw,5rem);
  line-height:.96;
  letter-spacing:-.025em;
  margin:0 0 28px;
  max-width:17ch;
  text-wrap:balance;
}

.h2{
  font-family:var(--display);
  font-variation-settings:"wdth" 108;
  font-weight:550;
  font-size:clamp(1.7rem,3.1vw,2.6rem);
  line-height:1.08;
  letter-spacing:-.018em;
  margin:0 0 48px;
  max-width:22ch;
  text-wrap:balance;
}
.h2--inv{color:var(--paper-hi)}

.h3{
  font-family:var(--display);
  font-variation-settings:"wdth" 106;
  font-weight:550;
  font-size:clamp(1.4rem,2.2vw,1.9rem);
  line-height:1.1;
  letter-spacing:-.015em;
  margin:0 0 14px;
}
.h3--inv{color:var(--paper-hi)}

.lede{
  font-size:1.16em;
  color:var(--ink-soft);
  max-width:60ch;
  margin:0 0 34px;
}

/* ── header ─────────────────────────────────────── */
.topbar{
  position:sticky;top:0;z-index:20;
  background:color-mix(in srgb,var(--paper) 86%,transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--rule);
}
.topbar__in{display:flex;align-items:center;justify-content:space-between;gap:24px;height:64px}

.mark{display:flex;align-items:center;gap:10px;text-decoration:none}
.mark__glyph{
  width:14px;height:14px;flex:none;border-radius:50%;
  background:var(--yield);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--yield) 22%,transparent);
}
.mark__name{
  font-family:var(--display);
  font-variation-settings:"wdth" 118;
  font-weight:600;letter-spacing:-.01em;font-size:1.02rem;
}

.topnav{display:flex;align-items:center;gap:26px;font-family:var(--mono);font-size:12px;letter-spacing:.04em}
.topnav a{text-decoration:none;color:var(--slate)}
.topnav a:hover{color:var(--ink)}
.topnav__cta{color:var(--assay) !important;border-bottom:1px solid var(--assay);padding-bottom:2px}
@media (max-width:820px){.topnav a:not(.topnav__cta){display:none}}

/* ── buttons ────────────────────────────────────── */
.btn{
  display:inline-block;
  font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;
  padding:15px 26px;text-decoration:none;border:1px solid var(--ink);
  transition:background .18s ease,color .18s ease,transform .18s ease;
  cursor:pointer;
}
.btn--solid{background:var(--ink);color:var(--paper-hi)}
.btn--solid:hover{background:var(--assay);border-color:var(--assay)}
.btn--ghost{background:transparent;color:var(--ink)}
.btn--ghost:hover{background:var(--ink);color:var(--paper-hi)}
.btn--outline{background:transparent;color:var(--paper-hi);border-color:#5D6C77}
.btn--outline:hover{background:var(--yield);border-color:var(--yield);color:var(--ink)}

/* ── hero ───────────────────────────────────────── */
.hero{padding:clamp(56px,9vw,112px) 0 clamp(48px,7vw,88px)}
.hero__cta{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:clamp(56px,8vw,104px)}

/* ── signature: scarcity axis ───────────────────── */
.axis{margin:0;border-top:1px solid var(--ink);padding-top:16px}
.axis__cap{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.axis__hint{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--yield)}

.axis__rail{position:relative;height:96px;margin-top:34px}
.axis__line{position:absolute;left:0;right:0;top:52px;height:1px;background:var(--rule)}
.axis__ticks{position:absolute;left:0;right:0;top:52px;height:9px;
  background-image:linear-gradient(to right,var(--rule-soft) 1px,transparent 1px);
  background-size:calc(100% / 48) 100%;
}
.axis__markers{position:absolute;inset:0}

.mk{
  position:absolute;top:0;bottom:0;
  transform:translateX(-50%);
  width:44px;
  background:none;border:0;padding:0;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
}
.mk__stem{width:1px;height:42px;flex:none;background:var(--rule);transition:background .2s ease}
.mk__dot{
  width:10px;height:10px;border-radius:50%;
  background:var(--paper);border:1.5px solid var(--slate);
  transition:transform .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.mk__idx{
  font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--slate);
  margin-top:10px;opacity:.55;transition:opacity .2s ease,color .2s ease;
}
.mk:hover .mk__dot{transform:scale(1.35);border-color:var(--ink)}
.mk[aria-selected="true"] .mk__dot{
  background:var(--yield);border-color:var(--yield);transform:scale(1.5);
  box-shadow:0 0 0 6px color-mix(in srgb,var(--yield) 20%,transparent);
}
.mk[aria-selected="true"] .mk__stem{background:var(--yield)}
.mk[aria-selected="true"] .mk__idx{opacity:1;color:var(--ink)}

.axis__ends{
  display:flex;justify-content:space-between;gap:16px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--slate);
  border-top:1px solid var(--rule-soft);padding-top:10px;
}

.specimen{
  margin-top:28px;
  background:var(--paper-hi);
  border:1px solid var(--rule);
  border-left:3px solid var(--yield);
  padding:clamp(20px,3vw,34px);
  display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(20px,3vw,44px);
}
@media (max-width:760px){.specimen{grid-template-columns:1fr}}
.specimen h3{
  font-family:var(--display);font-variation-settings:"wdth" 108;font-weight:550;
  font-size:clamp(1.25rem,2.4vw,1.75rem);line-height:1.12;letter-spacing:-.015em;margin:6px 0 12px;
}
.specimen p{margin:0;color:var(--ink-soft)}
.specimen__id{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--yield)}

.fields{margin:0;font-family:var(--mono);font-size:12.5px;line-height:1.5}
.fields div{display:grid;grid-template-columns:9.5em 1fr;gap:12px;padding:9px 0;border-top:1px solid var(--rule-soft)}
.fields div:first-child{border-top:0}
.fields dt{color:var(--slate);letter-spacing:.04em}
.fields dd{margin:0;color:var(--ink)}

.axis__note{font-family:var(--mono);font-size:11px;line-height:1.6;color:var(--slate);margin:18px 0 0;max-width:70ch}

/* ── bands ──────────────────────────────────────── */
.band{padding:clamp(64px,9vw,124px) 0;border-top:1px solid var(--rule)}
.band--ink{background:var(--ink);color:#CFD8DE;border-top:0}
.band--ink .step p{color:#A9B6BF}
.band--split{background:var(--paper-hi)}

/* ── cards ──────────────────────────────────────── */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule)}
@media (max-width:900px){.cards{grid-template-columns:1fr}}
.card{background:var(--paper-hi);padding:clamp(22px,2.6vw,34px)}
.card__head{margin-bottom:14px}
.card__head h3{
  font-family:var(--display);font-variation-settings:"wdth" 108;font-weight:550;
  font-size:1.32rem;letter-spacing:-.012em;margin:10px 0 0;
}
.card p{margin:0 0 22px;color:var(--ink-soft);font-size:.97em}

/* ── steps ──────────────────────────────────────── */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:0}
@media (max-width:980px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.steps{grid-template-columns:1fr}}
.step{border-top:1px solid #2C363D;padding:22px 26px 8px 0}
.step__n{font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--yield)}
.step h3{
  font-family:var(--display);font-variation-settings:"wdth" 108;font-weight:550;
  font-size:1.14rem;letter-spacing:-.01em;color:var(--paper-hi);margin:14px 0 10px;
}
.step p{margin:0;font-size:.92em;line-height:1.55}

/* ── provenance ─────────────────────────────────── */
.prov{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px);align-items:start}
@media (max-width:900px){.prov{grid-template-columns:1fr}}
.prov__lead .h2{margin-bottom:24px}
.prov__list{margin:0}
.prov__list div{border-top:1px solid var(--rule);padding:20px 0}
.prov__list dt{font-family:var(--mono);font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--assay);margin-bottom:8px}
.prov__list dd{margin:0;color:var(--ink-soft);font-size:.97em}

/* ── doors / forms ──────────────────────────────── */
.doors{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--rule);border:1px solid var(--rule)}
@media (max-width:900px){.doors{grid-template-columns:1fr}}
.door{background:var(--paper-hi);padding:clamp(26px,3.4vw,52px)}
.door p{color:var(--ink-soft);max-width:48ch}
.door--alt{background:var(--ink);color:#B9C5CD}
.door--alt p{color:#A9B6BF}

.form{margin-top:30px;display:grid;gap:16px}
.field{display:grid;gap:7px}
.field span{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--slate)}
.door--alt .field span{color:#8C9AA4}
.field input,.field textarea,.field select{
  font-family:var(--body);font-size:1rem;color:var(--ink);
  background:var(--paper);border:1px solid var(--rule);border-radius:0;
  padding:12px 14px;width:100%;
}
.door--alt .field input,.door--alt .field textarea,.door--alt .field select{
  background:#161F25;border-color:#333F47;color:var(--paper-hi);
}
.field textarea{resize:vertical}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--assay)}
.form .btn{justify-self:start;margin-top:6px}
.hp{position:absolute;left:-9999px}

/* ── footer ─────────────────────────────────────── */
.foot{border-top:1px solid var(--rule);padding:44px 0}
.foot__in{display:flex;justify-content:space-between;gap:28px;flex-wrap:wrap;align-items:flex-end}
.foot__name{font-family:var(--display);font-variation-settings:"wdth" 118;font-weight:600;margin:12px 0 4px}
.foot__line{font-family:var(--mono);font-size:11.5px;letter-spacing:.05em;color:var(--slate);margin:0}
.foot__contact{text-align:right}
.foot__contact a{font-family:var(--mono);font-size:12.5px;color:var(--assay)}
@media (max-width:600px){.foot__contact{text-align:left}}

/* ── thanks page ────────────────────────────────── */
.thanks{min-height:70vh;display:flex;align-items:center;padding:80px 0}

/* ── motion ─────────────────────────────────────── */
.reveal{opacity:0;transform:translateY(14px)}
.reveal.in{opacity:1;transform:none;transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}

/* ── small screens ──────────────────────────────── */
@media (max-width:620px){
  .axis__ends{font-size:9px;letter-spacing:.06em;line-height:1.35}
  .axis__ends span{max-width:46%}
  .axis__rail{height:88px}
  .mk{width:32px}
  .fields div{grid-template-columns:1fr;gap:2px}
  .fields dt{letter-spacing:.08em}
}