/* Latent Potential · v4
   ReAsk's ocean meets our navy. Geist, tracked tight, for everything direct; Instrument Serif italic for the one elegant word. */
:root{
  --sans:"Geist",system-ui,-apple-system,sans-serif;
  --serif:"Instrument Serif",Georgia,serif;
  --mono:"Geist Mono",ui-monospace,Menlo,monospace;
  --ink:#05070A; --ink-2:#3C4655; --ink-3:#5B6676;
  --abyss:#010D1A; --deep:#032B4E; --ocean:#0369A8; --current:#0A8ACB; --lagoon:#12B5CE; --jade:#1FBF98; --glacier:#CFF1F6;
  --paper:#F7FAFB; --white:#fff; --line:#E2E8EE; --line-2:#D2DBE4;
  --depth:linear-gradient(180deg,#CFF1F6 0%,#12B5CE 30%,#0369A8 62%,#032B4E 86%,#010D1A 100%);
  --tide:linear-gradient(135deg,#7FD6EA 0%,#0A8ACB 45%,#0369A8 70%,#032B4E 100%);
  --num:linear-gradient(120deg,#0369A8 10%,#12B5CE 90%);
  --num-dk:linear-gradient(120deg,#CFF1F6 0%,#7FD6EA 55%,#12B5CE 100%);
  --sh:0 1px 2px rgb(5 7 10/.05),0 18px 50px -24px rgb(3 43 78/.35);
  --sh-lg:0 2px 4px rgb(5 7 10/.06),0 40px 90px -30px rgb(1 13 26/.55);
  --e:cubic-bezier(.4,0,.2,1); --eo:cubic-bezier(.22,1,.36,1);
  --gut:clamp(16px,4vw,48px); --max:1240px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}
body{background:var(--paper);color:var(--ink);font:400 17px/1.55 var(--sans);letter-spacing:-.01em;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img,svg{display:block}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--current);outline-offset:3px;border-radius:8px}
::selection{background:var(--lagoon);color:#fff}
em{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.01em}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-9999px;top:12px;z-index:200;padding:10px 16px;border-radius:999px;background:var(--ink);color:#fff;font-size:14px}
.skip:focus{left:12px}
.i{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:50px;padding:0 24px;border:0;border-radius:999px;font:500 15.5px/1 var(--sans);letter-spacing:-.01em;cursor:pointer;
  transition:transform .35s var(--eo),box-shadow .35s var(--e),background-position .6s var(--e)}
.btn.blue{color:#fff;background:linear-gradient(120deg,#0A8ACB,#0369A8 55%,#032B4E) 0 0/200% 100%;box-shadow:0 10px 26px -10px rgb(3 105 168/.7),inset 0 1px 0 rgb(255 255 255/.18)}
.btn.blue:hover{background-position:100% 0;transform:translateY(-2px);box-shadow:0 16px 34px -12px rgb(3 105 168/.8),inset 0 1px 0 rgb(255 255 255/.18)}
.btn.white{background:#fff;color:var(--deep);box-shadow:0 14px 34px -14px rgb(0 0 0/.5)}
.btn.white:hover{transform:translateY(-2px)}
.btn.lg{height:58px;padding:0 30px;font-size:16.5px}
.btn.sm{height:40px;padding:0 18px;font-size:14px}
.btn.wide{width:100%}
.btn span{transition:transform .35s var(--eo)}
.btn:hover span{transform:translateX(3px)}

/* ---------- nav: one glass pill, the logo seated properly ---------- */
.nav{position:fixed;inset:14px 0 auto;z-index:60;display:flex;justify-content:center;padding:0 var(--gut);pointer-events:none}
.pill{pointer-events:auto;display:flex;align-items:center;gap:6px;height:56px;padding:0 8px 0 20px;border-radius:999px;
  background:rgb(255 255 255/.82);backdrop-filter:blur(18px) saturate(1.6);-webkit-backdrop-filter:blur(18px) saturate(1.6);
  border:1px solid rgb(255 255 255/.6);box-shadow:0 1px 2px rgb(5 7 10/.06),0 14px 40px -18px rgb(1 13 26/.45)}
.logo{display:flex;align-items:center;height:100%;padding-right:14px;margin-right:4px;border-right:1px solid var(--line-2)}
.logo img{height:23px;width:auto}
.links{display:flex;gap:2px}
.links a{padding:9px 13px;border-radius:999px;font:400 14.5px/1 var(--sans);color:var(--ink-2);transition:color .25s var(--e),background .25s var(--e)}
.links a:hover,.links a[aria-current=page]{color:var(--ink);background:rgb(5 7 10/.05)}
.pill .btn{margin-left:6px}
@media (max-width:900px){.links{display:none}.logo{border-right:0}}

/* ---------- water: live where it counts, still everywhere else ---------- */
.water{position:absolute;inset:0;z-index:-1;overflow:hidden;background:#032B4E url(assets/water/surface-deep.jpg) center/cover}
.water[data-pal=night]{background-image:url(assets/water/surface-night.jpg)}
.water canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity 1.2s var(--e)}
.water.gl canvas{opacity:1}
.water::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgb(1 13 26/.35),rgb(1 13 26/.05) 40%,rgb(1 13 26/.35))}

/* ---------- 1 · hero ---------- */
.hero{position:relative;isolation:isolate;overflow:hidden;padding:clamp(112px,13vh,140px) var(--gut) clamp(72px,9vw,120px);color:#fff}
.hero-in{max-width:var(--max);margin:0 auto;text-align:center}
.kick{font:500 15px/1 var(--sans);letter-spacing:.01em;color:var(--glacier);opacity:.92}
.hero h1{max-width:16ch;margin:18px auto 0;font:500 clamp(46px,6.2vw,94px)/.96 var(--sans);letter-spacing:-.055em;text-wrap:balance}
.hero h1 em{font-size:1.08em;letter-spacing:-.02em;color:var(--glacier)}
.hero-in .btn{margin-top:30px}
/* the trust line: faces, five stars, one short line */
.trust{display:flex;align-items:center;gap:14px;width:fit-content;margin:26px auto 0;text-align:left}
.faces{display:flex;padding-left:10px}
.faces .av{width:38px;height:38px;margin-left:-10px;box-shadow:0 0 0 2px #0A3D63}
.tr-t{display:grid;gap:6px;font:400 14.5px/1.2 var(--sans);color:var(--glacier)}
.tr-t b{font-weight:600;color:#fff}
.stars{display:block;width:92px;height:16px;background:#FFC24B;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19 16'%3E%3Cpath d='M8 .5l1.94 5.33 5.67.2-4.47 3.49 1.56 5.45L8 11.8l-4.7 3.17 1.56-5.45L.39 6.03l5.67-.2z'/%3E%3C/svg%3E") 0 0/19px 16px repeat-x;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19 16'%3E%3Cpath d='M8 .5l1.94 5.33 5.67.2-4.47 3.49 1.56 5.45L8 11.8l-4.7 3.17 1.56-5.45L.39 6.03l5.67-.2z'/%3E%3C/svg%3E") 0 0/19px 16px repeat-x}
/* where we get you found: the platforms, in white, quiet */
.brands{max-width:1180px;margin:clamp(56px,6vw,80px) auto 0;text-align:center}
.brands p{font:400 15px/1 var(--sans);color:var(--glacier)}
.brands ul{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:16px clamp(26px,3.6vw,52px);margin-top:24px}
.brands li{display:flex;align-items:center;gap:10px;font:500 18px/1 var(--sans);letter-spacing:-.025em;color:#fff;opacity:.8;transition:opacity .3s var(--e)}
.brands li:hover{opacity:1}
.brands img{width:20px;height:20px;filter:brightness(0) invert(1)}
.brands.ink{margin-top:clamp(36px,4vw,48px)}
.brands.ink p{color:var(--ink-3)}
.brands.ink li{color:var(--ink);opacity:.72}
.brands.ink img{filter:none}
.dash{position:relative;max-width:1180px;margin:clamp(44px,5vw,64px) auto 0;display:grid;grid-template-columns:250px minmax(0,1fr);gap:clamp(24px,3vw,40px);align-items:center}
.rail{list-style:none;display:grid;gap:8px}
.rail li{position:relative;padding:16px 0 16px 22px;opacity:.42;transition:opacity .6s var(--e)}
.rail li b{display:block;font:400 clamp(30px,2.6vw,38px)/1 var(--serif);font-style:italic;letter-spacing:-.01em;color:#fff}
.rail li span{display:block;margin-top:8px;max-width:22ch;font:400 14.5px/1.4 var(--sans);color:var(--glacier)}
.rail li i{position:absolute;left:0;top:16px;bottom:16px;width:2px;border-radius:2px;background:rgb(255 255 255/.18);overflow:hidden}
.rail li i::after{content:"";position:absolute;inset:0;background:#fff;transform:scaleY(0);transform-origin:top}
.rail li.on{opacity:1}
.rail li.on i::after{animation:railfill var(--dwell,5200ms) linear forwards}
@keyframes railfill{to{transform:scaleY(1)}}

/* the window: real browser chrome, no coloured dots */
.win{position:relative;border-radius:18px;background:#fff;color:var(--ink);box-shadow:var(--sh-lg);overflow:hidden;border:1px solid rgb(255 255 255/.5)}
.chrome{display:grid;grid-template-columns:1fr minmax(0,420px) 1fr;align-items:center;gap:14px;height:48px;padding:0 16px;background:#F3F6F9;border-bottom:1px solid var(--line)}
.nav-i{display:flex;gap:12px;color:var(--ink-3)}
.nav-i.r{justify-self:end}
.url{display:flex;align-items:center;justify-content:center;gap:7px;height:30px;padding:0 14px;border-radius:999px;background:#fff;border:1px solid var(--line);font:400 13px/1 var(--sans);color:var(--ink-2)}
.url .i{width:13px;height:13px;color:var(--ink-3)}
.views{position:relative;height:470px}
.v{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .7s var(--e),visibility 0s .7s}
.v.on{opacity:1;visibility:visible;transition:opacity .7s var(--e)}
.v.on .stg{animation:rise .7s var(--eo) both}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.st{color:#F2A93B;letter-spacing:1px;font-size:.92em}

/* view 1 · an AI answer */
.v-ai{display:flex;flex-direction:column}
.th{flex:1;padding:30px clamp(20px,5vw,72px) 0;overflow:hidden}
.msg-u{display:table;margin-left:auto;max-width:80%;padding:12px 18px;border-radius:20px;background:#EEF2F6;font:400 15.5px/1.4 var(--sans)}
.msg-a{display:grid;grid-template-columns:30px minmax(0,1fr);gap:14px;margin-top:22px;font:400 15.5px/1.6 var(--sans);color:var(--ink)}
.ava{width:30px;height:30px;border-radius:50%;background:conic-gradient(from 210deg,#032B4E,#0A8ACB,#12B5CE,#032B4E)}
.ai-l{margin:12px 0 0 20px;display:grid;gap:10px}
.ai-l li{padding-left:4px}
.ai-l b{font-weight:600}
.ai-l .rt{margin-left:6px;font-size:14px;color:var(--ink-3)}
.ai-l .why{display:block;color:var(--ink-2)}
.ai-l li.me b{background:linear-gradient(transparent 62%,rgb(18 181 206/.3) 62%);padding:0 2px}
.v.on .ai-l li{animation:rise .6s var(--eo) both}
.v.on .ai-l li:nth-child(2){animation-delay:.15s}.v.on .ai-l li:nth-child(3){animation-delay:.3s}
.srcs{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.srcs span{display:inline-flex;align-items:center;gap:7px;padding:6px 11px 6px 6px;border-radius:999px;border:1px solid var(--line);font:500 12.5px/1 var(--sans);color:var(--ink-2)}
.fv{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;font:600 9.5px/1 var(--sans);font-style:normal;color:#fff}
.fv.g{background:#4285F4}.fv.y{background:#D32323}.fv.b{background:var(--deep)}.fv.r{background:#C93800;font-size:8px}
.composer{display:flex;align-items:center;justify-content:space-between;margin:0 clamp(20px,5vw,72px) 22px;height:52px;padding:0 8px 0 20px;border-radius:999px;border:1px solid var(--line-2);font:400 15px/1 var(--sans);color:var(--ink-3)}
.composer i{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--ink);color:#fff}

/* view 2 · a Google Maps panel */
.v-seo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}
.gm-l{padding:20px;border-right:1px solid var(--line);overflow:hidden}
.gm-s{display:flex;align-items:center;gap:10px;height:46px;padding:0 16px;border-radius:999px;box-shadow:0 2px 8px -2px rgb(5 7 10/.18);font:400 15px/1 var(--sans)}
.gm-r{list-style:none;margin-top:16px;display:grid}
.gm-r li{display:grid;gap:4px;padding:14px 4px;border-bottom:1px solid var(--line)}
.gm-r li>b{font:500 16px/1.25 var(--sans)}
.gm-r li.me>b{color:var(--ocean)}
.gm-r .rt{font:400 13.5px/1.3 var(--sans);color:var(--ink-3)}.gm-r .rt b{color:var(--ink);font-weight:500}
.gm-r .meta{font:400 13.5px/1.3 var(--sans);color:var(--ink-3)}
.acts{display:flex;gap:8px;margin-top:6px}
.acts a{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;border:1px solid var(--line-2);font:500 12.5px/1 var(--sans);color:var(--ocean)}
.acts .i{width:13px;height:13px}
.v.on .gm-r li{animation:rise .6s var(--eo) both}.v.on .gm-r li:nth-child(2){animation-delay:.15s}.v.on .gm-r li:nth-child(3){animation-delay:.3s}
.gm-map{position:relative;overflow:hidden}
.gm-map svg{position:absolute;inset:0;width:100%;height:100%}
.mp{position:absolute;display:flex;align-items:center;gap:8px;transform:translate(-50%,-100%)}
.mp i{position:relative;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#fff;border:1.5px solid #7C8796;font:600 11px/1 var(--sans);font-style:normal;color:var(--ink-2)}
.mp i::after{content:"";position:absolute;left:50%;top:100%;margin-left:-4px;border:4px solid transparent;border-top:7px solid #7C8796}
.mp.me i{width:38px;height:38px;background:var(--ocean);border:2px solid #fff;color:#fff;font-size:13px;box-shadow:0 10px 22px -6px rgb(3 105 168/.6)}
.mp.me i::after{border-top-color:var(--ocean)}
.mp b{padding:6px 10px;border-radius:8px;background:#fff;box-shadow:0 6px 16px -6px rgb(5 7 10/.3);font:500 12.5px/1 var(--sans);white-space:nowrap}
.v.on .mp.me{animation:drop .8s var(--eo) both .2s}
@keyframes drop{from{opacity:0;transform:translate(-50%,-140%)}to{opacity:1;transform:translate(-50%,-100%)}}

/* view 3 · a site that books */
.v-cro{background:#F4EFE8}
.bk-site{position:absolute;inset:0}
.bk-nav{display:flex;align-items:center;gap:22px;padding:18px 28px;font:400 13px/1 var(--sans);color:#6b6157}
.bk-nav b{margin-right:auto;font:400 22px/1 var(--serif);color:#2A2622}
.bk-nav em{font:500 13px/1 var(--sans);padding:9px 16px;border-radius:999px;background:#5F7259;color:#fff}
.bk-hero{display:grid;grid-template-columns:1fr .9fr;gap:24px;padding:18px 28px}
.bk-h{max-width:11ch;font:400 50px/1 var(--serif);color:#2A2622;letter-spacing:-.01em}
.bk-s{margin-top:14px;max-width:30ch;font:400 14.5px/1.45 var(--sans);color:#6b6157}
.bk-cta{display:inline-block;margin-top:22px;padding:13px 20px;border-radius:999px;background:#5F7259;color:#fff;font:500 14px/1 var(--sans)}
.bk-ph{height:300px;border-radius:200px 200px 16px 16px;background:radial-gradient(60% 50% at 40% 32%,rgb(255 255 255/.55),transparent 70%),radial-gradient(70% 60% at 35% 30%,#F7D9C6 0%,transparent 70%),radial-gradient(60% 70% at 70% 80%,#D9A88E 0%,transparent 70%),linear-gradient(160deg,#EBCDB8,#C99079)}
.bk-card{position:absolute;right:28px;bottom:26px;width:270px;padding:18px;border-radius:16px;background:#fff;box-shadow:0 24px 50px -20px rgb(42 38 34/.45)}
.bk-t{font:500 15px/1.2 var(--sans)}.bk-d{margin-top:4px;font:400 13px/1.2 var(--sans);color:var(--ink-3)}
.slots{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:12px}
.slots span{padding:8px 0;border-radius:8px;border:1px solid var(--line-2);text-align:center;font:500 12.5px/1 var(--sans);color:var(--ink-2)}
.slots .sel{background:#5F7259;border-color:#5F7259;color:#fff}
.bk-go{display:block;margin-top:12px;padding:11px;border-radius:10px;background:var(--ink);color:#fff;text-align:center;font:500 13.5px/1 var(--sans)}
.toast{position:absolute;left:28px;bottom:26px;display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:14px;background:var(--ink);color:#fff;font:400 13.5px/1.3 var(--sans);box-shadow:0 20px 40px -18px rgb(0 0 0/.6)}
.toast .i{color:var(--jade);width:18px;height:18px}
.toast b{font-weight:500;margin-right:4px}
.v.on .toast{animation:rise .6s var(--eo) both .9s}
.v.on .bk-card{animation:rise .7s var(--eo) both .3s}
.bk-stat{position:absolute;right:28px;top:76px;display:none}

/* ---------- sections ---------- */
.sec{position:relative;padding:clamp(96px,12vw,160px) var(--gut) 0;isolation:isolate}
.sec-h{max-width:var(--max);margin:0 auto;text-align:center}
.sec-h h2,.faq h2,.audit h2,.close h2{font:500 clamp(40px,5vw,72px)/1 var(--sans);letter-spacing:-.05em;text-wrap:balance}
.sec-h h2 em,.faq h2 em,.audit h2 em,.close h2 em{font-size:1.1em;letter-spacing:-.015em;color:var(--ocean)}
.sub{margin-top:18px;font:400 19px/1.45 var(--sans);color:var(--ink-2)}
/* side tides: the ocean drifting in at the edges of light sections */
.tide{position:absolute;z-index:-1;top:10%;width:46vw;height:46vw;max-width:720px;max-height:720px;border-radius:50%;filter:blur(90px);opacity:.38;pointer-events:none;animation:tide 18s ease-in-out infinite alternate}
.tide.l{left:-22vw;background:radial-gradient(circle,#12B5CE,transparent 65%)}
.tide.r{right:-22vw;background:radial-gradient(circle,#0A8ACB,transparent 65%);animation-delay:-9s}
@keyframes tide{to{transform:translate3d(4vw,8vh,0) scale(1.12)}}

/* 2 · the statement and the numbers */
.say{text-align:center;overflow:hidden;padding-bottom:20px}
.say-t{max-width:20ch;margin:0 auto;font:500 clamp(34px,4.4vw,62px)/1.08 var(--sans);letter-spacing:-.045em;text-wrap:balance;color:var(--ink)}
.say-t em{font-size:1.1em;color:var(--ocean)}
.nums{list-style:none;max-width:var(--max);margin:clamp(56px,7vw,96px) auto 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,40px);text-align:left}
.nums li{padding-top:24px;border-top:1px solid var(--line-2);font:400 clamp(19px,1.6vw,23px)/1.35 var(--sans);letter-spacing:-.02em;color:var(--ink-2)}
.nums b{font-weight:600;background:var(--num);-webkit-background-clip:text;background-clip:text;color:transparent}

/* 3 · case studies: an endless row of case files */
.row{position:relative;margin:clamp(48px,6vw,72px) calc(-1 * var(--gut)) 0;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.row-t{list-style:none;display:flex;gap:22px;width:max-content;padding:20px 0 40px;animation:slide 80s linear infinite}
.row.slow .row-t{animation-duration:110s}
.row:hover .row-t{animation-play-state:paused}
.row.still .row-t{animation:none;margin:0 auto;padding-inline:var(--gut)}
@keyframes slide{to{transform:translateX(-50%)}}
.cs{flex:none;width:430px}
.cs article{display:flex;flex-direction:column;height:100%;min-height:560px;padding:30px;border-radius:26px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh)}
.cs.dk article{position:relative;isolation:isolate;overflow:hidden;color:#fff;border-color:transparent;background:#032B4E url(assets/water/surface-deep.jpg) center/cover}
.cs.dk article::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgb(1 13 26/.55),rgb(1 13 26/.75))}
.cs-k{display:flex;justify-content:space-between;gap:12px;font:500 15px/1.2 var(--sans)}
.cs-k span{color:var(--ink-3);font-weight:400}
.cs.dk .cs-k span{color:var(--glacier)}
.cs-n{margin-top:34px;font:600 clamp(64px,6vw,84px)/.92 var(--sans);letter-spacing:-.06em;background:var(--num);-webkit-background-clip:text;background-clip:text;color:transparent;white-space:nowrap}
.cs.dk .cs-n{background-image:var(--num-dk)}
.cs-u{margin-top:12px;font:400 17px/1.35 var(--sans);color:var(--ink-2);max-width:26ch}
.cs.dk .cs-u{color:var(--glacier)}
.cs-v{margin-top:26px}
.cs-v svg{width:100%;height:auto;overflow:visible}
.vz-a{fill:var(--lagoon);fill-opacity:.12}.vz-l{fill:none;stroke-width:3;stroke-linecap:round}
.vz-e{fill:var(--ocean);stroke:#fff;stroke-width:3}
.vz-c{fill:#E7EEF5}.vz-k{fill:var(--ocean)}.vz-b{fill:#DCE7F1}
.cs-v text{font:600 12px/1 var(--sans);fill:var(--ink-3)}
.cs-v .vz-k+text,.cs-v text.w{fill:#fff}
.vz-g{stroke:var(--line);stroke-dasharray:3 5;fill:none}
.vz-l2{fill:none;stroke:var(--ocean);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.vz-d{fill:#fff;stroke:var(--ocean);stroke-width:2}
.cs.dk .vz-c,.cs.dk .vz-b{fill:rgb(255 255 255/.14)}.cs.dk .vz-k{fill:var(--lagoon)}.cs.dk .vz-a{fill:#fff;fill-opacity:.08}
.cs.dk .vz-e{fill:var(--lagoon);stroke:#032B4E}.cs.dk .vz-g{stroke:rgb(255 255 255/.15)}.cs.dk .vz-l2{stroke:var(--lagoon)}.cs.dk .vz-d{fill:#032B4E;stroke:var(--lagoon)}
.cs.dk .cs-v text{fill:var(--glacier)}
.cs-d{list-style:none;margin-top:26px;display:grid;gap:9px}
.cs-d li{position:relative;padding-left:26px;font:400 15.5px/1.4 var(--sans);color:var(--ink)}
.cs-d li::before{content:"";position:absolute;left:0;top:4px;width:16px;height:16px;border-radius:50%;background:var(--ocean) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.3l2.3 2.2 4.7-5' fill='none' stroke='%23fff' stroke-width='1.7'/%3E%3C/svg%3E") center/16px no-repeat}
.cs.dk .cs-d li{color:#fff}.cs.dk .cs-d li::before{background-color:var(--lagoon)}
.cq{margin-top:auto;padding-top:24px;border-top:1px solid var(--line)}
.cs.dk .cq{border-color:rgb(255 255 255/.16)}
.cq blockquote{font:400 25px/1.2 var(--serif);font-style:italic;letter-spacing:-.005em}
.cq figcaption{display:flex;align-items:center;gap:12px;margin-top:16px}
.av{display:grid;place-items:center;width:42px;height:42px;flex:none;border-radius:50%;overflow:hidden;background:var(--tide);color:#fff;font:600 12px/1 var(--sans)}
.av img{width:100%;height:100%;object-fit:cover}
.cq figcaption b{display:block;font:500 14.5px/1.3 var(--sans)}
.cq figcaption span span{font:400 13.5px/1.3 var(--sans);color:var(--ink-3)}
.cs.dk .cq figcaption span span{color:var(--glacier)}

/* placeholders: cases, quotes and the rating nobody gave yet, each marked so nobody takes them for real clients */
[data-filler] .cq figcaption::after,.pp-t::after,.trust[data-filler]::after{content:"Placeholder";flex:none;align-self:center;padding:5px 9px;border-radius:999px;font:500 11.5px/1 var(--sans);letter-spacing:.01em;white-space:nowrap}
[data-filler] .cq figcaption::after{margin-left:auto;background:rgb(5 7 10/.06);color:var(--ink-3)}
.cs.dk[data-filler] .cq figcaption::after{background:rgb(255 255 255/.14);color:var(--glacier)}
.pp-t::after{align-self:flex-start;margin-top:10px;background:rgb(255 255 255/.12);color:var(--glacier)}
.trust[data-filler]::after{background:rgb(255 255 255/.14);color:var(--glacier)}

/* 4 · what we do: three compact bands */
.br{max-width:var(--max);margin:clamp(56px,7vw,88px) auto 0;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(28px,4vw,64px);align-items:center}
.br+.br{margin-top:clamp(64px,8vw,110px)}
.br h3 em{font-size:clamp(52px,5.6vw,80px);line-height:.95;letter-spacing:-.02em;color:var(--ink)}
.br-t>p{margin-top:12px;font:400 20px/1.4 var(--sans);letter-spacing:-.02em;color:var(--ink-2)}
.svcs{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:28px}
.svc{display:grid;grid-template-columns:112px minmax(0,1fr);gap:14px;align-items:center;padding:12px;border-radius:16px;background:#fff;border:1px solid var(--line);transition:transform .45s var(--eo),box-shadow .45s var(--e)}
.svc:hover{transform:translateY(-3px);box-shadow:var(--sh)}
.svc .lpfig{padding:8px 6px;border-radius:10px;background:linear-gradient(180deg,#F4F8FB,#EAF1F7)}
.svc h4{font:500 15.5px/1.25 var(--sans);letter-spacing:-.02em}
.svc p{margin-top:3px;font:400 13.5px/1.35 var(--sans);color:var(--ink-3)}
.ins{position:relative;isolation:isolate;overflow:hidden;border-radius:26px;color:#fff;background:#032B4E url(assets/water/surface-deep.jpg) center/cover;box-shadow:var(--sh-lg)}
.ins::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(160deg,rgb(1 13 26/.35),rgb(1 13 26/.78))}
.ins-f{display:flex;align-items:baseline;gap:14px;padding:20px 28px 24px;border-top:1px solid rgb(255 255 255/.14)}
.ins-f b{font:600 54px/1 var(--sans);letter-spacing:-.05em;background:var(--num-dk);-webkit-background-clip:text;background-clip:text;color:transparent}
.ins-f b small{font-size:.5em}
.ins-f span{font:400 16px/1.35 var(--sans);color:var(--glacier)}
.ait{width:100%;border-collapse:collapse;margin-top:14px;font:400 15px/1.3 var(--sans)}
.ait th,.ait td{padding:15px 10px;border-bottom:1px solid rgb(255 255 255/.12)}
.ait thead th{font:500 13px/1 var(--sans);color:var(--glacier);text-align:center}
.ait tbody th{padding-left:28px;text-align:left;font-weight:400;color:#fff}
.ait td{text-align:center}
.ait td i{display:inline-block;width:24px;height:24px;border-radius:50%;border:1.5px dashed rgb(255 255 255/.28)}
.ait td i.on{border:0;background:var(--lagoon) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 12.5l3.2 3.2L17 8.6' fill='none' stroke='%23fff' stroke-width='2.2'/%3E%3C/svg%3E") center/24px no-repeat;box-shadow:0 0 18px -2px rgb(18 181 206/.7)}
.js .ins .ait td i.on{transform:scale(0);transition:transform .55s var(--eo)}
.js .ins.in .ait td i.on{transform:none}
.mg{display:grid;grid-template-columns:repeat(7,40px);justify-content:center;gap:12px;padding:34px 20px}
.mg span{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;font:600 12.5px/1 var(--sans);color:#fff}
.mg .g1{background:var(--lagoon);box-shadow:0 0 16px -4px rgb(18 181 206/.8)}.mg .g2{background:rgb(10 138 203/.75)}.mg .g3{background:rgb(255 255 255/.16)}
.mg .me{background:#fff;color:var(--deep);outline:3px solid var(--lagoon);outline-offset:3px}
.js .ins .mg span{opacity:0;transform:scale(.5)}
.js .ins.in .mg span{opacity:1;transform:none;transition:opacity .5s var(--e),transform .6s var(--eo)}
.cro{display:grid;grid-template-columns:180px minmax(0,1fr);gap:28px;align-items:center;padding:30px 28px}
.phone{width:180px;height:330px;padding:9px;border-radius:30px;background:#0B0F14;box-shadow:0 0 0 1px rgb(255 255 255/.15),0 20px 40px -16px rgb(0 0 0/.6)}
.ph{position:relative;height:100%;padding:26px 14px 14px;border-radius:22px;background:#F4EFE8;color:#2A2622;overflow:hidden}
.ph b{font:400 15px/1 var(--serif)}
.ph p{margin-top:12px;font:400 21px/1.02 var(--serif)}
.ph-i{display:block;height:110px;margin-top:12px;border-radius:12px;background:radial-gradient(70% 60% at 35% 30%,#F7D9C6 0%,transparent 70%),linear-gradient(160deg,#EBCDB8,#C99079)}
.ph-b{position:absolute;left:12px;right:12px;bottom:12px;padding:11px;border-radius:999px;background:#5F7259;color:#fff;text-align:center;font:500 12px/1 var(--sans);animation:pulse 2.4s var(--e) infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgb(95 114 89/.5)}70%{box-shadow:0 0 0 12px rgb(95 114 89/0)}100%{box-shadow:0 0 0 0 rgb(95 114 89/0)}}
.fn{list-style:none;display:grid;gap:12px}
.fn li{position:relative;display:flex;justify-content:space-between;align-items:baseline;padding:16px 18px;border-radius:14px;overflow:hidden;background:rgb(255 255 255/.08);font:400 15px/1.2 var(--sans);color:var(--glacier)}
.fn li::before{content:"";position:absolute;inset:0;width:var(--w);background:linear-gradient(90deg,rgb(18 181 206/.55),rgb(10 138 203/.35));transform-origin:left}
.js .ins .fn li::before{transform:scaleX(0)}
.js .ins.in .fn li::before{transform:none;transition:transform 1.3s var(--eo)}
.fn li span,.fn li b{position:relative}
.fn b{font:600 26px/1 var(--sans);letter-spacing:-.04em;color:#fff}

/* the line drawings, in ink and ocean */
.lpfig svg{width:100%;height:auto;overflow:visible}
.lpfig .s{fill:none;stroke:var(--ink);stroke-width:1.1;stroke-opacity:.72}
.lpfig .s2{fill:none;stroke:var(--ink);stroke-width:1;stroke-opacity:.35}
.lpfig .d{fill:none;stroke:var(--ink);stroke-width:1;stroke-opacity:.38;stroke-dasharray:3 3}
.lpfig .k{fill:none;stroke:var(--ocean);stroke-width:1.6}
.lpfig .kd{fill:none;stroke:var(--ocean);stroke-width:1.4;stroke-dasharray:4 3}
.lpfig .kf{fill:var(--ocean)}
.lpfig .pf{fill:#fff}
.lpfig text{font:600 9px var(--sans);letter-spacing:.04em;text-transform:uppercase;fill:var(--ink);fill-opacity:.6}
.lpfig text.kt{fill:var(--ocean);fill-opacity:1}
.svc .lpfig text{display:none}

/* 5 · how it works: four small screens */
.steps{list-style:none;max-width:var(--max);margin:clamp(48px,6vw,72px) auto 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.steps li h3{margin-top:22px;font:400 32px/1 var(--serif)}
.steps li h3 em{color:var(--ink)}
.steps li p{margin-top:8px;font:400 16px/1.45 var(--sans);color:var(--ink-2);max-width:24ch}
.sc{display:flex;flex-direction:column;justify-content:center;gap:10px;height:220px;padding:22px;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh);overflow:hidden}
.sbx{display:flex;align-items:center;gap:8px;height:42px;padding:0 14px;border-radius:999px;box-shadow:0 2px 8px -2px rgb(5 7 10/.18);font:400 13.5px/1 var(--sans);white-space:nowrap;overflow:hidden}
.caret{display:inline-block;width:1.5px;height:15px;background:var(--ocean);animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.sg{padding:4px 14px;font:400 13px/1.3 var(--sans);color:var(--ink-3)}.sg b{color:var(--ink);font-weight:500}
.an{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;border:1px solid var(--line);font:500 14px/1.2 var(--sans)}
.an i{display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:#EEF2F6;font:600 11px/1 var(--sans);font-style:normal;color:var(--ink-2)}
.an small{margin-left:auto;font:400 12px/1 var(--sans);color:var(--ink-3)}
.an.me{border-color:rgb(3 105 168/.35);background:linear-gradient(180deg,#F2F9FD,#fff)}.an.me i{background:var(--ocean);color:#fff}
.sc-1,.sc-2,.sc-3,.sc-4{justify-content:center}
.rv-n{font:600 40px/1 var(--sans);letter-spacing:-.04em}.rv-n .st{font-size:18px;margin-left:6px;vertical-align:middle}
.rv-q{padding:10px 14px;border-radius:12px;background:#F3F6F9;font:400 16px/1.3 var(--serif);font-style:italic}
.cl{display:flex;align-items:center;gap:12px;padding:14px;border-radius:16px;background:var(--ink);color:#fff;font:400 12.5px/1.3 var(--sans)}
.cl i{position:relative;display:grid;place-items:center;width:40px;height:40px;flex:none;border-radius:50%;background:var(--jade);font-style:normal}
.cl i::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--jade);animation:ring 1.6s var(--eo) infinite}
@keyframes ring{from{transform:scale(1);opacity:.9}to{transform:scale(1.7);opacity:0}}
.cl b{display:block;font:500 15px/1.2 var(--sans)}
.bk{padding:12px 14px;border-radius:14px;border:1px solid rgb(3 105 168/.3);background:#F2F9FD;font:500 14px/1.2 var(--sans);color:var(--deep)}

/* 6 · the monthly report, wide, on glass water */
.rep{padding-bottom:clamp(80px,10vw,140px);overflow:hidden}
.rep::before{content:"";position:absolute;inset:clamp(40px,6vw,80px) 0 0;z-index:-1;background:url(assets/water/surface-glass.jpg) center/cover;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 25%,#000 80%,transparent);mask-image:linear-gradient(180deg,transparent,#000 25%,#000 80%,transparent);opacity:.85}
.port{max-width:1360px;margin:clamp(48px,6vw,72px) auto 0;border-radius:24px}
.pt{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;padding:18px;background:#F4F7FA}
.k{padding:26px;border-radius:18px;background:#fff;border:1px solid var(--line)}
.k1{grid-column:span 5;grid-row:span 2}.k2{grid-column:span 3}.k3{grid-column:span 4}.k4{grid-column:span 3}.k5{grid-column:span 4}
.kl{display:block;font:500 15px/1.2 var(--sans);color:var(--ink-3)}
.kn{display:block;margin-top:14px;font:600 clamp(64px,7vw,104px)/.9 var(--sans);letter-spacing:-.065em;background:var(--num);-webkit-background-clip:text;background-clip:text;color:transparent}
.kd{display:inline-flex;align-items:center;gap:4px;margin-top:14px;padding:6px 10px;border-radius:999px;background:rgb(31 191 152/.12);color:#127A60;font:500 13.5px/1 var(--sans)}
.kd .i{width:13px;height:13px}
.kc{width:100%;height:auto;margin-top:26px}
.ka{fill:var(--lagoon);fill-opacity:.12}.kln{fill:none;stroke:var(--ocean);stroke-width:3;stroke-linecap:round}
.ke{list-style:none;margin-top:22px;border-top:1px solid var(--line)}
.ke li{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line);font:400 15.5px/1 var(--sans);color:var(--ink-2)}
.ke b{font-weight:600;color:var(--ink)}
.kb{width:100%;height:auto;margin-top:20px}.kb rect{fill:#D8E7F3}.kb rect.hi{fill:var(--ocean)}
.dn{list-style:none;margin-top:14px;display:grid;gap:2px}
.dn li{position:relative;padding:9px 0 9px 26px;border-bottom:1px solid var(--line);font:400 14.5px/1.3 var(--sans)}
.dn li::before{content:"";position:absolute;left:0;top:10px;width:16px;height:16px;border-radius:50%;background:var(--jade) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.3l2.3 2.2 4.7-5' fill='none' stroke='%23fff' stroke-width='1.7'/%3E%3C/svg%3E") center/16px no-repeat}

/* 7 · templates to choose from: big cards, an endless row */
.built{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:14px;font:500 14.5px/1 var(--sans);color:var(--ink-3)}
.built img{width:16px;height:16px;opacity:.75}
.tp{display:block;width:clamp(320px,44vw,620px)}
.tp-f{display:block;border-radius:20px;overflow:hidden;background:#fff;box-shadow:var(--sh);border:1px solid var(--line);transition:transform .6s var(--eo),box-shadow .6s var(--e)}
.tp:hover .tp-f{transform:translateY(-6px);box-shadow:var(--sh-lg)}
.tp img{width:100%;height:auto;aspect-ratio:1200/750;object-fit:cover}
.tp-c{display:flex;align-items:baseline;gap:12px;padding:16px 6px 0}
.tp-c b{font:500 19px/1.2 var(--sans);letter-spacing:-.02em}
.tp-c span{font:400 15px/1.2 var(--sans);color:var(--ink-3)}
.tp-c i{margin-left:auto;font-style:normal;color:var(--ink-3);transition:transform .35s var(--eo),color .35s var(--e)}
.tp:hover .tp-c i{transform:translate(2px,-2px);color:var(--ocean)}

/* 8 · who we work with */
.who{overflow:hidden}
.um{list-style:none;max-width:var(--max);margin:clamp(48px,6vw,72px) auto 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.um li{padding:26px;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh)}
.um .lpfig{padding:16px 10px;margin-bottom:20px;border-radius:14px;background:linear-gradient(180deg,#F4F8FB,#EAF1F7)}
.um h3{font:500 21px/1.2 var(--sans);letter-spacing:-.03em}
.um p{margin-top:8px;font:400 15px/1.45 var(--sans);color:var(--ink-3)}

/* 9 · the switches */
.tog-band{margin:clamp(40px,5vw,56px) auto 0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.tog-row{list-style:none;display:flex;gap:12px;width:max-content;padding:6px 0;animation:slide 50s linear infinite}
.tog-band:hover .tog-row{animation-play-state:paused}
.tog{display:flex;align-items:center;gap:14px;padding:12px 12px 12px 20px;border-radius:999px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh);font:500 15px/1 var(--sans);white-space:nowrap}
.sw{position:relative;width:42px;height:25px;border-radius:999px;background:#D5DDE6;flex:none}
.sw i{position:absolute;left:3px;top:3px;width:19px;height:19px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgb(5 7 10/.25)}
.sw.on{background:linear-gradient(120deg,#12B5CE,#0369A8)}.sw.on i{transform:translateX(17px)}

/* 9b · the owners: cut-out portraits standing in water, the head above the frame */
.ppl{list-style:none;max-width:var(--max);margin:clamp(48px,6vw,72px) auto 0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.pp figure{position:relative;isolation:isolate;display:flex;flex-direction:column;height:100%;padding-top:44px;color:#fff}
.pp figure::before{content:"";position:absolute;inset:44px 0 0;z-index:-1;border-radius:24px;box-shadow:var(--sh);
  background:radial-gradient(70% 34% at 50% 12%,rgb(18 181 206/.6),transparent 72%),linear-gradient(180deg,rgb(3 105 168/.35),rgb(1 13 26/.82) 78%),#032B4E url(assets/water/surface-deep.jpg) center/cover}
.pp-f{position:relative;height:250px;margin-top:-44px;display:grid;place-items:center}
.pp-f img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 100%;
  -webkit-mask-image:linear-gradient(180deg,#000 82%,transparent);mask-image:linear-gradient(180deg,#000 82%,transparent);transition:transform .8s var(--eo)}
.pp:hover .pp-f img{transform:translateY(-4px)}
.pp-f span{font:400 64px/1 var(--serif);font-style:italic;color:var(--glacier);opacity:.55}
.pp-t{display:flex;flex-direction:column;flex:1;padding:6px 20px 22px}
.pp blockquote{margin-top:14px;font:400 21px/1.2 var(--serif);font-style:italic;letter-spacing:-.005em}
.pp figcaption{margin-top:18px}
.pp figcaption b{display:block;font:500 14.5px/1.3 var(--sans)}
.pp figcaption span{display:block;margin-top:2px;font:400 13px/1.35 var(--sans);color:var(--glacier)}
.pp-r{align-self:flex-start;margin-top:auto;padding:8px 12px;border-radius:999px;background:rgb(255 255 255/.1);border:1px solid rgb(255 255 255/.16);font:500 13px/1.1 var(--sans);color:#fff}

/* 10 · the free report: deep water, a white card */
.audit{position:relative;isolation:isolate;overflow:hidden;margin-top:clamp(96px,12vw,160px);padding:clamp(88px,10vw,140px) var(--gut);color:#fff}
.audit .water::after{background:linear-gradient(120deg,rgb(1 13 26/.7),rgb(1 13 26/.25))}
.au-in{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,5fr);gap:clamp(36px,6vw,96px);align-items:center}
.audit h2{max-width:11ch}
.audit h2 em{color:var(--glacier)}
.au-l>p{margin-top:20px;max-width:38ch;font:400 19px/1.45 var(--sans);color:var(--glacier)}
.au-l ol{list-style:none;counter-reset:a;margin-top:30px;border-top:1px solid rgb(255 255 255/.16)}
.au-l li{counter-increment:a;display:grid;grid-template-columns:44px minmax(0,1fr);padding:16px 0;border-bottom:1px solid rgb(255 255 255/.16);font:500 18px/1.35 var(--sans);letter-spacing:-.02em}
.au-l li::before{content:"0" counter(a);font:500 13px/1.9 var(--mono);color:var(--lagoon)}
.au-k{margin-top:20px;font:400 16px/1.4 var(--sans);color:var(--glacier)}
.rep-f{padding:clamp(26px,3vw,38px);border-radius:26px;background:#fff;color:var(--ink);box-shadow:0 40px 90px -30px rgb(0 0 0/.6)}
.fld{display:flex;flex-direction:column;gap:7px;margin-bottom:16px}
.fld.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fld.two>div{display:flex;flex-direction:column;gap:7px}
.fld label{font:500 13.5px/1 var(--sans);color:var(--ink-2)}
.fld .opt{margin-left:6px;font-weight:400;color:var(--ink-3)}
.fld input,.fld select{height:52px;padding:0 16px;border:1px solid var(--line-2);border-radius:14px;background:#F8FAFC;font:400 16px/1 var(--sans);color:var(--ink);outline:none;appearance:none;-webkit-appearance:none;transition:border-color .25s var(--e),box-shadow .25s var(--e),background .25s var(--e)}
.fld select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%233C4655' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px}
.fld input::placeholder{color:#97A3B2}
.fld input:focus,.fld select:focus{border-color:var(--current);background:#fff;box-shadow:0 0 0 4px rgb(10 138 203/.16)}
.fld [aria-invalid=true]{border-color:#D9483B;box-shadow:0 0 0 4px rgb(217 72 59/.1)}
.rep-f .btn{margin-top:8px}
.f-msg{min-height:1.4em;margin-top:12px;font:400 14px/1.4 var(--sans);color:#B3392E}
.f-done{margin-top:4px;font:400 24px/1.3 var(--serif);font-style:italic}
.f-done:focus{outline:none}

/* 11 · FAQ */
.faq{padding-bottom:clamp(96px,12vw,160px)}
.faq-in{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(32px,5vw,80px)}
.faq h2{max-width:9ch}
.acc{border-top:1px solid var(--line-2)}
.acc details{border-bottom:1px solid var(--line-2)}
.acc summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 4px;cursor:pointer;font:500 21px/1.25 var(--sans);letter-spacing:-.025em}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"";width:14px;height:14px;flex:none;background:linear-gradient(var(--ocean),var(--ocean)) center/14px 2px no-repeat,linear-gradient(var(--ocean),var(--ocean)) center/2px 14px no-repeat;transition:transform .4s var(--eo)}
.acc details[open] summary::after{transform:rotate(45deg)}
.acc details p{padding:0 4px 26px;max-width:60ch;font:400 17px/1.55 var(--sans);color:var(--ink-2)}

/* 12 · the close and the footer: one band of water, the name as its background */
.close{position:relative;isolation:isolate;overflow:hidden;padding:clamp(120px,14vw,200px) var(--gut) 40px;color:#fff;text-align:center}
.wm{position:absolute;left:50%;bottom:clamp(70px,9vw,120px);transform:translateX(-50%);z-index:-1;width:max-content;font:600 clamp(80px,15.5vw,250px)/.8 var(--sans);letter-spacing:-.07em;white-space:nowrap;
  background:linear-gradient(180deg,rgb(207 241 246/.26),rgb(207 241 246/.04));-webkit-background-clip:text;background-clip:text;color:transparent;pointer-events:none;user-select:none}
.close-in h2{max-width:14ch;margin:0 auto}
.close-in h2 em{color:var(--glacier)}
.close-in .btn{margin-top:38px}
.foot{max-width:var(--max);margin:clamp(140px,18vw,260px) auto 0;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:22px;border-top:1px solid rgb(255 255 255/.16)}
.foot img{height:22px;width:auto}
.foot nav{display:flex;flex-wrap:wrap;gap:6px 22px}
.foot nav a{font:400 14.5px/1.4 var(--sans);color:var(--glacier)}
.foot nav a:hover{color:#fff}
.foot p{font:400 13.5px/1.4 var(--sans);color:rgb(207 241 246/.7)}

/* the dock: one button, always at hand */
.dock{position:fixed;right:24px;bottom:24px;z-index:55;white-space:nowrap;transition:transform .5s var(--eo),opacity .4s var(--e)}
.dock.hide{transform:translateY(140%);opacity:0;pointer-events:none}
@media (max-width:760px){.dock{right:auto;left:50%;transform:translateX(-50%)}.dock.hide{transform:translate(-50%,140%)}}

/* reveals */
.js [data-rv]{opacity:0;transform:translateY(24px)}
.js [data-rv].in{opacity:1;transform:none;transition:opacity .9s var(--e),transform 1.1s var(--eo)}

/* ---------- smaller screens ---------- */
@media (max-width:1100px){
  .dash{grid-template-columns:minmax(0,1fr)}
  .rail{display:flex;justify-content:center;gap:clamp(14px,4vw,36px)}
  .rail li{padding:0 0 14px;text-align:center}
  .rail li span{display:none}
  .rail li i{left:0;right:0;top:auto;bottom:0;width:auto;height:2px}
  .rail li i::after{transform:scaleX(0);transform-origin:left}
  .rail li.on i::after{animation-name:railfillx}
  .br{grid-template-columns:minmax(0,1fr)}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .um{grid-template-columns:repeat(2,minmax(0,1fr))}
  .k1,.k2,.k3,.k4,.k5{grid-column:span 6;grid-row:auto}
  .au-in,.faq-in{grid-template-columns:minmax(0,1fr)}
  .ppl{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(-1 * var(--gut));padding:4px var(--gut) 20px;scrollbar-width:none}
  .ppl::-webkit-scrollbar{display:none}
  .ppl>li{flex:0 0 260px;scroll-snap-align:center}
  .js .ppl>li[data-rv]{opacity:1;transform:none}
}
@keyframes railfillx{to{transform:scaleX(1)}}
@media (max-width:760px){
  .hero h1{font-size:clamp(44px,12.5vw,64px)}
  .rail li b{font-size:24px}
  .views{height:440px}
  .v-seo{grid-template-columns:minmax(0,1fr)}
  .gm-map{display:none}
  .chrome{grid-template-columns:minmax(0,1fr)}
  .chrome .nav-i{display:none}
  .th{padding:22px 18px 0}
  .composer{margin:0 18px 18px}
  .bk-hero{grid-template-columns:minmax(0,1fr)}.bk-ph{display:none}.bk-h{font-size:38px}
  .bk-nav span{display:none}
  .bk-card{left:18px;right:18px;width:auto;bottom:18px}
  .toast{display:none}
  .nums{grid-template-columns:minmax(0,1fr)}
  .cs{width:84vw}
  .cs article{min-height:520px}
  .svcs{grid-template-columns:minmax(0,1fr)}
  .mg{grid-template-columns:repeat(7,32px);gap:8px}.mg span{width:32px;height:32px;font-size:10.5px}
  .cro{grid-template-columns:minmax(0,1fr);justify-items:center}.fn{width:100%}
  .ait th,.ait td{padding:12px 4px}.ait thead th{font-size:11px}.ait tbody th{padding-left:14px;font-size:13.5px}
  .steps,.um{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-inline:calc(-1 * var(--gut));padding:4px var(--gut) 20px;scrollbar-width:none}
  .steps::-webkit-scrollbar,.um::-webkit-scrollbar{display:none}
  .steps>li,.um>li{flex:0 0 80%;scroll-snap-align:center}
  .js .steps>li[data-rv],.js .um>li[data-rv]{opacity:1;transform:none}
  .svc{grid-template-columns:86px minmax(0,1fr)}
  .k1,.k2,.k3,.k4,.k5{grid-column:span 12}
  .fld.two{grid-template-columns:minmax(0,1fr)}
  .tp{width:84vw}
  .ppl>li{flex-basis:72%}
  .trust{gap:12px}.faces .av{width:34px;height:34px}.tr-t{font-size:13.5px}
  .brands ul{gap:14px 22px}.brands li{font-size:16px}
  .foot{flex-direction:column;align-items:flex-start;text-align:left}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js [data-rv]{opacity:1;transform:none}
  .js .ins .ait td i.on,.js .ins .mg span,.js .ins .fn li::before{opacity:1;transform:none}
  .row-t{flex-wrap:wrap;width:auto;justify-content:center}
}
