/* website.css — Co-Intelligent homepage (7.7). Tension model:
   bold plainspoken hero + commercial moments; editorial-calm long-form. */

:root{
  --paper:#F6F0E4; --paper-soft:#EEE7D7; --paper-warm:#FAF5EC;
  --ink:#1E1A14; --ink-soft:#2A241C; --terra:#C2682E; --terra-deep:#A4521F;
  --stone:#9B8B76; --stone-soft:#C2B6A2; --sand:#E2D7C2; --white:#fff;
  --news:'Newsreader',serif; --plex:'IBM Plex Sans',system-ui,sans-serif; --mono:'IBM Plex Mono',monospace;
  --maxw:1080px; --pad:clamp(24px,6vw,96px);
  /* density — locked from the Tweaks studio (Balanced baseline) */
  --type-scale:0.94; --rhythm:1.12; --head-gap:22px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--plex);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
::selection{background:var(--terra);color:var(--paper);}
a{color:inherit;text-decoration:none;}

/* ---- type helpers ---- */
.mono{font-family:var(--mono);}
.kicker{font-family:var(--mono);font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--stone);}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;}

/* ---- loader (ll assembling) ---- */
#loader{position:fixed;inset:0;background:var(--ink);z-index:1000;display:flex;align-items:center;justify-content:center;transition:opacity .6s ease,visibility .6s;}
#loader.done{opacity:0;visibility:hidden;}
#loader .halves{display:flex;align-items:center;gap:10px;}
#loader .half{display:block;}
#loader .half.right{transform:rotate(180deg);opacity:0;transform-origin:center;animation:assemble 1s cubic-bezier(.7,0,.2,1) .25s forwards;}
#loader .half.left{opacity:0;animation:fadein .5s ease .15s forwards;}
@keyframes assemble{0%{transform:rotate(180deg);opacity:0;}100%{transform:rotate(0deg);opacity:1;}}
@keyframes fadein{to{opacity:1;}}

/* ---- nav ---- */
nav{position:fixed;top:0;left:0;right:0;z-index:200;display:flex;align-items:center;justify-content:space-between;
  padding:20px var(--pad);transition:background .35s ease,padding .35s ease,box-shadow .35s;}
nav.scrolled{background:rgba(246,240,228,.88);backdrop-filter:blur(12px);padding:14px var(--pad);box-shadow:0 1px 0 rgba(30,26,20,.08);}
nav.on-dark:not(.scrolled){--navfg:var(--paper);}
nav .brand{display:flex;align-items:center;line-height:0;}
nav .brand svg{height:26px;width:auto;display:block;}
nav .links{display:flex;align-items:center;gap:34px;}
nav .links a{font-size:14px;letter-spacing:-.01em;color:var(--navfg,var(--ink));opacity:.78;transition:opacity .2s;}
nav .links a:hover{opacity:1;}
nav .links a.nav-cta{opacity:1;font-family:var(--plex);font-weight:500;background:var(--terra);color:var(--paper);
  padding:11px 18px;border-radius:2px;transition:background .2s,transform .12s;}
nav .links a.nav-cta:hover{background:var(--terra-deep);}
nav .links a.nav-cta:active{transform:translateY(1px);}
/* subtle CTA reminder — a quiet amber bloom every ~13s, never bouncy */
@keyframes ctaPulse{0%,82%,100%{box-shadow:0 0 0 0 rgba(194,104,46,0);}88%{box-shadow:0 0 0 5px rgba(194,104,46,.16),0 0 22px 3px rgba(194,104,46,.42);}94%{box-shadow:0 0 0 13px rgba(194,104,46,0),0 0 32px 7px rgba(194,104,46,0);}}
nav .links a.nav-cta{animation:ctaPulse 13s ease-in-out 4s infinite;}
@media(max-width:760px){nav .links a:not(.nav-cta){display:none;}}

/* ---- section base ---- */
section{padding:calc(clamp(80px,12vh,160px) * var(--rhythm)) var(--pad);position:relative;}
.wrap{max-width:var(--maxw);margin:0 auto;width:100%;}
.sec-ink{background:var(--ink);color:var(--paper);}
.sec-soft{background:var(--paper-soft);}
.sec-amber{background:var(--terra);color:var(--ink);}
.sec-num{font-family:var(--mono);font-size:15px;letter-spacing:.18em;text-transform:uppercase;color:var(--stone);margin-bottom:34px;display:flex;gap:12px;align-items:center;font-weight:500;}
.sec-ink .sec-num,.sec-amber .sec-num{color:rgba(255,255,255,.55);}
.sec-amber .sec-num{color:rgba(30,26,20,.55);}
.sec-num::before{content:"";width:30px;height:1px;background:currentColor;opacity:.6;}

/* ---- hero ---- */
#hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;background:var(--ink);color:var(--paper);
  padding-top:140px;padding-bottom:90px;}
#hero .h1{font-family:var(--plex);font-weight:500;font-size:calc(clamp(44px,8.2vw,128px) * var(--type-scale));line-height:1.0;letter-spacing:-.045em;margin:0;}
#hero .h1 .l2{display:block;margin-top:.04em;}
#hero .twist{font-family:var(--news);font-style:italic;font-weight:500;letter-spacing:-.02em;}
/* the correction swap — words stacked so the hidden one never forces a 3rd line */
.swap{position:relative;display:inline-block;white-space:nowrap;}
.swap .wrong{position:relative;color:var(--stone-soft);transition:opacity .45s ease;}
.swap .wrong .strike{position:absolute;left:-.04em;right:-.04em;top:.54em;height:.07em;background:var(--terra);transform:scaleX(0);transform-origin:left;}
.swap.struck .wrong .strike{transform:scaleX(1);transition:transform .42s cubic-bezier(.7,0,.2,1);}
.swap.corrected .wrong{opacity:0;}
.swap .right{position:absolute;left:0;top:0;color:var(--terra);opacity:0;transition:opacity .5s ease .15s;white-space:nowrap;}
.swap.corrected .right{opacity:1;}
.swap .right.news{font-family:var(--news);font-style:italic;font-weight:500;}

#hero .subline{font-family:var(--plex);font-size:calc(clamp(16px,1.5vw,20px) * var(--type-scale));line-height:1.6;color:var(--stone-soft);max-width:48ch;margin:38px 0 0;}
#hero .cta-row{margin-top:44px;display:flex;flex-direction:column;gap:14px;align-items:flex-start;}

/* ---- buttons ---- */
.btn{font-family:var(--plex);font-weight:500;font-size:16px;letter-spacing:-.01em;background:var(--terra);color:var(--paper);
  border:0;padding:17px 28px;border-radius:2px;cursor:pointer;display:inline-flex;align-items:center;gap:12px;
  transition:background .2s,transform .12s;}
.btn:hover{background:var(--terra-deep);}
.btn:active{transform:translateY(1px);}
.btn .arr{transition:transform .2s;}
.btn:hover .arr{transform:translateX(4px);}
.btn-note{font-family:var(--mono);font-size:13px;letter-spacing:.04em;color:var(--stone);}
.sec-ink .btn-note{color:var(--stone-soft);}

/* ---- big editorial statement ---- */
.statement{font-family:var(--news);font-weight:400;font-size:calc(clamp(30px,4.6vw,62px) * var(--type-scale));line-height:1.1;letter-spacing:-.018em;margin:0 0 var(--head-gap);max-width:18ch;}
.statement em{font-style:italic;color:var(--terra);}
.sec-ink .statement em{color:var(--terra);}
.lede{font-family:var(--plex);font-size:calc(clamp(16px,1.45vw,19px) * var(--type-scale));line-height:1.62;color:var(--ink-soft);max-width:60ch;}
.sec-ink .lede{color:var(--stone-soft);}
.body-col{font-family:var(--plex);font-size:calc(17px * var(--type-scale));line-height:1.66;color:var(--ink-soft);}
.sec-ink .body-col{color:var(--stone-soft);}
.body-col p{margin:0 0 18px;}

.two-col{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,90px);align-items:start;}
@media(max-width:820px){.two-col{grid-template-columns:1fr;gap:32px;}}

/* "we do not" lines */
.not-list{list-style:none;padding:0;margin:26px 0 0;display:flex;flex-direction:column;gap:14px;}
.not-list li{font-family:var(--plex);font-size:calc(19px * var(--type-scale));line-height:1.4;color:var(--ink);display:flex;gap:14px;align-items:baseline;}
.not-list li .x{font-family:var(--mono);color:var(--terra);font-size:15px;flex:0 0 auto;}
.not-list li .t{text-decoration:line-through;text-decoration-color:var(--stone-soft);text-decoration-thickness:2px;color:var(--stone);}

/* ---- revenue metrics row ---- */
.metrics{display:flex;flex-wrap:wrap;gap:14px;margin-top:40px;}
.metrics .m{font-family:var(--mono);font-size:14px;letter-spacing:.04em;text-transform:uppercase;color:var(--paper);
  border:1px solid rgba(255,255,255,.22);padding:12px 18px;border-radius:2px;}
.revtag{font-family:var(--news);font-style:italic;font-size:clamp(22px,2.4vw,30px);color:var(--terra);margin-top:42px;}

/* ---- 4D framework ---- */
.fourd{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:56px;background:var(--sand);border:1px solid var(--sand);}
@media(max-width:880px){.fourd{grid-template-columns:1fr 1fr;}}
@media(max-width:520px){.fourd{grid-template-columns:1fr;}}
.fourd .d{background:var(--paper);padding:34px 30px 40px;display:flex;flex-direction:column;gap:14px;min-height:240px;transition:background .3s;}
.fourd .d:hover{background:var(--terra);}
.fourd .d h4.dh{font-family:var(--news);font-weight:400;font-size:calc(32px * var(--type-scale));letter-spacing:-.01em;margin:0;color:var(--terra);display:flex;gap:14px;align-items:baseline;}
.fourd .d h4.dh .dnum{font-family:var(--news);font-style:italic;font-size:24px;color:var(--terra);}
.fourd .d p{font-family:var(--plex);font-size:15px;line-height:1.55;color:var(--ink-soft);margin:0;}
.fourd .d:hover h4.dh,.fourd .d:hover h4.dh .dnum,.fourd .d:hover p{color:var(--paper);}
.fourd-foot{font-family:var(--plex);font-size:16px;line-height:1.6;color:var(--ink-soft);margin-top:30px;max-width:62ch;}
.fourd-foot b{color:var(--ink);font-weight:500;}

/* ---- audit callout ---- */
.audit{background:var(--paper-warm);border:1px solid var(--sand);border-radius:4px;padding:clamp(28px,4vw,48px);margin-top:8px;}
.audit .lab{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--terra);margin-bottom:18px;}

/* ---- founders ---- */
.founder{display:grid;grid-template-columns:300px 1fr;gap:clamp(30px,5vw,72px);align-items:start;}
.founder + .founder{margin-top:clamp(56px,8vh,110px);}
@media(max-width:820px){.founder{grid-template-columns:1fr;}}
.founder .portrait{width:100%;aspect-ratio:4/5;background:var(--paper-soft);overflow:hidden;border-radius:3px;}
.founder image-slot{display:block;width:100%;height:100%;}
.founder .quote{font-family:var(--news);font-weight:400;font-size:calc(clamp(22px,2.5vw,32px) * var(--type-scale));line-height:1.28;letter-spacing:-.012em;margin:0 0 22px;}
.founder .quote em{font-style:italic;color:var(--terra);}
.founder .who{font-family:var(--mono);font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--stone);margin-top:8px;}
.founder .who b{color:var(--ink);font-weight:500;}
/* founder section on ink */
.sec-ink .founder .quote{color:var(--paper);}
.sec-ink .founder .quote em{color:var(--terra);}
.sec-ink .founder .who{color:var(--stone-soft);}
.sec-ink .founder .who b{color:var(--paper);}
.sec-ink .founder .portrait{background:var(--ink-soft);}

/* ---- proof ---- */
.proof{font-family:var(--news);font-weight:400;font-size:calc(clamp(20px,2vw,26px) * var(--type-scale));line-height:1.4;color:var(--ink);max-width:42ch;}
.proof-na{margin-top:34px;padding-top:26px;border-top:1px solid var(--sand);font-family:var(--plex);font-size:16px;line-height:1.6;color:var(--ink-soft);max-width:56ch;}
.proof-na .tag{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--terra);display:block;margin-bottom:10px;}

/* ---- closing ---- */
#closing .statement{color:var(--ink);max-width:20ch;}
#closing .lede{color:var(--ink-soft);}

/* ---- footer ---- */
footer{background:var(--ink);color:var(--stone-soft);padding:54px var(--pad);}
footer .foot-top{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:24px;}
footer svg{height:24px;}
/* width:auto so the wordmark box matches its glyphs (not a fixed 150px box that
   centres the art); tiny bearing nudge aligns the 'c' to the content margin */
footer #foot-logo svg{height:24px;width:auto;display:block;}
footer #foot-logo{display:inline-flex;margin-left:-3.4px;}
footer .foot-right{display:flex;align-items:center;gap:30px;flex-wrap:wrap;}
footer .socials{display:flex;gap:14px;}
footer .social{color:var(--stone-soft);display:inline-flex;transition:color .2s,transform .15s;}
footer .social:hover{color:var(--terra);transform:translateY(-1px);}
footer .social svg{height:22px;}
footer .meta{font-family:var(--mono);font-size:13px;letter-spacing:.04em;}
footer .foot-legal{margin-top:30px;padding-top:22px;border-top:1px solid rgba(255,255,255,.1);font-family:var(--mono);font-size:12px;letter-spacing:.05em;color:var(--stone);}

/* ---- scroll reveal ---- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.6,.2,1),transform .8s cubic-bezier(.2,.6,.2,1);}
.reveal.in{opacity:1;transform:none;}
.reveal.d1{transition-delay:.08s;}.reveal.d2{transition-delay:.16s;}.reveal.d3{transition-delay:.24s;}.reveal.d4{transition-delay:.32s;}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}#loader{display:none;}nav .links a.nav-cta{animation:none;}}

/* ---- form modal ---- */
#modal{position:fixed;inset:0;z-index:500;display:none;align-items:center;justify-content:center;padding:24px;}
#modal.open{display:flex;}
#modal .scrim{position:absolute;inset:0;background:rgba(30,26,20,.62);backdrop-filter:blur(4px);opacity:0;transition:opacity .3s;}
#modal.open .scrim{opacity:1;}
#modal .sheet{position:relative;background:var(--paper);width:min(620px,100%);max-height:90vh;overflow:auto;border-radius:5px;
  padding:clamp(28px,4vw,52px);box-shadow:0 40px 90px -40px rgba(30,26,20,.7);transform:translateY(20px) scale(.98);opacity:0;transition:transform .35s cubic-bezier(.2,.7,.2,1),opacity .35s;}
#modal.open .sheet{transform:none;opacity:1;}
#modal .sheet .close{position:absolute;top:18px;right:20px;background:none;border:0;font-family:var(--mono);font-size:13px;color:var(--stone);cursor:pointer;letter-spacing:.08em;}
#modal .sheet .close:hover{color:var(--terra);}
#modal h3{font-family:var(--news);font-weight:400;font-size:30px;letter-spacing:-.015em;margin:0 0 6px;}
#modal .sub{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--terra);margin-bottom:26px;}
.field{margin-bottom:22px;}
.field label{display:block;font-family:var(--plex);font-size:15px;font-weight:500;margin-bottom:9px;}
.field label .qn{font-family:var(--mono);color:var(--terra);font-size:13px;margin-right:8px;}
.field textarea,.field input{width:100%;font-family:var(--plex);font-size:15px;color:var(--ink);background:var(--paper-warm);
  border:1px solid var(--sand);border-radius:3px;padding:13px 15px;resize:vertical;transition:border-color .2s;}
.field textarea:focus,.field input:focus{outline:none;border-color:var(--terra);}
.slots{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px;}
.slots .slot{font-family:var(--mono);font-size:13px;border:1px solid var(--sand);background:var(--paper-warm);padding:10px 14px;border-radius:2px;cursor:pointer;transition:all .15s;}
.slots .slot:hover{border-color:var(--terra);color:var(--terra);}
.slots .slot.sel{background:var(--ink);color:var(--paper);border-color:var(--ink);}
#modal .done-msg{text-align:center;padding:30px 10px;}
#modal .done-msg .big{font-family:var(--news);font-size:30px;letter-spacing:-.01em;margin-bottom:12px;}
#modal .done-msg p{font-family:var(--plex);font-size:15px;color:var(--ink-soft);line-height:1.6;}
