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

:root {
  --ink: #1c352d;
  --forest: #1f4a3d;
  --moss: #607860;
  --cream: #f7f1e5;
  --paper: #fffaf0;
  --clay: #c75e42;
  --sun: #e5b65c;
  --line: #d8d2c2;
  --muted: #626c61;
  --display: "Fraunces", Georgia, serif;
  --body: "Manrope", sans-serif;
  --mono: "DM Mono", monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--cream); font-family: var(--body); font-size: 16px; line-height: 1.6; }
body::before { content:""; position: fixed; inset:0; pointer-events:none; opacity:.12; z-index:20; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.28'/%3E%3C/svg%3E"); }
a { color: inherit; text-underline-offset: 3px; }
a:focus-visible, button:focus-visible { outline: 3px solid var(--clay); outline-offset: 4px; }
button { font: inherit; }
img { max-width: 100%; display:block; }
.wrap { max-width: 1170px; margin: 0 auto; padding: 0 28px; }
.eyebrow { font: 500 11px/1.2 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--clay); }
.skip { position:absolute; left: 14px; top: -50px; z-index:99; background:var(--clay); color:var(--paper); padding:10px 14px; font-weight:700; transition: top .2s; }
.skip:focus { top: 14px; }

.site-header { background:var(--paper); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:10; }
.header-row { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:28px; }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; font-family:var(--display); font-size:23px; font-weight:700; letter-spacing:-.04em; }
.brand img { width:31px; height:31px; object-fit:contain; object-position:left; }
.brand small { display:block; color:var(--muted); font:500 9px var(--mono); letter-spacing:.1em; text-transform:uppercase; margin-top:-3px; }
.nav { display:flex; align-items:center; gap:20px; }
.nav a { font-size:12px; font-weight:700; text-decoration:none; transition:color .2s; }
.nav a:hover { color:var(--clay); }
.header-actions { display:flex; gap:8px; }
.action-btn { border:1px solid var(--ink); color:var(--ink); background:transparent; border-radius:0; padding:9px 12px; cursor:pointer; font-size:11px; font-weight:700; letter-spacing:.02em; transition:background .2s, color .2s, transform .2s; }
.action-btn:hover { background:var(--ink); color:var(--paper); transform:translateY(-2px); }

.hero { background:var(--forest); color:var(--paper); overflow:hidden; }
.hero-grid { min-height:540px; display:grid; grid-template-columns: 1.08fr .92fr; align-items:stretch; }
.hero-copy { padding:92px 46px 72px 0; position:relative; }
.hero-copy::after { content:"D4"; position:absolute; right:38px; bottom:-66px; font:700 240px/.8 var(--display); color:rgba(247,241,229,.06); }
.hero h1 { max-width:690px; margin:14px 0 23px; font:600 clamp(45px,6vw,81px)/.98 var(--display); letter-spacing:-.06em; }
.hero p { max-width:550px; margin:0; color:#dfe5d5; font-size:18px; }
.hero-meta { display:flex; align-items:center; flex-wrap:wrap; gap:15px 25px; margin-top:38px; font-size:13px; font-weight:700; }
.hero-meta span { display:flex; align-items:center; gap:8px; }
.dot { height:8px; width:8px; border-radius:50%; background:var(--sun); display:inline-block; }
.hero-figure { position:relative; margin:0 -28px 0 0; min-height:360px; }
.hero-figure img { width:100%; height:100%; min-height:540px; object-fit:cover; }
.hero-figure figcaption { position:absolute; bottom:20px; left:20px; background:rgba(28,53,45,.85); color:var(--paper); padding:7px 10px; font:400 10px var(--mono); }

.intro { display:grid; grid-template-columns:.7fr 1.3fr; gap:70px; padding:96px 28px 78px; }
.intro h2, .section-title { font:600 clamp(34px,4vw,55px)/1.05 var(--display); letter-spacing:-.055em; margin:11px 0 0; }
.intro p { margin:0; max-width:700px; font:500 21px/1.55 var(--display); }
.rule { border:0; border-top:1px solid var(--line); margin:0; }

.section { padding:80px 0; }
.section-heading { display:flex; justify-content:space-between; gap:25px; align-items:end; margin-bottom:34px; }
.section-heading p { max-width:355px; color:var(--muted); font-size:14px; margin:0; }
.tiles { display:grid; grid-template-columns:repeat(12, 1fr); gap:18px; }
.category-heading { display:flex; align-items:baseline; gap:13px; margin:48px 0 17px; border-bottom:1px solid var(--line); padding-bottom:12px; }
.category-heading span { color:var(--clay); font:500 11px var(--mono); letter-spacing:.1em; }
.category-heading h3 { margin:0; font:600 27px/1 var(--display); letter-spacing:-.04em; }
.tile { background:var(--paper); border:1px solid var(--line); padding:27px 25px 23px; min-height:230px; grid-column:span 4; display:flex; flex-direction:column; transition:transform .25s, box-shadow .25s; }
.tile:hover { transform:translateY(-5px); box-shadow:8px 10px 0 var(--sun); }
.tile.feature { background:#e7ead9; grid-column:span 6; }
.tile h3 { font:600 27px/1.1 var(--display); letter-spacing:-.04em; margin:11px 0 10px; }
.tile p { margin:0 0 15px; color:#40534a; font-size:14px; }
.place-link { margin-top:auto; display:inline-flex; align-items:center; gap:7px; color:var(--forest); font:700 11px var(--mono); letter-spacing:.04em; text-transform:uppercase; }
.place-link::after { content:"↗"; color:var(--clay); font-size:16px; }
.card-links { margin-top:auto; display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; }
.card-links .place-link { margin-top:0; }
.map-link { display:inline-flex; align-items:center; color:var(--muted); font:700 10px var(--mono); letter-spacing:.04em; text-decoration:none; text-transform:uppercase; border-bottom:1px solid currentColor; }
.map-link:hover { color:var(--clay); }
.nightlife-return { display:flex; align-items:center; justify-content:space-between; gap:28px; margin-top:42px; padding:25px; border:1px solid var(--line); background:#e7ead9; }
.nightlife-return h3 { margin:9px 0 6px; font:600 25px/1.1 var(--display); letter-spacing:-.04em; }
.nightlife-return p { max-width:620px; margin:0; color:#40534a; font-size:14px; }
.nightlife-return .place-link { flex:0 0 auto; }

.first-morning { background:var(--forest); color:var(--paper); padding:72px 0; }
.morning-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:60px; align-items:center; }
.first-morning .eyebrow { color:#ffe0a0; }
.first-morning h2 { margin:12px 0 0; font:600 clamp(39px,5vw,64px)/1 var(--display); letter-spacing:-.06em; }
.route { border-left:1px solid rgba(255,250,240,.55); padding-left:32px; }
.route-step { position:relative; padding:0 0 25px; }
.route-step:last-child { padding-bottom:0; }
.route-step::before { content:""; position:absolute; width:9px; height:9px; background:var(--sun); border-radius:50%; left:-37px; top:8px; }
.route strong { display:block; font:600 21px var(--display); letter-spacing:-.025em; }
.route p { margin:3px 0 0; color:#ffecce; font-size:14px; }

.outings { background:var(--paper); }
.image-panel { display:grid; grid-template-columns:1fr 1fr; background:var(--forest); color:var(--paper); }
.image-panel figure { margin:0; min-height:460px; position:relative; }
.image-panel img { height:100%; width:100%; object-fit:cover; }
.image-panel figcaption { position:absolute; left:20px; bottom:18px; background:rgba(28,53,45,.84); padding:7px 10px; font:10px var(--mono); }
.outing-copy { padding:63px clamp(28px,5vw,68px); }
.outing-copy h2 { margin:11px 0 18px; font:600 44px/1.04 var(--display); letter-spacing:-.055em; }
.outing-copy p { color:#dce4d5; margin:0 0 26px; }
.text-link { font:700 12px var(--mono); color:var(--sun); text-transform:uppercase; letter-spacing:.05em; }
.outing-copy .text-link { display:inline-block; margin-top:10px; }
.activity-heading { margin-top:58px; }
.activity-grid .travel-card { display:flex; flex-wrap:wrap; align-content:flex-start; gap:0 16px; }
.activity-grid .travel-card h3, .activity-grid .travel-card p { width:100%; }
.activity-grid .place-link, .activity-grid .map-link { margin-top:2px; }
.inline-links { display:flex; flex-wrap:wrap; gap:9px 14px; }

.travel-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.travel-card { border-top:3px solid var(--forest); padding:24px 0; }
.travel-card h3 { font:600 27px var(--display); margin:0 0 8px; letter-spacing:-.04em; }
.travel-card p { color:var(--muted); max-width:480px; margin:0 0 15px; font-size:14px; }
.utility { background:#e8e0cc; }
.utility-grid { display:grid; grid-template-columns:1fr 1fr 1fr; gap:18px; }
.utility-card { border:1px solid #bfb49c; padding:25px; min-height:164px; }
.utility-card h3 { margin:10px 0 7px; font:600 24px var(--display); letter-spacing:-.04em; }
.utility-card p { margin:0; font-size:13px; color:#4d574a; }
.utility-card a { display:inline-block; margin-top:13px; font:700 11px var(--mono); text-transform:uppercase; letter-spacing:.04em; }

.support { padding:70px 0; background:var(--paper); }
.support-box { border:1px solid var(--line); padding:38px; display:flex; align-items:center; justify-content:space-between; gap:30px; }
.support-box h2 { margin:8px 0 0; font:600 34px/1.1 var(--display); letter-spacing:-.05em; }
.support-box p { max-width:480px; margin:8px 0 0; color:var(--muted); font-size:14px; }
.support-mark { color:var(--clay); font:600 90px/.7 var(--display); }
.site-footer { background:var(--ink); color:#e8e7da; padding:35px 0; font-size:12px; }
.footer-row { display:flex; justify-content:space-between; gap:25px; }
.footer-row p { margin:0; max-width:600px; color:#b9c5b9; }

@media (max-width: 760px) {
 .wrap { padding:0 19px; } .header-row { min-height:66px; flex-wrap:wrap; gap:10px; padding-top:10px; } .nav { display:flex; order:3; flex:0 0 100%; flex-wrap:wrap; gap:4px 16px; padding:4px 0 10px; } .nav a { padding:6px 0; } .brand { font-size:20px; } .header-actions { gap:5px; } .action-btn { padding:8px 8px; font-size:10px; }
  #wellbeing, #eat, #wander, #nightlife, #getting-around, #essentials { scroll-margin-top:160px; }
 .hero-grid, .morning-grid, .image-panel, .intro { grid-template-columns:1fr; } .hero-copy { padding:62px 0 45px; } .hero-copy::after { display:none; } .hero h1 { font-size:48px; } .hero p { font-size:16px; } .hero-figure { margin:0 -19px; } .hero-figure img { min-height:310px; max-height:310px; } .intro { gap:28px; padding:65px 19px; } .intro p { font-size:19px; }
 .section { padding:59px 0; } .section-heading { display:block; margin-bottom:25px; } .section-heading p { margin-top:15px; } .tile, .tile.feature { grid-column:span 12; min-height:0; } .tile:hover { transform:none; box-shadow:none; }
  .first-morning { padding:59px 0; } .morning-grid { gap:34px; } .route { padding-left:25px; } .route-step::before { left:-30px; } .image-panel figure { min-height:270px; } .outing-copy { padding:42px 26px; } .travel-grid, .utility-grid { grid-template-columns:1fr; gap:0; } .utility-grid { gap:12px; } .utility-card { min-height:0; } .nightlife-return { display:block; margin-top:30px; } .nightlife-return .place-link { margin-top:16px; } .support { padding:48px 0; } .support-box { padding:27px; } .support-mark { display:none; } .footer-row { display:block; } .footer-row p { margin-top:9px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } *, *::before, *::after { transition:none!important; animation:none!important; } }
@media print {
 @page { size:A4; margin:13mm 12mm; } body { background:#fff; font-size:10pt; line-height:1.42; } body::before, .site-header, .hero-figure, .header-actions, .skip, .no-print { display:none!important; } .wrap { max-width:none; padding:0; } .hero { color:#173e32; background:#fff; border-bottom:2px solid #173e32; } .hero-grid { display:block; min-height:auto; } .hero-copy { padding:0 0 11mm; } .hero h1 { font-size:34pt; margin:4mm 0; } .hero p { font-size:12pt; color:#263d34; } .hero-meta { margin-top:5mm; color:#263d34; } .intro { padding:10mm 0; gap:4mm; } .intro h2,.section-title { font-size:23pt; } .intro p { font-size:14pt; } .section { padding:9mm 0; break-inside:avoid; } .section-heading { margin-bottom:5mm; } .tiles { gap:4mm; } .tile, .tile.feature { grid-column:span 4; padding:5mm; min-height:44mm; break-inside:avoid; background:#fff!important; box-shadow:none!important; } .tile h3 { font-size:16pt; } .first-morning { color:#173e32; background:#f4e5cf; } .first-morning .eyebrow { color:#9d422e; } .first-morning h2 { font-size:27pt; } .route p { color:#263d34; } .route { border-color:#54766a; } .image-panel { display:block; color:#173e32; background:#fff; } .image-panel figure { min-height:60mm; } .image-panel img { max-height:60mm; } .outing-copy { padding:7mm 0; } .outing-copy p { color:#263d34; } .utility { background:#f4e5cf; } .utility-grid { gap:4mm; } .utility-card { padding:5mm; min-height:38mm; break-inside:avoid; } .support { padding:9mm 0; } .support-box { padding:6mm; } .support-mark { display:none; } .site-footer { background:#173e32; padding:6mm 0; } a { text-decoration:none; } .place-link::after { content:""; } 
}
@media (max-width: 760px) {
 .category-heading { margin-top:37px; }
}
@media print {
 .section { break-inside:auto; }
 .first-morning { background:var(--forest); color:var(--paper); padding:9mm 0; print-color-adjust:exact; -webkit-print-color-adjust:exact; }
 .first-morning .eyebrow { color:var(--sun); }
 .first-morning .route p { color:var(--paper); }
 .category-heading { margin:8mm 0 4mm; padding-bottom:3mm; }
 .tile, .tile.feature, .activity-grid .travel-card, .image-panel figure { break-inside:avoid; }
 .card-links { gap:3mm; }
}