:root{--sky:#7fc4e8;--deep:#1a6d9b;--ink:#0e2433;--grey:#5d6a75;--mist:#f2f8fb;--line:#d9e5ed;--navy:#0b2536;--ok:#2f9e6b;
--serif:"Marcellus","Optima","Palatino Linotype",Georgia,serif;--sans:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",Arial,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;font:400 17px/1.6 var(--sans);color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0;line-height:1.1;letter-spacing:.005em}
h1{font-size:clamp(2.5rem,6vw,4.6rem)}
h2{font-size:clamp(1.9rem,3.6vw,2.9rem);max-width:20ch}
h3{font-size:1.3rem;line-height:1.25}
p{margin:0}a{color:inherit}
:focus-visible{outline:3px solid var(--deep);outline-offset:3px}
.wrap{max-width:1160px;margin:0 auto;padding:0 28px}
.lead{font-size:1.15rem;color:var(--grey);max-width:60ch}
section{padding:104px 0}
.head{display:grid;gap:20px;margin-bottom:56px}

header{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.bar{height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{text-decoration:none;display:grid;line-height:1}
.logo b{font:400 1.7rem/1 var(--serif);color:var(--sky);letter-spacing:.04em}
.logo span{font-size:.82rem;color:#9a9a9a;letter-spacing:.06em;margin-top:5px;padding-left:2px}
nav{display:flex;gap:30px;font-size:.95rem;font-weight:500}
nav a{text-decoration:none;color:var(--ink)}nav a:hover{color:var(--deep);text-decoration:underline;text-underline-offset:7px}
.btn{display:inline-block;background:var(--deep);color:#fff;text-decoration:none;font:600 .98rem var(--sans);padding:15px 28px;border:2px solid var(--deep);cursor:pointer;transition:background .2s}
.btn:hover{background:var(--navy);border-color:var(--navy)}
.btn.line{background:transparent;color:var(--ink);border-color:var(--ink)}.btn.line:hover{background:var(--ink);color:#fff}
@media(max-width:860px){nav{display:none}}

.hero{padding:88px 0 96px;background:linear-gradient(180deg,var(--mist),#fff 85%)}
.hero-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:64px;align-items:center}
.hero .lead{margin:28px 0 36px;font-size:1.22rem;color:#44525e}
.cta{display:flex;gap:14px;flex-wrap:wrap}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr;gap:48px}.hero{padding-top:56px}}

.built{border-block:1px solid var(--line);padding:30px 0}
.built .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:20px 32px}
.built div{font-size:.9rem;color:var(--grey);line-height:1.4;border-left:3px solid var(--sky);padding-left:14px}
.built b{display:block;color:var(--ink);font-weight:600;font-size:.98rem}

.three{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:40px}
.three div{border-top:2px solid var(--ink);padding-top:22px}
.three h3{margin-bottom:12px}.three p{color:var(--grey)}

.alt{background:var(--mist)}
.svc{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:0 64px}
.svc div{padding:26px 0;border-top:1px solid var(--line)}
.svc h3{margin-bottom:8px}.svc p{color:var(--grey);font-size:1rem}

.dark{background:var(--navy);color:#fff}
.dark .lead{color:#b4c6d3}.dark h2{color:#fff}
.tabs{display:flex;flex-wrap:wrap;gap:0;border-bottom:1px solid #27445a;margin-bottom:40px}
.tabs button{background:none;border:0;color:#9fb6c6;font:600 1rem var(--sans);padding:16px 26px 16px 0;margin-right:26px;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px}
.tabs button[aria-selected="true"]{color:#fff;border-bottom-color:var(--sky)}
.tabs button:hover{color:#fff}
.panel{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:36px}
.panel h3{font-family:var(--sans);font-weight:700;font-size:.9rem;color:var(--sky);margin-bottom:10px}
.panel p{color:#dbe6ee;font-size:1rem}
.panel .ref{grid-column:1/-1;border-top:1px solid #27445a;padding-top:22px;color:#b4c6d3;font-size:.95rem}
.zones{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0;margin-top:72px}
.zones div{padding:22px 24px;color:#fff;font-size:.93rem;line-height:1.45}
.zones b{display:block;font-size:1.1rem;margin-bottom:4px}
.zones .r{background:#b3202f}.zones .b{background:#1d62b8}.zones .g{background:#12794a}.zones .y{background:#f0b400;color:#241a00}

.split{display:grid;grid-template-columns:1fr 1fr;gap:72px}
@media(max-width:860px){.split{grid-template-columns:1fr;gap:40px}section{padding:72px 0}}
.list{list-style:none;padding:0;margin:0;display:grid;gap:0}
.list li{padding:15px 0 15px 34px;border-top:1px solid var(--line);position:relative}
.list li:last-child{border-bottom:1px solid var(--line)}
.list li::before{content:"";position:absolute;left:4px;top:1.2em;width:13px;height:7px;border-left:2px solid var(--deep);border-bottom:2px solid var(--deep);transform:rotate(-45deg)}
.list b{font-weight:600}

.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.chips span{border:1px solid var(--ink);padding:11px 18px;font-weight:500;font-size:.96rem}

.contact{background:var(--mist)}
form{display:grid;gap:18px}
label{display:grid;gap:7px;font-weight:600;font-size:.9rem}
input,select,textarea{font:400 1rem var(--sans);padding:14px;border:1px solid #b9cad6;background:#fff;color:var(--ink);width:100%;border-radius:0}
textarea{min-height:110px;resize:vertical}
.two{display:grid;grid-template-columns:1fr 1fr;gap:18px}@media(max-width:560px){.two{grid-template-columns:1fr}}
.note{font-size:.85rem;color:var(--grey)}
.direct{margin-top:34px;display:grid;gap:18px}.direct b{display:block;font:400 1.35rem var(--serif)}

footer{background:var(--navy);color:#9fb6c6;padding:44px 0;font-size:.9rem}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px}
footer .logo b{font-size:1.35rem}
/* parallax, hero media, bands */
.px-bg{position:absolute;left:0;right:0;top:-25%;bottom:-25%;will-change:transform}
.hero{position:relative;display:flex;align-items:center;min-height:min(92vh,820px);padding:120px 0;color:#fff;background:var(--navy);overflow:hidden}
.media{position:absolute;inset:0;overflow:hidden}
.media .px-bg{background:url(images/hero-poster.jpg) center/cover,linear-gradient(135deg,#0b2536,#1a6d9b 65%,#7fc4e8)}
.px-bg video{width:100%;height:100%;object-fit:cover;display:block}
.media::after,.band::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,37,54,.9),rgba(11,37,54,.6) 60%,rgba(11,37,54,.4))}
.hero .wrap{position:relative;z-index:2;width:100%}
.hero .lead{color:#dbe9f2}
.hero .btn{background:#fff;color:var(--navy);border-color:#fff}
.hero .btn:hover{background:var(--sky);border-color:var(--sky)}
.hero .btn.line{background:transparent;color:#fff}
.hero .btn.line:hover{background:#fff;color:var(--navy)}
.band{position:relative;overflow:hidden;padding:150px 0;color:#fff;background:var(--navy)}
.band .wrap{position:relative;z-index:2}
.band p{font:400 clamp(1.9rem,4.4vw,3.2rem)/1.15 var(--serif);max-width:20ch}
.band .px-bg{background:linear-gradient(135deg,#0b2536,#1a6d9b 70%,#7fc4e8)}
.band .b1{background:url(images/banner-1.jpg) center/cover,linear-gradient(135deg,#0b2536,#1a6d9b 70%,#7fc4e8)}
.band .b2{background:url(images/banner-2.jpg) center/cover,linear-gradient(225deg,#0b2536,#1a6d9b 70%,#7fc4e8)}
@media(max-width:900px){.hero{padding:72px 0;min-height:0}.band{padding:100px 0}}
/* footer and legal page */
footer a{color:#dbe9f2}footer b{display:block;color:#fff;margin-bottom:8px}
footer .foot{display:grid;grid-template-columns:2fr 1.5fr 1fr;gap:36px}
footer .logo b{margin:0;color:var(--sky)}footer .foot p{margin-top:14px;max-width:34ch}
address{font-style:normal;line-height:1.8}
.legal{grid-column:1/-1;border-top:1px solid #27445a;padding-top:20px}
@media(max-width:700px){footer .foot{grid-template-columns:1fr}}
.doc{max-width:820px;padding-top:72px;padding-bottom:96px}
.doc h1{font-size:clamp(2.2rem,5vw,3.4rem);margin-bottom:12px}
.doc h2{font-size:1.45rem;max-width:none;margin:40px 0 10px}
.doc p{color:#33424e}.doc a{color:var(--deep)}

/* polish */
header.over{background:transparent;backdrop-filter:none;border-color:transparent;margin-bottom:-77px}
header{transition:background .3s,border-color .3s}
header.over nav a{color:#e8f2f8}header.over nav a:hover{color:#fff}
header.over .logo span{color:#b4c6d3}
header.over .btn{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.5);backdrop-filter:blur(8px)}
header.over .btn:hover{background:#fff;color:var(--navy)}
.hero{min-height:100svh;padding:150px 0 110px}
.hero h1{font-size:clamp(2.8rem,6.6vw,5.6rem);max-width:13ch;letter-spacing:-.005em}
.media::after{background:linear-gradient(90deg,rgba(11,37,54,.92),rgba(11,37,54,.55) 62%,rgba(11,37,54,.25)),linear-gradient(0deg,rgba(11,37,54,.7),transparent 35%)}
.hero .btn{border-radius:999px}.btn{border-radius:999px}
.hero-grid{grid-template-columns:1.3fr .9fr}
/* visit record, open and borderless */
.vr{color:#fff;padding-left:40px;position:relative}
.vr-top{display:flex;align-items:center;gap:22px;margin-bottom:34px}
.ring{width:104px;height:104px;transform:rotate(-90deg);flex:none}
.ring circle{fill:none;stroke-width:5}.ring .t{stroke:rgba(255,255,255,.16)}
.ring .p{stroke:var(--sky);stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;animation:fill 1.8s .3s cubic-bezier(.2,.7,.2,1) forwards;filter:drop-shadow(0 0 8px rgba(127,196,232,.7))}
.vr-score b{font:400 3.4rem/1 var(--serif);display:block}.vr-score small{font-size:1.5rem;margin-left:2px}
.vr-score span{font-size:.92rem;color:#b4c6d3}
.trail{list-style:none;margin:0;padding:0;position:relative}
.trail::before{content:"";position:absolute;left:8px;top:10px;bottom:10px;width:2px;background:linear-gradient(var(--sky),rgba(127,196,232,.1));transform-origin:top;animation:draw 1.6s .5s ease-out both}
.trail li{display:flex;gap:16px;align-items:baseline;padding:11px 0 11px 40px;position:relative;font-size:.98rem;opacity:0;animation:in .5s forwards;text-shadow:0 1px 14px rgba(11,37,54,.6)}
.trail li::before{content:"";position:absolute;left:2px;top:.95em;width:14px;height:14px;border-radius:50%;background:var(--navy);border:2px solid var(--sky);box-shadow:0 0 0 4px rgba(127,196,232,.18)}
.trail li i{margin-left:auto;font-style:normal;font-size:.82rem;color:#b4c6d3;white-space:nowrap}
.trail li i.pass{color:#8fe3b5;font-weight:600}
.trail li:nth-child(1){animation-delay:.7s}.trail li:nth-child(2){animation-delay:.95s}.trail li:nth-child(3){animation-delay:1.2s}.trail li:nth-child(4){animation-delay:1.45s}.trail li:nth-child(5){animation-delay:1.7s}
.vr-foot{margin-top:22px;padding-left:40px;font-size:.85rem;color:#b4c6d3;max-width:40ch}.vr-foot em{display:block;font-style:normal;opacity:.7;margin-top:2px}
@keyframes fill{to{stroke-dashoffset:2}}
@keyframes draw{from{transform:scaleY(0)}}
@keyframes in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:900px){.vr{padding-left:0}.hero{padding-top:130px}}
@media(prefers-reduced-motion:reduce){.trail li{animation:none;opacity:1}.ring .p{animation:none;stroke-dashoffset:2}.trail::before{animation:none}html{scroll-behavior:auto}}
/* sections */
.ico{width:34px;height:34px;fill:none;stroke:var(--deep);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;margin-bottom:14px;display:block}
.svc div{transition:background .25s}
.three div{border-top-color:var(--sky);border-top-width:3px}
.band{padding:200px 0}.band::after{background:linear-gradient(90deg,rgba(11,37,54,.85),rgba(11,37,54,.25))}
.band p{font-size:clamp(2.2rem,5.4vw,4.2rem)}
.chips span{border-radius:999px;border-color:var(--line);background:#fff;transition:border-color .2s,color .2s}.chips span:hover{border-color:var(--deep);color:var(--deep)}
input,select,textarea{border-radius:8px}.contact form{background:#fff;padding:32px;border-radius:14px;box-shadow:0 30px 60px -36px rgba(14,36,51,.35)}
.zones{border-radius:12px;overflow:hidden}