/* Petra Sea Resort — landing pages. Brand: Noto Serif + Brandbook colours (Oxford Blue, Earth Yellow, Champagne Pink, Isabelline). */
@font-face{font-family:"Noto Serif";font-style:normal;font-weight:300;font-display:swap;src:url(fonts/noto-serif-latin-300-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Serif";font-style:normal;font-weight:300;font-display:swap;src:url(fonts/noto-serif-cyrillic-300-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Noto Serif";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/noto-serif-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Serif";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/noto-serif-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Noto Serif";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/noto-serif-latin-400-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F}
@font-face{font-family:"Noto Serif";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/noto-serif-cyrillic-400-italic.woff2) format("woff2");unicode-range:U+0400-045F}
@font-face{font-family:"Noto Serif";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/noto-serif-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Serif";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/noto-serif-cyrillic-500-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Noto Serif";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/noto-serif-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Serif";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/noto-serif-cyrillic-600-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/noto-sans-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/noto-sans-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/noto-sans-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/noto-sans-cyrillic-500-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/noto-sans-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/noto-sans-cyrillic-600-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}

/* ===== Petra Sea Resort landing pages v3 — clean, element-led. Brand: Oxford Blue, Earth Yellow, Champagne Pink, Isabelline; Noto Serif + Noto Sans. ===== */
:root{
  --oxford:#031332; --oxford-2:#0B2148; --gold:#D9AA6E; --gold-deep:#A8783E; --gold-tint:#F8EEDF;
  --champagne:#DCC8BA; --isab:#F4F0ED; --tint:#FAF7F4; --white:#fff;
  --ink:#0E1830; --muted:#5A6378; --line:#E7DFD7; --wa:#1F8E4D; --err:#B3261E; --ok:#1E7A4F;
  --serif:"Noto Serif",Georgia,"Times New Roman",serif;
  --sans:"Noto Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --wrap:1200px; --r:18px; --r-s:12px;
  --shadow:0 1px 2px rgba(3,19,50,.05),0 12px 32px -14px rgba(3,19,50,.22);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{margin:0;background:var(--white);color:var(--ink);font:400 16px/1.55 var(--sans);-webkit-font-smoothing:antialiased}
img,video{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:500;color:var(--oxford);margin:0;text-wrap:balance;letter-spacing:-.012em}
h2{font-size:clamp(28px,3.4vw,42px);line-height:1.12}
h3{font-size:19px;line-height:1.3}
p{margin:0}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--gold-deep);outline-offset:3px}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:max(18px,env(safe-area-inset-left,0px));padding-right:max(18px,env(safe-area-inset-right,0px))}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ic{flex:none;display:inline-block;vertical-align:middle}
.center{text-align:center;justify-content:center;display:flex}
.note{font-size:12.5px;color:var(--muted);margin-top:14px}

/* ---------- buttons, pills, chips ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 24px;border:0;border-radius:var(--r-s);background:var(--gold);color:var(--oxford);font:600 16px/1.2 var(--sans);text-decoration:none;cursor:pointer;transition:transform .15s,background .15s,box-shadow .15s;box-shadow:0 8px 20px -10px rgba(168,120,62,.8)}
.btn:hover{background:#E4B984;transform:translateY(-1px)}
.btn.big{min-height:58px;font-size:17px;padding:0 28px}
.btn.full{width:100%}
.btn[disabled]{opacity:.6;cursor:progress;transform:none}
.btn.ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.55);box-shadow:none}
.btn.ghost:hover{background:rgba(255,255,255,.1)}
.btn.line{background:transparent;color:var(--ink);border:1.5px solid var(--line);box-shadow:none}
.btn.wa{background:var(--wa);color:#fff;box-shadow:0 8px 20px -10px rgba(31,142,77,.8)}
.btn.wa:hover{background:#18763F}
.link{background:none;border:0;padding:0;font:inherit;color:var(--gold-deep);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.pill{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:999px;font:600 13px/1.2 var(--sans)}
.pill.gold{background:var(--gold-tint);color:var(--gold-deep)}
.pill.glass{background:rgba(3,19,50,.55);color:#fff;border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(8px)}
.pill.glass .ic{color:var(--gold)}
.hchips{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0;padding:0;list-style:none}
.hchips li{display:inline-flex;align-items:center;gap:7px;padding:9px 14px;border-radius:999px;font:600 14px/1.2 var(--sans);background:var(--gold-tint);color:var(--oxford)}
.hchips .ic{color:var(--gold-deep)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 0;padding:0;list-style:none}
.chips li{padding:8px 14px;border-radius:999px;background:var(--isab);font:500 14px/1.2 var(--sans);color:var(--ink)}
.badge{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--gold-tint);color:var(--gold-deep)}
.card{background:var(--white);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
.ticks{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:9px}
.ticks li{display:flex;gap:10px;align-items:flex-start;font-size:15px}
.ticks .ic{margin-top:3px;color:var(--ok)}

/* ---------- promo bar with countdown ---------- */
.demo-flag{position:fixed;left:12px;bottom:12px;z-index:70;margin:0;padding:6px 12px;border-radius:8px;background:#FFF3C4;color:#5A4500;font:600 11.5px/1.3 var(--sans);box-shadow:var(--shadow)}
.promo{background:var(--oxford);color:#fff}
.promo-row{display:flex;align-items:center;justify-content:space-between;gap:12px 24px;min-height:52px;padding-block:7px}
.promo p{font:500 14.5px/1.35 var(--sans)}
.promo strong{color:var(--gold);font-weight:700;margin-right:6px}
.clock{display:flex;align-items:center;gap:6px;font-variant-numeric:tabular-nums}
.clock span{display:flex;flex-direction:column;align-items:center;min-width:44px}
.clock b{font:600 22px/1 var(--sans);color:#fff}
.clock small{font:500 10.5px/1.2 var(--sans);color:var(--champagne);margin-top:3px}
.clock i{font-style:normal;color:var(--gold);font-weight:700;margin-top:-12px}
.clock.sm b{font-size:19px}
@media (max-width:640px){.promo-row{gap:8px;padding-block:6px}.promo p span{display:none}.promo p{font-size:14px}.clock.sm span{min-width:34px}.clock.sm b{font-size:16px}.clock small{font-size:9.5px}}

/* ---------- header ---------- */
.hdr{background:var(--white);border-bottom:1px solid var(--line)}
.hdr-row{display:flex;align-items:center;justify-content:space-between;gap:16px;height:70px}
.brand img{width:clamp(160px,18vw,220px);height:auto}
.hdr nav{display:flex;align-items:center;gap:10px;font:600 14.5px/1 var(--sans)}
.hdr nav a{text-decoration:none;display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border-radius:999px}
.hdr .tel{color:var(--oxford)}
.hdr .lang{border:1.5px solid var(--line)}
@media (max-width:560px){.hdr .tel{display:none}.hdr-row{height:60px}}

/* ---------- heroes ---------- */
.hero{position:relative;overflow:hidden}
.hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:clamp(28px,5vw,72px);align-items:center;padding-block:clamp(36px,6vw,72px)}
.hero h1{font-size:clamp(40px,5.4vw,68px);line-height:1.04;margin:18px 0 16px}
.hero .sub{font-size:clamp(17px,1.5vw,20px);line-height:1.5;color:var(--muted);max-width:30em}
@media (max-width:980px){.hero-grid{grid-template-columns:minmax(0,1fr)}}

/* A: render behind, glass copy, white form */
.hero-a{background:var(--oxford);color:#fff}
.hero-bg,.hero-bg img{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero-bg img{object-fit:cover;object-position:30% 50%}
.hero-a::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,19,50,.88) 0%,rgba(3,19,50,.62) 45%,rgba(3,19,50,.15) 100%);pointer-events:none}
.hero-a .hero-grid{z-index:1;min-height:min(680px,calc(100svh - 122px))}
.hero-a h1{color:#fff}
.hero-a .sub{color:#E3E7EF}
.hero-a .hchips li{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(8px)}
.hero-a .hchips .ic{color:var(--gold)}
@media (max-width:860px){
  .hero-a .hero-bg{position:relative;height:300px}
  .hero-a::after{background:linear-gradient(180deg,rgba(3,19,50,.15) 0,rgba(3,19,50,.2) 180px,var(--oxford) 300px)}
  .hero-a .hero-grid{margin-top:-120px;padding-top:0;min-height:0}
}

/* B: light, planner card */
.hero-b{background:linear-gradient(180deg,var(--tint),var(--isab))}
.hb-img{position:relative;margin:26px 0 0;max-width:480px}
.hb-img img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r);box-shadow:var(--shadow)}
.hero-side{min-width:0}
@media (max-width:980px){.hb-img{display:none}}

/* C: dark, film in a phone frame */
.hero-c{background:radial-gradient(120% 90% at 85% 10%,#13306A 0,var(--oxford) 60%);color:#fff}
.hero-c h1{color:#fff;font-size:clamp(38px,5vw,62px)}
.hero-c .sub{color:#E3E7EF}
.hero-c .hchips li{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.18)}
.hero-c .hchips .ic{color:var(--gold)}
.hero-c .hero-grid{grid-template-columns:minmax(0,1fr) minmax(260px,360px)}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.film{position:relative;margin:0;aspect-ratio:9/16;border-radius:28px;overflow:visible}
.film video,.film > img{width:100%;height:100%;object-fit:cover;border-radius:28px;box-shadow:0 0 0 6px rgba(255,255,255,.08),0 40px 80px -30px rgba(0,0,0,.7)}
.sound{position:absolute;right:14px;bottom:14px;min-height:38px;padding:0 14px;border:0;border-radius:999px;background:rgba(3,19,50,.72);color:#fff;font:600 13px/1 var(--sans);cursor:pointer;backdrop-filter:blur(6px)}
@media (max-width:980px){.hero-c .hero-grid{grid-template-columns:minmax(0,1fr)}.film{width:min(300px,72%);margin:8px auto 0}}

/* floating badges on images */
.float{position:absolute;display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border-radius:12px;background:#fff;color:var(--oxford);font:600 13.5px/1.2 var(--sans);box-shadow:0 14px 30px -12px rgba(3,19,50,.45);white-space:nowrap}
.float .ic{color:var(--gold-deep)}
.float.f1{left:-14px;top:18%}
.float.f2{right:-14px;bottom:14%}
@media (max-width:560px){.float.f1{left:8px}.float.f2{right:8px}}

/* ---------- form card ---------- */
.lead,.planner{padding:26px;color:var(--ink);position:relative;z-index:1}
.lead h2,.planner h2{font-size:23px;line-height:1.2;margin:0 0 16px;display:flex;align-items:center;gap:10px}
.planner h2 .ic{color:var(--gold-deep)}
.field{margin:0 0 10px}
.field input,.field select{width:100%;height:52px;padding:0 16px;border:1.5px solid var(--line);border-radius:var(--r-s);font:400 16px/1 var(--sans);color:var(--ink);background:var(--white);appearance:none}
.field select{background:var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%235A6378' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 16px center;color:var(--ink)}
.field select:invalid{color:var(--muted)}
.field input:focus,.field select:focus{border-color:var(--gold-deep);outline:none;box-shadow:0 0 0 4px rgba(217,170,110,.22)}
.field .hint{display:block;font:500 12.5px/1.4 var(--sans);color:var(--err)}
.field .hint:empty{display:none}
.iti{width:100%}
.segs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;border:0;margin:0 0 10px;padding:4px;background:var(--isab);border-radius:var(--r-s)}
.segs.two{grid-template-columns:1fr 1fr;margin-bottom:16px}
.seg{position:relative}
.seg input,.chip input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.seg span{display:flex;align-items:center;justify-content:center;gap:6px;min-height:42px;padding:6px 8px;border-radius:9px;font:600 14px/1.2 var(--sans);color:var(--muted);text-align:center;transition:background .15s,color .15s}
.seg input:checked+span{background:var(--white);color:var(--oxford);box-shadow:0 2px 6px rgba(3,19,50,.12)}
.seg input:focus-visible+span,.chip input:focus-visible+span{outline:2px solid var(--gold-deep);outline-offset:2px}
.seg.tall span{flex-direction:column;gap:2px;min-height:70px}
.seg.tall b{font-weight:600;color:inherit}
.seg.tall small{font:500 12px/1.2 var(--sans);color:var(--muted)}
.seg.tall .ic{color:var(--gold-deep)}
.via{border:0;margin:4px 0 12px;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.via legend{float:left;font:500 13px/1.2 var(--sans);color:var(--muted);margin:0 6px 0 0;padding:0}
.chip{position:relative}
.chip span{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:999px;border:1.5px solid var(--line);font:600 13px/1.1 var(--sans);color:var(--muted)}
.chip input:checked+span{border-color:var(--oxford);color:var(--oxford);background:var(--tint)}
.micro{text-align:center;font:500 13px/1.4 var(--sans);color:var(--muted);margin-top:10px}
.legal{font:400 11.5px/1.45 var(--sans);color:var(--muted);margin-top:8px;text-align:center}
.legal a{color:var(--muted)}
.formerr{font:500 14px/1.4 var(--sans);color:var(--err);margin-top:10px;text-align:center}
.hp{position:absolute!important;left:-9999px;height:0;overflow:hidden}
.plan-sum{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;margin:-6px 0 14px;padding:10px 12px;border-radius:10px;background:var(--gold-tint);font:600 14px/1.35 var(--sans);color:var(--oxford)}
.plan-sum .link{font-size:13px}
.done{text-align:center;padding:12px 0 4px}
.done-ic{display:inline-grid;place-items:center;width:60px;height:60px;border-radius:50%;background:#E3F3EA;color:var(--ok);margin-bottom:12px}
.done h2{justify-content:center}
.done p{color:var(--muted);margin:0 0 18px}

/* planner */
.price-l{display:flex;justify-content:space-between;align-items:baseline;font:500 13.5px/1.3 var(--sans);color:var(--muted)}
.price-l output{font:500 30px/1 var(--serif);color:var(--oxford)}
.planner input[type=range]{width:100%;margin:10px 0 14px;accent-color:var(--gold-deep);height:30px}
.pl-out{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:8px}
.pl-out li{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:var(--tint);border:1px solid var(--line)}
.pl-out i{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--gold-tint);color:var(--gold-deep)}
.pl-out span{font:600 14px/1.25 var(--sans);color:var(--ink)}
.pl-out small{display:block;font:400 12px/1.3 var(--sans);color:var(--muted)}
.pl-out b{font:500 22px/1 var(--serif);color:var(--oxford);font-variant-numeric:tabular-nums}
.pl-out .big{background:var(--oxford);border-color:var(--oxford)}
.pl-out .big span{color:#fff}.pl-out .big b{color:var(--gold);font-size:26px}
.pl-out .big i{background:rgba(217,170,110,.18);color:var(--gold)}

/* ---------- slim trust strip ---------- */
.strip{background:var(--isab);border-bottom:1px solid var(--line)}
.strip-row{list-style:none;margin:0 auto;display:flex;justify-content:space-between;gap:12px 28px;padding-block:16px}
.strip li{display:flex;align-items:center;gap:11px;min-width:0}
.sic{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--white);color:var(--gold-deep);flex:none;box-shadow:0 2px 6px rgba(3,19,50,.07)}
.strip b{display:block;font:600 16px/1.15 var(--sans);color:var(--oxford);white-space:nowrap}
.strip small{display:block;font:500 12.5px/1.25 var(--sans);color:var(--muted);white-space:nowrap}
@media (max-width:980px){.strip-row{overflow-x:auto;justify-content:flex-start;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory}.strip-row::-webkit-scrollbar{display:none}.strip li{scroll-snap-align:start}}

/* ---------- sections ---------- */
section.offer,section.fin,section.feat,section.why,section.gal,section.day,section.steps-s,section.faq-s,section.band-s,section.leadsec{padding-block:clamp(56px,7vw,96px)}
.sh{text-align:center;max-width:640px;margin:0 auto 40px;display:flex;flex-direction:column;align-items:center;gap:12px}
.sh p{color:var(--muted);font-size:17px}
.lead-p{color:var(--muted);font-size:17px;margin:12px 0 0}

/* offer: three-step payment timeline */
.offer{background:var(--white)}
.tl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr 1.5fr;gap:16px;position:relative}
.tl li{position:relative;display:flex;flex-direction:column;gap:6px;padding:26px 24px;border-radius:var(--r);background:var(--tint);border:1px solid var(--line)}
.tl .node{display:grid;place-items:center;width:50px;height:50px;border-radius:50%;background:var(--white);color:var(--gold-deep);border:1.5px solid var(--gold);margin-bottom:8px}
.tl .pct{font:500 clamp(46px,5vw,64px)/1 var(--serif);color:var(--oxford)}
.tl .k{font:700 15px/1.3 var(--sans);color:var(--oxford)}
.tl .v{font-size:15px;color:var(--muted)}
.tl li.big{background:var(--oxford);border-color:var(--oxford)}
.tl li.big .pct{color:var(--gold);font-size:clamp(64px,7vw,92px)}
.tl li.big .k{color:#fff}.tl li.big .v{color:#C9D0DD}
.tl li.big .node{background:rgba(217,170,110,.15);color:var(--gold)}
.tl li:not(:last-child)::after{content:"";position:absolute;right:-17px;top:50px;width:18px;height:2px;background:var(--gold)}
.tl-bar{display:grid;grid-template-columns:10fr 10fr 80fr;gap:4px;height:10px;margin:18px 0 30px;border-radius:999px;overflow:hidden}
.tl-bar i{background:var(--gold)}.tl-bar i:nth-child(2){background:var(--gold-deep)}.tl-bar i:nth-child(3){background:var(--oxford)}
@media (max-width:860px){.tl{grid-template-columns:1fr}.tl li{flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px 14px;padding:18px}.tl .node{margin:0}.tl .pct{font-size:40px;min-width:84px}.tl li.big .pct{font-size:48px}.tl .k{flex:1}.tl .v{flex-basis:100%}.tl li:not(:last-child)::after{display:none}}

/* finishes */
.fin{background:var(--isab)}
.fin-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:900px;margin:0 auto}
.fcard{padding:28px;display:flex;flex-direction:column;gap:10px}
.fcard .price{font:500 clamp(34px,4vw,44px)/1.05 var(--serif);color:var(--oxford)}
.fcard .price small{display:block;font:500 13px/1.3 var(--sans);color:var(--muted);margin-bottom:4px}
.fcard.alt{background:var(--oxford);border-color:var(--oxford)}
.fcard.alt h3,.fcard.alt .price{color:#fff}.fcard.alt .price small,.fcard.alt .ticks li{color:#D4DAE5}
.fcard.alt .badge{background:rgba(217,170,110,.16);color:var(--gold)}
.fcard.alt .ticks .ic{color:var(--gold)}
.fin .chips{justify-content:center}
.fin .chips li{background:var(--white)}
@media (max-width:640px){.fin-row{grid-template-columns:1fr}}

/* feature split */
.feat-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(30px,6vw,80px);align-items:center}
.feat-img{position:relative;margin:0}
.feat-img img{width:100%;height:auto;border-radius:var(--r);box-shadow:var(--shadow)}
.amen{list-style:none;margin:24px 0 28px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.amen li{display:flex;align-items:center;gap:11px;font:600 15px/1.3 var(--sans);color:var(--ink)}
.amen .sic{background:var(--gold-tint);box-shadow:none}
@media (max-width:860px){.feat-grid{grid-template-columns:1fr}.amen{grid-template-columns:1fr 1fr}}

/* why: three callout cards */
.why{background:var(--white)}
.why-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.wcard{padding:26px;display:flex;flex-direction:column;gap:8px;overflow:hidden;position:relative}
.wcard .callout{font:500 clamp(44px,4.6vw,58px)/1 var(--serif);color:var(--gold-deep);margin:14px 0 6px}
.wcard p{color:var(--muted);font-size:15px}
.w1{background:linear-gradient(180deg,#FFF8EE,#fff 60%)}.w2{background:linear-gradient(180deg,#F2F5FB,#fff 60%)}.w3{background:linear-gradient(180deg,#F1F7F3,#fff 60%)}
.w2 .badge{background:#E5EBF6;color:#294A8C}.w2 .callout{color:#294A8C}
.w3 .badge{background:#E0F0E6;color:#24704A}.w3 .callout{color:#24704A}
@media (max-width:860px){.why-row{grid-template-columns:1fr}}

/* gallery / day row */
.gal{background:var(--isab);padding-block:48px!important}
.gal-row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.day-row{grid-template-columns:repeat(5,minmax(0,1fr))}
.gal-row li{position:relative;min-width:0}
.gal-row img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:var(--r)}
.chip-on{position:absolute;left:12px;top:12px;display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:999px;background:rgba(255,255,255,.94);color:var(--oxford);font:600 12.5px/1.2 var(--sans)}
.chip-on .ic{color:var(--gold-deep)}
.day-row p{font:500 14.5px/1.4 var(--sans);color:var(--ink);margin-top:10px}
@media (max-width:980px){.gal-row{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}.gal-row::-webkit-scrollbar{display:none}.gal-row li{flex:0 0 62%;scroll-snap-align:start}}

/* steps */
.steps-s{background:var(--tint)}
.steps-row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.steps-row li{position:relative;padding:26px;display:flex;flex-direction:column;gap:10px}
.stepn{position:absolute;right:22px;top:16px;font:500 54px/1 var(--serif);color:var(--isab)}
.steps-row p{color:var(--muted);font-size:15px}
@media (max-width:860px){.steps-row{grid-template-columns:1fr}}

/* faq */
.faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:clamp(24px,4vw,56px);align-items:start}
.faq-card{padding:30px;background:var(--isab);box-shadow:none;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.faq-card p{color:var(--muted)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:18px 40px 18px 0;position:relative;font:600 16.5px/1.4 var(--sans);color:var(--oxford)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:12px;width:28px;height:28px;border-radius:50%;background:var(--isab);display:grid;place-items:center;font:500 20px/1 var(--sans);color:var(--oxford)}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:0 0 18px;color:var(--muted);max-width:38em}
@media (max-width:860px){.faq-grid{grid-template-columns:1fr}}

/* closing band */
.band{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:24px 40px;padding:clamp(28px,4vw,52px);border-radius:24px;background-size:cover;background-position:center;color:#fff}
.band h2{color:#fff;max-width:16em;margin:6px 0 18px}
.band-k{font:700 13px/1.2 var(--sans);color:var(--gold)}
.band .clock{gap:8px}
.band .clock span{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:8px 10px;min-width:62px}
.band .clock b{font-size:26px}
.band-cta{display:flex;flex-direction:column;gap:10px;min-width:260px}

/* lead section (C) */
.leadsec{background:var(--isab)}
.lead-grid{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:clamp(28px,5vw,72px);align-items:center}
.fin-mini{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:24px 0 6px}
.fin-mini .card{display:flex;align-items:center;gap:12px;padding:14px;box-shadow:none}
.fin-mini span:last-child{font:500 13px/1.3 var(--sans);color:var(--muted)}
.fin-mini b{display:block;font:500 22px/1.15 var(--serif);color:var(--oxford)}
@media (max-width:980px){.lead-grid{grid-template-columns:1fr}}

/* footer, floating WhatsApp, mobile bar, consent */
.ftr{background:var(--oxford);color:#AEB6C6;padding-block:34px 110px;font-size:13px}
.ftr-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 28px}
.ftr ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 22px}
.ftr a{color:#E0E5EE;text-decoration:none}
.ftr p{flex-basis:100%;max-width:70em}
.wa-float{position:fixed;right:max(20px,env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:40;display:grid;place-items:center;width:60px;height:60px;border-radius:50%;background:#25D366;color:#fff;box-shadow:0 12px 30px -8px rgba(0,0,0,.4)}
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:35;display:none;padding:10px max(14px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(14px,env(safe-area-inset-left,0px));background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-top:1px solid var(--line)}
@media (max-width:980px){.mbar{display:block}.mbar.off{display:none}.wa-float{bottom:calc(90px + env(safe-area-inset-bottom,0px));width:54px;height:54px}.ftr{padding-bottom:120px}}
.consent{position:fixed;left:16px;right:16px;bottom:16px;z-index:60;max-width:540px;background:var(--white);border-radius:var(--r);padding:18px;box-shadow:0 20px 50px -14px rgba(3,19,50,.45);font-size:14px}
.consent p{margin:0 0 12px}
.consent .row{display:flex;gap:8px;flex-wrap:wrap}
.consent .btn{min-height:42px;font-size:14px;padding:0 16px}
@media (max-width:980px){.consent{bottom:92px}}

@media (max-width:560px){.hchips{gap:6px;margin-top:18px}.hchips li{padding:7px 11px;font-size:13px}.hero h1{margin:14px 0 12px}.lead,.planner{padding:20px}}
@media (max-width:980px){.demo-flag{bottom:88px}}

/* partner band: monochrome logo wall right under the proof strip */
.partners{background:var(--white);border-bottom:1px solid var(--line)}
.partners-row{display:flex;align-items:center;gap:16px 40px;padding-block:18px}
.partners-k{flex:none;max-width:150px;font:600 12.5px/1.35 var(--sans);color:var(--muted)}
.partners ul{flex:1;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.partners li{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:62px;padding:4px 12px;border-left:1px solid var(--line);text-align:center}
.partners li:first-child{border-left:0}
.partners img{height:36px;width:auto;max-width:150px;object-fit:contain;filter:grayscale(1);opacity:.8;transition:filter .2s,opacity .2s}
.partners li:hover img{filter:none;opacity:1}
.wm{font:600 17px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--oxford);padding-left:.2em}
.partners small{font:500 11.5px/1.2 var(--sans);color:var(--muted)}
@media (max-width:760px){.partners-row{flex-direction:column;align-items:stretch;gap:8px;padding-block:14px}.partners-k{max-width:none;text-align:center}.partners ul{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:6px}.partners li:nth-child(3){border-left:0}.wm{font-size:15px}}
.strip li{flex:none}

/* ===== A hero v3.1: the render shown in full, copy in the sky, form docked as a booking bar ===== */
.hero-a{background:var(--white);color:var(--ink)}
.hero-a::after{content:none}
.ha-stage{position:relative}
.ha-pic,.ha-pic img{display:block;width:100%}
.ha-pic img{height:auto;aspect-ratio:1600/810;max-height:760px;object-fit:cover;object-position:50% 70%}
.ha-copy{text-align:center;display:flex;flex-direction:column;align-items:center;padding-block:28px 8px}
.hero-a h1{color:var(--oxford);margin:14px 0 10px;font-size:clamp(38px,4.6vw,60px)}
.hero-a .sub{color:var(--ink);margin:0 auto}
.hero-a .hchips{justify-content:center;margin-top:16px}
.hero-a .hchips li{background:rgba(255,255,255,.82);color:var(--oxford);border:1px solid rgba(3,19,50,.08);backdrop-filter:blur(6px)}
.hero-a .hchips .ic{color:var(--gold-deep)}
.ha-dock{position:relative;z-index:2;padding-block:18px 36px}
@media (min-width:861px){
  .ha-copy{position:absolute;left:0;right:0;top:0;padding-top:clamp(22px,3.2vw,46px)}
  .ha-stage::before{content:"";position:absolute;inset:0 0 auto 0;height:48%;background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0));z-index:0;pointer-events:none}
  .ha-copy{z-index:1}
  .ha-dock{margin-top:-86px;padding-block:0 44px}
}
/* booking-bar form */
.lead.dock{padding:20px 22px 14px}
.lead.dock [data-form-body]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) 250px;grid-template-areas:"h h seg via" "name phone budget btn" "email email email email" "micro micro legal legal";column-gap:12px;align-items:center}
.lead.dock h2{grid-area:h;margin:0 0 12px;font-size:22px}
.lead.dock .segs{grid-area:seg;margin:0 0 12px}
.lead.dock .via{grid-area:via;margin:0 0 12px;justify-content:flex-end}
.lead.dock .via legend{display:none}
.lead.dock .f-name{grid-area:name;margin:0}
.lead.dock .f-phone{grid-area:phone;margin:0}
.lead.dock .f-budget{grid-area:budget;margin:0}
.lead.dock .f-email{grid-area:email;margin:10px 0 0;max-width:calc(25% - 9px)}
.lead.dock button[type=submit]{grid-area:btn;min-height:52px}
.lead.dock .micro{grid-area:micro;text-align:left;margin-top:12px}
.lead.dock .legal{grid-area:legal;text-align:right;margin-top:12px}
.lead.dock .formerr{grid-column:1/-1}
.lead.dock .done{max-width:520px;margin:0 auto}
@media (max-width:1100px) and (min-width:861px){.lead.dock [data-form-body]{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"h h" "seg via" "name phone" "budget btn" "email email" "micro legal"}.lead.dock .f-name,.lead.dock .f-phone{margin-bottom:10px}.lead.dock .f-email{max-width:none}}
@media (max-width:860px){
  .ha-pic img{aspect-ratio:720/825;max-height:58svh;object-position:50% 60%}
  .ha-copy{padding-block:22px 0}
  .lead.dock [data-form-body]{display:block}
  .lead.dock .via legend{display:block}
  .lead.dock .f-name,.lead.dock .f-phone,.lead.dock .f-budget{margin-bottom:10px}
  .lead.dock .f-email{max-width:none}
  .lead.dock .micro,.lead.dock .legal{text-align:center}
}
@media (min-width:1101px){.lead.dock [data-form-body]{grid-template-columns:repeat(3,minmax(0,1fr)) 300px}}
@media (max-width:860px){.ha-pic img{max-height:40svh;object-position:50% 55%}}

/* location badge (A hero): solid navy shape, gold pin */
.loc{display:inline-flex;align-items:center;gap:8px;padding:9px 16px 9px 12px;border-radius:999px;background:var(--oxford);color:#fff;font:600 14px/1.2 var(--sans);letter-spacing:.01em;box-shadow:0 10px 24px -12px rgba(3,19,50,.6)}
.loc .ic{color:var(--gold)}
/* A: dark booking bar for contrast against the render and the white page */
.lead.dock{background:var(--oxford);border-color:var(--oxford);color:#fff;box-shadow:0 24px 60px -20px rgba(3,19,50,.65)}
.lead.dock h2{color:#fff}
.lead.dock .field input,.lead.dock .field select{border-color:transparent}
.lead.dock .segs{background:rgba(255,255,255,.1)}
.lead.dock .seg span{color:#C9D0DD}
.lead.dock .seg input:checked+span{background:var(--gold);color:var(--oxford);box-shadow:none}
.lead.dock .chip span{border-color:rgba(255,255,255,.28);color:#D7DCE6}
.lead.dock .chip input:checked+span{border-color:var(--gold);color:var(--oxford);background:var(--gold)}
.lead.dock .via legend,.lead.dock .micro,.lead.dock .legal,.lead.dock .legal a{color:#AEB8CA}
.lead.dock .field .hint{color:#FFB4AB}
.lead.dock .formerr{color:#FFB4AB}
.lead.dock .done p{color:#D7DCE6}
.lead.dock .done h2{color:#fff}
/* A hero v3.2 (desktop): copy in its own white band above the render, render cropped to the resort */
@media (min-width:861px){
  .ha-stage{display:flex;flex-direction:column}
  .ha-stage::before{content:none}
  .ha-copy{position:static;order:-1;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-areas:"loc loc" "h1 side";column-gap:clamp(32px,5vw,80px);align-items:end;text-align:left;padding-block:clamp(28px,3vw,44px) clamp(24px,2.6vw,36px)}
  .ha-copy .loc{grid-area:loc;justify-self:start;margin-bottom:14px}
  .ha-copy h1{grid-area:h1;margin:0;font-size:clamp(42px,4.6vw,66px);line-height:1.02;font-weight:600;max-width:12ch}
  .ha-copy .sub,.ha-copy .hchips{grid-column:2}
  .ha-copy .sub{grid-row:2;align-self:start;margin:0 0 0;max-width:none;font-size:18px}
  .ha-copy .hchips{grid-row:2;align-self:end;justify-content:flex-start;margin:0}
  .ha-copy .hchips li{background:var(--gold-tint);border:0;backdrop-filter:none}
  .ha-pic img{aspect-ratio:1600/540;max-height:none;object-position:50% 80%}
}
@media (min-width:861px){
  .ha-copy{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);grid-template-areas:"loc loc" "h1 sub" "h1 chips";row-gap:14px}
  .ha-copy h1{grid-area:h1;grid-row:2/4;max-width:none;font-size:clamp(40px,4vw,58px);align-self:end}
  .ha-copy .sub{grid-area:sub;grid-row:auto;grid-column:auto;align-self:end}
  .ha-copy .hchips{grid-area:chips;grid-row:auto;grid-column:auto;align-self:end}
  .ha-copy .loc{margin-bottom:0}
}

/* planner monthly figure */
.pl-out b .per{display:inline;font:500 12px/1 var(--sans);color:var(--muted);margin-left:3px}
/* channel chips: one line, brand colours (WhatsApp green, call green, Gmail colours) */
.via{flex-wrap:nowrap;gap:6px}
.via legend{white-space:nowrap}
.chip span{padding:7px 10px;gap:5px;white-space:nowrap}
.ch-wa span{border-color:#25D366;color:#128C4A;background:#fff}
.ch-wa .ic{color:#25D366}
.ch-wa input:checked+span{background:#25D366;border-color:#25D366;color:#fff}
.ch-wa input:checked+span .ic{color:#fff}
.ch-phone span{border-color:#0B8043;color:#0B8043;background:#fff}
.ch-phone input:checked+span{background:#0B8043;border-color:#0B8043;color:#fff}
.ch-mailc span{border-color:#EA4335;color:#C5221F;background:#fff}
.ch-mailc input:checked+span{background:#fff;border-color:#EA4335;color:#C5221F;box-shadow:inset 0 0 0 1.5px #EA4335}
.lead.dock .ch-wa span,.lead.dock .ch-phone span,.lead.dock .ch-mailc span{background:#fff}
.lead.dock .ch-wa input:checked+span{background:#25D366;border-color:#25D366;color:#fff}
.lead.dock .ch-phone input:checked+span{background:#0B8043;border-color:#0B8043;color:#fff}
.lead.dock .ch-mailc input:checked+span{background:#fff;color:#C5221F}
.lead.dock .ch-wa span{color:#128C4A}.lead.dock .ch-phone span{color:#0B8043}.lead.dock .ch-mailc span{color:#C5221F}
@media (max-width:420px){.chip span{padding:6px 8px;font-size:12.5px}.via legend{font-size:12px;margin-right:2px}}
/* phones: drop the description line under the headline on Version A */
@media (max-width:860px){.hero-a .ha-copy .sub{display:none}}
.demo-flag{pointer-events:none}
.pl-out b span{font:inherit;color:inherit}
/* A hero v3.3 (desktop): cinematic letterbox. Navy band with white type above, the render untouched
   in a panoramic strip, the navy booking bar below. Nothing sits on the buildings. */
@media (min-width:861px){
  .hero-a{background:var(--oxford);color:#fff}
  .ha-copy{padding-block:clamp(26px,2.8vw,40px) clamp(22px,2.4vw,32px)}
  .ha-copy h1{color:#fff}
  .ha-copy .sub{color:#D7DCE6}
  .ha-copy .hchips li{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.16)}
  .ha-copy .hchips .ic{color:var(--gold)}
  .hero-a .loc{background:var(--gold);color:var(--oxford);box-shadow:none}
  .hero-a .loc .ic{color:var(--oxford)}
  .ha-pic{position:relative}
  .ha-pic img{aspect-ratio:1600/480;object-position:50% 64%}
  .ha-dock{margin-top:-56px;padding-block:0 30px}
  .lead.dock{box-shadow:0 0 0 1px rgba(217,170,110,.35),0 24px 60px -20px rgba(0,0,0,.6)}
}
@media (min-width:861px){
  .ha-pic img{object-position:50% 52%}
  .ha-dock{margin-top:-30px}
  .ha-copy h1{font-size:clamp(36px,3.7vw,54px)}
}

/* ================= hero options page ================= */
.opt-label{background:#FFF3C4;border-block:1px solid #E9D98A}
.opt-label .wrap{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;padding-block:12px}
.opt-label b{font:700 15px/1.3 var(--sans);color:#3D3000}
.opt-label span{font:500 14px/1.4 var(--sans);color:#5A4500}
.opt-label.end{margin-top:0}
.loc.gold{background:var(--gold);color:var(--oxford)}.loc.gold .ic{color:var(--oxford)}
.ho h1{font:600 clamp(38px,4.2vw,60px)/1.04 var(--serif);letter-spacing:-.015em;margin:16px 0 22px}
.vals{list-style:none;margin:0;padding:0}
.vals li{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:12px;align-items:center}
.vals .vic{grid-row:1/3;display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--gold-tint);color:var(--gold-deep)}
.vals b{font:600 20px/1.15 var(--sans);color:var(--oxford)}
.vals small{font:500 13.5px/1.3 var(--sans);color:var(--muted)}
.fromline{font:500 14px/1.4 var(--sans);color:var(--muted);margin:14px 0 18px}
/* fast form */
.fast .fast-h{font:500 22px/1.2 var(--serif);color:var(--oxford);margin:0 0 12px}
.bud{border:0;margin:0 0 10px;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.bud legend{float:left;font:500 13px/1.2 var(--sans);color:var(--muted);margin:0 6px 0 0;padding:0}
.bud .hint{flex-basis:100%;font:500 12.5px/1.4 var(--sans);color:var(--err)}.bud .hint:empty{display:none}
.bchip{position:relative}
.bchip input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.bchip span{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:10px;border:1.5px solid var(--line);background:#fff;font:600 14px/1 var(--sans);color:var(--oxford)}
.bchip input:checked+span{background:var(--oxford);border-color:var(--oxford);color:#fff}
.bchip input:focus-visible+span{outline:2px solid var(--gold-deep);outline-offset:2px}
.fast-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.fast-row .field{margin:0 0 10px}
.fast .micro{text-align:left}
.fast.dark .fast-h{color:#fff}
.fast.dark .bud legend,.fast.dark .via legend,.fast.dark .micro{color:#AEB8CA}
.fast.dark .bchip span{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);color:#fff}
.fast.dark .bchip input:checked+span{background:var(--gold);border-color:var(--gold);color:var(--oxford)}
.fast.dark .field .hint,.fast.dark .bud .hint,.fast.dark .formerr{color:#FFB4AB}
.fast.dark .done h2{color:#fff}.fast.dark .done p{color:#D7DCE6}
.fast .done{text-align:left}
/* option 1: split screen */
.ho1{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);min-height:min(820px,calc(100svh - 122px));background:var(--oxford)}
.ho1-left{display:flex;align-items:center;justify-content:flex-end;padding:clamp(28px,4vw,56px) clamp(24px,4vw,64px)}
.ho1-in{max-width:600px;width:100%}
.ho1 h1{color:#fff}
.vals.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.vals.tiles li{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:14px;border-radius:14px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12)}
.vals.tiles .vic{background:rgba(217,170,110,.16);color:var(--gold);width:38px;height:38px;margin-bottom:6px}
.vals.tiles b{color:#fff;font-size:19px}.vals.tiles small{color:#C9D0DD}
.ho1 .fromline{color:#AEB8CA}
.ho1-right{position:relative;margin:0;min-height:420px}
.ho1-right img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%}
.ho1-right .float.f1{left:24px;top:24px}.ho1-right .float.f2{right:24px;bottom:28px}
@media (max-width:900px){.ho1{grid-template-columns:1fr}.ho1-right{order:-1;min-height:300px}.ho1-left{justify-content:flex-start}.vals.tiles{grid-template-columns:1fr 1fr 1fr}.vals.tiles li{padding:10px}.vals.tiles b{font-size:15px}.vals.tiles small{font-size:12px}}
/* option 2: pass */
.ho2{background:var(--isab);padding-bottom:40px}
.ho2-pic{position:relative;margin:0}
.ho2-pic img{width:100%;height:auto;aspect-ratio:1600/600;object-fit:cover;object-position:50% 60%;display:block}
.ho2-pic .loc.on-pic{position:absolute;left:max(18px,calc((100vw - var(--wrap))/2 + 18px));top:22px}
.pass{position:relative;display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);margin-top:-150px;border-radius:22px;background:#fff;box-shadow:0 30px 70px -28px rgba(3,19,50,.55);overflow:hidden}
.pass-main{padding:clamp(22px,3vw,38px)}
.pass-k{display:inline-flex;align-items:center;gap:7px;font:700 13px/1.2 var(--sans);color:var(--gold-deep);margin:0}
.pass h1{color:var(--oxford);font-size:clamp(34px,3.4vw,50px);margin:10px 0 20px}
.vals.cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.vals.cols li{padding:4px 16px;border-left:2px dashed var(--line)}
.vals.cols li:first-child{padding-left:0;border-left:0}
.pass-stub{position:relative;background:var(--oxford);padding:clamp(22px,2.6vw,32px)}
.pass-stub::before{content:"";position:absolute;left:-1px;top:14px;bottom:14px;border-left:3px dotted rgba(255,255,255,.35)}
.pass-stub::after,.pass-main::after{content:none}
.pass::before,.pass::after{content:"";position:absolute;left:calc(60.8% - 14px);width:28px;height:28px;border-radius:50%;background:var(--isab);z-index:2}
.pass::before{top:-14px}.pass::after{bottom:-14px}
@media (max-width:980px){.pass{grid-template-columns:1fr;margin-top:-40px}.pass::before,.pass::after{display:none}.pass-stub::before{content:none}.vals.cols{grid-template-columns:1fr;gap:10px}.vals.cols li{border-left:0;padding:0}}
/* option 3: WhatsApp first */
.ho3{background:linear-gradient(180deg,var(--tint),#fff);padding-block:clamp(28px,4vw,56px)}
.ho3-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(28px,4vw,64px);align-items:center}
.ho3 h1{color:var(--oxford)}
.vals.checks{display:grid;gap:10px;margin-bottom:22px}
.btn.xl{min-height:64px;font-size:19px;padding:0 30px;width:100%;max-width:460px;border-radius:14px}
.or{display:flex;align-items:center;gap:12px;max-width:460px;margin:16px 0 12px;font:600 13px/1 var(--sans);color:var(--muted)}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line)}
.ho3 .fast{max-width:460px}
.ho3-pic{position:relative;margin:0}
.ho3-pic img{width:100%;height:auto;aspect-ratio:4/3.3;object-fit:cover;object-position:30% 50%;border-radius:24px;box-shadow:var(--shadow)}
.cdf b{font-variant-numeric:tabular-nums}
@media (max-width:980px){.ho3-grid{grid-template-columns:1fr}.ho3-pic{order:-1}.ho3-pic img{aspect-ratio:16/10}}

.pass{margin-top:-96px}
.vals.cols li{padding:4px 14px}
.vals.cols b{font-size:18px}
.ho3 h1{font-size:clamp(36px,3.6vw,52px)}

/* ===== hero options round 2: values left, form right ===== */
.hx{background:linear-gradient(180deg,var(--tint),#fff);padding-block:clamp(28px,3.4vw,48px)}
.hx-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,400px);gap:clamp(28px,4vw,60px);align-items:start}
.hx h1{color:var(--oxford);font-size:clamp(36px,3.8vw,54px);margin:14px 0 18px}
.vals.tiles.light li{background:#fff;border:1px solid var(--line);box-shadow:0 1px 2px rgba(3,19,50,.04)}
.vals.tiles.light .vic{background:var(--gold-tint);color:var(--gold-deep)}
.vals.tiles.light b{color:var(--oxford)}.vals.tiles.light small{color:var(--muted)}
.hx .fromline{margin:12px 0 16px}
.hx-pic{position:relative;margin:0}
.hx-pic img{width:100%;height:auto;display:block;border-radius:20px;box-shadow:var(--shadow);object-fit:cover}
.hx-pic.wide img{aspect-ratio:1600/620;object-position:50% 62%}
.hx-pic.top img{aspect-ratio:16/9;object-position:50% 48%}
.hx-pic .float.f2{right:14px;bottom:14px}.hx-pic .float.f1{left:14px;top:14px}
.hx-right{display:flex;flex-direction:column;gap:14px}
.hx-form{padding:22px}
.hx-form .fast-row{grid-template-columns:1fr}
.hxa .hx-form{position:sticky;top:16px}
/* C: render background, frosted panels low on the image */
.hxc{position:relative;overflow:hidden;min-height:min(860px,calc(100svh - 122px));display:flex;align-items:flex-end;background:var(--oxford)}
.hxc-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.hxc::after{content:"";position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(180deg,rgba(3,19,50,0),rgba(3,19,50,.55));pointer-events:none}
.hxc-grid{position:relative;z-index:1;width:100%;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,400px);gap:24px;align-items:end;padding-block:28px}
.glass{background:rgba(3,19,50,.62);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);border:1px solid rgba(255,255,255,.14);border-radius:22px;padding:24px 26px;color:#fff}
.hxc h1{color:#fff;font-size:clamp(32px,3.2vw,46px);margin:12px 0 16px}
.hxc .fromline{color:#C9D0DD;margin:12px 0 0}
.hxc .vals.tiles li{padding:12px}
@media (max-width:980px){.hx-grid,.hxc-grid{grid-template-columns:1fr}.hxa .hx-form{position:static}.hxc{min-height:0;display:block}.hxc-bg{position:relative;height:300px}.hxc::after{content:none}.hxc-grid{padding-top:16px}}
.bud legend{float:none;display:block;width:100%;margin:0 0 6px}
.bud{gap:6px}
.bud .bchip{flex:1}
.bud .bchip span{width:100%;justify-content:center}
.hxc-bg{object-position:50% 46%}
.hxc .glass{padding:20px 22px}
.hxc h1{margin:10px 0 14px}
/* channel chips: unselected = faded grey, selected = brand colour */
.via .chip span,.lead.dock .via .chip span{background:#F2F3F5;border-color:#E1E4E8;color:#8A93A3;opacity:.85}
.via .chip span .ic{color:#9AA2B1;filter:grayscale(1)}
.via .chip:hover span{opacity:1}
.via .ch-wa input:checked+span{background:#25D366;border-color:#25D366;color:#fff;opacity:1}
.via .ch-phone input:checked+span{background:#0B8043;border-color:#0B8043;color:#fff;opacity:1}
.via .ch-mailc input:checked+span{background:#fff;border-color:#EA4335;color:#C5221F;box-shadow:inset 0 0 0 1px #EA4335;opacity:1}
.via .chip input:checked+span .ic{filter:none;color:inherit}
.fast.dark .via .chip span,.lead.dock .via .chip span{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);color:#8E98AB}
.fast.dark .via .ch-wa input:checked+span,.lead.dock .via .ch-wa input:checked+span{background:#25D366;border-color:#25D366;color:#fff}
.fast.dark .via .ch-phone input:checked+span,.lead.dock .via .ch-phone input:checked+span{background:#0B8043;border-color:#0B8043;color:#fff}
.fast.dark .via .ch-mailc input:checked+span,.lead.dock .via .ch-mailc input:checked+span{background:#fff;border-color:#EA4335;color:#C5221F}
.chip input,.seg input,.bchip input{z-index:1}

/* Version A hero = option B: values + frontal render left, aerial + fast form right.
   Phones: values, then the form, then the frontal render. */
.hxb-grid{grid-template-areas:"copy right" "pic right";grid-template-rows:auto 1fr;row-gap:0}
.hxb-grid .hx-copy{grid-area:copy}
.hxb-grid .hx-pic-a{grid-area:pic;align-self:start}
.hxb-grid .hx-right{grid-area:right}
@media (max-width:980px){
  .hxb-grid{grid-template-areas:"copy" "right" "pic";grid-template-rows:auto;row-gap:18px}
  .hxb-grid .hx-right .hx-pic.top{display:none}
  .hero-a2 h1{font-size:clamp(32px,8.6vw,44px)}
  .hero-a2 .vals.tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .hero-a2 .vals.tiles li{padding:10px}
  .hero-a2 .vals.tiles .vic{width:32px;height:32px}
  .hero-a2 .vals.tiles b{font-size:15px}.hero-a2 .vals.tiles small{font-size:11.5px}
  .hero-a2 .fromline{font-size:12.5px;margin:10px 0 0}
}
.hero-a2 .hx-form .fast .fast-h{font-size:21px}
@media (max-width:980px){.hx-grid,.hxb-grid{grid-template-columns:minmax(0,1fr)}.hx-grid>*{min-width:0}}
@media (max-width:440px){.via legend{display:none}.via{gap:5px}.chip span{padding:6px 9px;font-size:12.5px}}
