/* Shared proportions for every page family. Keep image dimensions in HTML for
   intrinsic ratio / CLS, but never let those attributes dictate CSS height. */
:root { --content-gutter: max(1.25rem, calc((100% - 1240px) / 2)); --clay:#a44932; --sage:#536b60; }
img { height: auto; }
.hero-photo { background-image:none; }
.hero-photo-credit { position:absolute; bottom:.75rem; right:var(--content-gutter); z-index:3; margin:0; padding:.4rem .7rem; max-width:750px; background:rgba(16,35,31,.88); color:white; font-size:.75rem; line-height:1.5; }
.hero-photo-credit a { text-decoration:underline; }
@media(max-width:480px) { .hero-photo-credit { left:1.25rem; right:1.25rem; } .scroll-cue { display:none; } }
.destination-guide-hero img.documentary-photo { aspect-ratio:4/3; object-fit:cover; max-height:420px; }
.photo-credit { font-size:.75rem; line-height:1.5; margin:.75rem 0 0; color:#526860; }
.photo-credit a { text-decoration:underline; }
.when-card>div p { font-size:.75rem; line-height:1.5; color:var(--clay); }
.destination-guide-hero figcaption a,.local-source a { text-decoration:underline; text-underline-offset:.2em; }
.local-experiences { background:var(--ivory); }
.local-experiences-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.5rem; }
.local-experiences-grid article { border-top:1px solid var(--line); padding:1.5rem; background:var(--paper); }
.local-experiences-grid h3 { font-size:1.65rem; }
.local-check { border-left:2px solid var(--clay); padding-left:1rem; margin-bottom:0; }
.local-check strong { display:block; font-size:.85rem; margin-bottom:.4rem; }
.local-source { margin:1.5rem 0 0; font-size:.9rem; max-width:85ch; }
.service-pathways-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.5rem; }
.service-pathways-grid article { padding:1.5rem; background:var(--ivory); border-top:1px solid var(--line); }
.service-pathways-grid h3 { font-size:1.6rem; }
.service-pathways-grid a:hover { text-decoration:underline; }
.documentary-grid figcaption { display:block; }
.documentary-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
@media(max-width:1000px) { .documentary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:480px) { .documentary-grid { grid-template-columns:1fr; } }
.documentary-grid figcaption small { display:block; margin-top:.4rem; font-family:var(--sans); font-size:.75rem; line-height:1.5; }
.documentary-grid figcaption small a { text-decoration:underline; }
.documentary-grid img { object-position:center; }
.destination-meta h2,.destination-meta h3 { font-size:1.9rem!important; }
.destination-guide .answer-card { display:block; }
.destination-guide .answer-card>div { margin-bottom:1.5rem; }
@media(max-width:900px) { .local-experiences-grid { grid-template-columns:1fr; } }
@media(max-width:640px) { .service-pathways-grid { grid-template-columns:1fr; } }
main { min-width: 0; }
.no-js .when-controls,.no-js [data-finder] fieldset,.no-js [data-finder]>button,.no-js [data-budget-calculator] form,.no-js .budget-result { display:none; }
main :is(section, article, figure, div) { min-width: 0; }
h1,h2,h3 { line-height: 1.12; text-wrap: balance; }
main h1 { font-size: clamp(2.3rem, 4.1vw, 3.8rem) !important; }
main h2 { font-size: clamp(1.9rem, 3vw, 2.85rem) !important; }
main h3 { line-height: 1.2; }
.section { padding-block: clamp(2.75rem, 4.5vw, 4.5rem); }
.page-hero { padding-block: clamp(2.75rem, 4.5vw, 4.5rem); }
.section-heading,.practical-section-heading,.destination-section-heading,.planner-section-heading,.horizon-atlas-heading { margin-bottom: 2rem; gap: 1.25rem 2.5rem; }
.eyebrow,.section-number,.guide-card>span,.guide-card>small,.guide-card>b,.destination-meta p,.destination-meta>span,.page-update,.practical-hero .page-update,.planner-hero .page-update,.guide-table-scroll thead th,.data-note,.field label,.fact-bar small,.method-grid span,.mistake-grid span { font-size: .75rem; letter-spacing: .07em; line-height: 1.5; }
.eyebrow { margin-bottom: 1rem; }
.section-number { margin-bottom: 1.5rem; }
.main-nav,.header-cta,.button,.text-link,.filter-button,.footer-main nav,.footer-bottom { font-size: .8rem; line-height: 1.5; }
.main-nav a,.filter-button { min-height: 44px; display: inline-flex; align-items: center; }
.header-inner { max-width: 1240px; }
.brand-name small { font-size: .65rem; }
.practical-hero,.planner-hero,.destination-guide-hero { grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); gap: clamp(1.5rem,4vw,3.5rem); align-items: center; }
.practical-hero img,.planner-hero img,.destination-guide-hero img { width:100%; height:auto; aspect-ratio: 4/3; max-height:420px; object-fit:cover; }
.practical-hero figcaption,.planner-hero figcaption,.destination-guide-hero figcaption { font-size: .75rem; line-height: 1.5; letter-spacing: 0; text-transform:none; }
.practical-lead,.planner-lead,.destination-lead { font-size: 1.12rem; line-height: 1.65; }
.page-hero:not(.guide-hero)>.page-hero-photo { height: min(340px,80%); top:50%; bottom:auto; transform:translateY(-50%); right:var(--content-gutter); width:35%; }
.page-hero:not(.guide-hero):has(>.page-hero-photo) { min-height:420px; }
.page-hero:not(.guide-hero) { padding-block:3rem; padding-right:var(--content-gutter); min-height:0; }
.page-hero:not(.guide-hero):has(>.page-hero-photo)>:not(img) { width:57%; max-width:720px; }
.main-nav a.mobile-nav-cta { display:none; }
.page-hero p.page-update,.guide-hero p.page-update { font-size:.75rem; line-height:1.5; }
.calculator-reset { font-size:.8rem; min-height:44px; }
.promise-strip span,.hero-link,.scroll-cue,.footer-bottom,.brand-name small { font-size:.75rem; }
.hero { min-height:590px; height: min(76svh,720px); }
.hero h1 { font-size:clamp(2.8rem,5vw,4.6rem)!important; }
.hero-intro { font-size:1.12rem; }
.horizon-grid img { height:auto; aspect-ratio:4/3; max-height:320px; }
.destination-card img { height:auto; aspect-ratio:4/3; max-height:330px; }
.destination-card.featured { margin-top:0; }
.destination-gallery { gap:2.5rem 1.5rem; }
.destination-gallery { align-items:stretch; }
.destination-gallery .destination-card { display:flex; flex-direction:column; }
.destination-gallery .destination-guide-link { margin-top:auto; }
.guide-card:hover>small,.related-grid>a:hover small { color:#c4d0cc; }
.guide-card:hover>span,.guide-card:hover>b,.related-grid>a:hover em,.related-grid>a:hover b { color:var(--clay-light); }
.intro-section h2 em { color:var(--clay); }
.about-grid img { height:auto; aspect-ratio:4/3; max-height:430px; }
.intro-section,.finder,.about-grid,.contact-grid,.destination-editorial,.season-guide,.faq-section,.hub-method { gap:clamp(1.75rem,4vw,3.5rem); }
.intro-copy { padding-top:0; }
.guide-card { min-height:0; padding:1.5rem; }
.guide-card p { font-size:1rem; line-height:1.65; }
.guide-card h3 { font-size:1.7rem; }
.guide-card>small { margin-top:.75rem; }
.guide-card>b { padding-top:1.5rem; }
.method-grid li,.mistake-grid article,.highlight-grid article { min-height:0; }
.method-grid h3,.mistake-grid h3,.highlight-grid h3,.hub-tool-grid h3 { margin-top:1.3rem; }
.related-grid em { margin-bottom:.75rem; }
.story { min-height:0; align-items:stretch; }
.story-copy { padding:clamp(1.75rem,3vw,3rem); }
.story-image img { min-height:0; height:100%; max-height:560px; }
.tailor-made { min-height:0; }
.tailor-copy { padding:clamp(2rem,4vw,4rem); }
.manifesto { padding-block:4rem; }
.section-jump { gap:.5rem 1.25rem; }
.section-jump a { padding-block:.5rem; }
:is([id]) { scroll-margin-top:5rem; }
@media(max-width:1000px) {
  .practical-hero,.planner-hero,.destination-guide-hero { grid-template-columns:1fr; }
  .practical-hero figure,.planner-hero figure,.destination-guide-hero figure { width:100%; max-width:680px; }
  .practical-hero img,.planner-hero img,.destination-guide-hero img { aspect-ratio:16/9; max-height:360px; }
  .main-nav { font-size:1.6rem; overflow-y:auto; }
  .main-nav a.mobile-nav-cta { display:inline-flex; }
}
@media(max-width:760px) {
  .page-hero:not(.guide-hero):has(>.page-hero-photo) { min-height:0; }
  .page-hero:not(.guide-hero):has(>.page-hero-photo)>:not(img) { width:100%; max-width:100%; }
  .page-hero:not(.guide-hero)>.page-hero-photo { position:relative; top:auto; right:auto; transform:none; width:100%; height:auto; aspect-ratio:16/9; margin-top:1.5rem; max-height:300px; }
  .horizon-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); overflow:visible; margin:0; padding:0; }
  .horizon-grid figure { min-width:0; }
  .horizon-grid img { height:auto; aspect-ratio:4/3; }
  .horizon-grid figcaption { display:block; font-size:1rem; }
  .horizon-grid figcaption span { display:block; font-size:.75rem; }
  .story-image img { height:auto; aspect-ratio:16/9; }
  .mood-card,.mood-large { height:330px; }
  .guide-card-grid { gap:1rem; background:transparent; border:0; }
  .guide-card { border:1px solid var(--line); }
  .guide-table-scroll th,.guide-table-scroll td { padding:1rem; }
}
@media(max-width:480px) {
  .horizon-grid { grid-template-columns:1fr; gap:1.5rem; }
  .hero { min-height:650px; height:auto; padding:8rem 1.25rem 5.5rem; }
  .hero-content { position:relative; top:auto; left:auto; right:auto; transform:none; }
  .hero h1 { font-size:2.8rem!important; }
  .hero-intro { font-size:1rem; }
  .promise-strip p { padding:.75rem 0; }
  .destination-meta h2,.destination-meta h3 { font-size:1.75rem!important; }
  .choice-row { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .choice-row span { font-size:.8rem; }
}
@media print {
  .section,.page-hero { padding:1rem 0; }
  main h1 { font-size:2rem!important; } main h2 { font-size:1.5rem!important; }
  .page-hero-photo { display:none!important; }
}
