:root {
  --navy: #14365d;
  --green: #2f6b39;
  --pale: #dce886;
  --cream: #fffde9;
  --ink: #17202a;
  --line: #9caf55;
  --soft: #eff5c8;
  --muted: #526371;
}
* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: var(--pale); font-family: Georgia, "Times New Roman", serif; line-height: 1.62; }
a { color: var(--green); font-weight: bold; }
a:hover, a:focus { color: #0b4e78; }
.site-header { color: #fff; background: var(--navy); border-bottom: 6px solid var(--green); }
.header-inner, main, .footer-inner { width: min(1080px, calc(100% - 32px)); margin: 0 auto; }
.header-inner { padding: 28px 0 18px; }
.brand { margin: 0; font-size: clamp(2rem, 5vw, 3.4rem); line-height: 1; }
.tagline { margin: 8px 0 0; color: #edf5c2; font-style: italic; }
nav { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 22px; }
nav a { color: #fff; border: 1px solid #b7cf82; padding: 6px 10px; text-decoration: none; font-size: .95rem; }
nav a:hover, nav a:focus, nav a[aria-current="page"] { background: var(--green); color: #fff; }
main { padding: 34px 0 46px; }
.hero, .content-panel, .info-note, .local-card, .route-stop, .photo-slot { background: var(--cream); border: 1px solid var(--line); box-shadow: 4px 4px 0 rgba(47,107,57,.16); }
.hero, .content-panel { padding: clamp(22px, 4vw, 42px); }
.hero h1, .content-panel h1, .content-panel h2, .content-panel h3 { color: var(--navy); line-height: 1.18; }
.hero h1 { margin-top: 0; font-size: clamp(2rem, 5vw, 3.4rem); }
.hero p, .lead { max-width: 76ch; font-size: 1.1rem; }
.lead { color: #28435d; }
.section-title { margin: 40px 0 16px; color: var(--navy); font-size: 1.7rem; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(225px, 1fr)); gap: 20px; }
.local-card, .route-stop { padding: 18px; }
.local-card h2, .route-stop h2 { margin: 0 0 8px; color: var(--navy); font-size: 1.42rem; }
.local-card img { display: block; max-width: 100%; max-height: 150px; margin: 0 auto 14px; object-fit: contain; }
.image-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 18px; margin: 24px 0; }
.figure { margin: 0; padding: 10px; background: var(--soft); border: 1px solid var(--line); text-align: center; }
.figure img { max-width: 100%; max-height: 240px; object-fit: contain; }
.figure figcaption { margin-top: 8px; font-size: .9rem; font-style: italic; }
.photo-slot { margin: 26px 0; padding: 25px; min-height: 190px; color: var(--muted); text-align: center; background: repeating-linear-gradient(135deg, #fffde9, #fffde9 13px, #f2f4d8 13px, #f2f4d8 26px); }
.photo-slot h2 { margin: 0 0 6px; color: var(--navy); }
.photo-slot p { max-width: 55ch; margin: 0 auto; }
.info-table { width: 100%; border-collapse: collapse; margin: 24px 0; background: #fff; }
.info-table th, .info-table td { padding: 10px 12px; border: 1px solid var(--line); vertical-align: top; text-align: left; }
.info-table th { width: 28%; color: var(--navy); background: var(--soft); }
.info-note { margin: 26px 0; padding: 18px 20px; }
.info-note h2, .info-note h3 { margin-top: 0; color: var(--navy); }
.info-note ul, .content-panel ul { padding-left: 1.25rem; }
.info-note li, .content-panel li { margin-bottom: 7px; }
.badge { display: inline-block; margin: 0 0 6px; background: var(--green); color: #fff; padding: 2px 8px; font-size: .82rem; font-weight: bold; }
.credit { margin-top: 34px; border-top: 1px solid var(--line); padding-top: 14px; color: #4b5d68; font-size: .9rem; }
.small { font-size: .9rem; }
.site-footer { color: #fff; background: var(--navy); border-top: 6px solid var(--green); }
.footer-inner { padding: 20px 0 30px; font-size: .92rem; }
.site-footer a { color: #edf5c2; }
@media (max-width: 600px) { .header-inner, main, .footer-inner { width: min(100% - 22px, 1080px); } .info-table th, .info-table td { display:block; width:auto; } .info-table tr { display:block; border-bottom:1px solid var(--line); } }

.header-gallery { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin-top: 16px; }
.header-gallery img { display: block; max-width: 120px; height: 48px; width: auto; object-fit: contain; padding: 3px; background: rgba(255,255,255,.94); border: 1px solid #b7cf82; }

.intro-gallery { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 18px; margin: 24px 0; }
.intro-gallery .figure { display: inline-block; padding: 10px; background: var(--soft); border: 1px solid var(--line); text-align: center; }
.intro-gallery .figure img { display: block; width: auto; height: auto; max-width: none; max-height: none; }
.intro-gallery .figure figcaption { margin-top: 8px; font-size: .9rem; font-style: italic; }
@media (max-width: 680px) { .intro-gallery .figure { max-width: 100%; } .intro-gallery .figure img { max-width: 100%; height: auto; } }

.vienna-map-legend { display: flex; align-items: flex-start; gap: 18px; margin: 24px 0; }
.vienna-map-legend .vienna-map { flex: 0 0 auto; margin: 0; padding: 10px; background: var(--soft); border: 1px solid var(--line); text-align: center; }
.vienna-map-legend .vienna-map img { display: block; width: auto; height: auto; max-width: none; max-height: none; }
.district-legend { flex: 1 1 390px; padding: 16px 18px; background: var(--soft); border: 1px solid var(--line); }
.district-legend h2 { margin: 0 0 6px; color: var(--navy); font-size: 1.35rem; }
.district-legend p { margin: 0 0 10px; }
.district-grid { display: grid; grid-template-columns: repeat(2, minmax(135px, 1fr)); gap: 3px 22px; margin: 0; padding-left: 1.6rem; font-size: .93rem; }
.district-grid li { break-inside: avoid; padding-left: 2px; }
.district-grid span { color: var(--muted); }
@media (max-width: 840px) { .vienna-map-legend { flex-direction: column; } .vienna-map-legend .vienna-map img { max-width: 100%; height: auto; } .district-legend { width: 100%; } }
@media (max-width: 480px) { .district-grid { grid-template-columns: 1fr; } }

.video-section { margin: 0 0 34px; padding: 18px; background: var(--cream); border: 1px solid var(--line); box-shadow: 4px 4px 0 rgba(47,107,57,.16); }
.video-section h2 { margin: 0 0 7px; color: var(--navy); font-size: 1.45rem; }
.video-section > p { margin: 0 0 14px; }
.video-strip { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: flex-start; gap: 16px; margin: 16px 0 0; }
.video-card { box-sizing: border-box; flex: 0 0 340px; width: 340px; max-width: 100%; margin: 0; padding: 9px; background: var(--soft); border: 1px solid var(--line); text-align: center; }
.video-card video { display: block; width: 100%; max-width: 320px; margin: 0 auto; aspect-ratio: 4 / 3; background: var(--navy); }
.video-card figcaption { margin-top: 7px; font-size: .9rem; font-style: italic; }
.video-note { color: var(--muted); font-size: .88rem; }
.video-link { display: inline-block; margin: 9px 0 0; padding: 5px 9px; color: #fff; background: var(--green); border: 1px solid var(--navy); font-size: .86rem; font-weight: bold; text-decoration: none; }
.video-link:hover, .video-link:focus { color: var(--navy); background: #edf5c2; }
.itinerary-overview { margin: 28px 0; }
.itinerary-overview > .badge { margin-bottom: 12px; }
.itinerary-intro h2 { margin: 0 0 10px; color: var(--navy); font-size: clamp(1.65rem, 3vw, 2.15rem); }
.itinerary-intro p { max-width: 78ch; }
.itinerary-stops { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 18px; margin-top: 24px; }
.itinerary-stop { margin: 0; }
.itinerary-stop-image { display: block; margin: 0 auto 14px; padding: 8px; background: var(--soft); border: 1px solid var(--line); }
.itinerary-stop-image img { display: block; max-width: 100%; max-height: 160px; margin: 0 auto; object-fit: contain; }
.route-map-panel { margin: 24px 0; padding: 22px; background: var(--paper); border: 1px solid var(--line); box-shadow: 0 8px 22px rgba(20, 54, 93, .09); }
.route-map-panel > h2 { margin-top: 4px; }
.route-map-figure { margin: 18px 0 0; }
.route-map-wrap { position: relative; width: fit-content; max-width: 100%; margin: 0 auto; }
.route-map-image { display: block; width: auto; max-width: 100%; height: auto; border: 1px solid var(--line); background: var(--soft); }
.route-map-label { position: absolute; z-index: 1; padding: 6px 10px; border: 2px solid var(--soft); border-radius: 6px; background: var(--ink); color: #fffdf0; font-size: .93rem; font-weight: 700; line-height: 1.1; text-decoration: none; box-shadow: 0 2px 5px rgba(20, 54, 93, .26); }
.route-map-label:hover, .route-map-label:focus { background: var(--green); color: #fffdf0; outline: 3px solid var(--yellow); outline-offset: 2px; }
.route-map-label.sanremo { left: 57%; top: 79%; }
.route-map-label.montecarlo { left: 44%; top: 73%; }
.route-map-label.parigi { left: 27%; top: 42%; }
.route-map-label.vienna { left: 80%; top: 42%; }
.route-map-figure figcaption { margin-top: 8px; color: var(--muted); font-size: .92rem; text-align: center; }
@media (max-width: 560px) { .route-map-panel { padding: 16px; } .route-map-label { padding: 4px 6px; font-size: .72rem; } .route-map-label.sanremo { left: 56%; top: 82%; } .route-map-label.montecarlo { left: 40%; top: 75%; } .route-map-label.parigi { left: 22%; top: 40%; } .route-map-label.vienna { left: 77%; top: 40%; } }
.journey-overview { display: grid; grid-template-columns: minmax(280px, .72fr) minmax(430px, 1.28fr); gap: 24px; align-items: start; }
.journey-overview .itinerary-intro { min-width: 0; }
.journey-overview .itinerary-intro h2 { margin-top: 4px; }
.journey-map { min-width: 0; padding: 12px; border: 1px solid var(--line); background: var(--soft); }
.journey-map-kicker { margin: 0 0 5px; color: var(--green); font-size: .78rem; font-weight: 700; letter-spacing: .08em; }
.journey-map-note { margin: 0 0 9px; color: var(--muted); font-size: .9rem; line-height: 1.35; }
.journey-map .route-map-figure { margin: 0; }
.journey-map .route-map-image { max-height: 370px; object-fit: contain; }
.journey-overview .itinerary-stops { grid-column: 1 / -1; }
@media (max-width: 820px) { .journey-overview { grid-template-columns: 1fr; } .journey-map .route-map-image { max-height: none; } }
.shared-caption { margin: -4px 0 18px; color: var(--muted); font-size: .92rem; font-style: italic; text-align: center; }

.science-media-row { grid-template-columns: minmax(0, 1fr) minmax(0, 340px); align-items: start; }
.science-media-row .video-card { justify-self: start; }
@media (max-width: 720px) { .science-media-row { grid-template-columns: 1fr; } }

.montecarlo-map-legend { display: flex; align-items: flex-start; gap: 18px; margin: 24px 0; }
.montecarlo-map { flex: 0 0 auto; margin: 0; padding: 10px; background: var(--soft); border: 1px solid var(--line); text-align: center; }
.montecarlo-map img { display: block; width: auto; height: auto; max-width: none; max-height: none; }
.montecarlo-map figcaption { margin-top: 8px; font-size: .9rem; font-style: italic; }
.montecarlo-map-key { flex: 1 1 470px; padding: 16px 18px; background: var(--soft); border: 1px solid var(--line); }
.montecarlo-map-key h2 { margin: 0 0 6px; color: var(--navy); font-size: 1.35rem; }
.montecarlo-map-key h3 { margin: 16px 0 7px; color: var(--navy); font-size: 1.03rem; }
.montecarlo-map-key p { margin: 0 0 11px; }
.montecarlo-map-list { display: grid; gap: 8px; margin: 0; }
.montecarlo-map-list div { display: grid; grid-template-columns: 30px 1fr; gap: 9px; align-items: start; }
.montecarlo-map-list dt { display: grid; place-items: center; min-height: 26px; color: #fffdf0; background: var(--navy); border: 1px solid var(--green); font-weight: bold; }
.montecarlo-map-list dd { margin: 0; font-size: .93rem; line-height: 1.35; }
.montecarlo-number-list { display: grid; gap: 7px; margin: 0; padding-left: 1.25rem; font-size: .93rem; line-height: 1.35; }
@media (max-width: 720px) { .montecarlo-map-legend { flex-direction: column; } .montecarlo-map img { max-width: 100%; height: auto; } .montecarlo-map-key { width: 100%; box-sizing: border-box; } }

.montecarlo-map-legend { display: block; margin: 24px 0; }
.montecarlo-map-top { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 18px; margin-bottom: 18px; }
.montecarlo-symbol { flex: 0 0 auto; margin: 0; padding: 10px; background: var(--soft); border: 1px solid var(--line); text-align: center; }
.montecarlo-symbol img { display: block; width: auto; height: auto; max-width: none; max-height: none; }
.montecarlo-symbol figcaption { margin-top: 8px; font-size: .9rem; font-style: italic; }
.montecarlo-map-key { width: auto; box-sizing: border-box; }
.montecarlo-map-list { grid-template-columns: repeat(2, minmax(240px, 1fr)); column-gap: 24px; }
.montecarlo-number-list { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 20px; }
@media (max-width: 720px) { .montecarlo-map-top { gap: 14px; } .montecarlo-symbol img { max-width: 100%; height: auto; } .montecarlo-map-list, .montecarlo-number-list { grid-template-columns: 1fr; } }

.sanremo-show-media { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 16px; margin: 16px 0 24px; }
.sanremo-show-media .show-photo { box-sizing: border-box; flex: 0 0 200px; width: 200px; margin: 0; padding: 7px; }
.sanremo-show-media .show-photo img { display: block; width: 100%; height: auto; max-height: 200px; object-fit: contain; }
.sanremo-show-media .video-card { flex: 0 0 340px; }
@media (max-width: 720px) { .sanremo-show-media .show-photo { flex-basis: 200px; max-width: 100%; } }

.flower-gallery { align-items: start; }
.flower-gallery .flower-feature { box-sizing: border-box; width: 180px; max-width: 100%; justify-self: start; align-self: start; padding: 7px; }
.flower-gallery .flower-feature img { display: block; width: 100%; height: auto; max-height: 180px; object-fit: contain; }
@media (max-width: 720px) { .flower-gallery .flower-feature { width: 180px; } }

.flower-media { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 16px; margin: 24px 0; }
.flower-media .flower-feature { box-sizing: border-box; flex: 0 0 180px; width: 180px; max-width: 100%; margin: 0; padding: 7px; }
.flower-media .flower-feature img { display: block; width: 100%; height: auto; max-height: 180px; object-fit: contain; }
.flower-pair { flex: 1 1 420px; min-width: 0; }
.flower-pair-images { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 16px; }
.flower-pair-images .figure { flex: 1 1 200px; margin: 0; }
.flower-pair .shared-caption { margin: 7px 0 0; text-align: center; }
@media (max-width: 720px) { .flower-media .flower-feature { flex-basis: 180px; } .flower-pair { flex-basis: 100%; } }