* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.6 var(--sans); }
a { color:inherit; text-underline-offset:4px; }
header { border-bottom:1px solid var(--line); }
.bar { display:flex; align-items:center; gap:16px; max-width:1120px; margin:auto; padding:12px 16px; }
.brand { color:var(--ink); font-weight:750; text-decoration:none; }
.sp { flex:1; }
.language-label { display:flex; align-items:center; gap:8px; font-size:14px; }
.language-label select { min-height:44px; border:1px solid var(--control, var(--line)); color:var(--ink); background:var(--card); padding:8px; font-size:14px; border-radius:4px; }
main { max-width:1120px; margin:auto; padding:40px 16px calc(32px + env(safe-area-inset-bottom,0px)); }
.intro { margin-bottom:32px; }
.eyebrow { margin:0 0 12px; color:var(--ink2); font-size:14px; }
h1 { max-width:20ch; margin:0 0 16px; font-size:clamp(32px,5vw,52px); line-height:1.15; font-weight:750; letter-spacing:-.035em; text-wrap:balance; word-break:keep-all; }
.lead { margin:0; max-width:55ch; color:var(--ink2); }
.quick-plan { display:flex; flex-wrap:wrap; gap:8px 20px; margin-top:16px; }
.quick-plan a { display:inline-flex; align-items:center; min-height:44px; padding:6px 0; font-weight:700; }
.destinations { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; }
.country { min-width:0; border-top:1px solid var(--line); padding-top:20px; }
.photo-link { display:block; }
.photo-link img { display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; border-radius:2px; background:var(--soft); }
.country-heading { display:flex; align-items:baseline; gap:12px; margin:20px 0 8px; }
h2 { font-size:28px; font-weight:750; margin:0; line-height:1.2; }
.country-local { font-size:16px; color:var(--ink2); }
.country p { margin:8px 0 12px; }
.country .availability { font-size:14px; color:var(--ink2); min-height:68px; max-width:48ch; }
.country-go { display:inline-flex; align-items:center; min-height:48px; padding:10px 16px; border:1px solid var(--accent); border-radius:4px; background:var(--accent); color:var(--accent-ink); font-weight:700; text-decoration:none; }
.country-go:hover, .country-go:focus-visible { background:var(--pastel); color:var(--pastel-ink); border-color:var(--pastel-strong); text-decoration:underline; }
.country .credit { font-size:14px; color:var(--ink2); margin-top:16px; }
.credit a { display:inline-block; padding:6px 0; }
footer { margin-top:40px; border-top:1px solid var(--line); padding-top:20px; color:var(--ink2); font-size:14px; }
.preview-note { margin-top:8px; }
.main-section { border-top:1px solid var(--line); margin-top:36px; padding-top:24px; }
.main-section h2 { font-size:24px; }
.main-section > p, .source-note { color:var(--ink2); }
.weather-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
.weather { min-width:0; padding-bottom:16px; }
.weather h3 { margin:8px 0 12px; }
.weather select, .weather button { min-height:44px; font:inherit; color:var(--ink); background:var(--card); border:1px solid var(--control,var(--line)); border-radius:4px; padding:6px 10px; }
.weather button { display:block; margin-top:12px; cursor:pointer; }
.weather-value { font-size:20px; margin-bottom:8px; }
.weather-time, .weather-stale, .weather-source, .source-note { font-size:14px; overflow-wrap:anywhere; }
.weather-time { white-space:pre-line; }
.weather-stale { color:var(--ink2); }
.ideas, .official-links { padding-left:20px; }
.ideas a, .official-links a { display:inline-block; padding:10px 0; }
.place-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.place-card { min-width:0; border:1px solid var(--line); border-radius:4px; overflow:hidden; background:var(--card); display:flex; flex-direction:column; }
.place-image { display:block; }
.place-image img { display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; background:var(--soft); }
.place-body { padding:14px; display:flex; flex-direction:column; flex:1; }
.place-body small { color:var(--ink2); }
.place-body h3 { margin:2px 0 6px; font-size:21px; line-height:1.3; }
.place-body p { margin:0 0 10px; font-size:14px; }
.place-body > a { display:flex; align-items:center; min-height:44px; margin-top:auto; font-size:14px; font-weight:700; }
.photo-credits { margin-top:20px; color:var(--ink2); font-size:14px; }
.photo-credits summary { min-height:44px; padding:10px 0; cursor:pointer; }
.photo-credits ul { padding-left:20px; }
.photo-credits a { display:inline-block; padding:5px 0; }
.weather-photo { display:block; width:100%; height:128px; object-fit:cover; border-radius:4px; background:var(--soft); }
.weather-photo-note { font-size:12px; color:var(--ink2); margin:4px 0 12px; }
.weather-symbol { display:inline-block; width:24px; height:24px; vertical-align:middle; margin-right:8px; }
.official-links { list-style:none; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 24px; }
.official-links li { display:flex; align-items:baseline; gap:10px; }
.official-links li::before { content:'↗'; color:var(--ink2); }
a:focus-visible, summary:focus-visible { outline:2px solid var(--ink); outline-offset:4px; }
@media(max-width:700px) { .place-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .place-body { padding:10px; } .place-body h3 { font-size:19px; } .official-links { grid-template-columns:1fr; } }
@media(max-width:700px) { .weather-grid { grid-template-columns:1fr; gap:8px; } .bar { flex-wrap:wrap; gap:8px; } }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media(max-width:700px) { main { padding-top:28px; } .destinations { grid-template-columns:1fr; gap:32px; } .country .availability { min-height:0; } .language-label span { position:absolute; clip-path:inset(50%); width:1px; height:1px; overflow:hidden; } }