/* BlueZone PRO layer: smooth motion, polish, accessibility. Loaded after style.css */
html{scroll-behavior:smooth;scroll-padding-top:90px}
::selection{background:var(--gold);color:#222}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px}
img{max-width:100%;height:auto}
/* progress bar + back to top */
#prog{position:fixed;left:0;top:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--navy),var(--gold));z-index:60;pointer-events:none}
.btt{position:fixed;left:20px;bottom:24px;width:44px;height:44px;border-radius:50%;border:0;background:var(--navy);color:#fff;box-shadow:0 8px 22px rgba(43,45,145,.35);cursor:pointer;opacity:0;transform:translateY(14px) scale(.9);pointer-events:none;transition:opacity .3s,transform .3s,background .2s;z-index:30;display:grid;place-items:center}
.btt.on{opacity:1;transform:none;pointer-events:auto}.btt:hover{background:var(--gold);color:#222}
/* header */
header{backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);background:color-mix(in srgb,var(--bg) 88%,transparent);transition:box-shadow .3s,background .3s}
header.sc2{box-shadow:0 6px 24px rgba(20,22,70,.12)}
header.sc2 .w{height:62px}header .w{transition:height .3s}
nav>div>a{position:relative}nav>div>a:after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .3s}
nav>div:hover>a:after{transform:scaleX(1)}
.dd{opacity:0;transform:translateY(8px);visibility:hidden;display:block!important;transition:opacity .25s,transform .25s,visibility .25s;max-height:70vh;overflow:auto}
nav>div:hover>.dd{opacity:1;transform:none;visibility:visible}
.mob{transition:max-height .4s ease}
/* buttons */
.btn{position:relative;overflow:hidden;transition:transform .2s,box-shadow .25s,background .2s}
.btn:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);transform:translateX(-120%)}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(43,45,145,.3)}.btn:hover:after{transform:translateX(120%);transition:transform .7s}
.btn:active{transform:translateY(0) scale(.98)}
/* hero entrance */
.hero .w>div:first-child>*{opacity:0;transform:translateY(22px);animation:up .8s cubic-bezier(.2,.7,.2,1) forwards}
.hero .w>div:first-child>*:nth-child(2){animation-delay:.12s}.hero .w>div:first-child>*:nth-child(3){animation-delay:.24s}.hero .w>div:first-child>*:nth-child(4){animation-delay:.34s}
.hero .art{animation:fadeIn 1.1s .2s both}.hero .ph{animation:kb 18s ease-in-out infinite alternate}
@keyframes up{to{opacity:1;transform:none}}@keyframes fadeIn{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}@keyframes kb{to{transform:scale(1.04)}}
/* route transition */
main:not([hidden]){animation:route .55s cubic-bezier(.2,.7,.2,1)}
@keyframes route{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
/* cards, facts, tables, details */
.card{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}.card:hover{transform:translateY(-6px);box-shadow:0 18px 38px rgba(43,45,145,.18)}
.card .ic{transition:transform .4s,background .3s}.card:hover .ic{transform:rotate(-8deg) scale(1.1)}
.fc{transition:transform .3s,box-shadow .3s}.fc:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(43,45,145,.18)}
.tw tbody tr{transition:background .2s}.tw tbody tr:hover{background:var(--pale)}
details{transition:box-shadow .25s,border-color .25s}details[open]{box-shadow:0 8px 22px rgba(43,45,145,.1);border-color:var(--navy)}
details[open]>summary~*{animation:fadeDown .35s ease}@keyframes fadeDown{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.tlv li{transition:transform .3s}.tlv li:hover{transform:translateX(6px)}
.pills a,.tags span{transition:transform .25s,background .25s,color .25s}.pills a:hover,.tags span:hover{transform:translateY(-3px);background:var(--navy);color:#fff}
/* destination cards */
.dc{transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s;background-size:150% 150%;background-position:0 0;--mx:50%;--my:50%}
.dc:before{content:"";position:absolute;inset:0;background:radial-gradient(260px circle at var(--mx) var(--my),rgba(255,255,255,.28),transparent 60%);opacity:0;transition:opacity .35s;pointer-events:none}
.dc:hover{transform:translateY(-8px) scale(1.015);box-shadow:0 24px 44px rgba(20,22,70,.28);background-position:100% 100%}.dc:hover:before{opacity:1}
.dc .in{transform:translateY(10px);transition:opacity .3s,transform .35s}.dc:hover .in,.dc:focus-within .in,.dc.open .in{transform:none}
.dc.cta:before{display:none}
#dgrid .dc{animation:pop .55s cubic-bezier(.2,.7,.2,1) backwards}
#dgrid .dc:nth-child(2){animation-delay:.04s}#dgrid .dc:nth-child(3){animation-delay:.08s}#dgrid .dc:nth-child(4){animation-delay:.12s}#dgrid .dc:nth-child(5){animation-delay:.16s}#dgrid .dc:nth-child(6){animation-delay:.2s}#dgrid .dc:nth-child(7){animation-delay:.24s}#dgrid .dc:nth-child(8){animation-delay:.28s}#dgrid .dc:nth-child(n+9){animation-delay:.32s}
@keyframes pop{from{opacity:0;transform:translateY(26px) scale(.96)}to{opacity:1;transform:none}}
.dtabs button{transition:background .25s,color .25s,transform .2s,border-color .25s}.dtabs button:hover{transform:translateY(-2px)}
.dlinks{display:flex;flex-wrap:wrap;gap:8px 14px;margin:26px 0 0;font-size:14px}.dlinks b{width:100%;font:700 13px Inter,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--head)}
.dlinks a{color:var(--navy);border-bottom:1px solid transparent;transition:border-color .2s,color .2s}.dlinks a:hover{border-color:var(--gold);color:var(--head)}
.relc{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin-top:6px}.relc a{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px 16px;font-weight:600;color:var(--head);transition:transform .25s,border-color .25s,box-shadow .25s}.relc a:hover{transform:translateY(-4px);border-color:var(--gold);box-shadow:0 10px 24px rgba(43,45,145,.14)}.relc small{display:block;font-weight:400;color:var(--text);margin-top:2px}
footer .cols{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
footer .cols a{transition:transform .2s,color .2s}footer .cols a:hover{transform:translateX(4px)}
/* static page reveal */
.rv2{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}.rv2.in{opacity:1;transform:none}
@media(max-width:560px){.btt{left:14px;bottom:20px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.hero .w>div:first-child>*{opacity:1;transform:none}.rv2{opacity:1;transform:none}html{scroll-behavior:auto}}

/* ================= Nov 2026 polish: header, search, hidden fix, static-page sections ================= */
[hidden]{display:none!important}
/* header: one line, no wrapping, aligned top bar */
header .w,.top .w{max-width:1200px}
header .w{gap:18px}
.logo{flex:none}.logo span{white-space:nowrap}
nav{flex:1;min-width:0;gap:22px;white-space:nowrap;justify-content:center}
nav>div>a{white-space:nowrap}
nav a.cur{color:var(--navy);font-weight:600}nav>div>a.cur:after{transform:scaleX(1)}
.hr{display:flex;align-items:center;gap:10px;flex:none}.hr .btn{white-space:nowrap;padding:10px 20px}
.sbtn{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--head);display:grid;place-items:center;cursor:pointer;transition:border-color .2s,background .2s,color .2s,transform .2s}
.sbtn .i{width:19px;height:19px}.sbtn:hover{border-color:var(--navy);color:var(--navy);transform:translateY(-1px)}
@media(max-width:1100px){nav,.hr .btn.o{display:none}.burger{display:block}.hero .w{grid-template-columns:1fr}}
@media(max-width:560px){.hr .btn.g{padding:9px 14px;font-size:13px}.top .w{gap:14px;font-size:12px}}
.mob a{display:block}
/* footer social + helper block on country pages */
.soc{display:flex;gap:14px;flex-wrap:wrap}
#bluezone-help .pills{margin-top:14px}#bluezone-help p{max-width:62ch}
/* search overlay (Ctrl/Cmd + K, or the magnifier in the header) */
body.sx-on{overflow:hidden}
.sx{position:fixed;inset:0;z-index:100;display:grid;justify-items:center;align-content:start;padding:11vh 16px 16px}
.sx-b{position:absolute;inset:0;background:rgba(18,19,48,.5);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);animation:sxF .2s ease}
.sx-p{position:relative;width:min(660px,100%);background:var(--card);color:var(--text);border:1px solid var(--line);border-radius:18px;box-shadow:0 30px 80px rgba(18,19,48,.35);overflow:hidden;animation:sxIn .24s cubic-bezier(.2,.7,.2,1)}
.sx-i{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line)}
.sx-i .i{width:22px;height:22px;color:var(--navy);flex:none}
.sx-i input{border:0;outline:0;background:none;font:500 18px Inter,sans-serif;color:var(--head);padding:6px 0;min-width:0;flex:1;box-shadow:none}
.sx-i input::-webkit-search-cancel-button{display:none}
.sx-x{border:1px solid var(--line);background:var(--alt);color:var(--text);border-radius:8px;font:600 12px Inter,sans-serif;padding:5px 9px;cursor:pointer}
.sx-r{list-style:none;margin:0;padding:8px;max-height:min(56vh,440px);overflow:auto}
.sx-r a{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:11px 12px;border-radius:10px;color:var(--head)}
.sx-r a.on,.sx-r a:hover{background:var(--alt)}
.sx-t{font-weight:600;font-size:15.5px}.sx-g{font-size:12px;color:var(--navy);font-weight:600;align-self:center;white-space:nowrap}
.sx-r small{grid-column:1/-1;color:var(--text);font-size:13px;line-height:1.45}
.sx-e{margin:0;padding:22px 20px;color:var(--text)}
@keyframes sxIn{from{opacity:0;transform:translateY(-12px) scale(.98)}to{opacity:1;transform:none}}@keyframes sxF{from{opacity:0}to{opacity:1}}
/* floating buttons: keep the call icon visible */
.fl a{transition:transform .25s,box-shadow .25s}.fl a:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 10px 24px rgba(0,0,0,.28)}
@media(max-width:560px){.sx{padding-top:7vh}.sx-i input{font-size:16px}}
.sx-r a,.sx-r a:hover{text-decoration:none}