/* Steel Bridge, "steel and signal" (28 Sep 2026).
   Same class names as the live stylesheet, new dress: cool steel greys and graphite, lime as the one signal colour,
   General Sans with Zodiak italic, full-width bands instead of inset panels, artwork drawn in code (signature/art.js).
   Built into signature/out/ by signature/build.js. No photograph is referenced from this file. */

/* The two typefaces are served by the site itself (signature/src/fonts/, from Fontshare). No visitor's browser
   is sent to a font server. */
@font-face{font-family:'General Sans';src:url('../fonts/general-sans-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'General Sans';src:url('../fonts/general-sans-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'General Sans';src:url('../fonts/general-sans-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'General Sans';src:url('../fonts/general-sans-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Zodiak';src:url('../fonts/zodiak-400-italic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}

:root{
  --ink:#0b0d10;--ink-2:#12151a;--ink-3:#1a1e24;--ink-4:#252a32;
  --bone:#eef0f3;--bone-2:#e3e6ea;--card:#f9fafb;--paper:var(--card);--paper-2:var(--bone-2);
  --line:#d3d8de;--line-dark:rgba(255,255,255,.1);
  --text:#0b0d10;--muted:#454b54;--muted-2:#5c636d;
  --white:#f5f6f8;--on-dark:#b4bac3;--on-dark-2:#878e99;
  --lime:#dbff73;--lime-hi:#e7ff9c;--blue:#0b0d10;--green:#1e9d54;--red:#b3261e;
  --ring:#e6e9ed;--ring-line:#d3d8de;--shine:#fff;
  --bezel:0 0 0 5px var(--ring),0 0 0 6px var(--ring-line),inset 0 1px 0 var(--shine);
  --r-xl:20px;--r-lg:14px;--r-md:10px;--r-sm:8px;--band:clamp(20px,2.4vw,32px);
  --gutter:clamp(22px,4vw,56px);--inset:0px;
  --font-sans:'General Sans',system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-serif:'Zodiak',"Iowan Old Style","Palatino Linotype",Georgia,serif;
  --font-mono:ui-monospace,"SF Mono","Cascadia Mono","Segoe UI Mono",Menlo,Consolas,monospace;
  --ease-out:cubic-bezier(.23,1,.32,1);--ease-in-out:cubic-bezier(.77,0,.175,1);--ease-drawer:cubic-bezier(.32,.72,0,1);
  --tick:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='M6.5 11.4l3 3 6-6.4' fill='none' stroke='%23dbff73' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --tick-ink:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='M6.5 11.4l3 3 6-6.4' fill='none' stroke='%230b0d10' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;-webkit-tap-highlight-color:transparent;scrollbar-color:#9aa1ab var(--bone)}
body{margin:0;font-family:var(--font-sans);font-size:17px;font-weight:400;color:var(--text);background:var(--bone);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:clip}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure,blockquote{margin:0}
h1,h2,h3,h4{font-weight:600;letter-spacing:-.025em;text-wrap:balance}
p,li,dd{text-wrap:pretty}
ul,ol{padding:0;list-style:none}
a{color:inherit;text-decoration:none;text-underline-offset:3px}
img,svg{display:block;max-width:100%}
button{font:inherit;color:inherit;cursor:pointer}
b,strong{font-weight:600}
::selection{background:var(--lime);color:var(--ink)}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:6px}
.top :focus-visible,.hero :focus-visible,.section--dark :focus-visible,.foot :focus-visible,.offer :focus-visible,.price-block--dark :focus-visible,.callout :focus-visible,.device :focus-visible{outline-color:var(--lime)}
input,textarea{caret-color:var(--ink);accent-color:var(--ink)}
[id]{scroll-margin-top:112px}

.wrap,.container{width:100%;max-width:1320px;margin:0 auto;padding:0 var(--gutter)}
.skip{position:absolute;left:16px;top:-80px;z-index:100;background:var(--lime);color:var(--ink);font-size:14px;font-weight:600;padding:12px 18px;border-radius:999px}
.skip:focus{top:16px}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

/* ---------- labels and headings ---------- */
.eyebrow,.hero-eyebrow{display:flex;align-items:center;gap:12px;font-family:var(--font-mono);font-size:12px;line-height:1.4;font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--muted-2)}
.eyebrow::before,.hero-eyebrow::before{content:"";flex:none;width:18px;height:1px;background:currentColor}
.eyebrow--lime,.hero-eyebrow{color:var(--lime)}
.eyebrow--grey{color:var(--on-dark)}
.hero-eyebrow i{display:none}
.section-head--center .eyebrow{justify-content:center}
.h2{font-size:clamp(32px,4vw,60px);line-height:1.04;font-weight:600;letter-spacing:-.032em;margin-top:20px}
.h3{font-size:clamp(28px,3.2vw,48px);line-height:1.06;letter-spacing:-.03em;margin-top:14px}
.split{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:clamp(28px,4vw,72px);align-items:end}
.split .lede{font-size:clamp(16.5px,1.3vw,18.5px);line-height:1.55;color:var(--muted);padding-bottom:6px;max-width:46ch}
.arrow{width:16px;height:16px;flex:none}

/* ---------- buttons and links ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;font-weight:600;letter-spacing:-.005em;line-height:1;white-space:nowrap;border:0;border-radius:999px;touch-action:manipulation;-webkit-user-select:none;user-select:none;transition:background-color .18s ease,border-color .18s ease,color .18s ease,transform .16s var(--ease-out)}
.btn:active{transform:scale(.97)}
.btn .arrow{width:30px;height:30px;padding:8px;border-radius:50%;background:var(--ink);color:var(--lime);transition:transform .3s var(--ease-out)}
.btn:has(.arrow){padding-right:8px}
.btn--lime{background:var(--lime);color:var(--ink);font-size:14px;height:46px;padding:0 20px}
.btn--hero,.btn--ghost,.btn--ink,.btn--outline,.btn--dark{font-size:16px;height:56px;padding:0 28px}
.btn--hero .arrow,.btn--ghost .arrow,.btn--ink .arrow,.btn--outline .arrow,.btn--dark .arrow{width:40px;height:40px;padding:12px}
.btn--ghost{border:1px solid rgba(255,255,255,.22);color:var(--white);background:rgba(255,255,255,.04)}
.btn--ink,.btn--dark{background:var(--ink);color:var(--white)}
.btn--ink .arrow,.btn--dark .arrow{background:var(--lime);color:var(--ink)}
.btn--outline{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}
.btn:disabled{opacity:.55;cursor:default;transform:none}
.btn-row{display:flex;gap:14px;flex-wrap:wrap}
.btn-row--center{justify-content:center}
.link{display:inline-flex;align-items:center;gap:10px;font-size:16px;font-weight:600;border-bottom:1.5px solid currentColor;padding-bottom:4px}
.link .arrow{transition:transform .3s var(--ease-out)}
.link--lime{color:var(--lime)}
.link--blue,.link--ink{color:var(--ink)}

/* ---------- header ---------- */
header.top{position:fixed;top:14px;left:0;right:0;z-index:60;pointer-events:none;transition:transform .32s var(--ease-drawer)}
header.top.is-away{transform:translateY(calc(-100% - 40px))}
header.top:has(:focus-visible){transform:none}
.nav{pointer-events:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;width:calc(100% - 28px);max-width:1180px;height:62px;padding:0 8px 0 24px;margin:0 auto;color:var(--white);background:rgba(11,13,16,.82);-webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4);border:1px solid rgba(255,255,255,.1);border-radius:999px;box-shadow:0 18px 40px -22px rgba(11,13,16,.7),inset 0 1px 0 rgba(255,255,255,.06);transition:background-color .3s ease,border-color .3s ease}
body.is-scrolled .nav{background:rgba(11,13,16,.92);border-color:rgba(255,255,255,.14)}
.logo{display:inline-flex;align-items:baseline;gap:6px;font-size:22px;font-weight:600;letter-spacing:-.04em;color:var(--white)}
.logo i{display:block;width:7px;height:7px;border-radius:2px;background:var(--lime);transition:transform .4s var(--ease-out)}
.menu{display:flex;gap:2px;font-size:14px;font-weight:500}
.menu a{padding:9px 12px;border-radius:999px;color:var(--on-dark);transition:color .18s ease,background-color .18s ease}
.menu a[aria-current="page"]{color:var(--white);background:rgba(255,255,255,.08)}
.burger{display:none;align-items:center;justify-content:center;width:46px;height:46px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.1);color:var(--white);transition:background-color .18s ease,transform .16s var(--ease-out)}
.burger:active{transform:scale(.95)}
.burger path{transform-box:view-box;transform-origin:10px 7px;transition:transform .3s var(--ease-drawer),opacity .2s ease}
body.menu-open .burger .b1{transform:translateY(6px) rotate(45deg)}
body.menu-open .burger .b2{opacity:0}
body.menu-open .burger .b3{transform:translateY(-6px) rotate(-45deg)}
.menu-panel{pointer-events:auto;width:calc(100% - 28px);margin:10px auto 0;background:var(--ink);border:1px solid rgba(255,255,255,.1);border-radius:var(--r-xl);padding:10px 0 4px;color:var(--white);visibility:hidden;opacity:0;transform:translateY(-8px) scale(.985);transform-origin:top center;transition:opacity .2s ease,transform .28s var(--ease-drawer),visibility 0s linear .28s}
body.menu-open .menu-panel{visibility:visible;opacity:1;transform:none;transition:opacity .2s ease,transform .28s var(--ease-drawer),visibility 0s}
.menu-panel a{display:block;padding:15px 0;border-bottom:1px solid var(--line-dark);font-size:21px;font-weight:500;letter-spacing:-.02em}
.menu-panel a[aria-current="page"]{color:var(--lime)}
.menu-panel .btn{display:inline-flex;margin:20px 0 22px;border-bottom:0;font-size:15px;font-weight:600;letter-spacing:-.005em;height:54px;padding:0 9px 0 24px;color:var(--ink)}
.menu-panel .btn .arrow{width:36px;height:36px;padding:10px}
@media (min-width:981px){.menu-panel{display:none}}

/* ---------- opening band ---------- */
.hero{position:relative;isolation:isolate;overflow:hidden;background:var(--ink);color:var(--on-dark);border-radius:0 0 var(--band) var(--band);padding:clamp(140px,13vw,196px) 0 clamp(56px,6.5vw,96px)}
.hero::before{content:"";position:absolute;inset:0;z-index:-2;background-image:var(--hero-img,none);background-position:var(--hero-pos,right bottom);background-size:var(--hero-size,auto 100%);background-repeat:no-repeat;opacity:var(--hero-op,.9);pointer-events:none}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--ink) 0%,rgba(11,13,16,.92) 32%,rgba(11,13,16,.4) 66%,rgba(11,13,16,0) 100%),radial-gradient(56% 80% at 84% 100%,rgba(219,255,115,.07),rgba(219,255,115,0) 70%);pointer-events:none}
.hero h1{font-size:clamp(40px,4.9vw,76px);line-height:1.02;font-weight:600;letter-spacing:-.035em;color:#f7f8fa;margin-top:24px;max-width:20ch}
h1 em,.prose h2 em,.h2 em{font-family:var(--font-serif);font-style:italic;font-weight:400;letter-spacing:-.02em}
.hero h1 em{color:var(--lime)}
.hero .lead{margin-top:clamp(22px,2.4vw,32px);font-size:clamp(17px,1.45vw,20px);line-height:1.5;color:var(--on-dark);max-width:620px}
.hero .link{margin-top:32px}
.hero-note{margin-top:22px;font-size:13.5px;color:var(--on-dark-2)}
.facts{display:flex;gap:10px;flex-wrap:wrap;margin-top:34px}
.facts span{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:500;color:var(--white);padding:9px 15px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(255,255,255,.03)}
.facts span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--lime)}
.hero--slim{padding:clamp(128px,12vw,168px) 0 clamp(44px,5vw,72px);--hero-op:.55}
.hero--slim h1{font-size:clamp(36px,4.6vw,68px);max-width:20ch}
.hero--center{text-align:center;--hero-pos:center bottom;--hero-op:.5}
.hero--center::after{background:radial-gradient(70% 90% at 50% 40%,rgba(11,13,16,.9),rgba(11,13,16,.55) 70%,rgba(11,13,16,.2))}
.hero--center h1,.hero--center .lead{margin-left:auto;margin-right:auto}
.hero--center h1{font-size:clamp(34px,4.4vw,64px)}
.error-code{font-size:clamp(88px,12vw,168px);line-height:.9;font-weight:600;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.5px var(--lime);font-variant-numeric:tabular-nums;margin-bottom:10px}

body[data-page="about"] .hero,body[data-page="consultation"] .hero{--hero-img:url(../img/sig-span.svg)}
body[data-page="solutions"] .hero,body[data-page="contact"] .hero{--hero-img:url(../img/sig-tower.svg)}
body[data-page="delivery"] .hero,body[data-page="our-works"] .hero{--hero-img:url(../img/sig-deck.svg)}
body[data-page="industries"] .hero,body[data-page="maintenance"] .hero{--hero-img:url(../img/sig-side.svg)}
body[data-page="404"] .hero{--hero-img:url(../img/sig-span.svg)}
.hero--slim{--hero-img:url(../img/sig-deck.svg)}

/* the homepage opening: the drawn bridge behind the words */
.hero--home{display:flex;align-items:flex-end;min-height:min(100svh,940px);padding:150px 0 clamp(52px,6vw,88px)}
.hero--home::before{display:none}
.hero--home::after{background:linear-gradient(90deg,rgba(11,13,16,.94) 0%,rgba(11,13,16,.8) 30%,rgba(11,13,16,.28) 62%,rgba(11,13,16,0) 100%),linear-gradient(0deg,rgba(11,13,16,.72) 0%,rgba(11,13,16,0) 46%),radial-gradient(50% 70% at 70% 62%,rgba(219,255,115,.08),rgba(219,255,115,0) 70%)}
.hero-art{position:absolute;inset:0;z-index:-2;pointer-events:none}
.sig{width:100%;height:100%;max-width:none}
.sig-bar{transform-box:view-box;transform-origin:0 394px}
.sig-pulse{opacity:0}
.hero-copy{position:relative}
.hero--home h1{font-size:clamp(44px,5.6vw,84px);max-width:none}
.hero--home h1 em{display:block}
.hero--home .lead{max-width:600px}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(26px,2.6vw,36px)}

/* ---------- sections and bands ---------- */
.section{padding:clamp(72px,8.5vw,128px) 0}
.section--grey{background:var(--bone-2);--ring:#dadee3;--ring-line:#cbd0d7}
.section--dark{position:relative;isolation:isolate;color:var(--white);--ring:#14171c;--ring-line:#23272e;--shine:rgba(255,255,255,.06);--above:transparent;--below:transparent;background:linear-gradient(var(--above),var(--above)) top/100% 50% no-repeat,linear-gradient(var(--below),var(--below)) bottom/100% 50% no-repeat}
.section--dark::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--ink);border-radius:var(--band)}
.section--grey+.section--dark{--above:var(--bone-2)}
.section--dark:has(+.section--grey){--below:var(--bone-2)}
.section--dark .h2{color:var(--white)}
.section--dark .split .lede{color:var(--on-dark)}
.section--tight{padding:clamp(28px,3.4vw,48px) 0 0}
.section-head{max-width:980px}
.section-head--center{margin:0 auto;text-align:center}
.section-head p:not(.eyebrow){margin-top:24px;font-size:clamp(16.5px,1.3vw,18.5px);line-height:1.55;color:var(--muted);max-width:62ch}
.section-head--center p:not(.eyebrow){margin-left:auto;margin-right:auto}
.section-head .btn-row{margin-top:36px}
.mt-24{margin-top:24px}.mt-32{margin-top:32px}.mt-48{margin-top:48px}.mt-64{margin-top:64px}.pt-0{padding-top:0}
.soft,.hint,.form-note,.price-running,.note{font-size:14px;line-height:1.55;color:var(--muted-2)}
.copy{margin-top:14px;font-size:17px;line-height:1.6;color:var(--muted)}
.measure{max-width:760px}
.section-head a:not(.btn),.copy a,.soft a,.stage-row a,.detail a:not(.btn),.card a:not(.link),.spec a,td a,.prose a,.hint a,.form-note a,.status a,.panel a,.steps a,.price-block a,.faq .lede a,.ans a{color:var(--ink);text-decoration:underline;text-decoration-color:#8d949e;text-decoration-thickness:1.5px;text-underline-offset:4px;font-weight:600;transition:text-decoration-color .18s ease}
.callout a,.price-block--dark a{color:var(--lime);text-decoration:underline;text-decoration-color:rgba(219,255,115,.5);text-decoration-thickness:1.5px;text-underline-offset:4px;font-weight:600}

/* the machined edge: a ring outside the card, a highlight inside */
.card,.work,.panel,.price-block,.spec,.offer,.prog,.sheet,.device,.piers,.stage-row .ticks{box-shadow:var(--bezel)}
.price-block--dark,.offer,.device,.prog,.callout{--shine:rgba(255,255,255,.08)}

/* ---------- homepage: promises ---------- */
.promises{padding:clamp(36px,4vw,60px) 0 0}
.promise-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.promise{padding:clamp(20px,2vw,28px) clamp(18px,2vw,30px)}
.promise+.promise{border-left:1px solid var(--line)}
.promise:first-child{padding-left:0}
.promise b{display:block;font-size:clamp(16.5px,1.35vw,19px);line-height:1.25;letter-spacing:-.015em}
.promise span{display:block;margin-top:6px;font-size:14.5px;line-height:1.45;color:var(--muted-2)}

/* ---------- homepage: the call you can watch ---------- */
.call-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,6vw,96px);align-items:center}
.call-copy .lede{margin-top:16px;font-size:clamp(17px,1.4vw,20px);line-height:1.5;color:var(--muted)}
.outcomes{margin-top:clamp(28px,3vw,44px);border-top:1px solid var(--line)}
.outcomes li{position:relative;padding:17px 0 17px 40px;border-bottom:1px solid var(--line);font-size:16.5px;line-height:1.4;font-weight:600;letter-spacing:-.01em;transition:opacity .4s ease}
.outcomes li::before{content:"";position:absolute;left:0;top:50%;width:24px;height:24px;margin-top:-12px;border-radius:50%;background:var(--lime) var(--tick-ink) center/22px 22px no-repeat;box-shadow:inset 0 0 0 1px rgba(11,13,16,.14);transition:transform .4s var(--ease-out),background-color .3s ease}
.call.is-armed .outcomes li{opacity:.45}
.call.is-armed .outcomes li::before{background-color:var(--bone-2);background-image:none;transform:scale(.9)}
.call.is-armed .outcomes li.is-on{opacity:1}
.call.is-armed .outcomes li.is-on::before{background-color:var(--lime);background-image:var(--tick-ink);transform:none}
.device{background:var(--ink);color:var(--on-dark);border:1px solid var(--ink-4);border-radius:var(--r-xl);overflow:hidden}
.device-top{display:flex;align-items:center;gap:16px;padding:16px 20px;border-bottom:1px solid var(--line-dark);background:var(--ink-2)}
.device-tag,.device-state{font-family:var(--font-mono);font-size:11.5px;line-height:1;font-weight:500;text-transform:uppercase;letter-spacing:.09em}
.device-tag{color:var(--on-dark-2)}
.device-wave{display:flex;align-items:center;gap:3px;height:26px;margin-left:auto}
.device-wave i{display:block;width:3px;height:calc(var(--h)*1%);min-height:3px;border-radius:2px;background:var(--on-dark-2);transform-origin:center}
.device-state{display:inline-flex;align-items:center;gap:8px;color:var(--white);padding:8px 12px;border:1px solid var(--line-dark);border-radius:999px;transition:opacity .4s ease}
.device-state i{display:block;width:6px;height:6px;border-radius:50%;background:var(--lime)}
.call.is-armed .device-state{opacity:.3}
.call.is-armed.is-done .device-state{opacity:1}
.lines{display:flex;flex-direction:column;gap:12px;padding:clamp(20px,2.2vw,30px) clamp(18px,2vw,28px) 8px}
.line{max-width:min(86%,520px);padding:13px 18px 15px;border-radius:16px 16px 16px 4px;background:var(--ink-3);transition:opacity .45s var(--ease-out),transform .55s var(--ease-out)}
.line small{display:block;font-family:var(--font-mono);font-size:10.5px;line-height:1.4;text-transform:uppercase;letter-spacing:.09em;color:var(--on-dark-2)}
.line p{margin-top:5px;font-size:16px;line-height:1.45;color:var(--white)}
.line--out{align-self:flex-end;border-radius:16px 16px 4px 16px;background:#20262c;box-shadow:inset 0 0 0 1px rgba(219,255,115,.26)}
.line--out small{color:var(--lime)}
.call.is-armed .line{opacity:0;transform:translateY(10px) scale(.98)}
.call.is-armed .line.is-on{opacity:1;transform:none}
.device-foot{display:flex;align-items:center;justify-content:flex-end;min-height:64px;padding:8px clamp(18px,2vw,28px) 16px}
.replay{display:inline-flex;align-items:center;height:44px;padding:0 18px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:transparent;color:var(--white);font-size:14px;font-weight:600;transition:background-color .18s ease,border-color .18s ease,transform .16s var(--ease-out)}
.replay[hidden]{display:none}
.replay:active{transform:scale(.97)}

/* ---------- homepage: services on one sheet ---------- */
.sheet{margin-top:clamp(40px,5vw,72px);background:var(--card);border:1px solid var(--line);border-radius:var(--r-xl);overflow:hidden}
.row-svc{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,4fr) minmax(0,3fr);gap:clamp(24px,3.4vw,64px);align-items:start;padding:clamp(28px,3.2vw,48px)}
.row-svc+.row-svc{border-top:1px solid var(--line)}
.row-main h3{font-size:clamp(26px,2.5vw,36px);line-height:1.08;letter-spacing:-.03em;margin-top:18px}
.row-main p{margin-top:12px;font-size:16.5px;line-height:1.55;color:var(--muted);max-width:44ch}
.row-svc .ticks{margin-top:0}
.row-price{display:flex;flex-direction:column;align-items:flex-end;text-align:right;height:100%}
.row-price small{font-family:var(--font-mono);font-size:11.5px;line-height:1.4;text-transform:uppercase;letter-spacing:.09em;color:var(--muted-2)}
.row-price strong{margin-top:10px;font-size:clamp(23px,2vw,28px);line-height:1.1;font-weight:600;letter-spacing:-.025em;font-variant-numeric:tabular-nums;white-space:nowrap}
.go{flex:none;display:grid;place-items:center;width:52px;height:52px;margin-top:auto;border-radius:50%;background:var(--ink);color:var(--lime);transition:background-color .2s ease,color .2s ease,transform .16s var(--ease-out)}
.row-price strong{margin-bottom:24px}
.go::after{content:"";position:absolute;inset:0;border-radius:inherit}
.go .arrow{width:18px;height:18px;transition:transform .3s var(--ease-out)}
.go:active{transform:scale(.95)}

/* ---------- homepage: programmes ---------- */
.progs{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:clamp(40px,5vw,72px)}
.prog{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;min-height:clamp(380px,33vw,470px);padding:clamp(28px,3vw,44px);background:var(--ink-2);border:1px solid rgba(255,255,255,.09);border-radius:var(--r-lg);color:var(--on-dark)}
.prog::before{content:"";position:absolute;right:-4%;bottom:0;z-index:-1;width:78%;height:74%;background:url(../img/sig-tower.svg) right bottom/contain no-repeat;opacity:.34;pointer-events:none}
.prog small{font-family:var(--font-mono);font-size:11.5px;line-height:1.4;text-transform:uppercase;letter-spacing:.09em;color:var(--on-dark-2)}
.prog h3{margin-top:16px;font-size:clamp(30px,3vw,44px);line-height:1.04;letter-spacing:-.032em;color:var(--white)}
.prog p{margin-top:16px;font-size:16.5px;line-height:1.55;max-width:46ch}
.prog-foot{margin-top:auto;padding-top:36px;display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}
.prog-foot strong{display:block;font-size:clamp(30px,3vw,44px);line-height:1;font-weight:600;letter-spacing:-.03em;color:var(--lime);font-variant-numeric:tabular-nums}
.prog-foot span{display:block;margin-top:12px;font-size:14px;line-height:1.45;color:var(--on-dark-2);max-width:34ch}
.prog--steel{--shine:#fff;background:var(--bone);border-color:transparent;color:var(--muted)}
.prog--steel::before{display:none}
.prog--steel small,.prog--steel .prog-foot span{color:var(--muted-2)}
.prog--steel h3,.prog--steel .prog-foot strong,.prog--steel .link--lime{color:var(--ink)}

/* ---------- homepage: three piers, one span ---------- */
.delivery-link{justify-self:end;margin-bottom:10px}
.piers{margin-top:clamp(40px,5vw,72px);background:var(--card);border:1px solid var(--line);border-radius:var(--r-xl);overflow:hidden}
.piers-art{padding:clamp(22px,2.4vw,36px) 0 0;color:var(--ink)}
.span-art{width:100%;height:clamp(84px,9vw,120px)}
.piers-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.pier{display:flex;flex-direction:column;padding:clamp(24px,2.8vw,40px)}
.pier+.pier{border-left:1px solid var(--line)}
.stage-n{font-family:var(--font-mono);font-size:12px;line-height:1;font-weight:500;letter-spacing:.1em;color:var(--muted-2)}
.pier h3{margin-top:16px;font-size:clamp(24px,2.2vw,32px);line-height:1.1;letter-spacing:-.03em}
.pier p{margin-top:12px;font-size:16px;line-height:1.55;color:var(--muted)}
.pier strong{display:block;margin-top:auto;padding-top:16px;border-top:1px solid var(--line);font-size:14.5px;line-height:1.4;font-weight:600}
.pier p{margin-bottom:26px}

/* ---------- homepage: questions ---------- */
.faq{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,6vw,96px);align-items:start}
.faq .lede{margin-top:24px;font-size:17px;line-height:1.55;color:var(--muted)}
.acc details{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.acc details+details{margin-top:10px}
.acc summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 20px 22px 26px;font-size:clamp(18px,1.55vw,22px);line-height:1.25;font-weight:600;letter-spacing:-.02em}
.acc summary::-webkit-details-marker{display:none}
.acc summary i{position:relative;flex:none;display:block;width:40px;height:40px;border-radius:50%;background:var(--bone-2);transition:background-color .2s ease,transform .3s var(--ease-out)}
.acc summary i::before,.acc summary i::after{content:"";position:absolute;left:13px;top:19px;width:14px;height:2px;border-radius:1px;background:var(--ink);transition:transform .3s var(--ease-out),background-color .2s ease}
.acc summary i::after{transform:rotate(90deg)}
.acc details[open] summary i{background:var(--ink)}
.acc details[open] summary i::before,.acc details[open] summary i::after{background:var(--lime)}
.acc details[open] summary i::after{transform:rotate(0deg)}
.ans{padding:0 26px 26px;font-size:16.5px;line-height:1.65;color:var(--muted);max-width:64ch}

/* ---------- inner pages: prose ---------- */
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,96px);align-items:start}
.prose p{margin-top:18px;font-size:17px;line-height:1.65;color:var(--muted)}
.prose p.eyebrow{margin-top:0;font-size:12px;line-height:1.4;color:var(--muted-2)}
.prose h2,.sector h2,.detail h2{font-size:clamp(30px,3.4vw,52px);line-height:1.04;letter-spacing:-.032em;margin-top:16px}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:22px;line-height:1.2;letter-spacing:-.02em;margin-top:40px}
.prose h3:first-child{margin-top:0}
.prose h3+.ticks,.spec .ticks{margin-top:12px}
.callout{position:relative;margin-top:28px;background:var(--ink);color:var(--white);padding:28px 30px 30px;border-radius:var(--r-lg);font-size:16px;line-height:1.6;box-shadow:inset 0 1px 0 var(--shine)}
.callout b{display:flex;align-items:center;gap:12px;margin-bottom:12px;font-family:var(--font-mono);font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--lime)}
.callout b::before{content:"";flex:none;width:18px;height:1px;background:currentColor}
.group{font-size:clamp(22px,2vw,28px);line-height:1.15;margin-top:64px;padding-top:24px;border-top:1.5px solid var(--ink)}
.group+.cards,.group+.table-scroll{margin-top:28px}

.ticks{margin-top:16px}
.ticks li{position:relative;padding:11px 0 11px 34px;font-size:15px;line-height:1.5;font-weight:500;border-top:1px solid var(--line)}
.ticks li:first-child{border-top:0;padding-top:0}
.ticks li::before{content:"";position:absolute;left:0;top:12px;width:22px;height:22px;border-radius:50%;background:var(--ink) var(--tick) center/22px 22px no-repeat}
.ticks li:first-child::before{top:1px}
.prose .ticks li{font-size:16px}
.section--dark .ticks li,.price-block--dark .ticks li{border-top-color:var(--line-dark)}
.section--dark .ticks li::before,.price-block--dark .ticks li::before{background-color:rgba(255,255,255,.1)}

.sectors{border-bottom:1px solid var(--line)}
.sector{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,80px);padding:clamp(48px,5vw,80px) 0;border-top:1px solid var(--line)}
.sector .lede{margin-top:18px;font-size:17px;line-height:1.65;color:var(--muted)}
.spec{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(24px,2.4vw,36px)}
.spec h3{font-family:var(--font-mono);font-size:12px;line-height:1.4;font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--muted-2)}
.spec p{margin-top:14px;font-size:15px;line-height:1.6;color:var(--muted)}
.spec .table-scroll{margin-top:14px}
.note{margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}

/* ---------- inner pages: cards ---------- */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:clamp(40px,5vw,72px)}
.cards--2{grid-template-columns:1fr 1fr}
.card,.work,.panel,.price-block{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg)}
.card{padding:clamp(26px,2.8vw,40px)}
.card h3,.card h2,.work h3{font-size:clamp(23px,2.1vw,30px);line-height:1.1;letter-spacing:-.03em}
.card p{margin-top:16px;font-size:16.5px;line-height:1.6;color:var(--muted)}
.card .link{margin-top:22px}
.pill{display:inline-block;font-family:var(--font-mono);font-size:11.5px;line-height:1.2;font-weight:500;letter-spacing:.07em;text-transform:uppercase;padding:8px 12px;border-radius:999px;background:var(--bone-2);color:var(--ink)}
.section--grey .pill{background:var(--bone)}
.sheet .pill,.card .pill,.work .pill{background:var(--bone-2)}
.pill--lime{background:var(--lime);color:var(--ink)}
.pill-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.pill-row .pill{font-family:var(--font-sans);font-size:13px;font-weight:500;letter-spacing:0;text-transform:none}

.photo img{width:100%;height:auto;aspect-ratio:21/9;object-fit:cover;border-radius:var(--r-xl);filter:grayscale(.85) contrast(1.05)}
.photo figcaption{margin-top:14px;font-family:var(--font-mono);font-size:12px;line-height:1.5;letter-spacing:.02em;color:var(--muted-2)}

.panel{padding:clamp(26px,2.6vw,40px)}
.panel--grey{background:var(--bone-2);border-color:transparent}
.section--grey .panel--grey{background:var(--card)}
.panel h3{font-size:22px;line-height:1.2;letter-spacing:-.02em}
.panel dl{display:grid;grid-template-columns:260px 1fr}
.panel dt{font-family:var(--font-mono);font-size:11.5px;line-height:1.5;text-transform:uppercase;letter-spacing:.09em;color:var(--muted-2);padding:18px 16px 16px 0;border-top:1px solid var(--line)}
.panel dd{padding:16px 0;border-top:1px solid var(--line);font-size:16px;line-height:1.5;font-weight:500}
.panel dt:first-of-type,.panel dd:first-of-type{border-top:0}
.panel h3+dl{margin-top:20px}
.panel h3+dl dt:first-of-type,.panel h3+dl dd:first-of-type{border-top:1px solid var(--line)}
.stack dl{display:block}
.stack dt{padding:16px 0 0}
.stack dd{padding:4px 0 16px;border-top:0}
.steps{margin-top:16px;counter-reset:s}
.steps li{position:relative;counter-increment:s;padding:13px 0 13px 44px;font-size:15px;line-height:1.5;border-top:1px solid var(--line)}
.steps li::before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:15px;font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;color:var(--muted-2)}
.side>:first-child{margin-top:0}
.side .panel{margin-top:26px}
.links li{border-top:1px solid var(--line);font-size:15px;font-weight:600}
.links li:first-child{border-top:0}
.links a,.panel .links a{display:block;padding:13px 0;text-decoration:none}
.panel h3+.links{margin-top:16px}

/* ---------- inner pages: the form ---------- */
.contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,420px);gap:clamp(36px,5vw,80px);align-items:start}
.form{position:relative}
.form-intro{font-size:clamp(24px,2.3vw,32px);line-height:1.12;font-weight:600;letter-spacing:-.03em}
.row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:22px}
.field{margin-top:22px}
.row .field{margin-top:0}
.field label,.field legend{display:block;font-size:14px;font-weight:600;margin-bottom:9px;padding:0}
.opt{font-weight:400;color:var(--muted-2)}
.field input:not([type="checkbox"]):not([type="radio"]),.field textarea,.field select{display:block;width:100%;font:inherit;font-size:16px;font-weight:500;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);height:56px;padding:0 18px;-webkit-appearance:none;appearance:none;box-shadow:inset 0 1px 0 #fff;transition:border-color .18s ease}
.field textarea{height:auto;min-height:190px;padding:16px 18px;line-height:1.5;resize:vertical}
.field input:focus-visible,.field textarea:focus-visible,.field select:focus-visible{outline:2px solid var(--ink);outline-offset:-1px;border-radius:var(--r-md)}
.field ::placeholder{color:#7b828c}
fieldset.field{border:0;padding:0;min-width:0;margin-left:0;margin-right:0}
.hint{margin-bottom:12px}
.checks{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.checks label{display:flex;align-items:center;gap:12px;margin:0;padding:15px 16px;min-height:54px;font-size:15px;font-weight:500;background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);cursor:pointer;transition:background-color .18s ease,border-color .18s ease}
.checks label:has(input:checked){background:var(--lime);border-color:var(--ink)}
.checks input{flex:none;width:18px;height:18px;margin:0;accent-color:var(--ink)}
.trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.actions{margin-top:30px;display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.form-note{font-size:13px;max-width:420px}
.status{display:none;margin-top:22px;padding:18px 20px;font-size:15px;line-height:1.5;border-radius:var(--r-md);border:1px solid}
.status.is-shown{display:block}
.status--ok{background:#e9f5ee;border-color:var(--green);color:#0f4a28}
.status--err{background:#fbeceb;border-color:var(--red);color:#6f1712}
.offer{background:var(--ink);color:var(--white);padding:clamp(28px,2.8vw,40px);border:1px solid var(--ink-4);border-radius:var(--r-lg)}
.offer .fee{margin-top:18px;font-size:clamp(56px,6vw,92px);line-height:.9;font-weight:600;letter-spacing:-.04em;color:var(--lime);font-variant-numeric:tabular-nums}
.offer .fee span{font-size:15px;font-weight:500;letter-spacing:0;color:var(--on-dark)}
.offer p{margin-top:18px;font-size:16px;line-height:1.55;color:var(--on-dark)}
.offer .credit{color:var(--white);font-weight:600;font-size:14px}
.offer .ticks li{border-top-color:var(--line-dark)}
.offer .ticks li::before{background-color:rgba(255,255,255,.1)}

/* ---------- inner pages: finished work ---------- */
.works{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:clamp(40px,5vw,72px)}
.work{padding:clamp(26px,2.6vw,40px)}
.work h3{margin-top:14px}
.work dl{display:grid;grid-template-columns:118px 1fr;gap:6px 16px;margin-top:20px;font-size:15px;line-height:1.5}
.work dt{font-family:var(--font-mono);font-size:11.5px;line-height:1.9;text-transform:uppercase;letter-spacing:.09em;color:var(--muted-2)}
.work dd{font-weight:500}
.work p{margin-top:14px;font-size:15px;line-height:1.6;color:var(--muted)}

/* ---------- inner pages: tables and prices ---------- */
.table-scroll{overflow-x:auto;margin-top:24px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--card)}
.table-scroll>table{min-width:560px}
table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.5}
th,td{text-align:left;vertical-align:top;padding:15px 20px;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
th{font-weight:600}
thead th{font-family:var(--font-mono);font-size:11.5px;font-weight:500;text-transform:uppercase;letter-spacing:.09em;color:var(--muted-2);background:var(--bone-2);white-space:nowrap}
tbody tr:last-child th,tbody tr:last-child td{border-bottom:0}
.price-block{margin-top:34px;padding:clamp(24px,2.4vw,36px)}
.price-block--dark,.section--grey .price-block--dark{background:var(--ink);border-color:var(--ink-4);color:var(--on-dark)}
.price-label{font-family:var(--font-mono);font-size:11.5px;line-height:1.4;text-transform:uppercase;letter-spacing:.09em;color:var(--muted-2)}
.price-block--dark .price-label{color:var(--lime)}
.price-figure{margin-top:14px;font-size:clamp(34px,3.6vw,56px);line-height:.98;font-weight:600;letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.price-block--dark .price-figure{color:var(--lime)}
.price-note{margin-top:16px;font-size:15px;line-height:1.55;color:var(--muted)}
.price-block--dark .price-note{color:var(--on-dark)}
.price-running{margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.price-block--dark .price-running{border-top-color:var(--line-dark);color:var(--on-dark-2)}
.price-block--dark strong{color:var(--white)}
.two .price-block{margin-top:0}
.card .price-figure{font-size:clamp(28px,2.6vw,38px)}
.card .price-note{margin-top:12px}

/* ---------- inner pages: solutions ---------- */
.directory{margin-top:clamp(28px,3vw,48px);border-top:1.5px solid var(--ink)}
.directory a{display:grid;grid-template-columns:72px 1fr auto;gap:24px;align-items:center;padding:clamp(18px,2vw,28px) clamp(10px,1.4vw,22px);border-bottom:1px solid var(--line);font-size:clamp(22px,2.7vw,40px);line-height:1.06;font-weight:600;letter-spacing:-.032em;transition:background-color .2s ease,color .2s ease}
.directory-number{font-family:var(--font-mono);font-size:12px;font-weight:500;letter-spacing:.1em;color:var(--muted-2)}
.directory a small{display:block;font-size:14.5px;line-height:1.45;font-weight:400;letter-spacing:0;color:var(--muted-2);margin-top:8px}
.directory-price{font-size:14px;line-height:1;font-weight:500;letter-spacing:0;white-space:nowrap;padding:11px 16px;border:1px solid var(--line);border-radius:999px;background:var(--card);color:var(--ink);font-variant-numeric:tabular-nums;transition:background-color .2s ease,border-color .2s ease}
.directory-price b{margin-left:6px}
.detail{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,96px);padding:clamp(56px,6vw,96px) 0;border-top:1px solid var(--line);align-items:start}
.detail:first-child{border-top:0;padding-top:0}
.detail>div>p:not([class]){margin-top:18px;font-size:17px;line-height:1.65;color:var(--muted)}
.detail .spec+.spec{margin-top:26px}

/* ---------- inner pages: delivery ---------- */
.stage-list{border-bottom:1px solid var(--line)}
.stage-row{display:grid;grid-template-columns:150px 1fr 360px;gap:clamp(28px,3.4vw,56px);padding:clamp(40px,4.4vw,68px) 0;border-top:1px solid var(--line);align-items:start}
.stage-num{font-size:clamp(56px,6vw,88px);line-height:.9;font-weight:600;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.2px var(--ink);font-variant-numeric:tabular-nums}
.stage-row h2{font-size:clamp(28px,2.9vw,42px);line-height:1.06;letter-spacing:-.032em}
.stage-row>div>p{margin-top:16px;font-size:17px;line-height:1.6;color:var(--muted)}
.stage-row .ticks{margin-top:0;background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px 26px}
.stage-out{font-weight:600;color:var(--ink)}

/* ---------- inner pages: policies ---------- */
.legal{display:grid;grid-template-columns:280px minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:start}
.legal-toc{position:sticky;top:104px;max-height:calc(100vh - 128px);overflow-y:auto;background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px 24px 14px}
.legal-toc h2{font-family:var(--font-mono);font-size:11.5px;line-height:1.4;font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--muted-2);margin-bottom:12px}
.legal-toc li{border-top:1px solid var(--line)}
.legal-toc a{display:block;padding:10px 0;font-size:14.5px;line-height:1.4;font-weight:500;color:var(--muted);transition:color .18s ease}
.legal .prose{max-width:760px}
.legal .prose h2{font-size:clamp(24px,2.2vw,30px);line-height:1.15;letter-spacing:-.025em;margin-top:56px;padding-top:30px;border-top:1px solid var(--line)}
.legal .prose h2:first-child{margin-top:0;padding-top:0;border-top:0}
.legal .prose .meta-line+h2{margin-top:28px;padding-top:0;border-top:0}
.legal .prose h3{font-size:19px;margin-top:32px}
.legal .prose p{font-size:16.5px;line-height:1.7;margin-top:16px}
.legal .prose ul,.legal .prose ol{margin-top:14px;padding-left:22px}
.legal .prose ul{list-style:square}
.legal .prose ol{list-style:decimal}
.legal .prose li{margin-top:8px;font-size:16.5px;line-height:1.65;color:var(--muted)}
.legal .prose li::marker{color:var(--ink)}
.legal .prose strong{color:var(--ink)}
.legal .prose hr{border:0;border-top:1px solid var(--line);margin:40px 0}
.legal .prose .meta-line{margin-top:0;font-family:var(--font-mono);font-size:13px;line-height:1.5;text-transform:uppercase;letter-spacing:.08em;color:var(--muted-2);padding-bottom:20px;border-bottom:1.5px solid var(--ink)}
.legal .prose .table-scroll{margin-top:20px}
code{font-family:var(--font-mono);font-size:.9em;background:var(--bone-2);padding:3px 7px;border-radius:6px}

/* ---------- footer ---------- */
.foot{position:relative;isolation:isolate;overflow:hidden;color:var(--white);--above:transparent;background:linear-gradient(var(--above),var(--above)) top/100% 50% no-repeat}
main:has(>.section--grey:last-child)~.foot{--above:var(--bone-2)}
.foot::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--ink);border-radius:var(--band) var(--band) 0 0}
.foot::after{content:"";position:absolute;right:0;bottom:0;z-index:-1;width:min(100%,1180px);aspect-ratio:1920/336;background:url(../img/sig-foot.svg) right bottom/contain no-repeat;opacity:.55;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 55%);mask-image:linear-gradient(90deg,transparent 0%,#000 55%)}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr) minmax(0,.9fr) minmax(0,1.2fr);column-gap:24px;padding:clamp(56px,6vw,92px) 0 clamp(44px,4.4vw,64px)}
.foot .logo{font-size:28px}
.tag{margin-top:24px;font-size:17px;line-height:1.5;max-width:300px;color:var(--on-dark)}
.pay-note{margin-top:22px}
.pay-note a{display:inline-flex;align-items:center;gap:10px;min-height:40px;padding:0 18px 0 15px;border:1px solid rgba(255,255,255,.18);border-radius:999px;font-size:14px;line-height:1.2;font-weight:500;letter-spacing:-.005em;color:var(--white);background:rgba(255,255,255,.04);transition:border-color .18s ease,color .18s ease}
.pay-note i{flex:none;width:7px;height:7px;border-radius:2px;background:var(--lime)}
.foot h4{font-family:var(--font-mono);font-size:11.5px;line-height:1.4;font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--on-dark-2);margin-bottom:12px}
.foot li{font-size:14.5px;line-height:1.45;font-weight:400;color:var(--on-dark);padding:7px 0}
.foot li a{color:var(--white);transition:color .18s ease}
.foot li.reg,.reg{font-size:13px;line-height:1.55;max-width:330px;color:var(--on-dark-2)}
.reg b{color:var(--white);font-weight:500}
.foot-bottom{border-top:1px solid var(--line-dark);padding:26px 0 30px;display:flex;justify-content:space-between;align-items:center;gap:24px;font-size:13px;color:var(--on-dark-2)}
.foot-bottom p{flex:1 1 0;min-width:0}
.foot-bottom ul{display:flex;gap:6px 22px;flex-wrap:wrap;justify-content:flex-end}
.foot-bottom li{font-size:13px;padding:0;white-space:nowrap}
.foot-bottom li a{display:inline-block;padding:6px 0;color:var(--on-dark)}

/* ---------- cursor light (the script adds it on a computer only) ---------- */
.has-glow{position:relative;isolation:isolate;overflow:hidden}
.glow{position:absolute;top:0;left:0;z-index:-1;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle closest-side,rgba(219,255,115,.34),rgba(219,255,115,0));opacity:0;pointer-events:none;transition:opacity .35s ease;will-change:transform}
.price-block--dark>.glow,.offer>.glow,.prog>.glow{background:radial-gradient(circle closest-side,rgba(219,255,115,.11),rgba(219,255,115,0))}
.prog--steel>.glow{background:radial-gradient(circle closest-side,rgba(219,255,115,.5),rgba(219,255,115,0))}

/* ---------- hover, on devices that have it ---------- */
@media (hover:hover) and (pointer:fine){
  .menu a:hover{color:var(--white);background:rgba(255,255,255,.08)}
  .logo:hover i{transform:rotate(90deg)}
  .burger:hover{background:rgba(255,255,255,.16)}
  .btn--lime:hover,.btn--primary:hover{background:var(--lime-hi)}
  .btn--ghost:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.4)}
  .btn--ink:hover,.btn--dark:hover{background:var(--ink-3)}
  .btn--outline:hover{background:var(--ink);color:var(--white)}
  .btn:hover .arrow{transform:rotate(45deg)}
  .link:hover .arrow{transform:translate(3px,-3px)}
  .go:hover{background:var(--lime);color:var(--ink)}
  .go:hover .arrow{transform:rotate(45deg)}
  .replay:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.4)}
  .has-glow:hover>.glow{opacity:1}
  .directory a:hover{background:var(--ink);color:var(--white)}
  .directory a:hover small,.directory a:hover .directory-number{color:var(--on-dark)}
  .directory a:hover .directory-price{background:var(--lime);border-color:var(--lime);color:var(--ink)}
  .acc summary:hover i{transform:scale(1.06)}
  .foot li a:hover{color:var(--lime)}
  .pay-note a:hover{border-color:var(--lime);color:var(--lime)}
  .legal-toc a:hover,.links a:hover{color:var(--ink)}
  .section-head a:not(.btn):hover,.copy a:hover,.prose a:hover,.ans a:hover,.faq .lede a:hover,.card a:not(.link):hover,.spec a:hover,td a:hover,.panel a:hover{text-decoration-color:var(--ink)}
  .field input:hover,.field textarea:hover,.checks label:hover{border-color:var(--ink)}
}

/* ---------- movement, only where it is welcome ---------- */
@media (prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto}
  ::view-transition-old(root),::view-transition-new(root){animation-duration:.32s;animation-timing-function:cubic-bezier(.23,1,.32,1)}
  .nav{view-transition-name:sb-nav}

  .hero .hero-eyebrow,.hero h1,.hero .lead,.hero .hero-cta,.hero .hero-note,.hero .facts,.hero .btn-row,.hero .error-code{animation:sb-rise .8s var(--ease-out) both}
  .hero h1{animation-delay:.06s}
  .hero .lead{animation-delay:.14s}
  .hero .hero-cta,.hero .facts,.hero .btn-row{animation-delay:.2s}
  .hero .hero-note{animation-delay:.26s}

  .sig{animation:sig-draw 1.9s var(--ease-in-out) .1s both}
  .hero-art.is-live .sig-bar{animation:sig-swell 3.4s var(--ease-in-out) infinite alternate;animation-delay:calc(var(--g,0)*-.47s)}
  .hero-art.is-live .sig-pulse{animation:sig-run 7.5s linear 1.6s infinite}
  .call.is-armed:not(.is-done) .device-wave i{animation:wave 1.1s var(--ease-in-out) infinite alternate;animation-delay:calc(var(--i,0)*-.13s)}

  .js .rv{opacity:0;transform:translateY(16px) scale(.98);transition:opacity .6s var(--ease-out),transform .7s var(--ease-out),background-color .2s ease,color .2s ease;transition-delay:calc(var(--i,0)*60ms)}
  .js .rv.in{opacity:1;transform:none}
  .js .span-art{clip-path:inset(0 100% 0 0);transition:clip-path 1.5s var(--ease-in-out)}
  .js .span-art.in{clip-path:inset(0 0 0 0)}

  .menu-panel a{opacity:0;transform:translateY(8px);transition:opacity .3s var(--ease-out),transform .4s var(--ease-out)}
  body.menu-open .menu-panel a{opacity:1;transform:none}
  body.menu-open .menu-panel a:nth-child(1){transition-delay:.04s}
  body.menu-open .menu-panel a:nth-child(2){transition-delay:.08s}
  body.menu-open .menu-panel a:nth-child(3){transition-delay:.12s}
  body.menu-open .menu-panel a:nth-child(4){transition-delay:.16s}
  body.menu-open .menu-panel a:nth-child(5){transition-delay:.2s}
  body.menu-open .menu-panel a:nth-child(6){transition-delay:.24s}
  body.menu-open .menu-panel a:nth-child(7){transition-delay:.28s}

  @supports (interpolate-size:allow-keywords){
    .acc{interpolate-size:allow-keywords}
    .acc details::details-content{block-size:0;overflow:clip;transition:block-size .34s var(--ease-drawer),content-visibility .34s allow-discrete}
    .acc details[open]::details-content{block-size:auto}
  }
}
@keyframes sb-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes sb-fade{from{opacity:0}to{opacity:1}}
@keyframes sig-draw{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes sig-swell{from{transform:scaleY(1)}to{transform:scaleY(.72)}}
@keyframes sig-run{0%{transform:translateX(-160px);opacity:0}6%{opacity:1}88%{opacity:1}100%{transform:translateX(1500px);opacity:0}}
@keyframes wave{from{transform:scaleY(.45)}to{transform:scaleY(1)}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .btn:active,.go:active,.replay:active,.burger:active{transform:none}
  header.top,.menu-panel{transition-duration:.01s}
  .hero .hero-eyebrow,.hero h1,.hero .lead,.hero .hero-cta,.hero .hero-note,.hero .facts,.hero .btn-row,.hero .error-code{animation:sb-fade .5s ease both}
}

/* ---------- 980 and under ---------- */
@media (max-width:980px){
  .menu,.nav>.btn{display:none}
  .burger{display:flex}
  .nav{padding-left:22px}
  .split,.two,.sector,.contact,.cards,.cards--2,.works,.detail,.legal,.faq,.progs,.call-grid{grid-template-columns:minmax(0,1fr)}
  .split{gap:20px;align-items:start}
  .split .lede{max-width:60ch}
  .delivery-link{justify-self:start;margin-bottom:0}
  .promise-grid{grid-template-columns:1fr 1fr}
  .promise:nth-child(odd){padding-left:0;border-left:0}
  .promise:nth-child(n+3){border-top:1px solid var(--line)}
  .row-svc{grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:28px}
  .row-main{grid-column:1/-1}
  .prog{min-height:0}
  .stage-row{grid-template-columns:minmax(0,1fr);gap:22px}
  .legal-toc{position:static;max-height:none}
  .photo img{aspect-ratio:16/9}
  .directory a{grid-template-columns:44px 1fr;gap:10px 16px}
  .directory-price{grid-column:2;justify-self:start}
  .foot-grid{grid-template-columns:1fr 1fr;row-gap:40px}
  .foot-grid>div:first-child{grid-column:1/-1}
  .foot-bottom{flex-direction:column;align-items:flex-start;gap:14px}
  .foot-bottom ul{justify-content:flex-start}
  .hero::after{background:linear-gradient(90deg,var(--ink) 0%,rgba(11,13,16,.9) 45%,rgba(11,13,16,.5) 100%)}
  .hero--home::after{background:linear-gradient(90deg,rgba(11,13,16,.94) 0%,rgba(11,13,16,.78) 48%,rgba(11,13,16,.3) 100%),linear-gradient(0deg,rgba(11,13,16,.72) 0%,rgba(11,13,16,0) 46%)}
}

/* ---------- 700 and under ---------- */
@media (max-width:700px){
  [id]{scroll-margin-top:96px}
  .wrap:not(.nav),.container{padding-left:max(var(--gutter),env(safe-area-inset-left));padding-right:max(var(--gutter),env(safe-area-inset-right))}
  header.top{top:10px}
  .nav{height:58px;padding:0 7px 0 20px}
  .menu-panel{max-height:calc(100svh - 96px);overflow-y:auto;overscroll-behavior:contain}
  .burger{width:44px;height:44px}
  .logo{font-size:21px}
  .hero{padding-top:118px}
  .hero::before{opacity:.4;background-size:auto 62%}
  .hero h1{max-width:none}
  .btn--hero,.btn--ghost,.btn--ink,.btn--outline,.btn--dark{width:100%;height:58px}
  .btn--hero:has(.arrow),.btn--ink:has(.arrow),.btn--dark:has(.arrow){justify-content:space-between;padding-left:26px}
  .hero--home{display:block;min-height:0;padding:118px 0 236px}
  .hero--home::after{background:linear-gradient(180deg,var(--ink) 0%,rgba(11,13,16,.9) 58%,rgba(11,13,16,.2) 100%)}
  .hero--home h1 em{display:inline}
  .sig{position:absolute;bottom:0;right:calc(50% - 285px);width:1200px;height:300px}
  .promise-grid{grid-template-columns:minmax(0,1fr)}
  .promise,.promise:first-child{padding:18px 0;border-left:0}
  .promise+.promise{border-top:1px solid var(--line);border-left:0}
  .row-svc{grid-template-columns:minmax(0,1fr)}
  .row-price{flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;text-align:left;gap:4px 16px;padding-top:22px;border-top:1px solid var(--line)}
  .row-price small{flex:1 0 100%}
  .row-price strong{margin-top:0}
  .row-price .go{margin-top:0}
  .line{max-width:94%}
  .device-top{flex-wrap:wrap;gap:12px}
  .device-wave{display:none}
  .device-state{margin-left:auto}
  .piers-art{display:none}
  .piers-grid{grid-template-columns:minmax(0,1fr)}
  .pier{position:relative;padding:26px 22px 26px 58px}
  .pier+.pier{border-left:0;border-top:1px solid var(--line)}
  .pier::before{content:"";position:absolute;left:28px;top:0;bottom:0;width:1px;background:var(--ink)}
  .pier:first-child::before{top:30px}
  .pier:last-child::before{bottom:auto;height:30px}
  .pier::after{content:"";position:absolute;left:23px;top:26px;width:11px;height:11px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 1.5px var(--ink)}
  .panel dl{display:block}
  .panel dt{padding:16px 0 0}
  .panel dd{padding:4px 0 16px;border-top:0}
  .row,.checks{grid-template-columns:minmax(0,1fr)}
  .row .field+.field{margin-top:6px}
  .work dl{grid-template-columns:minmax(0,1fr);gap:2px}
  .work dd{margin-bottom:10px}
  .acc summary{padding:20px 16px 20px 20px}
  .ans{padding:0 20px 22px}
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-grid>div:last-child{grid-column:1/-1}
  .foot-bottom{padding-bottom:max(30px,env(safe-area-inset-bottom))}
  .foot::after{opacity:.35}
}

/* ---------- repairs, 29 Sep 2026 ---------- */
/* a phrase that must stay on one line ("3-D Secure", "6–24 months") */
.nw{white-space:nowrap}
.prog-foot span.nw{display:inline;margin:0}

/* the artwork on the dark programme card fades out before it reaches the words */
.prog::before{-webkit-mask-image:linear-gradient(100deg,transparent 18%,#000 72%),linear-gradient(0deg,transparent 6%,#000 34%);mask-image:linear-gradient(100deg,transparent 18%,#000 72%),linear-gradient(0deg,transparent 6%,#000 34%);-webkit-mask-composite:source-in;mask-composite:intersect}

/* The cookie bar is built by assets/js/ads.js with its own inline styles; the script and its wording are not touched.
   These rules only move and tidy it: on a computer it sits in the bottom right corner, clear of the homepage
   buttons; on a phone it is more compact. Both buttons keep the same size and weight. */
#sb-consent{font-family:var(--font-sans)!important;border-radius:var(--r-md)!important;box-shadow:0 18px 48px rgba(0,0,0,.38)}
@media (min-width:981px){
  #sb-consent{left:auto!important;right:24px!important;bottom:24px!important;width:400px;max-width:400px!important;margin:0!important}
}
@media (max-width:700px){
  #sb-consent{left:12px!important;right:12px!important;bottom:max(12px,env(safe-area-inset-bottom))!important;padding:12px 14px!important;gap:8px!important;font-size:13px!important;line-height:1.4!important}
  #sb-consent>p{flex:1 1 100%!important}
  #sb-consent>div{flex:1 1 100%}
  #sb-consent>div>button{flex:1 1 0}
}

/* touch screens: every footer link is at least 44px tall to the finger */
@media (pointer:coarse){
  .foot li:has(>a){padding:0}
  .foot li>a{display:inline-flex;align-items:center;min-height:44px}
  .foot-bottom li a{display:inline-flex;align-items:center;min-height:44px;padding:0}
  .pay-note a,.foot .logo{min-height:44px}
  /* a link that stands on its own gets a 44px touch area; how it looks does not change */
  .link,.top .logo{position:relative}
  .link::after,.top .logo::after{content:"";position:absolute;left:0;right:0;top:50%;height:44px;transform:translateY(-50%)}
  .panel dd>a{display:inline-block;padding:12px 0;margin:-12px 0}
}

/* page tops: the darkening behind the words is measured from the text column, not from the screen width,
   so the artwork stays clear of the opening paragraph on every screen */
@media (min-width:981px){
  .hero{--copy-l:calc(max(0px,(100% - 1320px)/2) + var(--gutter))}
  .hero::after{background:linear-gradient(90deg,var(--ink) 0,rgba(11,13,16,.95) calc(var(--copy-l) + 640px),rgba(11,13,16,.4) calc(var(--copy-l) + 860px),rgba(11,13,16,0) 100%),radial-gradient(56% 80% at 84% 100%,rgba(219,255,115,.07),rgba(219,255,115,0) 70%)}
  .hero--home::after{background:linear-gradient(90deg,rgba(11,13,16,.94) 0,rgba(11,13,16,.86) calc(var(--copy-l) + 620px),rgba(11,13,16,.28) calc(var(--copy-l) + 620px + 18%),rgba(11,13,16,0) 100%),linear-gradient(0deg,rgba(11,13,16,.72) 0%,rgba(11,13,16,0) 46%),radial-gradient(50% 70% at 70% 62%,rgba(219,255,115,.08),rgba(219,255,115,0) 70%)}
}

/* two cards in one column never touch */
.price-block+.spec{margin-top:26px}
/* a price that needs two lines breaks into two even lines ("/ year" was left alone on the second) */
.price-figure{text-wrap:balance}
/* a cookie or file name stays in one piece */
code{white-space:nowrap}
/* the closing line of the sector list is as wide as the lines above it */
.sectors{border-bottom:0}
.sector:last-child{border-bottom:1px solid var(--line)}

/* a table inside a card fits the card: its last column was cut off with nothing to show that it scrolls */
.spec .table-scroll>table{min-width:0}
/* the price table: the service names get room for one line on a computer (they wrapped to three) */
@media (min-width:1200px){
  #pricing .table-scroll>table :is(th,td):first-child{width:19%}
}
/* a table that does scroll sideways shows a soft shadow on the side where there is more */
.table-scroll{background:linear-gradient(90deg,var(--card) 40%,rgba(249,250,251,0)) 0 0/36px 100% no-repeat local,linear-gradient(270deg,var(--card) 40%,rgba(249,250,251,0)) 100% 0/36px 100% no-repeat local,radial-gradient(farthest-side at 0 50%,rgba(11,13,16,.22),rgba(11,13,16,0)) 0 0/12px 100% no-repeat scroll,radial-gradient(farthest-side at 100% 50%,rgba(11,13,16,.22),rgba(11,13,16,0)) 100% 0/12px 100% no-repeat scroll,var(--card)}
@media (max-width:700px){
  th,td{padding:12px 14px}
  table{font-size:14px}
  .table-scroll>table{min-width:520px}
  .table-scroll>table:not(:has(tr>:nth-child(3))),.spec .table-scroll>table{min-width:0}
  .spec th,.spec td{padding:12px 10px}
  .spec thead th,.table-scroll>table:not(:has(tr>:nth-child(3))) thead th{white-space:normal}
}

/* grid children may shrink */
.legal>*,.detail>*,.two>*,.cards>*,.contact>*,.stage-row>*,.spec,.progs>*,.faq>*,.call-grid>*,.row-svc>*,.piers-grid>*,.works>*,.sector>*,.split>*{min-width:0}