/* ------------------------------------------------------------------
   APEX MARINE & LOGISTICS. The whole look lives in these tokens.
   ------------------------------------------------------------------ */
@font-face{font-family:"Barlow Condensed";src:url(fonts/barlow-condensed-600.woff) format("woff");font-weight:600;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url(fonts/barlow-condensed-700.woff) format("woff");font-weight:700;font-display:swap}
@font-face{font-family:"Barlow";src:url(fonts/barlow-400.woff) format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"Barlow";src:url(fonts/barlow-500.woff) format("woff");font-weight:500;font-display:swap}
@font-face{font-family:"Barlow";src:url(fonts/barlow-600.woff) format("woff");font-weight:600;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(fonts/plex-mono-400.woff) format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(fonts/plex-mono-500.woff) format("woff");font-weight:500;font-display:swap}

:root{
  --water:#061421;--water2:#0a1d2e;--water3:#0f2a40;--steel:#1a3a52;
  --line:rgba(176,214,240,.17);--line2:rgba(176,214,240,.32);
  --foam:#edf3f6;--mist:#a5bccb;--fog:#7f98aa;
  --signal:#f29a2e;--signal2:#ffb45c;--blue:#8fd0f2;
  --paper:#eef3f5;--paper2:#dfe7eb;--ink:#0a1f30;--ink2:#3f5868;
  --display:"Barlow Condensed","Arial Narrow",sans-serif;
  --text:"Barlow",system-ui,sans-serif;
  --mono:"Plex Mono",ui-monospace,Menlo,monospace;
  --edge:clamp(20px,4vw,64px);
  --max:1480px;
  --unit:1lvh;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip;background:var(--water);scroll-padding-top:90px}
body{margin:0;background:var(--water);color:var(--foam);font:400 18px/1.55 var(--text);-webkit-font-smoothing:antialiased;overflow-x:clip}
img,svg,canvas{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,p,ul,ol,dl,dd{margin:0;padding:0}
ul,ol{list-style:none}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
:focus-visible{outline:2px solid var(--signal);outline-offset:3px}
[hidden]{display:none!important}
.skip{position:fixed;left:12px;top:-60px;z-index:100;background:var(--signal);color:var(--ink);padding:10px 16px;font-weight:600;border-radius:4px}
.skip:focus{top:12px}
main:focus{outline:0}

/* Type */
h1,h2,.h2{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.002em;line-height:.92;text-wrap:balance}
h1{font-size:clamp(76px,11.2vw,196px);line-height:.86}
h2,.h2{font-size:clamp(40px,5.2vw,86px)}
h3{font-family:var(--display);font-weight:600;font-size:clamp(25px,2.3vw,34px);line-height:1.06;letter-spacing:.006em}
h1 i,h2 i,.h2 i{font-style:normal;color:var(--signal)}
.label{font:500 12.5px/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mist)}
.label b{font-weight:500;color:var(--signal)}
.lede{font-size:clamp(19px,1.5vw,23px);line-height:1.42;max-width:38em;color:#d6e2ea}
.small{font-size:15px;line-height:1.5;color:var(--mist)}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--edge)}
.sec{position:relative;padding:clamp(60px,7vw,112px) 0;background:var(--water)}
.sec.tint{background:var(--water2)}
.head{display:grid;gap:16px;margin-bottom:clamp(28px,3.4vw,52px);max-width:1120px}
.head .lede{margin-top:4px}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:54px;padding:0 26px;border-radius:3px;font:600 17px/1 var(--text);text-decoration:none;transition:background .25s,color .25s,border-color .25s,transform .25s var(--ease)}
.btn svg{width:17px;height:17px;flex:none;transition:transform .3s var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn-solid{background:var(--signal);color:var(--ink)}
.btn-solid:hover{background:var(--signal2)}
.btn-line{border:1px solid var(--line2);color:var(--foam);background:rgba(6,20,33,.32);backdrop-filter:blur(6px)}
.btn-line:hover{border-color:var(--foam)}
.btn-small{min-height:42px;padding:0 18px;font-size:15.5px}
.cta{display:flex;flex-wrap:wrap;gap:12px}
.thin-only{display:none}
@media (max-width:720px){.wide-only{display:none}.thin-only{display:inline}}
.link{display:inline-flex;align-items:center;gap:9px;font-weight:600;text-decoration:none;border-bottom:1px solid var(--line2);padding-bottom:3px;transition:border-color .2s,color .2s}
.link svg{width:15px;height:15px}
.link:hover{color:var(--signal2);border-color:var(--signal2)}

/* Top bar */
.bar{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .3s,box-shadow .3s,color .3s}
.bar-in{display:flex;align-items:center;justify-content:space-between;gap:24px;max-width:calc(var(--max) + 120px);margin:0 auto;padding:16px var(--edge)}
.bar.solid{background:rgba(6,20,33,.9);backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--line)}
.logo{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--foam)}
.logo b{font:700 33px/.9 var(--display);letter-spacing:.05em}
.logo span{font:500 10px/1.24 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--mist);border-left:1px solid var(--line2);padding-left:10px}
.bar-links{display:flex;align-items:center;gap:clamp(16px,2.2vw,32px);font-weight:500;font-size:16px}
.bar-links>a:not(.btn){text-decoration:none;color:#dbe6ed}
.bar-links>a:not(.btn):hover{color:var(--signal2)}
.menu-toggle{display:none;min-height:44px;padding:0 4px;font:500 13px var(--mono);letter-spacing:.12em;text-transform:uppercase}
.menu{position:fixed;inset:0;z-index:45;background:var(--water);padding:100px var(--edge) 32px;overflow:auto;display:flex;flex-direction:column;gap:28px}
.menu ul{display:grid;gap:4px}
.menu a{text-decoration:none}
.menu ul a{font:700 clamp(36px,9vw,64px)/1.08 var(--display);text-transform:uppercase}
.menu ul ul{margin:6px 0 14px}
.menu ul ul a{font:500 18px/1.6 var(--text);text-transform:none;color:var(--mist)}

/* The film */
#stage{position:fixed;inset:0 0 auto 0;height:100lvh;background:var(--water) center/cover no-repeat;background-image:var(--poster);z-index:0}
@media (max-width:720px){#stage{background-image:var(--poster-phone)}html:not(.live) .beat-hero{background-image:var(--poster-phone)!important}}
.layer-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity 1.1s}
.layer-canvas.shown{opacity:1}
#grade{position:fixed;inset:0 0 auto 0;height:100lvh;pointer-events:none;z-index:1;background:radial-gradient(120% 90% at 50% 45%,transparent 55%,rgba(2,9,16,.5))}
#veil{position:fixed;inset:0 0 auto 0;height:100lvh;background:var(--water);opacity:0;pointer-events:none;z-index:2}
main{position:relative;z-index:3}
.story{position:relative}
.live .story{height:calc(var(--unit)*520)}
.live .reel{position:sticky;top:0;height:100lvh;overflow:clip}
.live .beat{position:absolute;inset:0;pointer-events:none}
.frame{max-width:calc(var(--max) + 120px);margin:0 auto;padding:0 var(--edge)}
.live .frame{position:absolute;inset:0;left:0;right:0;display:flex;padding:112px var(--edge) clamp(68px,9lvh,96px)}
.live .frame.bottom{align-items:flex-end}
.live .frame.mid{align-items:center}
.live .frame.right{justify-content:flex-end}
.live .frame.centre{align-items:center;justify-content:center;text-align:center}
.frame-in{pointer-events:auto;will-change:opacity,transform}
.live .frame-in{visibility:hidden;opacity:0}
.live .frame-in.hero{visibility:visible;opacity:1}
.frame-in.hero{max-width:min(980px,100%);display:grid;gap:22px}
.hero .lede{max-width:33em}
.hero-fine{font:400 12.5px/1.4 var(--mono);letter-spacing:.06em;color:var(--mist)}
.beat-body{max-width:min(470px,100%);display:grid;gap:12px;padding:clamp(16px,1.6vw,24px);background:linear-gradient(120deg,rgba(6,20,33,.66),rgba(6,20,33,.34));backdrop-filter:blur(6px);border-left:2px solid var(--signal)}
.beat-body h2{font-size:clamp(34px,3.5vw,56px);line-height:.96}
.beat-body p:not(.label){color:#d8e4eb;font-size:17px;line-height:1.42}
.beat-big{max-width:1100px;display:grid;gap:20px;text-shadow:0 2px 34px rgba(3,10,18,.7)}
.beat-links{display:flex;flex-wrap:wrap;gap:8px 10px}
.tag{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:0 13px;border:1px solid var(--line2);border-radius:2px;font-size:15px;font-weight:500;text-decoration:none;background:rgba(6,20,33,.34);transition:border-color .2s,background .2s}
.tag:hover{border-color:var(--signal);background:rgba(242,154,46,.14)}
.tag svg{width:13px;height:13px}
.tag em{font:400 10.5px var(--mono);letter-spacing:.1em;text-transform:uppercase;font-style:normal;color:var(--signal2)}
.last h2{font-size:clamp(52px,9vw,150px)}
.still{display:none}
#pins{position:fixed;inset:0 0 auto 0;height:100lvh;z-index:4;pointer-events:none;overflow:clip}
.pin{position:absolute;left:0;top:0;display:flex;align-items:center;gap:8px;opacity:0;transition:opacity .35s;font:500 12px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;color:var(--foam);will-change:transform}
.pin::before{content:"";width:9px;height:9px;flex:none;border-radius:50%;background:var(--signal);box-shadow:0 0 0 4px rgba(242,154,46,.26)}
.pin span{padding:6px 9px;background:rgba(6,20,33,.76);backdrop-filter:blur(4px)}
.pin.flip{flex-direction:row-reverse}
.pin.on{opacity:1}
.pin.city::before{background:var(--blue);box-shadow:0 0 0 4px rgba(143,208,242,.22)}
.filmbar{position:fixed;left:50%;bottom:calc(12px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:6;width:min(620px,calc(100vw - 24px));display:flex;align-items:center;gap:10px;padding:3px 5px;background:rgba(6,20,33,.66);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:3px;transition:opacity .35s}
.filmbar.gone{opacity:0;pointer-events:none}
.fb-btn{display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:0 9px;font:600 14.5px/1 var(--text);white-space:nowrap;color:var(--foam);flex:none;transition:color .2s}
.fb-btn:hover{color:var(--signal2)}
.fb-btn svg{width:13px;height:13px;flex:none}
.fb-btn .ic-pause,.fb-btn[aria-pressed=true] .ic-play{display:none}
.fb-btn[aria-pressed=true] .ic-pause{display:block}
.fb-steps{flex:1;display:flex;gap:4px;min-width:0}
.fb-steps li{flex:1;min-width:0}
.fb-step{display:block;position:relative;width:100%;height:40px}
.fb-step::before,.fb-step i{content:"";position:absolute;left:0;right:0;top:50%;height:3px;margin-top:-1.5px}
.fb-step::before{background:rgba(176,214,240,.3)}
.fb-step i{background:var(--signal);transform:scaleX(0);transform-origin:left}
.fb-step:hover::before{background:rgba(176,214,240,.6)}
.fb-now{flex:none;width:9.4em;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mist);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.live .still-only{display:none}
html:not(.live) .live-only{display:none}
.film-note{position:fixed;left:var(--edge);bottom:8px;z-index:6;font:400 10.5px var(--mono);letter-spacing:.06em;color:var(--fog);pointer-events:none;transition:opacity .4s}

/* Without the film: the same story, as a calm page */
html:not(.live) #stage,html:not(.live) #grade,html:not(.live) #veil,html:not(.live) #pins,html:not(.live) .filmbar,html:not(.live) .film-note{display:none}
html:not(.live) .beat{padding:0}
html:not(.live) .beat-hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;padding:120px 0 56px;background:var(--water) var(--poster) center/cover no-repeat}
html:not(.live) .beat-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,20,33,.2) 30%,rgba(6,20,33,.92))}
html:not(.live) .beat-hero .frame{position:relative;z-index:1;width:100%}
html:not(.live) .beat-big{padding:clamp(70px,10vw,130px) 0 clamp(24px,4vw,50px)}
html:not(.live) .beat:not(.beat-hero):not(.beat-open) .frame{display:grid;gap:clamp(20px,4vw,64px);align-items:center;padding-bottom:clamp(30px,5vw,70px)}
html:not(.live) .still{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--water2)}
html:not(.live) .beat-body{background:none;backdrop-filter:none;padding:4px 0 4px 22px;max-width:640px}
html:not(.live) .beat-body h2{font-size:clamp(38px,4.6vw,68px)}
@media (min-width:900px){html:not(.live) .beat:not(.beat-hero):not(.beat-open) .frame{grid-template-columns:1fr 1fr}html:not(.live) .frame.right .still{order:-1}}
html:not(.live) .beat-last{padding:clamp(60px,9vw,120px) 0;text-align:center}
html:not(.live) .beat-last .frame-in{width:100%}
.below{position:relative;z-index:3;background:var(--water)}

/* Find your requirement */
.finder{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(30px,5vw,80px);align-items:start}
.finder ol{border-top:1px solid var(--line)}
.finder li{border-bottom:1px solid var(--line)}
.find{position:relative;display:grid;grid-template-columns:40px 1fr auto;gap:3px 12px;align-items:baseline;padding:clamp(12px,1.15vw,17px) 8px;text-decoration:none;transition:padding .3s var(--ease),background .3s}
.find .n{font:400 13px var(--mono);color:var(--fog)}
.find b{font:600 clamp(25px,2.2vw,34px)/1.04 var(--display);transition:color .2s}
.find small{grid-column:2;font-size:16px;line-height:1.4;color:var(--mist)}
.find svg{grid-row:1;grid-column:3;width:24px;height:24px;color:var(--fog);transition:transform .3s var(--ease),color .2s;align-self:center}
.find em{font:400 10.5px var(--mono);font-style:normal;letter-spacing:.1em;text-transform:uppercase;color:var(--signal2);margin-left:8px;vertical-align:middle}
.find:hover,.find:focus-visible,.find.on{padding-left:18px;background:linear-gradient(90deg,rgba(242,154,46,.1),transparent)}
.find:hover b,.find.on b{color:var(--signal2)}
.find:hover svg,.find.on svg{transform:translateX(5px);color:var(--signal)}
.finder-pic{position:sticky;top:110px;aspect-ratio:1/1;overflow:hidden;background:var(--water2)}
.finder-pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s}
.finder-pic img.on{opacity:1}
.finder-pic p{position:absolute;left:0;right:0;bottom:0;padding:44px 20px 18px;font-size:16px;line-height:1.4;background:linear-gradient(180deg,transparent,rgba(6,20,33,.9))}
.finder-more{display:flex;flex-wrap:wrap;gap:12px 24px;margin-top:26px}

/* Walk round the vessel */
.walk{position:relative;background:var(--water);border-block:1px solid var(--line)}
.walk-stage{position:relative;height:min(78lvh,760px);min-height:520px;background:var(--water) center/cover no-repeat;background-image:var(--walk);overflow:hidden;touch-action:pan-y;cursor:grab}
.walk-stage:active{cursor:grabbing}
.walk-copy{position:absolute;left:0;right:0;top:0;padding:clamp(26px,3.4vw,50px) 0;pointer-events:none;background:linear-gradient(180deg,rgba(6,20,33,.76),transparent)}
.walk-copy .wrap{display:grid;gap:12px}
.walk-copy h2{font-size:clamp(40px,5.4vw,84px)}
.walk-dock{position:absolute;left:0;right:0;bottom:0;padding:18px 0 22px;background:linear-gradient(0deg,rgba(6,20,33,.92) 40%,transparent)}
.walk-dock .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:26px;align-items:end}
.walk-chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{min-height:44px;padding:0 15px;border:1px solid var(--line2);border-radius:2px;font-size:16px;font-weight:500;background:rgba(6,20,33,.5);transition:.2s}
.chip:hover{border-color:var(--foam)}
.chip[aria-pressed=true]{background:var(--signal);border-color:var(--signal);color:var(--ink)}
.walk-card{min-height:112px;display:grid;gap:6px;align-content:end}
.walk-card p{color:#dce7ee}
.walk-card h3{color:var(--signal2)}
.walk-pin{position:absolute;left:0;top:0;width:15px;height:15px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--signal);box-shadow:0 0 0 7px rgba(242,154,46,.28);opacity:0;transition:opacity .4s;pointer-events:none}
.walk-pin.on{opacity:1;animation:pulse 2s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 13px rgba(242,154,46,.12)}}

/* Approach */
.steps4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid var(--line2)}
.steps4 li{position:relative;padding:26px clamp(14px,2vw,30px) 0 0;display:grid;gap:12px;align-content:start}
.steps4 li::before{content:"";position:absolute;top:-5px;left:0;width:9px;height:9px;border-radius:50%;background:var(--signal)}
.steps4 p{font-size:17px;color:var(--mist)}

/* Vessels */
.fleet{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.fleet li{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:clamp(12px,1.2vw,18px);display:grid;gap:8px;align-content:start;transition:background .3s}
.fleet h3{font-size:clamp(19px,1.5vw,23px)}
.own-note{margin-top:16px;max-width:60em}
.fleet li:hover{background:rgba(143,208,242,.05)}
.fleet svg{width:100%;height:auto;color:var(--blue);stroke:currentColor;fill:none;stroke-width:1.15;stroke-linejoin:round;stroke-linecap:round;margin-bottom:6px}
.fleet svg .sea{stroke:var(--signal);stroke-width:1.2}
.fleet p{font-size:16px;line-height:1.42;color:var(--mist)}
.own{margin-top:clamp(28px,4vw,48px);display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center;padding:20px clamp(18px,2vw,28px);border:1px solid var(--line2);background:var(--water2)}
.own svg{width:26px;height:26px;color:var(--signal)}
.own p{font-size:17.5px}

/* Standards */
.quad{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,3vw,44px)}
.quad li{display:grid;gap:12px;align-content:start;padding-top:18px;border-top:2px solid var(--signal)}
.quad p{font-size:17px;color:var(--mist)}
.creds{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin-top:clamp(28px,3.4vw,48px);border:1px solid var(--line)}
.creds li{padding:18px 18px 20px;border-right:1px solid var(--line);display:grid;gap:7px;align-content:start}
.creds li:last-child{border-right:0}
.creds b{font:600 22px/1.1 var(--display)}
.creds span{font-size:15px;line-height:1.35;color:var(--mist)}
@media (max-width:720px){.creds li{padding:12px 13px 13px}.creds li:last-child{grid-column:1/-1}.creds b{font-size:20px}.creds span{font-size:14px}.names li{font-size:23px}.foot-grid li{line-height:1.6}.foot-low{margin-top:20px}}

/* Company */
.co{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(36px,6vw,110px);align-items:start}
.co-facts{display:grid;gap:26px}
.co-facts dt{margin-bottom:5px}
.leader{display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px clamp(20px,2.4vw,32px);align-items:center;padding:clamp(20px,2.4vw,32px);background:var(--water3)}
.leader img{width:clamp(112px,11vw,164px);height:auto;aspect-ratio:1;border-radius:50%;object-fit:cover;outline:2px solid var(--signal);outline-offset:5px;margin:7px}
.leader-name{display:grid;gap:6px;grid-column:-2}
.leader-name .small{color:#d6e2ea}
.leader>p{grid-column:1/-1;font-size:17px;color:#d6e2ea}
.names{margin-top:clamp(28px,3.4vw,48px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,60px)}
.names ul{display:flex;flex-wrap:wrap;gap:10px 36px;margin-top:12px}
.names li{font:600 clamp(24px,2.3vw,34px)/1.1 var(--display)}
.names li small{display:block;font:400 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mist);margin-top:5px}

/* Guides */
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.8vw,24px)}
.card{display:grid;gap:12px;align-content:start;padding:22px;background:var(--water2);text-decoration:none;border-top:2px solid transparent;transition:background .25s,border-color .25s;min-height:240px}
.card:hover{background:var(--water3);border-color:var(--signal)}
.card p{font-size:16px;line-height:1.42;color:var(--mist)}
.cards.two{grid-template-columns:repeat(2,minmax(0,1fr))}

/* The requirement builder */
.horizon{position:relative;background:var(--paper);color:var(--ink);overflow:hidden}
.horizon-top{position:relative;background:var(--water) center 62%/cover no-repeat;background-image:var(--sunrise);padding:clamp(76px,9vw,150px) 0 clamp(34px,4vw,60px)}
.horizon-top::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,20,33,.84),rgba(6,20,33,.5) 44%,rgba(6,20,33,0) 76%),linear-gradient(180deg,rgba(6,20,33,.5),transparent 40%)}
.horizon-top .wrap{position:relative;z-index:1;display:grid;gap:14px;color:var(--foam)}
.horizon-top h2{font-size:clamp(50px,6.2vw,104px);line-height:.9}
.build>*{min-width:0}
.build{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);padding-block:clamp(28px,4vw,60px);align-items:start}
.tabs{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:18px}
.tab{min-height:44px;padding:0 14px;border:1px solid #b6c5cf;border-radius:2px;font-size:16px;font-weight:500;color:var(--ink);transition:.15s}
.tab:hover{border-color:var(--ink)}
.tab[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--foam)}
.form-intro{font-size:17px;color:var(--ink2);margin-bottom:20px}
#fields,#more-fields{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
#fields>.wide,#more-fields>.wide{grid-column:1/-1}
.more{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin:-6px 0 12px;font-weight:600;font-size:16px;color:var(--ink);border-bottom:1px solid #9fb3c0}
.more small{font-weight:400;color:var(--ink2)}
.more::before{content:"+";font-size:20px;line-height:1}
.more[aria-expanded=true]::before{content:"\2013"}
.field{display:grid;gap:7px;margin-bottom:18px;align-content:start}
.field label,.field legend,.fl{font-weight:600;font-size:16.5px;line-height:1.3;padding:0}
.field small{font-size:15px;color:var(--ink2);font-weight:400}
fieldset{border:0;margin:0;padding:0;min-width:0}
input[type=text],input[type=email],input[type=tel],input[type=password],textarea,select{width:100%;min-height:52px;padding:12px 14px;background:#fff;border:1px solid #b6c5cf;border-radius:2px;font-size:17px;color:var(--ink);transition:border-color .15s,box-shadow .15s}
textarea{min-height:104px;resize:vertical}
input:focus,textarea:focus{outline:0;border-color:var(--ink);box-shadow:0 0 0 3px rgba(242,154,46,.4)}
[aria-invalid=true]{border-color:#b3261e}
.opts{display:flex;flex-wrap:wrap;gap:7px;margin-top:2px}
.opt{min-height:44px;padding:0 13px;border:1px solid #b6c5cf;background:#fff;border-radius:2px;font-size:15.5px;font-weight:500;color:var(--ink)}
.opt:hover{border-color:var(--ink)}
.opt[aria-pressed=true]{background:var(--signal);border-color:var(--signal)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.contact-part{margin-top:4px;padding-top:18px;border-top:1px solid #c6d2da}
.consent{display:grid;grid-template-columns:24px 1fr;gap:10px;align-items:start;font-size:15.5px;line-height:1.42;color:var(--ink2);margin:6px 0 16px}
.consent input{width:22px;height:22px;margin:1px 0 0;accent-color:var(--ink)}
.warn{font-size:15px;line-height:1.4;color:var(--ink2);margin:-4px 0 12px}
.form-error{color:#b3261e;font-weight:600;min-height:1.4em;font-size:16px;margin-bottom:8px}
.btn-send{width:100%;background:var(--ink);color:var(--foam);min-height:60px;font-size:18px}
.btn-send:hover{background:#12344d}
.btn-send:disabled{opacity:.6;cursor:progress}
.trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.sheet{position:sticky;top:96px;background:var(--water);color:var(--foam);padding:clamp(20px,2.2vw,30px);display:grid;gap:18px;box-shadow:0 20px 50px rgba(6,20,33,.2)}
.sheet-head{display:flex;justify-content:space-between;gap:14px;align-items:baseline}
.sheet h3{font-size:clamp(26px,2.4vw,34px)}
.meter{height:5px;background:var(--steel);overflow:hidden}
.meter i{display:block;height:100%;width:0;background:var(--signal);transition:width .4s var(--ease)}
.sheet-list{display:grid;gap:11px;max-height:340px;overflow:auto}
.sheet-list:empty{display:none}
.sheet-list div{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:12px;font-size:15.5px;line-height:1.35;border-bottom:1px solid var(--line);padding-bottom:9px}
.sheet-list dt{color:var(--mist)}
.sheet-list dd{word-break:break-word}
.sheet-list dd.open{color:var(--fog);font-style:italic}
.direct{display:grid;gap:6px;font-size:16px;border-top:1px solid var(--line);padding-top:16px}
.direct a{text-decoration:none;font-weight:600}
.direct a:hover{color:var(--signal2)}
.done{padding:clamp(22px,3vw,40px);background:#fff;display:grid;gap:14px}
.done h3{font-size:clamp(34px,4vw,52px);line-height:1}
.done .ref{font:500 16px var(--mono);letter-spacing:.06em}

/* Footer */
.foot{background:var(--water);border-top:1px solid var(--line);padding:clamp(40px,5vw,70px) 0 22px;position:relative;z-index:3}
.foot-giant{font:700 clamp(34px,4.6vw,76px)/.96 var(--display);text-transform:uppercase;margin-bottom:clamp(24px,3vw,44px)}
.foot-giant i{font-style:normal;color:var(--signal)}
.foot-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:28px}
.foot-grid h3{font:500 12px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mist);margin-bottom:10px}
.foot-grid a{text-decoration:none}
.foot-grid a:hover{color:var(--signal2)}
.foot-grid li{font-size:16px;line-height:1.75}
.foot-grid address{font-style:normal;font-size:16px;line-height:1.5}
.foot-low{margin-top:28px;padding-top:16px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;font-size:14px;color:var(--fog)}

/* Inner pages */
.inner-hero{position:relative;min-height:min(84svh,760px);display:flex;align-items:flex-end;padding:150px 0 clamp(40px,6vw,76px);background:var(--water) center/cover no-repeat;overflow:hidden}
.inner-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,20,33,.56),rgba(6,20,33,.28) 42%,rgba(6,20,33,.94))}
.inner-hero .wrap{position:relative;z-index:1;width:100%;display:grid;gap:18px}
.inner-hero h1{font-size:clamp(50px,7.6vw,122px);line-height:.92;max-width:15em}
.crumbs{font:400 12.5px var(--mono);letter-spacing:.08em;color:var(--mist)}
.crumbs a{text-decoration:none}
.crumbs a:hover{color:var(--signal2)}
.stat-line{display:flex;flex-wrap:wrap;gap:10px}
.rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(24px,4vw,70px);border-top:1px solid var(--line)}
.rows.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.rows li{padding:20px 0 22px;border-bottom:1px solid var(--line);display:grid;gap:6px;align-content:start}
.rows p{font-size:17.5px;color:var(--mist)}
.seq{counter-reset:s;display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:clamp(16px,2vw,28px)}
.seq li{counter-increment:s;display:grid;gap:9px;align-content:start;padding-top:16px;border-top:1px solid var(--line2);position:relative}
.seq li::before{content:"0" counter(s);font:500 12.5px var(--mono);letter-spacing:.1em;color:var(--signal)}
.seq p{font-size:16.5px;color:var(--mist)}
.seq.six{--n:3}
.limits{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,5vw,80px)}
.limits ul{display:grid;gap:12px}
.limits li{padding-left:26px;position:relative;font-size:17.5px;color:#d6e2ea}
.limits li::before{content:"";position:absolute;left:0;top:.62em;width:12px;height:2px;background:var(--signal)}
.send-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 34px}
.send-list li{padding-left:24px;position:relative;font-size:17.5px}
.send-list li::before{content:"";position:absolute;left:0;top:.52em;width:11px;height:11px;border:1.5px solid var(--signal)}
.next{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,1.8vw,24px)}
.article{max-width:800px;margin:0 auto;padding:0 var(--edge)}
.prose{display:grid;gap:18px;font-size:19px;line-height:1.6;color:#dbe6ed}
.prose h2{font-size:clamp(32px,3.6vw,48px);line-height:1;margin-top:26px;color:var(--foam)}
.prose ul{display:grid;gap:9px}
.prose li{padding-left:24px;position:relative}
.prose li::before{content:"";position:absolute;left:0;top:.72em;width:11px;height:2px;background:var(--signal)}
.prose dl{display:grid;gap:15px}
.prose dt{font-weight:600;color:var(--foam)}
.prose dd{color:#c6d6e0}
.prose .note{padding:15px 18px;border-left:2px solid var(--signal);background:var(--water2);font-size:17.5px}
.prose a{color:var(--signal2)}
.tablewrap{overflow-x:auto;border:1px solid var(--line)}
.prose table{border-collapse:collapse;min-width:760px;font-size:15.5px;line-height:1.4}
.prose th{font:500 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;text-align:left;color:var(--mist);background:var(--water2)}
.prose th,.prose td{padding:11px 13px;border-bottom:1px solid var(--line);vertical-align:top}
.prose td:first-child{font-weight:600;color:var(--foam)}

/* Consent */
.consentbar{position:fixed;right:12px;bottom:12px;z-index:60;width:min(420px,calc(100vw - 24px));padding:9px 11px;background:var(--water3);border:1px solid var(--line2);display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;font-size:13.5px;line-height:1.3}
.live .consentbar{bottom:calc(66px + env(safe-area-inset-bottom,0px))}
.consentbar div{display:flex;gap:6px}
.consentbar .btn{min-height:38px;padding:0 10px;font-size:13.5px}

[data-rise]{will-change:transform}

@media (max-width:1100px){
  .bar-links>a:not(.btn){display:none}
  .menu-toggle{display:block}
  .finder{grid-template-columns:1fr}
  .finder-pic{display:none}
  .steps4,.quad{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:34px}
  .steps4{border-top:0}
  .steps4 li{border-top:1px solid var(--line2)}
  .creds{grid-template-columns:repeat(2,minmax(0,1fr))}
  .creds li{border-bottom:1px solid var(--line)}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fleet{grid-template-columns:repeat(3,minmax(0,1fr))}
  .build{grid-template-columns:minmax(0,1fr)}
  .sheet{position:static;box-shadow:none}
  .sheet-head,.meter,#sheet-state,.sheet-list{display:none}
  .direct{border-top:0;padding-top:0}
  .foot-grid{grid-template-columns:1fr 1fr}
  .film-note,.fb-now{display:none}
  .seq,.seq.six{--n:2}
  .co{grid-template-columns:1fr}
}
@media (max-width:720px){
  body{font-size:17px}
  :root{--unit:.86lvh}
  .logo b{font-size:29px}
  .logo span{font-size:9px}
  .bar-in{padding-block:12px}
  .btn-small{min-height:40px;padding:0 13px;font-size:14.5px}
  h1{font-size:clamp(58px,19.8vw,118px)}
  .live .consentbar{bottom:auto;top:calc(72px + env(safe-area-inset-top,0px))}
  .live .frame.bottom .hero{margin-bottom:0}
  .fb-play-word,#film-play-label{display:none}
  .fb-btn{min-height:44px}
  .fb-step{height:44px}
  .blurb{display:none}
  .find{padding-block:13px}
  .find b{font-size:25px}
  .live .frame{padding:84px var(--edge) 66px}
  .live .frame.mid,.live .frame.centre.lowish{align-items:flex-end}
  .live .frame.right{justify-content:flex-start}
  .beat-body{padding:15px 16px;gap:10px;max-width:100%}
  .beat-body h2{font-size:clamp(35px,10.6vw,52px)}
  .beat-body p{font-size:16px;line-height:1.38}
  .hero-fine{display:none}
  .frame-in.hero{gap:14px}
  .pin{font-size:10.5px}
  .pin span{padding:4px 6px}
  .walk-stage{height:76lvh;min-height:560px}
  .walk-dock .wrap{grid-template-columns:minmax(0,1fr);gap:10px}
  .walk-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--edge)*-1);padding-inline:var(--edge)}
  .walk-chips::-webkit-scrollbar{display:none}
  .chip{flex:none}
  .horizon-top::after{background:linear-gradient(180deg,rgba(6,20,33,.72),rgba(6,20,33,.6))}
  .walk-card{min-height:124px}
  .chip{min-height:40px;padding:0 11px;font-size:14.5px}
  .steps4,.quad,.names,.cards,.cards.two,.rows,.rows.three,.limits,.send-list,.next,.seq,.seq.six{grid-template-columns:1fr;--n:1}
  .fleet{grid-template-columns:repeat(2,minmax(0,1fr))}
  .two,#fields,#more-fields{grid-template-columns:1fr}
  .tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--edge)*-1);padding-inline:var(--edge)}
  .tabs::-webkit-scrollbar{display:none}
  .tab{flex:none}
  .own{grid-template-columns:1fr}
  .foot-grid>div:nth-child(-n+2){grid-column:1/-1}
  .inner-hero{min-height:74svh;padding-top:120px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* Preserve the approved company mark. */
.logo img{width:220px;height:70px;object-fit:cover;background:transparent;border-radius:3px}.logo{flex-shrink:0}@media(max-width:600px){.logo img{width:160px;height:54px}}
.preview-notice{position:fixed;bottom:0;left:0;right:0;z-index:9000;background:#061421;color:#fff;font:12px/1.4 sans-serif;text-align:center;padding:7px 12px;border-top:1px solid #f29a2e}
