
/* metric-matched fallbacks so the swap to the web fonts does not move the text (measured 2026-09-27: Fraunces 600 = Times New Roman x 1.115, Inter = Arial x 1.04); fixes CLS on the hero headings */
@font-face { font-family: 'Fraunces Fallback'; src: local('Times New Roman'), local('TimesNewRomanPSMT'), local('Times'), local('Noto Serif'), local('Droid Serif'); size-adjust: 112%; ascent-override: 88%; descent-override: 22%; line-gap-override: 0%; }
@font-face { font-family: 'Inter Fallback'; src: local('Arial'), local('ArialMT'), local('Helvetica'), local('Roboto'); size-adjust: 104%; ascent-override: 93%; descent-override: 23%; line-gap-override: 0%; }
.updated { font-size: .85rem; color: #6b7b8c; margin: -.2rem 0 1rem; }
.updated a { color: inherit; }
:root { --gold:#c9a227; --gold-light:#e6c968; --dark:#0a1628; --card:#111f33; --text:#e8f0f7; }
* { box-sizing: border-box; margin: 0; padding: 0; }
html { overflow-x: hidden; max-width: 100%; scroll-behavior: smooth; }
body { background: var(--dark); color: var(--text); font-family: 'Inter', 'Inter Fallback', sans-serif; line-height: 1.7; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
a { color: var(--gold-light); }
.bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.1rem 1.5rem; border-bottom: 1px solid rgba(201,162,39,0.18); background: rgba(10,22,40,0.95); position: sticky; top: 0; z-index: 5; }
.logo { font-family: 'Fraunces', 'Fraunces Fallback', serif; font-weight: 600; font-size: 1.3rem; color: #fff; text-decoration: none; white-space: nowrap; }
.logo img { width: 30px; height: 30px; border-radius: 50%; vertical-align: middle; margin-right: 8px; }
.back { color: var(--gold-light); text-decoration: none; font-size: 0.9rem; }
.back:hover { text-decoration: underline; }
.crumbs { max-width: 1100px; margin: 0 auto; padding: 1rem 1.5rem 0; font-size: .82rem; color: rgba(255,255,255,.6); }
.crumbs a { text-decoration: none; }
.crumbs a:hover { text-decoration: underline; }
.hero { text-align: center; padding: 2.6rem 1.5rem 1.8rem; background: linear-gradient(180deg, rgba(201,162,39,0.10), rgba(10,22,40,0)); }
.eyebrow { font-family: 'Fraunces', 'Fraunces Fallback', serif; font-style: italic; color: var(--gold-light); font-size: 1.05rem; margin-bottom: .8rem; }
h1 { font-family: 'Fraunces', 'Fraunces Fallback', serif; font-weight: 600; font-size: clamp(2rem, 5.4vw, 3.4rem); line-height: 1.14; color: #fff; max-width: 900px; margin: 0 auto 1rem; }
h1 em { color: var(--gold-light); }
.lede { font-size: clamp(1.02rem, 2.2vw, 1.18rem); color: rgba(255,255,255,.86); max-width: 760px; margin: 0 auto .9rem; }
.facts { font-size: .92rem; color: rgba(255,255,255,.62); max-width: 720px; margin: 0 auto; }
.story-link { margin: 1.1rem auto 0; }
.story-link a { display: inline-flex; align-items: center; gap: .5rem; text-decoration: none; font-size: .9rem; font-weight: 600; color: var(--dark); background: linear-gradient(180deg, var(--gold-light), var(--gold)); padding: .55rem 1.1rem; border-radius: 999px; transition: transform .2s, box-shadow .2s; }
.story-link a:hover, .story-link a:focus-visible { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(201,162,39,.35); }

.wrap { max-width: 1100px; margin: 0 auto; padding: 1.4rem 1.5rem 3.4rem; }
h2 { font-family: 'Fraunces', 'Fraunces Fallback', serif; font-weight: 600; font-size: clamp(1.4rem, 3vw, 1.9rem); color: #fff; line-height: 1.25; margin: 2.4rem 0 1.1rem; }
h2 small { font-family: 'Inter', 'Inter Fallback', sans-serif; font-weight: 500; font-size: .85rem; color: rgba(255,255,255,.55); margin-left: .5rem; }
.tours { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 1rem; }
.tour { position: relative; display: flex; flex-direction: column; gap: .7rem; text-decoration: none; color: inherit; background: rgba(255,255,255,.03); border: 1px solid rgba(201,162,39,.22); border-radius: 16px; padding: 1.1rem 1.1rem 1rem; transition: transform .25s, border-color .25s, background .25s; }
.tour:hover, .tour:focus-visible { transform: translateY(-3px); border-color: rgba(201,162,39,.6); background: rgba(201,162,39,.05); }
.badge { align-self: flex-start; font-size: .72rem; font-weight: 600; letter-spacing: .04em; color: #0a1628; background: linear-gradient(90deg, var(--gold), #e6c968); border-radius: 999px; padding: .15rem .65rem; }
.tour-title { font-family: 'Fraunces', 'Fraunces Fallback', serif; font-weight: 600; font-size: 1.05rem; line-height: 1.3; color: #fff; }
.tour-meta { display: flex; align-items: center; gap: .8rem; margin-top: auto; font-size: .85rem; color: rgba(255,255,255,.7); }
.stars { color: var(--gold-light); font-weight: 600; }
.go { margin-left: auto; color: var(--gold-light); }
.more { margin-top: 1.2rem; display: flex; flex-wrap: wrap; gap: .6rem; }
.pill, .chip { text-decoration: none; color: #fff; font-size: .9rem; padding: .5rem 1.05rem; border-radius: 999px; border: 1px solid rgba(201,162,39,.35); background: rgba(255,255,255,.04); transition: border-color .2s, background .2s, color .2s; }
.pill:hover, .chip:hover { border-color: var(--gold); background: rgba(201,162,39,.14); color: var(--gold-light); }
.plan { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: .9rem; }
.plan-card { display: grid; grid-template-columns: 44px 1fr; grid-template-areas: "i t" "i d"; column-gap: .9rem; align-items: center; text-decoration: none; color: inherit; background: rgba(255,255,255,.03); border: 1px solid rgba(201,162,39,.18); border-radius: 14px; padding: .95rem 1.1rem; transition: transform .25s, border-color .25s, background .25s; }
.plan-card:hover { transform: translateY(-3px); border-color: rgba(201,162,39,.55); background: rgba(201,162,39,.05); }
.pi { grid-area: i; width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.25rem; background: rgba(201,162,39,.12); border: 1px solid rgba(201,162,39,.3); }
.pt { grid-area: t; font-weight: 600; color: #fff; }
.pd { grid-area: d; font-size: .85rem; color: rgba(255,255,255,.66); line-height: 1.45; }
.chips { display: flex; flex-wrap: wrap; gap: .55rem .6rem; }
.chip.all { border-color: var(--gold); color: var(--gold-light); }
.cities { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: .7rem; }
.city { display: grid; grid-template-columns: 34px 1fr; grid-template-areas: "e n" "e t"; column-gap: .7rem; align-items: center; text-decoration: none; color: inherit; background: rgba(255,255,255,.03); border: 1px solid rgba(201,162,39,.16); border-radius: 12px; padding: .65rem .9rem; transition: border-color .2s, background .2s; }
.city:hover { border-color: rgba(201,162,39,.55); background: rgba(201,162,39,.06); }
.ce { grid-area: e; font-size: 1.4rem; text-align: center; }
.cn { grid-area: n; font-weight: 600; color: #fff; line-height: 1.25; }
.ct { grid-area: t; font-size: .78rem; color: rgba(255,255,255,.55); }
.disclose { margin-top: 2.6rem; font-size: .84rem; color: rgba(255,255,255,.58); border-left: 3px solid rgba(201,162,39,.5); padding-left: .9rem; }
footer { border-top: 1px solid rgba(201,162,39,0.18); padding: 1.6rem 1.4rem 2.4rem; text-align: center; font-size: .86rem; color: rgba(255,255,255,.55); }
footer a { margin: 0 .6rem; text-decoration: none; }
footer a:hover { text-decoration: underline; }
@media (max-width: 600px) { .hero { padding: 2rem 1.2rem 1.4rem; } .wrap { padding: 1rem 1.2rem 2.6rem; } }

/* sunny theme (2026-09-21): bright travel look, matches the home page */
body { background: #f4fbff; color: #12304a; }
a { color: #0b6f95; }
.bar { background: rgba(255,255,255,.95); border-bottom: 1px solid rgba(18,48,74,.10); box-shadow: 0 4px 18px rgba(18,90,130,.08); }
.logo { color: #12304a; }
.back { color: #0b6f95; }
.crumbs { color: #4b6478; }
.hero { background: linear-gradient(180deg, #cdeefa 0%, #f4fbff 100%); }
.eyebrow { color: #0a6c8e; }
h1 { color: #12304a; }
h1 em { color: #b86e00; }
.lede { color: #26445c; }
.facts { color: #4b6478; }
.story-link a { color: #12304a; }

h2 { color: #12304a; }
h2 small { color: #4b6478; }
.tour, .plan-card, .city { background: #ffffff; border: 1px solid rgba(18,48,74,.10); box-shadow: 0 8px 24px rgba(18,90,130,.10); }
.tour:hover, .tour:focus-visible, .plan-card:hover, .city:hover { background: #ffffff; border-color: #0e86b0; box-shadow: 0 16px 36px rgba(18,90,130,.18); }
.tour-title, .pt, .cn { color: #12304a; }
.tour-meta, .pd, .ct { color: #4b6478; }
.stars { color: #9a5c00; }
.go { color: #0e86b0; }
.pill, .chip { background: #ffffff; color: #12304a; border-color: rgba(14,134,176,.35); }
.pill:hover, .chip:hover { background: #e3f4fb; border-color: #0e86b0; color: #12304a; }
.chip.all { color: #9a6b00; border-color: #c9a227; }
.pi { background: #e3f4fb; border-color: rgba(14,134,176,.3); }
.disclose { color: #4b6478; border-left-color: #0e86b0; }
/* polish 2026-10-13: readable small text on the light page + the story button / updated line were flush against the left edge */
.updated { color: #4b6478; }
.map-cap { color: #4b6478; }
.map-cap b { color: #8a6a12; }
body > .story-link, body > p.updated { max-width: 1100px; margin-left: auto; margin-right: auto; padding-left: 1.5rem; padding-right: 1.5rem; box-sizing: border-box; text-align: center; }
body > .story-link { margin-top: 0; }
body > p.updated { margin-top: 1.75rem; }
@media (max-width: 600px) { body > .story-link { margin-top: .4rem; } body > p.updated { margin-top: 1.4rem; } }
/* wide tables scroll sideways inside their box on phones: say so, the last column was silently cut off */
@media (max-width: 700px) { .cb-wrap::before, .eu-wrap::before, .climate-wrap::before { content: "Swipe sideways to see every column"; display: block; font-size: .78rem; color: #4b6478; padding: .35rem .6rem; background: #f4fbff; position: sticky; left: 0; } }
footer { color: #4b6478; border-top: 1px solid rgba(18,48,74,.12); background: #ffffff; }
.live-btn { cursor: pointer; font: inherit; font-size: .9rem; }
.gyg-box { margin-top: 1rem; }
.consent-ph { background: #ffffff; border: 1px solid rgba(18,48,74,.12); border-radius: 14px; padding: 1rem 1.1rem; color: #26445c; display: flex; flex-wrap: wrap; gap: .8rem; align-items: center; justify-content: space-between; }
.consent-ph .pill { cursor: pointer; font: inherit; font-size: .9rem; }
.guide-content { max-width: 760px; }
.guide-content h3 { font-family: 'Fraunces', 'Fraunces Fallback', serif; font-weight: 600; font-size: 1.1rem; color: #12304a; margin: 1.4rem 0 .4rem; }
.guide-content h3:first-of-type { margin-top: .6rem; }
.guide-content p { color: #26445c; line-height: 1.65; margin: 0 0 .3rem; }

/* best time to visit + FAQ (2026-09-23) */
.besttime { max-width: 860px; }
.besttime p { color: #26445c; margin: 0 0 .9rem; }
.climate { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: .3rem; margin: .2rem 0 .6rem; }
.cm { background: #ffffff; border: 1px solid rgba(18,48,74,.10); border-radius: 10px; padding: .5rem .2rem; text-align: center; display: flex; flex-direction: column; gap: .08rem; box-shadow: 0 6px 16px rgba(18,90,130,.07); }
.cm.best { border-color: #c9a227; background: #fffaf0; }
.cmm { font-size: .68rem; font-weight: 700; letter-spacing: .03em; color: #4b6478; text-transform: uppercase; }
.cmt { font-size: .95rem; font-weight: 700; color: #12304a; }
.cml { font-size: .78rem; color: #4b6478; }
.cmr { font-size: .68rem; color: #0b6f95; }
.climate-note { font-size: .78rem; color: #4b6478; }
.seatoday { font-weight: 600; color: #0b6f95; margin: .2rem 0 .6rem; }
.climate-wrap { overflow-x: auto; margin: .2rem 0 .6rem; }
.climate-table { border-collapse: collapse; width: 100%; font-size: .86rem; background: #ffffff; border: 1px solid rgba(18,48,74,.10); }
.climate-table th, .climate-table td { padding: .4rem .55rem; text-align: left; border-bottom: 1px solid rgba(18,48,74,.08); color: #26445c; white-space: nowrap; }
.climate-table td:last-child { white-space: normal; min-width: 14rem; }
.climate-table thead th { font-size: .72rem; letter-spacing: .03em; text-transform: uppercase; color: #4b6478; background: #f3f6f9; }
.climate-table tr.best th, .climate-table tr.best td { background: #fffaf0; }
.climate-table tr.best th { border-left: 3px solid #c9a227; }
.advisory p { color: #26445c; }
.sights { max-width: 860px; }
.sight-list { margin: .2rem 0 .6rem 1.3rem; padding: 0; }
.sight-list li { margin: .35rem 0; color: #26445c; line-height: 1.55; }
.sight-list strong { color: #12304a; }
.sg-d { color: #4b6478; font-size: .92em; }
.sg-note { font-size: .8rem; color: #4b6478; margin: .3rem 0 0; }
.rightnow { max-width: 860px; }
.rightnow[hidden] { display: none; }
.rn-card { background: #fff; border: 1px solid rgba(18,48,74,.10); box-shadow: 0 8px 24px rgba(18,90,130,.10); border-radius: 16px; padding: 1rem 1.2rem; }
.rn-row { display: flex; flex-wrap: wrap; gap: .45rem; margin: .2rem 0 .8rem; }
.rn-pill { font-size: .8rem; font-weight: 600; border-radius: 999px; padding: .2rem .7rem; border: 1px solid transparent; }
.rn-l1 { color: #1b7a43; border-color: rgba(27,122,67,.4); background: #e6f6ec; }
.rn-l2 { color: #8a5a00; border-color: rgba(201,162,39,.55); background: #fff6dd; }
.rn-l3 { color: #a24f00; border-color: rgba(200,110,0,.5); background: #fff0dc; }
.rn-l4 { color: #a11d1d; border-color: rgba(190,40,40,.45); background: #fde8e8; }
.rn-l0 { color: #4b6478; border-color: rgba(75,100,120,.35); background: #eef4f8; }
.rn-fc { border-collapse: collapse; width: 100%; font-size: .86rem; margin: .2rem 0 .6rem; }
.rn-fc th, .rn-fc td { padding: .35rem .5rem; text-align: left; border-bottom: 1px solid rgba(18,48,74,.08); color: #26445c; white-space: nowrap; }
.rn-fc thead th { font-size: .72rem; letter-spacing: .03em; text-transform: uppercase; color: #4b6478; background: #f3f6f9; }
.rn-note { font-size: .8rem; color: #4b6478; margin: .3rem 0 0; }
.rn-wrap { overflow-x: auto; }
.mjump { font-size: .82rem; color: #4b6478; margin: .2rem 0 .5rem; }
.mjump a { margin-right: .55rem; white-space: nowrap; }
.faq { max-width: 820px; }
.faq dl { margin: 0; }
.faq dt { font-family: 'Fraunces', 'Fraunces Fallback', serif; font-weight: 600; font-size: 1.05rem; color: #12304a; margin: 1.1rem 0 .35rem; }
.faq dd { margin: 0; color: #26445c; line-height: 1.65; }
.chip small { opacity: .7; font-size: .78em; }
@media (max-width: 760px) {
  .climate { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .35rem; }
}
@media (max-width: 420px) {
  .climate { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
/* ===== city photo hero (Marc 2026-10-14): full bright photo, no tint; thin navy glow around each word ===== */
header.hero.hero-photo{position:relative;overflow:hidden;min-height:380px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1.5rem;border-radius:0 0 28px 28px;background:#cdeefa;box-shadow:0 14px 34px rgba(18,48,74,.16)}
header.hero.hero-photo .hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 50%);z-index:0}
header.hero.hero-photo > *:not(.hero-img){position:relative;z-index:1}
header.hero.hero-photo .eyebrow{color:#ffd76a;font-weight:700;text-shadow:0 0 2px rgba(6,38,66,1),0 0 5px rgba(6,38,66,.95),0 0 10px rgba(6,38,66,.85),0 0 20px rgba(6,38,66,.7),0 0 34px rgba(6,38,66,.5)}
header.hero.hero-photo h1{color:#fff;text-shadow:0 0 2px rgba(6,38,66,1),0 0 5px rgba(6,38,66,.95),0 0 10px rgba(6,38,66,.85),0 0 20px rgba(6,38,66,.7),0 0 34px rgba(6,38,66,.5)}
header.hero.hero-photo h1 em{color:#ffd76a}
header.hero.hero-photo .lede,header.hero.hero-photo .facts{color:#fff;font-weight:600;-webkit-text-stroke:.45px rgba(6,38,66,.7);paint-order:stroke fill;text-shadow:0 0 1px #062642,0 0 2px #062642,0 0 5px rgba(6,38,66,1),0 0 10px rgba(6,38,66,.95),0 0 18px rgba(6,38,66,.85),0 0 30px rgba(6,38,66,.65)}
header.hero.hero-photo .eyebrow{-webkit-text-stroke:.35px rgba(6,38,66,.6);paint-order:stroke fill}
header.hero.hero-photo .hero-credit{position:absolute;right:.9rem;bottom:.5rem;z-index:1;font-size:.7rem;color:#fff;text-decoration:none;text-shadow:0 0 3px rgba(6,38,66,1),0 0 8px rgba(6,38,66,.9)}
header.hero.hero-photo .hero-credit:hover{text-decoration:underline}
@media(max-width:600px){header.hero.hero-photo{min-height:0;padding:2.2rem 1rem 2.4rem}}
