:root{
  --obsidian:#0d0906; --glaze:#17110a; --glazeLo:#0d0906; --relief:#5c3a1e;
  --clay:#c56a33; --clayHi:#e0a163; --clayLo:#a9552a; --dilute:#7d4f28; --diluteLo:#5c3a1e;
  --oxblood:#a5382a; --oxbloodHi:#c24a30; --ivory:#ece0c6; --parchment:#cbbb9c; --dust:#9d7c54;
  --display:'Cinzel', 'Trajan Pro', Georgia, serif;
  --body:'Cormorant Garamond', Palatino, Georgia, serif;
  --code:'JetBrains Mono', 'Consolas', monospace;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--obsidian); color:var(--parchment); font-family:var(--body);
  font-size:19px; line-height:1.65; -webkit-font-smoothing:antialiased;
}
a{color:var(--clayHi); text-decoration:none;}
a:hover{text-decoration:underline; text-decoration-color:var(--dilute);}
.wrap{max-width:1080px; margin:0 auto; padding:0 28px;}

/* texture */
body::before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:5; opacity:.05;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.meander{
  height:16px; background-repeat:repeat-x; background-position:center; opacity:.75;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='16' viewBox='0 0 44 16'%3E%3Cg fill='none' stroke='%23c56a33' stroke-width='1.4'%3E%3Cpath d='M0 13 H44 M5 13 V4 H17 V10 H10 V7 M27 13 V4 H39 V10 H32 V7'/%3E%3C/g%3E%3C/svg%3E");
}
.meander.top{border-bottom:1px solid var(--relief);}
.meander.bottom{border-top:1px solid var(--relief);}

header{position:sticky; top:0; z-index:20; background:rgba(13,9,6,.92); backdrop-filter:blur(6px);}
nav.wrap{display:flex; align-items:center; justify-content:space-between; padding:16px 28px;}
.brand{display:flex; align-items:center; gap:12px; font-family:var(--display); letter-spacing:.14em; font-size:16px; color:var(--clayHi);}
.brand img{width:28px; height:28px; display:block;}
nav .links{display:flex; gap:26px; font-family:var(--display); font-size:11px; letter-spacing:.14em; text-transform:uppercase;}
nav .links a{color:var(--dust);}
nav .links a:hover, nav .links a.active{color:var(--clayHi);}

.nav-toggle{display:none; background:none; border:1px solid var(--diluteLo); color:var(--clayHi); width:38px; height:38px; cursor:pointer; font-size:16px;}
@media (max-width:640px){
  .nav-toggle{display:block;}
  nav .links{
    display:none; position:absolute; top:100%; left:0; right:0; flex-direction:column; gap:0;
    background:var(--glaze); border-top:1px solid var(--relief); border-bottom:1px solid var(--relief);
    padding:8px 0;
  }
  nav .links.open{display:flex;}
  nav .links a{padding:14px 28px; border-bottom:1px solid var(--diluteLo);}
  nav .links a:last-child{border-bottom:none;}
}

/* keyboard accessibility — every interactive element gets a visible ring */
a:focus-visible, button:focus-visible, summary:focus-visible, .agent:focus-visible{
  outline:2px solid var(--clayHi); outline-offset:3px;
}
.agent:focus-visible .face{opacity:0; transform:translateY(-6px);}
.agent:focus-visible .desc{opacity:1; transform:translateY(0);}

/* hero */
.hero{padding:96px 0 70px; text-align:center; position:relative;}
.hero.small{padding:64px 0 48px;}
.hero .crest{width:110px; height:110px; margin:0 auto 30px; opacity:.92; animation:breathe 5.5s ease-in-out infinite;}
.hero .crest.small{width:72px; height:72px;}
.hero .crest img{width:100%; height:100%; display:block; object-fit:contain;}
@keyframes breathe{0%,100%{opacity:.78; transform:scale(1);} 50%{opacity:1; transform:scale(1.035);}}
.eyebrow{font-family:var(--display); font-size:11px; letter-spacing:.32em; text-transform:uppercase; color:var(--dust); margin-bottom:18px;}
h1.wordmark{font-family:var(--display); font-weight:700; font-size:clamp(48px,8vw,88px); letter-spacing:.08em; margin:0; color:var(--ivory);
  text-shadow:0 0 40px rgba(197,106,51,.18);}
h1.wordmark.page{font-size:clamp(34px,5vw,52px);}
.hero .tagline{font-style:italic; font-size:24px; color:var(--parchment); max-width:640px; margin:22px auto 8px;}
.hero .sub{font-size:19px; color:var(--dust); max-width:620px; margin:0 auto 38px;}
.cta-row{display:flex; gap:16px; justify-content:center; flex-wrap:wrap; margin-bottom:34px;}
.btn{font-family:var(--display); font-size:12px; letter-spacing:.14em; text-transform:uppercase; padding:15px 28px;
  border:1px solid var(--dilute); cursor:pointer; transition:.15s; display:inline-block;}
.btn.primary{background:linear-gradient(180deg, var(--clay), var(--clayLo)); color:#1b1006; border-color:var(--clay);}
.btn.primary:hover{filter:brightness(1.1); text-decoration:none;}
.btn.ghost{background:transparent; color:var(--clayHi);}
.btn.ghost:hover{background:var(--glaze); text-decoration:none;}
.install{display:inline-flex; align-items:center; gap:12px; font-family:var(--code); font-size:14px; color:var(--parchment);
  background:var(--glaze); border:1px solid var(--diluteLo); padding:13px 20px; margin-bottom:38px; cursor:pointer;}
.install:hover{border-color:var(--dilute);}
.install .copy{color:var(--dust); font-size:11px; letter-spacing:.08em;}

.stats{display:flex; justify-content:center; gap:0; flex-wrap:wrap; border-top:1px solid var(--relief); border-bottom:1px solid var(--relief); padding:26px 0;}
.stat{padding:0 34px; text-align:center; border-right:1px solid var(--relief);}
.stat:last-child{border-right:none;}
.stat .n{font-family:var(--display); font-size:26px; color:var(--clayHi);}
.stat .l{font-family:var(--display); font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--dust); margin-top:6px;}

/* sections */
section.num{padding:86px 0;}
section.num.alt{background:var(--glaze);}
section.num.tight{padding:56px 0;}
.num-head{display:flex; align-items:baseline; gap:18px; margin-bottom:14px;}
.num-head .idx{font-family:var(--display); font-size:14px; color:var(--dilute); letter-spacing:.1em;}
.num-head .kicker{font-family:var(--display); font-size:11px; letter-spacing:.24em; text-transform:uppercase; color:var(--dust);}
h2{font-family:var(--display); font-weight:600; font-size:clamp(28px,4vw,38px); color:var(--ivory); margin:0 0 20px; line-height:1.25;}
.lede{font-size:20px; color:var(--parchment); max-width:640px; margin-bottom:38px;}
.lede i{color:var(--clayHi); font-style:italic;}

/* terminal */
.terminal{background:#0a0704; border:1px solid var(--diluteLo); font-family:var(--code); font-size:13.5px; overflow-x:auto;}
.terminal .bar{display:flex; gap:7px; padding:11px 16px; border-bottom:1px solid var(--diluteLo); background:var(--glaze);}
.terminal .bar span{width:9px; height:9px; border-radius:50%; background:var(--diluteLo);}
.terminal pre{margin:0; padding:22px 26px; color:var(--parchment); white-space:pre-wrap; line-height:1.7;}
.terminal .ok{color:var(--clayHi);}
.terminal .crit{color:var(--oxbloodHi);}
.terminal .dim{color:var(--dust);}

/* two-phase */
.phase-grid{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--relief); border:1px solid var(--relief);}
.phase{background:var(--obsidian); padding:32px;}
.phase .ph-n{font-family:var(--display); font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--dust); margin-bottom:10px;}
.phase h3{font-family:var(--display); font-size:20px; color:var(--clayHi); margin:0 0 12px;}
.phase p{font-size:17px; color:var(--parchment); margin:0;}

/* eye grid — the swarm */
.swarm{display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:2px; background:var(--relief); border:1px solid var(--relief);}
.agent{background:var(--glaze); position:relative; cursor:default; height:152px; overflow:hidden;}
.agent .face, .agent .desc{
  position:absolute; inset:0; padding:20px 18px; display:flex; flex-direction:column;
  transition:opacity .22s ease, transform .22s ease;
}
.agent .face{justify-content:flex-start;}
.agent .face svg{display:block; margin-bottom:12px;}
.agent .name{font-family:var(--display); font-size:11.5px; letter-spacing:.06em; color:var(--clayHi);}
.agent .desc{
  justify-content:center; font-size:13.5px; color:var(--parchment); line-height:1.45;
  background:var(--ember,#221a10); opacity:0; transform:translateY(6px); pointer-events:none;
  border-top:1px solid var(--dilute);
}
.agent:hover .face{opacity:0; transform:translateY(-6px);}
.agent:hover .desc{opacity:1; transform:translateY(0);}

/* benchmark scoreboard */
.bench{display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:1px; background:var(--relief); border:1px solid var(--relief); margin-bottom:26px;}
.bcell{background:var(--obsidian); padding:26px 20px; text-align:center;}
.bcell .pct{font-family:var(--display); font-size:34px; color:var(--clayHi);}
.bcell .target{font-family:var(--code); font-size:12px; color:var(--dust); margin-top:8px;}
.honest{font-size:16.5px; color:var(--dust); font-style:italic; max-width:680px;}

/* meets-you-grid */
.meet{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1px; background:var(--relief); border:1px solid var(--relief);}
.meet div{background:var(--glaze); padding:26px 24px;}
.meet h4{font-family:var(--display); font-size:14px; letter-spacing:.05em; color:var(--clayHi); margin:0 0 8px;}
.meet p{font-size:15.5px; color:var(--dust); margin:0;}
.meet code{font-family:var(--code); font-size:12px; color:var(--parchment); background:var(--ember,#221a10); padding:2px 6px;}

/* comparison table */
table.cmp{width:100%; border-collapse:collapse; font-size:15.5px;}
table.cmp th, table.cmp td{border:1px solid var(--relief); padding:12px 14px; text-align:center;}
table.cmp th{font-family:var(--display); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--dust); font-weight:500;}
table.cmp td:first-child, table.cmp th:first-child{text-align:left; font-family:var(--display); font-size:13px; color:var(--parchment);}
table.cmp tr.us td{color:var(--clayHi); font-weight:600; background:rgba(197,106,51,.06);}
table.cmp tr.us td:first-child{color:var(--clayHi);}

/* download */
.os-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; margin-bottom:30px;}
.os-card{border:1px solid var(--diluteLo); padding:26px 24px; background:var(--glaze); position:relative;}
.os-card.recommended{border-color:var(--clay); background:linear-gradient(180deg, rgba(197,106,51,.08), var(--glaze));}
.os-card h4{font-family:var(--display); font-size:15px; color:var(--clayHi); margin:0 0 6px;}
.os-card p{font-size:14.5px; color:var(--dust); margin:0 0 16px;}
.os-card a{font-family:var(--display); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--ivory);}
.os-badge{display:block; font-family:var(--display); font-size:9.5px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--clayHi); margin-bottom:10px;}
.os-badge::before{content:"◆ "; color:var(--oxbloodHi);}

/* faq */
details{border-bottom:1px solid var(--relief); padding:20px 0;}
details summary{font-family:var(--display); font-size:16px; color:var(--parchment); cursor:pointer; list-style:none;}
details summary::-webkit-details-marker{display:none;}
details summary::before{content:"◇ "; color:var(--clay);}
details[open] summary::before{content:"◆ "; color:var(--oxbloodHi);}
details p{font-size:16.5px; color:var(--dust); margin:14px 0 0 20px;}

/* docs page */
.docs-nav{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:44px;}
.docs-nav a{font-family:var(--display); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--dust);
  border:1px solid var(--diluteLo); padding:8px 16px;}
.docs-nav a:hover{color:var(--clayHi); border-color:var(--dilute); text-decoration:none;}
.doc-block{margin-bottom:56px;}
.doc-block h3{font-family:var(--display); font-size:15px; letter-spacing:.06em; color:var(--clayHi); text-transform:uppercase; margin:0 0 14px;
  padding-bottom:10px; border-bottom:1px solid var(--relief);}
.doc-block p{font-size:17.5px; color:var(--parchment); margin:0 0 14px;}
.doc-block code{font-family:var(--code); font-size:14px; color:var(--clayHi); background:var(--glaze); padding:2px 7px;}
.doc-block pre{background:#0a0704; border:1px solid var(--diluteLo); padding:18px 22px; overflow-x:auto; margin:0 0 14px;}
.doc-block pre code{background:none; padding:0; color:var(--parchment); font-size:14px;}

/* changelog page */
.rel-entry{margin-bottom:56px; padding-bottom:44px; border-bottom:1px solid var(--relief);}
.rel-entry:last-child{border-bottom:none;}
.rel-entry h3{font-family:var(--display); font-size:20px; color:var(--clayHi); margin:0 0 4px;}
.rel-entry .date{font-family:var(--code); font-size:12.5px; color:var(--dust); margin-bottom:20px; display:block;}
.rel-entry h4{font-family:var(--display); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--dust); margin:22px 0 10px;}
.rel-entry ul{margin:0; padding-left:22px;}
.rel-entry li{font-size:16.5px; color:var(--parchment); margin-bottom:10px; line-height:1.55;}
.rel-entry li b{color:var(--clayHi); font-weight:600;}
.rel-entry code{font-family:var(--code); font-size:13px; color:var(--clayHi); background:var(--glaze); padding:1px 6px;}

footer{padding:60px 0 48px; text-align:center;}
footer .motto{font-family:var(--display); font-style:normal; font-size:13px; letter-spacing:.18em; text-transform:uppercase; color:var(--dust); margin-bottom:18px;}
footer .flinks{display:flex; gap:22px; justify-content:center; font-family:var(--display); font-size:11px; letter-spacing:.1em; text-transform:uppercase; margin-bottom:20px;}
footer .flinks a{color:var(--dust);}
footer .flinks a:hover{color:var(--clayHi);}
footer .legal{font-size:13px; color:var(--relief);}

@media (max-width:720px){
  .phase-grid{grid-template-columns:1fr;}
}
