:root{
  --bg:#F5F4F0;
  --surface:#FFFFFF;
  --surface-alt:#ECE9E1;
  --ink:#1B2430;
  --ink-muted:#5B6472;
  --line:#D9D5CB;
  --primary:#24405F;
  --primary-ink:#FFFFFF;
  --accent:#C97A1F;
  --accent-ink:#241606;
  --tag-green:#3E6E4E;
  --error:#A8321E;
  --focus:#24405F;
  color-scheme: light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#14181D;
    --surface:#1B2129;
    --surface-alt:#232A33;
    --ink:#EDEEEE;
    --ink-muted:#9AA4AF;
    --line:#333D48;
    --primary:#7FA3C9;
    --primary-ink:#0F161D;
    --accent:#E29A44;
    --accent-ink:#241606;
    --tag-green:#6FAF84;
    --error:#F08A76;
    --focus:#7FA3C9;
    color-scheme: dark;
  }
}
:root[data-theme="dark"]{
  --bg:#14181D;
  --surface:#1B2129;
  --surface-alt:#232A33;
  --ink:#EDEEEE;
  --ink-muted:#9AA4AF;
  --line:#333D48;
  --primary:#7FA3C9;
  --primary-ink:#0F161D;
  --accent:#E29A44;
  --accent-ink:#241606;
  --tag-green:#6FAF84;
  --error:#F08A76;
  --focus:#7FA3C9;
  color-scheme: dark;
}

*{box-sizing:border-box;}
html{scroll-padding-top:80px;}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif;
  font-size:14px;
  line-height:1.55;
  padding-inline:20px;
}
img{max-width:100%;}
.wrap{max-width:920px; margin:0 auto;}
h1,h2,h3{
  font-family:'Big Shoulders Display', 'Arial Narrow', sans-serif;
  text-transform:uppercase;
  letter-spacing:0.01em;
  text-wrap:balance;
  color:var(--ink);
  margin:0;
}
.mono{font-family:'IBM Plex Mono', ui-monospace, monospace;}
a{color:var(--primary);}
.eyebrow{
  font-family:'IBM Plex Mono', monospace;
  font-size:12px;
  font-weight:600;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--ink-muted);
}
section{padding-block:56px;}
section + section{border-top:1px solid var(--line);}

/* ---------- Header ---------- */
header.top{
  position:sticky;
  top:0;
  z-index:50;
  background:var(--bg);
  border-bottom:1px solid var(--line);
  padding-block:16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.brand{display:flex; align-items:baseline; gap:10px;}
.brand .mark{
  font-family:'Big Shoulders Display', sans-serif;
  font-weight:800;
  font-size:22px;
  letter-spacing:0.02em;
}
.brand .sub{
  font-size:12px;
  color:var(--ink-muted);
  font-family:'IBM Plex Mono', monospace;
  letter-spacing:0.04em;
}
nav.top-links{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
  font-size:13px;
  font-family:'IBM Plex Mono', monospace;
  letter-spacing:0.02em;
}
nav.top-links a{color:var(--ink-muted); text-decoration:none;}
nav.top-links a:hover, nav.top-links a:focus-visible{color:var(--ink); text-decoration:underline;}

/* ---------- Hero ---------- */
.hero{padding-top:24px; padding-bottom:48px;}
.tag-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid var(--tag-green);
  color:var(--tag-green);
  font-family:'IBM Plex Mono', monospace;
  font-size:12px;
  font-weight:600;
  letter-spacing:0.08em;
  text-transform:uppercase;
  padding:5px 10px;
  border-radius:2px;
  margin-bottom:18px;
}
.tag-chip .dot{width:6px; height:6px; border-radius:50%; background:var(--tag-green); flex:none;}
h1.headline{
  font-size:clamp(34px, 6vw, 58px);
  line-height:1.02;
  max-width:14ch;
}
.sub-headline{
  margin-top:20px;
  max-width:56ch;
  font-size:18px;
  color:var(--ink-muted);
}
.cta-row{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:32px;
  align-items:center;
}
.btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:'IBM Plex Mono', monospace;
  font-weight:600;
  font-size:14px;
  letter-spacing:0.03em;
  text-transform:uppercase;
  padding:14px 22px;
  border-radius:2px;
  text-decoration:none;
  cursor:pointer;
  border:1px solid transparent;
}
.btn-primary{background:var(--accent); color:var(--accent-ink);}
.btn-primary:hover, .btn-primary:focus-visible{filter:brightness(1.06);}
.btn-primary:disabled{opacity:0.6; cursor:progress;}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--line);}
.btn-ghost:hover, .btn-ghost:focus-visible{border-color:var(--ink);}
:focus-visible{outline:2px solid var(--focus); outline-offset:2px;}

/* ---------- Manufacturers ---------- */
.section-head{margin-bottom:28px;}
.section-head h2{font-size:clamp(24px, 4vw, 32px);}
.chip-grid{display:flex; flex-wrap:wrap; gap:10px; margin-top:20px;}
.chip{
  font-family:'IBM Plex Mono', monospace;
  font-size:13px;
  font-weight:500;
  padding:8px 14px;
  border:1px solid var(--line);
  border-radius:2px;
  background:var(--surface);
}
.two-col{display:grid; grid-template-columns:1fr 1fr; gap:36px; margin-top:32px;}
@media (max-width:640px){ .two-col{grid-template-columns:1fr;} }
.cond-list{list-style:none; margin:14px 0 0; padding:0; display:flex; flex-direction:column; gap:10px;}
.cond-list li{display:flex; gap:10px; align-items:baseline; font-size:15px;}
.cond-list li::before{
  content:"";
  width:7px; height:7px;
  border-radius:50%;
  background:var(--accent);
  flex:none;
  transform:translateY(-2px);
}
.col-text{margin-top:14px; font-size:15px; color:var(--ink-muted);}
.tooling-note{
  background:var(--surface-alt);
  border:1px solid var(--line);
  border-radius:2px;
  padding:18px 20px;
  font-size:15px;
  margin-top:28px;
}
.tooling-note a{font-weight:600;}

/* ---------- How it works ---------- */
.manifest{counter-reset:step; display:flex; flex-direction:column; margin-top:24px;}
.step{
  counter-increment:step;
  display:grid;
  grid-template-columns:64px 1fr;
  gap:20px;
  padding-block:22px;
  border-top:1px solid var(--line);
}
.step::before{
  content:counter(step, decimal-leading-zero);
  font-family:'IBM Plex Mono', monospace;
  font-size:26px;
  font-weight:600;
  color:var(--accent);
}
.step-body h3{
  font-size:19px;
  text-transform:none;
  font-family:'IBM Plex Sans', sans-serif;
  font-weight:700;
  margin-bottom:6px;
}
.step-body p{margin:0; color:var(--ink-muted); font-size:15px; max-width:58ch;}

/* ---------- Why sell ---------- */
.feature-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
  margin-top:28px;
}
@media (max-width:640px){ .feature-grid{grid-template-columns:1fr;} }
.feature{background:var(--surface); padding:24px;}
.feature h3{
  font-size:16px;
  text-transform:none;
  font-family:'IBM Plex Sans', sans-serif;
  font-weight:700;
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:8px;
}
.feature svg{flex:none; color:var(--accent);}
.feature p{margin:0; color:var(--ink-muted); font-size:14.5px;}
.stat-bar{
  margin-top:1px;
  background:var(--primary);
  color:var(--primary-ink);
  padding:22px 24px;
  display:flex;
  align-items:baseline;
  gap:12px;
  flex-wrap:wrap;
}
.stat-bar .num{font-family:'Big Shoulders Display', sans-serif; font-weight:800; font-size:30px;}
.stat-bar .label{font-size:14px; opacity:0.9;}

/* ---------- Recent purchase ---------- */
.manifest-entry{
  border:1px solid var(--line);
  border-left:4px solid var(--accent);
  background:var(--surface);
  padding:22px 24px;
  margin-top:24px;
}
.manifest-entry .eyebrow{display:block; margin-bottom:10px;}
.manifest-entry p{margin:0; font-size:16px;}

/* ---------- FAQ ---------- */
.faq{margin-top:8px;}
details{border-top:1px solid var(--line); padding-block:16px;}
details:last-of-type{border-bottom:1px solid var(--line);}
summary{
  cursor:pointer;
  font-weight:600;
  font-size:16px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  list-style:none;
}
summary::-webkit-details-marker{display:none;}
summary .icon{flex:none; width:18px; height:18px; position:relative;}
summary .icon::before, summary .icon::after{
  content:"";
  position:absolute;
  background:var(--ink);
  transition:transform .15s ease;
}
summary .icon::before{width:100%; height:2px; top:50%; left:0; transform:translateY(-50%);}
summary .icon::after{width:2px; height:100%; left:50%; top:0; transform:translateX(-50%);}
details[open] summary .icon::after{transform:translateX(-50%) scaleY(0);}
details p{margin:10px 0 0; color:var(--ink-muted); font-size:15px; max-width:64ch;}

/* ---------- Contacts ---------- */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:28px;}
@media (max-width:640px){ .contact-grid{grid-template-columns:1fr;} }
.contact-card{border:1px solid var(--line); background:var(--surface); padding:24px;}
.contact-card .region{
  font-family:'IBM Plex Mono', monospace;
  font-size:12px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--ink-muted);
}
.contact-card .name{
  font-family:'Big Shoulders Display', sans-serif;
  font-weight:700;
  font-size:26px;
  margin-top:6px;
}
.contact-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid var(--line);
}
.contact-row .val{font-family:'IBM Plex Mono', monospace; font-size:14px; overflow-wrap:anywhere;}
.copy-btn{
  font-family:'IBM Plex Mono', monospace;
  font-size:12px;
  background:transparent;
  border:1px solid var(--line);
  color:var(--ink-muted);
  padding:6px 10px;
  border-radius:2px;
  cursor:pointer;
  flex:none;
}
.copy-btn:hover, .copy-btn:focus-visible{color:var(--ink); border-color:var(--ink);}
.copy-btn[data-copied="true"]{color:var(--tag-green); border-color:var(--tag-green);}
.contact-note{margin-top:18px; font-size:14px; color:var(--ink-muted);}

/* ---------- Form ---------- */
form.list-form{
  margin-top:28px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
@media (max-width:640px){ form.list-form{grid-template-columns:1fr;} }
.field{display:flex; flex-direction:column; gap:6px; min-width:0;}
.field.full{grid-column:1 / -1;}
label{font-size:13px; font-weight:600; color:var(--ink-muted);}
input, textarea{
  font-family:'IBM Plex Sans', sans-serif;
  font-size:15px;
  padding:11px 12px;
  border:1px solid var(--line);
  border-radius:2px;
  background:var(--surface);
  color:var(--ink);
  width:100%;
}
input::placeholder, textarea::placeholder{color:var(--ink-muted); opacity:0.7;}
textarea{resize:vertical; min-height:96px;}
.file-drop{
  border:1px dashed var(--line);
  border-radius:2px;
  padding:16px;
  font-size:14px;
  color:var(--ink-muted);
  background:var(--surface);
}
.file-drop input{border:none; padding:0; font-size:14px; background:transparent;}
.file-hint{font-size:12.5px; color:var(--ink-muted);}
.input-validation-error{border-color:var(--error);}
.field-validation-error{font-size:13px; color:var(--error);}
.field-validation-valid{display:none;}
.form-alert{
  grid-column:1 / -1;
  border:1px solid var(--error);
  color:var(--error);
  background:var(--surface);
  padding:14px 16px;
  font-size:14.5px;
}
.hp-field{position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden;}
.form-foot{
  grid-column:1 / -1;
  display:flex;
  flex-direction:column;
  gap:14px;
  margin-top:6px;
}
.form-foot .btn{align-self:flex-start;}
.reassurance{font-size:13.5px; color:var(--ink-muted); max-width:60ch; margin:0;}
#thankyou{
  border:1px solid var(--tag-green);
  background:var(--surface);
  padding:22px;
  margin-top:28px;
}
#thankyou .eyebrow{color:var(--tag-green);}
#thankyou p{margin:8px 0 0; font-size:15px;}

/* ---------- Footer ---------- */
footer{
  padding-block:40px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
  font-size:13.5px;
  color:var(--ink-muted);
}
@media (max-width:640px){ footer{grid-template-columns:1fr;} }
footer .entity-name{font-weight:700; color:var(--ink); display:block; margin-bottom:4px;}
footer .contact-line{margin-top:2px;}
.copyright{
  padding-top:24px;
  border-top:1px solid var(--line);
  font-size:12px;
  color:var(--ink-muted);
  text-align:center;
  grid-column:1 / -1;
}
