/* ============ TOKENS ============ */
/* Dark-first design: bare :root holds the dark (default) palette. */
:root{
  --bg:#15130f;
  --surface:#1c1912;
  --surface-2:#221e15;
  --line: rgba(217,163,90,0.18);
  --line-strong: rgba(217,163,90,0.34);
  --text:#f3ede0;
  --muted:#a89a7c;
  --amber:#d9903f;
  --amber-strong:#e8a35a;
  --amber-ink:#15130f;
  --steel:#7fb0b8;

  --font-display:'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body:'IBM Plex Sans', -apple-system, 'Segoe UI', sans-serif;
  --font-mono:'IBM Plex Mono', 'SFMono-Regular', Consolas, monospace;

  --container:1180px;
  --radius:8px;
}

/* System-level light preference, unless an explicit dark stamp wins */
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    --bg:#f2ecdd;
    --surface:#e9e0c9;
    --surface-2:#e0d5b8;
    --line: rgba(21,19,15,0.14);
    --line-strong: rgba(21,19,15,0.26);
    --text:#1c1912;
    --muted:#5e5644;
    --amber:#a8611c;
    --amber-strong:#8a4f16;
    --amber-ink:#f2ecdd;
    --steel:#2f5b62;
  }
}

/* Explicit light stamp always wins */
:root[data-theme="light"]{
  --bg:#f2ecdd;
  --surface:#e9e0c9;
  --surface-2:#e0d5b8;
  --line: rgba(21,19,15,0.14);
  --line-strong: rgba(21,19,15,0.26);
  --text:#1c1912;
  --muted:#5e5644;
  --amber:#a8611c;
  --amber-strong:#8a4f16;
  --amber-ink:#f2ecdd;
  --steel:#2f5b62;
}

/* Explicit dark stamp always wins */
:root[data-theme="dark"]{
  --bg:#15130f;
  --surface:#1c1912;
  --surface-2:#221e15;
  --line: rgba(217,163,90,0.18);
  --line-strong: rgba(217,163,90,0.34);
  --text:#f3ede0;
  --muted:#a89a7c;
  --amber:#d9903f;
  --amber-strong:#e8a35a;
  --amber-ink:#15130f;
  --steel:#7fb0b8;
}

/* ============ BASE ============ */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
h1,h2,h3{
  font-family:var(--font-display);
  font-weight:600;
  line-height:1.12;
  margin:0 0 .45em;
  letter-spacing:-0.01em;
  text-wrap:balance;
  color:var(--text);
}
h1 em, .hero-copy em{
  font-style:italic;
  font-weight:500;
  color:var(--amber);
}
p{margin:0 0 1em;color:var(--muted);max-width:62ch;}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;height:auto;}
ul,dl{list-style:none;margin:0;padding:0;}
dd{margin:0;}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px;}

.container{max-width:var(--container);margin:0 auto;padding:0 24px;}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .reveal{opacity:1 !important;transform:none !important;transition:none !important;}
}

/* faint blueprint grid, restrained */
.bg-grid{
  position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:88px 88px;
  opacity:.35;
  mask-image:linear-gradient(180deg, black, black 55%, transparent 100%);
}

/* ============ HEADER ============ */
.site-header{
  position:sticky;top:0;z-index:100;
  background:var(--bg);
  border-bottom:1px solid var(--line);
}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:68px;}
.brand{
  font-family:var(--font-mono);font-weight:600;font-size:1.02rem;
  letter-spacing:.01em;
}
.brand-dot{color:var(--amber);padding:0 1px;}
.brand-ai{color:var(--amber);}
.nav{display:flex;align-items:center;gap:30px;}
.nav a{
  font-family:var(--font-mono);font-size:.82rem;font-weight:500;color:var(--muted);
  text-transform:uppercase;letter-spacing:.06em;
  transition:color .2s;
}
.nav a:hover{color:var(--text);}
.nav-cta{
  color:var(--amber-ink) !important;background:var(--amber);
  padding:8px 16px;border-radius:4px;font-weight:600 !important;
}
.nav-cta:hover{background:var(--amber-strong);}
.nav-toggle{
  display:none;flex-direction:column;justify-content:center;gap:5px;
  width:36px;height:36px;background:none;border:1px solid var(--line-strong);
  border-radius:4px;cursor:pointer;
}
.nav-toggle span{display:block;width:16px;height:1.5px;background:var(--text);margin:0 auto;}

/* ============ BUTTONS ============ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:13px 24px;border-radius:4px;
  font-family:var(--font-mono);font-weight:600;font-size:.85rem;
  letter-spacing:.02em;
  border:1px solid transparent;
  transition:background .2s, border-color .2s, transform .15s;
  white-space:nowrap;
}
.btn-primary{background:var(--amber);color:var(--amber-ink);}
.btn-primary:hover{background:var(--amber-strong);transform:translateY(-1px);}
.btn-outline{border-color:var(--line-strong);color:var(--text);}
.btn-outline:hover{border-color:var(--amber);color:var(--amber);}

/* ============ TYPOGRAPHY HELPERS ============ */
.eyebrow{
  font-family:var(--font-mono);text-transform:uppercase;font-size:.76rem;font-weight:600;
  letter-spacing:.14em;color:var(--amber);margin:0 0 1em;
}
.section{padding:100px 24px;border-top:1px solid var(--line);}
.section-head{max-width:620px;margin:0 0 52px;}
.section-sub{font-size:1.02rem;}

/* ============ HERO ============ */
.hero{
  display:grid;grid-template-columns:1.15fr .85fr;gap:56px;
  align-items:center;padding:88px 24px 96px;
}
.hero h1{font-size:clamp(2rem,4vw,3.15rem);}
.hero-sub{font-size:1.08rem;max-width:52ch;}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin:6px 0 22px;}
.hero-meta{font-family:var(--font-mono);font-size:.8rem;color:var(--muted);letter-spacing:.02em;}
.hero-media{justify-self:center;width:100%;max-width:380px;}

/* corner-tick instrument frame, reused on hero photo + contact panel */
.photo-frame{
  position:relative;margin:0;padding:14px;
}
.photo-frame::before,.photo-frame::after,
.photo-frame img{ }
.photo-frame{
  --tick:22px;
}
.photo-frame::before{
  content:"";position:absolute;top:0;left:0;width:var(--tick);height:var(--tick);
  border-top:2px solid var(--amber);border-left:2px solid var(--amber);
}
.photo-frame::after{
  content:"";position:absolute;bottom:0;right:0;width:var(--tick);height:var(--tick);
  border-bottom:2px solid var(--amber);border-right:2px solid var(--amber);
}
.photo-frame img{
  width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top center;
  filter:grayscale(.8) sepia(.22) contrast(1.08) brightness(.92);
  border:1px solid var(--line-strong);
}
.photo-frame figcaption{
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.08em;
  color:var(--muted);text-transform:uppercase;padding-top:10px;text-align:center;
}
.photo-frame--sm{max-width:280px;}

/* ============ READOUT / STATS ============ */
.readout{
  display:grid;grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
}
.readout-item{
  padding:30px 20px;border-left:1px solid var(--line);
  display:flex;flex-direction:column;gap:8px;
}
.readout-item:first-child{border-left:none;}
.readout-num{
  font-family:var(--font-mono);font-weight:700;font-size:2rem;color:var(--amber);
  font-variant-numeric:tabular-nums;line-height:1;
}
.readout-num small{font-size:1.1rem;font-weight:500;}
.readout-label{
  font-size:.82rem;color:var(--muted);line-height:1.4;
}

/* ============ CAPABILITIES / SPEC LIST ============ */
.spec-list{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--line);}
.spec-row{
  padding:32px 28px 32px 0;border-bottom:1px solid var(--line);
  display:grid;grid-template-columns:52px 1fr;gap:18px;align-items:start;
}
.spec-row:nth-child(odd){padding-left:0;border-right:1px solid var(--line);padding-right:28px;}
.spec-row:nth-child(even){padding-left:28px;}
.spec-code{
  font-family:var(--font-mono);font-weight:700;font-size:.78rem;color:var(--amber);
  border:1px solid var(--line-strong);border-radius:4px;
  width:52px;height:34px;display:flex;align-items:center;justify-content:center;
  letter-spacing:.03em;
}
.spec-row h3{font-size:1.08rem;margin-bottom:.4em;}
.spec-row p{font-size:.93rem;margin:0;}

/* ============ CASE LOG ============ */
.case-list{display:flex;flex-direction:column;border-top:1px solid var(--line);}
.case-item{
  padding:34px 0;border-bottom:1px solid var(--line);
  display:grid;grid-template-columns:120px 1fr 200px;gap:28px;
}
.case-meta{display:flex;flex-direction:column;gap:6px;}
.case-num{font-family:var(--font-mono);font-weight:700;font-size:.85rem;color:var(--text);}
.case-ref{font-family:var(--font-mono);font-size:.72rem;color:var(--muted);letter-spacing:.02em;}
.case-body h3{font-size:1.18rem;margin-bottom:.45em;}
.case-body p{font-size:.93rem;margin-bottom:.9em;}
.case-tags{display:flex;gap:8px;flex-wrap:wrap;}
.case-tags span{
  font-family:var(--font-mono);font-size:.72rem;color:var(--muted);
  border:1px solid var(--line-strong);padding:4px 10px;border-radius:4px;
}
.case-result{
  border-left:1px solid var(--line);padding-left:24px;
  display:flex;flex-direction:column;gap:6px;align-items:flex-start;
}
.case-result-num{
  font-family:var(--font-mono);font-weight:700;font-size:1.3rem;color:var(--amber);
  font-variant-numeric:tabular-nums;
}
.case-result-label{font-size:.78rem;color:var(--muted);}
.case-link{
  margin-top:10px;font-family:var(--font-mono);font-size:.8rem;font-weight:600;color:var(--steel);
}
.case-link:hover{text-decoration:underline;}

/* ============ METHOD ============ */
.method-list{position:relative;padding-left:8px;}
.method-item{
  display:grid;grid-template-columns:52px 1fr;gap:22px;
  padding:24px 0;border-bottom:1px solid var(--line);
}
.method-item:first-child{border-top:1px solid var(--line);}
.method-num{
  font-family:var(--font-mono);font-size:1.05rem;font-weight:700;color:var(--amber);
  font-variant-numeric:tabular-nums;
}
.method-item h3{font-size:1.05rem;margin-bottom:.3em;}
.method-item p{margin:0;font-size:.93rem;}

/* ============ ABOUT ============ */
.about{display:grid;grid-template-columns:.65fr 1.35fr;gap:60px;align-items:center;}
.spec-table{display:flex;flex-direction:column;gap:0;margin-top:22px;}
.spec-table > div{
  display:grid;grid-template-columns:150px 1fr;gap:18px;
  padding:14px 0;border-top:1px solid var(--line);font-size:.9rem;
}
.spec-table > div:first-child{border-top:none;}
.spec-table dt{font-family:var(--font-mono);color:var(--text);font-weight:600;font-size:.82rem;text-transform:uppercase;letter-spacing:.04em;}
.spec-table dd{color:var(--muted);}

/* ============ START / GET STARTED ============ */
.start-grid{
  display:grid;grid-template-columns:1fr 1fr;
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
}
.start-panel{padding:40px;}
.start-panel:first-child{border-right:1px solid var(--line);}
.start-panel h3{font-size:1.15rem;margin-bottom:.5em;}
.start-panel p{font-size:.93rem;margin-bottom:22px;}
.start-meta{
  display:block;margin-top:16px;font-family:var(--font-mono);font-size:.8rem;color:var(--muted);
}
.start-meta a{color:var(--amber);}
.start-meta a:hover{color:var(--amber-strong);}

.brief-form{display:flex;flex-direction:column;gap:16px;}
.brief-form label{
  display:flex;flex-direction:column;gap:6px;
  font-family:var(--font-mono);font-size:.74rem;text-transform:uppercase;
  letter-spacing:.06em;color:var(--muted);
}
.brief-form input,.brief-form textarea{
  font-family:var(--font-body);font-size:.95rem;color:var(--text);
  background:var(--surface);border:1px solid var(--line-strong);border-radius:4px;
  padding:10px 12px;resize:vertical;
}
.brief-form input::placeholder,.brief-form textarea::placeholder{color:var(--muted);}
.brief-form button{align-self:flex-start;margin-top:2px;cursor:pointer;}
.form-success{
  font-family:var(--font-mono);font-size:.9rem;color:var(--amber);
  border:1px solid var(--line-strong);border-radius:4px;padding:14px 16px;margin:0;
}

/* ============ CONTACT / TRANSMIT PANEL ============ */
.transmit-panel{
  position:relative;padding:56px;
  border:1px solid var(--line-strong);border-radius:var(--radius);
  --tick:26px;
}
.transmit-panel::before{
  content:"";position:absolute;top:-1px;left:-1px;width:var(--tick);height:var(--tick);
  border-top:2px solid var(--amber);border-left:2px solid var(--amber);
}
.transmit-panel::after{
  content:"";position:absolute;bottom:-1px;right:-1px;width:var(--tick);height:var(--tick);
  border-bottom:2px solid var(--amber);border-right:2px solid var(--amber);
}
.transmit-panel h2{font-size:clamp(1.6rem,3vw,2.15rem);}
.transmit-panel .section-sub{max-width:560px;margin-bottom:36px;}
.contact-table{display:flex;flex-direction:column;max-width:520px;}
.contact-table > div{
  display:grid;grid-template-columns:110px 1fr;gap:18px;
  padding:16px 0;border-top:1px solid var(--line);font-size:.95rem;
}
.contact-table > div:first-child{border-top:none;}
.contact-table dt{font-family:var(--font-mono);color:var(--muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;padding-top:2px;}
.contact-table dd a{color:var(--text);font-weight:500;}
.contact-table dd a:hover{color:var(--amber);}

/* ============ FOOTER ============ */
.site-footer{border-top:1px solid var(--line);padding:28px 24px;}
.footer-inner{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;
  font-family:var(--font-mono);font-size:.78rem;color:var(--muted);
}
.footer-links{display:flex;gap:20px;}
.footer-links a:hover{color:var(--text);}

/* ============ REVEAL ============ */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease;}
.reveal.in{opacity:1;transform:translateY(0);}

/* ============ RESPONSIVE ============ */
@media (max-width:900px){
  .hero{grid-template-columns:1fr;padding-top:52px;}
  .hero-media{order:-1;max-width:300px;}
  .readout{grid-template-columns:repeat(2,1fr);}
  .readout-item:nth-child(2n+1){border-left:none;}
  .readout-item:nth-child(n+3){border-top:1px solid var(--line);}
  .spec-list{grid-template-columns:1fr;}
  .spec-row:nth-child(odd){border-right:none;padding-right:0;}
  .spec-row:nth-child(even){padding-left:0;}
  .about{grid-template-columns:1fr;}
  .about-media{max-width:260px;}
  .case-item{grid-template-columns:1fr;gap:14px;}
  .case-result{border-left:none;padding-left:0;border-top:1px solid var(--line);padding-top:14px;}
  .transmit-panel{padding:36px 24px;}
  .start-grid{grid-template-columns:1fr;}
  .start-panel:first-child{border-right:none;border-bottom:1px solid var(--line);}
}
@media (max-width:640px){
  .nav{
    position:fixed;top:68px;left:0;right:0;background:var(--bg);
    border-bottom:1px solid var(--line);
    flex-direction:column;align-items:stretch;gap:0;padding:6px 24px 18px;
    transform:translateY(-130%);opacity:0;transition:transform .25s, opacity .25s;
  }
  .nav.open{transform:translateY(0);opacity:1;}
  .nav a{padding:14px 0;border-bottom:1px solid var(--line);}
  .nav-cta{text-align:center;margin-top:12px;border-bottom:none !important;}
  .nav-toggle{display:flex;}
  .section{padding:64px 20px;}
  .contact-table > div{grid-template-columns:1fr;gap:4px;}
}