/* ==========================================================================
   Nightfill — shared stylesheet. Brand v2: "window-grid" theme.
   Every lit window is a filled bed. Navy nights, amber lit windows,
   off-white paper for reading sections. No gradients, no stock icons.
   ========================================================================== */

:root{
  /* --- color tokens --- */
  --navy:#0B1D3A;
  --navy-2:#0F2547;
  --navy-deep:#081227;
  --amber:#F2A93B;
  --amber-dim:rgba(242,169,59,.16);
  --amber-line:rgba(242,169,59,.4);
  --paper:#F7F5F0;
  --paper-2:#FFFFFF;
  --ink:#14181F;
  --slate:#6B7280;
  --slate-ink:#5B6472;
  --slate-soft:#8993A8;
  --on-navy:#F7F5F0;
  --on-navy-dim:#C7CEDB;
  --on-navy-mute:#8993A8;
  --line-dark:rgba(247,245,240,.12);
  --line-darker:rgba(247,245,240,.07);
  --line-light:rgba(20,24,31,.12);
  --window-off:#132A52;
  --window-off-2:#173060;
  --danger:#F2926B;

  /* --- type --- */
  --font-display:"Fraunces","Georgia","Times New Roman",serif;
  --font-body:"Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-mono:"JetBrains Mono","SFMono-Regular","Consolas","Liberation Mono",Menlo,monospace;

  --step--1: clamp(.8rem, .77rem + .12vw, .875rem);
  --step-0:  clamp(1rem, .96rem + .2vw, 1.125rem);
  --step-1:  clamp(1.125rem, 1.06rem + .3vw, 1.3rem);
  --step-2:  clamp(1.4rem, 1.28rem + .55vw, 1.75rem);
  --step-3:  clamp(1.8rem, 1.55rem + 1vw, 2.4rem);
  --step-4:  clamp(2.3rem, 1.85rem + 1.9vw, 3.4rem);
  --step-5:  clamp(2.8rem, 2.1rem + 2.9vw, 4.4rem);

  --container: 1220px;
  --gutter: 24px;
  --radius-sm: 3px;
  --radius: 6px;
  --ease: cubic-bezier(.4,0,.2,1);
}

*,*::before,*::after{box-sizing:border-box;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  margin:0;
  font-family:var(--font-body);
  font-size:var(--step-0);
  color:var(--ink);
  background:var(--paper);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg{max-width:100%;display:block;}
a{color:inherit;}
ul,ol{margin:0;padding:0;}
button{font:inherit;}
h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:600;
  line-height:1.12;
  margin:0 0 .45em;
  letter-spacing:-.01em;
}
h1{font-size:var(--step-5);font-optical-sizing:auto;}
h2{font-size:var(--step-3);}
h3{font-size:var(--step-1);}
p{margin:0 0 1em;}
small{font-size:var(--step--1);}
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums;}

@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;}
}

.wrap{max-width:var(--container);margin:0 auto;padding:0 var(--gutter);}
.eyebrow{
  display:inline-flex;align-items:center;gap:.5em;
  text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;font-weight:700;
  color:var(--amber);margin:0 0 .9em;font-family:var(--font-mono);
}
.eyebrow::before{content:"";width:7px;height:7px;background:var(--amber);border-radius:1px;flex:none;}
section.on-navy .eyebrow, .on-navy .eyebrow{color:var(--amber);}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  font-family:var(--font-body);font-weight:700;font-size:var(--step--1);
  padding:.85em 1.5em;border-radius:var(--radius-sm);
  border:1.5px solid var(--amber);background:var(--amber);color:var(--navy);
  text-decoration:none;cursor:pointer;
  transition:transform .14s var(--ease),box-shadow .14s var(--ease),background .14s var(--ease);
}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(242,169,59,.28);}
.btn:active{transform:translateY(0);}
.btn:focus-visible{outline:2px solid var(--amber);outline-offset:3px;}
.btn.ghost{background:transparent;color:var(--on-navy);border-color:var(--line-dark);}
.btn.ghost:hover{border-color:var(--amber);color:var(--amber);box-shadow:none;}
.btn.on-paper{color:var(--navy);}
.btn.small{padding:.6em 1.1em;font-size:.82rem;}
.btn[disabled]{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none;}

/* ---------- header ---------- */
header.site{
  background:var(--navy);color:var(--on-navy);position:sticky;top:0;z-index:30;
  border-bottom:1px solid var(--line-darker);
}
header.site .bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px var(--gutter);max-width:var(--container);margin:0 auto;}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex:none;}
.brand img{height:28px;width:auto;}
.bar-right{display:flex;align-items:center;gap:14px;}
.lang-toggle{display:flex;gap:0;background:var(--line-darker);border-radius:20px;padding:3px;flex:none;}
.lang-toggle button{
  font-family:var(--font-mono);font-size:.72rem;font-weight:700;border:0;background:transparent;
  color:var(--on-navy);padding:6px 11px;border-radius:16px;cursor:pointer;opacity:.55;letter-spacing:.03em;
}
.lang-toggle button.active{background:var(--amber);color:var(--navy);opacity:1;}

/* ---------- layout rhythm ---------- */
section{padding:88px 0;}
section.tight{padding:56px 0;}
section.on-navy{background:var(--navy);color:var(--on-navy);}
section.on-navy-deep{background:var(--navy-deep);color:var(--on-navy);}
section.on-paper{background:var(--paper);color:var(--ink);}
section.on-paper-2{background:var(--paper-2);color:var(--ink);}
.divider-windows{height:14px;background:repeating-linear-gradient(90deg,var(--navy) 0 22px,var(--navy-deep) 22px 24px);}

/* ---------- window-row section dividers ---------- */
.window-row{background:var(--navy-deep);line-height:0;overflow:hidden;}
.window-row svg{display:block;width:100%;height:11px;}
.window-row rect{fill:var(--window-off);}
.window-row rect.lit{fill:var(--amber);}

/* ---------- hero ---------- */
.hero{background:var(--navy);color:var(--on-navy);position:relative;overflow:hidden;padding:64px 0 0;}
.hero-grid{display:grid;grid-template-columns:1fr;gap:40px;align-items:center;}
.hero-copy h1{color:var(--on-navy);}
.hero-copy h1 .accent{color:var(--amber);font-style:italic;}
.hero-copy .sub{font-size:var(--step-1);max-width:48ch;color:var(--on-navy-dim);}
.cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px;align-items:center;}
.hero-note{font-size:.85rem;color:var(--on-navy-mute);margin-top:16px;}
.facade-wrap{position:relative;}
.facade-frame{
  background:var(--navy-2);border:1px solid var(--line-dark);border-radius:var(--radius);
  padding:14px;position:relative;
}
.facade-svg{width:100%;height:auto;display:block;}
.facade-svg rect.window{fill:var(--window-off);stroke:var(--window-off-2);stroke-width:1;transition:fill .5s var(--ease);}
.facade-svg rect.window.lit{fill:var(--amber);stroke:#F7C877;}
.facade-svg rect.sill{fill:var(--navy-deep);}
.ledger-line{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  margin-top:12px;padding:10px 12px;background:var(--navy-deep);border-radius:var(--radius-sm);
  border:1px solid var(--line-dark);
}
.ledger-line .txt{font-size:.82rem;color:var(--on-navy-dim);}
.ledger-line .pct{font-family:var(--font-mono);color:var(--amber);font-weight:700;font-size:.95rem;}
.skyline{display:block;width:100%;height:auto;color:var(--navy-deep);margin-top:56px;}
.skyline path{fill:currentColor;}
.skyline rect.win{fill:var(--amber);opacity:.55;}

/* ---------- editorial problem section ---------- */
.editorial{max-width:66ch;}
.editorial p{font-size:var(--step-0);color:var(--ink);}
.editorial p + p{margin-top:1.3em;}
.editorial .lede{color:var(--slate-ink);font-size:var(--step-1);max-width:60ch;}
.editorial strong{color:var(--navy);}

/* ---------- night timeline ---------- */
.timeline{
  display:grid;grid-template-columns:1fr;gap:0;margin-top:40px;
  border-top:1px solid var(--line-dark);
}
.timeline-item{
  display:grid;grid-template-columns:90px 20px 1fr;gap:0 18px;padding:22px 0;
  border-bottom:1px solid var(--line-dark);
}
.timeline-item .time{font-family:var(--font-mono);font-size:var(--step-1);color:var(--amber);font-weight:700;}
.timeline-item .node{position:relative;display:flex;justify-content:center;}
.timeline-item .node::before{content:"";width:9px;height:9px;background:var(--amber);border-radius:2px;margin-top:.4em;}
.timeline-item h3{color:var(--on-navy);font-size:var(--step-0);margin-bottom:.3em;}
.timeline-item p{color:var(--on-navy-dim);font-size:.95rem;margin:0;}

/* ---------- proof ---------- */
.proof .badge{
  display:inline-flex;align-items:center;gap:8px;background:var(--amber-dim);border:1px solid var(--amber-line);
  color:var(--amber);font-size:.74rem;font-weight:700;padding:5px 12px;border-radius:20px;
  margin-bottom:18px;letter-spacing:.03em;font-family:var(--font-mono);
}
.proof .lede{max-width:70ch;color:var(--on-navy-dim);font-size:var(--step-0);}
.narrative{
  font-size:var(--step-0);color:#E7E9EE;white-space:pre-line;max-width:74ch;
  border-left:3px solid var(--amber);padding-left:20px;margin:26px 0 44px;
}
.ledger-table-wrap{overflow-x:auto;margin:24px 0 40px;border:1px solid var(--line-dark);border-radius:var(--radius);}
table.ledger{width:100%;border-collapse:collapse;min-width:560px;background:var(--navy-2);}
table.ledger caption{text-align:left;padding:12px 16px;font-family:var(--font-mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--on-navy-mute);border-bottom:1px solid var(--line-dark);}
table.ledger th,table.ledger td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--line-darker);font-size:.92rem;}
table.ledger tr:last-child td{border-bottom:none;}
table.ledger th{font-family:var(--font-body);font-weight:700;color:var(--on-navy-dim);font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;}
table.ledger td.num{font-family:var(--font-mono);font-weight:700;color:var(--amber);white-space:nowrap;font-size:1.05rem;}
table.ledger td.note{color:var(--on-navy-mute);font-size:.82rem;}
table.ledger td.label{color:var(--on-navy);}

details.proof-detail{
  background:var(--navy-2);border:1px solid var(--line-dark);
  border-radius:var(--radius);padding:16px 20px;margin-bottom:14px;
}
details.proof-detail summary{cursor:pointer;font-weight:700;color:var(--on-navy);font-family:var(--font-display);font-size:1.05rem;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;}
details.proof-detail summary::-webkit-details-marker{display:none;}
details.proof-detail summary::after{content:"+";font-size:1.3rem;color:var(--amber);font-weight:400;flex:none;}
details.proof-detail[open] summary::after{content:"\2212";}
details.proof-detail ul{margin:16px 0 0;padding-left:1.2em;color:var(--on-navy-dim);font-size:.92rem;}
details.proof-detail li{margin-bottom:9px;}
details.proof-detail li:last-child{margin-bottom:0;}

/* ---------- expect stats + calculator ---------- */
.expect-stats{display:grid;grid-template-columns:1fr;gap:24px;margin:32px 0 44px;}
.expect-stat{border-top:3px solid var(--amber);padding-top:16px;}
.expect-num{font-family:var(--font-display);font-optical-sizing:auto;font-size:var(--step-4);color:var(--amber);font-weight:600;line-height:1;}
.expect-label{color:var(--on-navy-dim);font-size:.92rem;margin-top:.5em;max-width:28ch;}
.calc-panel{background:var(--navy-2);border:1px solid var(--line-dark);border-radius:var(--radius);padding:28px 26px;margin:0 0 40px;}
.calc-panel h3{color:var(--on-navy);font-size:1.05rem;margin-bottom:1em;}
.calc-panel .field label{color:var(--on-navy-mute);}
.calc-panel .field input{background:var(--navy-deep);border-color:var(--line-dark);color:var(--on-navy);}
.calc-panel .field input:focus{outline-color:var(--amber);}
.calc-grid{display:grid;grid-template-columns:1fr;gap:16px;margin-bottom:24px;}
.calc-results{display:grid;grid-template-columns:1fr;gap:14px;padding-top:20px;border-top:1px solid var(--line-dark);}
.calc-result{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:10px 14px;border-radius:var(--radius-sm);background:var(--navy-deep);}
.calc-result-label{color:var(--on-navy-dim);font-size:.88rem;}
.calc-result-value{color:var(--on-navy);font-weight:700;font-size:1.1rem;}
.calc-result.featured{background:var(--amber-dim);border:1px solid var(--amber-line);}
.calc-result.featured .calc-result-value{color:var(--amber);font-size:1.3rem;}
.calc-footnote{font-size:.78rem;color:var(--on-navy-mute);margin:18px 0 0;max-width:70ch;}
.calc-closing{font-weight:700;color:var(--on-navy);font-size:1.1rem;margin:14px 0 0;max-width:60ch;}

/* ---------- rate card (pricing ledger) ---------- */
.rate-card-wrap{overflow-x:auto;margin-top:36px;border:1px solid var(--line-light);border-radius:var(--radius);background:var(--paper-2);}
table.rate-card{width:100%;border-collapse:collapse;min-width:720px;}
table.rate-card th,table.rate-card td{padding:16px 18px;border-bottom:1px solid var(--line-light);vertical-align:top;}
table.rate-card thead th{text-align:left;border-bottom:1px solid var(--line-light);vertical-align:bottom;}
table.rate-card th.tier-head{min-width:200px;}
table.rate-card .tier-name{font-family:var(--font-display);font-size:1.15rem;font-weight:600;color:var(--navy);margin-bottom:.15em;}
table.rate-card .tier-price{font-family:var(--font-mono);font-size:1.7rem;font-weight:700;color:var(--navy);}
table.rate-card .tier-price sup{font-family:var(--font-body);font-size:.6rem;font-weight:700;color:var(--slate);top:-.9em;}
table.rate-card .tier-trial{font-family:var(--font-mono);font-size:.76rem;font-weight:700;color:var(--amber);margin:.35em 0 .9em;min-height:1.1em;}
table.rate-card .tier-desc{font-size:.84rem;color:var(--slate-ink);font-weight:400;margin-bottom:.9em;}
table.rate-card th.tier-head.featured{background:var(--amber-dim);position:relative;}
table.rate-card th.tier-head.featured::before{
  content:attr(data-badge);position:absolute;top:-1px;left:18px;transform:translateY(-100%);
  background:var(--amber);color:var(--navy);font-size:.66rem;font-weight:800;padding:3px 10px;
  border-radius:10px 10px 0 0;text-transform:uppercase;letter-spacing:.04em;
}
table.rate-card tbody th{text-align:left;font-weight:400;color:var(--ink);font-size:.9rem;}
table.rate-card tbody td{text-align:center;}
.win-dot{display:inline-block;width:14px;height:14px;border-radius:3px;background:var(--amber);}
.win-dot.off{background:transparent;border:1.5px solid var(--line-light);}
table.rate-card tfoot td{padding-top:22px;border-bottom:none;text-align:center;}
.pricing-note{font-size:.85rem;color:var(--slate-ink);margin-top:22px;max-width:70ch;}

/* ---------- FAQ ---------- */
.faq-list{margin-top:32px;}
.faq-item{border-bottom:1px solid var(--line-light);padding:20px 0;}
.faq-item summary{
  cursor:pointer;font-weight:700;font-size:var(--step-0);list-style:none;
  display:flex;justify-content:space-between;align-items:center;gap:12px;font-family:var(--font-display);
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+";font-size:1.4rem;color:var(--amber);font-weight:400;flex:none;}
.faq-item[open] summary::after{content:"\2212";}
.faq-item p{color:var(--slate-ink);margin:14px 0 0;font-size:.95rem;max-width:66ch;}

/* ---------- founder ---------- */
.founder-grid{display:grid;grid-template-columns:1fr;gap:28px;align-items:start;margin-top:28px;}
.founder-mark{width:100%;max-width:220px;}
.founder-body p{color:var(--on-navy-dim);font-size:.98rem;}
.founder-name{font-family:var(--font-display);font-size:1.15rem;color:var(--on-navy);margin-top:16px;}
.founder-role{color:var(--amber);font-size:.82rem;font-weight:700;font-family:var(--font-mono);}

/* ---------- lead form ---------- */
.lead-panel{background:var(--paper-2);border:1px solid var(--line-light);border-radius:var(--radius);padding:32px;}
.lead-grid{display:grid;grid-template-columns:1fr;gap:36px;}
form.lead-form{display:grid;gap:16px;}
.field{display:flex;flex-direction:column;gap:6px;}
.field label{font-size:.78rem;font-weight:700;color:var(--slate-ink);text-transform:uppercase;letter-spacing:.04em;}
.field input,.field select,.field textarea{
  font-family:var(--font-body);font-size:1rem;padding:.75em .85em;border-radius:var(--radius-sm);
  border:1px solid var(--line-light);background:var(--paper);color:var(--ink);
}
.field input::placeholder,.field textarea::placeholder{color:var(--slate-soft);}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--amber);outline-offset:1px;border-color:transparent;}
.field-row{display:grid;grid-template-columns:1fr;gap:14px;}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
.form-msg{font-size:.9rem;padding:6px 0 0;min-height:1.4em;}
.form-msg.ok{color:#1a7a4c;}
.form-msg.err{color:#B23A2E;}

/* ---------- footer ---------- */
footer.site{background:var(--navy-deep);color:var(--on-navy-mute);padding-top:0;font-size:.85rem;}
footer.site .foot-skyline{width:100%;height:auto;color:var(--navy);opacity:.6;}
footer.site .foot-body{padding:36px 0;}
footer.site .foot-grid{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;align-items:flex-start;}
footer.site .foot-brand{display:flex;align-items:center;gap:8px;color:var(--on-navy-dim);font-family:var(--font-display);}
footer.site .foot-brand img{height:20px;}
footer.site .foot-links{display:flex;gap:18px;flex-wrap:wrap;}
footer.site a{color:var(--on-navy-dim);text-decoration:underline;text-underline-offset:2px;}
footer.site a:hover{color:var(--amber);}
footer.site .foot-legal{margin-top:18px;font-size:.78rem;color:var(--on-navy-mute);max-width:80ch;}

/* ---------- responsive ---------- */
@media (min-width:640px){
  .field-row{grid-template-columns:1fr 1fr;}
  .founder-grid{grid-template-columns:96px 1fr;}
  .timeline{grid-template-columns:repeat(4,1fr);border-top:none;}
  .timeline-item{grid-template-columns:1fr;border-bottom:none;border-top:3px solid var(--amber);padding:0 14px 0 0;}
  .timeline-item .node{display:none;}
  .timeline-item .time{margin-top:14px;display:block;}
}
@media (min-width:860px){
  .hero-grid{grid-template-columns:1.05fr .95fr;gap:56px;}
  .lead-grid{grid-template-columns:.9fr 1.1fr;}
  .expect-stats{grid-template-columns:repeat(3,1fr);}
  .calc-grid{grid-template-columns:repeat(3,1fr);}
  .calc-results{grid-template-columns:repeat(3,1fr);}
}
@media (min-width:1040px){
  table.rate-card th.tier-head,table.rate-card td{width:25%;}
}
@media (max-width:380px){
  :root{--gutter:16px;}
  .lead-panel{padding:22px;}
  section{padding:64px 0;}
}
@media (min-width:1600px){
  :root{--container:1360px;}
}
