/* Vintrixo — Candidate A "Signal": dark industrial precision.
   Archivo (display) · Hanken Grotesk (body) · JetBrains Mono (data labels). Graphite + signal amber. */

@font-face { font-family:"Archivo"; src:url("assets/fonts/archivo-wght.woff2") format("woff2");
  font-weight:100 900; font-display:swap; }
@font-face { font-family:"Hanken"; src:url("assets/fonts/hanken-grotesk-400.woff2") format("woff2");
  font-weight:400; font-display:swap; }
@font-face { font-family:"Hanken"; src:url("assets/fonts/hanken-grotesk-500.woff2") format("woff2");
  font-weight:500; font-display:swap; }
@font-face { font-family:"Hanken"; src:url("assets/fonts/hanken-grotesk-600.woff2") format("woff2");
  font-weight:600; font-display:swap; }
@font-face { font-family:"JBMono"; src:url("assets/fonts/jetbrains-mono-400.woff2") format("woff2");
  font-weight:400; font-display:swap; }
@font-face { font-family:"JBMono"; src:url("assets/fonts/jetbrains-mono-500.woff2") format("woff2");
  font-weight:500; font-display:swap; }

:root{
  --bg:#0d1013; --panel:#12181e; --panel-2:#161d24; --line:#2a333c;
  --ink:#eef2f5; --body:#c4cdd5; --muted:#99a4ae;
  --amber:#ff7a18; --amber-ink:#ff9040;
  --display:"Archivo",system-ui,sans-serif; --font:"Hanken",system-ui,sans-serif; --mono:"JBMono",ui-monospace,monospace;
  --step--1:clamp(.82rem,.79rem + .15vw,.9rem);
  --step-0:clamp(1rem,.95rem + .25vw,1.12rem);
  --step-1:clamp(1.2rem,1.1rem + .5vw,1.45rem);
  --step-2:clamp(1.6rem,1.4rem + .9vw,2.15rem);
  --wrap:74rem;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--body);
  font-family:var(--font); font-size:var(--step-0); line-height:1.62;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
h1,h2,h3{ font-family:var(--display); color:var(--ink); line-height:1.05;
  letter-spacing:-.03em; text-wrap:balance; margin:0; }
p{ margin:0; text-wrap:pretty }
a{ color:var(--amber-ink) }
img,svg{ max-width:100%; height:auto; display:block }
:focus-visible{ outline:2px solid var(--amber); outline-offset:3px; border-radius:3px }

.wrap{ width:min(100% - 2.4rem, var(--wrap)); margin-inline:auto }
.skip{ position:absolute; left:-9999px; top:0; background:var(--amber); color:#0d1013;
  padding:.6rem 1rem; font-weight:600; z-index:20 }
.skip:focus{ left:1rem; top:1rem }
.pending{ color:var(--amber-ink); font-weight:600; font-family:var(--mono); font-size:.86em }

/* buttons */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  background:var(--amber); color:#0d1013; font-family:var(--font); font-weight:600;
  font-size:var(--step--1); text-decoration:none; padding:.62rem 1.05rem; border-radius:9px;
  border:1px solid transparent; cursor:pointer; transition:transform .12s ease, filter .12s ease; }
.btn:hover{ filter:brightness(1.06); transform:translateY(-1px) }
.btn--lg{ padding:.85rem 1.4rem; font-size:var(--step-0) }
.btn--ghost{ background:transparent; color:var(--ink); border-color:var(--line) }
.btn--ghost:hover{ border-color:#47535e; filter:none }

/* nav */
.nav{ position:sticky; top:0; z-index:10; background:rgba(13,16,19,.82);
  backdrop-filter:saturate(1.1) blur(8px); border-bottom:1px solid transparent; transition:border-color .2s, background .2s }
.nav.scrolled{ border-bottom-color:var(--line) }
.nav__inner{ display:flex; align-items:center; justify-content:space-between; min-height:64px; gap:1rem }
.nav__brand{ display:inline-flex; align-items:center; gap:.55rem; color:var(--ink);
  text-decoration:none; font-family:var(--display); font-weight:700; letter-spacing:-.02em; font-size:1.12rem }
.nav__links{ display:flex; align-items:center; gap:1.5rem }
.nav__links a:not(.btn){ color:var(--body); text-decoration:none; font-weight:500; font-size:var(--step--1) }
.nav__links a:not(.btn):hover{ color:var(--ink) }

/* hero */
.hero{ padding:clamp(2.6rem,1.5rem + 5vw,5rem) 0 clamp(2.4rem,1.5rem + 4vw,4.2rem) }
.hero__inner{ display:grid; grid-template-columns:1fr; gap:clamp(2rem,1rem + 4vw,3.4rem); align-items:center }
.chip{ display:inline-block; font-family:var(--mono); font-size:var(--step--1); color:var(--amber-ink);
  border:1px solid var(--line); border-radius:100px; padding:.28rem .8rem; margin:0 0 1.3rem }
.hero h1{ font-size:clamp(2.35rem,1.6rem + 3.6vw,4.4rem); font-weight:800; max-width:16ch }
.hero .hl{ color:var(--amber) }
.hero__sub{ margin-top:1.35rem; max-width:56ch; color:var(--body); font-size:var(--step-1); line-height:1.55 }
.hero__cta{ margin-top:1.9rem; display:flex; flex-wrap:wrap; gap:.8rem }
.hero__meta{ margin-top:1.5rem; font-family:var(--mono); color:var(--muted); font-size:var(--step--1) }
.hero__art{ justify-self:center }
.hero__art svg{ filter:drop-shadow(0 20px 40px rgba(0,0,0,.4)) }

/* section scaffolding */
section{ scroll-margin-top:80px }
.platform,.eco,.sectors,.contact{ padding:clamp(3rem,2rem + 4vw,5rem) 0; border-top:1px solid var(--line) }
.section-title{ font-size:var(--step-2); font-weight:700 }
.section-lede{ margin-top:.9rem; max-width:60ch; color:var(--body); font-size:var(--step-1) }

/* capabilities */
.cap{ margin:2.2rem 0 0; display:grid; gap:0 }
.cap__item{ display:grid; grid-template-columns:1fr; gap:.5rem; padding:1.5rem 0; border-top:1px solid var(--line) }
.cap__item:last-child{ border-bottom:1px solid var(--line) }
.cap dt{ font-family:var(--display); font-weight:700; color:var(--ink); font-size:var(--step-1);
  letter-spacing:-.02em; display:flex; align-items:baseline; gap:.85rem; flex-wrap:wrap }
.cap__tag{ font-family:var(--mono); font-weight:500; font-size:.72rem; letter-spacing:.06em;
  color:var(--amber-ink); border:1px solid var(--line); border-radius:6px; padding:.16rem .5rem;
  text-transform:uppercase }
.cap dd{ margin:0; max-width:70ch; color:var(--body) }

/* ecosystem */
.eco__grid{ display:grid; grid-template-columns:1fr; gap:clamp(1.8rem,1rem + 3vw,3rem); align-items:start }
.eco__copy p{ margin-top:1rem; max-width:60ch }
.eco__list{ list-style:none; margin:1.6rem 0 0; padding:0; display:grid; gap:.9rem }
.eco__list li{ position:relative; padding-left:1.5rem; color:var(--body); max-width:62ch }
.eco__list li::before{ content:""; position:absolute; left:0; top:.62em; width:8px; height:8px;
  background:var(--amber); border-radius:2px; transform:rotate(45deg) }
.eco__list b{ color:var(--ink); font-weight:600 }
.eco__note{ margin-top:1.5rem }
.eco__diagram{ justify-self:center; position:sticky; top:84px }
.d-label{ fill:var(--muted); font-family:var(--mono); font-size:11px; letter-spacing:.14em }
.d-t{ fill:var(--ink); font-family:var(--display); font-weight:700; font-size:14px }
.d-s{ fill:var(--muted); font-family:var(--mono); font-size:11px }
.d-hot{ fill:var(--amber-ink) }

/* sectors */
.sectors__grid{ list-style:none; margin:2rem 0 0; padding:0; display:grid; grid-template-columns:1fr; gap:1rem }
.sectors__grid li{ background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:1.4rem 1.4rem 1.5rem }
.sectors__grid h3{ font-size:var(--step-1); font-weight:700; color:var(--ink) }
.sectors__grid p{ margin-top:.55rem; color:var(--body); max-width:44ch }

/* contact */
.contact__grid{ display:grid; grid-template-columns:1fr; gap:clamp(1.8rem,1rem + 3vw,3rem) }
.contact__lede{ margin-top:1rem; max-width:48ch; color:var(--body); font-size:var(--step-1) }
.contact__list{ list-style:none; margin:1.6rem 0 0; padding:0; display:grid; gap:.7rem }
.contact__list li{ display:grid; grid-template-columns:5rem 1fr; gap:.6rem; align-items:baseline;
  border-top:1px solid var(--line); padding-top:.7rem; color:var(--body) }
.contact__list span{ font-family:var(--mono); font-size:var(--step--1); color:var(--muted); text-transform:uppercase; letter-spacing:.05em }
.contact__list a{ color:var(--amber-ink); text-decoration:none }
.contact__list a:hover{ text-decoration:underline }
.contact__fine{ margin-top:1.4rem; font-size:var(--step--1) }
.form{ background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:clamp(1.3rem,1rem + 1.5vw,1.9rem) }
.field{ margin-bottom:1rem; display:grid; gap:.4rem }
.field label{ font-weight:600; font-size:var(--step--1); color:var(--ink) }
.field input,.field textarea{ font-family:var(--font); font-size:var(--step-0); color:var(--ink);
  background:#0f151a; border:1px solid var(--line); border-radius:9px; padding:.7rem .8rem; width:100%; resize:vertical }
.field input:focus,.field textarea:focus{ outline:none; border-color:var(--amber); box-shadow:0 0 0 3px rgba(255,122,24,.18) }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden }
.form__status{ margin:.9rem 0 0; font-weight:600; font-size:var(--step--1); min-height:1.2em }
.form__status.ok{ color:#4ade80 }
.form__status.err{ color:#ff8a8a }

/* footer */
.foot{ border-top:1px solid var(--line); padding:2.6rem 0; background:#0b0e11 }
.foot__inner{ display:grid; grid-template-columns:1fr; gap:1.4rem }
.foot__tag{ margin-top:.7rem; color:var(--muted); max-width:38ch }
.foot__links{ display:flex; flex-wrap:wrap; gap:1.1rem }
.foot__links a{ color:var(--body); text-decoration:none; font-size:var(--step--1); font-weight:500 }
.foot__links a:hover{ color:var(--ink) }
.foot__legal{ color:var(--muted); font-size:var(--step--1) }

/* legal / 404 docs */
.doc{ padding:clamp(2.4rem,1.5rem + 4vw,4rem) 0 }
.doc--center{ text-align:center }
.prose{ max-width:64ch }
.doc__kicker{ font-family:var(--mono); font-size:var(--step--1); color:var(--amber-ink);
  text-transform:uppercase; letter-spacing:.1em; margin:0 0 .6rem }
.doc h1{ font-size:var(--step-2); font-weight:800 }
.doc__lede{ margin:1rem 0 0; color:var(--body); font-size:var(--step-1); max-width:60ch }
.doc h2{ font-size:var(--step-1); font-weight:700; margin:2rem 0 .5rem }
.doc p{ margin:.6rem 0 0; color:var(--body) }
.doc a{ color:var(--amber-ink) }
.doc__updated{ margin-top:2rem; color:var(--muted); font-size:var(--step--1) }
.doc--center .btn{ margin-top:1.6rem }

/* responsive */
@media (max-width:640px){
  .nav__links a:not(.btn){ display:none }
}
@media (min-width:760px){
  .hero__inner{ grid-template-columns:1.15fr .85fr }
  .cap__item{ grid-template-columns:1fr; gap:.6rem }
  .eco__grid{ grid-template-columns:1.1fr .9fr }
  .sectors__grid{ grid-template-columns:repeat(3,1fr) }
  .contact__grid{ grid-template-columns:.9fr 1.1fr; align-items:start }
  .foot__inner{ grid-template-columns:1.3fr 1fr; align-items:start }
  .foot__legal{ grid-column:1 / -1 }
}
@media (min-width:760px){
  .cap dt{ font-size:var(--step-2) }
}

@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; scroll-behavior:auto !important }
  .btn:hover{ transform:none }
}