@font-face{font-family:"Satoshi";src:url("/assets/fonts/Satoshi-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Satoshi";src:url("/assets/fonts/Satoshi-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}

/* Layout: spec sheet — left-aligned 12-col grid, hairline rules between sections, mono labels for real data */
:root{
  --paper:#f6f5f1; --surface:#ffffff; --sunken:#ecebe5;
  --ink:#16181d; --muted:#575b64; --rule:#d9d7cf; --rule-strong:#878a92;
  --blue:#1f4fff; --blue-deep:#1838c4; --on-blue:#ffffff; --wash:#e7ecff; --sky:#61b7ff; --navy:#0d1640; --on-navy:#ffffff; --on-navy-muted:#c9d3f5;
  --ok:#0b7a68; --warn:#9a5b00; --down:#c42b1c; --focus:#1f4fff; --tbc-bg:#fff1cc; --tbc-line:#9a5b00;
  --logo-body:var(--ink); --logo-dots:var(--blue); --logo-word:var(--ink);
  --f-body:Archivo,"Helvetica Neue",Arial,sans-serif;
  --f-head:Satoshi,Archivo,"Helvetica Neue",Arial,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --head-weight:700;
  --gutter:clamp(16px,4vw,32px); --max:1200px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#0f1115; --surface:#171a20; --sunken:#0a0c0f; --ink:#ecebe6; --muted:#9b9fa8; --rule:#2a2e36; --rule-strong:#6c717b;
  --blue:#6b93ff; --blue-deep:#93b1ff; --on-blue:#0a0c0f; --wash:#18224a; --navy:#1a2a6e; --on-navy-muted:#c9d3f5;
  --ok:#3cc7ae; --warn:#f0a83a; --down:#ff7b68; --focus:#8fb0ff; --tbc-bg:#3a2a08; --tbc-line:#f0a83a;
  --logo-dots:var(--sky); color-scheme:dark}}
:root[data-theme="dark"]{
  --paper:#0f1115; --surface:#171a20; --sunken:#0a0c0f; --ink:#ecebe6; --muted:#9b9fa8; --rule:#2a2e36; --rule-strong:#6c717b;
  --blue:#6b93ff; --blue-deep:#93b1ff; --on-blue:#0a0c0f; --wash:#18224a; --navy:#1a2a6e; --on-navy-muted:#c9d3f5;
  --ok:#3cc7ae; --warn:#f0a83a; --down:#ff7b68; --focus:#8fb0ff; --tbc-bg:#3a2a08; --tbc-line:#f0a83a;
  --logo-dots:var(--sky); color-scheme:dark}
:root.logo-a{--logo-body:var(--blue); --logo-dots:var(--blue)}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.55 var(--f-body);-webkit-font-smoothing:antialiased}
a{color:var(--blue);text-underline-offset:3px}
a:hover{color:var(--blue-deep)}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
h1,h2,h3{font-family:var(--f-head);font-weight:var(--head-weight);text-wrap:balance;margin:0;letter-spacing:-.015em}
.label{font:500 12px/16px var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
/* header */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--surface);border-bottom:1px solid var(--rule)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:14px}
.logo{display:block;line-height:0}
.logo svg{height:30px;width:auto;display:block}
.logo .b{fill:var(--logo-body)}.logo .d{fill:var(--logo-dots)}.logo .w{fill:var(--logo-word)}
nav{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
nav a{color:var(--ink);text-decoration:none;font-weight:500;font-size:15px;padding:8px 12px;border-radius:2px}
nav a:hover{background:var(--wash);color:var(--ink)}
.btn{display:inline-flex;align-items:center;gap:8px;font:600 15px/20px var(--f-body);padding:12px 18px;border-radius:2px;border:1px solid transparent;text-decoration:none;cursor:pointer;transition:background-color .14s ease-out,border-color .14s ease-out}
.btn-primary{background:var(--blue);color:var(--on-blue)}
.btn-primary:hover{background:var(--blue-deep);color:var(--on-blue)}
.btn-secondary{background:var(--surface);color:var(--ink);border-color:var(--rule-strong)}
.btn-secondary:hover{border-color:var(--ink);color:var(--ink)}
nav .btn{padding:8px 14px;margin-left:8px;font-size:14px}
@media (max-width:720px){nav a:not(.btn){display:none}}

/* hero */
.hero{padding-block:clamp(48px,8vw,96px) clamp(48px,7vw,88px)}
.hero .wrap{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,5vw,72px);align-items:start}
.hero h1{font-size:clamp(38px,5.6vw,64px);line-height:1.02;letter-spacing:-.025em;margin-top:18px;max-width:14ch}
.lead{font-size:clamp(17px,1.6vw,19px);line-height:1.55;color:var(--muted);max-width:52ch;margin:22px 0 0}
.lead strong{color:var(--ink);font-weight:600}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px;align-items:center}
.direct{font:400 14px/20px var(--f-mono);color:var(--muted);margin-top:18px;display:flex;flex-wrap:wrap;gap:6px 18px}
.direct span{user-select:all;color:var(--ink)}
@media (max-width:860px){.hero .wrap{grid-template-columns:minmax(0,1fr)}}

/* layer stack */
.stack{background:var(--surface);border:1px solid var(--rule);border-radius:0 28px 0 28px;overflow:hidden;min-width:0}
.stack header{display:flex;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid var(--rule);background:var(--sunken)}
.stack ol{list-style:none;margin:0;padding:8px 0}
.stack li{display:grid;grid-template-columns:28px 14px minmax(0,1fr);gap:12px;align-items:center;padding:9px 18px;position:relative}
.stack li::after{content:"";position:absolute;left:calc(18px + 28px + 12px + 6px);top:0;bottom:0;width:2px;background:var(--rule-strong)}
.stack li:first-child::after{top:50%}
.stack li:last-child::after{bottom:50%}
.stack .n{font:500 12px/16px var(--f-mono);color:var(--muted);letter-spacing:.04em}
.stack .node{width:14px;height:14px;background:var(--ink);position:relative;z-index:1}
.stack li:first-child .node,.stack li:last-child .node{background:var(--blue)}
.stack .t{display:flex;flex-direction:column;gap:2px;min-width:0;border-bottom:1px solid var(--rule);padding-bottom:9px}
.stack li:last-child .t{border-bottom:0;padding-bottom:0}
.stack b{font:700 16px/1.3 var(--f-head)}
.stack em{font:400 12px/16px var(--f-mono);font-style:normal;color:var(--muted)}
.stack footer{padding:12px 18px;border-top:1px solid var(--rule);font-size:13px;color:var(--muted);background:var(--sunken)}
/* run block */
.run{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(24px,4vw,64px);align-items:start;margin-top:48px;padding-top:40px;border-top:1px solid var(--rule)}
.run h3{font-size:clamp(22px,2.2vw,26px);line-height:1.2;margin-top:10px}
.run p{color:var(--muted);margin:12px 0 0;max-width:52ch}
@media (max-width:860px){.run{grid-template-columns:minmax(0,1fr)}}
/* morning check panel */
.check{background:var(--surface);border:1px solid var(--rule);border-radius:0 28px 0 28px;overflow:hidden;min-width:0}
.check header{display:flex;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid var(--rule);background:var(--sunken)}
.check ol{list-style:none;margin:0;padding:6px 0}
.check li{display:grid;grid-template-columns:76px minmax(0,1fr) auto;gap:12px;align-items:baseline;padding:10px 18px;font:400 13px/18px var(--f-mono);border-bottom:1px solid var(--rule)}
.check li:last-child{border-bottom:0}
.check .k{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-size:11px}
.check .v{color:var(--ink);min-width:0;overflow-wrap:anywhere}
.check footer{padding:12px 18px;border-top:1px solid var(--rule);font-size:13px;color:var(--muted)}
.st{font:500 11px/14px var(--f-mono);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.st::before{margin-right:5px;font-size:9px}
.st.ok{color:var(--ok)}.st.ok::before{content:"●"}
.st.warn{color:var(--warn)}.st.warn::before{content:"▲"}
.st.fix{color:var(--blue)}.st.fix::before{content:"◆"}

/* sections */
section.band{border-top:1px solid var(--rule);padding-block:clamp(56px,7vw,96px)}
.sec-head{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(24px,4vw,64px);align-items:start}
.sec-head h2{font-size:clamp(28px,3vw,36px);line-height:1.1;margin-top:10px}
.sec-head p{margin:0;color:var(--muted);max-width:60ch;font-size:17px}
@media (max-width:860px){.sec-head{grid-template-columns:minmax(0,1fr)}}

.who{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:clamp(20px,3vw,40px);margin-top:48px}
.who > div{border-top:2px solid var(--ink);padding-top:18px}
.who h3{font-size:20px;line-height:1.25}
.who p{margin:10px 0 0;color:var(--muted)}


.svc{list-style:none;margin:48px 0 0;padding:0;border-top:1px solid var(--rule)}
.svc li{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,4fr) minmax(0,5fr);gap:clamp(16px,3vw,40px);padding-block:24px;border-bottom:1px solid var(--rule);align-items:baseline}
.svc .label{color:var(--blue)}
.svc h3{font-size:20px;line-height:1.3}
.svc p{margin:0;color:var(--muted)}
@media (max-width:860px){.svc li{grid-template-columns:minmax(0,1fr);gap:6px}}

.steps{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;counter-reset:s}
.steps li{padding:22px 22px 26px 0;border-top:1px solid var(--rule);position:relative;counter-increment:s}
.steps li + li{padding-left:22px;border-left:1px solid var(--rule)}
.steps li::before{content:counter(s);display:block;font:500 13px/16px var(--f-mono);color:var(--blue);margin-bottom:14px}
.steps h3{font-size:19px;line-height:1.3}
.steps p{margin:10px 0 0;color:var(--muted);font-size:15px}
@media (max-width:1060px){.steps{grid-template-columns:repeat(2,minmax(0,1fr))}.steps li:nth-child(odd){padding-left:0;border-left:0}.steps li:nth-child(even){padding-left:22px;border-left:1px solid var(--rule)}}
@media (max-width:560px){.steps{grid-template-columns:minmax(0,1fr)}.steps li,.steps li + li{padding-left:0;border-left:0}}

.tags{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:36px 0 0;padding:0}
.tags li{font:500 13px/16px var(--f-mono);border:1px solid var(--rule);background:var(--surface);border-radius:2px;padding:7px 10px;color:var(--ink)}
.prose p{margin:0 0 14px;color:var(--muted);max-width:60ch;font-size:17px}
.prose p:last-child{margin-bottom:0}
.area{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,64px);margin-top:48px}
.area > div{border-top:2px solid var(--ink);padding-top:18px;min-width:0}
.area h3{font-size:22px;line-height:1.25;margin-top:10px}
.area p{color:var(--muted);margin:14px 0 0;max-width:52ch}
.places{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.places li{font:500 13px/16px var(--f-mono);border:1px solid var(--rule);background:var(--surface);border-radius:2px;padding:7px 10px}
@media (max-width:860px){.area{grid-template-columns:minmax(0,1fr)}}
/* contact */
.contact{padding-block:clamp(56px,7vw,96px);border-top:1px solid var(--rule)}
.panel{background:var(--navy);color:var(--on-navy);border-radius:0 40px 0 40px;padding:clamp(28px,5vw,56px);display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(28px,5vw,64px);align-items:end}
.panel .label{color:var(--on-navy-muted)}
.panel h2{font-size:clamp(28px,3.4vw,42px);line-height:1.08;margin-top:12px}
.panel p{color:var(--on-navy-muted);margin:16px 0 0;max-width:46ch}
.panel :root:not(.hide-tbc) .panel .lines{display:grid;gap:14px}
.line{display:grid;gap:4px;border-top:1px solid rgba(255,255,255,.22);padding-top:12px}
.line .val{font:500 clamp(17px,2vw,22px)/1.3 var(--f-mono);color:var(--on-navy);user-select:all;overflow-wrap:anywhere}
.line small{color:var(--on-navy-muted);font-size:13px}
.copy{justify-self:start;font:500 12px/16px var(--f-mono);letter-spacing:.06em;text-transform:uppercase;background:transparent;color:var(--on-navy);border:1px solid rgba(255,255,255,.4);border-radius:2px;padding:6px 10px;cursor:pointer;margin-top:6px}
.copy:hover{border-color:#fff}
.panel :focus-visible{outline-color:#fff}
@media (max-width:860px){.panel{grid-template-columns:minmax(0,1fr)}}

footer.site{border-top:1px solid var(--rule);padding-block:32px 48px;color:var(--muted);font-size:14px}
footer.site .wrap{display:flex;flex-wrap:wrap;gap:12px 32px;align-items:center;justify-content:space-between}
footer.site .logo svg{height:22px}

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

.line a.val.book{color:var(--on-navy);text-decoration:none;border-bottom:1px solid rgba(255,255,255,.4);justify-self:start}
.line a.val.book:hover{border-bottom-color:#fff}

/* links: email + phone */
.direct a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--rule-strong)}
.direct a:hover{color:var(--blue);border-bottom-color:var(--blue)}
.line a.val.mail{color:var(--on-navy);text-decoration:none;border-bottom:1px solid rgba(255,255,255,.4);justify-self:start}
.line a.val.mail:hover{border-bottom-color:#fff}
footer.site a{color:inherit;text-decoration:none}
footer.site a:hover{color:var(--ink);text-decoration:underline}

/* section colour: alternating grounds + two accent bands */
#who,#builds{background:var(--surface)}
#pricing{background:var(--wash);border-top-color:transparent}
#about{background:var(--navy);color:var(--on-navy);border-top-color:transparent}
#about .label,#about .sec-head p{color:var(--on-navy-muted)}
#about :focus-visible{outline-color:#fff}
#area{border-top-color:transparent}
.who > div{border-top-color:var(--blue)}