@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&display=swap');

:root { --cream:#fff8e7; --ink:#17324d; --blue:#087eae; --coral:#f06449; --turquoise:#35b7b3; --lemon:#f2c94c; --pink:#c0447c; --line:rgba(23,50,77,.13); --shadow:0 18px 45px rgba(23,50,77,.14); font-family:'DM Sans',system-ui,sans-serif; color:var(--ink); background:var(--cream); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; background:var(--cream); }
button { font:inherit; color:inherit; cursor:pointer; }
button:focus-visible,a:focus-visible { outline:3px solid var(--lemon); outline-offset:3px; }
.skip-link { position:fixed; left:12px; top:-70px; z-index:100; background:var(--ink); color:#fff; padding:10px 14px; border-radius:8px; }
.skip-link:focus { top:12px; }
.site-header { height:72px; padding:10px clamp(16px,3vw,42px); display:flex; align-items:center; gap:24px; background:rgba(255,248,231,.93); backdrop-filter:blur(12px); position:sticky; top:0; z-index:40; border-bottom:1px solid var(--line); }
.brand { text-decoration:none; color:var(--ink); display:grid; line-height:1.02; min-width:220px; }
.brand-kicker,.brand-year { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.13em; color:var(--blue); }
.brand strong { font-family:Fraunces,serif; font-size:18px; letter-spacing:-.04em; }
.top-nav { display:flex; gap:4px; margin-left:auto; }
.nav-link { border:0; background:transparent; padding:10px 12px; border-radius:999px; font-weight:700; font-size:14px; }
.nav-link:hover,.nav-link.is-active { background:#fff; color:var(--blue); box-shadow:0 2px 10px rgba(23,50,77,.08); }
.today-chip { border:1px solid rgba(8,126,174,.18); background:#e6f7fb; border-radius:999px; padding:10px 13px; font-size:13px; font-weight:700; white-space:nowrap; }
.today-chip span { color:var(--coral); margin-right:5px; }
.day-rail { display:flex; gap:8px; overflow:auto; padding:10px clamp(16px,3vw,42px); border-bottom:1px solid var(--line); background:#fffdf7; scrollbar-width:none; position:sticky; top:72px; z-index:35; }
.day-rail::-webkit-scrollbar { display:none; }
.day-pill { display:flex; align-items:center; gap:8px; flex:0 0 auto; border:1px solid var(--line); background:#fff; padding:7px 11px 7px 7px; border-radius:999px; color:#567085; }
.day-pill b { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; color:#fff; background:var(--day); font-size:13px; }
.day-pill span { font-size:12px; font-weight:700; }
.day-pill.is-active { color:var(--ink); border-color:var(--day); box-shadow:0 4px 14px color-mix(in srgb,var(--day) 26%,transparent); }
.section-shell { width:min(1220px,calc(100% - 40px)); margin-inline:auto; }
.hero { height:min(660px,calc(100dvh - 132px)); min-height:520px; position:relative; overflow:hidden; color:#fff; }
.hero img { position:absolute; width:100%; height:100%; object-fit:cover; object-position:center; }
.hero-scrim { position:absolute; inset:0; background:linear-gradient(90deg,rgba(10,57,78,.78),rgba(10,57,78,.22) 56%,rgba(10,57,78,.04)),linear-gradient(0deg,rgba(10,57,78,.35),transparent 50%); }
.hero-copy { position:relative; z-index:1; display:flex; height:100%; flex-direction:column; justify-content:center; padding:clamp(34px,7vw,104px); max-width:720px; }
.eyebrow { margin:0 0 11px; color:inherit; font-size:11px; letter-spacing:.16em; font-weight:800; text-transform:uppercase; opacity:.82; }
.hero h1,.day-intro h1,.memories-hero h1 { font-family:Fraunces,serif; font-size:clamp(46px,7vw,88px); line-height:.96; letter-spacing:-.065em; margin:0; }
.hero-subtitle { margin:20px 0; max-width:430px; font-size:18px; line-height:1.45; }
.hero-status { display:flex; flex-direction:column; gap:2px; width:max-content; max-width:100%; padding:11px 14px; border-left:3px solid var(--lemon); background:rgba(255,255,255,.12); backdrop-filter:blur(5px); margin-bottom:22px; }
.hero-status span { font-size:13px; opacity:.86; }
.primary-button { border:0; width:max-content; background:var(--lemon); padding:13px 18px; font-weight:800; border-radius:999px; color:var(--ink); box-shadow:0 8px 16px rgba(0,0,0,.15); }
.primary-button span { margin-left:12px; }
.hero-stamp { position:absolute; right:clamp(20px,5vw,80px); bottom:28px; display:flex; align-items:center; gap:8px; z-index:2; padding:10px 14px; border-radius:999px; background:var(--coral); box-shadow:var(--shadow); }
.hero-stamp span { font-family:Fraunces,serif; font-size:38px; line-height:.8; }.hero-stamp small { font-weight:700; text-transform:uppercase; font-size:10px; letter-spacing:.1em; }
.section-heading { display:flex; justify-content:space-between; gap:20px; align-items:end; margin-bottom:22px; }.section-heading h2 { font-family:Fraunces,serif; font-size:clamp(30px,4vw,47px); letter-spacing:-.05em; margin:0; }.section-heading>p { max-width:300px; line-height:1.5; color:#557083; font-size:14px; margin:0; }
.overview-map-section { padding-top:70px; }.map { background:#e6f7fb; overflow:hidden; border-radius:24px; border:1px solid var(--line); }.overview-map { height:420px; }.leaflet-container { position:relative; outline:0; }.leaflet-pane,.leaflet-tile,.leaflet-marker-icon,.leaflet-marker-shadow,.leaflet-tile-container,.leaflet-pane>svg,.leaflet-pane>canvas,.leaflet-zoom-box { position:absolute; left:0; top:0; }.leaflet-pane{z-index:400}.leaflet-tile-pane{z-index:200}.leaflet-overlay-pane{z-index:400}.leaflet-marker-pane{z-index:600}.leaflet-control{position:relative;z-index:800}.leaflet-control-zoom{position:absolute;right:10px;bottom:10px}.leaflet-control-attribution { position:absolute; right:0; bottom:0; z-index:800; font-size:9px!important; background:rgba(255,255,255,.72); }.custom-marker { background:transparent!important; border:0!important; }.custom-marker span { display:grid; place-items:center; width:34px; height:34px; color:#fff; border-radius:50%; background:var(--marker); border:3px solid #fff; box-shadow:0 3px 10px rgba(23,50,77,.25); font-size:15px; }
.days-section { padding:84px 0; }.text-button { border:0; background:none; color:var(--blue); font-weight:800; padding:8px 0; }.day-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:13px; }.day-card { min-height:215px; display:flex; flex-direction:column; padding:18px; border-radius:18px; border:1px solid var(--line); background:#fff; border-top:6px solid var(--day); transition:transform .22s ease,box-shadow .22s ease; }.day-card:hover { transform:translateY(-4px); box-shadow:var(--shadow); }.day-card-top { display:flex; justify-content:space-between; font-size:11px; color:#567085; font-weight:700; }.day-card h3 { font-family:Fraunces,serif; letter-spacing:-.045em; line-height:1.05; font-size:24px; margin:17px 0 10px; }.day-card p { font-size:13px; line-height:1.45; color:#607687; margin:0; }.day-card-footer { display:flex; justify-content:space-between; align-items:center; margin-top:auto; padding-top:16px; font-size:11px; color:#607687; }.day-card-footer b { color:var(--day); }.postcard-section { display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:end; padding:80px max(20px,calc((100% - 1160px)/2)); color:#fff; background:var(--blue); }.postcard-section h2 { font-family:Fraunces,serif; font-size:clamp(34px,5vw,64px); line-height:.95; letter-spacing:-.06em; margin:0; }.postcard-section>p { line-height:1.7; max-width:400px; opacity:.88; }
.day-intro { display:grid; grid-template-columns:auto 1fr auto; gap:26px; align-items:center; padding:46px 0 32px; }.day-number { display:grid; place-items:center; width:82px; height:82px; color:#fff; background:var(--day); border-radius:20px; transform:rotate(-5deg); }.day-number span { font-size:10px; text-transform:uppercase; font-weight:800; letter-spacing:.14em; }.day-number strong { font-family:Fraunces,serif; font-size:42px; line-height:.8; }.day-intro h1 { font-size:clamp(38px,5.2vw,68px); color:var(--ink); }.day-intro .eyebrow { color:var(--day); }.day-summary { max-width:660px; margin:13px 0 0; font-size:16px; line-height:1.55; color:#557083; }.meal-list { display:grid; gap:6px; justify-items:end; }.meal-list span { color:var(--ink); border-bottom:2px solid var(--day); font-size:12px; font-weight:800; padding-bottom:3px; }.meal-list small { color:#607687; font-size:11px; margin-top:6px; }.day-layout { display:grid; grid-template-columns:minmax(330px,.78fr) minmax(0,1.22fr); gap:42px; padding-bottom:90px; }.map-panel { position:sticky; top:136px; height:max-content; }.map-caption { font-size:12px; font-weight:800; margin:0 0 10px; }.route-dot { display:inline-block; width:10px; height:10px; margin-right:7px; border-radius:50%; background:var(--day); }.day-map { height:calc(100dvh - 235px); min-height:460px; }.recenter { margin-top:12px; border:1px solid var(--line); border-radius:999px; background:#fff; padding:9px 13px; font-size:12px; font-weight:700; }.day-content { min-width:0; }.timeline-section { padding-bottom:34px; }.timeline { list-style:none; padding:0 0 0 18px; margin:0; border-left:1px solid var(--line); }.timeline li { position:relative; }.timeline li::before { content:''; position:absolute; width:9px; height:9px; left:-23px; top:20px; background:var(--day); border:3px solid var(--cream); border-radius:50%; }.stop-item { width:100%; display:flex; gap:13px; align-items:center; text-align:left; padding:13px 0; background:none; border:0; border-bottom:1px solid var(--line); }.stop-icon { display:grid; place-items:center; width:34px; height:34px; flex:0 0 auto; color:#fff; background:var(--day); border-radius:11px; }.stop-item b,.stop-item small { display:block; }.stop-item b { font-size:14px; }.stop-item small { font-size:12px; color:#607687; margin-top:3px; }.stop-item i { margin-left:auto; font-style:normal; color:var(--day); }.story-card { padding:26px; color:#fff; background:var(--day); border-radius:20px; margin:0 0 28px; }.story-card h2 { margin:0 0 12px; font-family:Fraunces,serif; letter-spacing:-.05em; font-size:34px; }.story-card p:not(.eyebrow) { line-height:1.65; margin:0; }.practical-section { padding:0 0 30px; }.practical-section .eyebrow,.flavor-card .eyebrow,.gallery-section .eyebrow { color:var(--day); }.practical-list { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.practical-list>div { display:flex; gap:10px; padding:12px; background:#fff; border:1px solid var(--line); border-radius:13px; }.practical-list span { display:grid; place-items:center; width:24px; height:24px; flex:0 0 auto; color:var(--day); background:color-mix(in srgb,var(--day) 12%,white); border-radius:8px; }.practical-list p { font-size:12px; line-height:1.4; margin:3px 0 0; }.flavor-card { padding:21px 23px; border:1px solid color-mix(in srgb,var(--day) 38%,white); background:color-mix(in srgb,var(--day) 8%,white); border-radius:18px; margin-bottom:48px; }.flavor-card p:last-child { margin:0; font-family:Fraunces,serif; font-size:25px; letter-spacing:-.04em; }.gallery-section small { color:#607687; font-size:11px; max-width:200px; text-align:right; }.photo-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }.photo-card,.memory-card { position:relative; display:block; border:0; padding:0; overflow:hidden; border-radius:15px; background:#d8e9e8; min-height:185px; text-align:left; }.photo-card img,.memory-card img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:var(--photo-pos); transition:transform .4s ease; }.photo-card::after,.memory-card::after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,rgba(23,50,77,.78),transparent 62%); }.photo-card:hover img,.memory-card:hover img { transform:scale(1.06); }.photo-card span,.photo-card i { z-index:1; position:absolute; color:#fff; bottom:12px; }.photo-card span { left:13px; font-size:12px; font-weight:800; }.photo-card i { right:13px; font-style:normal; }.photo-card.photo-0 { grid-row:span 2; min-height:380px; }.photo-card.photo-3 { min-height:120px; }.memories-hero { padding:72px 0 45px; }.memories-hero h1 { font-size:clamp(45px,6vw,76px); }.memories-hero>p:last-child { max-width:620px; color:#557083; line-height:1.65; font-size:16px; }.memory-grid { columns:4 220px; column-gap:14px; padding-bottom:100px; }.memory-card { width:100%; margin:0 0 14px; min-height:180px; break-inside:avoid; }.memory-card:nth-child(3n) { min-height:280px; }.memory-card span { position:absolute; z-index:1; color:#fff; left:14px; right:14px; bottom:13px; font-size:13px; font-weight:800; }.memory-card small { display:block; font-size:10px; letter-spacing:.1em; text-transform:uppercase; opacity:.8; margin-bottom:3px; }.bottom-nav { display:none; }
dialog { border:0; box-shadow:var(--shadow); }.lightbox { width:min(1100px,94vw); height:min(800px,91dvh); max-width:none; padding:0; overflow:hidden; background:#10283d; color:#fff; }.lightbox::backdrop,.info-dialog::backdrop { background:rgba(9,31,47,.68); backdrop-filter:blur(5px); }.lightbox figure { margin:0; height:100%; display:grid; place-items:center; }.lightbox img { width:100%; height:100%; object-fit:contain; }.lightbox figcaption { position:absolute; left:18px; right:18px; bottom:18px; font-weight:700; text-align:center; }.lightbox-close,.lightbox-prev,.lightbox-next,.dialog-close { position:absolute; z-index:2; border:0; color:#fff; background:rgba(255,255,255,.16); display:grid; place-items:center; border-radius:50%; }.lightbox-close,.dialog-close { right:16px; top:16px; width:38px; height:38px; font-size:28px; }.lightbox-prev,.lightbox-next { top:50%; transform:translateY(-50%); width:45px; height:45px; font-size:36px; }.lightbox-prev { left:16px; }.lightbox-next { right:16px; }.info-dialog { width:min(520px,92vw); border-radius:23px; padding:38px; color:var(--ink); background:var(--cream); }.info-dialog h2 { font-family:Fraunces,serif; letter-spacing:-.05em; font-size:37px; line-height:1; margin:0 0 18px; }.info-dialog p { line-height:1.6; color:#557083; }.info-dialog .eyebrow { color:var(--blue); }.dialog-close { color:var(--ink); background:#fff; }.notice { padding:12px; border-radius:12px; color:var(--ink)!important; background:#e6f7fb; font-size:13px; }.secondary-button { border:0; border-radius:999px; padding:11px 17px; font-weight:800; color:#fff; background:var(--blue); }
@media (max-width:900px) { .day-grid { grid-template-columns:repeat(2,1fr); }.day-layout { grid-template-columns:1fr; gap:28px; }.map-panel { position:relative; top:auto; }.day-map { height:380px; min-height:0; }.day-intro { grid-template-columns:auto 1fr; }.meal-list { grid-column:2; justify-items:start; display:flex; gap:12px; flex-wrap:wrap; }.meal-list small { width:100%; }.hero { min-height:500px; }.overview-map { height:370px; } }
@media (max-width:620px) { .site-header { height:64px; padding:9px 16px; }.brand { min-width:0; }.brand strong { font-size:15px; }.top-nav,.today-chip { display:none; }.day-rail { top:64px; padding:8px 14px; }.section-shell { width:min(100% - 28px,1220px); }.hero { height:calc(100dvh - 116px); min-height:480px; }.hero-copy { padding:28px; }.hero h1 { font-size:47px; }.hero-stamp { right:15px; bottom:18px; }.overview-map-section { padding-top:48px; }.overview-map { height:310px; border-radius:18px; }.section-heading { align-items:start; flex-direction:column; }.section-heading>p { max-width:100%; }.days-section { padding:56px 0; }.day-grid { grid-template-columns:1fr; }.day-card { min-height:188px; }.postcard-section { grid-template-columns:1fr; gap:20px; padding:55px 22px 100px; }.day-intro { grid-template-columns:auto 1fr; gap:17px; padding:31px 0 22px; }.day-number { width:60px; height:60px; border-radius:16px; }.day-number strong { font-size:30px; }.day-intro h1 { font-size:39px; }.day-summary { font-size:14px; }.meal-list { grid-column:1/-1; }.day-layout { padding-bottom:95px; }.map-panel { width:100%; }.day-map { height:330px; }.practical-list { grid-template-columns:1fr; }.photo-grid { grid-template-columns:1fr 1fr; }.photo-card.photo-0 { min-height:300px; }.gallery-section small { text-align:left; }.bottom-nav { display:flex; justify-content:space-around; gap:8px; padding:8px max(14px,env(safe-area-inset-left)) calc(8px + env(safe-area-inset-bottom)); position:fixed; left:0; right:0; bottom:0; z-index:50; border-top:1px solid var(--line); background:rgba(255,253,247,.95); backdrop-filter:blur(13px); }.bottom-nav button { display:grid; gap:2px; place-items:center; min-width:72px; border:0; background:none; padding:4px 8px; color:#6c8493; font-size:18px; }.bottom-nav span { font-size:10px; font-weight:800; }.bottom-nav button.is-active { color:var(--blue); }.memory-grid { columns:2 145px; }.memories-hero { padding:45px 0 30px; }.lightbox-prev,.lightbox-next { width:36px; height:36px; font-size:28px; }.lightbox-prev { left:7px; }.lightbox-next { right:7px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition-duration:.01ms!important; animation-duration:.01ms!important; } }