/* ============================================================
   AION-IA - Design System
   ============================================================ */

:root{
  --bg:#050505;
  --surface:#0b0b0b;
  --surface-2:#101010;
  --text:#f2f1ed;
  --muted:#94938c;
  --muted-2:#5f5e58;
  --line:#232320;
  --line-soft:#181816;
  --accent:#cdbf9a;
  --accent-dim:#8a806a;

  --font-head:'Fraunces', Georgia, serif;
  --font-body:'Manrope', -apple-system, sans-serif;
  --font-mono:'IBM Plex Mono', monospace;

  --space-1:.5rem; --space-2:1rem; --space-3:1.5rem; --space-4:2.5rem;
  --space-5:4rem; --space-6:6.5rem; --space-7:10rem;

  --ease:cubic-bezier(.16,.8,.24,1);
  --dur:.6s;

  --max:1180px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; background:var(--bg); }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:var(--font-body); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg,canvas,video{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; margin:0; padding:0; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
input,textarea{ font:inherit; color:inherit; }

h1,h2,h3,h4{ font-family:var(--font-head); font-weight:500; line-height:1.08; margin:0; letter-spacing:-.01em; }
h1{ font-size:clamp(2.6rem,6vw,5.4rem); font-weight:400; }
h2{ font-size:clamp(1.9rem,3.6vw,3.1rem); font-weight:400; }
h3{ font-size:clamp(1.3rem,2vw,1.7rem); font-weight:500; }
p{ margin:0; color:var(--muted); max-width:38em; }
.lede{ font-size:clamp(1.05rem,1.6vw,1.25rem); color:var(--text); max-width:32em; }

:focus-visible{ outline:1px solid var(--accent); outline-offset:4px; }

.wrap{ max-width:var(--max); margin:0 auto; padding:0 var(--space-3); }
@media (max-width:640px){ .wrap{ padding:0 var(--space-2); } }

.section{ position:relative; padding:var(--space-6) 0; border-top:1px solid var(--line-soft); }
.section:first-of-type{ border-top:0; }
.section-head{ display:flex; flex-direction:column; gap:var(--space-2); margin-bottom:var(--space-4); max-width:44em; }
.index{ font-family:var(--font-mono); font-size:.75rem; color:var(--accent-dim); letter-spacing:.08em; }

.rule{ height:1px; background:var(--line); border:0; margin:0; }

.btn{
  display:inline-flex; align-items:center; gap:.6em; padding:.85em 1.6em;
  border:1px solid var(--line); border-radius:2px; font-size:.92rem;
  transition:border-color .35s var(--ease), background .35s var(--ease), color .35s var(--ease);
}
.btn:hover{ border-color:var(--text); }
.btn-solid{ background:var(--text); color:var(--bg); border-color:var(--text); }
.btn-solid:hover{ background:var(--accent); border-color:var(--accent); }
.text-link{ position:relative; padding-bottom:2px; border-bottom:1px solid var(--line); transition:border-color .3s var(--ease); }
.text-link:hover{ border-color:var(--text); }

/* Header */
.brand{
  display:flex;
  align-items:center;
  gap:.65rem;
  font-family:var(--font-head);
  font-size:1.15rem;
  letter-spacing:.01em;
  color:#fff;
}

.brand-logo{
  width:32px;
  height:32px;
  object-fit:contain;
  flex-shrink:0;
}
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between;
  padding:1.4rem var(--space-3); mix-blend-mode:difference;
}
.brand{ font-family:var(--font-head); font-size:1.15rem; letter-spacing:.01em; color:#fff; }
.nav-toggle{ display:flex; align-items:center; gap:.6rem; font-family:var(--font-mono); font-size:.75rem; color:#fff; letter-spacing:.08em; }
.nav-toggle .lines{ width:22px; height:12px; position:relative; }
.nav-toggle .lines span{ position:absolute; left:0; width:100%; height:1px; background:#fff; transition:transform .3s var(--ease), opacity .3s var(--ease); }
.nav-toggle .lines span:first-child{ top:0; }
.nav-toggle .lines span:last-child{ bottom:0; }
.nav-open .nav-toggle .lines span:first-child{ transform:translateY(5.5px) rotate(45deg); }
.nav-open .nav-toggle .lines span:last-child{ transform:translateY(-5.5px) rotate(-45deg); }

.site-nav{
  position:fixed; inset:0; z-index:90; background:var(--bg);
  display:flex; align-items:flex-end; padding:5.5rem var(--space-3) var(--space-4);
  opacity:0; visibility:hidden; transition:opacity .5s var(--ease);
}
.nav-open .site-nav{ opacity:1; visibility:visible; }
.site-nav-grid{ display:grid; grid-template-columns:1.1fr 1fr; gap:var(--space-4); width:100%; max-width:var(--max); margin:0 auto; }
.site-nav a{
  display:block; font-family:var(--font-head); font-size:clamp(1.4rem,3vw,2.2rem);
  color:var(--muted); padding:.28em 0; transition:color .3s var(--ease);
  border-bottom:1px solid var(--line-soft);
}
.site-nav a:hover{ color:var(--text); }
.nav-col-label{ font-family:var(--font-mono); font-size:.72rem; color:var(--muted-2); letter-spacing:.08em; margin-bottom:1rem; }
@media (max-width:720px){ .site-nav-grid{ grid-template-columns:1fr; } .site-nav{ align-items:flex-start; padding-top:6.5rem; overflow-y:auto; } }

/* Footer */
.site-footer{ border-top:1px solid var(--line-soft); padding:var(--space-6) 0 var(--space-3); }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:var(--space-4); }
.footer-brand p{ margin-top:1rem; font-size:.92rem; }
.footer-col-label{ font-family:var(--font-mono); font-size:.72rem; color:var(--muted-2); letter-spacing:.08em; margin-bottom:1rem; }
.footer-col a{ display:block; color:var(--muted); font-size:.92rem; padding:.35em 0; transition:color .3s var(--ease); }
.footer-col a:hover{ color:var(--text); }
.footer-bottom{ display:flex; justify-content:space-between; align-items:center; margin-top:var(--space-5); padding-top:var(--space-3); border-top:1px solid var(--line-soft); font-size:.8rem; color:var(--muted-2); }
.footer-visual{ margin:var(--space-4) 0; opacity:.7; }
@media (max-width:820px){ .footer-grid{ grid-template-columns:1fr 1fr; row-gap:var(--space-4); } .footer-bottom{ flex-direction:column; gap:.8rem; align-items:flex-start; } }

/* Hero */
.hero{ min-height:100svh; display:flex; flex-direction:column; justify-content:flex-end; padding-bottom:var(--space-6); position:relative; }
.hero-canvas-wrap{ position:absolute; inset:0; z-index:0; }
.hero-content{ position:relative; z-index:1; }
.hero-eyebrow{ font-family:var(--font-mono); font-size:.78rem; color:var(--muted); letter-spacing:.08em; margin-bottom:1.4rem; }
.hero h1{ max-width:14em; }
.hero-sub{ margin-top:1.6rem; max-width:30em; }

/* Domains */
.domain{ position:relative; padding:var(--space-6) 0; overflow:hidden; }
.domain-canvas{ position:absolute; inset:0; opacity:.55; }
.domain-inner{ position:relative; z-index:1; display:grid; grid-template-columns:.9fr 1.1fr; gap:var(--space-5); align-items:start; }
.domain-num{ font-family:var(--font-mono); font-size:.8rem; color:var(--accent-dim); }
.domain h3{ margin-top:.6rem; }
@media (max-width:820px){ .domain-inner{ grid-template-columns:1fr; gap:var(--space-3); } }

/* Guardrail flow */
.flow{ display:flex; align-items:center; justify-content:space-between; gap:var(--space-1); margin:var(--space-4) 0; flex-wrap:wrap; }
.flow-node{ font-family:var(--font-mono); font-size:.78rem; color:var(--muted); border:1px solid var(--line); padding:.8em 1.2em; border-radius:2px; white-space:nowrap; }
.flow-node.is-core{ color:var(--text); border-color:var(--accent-dim); }
.flow-arrow{ color:var(--muted-2); font-size:.9rem; }
@media (max-width:720px){ .flow{ flex-direction:column; align-items:flex-start; } .flow-arrow{ transform:rotate(90deg); } }

.bench-placeholder{ border:1px dashed var(--line); padding:var(--space-4); text-align:center; color:var(--muted-2); font-family:var(--font-mono); font-size:.82rem; letter-spacing:.03em; }

/* Engines */
.engine-diagram{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-3); margin-top:var(--space-4); }
.engine-card{ border:1px solid var(--line); padding:var(--space-3); transition:border-color .3s var(--ease); }
.engine-card:hover{ border-color:var(--accent-dim); }
.engine-card .index{ display:block; margin-bottom:.8rem; }
.engine-core{ text-align:center; padding:var(--space-4) var(--space-3); border:1px solid var(--line-soft); margin-bottom:var(--space-3); }
.engine-core .font-mono-label{ font-family:var(--font-mono); font-size:.75rem; color:var(--muted); letter-spacing:.06em; }
@media (max-width:820px){ .engine-diagram{ grid-template-columns:1fr; } }

.two-col{ display:grid; grid-template-columns:1fr 1fr; gap:var(--space-4); }
@media (max-width:720px){ .two-col{ grid-template-columns:1fr; } }

.editorial-list{ border-top:1px solid var(--line); }
.editorial-row{ display:grid; grid-template-columns:4rem 1fr auto; gap:var(--space-3); align-items:baseline; padding:var(--space-3) 0; border-bottom:1px solid var(--line); }
.editorial-row .num{ font-family:var(--font-mono); color:var(--muted-2); font-size:.85rem; }
.editorial-row h3{ margin-bottom:.4rem; }
.editorial-row .meta{ font-family:var(--font-mono); font-size:.76rem; color:var(--muted-2); margin-top:.5rem; }
@media (max-width:720px){ .editorial-row{ grid-template-columns:1fr; gap:.6rem; } }

.product-row{ display:grid; grid-template-columns:.5fr 1.5fr; gap:var(--space-4); padding:var(--space-5) 0; border-bottom:1px solid var(--line); align-items:start; }
.product-row:first-child{ border-top:1px solid var(--line); }
.product-status{ display:inline-block; font-family:var(--font-mono); font-size:.72rem; color:var(--accent-dim); border:1px solid var(--line); padding:.35em .8em; margin-top:1rem; }
.product-tags{ margin-top:1.2rem; display:flex; gap:.6rem; flex-wrap:wrap; }
.product-tags span{ font-family:var(--font-mono); font-size:.72rem; color:var(--muted); }
@media (max-width:720px){ .product-row{ grid-template-columns:1fr; } }

.card-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:var(--space-3); margin-top:var(--space-3); }
.slot-card{ border:1px solid var(--line-soft); padding:var(--space-3); }
.slot-card .placeholder-badge{ font-family:var(--font-mono); font-size:.68rem; color:var(--muted-2); border:1px dashed var(--line); padding:.3em .6em; display:inline-block; margin-bottom:1rem; }

/* Forms */
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:var(--space-3) var(--space-3); margin-top:var(--space-4); }
.form-grid .full{ grid-column:1 / -1; }
.field{ display:flex; flex-direction:column; gap:.5rem; }
.field label{ font-family:var(--font-mono); font-size:.72rem; color:var(--muted); letter-spacing:.05em; }
.field input,.field textarea,.field select{
  background:transparent; border:0; border-bottom:1px solid var(--line); padding:.7em .1em;
  color:var(--text); transition:border-color .3s var(--ease);
}
.field input:focus,.field textarea:focus,.field select:focus{ border-color:var(--accent); outline:none; }
.field textarea{ resize:vertical; min-height:6em; }
.form-note{ margin-top:1rem; font-size:.82rem; color:var(--muted-2); }
.form-status{ margin-top:1rem; font-size:.88rem; }
@media (max-width:640px){ .form-grid{ grid-template-columns:1fr; } }

/* Modal */
.modal-overlay{ position:fixed; inset:0; background:rgba(5,5,5,.92); z-index:200; display:flex; align-items:center; justify-content:center; padding:var(--space-3); opacity:0; visibility:hidden; transition:opacity .4s var(--ease); }
.modal-overlay.is-open{ opacity:1; visibility:visible; }
.modal{ max-width:480px; width:100%; border:1px solid var(--line); background:var(--surface); padding:var(--space-4); }
.modal h3{ margin-bottom:.6rem; }
.modal p{ margin-bottom:var(--space-3); }
.modal .field{ margin-bottom:var(--space-3); }

/* IFrame page */
.iframe-page{ padding-top:0; }
.iframe-stage{ width:100%; height:100svh; border:0; display:block; }
.iframe-fallback{ display:none; padding:var(--space-6) var(--space-3); text-align:center; }
.iframe-fallback.show{ display:block; }
.iframe-fallback.show ~ iframe{ display:none; }

/* Reveal */
.reveal{ opacity:0; transform:translateY(18px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.is-visible{ opacity:1; transform:translateY(0); }

/* Access screen */
.gate{ min-height:100svh; display:flex; align-items:center; justify-content:center; padding:var(--space-3); }
.gate-inner{ max-width:460px; width:100%; }

.legal-body{ max-width:60em; }
.legal-body h3{ margin-top:var(--space-4); margin-bottom:.6rem; }
.legal-body p{ max-width:none; margin-bottom:1rem; }

/* ============================================================
   Academic collaboration logos
   ============================================================ */

.academic-logo-wrap{
  width:100%;
  min-height:120px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  margin-bottom:1.5rem;
  padding:1.25rem;
  border:1px solid var(--line);
  background:var(--surface);
}

.academic-logo{
  display:block;
  width:auto;
  max-width:220px;
  height:80px;
  object-fit:contain;
  object-position:left center;
}