/* ==========================================================================
   Doyle Cleaning Co — v2 "The Night Shift, Filed."
   One night of work, filed as documents. Night grounds → paper grounds.
   No cards. No icon grids. No pure white. Apparatus over decoration.
   ========================================================================== */

:root{
  /* night grounds */
  --dusk:#12324a;
  --night:#0e2a3d;
  --deep:#091b28;
  --pitch:#050d14;
  --predawn:#0b2233;
  /* paper grounds */
  --paper:#f6f3ea;
  --paper-deep:#eee9db;
  --paper-raised:#fbf9f2;   /* the job sheet only */
  /* ink */
  --ink:#14242f;
  --ink-soft:#4c5b66;
  --mist:#e9f1f3;
  --mist-soft:rgba(233,241,243,.72);
  --mist-faint:rgba(233,241,243,.5);
  /* accents */
  --teal:#1fb6ac;
  --teal-bright:#56d0c6;    /* small text on night */
  --teal-deep:#0d6b64;      /* small text on paper */
  --amber:#e8b26b;          /* large type & rules on night only */
  --carbon:#4a55a2;         /* carbon-copy indigo, job sheet edge */
  /* rules */
  --rule-night:rgba(233,241,243,.16);
  --rule-paper:rgba(20,36,47,.2);
  --rule-paper-soft:rgba(20,36,47,.12);
  /* layout */
  --maxw:1120px;
  --radius:2px;
  --font-display:"Fraunces", Georgia, serif;
  --font-body:"Archivo", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --font-mono:ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;
  /* film grain, shared by every plate */
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
}

@font-face{
  font-family:"Fraunces";
  src:url("fonts/fraunces-latin.woff2") format("woff2");
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Fraunces";
  src:url("fonts/fraunces-italic-latin.woff2") format("woff2");
  font-weight:100 900;
  font-style:italic;
  font-display:swap;
}
@font-face{
  font-family:"Archivo";
  src:url("fonts/archivo-latin.woff2") format("woff2");
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */
*{box-sizing:border-box;}
@media (prefers-reduced-motion: no-preference){
  html{scroll-behavior:smooth;}
}
body{
  margin:0;
  font-family:var(--font-body);
  font-size:1.04rem;
  line-height:1.7;
  color:var(--ink);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
}
img,svg{display:block; max-width:100%;}
a{color:inherit;}
p{margin:0 0 18px;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 28px;}

h1,h2,h3{
  font-family:var(--font-display);
  font-variation-settings:"opsz" 144;
  font-weight:560;
  margin:0 0 20px;
}
h1{font-size:clamp(2.75rem, 6.5vw, 5.25rem); line-height:.99; letter-spacing:-0.03em;}
h2{font-size:clamp(1.9rem, 3.6vw, 2.9rem); line-height:1.06; letter-spacing:-0.024em;}
h3{font-size:1.35rem; line-height:1.2; letter-spacing:-0.012em; font-weight:600;}

::selection{background:var(--teal); color:var(--deep);}
:focus-visible{outline:2px solid var(--teal); outline-offset:3px;}

.skip-link{
  position:absolute; left:16px; top:-64px; z-index:100;
  background:var(--deep); color:var(--mist); padding:10px 16px;
  text-decoration:none; font-weight:600; font-size:.9rem; transition:top .15s ease;
}
.skip-link:focus{top:12px;}

/* the two grounds */
.ground-night{background:var(--night); color:var(--mist);}
.ground-night p{color:var(--mist-soft);}
.ground-paper{background:var(--paper); color:var(--ink);}
.ground-paper p{color:var(--ink-soft);}

/* --------------------------------------------------------------------------
   Mono apparatus: registers, captions, tags, footnotes
   -------------------------------------------------------------------------- */
.mono{
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-weight:500;
}

.register{
  display:flex; align-items:center; gap:18px;
  font-family:var(--font-mono); font-size:.72rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase;
  margin-bottom:34px; white-space:nowrap;
}
.register::after{content:""; flex:1; height:1px; background:var(--rule-paper); min-width:40px;}
.ground-night .register::after, .site-foot .register::after{background:var(--rule-night);}
.register .rt{color:var(--teal-deep);}
.ground-night .register .rt{color:var(--teal-bright);}
.register time{color:inherit;}

.tag{
  font-family:var(--font-mono); font-size:.68rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; white-space:nowrap;
  color:var(--teal-deep);
}
.ground-night .tag{color:var(--teal-bright);}

/* footnote apparatus — trust claims resolve to plain English */
sup.fn{
  font-family:var(--font-mono); font-size:.66em; line-height:0;
  color:var(--teal-deep); margin-left:1px;
}
.ground-night sup.fn{color:var(--teal-bright);}
.footnotes{
  margin-top:44px; padding-top:18px; border-top:1px solid var(--rule-paper);
  font-size:.86rem; color:var(--ink-soft); max-width:62ch;
}
.ground-night .footnotes{border-top-color:var(--rule-night); color:var(--mist-soft);}
.footnotes p{margin:0 0 8px; font-size:inherit; color:inherit;}
.footnotes .fm{font-family:var(--font-mono); color:var(--teal-deep); margin-right:8px;}
.ground-night .footnotes .fm{color:var(--teal-bright);}

/* --------------------------------------------------------------------------
   Buttons & links — one primary action per viewport
   -------------------------------------------------------------------------- */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:15px 28px; border-radius:var(--radius);
  font-family:var(--font-body); font-weight:600; font-size:.98rem;
  letter-spacing:.01em; text-decoration:none; cursor:pointer; border:none;
  background:var(--teal); color:var(--deep);
  transition:background .18s ease, color .18s ease;
}
.btn:hover{background:var(--teal-bright);}
.btn:active{transform:translateY(1px);}
.ground-paper .btn, .btn.on-paper{background:var(--night); color:var(--paper);}
.ground-paper .btn:hover, .btn.on-paper:hover{background:var(--deep);}

.tlink{
  font-weight:600; color:inherit; text-decoration:none;
  border-bottom:1px solid var(--rule-paper); padding-bottom:2px;
  transition:border-color .18s ease, color .18s ease;
}
.tlink:hover{color:var(--teal-deep); border-color:var(--teal-deep);}
.ground-night .tlink{border-color:var(--rule-night);}
.ground-night .tlink:hover{color:var(--teal-bright); border-color:var(--teal-bright);}
.tlink::after{content:" \2192"; font-family:var(--font-body);}

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */
header.site{
  position:sticky; top:0; z-index:50;
  background:var(--deep); color:var(--mist);
  border-bottom:1px solid var(--rule-night);
}
.nav{
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  max-width:var(--maxw); margin:0 auto; padding:14px 28px;
}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none; flex-shrink:0;}
.brand .wm{display:inline-flex; align-items:baseline; gap:7px; white-space:nowrap;}
.brand .wm-name{
  font-family:var(--font-display); font-variation-settings:"opsz" 144;
  font-weight:600; font-size:1.38rem; letter-spacing:-0.01em; color:var(--mist);
}
.brand .wm-sub{
  font-family:var(--font-mono); font-weight:500; font-size:.66rem;
  letter-spacing:.18em; text-transform:uppercase; color:var(--teal-bright);
}
.logo-badge{width:38px; height:38px; flex-shrink:0;}

nav.links{display:flex; gap:26px; align-items:center;}
nav.links a{
  text-decoration:none; color:var(--mist-soft); font-weight:500; font-size:.94rem;
  transition:color .15s ease;
}
nav.links a:hover{color:var(--mist);}
nav.links a[aria-current="page"]{color:var(--teal-bright);}
nav.links .mobile-cta{display:none;}

.nav-cta{display:flex; align-items:center; gap:18px; flex-shrink:0;}
.shift-clock{
  font-family:var(--font-mono); font-size:.78rem; letter-spacing:.12em;
  color:var(--mist-faint); font-variant-numeric:tabular-nums; display:none;
}
.shift-clock.on{display:block;}
.nav-cta .btn{padding:11px 20px; font-size:.9rem;}

.menu-toggle{display:none; background:none; border:none; cursor:pointer; padding:8px;}
.menu-toggle span{display:block; width:24px; height:2px; background:var(--mist); margin:5px 0;}

/* --------------------------------------------------------------------------
   Plates — photography with unified grade, grain and feathered edges
   -------------------------------------------------------------------------- */
.plate{position:relative; margin:0; overflow:hidden; border-radius:var(--radius);}
.plate img{
  width:100%; height:100%; object-fit:cover;
  filter:saturate(.86) contrast(1.05) brightness(.97);
}
.plate::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:var(--grain); background-size:180px;
  opacity:.08; mix-blend-mode:overlay;
}
.plate.feather-night::before{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:1;
  background:
    linear-gradient(to bottom, var(--plate-ground, var(--night)) 0%, transparent 18%),
    linear-gradient(to top, var(--plate-ground, var(--night)) 0%, transparent 22%);
}
figure.plate{margin:0;}
figcaption, .caption{
  font-family:var(--font-mono); font-size:.66rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--ink-soft); padding-top:12px;
}
.ground-night figcaption, .ground-night .caption{color:var(--mist-faint);}

/* --------------------------------------------------------------------------
   Sections & the sky (homepage crossfade between grounds)
   -------------------------------------------------------------------------- */
section{padding:84px 0;}
@media (max-width:900px){ section{padding:60px 0;} }

/* the fixed sky layer that site.js crossfades on the homepage */
.sky{
  position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:var(--night);
  transition:background 900ms cubic-bezier(.4,0,.4,1);
}
body.has-sky{background:transparent;}
body.has-sky .ground-night{background:transparent;}

/* --------------------------------------------------------------------------
   The night sky — stars & moon. Static CSS sky by default; night-sky.js
   swaps in the live canvas (twinkle, parallax, meteors, breathing moon).
   -------------------------------------------------------------------------- */
:root{
  --sky-stars:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 640'%3E%3Cdefs%3E%3Cmask id='m'%3E%3Crect width='100%25' height='100%25' fill='white'/%3E%3Ccircle cx='1198' cy='96' r='30' fill='black'/%3E%3C/mask%3E%3C/defs%3E%3Ccircle cx='1182' cy='108' r='33' fill='%23e9eef2' opacity='.9' mask='url(%23m)'/%3E%3Ccircle cx='60' cy='60' r='1.3' fill='%23ffffff' opacity='0.5'/%3E%3Ccircle cx='140' cy='180' r='1' fill='%23ffffff' opacity='0.35'/%3E%3Ccircle cx='230' cy='90' r='1.6' fill='%23ffffff' opacity='0.6'/%3E%3Ccircle cx='310' cy='240' r='1' fill='%23ffffff' opacity='0.3'/%3E%3Ccircle cx='390' cy='50' r='1.2' fill='%23ffffff' opacity='0.45'/%3E%3Ccircle cx='470' cy='160' r='1' fill='%23ffffff' opacity='0.5'/%3E%3Ccircle cx='540' cy='300' r='1.4' fill='%23ffffff' opacity='0.35'/%3E%3Ccircle cx='620' cy='80' r='1' fill='%23ffffff' opacity='0.55'/%3E%3Ccircle cx='700' cy='210' r='1.6' fill='%23ffffff' opacity='0.4'/%3E%3Ccircle cx='760' cy='40' r='1' fill='%23ffffff' opacity='0.35'/%3E%3Ccircle cx='840' cy='130' r='1.3' fill='%23ffffff' opacity='0.6'/%3E%3Ccircle cx='910' cy='280' r='1' fill='%23ffffff' opacity='0.3'/%3E%3Ccircle cx='980' cy='70' r='1.5' fill='%23ffffff' opacity='0.5'/%3E%3Ccircle cx='1050' cy='190' r='1' fill='%23ffffff' opacity='0.4'/%3E%3Ccircle cx='1120' cy='320' r='1.2' fill='%23ffffff' opacity='0.35'/%3E%3Ccircle cx='1250' cy='220' r='1' fill='%23ffffff' opacity='0.5'/%3E%3Ccircle cx='1320' cy='80' r='1.4' fill='%23ffffff' opacity='0.45'/%3E%3Ccircle cx='1390' cy='170' r='1' fill='%23ffffff' opacity='0.35'/%3E%3Ccircle cx='90' cy='340' r='1.2' fill='%23ffffff' opacity='0.3'/%3E%3Ccircle cx='180' cy='420' r='1' fill='%23ffffff' opacity='0.35'/%3E%3Ccircle cx='420' cy='380' r='1.3' fill='%23ffffff' opacity='0.4'/%3E%3Ccircle cx='580' cy='440' r='1' fill='%23ffffff' opacity='0.3'/%3E%3Ccircle cx='880' cy='400' r='1.2' fill='%23ffffff' opacity='0.35'/%3E%3Ccircle cx='1030' cy='460' r='1' fill='%23ffffff' opacity='0.3'/%3E%3Ccircle cx='1340' cy='380' r='1.3' fill='%23ffffff' opacity='0.4'/%3E%3Ccircle cx='340' cy='140' r='1.4' fill='%237fe0d8' opacity='.55'/%3E%3Ccircle cx='660' cy='260' r='1.4' fill='%237fe0d8' opacity='.55'/%3E%3Ccircle cx='950' cy='150' r='1.4' fill='%237fe0d8' opacity='.55'/%3E%3Ccircle cx='1290' cy='300' r='1.4' fill='%237fe0d8' opacity='.55'/%3E%3Ccircle cx='200' cy='270' r='1.4' fill='%237fe0d8' opacity='.55'/%3E%3C/svg%3E");
}
.hero, .cover{
  position:relative;
  background-image:var(--sky-stars);
  background-repeat:no-repeat;
  background-position:top center;
  background-size:cover;
}
.hero.sky-live, .cover.sky-live{background-image:none;}
.sky-canvas{position:absolute; inset:0; width:100%; height:100%; pointer-events:none;}
.hero > .wrap, .hero-plate, .cover > .wrap{position:relative;}

/* founder portraits (AI-illustrated) */
.avatar{
  width:76px; height:76px; object-fit:cover;
  border-radius:var(--radius); border:1px solid var(--rule-paper);
}
.duo-plate{max-width:560px;}
.duo-intro{
  display:grid; grid-template-columns:280px 1fr; gap:40px; align-items:center;
  margin-top:56px; max-width:820px;
}
.duo-intro .duo-plate{max-width:280px;}
@media (max-width:700px){
  .duo-intro{grid-template-columns:1fr; gap:20px;}
}

/* brief section — how we work, a few tight points */
.brief-points{list-style:none; padding:0; margin:22px 0 0;}
.brief-points li{
  padding:11px 0; border-top:1px solid var(--rule-night);
  font-size:.95rem; color:var(--mist-soft);
}
.brief-points li:last-child{border-bottom:1px solid var(--rule-night);}
.brief-points strong{color:var(--mist); font-weight:600;}

/* --------------------------------------------------------------------------
   Hero — 18:47 arrival
   -------------------------------------------------------------------------- */
.hero{padding:96px 0 0; color:var(--mist);}
.hero .register{margin-bottom:44px;}
.hero h1{max-width:11ch; margin-bottom:28px;}
.hero .standfirst{
  font-size:clamp(1.08rem, 1.6vw, 1.28rem); line-height:1.6;
  color:var(--mist-soft); max-width:52ch; margin-bottom:34px;
}
.hero-actions{display:flex; align-items:center; gap:26px; flex-wrap:wrap; margin-bottom:22px;}
.hero .microline{
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--mist-faint);
}
.hero-plate{margin-top:72px;}
.hero-plate .plate{border-radius:0;}
.hero-plate img{max-height:62vh; width:100%;}

/* trust register — one justified mono line with footnote markers */
.trust-register{
  border-top:1px solid var(--rule-night); border-bottom:1px solid var(--rule-night);
  padding:20px 0;
}
.trust-register .wrap{
  display:flex; flex-wrap:wrap; row-gap:10px; column-gap:0;
  justify-content:space-between; align-items:baseline;
}
.trust-register .ti{
  font-family:var(--font-mono); font-size:.7rem; font-weight:500;
  letter-spacing:.15em; text-transform:uppercase; color:var(--mist-soft);
  white-space:nowrap; padding:0 10px;
}
.trust-register .ti:first-child{padding-left:0;}
.trust-register .ti:last-child{padding-right:0;}

/* --------------------------------------------------------------------------
   Ledger rows — services, values, kit, roles. Rows, never cards.
   -------------------------------------------------------------------------- */
.ledger{border-top:1px solid var(--rule-paper);}
.ground-night .ledger{border-top-color:var(--rule-night);}
.ledger-row{
  display:grid; grid-template-columns:minmax(90px,140px) 1fr auto; gap:18px 36px;
  padding:30px 0; border-bottom:1px solid var(--rule-paper);
  text-decoration:none; color:inherit;
}
.ground-night .ledger-row{border-bottom-color:var(--rule-night);}
.ledger-row .ln{
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--ink-soft); padding-top:6px;
  font-variant-numeric:tabular-nums;
}
.ground-night .ledger-row .ln{color:var(--mist-faint);}
.ledger-row h3{margin:0 0 8px;}
.ledger-row p{margin:0; max-width:58ch;}
.ledger-row .tag{padding-top:7px;}
a.ledger-row{transition:background .18s ease;}
a.ledger-row:hover{background:rgba(20,36,47,.035);}
.ground-night a.ledger-row:hover{background:rgba(233,241,243,.045);}
a.ledger-row:hover h3{color:var(--teal-deep);}
.ground-night a.ledger-row:hover h3{color:var(--teal-bright);}

/* work rows, optional compact plate on the right */
.work-row{
  display:grid; grid-template-columns:minmax(80px,120px) 1.3fr .7fr; gap:18px 36px;
  padding:30px 0; border-bottom:1px solid var(--rule-night); align-items:center;
}
.work-row .plate{aspect-ratio:16/10; max-width:340px; justify-self:end; width:100%;}
.work-row h3{font-size:1.4rem; margin-bottom:8px;}
.work-row p{max-width:52ch; margin-bottom:12px; font-size:.98rem;}
.work-row .wr-body > .tag{display:block; margin-bottom:10px;}
.work-row.no-ln{grid-template-columns:1.3fr .7fr;}

/* plain specifics list — what we service */
.service-list{
  list-style:none; padding:0; margin:14px 0 0;
  display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:0 40px;
  border-top:1px solid var(--rule-night);
}
.service-list li{
  padding:12px 0; border-bottom:1px solid var(--rule-night);
  font-size:.98rem; color:var(--mist-soft);
}

/* --------------------------------------------------------------------------
   The job sheet — the site's one physical artifact
   -------------------------------------------------------------------------- */
.jobsheet{
  position:relative; max-width:540px; justify-self:end; width:100%;
  font-size:.92rem;
  background:var(--paper-raised); color:var(--ink);
  border:1px solid var(--rule-paper); border-radius:var(--radius);
  box-shadow:0 24px 60px -30px rgba(5,13,20,.55);
  /* carbon copy underneath */
}
.jobsheet::before{
  content:""; position:absolute; inset:auto -7px -7px auto; width:100%; height:100%;
  border:1px solid rgba(74,85,162,.4); border-radius:var(--radius); z-index:-1;
  background:rgba(74,85,162,.06);
}
.jobsheet::after{ /* punch holes */
  content:""; position:absolute; top:50%; left:12px; width:10px; height:10px;
  border-radius:50%; background:var(--paper-deep);
  box-shadow:0 -90px 0 var(--paper-deep), 0 90px 0 var(--paper-deep),
             inset 0 1px 2px rgba(20,36,47,.25);
  transform:translateY(-50%);
}
.js-head{
  display:flex; justify-content:space-between; align-items:baseline; gap:16px;
  padding:16px 24px 12px 38px; border-bottom:2px solid var(--night);
}
.js-head .t{font-family:var(--font-display); font-variation-settings:"opsz" 144; font-weight:600; font-size:1.25rem;}
.js-head .n{font-family:var(--font-mono); font-size:.62rem; letter-spacing:.15em; text-transform:uppercase; color:var(--ink-soft); text-align:right;}
.js-meta{display:grid; grid-template-columns:repeat(3,1fr); border-bottom:1px solid var(--rule-paper-soft);}
.js-meta > div{padding:8px 12px 8px 38px; font-size:.84rem; border-right:1px solid var(--rule-paper-soft);}
.js-meta > div + div{padding-left:16px;}
.js-meta > div:last-child{border-right:none;}
.js-meta b{
  display:block; font-family:var(--font-mono); font-size:.6rem; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase; color:var(--teal-deep); margin-bottom:2px;
}
.js-items{padding:10px 24px 8px 38px;}
.js-item{
  display:flex; gap:12px; align-items:baseline; padding:8px 0;
  border-bottom:1px dotted var(--rule-paper-soft); font-size:.9rem;
}
.js-item:last-child{border-bottom:none;}
.js-box{
  width:16px; height:16px; border:1.5px solid var(--ink-soft); border-radius:2px;
  flex:0 0 auto; position:relative; top:3px;
}
.js-item .later{
  margin-left:auto; font-family:var(--font-mono); font-size:.62rem;
  letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft); white-space:nowrap;
}
/* tick — drawn by site.js when .done lands; pre-done without JS */
.js-box svg{position:absolute; inset:-3px; width:20px; height:20px; color:var(--teal-deep);}
.js-box svg path{
  stroke:currentColor; stroke-width:2.6; fill:none;
  stroke-dasharray:24; stroke-dashoffset:0;
}
.js-item:not(.done) .js-box svg{display:none;}
@media (prefers-reduced-motion: no-preference){
  .js-item.done.ticking .js-box svg path{animation:tick .32s ease-out both;}
}
@keyframes tick{from{stroke-dashoffset:24;} to{stroke-dashoffset:0;}}
.js-foot{
  display:flex; justify-content:space-between; align-items:center; gap:16px;
  padding:12px 24px 14px 38px; border-top:1px solid var(--rule-paper-soft);
  font-size:.8rem; color:var(--ink-soft);
}
.js-sign{
  font-family:var(--font-display); font-style:italic; font-weight:500;
  color:var(--ink); font-size:1.1rem; letter-spacing:.04em;
}
.js-stamp{
  position:absolute; right:26px; bottom:-14px; transform:rotate(-4deg);
  border:2px solid var(--teal-deep); color:var(--teal-deep); border-radius:3px;
  padding:5px 14px; font-family:var(--font-mono); font-size:.64rem; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase; background:var(--paper-raised);
}

/* torch beam — one static warm rake across the brief section */
.torch{position:relative; overflow:hidden;}
.torch::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse 720px 420px at 78% 18%, rgba(232,178,107,.1), transparent 62%);
}

/* --------------------------------------------------------------------------
   23:58 — who's in your building
   -------------------------------------------------------------------------- */
.midnight h2{max-width:16ch;}
.midnight .lead-q{
  font-size:clamp(1.15rem,1.9vw,1.45rem); line-height:1.55;
  color:var(--mist); max-width:46ch; font-weight:500;
}
.plain-rows{margin-top:44px; max-width:660px;}
.plain-rows > div{
  padding:18px 0; border-bottom:1px solid var(--rule-night);
  display:flex; gap:22px; align-items:baseline;
}
.plain-rows > div:first-child{border-top:1px solid var(--rule-night);}
.plain-rows .pn{
  font-family:var(--font-mono); font-size:.68rem; letter-spacing:.14em;
  color:var(--mist-faint); flex:0 0 28px; font-variant-numeric:tabular-nums;
}
.plain-rows p{margin:0; color:var(--mist-soft); font-size:.98rem;}
.plain-rows strong{color:var(--mist); font-weight:600;}

/* --------------------------------------------------------------------------
   Kit inventory
   -------------------------------------------------------------------------- */
.kit-grid{display:grid; grid-template-columns:1fr 1fr; gap:0 56px; margin-top:8px;}
.kit-grid .ledger-row{grid-template-columns:1fr auto;}

/* --------------------------------------------------------------------------
   05:51 — sign-off, numbers ledger, the register (honesty entry)
   -------------------------------------------------------------------------- */
.signoff-grid{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start;}

.numbers-ledger{
  display:flex; flex-wrap:wrap; gap:14px 0; margin-top:56px;
  border-top:1px solid var(--rule-night); border-bottom:1px solid var(--rule-night);
  padding:22px 0; justify-content:space-between; align-items:baseline;
}
.numbers-ledger .nl{
  font-size:.95rem; color:var(--mist-soft); white-space:nowrap; padding:0 12px;
}
.numbers-ledger .nl:first-child{padding-left:0;}
.numbers-ledger .nl:last-child{padding-right:0;}
.numbers-ledger b{
  font-family:var(--font-display); font-variation-settings:"opsz" 144;
  font-weight:560; font-size:1.5rem; color:var(--mist); margin-right:8px;
  font-variant-numeric:tabular-nums;
}

.entry-register{
  margin-top:64px; border:1px solid var(--rule-night); border-radius:var(--radius);
  padding:26px 30px; max-width:680px;
}
.entry-register .mono{color:var(--teal-bright); display:block; margin-bottom:10px;}
.entry-register p{margin:0; color:var(--mist-soft);}

/* --------------------------------------------------------------------------
   09:00 — the reveal + CTA + steps line
   -------------------------------------------------------------------------- */
.reveal{padding-top:0;}
.reveal .plate{border-radius:0;}
.reveal .plate img{max-height:58vh; width:100%;}
.reveal-copy{padding-top:88px;}
.reveal-copy h2{max-width:18ch;}

.cta-block{
  margin-top:72px; padding-top:52px; border-top:2px solid var(--night);
  display:grid; grid-template-columns:1.2fr .8fr; gap:48px; align-items:center;
}
.cta-block h2{margin-bottom:10px;}
.cta-block .side{justify-self:end; text-align:right;}
.cta-block .side .mono{display:block; margin-top:14px; color:var(--ink-soft); letter-spacing:.13em;}

.steps-line{
  display:flex; gap:0; margin-top:64px; border-top:1px solid var(--rule-paper);
}
.steps-line > div{
  flex:1; padding:22px 26px 0 0; border-right:1px solid var(--rule-paper);
  padding-left:26px;
}
.steps-line > div:first-child{padding-left:0;}
.steps-line > div:last-child{border-right:none; padding-right:0;}
.steps-line .sn{
  font-family:var(--font-mono); font-size:.68rem; letter-spacing:.15em;
  text-transform:uppercase; color:var(--teal-deep); display:block; margin-bottom:8px;
}
.steps-line h3{font-size:1.08rem; margin-bottom:6px;}
.steps-line p{font-size:.92rem; margin:0;}

/* --------------------------------------------------------------------------
   Interior pages — file cover + paper body
   -------------------------------------------------------------------------- */
.cover{
  background:var(--deep); color:var(--mist);
  padding:88px 0 72px; border-bottom:1px solid var(--rule-night);
}
.cover .register{margin-bottom:40px;}
.cover h1{max-width:14ch; margin-bottom:18px; font-size:clamp(2.5rem,5.4vw,4.25rem);}
.cover .standfirst{
  font-size:clamp(1.05rem,1.5vw,1.22rem); color:var(--mist-soft);
  max-width:54ch; margin:0;
}

/* document block — a filed section on paper */
.doc{max-width:760px;}
.doc .register{margin-bottom:26px;}
.doc h2{font-size:clamp(1.7rem,3vw,2.4rem);}

/* clause list (terms, FAQ) */
.clauses{max-width:760px;}
.clauses details{border-bottom:1px solid var(--rule-paper);}
.clauses details:first-of-type{border-top:1px solid var(--rule-paper);}
.clauses summary{
  cursor:pointer; padding:22px 0; list-style:none;
  display:flex; align-items:baseline; gap:20px;
}
.clauses summary::-webkit-details-marker{display:none;}
.clauses .cn{
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.1em;
  color:var(--teal-deep); flex:0 0 44px; font-variant-numeric:tabular-nums;
}
.clauses summary strong{font-weight:600; font-size:1.02rem; color:var(--ink);}
.clauses summary .indicator{
  margin-left:auto; font-family:var(--font-mono); color:var(--ink-soft); font-size:.9rem;
}
.clauses summary .indicator::after{content:"+";}
.clauses details[open] summary .indicator::after{content:"\2212";}
.clauses .clause-body{padding:0 0 24px 64px; color:var(--ink-soft); max-width:60ch;}
.clauses .clause-body :last-child{margin-bottom:0;}

/* term blocks (numbered, always open — services terms) */
.terms-grid{display:grid; grid-template-columns:1fr 1fr; gap:34px 48px; margin-top:12px;}
.term{border-top:2px solid var(--night); padding-top:18px;}
.term h3{font-size:1.06rem; margin-bottom:8px; display:flex; gap:14px; align-items:baseline;}
.term h3 .tno{font-family:var(--font-mono); font-weight:500; font-size:.72rem; letter-spacing:.1em; color:var(--teal-deep);}
.term p{font-size:.95rem; margin:0;}

/* founder file entries */
.file-entry{
  display:grid; grid-template-columns:76px 1fr; gap:26px;
  padding:40px 0; border-bottom:1px solid var(--rule-paper);
}
.file-entry:first-of-type{border-top:1px solid var(--rule-paper);}
.monogram{
  width:64px; height:64px; border-radius:var(--radius);
  background:var(--night); color:var(--teal);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-variation-settings:"opsz" 144;
  font-weight:560; font-size:1.6rem;
}
.file-entry h3{margin-bottom:2px;}
.file-entry .role{
  font-family:var(--font-mono); font-size:.66rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--teal-deep); display:block; margin-bottom:16px;
}
.file-entry p{max-width:62ch;}
.file-entry p:last-child{margin-bottom:0;}

/* forms — ruled paper */
form{display:grid; gap:26px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:26px;}
label{
  font-family:var(--font-mono); font-size:.66rem; font-weight:500;
  letter-spacing:.15em; text-transform:uppercase; color:var(--ink-soft);
  margin-bottom:8px; display:block;
}
input, select, textarea{
  width:100%; padding:12px 2px; border:none; border-bottom:1px solid var(--rule-paper);
  border-radius:0; font-size:1rem; font-family:inherit; color:var(--ink);
  background:transparent;
}
input:focus, select:focus, textarea:focus{
  outline:none; border-bottom:2px solid var(--teal-deep); margin-bottom:-1px;
}
textarea{resize:vertical; min-height:120px; line-height:1.6;}
select{appearance:none; -webkit-appearance:none; cursor:pointer;}
.form-note{font-size:.85rem; color:var(--ink-soft); margin:0;}
.form-status{
  display:none; font-size:.95rem; font-weight:500; color:var(--teal-deep);
  border:1px solid var(--rule-paper); border-left:3px solid var(--teal-deep);
  padding:16px 18px;
}
.form-status.show{display:block;}

/* contact info rows */
.info-rows > div{
  display:grid; grid-template-columns:130px 1fr; gap:20px;
  padding:16px 0; border-bottom:1px solid var(--rule-paper);
}
.info-rows > div:first-child{border-top:1px solid var(--rule-paper);}
.info-rows b{
  font-family:var(--font-mono); font-size:.66rem; font-weight:500;
  letter-spacing:.15em; text-transform:uppercase; color:var(--ink-soft); padding-top:4px;
}

.placeholder{color:#8a5a17; font-style:italic;}
.ground-night .placeholder{color:var(--amber);}

/* --------------------------------------------------------------------------
   Footer — the colophon
   -------------------------------------------------------------------------- */
footer.site-foot{
  background:var(--deep); color:var(--mist-soft);
  border-top:3px double var(--rule-night);
  padding:72px 0 32px; font-size:.95rem;
}
.foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:48px; margin-bottom:52px;}
.site-foot .brand{margin-bottom:18px;}
.site-foot h4{
  font-family:var(--font-mono); font-size:.66rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--mist-faint);
  margin:0 0 18px;
}
.site-foot ul{list-style:none; padding:0; margin:0;}
.site-foot li{margin-bottom:10px; font-size:.92rem;}
.site-foot a{text-decoration:none; color:var(--mist-soft); transition:color .15s ease;}
.site-foot a:hover{color:var(--teal-bright);}
.foot-placeholder{color:var(--amber); font-style:italic;}
.colophon{
  text-align:center; font-family:var(--font-display); font-style:italic;
  font-weight:500; font-size:1.15rem; color:var(--mist);
  padding:26px 0; border-top:1px solid var(--rule-night);
}
.foot-bottom{
  border-top:1px solid var(--rule-night); padding-top:22px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
  font-size:.8rem; color:var(--mist-faint);
}

/* --------------------------------------------------------------------------
   Internal pages (brand-hq) & capability
   -------------------------------------------------------------------------- */
.internal-strip{
  background:#3b2f14; color:#ffd694; font-size:.82rem; font-weight:500;
  font-family:var(--font-mono); letter-spacing:.08em;
  padding:10px 0; text-align:center;
}
.spec-table{width:100%; border-collapse:collapse; margin:18px 0 8px; font-size:.92rem;}
.spec-table th, .spec-table td{
  text-align:left; padding:10px 14px 10px 0;
  border-bottom:1px solid var(--rule-paper); vertical-align:top;
}
.spec-table th{
  font-family:var(--font-mono); font-size:.68rem; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft); width:30%;
}
.spec-table td{color:var(--ink-soft);}
.spec-table code{
  font-size:.85em; background:var(--paper-deep); padding:2px 7px;
  border-radius:2px; color:var(--teal-deep); font-family:var(--font-mono);
}
.swatch-row{display:flex; flex-wrap:wrap; gap:10px; margin:18px 0;}
.swatch{
  width:120px; padding:12px 12px 10px; border:1px solid var(--rule-paper);
  border-radius:var(--radius); font-family:var(--font-mono); font-size:.62rem;
  letter-spacing:.08em;
}
.swatch i{display:block; height:44px; margin:-12px -12px 10px; border-radius:2px 2px 0 0; font-style:normal;}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width:1000px){
  .signoff-grid{grid-template-columns:1fr; gap:44px;}
  .work-row, .work-row.no-ln{grid-template-columns:1fr; gap:26px;}
  .work-row .ln{padding-top:0;}
  .work-row .plate{max-width:520px;}
}
@media (max-width:900px){
  .kit-grid{grid-template-columns:1fr;}
  .terms-grid{grid-template-columns:1fr;}
  .cta-block{grid-template-columns:1fr;}
  .cta-block .side{justify-self:start; text-align:left;}
  .steps-line{flex-direction:column;}
  .steps-line > div{border-right:none; border-bottom:1px solid var(--rule-paper); padding:20px 0;}
  .steps-line > div:last-child{border-bottom:none;}
  .foot-grid{grid-template-columns:1fr; gap:36px;}
  .form-row{grid-template-columns:1fr;}
  .ledger-row{grid-template-columns:1fr; gap:8px;}
  .ledger-row .tag{padding-top:0;}
  .trust-register .wrap{justify-content:flex-start; column-gap:22px;}
  .trust-register .ti{padding:0;}
  .numbers-ledger{flex-direction:column; gap:12px;}
  .numbers-ledger .nl{padding:0;}
  .shift-clock{display:none !important;}

  nav.links{
    position:fixed; top:67px; left:0; right:0; z-index:49;
    background:var(--deep); border-bottom:1px solid var(--rule-night);
    flex-direction:column; align-items:flex-start; padding:22px 28px;
    transform:translateY(-130%); transition:transform .22s ease; gap:18px;
  }
  nav.links.open{transform:translateY(0);}
  .menu-toggle{display:block;}
  .nav-cta .btn{display:none;}
  nav.links .mobile-cta{
    display:inline-flex; margin-top:6px; background:var(--teal); color:var(--deep);
    padding:12px 20px; border-radius:var(--radius); font-weight:600; text-decoration:none;
  }
}
@media (max-width:620px){
  .wrap{padding:0 20px;}
  .nav{padding:12px 20px;}
  .file-entry{grid-template-columns:1fr; gap:14px;}
  .js-meta{grid-template-columns:1fr;}
  .js-meta > div{border-right:none; border-bottom:1px solid var(--rule-paper-soft); padding-left:44px;}
  .js-meta > div:last-child{border-bottom:none;}
  .js-stamp{right:14px;}
  .clauses .clause-body{padding-left:0;}
  .info-rows > div{grid-template-columns:1fr; gap:4px;}
}

@media (prefers-reduced-motion: reduce){
  *{transition:none !important; animation:none !important;}
  .sky{transition:none;}
}

/* --------------------------------------------------------------------------
   Print
   -------------------------------------------------------------------------- */
@media print{
  header.site, footer.site-foot, .hero-actions, .cta-block, .menu-toggle, .internal-strip{display:none !important;}
  body, .ground-night, .cover{background:#fff !important; color:#000 !important;}
  .cover h1, .ground-night p{color:#000 !important;}
  .plate::after{display:none;}
  *{box-shadow:none !important;}
}

/* native cross-document page transitions (progressive; Chromium) */
@media (prefers-reduced-motion: no-preference){
  @view-transition{navigation:auto;}
  ::view-transition-old(root), ::view-transition-new(root){animation-duration:.22s;}
}