
/* Layout: whitewash destination magazine. Full-bleed real photographs carry the colour; the page itself is white and limestone,
   with Aegean blue as the single accent and terracotta only for small details. */
:root{
  --white:#FFFFFF; --paper:#F7F5F0; --stone:#EEEAE2; --line:#E6E1D8;
  --ink:#10283B; --text:#2E3F4C; --muted:#6B7882;
  --sea:#1D6B96; --sea-deep:#0E3A57; --aqua:#57B3BE; --terra:#B9654A; --gold:#E7CB92;
  --serif:"Playfair Display","Noto Serif SC","Songti SC",Georgia,serif;
  --sans:"Manrope","Avenir Next","Segoe UI",system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;
  --wrap:1280px; --r:10px;
  color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{background:var(--white);color:var(--text);font-family:var(--sans);font-size:16.5px;line-height:1.7;font-weight:400;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:80;background:var(--white)}
a{color:inherit}
img{display:block}
:focus-visible{outline:2px solid var(--sea);outline-offset:3px;border-radius:4px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
h1,h2,h3{font-family:var(--serif);font-weight:400;color:var(--ink);margin:0;text-wrap:balance;letter-spacing:-.01em}
h2{font-size:clamp(2.1rem,4.2vw,3.3rem);line-height:1.08}
h3{font-size:1.4rem;line-height:1.2}
p{margin:0}
:lang(zh) h1,:lang(zh) h2,:lang(zh) h3{font-weight:600;letter-spacing:.02em}
.eyebrow{font-family:var(--sans);font-size:.74rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--sea)}
:lang(zh) .eyebrow{letter-spacing:.08em}
.lead{color:var(--muted);font-size:1.12rem;max-width:62ch;font-weight:300}
.note{font-size:.84rem;color:var(--muted);margin-top:26px;max-width:90ch}

/* ---------- header ---------- */
header.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:70;background:rgb(255 255 255 / .97);color:var(--ink);border-bottom:1px solid var(--line);transition:background .3s,color .3s,border-color .3s}
body.over header.top{background:transparent;color:#fff;border-bottom-color:transparent}
body.over main{margin-top:-81px}
.bar{display:flex;align-items:center;gap:22px;height:80px}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;flex-shrink:0}
.logo .mark{width:30px;height:38px;flex-shrink:0}
.word{display:flex;flex-direction:column;line-height:1;white-space:nowrap;gap:4px}
.word .d{font-family:var(--sans);font-weight:500;font-size:.6rem;letter-spacing:.46em;opacity:.8}
.word .k{font-family:var(--serif);font-weight:500;font-size:1.35rem;letter-spacing:.26em}
#navList{display:flex;gap:4px;margin-left:auto}
#navList a{position:relative;font-size:.8rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;padding:10px 9px;white-space:nowrap;opacity:.86}
#navList a:hover,#navList a.on{opacity:1}
#navList a.on::after{content:"";position:absolute;left:9px;right:9px;bottom:3px;height:1.5px;background:currentColor}
.langs{display:flex;gap:0;flex-shrink:0}
.langs button{font:500 .72rem/1 var(--sans);letter-spacing:.08em;border:0;background:none;color:inherit;opacity:.6;padding:8px 6px;cursor:pointer}
.langs button[aria-pressed="true"]{opacity:1;text-decoration:underline;text-underline-offset:5px}
#menuBtn{display:none;margin-left:auto;border:1px solid currentColor;background:none;color:inherit;border-radius:999px;padding:9px 18px;font:500 .78rem var(--sans);letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
@media (max-width:1540px){#navList{display:none}#menuBtn{display:block}}
@media (max-width:620px){.langs{position:fixed;bottom:calc(14px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%);background:#fff;color:var(--ink);box-shadow:0 8px 30px rgb(16 40 59 / .18);border-radius:999px;padding:4px 10px;z-index:75}.word .k{font-size:1.3rem}}


/* ---------- photo hero ---------- */
.hero{position:relative;color:#fff;background:var(--sea-deep);overflow:hidden;isolation:isolate}
.hero > img,.hero > canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;filter:saturate(1.18) contrast(1.06)}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgb(9 25 38 / .45) 0%,rgb(9 25 38 / .05) 32%,rgb(9 25 38 / .15) 55%,rgb(9 25 38 / .72) 100%)}
.hero .hin{padding-block:calc(81px + clamp(110px,16vw,230px)) clamp(48px,6vw,80px)}
.hero.home .hin{padding-block:calc(81px + clamp(170px,24vw,340px)) clamp(60px,7vw,100px)}
.hero h1{color:#fff;font-weight:400;font-size:clamp(2.8rem,6.6vw,5.4rem);line-height:1.02;max-width:17ch}
.hero.home h1{font-size:clamp(3.6rem,10vw,8.4rem);line-height:.95}
.hero h1 em{font-style:italic}
.hero .eyebrow{color:#fff;opacity:.9}
.hero .lead{color:rgb(255 255 255 / .92);margin-top:20px;font-size:1.16rem;font-weight:400}
.crumb{display:flex;gap:10px;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:18px;opacity:.85}
.crumb a{text-decoration:none}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.btn{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font:500 .8rem var(--sans);letter-spacing:.14em;text-transform:uppercase;padding:15px 26px;border-radius:999px;border:1px solid transparent;cursor:pointer}
.btn.white{background:#fff;color:var(--ink)}
.btn.line{border-color:rgb(255 255 255 / .8);color:#fff;background:rgb(255 255 255 / .06)}
.btn.sea{background:var(--sea);color:#fff}
.btn.ghost{border-color:var(--line);color:var(--ink);background:#fff}
.btn.sm{padding:11px 18px;font-size:.74rem}
.credit{position:absolute;right:12px;bottom:10px;z-index:2;font-size:.62rem;letter-spacing:.02em;color:rgb(255 255 255 / .85);text-decoration:none;max-width:60%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 4px rgb(0 0 0 / .5)}

/* ---------- home ---------- */
.facts{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}
.facts div{padding:26px 22px;border-left:1px solid var(--line)}
.facts div:first-child{border-left:0}
.facts b{display:block;font-family:var(--serif);font-weight:400;font-size:1.9rem;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums}
.facts span{font-size:.8rem;letter-spacing:.06em;color:var(--muted)}
@media (max-width:760px){.facts{grid-template-columns:1fr 1fr}.facts div:nth-child(3){border-left:0}.facts div:nth-child(n+3){border-top:1px solid var(--line)}}
.intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,90px);align-items:center}
.intro .ph{aspect-ratio:4/5}
.intro h2{margin:14px 0 22px}
.intro .lead{font-size:1.15rem}
.quote{margin-top:30px;padding-left:22px;border-left:2px solid var(--gold);font-family:var(--serif);font-style:italic;font-size:1.5rem;line-height:1.3;color:var(--ink)}
.quote small{display:block;font-family:var(--sans);font-style:normal;font-size:.8rem;letter-spacing:.08em;color:var(--muted);margin-top:10px}
@media (max-width:880px){.intro{grid-template-columns:1fr}.intro .ph{aspect-ratio:4/3}}

.s{padding-block:clamp(64px,9vw,130px)}
.s.tight{padding-block:clamp(44px,6vw,80px)}
.s.paper{background:var(--paper)}
.shead{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px 40px;margin-bottom:clamp(28px,4vw,48px)}
.shead > div{display:grid;gap:12px;max-width:760px}
.shead .more{font:500 .78rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--sea);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:3px}

.explore{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.ex{position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;min-height:320px;padding:24px;border-radius:var(--r);overflow:hidden;text-decoration:none;color:#fff;background:var(--sea-deep);isolation:isolate;grid-column:span 4}
.ex.big{grid-column:span 8;min-height:420px}
.ex img,.ex canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .8s ease}
.ex:hover img{transform:scale(1.04)}
.ex::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgb(9 25 38 / .78) 0%,rgb(9 25 38 / .1) 55%,transparent)}
.ex .t{font-family:var(--serif);font-size:2rem;line-height:1.05}
.ex .b{font-size:.92rem;opacity:.92}
.ex .go{font:500 .72rem var(--sans);letter-spacing:.16em;text-transform:uppercase;margin-top:8px;opacity:.9}
@media (max-width:980px){.ex,.ex.big{grid-column:span 6;min-height:260px}}
@media (max-width:620px){.ex,.ex.big{grid-column:span 12}}

.rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(280px,1fr);gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;scrollbar-width:thin}
.rail .hl{scroll-snap-align:start;text-decoration:none}
.hl .ph{aspect-ratio:3/4}
.hl h3{margin-top:14px}
.hl p{font-size:.92rem;color:var(--muted);margin-top:4px}

.day{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:0;border-top:1px solid var(--line)}
.day li{padding:24px 22px 0 0;min-width:0}
.day .hr{font:500 .82rem var(--sans);letter-spacing:.1em;color:var(--terra)}
.day b{display:block;font-family:var(--serif);font-weight:500;font-size:1.55rem;line-height:1.1;margin:8px 0;color:var(--ink)}
.day p{font-size:.95rem;color:var(--muted)}
@media (max-width:980px){.day{grid-template-columns:1fr 1fr;gap:0 20px}}
@media (max-width:540px){.day{grid-template-columns:1fr}}

.seasons{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.season{border-top:1px solid var(--ink);padding-top:18px;min-width:0}
.season .m{font:500 .76rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--sea)}
.season h3{font-size:2rem;margin:6px 0 10px}
.season p{font-size:.96rem;color:var(--muted)}
@media (max-width:900px){.seasons{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.seasons{grid-template-columns:1fr}}

.band{position:relative;color:#fff;isolation:isolate;overflow:hidden;background:var(--sea-deep)}
.band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.band::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgb(9 25 38 / .82),rgb(9 25 38 / .35))}
.bandin{display:grid;gap:18px;padding-block:clamp(70px,10vw,130px);max-width:var(--wrap)}
.band h2{color:#fff;max-width:18ch}
.band p{color:rgb(255 255 255 / .9);max-width:56ch;font-size:1.08rem}

.nextp{border-top:1px solid var(--line)}
.nin{display:flex;flex-wrap:wrap;gap:10px 30px;align-items:baseline;justify-content:space-between;padding-block:48px;text-decoration:none}
.nt{font-family:var(--serif);font-size:clamp(2.2rem,5vw,3.6rem);line-height:1;color:var(--ink)}
.nb{color:var(--muted)}

/* ---------- cards ---------- */
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:30px}
.filters button,#mapCats button{font:500 .76rem var(--sans);letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--line);background:#fff;color:var(--muted);padding:10px 16px;border-radius:999px;cursor:pointer}
.filters button[aria-pressed="true"],#mapCats button[aria-pressed="true"]{border-color:var(--ink);background:var(--ink);color:#fff}
.ph{position:relative;margin:0;border-radius:var(--r);overflow:hidden;background:var(--stone);max-width:100%}
.ph img,.ph canvas{width:100%;height:100%;object-fit:cover;filter:saturate(1.1)}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:48px 28px}
.pcard{display:flex;flex-direction:column;gap:14px;min-width:0}
.pcard .ph{aspect-ratio:4/3}
.pcard .kicker{display:flex;justify-content:space-between;gap:10px;font:500 .72rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--sea)}
.pcard .kicker span:last-child{color:var(--muted)}
.pcard h3{font-size:1.6rem}
.pcard p{color:var(--muted);font-size:.98rem}
.facts-list{display:grid;margin:2px 0 0;border-top:1px solid var(--line)}
.facts-list div{display:grid;grid-template-columns:120px 1fr;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:.92rem}
.facts-list dt{color:var(--muted)}
.facts-list dd{margin:0;color:var(--ink);font-weight:500}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{font-size:.74rem;letter-spacing:.04em;padding:4px 10px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}
.acts{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;margin-top:auto;padding-top:4px}
.lnk{font:500 .76rem var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--sea);text-decoration:none}
.lnk:hover{text-decoration:underline;text-underline-offset:4px}

.vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}
.vcard{display:flex;flex-direction:column;gap:10px;padding:24px;border:1px solid var(--line);border-radius:var(--r);background:#fff;min-width:0;transition:box-shadow .3s,border-color .3s}
.vcard:hover{border-color:#d6d0c4;box-shadow:0 18px 40px -26px rgb(16 40 59 / .35)}
.vhead{display:flex;justify-content:space-between;gap:12px;font:500 .72rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.vhead .rank{color:var(--terra)}
.vcard h3{font-size:1.4rem}
.vcard p{color:var(--muted);font-size:.95rem}
.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:.94rem;padding-top:10px;border-top:1px solid var(--line)}
.row .k{font:500 .7rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);min-width:78px}
.row .num{font-weight:600;color:var(--ink);text-decoration:none;font-variant-numeric:tabular-nums;user-select:all}
.row .v{color:var(--ink);font-weight:500}
.row small{flex-basis:100%;color:var(--muted);font-size:.84rem}
.row.muted{color:var(--muted)}
.cp{margin-left:auto;font:500 .68rem var(--sans);letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:999px;padding:6px 12px;cursor:pointer}
.ta{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;color:var(--ink)}
.ta i{display:inline-flex;gap:2px}.ta i b{width:9px;height:9px;border-radius:50%;background:#00AA6C;display:block}.ta i b.e{background:#cfe9dd}

.feature{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:14px 30px;align-items:center;justify-content:space-between;padding:26px 28px;border:1px dashed var(--sea);border-radius:var(--r);background:#F3F8FB}
.feature b{font-family:var(--serif);font-weight:500;font-size:1.6rem;color:var(--ink)}
.feature p{color:var(--muted);font-size:.95rem;max-width:62ch}

.group{margin-top:56px}
.ghead{display:flex;align-items:baseline;gap:14px;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.ghead h3{font-size:2rem}
.ghead span{color:var(--muted);font-size:.92rem}

/* split blocks */
.split{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(32px,6vw,90px);align-items:center}
.split.rev > :first-child{order:2}
.split .ph{aspect-ratio:5/4}
.split h2{margin:12px 0 20px}
@media (max-width:880px){.split{grid-template-columns:1fr}.split.rev > :first-child{order:0}}
.ticks{margin:22px 0 0;padding:0;list-style:none;display:grid;gap:10px}
.ticks li{padding-left:26px;position:relative}
.ticks li::before{content:"";position:absolute;left:0;top:11px;width:14px;height:1.5px;background:var(--terra)}
.route-line{list-style:none;margin:0;padding:0}
.route-line li{display:grid;grid-template-columns:70px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.route-line span{font:500 .84rem var(--sans);color:var(--terra);letter-spacing:.06em}
.route-line b{font-family:var(--serif);font-weight:500;font-size:1.35rem;color:var(--ink);line-height:1.2}
.route-line p{grid-column:2;font-size:.92rem;color:var(--muted)}

.prose p{max-width:64ch;font-size:1.06rem}.prose p+p{margin-top:18px}
.prose p:first-child::first-letter{font-family:var(--serif);float:left;font-size:4.6rem;line-height:.8;padding:8px 12px 0 0;color:var(--sea)}
.timeline{list-style:none;margin:0;padding:0}
.timeline li{display:grid;grid-template-columns:110px 1fr;gap:18px;padding:18px 0;border-top:1px solid var(--line)}
.timeline .yr{font:500 .84rem var(--sans);color:var(--terra);letter-spacing:.06em}
.timeline strong{display:block;font-family:var(--serif);font-weight:500;font-size:1.45rem;color:var(--ink);line-height:1.15}
.timeline p{color:var(--muted);font-size:.95rem;grid-column:2}
.hoods{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:0 28px}
.hood{padding:20px 0;border-top:1px solid var(--line)}
.hood b{font-family:var(--serif);font-weight:500;font-size:1.55rem;display:block;color:var(--ink)}
.hood span{font-size:.94rem;color:var(--muted)}

.panels{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:36px}
.panel h3{font-size:1.9rem;margin-bottom:10px}
.panel p,.panel ul{color:var(--muted)}
.panel ul{margin:12px 0 0;padding-left:18px}

.unesco{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.un{border:1px solid var(--line);border-radius:var(--r);padding:26px;display:flex;flex-direction:column;gap:10px;background:#fff}
.un.ws{border-color:var(--gold);background:#FFFBF2}
.badge{align-self:flex-start;font:500 .68rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--terra)}
.un p{color:var(--muted);font-size:.95rem}

.exps{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:0 28px}
.exp{padding:20px 0;border-top:1px solid var(--line)}
.exp b{font-family:var(--serif);font-weight:500;font-size:1.5rem;display:block;color:var(--ink);line-height:1.1;margin-bottom:6px}
.exp p{font-size:.94rem;color:var(--muted)}

.routes{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:28px}
.route{border-top:1px solid var(--ink);padding-top:16px}
.route .k{font:500 .74rem var(--sans);letter-spacing:.16em;color:var(--sea)}
.route h3{margin:6px 0}
.route p{font-size:.95rem;color:var(--muted)}
.tips{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:0 28px}
.tip{display:flex;gap:14px;padding:18px 0;border-top:1px solid var(--line);font-size:.95rem;color:var(--muted)}
.tip b{color:var(--ink);display:block;font-weight:500}
.tip svg{flex-shrink:0;width:22px;height:22px;color:var(--sea);margin-top:3px}
.emerg{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin-bottom:24px}
.emerg div{border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;display:grid}
.emerg b{font-family:var(--serif);font-weight:500;font-size:2.4rem;line-height:1;color:var(--terra)}
.emerg span{font-size:.86rem;color:var(--muted)}
.onduty{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between;padding:24px 28px;border-radius:var(--r);background:var(--paper);border-left:3px solid var(--sea);margin-bottom:12px}
.onduty h3{font-size:1.9rem;margin:4px 0}.onduty p{color:var(--muted)}.onduty .num{font-weight:600;color:var(--ink)}
.mapcta{position:relative;display:flex;justify-content:space-between;align-items:flex-end;min-height:240px;margin-top:40px;padding:28px;border-radius:var(--r);overflow:hidden;color:#fff;text-decoration:none;isolation:isolate}
.mapcta img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.mapcta::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgb(9 25 38 / .7),transparent 70%)}
.mapcta span:first-child{font-family:var(--serif);font-size:clamp(1.8rem,3.4vw,2.6rem)}

.why{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:28px;margin-bottom:48px}
.why div{border-top:1px solid var(--ink);padding-top:18px}
.why b{font-family:var(--serif);font-weight:500;font-size:1.65rem;display:block;margin-bottom:8px;line-height:1.1;color:var(--ink)}
.why p{font-size:.95rem;color:var(--muted)}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tier{border:1px solid var(--line);border-radius:var(--r);padding:28px;display:flex;flex-direction:column;gap:12px;background:#fff;min-width:0}
.tier.hot{border-color:var(--ink);box-shadow:0 24px 50px -32px rgb(16 40 59 / .5)}
.tier .tag{font:500 .7rem var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--terra)}
.tier h3{font-size:2.1rem}
.tier ul{margin:0;padding-left:18px;font-size:.95rem;display:grid;gap:4px;color:var(--muted)}
.tier .price{margin-top:auto;padding-top:10px;font-size:.84rem;letter-spacing:.06em;color:var(--ink)}
@media (max-width:860px){.tiers{grid-template-columns:1fr}}
.form{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,5vw,70px)}
.mailbox{margin-top:20px;font-size:.94rem;color:var(--muted)}
.mail{user-select:all;color:var(--ink);font-weight:500}
form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
form .full{grid-column:1/-1}
label{display:grid;gap:6px;font:500 .72rem var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);min-width:0}
input,select,textarea{font:inherit;font-size:1rem;letter-spacing:0;text-transform:none;color:var(--ink);padding:13px 14px;border-radius:8px;border:1px solid var(--line);background:#fff;width:100%}
textarea{min-height:120px;resize:vertical}
.result{padding:16px;border-radius:8px;background:var(--paper);font-size:.95rem}
.result pre{white-space:pre-wrap;font-size:.84rem;margin:10px 0;background:#fff;padding:12px;border-radius:6px;overflow-x:auto}
@media (max-width:860px){.form{grid-template-columns:1fr}}
@media (max-width:520px){form{grid-template-columns:1fr}}
.invest{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 40px;align-items:center;padding:30px;border:1px solid var(--line);border-radius:var(--r)}
.invest h3{font-size:1.9rem}.invest p{color:var(--muted);margin-top:6px}
@media (max-width:760px){.invest{grid-template-columns:1fr}}

/* ---------- map page ---------- */
.mtop{padding-block:44px 30px;border-bottom:1px solid var(--line)}
.mtop h1{font-size:clamp(2.4rem,5vw,4rem);line-height:1;margin-top:10px}
.mtop .lead{margin-top:12px}
.mapgrid{display:grid;grid-template-columns:330px minmax(0,1fr);border-bottom:1px solid var(--line)}
.mside{border-right:1px solid var(--line);display:flex;flex-direction:column;height:min(80vh,780px);min-height:0;background:#fff}
.mside .ctl{padding:18px;display:grid;gap:12px;border-bottom:1px solid var(--line)}
#mapCats{display:flex;flex-wrap:wrap;gap:6px}
#mapCats button{padding:7px 12px;font-size:.68rem}
#mapList{list-style:none;margin:0;padding:8px;overflow-y:auto;flex:1}
#mapList li{display:flex;align-items:center}
#mapList button{flex:1;display:grid;grid-template-columns:10px 1fr auto;align-items:center;gap:12px;text-align:left;border:0;background:none;color:var(--ink);padding:11px 10px;border-radius:8px;cursor:pointer;font:inherit;font-size:.96rem}
#mapList button:hover{background:var(--paper)}
#mapList button.on{background:#EEF5F9}
#mapList .dot{width:9px;height:9px;border-radius:50%;background:var(--pc)}
#mapList .lc{font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
#mapList a{padding:8px 10px;text-decoration:none;color:var(--muted);border-radius:6px}
#mapList a:hover{background:var(--paper);color:var(--ink)}
#map3d{position:relative;height:min(80vh,780px);min-height:460px;background:linear-gradient(180deg,#CFE3EC 0%,#EEF4F2 60%,#F6F3EC 100%);overflow:hidden;touch-action:none}
#map3d canvas{display:block;width:100%;height:100%}
.labels{position:absolute;inset:0;pointer-events:none}
.mlabel{position:absolute;left:0;top:0;pointer-events:auto;white-space:nowrap;font:500 .76rem var(--sans);color:var(--ink);background:rgb(255 255 255 / .94);padding:5px 10px 5px 8px;border-radius:999px;text-decoration:none;box-shadow:0 4px 16px rgb(16 40 59 / .18);border-left:3px solid var(--pc)}
.mlabel.sel{font-size:.88rem;padding:7px 13px 7px 10px;background:#fff;color:var(--ink);box-shadow:0 8px 24px rgb(16 40 59 / .28)}
.mhint{position:absolute;left:16px;top:16px;font:500 .7rem var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink);background:rgb(255 255 255 / .9);padding:7px 12px;border-radius:999px}
#mapReset{position:absolute;right:16px;top:16px;font:500 .7rem var(--sans);letter-spacing:.1em;text-transform:uppercase;border:0;background:#fff;color:var(--ink);padding:9px 14px;border-radius:999px;cursor:pointer;box-shadow:0 4px 16px rgb(16 40 59 / .15)}
.compass{position:absolute;right:18px;bottom:18px;width:42px;height:42px;border-radius:50%;background:rgb(255 255 255 / .92);display:grid;place-items:center;font:600 .78rem var(--sans);color:var(--terra)}
#mapInfo{position:absolute;left:16px;bottom:16px;width:min(380px,calc(100% - 32px));background:#fff;border-radius:var(--r);overflow:hidden;box-shadow:0 18px 50px rgb(16 40 59 / .25)}
#mapInfo .ph{border-radius:0;aspect-ratio:16/9}
#mapInfo .ib{padding:16px 18px 18px;display:grid;gap:6px}
#mapInfo .ic{font:500 .66rem var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--sea)}
#mapInfo h3{font-size:1.7rem}
#mapInfo p{font-size:.9rem;color:var(--muted)}
.coordtxt{font-size:.74rem;color:var(--muted);letter-spacing:.04em}
.map-fallback,.map-loading{position:absolute;inset:0;display:grid;place-items:center;padding:24px;text-align:center;color:var(--ink)}
.map-loading{font:500 .78rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
#mapNote{font-size:.8rem;color:var(--muted);padding-block:16px}
@media (max-width:900px){.mapgrid{grid-template-columns:1fr}.mside{order:2;height:auto;border-right:0}#mapList{max-height:420px}#map3d{height:66vh}}


/* ---------- premium motion & icons ---------- */
.ic{width:22px;height:22px;flex-shrink:0}
.sic{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:50%;border:1px solid var(--line);color:var(--sea);margin-bottom:6px}
.sic .ic{width:22px;height:22px}
@keyframes kb{from{transform:scale(1.14) translate3d(0,-1.5%,0)}to{transform:scale(1) translate3d(0,0,0)}}
@keyframes rise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes fadein{from{opacity:0}to{opacity:1}}
@keyframes drift{0%{transform:translate(0,0) rotate(0)}50%{transform:translate(14px,-18px) rotate(8deg)}100%{transform:translate(0,0) rotate(0)}}
@keyframes swell{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
.hero > img{animation:kb 16s cubic-bezier(.2,.6,.2,1) both}
.hero .hin > *{animation:rise 1.1s cubic-bezier(.2,.7,.2,1) both}
.hero .hin > *:nth-child(2){animation-delay:.12s}.hero .hin > *:nth-child(3){animation-delay:.24s}.hero .hin > *:nth-child(4){animation-delay:.36s}.hero .hin > *:nth-child(5){animation-delay:.48s}
.hero .wavebar{position:absolute;left:0;right:0;bottom:-1px;height:46px;overflow:hidden;z-index:1;pointer-events:none}
.hero .wavebar svg{position:absolute;bottom:0;left:0;width:200%;height:100%;animation:swell 18s linear infinite}
.hero .wavebar svg + svg{animation-duration:26s;opacity:.55}
.scroll-cue{position:absolute;left:50%;bottom:62px;transform:translateX(-50%);color:#fff;opacity:.85;z-index:2;animation:bob 2.4s ease-in-out infinite}
.scroll-cue .ic{width:26px;height:26px}
@supports (animation-timeline: view()){
  .rv{animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 38%}
  .pcard .ph img,.split .ph img,.intro .ph img{animation:par linear both;animation-timeline:view();animation-range:cover}
  @keyframes par{from{transform:scale(1.12) translateY(-4%)}to{transform:scale(1.12) translateY(4%)}}
}
.pcard .ph,.hl .ph,.ex{transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s}
.pcard:hover .ph{box-shadow:0 28px 50px -30px rgb(16 40 59 / .55)}
.pcard .ph::after,.hl .ph::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 30%,rgb(255 255 255 / .25) 50%,transparent 70%);transform:translateX(-120%);transition:transform .9s ease;pointer-events:none}
.pcard:hover .ph::after,.hl:hover .ph::after{transform:translateX(120%)}
.hl:hover .ph{transform:translateY(-6px)}
.vhead .vi{display:inline-flex;align-items:center;gap:8px;color:var(--sea)}
.vhead .vi .ic{width:20px;height:20px}
.vcard{position:relative;overflow:hidden}
.vcard::before{content:"";position:absolute;left:0;top:0;height:2px;width:0;background:linear-gradient(90deg,var(--sea),var(--aqua));transition:width .6s cubic-bezier(.2,.7,.2,1)}
.vcard:hover::before{width:100%}
.vcard .bgic{position:absolute;right:-14px;bottom:-14px;width:96px;height:96px;color:var(--stone);opacity:.7;pointer-events:none;transition:transform .8s}
.vcard:hover .bgic{transform:rotate(-12deg) scale(1.08)}
.vcard > *:not(.bgic){position:relative}

/* quick info strip */
.quick{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}
.quick a{display:flex;gap:14px;align-items:center;padding:24px 22px;border-left:1px solid var(--line);text-decoration:none;transition:background .3s}
.quick a:first-child{border-left:0}
.quick a:hover{background:var(--paper)}
.quick .ic{width:30px;height:30px;color:var(--sea)}
.quick b{display:block;font-weight:600;color:var(--ink);font-size:.98rem;line-height:1.25}
.quick span{font-size:.82rem;color:var(--muted)}
@media (max-width:900px){.quick{grid-template-columns:1fr 1fr}.quick a:nth-child(3){border-left:0}.quick a:nth-child(n+3){border-top:1px solid var(--line)}}

/* next arrow */
.nextp{border-top:1px solid var(--line);display:grid;place-items:center;padding-block:44px}
.nexta{display:grid;place-items:center;width:84px;height:84px;border-radius:50%;border:1px solid var(--ink);color:var(--ink);text-decoration:none;transition:background .35s,color .35s,transform .35s}
.nexta:hover{background:var(--ink);color:#fff;transform:translateX(6px)}
.nexta .ic{width:30px;height:30px}

/* menu overlay: animated sea */

/* immersive map page */
#mapPage{position:relative}
.mapwrap{position:relative;height:calc(100vh - 81px - env(safe-area-inset-top,0px));min-height:560px;background:linear-gradient(180deg,#B9D6E4 0%,#DCEAF0 45%,#EEF3F1 100%)}
#map3d{position:absolute;inset:0;height:auto;min-height:0;background:none}
.mpanel{position:absolute;top:20px;left:max(20px,env(safe-area-inset-left,0px));bottom:20px;width:340px;z-index:5;display:flex;flex-direction:column;background:rgb(255 255 255 / .9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-radius:14px;box-shadow:0 24px 60px -20px rgb(16 40 59 / .35);overflow:hidden}
.mpanel .mt{padding:20px 20px 12px}
.mpanel .mt h1{font-size:1.7rem;line-height:1.15;margin-top:6px}
.mpanel .mt p{font-size:.86rem;color:var(--muted);margin-top:8px;line-height:1.5}
.mpanel .ctl{padding:0 20px 14px;display:grid;gap:10px;border-bottom:1px solid var(--line)}
.mpanel #mapList{flex:1;overflow-y:auto;padding:8px}
#mapInfo{left:auto;right:20px;bottom:20px}
.mhint{left:auto;right:20px;top:20px}
#mapReset{top:62px}
@media (max-width:900px){.mapwrap{height:auto;min-height:0}#map3d{position:relative;height:64vh}.mpanel{position:relative;inset:auto;width:auto;margin:0 16px 16px;top:auto;left:auto;bottom:auto;max-height:none}#mapInfo{left:12px;right:12px;width:auto;bottom:12px}}

/* ---------- footer ---------- */
footer{background:var(--paper);border-top:1px solid var(--line);padding-block:64px calc(90px + env(safe-area-inset-bottom,0px))}
.foot{display:flex;flex-wrap:wrap;gap:36px;justify-content:space-between}
.foot .logo{color:var(--ink)}
.foot p{color:var(--muted);font-size:.92rem;max-width:48ch;margin-top:16px}
#footNav{display:grid;grid-template-columns:repeat(2,minmax(0,auto));gap:10px 40px;font-size:.92rem}
#footNav a{text-decoration:none;color:var(--text)}
.legal{margin-top:40px;padding-top:20px;border-top:1px solid var(--line);font-size:.78rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}

/* ================= polish: quiet luxury details ================= */
:root{--r:4px;--gold-d:#B8934F}
body{font-size:16px;letter-spacing:.005em}
h2{font-size:clamp(2rem,3.8vw,3rem);line-height:1.12;letter-spacing:-.015em}
.eyebrow{display:inline-flex;align-items:center;gap:12px;color:var(--gold-d);font-size:.7rem;letter-spacing:.26em}
.eyebrow::before{content:"";width:28px;height:1px;background:currentColor}
.hero .eyebrow{color:#fff;text-shadow:0 1px 8px rgb(0 0 0 / .35)}
.hero .eyebrow::before{background:var(--gold)}
.sic{justify-self:start}
.lead{font-size:1.08rem;line-height:1.75}
.s{padding-block:clamp(80px,11vw,160px)}
.shead{margin-bottom:clamp(36px,5vw,64px)}
.sic{width:auto;height:auto;border:0;margin-bottom:2px;color:var(--gold-d)}
.sic .ic{width:26px;height:26px}
/* photo grade so amateur shots sit together */
.ph img,.hero > img,.ex img,.band img,.hero .slide{filter:saturate(1.06) contrast(1.06) brightness(1.03) sepia(.06)}
.ph{border-radius:var(--r)}
/* header */
.bar{height:76px}
body.over main{margin-top:-77px}
.hero .hin{padding-block:calc(77px + clamp(120px,17vw,240px)) clamp(64px,7vw,96px)}
.word .k{font-size:1.22rem;letter-spacing:.32em}
.word .d{font-size:.56rem;letter-spacing:.5em}
#menuBtn{border-width:1px;padding:8px 20px;font-size:.7rem;letter-spacing:.2em}
/* hero */
.hero::after{background:linear-gradient(180deg,rgb(9 25 38 / .5) 0%,rgb(9 25 38 / 0) 30%,rgb(9 25 38 / .05) 50%,rgb(9 25 38 / .66) 100%)}
.hero h1{font-weight:400;letter-spacing:-.02em}
.hero.home h1{font-size:clamp(3.4rem,9vw,7.6rem);letter-spacing:-.03em}
.hero.home{min-height:min(100vh,980px)}
.hero .slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:0;animation:slide 28s linear infinite}
.hero .slide:nth-of-type(1){animation-delay:-1s}.hero .slide:nth-of-type(2){animation-delay:6s}.hero .slide:nth-of-type(3){animation-delay:13s}.hero .slide:nth-of-type(4){animation-delay:20s}
@keyframes slide{0%{opacity:0;transform:scale(1.12)}4%{opacity:1}25%{opacity:1}29%{opacity:0;transform:scale(1)}100%{opacity:0;transform:scale(1)}}
.dots{display:flex;gap:10px;margin-top:40px}
.dots i{width:34px;height:2px;background:rgb(255 255 255 / .35);position:relative;overflow:hidden}
.dots i::after{content:"";position:absolute;inset:0;background:#fff;transform:scaleX(0);transform-origin:left;animation:dot 28s linear infinite}
.dots i:nth-child(1)::after{animation-delay:-1s}.dots i:nth-child(2)::after{animation-delay:6s}.dots i:nth-child(3)::after{animation-delay:13s}.dots i:nth-child(4)::after{animation-delay:20s}
@keyframes dot{0%{transform:scaleX(0)}25%{transform:scaleX(1)}26%,100%{transform:scaleX(0)}}
/* buttons & links */
.btn{padding:16px 30px;font-size:.7rem;letter-spacing:.22em;font-weight:600;border-radius:2px;transition:background .35s,color .35s,border-color .35s}
.btn.white:hover{background:var(--ink);color:#fff}
.btn.line:hover{background:#fff;color:var(--ink)}
.btn.sea{background:var(--ink)}.btn.sea:hover{background:var(--sea)}
.btn.ghost{border-color:var(--ink)}.btn.ghost:hover{background:var(--ink);color:#fff}
.lnk{position:relative;font-size:.68rem;letter-spacing:.2em;font-weight:600;color:var(--ink)}
.lnk::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1px;background:var(--gold-d);transform:scaleX(.3);transform-origin:left;transition:transform .4s}
.lnk:hover{text-decoration:none}.lnk:hover::after{transform:scaleX(1)}
/* quick strip */
.quick a{padding:30px 26px}
.quick .ic{width:26px;height:26px;color:var(--gold-d)}
.quick b{font-family:var(--serif);font-weight:400;font-size:1.15rem}
/* intro & quote */
.intro .ph{aspect-ratio:4/5}
.quote{border-left:0;padding-left:0;font-size:1.4rem;position:relative;padding-top:26px}
.quote::before{content:"“";position:absolute;top:-18px;left:-4px;font-family:var(--serif);font-size:4.4rem;color:var(--gold);line-height:1}
/* explore grid */
.explore{gap:12px}
.ex{min-height:360px;border-radius:var(--r);padding:30px}
.ex.big{min-height:480px}
.ex .t{font-size:2.1rem;font-weight:400}
.ex .go{position:relative;align-self:flex-start;padding-bottom:4px}
.ex .go::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .5s}
.ex:hover .go::after{transform:scaleX(1)}
.rail{grid-auto-columns:minmax(300px,1fr);gap:22px}
.hl .ph{aspect-ratio:4/5}
.hl h3{font-size:1.45rem;margin-top:18px}
/* day & seasons */
.day li{padding-top:28px}
.day b{font-family:var(--serif);font-weight:400;font-size:1.4rem}
.day .hr{font-family:var(--serif);font-style:italic;font-size:1.05rem;letter-spacing:0;color:var(--gold-d)}
.season{border-top-color:var(--gold)}
.season h3{font-weight:400;font-size:1.8rem}
/* place cards: portrait editorial */
.pgrid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:64px 32px}
.pcard .ph{aspect-ratio:4/5}
.pcard .kicker{color:var(--gold-d);font-size:.66rem;letter-spacing:.22em}
.pcard h3{font-size:1.55rem;font-weight:400}
.facts-list div{grid-template-columns:110px 1fr;font-size:.88rem;padding:10px 0}
.facts-list dd{font-weight:500}
.chip{border-color:transparent;background:var(--paper);color:var(--text);font-size:.7rem;letter-spacing:.06em}
/* venue directory: hairline rows instead of boxes */
.vgrid{grid-template-columns:repeat(auto-fill,minmax(min(100%,520px),1fr));gap:0 64px;border-top:1px solid var(--ink)}
.vcard{border:0;border-bottom:1px solid var(--line);border-radius:0;padding:34px 0;background:transparent;gap:12px}
.vcard:hover{box-shadow:none;border-color:var(--line)}
.vcard::before{top:auto;bottom:-1px;height:1px;background:var(--gold-d)}
.vcard .bgic{display:none}
.vhead{font-size:.66rem;letter-spacing:.22em}
.vhead .vi{color:var(--gold-d)}
.vhead .vi .ic{width:18px;height:18px}
.vhead .rank{font-family:var(--serif);font-style:italic;font-size:1.05rem;letter-spacing:0;color:var(--gold-d)}
.vcard h3{font-size:1.65rem;font-weight:400}
.row{border-top:0;padding-top:4px}
.row .k{font-size:.62rem;letter-spacing:.22em;min-width:90px}
.row .num{font-family:var(--serif);font-size:1.15rem;font-weight:400;letter-spacing:.02em}
.cp{border-radius:2px;font-size:.6rem;letter-spacing:.18em;border-color:var(--line)}
.feature{border:0;background:var(--paper);border-radius:var(--r);margin-top:34px;padding:34px}
.feature b{font-weight:400}
/* groups, split, prose */
.ghead{border-bottom-color:var(--ink)}
.ghead h3{font-weight:400;font-size:1.8rem}
.prose p:first-child::first-letter{color:var(--gold-d)}
.timeline .yr,.route-line span{font-family:var(--serif);font-style:italic;font-size:1rem;letter-spacing:0;color:var(--gold-d)}
.route-line b,.timeline strong,.hood b,.exp b,.why b,.panel h3{font-weight:400}
.un.ws{background:#fff;border-color:var(--gold)}
.badge{color:var(--gold-d)}
.tier{border-radius:var(--r)}
.tier.hot{background:var(--ink);color:#fff;border-color:var(--ink)}
.tier.hot h3,.tier.hot .price{color:#fff}.tier.hot ul{color:rgb(255 255 255 / .8)}.tier.hot .tag{color:var(--gold)}
.emerg b{color:var(--ink);font-weight:400}
.emerg div{border-radius:var(--r)}
.onduty{border-left-color:var(--gold-d);border-radius:var(--r)}
/* band & next */
.band::after{background:linear-gradient(90deg,rgb(9 25 38 / .86),rgb(9 25 38 / .3))}
.nexta{width:76px;height:76px;border-color:var(--gold-d);color:var(--gold-d)}
.nexta:hover{background:var(--gold-d);border-color:var(--gold-d)}
/* footer navy */
footer{background:var(--ink);color:rgb(255 255 255 / .8);border-top:0}
footer .logo{color:#fff}
footer .foot p,footer .legal{color:rgb(255 255 255 / .6)}
footer .legal{border-top-color:rgb(255 255 255 / .12)}
#footNav a{color:rgb(255 255 255 / .85)}

/* ===== round 3: intros, history, transport, no page icons ===== */
main .ic,main .sic,.vhead .vi .ic,.quick .ic,.ghead > span:first-child:has(svg){display:none!important}
.arw{width:30px;height:30px}
.intro2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(36px,6vw,96px);align-items:start}
.itext h2{margin:14px 0 24px}
.itext p{font-size:1.06rem;line-height:1.85;color:var(--text);max-width:60ch}
.itext p+p{margin-top:18px}
.ifacts{display:grid;grid-template-columns:1fr 1fr;gap:0 28px;margin:34px 0 0;border-top:1px solid var(--ink)}
.ifacts div{padding:14px 0;border-bottom:1px solid var(--line)}
.ifacts dt{font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-d);font-weight:600}
.ifacts dd{margin:4px 0 0;font-family:var(--serif);font-size:1.15rem;color:var(--ink)}
.dishes{margin-top:34px}
.dishes h3{font-size:1.4rem;margin-bottom:14px}
.dishes ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.dishes li{padding:8px 14px;border:1px solid var(--line);border-radius:999px;font-size:.88rem;background:#fff}
.ipics{display:grid;gap:14px;position:sticky;top:110px}
.ipics.n1 .ph{aspect-ratio:4/5}
.ipics.n2{grid-template-columns:1fr 1fr}.ipics.n2 .ph:first-child{grid-column:1/-1;aspect-ratio:4/3}.ipics.n2 .ph:last-child{grid-column:2;aspect-ratio:1;margin-top:-90px;border:8px solid #fff}
.ipics.n3{grid-template-columns:1fr 1fr}.ipics.n3 .ph:first-child{grid-column:1/-1;aspect-ratio:16/11}.ipics.n3 .ph:not(:first-child){aspect-ratio:1}
@media (max-width:900px){.intro2{grid-template-columns:1fr}.ipics{position:static}.ipics.n2 .ph:last-child{margin-top:0;border:0}.ifacts{grid-template-columns:1fr}}
.quote.big{max-width:900px;margin:0 auto;text-align:center;font-size:clamp(1.6rem,3vw,2.3rem);padding-top:40px}
.quote.big::before{left:50%;transform:translateX(-50%);top:-24px}
.quote.big small{font-size:.78rem;max-width:60ch;margin:16px auto 0}
.hist{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.hist li{display:grid;grid-template-columns:150px minmax(0,1fr);gap:24px 40px;padding:34px 0;border-bottom:1px solid var(--line)}
.hist li.wimg{grid-template-columns:150px minmax(0,1fr) minmax(0,.8fr)}
.hist .yr{font-family:var(--serif);font-style:italic;font-size:1.5rem;color:var(--gold-d);line-height:1.2}
.hist h3{font-size:1.6rem;margin-bottom:10px}
.hist p{color:var(--text);max-width:62ch}
.hist .ph{aspect-ratio:4/3}
@media (max-width:900px){.hist li,.hist li.wimg{grid-template-columns:1fr;gap:10px}}
.btable{display:grid;gap:0;border-top:1px solid var(--ink)}
.brow{display:grid;grid-template-columns:260px minmax(0,1fr);gap:12px 30px;padding:20px 0;border-bottom:1px solid var(--line);align-items:start}
.bh b{display:block;font-family:var(--serif);font-weight:400;font-size:1.3rem;color:var(--ink)}
.bh span{font-size:.84rem;color:var(--muted)}
.btimes{display:flex;flex-wrap:wrap;gap:6px}
.btimes span{font-variant-numeric:tabular-nums;font-size:.86rem;padding:6px 10px;background:#fff;border:1px solid var(--line);border-radius:2px;color:var(--ink)}
@media (max-width:760px){.brow{grid-template-columns:1fr}}
.fares{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:24px}
.fares h4{margin:0 0 12px;font-family:var(--serif);font-weight:400;font-size:1.25rem;color:var(--ink)}
.fares dl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
.fares dl div{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--line);font-size:.92rem}
.fares dd{margin:0;font-variant-numeric:tabular-nums;color:var(--ink);font-weight:500}

/* menu scene */
@keyframes sunpulse{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.12);opacity:1}}
@keyframes sail{from{transform:translateX(0)}to{transform:translateX(calc(100vw + 360px))}}
@keyframes fly{0%{transform:translate(0,0)}25%{transform:translate(28vw,-30px)}50%{transform:translate(55vw,10px)}75%{transform:translate(80vw,-20px)}100%{transform:translate(110vw,0)}}
@keyframes flap{0%,100%{transform:scaleY(1)}50%{transform:scaleY(-.5)}}
@keyframes fall{0%{transform:translate(0,-20px) rotate(0)}25%{transform:translate(30px,25vh) rotate(120deg)}50%{transform:translate(-20px,50vh) rotate(220deg)}75%{transform:translate(25px,75vh) rotate(320deg)}100%{transform:translate(0,105vh) rotate(420deg);opacity:.2}}
/* beach clubs: photo behind each card */
.vgrid.clubs{border-top:0;gap:22px;grid-template-columns:repeat(auto-fill,minmax(min(100%,360px),1fr))}
.vcard.club{position:relative;isolation:isolate;overflow:hidden;min-height:520px;justify-content:flex-end;padding:30px 28px 38px;border:0;border-radius:6px;background:#10283B;color:#fff;box-shadow:0 24px 50px -34px rgb(16 40 59 / .7)}
.vcard.club::before{display:none}
.vcard.club>.cbg{position:absolute!important;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transform:scale(1.02);transition:transform 1.6s cubic-bezier(.2,.7,.2,1)}
.vcard.club:hover>.cbg{transform:scale(1.09)}
.vcard.club>.cshade{position:absolute!important;inset:0;z-index:-1;background:linear-gradient(180deg,rgb(10 26 40 / .05) 0%,rgb(10 26 40 / .25) 30%,rgb(10 26 40 / .78) 62%,rgb(10 26 40 / .92) 100%)}
.vcard.club>.crep{position:absolute!important;left:16px;top:14px;font:500 .58rem var(--sans);letter-spacing:.18em;text-transform:uppercase;color:rgb(255 255 255 / .85);background:rgb(0 0 0 / .28);backdrop-filter:blur(4px);padding:5px 9px;border-radius:999px}
.vcard.club>.credit{position:absolute!important;bottom:12px;right:16px;max-width:70%;font-size:.58rem;color:rgb(255 255 255 / .6)}
.vcard.club .vhead{margin-top:auto}.vcard.club .acts{margin-top:6px}
.vcard.club h3,.vcard.club p{text-shadow:0 1px 12px rgb(0 0 0 / .35)}
.vcard.club h3{color:#fff;font-size:1.9rem}
.vcard.club p,.vcard.club .row,.vcard.club .row span,.vcard.club .row small{color:rgb(255 255 255 / .86)}
.vcard.club .vhead,.vcard.club .vhead .vi,.vcard.club .vhead .rank{color:var(--gold)}
.vcard.club .row .k{color:rgb(255 255 255 / .6)}
.vcard.club .row .num{color:#fff}
.vcard.club .row.muted{opacity:.75}
.vcard.club .chip{background:rgb(255 255 255 / .16);color:#fff;backdrop-filter:blur(4px)}
.vcard.club .cp{color:#fff;border-color:rgb(255 255 255 / .4);background:transparent}
.vcard.club .lnk{color:#fff}.vcard.club .lnk::after{background:var(--gold)}
.vgrid.clubs .feature{margin-top:0;display:flex;flex-direction:column;justify-content:center;gap:18px;min-height:260px}
@media (max-width:600px){.vcard.club{min-height:480px;padding:26px 20px 36px}}
.vgrid.boats{grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr));gap:0 48px;border-top:0}
.actjump{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:44px}
.actjump a{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border:1px solid var(--line);border-radius:999px;font:500 .78rem var(--sans);letter-spacing:.04em;color:var(--ink);text-decoration:none;background:#fff;transition:background .25s,color .25s,border-color .25s}
.actjump a i{font-style:normal;font-size:.68rem;color:var(--gold-d)}
.actjump a:hover{background:var(--ink);color:#fff;border-color:var(--ink)}.actjump a:hover i{color:var(--gold)}
.adir{columns:3 300px;column-gap:56px}
.adg{break-inside:avoid;margin-bottom:34px}
.adg h3{font-size:1.25rem;font-weight:400;padding-bottom:10px;border-bottom:1px solid var(--ink);margin-bottom:6px}
.adg ul{list-style:none;margin:0;padding:0}
.adg li{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--line);font-size:.9rem}
.adg li a{font-family:var(--serif);color:var(--sea);text-decoration:none;white-space:nowrap}
.adg li em{font-style:normal;color:var(--muted);font-size:.8rem;white-space:nowrap}
/* legibility: soft scrim + shadow behind text that sits on photos */
.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgb(9 25 38 / .5) 0%,rgb(9 25 38 / .32) 34%,rgb(9 25 38 / .08) 62%,transparent 80%)}
.hero h1,.hero .lead,.hero .eyebrow,.hero .crumbs,.hero nav{text-shadow:0 1px 2px rgb(0 0 0 / .22),0 4px 24px rgb(0 0 0 / .32)}
.ex::after{background:linear-gradient(0deg,rgb(9 25 38 / .86) 0%,rgb(9 25 38 / .42) 42%,rgb(9 25 38 / .08) 75%,transparent)}
.ex .t,.ex .b,.ex .go,.mapcta h2,.mapcta p{text-shadow:0 1px 2px rgb(0 0 0 / .25),0 3px 16px rgb(0 0 0 / .3)}
.band h2,.band p{text-shadow:0 2px 18px rgb(0 0 0 / .25)}
@media (max-width:760px){.hero::before{background:linear-gradient(180deg,transparent 25%,rgb(9 25 38 / .35) 55%,rgb(9 25 38 / .55) 100%)}}
/* ---- legibility over photos: soft scrim behind text, consistent with the palette ---- */
.hero .hin{position:relative}
.hero .hin::before{content:"";position:absolute;z-index:-1;pointer-events:none;left:-10vw;top:22%;bottom:-8%;width:min(1180px,120vw);background:radial-gradient(ellipse 62% 70% at 28% 62%,rgb(9 25 38 / .5) 0%,rgb(9 25 38 / .3) 42%,rgb(9 25 38 / 0) 74%)}
.hero h1,.hero .lead{text-shadow:0 1px 2px rgb(0 0 0 / .28),0 6px 30px rgb(0 0 0 / .38)}
.hero .crumbs,.hero .eyebrow{text-shadow:0 1px 6px rgb(0 0 0 / .45)}
.ex .t,.ex .b,.ex .go{text-shadow:0 1px 2px rgb(0 0 0 / .3),0 4px 18px rgb(0 0 0 / .35)}
.band .wrap,.mapcta > *{text-shadow:0 1px 2px rgb(0 0 0 / .25),0 4px 22px rgb(0 0 0 / .3)}
/* ---- more motion ---- */
@keyframes up2{from{opacity:0;transform:translateY(42px) scale(.985)}to{opacity:1;transform:none}}
@keyframes clipin{from{clip-path:inset(12% 8% 12% 8% round 6px);opacity:.3}to{clip-path:inset(0 0 0 0 round 0);opacity:1}}
@keyframes heroPar{to{translate:0 16%}}
@keyframes heroText{to{translate:0 -60px;opacity:.2}}
@keyframes lineGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes shine{from{transform:translateX(-120%) skewX(-18deg)}to{transform:translateX(220%) skewX(-18deg)}}
@supports (animation-timeline: view()){
  .vgrid > *,.pgrid > *,.explore > *,.seasons > *,.exps > *,.adir > *,.ifacts > div,.un,.timeline > *,.hist > *,.dishes li,.tier,.actjump a{animation:up2 linear both;animation-timeline:view();animation-range:entry 0% entry 45%}
  .vgrid > *:nth-child(3n+2),.pgrid > *:nth-child(3n+2),.explore > *:nth-child(3n+2){animation-range:entry 6% entry 52%}
  .vgrid > *:nth-child(3n),.pgrid > *:nth-child(3n),.explore > *:nth-child(3n){animation-range:entry 12% entry 58%}
  .ipics .ph,.split > .ph,.intro .ph{animation:clipin linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
  .hero > img{animation:kb 16s cubic-bezier(.2,.6,.2,1) both,heroPar linear both;animation-timeline:auto,scroll(root);animation-range:normal,0 100vh}
  .hero .hin{animation:heroText linear both;animation-timeline:scroll(root);animation-range:0 90vh}
  .ghead,.sh{position:relative}
  .ghead::after{content:"";position:absolute;left:0;bottom:-1px;width:100%;height:2px;background:linear-gradient(90deg,var(--gold-d),var(--aqua));transform-origin:left;animation:lineGrow linear both;animation-timeline:view();animation-range:entry 10% cover 40%}
}
.btn{position:relative;overflow:hidden}
.btn::after{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(90deg,transparent,rgb(255 255 255 / .35),transparent);transform:translateX(-120%) skewX(-18deg);pointer-events:none}
.btn:hover::after{animation:shine .9s ease}
.vcard,.pcard{transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s}
.vcard:hover,.pcard:hover{transform:translateY(-6px)}
.vcard.club:hover{box-shadow:0 34px 60px -30px rgb(16 40 59 / .8)}
.nextpage svg,.arw{animation:floaty 2.6s ease-in-out infinite}
.chip{transition:background .3s,color .3s,transform .3s}.chip:hover{transform:translateY(-2px)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
/* ---- MapLibre map ---- */
#map3d.gl > canvas,#map3d.gl > .labels,#map3d.gl > .compass,#map3d.gl > .map-loading{display:none!important}
#map3d .glmap{position:absolute;inset:0}
#map3d.gl{background:#DDE9EE}
.glpin{position:relative;display:flex;flex-direction:column;align-items:center;border:0;background:none;padding:0;cursor:pointer;font:inherit}
.glpin i{display:block;width:14px;height:14px;border-radius:50%;background:var(--pc,#1D6B96);border:2.5px solid #fff;box-shadow:0 2px 8px rgb(0 0 0 / .35);transition:transform .3s}
.glpin.major i{width:18px;height:18px}
.glpin::after{content:"";width:2px;height:10px;background:#fff;box-shadow:0 1px 3px rgb(0 0 0 / .3)}
.glpin span{position:absolute;bottom:calc(100% + 6px);white-space:nowrap;font:600 .74rem var(--sans);letter-spacing:.02em;color:var(--ink);background:rgb(255 255 255 / .92);padding:4px 9px;border-radius:999px;box-shadow:0 6px 16px -6px rgb(16 40 59 / .45);opacity:0;transform:translateY(4px);transition:opacity .25s,transform .25s;pointer-events:none}
.glpin.lbl span,.glpin:hover span,.glpin.on span{opacity:1;transform:none}
.glpin:hover i,.glpin.on i{transform:scale(1.35)}
.glpin.on span{background:var(--ink);color:#fff}
.glpin.on i{animation:pinPulse 1.6s ease-out infinite}
@keyframes pinPulse{0%{box-shadow:0 0 0 0 rgb(255 255 255 / .9),0 2px 8px rgb(0 0 0 / .35)}100%{box-shadow:0 0 0 16px rgb(255 255 255 / 0),0 2px 8px rgb(0 0 0 / .35)}}
.glmode{position:absolute;top:16px;right:62px;z-index:4;display:flex;background:rgb(255 255 255 / .92);backdrop-filter:blur(10px);border-radius:999px;padding:4px;box-shadow:0 10px 24px -12px rgb(16 40 59 / .45)}
.glmode button{border:0;background:none;font:600 .74rem var(--sans);letter-spacing:.06em;padding:8px 14px;border-radius:999px;color:var(--ink);cursor:pointer}
.glmode button[aria-pressed="true"]{background:var(--ink);color:#fff}
#map3d.gl .mhint{display:none!important}
#map3d.gl #mapReset{z-index:4;top:auto;bottom:44px;right:12px}
.maplibregl-ctrl-attrib{font-size:10px}
@media (max-width:900px){.glmode{top:12px;right:56px}}
/* ---- tighter vertical rhythm ---- */
.s{padding-block:clamp(44px,5.5vw,88px)}
.s:not(.paper):not(.band) + .s:not(.paper):not(.band),.s.paper + .s.paper{padding-top:0}
.shead{margin-bottom:clamp(24px,3vw,40px)}
.group{margin-top:40px}
.intro-s{padding-block:clamp(44px,5vw,80px)}
.hero .hin{padding-block:calc(77px + clamp(96px,13vw,190px)) clamp(52px,6vw,80px)}
.hero.home .hin{padding-block:calc(77px + clamp(150px,20vw,290px)) clamp(56px,6vw,90px)}
.vcard{padding:26px 0}
/* ---- jump navigation, ticket rows, pharmacy button ---- */
.jumpnav{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:26px;padding-top:22px;border-top:1px solid var(--line)}
.jumpnav > span{width:100%;font:600 .66rem var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--gold-d)}
.jumpnav a{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:999px;background:var(--ink);color:#fff;text-decoration:none;font:600 .82rem var(--sans);letter-spacing:.03em;transition:transform .3s,background .3s,box-shadow .3s;box-shadow:0 10px 24px -14px rgb(16 40 59 / .7)}
.jumpnav a i{font-style:normal;color:var(--gold);transition:transform .3s}
.jumpnav a:hover{background:var(--sea);transform:translateY(-2px)}.jumpnav a:hover i{transform:translateY(3px)}
a.brow{color:inherit;text-decoration:none;border-radius:6px;transition:background .25s,box-shadow .25s;padding-inline:14px;margin-inline:-14px}
a.brow:hover{background:var(--paper);box-shadow:inset 3px 0 0 var(--sea)}
a.brow .tk{display:table;margin-top:10px;font:600 .7rem var(--sans);font-style:normal;letter-spacing:.14em;text-transform:uppercase;color:var(--sea);border-bottom:1px solid currentColor;padding-bottom:2px}
a.brow:hover .tk{color:var(--ink)}
.odacts{margin-top:14px}
.acts .lnk.menu{margin-left:18px}
/* intro: pictures no taller than the text needs */
.ipics{position:static}
.ipics.n2 .ph:first-child{aspect-ratio:16/10}.ipics.n2 .ph:last-child{aspect-ratio:4/3;margin-top:-70px}
.ipics.n3 .ph:first-child{aspect-ratio:16/10}
.intro2{align-items:center}
/* ---- ancient site detail pages ---- */
.pcard.has-detail .phlink{display:block;color:inherit}
.pcard.has-detail h3 a{color:inherit;text-decoration:none;background:linear-gradient(var(--gold-d),var(--gold-d)) 0 100%/0 1px no-repeat;transition:background-size .4s}
.pcard.has-detail:hover h3 a{background-size:100% 1px}
.pcard .detailbtn{align-self:flex-start;margin-top:4px}
.sitegrid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(280px,1fr);gap:clamp(32px,5vw,72px);align-items:start}
.sblock{margin-bottom:34px}
.sblock h2{font-size:clamp(1.6rem,2.4vw,2.1rem);font-weight:400;margin-bottom:14px}
.sblock p{font-size:1.04rem;line-height:1.8}
.sblock p.big{font-family:var(--serif);font-size:clamp(1.25rem,1.8vw,1.5rem);line-height:1.6;color:var(--ink);margin-top:12px}
.seelist{list-style:none;counter-reset:s;padding:0;margin:0;display:grid;gap:2px}
.seelist li{counter-increment:s;display:flex;gap:16px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--line);font-size:1rem}
.seelist li::before{content:counter(s,decimal-leading-zero);font-family:var(--serif);font-style:italic;color:var(--gold-d);min-width:28px}
.tipbox{background:var(--paper);border-left:3px solid var(--sea);padding:22px 26px;border-radius:4px}
.tipbox b{font:600 .7rem var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--sea)}
.tipbox p{margin-top:8px}
.siteside{position:sticky;top:100px;display:grid;gap:18px}
.factcard{background:#fff;border:1px solid var(--line);border-radius:8px;padding:26px;box-shadow:0 24px 50px -36px rgb(16 40 59 / .45)}
.factcard h3{font-size:1.3rem;font-weight:400;margin-bottom:10px}
.factcard dl{display:grid;margin:0}
.factcard dl div{display:grid;grid-template-columns:120px 1fr;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);font-size:.9rem}
.factcard dt{font:600 .64rem var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);padding-top:3px}
.factcard dd{margin:0;color:var(--ink)}
.factacts{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.sidepic{aspect-ratio:4/3}
@media (max-width:900px){.sitegrid{grid-template-columns:1fr}.siteside{position:static}}
/* ---- proportionate page heroes ---- */
.hero{display:flex;flex-direction:column;justify-content:flex-end;min-height:clamp(380px,58vh,580px)}
.hero .hin{width:100%;padding-block:calc(77px + 36px) clamp(46px,5vw,72px)}
.hero h1{font-size:clamp(2.4rem,5.2vw,4.4rem)}
.hero .lead{font-size:1.08rem;max-width:62ch}
.hero.home{min-height:clamp(540px,86vh,860px)}
.hero.home .hin{padding-block:calc(77px + 56px) clamp(56px,6vw,92px)}
.hero.home h1{font-size:clamp(3.2rem,8vw,6.6rem)}
.site-hero{min-height:clamp(420px,62vh,620px)}
@media (max-width:700px){.hero{min-height:clamp(340px,62vh,460px)}.hero.home{min-height:clamp(480px,82vh,700px)}}
.logo .mark{width:40px;height:40px;filter:drop-shadow(0 2px 6px rgb(0 0 0 / .18))}
.word .d{color:var(--gold-d);opacity:1;font-weight:600}
body.over .top:not(.solid) .word .d,footer .word .d,.menu .word .d{color:var(--gold)}
footer .word .k{color:#fff}
.logo{gap:13px}
.word .k{font-family:var(--sans);font-weight:700;font-size:1.2rem;letter-spacing:.3em}
.word .d{display:flex;align-items:center;gap:7px;color:#C8743F;letter-spacing:.42em}
.word .d::before,.word .d::after{content:"";width:12px;height:1px;background:currentColor;opacity:.75}
@font-face{font-family:"Marcellus";src:url("fonts/marcellus.woff2") format("woff2");font-display:swap;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}
@font-face{font-family:"Marcellus";src:url("fonts/marcellus-ext.woff2") format("woff2");font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF}
/* ---- brand: sun over island + Marcellus wordmark ---- */
.logo{gap:12px}
.logo .mark{width:60px;height:38px;filter:none}
.word{gap:5px}
.word .k{font-family:"Marcellus",var(--serif);font-weight:400;font-size:1.42rem;letter-spacing:.3em;line-height:1}
.word .d{font-family:var(--sans);font-weight:600;font-size:.56rem;letter-spacing:.5em;color:#D9733F;margin-left:.1em}
.word .d::before,.word .d::after{display:none}
body.over .top:not(.solid) .logo .isl{fill:#1B3D58}
footer .word .d,.menu .word .d{color:#F2A65A}
@media (max-width:620px){.logo .mark{width:44px;height:29px}.word .k{font-size:1.22rem}}
.emblem{display:block;width:210px;margin:-10px 0 6px -14px}.emblem svg{display:block;width:100%;height:auto}
/* ---- loading screen ---- */
#loader{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:#FBF8F2;transition:opacity .6s ease,visibility .6s}
#loader.done{opacity:0;visibility:hidden;pointer-events:none}
#loader.soft{background:rgb(251 248 242 / .92);backdrop-filter:blur(4px)}
#loader .ldin{display:flex;flex-direction:column;align-items:center;gap:18px;animation:ldUp .9s cubic-bezier(.2,.7,.2,1) both}
#loader svg{width:min(230px,58vw);height:auto}
#loader .spin{display:flex;gap:9px}
#loader .spin i{width:9px;height:9px;border-radius:50%;background:#EE8A4A;animation:ldDot 1.1s ease-in-out infinite}
#loader .spin i:nth-child(2){background:#57B3BE;animation-delay:.15s}#loader .spin i:nth-child(3){background:#10283B;animation-delay:.3s}
#loader .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@keyframes ldDot{0%,80%,100%{transform:translateY(0);opacity:.35}40%{transform:translateY(-9px);opacity:1}}
@keyframes ldUp{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
#loader .ldsun{transform-box:fill-box;transform-origin:center;animation:ldSun 3.4s cubic-bezier(.45,0,.55,1) infinite}
#loader .ldw1{transform-box:fill-box;transform-origin:center;animation:ldW1 2.6s ease-in-out infinite}
#loader .ldw2{transform-box:fill-box;transform-origin:center;animation:ldW2 2.6s ease-in-out infinite}
@keyframes ldSun{0%,100%{transform:translateY(0)}45%,55%{transform:translateY(36px)}}
@keyframes ldW1{0%,100%{transform:translateX(-7px) scaleX(.96)}50%{transform:translateX(7px) scaleX(1.04)}}
@keyframes ldW2{0%,100%{transform:translateX(8px) scaleX(1.03);opacity:.45}50%{transform:translateX(-8px) scaleX(.95);opacity:.85}}
#loader .ldtx{font:600 .64rem var(--sans);letter-spacing:.32em;text-transform:uppercase;color:var(--muted);margin-top:-6px}
/* header emblem (readable DISCOVER arc) */
.logo .mark.hmark{width:76px;height:50px}
.hmark .harc{fill:#D9733F}.hmark .isl{fill:#17324A}
body.over .top:not(.solid) .hmark .harc{fill:#F7C36A}
body.over .top:not(.solid) .hmark .isl{fill:#FBF6EC}
body.over .top:not(.solid) .logo{filter:drop-shadow(0 2px 10px rgb(0 0 0 / .35))}
.logo .word .d{display:none}
.logo .word .k{font-size:1.5rem;letter-spacing:.28em}
@media (max-width:620px){.logo .mark.hmark{width:62px;height:41px}.logo .word .k{font-size:1.2rem}}
/* ---- floating island header ---- */
header.top{position:fixed;top:calc(10px + env(safe-area-inset-top,0px));left:12px;right:12px;margin:0 auto;max-width:1380px;width:auto;transform:none;border-radius:24px;border:1px solid rgb(16 40 59 / .08);background:rgb(255 255 255 / .84);-webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5);box-shadow:0 18px 44px -26px rgb(16 40 59 / .5);overflow:hidden;transition:background .4s,border-color .4s,box-shadow .4s,top .4s,width .4s}
body.over header.top{background:rgb(9 25 38 / .16);border-color:rgb(255 255 255 / .22);box-shadow:none}
header.top::after{content:"";position:absolute;left:0;right:0;bottom:0;height:6px;pointer-events:none;opacity:.9;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 6'%3E%3Cpath d='M0 3 Q15 0 30 3 T60 3 T90 3 T120 3' fill='none' stroke='%2357B3BE' stroke-width='1.4'/%3E%3C/svg%3E") repeat-x 0 0/120px 6px;animation:hdrWave 9s linear infinite}
header.top::before{content:"";position:absolute;left:0;right:0;bottom:0;height:6px;pointer-events:none;opacity:.55;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 6'%3E%3Cpath d='M0 3 Q20 6 40 3 T80 3 T120 3 T160 3' fill='none' stroke='%23F2A65A' stroke-width='1.2'/%3E%3C/svg%3E") repeat-x 0 0/160px 6px;animation:hdrWave2 14s linear infinite}
@keyframes hdrWave{to{background-position:-120px 0}}@keyframes hdrWave2{to{background-position:160px 0}}
body.over main{margin-top:0}
#mapPage{padding-top:96px}
.bar{height:70px;gap:18px}
header.top .wrap.bar{max-width:none;padding-inline:clamp(14px,2vw,26px)}
#hinfo{display:flex;align-items:center;gap:14px;margin-left:auto;font:600 .7rem var(--sans);letter-spacing:.08em;white-space:nowrap}
#hinfo .hi{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:999px;background:rgb(16 40 59 / .05)}
body.over #hinfo .hi{background:rgb(255 255 255 / .14)}
#hinfo svg{width:16px;height:16px;flex-shrink:0}
#hinfo .t{font-variant-numeric:tabular-nums}
#hinfo small{font:500 .62rem var(--sans);letter-spacing:.14em;text-transform:uppercase;opacity:.7}
#menuBtn{display:inline-flex!important;align-items:center;gap:10px;margin-left:0;border:0;padding:11px 18px 11px 14px;border-radius:999px;background:var(--ink);color:#fff;font:600 .7rem var(--sans);letter-spacing:.2em;box-shadow:0 8px 20px -10px rgb(16 40 59 / .6);transition:transform .3s,background .3s}
body.over #menuBtn{background:#fff;color:var(--ink)}
#menuBtn:hover{transform:translateY(-1px);background:var(--sea)}body.over #menuBtn:hover{background:var(--gold);color:var(--ink)}
#menuBtn .mw{width:22px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
#menuBtn .mw path{transition:transform .5s}
#menuBtn:hover .mw path:nth-child(1){transform:translateX(-2px)}#menuBtn:hover .mw path:nth-child(3){transform:translateX(2px)}
#navList{display:none!important}
.langs{gap:2px;padding:3px;border-radius:999px;background:rgb(16 40 59 / .05)}
body.over .langs{background:rgb(255 255 255 / .14)}
.langs button{padding:7px 9px;border-radius:999px;opacity:.75;text-decoration:none!important}
.langs button[aria-pressed="true"]{opacity:1;background:var(--ink);color:#fff}
body.over .langs button[aria-pressed="true"]{background:#fff;color:var(--ink)}
@media (max-width:1100px){#hinfo .sun{display:none}}
@media (max-width:820px){#hinfo{display:none}#menuBtn{margin-left:auto!important}}
@media (max-width:620px){header.top{top:calc(8px + env(safe-area-inset-top,0px));left:8px;right:8px;border-radius:20px;overflow:visible}header.top::before,header.top::after{border-radius:0 0 20px 20px}header.top{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgb(255 255 255 / .96)}body.over header.top{background:rgb(9 25 38 / .38)}.bar{height:62px}.langs,body.over .langs{background:#fff}.langs button{white-space:nowrap}#menuBtn{padding:10px 14px}#menuLbl{display:none}}
/* ---- "Ne yapmak istersiniz?" compact chooser ---- */
.todo{padding-block:clamp(40px,5vw,72px)}
.todohead{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 30px;margin-bottom:26px}
.todohead h2{font-size:clamp(1.7rem,2.6vw,2.3rem);font-weight:400;margin:0}
.todochips{display:flex;flex-wrap:wrap;gap:8px}
.todochips button{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:999px;padding:9px 16px;font:600 .74rem var(--sans);letter-spacing:.04em;cursor:pointer;transition:background .3s,color .3s,border-color .3s,transform .3s}
.todochips button:hover{transform:translateY(-2px);border-color:var(--ink)}
.todochips button[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.todogrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.td{position:relative;display:grid;grid-template-columns:76px minmax(0,1fr) auto;align-items:center;gap:14px;padding:12px 16px 12px 12px;background:#fff;border:1px solid var(--line);border-radius:14px;color:var(--ink);text-decoration:none;overflow:hidden;isolation:isolate;transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s,border-color .45s,opacity .35s}
.td::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,rgb(87 179 190 / .0) 30%,rgb(242 166 90 / .14) 60%,rgb(87 179 190 / .0) 80%);transform:translateX(-100%);transition:transform .8s ease}
.td:hover{transform:translateY(-4px);box-shadow:0 22px 40px -26px rgb(16 40 59 / .55);border-color:#E4D6BD}
.td:hover::before{transform:translateX(100%)}
.tdi{width:76px;height:76px;border-radius:10px;overflow:hidden;display:block}
.tdi img,.tdi canvas{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.td:hover .tdi img{transform:scale(1.14) rotate(1.5deg)}
.tdt{display:grid;gap:3px;min-width:0}
.tdt b{font:400 1.12rem var(--serif);line-height:1.15}
.tdt small{font-size:.78rem;color:var(--muted);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tda{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--paper);color:var(--ink);font-size:.9rem;transition:transform .4s,background .4s,color .4s}
.td:hover .tda{transform:translateX(4px) rotate(-8deg);background:#D9733F;color:#fff}
.td.off{display:none}
.td.pop{animation:tdPop .55s cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--d,0ms)}
@keyframes tdPop{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){.todogrid > .td:not(.pop){animation:tdPop linear both;animation-timeline:view();animation-range:entry 0% entry 40%}}
@media (max-width:1200px){.todogrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:860px){.todogrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.todogrid{grid-template-columns:1fr 1fr;gap:10px}.td{grid-template-columns:1fr;padding:8px 8px 12px;gap:8px;border-radius:12px}.tdi{width:100%;height:84px}.tdt small{display:none}.tdt b{font-size:1rem}.tda{position:absolute;right:12px;top:12px;width:26px;height:26px;background:rgb(255 255 255 / .9)}.todochips{overflow-x:auto;flex-wrap:nowrap;margin-inline:-16px;padding-inline:16px}.todochips button{flex-shrink:0}}
/* ---- "Kaçırmayın" compact rail ---- */
.dmwrap{position:relative}
.dm{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(200px,19vw,250px);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 14px;scrollbar-width:none}
.dm::-webkit-scrollbar{display:none}
.dmc{position:relative;scroll-snap-align:start;display:block;aspect-ratio:4/5;border-radius:14px;overflow:hidden;isolation:isolate;color:#fff;text-decoration:none;box-shadow:0 18px 36px -28px rgb(16 40 59 / .7);transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s}
.dmi,.dmi img,.dmi canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;z-index:-2;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.dmc::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgb(9 25 38 / .85) 0%,rgb(9 25 38 / .25) 45%,transparent 70%)}
.dmc:hover{transform:translateY(-6px);box-shadow:0 30px 50px -30px rgb(16 40 59 / .8)}
.dmc:hover .dmi img{transform:scale(1.1)}
.dmk{position:absolute;left:12px;top:12px;font:700 .62rem var(--sans);letter-spacing:.12em;text-transform:uppercase;background:rgb(255 255 255 / .9);color:var(--ink);padding:6px 10px;border-radius:999px}
.dmt{position:absolute;left:14px;right:14px;bottom:14px;display:flex;align-items:flex-end;justify-content:space-between;gap:10px}
.dmt b{font:400 1.18rem/1.15 var(--serif);text-shadow:0 2px 12px rgb(0 0 0 / .4)}
.dmt i{font-style:normal;flex-shrink:0;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#D9733F;transform:scale(.6);opacity:0;transition:transform .4s,opacity .4s}
.dmc:hover .dmt i{transform:scale(1);opacity:1}
.dmnav{position:absolute;top:calc(50% - 26px);z-index:3;width:44px;height:44px;border-radius:50%;border:0;background:#fff;color:var(--ink);font:400 1.6rem/1 var(--serif);box-shadow:0 10px 24px -12px rgb(16 40 59 / .6);cursor:pointer;transition:transform .3s,background .3s,color .3s}
.dmnav:hover{background:var(--ink);color:#fff;transform:scale(1.08)}
.dmnav.prev{left:-18px}.dmnav.next{right:-18px}
@supports (animation-timeline: view()){.dm > .dmc{animation:tdPop linear both;animation-timeline:view(inline);animation-range:entry 0% entry 60%}}
@media (max-width:760px){.dmnav{display:none}.dm{grid-auto-columns:62vw}}

@media (max-width:620px){.crumb{flex-wrap:wrap;gap:4px 8px;font-size:.64rem;letter-spacing:.1em}.crumb>*{white-space:nowrap}}
@media (max-width:520px){.fares dl{grid-template-columns:1fr!important}.fares dl>div{display:flex;justify-content:space-between;gap:12px}}
#langChip{display:none}
@media (max-width:620px){header.top .langs{display:none!important}#langChip{display:inline-flex;align-items:center;gap:4px;margin-left:auto;margin-right:8px;border:1px solid currentColor;background:none;color:inherit;border-radius:999px;padding:8px 11px;font:600 .66rem var(--sans);letter-spacing:.12em;cursor:pointer}#langChip::after{content:"";width:5px;height:5px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px)}}
/* images always fill their aspect-ratio frame */
.pcard .ph>img,.pcard .ph>canvas,.intro .ph>img,.hl .ph>img,.split .ph>img,.split .ph>canvas,.ipics .ph>img,.hist .ph>img,#mapInfo .ph>img,.ph>.phlink>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ph>.phlink{position:absolute;inset:0;display:block}
.ph>.credit{z-index:2}
@media (prefers-reduced-motion:reduce){.hero .slide:first-of-type{opacity:1!important}}
/* ===== Menu overlay — editorial travel-guide style ===== */
#menu{position:fixed;inset:0;z-index:95;color:#fff;background:#0A2233;overflow:hidden;--mx:calc(100% - 120px);--my:44px}
#menu[hidden]{display:none!important}
#menu:not([hidden]){animation:mnOpen .8s cubic-bezier(.7,0,.2,1) both}
#menu.closing{animation:mnClose .5s cubic-bezier(.7,0,.3,1) both}
@keyframes mnOpen{from{clip-path:circle(0 at var(--mx) var(--my))}to{clip-path:circle(150vmax at var(--mx) var(--my))}}
@keyframes mnClose{from{clip-path:circle(150vmax at var(--mx) var(--my))}to{clip-path:circle(0 at var(--mx) var(--my))}}
.mn-bg{position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 90% at 0% 0%,#123D5A 0%,transparent 60%),radial-gradient(90% 80% at 100% 100%,#0F4B6B 0%,transparent 55%),linear-gradient(180deg,#0A2233,#081B29)}
.mn-glow{position:absolute;width:520px;height:520px;border-radius:50%;left:-160px;top:-200px;background:radial-gradient(circle,rgb(238 138 74 / .22),transparent 65%);animation:mnGlow 14s ease-in-out infinite alternate}
@keyframes mnGlow{to{transform:translate(120px,80px) scale(1.15)}}
.mn-lines{position:absolute;inset:auto 0 0 0;width:100%;height:100%;opacity:.5}
.mn-lines path{fill:none;stroke:rgb(231 203 146 / .14);stroke-width:1.2;stroke-dasharray:6 10;animation:mnDash 30s linear infinite}
.mn-lines path+path{stroke:rgb(87 179 190 / .14);animation-duration:40s}
.mn-lines path+path+path{stroke:rgb(255 255 255 / .07);animation-duration:55s;animation-direction:reverse}
@keyframes mnDash{to{stroke-dashoffset:-800}}
.mn{position:relative;z-index:2;height:100%;display:grid;grid-template-rows:auto 1fr auto;max-width:1400px;margin:0 auto;padding:max(18px,env(safe-area-inset-top)) clamp(18px,4vw,56px) 22px;overflow-y:auto}
.mn-top{display:flex;align-items:center;gap:18px;padding-bottom:18px;border-bottom:1px solid rgb(255 255 255 / .1)}
.mnlogo{color:#fff!important;text-decoration:none;display:flex;align-items:center;gap:10px}
.mnlogo .word .d{color:var(--gold)!important}.mnlogo .word .k{color:#fff!important}
.mn-live{margin-left:auto;display:flex;gap:10px;font:600 .68rem var(--sans);letter-spacing:.1em;white-space:nowrap}
.mn-live .hi{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:999px;background:rgb(255 255 255 / .07);border:1px solid rgb(255 255 255 / .08)}
.mn-live svg{width:15px;height:15px}.mn-live small{opacity:.7;font-size:inherit;text-transform:uppercase}
#menuClose{display:inline-flex;align-items:center;gap:12px;border:0;background:none;color:#fff;font:600 .7rem var(--sans);letter-spacing:.22em;text-transform:uppercase;cursor:pointer;padding:6px 0 6px 10px}
#menuClose::after{content:"";width:44px;height:44px;border-radius:50%;border:1px solid rgb(255 255 255 / .35);background:linear-gradient(45deg,transparent 48.5%,#fff 48.5% 51.5%,transparent 51.5%) center/16px 16px no-repeat,linear-gradient(-45deg,transparent 48.5%,#fff 48.5% 51.5%,transparent 51.5%) center/16px 16px no-repeat;transition:transform .5s cubic-bezier(.2,.7,.2,1),background-color .3s,border-color .3s}
#menuClose:hover::after{transform:rotate(90deg);background-color:var(--gold);border-color:var(--gold)}
.mn-body{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:clamp(28px,4vw,64px);padding:clamp(22px,4vh,44px) 0;min-height:0}
.mn-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px clamp(18px,2.6vw,40px);align-content:start}
.mn-g h4{margin:0 0 14px;font:600 .66rem var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--gold);display:flex;align-items:center;gap:10px;opacity:0;animation:mnFade .6s .35s both}
.mn-g h4::before{content:"";width:22px;height:1px;background:currentColor}
.mn-g ul{list-style:none;margin:0;padding:0}
.mn-g li{overflow:hidden;border-bottom:1px solid rgb(255 255 255 / .07)}
.mn-a{position:relative;display:flex;align-items:baseline;gap:12px;padding:13px 0;color:#fff;text-decoration:none;transform:translateY(105%);animation:mnUp .8s cubic-bezier(.2,.75,.2,1) both;animation-delay:calc(.3s + var(--i)*45ms)}
.mn-a .n{font:500 .62rem var(--sans);letter-spacing:.12em;color:rgb(255 255 255 / .38);font-variant-numeric:tabular-nums;width:18px;flex-shrink:0;transition:color .3s}
.mn-a .l{font-family:var(--serif);font-size:clamp(1.3rem,1.75vw,1.85rem);line-height:1.12;letter-spacing:-.005em;transition:transform .45s cubic-bezier(.2,.7,.2,1),color .3s}
.mn-a .ar{margin-left:auto;align-self:center;opacity:0;transform:translateX(-10px);transition:.4s cubic-bezier(.2,.7,.2,1);color:var(--gold);font-size:1rem}
.mn-a .th{display:none}
.mn-a::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.mn-a:hover .l,.mn-a.on .l,.mn-a:focus-visible .l{transform:translateX(6px);color:var(--gold)}
.mn-a:hover .n,.mn-a.on .n{color:var(--gold)}
.mn-a:hover .ar,.mn-a.on .ar{opacity:1;transform:none}
.mn-a:hover::after,.mn-a.on::after{transform:scaleX(1)}
.mn-a.cur .l::after{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--gold);margin-left:10px;vertical-align:middle}
@keyframes mnUp{from{transform:translateY(105%)}to{transform:none}}
@keyframes mnFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.mn-vis{position:relative;border-radius:22px;overflow:hidden;min-height:380px;align-self:stretch;box-shadow:0 40px 80px -40px rgb(0 0 0 / .7);opacity:0;animation:mnPic 1.1s .25s cubic-bezier(.2,.7,.2,1) both}
@keyframes mnPic{from{opacity:0;transform:translateY(30px) scale(.96);clip-path:inset(18% 0 0 0 round 22px)}to{opacity:1;transform:none;clip-path:inset(0 0 0 0 round 22px)}}
.mn-pics,.mn-pics img,.mn-pics canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mn-pics img,.mn-pics canvas{opacity:0;transform:scale(1.12);transition:opacity .7s ease,transform 1.6s cubic-bezier(.2,.7,.2,1);filter:saturate(1.08) contrast(1.05)}
.mn-pics .on{opacity:1;transform:scale(1);animation:mnKen 14s 1.6s ease-in-out infinite alternate}
@keyframes mnKen{to{transform:scale(1.07) translate(-1.5%,-1%)}}
.mn-vis::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgb(8 27 41 / .88) 0%,rgb(8 27 41 / .3) 45%,transparent 70%),linear-gradient(90deg,rgb(8 27 41 / .25),transparent 40%)}
.mn-cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:clamp(20px,2.6vw,34px)}
.mn-eb{display:inline-block;font:600 .62rem var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:10px}
.mn-cap b{display:block;font:400 clamp(1.8rem,2.8vw,2.8rem)/1.05 var(--serif);text-shadow:0 2px 20px rgb(0 0 0 / .35)}
.mn-cap p{margin:10px 0 0;max-width:36ch;font-size:.95rem;line-height:1.5;opacity:.88}
.mn-cap.sw b,.mn-cap.sw p,.mn-cap.sw .mn-eb{animation:mnFade .5s cubic-bezier(.2,.7,.2,1) both}
.mn-cap.sw p{animation-delay:.06s}
.mn-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:18px;border-top:1px solid rgb(255 255 255 / .1);opacity:0;animation:mnFade .6s .6s both}
.mn-quick{display:flex;flex-wrap:wrap;gap:10px}
.mn-quick a{display:inline-flex;align-items:center;gap:9px;padding:10px 16px;border-radius:999px;border:1px solid rgb(255 255 255 / .16);color:#fff;text-decoration:none;font:600 .74rem var(--sans);letter-spacing:.04em;transition:background .3s,border-color .3s,transform .3s}
.mn-quick a:hover{background:rgb(255 255 255 / .1);border-color:rgb(255 255 255 / .35);transform:translateY(-2px)}
.mn-quick a i{width:8px;height:8px;border-radius:50%;background:#4CC38A;box-shadow:0 0 0 0 rgb(76 195 138 / .6);animation:mnPing 2s infinite}
.mn-quick a.sos i{background:#E5484D;box-shadow:0 0 0 0 rgb(229 72 77 / .6)}
.mn-quick a small{opacity:.65;font-weight:500}
@keyframes mnPing{70%{box-shadow:0 0 0 9px transparent}100%{box-shadow:0 0 0 0 transparent}}
.langs.mnl{display:flex;gap:4px;padding:4px;border-radius:999px;background:rgb(255 255 255 / .06);border:1px solid rgb(255 255 255 / .1)}
.langs.mnl button{border:0;background:none;color:rgb(255 255 255 / .75);font:600 .7rem var(--sans);letter-spacing:.1em;padding:8px 12px;border-radius:999px;cursor:pointer;transition:.25s}
.langs.mnl button:hover{color:#fff}
.langs.mnl button[aria-pressed="true"]{background:#fff;color:var(--ink)}
@media (max-width:1180px){.mn-nav{grid-template-columns:repeat(2,minmax(0,1fr))}.mn-g:nth-child(3){grid-column:1/-1}.mn-g:nth-child(3) ul{display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(18px,2.6vw,40px)}}
@media (max-width:900px){
 .mn-body{grid-template-columns:1fr;padding-top:18px}.mn-vis{display:none}.mn-live{display:none}
 .mn-nav{grid-template-columns:1fr;gap:22px}.mn-g:nth-child(3) ul{display:block}
 .mn-a{padding:10px 0;align-items:center}.mn-a .n{display:none}
 .mn-a .th{display:block;width:46px;height:46px;border-radius:12px;overflow:hidden;flex-shrink:0;position:relative;background:rgb(255 255 255 / .08)}
 .mn-a .th img,.mn-a .th canvas{width:100%;height:100%;object-fit:cover}
 .mn-a .l{font-size:1.45rem}.mn-a .ar{opacity:.6;transform:none}
 .mn-a small.b{display:block}
 .mn-foot{flex-direction:column;align-items:stretch}.langs.mnl{justify-content:space-between}.langs.mnl button{flex:1}
 #menuClose{font-size:0;gap:0;margin-left:auto}
 .mn{grid-template-rows:auto auto auto;align-content:start}
 #menu .langs.mnl{position:static;transform:none;left:auto;bottom:auto;box-shadow:none;background:rgb(255 255 255 / .06);color:#fff;padding:4px;display:flex!important}#menu .langs.mnl button{display:block!important}.mn-body{min-height:auto}
}
.mn-a .tx{display:flex;flex-direction:column;gap:3px;min-width:0}
.mn-a small.b{display:none;font-size:.78rem;color:rgb(255 255 255 / .55);line-height:1.3}
.mn-feat{grid-column:1/-1;margin-top:clamp(10px,3vh,30px)}
.mn-feat h4{margin:0 0 14px;font:600 .66rem var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--gold);display:flex;align-items:center;gap:10px;opacity:0;animation:mnFade .6s .55s both}
.mn-feat h4::before{content:"";width:22px;height:1px;background:currentColor}
.mn-fr{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.mn-fr a{position:relative;display:block;aspect-ratio:4/3;border-radius:14px;overflow:hidden;color:#fff;text-decoration:none;opacity:0;animation:mnFade .7s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(.6s + var(--i)*80ms)}
.mn-fr img,.mn-fr canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.mn-fr a::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgb(8 27 41 / .85),transparent 65%);transition:background .4s}
.mn-fr a:hover img{transform:scale(1.08)}
.mn-fr span{position:absolute;left:12px;right:12px;bottom:10px;z-index:2;display:flex;flex-direction:column;gap:2px}
.mn-fr small{font:600 .58rem var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.mn-fr b{font:400 1.05rem/1.15 var(--serif)}
@media (max-width:900px){.mn-fr{grid-template-columns:repeat(2,minmax(0,1fr))}.mn-feat{margin-top:4px}}
@media (prefers-reduced-motion:reduce){#menu,#menu *{animation:none!important;transition:none!important}.mn-a{transform:none}.mn-vis,.mn-foot,.mn-g h4{opacity:1}}
