/* tokens.css */

@font-face { font-family: "Roboto"; font-style: normal; font-weight: 100 900; font-stretch: 100%; font-display: swap; src: url("fonts/roboto-normal-latin.1404ca348b.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Roboto"; font-style: normal; font-weight: 100 900; font-stretch: 100%; font-display: swap; src: url("fonts/roboto-normal-latin-ext.cedb374b05.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Roboto"; font-style: italic; font-weight: 100 900; font-stretch: 100%; font-display: swap; src: url("fonts/roboto-italic-latin.14f23757c6.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Roboto Flex"; font-style: normal; font-weight: 500 1000; font-stretch: 100% 151%; font-display: optional; src: url("fonts/roboto-flex-latin.9b084ce20f.woff2") format("woff2"); }
@font-face { font-family: "Playball"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/playball-normal-latin.4211c69e4c.woff2") format("woff2"); }
@font-face { font-family: "Roboto Fallback"; src: local("Arial"); size-adjust: 100.3%; ascent-override: 92.5%; descent-override: 24.34%; line-gap-override: 0%; }
@font-face { font-family: "Roboto Flex Fallback"; src: local("Arial"); size-adjust: 100.3%; ascent-override: 92.5%; descent-override: 24.34%; line-gap-override: 0%; }
@font-face { font-family: "Playball Fallback"; src: local("Georgia"); size-adjust: 96%; ascent-override: 98.96%; descent-override: 31.25%; line-gap-override: 0%; }
:root {
  --ocean: #02A7EB;        
  --harbour: #015375;      
  --harbour-2: #013F59;    
  --ocean-ink: #017BAE;    
  --sky: #C0E9FA;          
  --foam: #F2FAFD;         
  --ink: #0C2431; --ink-2: #2C4A58; --ink-3: #4A6370;
  --signal: #00DB4A;       
  --signal-ink: #086A2E;   
  --grey: #636363; --mist: #F4F4F4;
  --error-ink: #8A1C1C;
  --g-hi: rgba(255,255,255,.80); --g-mid: rgba(240,250,254,.62); --g-lo: rgba(214,242,252,.52);
  --g-edge: rgba(255,255,255,.78); --g-blur: 22px;
  --s-hi: rgba(1,38,55,.80); --s-lo: rgba(1,63,89,.72);
  --tint: #E9F6FC;         
  --line: rgba(1,83,117,.12);   
  --sh-soft: 0 1px 2px rgba(1,63,89,.06), 0 12px 30px -18px rgba(1,63,89,.24);
  --tex-contour: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='480' height='240' viewBox='0 0 480 240'%3E%3Cg fill='none' stroke='%23017BAE' stroke-opacity='.13' stroke-width='1.3'%3E%3Cpath d='M0 20 c 60 -9 180 -9 240 0 s 180 9 240 0 s 180 -9 240 0' /%3E%3Cpath d='M-60 60 c 60 -14 180 -14 240 0 s 180 14 240 0 s 180 -14 240 0' /%3E%3Cpath d='M-120 100 c 60 -7 180 -7 240 0 s 180 7 240 0 s 180 -7 240 0' /%3E%3Cpath d='M-30 140 c 60 -12 180 -12 240 0 s 180 12 240 0 s 180 -12 240 0' /%3E%3Cpath d='M-90 180 c 60 -10 180 -10 240 0 s 180 10 240 0 s 180 -10 240 0' /%3E%3Cpath d='M-150 220 c 60 -15 180 -15 240 0 s 180 15 240 0 s 180 -15 240 0' /%3E%3C/g%3E%3C/svg%3E");
  --tex-contour-sky: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='480' height='240' viewBox='0 0 480 240'%3E%3Cg fill='none' stroke='%23C0E9FA' stroke-opacity='.16' stroke-width='1.3'%3E%3Cpath d='M0 20 c 60 -9 180 -9 240 0 s 180 9 240 0 s 180 -9 240 0' /%3E%3Cpath d='M-60 60 c 60 -14 180 -14 240 0 s 180 14 240 0 s 180 -14 240 0' /%3E%3Cpath d='M-120 100 c 60 -7 180 -7 240 0 s 180 7 240 0 s 180 -7 240 0' /%3E%3Cpath d='M-30 140 c 60 -12 180 -12 240 0 s 180 12 240 0 s 180 -12 240 0' /%3E%3Cpath d='M-90 180 c 60 -10 180 -10 240 0 s 180 10 240 0 s 180 -10 240 0' /%3E%3Cpath d='M-150 220 c 60 -15 180 -15 240 0 s 180 15 240 0 s 180 -15 240 0' /%3E%3C/g%3E%3C/svg%3E");
  --tex-tails: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='128' viewBox='0 0 160 128'%3E%3Cg fill='%23015375' fill-opacity='.07'%3E%3Cpath d='M30 46c-1-4-1.6-7.6-1.8-11.2-4.4.8-12.6-1.2-17.4-9.6 6 2 12 2.4 17.2 4.4.4-2.6 1-5.2 2-7.6 1 2.4 1.6 5 2 7.6 5.2-2 11.2-2.4 17.2-4.4-4.8 8.4-13 10.4-17.4 9.6C31.6 38.4 31 42 30 46z' transform='translate(4 6)'/%3E%3Cpath d='M30 46c-1-4-1.6-7.6-1.8-11.2-4.4.8-12.6-1.2-17.4-9.6 6 2 12 2.4 17.2 4.4.4-2.6 1-5.2 2-7.6 1 2.4 1.6 5 2 7.6 5.2-2 11.2-2.4 17.2-4.4-4.8 8.4-13 10.4-17.4 9.6C31.6 38.4 31 42 30 46z' transform='translate(84 70) rotate(-12 30 30)'/%3E%3C/g%3E%3C/svg%3E");
  --tex-tails-sky: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='128' viewBox='0 0 160 128'%3E%3Cg fill='%23C0E9FA' fill-opacity='.10'%3E%3Cpath d='M30 46c-1-4-1.6-7.6-1.8-11.2-4.4.8-12.6-1.2-17.4-9.6 6 2 12 2.4 17.2 4.4.4-2.6 1-5.2 2-7.6 1 2.4 1.6 5 2 7.6 5.2-2 11.2-2.4 17.2-4.4-4.8 8.4-13 10.4-17.4 9.6C31.6 38.4 31 42 30 46z' transform='translate(4 6)'/%3E%3Cpath d='M30 46c-1-4-1.6-7.6-1.8-11.2-4.4.8-12.6-1.2-17.4-9.6 6 2 12 2.4 17.2 4.4.4-2.6 1-5.2 2-7.6 1 2.4 1.6 5 2 7.6 5.2-2 11.2-2.4 17.2-4.4-4.8 8.4-13 10.4-17.4 9.6C31.6 38.4 31 42 30 46z' transform='translate(84 70) rotate(-12 30 30)'/%3E%3C/g%3E%3C/svg%3E");
  --tex-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.004 0 0 0 0 0.32 0 0 0 0 0.46 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23g)'/%3E%3C/svg%3E");
  --wave-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 48' preserveAspectRatio='none'%3E%3Cpath d='M0 48 L0 30 C 240 4, 520 2, 720 26 C 920 2, 1200 4, 1440 30 L1440 48 Z' fill='%23000'/%3E%3C/svg%3E");
  --glow: rgba(255,190,130,.20);           
  
  --f-text: "Roboto", "Roboto Fallback", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --f-disp: "Roboto Flex", "Roboto Flex Fallback", "Roboto", system-ui, sans-serif;
  --f-script: "Playball", "Playball Fallback", "Brush Script MT", cursive;
  --fs-0: .8125rem; --fs-1: .9375rem; --fs-2: 1rem; --fs-3: 1.125rem;
  --fs-h3: clamp(1.25rem, 1rem + .9vw, 1.6rem);
  --fs-h2: clamp(1.8rem, 1.2rem + 2vw, 2.9rem);
  --fs-hero: clamp(2.45rem, 1.3rem + 3.1vw, 4.4rem);
  --fs-sub: clamp(1.15rem, .85rem + 1vw, 1.75rem);
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 72px; --sp-9: 112px;
  --gut: clamp(16px, 3.6vw, 40px);
  --wrap: 1240px;
  --sec-pad: 72px;
  --r-s: 12px; --r-m: 20px; --r-l: 28px; --r-pill: 999px; --r-print: 6px;
  --sh-1: 0 1px 2px rgba(1,63,89,.10), 0 10px 24px -14px rgba(1,63,89,.34);
  --sh-2: 0 2px 6px rgba(1,63,89,.08), 0 26px 50px -24px rgba(1,63,89,.46);
  --sh-3: 0 4px 10px rgba(1,40,58,.10), 0 40px 80px -30px rgba(1,40,58,.55);
  --sh-cut: drop-shadow(0 18px 18px rgba(1,40,58,.28));
  --focus-ring: var(--harbour); --focus-halo: 0 0 0 6px rgba(2,167,235,.35);
  --ease: cubic-bezier(.2,.8,.2,1);
  --ease-settle: cubic-bezier(.18,1.25,.4,1);
  --hdr-h: 68px;
  --ann-h: 0px;            
  --z-totop: 40; --z-header: 50; --z-mega: 60; --z-sheet: 80; --z-gate: 100; --z-skip: 200;
}
@media (max-width: 1023px) { :root { --sec-pad: 48px; } }
@media (max-width: 700px) { :root { --hdr-h: 60px; --sec-pad: 40px; } }
:root {
  --c-0a6b93: #0a6b93;
  --c-0b77a4: #0b77a4;
  --c-2a2f3a: #2a2f3a;
  --c-011e2c-a35: rgba(1,30,44,.35);
  --c-011e2c-a70: rgba(1,30,44,.7);
  --c-011e2d-a60: rgba(1,30,45,.6);
  --c-012a3c: #012a3c;
  --c-0389c2: #0389C2;
  --c-01283a-a00: rgba(1,40,58,0);
  --c-01283a-a18: rgba(1,40,58,.18);
  --c-01283a-a25: rgba(1,40,58,.25);
  --c-01283a-a30: rgba(1,40,58,.30);
  --c-01283a-a42: rgba(1,40,58,.42);
  --c-01283a-a45: rgba(1,40,58,.45);
  --c-01283a-a50: rgba(1,40,58,.5);
  --c-01283a-a55: rgba(1,40,58,.55);
  --c-01283a-a60: rgba(1,40,58,.6);
  --c-01283a-a62: rgba(1,40,58,.62);
  --c-01283a-a75: rgba(1,40,58,.75);
  --c-01283a-a78: rgba(1,40,58,.78);
  --c-01476a: #01476a;
  --c-02577a: #02577a;
  --c-012232-a62: rgba(1,34,50,.62);
  --c-012232-a72: rgba(1,34,50,.72);
  --c-012232-a90: rgba(1,34,50,.90);
  --c-012637-a55: rgba(1,38,55,.55);
  --c-012637-a82: rgba(1,38,55,.82);
  --c-012637-a95: rgba(1,38,55,.95);
  --c-b3261e: #B3261E;
  --c-black: #000;
  --c-c0ecf6-a56: rgba(192,236,246,.56);
  --c-c4e2fa-a58: rgba(196,226,250,.58);
  --c-c8f2de-a56: rgba(200,242,222,.56);
  --c-cfe9f2: #cfe9f2;
  --c-d6f2fb-a70: rgba(214,242,251,.70);
  --c-e2f2f9: #E2F2F9;
  --c-e2f6fd-a78: rgba(226,246,253,.78);
  --c-e2f6fd-a84: rgba(226,246,253,.84);
  --c-e2f6fd-a92: rgba(226,246,253,.92);
  --c-e3eef3: #e3eef3;
  --c-e4f5fb: #e4f5fb;
  --c-e4f7fc-a64: rgba(228,247,252,.64);
  --c-e6f7fc-a80: rgba(230,247,252,.80);
  --c-e8b437: #E8B437;
  --c-e8f4fd-a64: rgba(232,244,253,.64);
  --c-e8f7fd-a86: rgba(232,247,253,.86);
  --c-e8faf0-a64: rgba(232,250,240,.64);
  --c-ecf8fd-a94: rgba(236,248,253,.94);
  --c-eef6f9: #eef6f9;
  --c-eef9fd-a76: rgba(238,249,253,.76);
  --c-f0fafe-a70: rgba(240,250,254,.70);
  --c-f0fafe-a90: rgba(240,250,254,.9);
  --c-f3fbfe-a86: rgba(243,251,254,.86);
  --c-foam-a00: rgba(242,250,253,0);
  --c-foam-a30: rgba(242,250,253,.30);
  --c-foam-a50: rgba(242,250,253,.5);
  --c-foam-a60: rgba(242,250,253,.6);
  --c-foam-a78: rgba(242,250,253,.78);
  --c-foam-a90: rgba(242,250,253,.9);
  --c-harbour-2-a12: rgba(1,63,89,.12);
  --c-harbour-2-a35: rgba(1,63,89,.35);
  --c-harbour-2-a93: rgba(1,63,89,.93);
  --c-harbour-a08: rgba(1,83,117,.08);
  --c-harbour-a12: rgba(1,83,117,.12);
  --c-harbour-a14: rgba(1,83,117,.14);
  --c-harbour-a15: rgba(1,83,117,.15);
  --c-harbour-a16: rgba(1,83,117,.16);
  --c-harbour-a18: rgba(1,83,117,.18);
  --c-harbour-a20: rgba(1,83,117,.2);
  --c-harbour-a25: rgba(1,83,117,.25);
  --c-harbour-a30: rgba(1,83,117,.3);
  --c-harbour-a35: rgba(1,83,117,.35);
  --c-harbour-a45: rgba(1,83,117,.45);
  --c-harbour-a55: rgba(1,83,117,.55);
  --c-harbour-a75: rgba(1,83,117,.75);
  --c-harbour-a80: rgba(1,83,117,.8);
  --c-ocean-a00: rgba(2,167,235,0);
  --c-ocean-a10: rgba(2,167,235,.10);
  --c-ocean-a12: rgba(2,167,235,.12);
  --c-ocean-a14: rgba(2,167,235,.14);
  --c-ocean-a20: rgba(2,167,235,.2);
  --c-ocean-a22: rgba(2,167,235,.22);
  --c-ocean-a28: rgba(2,167,235,.28);
  --c-ocean-a30: rgba(2,167,235,.30);
  --c-ocean-a34: rgba(2,167,235,.34);
  --c-ocean-a38: rgba(2,167,235,.38);
  --c-ocean-a45: rgba(2,167,235,.45);
  --c-ocean-a50: rgba(2,167,235,.5);
  --c-ocean-a55: rgba(2,167,235,.55);
  --c-ocean-ink-a00: rgba(1,123,174,0);
  --c-ocean-ink-a22: rgba(1,123,174,.22);
  --c-signal-a00: rgba(0,219,74,0);
  --c-signal-a12: rgba(0,219,74,.12);
  --c-signal-a22: rgba(0,219,74,.22);
  --c-sky-a00: rgba(192,233,250,0);
  --c-sky-a08: rgba(192,233,250,.08);
  --c-sky-a12: rgba(192,233,250,.12);
  --c-sky-a14: rgba(192,233,250,.14);
  --c-sky-a16: rgba(192,233,250,.16);
  --c-sky-a18: rgba(192,233,250,.18);
  --c-sky-a30: rgba(192,233,250,.3);
  --c-sky-a40: rgba(192,233,250,.40);
  --c-sky-a45: rgba(192,233,250,.45);
  --c-sky-a55: rgba(192,233,250,.55);
  --c-sky-a60: rgba(192,233,250,.6);
  --c-sky-a70: rgba(192,233,250,.7);
  --c-sky-a72: rgba(192,233,250,.72);
  --c-sky-a90: rgba(192,233,250,.9);
  --c-sky-a95: rgba(192,233,250,.95);
  --c-white: #fff;
  --c-white-a00: rgba(255,255,255,0);
  --c-white-a12: rgba(255,255,255,.12);
  --c-white-a18: rgba(255,255,255,.18);
  --c-white-a28: rgba(255,255,255,.28);
  --c-white-a55: rgba(255,255,255,.55);
  --c-white-a70: rgba(255,255,255,.7);
  --c-white-a72: rgba(255,255,255,.72);
  --c-white-a75: rgba(255,255,255,.75);
  --c-white-a78: rgba(255,255,255,.78);
  --c-white-a80: rgba(255,255,255,.8);
  --c-white-a82: rgba(255,255,255,.82);
  --c-white-a85: rgba(255,255,255,.85);
  --c-white-a86: rgba(255,255,255,.86);
  --c-white-a88: rgba(255,255,255,.88);
  --c-white-a90: rgba(255,255,255,.9);
  --c-white-a92: rgba(255,255,255,.92);
  --c-white-a95: rgba(255,255,255,.95);
  --c-white-a96: rgba(255,255,255,.96);
  --c-white-a97: rgba(255,255,255,.97);
}

/* base.css */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--hdr-h) + 16px); overflow-x: clip; }
body { margin: 0; font-family: var(--f-text); font-size: var(--fs-2); line-height: 1.6; color: var(--ink); background: var(--foam); overflow-x: clip; }
img, video { max-width: 100%; height: auto; display: block; }
svg { flex: none; }
a { color: var(--harbour); text-decoration-thickness: 1px; text-underline-offset: 3px; }
:where(a:focus-visible) { color: var(--harbour-2); }
@media (hover: hover) { :where(a:hover) { color: var(--harbour-2); } }
h1, h2, h3, h4, h5, h6 { font-family: var(--f-disp); color: var(--harbour-2); line-height: 1.1; margin: 0 0 var(--sp-4); text-wrap: balance; }
h1, .h1 { font-size: var(--fs-h2); font-weight: 900; font-stretch: 118%; letter-spacing: -.01em; }
h2 { font-size: var(--fs-h2); font-weight: 800; font-stretch: 112%; }
h3 { font-size: var(--fs-h3); font-weight: 800; font-stretch: 110%; }
h4, h5, h6 { font-size: var(--fs-3); font-weight: 800; }
p { margin: 0 0 var(--sp-4); }
ul, ol { margin: 0 0 var(--sp-4); }
button { font: inherit; color: inherit; cursor: pointer; }
input, select, textarea { font: inherit; color: inherit; }
main { display: block; outline: none; }
:focus-visible { outline: 3px solid var(--focus-ring); outline-offset: 3px; box-shadow: var(--focus-halo); border-radius: 6px; }
.on-dark :focus-visible, .ftr :focus-visible, .glass--smoke :focus-visible, .band--smoke :focus-visible { outline-color: var(--c-white); box-shadow: 0 0 0 6px var(--ocean); }
.sr, .sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.wrap { width: 100%; max-width: calc(var(--wrap) + 2 * var(--gut)); margin-inline: auto; padding-inline: var(--gut); }
.skip { position: absolute; left: 12px; top: -80px; z-index: var(--z-skip); background: var(--c-white); color: var(--harbour); padding: 10px 16px; border-radius: 10px; font-weight: 700; box-shadow: var(--sh-2); }
.skip:focus, .skip:focus-visible { top: 12px; }
.script { font-family: var(--f-script); font-weight: 400; font-style: normal; }
.fine { font-size: var(--fs-0); color: var(--ink-3); line-height: 1.5; }
.ico { width: 20px; height: 20px; }
.grad { color: var(--harbour); }
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .grad { background: linear-gradient(100deg, var(--ocean-ink) 0%, var(--c-0389c2) 40%, var(--harbour) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; padding-right: .04em; }
}
.ital { font-family: var(--f-text); font-style: italic; font-weight: 700; font-stretch: 100%; }
.draw { position: relative; display: inline-block; }
.draw svg { position: absolute; left: -2%; bottom: -.3em; width: 104%; height: .45em; overflow: visible; pointer-events: none; }
.draw path { fill: none; stroke: var(--ocean); stroke-width: 4; stroke-linecap: round; vector-effect: non-scaling-stroke; stroke-dasharray: 240; stroke-dashoffset: 0; }
.h-sec { font: 900 var(--fs-h2)/1.05 var(--f-disp); font-stretch: 118%; letter-spacing: -.01em; color: var(--harbour-2); margin: 0 0 var(--sp-5); }
.h-sec a { color: inherit; text-decoration: none; }
.btn { --b: var(--harbour); position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 46px; padding: 12px 24px; border-radius: var(--r-pill); border: 1px solid transparent; font: 700 var(--fs-2)/1.2 var(--f-text); letter-spacing: .01em; text-decoration: none; cursor: pointer; transition: transform .35s var(--ease), box-shadow .35s var(--ease), background-color .35s, color .35s, border-color .35s; }
.btn--lg { min-height: 54px; padding: 14px 30px; font-size: var(--fs-3); }
.btn--sm { min-height: 40px; padding: 9px 18px; font-size: var(--fs-1); }
.btn--ink { background: linear-gradient(180deg, var(--c-0a6b93), var(--harbour)); color: var(--c-white); box-shadow: inset 0 1px 0 var(--c-white-a28), 0 10px 24px -12px var(--c-harbour-a75); }
.btn--glass { background: var(--c-white-a72); color: var(--harbour); border-color: var(--c-white-a95); box-shadow: inset 0 1px 0 var(--c-white), var(--sh-1); }
.btn--ghost { background: transparent; color: var(--harbour); border-color: var(--c-harbour-a45); }
.btn--sky { background: var(--sky); color: var(--harbour-2); }
.btn--ink:focus-visible { color: var(--c-white); transform: translateY(-2px); background: linear-gradient(180deg, var(--c-0b77a4), var(--c-01476a)); box-shadow: 0 0 0 4px var(--c-ocean-a45), 0 14px 26px -12px var(--c-harbour-a80); }
.btn--glass:focus-visible { background: var(--c-white); color: var(--harbour); transform: translateY(-2px); }
.btn--ghost:focus-visible { background: var(--c-harbour-a08); color: var(--harbour); border-color: var(--harbour); }
.btn--sky:focus-visible { background: var(--c-white); color: var(--harbour-2); transform: translateY(-2px); }
@media (hover: hover) {
  .btn--ink:hover { color: var(--c-white); transform: translateY(-2px); background: linear-gradient(180deg, var(--c-0b77a4), var(--c-01476a)); box-shadow: 0 0 0 4px var(--c-ocean-a45), 0 14px 26px -12px var(--c-harbour-a80); }
  .btn--glass:hover { background: var(--c-white); color: var(--harbour); transform: translateY(-2px); }
  .btn--ghost:hover { background: var(--c-harbour-a08); color: var(--harbour); border-color: var(--harbour); }
  .btn--sky:hover { background: var(--c-white); color: var(--harbour-2); transform: translateY(-2px); }
}
.btn:active { transform: translateY(0); box-shadow: var(--sh-1); }
.chip, .pill { transition: background-color .3s, transform .3s var(--ease); }
a.pill:focus-visible { background: var(--sky); transform: translateY(-1px); }
@media (hover: hover) { a.pill:hover { background: var(--sky); transform: translateY(-1px); } }
.btn[disabled], .btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; transform: none; }
.chip { display: inline-flex; align-items: baseline; gap: 6px; padding: 3px 10px; border-radius: var(--r-s); background: var(--c-white); border: 1px solid var(--c-harbour-a18); font-size: var(--fs-1); }
.chip small { font-size: var(--fs-0); color: var(--ink-3); }
.pill { display: inline-block; padding: 5px 12px; border-radius: var(--r-pill); background: var(--c-white-a80); border: 1px solid var(--c-harbour-a18); color: var(--harbour); font-weight: 600; font-size: var(--fs-1); text-decoration: none; }
.stars { display: inline-block; width: 5.2em; height: 1em; margin-right: 6px; vertical-align: -0.1em; background: var(--c-e8b437); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m12 2.5 2.9 6 6.6.9-4.8 4.6 1.2 6.5L12 17.4l-5.9 3.1 1.2-6.5L2.5 9.4l6.6-.9z'/%3E%3C/svg%3E") 0 0 / 1.04em 1em repeat-x; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m12 2.5 2.9 6 6.6.9-4.8 4.6 1.2 6.5L12 17.4l-5.9 3.1 1.2-6.5L2.5 9.4l6.6-.9z'/%3E%3C/svg%3E") 0 0 / 1.04em 1em repeat-x; }
.img-missing { display: block; width: 100%; background: linear-gradient(135deg, var(--c-sky-a55), var(--c-foam-a90)); border: 1px dashed var(--c-harbour-a25); border-radius: var(--r-s); min-height: 60px; }

/* glass.css */

.glass {
  position: relative;
  border-radius: var(--r-l);
  background:
    radial-gradient(120% 90% at var(--mx, 30%) var(--my, 0%), var(--c-white-a55), var(--c-white-a00) 60%),
    linear-gradient(150deg, var(--g-hi), var(--g-mid) 48%, var(--g-lo));
  -webkit-backdrop-filter: blur(var(--g-blur)) saturate(175%);
  backdrop-filter: blur(var(--g-blur)) saturate(175%);
  border: 1px solid var(--g-edge);
  box-shadow: inset 0 1px 0 var(--c-white-a95), inset 0 0 0 1px var(--c-white-a18), inset 0 -22px 40px -30px var(--c-ocean-a38), var(--sh-2);
}
.glass::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  opacity: .16; mix-blend-mode: soft-light;
}
.glass > * { position: relative; z-index: 1; }
.glass--aqua { --g-mid: var(--c-e4f7fc-a64); --g-lo: var(--c-c0ecf6-a56); }
.glass--green { --g-mid: var(--c-e8faf0-a64); --g-lo: var(--c-c8f2de-a56); }
.glass--blue { --g-mid: var(--c-e8f4fd-a64); --g-lo: var(--c-c4e2fa-a58); }
.glass--hero { --g-hi: var(--c-white-a86); --g-mid: var(--c-eef9fd-a76); --g-lo: var(--c-d6f2fb-a70); }
.glass--smoke {
  color: var(--c-white);
  background:
    radial-gradient(120% 90% at var(--mx, 15%) var(--my, 0%), var(--c-sky-a16), var(--c-sky-a00) 55%),
    linear-gradient(150deg, var(--s-hi), var(--s-lo));
  border-color: var(--c-sky-a30);
  box-shadow: inset 0 1px 0 var(--c-sky-a40), inset 0 0 0 1px var(--c-sky-a08), var(--sh-3);
}
.glass--smoke::before { opacity: .10; }
.glass--smoke a { color: var(--sky); }
.glass--smoke h1, .glass--smoke h2, .glass--smoke h3, .glass--smoke .h-sec { color: var(--c-white); }
.plate {
  position: relative; z-index: 3; border-radius: var(--r-m);
  background: linear-gradient(150deg, var(--c-white-a82), var(--c-f0fafe-a70));
  -webkit-backdrop-filter: blur(16px) saturate(170%); backdrop-filter: blur(16px) saturate(170%);
  border: 1px solid var(--c-white-a85); box-shadow: inset 0 1px 0 var(--c-white), var(--sh-1);
}
.scrim { position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(180deg, var(--c-01283a-a00) 30%, var(--c-01283a-a62) 60%, var(--c-012232-a90) 100%); }
.card { position: relative; background: var(--c-white); border-radius: var(--r-m); box-shadow: var(--sh-2); }
.surface { position: relative; background: var(--c-white); border: 1px solid var(--line); border-radius: var(--r-m); box-shadow: var(--sh-soft); color: var(--ink); }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .glass, .plate { background: linear-gradient(150deg, var(--c-white-a96), var(--c-ecf8fd-a94)); }
  .glass--smoke { background: linear-gradient(150deg, var(--c-012637-a95), var(--c-harbour-2-a93)); }
}
@media (prefers-reduced-transparency: reduce) {
  .glass, .plate { background: linear-gradient(150deg, var(--c-white-a96), var(--c-ecf8fd-a94)); -webkit-backdrop-filter: none; backdrop-filter: none; }
  .glass--smoke { background: linear-gradient(150deg, var(--c-012637-a95), var(--c-harbour-2-a93)); }
}
@media (forced-colors: active) {
  .glass, .glass--smoke, .plate, .card, .surface { background: Canvas; color: CanvasText; border: 1px solid CanvasText; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .glass::before, .scrim { display: none; }
  :focus-visible { outline-color: Highlight; }
}

/* depth.css */

.band, .section { position: relative; isolation: isolate; }
.band { padding-block: var(--sec-pad); }
.band__media { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.band__layer { position: absolute; inset: 0; }   
.band__media img, .band__media .img-missing { position: absolute; left: 0; top: -8%; width: 100%; height: 116%; object-fit: cover; border: 0; border-radius: 0; }
.band__pattern { position: absolute; inset: 0; z-index: 0; pointer-events: none; background-color: var(--sky); opacity: .5; }
.band__in { position: relative; z-index: 1; }
.band--smoke { color: var(--c-white); background: var(--harbour-2); }
.band__pools { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.pool { position: absolute; z-index: 0; border-radius: 50%; pointer-events: none; filter: blur(30px); opacity: .7; }
.pool--a { width: 46vw; height: 46vw; max-width: 640px; max-height: 640px; left: -10vw; top: -14vw; background: radial-gradient(circle, var(--c-ocean-a55), var(--c-ocean-a00) 65%); animation: drift 26s ease-in-out infinite alternate; mix-blend-mode: soft-light; }
.pool--b { width: 40vw; height: 40vw; max-width: 560px; max-height: 560px; right: -8vw; bottom: -18vw; background: radial-gradient(circle, var(--c-sky-a90), var(--c-sky-a00) 65%); animation: drift 32s ease-in-out infinite alternate-reverse; }
@keyframes drift { from { transform: translate3d(0,0,0) scale(1); } to { transform: translate3d(4vw, 2vw, 0) scale(1.12); } }
.protrude { position: absolute; z-index: 2; pointer-events: none; user-select: none; filter: var(--sh-cut); }
.protrude img, .protrude .img-missing { width: 100%; height: auto; }
.protrude .img-missing { aspect-ratio: 1; border-radius: 50%; opacity: .0; }
.ai-frame { position: relative; display: block; }
.ai-tag { position: absolute; right: 10px; bottom: 10px; z-index: 3; padding: 3px 8px; border-radius: 6px; background: var(--c-01283a-a78); color: var(--c-white); font: 600 12px/1.3 var(--f-text); letter-spacing: .01em; pointer-events: none; }
@container (max-width: 299px) { .ai-tag { display: none; } }
.ai-frame { container-type: inline-size; }

/* motion.css */

.js-reveal .reveal:not(.is-in), .js-reveal [data-reveal]:not(.is-in) { opacity: 0; translate: 0 34px; animation: reveal-failsafe .01s 5s forwards; }
.js-reveal .reveal, .js-reveal [data-reveal] { transition: opacity .8s var(--ease), translate 1s var(--ease-settle); transition-delay: calc(min(var(--d, 0), 4) * 90ms); }
.js-reveal .reveal.is-in, .js-reveal [data-reveal].is-in { opacity: 1; translate: 0 0; }
@keyframes reveal-failsafe { to { opacity: 1; translate: 0 0; } }
.js-reveal .is-in .draw path, .js-reveal .hero .draw path { stroke-dashoffset: 240; animation: draw 1.1s .5s var(--ease) forwards; }
@keyframes draw { to { stroke-dashoffset: 0; } }
.js-reveal [data-breach]:not(.is-in) { translate: 0 60px; opacity: 0; animation: reveal-failsafe .01s 6s forwards; }
.js-reveal [data-breach] { transition: translate 1.3s var(--ease-settle), opacity .6s var(--ease); }
.js-reveal [data-breach].is-in { translate: 0 0; opacity: 1; }
[data-parallax] { will-change: translate; }
.band__sweep { position: absolute; left: 0; right: 0; top: 0; height: 2px; z-index: 3; pointer-events: none; overflow: hidden; opacity: 0; }
.band__sweep::before { content: ""; position: absolute; top: 0; bottom: 0; left: -40%; width: 40%; background: linear-gradient(90deg, var(--c-white-a00), var(--c-white-a95), var(--c-white-a00)); }
.band.is-swept > .band__sweep { animation: sweep-fade 2.4s cubic-bezier(.65,0,.35,1) both; }
.band.is-swept > .band__sweep::before { animation: sweep 2.4s cubic-bezier(.65,0,.35,1) both; }
@keyframes sweep { to { translate: 350% 0; } }
@keyframes sweep-fade { 0% { opacity: 0; } 12% { opacity: 1; } 80% { opacity: 1; } 100% { opacity: 0; } }
@media print {
  .reveal, [data-reveal], [data-breach] { opacity: 1 !important; translate: none !important; animation: none !important; }
  .agegate, .age-target, .sheet, .bag, .search-panel, .mega, .drop, .pool, .band__pools, .band__sweep, .skip, .protrude, .totop, .agegate__veil, .sheet__veil, .bag__veil { display: none !important; }
  html.gate-open, html.dialog-open { overflow: visible !important; overflow-x: clip !important; }
  .hdr { position: static; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  dialog, .bag__sheet, .sheet__panel { transition: opacity .15s linear !important; }
  .reveal, [data-reveal], [data-breach] { opacity: 1 !important; translate: none !important; }
  .draw path { stroke-dashoffset: 0 !important; }
  [data-parallax] { translate: none !important; }
  .band__sweep { display: none; }
  .pool { animation: none !important; }
}

/* chrome.css */

.hdr { position: sticky; top: 0; z-index: var(--z-header); }
.hdr::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: var(--hdr-h); z-index: -1;
  background: var(--c-foam-a78); -webkit-backdrop-filter: blur(18px) saturate(160%); backdrop-filter: blur(18px) saturate(160%);
  border-bottom: 1px solid var(--c-harbour-a12); transition: box-shadow .3s; }
.hdr.is-compact::before { box-shadow: var(--sh-1); }
.hdr__bar { height: var(--hdr-h); display: flex; align-items: center; gap: 18px; }
.hdr__logo { position: relative; flex: none; width: 96px; height: var(--hdr-h); align-self: flex-start; z-index: 3; }
.hdr__logo img { position: absolute; top: 6px; left: 0; width: 96px; height: auto; aspect-ratio: 700 / 568; filter: drop-shadow(0 8px 14px var(--c-01283a-a30)); transition: transform .45s var(--ease), width .35s var(--ease); transform-origin: 50% 0; }
.hdr__logo:focus-visible img { transform: rotate(-2.5deg) translateY(2px); }
@media (hover: hover) { .hdr__logo:hover img { transform: rotate(-2.5deg) translateY(2px); } }
.hdr.is-compact .hdr__logo img { width: 66px; }
.nav { flex: 1; min-width: 0; }
.nav__list { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; justify-content: center; gap: 2px; }
.nav__item { position: relative; display: flex; align-items: center; }
.nav__item.has-mega { position: static; }
.nav__link { position: relative; display: block; padding: 10px; font-weight: 600; font-size: var(--fs-1); line-height: 1.6; color: var(--ink); text-decoration: none; border-radius: 10px; white-space: nowrap; }
.nav__link::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: 5px; height: 2px; border-radius: 2px; background: var(--ocean); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease); }
.nav__link[aria-current="page"] { color: var(--harbour); }
.nav__link[aria-current="page"]::after, .nav__item.is-open > .nav__link::after { transform: scaleX(1); }
.nav__link:focus-visible { color: var(--harbour); }
.nav__link:focus-visible::after { transform: scaleX(1); }
.nav__caret { display: grid; place-items: center; width: 28px; height: 36px; margin-left: -6px; border: 0; background: transparent; border-radius: 8px; color: var(--ink-2); }
.nav__caret .ico { width: 15px; height: 15px; transition: transform .3s var(--ease); }
.nav__caret:focus-visible { color: var(--harbour); background: var(--c-ocean-a10); }
.nav__item.is-open > .nav__caret .ico, .nav__caret[aria-expanded="true"] .ico { transform: rotate(180deg); }
@media (hover: hover) {
  .nav__link:hover { color: var(--harbour); }
  .nav__link:hover::after { transform: scaleX(1); }
  .nav__caret:hover { color: var(--harbour); background: var(--c-ocean-a10); }
}
.drop { position: absolute; top: calc(100% + 4px); left: 0; min-width: 260px; padding: 10px; border-radius: var(--r-m); z-index: var(--z-mega);
  background: linear-gradient(150deg, var(--c-white-a92), var(--c-e8f7fd-a86)); -webkit-backdrop-filter: blur(20px) saturate(170%); backdrop-filter: blur(20px) saturate(170%);
  border: 1px solid var(--c-white); box-shadow: var(--sh-2); opacity: 0; visibility: hidden; translate: 0 -6px; transition: opacity .25s var(--ease), translate .25s var(--ease); }
.drop__list, .drop__list ul { list-style: none; margin: 0; padding: 0; }
.drop a { display: block; padding: 8px 12px; border-radius: 10px; color: var(--ink); text-decoration: none; font-size: var(--fs-1); font-weight: 600; }
.drop a:focus-visible { background: var(--c-ocean-a12); color: var(--harbour); }
@media (hover: hover) { .drop a:hover { background: var(--c-ocean-a12); color: var(--harbour); } }
.nav__item:nth-last-child(-n+2) > .drop { left: auto; right: 0; }
.nav__item.is-open > .drop { opacity: 1; visibility: visible; translate: 0 0; transition-delay: 0s; }
.mega { position: absolute; left: 0; right: 0; top: calc(var(--hdr-h) - 2px); padding: 8px var(--gut) 0; z-index: var(--z-mega);
  display: none; opacity: 0; translate: 0 -10px; transition: opacity .28s var(--ease), translate .28s var(--ease); }
.nav__item.is-open > .mega { display: block; opacity: 1; translate: 0 0; }
@starting-style { .nav__item.is-open > .mega { opacity: 0; translate: 0 -10px; } }
.mega__panel { max-width: var(--wrap); margin: 0 auto; display: grid; grid-template-columns: minmax(170px, 1fr) minmax(0, 3fr) 300px; gap: 14px; padding: 24px; border-radius: var(--r-l);
  background: radial-gradient(90% 120% at 0% 0%, var(--c-white-a75), var(--c-white-a00) 60%), linear-gradient(150deg, var(--c-white-a86), var(--c-e2f6fd-a78));
  -webkit-backdrop-filter: blur(26px) saturate(180%); backdrop-filter: blur(26px) saturate(180%);
  border: 1px solid var(--c-white); box-shadow: inset 0 1px 0 var(--c-white), var(--sh-3); max-height: calc(100vh - var(--hdr-h) - 24px); overflow: auto; }
.mega__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: minmax(130px, 1fr); gap: 14px; }
.mcard, .mega__feature { position: relative; overflow: hidden; isolation: isolate; border-radius: 18px; background: var(--harbour-2); box-shadow: 0 10px 22px -14px var(--c-01283a-a60); transition: transform .45s var(--ease), box-shadow .45s var(--ease); }
.mcard img, .mcard .img-missing, .mega__feature img, .mega__feature .img-missing { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; border: 0; border-radius: 0; transition: transform .8s var(--ease); }
.mcard__scrim, .mega__feature::after { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, var(--c-01283a-a00) 30%, var(--c-01283a-a62) 60%, var(--c-012232-a90) 100%); }
.mega__feature::after { content: ""; }
.mcard__labels p, .mega__feature-txt p { margin: 0; }
.mcard__labels { position: absolute; left: 14px; right: 14px; bottom: 12px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.mcard__main { color: var(--c-white); text-decoration: none; font: 800 1.2rem/1.1 var(--f-disp); font-stretch: 112%; display: inline-flex; align-items: center; gap: 6px; text-shadow: 0 1px 12px var(--c-011e2d-a60); border-radius: 6px; }
.mcard__sub { color: var(--c-white); font-size: var(--fs-1); font-weight: 600; text-decoration: underline; text-decoration-color: var(--c-sky-a70); text-underline-offset: 4px; text-shadow: 0 1px 12px var(--c-011e2d-a60); border-radius: 6px; }
.mcard a:focus-visible { outline: 3px solid var(--c-white); outline-offset: 3px; box-shadow: 0 0 0 7px var(--c-ocean-a55); }
.mega__feature:focus-visible { outline: 3px solid var(--harbour); outline-offset: 3px; }
.mcard .ar, .mega__feature .ar { width: 18px; height: 18px; opacity: 0; translate: -6px 0; transition: opacity .3s, translate .35s var(--ease); }
.mcard:focus-within, .mega__feature:focus-visible { transform: translateY(-4px); box-shadow: 0 22px 36px -18px var(--c-01283a-a75), 0 0 0 2px var(--c-white), 0 0 0 5px var(--c-ocean-a45); }
.mcard:focus-within img, .mega__feature:focus-visible img { transform: scale(1.08); }
.mcard:focus-within .ar, .mega__feature:focus-visible .ar { opacity: 1; translate: 0 0; }
.mcard__sub:focus-visible { color: var(--sky); }
@media (hover: hover) {
  .mcard:hover, .mega__feature:hover { transform: translateY(-4px); box-shadow: 0 22px 36px -18px var(--c-01283a-a75), 0 0 0 2px var(--c-white), 0 0 0 5px var(--c-ocean-a45); }
  .mcard:hover img, .mega__feature:hover img { transform: scale(1.08); }
  .mcard:hover .ar, .mega__feature:hover .ar { opacity: 1; translate: 0 0; }
  .mcard__sub:hover { color: var(--sky); }
}
.mega__feature { display: block; min-height: 280px; text-decoration: none; }
.mega__feature-txt { position: absolute; left: 16px; right: 16px; bottom: 16px; display: grid; gap: 2px; color: var(--c-white); }
.mega__feature-k { font-size: var(--fs-0); text-transform: uppercase; letter-spacing: .14em; font-weight: 700; color: var(--sky); }
.mega__feature-t { font: 900 1.7rem/1 var(--f-disp); font-stretch: 120%; display: inline-flex; align-items: center; gap: 8px; text-shadow: 0 1px 12px var(--c-011e2d-a60); }
.mega__side { display: flex; flex-direction: column; gap: 10px; font-size: var(--fs-1); min-width: 0; }
.mega__side ul { list-style: none; margin: 0; padding: 0; }
.mega__offers { margin: 0; }
.mega__offers a, .mega__links a, .mega__h a { display: block; padding: 3px 8px; margin-left: -8px; border-radius: 8px; color: var(--ink); text-decoration: none; font-weight: 600; }
.mega__offers a:focus-visible, .mega__links a:focus-visible, .mega__h a:focus-visible { background: var(--c-ocean-a12); color: var(--harbour); }
@media (hover: hover) { .mega__offers a:hover, .mega__links a:hover, .mega__h a:hover { background: var(--c-ocean-a12); color: var(--harbour); } }
.mega__h { margin: 4px 0 -6px; font-weight: 800; }
.mega__h a { color: var(--harbour); font-weight: 800; }
.mega__links--sm { display: grid; grid-template-columns: 1fr 1fr; column-gap: 8px; }
.mega__links--sm a { font-weight: 500; font-size: .875rem; color: var(--ink-2); }
.mega__pills { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 0; padding: 0; }
.mega__pills a { display: inline-block; padding: 5px 11px; border-radius: var(--r-pill); background: var(--c-white-a80); border: 1px solid var(--c-harbour-a18); color: var(--harbour); font-weight: 600; font-size: .875rem; text-decoration: none; transition: background-color .3s, transform .3s var(--ease); }
.mega__pills a:focus-visible { background: var(--sky); transform: translateY(-1px); }
@media (hover: hover) { .mega__pills a:hover { background: var(--sky); transform: translateY(-1px); } }
.mega__strip--cards { display: none; }   
.mega__hint { margin: 0; }
@media (hover: hover) and (min-width: 1101px) { .mega__hint { display: none; } }
.nav__item.is-open .mcard { animation: mrise .5s var(--ease) both; animation-delay: calc(var(--d, 0) * 40ms + 40ms); }
@keyframes mrise { from { opacity: 0; translate: 0 10px; } to { opacity: 1; translate: 0 0; } }
.hdr__tools { display: flex; align-items: center; gap: 8px; flex: none; margin-left: auto; }
.tool { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 44px; min-width: 44px; padding: 0 12px; border-radius: var(--r-pill); border: 1px solid var(--c-harbour-a16); background: var(--c-white-a70); color: var(--harbour); font-weight: 700; font-size: var(--fs-1); transition: background-color .3s, transform .3s var(--ease), box-shadow .3s; }
.tool[aria-expanded="true"] { background: var(--c-white); }
.tool:focus-visible { background: var(--c-white); transform: translateY(-1px); box-shadow: var(--sh-1), var(--focus-halo); }
@media (hover: hover) { .tool:hover { background: var(--c-white); transform: translateY(-1px); box-shadow: var(--sh-1), var(--focus-halo); } }
.tool--search { padding: 0; }
.bag-count { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 11px; background: var(--harbour); color: var(--c-white); font-size: .75rem; line-height: 1; }
.tool--burger { display: none; padding: 0; }
.burger { display: grid; gap: 4px; width: 20px; }
.burger i { display: block; height: 2px; border-radius: 2px; background: currentColor; }
.search-panel { position: absolute; left: 0; right: 0; top: var(--hdr-h); padding: 12px 0 14px; display: none; }
.search-panel.is-open { display: block; }
.search-panel::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--c-f0fafe-a90); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); border-bottom: 1px solid var(--c-white); box-shadow: var(--sh-1); }
.search-form { display: flex; align-items: center; gap: 12px; }
.search-form > .ico { color: var(--harbour); flex: none; }
.search-form input { flex: 1; min-width: 0; height: 48px; padding: 0 18px; border-radius: var(--r-s); border: 1px solid var(--c-harbour-a25); background: var(--c-white); font: 400 var(--fs-2) var(--f-text); color: var(--ink); }
.search-form input:focus-visible { outline: 3px solid var(--harbour); outline-offset: 2px; }
.search-go { flex: none; min-width: 48px; }
.search-close { display: none; flex: none; }
.search-results { max-height: min(60vh, 440px); overflow: auto; margin-top: 8px; }
.search-results:empty { display: none; }
.search-results__group { list-style: none; margin: 0; padding: 6px 0; border-top: 1px solid var(--c-harbour-a12); display: grid; gap: 2px; }
.search-results__group:first-child { border-top: 0; }
.search-hit { display: grid; padding: 8px 12px; border-radius: 10px; color: var(--ink); text-decoration: none; font-weight: 600; }
.search-hit__brand { font-size: var(--fs-0); font-weight: 700; color: var(--harbour); letter-spacing: .02em; }
.search-hit:focus-visible { background: var(--c-ocean-a12); color: var(--harbour); }
@media (hover: hover) { .search-hit:hover { background: var(--c-ocean-a12); color: var(--harbour); } }
.search-results__empty { margin: 8px 12px; color: var(--ink-2); }
.sheet, .bag { position: fixed; inset: 0; z-index: var(--z-sheet); }
.sheet[hidden], .bag[hidden] { display: none; }
.sheet__veil, .bag__veil { position: absolute; inset: 0; background: var(--c-01283a-a45); }
.sheet__panel, .bag__sheet { position: absolute; top: 0; right: 0; bottom: 0; width: min(420px, 100vw); overflow-y: auto; overscroll-behavior: contain; padding: 12px 20px 40px;
  background: linear-gradient(170deg, var(--c-white-a95), var(--c-e2f6fd-a92)); -webkit-backdrop-filter: blur(24px) saturate(170%); backdrop-filter: blur(24px) saturate(170%);
  box-shadow: -30px 0 60px -30px var(--c-01283a-a50); animation: slidein .35s var(--ease); }
.bag__sheet { width: min(440px, 100vw); display: flex; flex-direction: column; gap: 14px; }
@keyframes slidein { from { translate: 30px 0; opacity: .4; } to { translate: 0 0; opacity: 1; } }
.sheet__top { display: flex; justify-content: flex-end; margin: 0 0 6px; }
.sheet__list, .sheet__list ul { list-style: none; margin: 0; padding: 0; }
.sheet__l1 { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; padding: 12px 4px; border: 0; border-bottom: 1px solid var(--c-harbour-a12); background: none; font: 800 1.15rem/1.2 var(--f-disp); font-stretch: 110%; color: var(--ink); text-decoration: none; text-align: left; }
.sheet__l1 .ico { width: 18px; height: 18px; color: var(--ink-2); transition: transform .3s var(--ease); }
.sheet__acc-btn[aria-expanded="true"] .ico { transform: rotate(180deg); }
.sheet__l1:focus-visible { color: var(--harbour); }
@media (hover: hover) { .sheet__l1:hover { color: var(--harbour); } }
.sheet__shop-h { margin: 0; }
.sheet__cards { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 12px 0 10px !important; }
.sheet__cards .mcard { height: 120px; }
.sheet__cards .mcard--feature { grid-column: 1 / -1; height: auto; aspect-ratio: 16 / 7; background: none; box-shadow: none; overflow: visible; }
.sheet__cards .mcard--feature .mega__feature { position: absolute; inset: 0; min-height: 0; }
.sheet__cards .mcard__main { font-size: 1.05rem; }
.sheet__cards .mcard__labels { left: 10px; right: 10px; bottom: 8px; gap: 2px 10px; }
.sheet__cards .mega__feature-t { font-size: 1.4rem; }
.sheet__links { display: grid; gap: 2px; margin: 4px 0 10px !important; }
.sheet__links a, .sheet__l2 a, .sheet__l3 a { display: block; padding: 10px 8px; border-radius: 10px; color: var(--ink); text-decoration: none; font-weight: 600; }
.sheet__links a:focus-visible, .sheet__l2 a:focus-visible, .sheet__l3 a:focus-visible { background: var(--c-ocean-a12); color: var(--harbour); }
@media (hover: hover) { .sheet__links a:hover, .sheet__l2 a:hover, .sheet__l3 a:hover { background: var(--c-ocean-a12); color: var(--harbour); } }
.sheet__pills { margin: 6px 0 12px !important; }
.sheet__pills a { padding: 8px 14px; }
.sheet__sub-h { margin: 6px 0 0; font-weight: 800; }
.sheet__sub-h a { color: var(--harbour); }
.sheet__l3 { display: grid; grid-template-columns: 1fr 1fr; column-gap: 8px; margin-bottom: 10px !important; }
.sheet__l3 a { font-weight: 500; font-size: .9375rem; color: var(--ink-2); padding: 8px; }
.sheet__acc-panel { padding: 4px 0 8px; }
.sheet__contact { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--c-harbour-a12); font-size: var(--fs-1); color: var(--ink-2); }
.sheet__contact p { margin: 0 0 8px; }
.bag__top { display: flex; align-items: center; justify-content: space-between; }
.bag__top h2 { margin: 0; font: 900 1.5rem/1 var(--f-disp); font-stretch: 116%; color: var(--harbour-2); }
.bag__preview { margin: 0; padding: 8px 12px; border-radius: var(--r-s); background: var(--c-ocean-a12); color: var(--harbour-2); font-weight: 700; font-size: var(--fs-1); }
.bag__items { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.bag__items:empty { display: none; }
.bag__item { padding: 12px 14px; border-radius: var(--r-m); background: var(--c-white); box-shadow: var(--sh-1); }
.bag__item p { margin: 0; }
.bag__name { font-weight: 800; color: var(--ink); }
.bag__meta { color: var(--ink); }
.bag__price { font-weight: 700; }
.bag__asof { font-size: var(--fs-0); color: var(--ink-3); }
.bag__qty { display: flex; align-items: center; gap: 10px; margin-top: 8px !important; }
.bag__step { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--c-harbour-a25); background: var(--c-white); color: var(--harbour); font-weight: 700; font-size: 1.1rem; }
.bag__step:focus-visible { background: var(--sky); }
@media (hover: hover) { .bag__step:hover { background: var(--sky); } }
.bag__n { min-width: 2ch; text-align: center; font-weight: 700; }
.bag__empty { margin: 0; color: var(--ink-2); }
.bag__empty[hidden] { display: none; }
.bag__disclaimer { margin: 0; }
.bag__actions { margin: 4px 0 0; }
.bag__actions .btn { width: 100%; }
html.dialog-open { overflow: hidden; }
.ftr { position: relative; isolation: isolate; color: var(--c-white-a88); background: linear-gradient(180deg, var(--c-02577a), var(--harbour-2) 30%, var(--c-012a3c)); padding: 70px 0 30px; margin-top: 48px; }
.ftr::before { content: ""; position: absolute; left: 0; right: 0; top: -46px; height: 48px; z-index: 1;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 48' preserveAspectRatio='none'%3E%3Cpath d='M0 48 L0 32 C 240 2, 520 0, 720 28 C 920 0, 1200 2, 1440 32 L1440 48 Z' fill='%2302577a'/%3E%3C/svg%3E") center / 100% 100% no-repeat; }
.ftr__sea { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.ftr__sea img, .ftr__sea .img-missing { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .45; border: 0; border-radius: 0; background: none; }
.ftr__sea::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, var(--c-012637-a55), var(--c-012637-a82)); }
.ftr__in { position: relative; z-index: 2; display: grid; gap: 32px; }
.ftr__news { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px 28px; padding: 26px 30px; }
.ftr__news > * { margin: 0; }
.ftr__news h2, .ftr__news h3, .ftr__news h4 { grid-column: 1; margin: 0; font: 900 clamp(1.3rem, 1rem + 1vw, 1.75rem)/1.1 var(--f-disp); font-stretch: 112%; letter-spacing: 0; color: var(--c-white); }
.ftr__news .rich { grid-column: 1; }
.ftr__news .rich p { margin: 0; }
.ftr__news .btn-row { grid-column: 2; grid-row: 1 / span 2; margin: 0; }
.ftr__grid { display: grid; grid-template-columns: 1.25fr repeat(4, minmax(0, 1fr)); gap: 28px; }
.ftr__part > :last-child { margin-bottom: 0; }
.ftr__part p { margin: 0 0 6px; }
.ftr h2, .ftr h3, .ftr h4, .ftr h5, .ftr h6 { color: var(--c-white); font-size: 1rem; letter-spacing: .02em; margin-bottom: 12px; }
.ftr a { color: var(--sky); }
.ftr a:focus-visible { color: var(--c-white); text-decoration: underline; }
@media (hover: hover) { .ftr a:hover { color: var(--c-white); text-decoration: underline; } }
.ftr .btn--ink { background: var(--sky); color: var(--harbour-2); }
.ftr .btn--ink:focus-visible { background: var(--c-white); color: var(--harbour-2); text-decoration: none; }
@media (hover: hover) { .ftr .btn--ink:hover { background: var(--c-white); color: var(--harbour-2); text-decoration: none; } }
.ftr__brand .media { margin: 0 0 10px; }
.ftr__brand .media img { width: 180px; height: auto; }
.ftr__brand em { font-family: var(--f-script); font-style: normal; font-size: 1.6rem; color: var(--c-white); }
.ftr .social { list-style: none; padding: 0; margin: 10px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }
.ftr .social a { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--c-sky-a12); border: 1px solid var(--c-sky-a30); }
.ftr .hours-list { list-style: none; padding: 0; margin: 0; }
.ftr .hours-list li { display: grid; grid-template-columns: 6.5em max-content; column-gap: 12px; }
.hours__t { white-space: nowrap; }
.ftr__legal { border-top: 1px solid var(--c-sky-a18); padding-top: 16px; font-size: var(--fs-1); }
.ftr__legal p { margin: 0 0 6px; }
.ftr__legal .heading-as { color: var(--c-white-a88); }
.ftr__must { font-weight: 700; color: var(--c-white); }
.ftr__ai { color: var(--c-white-a80); font-size: var(--fs-0); }
.ftr__area { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; font-size: var(--fs-1); color: var(--c-white-a80); }
.ftr__area p { margin: 0 0 8px; }
.ftr__area strong { color: var(--c-white-a92); font-weight: 600; }
.protrude--fluke { width: clamp(280px, 34vw, 520px); right: clamp(10px, 9vw, 160px); top: clamp(-120px, -7.4vw, -70px); z-index: 3; }
.totop { position: fixed; right: 16px; bottom: 16px; z-index: var(--z-totop); display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: var(--harbour);
  background: var(--c-white-a72); -webkit-backdrop-filter: blur(12px) saturate(170%); backdrop-filter: blur(12px) saturate(170%); border: 1px solid var(--c-white-a90); box-shadow: var(--sh-2);
  opacity: 0; visibility: hidden; translate: 0 10px; transition: opacity .3s var(--ease), translate .3s var(--ease), visibility 0s .3s, transform .3s var(--ease); }
.totop.is-shown { opacity: 1; visibility: visible; translate: 0 0; transition-delay: 0s; }
.totop:focus-visible { transform: translateY(-2px); background: var(--c-white); }
@media (hover: hover) { .totop:hover { transform: translateY(-2px); background: var(--c-white); } }
html:not(.js) .totop { opacity: 1; visibility: visible; translate: 0 0; }
.age-target { position: fixed; top: 0; left: 0; width: 0; height: 0; overflow: hidden; }
.agegate { position: fixed; inset: 0; z-index: var(--z-gate); width: 100%; height: 100%; min-height: 100lvh; max-width: none; max-height: none; margin: 0; padding: 20px; border: 0; background: transparent; color: var(--ink); overflow: auto; }
.agegate[open] { display: grid; place-items: center; }
.agegate:not([open]) { display: none; }
.agegate::backdrop { background: transparent; }
html.age-ok .agegate { display: none; }
html:not(.js) #age-ok:target ~ .agegate { display: none; }
html:not(.js) #age-no:target ~ .agegate .age-error { display: block; }
.agegate__veil { position: absolute; inset: 0; background: var(--harbour-2); overflow: hidden; }
.agegate__veil img, .agegate__veil .img-missing { position: absolute; inset: -16px; width: calc(100% + 32px); height: calc(100% + 32px); max-width: none; object-fit: cover; opacity: .22; filter: blur(8px); border: 0; border-radius: 0; }
.agegate__card { position: relative; width: min(460px, 100vw - 32px); margin-top: 70px; padding: 30px 32px 26px; text-align: center; border-radius: var(--r-l);
  background: radial-gradient(120% 80% at 20% 0%, var(--c-white-a70), var(--c-white-a00) 60%), linear-gradient(160deg, var(--c-white-a92), var(--c-e2f6fd-a84));
  -webkit-backdrop-filter: blur(26px) saturate(180%); backdrop-filter: blur(26px) saturate(180%);
  border: 1px solid var(--c-white-a90); box-shadow: inset 0 1px 0 var(--c-white), 0 50px 100px -40px var(--c-011e2c-a70); animation: gatein .6s var(--ease-settle) both; }
@keyframes gatein { from { opacity: 0; translate: 0 24px; } to { opacity: 1; translate: 0 0; } }
.agegate__logo { width: 190px; height: auto; margin: -70px auto 8px; filter: drop-shadow(0 18px 24px var(--c-011e2c-a35)); }
.agegate__h { margin: 0; font: 900 2.4rem/1 var(--f-disp); font-stretch: 122%; color: var(--harbour-2); }
.agegate__q { margin: 10px 0 18px; font-size: 1.2rem; font-weight: 600; color: var(--ink); }
.agegate__btns { display: flex; justify-content: center; gap: 12px; margin: 0; }
.agegate__btns .btn { min-width: 120px; }
.agegate__btns .btn--glass { background: var(--c-white); border-color: var(--c-harbour-a35); }
.agegate__no { margin: 12px 0 0; font-weight: 700; color: var(--error-ink); }
.agegate__fine { margin: 16px 0 2px; font-size: .9rem; font-weight: 700; color: var(--ink-2); }
.agegate__tag { margin: 4px 0 0; font-size: 1.7rem; color: var(--harbour); }
html.gate-open { overflow: hidden; }
@media (max-width: 1240px) {
  .nav__link { padding: 10px 7px; font-size: 14.5px; }
  .nav__link::after { left: 7px; right: 7px; }
  .tool--bag .tool__txt { display: none; }
  .mega__panel { grid-template-columns: minmax(150px, 1fr) minmax(0, 3fr) 240px; }
}
@media (max-width: 1100px) {
  .nav { display: none; }
  .tool--burger { display: inline-flex; }
  .ftr__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ftr__brand { grid-column: 1 / -1; }
}
@media (max-width: 700px) {
  .hdr__logo, .hdr__logo img { width: 76px; }
  .hdr.is-compact .hdr__logo img { width: 60px; }
  .hdr__bar { gap: 10px; }
  .hdr__tools { gap: 6px; }
  .tool--bag { padding: 0 10px; }
  .search-panel.is-open { position: fixed; top: 0; left: 0; right: 0; z-index: var(--z-sheet); padding: 12px 0 16px; max-height: 100vh; overflow: auto; }
  .search-close { display: inline-flex; }
  .search-form { gap: 8px; }
  .ftr::before { height: 28px; top: -26px; }
  .ftr__news { grid-template-columns: 1fr; padding: 22px 20px; }
  .ftr__news .btn-row { grid-column: 1; grid-row: auto; }
  .ftr__grid { grid-template-columns: 1fr 1fr; gap: 24px 20px; }
  .ftr__area { grid-template-columns: 1fr; }
  .agegate__card { padding: 26px 20px 22px; margin-top: 60px; }
  .agegate__logo { width: 150px; margin-top: -66px; }
  .protrude--fluke { width: 260px; top: -92px; right: 12px; }
}
@media (max-width: 400px) {
  .ftr__grid { grid-template-columns: 1fr; }
  .tool--bag { min-width: 44px; }
}
.ftr__news--calm { border-radius: var(--r-l); background: var(--c-white-a12); border: 1px solid var(--c-sky-a30); color: var(--c-white); }
.ftr__news--calm a:not(.btn) { color: var(--sky); }
.ftr { background: var(--tex-contour-sky) 0 0 / 480px 240px repeat, linear-gradient(180deg, var(--c-02577a), var(--harbour-2) 30%, var(--c-012a3c)); }

/* home.css */

.hero { position: relative; isolation: isolate; z-index: 3; min-height: clamp(470px, calc(100svh - var(--hdr-h) - var(--ann-h) - 40px), 860px); display: grid; align-items: center; padding: 40px 0 74px; }
.hero__media { position: absolute; inset: 0; z-index: 0; overflow: hidden; background: var(--c-cfe9f2); pointer-events: none; }
.hero__layer { position: absolute; inset: 0; }   
.hero__media picture { display: contents; }
.hero__img, .hero__media .img-missing { position: absolute; left: 0; top: -9%; width: 100%; height: 118%; object-fit: cover; object-position: 50% 58%; border: 0; border-radius: 0; }
.hero::after { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(90deg, var(--c-01283a-a18), var(--c-01283a-a00) 55%), linear-gradient(180deg, var(--c-foam-a00) 70%, var(--c-foam-a50)); }
.hero__in { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 660px) minmax(0, 1fr); align-items: center; column-gap: 32px; }
.hero__panel { width: 100%; padding: 26px 34px 24px; border-radius: 30px; }
.award { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; margin: 0 0 14px; padding: 6px 14px 6px 10px; border-radius: var(--r-pill); background: var(--c-white); border: 1px solid var(--c-harbour-a16); box-shadow: var(--sh-1); color: var(--harbour-2); font: 600 var(--fs-0)/1.35 var(--f-text); text-decoration: none; transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
.award__star { flex: none; width: 16px; height: 16px; fill: var(--ocean); stroke: var(--ocean); }
@media (hover: hover) { .award:hover { transform: translateY(-2px); box-shadow: var(--sh-2); } }
.award:focus-visible { transform: translateY(-2px); box-shadow: var(--sh-2); }
.hero__title { margin: 0; font-family: var(--f-disp); font-size: var(--fs-hero); font-weight: 900; font-stretch: 122%; line-height: .96; letter-spacing: -.012em; color: var(--harbour-2); }
.hero__title .t1, .hero__title .t2, .hero__title .t3 { display: block; }
.hero__title .t2 { margin-top: .04em; }
.hero__title .t3 { margin-top: .12em; font-size: .62em; font-stretch: 112%; line-height: 1.05; color: var(--harbour); }
.hero__title .draw svg { bottom: -.34em; height: .5em; }
.hero__cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.hero__cta .btn { min-height: 54px; }
.btn--white { background: var(--c-white-a86); color: var(--harbour); border-color: var(--c-harbour-a20); box-shadow: var(--sh-1); }
@media (hover: hover) { .btn--white:hover { background: var(--c-white); color: var(--harbour-2); transform: translateY(-2px); } }
.btn--white:focus-visible { background: var(--c-white); color: var(--harbour-2); transform: translateY(-2px); }
.hero__sign { margin: 12px 0 0; font-size: clamp(1.45rem, 1.05rem + 1vw, 1.95rem); line-height: 1.2; color: var(--harbour); }
.gbadge { justify-self: end; align-self: start; margin-top: 6%; display: block; text-decoration: none; color: var(--harbour-2); rotate: 4deg; transition: rotate .45s var(--ease), translate .45s var(--ease); }
@media (hover: hover) { .gbadge:hover { rotate: 0deg; translate: 0 -3px; } }
.gbadge:focus-visible { rotate: 0deg; translate: 0 -3px; }
.gbadge__plate { display: grid; justify-items: center; gap: 6px; min-width: 176px; padding: 26px 22px 18px; border-radius: 46% 46% 18px 18px / 26% 26% 18px 18px; background: var(--c-white); border: 3px solid var(--harbour-2); box-shadow: inset 0 0 0 4px var(--c-white), inset 0 0 0 6px var(--c-harbour-a25), var(--sh-3); }
.gbadge__logo { width: 96px; height: auto; }
.gbadge__n { display: grid; justify-items: center; line-height: 1; }
.gbadge__v { font: 900 3rem/1 var(--f-disp); font-stretch: 112%; color: var(--harbour-2); }
.gbadge__c { font: 600 var(--fs-1)/1.4 var(--f-text); color: var(--ink-2); }
.gbadge .stars { display: block; }
.protrude--p1 { width: 230px; right: -168px; bottom: -34px; rotate: -8deg; }
.protrude--p2 { width: clamp(170px, 19vw, 300px); right: max(var(--gut), calc(50% - 600px)); bottom: -62px; rotate: 12deg; }
@media (min-width: 701px) and (max-height: 700px) {
  .hero { padding: 24px 0 48px; }
  .hero__panel { padding: 18px 30px 18px; }
  .award { margin-bottom: 10px; }
  .hero__cta { margin-top: 14px; }
  .hero__sign { display: inline-block; margin: 0 0 0 12px; vertical-align: middle; }
  .hero__cta { display: inline-flex; vertical-align: middle; }
}
@media (max-width: 1279px) { .protrude--p1 { width: 190px; right: -130px; } }
@media (max-width: 900px) and (min-width: 701px) { .hero__in { grid-template-columns: minmax(0, 1fr); } .gbadge { display: none; } }
.band--home { padding-block: var(--sec-pad); }
.band--dark { color: var(--c-white); background: var(--harbour-2); }
.band--dark .h-sec { color: var(--c-white); }
.band__scrim { position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(180deg, var(--c-01283a-a55), var(--c-01283a-a75)); }
.band__scrim--warm { background: linear-gradient(180deg, var(--c-01283a-a42), var(--c-012232-a62) 70%, var(--c-012232-a72)); }
.band__media .ai-frame { position: absolute; inset: 0; }
.band__media .ai-tag { top: auto; right: 14px; bottom: 14px; }
.band__pattern--tails { opacity: 1; background-color: var(--sky); background-image: radial-gradient(60% 70% at 78% 38%, var(--c-ocean-a34), var(--c-ocean-a00) 70%), radial-gradient(45% 60% at 18% 82%, var(--c-ocean-ink-a22), var(--c-ocean-ink-a00) 70%), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='96' viewBox='0 0 120 96'%3E%3Cpath fill='%23ffffff' fill-opacity='.85' d='M30 46c-1-4-1.6-7.6-1.8-11.2-4.4.8-12.6-1.2-17.4-9.6 6 2 12 2.4 17.2 4.4.4-2.6 1-5.2 2-7.6 1 2.4 1.6 5 2 7.6 5.2-2 11.2-2.4 17.2-4.4-4.8 8.4-13 10.4-17.4 9.6C31.6 38.4 31 42 30 46zM90 94c-1-4-1.6-7.6-1.8-11.2-4.4.8-12.6-1.2-17.4-9.6 6 2 12 2.4 17.2 4.4.4-2.6 1-5.2 2-7.6 1 2.4 1.6 5 2 7.6 5.2-2 11.2-2.4 17.2-4.4-4.8 8.4-13 10.4-17.4 9.6C91.6 86.4 91 90 90 94z'/%3E%3C/svg%3E"); background-size: 100% 100%, 100% 100%, 120px 96px; }
.band--intro .intro, .band--vip .vip, .band--learn .learn { --g-hi: var(--c-white-a92); --g-mid: var(--c-f3fbfe-a86); --g-lo: var(--c-e6f7fc-a80); }
.seam::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; z-index: 4; pointer-events: none; opacity: 0; background: linear-gradient(90deg, var(--c-white-a00), var(--c-white-a95), var(--c-white-a00)) no-repeat; background-size: 34% 100%; background-position: -40% 0; }
.js-reveal .seam.is-in::after { animation: seam-sweep 2.4s cubic-bezier(.65,0,.35,1) .2s 1 both; }
@keyframes seam-sweep { 0% { opacity: 0; background-position: -40% 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { opacity: 0; background-position: 140% 0; } }
.band--home .band__media img, .band--home .band__media .img-missing { top: 0; height: 100%; }
.band--cats .band__media img { top: -4%; height: 108%; }
.rail-head { display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.rail { position: relative; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: thin; margin-inline: calc(-1 * var(--gut)); padding: 6px var(--gut) 22px; scroll-padding-inline: var(--gut); }
.rail:focus-visible { outline: 3px solid var(--c-white); outline-offset: -3px; box-shadow: inset 0 0 0 6px var(--ocean); }
.rail__list { display: flex; gap: 20px; margin: 0; padding: 0; list-style: none; }
.rail__list > li { flex: none; scroll-snap-align: start; }
.band--cats { z-index: 2; padding-top: calc(var(--sec-pad) + 58px); padding-bottom: calc(var(--sec-pad) + 128px); }
.ccards, .gcards, .promos { display: grid; gap: 24px; margin: 0; padding: 0; list-style: none; }
.ccards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ccard { position: relative; aspect-ratio: 4 / 3; border-radius: var(--r-m); background: var(--c-white); box-shadow: var(--sh-2); transition: transform .45s var(--ease), box-shadow .45s var(--ease); }
.ccard__media { position: absolute; inset: 0; overflow: hidden; border-radius: inherit; }
.ccard__media img, .ccard__media .ai-frame, .ccard__media .img-missing { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: scale .8s var(--ease); }
.ccard__media .ai-tag { top: 10px; bottom: auto; }
.ccard__link { position: static; display: block; color: var(--harbour-2); text-decoration: none; outline: none; }
.ccard__link::after { content: ""; position: absolute; inset: 0; z-index: 4; border-radius: var(--r-m); }
.ccard__plate { position: absolute; left: 12px; right: 12px; bottom: 12px; z-index: 3; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 0; max-height: 38%; padding: 12px 16px; border-radius: 16px; }
.ccard__t { margin: 0; font: 900 clamp(1.35rem, 1rem + 1vw, 1.9rem)/1.05 var(--f-disp); font-stretch: 112%; color: var(--harbour-2); }
.ccard__btn, .gcard__btn { flex: none; display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 8px 14px; border-radius: var(--r-pill); background: var(--harbour); color: var(--c-white); font: 700 var(--fs-1)/1.2 var(--f-text); }
.ccard__btn .ico, .gcard__btn .ico { width: 16px; height: 16px; transition: translate .35s var(--ease); }
@media (hover: hover) {
  .ccard:hover { transform: translateY(-6px); box-shadow: 0 0 0 2px var(--c-white), 0 0 0 5px var(--c-ocean-a30), var(--sh-3); }
  .ccard:hover .ccard__media img { scale: 1.06; }
  .ccard:hover .ccard__btn .ico { translate: 4px 0; }
}
.ccard:focus-within { transform: translateY(-6px); box-shadow: 0 0 0 2px var(--c-white), 0 0 0 5px var(--c-ocean-a30), var(--sh-3); outline: 3px solid var(--harbour); outline-offset: 4px; }
.ccard:focus-within .ccard__media img { scale: 1.06; }
.ccard:focus-within .ccard__btn .ico { translate: 4px 0; }
.ccard:active { transform: none; }
.gcards { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 24px; }
.gcard { position: relative; min-height: 150px; border-radius: var(--r-m); transition: transform .45s var(--ease), box-shadow .45s var(--ease); }
.gcard__link { position: relative; z-index: 1; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; gap: 14px; min-height: 150px; padding: 22px 24px; color: var(--harbour-2); text-decoration: none; border-radius: inherit; outline: none; }
.gcard__t { margin: 0; font: 900 clamp(1.3rem, 1rem + .8vw, 1.7rem)/1.05 var(--f-disp); font-stretch: 112%; }
.gcard__tail { position: absolute; right: 16px; top: 14px; width: 74px; height: 46px; fill: var(--c-ocean-a22); transition: fill .45s var(--ease), translate .45s var(--ease); z-index: 0; }
@media (hover: hover) {
  .gcard:hover { transform: translateY(-6px); box-shadow: var(--sh-3); }
  .gcard:hover .gcard__tail { fill: var(--c-ocean-a50); translate: 0 -3px; }
}
.gcard:focus-within { transform: translateY(-6px); box-shadow: var(--sh-3); outline: 3px solid var(--harbour); outline-offset: 4px; }
.gcard:focus-within .gcard__tail { fill: var(--c-ocean-a50); translate: 0 -3px; }
.promos { grid-template-columns: repeat(4, minmax(0, 290px)); justify-content: center; margin-top: 24px; }
.promo { padding: 8px; border-radius: 18px; transition: transform .45s var(--ease), box-shadow .45s var(--ease); }
.promo__link { display: block; border-radius: 12px; outline: none; }
.promo__img { display: block; width: 100%; height: auto; border-radius: 12px; }
@media (hover: hover) { .promo:hover { transform: translateY(-4px); box-shadow: var(--sh-3); } }
.promo:focus-within { transform: translateY(-4px); box-shadow: var(--sh-3); outline: 3px solid var(--harbour); outline-offset: 4px; }
.postcard { position: absolute; z-index: 2; left: max(var(--gut), calc(50% - 620px)); bottom: -176px; width: 460px; margin: 0; padding: 10px; border-radius: 6px; background: var(--c-white); box-shadow: var(--sh-3); rotate: -4deg; pointer-events: none; }
.postcard__img { display: block; width: 100%; height: auto; border-radius: 2px; }
.postcard__tape { position: absolute; width: 96px; height: 26px; background: var(--c-sky-a72); box-shadow: 0 1px 2px var(--c-harbour-2-a12); z-index: 1; }
.postcard__tape--a { left: -22px; top: 10px; rotate: -38deg; }
.postcard__tape--b { right: -22px; top: 8px; rotate: 36deg; }
.postcard__mark { position: absolute; right: -26px; bottom: -30px; width: 108px; height: 108px; z-index: 1; rotate: 14deg; fill: none; stroke: var(--c-harbour-a55); stroke-width: 2.4; }
.postcard__mark text { fill: var(--c-harbour-a75); stroke: none; font: 700 11.5px/1 var(--f-text); letter-spacing: .1em; }
.postcard__mark .postcard__tailmark { fill: var(--c-harbour-a55); stroke: none; }
.js-reveal .band--cats:not(.is-in) .postcard { rotate: -9deg; translate: 0 24px; }
.js-reveal .band--cats .postcard { transition: rotate .9s cubic-bezier(.3,1.45,.55,1), translate .9s cubic-bezier(.3,1.45,.55,1); }
.band--intro { padding-top: var(--sec-pad); }
.band--intro .band__in { display: grid; grid-template-columns: minmax(0, 470px) minmax(0, 1fr); column-gap: 40px; }
.intro { grid-column: 2; padding: 28px 34px 26px; }
.intro__banner { margin: 0 0 18px; }
.intro__banner img { display: block; width: 100%; height: auto; border-radius: 14px; box-shadow: var(--sh-1); }
.intro__bannerlink { display: block; border-radius: 14px; }
.intro__copy .rich { font-size: var(--fs-3); line-height: 1.6; }
.intro__copy .rich p { margin: 0 0 12px; }
.band__media--glint { transform: scaleX(-1); mix-blend-mode: lighten; }
.band--home .band__media--glint { -webkit-mask-image: linear-gradient(180deg, transparent 0, transparent 128px, var(--c-black) 176px); mask-image: linear-gradient(180deg, transparent 0, transparent 128px, var(--c-black) 176px); }
@media (max-width: 700px) { .band--home .band__media--glint { display: none; } }   
.ocard { position: relative; display: flex; flex-direction: column; width: 290px; min-height: 250px; padding: 22px 22px 18px; border-radius: var(--r-m); transition: transform .45s var(--ease), box-shadow .45s var(--ease); }
.ocard__tail { position: absolute; right: 14px; top: 12px; width: 58px; height: 36px; fill: var(--c-sky-a16); }
.ocard__t { margin: 0 0 10px; padding-right: 40px; font: 800 1.12rem/1.25 var(--f-disp); font-stretch: 106%; color: var(--c-white); }
.ocard__t a { color: var(--c-white); text-decoration: none; }
.ocard__x { flex: 1; margin: 0; max-height: calc(1.5em * 4); overflow: hidden; font-size: var(--fs-1); line-height: 1.5; color: var(--c-white-a92); }
.ocard__x p { margin: 0; }
.ocard__more { margin: 14px 0 0; }
.ocard__more a { display: inline-flex; align-items: center; gap: 8px; color: var(--sky); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.ocard__more .ico { width: 16px; height: 16px; }
@media (hover: hover) { .ocard:hover { transform: translateY(-6px); box-shadow: var(--sh-3); } }
.ocard:focus-within { transform: translateY(-6px); box-shadow: var(--sh-3); }
.offers__more { margin: 18px 0 0; }
.band--live .band__in, .band--visit .band__in { display: grid; grid-template-columns: minmax(0, 1fr); justify-items: center; }
.glass--smoke .btn--sky, .band--dark .btn--sky { color: var(--harbour-2); }
.band--dark .grad, .glass--smoke .grad { color: var(--sky); }
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .band--dark .grad, .glass--smoke .grad { background: linear-gradient(100deg, var(--sky) 0%, var(--c-white) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
}
.live__go p { margin: 0; }
.gbadge .stars, .rev__score .stars, .band--reviews .review__rating .stars { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m12 2.2 2.95 6.05 6.65.95-4.8 4.65 1.15 6.6L12 17.3l-5.95 3.15 1.15-6.6-4.8-4.65 6.65-.95z'/%3E%3C/svg%3E") 0 0 / 1.04em 1em repeat-x; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m12 2.2 2.95 6.05 6.65.95-4.8 4.65 1.15 6.6L12 17.3l-5.95 3.15 1.15-6.6-4.8-4.65 6.65-.95z'/%3E%3C/svg%3E") 0 0 / 1.04em 1em repeat-x; }
.gbadge .stars { font-size: 20px; margin: 0; }
.live-wrap { position: relative; width: min(1000px, 100%); }
.live { display: grid; align-content: center; justify-items: start; gap: 18px; min-height: 220px; padding: 32px 40px; }
.live .h-sec { margin: 0; }
.live__go { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; }
.live__tail { position: absolute; right: 26px; top: 22px; width: 120px; height: 75px; fill: var(--c-ocean-a14); }
.glass--smoke .live__tail { fill: var(--c-sky-a14); }
.btn--onDark { color: var(--c-white); border-color: var(--c-sky-a60); }
@media (hover: hover) { .btn--onDark:hover { color: var(--c-white); background: var(--c-sky-a14); border-color: var(--c-white); } }
.btn--onDark:focus-visible { color: var(--c-white); background: var(--c-sky-a14); border-color: var(--c-white); }
.protrude--p9 { width: 160px; left: -46px; bottom: -64px; rotate: 10deg; }
.band--live:not(.band--loop) { padding-bottom: calc(var(--sec-pad) + 30px); }
.band--loop { z-index: 0; }
.band__media--loop .loop__poster, .band__media--loop .loop__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.band__media--loop .loop__video { opacity: 0; transition: opacity .6s linear; }
.band__media--loop .loop__video.is-playing { opacity: 1; }
.band--loop::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(180deg, var(--c-01283a-a25), var(--c-01283a-a45)); }
.band--logos { background: var(--foam); }
.logos { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px 22px; margin: 8px 0 0; padding: 0; list-style: none; }
.logo__link { display: grid; justify-items: center; gap: 8px; color: var(--ink-2); text-decoration: none; font-size: var(--fs-0); outline: none; }
.logo__plate { display: grid; place-items: center; width: 120px; height: 120px; padding: 14px; border-radius: 22px; background: var(--c-white); box-shadow: var(--sh-2); transition: transform .45s var(--ease), box-shadow .45s var(--ease); }
.logo__img { width: 100%; height: 100%; object-fit: contain; }
.logo__name { max-width: 128px; text-align: center; line-height: 1.3; }
@media (hover: hover) { .logo__link:hover .logo__plate { transform: translateY(-4px); box-shadow: var(--sh-3); } }
.logo__link:focus-visible .logo__plate { transform: translateY(-4px); box-shadow: var(--sh-3); outline: 3px solid var(--harbour); outline-offset: 3px; }
.band--reviews { color: var(--c-white); background: var(--c-2a2f3a); }
.rev { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) 220px; grid-template-areas: "intro list award"; gap: 24px; align-items: start; }
.rev__intro { grid-area: intro; padding: 26px 30px 22px; }
.rev__intro .h-sec { margin-bottom: 14px; }
.rev__intro .rich p { margin: 0 0 10px; }
.rev__intro .rich img { display: inline-block; width: 72px; height: auto; vertical-align: middle; }
.rev__sub { margin: 8px 0 12px; font: 700 var(--fs-3)/1.35 var(--f-disp); font-stretch: 106%; color: var(--c-white); }
.rev__score { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin: 6px 0 4px; padding: 10px 14px; border-radius: 14px; background: var(--c-white); color: var(--ink); width: fit-content; }
.rev__logo { width: 88px; height: auto; }
.rev__line { margin: 0; font: 800 1.15rem/1.2 var(--f-disp); color: var(--harbour-2); }
.rev__intro .snapshot { margin: 10px 0 0; color: var(--c-white-a86); font-size: var(--fs-0); }
.rev__list { grid-area: list; display: grid; gap: 16px; margin: 0; padding: 0; list-style: none; }
.band--reviews .review { display: grid; grid-template-columns: 40px minmax(0, 1fr); column-gap: 12px; padding: 20px 22px; color: var(--ink); }
.band--reviews .review > * { grid-column: 2; }
.band--reviews .review__av { grid-column: 1; grid-row: 1 / span 2; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--sky); color: var(--harbour-2); font: 800 var(--fs-1)/1 var(--f-text); }
.band--reviews .review__av::before { content: attr(data-initials); }
.band--reviews .review__author { margin: 0; font-weight: 700; color: var(--harbour-2); }
.band--reviews .review__time { margin: 0; font-size: var(--fs-0); color: var(--ink-3); }
.band--reviews .review__rating { display: flex; align-items: center; gap: 8px; margin: 8px 0 6px; }
.band--reviews .review__rating .value { font-weight: 700; color: var(--ink-2); font-size: var(--fs-1); }
.band--reviews .review__text { margin: 0; line-height: 1.55; }
.rev__award { grid-area: award; display: grid; justify-items: center; gap: 10px; text-align: center; }
.rev__thanks { margin: 0; font-size: clamp(1.9rem, 1.3rem + 1.4vw, 2.6rem); line-height: 1.1; color: var(--c-white); text-shadow: 0 2px 14px var(--c-011e2d-a60); }
.rev__fig { margin: 0; width: min(200px, 100%); }
.rev__awardimg { display: block; width: 100%; height: auto; border-radius: 12px; box-shadow: var(--sh-3); }
.feats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin: 28px 0 0; padding: 0; list-style: none; }
.feat { padding: 20px 22px; border-radius: var(--r-m); transition: transform .45s var(--ease), box-shadow .45s var(--ease); }
.feat__h { margin: 0 0 8px; font: 800 1.15rem/1.25 var(--f-disp); font-stretch: 106%; color: var(--c-white); }
.feat .rich p { margin: 0; font-size: var(--fs-1); line-height: 1.55; }
@media (hover: hover) { .feat:hover { transform: translateY(-5px); box-shadow: var(--sh-3); } }
.feat:focus-within { transform: translateY(-5px); box-shadow: var(--sh-3); }
.band--vip { padding-top: calc(var(--sec-pad) + 64px); }
.vip-wrap { position: relative; max-width: 900px; margin-inline: auto; }
.vip { padding: 34px 40px 30px; }
.vip .h-sec { margin-bottom: 12px; }
.vip .rich p { margin: 0 0 14px; }
.vip__banner { margin: 6px 0 18px; }
.vip__banner img { display: block; width: 100%; height: auto; border-radius: 12px; }
.vip__h2 { font-size: var(--fs-h3); margin: 6px 0 12px; }
.vip__go { margin: 0; }
.vip__note { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--c-harbour-a16); color: var(--ink-2); }
.vip__note p { margin: 0; font-size: var(--fs-0); }
.protrude--p6 { width: 220px; right: 36px; top: -122px; rotate: 18deg; }
.band--rail { padding-bottom: calc(var(--sec-pad) + 30px); }
.band--rail .h-sec { text-shadow: 0 1px 14px var(--c-white-a70); }
.band--rail .pcard { position: relative; display: flex; flex-direction: column; width: 260px; min-height: 230px; padding: 18px 20px 18px; border-radius: var(--r-m); transition: transform .45s var(--ease), box-shadow .45s var(--ease); }
.band--rail .pcard__tail { position: absolute; right: 12px; top: 12px; width: 60px; height: 38px; fill: var(--c-ocean-a20); transition: scale .8s var(--ease), rotate .8s var(--ease); }
.band--rail .pcard__brand { margin: 0 0 6px; padding-right: 56px; font: 700 var(--fs-0)/1.3 var(--f-text); letter-spacing: .12em; text-transform: uppercase; }
.band--rail .pcard__brand a { color: var(--harbour); text-decoration: none; }
.band--rail .pcard__t { flex: 1; margin: 0 0 14px; font: 800 1.1rem/1.25 var(--f-disp); font-stretch: 106%; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; }
.band--rail .pcard__t a { color: var(--harbour-2); text-decoration: none; }
.band--rail .pcard__go { margin: 0; }
.band--rail .pcard__go .btn { width: 100%; min-height: 44px; padding: 10px 12px; font-size: var(--fs-0); }
@media (hover: hover) {
  .band--rail .pcard:hover { transform: translateY(-6px); box-shadow: 0 0 0 2px var(--c-white), var(--sh-3); }
  .band--rail .pcard:hover .pcard__tail { scale: 1.05; rotate: -2deg; }
}
.band--rail .pcard:focus-within { transform: translateY(-6px); box-shadow: 0 0 0 2px var(--c-white), var(--sh-3); outline: 3px solid var(--harbour); outline-offset: 3px; }
.band--rail .pcard:focus-within .pcard__tail { scale: 1.05; rotate: -2deg; }
.band--visit { z-index: 2; max-height: none; }
.visit { width: min(720px, 100%); padding: 18px; }
.visit__map .map-facade { position: relative; display: grid; place-items: center; aspect-ratio: 4 / 3; max-height: 420px; width: 100%; border-radius: 16px; background: linear-gradient(150deg, var(--c-012637-a55), var(--c-harbour-2-a35)); border: 1px dashed var(--c-sky-a45); }
.visit__map .map-facade iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; border-radius: 16px; }
.visit__map .map-facade__btn { -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--sky); color: var(--harbour-2); }
.protrude--p8 { width: clamp(150px, 15vw, 230px); right: max(var(--gut), calc(50% - 610px)); bottom: -70px; }
.band--visit + .band { padding-top: calc(var(--sec-pad) + 40px); }
.learn { padding: 30px 36px; }
.learn > .rich p { margin: 0 0 18px; }
.learn .faq { margin-top: 10px; }
.band--closer { background: var(--foam); }
.closer { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin: 0; }
@media (max-width: 1100px) {
  .ccards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .promos { grid-template-columns: repeat(2, minmax(0, 290px)); }
  .rev { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "intro intro" "list award"; }
  .feats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .band--intro .band__in { grid-template-columns: minmax(0, 380px) minmax(0, 1fr); }
  .postcard { width: 380px; }
}
@media (max-width: 1279px) { .protrude--p9 { width: 140px; } .protrude--p6 { width: 180px; } }
@media (max-width: 900px) {
  .band--intro .band__in { grid-template-columns: minmax(0, 1fr); }
  .band--intro { padding-top: calc(var(--sec-pad) + 200px); }
  .intro { grid-column: 1; }
  .postcard { left: 50%; translate: -50% 0; }
  .js-reveal .band--cats:not(.is-in) .postcard { translate: -50% 24px; }
}
@media (max-width: 700px) {
  .hero { align-items: start; padding: 16px 0 40px; }
  .hero__img { top: 0; height: 100%; object-position: 50% 0%; }
  .hero__in { grid-template-columns: minmax(0, 1fr); row-gap: 0; }
  .hero__panel { padding: 18px 18px 24px; border-radius: 24px; }
  .award { font-size: .75rem; margin-bottom: 10px; padding: 5px 12px 5px 9px; }
  .hero__title { font-size: 2.45rem; }
  .hero__cta { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 16px; }
  .hero__cta .btn { min-height: 48px; padding: 10px 12px; }
  .gbadge { justify-self: end; margin: -16px 6px 0 0; rotate: 4deg; }
  .gbadge__plate { grid-template-columns: auto auto; align-items: center; justify-items: start; column-gap: 12px; min-width: 0; padding: 14px 16px 12px; border-radius: 36% 36% 14px 14px / 30% 30% 14px 14px; }
  .gbadge__logo { width: 60px; grid-column: 1 / -1; justify-self: center; }
  .gbadge__v { font-size: 2rem; }
  .protrude--p1 { width: 100px; left: 10px; right: auto; top: auto; bottom: -54px; rotate: -6deg; }
  .protrude--p2 { width: 130px; right: 12px; bottom: -48px; }
  .band--cats { padding-top: calc(var(--sec-pad) + 44px); padding-bottom: calc(var(--sec-pad) + 96px); background: linear-gradient(180deg, var(--foam), var(--c-e4f5fb)); }
  .band--cats .band__media { display: none; }
  .ccards { grid-template-columns: minmax(0, 1fr); }
  .ccard { aspect-ratio: 16 / 10; }
  .gcards { grid-template-columns: minmax(0, 1fr); }
  .gcard { min-height: 0; background: var(--c-white); -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: var(--sh-2); }
  .gcard__link { min-height: 96px; padding: 18px 20px; flex-direction: row; align-items: center; }
  .promos { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .promo { background: var(--c-white); -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: var(--sh-2); }
  .postcard { width: 280px; bottom: -110px; padding: 8px; }
  .postcard__mark { width: 80px; height: 80px; right: -14px; bottom: -22px; }
  .band--intro { padding-top: calc(var(--sec-pad) + 120px); }
  .intro { padding: 20px 18px; }
  .ocard { width: min(80vw, 300px); }
  .live { padding: 26px 22px; min-height: 0; }
  .protrude--p9 { width: 110px; left: auto; right: 34px; bottom: -48px; }
  .band--live .band__media .ai-tag { top: 10px; bottom: auto; }
  .logo__plate { width: 88px; height: 88px; padding: 10px; }
  .rev { grid-template-columns: minmax(0, 1fr); grid-template-areas: "award" "intro" "list"; }
  .feats { grid-template-columns: minmax(0, 1fr); }
  .vip { padding: 26px 20px 22px; }
  .protrude--p6 { width: 116px; right: 10px; top: -64px; }
  .band--rail .pcard { width: min(80vw, 300px); }
  .visit { padding: 10px; }
  .protrude--p8 { width: 120px; bottom: -48px; }
  .learn { padding: 22px 16px; }
}
@media (max-width: 380px) { .hero__cta { grid-template-columns: 1fr; } }
@media (max-width: 360px) { .postcard__mark { right: -2px; } .postcard__tape--b { right: -8px; } }
@media (max-width: 700px) {
  .band--home .band__media { bottom: auto; height: var(--ph-h, 240px); -webkit-mask-image: linear-gradient(180deg, var(--c-black) calc(100% - 120px), transparent); mask-image: linear-gradient(180deg, var(--c-black) calc(100% - 120px), transparent); }
  .band--reviews .band__media { --ph-h: 370px; }
  .band--visit .band__media { --ph-h: 310px; }
  .band--loop .band__media { --ph-h: 185px; }
  .band--home .band__media .ai-tag { top: 10px; bottom: auto; }
  .band--reviews { background: var(--harbour-2); }
  .band--offers .ocard, .band--live .live, .band--rail .pcard, .band--reviews .glass, .band--visit .visit { -webkit-backdrop-filter: none; backdrop-filter: none; }
  .band--live:not(.band--loop) .live, .band--rail .pcard, .band--reviews .review { background: var(--c-white); }
  .band--offers .ocard, .band--loop .live, .band--reviews .glass--smoke, .band--visit .visit { background: linear-gradient(150deg, var(--c-012637-a95), var(--c-harbour-2-a93)); }
}
@media (prefers-reduced-motion: reduce) { .seam::after { display: none; } .band__media--loop .loop__video { display: none; } }
@media print { .band__media--loop video { display: none; } .seam::after { display: none; } }
.band--g-white { background: var(--c-white); }
.band--g-foam { background: var(--foam); }
.band--g-sky { background: var(--tint); }
.band--deep { color: var(--c-white); background: var(--harbour-2); }
.band--deep .h-sec { color: var(--c-white); }
.band--deep .grad { color: var(--sky); }
.band--home { padding-block: var(--sec-pad); }
.band--cats { padding-top: var(--sec-pad); padding-bottom: var(--sec-pad); }
.gcard__t { color: var(--harbour-2); }
.promo { padding: 8px; }
.band--intro { padding-top: var(--sec-pad); }
.band--intro .band__in { grid-template-columns: minmax(0, 440px) minmax(0, 1fr); align-items: start; column-gap: 48px; }
.postcard.postcard--calm { position: relative; left: auto; right: auto; bottom: auto; translate: none; rotate: none; transform: none; grid-column: 1; width: 100%; margin: 0; padding: 10px; background: var(--c-white); border: 1px solid var(--line); border-radius: var(--r-m); box-shadow: var(--sh-soft); }
.postcard--calm .postcard__img { border-radius: 12px; }
.intro { grid-column: 2; padding: 0; }
.ocard { border-top: 3px solid var(--ocean); }
.ocard__t, .ocard__t a { color: var(--harbour-2); }
.ocard__x { color: var(--ink-2); }
.ocard__more a { color: var(--harbour); }
.band--live:not(.band--loop) { padding-bottom: var(--sec-pad); }
.band--loop::before { content: none; }
.live-split { display: grid; gap: 22px; width: min(1000px, 100%); }
.live { min-height: 0; }
.loop-frame { position: relative; aspect-ratio: 3 / 1; border-radius: var(--r-l); overflow: hidden; background: var(--harbour-2); box-shadow: var(--sh-soft); }
.loop-frame .loop__poster, .loop-frame .loop__video { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.loop-frame .loop__video { opacity: 0; transition: opacity .6s linear; }
.loop-frame .loop__video.is-playing { opacity: 1; }
.band--deep .rev__intro { padding: 0; color: var(--c-white); }
.band--deep .rev__intro a, .band--deep .feat a { color: var(--sky); }
.band--deep .feat { background: var(--c-white-a12); border: 1px solid var(--c-sky-a30); color: var(--c-white); }
.band--vip { padding-top: var(--sec-pad); }
.visit-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; width: min(1100px, 100%); align-items: stretch; }
.visit__photo { margin: 0; min-height: 100%; border-radius: var(--r-l); overflow: hidden; box-shadow: var(--sh-soft); }
.visit__img { display: block; width: 100%; height: 100%; min-height: 280px; object-fit: cover; }
.visit-split .visit { width: auto; }
@media (max-width: 1100px) {
  .band--intro .band__in { grid-template-columns: minmax(0, 360px) minmax(0, 1fr); column-gap: 32px; }
  .postcard.postcard--calm { width: 100%; }
}
@media (max-width: 900px) {
  .band--intro { padding-top: var(--sec-pad); }
  .band--intro .band__in { grid-template-columns: minmax(0, 1fr); row-gap: 24px; }
  .postcard.postcard--calm { width: min(460px, 100%); justify-self: center; translate: none; }
  .intro { grid-column: 1; }
  .visit-split { grid-template-columns: minmax(0, 1fr); }
  .visit__img { min-height: 0; aspect-ratio: 16 / 10; }
}
@media (max-width: 700px) {
  .band--cats { padding-top: var(--sec-pad); padding-bottom: var(--sec-pad); background: var(--foam); }
  .band--intro { padding-top: var(--sec-pad); }
  .postcard.postcard--calm { padding: 8px; }
  .band--offers .ocard, .band--loop .live, .band--visit .visit, .band--live:not(.band--loop) .live, .band--rail .pcard { background: var(--c-white); }
  .band--reviews { background: var(--harbour-2); }
  .loop-frame { aspect-ratio: 16 / 9; border-radius: var(--r-m); }
}
@media (prefers-reduced-motion: reduce) { .loop-frame .loop__video { display: none; } }
@media print { .loop-frame video { display: none; } }
.hero__ai { position: absolute; right: 14px; bottom: 14px; top: auto; left: auto; z-index: 2; }
@media (max-width: 700px) { .hero__ai { right: 10px; bottom: 10px; } }
.band--home.band--cats { background-image: radial-gradient(60% 90% at 0% 0%, var(--glow), transparent 62%), var(--tex-contour); background-repeat: no-repeat, repeat; background-size: auto, 480px 240px; }
.band--home.band--offers { background-image: var(--tex-tails); background-size: 160px 128px; }
.band--home.band--logos, .band--home.band--learn { background-image: var(--tex-grain); }
.band--home.band--reviews { background-image: radial-gradient(55% 80% at 100% 0%, var(--glow), transparent 60%), var(--tex-contour-sky); background-repeat: no-repeat, repeat; background-size: auto, 480px 240px; }
.band--home.band--vip { background-image: var(--tex-tails); background-size: 160px 128px; }
.band--home.band--visit { background-image: var(--tex-contour); background-size: 480px 240px; }
.band--home.band--offers::before, .band--home.band--offers + .band--home::before,
.band--home.band--reviews::before, .band--home.band--reviews + .band--home::before {
  content: ""; position: absolute; left: 0; right: 0; top: -26px; height: 28px; z-index: 1; pointer-events: none;
  background: inherit; -webkit-mask: var(--wave-mask) center / 100% 100% no-repeat; mask: var(--wave-mask) center / 100% 100% no-repeat;
}
@media print { .band--home::before { display: none; } }
.hero__video { position: absolute; left: 0; top: -9%; width: 100%; height: 118%; object-fit: cover; object-position: 50% 50%; opacity: 0; transition: opacity .8s linear; }
.hero__video.is-playing { opacity: 1; }
@media (max-width: 700px) { .hero__video { top: 0; height: 100%; object-position: 50% 0%; } }
@media (prefers-reduced-motion: reduce) { .hero__video { display: none; } }
@media print { .hero__video { display: none; } }

/* interior.css */

.ihero { position: relative; isolation: isolate; display: flex; align-items: center; min-height: clamp(340px, 34vw, 480px); padding: 32px 0 56px; }
.ihero__frame { position: absolute; z-index: 0; top: 0; right: 0; bottom: 24px; width: 56%; overflow: hidden; border-radius: var(--r-l) 0 0 var(--r-l); background: linear-gradient(135deg, var(--sky), var(--foam)); }
.ihero__frame > img, .ihero__frame > .img-missing, .ihero__frame .ai-frame { position: absolute; inset: 0; width: 100%; height: 100%; }
.ihero__frame img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; }
.ihero__frame .img-missing { min-height: 0; border: 0; border-radius: 0; }
.ihero__frame .ai-tag { top: 14px; bottom: auto; right: 14px; }
.ihero__in { position: relative; z-index: 1; }
.ihero__pane { width: min(680px, 58%); padding: 28px 34px 26px; }
.ihero--plain { min-height: 0; padding: 40px 0 32px; }
.ihero--plain .ihero__pane { width: min(920px, 100%); }   
.ihero__pane > :last-child { margin-bottom: 0; }
.ihero__pane h1, .ihero__pane .h1 { font: 900 clamp(2rem, 1.25rem + 2.2vw, 3.3rem)/1.04 var(--f-disp); font-stretch: 116%; letter-spacing: -.012em; color: var(--harbour-2); margin: 0 0 14px; }
.ihero__h1 strong { display: block; font-weight: 900; }
.ihero__h1 .t2 { display: block; margin-top: 8px; font-size: clamp(1.1rem, .9rem + .8vw, 1.6rem); font-weight: 700; font-stretch: 108%; color: var(--ink-2); line-height: 1.2; }
.ihero__pane h2, .ihero__pane h3 { font-size: var(--fs-h3); font-weight: 800; color: var(--harbour); margin: 0 0 12px; }
.ihero__pane .btn-row { margin: 16px 0 0; }
.ihero__pane .meta { margin: 0 0 8px; color: var(--ink-2); }
.ihero__pane .event-field { margin: 0 0 10px; font-size: var(--fs-1); color: var(--ink-2); }
.ihero__pane .event-field.h1 { font-size: clamp(2rem, 1.25rem + 2.2vw, 3.3rem); color: var(--harbour-2); }
.ihero__crumbs p { margin: 0 0 12px; }
.crumbs p { margin: 0 0 12px; font-size: var(--fs-1); color: var(--ink-2); }
.crumbs a { color: var(--harbour); font-weight: 600; }
.crumbs__sep { color: var(--ink-3); }
.protrude--ihero { right: 5%; bottom: calc(24px - var(--below, 60px)); width: var(--w, 200px); rotate: -8deg; }
.protrude--post { --w: 220px; --below: 60px; }
.protrude--event { --w: 200px; --below: 56px; rotate: 10deg; }
.protrude--list { --w: 180px; --below: 64px; }
.protrude--page { --w: 190px; --below: 66px; rotate: 14deg; }
.protrude--gloss { --w: 220px; --below: 60px; }
.protrude--town { --w: 150px; --below: 70px; rotate: 4deg; }
@media (max-width: 1100px) { .protrude--ihero { --w: 160px; --below: 52px; } .protrude--town { --w: 130px; --below: 60px; } }
.iprose { padding-block: var(--sec-pad); }
.iprose .band__pattern { background-color: var(--sky); opacity: .45; }
.iprose__col { position: relative; z-index: 1; max-width: 920px; padding: 36px 44px; background: var(--c-white-a95); border: 1px solid var(--c-white-a90); border-radius: var(--r-l); box-shadow: inset 0 1px 0 var(--c-white), var(--sh-2); }
.iprose__sec { padding: 0; }
.iprose__sec + .iprose__sec { margin-top: 28px; }
.iprose__col p, .iprose__col li, .iprose__col .rich > *, .iprose__col h2, .iprose__col h3, .iprose__col h4, .iprose__col h5, .iprose__col h6 { max-width: 70ch; }
.iprose__col h2 { font-size: clamp(1.6rem, 1.1rem + 1.4vw, 2.3rem); margin-top: 8px; }
.iprose__col h3 { margin-top: 8px; }
.iprose__col a:not(.btn) { color: var(--harbour); font-weight: 600; }
.iprose__col a:not(.btn):hover { color: var(--harbour-2); text-decoration-thickness: 2px; text-decoration-color: var(--ocean); }
.iprose__col a:not(.btn):focus-visible { color: var(--harbour-2); text-decoration-thickness: 2px; text-decoration-color: var(--ocean); }
.iprose__col .media img, .iprose__col .rich img { border-radius: var(--r-s); }
.iprose__col > :last-child, .iprose__sec > :last-child { margin-bottom: 0; }
.iposts { padding-block: var(--sec-pad); }
.iposts .h-sec, .iposts h2, .iposts h3:not(.post-card__title) { color: var(--harbour-2); }
.ilisting { padding-block: 24px var(--sec-pad); }
.ical__col h3 { font-size: var(--fs-h3); margin: 0 0 12px; }
.event-list ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; }
.event-list li { max-width: none; }
.event-list li:not(:first-child) { padding: 18px 20px; border-radius: var(--r-m); background: var(--foam); border: 1px solid var(--c-harbour-a14); }
.event-list img { max-width: 220px; margin: 8px 0; }
.event-list h4 { font-size: var(--fs-h3); margin: 8px 0; }
.popup { width: min(92vw, 640px); max-height: 86vh; overflow: auto; padding: 22px; border: 0; }
.popup::backdrop { background: var(--c-01283a-a55); }
.popup img { border-radius: var(--r-m); }
.popup__close { text-align: right; margin: 12px 0 0; }
.i404 { min-height: calc(100svh - var(--hdr-h) - 120px); display: flex; align-items: center; }
.i404 .band__in { width: 100%; }
.i404__in { position: relative; max-width: 760px; margin: 0 auto; padding-top: 90px; }
.i404__pane { padding: 48px 40px 36px; }
.i404__pane h1 { color: var(--c-white); font-size: clamp(2.2rem, 1.4rem + 2.6vw, 3.6rem); }
.i404__pane p { color: var(--c-e2f2f9); font-size: var(--fs-3); }
.i404__cta { display: flex; flex-wrap: wrap; gap: 12px; margin: 24px 0 0; }
.i404__pane .btn--sky, .i404__pane .btn--sky:hover, .i404__pane .btn--sky:focus-visible { color: var(--harbour-2); }
.btn--on-dark, .i404__pane .btn--on-dark { color: var(--c-white); border-color: var(--c-white-a70); }
@media (hover: hover) { .btn--on-dark:hover { color: var(--c-white); background: var(--c-white-a12); border-color: var(--c-white); } }
.btn--on-dark:focus-visible { color: var(--c-white); background: var(--c-white-a12); border-color: var(--c-white); }
.protrude--i404 { right: 4%; top: 22px; width: 300px; z-index: 2; }
@media (max-width: 900px) {
  .ihero { display: block; min-height: 0; padding: 0 0 28px; }
  .ihero__frame { position: relative; inset: auto; width: 100%; aspect-ratio: 4 / 3; max-height: min(62vh, 520px); border-radius: 0; }
  .ihero__pane { width: 100%; margin-top: -40px; padding: 22px 22px 20px; }
  .ihero--plain { padding-top: 28px; }
  .ihero--plain .ihero__pane { margin-top: 0; }
  .protrude--ihero { display: none; }
}
@media (max-width: 700px) {
  .ihero__pane { padding: 20px 18px 18px; border-radius: var(--r-m); }
  .iprose__col { padding: 24px 18px; border-radius: var(--r-m); }
  .i404__in { padding-top: 70px; }
  .i404__pane { padding: 48px 20px 28px; }
  .protrude--i404 { width: 220px; top: 23px; right: 2%; }
}
@media print {
  .ihero__frame, .iprose .band__pattern { display: none; }
  .ihero__pane, .iprose__col { width: 100%; box-shadow: none; }
}
.iprose { background: var(--foam); }
.iposts--calm { background: var(--c-white); }
.i404__pane--calm { border-radius: var(--r-l); background: var(--c-white-a12); border: 1px solid var(--c-sky-a30); }
.iprose { background-image: var(--tex-contour); background-size: 480px 240px; }

/* blocks.css */

.rich > :last-child { margin-bottom: 0; }
.rich img { border-radius: var(--r-s); }
.rich table { border-collapse: collapse; width: 100%; display: block; overflow-x: auto; }
.rich td, .rich th { border: 1px solid var(--c-harbour-a18); padding: 6px 10px; text-align: left; }
.rich ul, .rich ol { padding-left: 1.3em; }
.rich blockquote { margin: 0 0 var(--sp-4); padding: 4px 0 4px 18px; border-left: 3px solid var(--ocean); color: var(--ink-2); }
.heading-as { font: 800 var(--fs-3)/1.3 var(--f-disp); color: var(--harbour-2); }
.media { margin: 0 0 var(--sp-4); }
.media img { border-radius: var(--r-m); }
.media figcaption { font-size: var(--fs-0); color: var(--ink-3); margin-top: 6px; }
.media .stars { margin-top: 6px; }
.btn-row { margin: var(--sp-4) 0; }
.divider { font-weight: 600; }
hr { border: 0; height: 1px; background: var(--c-harbour-a16); margin: var(--sp-5) 0; }
.icon-link a { font-weight: 600; }
.comments p { color: var(--ink-3); }
.gallery { list-style: none; padding: 0; margin: 0 0 var(--sp-5); display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.gallery li { max-width: none; }
.gallery a, .gallery li > img, .gallery li > .img-missing { display: block; border-radius: var(--r-m); overflow: hidden; text-decoration: none; background: var(--c-white); box-shadow: var(--sh-1); transition: transform .45s var(--ease), box-shadow .45s var(--ease); }
.gallery img { width: 100%; height: auto; border-radius: 0; }
.gallery__title, .gallery__caption { display: block; padding: 8px 12px 10px; font-weight: 700; color: var(--harbour); }
.gallery__caption { padding-top: 0; font-weight: 400; font-size: var(--fs-1); color: var(--ink-2); }
@media (hover: hover) { .gallery a:hover { transform: translateY(-3px); box-shadow: var(--sh-2); } }
.gallery a:focus-visible { transform: translateY(-3px); box-shadow: var(--sh-2); }
.slides { position: relative; margin: 0 0 var(--sp-5); }
.slides__track { list-style: none; margin: 0; padding: 4px 2px 12px; display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.slides--rail .slides__track { grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: minmax(240px, 32%); overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: thin; }
.slides--rail .slide { scroll-snap-align: start; }
.slide { max-width: none; }
.slide img { border-radius: var(--r-m); }
.slides__nav { display: flex; justify-content: flex-end; gap: 8px; margin: 4px 0 0; }
.rail-btn { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--c-harbour-a30); background: var(--c-white); color: var(--harbour); box-shadow: var(--sh-1); transition: transform .45s var(--ease), background .2s; }
.rail-btn[aria-disabled="true"] { opacity: .45; cursor: default; }
.ico--flip { transform: scaleX(-1); }
@media (hover: hover) { .rail-btn:hover { background: var(--sky); transform: translateY(-2px); } }
.rail-btn:focus-visible { background: var(--sky); transform: translateY(-2px); }
html:not(.js) .slides__nav { display: none; }
@media (max-width: 700px) { .slides--rail .slides__track { grid-auto-columns: 80%; } }
.posts { list-style: none; padding: 0; margin: 0 0 var(--sp-5); display: grid; gap: 22px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.post-card { display: flex; flex-direction: column; overflow: hidden; padding: 0; border-radius: var(--r-m); transition: transform .45s var(--ease), box-shadow .45s var(--ease); max-width: none; }
.post-card.card { box-shadow: var(--sh-2); }
.post-card__media { aspect-ratio: 16 / 9; overflow: hidden; border-radius: 16px; margin: 10px 10px 0; background: var(--sky); }
.post-card__media img, .post-card__media .img-missing { width: 100%; height: 100%; object-fit: cover; border-radius: 0; transition: scale .8s var(--ease); }
.post-card__body { padding: 14px 18px 18px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.post-card__body > * { margin: 0; }
.post-card__meta { font-size: var(--fs-0); color: var(--ink-2); font-weight: 600; }
.post-card__title { font-size: var(--fs-h3); line-height: 1.15; }
.post-card__title a { color: var(--harbour-2); text-decoration: none; }
.post-card .excerpt { color: var(--ink-2); line-height: 1.6; max-height: 4.8em; overflow: hidden; }
.post-card .more { margin-top: auto; padding-top: 4px; font-weight: 700; }
.post-card .more a { color: var(--harbour); }
@media (hover: hover) { .post-card:hover { transform: translateY(-6px); box-shadow: var(--sh-3); } .post-card:hover .post-card__media img { scale: 1.05; } }
.post-card:focus-within { transform: translateY(-6px); box-shadow: var(--sh-3); }
.post-card:focus-within .post-card__media img { scale: 1.05; }
.post-card--noimg .post-card__body { padding-top: 20px; }
.pagination { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; margin: 0 0 var(--sp-5); font-weight: 600; }
.pagination a, .pagination span { display: inline-grid; place-items: center; min-width: 40px; min-height: 40px; padding: 0 10px; border-radius: var(--r-pill); background: var(--c-white); border: 1px solid var(--c-harbour-a18); text-decoration: none; }
.pagination span { background: var(--harbour); color: var(--c-white); border-color: var(--harbour); }
@media (max-width: 1100px) { .posts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .posts { grid-template-columns: 1fr; } }
.faq { margin: 0 0 var(--sp-5); border-radius: var(--r-m); background: var(--c-white); border: 1px solid var(--c-harbour-a14); overflow: hidden; max-width: none; }
.faq__item + .faq__item { border-top: 1px solid var(--c-harbour-a14); }
.faq__q { margin: 0; max-width: none; }
.faq__btn { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 16px; min-height: 52px; padding: 12px 18px; border: 0; background: transparent; text-align: left; font: 700 var(--fs-2)/1.35 var(--f-text); color: var(--harbour-2); border-radius: 0; transition: background .2s, color .2s; }
.faq__ico { position: relative; flex: none; width: 22px; height: 22px; border-radius: 50%; background: var(--sky); transition: transform .3s var(--ease); }
.faq__ico::before, .faq__ico::after { content: ""; position: absolute; left: 6px; right: 6px; top: 10px; height: 2px; border-radius: 2px; background: var(--harbour); }
.faq__ico::after { transform: rotate(90deg); }
.faq__item.is-open .faq__ico { transform: rotate(135deg); }
@media (hover: hover) { .faq__btn:hover { background: var(--c-sky-a55); color: var(--harbour); } }
.faq__btn:focus-visible { background: var(--c-sky-a55); color: var(--harbour); outline-offset: -3px; border-radius: 6px; }
.faq__panel { display: grid; grid-template-rows: 1fr; }
.js .faq__panel { grid-template-rows: 0fr; visibility: hidden; transition: grid-template-rows .35s var(--ease), visibility .35s; }
.js .faq__item.is-open .faq__panel { grid-template-rows: 1fr; visibility: visible; }
.faq__a { min-height: 0; overflow: hidden; padding: 0 18px; }
.faq__a > :first-child { margin-top: 4px; }
.faq__a > :last-child { margin-bottom: 16px; }
.faq__a h4, .faq__a h5, .faq__a h6 { font-size: var(--fs-2); }
.reviews { margin: 0 0 var(--sp-5); max-width: none; }
.reviews__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.review { display: grid; grid-template-columns: 40px 1fr; gap: 4px 12px; align-content: start; padding: 18px; border-radius: var(--r-m); background: var(--foam); border: 1px solid var(--c-harbour-a14); max-width: none; }
.review__avatar { grid-column: 1; grid-row: 1; width: 40px; height: 40px; border-radius: 50%; background: var(--sky); display: grid; place-items: center; }
.review__who { grid-column: 2; grid-row: 1; }
.review__avatar::before { content: attr(data-initials); font: 800 15px/1 var(--f-disp); color: var(--harbour-2); }
.review__who > p { margin: 0; }
.review__author { font-weight: 700; color: var(--harbour-2); }
.review__time { font-size: var(--fs-0); color: var(--ink-2); }
.review__rating { display: flex; align-items: center; gap: 2px; font-size: var(--fs-1); color: var(--ink-2); }
.review__body { grid-column: 1 / -1; margin-top: 6px; }
.review__text { margin: 0 0 6px !important; }
.review__body.is-clamped { max-height: 9.6em; overflow: hidden; }
.review__more { grid-column: 1 / -1; justify-self: start; min-height: 24px; padding: 2px 0; border: 0; background: none; color: var(--harbour); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.reviews-badge { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin: 0 0 var(--sp-4); padding: 12px 18px; border-radius: var(--r-m); background: var(--c-white); border: 1px solid var(--c-harbour-a14); width: fit-content; max-width: 100%; }
.reviews-badge img { width: auto; height: 28px; }
.reviews-badge .review__rating { margin: 0; font-weight: 700; color: var(--harbour-2); gap: 6px; }
.reviews-badge .snapshot { margin: 0; }
.snapshot { margin-top: 8px; }
.hours-list { list-style: none; padding: 0; }
.hours-list .day { font-weight: 700; }
.meta { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: var(--fs-1); color: var(--ink-2); }
.timeline { list-style: none; padding: 0 0 0 22px; border-left: 2px solid var(--sky); }
.timeline > li { position: relative; margin: 0 0 var(--sp-5); }
.timeline > li::before { content: ""; position: absolute; left: -29px; top: 6px; width: 12px; height: 12px; border-radius: 50%; background: var(--ocean); box-shadow: 0 0 0 3px var(--c-white); }
.timeline .meta { font-weight: 700; color: var(--harbour); }
.hotspot ul { list-style: none; padding: 0; }
.hotspot details { margin: 4px 0; padding: 8px 12px; border-radius: var(--r-s); background: var(--foam); }
.hotspot summary { cursor: pointer; font-weight: 700; color: var(--harbour); }
.sitemap ul { columns: 2 260px; padding-left: 1.1em; }
.sitemap li { break-inside: avoid; }
.postnav { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin: var(--sp-5) 0 0; }
.postnav a { display: inline-flex; flex-direction: column; max-width: 46%; padding: 12px 16px; border-radius: var(--r-m); background: var(--foam); border: 1px solid var(--c-harbour-a14); text-decoration: none; font-weight: 700; color: var(--harbour); }
.postnav a[rel="next"] { margin-left: auto; text-align: right; }
.event-field { margin: 0 0 var(--sp-3); }
nav.event-field p { margin: 0; }
.block-nav ul { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 16px; }
.nav-toggle { display: none; }
.social { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.social__icon { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid currentColor; }
.search-form { display: flex; flex-wrap: wrap; gap: 8px; }
.cta { padding: 20px; margin: 0 0 16px; border-radius: var(--r-m); }
.cta__title { font: 800 var(--fs-h3)/1.15 var(--f-disp); color: var(--harbour-2); }
.cta__link { text-decoration: none; color: inherit; }
.cta img { border-radius: var(--r-s); margin-bottom: 10px; }
.map-facade { position: relative; display: grid; place-items: center; min-height: 320px; margin: 0 0 var(--sp-5); border-radius: var(--r-m); overflow: hidden; background: radial-gradient(60% 80% at 30% 30%, var(--c-ocean-a28), var(--c-ocean-a00) 70%), linear-gradient(135deg, var(--sky), var(--foam)); border: 1px solid var(--c-harbour-a15); max-width: none; }
.map-facade iframe { width: 100%; min-height: 320px; height: 100%; border: 0; align-self: stretch; justify-self: stretch; }
iframe { max-width: 100%; border: 0; }
.embed-missing { min-height: 120px; border-radius: var(--r-m); background: repeating-linear-gradient(45deg, var(--c-eef6f9), var(--c-eef6f9) 8px, var(--c-e3eef3) 8px, var(--c-e3eef3) 16px); }
.html-block { margin: 0 0 var(--sp-4); }
.html-block .line { margin: 0 0 10px; }
.html-block label { display: block; font-weight: 600; font-size: var(--fs-1); margin-bottom: 4px; }
.calc-open { margin: 0 0 var(--sp-4); }
.calc { width: min(94vw, 560px); max-height: 90vh; padding: 0; border: 0; border-radius: var(--r-l); background: var(--c-white); color: var(--ink); box-shadow: var(--sh-3); overflow: auto; }
.calc::backdrop { background: var(--c-01283a-a60); }
.calc__in { padding: 22px 26px 24px; }
.calc__x { margin: 0; display: flex; justify-content: flex-end; }
.calc__close { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--c-harbour-a30); background: var(--c-white); color: var(--harbour); font: 800 var(--fs-3)/1 var(--f-text); }
@media (hover: hover) { .calc__close:hover { background: var(--sky); } }
.calc__close:focus-visible { background: var(--sky); }
.calc h5 { font-size: var(--fs-h3); margin: 0 0 6px; }
.calc h6 { font: 400 var(--fs-1)/1.45 var(--f-text); color: var(--ink-2); margin: 0 0 16px; }
.calc .line { display: grid; gap: 4px; }
.calc input, .calc select { width: 100%; min-height: 48px; padding: 10px 14px; border-radius: var(--r-s); border: 1px solid var(--c-harbour-a25); background: var(--c-white); font-size: 16px; }
@media (hover: hover) { .calc input:hover, .calc select:hover { border-color: var(--harbour); } }
.calc input:focus-visible, .calc select:focus-visible { border-color: var(--harbour); }
.calc .line:has(> button) { display: inline-flex; margin-right: 8px; }
.calc__out { margin: 8px 0 0; }
.calc__msg { margin: 0 0 6px; font-weight: 700; color: var(--signal-ink); }
.calc__msg:empty { display: none; }
.calc__msg--error { color: var(--c-b3261e); }
.jumpbar { margin: 0 0 var(--sp-4); }
.jumpbar p { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; max-width: none; }
.jumpbar br { display: none; }
.jumpbar a { display: inline-grid; place-items: center; min-width: 40px; min-height: 40px; padding: 0 8px; border-radius: var(--r-s); background: var(--c-white); border: 1px solid var(--c-harbour-a18); color: var(--harbour); font-weight: 700; text-decoration: none; }
@media (hover: hover) { .jumpbar a:hover { background: var(--sky); color: var(--harbour-2); } }
.jumpbar a:focus-visible { background: var(--sky); color: var(--harbour-2); }
@media (max-width: 700px) {
  .iprose__sec:has(> .jumpbar) { position: sticky; top: calc(var(--hdr-h) + 6px); z-index: 4; }
  .jumpbar { padding: 8px; border-radius: var(--r-m); background: var(--c-white-a97); border: 1px solid var(--c-harbour-a14); box-shadow: var(--sh-2); }
  .jumpbar p { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
}
.iprose__col [id] { scroll-margin-top: calc(var(--hdr-h) + 24px); }
@media (max-width: 700px) { .iprose__col:has(.jumpbar) [id] { scroll-margin-top: calc(var(--hdr-h) + 84px); } }

/* forms.css */

.form { margin: 0 0 var(--sp-5); max-width: 640px; }
.form fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.form__intro { color: var(--ink-2); }
.form__row { margin: 0 0 14px; }
.form__row label, .form__choice legend { display: block; font: 600 var(--fs-1)/1.4 var(--f-text); color: var(--ink); margin-bottom: 6px; }
.form input:not([type="checkbox"]):not([type="radio"]), .form select, .form textarea, .html-block input, .html-block select, .html-block textarea {
  width: 100%; max-width: 560px; min-height: 48px; padding: 10px 14px; border-radius: var(--r-s); border: 1px solid var(--c-harbour-a25); background: var(--c-white); font-size: 16px; color: var(--ink);
  transition: border-color .2s;
}
.form textarea { min-height: 120px; resize: vertical; }
.form input::placeholder, .form textarea::placeholder { color: var(--ink-3); opacity: 1; }
@media (hover: hover) { .form input:hover, .form select:hover, .form textarea:hover { border-color: var(--harbour); } }
.form input:focus-visible, .form select:focus-visible, .form textarea:focus-visible { border-color: var(--harbour); }
.form [aria-invalid="true"], .form .is-invalid { border: 2px solid var(--c-b3261e); }
.form fieldset[disabled] { opacity: 1; }
.form fieldset[disabled] input, .form fieldset[disabled] select, .form fieldset[disabled] textarea, .html-block input:disabled, .html-block select:disabled, .html-block textarea:disabled { background: var(--mist); color: var(--ink-2); cursor: not-allowed; }
.form fieldset[disabled] .btn { opacity: .55; cursor: not-allowed; }
.form__choice { border: 0; padding: 0; margin: 0 0 14px; }
.form__choice p { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; }
.form__choice input { width: 20px; height: 20px; accent-color: var(--harbour); }
.form__choice label { font-weight: 400; margin: 0; }

/* shop.css */

.shero { position: relative; isolation: isolate; z-index: 2; padding: 28px 0 64px;
  background: radial-gradient(30% 50% at 12% 20%, var(--c-sky-a95), var(--c-sky-a00) 70%), radial-gradient(26% 46% at 30% 90%, var(--c-ocean-a20), var(--c-ocean-a00) 70%), var(--foam); }
.shero__in { position: relative; z-index: 1; }
.shero__pane { width: min(680px, 62%); padding: 26px 34px 28px; }
.shero__crumbs p { margin: 0 0 10px; }
.shop-h1 { margin: 0 0 14px; font-family: var(--f-disp); color: var(--harbour-2); line-height: 1.02; }
.h1__main { display: block; font-size: clamp(2.1rem, 1.2rem + 2.4vw, 3.4rem); font-weight: 900; font-stretch: 118%; letter-spacing: -.01em; }
.h1__sub { display: block; margin-top: 8px; font-size: clamp(1.1rem, .9rem + .8vw, 1.5rem); font-weight: 700; font-stretch: 108%; color: var(--ink-2); letter-spacing: 0; }
.shero__pane .rich { max-width: 64ch; }
.subs { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.subs .pill { display: inline-flex; align-items: center; min-height: 36px; text-decoration: none; transition: transform .45s var(--ease), background-color .3s var(--ease); }
@media (hover: hover) { .subs .pill:hover { background: var(--sky); transform: translateY(-1px); } }
.subs .pill:focus-visible { background: var(--sky); transform: translateY(-1px); }
.shero--cat { min-height: 440px; }
.shero__frame { position: absolute; right: 0; top: 0; bottom: 36px; width: 46%; z-index: 0; }
.shero__photo { position: absolute; inset: 0; overflow: hidden; border-radius: var(--r-l) 0 0 var(--r-l); background: var(--sky); }
.shero__layer { position: absolute; left: 0; right: 0; top: -6%; bottom: -6%; }
.shero__ai, .shero__layer > img, .shero__layer > .img-missing { position: absolute; inset: 0; width: 100%; height: 100%; }
.shero__img, .shero__ai > img { width: 100%; height: 100%; object-fit: cover; display: block; }
.shero__photo .ai-tag { bottom: 14%; }
.shero--cat .shero__pane { margin-top: 26px; width: min(800px, 66%); padding-right: 150px; }
.protrude--cat { width: clamp(150px, 15vw, 230px); left: 46%; bottom: -62px; rotate: -12deg; }
.shero--band { min-height: 300px; padding: 40px 0 56px; }
.shero__band { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.shero__band .band__layer { top: -8%; bottom: -8%; }
.shero__band img, .shero__band .img-missing { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.shero--band::after { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(90deg, var(--c-foam-a30), var(--c-foam-a00) 60%); }
.shero--band .shero__pane { width: fit-content; min-width: min(460px, 100%); max-width: min(860px, 100%); }
.page-top { padding-top: 20px; }
.shop-copy { position: relative; isolation: isolate; }
.shop-copy__pane { max-width: 900px; padding: 28px 36px; }
.shop-copy__sec + .shop-copy__sec { margin-top: var(--sp-5); }
.shop-copy__pane .slides { display: grid; gap: 12px; }
.shop-copy__pane .media img, .shop-copy__pane .slides img { border-radius: var(--r-s); }
.shop-live { color: var(--c-white); }
.shop-live .band__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.shop-live .band__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, var(--c-01283a-a25), var(--c-01283a-a45)); }
.shop-live__sec, .shop-live__sec .listing { position: relative; }
.shop-live__sec h2, .shop-live__sec h3, .shop-live__sec p { color: var(--c-white); }
.live-panel { max-width: 1000px; min-height: 220px; margin-inline: auto; padding: 36px 40px; display: grid; align-content: center; justify-items: center; gap: 14px; text-align: center; }
.live-panel__h { margin: 0; font: 800 var(--fs-h3)/1.15 var(--f-disp); font-stretch: 110%; }
.live-panel__actions p { margin: 0; }
.live-panel__actions { margin: 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px 22px; }
.live-panel__menu { font-weight: 600; text-underline-offset: 3px; }
.live-panel--card { background: var(--c-white); border-radius: var(--r-l); box-shadow: var(--sh-2); color: var(--ink); min-height: 0; padding: 28px 32px; }
.live-panel--card .live-panel__menu { color: var(--harbour); }
.glass--smoke .live-panel__menu { color: var(--sky); }
@media (hover: hover) { .glass--smoke .live-panel__menu:hover { color: var(--c-white); } }
.glass--smoke .live-panel__menu:focus-visible { color: var(--c-white); }
.shop-grid { position: relative; isolation: isolate; }
.listing--grid { position: relative; }
.plist { position: relative; }
.fbar { position: sticky; top: calc(var(--hdr-h) + 8px); z-index: 5; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; min-height: 56px; padding: 8px 14px; margin-bottom: 22px; border-radius: 20px; background: var(--c-white-a92); border: 1px solid var(--c-white-a95); box-shadow: var(--sh-1); }
.fbar.is-stuck::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; -webkit-backdrop-filter: blur(18px) saturate(160%); backdrop-filter: blur(18px) saturate(160%); }
.fbar.is-stuck { background: var(--c-white-a78); }
.fbar__open-row { display: none; margin: 0; }
.fbar__veil { display: none; }
.fbar__sheet { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; flex: 1 1 auto; }
.fbar__facets { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.facet { position: relative; }
.facet__btn { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 8px 14px; border-radius: var(--r-pill); border: 1px solid var(--c-harbour-a25); background: var(--c-white); color: var(--ink); font: 600 var(--fs-1)/1 var(--f-text); cursor: pointer; transition: background-color .3s var(--ease); }
@media (hover: hover) { .facet__btn:hover { background: var(--sky); } }
.facet__btn:focus-visible { background: var(--sky); }
.facet__chev { width: 16px; height: 16px; transition: transform .3s var(--ease); }
.facet__btn[aria-expanded="true"] .facet__chev { transform: rotate(180deg); }
.facet__panel { position: absolute; left: 0; top: calc(100% + 8px); z-index: 6; min-width: 240px; max-height: min(360px, 60vh); overflow: auto; padding: 10px 12px; border-radius: var(--r-m); background: var(--c-white); box-shadow: var(--sh-3); border: 1px solid var(--c-harbour-a14); }
.facet__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.facet__list label { display: flex; align-items: baseline; gap: 8px; min-height: 32px; padding: 6px 6px; border-radius: 8px; cursor: pointer; font-size: var(--fs-1); color: var(--ink); }
@media (hover: hover) { .facet__list label:hover { background: var(--c-ocean-a10); } }
.facet__list label:focus-within { background: var(--c-ocean-a10); }
.facet__list input { width: 18px; height: 18px; accent-color: var(--harbour); flex: none; translate: 0 3px; }
.facet__list .chip-note { font-size: var(--fs-0); color: var(--ink-3); }
.fbar__sort { margin: 0; }
.fbar__sort select { min-height: 40px; padding: 6px 12px; border-radius: var(--r-s); border: 1px solid var(--c-harbour-a25); background: var(--c-white); font: 500 var(--fs-1) var(--f-text); color: var(--ink); }
@media (hover: hover) { .fbar__sort select:hover { border-color: var(--harbour); } }
.fbar__sort select:focus-visible { border-color: var(--harbour); }
.fbar__actions { display: flex; gap: 8px; margin: 0 0 0 auto; }
.fbar__apply { display: none; }
.fbar__active { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; width: 100%; }
.fbar__active:empty { display: none; }
.fbar__active button { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 4px 12px; border-radius: var(--r-pill); border: 1px solid var(--c-harbour-a25); background: var(--sky); color: var(--harbour-2); font: 600 var(--fs-0)/1.2 var(--f-text); cursor: pointer; }
.fbar__active .ico { width: 14px; height: 14px; }
.pgrid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 18px; }
.bcard { position: relative; display: flex; flex-direction: column; gap: 6px; min-height: 150px; padding: 18px 18px 40px; border-radius: var(--r-m); box-shadow: var(--sh-2); overflow: hidden;
  background: radial-gradient(140px 100px at 100% 0, var(--c-sky-a95), var(--c-sky-a00) 72%), var(--c-white); transition: transform .45s var(--ease), box-shadow .45s var(--ease); }
.bcard[hidden] { display: none; }
.bcard__brand { margin: 0; font: 800 var(--fs-0)/1.3 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--harbour); }   
.bcard__brand a { color: var(--harbour); }
.bcard__flag { margin: 0; font-size: var(--fs-0); color: var(--ink-3); }
.bcard__name { margin: 0; font: 800 1.1rem/1.25 var(--f-disp); font-stretch: 104%; color: var(--harbour-2); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.bcard__link { color: inherit; text-decoration: none; }
.bcard__link::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.bcard__tail { position: absolute; right: 16px; bottom: 12px; color: var(--harbour); transition: transform .45s var(--ease); }
.bcard__tail .ico { width: 20px; height: 20px; }
@media (hover: hover) { .bcard:hover { transform: translateY(-6px); box-shadow: 0 0 0 2px var(--c-white), 0 0 0 5px var(--c-ocean-a30), var(--sh-3); } .bcard:hover .bcard__tail { transform: translateX(4px); } }
.bcard:focus-within { transform: translateY(-6px); box-shadow: 0 0 0 2px var(--c-white), 0 0 0 5px var(--c-ocean-a30), var(--sh-3); outline: 3px solid var(--harbour); outline-offset: 4px; }
.bcard:focus-within .bcard__tail { transform: translateX(4px); }
.bcard__link:focus-visible { outline: none; box-shadow: none; }
.pgrid__empty { margin: 18px 0 0; padding: 18px 20px; border-radius: var(--r-m); background: var(--c-white); box-shadow: var(--sh-1); font-weight: 600; }
.plist__handoff { margin: 26px 0 0; text-align: center; }
.pdp { position: relative; isolation: isolate; padding: 64px 0 40px;
  background: radial-gradient(24% 40% at 66% 30%, var(--c-ocean-a22), var(--c-ocean-a00) 70%), radial-gradient(22% 36% at 92% 70%, var(--c-signal-a12), var(--c-signal-a00) 70%), radial-gradient(22% 34% at 82% 6%, var(--c-sky-a95), var(--c-sky-a00) 70%), var(--foam); }
.pdp__bg { position: absolute; left: 0; top: 0; bottom: 0; width: 62%; overflow: hidden; border-radius: 0 44px 44px 0; z-index: 0; }
.pdp__bg .band__layer { top: -6%; bottom: -6%; }
.pdp__bg img, .pdp__bg .img-missing { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pdp__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--c-foam-a00) 40%, var(--c-foam-a30) 80%, var(--c-foam-a60)); }
.pdp__in { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 40px; align-items: start; }
.pdp__stage { position: relative; display: grid; justify-items: start; padding: 10px 0 30px 24px; }
.lens { position: relative; width: 300px; height: 300px; border-radius: 50%; display: grid; place-items: center;
  background: radial-gradient(circle at 35% 25%, var(--c-white-a95), var(--c-white-a55) 45%, var(--c-sky-a45) 70%);
  -webkit-backdrop-filter: blur(16px) saturate(170%); backdrop-filter: blur(16px) saturate(170%);
  border: 1px solid var(--c-white-a95); box-shadow: inset 0 2px 0 var(--c-white), inset 0 -20px 40px -20px var(--c-ocean-a45), var(--sh-3); }
.lens__img { width: 166px; height: 166px; border-radius: 50%; object-fit: cover; background: var(--c-white); box-shadow: 0 0 0 8px var(--c-white-a75), 0 18px 30px -16px var(--c-01283a-a50); }
.protrude--lens { width: 230px; left: calc(100% - 77px); top: 40%; rotate: 12deg; }
.pdp__panel { position: relative; padding: 22px 30px 24px; }
.pdp__panel > .protrude { position: absolute; z-index: 3; }
.protrude--pane { width: 170px; right: 20px; top: -56px; rotate: -10deg; }
.pdp__crumbs p { margin: 0 0 8px; font-size: var(--fs-0); }
.pdp__crumbs { max-width: calc(100% - 150px); }
.pdp__brand { margin: 0 0 4px; font: 800 var(--fs-0)/1.3 var(--f-text); letter-spacing: .12em; text-transform: uppercase; }
.pdp__brand a { color: var(--harbour); text-decoration: none; }
.pdp__brand .chip-note { text-transform: none; letter-spacing: 0; font-weight: 400; }
@media (hover: hover) { .pdp__brand a:hover { text-decoration: underline; } }
.pdp__brand a:focus-visible { text-decoration: underline; }
.pdp__title { margin: 0 0 10px; font: 900 var(--fs-h2)/1.02 var(--f-disp); font-stretch: 112%; letter-spacing: -.01em; color: var(--harbour-2); }
.chips { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
.chip-item { display: inline-flex; align-items: baseline; gap: 6px; }
.chip-note { font-size: var(--fs-0); color: var(--ink-3); }
.pdp__offer { margin: 4px 0 10px; }
.pdp__price { margin: 0; display: flex; align-items: baseline; gap: 12px; }
.pdp__variant { font: 700 var(--fs-3)/1.2 var(--f-text); color: var(--ink-2); }
.pdp__amount { font: 900 2rem/1 var(--f-disp); color: var(--harbour-2); }
.pdp__asof { margin: 4px 0 6px; font-size: var(--fs-0); color: var(--ink-3); }
.pdp__stock { margin: 0; display: flex; align-items: center; gap: 8px; font-weight: 700; color: var(--signal-ink); font-size: var(--fs-1); }
.dot { width: 9px; height: 9px; border-radius: 50%; background: var(--signal); box-shadow: 0 0 0 3px var(--c-signal-a22); display: inline-block; }
.pdp__buy { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.pdp__buy .fine { margin: 0; width: 100%; }
.pdp__buy [hidden] { display: none !important; }
.pdp__reserve .ico, .pdp-sticky__btn .ico { width: 20px; height: 20px; }
.pdp__reserve.is-done::after { content: "\2713"; margin-left: 2px; }
.pdp__handoff { margin: 16px 0 0; }
.pdp--stub { padding: 56px 0 72px; min-height: 420px; }
.pdp--stub .pdp__bg { width: 100%; border-radius: 0; }
.pdp--stub .pdp__in { grid-template-columns: minmax(0, 760px); }
.pdp--stub .pdp__crumbs { max-width: none; }
.pdp-more { padding: 8px 0 56px; }
.pdp-more__pane { max-width: 900px; padding: 26px 30px; }
.pdp__desc { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--c-harbour-a15); }
.pdp__desc li { padding: 11px 0; border-bottom: 1px solid var(--c-harbour-a15); color: var(--ink); }
.pdp-sticky { position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 64px; padding: 8px 16px calc(8px + env(safe-area-inset-bottom)); border-radius: 18px 18px 0 0; }
.pdp-sticky[hidden] { display: none; }
.pdp-sticky__price { margin: 0; display: flex; align-items: baseline; gap: 8px; font-weight: 700; color: var(--ink-2); }
.pdp-sticky__price .pdp__amount { font-size: 1.4rem; }
.pdp-sticky__btn { min-height: 48px; }
@media (min-width: 701px) { .pdp-sticky { display: none !important; } }
.kind-specials-index .shop-copy__pane .posts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 16px; }
.kind-special .shero__pane .media img { border-radius: var(--r-s); width: 100%; height: auto; }
.kind-special .shero__pane h1 { margin: 6px 0 8px; font: 800 var(--fs-h3)/1.2 var(--f-disp); font-stretch: 106%; color: var(--harbour-2); }
.kind-special .shero--band .shero__pane { width: min(1160px, 100%); max-width: none; }
@media (min-width: 901px) {
  .kind-special .shero__pane { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); column-gap: 32px; align-content: start; }
  .kind-special .shero__pane > * { grid-column: 2; }
  .kind-special .shero__pane > .media { grid-column: 1; grid-row: 1 / span 8; margin: 0; align-self: start; }
}
.kind-specials-index .post-card__title { font-size: var(--fs-3); line-height: 1.3; }
.kind-special .shero__pane h5 { font: 400 var(--fs-3)/1.6 var(--f-text); color: var(--ink); margin: 0 0 10px; }
@media (max-width: 1100px) {
  .fbar { position: relative; top: auto; }
  .pdp__in { gap: 24px; }
}
@media (max-width: 1023px) {
  .protrude--lens { width: 190px; left: calc(100% - 72px); }
  .protrude--pane { width: 150px; }
}
@media (max-width: 900px) {
  .shero__pane { width: min(640px, 72%); }
  .shero--cat .shero__pane { width: min(660px, 76%); padding-right: 170px; }
  .pdp__in { grid-template-columns: 1fr; }
  .pdp__stage { justify-items: center; padding-left: 0; }
  .protrude--pane { top: -64px; }
}
@media (max-width: 700px) {
  .shero { padding: 0 0 40px; }
  .shero--cat { min-height: 0; }
  .shero__frame { position: relative; right: auto; top: auto; bottom: auto; width: 100%; aspect-ratio: 4 / 3; }
  .shero__photo { border-radius: 0; }
  .shero--cat .shero__pane { margin-top: -40px; }
  .shero__pane, .shero--band .shero__pane, .shero--cat .shero__pane { width: 100%; padding: 20px 18px 22px; }
  .shero--band { padding: 24px 0 40px; min-height: 0; }
  .protrude--cat { display: none; }   
  .shop-copy__pane { padding: 20px 18px; }
  .live-panel { padding: 26px 18px; min-height: 0; }
  .fbar { padding: 8px 10px; }
  .fbar__open-row { display: block; }
  .fbar__sheet { display: none; }
  .fbar.is-open .fbar__veil { display: block; position: fixed; inset: 0; z-index: 79; background: var(--c-01283a-a45); }
  .fbar.is-open .fbar__sheet { display: flex; flex-direction: column; align-items: stretch; position: fixed; left: 0; right: 0; bottom: 0; z-index: 80; max-height: 80vh; overflow: auto; padding: 18px 16px calc(18px + env(safe-area-inset-bottom)); border-radius: 22px 22px 0 0; background: var(--c-white); box-shadow: var(--sh-3); }
  .fbar.is-open .fbar__facets { flex-direction: column; align-items: stretch; }
  .fbar.is-open .facet__panel { position: static; box-shadow: none; border: 0; padding: 4px 0 8px; max-height: none; }
  .fbar.is-open .fbar__actions { margin: 8px 0 0; justify-content: flex-end; }
  .fbar.is-open .fbar__apply { display: inline-flex; }
  .pgrid { grid-template-columns: 1fr; }
  .pdp { padding: 24px 0 32px; }
  .pdp__bg { width: 100%; bottom: auto; height: 300px; border-radius: 0; }
  .lens { width: 240px; height: 240px; }
  .lens__img { width: 150px; height: 150px; }
  .protrude--lens { width: 100px; left: calc(100% - 47px); top: 45%; }
  .pdp__panel { padding: 22px 18px 22px; margin-top: 8px; }
  .protrude--pane { width: 120px; right: 10px; top: -70px; }
  .pdp__crumbs { max-width: calc(100% - 110px); }
  .pdp--stub { padding: 24px 0 48px; min-height: 0; }
  .pdp--stub .pdp__bg { height: 100%; }
  .pdp-more__pane { padding: 18px 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .bcard, .bcard__tail, .facet__btn, .facet__chev, .subs .pill { transition: none; }
}
@media print {
  .fbar, .pdp-sticky { display: none !important; }
}
.shop-live--calm { color: var(--ink); background: var(--tint); }
.shop-live--calm .live-panel__menu { color: var(--harbour); }
.shop-copy--calm { background: var(--foam); }
.shero--calm { background: var(--foam); }
.shero--calm::after { content: none; }
.pdp--calm, .pdp:not(.pdp--stub) { background: var(--foam); }
.live-panel.surface { min-height: 0; }
.shop-live--calm { background-image: var(--tex-tails); background-size: 160px 128px; }
.shop-copy--calm { background-image: var(--tex-contour); background-size: 480px 240px; }
.shero--calm { background-image: radial-gradient(60% 100% at 0% 0%, var(--glow), transparent 62%); }
.pdp--calm, .pdp:not(.pdp--stub) { background-image: radial-gradient(55% 90% at 0% 0%, var(--glow), transparent 60%), var(--tex-contour); background-repeat: no-repeat, repeat; background-size: auto, 480px 240px; }