/* ============================================================
   K2KONNECT ELECTRICAL
   Visual system: the site as an AS/NZS 3000 electrical drawing.
   Cool paper, blueprint linework, one hue: the logo blue. Red is emergency only.
   Golden Marketing, Aug 2026. See DESIGN.md at repo root.
   ============================================================ */

/* ONE HUE. The logo is two inks, so the site is two inks.
   Everything below sits on hue 240, the logo's own blue, including the paper and the
   text. The only exception is --isolate, which is confined to the emergency page.

   This replaced a seven-hue palette (warm paper 85, neutral ink 286, blue 240, gold 78
   and 66, green 152, red 27) that had accumulated around a two-colour logo. Gold and
   green are gone. Do not reintroduce a second accent: if something needs emphasis, use
   lightness and weight, not a new hue. */
:root{
  /* surface — cool paper, tinted to the brand hue rather than warm */
  --paper:oklch(0.977 0.004 240);
  --paper-2:oklch(0.952 0.006 240);
  --paper-3:oklch(0.928 0.008 240);

  /* brand — sampled from the final logo Kishan supplied 8 Aug 2026.
     #2491D0 is the exact ink in K2Konnect_Logo_Colour.pdf. Do not drift it. */
  --brand:#2491D0;
  --brand-2:oklch(0.50 0.130 240.4);  /* the working blue: CTA fills and accent text */

  /* linework + text */
  --ink:oklch(0.22 0.010 240);
  --ink-2:oklch(0.46 0.010 240);
  --ink-3:oklch(0.52 0.008 240);

  /* drawing furniture — same hue, chroma held low so linework stays quiet and the
     logo and the CTAs are still the strongest blue on the page */
  --blue:oklch(0.63 0.075 240.4);
  --blue-1:oklch(0.90 0.030 240.4);
  --blue-2:oklch(0.82 0.045 240.4);

  /* the one exception, and it earns it: 000 and the emergency page only */
  --isolate:oklch(0.52 0.205 27);

  --rule:1px;
  --ease:cubic-bezier(0.22,1,0.36,1);
  --gut:clamp(18px,4vw,44px);
}

*{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  font-family:'Chivo',ui-sans-serif,system-ui,sans-serif;
  color:var(--ink);
  background:var(--paper);
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  /* drafting-film grid */
  background-image:
    repeating-linear-gradient(90deg,oklch(0.63 0.075 240.4 / .055) 0 1px,transparent 1px 64px),
    repeating-linear-gradient(0deg,oklch(0.63 0.075 240.4 / .055) 0 1px,transparent 1px 64px);
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
:focus-visible{outline:3px solid var(--brand-2);outline-offset:3px;}

h1,h2,h3{
  font-family:'Saira Condensed','Chivo',sans-serif;
  font-weight:800;
  line-height:1.02;
  letter-spacing:-0.005em;
  text-transform:uppercase;
}

/* annotation type: sheet numbers, circuit refs, labels */
.anno{
  font-family:'Martian Mono','Chivo',ui-monospace,monospace;
  font-size:clamp(9.5px,1.1vw,11px);
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--ink-2);
  font-weight:500;
}
/* drawing references: sheet no, circuit ref, revision, suburb. Not energised — blue. */
.anno-ref{color:var(--brand-2);}

/* ---------- sheet ---------- */
.sheet{
  max-width:1240px;
  margin:0 auto;
  padding:0 var(--gut);
  position:relative;
}
/* The fixed sheet-edge frame was removed 9 Aug 2026. It was position:fixed at z-index 60,
   above the sticky masthead, so its top border drew a line straight through the logo and
   its bottom border cut across live text at whatever point the viewport happened to end.
   It read as a rendering artifact rather than a drawing sheet edge. Do not reinstate it:
   the sheet metaphor is already carried by the drafting grid, the sheet numbers, the title
   block and the riser diagram, none of which sit on top of content. */

/* ---------- masthead ---------- */
.mast{
  position:sticky;top:0;z-index:50;
  background:oklch(0.977 0.004 240 / .94);
  backdrop-filter:blur(8px);
  border-bottom:var(--rule) solid var(--ink);
}
.mast-in{
  max-width:1240px;margin:0 auto;padding:10px var(--gut);
  display:flex;align-items:center;gap:20px;
}
.mast-logo img{height:52px;width:auto;transition:height .3s var(--ease);}
.mast.stuck .mast-logo img{height:40px;}
@media(max-width:420px){.mast-logo img{height:42px;}}
.mast-nav{display:none;gap:26px;margin-left:auto;align-items:center;}
.mast-nav a{
  font-size:13.5px;font-weight:500;color:var(--ink-2);
  padding:6px 0;border-bottom:2px solid transparent;transition:color .2s,border-color .2s;
}
@media(hover:hover){.mast-nav a:hover{color:var(--ink);border-bottom-color:var(--brand);}}
.mast-nav a[aria-current]{color:var(--ink);border-bottom-color:var(--brand);}
.mast-right{margin-left:auto;display:flex;align-items:center;gap:12px;}
@media(min-width:1000px){.mast-nav{display:flex;}.mast-right{margin-left:0;}}

/* terminal-block button */
.tb{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-family:'Saira Condensed',sans-serif;
  font-weight:700;font-size:16px;letter-spacing:0.045em;text-transform:uppercase;
  padding:13px 22px;min-height:46px;
  border:2px solid var(--ink);
  background:var(--brand);color:var(--ink);
  border-radius:0;
  transition:transform .14s var(--ease),box-shadow .2s var(--ease);
  box-shadow:3px 3px 0 var(--ink);
  white-space:nowrap;
}
.tb svg{width:17px;height:17px;flex:none;}
@media(hover:hover){.tb:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--ink);}}
.tb:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink);}
.tb-ghost{background:transparent;color:var(--ink);box-shadow:3px 3px 0 var(--brand);}
@media(hover:hover){.tb-ghost:hover{background:var(--paper-2);box-shadow:5px 5px 0 var(--brand);}}
.tb-sm{font-size:14px;padding:9px 16px;min-height:42px;box-shadow:2px 2px 0 var(--ink);}
.tb-danger{background:var(--isolate);color:var(--paper);border-color:var(--isolate);box-shadow:3px 3px 0 var(--ink);}

.burger{
  display:flex;flex-direction:column;gap:5px;background:none;
  border:2px solid var(--ink);padding:9px;cursor:pointer;min-height:44px;min-width:44px;
  align-items:center;justify-content:center;
}
.burger span{width:20px;height:2px;background:var(--ink);display:block;}
@media(min-width:1000px){.burger{display:none;}}
.drawer{display:none;border-bottom:var(--rule) solid var(--ink);background:var(--paper);}
.drawer.open{display:block;}
.drawer a{
  display:flex;justify-content:space-between;align-items:center;gap:14px;
  padding:15px var(--gut);border-top:var(--rule) solid var(--blue-1);
  font-weight:500;font-size:16px;min-height:52px;
}
.drawer a .anno{color:var(--ink-3);}
.drawer .drawer-cta{padding:18px var(--gut);border-top:var(--rule) solid var(--ink);}
.drawer .drawer-cta .tb{width:100%;}

/* ---------- hero ---------- */
.hero{padding:clamp(34px,5vw,60px) 0 clamp(40px,6vw,72px);}
.hero-head{
  display:flex;justify-content:space-between;align-items:baseline;gap:20px;
  padding-bottom:12px;border-bottom:2px solid var(--ink);flex-wrap:wrap;
}
.hero-grid{
  display:grid;grid-template-columns:1fr;gap:clamp(30px,4vw,54px);
  padding-top:clamp(26px,3.5vw,44px);align-items:start;
}
@media(min-width:940px){.hero-grid{grid-template-columns:1.06fr 0.94fr;gap:clamp(40px,4.5vw,68px);}}

.hero h1{
  font-size:clamp(40px,7.6vw,84px);
  max-width:13ch;
}
.hero h1 .live{
  color:var(--brand-2);
  position:relative;
  display:inline-block;
}
/* live conductor underline: the word is an energised circuit */
.hero h1 .live::after{
  content:'';position:absolute;left:0;right:0;bottom:0.06em;height:0.075em;
  background:var(--brand);
  transform-origin:left;
  animation:energise 1s var(--ease) .35s both;
}
@keyframes energise{from{transform:scaleX(0);}to{transform:scaleX(1);}}

.hero-sub{
  font-size:clamp(16px,1.75vw,18.5px);
  color:var(--ink-2);max-width:52ch;margin:22px 0 0;
}
.hero-acts{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px;}

/* spec strip: replaces the banned tick-list / proof-item pattern */
.spec{
  margin-top:clamp(28px,3.5vw,40px);
  border-top:var(--rule) solid var(--ink);
  display:grid;grid-template-columns:1fr;
}
@media(min-width:560px){.spec{grid-template-columns:repeat(3,1fr);}}
.spec div{
  padding:14px 0 14px 0;
  border-bottom:var(--rule) solid var(--blue-1);
}
@media(min-width:560px){
  .spec div{padding:14px 16px;border-bottom:0;border-left:var(--rule) solid var(--blue-1);}
  .spec div:first-child{padding-left:0;border-left:0;}
}
.spec b{display:block;font-family:'Saira Condensed',sans-serif;font-weight:700;
  font-size:19px;text-transform:uppercase;letter-spacing:0.01em;margin-top:5px;}

/* ---------- riser diagram (hero schematic) ---------- */
.riser{
  border:var(--rule) solid var(--ink);
  background:var(--paper-2);
  position:relative;
}
.riser-cap{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:9px 14px;border-bottom:var(--rule) solid var(--ink);background:var(--paper);
}
.riser svg{display:block;width:100%;height:auto;padding:16px 14px;color:var(--ink);}
/* schematic label type */
.dwg-lbl{font-family:'Saira Condensed',sans-serif;font-weight:700;font-size:13px;
  letter-spacing:0.07em;fill:var(--ink);text-transform:uppercase;}
.dwg-lbl-sm{font-family:'Saira Condensed',sans-serif;font-weight:700;font-size:11px;
  letter-spacing:0.05em;fill:var(--ink);text-transform:uppercase;}
.dwg-sm{font-family:'Martian Mono',monospace;font-size:8.5px;font-weight:500;
  letter-spacing:0.08em;fill:var(--brand-2);}
.riser svg line,.riser svg rect,.riser svg circle{stroke:var(--ink);}
/* Conductor runs are drawn in the brand blue: it is a blueprint, so blue linework is
   literally correct, and it is what stops the logo being the only blue on the page.
   Boxes and symbols stay ink so the hierarchy of the drawing survives. */
.riser svg .rl{stroke:var(--brand);}
.riser-foot{
  padding:10px 14px;border-top:var(--rule) solid var(--blue-1);
  display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;
}
/* Draw-on animation for the schematic.
   Held at offset until .riser gets .in from the IntersectionObserver, so it plays
   when the diagram is actually on screen rather than finishing off-screen on load.
   Total run is ~1.4s: any longer and a scrolling visitor sees a half-drawn circuit. */
.riser .rl{stroke-dasharray:var(--len,400);stroke-dashoffset:var(--len,400);}
.riser .node{opacity:0;}
.riser.in .rl{animation:draw .55s var(--ease) forwards;}
.riser.in .node{animation:pop .3s var(--ease) forwards;}
@keyframes draw{to{stroke-dashoffset:0;}}
@keyframes pop{to{opacity:1;}}
/* no-JS and reduced-motion fallback: show the finished drawing */
.no-js .riser .rl,html:not(.js) .riser .rl{stroke-dashoffset:0;}
.no-js .riser .node,html:not(.js) .riser .node{opacity:1;}

/* ---------- section scaffolding ---------- */
.sec{padding:clamp(52px,7vw,92px) 0;position:relative;}
.sec-sunk{background:var(--paper-2);border-top:var(--rule) solid var(--blue-1);border-bottom:var(--rule) solid var(--blue-1);}
.sec-head{
  display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;
  padding-bottom:14px;border-bottom:2px solid var(--ink);margin-bottom:clamp(28px,3.5vw,44px);
}
.sec-no{
  font-family:'Martian Mono',monospace;font-size:clamp(11px,1.3vw,13px);
  font-weight:600;color:var(--brand-2);letter-spacing:0.1em;flex:none;
}
.sec-head h2{font-size:clamp(27px,4.2vw,46px);flex:1;min-width:min(100%,16ch);}
.sec-note{color:var(--ink-2);font-size:15px;max-width:38ch;margin-left:auto;}

/* ---------- switchboard schedule (services) ---------- */
.sched{border-top:2px solid var(--ink);}
.sched-row{
  display:grid;grid-template-columns:auto 1fr auto;
  gap:14px 18px;align-items:start;
  padding:20px 4px;border-bottom:var(--rule) solid var(--blue-1);
  position:relative;transition:background .2s var(--ease);
}
@media(min-width:760px){.sched-row{grid-template-columns:74px 1fr 190px auto;align-items:center;}}
@media(hover:hover){.sched-row:hover{background:oklch(0.63 0.13 240 / .06);}}
.sched-ref{
  font-family:'Martian Mono',monospace;font-size:12px;font-weight:600;
  color:var(--ink-2);letter-spacing:0.06em;display:flex;align-items:center;gap:8px;
}
/* Drawn as an open terminal, filled solid on hover: the same drawn-then-live
   logic the rest of the page runs on, now carried by weight rather than a second hue. */
.sched-ref::before{
  content:'';width:9px;height:9px;border:2px solid var(--brand-2);border-radius:50%;flex:none;
  transition:background .2s var(--ease);
}
.sched-row:hover .sched-ref::before{background:var(--brand);}
.sched-t h3{font-size:clamp(19px,2.2vw,25px);margin-bottom:3px;}
.sched-t p{color:var(--ink-2);font-size:14.5px;line-height:1.55;max-width:46ch;}
.sched-rate{grid-column:1/-1;}
@media(min-width:760px){.sched-rate{grid-column:auto;}}
.sched-go{
  font-family:'Saira Condensed',sans-serif;font-weight:700;text-transform:uppercase;
  font-size:14px;letter-spacing:0.05em;color:var(--brand-2);
  display:flex;align-items:center;gap:7px;white-space:nowrap;
}
.sched-go svg{width:16px;height:16px;transition:transform .25s var(--ease);}
@media(hover:hover){.sched-row:hover .sched-go svg{transform:translateX(5px);}}

/* ---------- method: circuit run down the page ---------- */
.run{position:relative;padding-left:34px;}
.run::before{
  content:'';position:absolute;left:8px;top:6px;bottom:6px;width:2px;
  background:linear-gradient(180deg,var(--brand) 0%,var(--blue-2) 100%);
}
.run-step{position:relative;padding:0 0 clamp(28px,3.5vw,40px);}
.run-step:last-child{padding-bottom:0;}
.run-step::before{
  content:'';position:absolute;left:-30px;top:7px;width:12px;height:12px;
  border:2px solid var(--ink);background:var(--paper);border-radius:50%;
}
.run-step.on::before{background:var(--brand);}
.run-step h3{font-size:clamp(19px,2.2vw,24px);margin:6px 0 7px;}
.run-step p{color:var(--ink-2);font-size:15.5px;max-width:54ch;}

/* ---------- annotation callout (replaces banned side-stripe) ---------- */
.callout{
  border:var(--rule) solid var(--ink);
  background:var(--paper);
  padding:20px 22px;margin:28px 0;position:relative;
}
.callout::before{
  content:'';position:absolute;left:-1px;top:-1px;width:26px;height:26px;
  border-top:3px solid var(--brand);border-left:3px solid var(--brand);
}
.callout b{
  display:block;font-family:'Saira Condensed',sans-serif;font-weight:700;
  text-transform:uppercase;font-size:18px;letter-spacing:0.02em;margin-bottom:7px;
}
.callout p{color:var(--ink-2);font-size:15.5px;margin:0;max-width:60ch;}
.callout-danger{border-color:var(--isolate);background:oklch(0.52 0.205 27 / .045);}
.callout-danger::before{border-color:var(--isolate);}
.callout-danger b{color:var(--isolate);}

/* ---------- contact plate ---------- */
.plate{
  border:2px solid var(--ink);background:var(--paper);
  display:grid;grid-template-columns:1fr;
}
@media(min-width:860px){.plate{grid-template-columns:1.1fr 0.9fr;}}
.plate-l{padding:clamp(26px,3.4vw,42px);}
.plate-r{
  padding:clamp(26px,3.4vw,42px);
  border-top:2px solid var(--ink);background:var(--ink);color:var(--paper);
}
@media(min-width:860px){.plate-r{border-top:0;border-left:2px solid var(--ink);}}
.plate-r h3{color:var(--paper);font-size:clamp(24px,3vw,32px);margin-bottom:12px;}
.plate-r p{color:oklch(0.977 0.004 240 / .74);font-size:16px;margin-bottom:22px;max-width:36ch;}
.plate-r .anno{color:oklch(0.977 0.004 240 / .6);}
.plate-r .tb{width:100%;}
.plate-r .tb-ghost{color:var(--paper);border-color:var(--paper);box-shadow:3px 3px 0 oklch(0.977 0.004 240 / .3);margin-top:12px;}
@media(hover:hover){.plate-r .tb-ghost:hover{background:oklch(0.977 0.004 240 / .1);}}
.dl{display:grid;gap:0;border-top:var(--rule) solid var(--blue-1);margin-top:20px;}
.dl > div{
  display:grid;grid-template-columns:1fr;gap:2px;
  padding:14px 0;border-bottom:var(--rule) solid var(--blue-1);
}
@media(min-width:520px){.dl > div{grid-template-columns:140px 1fr;gap:16px;align-items:baseline;}}
.dl b{font-size:17px;font-weight:700;word-break:break-word;}
.dl small{color:var(--ink-2);font-size:13.5px;display:block;}

/* ---------- coverage ---------- */
.cov{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));
  border-top:var(--rule) solid var(--ink);border-left:var(--rule) solid var(--blue-1);
}
.cov span{
  padding:11px 14px;font-size:14.5px;min-height:46px;
  border-bottom:var(--rule) solid var(--blue-1);border-right:var(--rule) solid var(--blue-1);
  display:flex;align-items:center;gap:9px;white-space:nowrap;
}
.cov span::before{content:'';width:5px;height:5px;background:var(--brand);flex:none;}
.cov span.core{font-weight:700;}
.cov span.core::before{background:var(--brand);width:7px;height:7px;}
.map{
  margin-top:26px;border:var(--rule) solid var(--ink);
  aspect-ratio:16/7;position:relative;overflow:hidden;
}
@media(max-width:640px){.map{aspect-ratio:4/3;}}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(.35) contrast(1.05);}

/* ---------- title block (footer) ---------- */
.title-block{
  border-top:2px solid var(--ink);background:var(--paper-2);
  padding:clamp(30px,4vw,48px) 0 22px;
}
.tb-grid{display:grid;grid-template-columns:1fr;gap:28px;}
@media(min-width:760px){.tb-grid{grid-template-columns:1.5fr 1fr 1fr;gap:34px;}}
.tb-grid img{height:56px;width:auto;}
.tb-grid p{font-size:14px;color:var(--ink-2);margin-top:14px;max-width:34ch;}
.tb-col h4{
  font-family:'Martian Mono',monospace;font-size:10.5px;font-weight:600;
  letter-spacing:0.14em;text-transform:uppercase;color:var(--ink-2);
  padding-bottom:8px;border-bottom:var(--rule) solid var(--ink);margin-bottom:6px;
}
.tb-col a{display:block;padding:8px 0;font-size:14.5px;border-bottom:var(--rule) solid var(--blue-1);}
@media(hover:hover){.tb-col a:hover{color:var(--brand-2);}}
/* the actual drawing title block: business, licence, revision */
.stamp{
  margin-top:clamp(28px,3.5vw,42px);
  border:var(--rule) solid var(--ink);
  display:grid;grid-template-columns:1fr;
}
@media(min-width:640px){.stamp{grid-template-columns:2fr 1fr 1fr 1fr;}}
.stamp div{
  padding:11px 14px;border-bottom:var(--rule) solid var(--blue-1);
}
@media(min-width:640px){
  .stamp div{border-bottom:0;border-right:var(--rule) solid var(--blue-1);}
  .stamp div:last-child{border-right:0;}
}
.stamp b{display:block;font-size:14px;font-weight:700;margin-top:3px;}
.by{text-align:center;font-size:12px;color:var(--ink-3);margin-top:18px;}
.by a{color:var(--ink-2);}

/* ---------- service page ---------- */
.sp-head{padding:clamp(30px,4vw,50px) 0 clamp(30px,4vw,46px);border-bottom:2px solid var(--ink);}
.crumb{display:flex;gap:8px;align-items:center;margin-bottom:18px;}
.crumb a{color:var(--ink-2);}
@media(hover:hover){.crumb a:hover{color:var(--brand-2);}}
.sp-head h1{font-size:clamp(34px,6.2vw,66px);max-width:15ch;}
.sp-head h1 .live{color:var(--brand-2);}
.sp-lead{font-size:clamp(16px,1.7vw,18px);color:var(--ink-2);max-width:56ch;margin:20px 0 0;}
.sp-acts{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px;}

.sp-body{display:grid;grid-template-columns:1fr;gap:clamp(34px,4vw,56px);align-items:start;}
@media(min-width:960px){.sp-body{grid-template-columns:1fr 316px;}}
.prose h2{font-size:clamp(24px,3.2vw,36px);margin:0 0 14px;padding-bottom:10px;border-bottom:2px solid var(--ink);}
.prose h2:not(:first-child){margin-top:clamp(40px,4.5vw,58px);}
.prose h3{font-size:19px;margin:26px 0 7px;}
.prose p{color:var(--ink-2);font-size:16.5px;line-height:1.72;margin-bottom:15px;max-width:66ch;}
.prose a{color:var(--brand-2);border-bottom:1px solid var(--brand);}
/* numbered schedule list, not a bullet list */
.prose ol{list-style:none;counter-reset:sch;margin:22px 0 26px;border-top:var(--rule) solid var(--blue-1);}
.prose ol li{
  counter-increment:sch;position:relative;
  padding:15px 0 15px 52px;border-bottom:var(--rule) solid var(--blue-1);
  font-size:16px;color:var(--ink-2);line-height:1.6;
}
.prose ol li::before{
  content:counter(sch,decimal-leading-zero);
  position:absolute;left:0;top:15px;
  font-family:'Martian Mono',monospace;font-size:11.5px;font-weight:600;
  color:var(--brand-2);letter-spacing:0.06em;
}
.prose ol li strong{color:var(--ink);font-weight:700;}

.aside{position:sticky;top:88px;display:grid;gap:18px;}
@media(max-width:959px){.aside{position:static;}}
.aside-card{border:2px solid var(--ink);background:var(--ink);color:var(--paper);padding:24px;}
.aside-card h3{color:var(--paper);font-size:21px;margin-bottom:9px;}
.aside-card p{color:oklch(0.977 0.004 240 / .74);font-size:14.5px;margin-bottom:18px;}
.aside-card .tb{width:100%;}
.aside-card .tb-ghost{color:var(--paper);border-color:var(--paper);box-shadow:3px 3px 0 oklch(0.977 0.004 240 / .3);margin-top:10px;}
.aside-card .anno{color:oklch(0.977 0.004 240 / .55);display:block;text-align:center;margin-top:14px;}
.aside-links{border:var(--rule) solid var(--ink);background:var(--paper);padding:20px;}
.aside-links h4{
  font-family:'Martian Mono',monospace;font-size:10.5px;font-weight:600;letter-spacing:0.14em;
  text-transform:uppercase;color:var(--ink-2);padding-bottom:8px;
  border-bottom:var(--rule) solid var(--ink);margin-bottom:4px;
}
.aside-links a{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:11px 0;border-bottom:var(--rule) solid var(--blue-1);font-size:14.5px;font-weight:500;
}
.aside-links a:last-child{border-bottom:0;}
.aside-links a::after{content:'→';color:var(--brand-2);}
@media(hover:hover){.aside-links a:hover{color:var(--brand-2);}}

/* FAQ */
.faq{border-top:2px solid var(--ink);margin-top:22px;}
.faq details{border-bottom:var(--rule) solid var(--blue-1);}
.faq summary{
  cursor:pointer;padding:17px 40px 17px 0;position:relative;list-style:none;
  font-family:'Saira Condensed',sans-serif;font-weight:700;text-transform:uppercase;
  font-size:17px;letter-spacing:0.01em;min-height:52px;display:flex;align-items:center;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{
  content:'';position:absolute;right:6px;top:50%;width:13px;height:13px;margin-top:-6px;
  border-right:2px solid var(--brand-2);border-bottom:2px solid var(--brand-2);
  transform:rotate(45deg);transition:transform .25s var(--ease);
}
.faq details[open] summary::after{transform:rotate(225deg);}
.faq details p{padding:0 0 18px;color:var(--ink-2);font-size:15.5px;line-height:1.7;max-width:62ch;margin:0;}

/* bottom CTA band */
.band{background:var(--ink);color:var(--paper);border-top:2px solid var(--ink);}
.band .sheet{padding-top:clamp(44px,5.5vw,68px);padding-bottom:clamp(44px,5.5vw,68px);}
.band h2{color:var(--paper);font-size:clamp(26px,4vw,44px);max-width:18ch;}
.band p{color:oklch(0.977 0.004 240 / .72);font-size:16.5px;max-width:52ch;margin:14px 0 26px;}
.band .anno{color:oklch(0.977 0.004 240 / .58);}
.band .tb-ghost{color:var(--paper);border-color:var(--paper);box-shadow:3px 3px 0 oklch(0.977 0.004 240 / .3);}
@media(hover:hover){.band .tb-ghost:hover{background:oklch(0.977 0.004 240 / .1);}}

/* mobile call bar: the phone number is the interface */
.callbar{
  position:fixed;left:0;right:0;bottom:0;z-index:70;
  border-top:2px solid var(--ink);background:var(--brand);
  padding:10px 14px calc(10px + env(safe-area-inset-bottom));
  display:flex;gap:12px;align-items:center;
}
.callbar a{
  flex:1;display:flex;align-items:center;justify-content:center;gap:9px;
  font-family:'Saira Condensed',sans-serif;font-weight:800;text-transform:uppercase;
  font-size:17px;letter-spacing:0.04em;min-height:46px;color:var(--ink);
}
.callbar svg{width:18px;height:18px;}
@media(min-width:760px){.callbar{display:none;}}
@media(max-width:759px){body{padding-bottom:74px;}}

/* reveal */
.rv{opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease),transform .6s var(--ease);transition-delay:calc(var(--i,0)*60ms);}
.rv.in{opacity:1;transform:none;}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}
  html{scroll-behavior:auto;}
  .rv{opacity:1;transform:none;}
  .riser .rl{stroke-dashoffset:0;}
  .riser .node{opacity:1;}
  .hero h1 .live::after{transform:scaleX(1);}
}

@media print{
  .mast,.callbar,.band{display:none;}
  body{background:#fff;}
}