@font-face {
  font-family: Fraunces;
  src: url("./fraunces.woff2") format("woff2");
  font-weight: 400 700;
  font-display: swap;
}

@font-face {
  font-family: Fraunces;
  src: url("./fraunces-italic.woff2") format("woff2");
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
}

@font-face {
  font-family: "Source Sans 3";
  src: url("./source-sans-3.woff2") format("woff2");
  font-weight: 400 700;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Mono";
  src: url("./ibm-plex-mono.woff2") format("woff2");
  font-weight: 500;
  font-display: swap;
}

:root {
  --sand: #f3e9d6;
  --paper: #f8f1e5;
  --cream: #fffaf0;
  --soil: #8a4b2a;
  --acacia: #3e5b3a;
  --forest: #243c2c;
  --gold: #c9a15a;
  --ink: #1f1b16;
  --muted: #615747;
  --line: #ded0bb;
  --light-line: rgba(247, 235, 208, .28);
  --coast: #2e7d86;
  --accent: var(--soil);
  --title: "Fraunces", Georgia, serif;
  --text: "Source Sans 3", system-ui, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, monospace;
  --gutter: clamp(12px, 4.25vw, 4.75rem);
  --caption-size: .875rem;
  --radius: 12px;
  --header-height: 77px;
  color-scheme: light;
  scroll-padding-top: calc(var(--sticky-height, var(--header-height)) + .8rem);
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--text);
  font-size: 1.0625rem;
  line-height: 1.52;
  overflow-wrap: anywhere;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, p, figure, dl { margin: 0; }
h1, h2, h3 { font-family: var(--title); font-weight: 500; line-height: 1.03; }
h2 { font-size: clamp(2.2rem, 4vw, 3.95rem); letter-spacing: -.06em; }
h3 { letter-spacing: -.042em; }
a { color: inherit; }
button, select { color: inherit; font: inherit; min-inline-size: 0; }
button { cursor: pointer; }
svg { flex: 0 0 auto; vertical-align: middle; }
img { display: block; max-width: 100%; }
::selection { background: #e6bd7c; color: var(--ink); }
:focus-visible { outline: 3px solid #80481e; outline-offset: 3px; }

.wrap { width: min(calc(100% - 2 * var(--gutter)), 1320px); margin-inline: auto; }

.sr-only,
.skip-link:not(:focus) {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  overflow: hidden;
  white-space: nowrap;
}

.skip-link:focus {
  position: fixed;
  top: .75rem;
  left: .75rem;
  max-width: calc(100% - 1.5rem);
  z-index: 50;
  padding: .7rem 1rem;
  border-radius: 5px;
  background: var(--cream);
  color: var(--forest);
  font-weight: 700;
}

.site-header {
  position: sticky;
  inset-block-start: 0;
  z-index: 10;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
}

.header-inner {
  min-height: calc(var(--header-height) - 1px);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .3rem 1.3rem;
  padding-block: .25rem;
}

.brand {
  --mark: var(--soil);
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  min-height: 44px;
  align-items: center;
  gap: .64rem;
  text-decoration: none;
  color: var(--ink);
}

.brand-mark { color: #fff0d4; }
.wordmark { font: 600 1.66rem/1 var(--title); letter-spacing: -.072em; }
.wordmark-day { color: var(--soil); }
.main-nav { display: flex; flex: 1 1 auto; flex-wrap: wrap; align-items: center; justify-content: center; gap: .15rem clamp(.9rem, 2.1vw, 2.1rem); }

.main-nav a {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: .5rem 0;
  font-size: .985rem;
  font-weight: 600;
  text-decoration: none;
}

.main-nav a::after {
  position: absolute;
  right: 0;
  bottom: .47rem;
  left: 0;
  height: 1px;
  background: var(--soil);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .2s ease;
  content: "";
}

.main-nav a:hover::after, .main-nav [aria-current="page"]::after { transform: scaleX(1); }
.header-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: .55rem; margin-inline-start: auto; min-width: 0; }

.language-nav {
  display: inline-flex;
  align-items: center;
  padding: .18rem;
  gap: .08rem;
  background: #f0e6d4;
  border: 1px solid #e7dac5;
  border-radius: 100px;
  color: #584938;
  font: 500 .875rem/1.25 var(--mono);
  flex-wrap: wrap;
  max-width: 100%;
}

.language-nav > svg { margin-inline: .43rem .3rem; }
.language-nav > a, .language-nav .lang-current {
  display: grid;
  place-items: center;
  min-width: max(34px, 1.5em);
  min-height: 40px;
  padding: .16em .27em;
  border-radius: 100px;
  text-decoration: none;
}
.language-nav > a:hover { background: #e7d8bf; color: var(--ink); }
.language-nav .lang-current { background: var(--forest); color: var(--cream); }
.menu-toggle { display: none; }

.eyebrow {
  display: flex;
  align-items: center;
  gap: .58rem;
  color: var(--accent);
  font: 500 var(--caption-size)/1.4 var(--mono);
  letter-spacing: .07em;
  text-transform: uppercase;
}
.ink-line { width: 2.2rem; height: 1px; background: currentColor; }

.hero-wrap { padding-top: clamp(1rem, 2.35vw, 2.15rem); }
.hero {
  isolation: isolate;
  position: relative;
  display: grid;
  align-items: center;
  min-height: clamp(31.5rem, 40vw, 36rem);
  overflow: hidden;
  border-radius: var(--radius);
  background: #422b1c;
  color: #fff4df;
}

.hero-media, .hero-scene, .hero-picture, .hero-picture img, .hero-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.hero-media { z-index: -1; overflow: hidden; }
.hero-picture img {
  object-fit: cover;
  object-position: 50% 55%;
  animation: settle 1.15s cubic-bezier(.22, .68, .16, 1) both;
}

.hero-shade {
  z-index: 1;
  background: linear-gradient(90deg, #1e140cf2 0%, #23160dd9 38%, #23160d80 58%, transparent 81%),
    linear-gradient(0deg, rgba(30, 18, 10, .52), transparent 25%);
}

.hero-copy {
  padding: 3.4rem 0 3.9rem clamp(2rem, 5.1vw, 5rem);
  width: fit-content;
  max-width: min(100%, 55rem);
  animation: rise .65s cubic-bezier(.22, .68, .16, 1) both;
}
.hero-copy .eyebrow { color: #f4d6aa; margin-bottom: 1.4rem; }
.hero h1 { font-size: clamp(4.15rem, 7.4vw, 7.55rem); letter-spacing: -.078em; line-height: .94; }
.hero h1 em { font-weight: 450; color: #f1c183; }
.hero-lead { margin-top: 1.6rem; max-width: 27rem; font-size: clamp(1.07rem, 1.6vw, 1.35rem); line-height: 1.38; color: #fff0d9; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .78rem; margin-top: 1.7rem; }
.hero :focus-visible, .season-board :focus-visible, .site-footer :focus-visible { outline-color: #f8ce8f; }

.button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: .72rem;
  min-height: 3rem;
  max-width: 100%;
  padding: .65rem 1.14rem;
  border: 1px solid transparent;
  border-radius: 6px;
  color: inherit;
  font-size: 1.01rem;
  font-weight: 650;
  line-height: 1.2;
  text-decoration: none;
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.button > span { min-width: 0; }
.button svg { transition: transform .18s ease; }
.button:hover svg { transform: translateX(3px); }
.button--warm { background: #f5e7cd; border-color: #f5e7cd; color: var(--forest); }
.button--warm:hover { background: #fdf4e4; border-color: #fdf4e4; }
.button--on-photo { background: #2c2019; border-color: #dfc8a7; color: #fff6e6; }
.button--on-photo:hover { background: rgba(40, 26, 14, .67); border-color: #ebd5b9; }
.button--dark { background: var(--acacia); color: #fffaf0; }
.button--dark:hover { background: var(--forest); }
.button--outline { background: transparent; color: var(--forest); border-color: #77836a; }
.button--outline:hover { background: #e9eada; }

.field-seal {
  position: absolute;
  z-index: 2;
  right: clamp(1.9rem, 4vw, 3.7rem);
  bottom: 3.4rem;
  width: clamp(6.1rem, 10vw, 9rem);
  height: auto;
  transform: rotate(-12deg);
  color: #f2c787;
  opacity: .94;
}
.field-seal > circle, .field-seal > path { fill: none; stroke: currentColor; stroke-width: 1.25; }
.field-seal text { fill: currentColor; font: 500 10.6px var(--mono); letter-spacing: 1.05px; }

.hero-caption {
  position: absolute;
  z-index: 2;
  bottom: 1.35rem;
  right: 1.65rem;
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  max-width: calc(100% - 2rem);
  padding: .3rem .55rem;
  border-radius: 3px;
  background: #2b201a;
  color: #fff3db;
  font: 650 var(--caption-size)/1.35 var(--text);
}

.section-block { margin-block: clamp(3.5rem, 6.5vw, 6.55rem); }
.section-heading {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 1.35rem 2.5rem;
  margin-bottom: clamp(1.4rem, 2.55vw, 2.45rem);
}
.section-heading .eyebrow { margin-bottom: .58rem; }
.section-heading > p { width: min(100%, 19rem); margin-bottom: .19rem; color: var(--muted); font-size: 1.07rem; line-height: 1.45; }

.destinations { margin-top: clamp(3.1rem, 5.25vw, 4.6rem); }
.destination-grid, .activities-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(.95rem, 1.8vw, 1.7rem);
}
.destination-grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.destination-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--cream);
  color: var(--ink);
  text-decoration: none;
  transition: border-color .22s ease, box-shadow .22s ease, transform .22s ease;
}
.destination-card:hover { transform: translateY(-4px); border-color: #b4a18b; box-shadow: 0 12px 28px #372b1813; }
.destination-media { aspect-ratio: 3 / 2; overflow: hidden; background: var(--sand); }
.destination-grid--two .destination-media { aspect-ratio: 2 / 1; }
.destination-media img, .activity-photo img, .article-photo img { width: 100%; height: 100%; object-fit: cover; }
.destination-media img { transition: transform .65s cubic-bezier(.23, .68, .17, 1); }
.destination-card:hover img { transform: scale(1.045); }
.destination-copy { display: flex; flex: 1; align-items: center; justify-content: space-between; gap: .85rem; padding: 1.2rem 1.25rem; }
.destination-copy h3 { font-size: clamp(1.6rem, 3vw, 2.42rem); }
.destination-copy p { margin-top: .35rem; font-size: 1rem; color: var(--muted); }
.round-arrow { display: grid; place-items: center; width: 2.7rem; aspect-ratio: 1; flex: 0 0 auto; border: 1px solid #cfba9b; border-radius: 100%; color: var(--soil); transition: color .22s ease, background .22s ease, border-color .22s ease; }
.destination-card:hover .round-arrow { background: var(--soil); border-color: var(--soil); color: var(--cream); }
.destination-zanzibar .round-arrow { color: #285d62; border-color: #9cb9b0; }
.destination-zanzibar:hover .round-arrow { background: #285d62; border-color: #285d62; color: #fff; }

.section-band { padding-block: clamp(3.5rem, 6vw, 6rem); background: var(--sand); border-block: 1px solid var(--line); }
.filters {
  display: flex;
  align-items: end;
  flex-wrap: wrap;
  gap: .9rem 1.15rem;
  margin-bottom: 1.4rem;
  padding: 1.05rem 1.2rem;
  border: 1px solid #d6c5aa;
  border-radius: 10px;
  background: #faf3e5;
}

.filter-field { display: grid; gap: .29rem; width: min(100%, 14rem); min-width: 0; font-size: .97rem; font-weight: 650; }
.select-shell { display: grid; grid-template-columns: minmax(0, 1fr); align-items: center; }
.select-shell > * { grid-area: 1 / 1; }
.select-shell svg { justify-self: end; margin-right: .76rem; pointer-events: none; }
.filter-field select {
  appearance: none;
  width: 100%;
  min-height: 2.85rem;
  border: 1px solid #867353;
  border-radius: 6px;
  padding: .4rem 2.1rem .4rem .75rem;
  background: var(--cream);
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
}
.filter-summary { display: flex; align-items: center; flex-wrap: wrap; gap: .2rem .9rem; margin-left: auto; color: var(--muted); min-height: 2.85rem; }
.filter-summary output { font-size: .95rem; font-weight: 600; }
.reset-link { min-height: 44px; padding: .4rem .15rem; border: 0; background: none; color: var(--soil); font-size: .95rem; text-align: start; text-decoration: underline; text-underline-offset: .18em; }

.activity-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--cream);
  transition: box-shadow .2s ease, border-color .2s ease;
}
.activity-card:hover { border-color: #c3b292; box-shadow: 0 9px 20px #4936210e; }
.activity-photo { position: relative; aspect-ratio: 3 / 2; overflow: hidden; background: #ddcba8; }
.activity-duration {
  position: absolute;
  inset: auto auto .65rem .65rem;
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  background: #fff8ea;
  border: 1px solid #ded0b5;
  border-radius: 5px;
  padding: .34rem .48rem;
  color: var(--ink);
  max-width: calc(100% - 1.3rem);
  font: 650 var(--caption-size)/1.25 var(--text);
}
.activity-body { flex: 1; display: flex; flex-direction: column; align-items: start; padding: clamp(1rem, 2vw, 1.45rem); }
.activity-rating { display: flex; flex-wrap: wrap; align-items: center; gap: .29rem; color: #6a5642; font-size: .92rem; }
.activity-rating svg { color: #b45426; margin-right: .12rem; }
.activity-rating strong { color: var(--ink); font: 500 .94rem var(--mono); }
.activity-rating strong span { color: #695642; font-size: .875rem; margin-left: .09rem; }
.activity-body h3 { margin-block: .5rem .75rem; font-size: clamp(1.32rem, 2.35vw, 1.92rem); line-height: 1.1; }
.guide-language {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .31rem .49rem;
  background: #e6ebdb;
  border: 1px solid #d4ddc6;
  border-radius: 4px;
  color: #2b472e;
  font-size: .87rem;
  font-weight: 650;
  line-height: 1.22;
}
.activity-intro { margin-block: .72rem 1.08rem; color: var(--muted); font-size: 1rem; line-height: 1.4; }
.activity-price { display: flex; align-items: baseline; gap: .25rem .4rem; flex-wrap: wrap; width: 100%; margin-top: auto; padding-top: .68rem; border-top: 1px solid #e8ddc9; font-size: .95rem; }
.activity-price strong { color: var(--forest); font: 500 1.02rem var(--mono); }
.price-check { font-weight: 650; color: #494333; }
.catalog-date { width: 100%; color: #685a49; font-size: .92rem; }
.activity-link { justify-content: space-between; width: 100%; min-height: 2.85rem; margin-top: .74rem; padding-inline: .8rem; font-size: .95rem; }

.activities-grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.activities-grid--single { grid-template-columns: minmax(0, 1fr); max-width: 920px; }
.activities-grid--single .activity-card { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); }
.activities-grid--single .activity-photo { aspect-ratio: auto; min-height: 0; }
.activities-grid--single .activity-photo img { position: absolute; inset: 0; }
.activities-grid--single .activity-link { width: auto; }
.show-more { margin-top: 1.45rem; }
.show-more[aria-expanded="true"] svg { transform: rotate(180deg); }
.filter-empty { padding: 1.6rem; border: 1px dashed #a99572; border-radius: 6px; background: #fbf3e5; color: var(--muted); }
.catalog-note { max-width: 73ch; margin-top: 1.1rem; color: var(--muted); font-size: .95rem; }
.catalog-note a { text-underline-offset: .15em; }

.map-spread {
  display: grid;
  grid-template-columns: minmax(0, 1.44fr) minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid #d2c4aa;
  border-radius: var(--radius);
  background: #f7edd9;
}
.map-figure { display: flex; flex-direction: column; min-width: 0; margin: 0; border-right: 1px solid #d2c4aa; background: #e3dbc0; }
.map-art { display: grid; position: relative; aspect-ratio: 640 / 386; }
.cartography { width: 100%; height: 100%; }
.map-country { font: 500 15px var(--mono); letter-spacing: .2em; fill: #566041; }
.map-water { font: 500 10px var(--mono); letter-spacing: .09em; fill: #486f63; }
.map-cities { fill: #4c4935; font: 650 16px var(--text); }
.map-paths { stroke: #9b815e; }
.map-paths .is-active { stroke: #9c502c; stroke-width: 3.2; animation: mark-route .65s ease-out both; }
.map-figure figcaption { display: flex; align-items: center; gap: .45rem; padding: .62rem .9rem; border-top: 1px solid #d2c4aa; color: #514c39; font: 650 var(--caption-size)/1.4 var(--text); }
.map-pin {
  position: absolute;
  left: var(--point-x);
  top: var(--point-y);
  display: grid;
  place-items: center;
  width: 44px;
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  background: none;
  border: 0;
  padding: 0;
  border-radius: 50%;
  color: #365440;
}
.map-pin span { display: grid; place-items: center; width: 30px; aspect-ratio: 1; background: #fff3d9; border: 1px solid #908161; border-radius: 50%; box-shadow: 0 1px 5px #342b1e34; transition: transform .2s ease, background .2s ease, color .2s ease; }
.map-pin:focus-visible { z-index: 2; }
.map-pin:hover span { transform: scale(1.12); }
.map-pin[aria-pressed="true"] span { background: #8a4b2a; color: #fff4dd; border-color: #fff3d9; transform: scale(1.19); }
.map-notes { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: clamp(1.35rem, 3vw, 3.2rem); }
.map-options { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; }
.map-options button {
  border: 1px solid #c0ac8a;
  border-radius: 100px;
  background: #faf3e2;
  padding: .45rem .68rem;
  min-height: 44px;
  font-size: .95rem;
  font-weight: 650;
}
.map-options button:hover { background: #e7dcc4; }
.map-options button[aria-pressed="true"] { background: var(--forest); border-color: var(--forest); color: var(--cream); }
.map-panel { padding-top: 1.2rem; }
.map-tag { color: var(--accent); font: 500 var(--caption-size)/1.4 var(--mono); letter-spacing: .055em; text-transform: uppercase; }
.map-panel h3 { margin: .34rem 0 .55rem; font-size: clamp(1.9rem, 3.5vw, 3.75rem); }
.map-panel > p:not(.map-tag) { max-width: 35ch; color: var(--muted); font-size: 1.07rem; }
.text-link { display: inline-flex; align-items: center; gap: .35rem; min-height: 2.75rem; margin-top: .6rem; color: var(--accent); font-weight: 700; text-decoration-thickness: 1px; text-underline-offset: .24em; }
.text-link:hover { color: var(--forest); }
.map-panel.is-entering { animation: rise .27s ease-out both; }

.season-board {
  isolation: isolate;
  position: relative;
  overflow: hidden;
  border-radius: var(--radius);
  background: var(--forest);
  color: #fff3df;
  padding: clamp(1.25rem, 3.8vw, 3.8rem);
}
.season-board::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  background: repeating-radial-gradient(ellipse at 105% -45%, transparent 0 28px, #f6e3be12 29px 30px, transparent 31px 48px);
  pointer-events: none;
}

.season-heading { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); align-items: end; gap: 1rem 2rem; }
.season-heading .eyebrow { color: #eac896; margin-bottom: .55rem; }
.season-heading > p { color: #f3e8d0; max-width: 36ch; }
.month-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 3.45rem), 1fr));
  gap: .37rem;
  margin-top: 1.6rem;
}
.month-strip button {
  min-height: 44px;
  padding: .45rem .16rem;
  border: 1px solid #a7a387;
  border-radius: 5px;
  background: #4a5b4080;
  color: #fff3df;
  font: 500 var(--caption-size)/1.15 var(--mono);
  text-transform: capitalize;
}
.month-strip button:hover { background: #5c6b4e; }
.month-strip button[aria-pressed="true"] { background: #f1ce91; color: #2e3926; border-color: #f1ce91; }
.month-panels { margin-top: 1rem; }
.season-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.season-note { min-width: 0; padding: 1rem; border: 1px solid #c5bd975b; border-radius: 7px; background: #3b513b; }
.season-park { color: #f4d9a7; font: 500 var(--caption-size)/1.35 var(--mono); letter-spacing: .045em; text-transform: uppercase; }
.season-note h4 { display: flex; align-items: center; gap: .5rem; margin-block: .28rem .32rem; font: 500 clamp(1.02rem, 2vw, 1.33rem)/1.15 var(--title); letter-spacing: -.021em; }
.season-note > p:not(.season-park):not(.field-citation) { color: #f4ebd9; font-size: .93rem; line-height: 1.37; }
.season-dot { flex: 0 0 auto; width: .55rem; height: .55rem; background: var(--status); border-radius: 50%; }
.season-calving { --status: #e8aa73; --status-paper: #fae5d1; }
.season-dry { --status: #efcb87; --status-paper: #f6e6bb; }
.season-migration { --status: #a9d5a1; --status-paper: #e0ebd5; }
.season-resident { --status: #b7cfbd; --status-paper: #e1e9dd; }
.season-variable { --status: #d1c3a4; --status-paper: #eee6d7; }
.month-panel.is-entering { animation: rise .27s ease-out both; }
.season-footer { display: flex; align-items: center; justify-content: space-between; gap: .7rem 1.7rem; margin-top: 1.22rem; }
.season-footer p { color: #eee0c5; font-size: .93rem; }
.season-table { margin-block: 2.8rem 2rem; }
.season-table h2 { margin-bottom: .6rem; text-transform: capitalize; }
.scroll-note { margin-bottom: .8rem; color: var(--muted); font-size: .94rem; }
.table-scroll { max-width: 100%; overflow-x: auto; border: 1px solid #cdbda0; border-radius: 9px; background: var(--cream); }
.season-table table { border-collapse: separate; border-spacing: 0; width: 100%; text-align: left; font-size: .9rem; }
.season-table th, .season-table td { padding: .65rem .55rem; border-right: 1px solid #e4d8c1; border-bottom: 1px solid #e4d8c1; }
.season-table tbody tr:last-child > * { border-bottom: 0; }
.season-table tr > :last-child { border-right: 0; }
.season-table th { background: #f5ead5; color: #483b2d; }
.season-table th:first-child { position: sticky; left: 0; min-width: 6.8rem; box-shadow: 3px 0 5px #49372210; }
.season-table .is-current { background: #ecd7ac; }
.table-status { display: inline-flex; align-items: center; padding: .29rem .4rem; border-radius: 4px; min-width: 5.6rem; background: var(--status-paper); color: #3c352a; line-height: 1.16; }

.faq-section { display: grid; grid-template-columns: minmax(0, .65fr) minmax(0, 1fr); gap: 1.5rem 3.5rem; }
.faq-section h2 { font-size: clamp(2.15rem, 4vw, 3.5rem); }
.faq-list { border-top: 1px solid #c9b89c; }
.faq-list details { border-bottom: 1px solid #c9b89c; }
.faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 3.6rem; padding: .8rem .1rem; font-size: 1.11rem; font-weight: 650; cursor: pointer; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary span { color: var(--accent); transition: transform .2s ease; }
.faq-list details[open] summary span { transform: rotate(45deg); }
.faq-list details p { max-width: 65ch; padding: 0 1.4rem 1.05rem .1rem; color: var(--muted); font-size: 1.055rem; }

.site-footer { background: #24382a; color: #f7eedc; }
.footer-inner { display: grid; grid-template-columns: 1.2fr .7fr 1fr auto; gap: 1.3rem 2.3rem; padding-block: 3.1rem 2.6rem; }
.footer-brand .brand { --mark: #a86d43; color: #fff1da; }
.footer-brand .wordmark-day { color: #edbf84; }
.footer-brand > p { margin-top: .85rem; max-width: 17rem; color: #e1d6c0; }
.footer-links { display: flex; flex-direction: column; align-items: flex-start; gap: .42rem; color: #f0e5cd; }
.footer-links strong { margin-bottom: .22rem; color: #f1c991; font: 500 var(--caption-size)/1.35 var(--mono); letter-spacing: .055em; text-transform: uppercase; }
.footer-links a { text-decoration: none; }
.footer-links a:hover, .footer-bottom a:hover { text-decoration: underline; text-underline-offset: .22em; }
.footer-lang .language-nav { color: #f3e2c1; background: #2e4433; border-color: #a59b7d6e; }
.footer-lang .language-nav .lang-current { color: var(--forest); background: #eedbbb; }
.footer-lang .language-nav > a:hover { color: var(--ink); }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .65rem 1.5rem; border-top: 1px solid var(--light-line); padding-block: .85rem; color: #e7dac1; font-size: .95rem; }
.footer-bottom a { text-decoration: none; }

.theme-coast { --accent: #2b646b; --paper: #f5f2e7; --acacia: #2c6469; --forest: #234f53; --line: #d7d0bc; }
.theme-coast .activity-duration { background: #f0f6ec; border-color: #c9ded5; }
.theme-coast .guide-language { background: #dfeee4; border-color: #c7ded0; color: #26544b; }

.inner-page { padding-bottom: clamp(2rem, 4.9vw, 4.9rem); }
.breadcrumbs { margin-block: 1.2rem 1.75rem; font-size: .88rem; color: var(--muted); }
.breadcrumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .6rem; list-style: none; padding: 0; margin: 0; }
.breadcrumbs li + li::before { content: "›"; padding-right: .6rem; color: #7e6b52; }
.breadcrumbs a { text-decoration-thickness: 1px; text-underline-offset: .2em; }
.breadcrumbs [aria-current] { color: var(--ink); }
.hub-header { max-width: 59rem; margin-block: clamp(1.9rem, 4.75vw, 4rem) clamp(2rem, 5vw, 4rem); }
.hub-header .button { margin-top: 1.15rem; }
.hub-header .eyebrow, .article-header .eyebrow { margin-bottom: .75rem; }
.hub-header h1, .article-heading h1 { font-size: clamp(2.85rem, 6.1vw, 6rem); letter-spacing: -.071em; }
.lead { max-width: 64ch; margin-top: 1.1rem; color: #473c2d; font-size: clamp(1.115rem, 1.85vw, 1.39rem); line-height: 1.45; }
.hub-header + .section-block { margin-top: 2.35rem; }
.article-header { display: grid; grid-template-columns: minmax(0, 1.17fr) minmax(0, 1fr); align-items: center; gap: 2rem clamp(1.8rem, 4vw, 4.2rem); }
.article-heading h1 { font-size: clamp(2.6rem, 5.55vw, 5.2rem); }
.article-photo { position: relative; overflow: hidden; min-width: 0; aspect-ratio: 3 / 2; border-radius: var(--radius); background: var(--sand); }
.article-photo figcaption { position: absolute; right: .55rem; bottom: .5rem; max-width: calc(100% - 1.1rem); padding: .24rem .48rem; border-radius: 3px; background: #2b201a; color: #fffbeb; font: 650 var(--caption-size)/1.35 var(--text); }
.editorial-meta { display: flex; flex-wrap: wrap; gap: .2rem .85rem; margin-top: .85rem; color: var(--muted); font-size: .95rem; }
.editorial-meta a { color: var(--accent); font-weight: 650; text-underline-offset: .18em; }
.key-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 8rem), 1fr)); gap: .65rem 1.1rem; margin-top: 1.5rem; padding: 1rem 0; border-block: 1px solid var(--line); }
.key-facts dt { margin-bottom: .26rem; color: var(--muted); font: 500 var(--caption-size)/1.35 var(--mono); text-transform: uppercase; letter-spacing: .04em; }
.key-facts dd { margin: 0; color: var(--forest); font-weight: 650; font-size: .985rem; line-height: 1.25; }
.article-page .activities-compact { margin-top: clamp(2rem, 4vw, 3.6rem); margin-bottom: clamp(2.6rem, 5vw, 4.9rem); }
.article-page .activities-compact .section-heading h2 { font-size: clamp(1.95rem, 3.5vw, 3.3rem); }
.article-body, .policy-copy { max-width: 50rem; margin-top: clamp(2.3rem, 5vw, 4.6rem); }
.text-section + .text-section { margin-top: 2.25rem; }
.text-section h2 { font-size: clamp(1.7rem, 2.9vw, 2.55rem); line-height: 1.11; letter-spacing: -.052em; }
.text-section p { margin-top: .67rem; color: #4c4033; font-size: clamp(1.06rem, 1.36vw, 1.22rem); }
.source-box { max-width: 60rem; margin-top: 2rem; padding: 1rem 1.2rem; border: 1px solid var(--line); border-left: 3px solid #ae8f5f; border-radius: 7px; background: #f6eedc; color: #524837; }
.source-heading { display: flex; align-items: center; flex-wrap: wrap; gap: .35rem .55rem; }
.source-heading strong { color: var(--ink); }
.source-heading > span { font-size: .95rem; }
.source-box ul { display: flex; flex-wrap: wrap; gap: .5rem 1.1rem; list-style: none; margin: .55rem 0 0; padding: 0; font-size: .95rem; }
.source-box a { text-underline-offset: .2em; }
.source-box a:hover { color: var(--accent); }


.related-section { margin-bottom: 1rem; }
.related-section h2 { font-size: clamp(1.95rem, 3.55vw, 3.3rem); }
.related-section ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem 1.2rem; padding: 0; margin: 0; list-style: none; }
.related-section a { display: flex; align-items: center; justify-content: space-between; min-height: 3.25rem; gap: .8rem; padding: .64rem .78rem; border: 1px solid var(--line); border-radius: 6px; background: var(--cream); color: var(--accent); font-weight: 650; text-decoration: none; }
.related-section a:hover { border-color: var(--accent); }
#main { min-height: 40vh; }

@keyframes settle {
  from { transform: scale(1.035); }
  to { transform: scale(1); }
}
@keyframes rise {
  from { transform: translateY(5px); }
  to { transform: translateY(0); }
}
@keyframes mark-route {
  from { stroke-dashoffset: 25; opacity: .35; }
  to { stroke-dashoffset: 0; opacity: 1; }
}

@media (max-width: 980px) {
  :root { --header-height: 69px; }
  .header-inner { gap: .38rem .55rem; }
  .main-nav { order: 3; flex-basis: 100%; justify-content: start; padding-bottom: .5rem; }
  [data-js] .main-nav {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    background: var(--paper);
    border-bottom: 1px solid var(--line);
    box-shadow: 0 14px 20px #372c1b20;
    padding: .4rem var(--gutter) .65rem;
    max-height: max(8rem, calc(100dvh - var(--sticky-height, var(--header-height))));
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  [data-js] .main-nav.is-open { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; }
  [data-js] .main-nav a { padding: .8rem .22rem; border-bottom: 1px solid var(--line); }
  [data-js] .main-nav a:last-child { border-bottom: 0; }
  [data-js] .main-nav a::after { display: none; }
  [data-js] .main-nav [aria-current="page"] { color: var(--accent); font-weight: 700; }
  .menu-toggle { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid #867353; border-radius: 6px; background: transparent; color: var(--forest); }
  .menu-toggle > svg { grid-area: 1 / 1; }
  .menu-toggle > svg:last-child, .menu-toggle[aria-expanded="true"] > svg:first-child { visibility: hidden; }
  .menu-toggle[aria-expanded="true"] > svg:last-child { visibility: visible; }
  .activities-grid:not(.activities-grid--single) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-inner { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .footer-lang { grid-column: 1 / -1; }
}

@media (max-width: 720px) {
  .section-heading { align-items: flex-start; flex-direction: column; gap: .65rem; }
  .section-heading > p { width: auto; max-width: 34rem; }
  .destination-grid, .destination-grid--two { grid-template-columns: minmax(0, 1fr); }
  .destination-media, .destination-grid--two .destination-media { aspect-ratio: 2 / 1; }
  .destination-copy { padding: .8rem 1rem .92rem; }
  .destination-copy p { font-size: .95rem; }
  .map-spread { grid-template-columns: minmax(0, 1fr); }
  .map-figure { border-right: 0; border-bottom: 1px solid #d2c4aa; }
  .map-notes { padding: 1.1rem; }
  .season-heading { grid-template-columns: minmax(0, 1fr); gap: .65rem; }
  .season-heading > p { max-width: 46ch; }
  .season-grid { grid-template-columns: minmax(0, 1fr); gap: .55rem; }
  .season-note { padding: .7rem .85rem; }
  .season-footer { align-items: start; flex-direction: column; }
  .faq-section { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .article-header { grid-template-columns: minmax(0, 1fr); gap: 1.35rem; }
}

@media (max-width: 640px) {
  :root { --header-height: 64px; scroll-padding-top: .8rem; }
  .site-header { position: relative; }
  .header-inner { gap: .35rem .5rem; }
  .brand { gap: .45rem; }
  .brand-mark { width: 35px; height: 35px; }
  .wordmark { font-size: 1.42rem; }
  .header-actions { gap: .44rem; }
  .language-nav { padding: .13rem; }
  .language-nav > svg { display: none; }
  .hero { grid-template-columns: minmax(0, 1fr); min-height: 0; align-items: stretch; background: #34251c; }
  .hero-media { position: relative; inset: auto; z-index: 0; height: auto; }
  .hero-scene { position: relative; inset: auto; height: auto; aspect-ratio: 3 / 2; }
  .hero-picture img { object-position: center; animation: none; }
  .hero-shade { background: linear-gradient(0deg, #27191283, transparent 25%); }
  .hero-copy { width: 100%; max-width: 100%; padding: .96rem clamp(12px, 4.6vw, 1.6rem) 1.25rem; animation: none; }
  .hero-copy .eyebrow { margin-bottom: .65rem; }
  .hero h1 { font-size: clamp(2.83rem, 11.05vw, 4.65rem); line-height: .97; }
  .hero-lead { max-width: 43ch; margin-top: .75rem; line-height: 1.36; }
  .hero-actions { gap: .46rem; margin-top: 1rem; }
  .hero-actions .button { padding: .58rem .72rem; min-height: 44px; font-size: .97rem; gap: .4rem; }
  .hero-actions .button svg { width: .95rem; height: .95rem; }
  .field-seal { width: clamp(54px, 16vw, 86px); top: 10px; left: 11px; right: auto; bottom: auto; filter: drop-shadow(0 1px 2px #2e1c10ad); }
  .hero-caption { position: static; display: flex; max-width: none; border-radius: 0; padding: .45rem clamp(12px, 4.6vw, 1.6rem); }
  .filters { padding: clamp(10px, 4vw, 1rem); align-items: start; gap: .65rem; }
  .filter-field { flex: 1 1 10rem; }
  .filter-field select { padding-left: 9px; padding-right: 28px; }
  .select-shell svg { margin-right: 8px; }
  .filter-summary { flex: 1 1 100%; justify-content: space-between; min-height: 1.5rem; }
  .activities-grid:not(.activities-grid--single) { grid-template-columns: minmax(0, 1fr); }
  .activities-grid--single .activity-card { display: flex; flex-direction: column; }
  .activities-grid--single .activity-photo { aspect-ratio: 3 / 2; }
  .activities-grid--single .activity-photo img { position: static; }
  .activities-grid--single .activity-link { width: 100%; }
  .map-pin span { width: 24px; }
  .map-pin { width: 32px; }
  .map-pin svg { width: 15px; height: 15px; }
  .map-pin[aria-pressed="true"] span { transform: scale(1.1); }
  .article-page .activities-compact .section-heading { margin-bottom: .95rem; }
  .activities-compact .activity-photo { aspect-ratio: 2 / 1; }
  .related-section ul { grid-template-columns: minmax(0, 1fr); }
  .footer-inner { grid-template-columns: repeat(2, minmax(0, 1fr)); padding-block: 2.1rem 1.55rem; gap: 1.4rem .8rem; }
  .footer-brand, .footer-lang { grid-column: 1 / -1; }
  .footer-bottom { align-items: start; flex-direction: column; gap: .18rem; }
}

@media (max-width: 355px) {
  .wordmark { font-size: 1.23rem; }
  .brand-mark { width: 31px; height: 31px; }
  .hero-actions .button { padding-inline: .57rem; }
  .hero h1 { font-size: 2.61rem; }
}

@media (max-height: 520px) {
  :root { scroll-padding-top: .8rem; }
  .site-header { position: relative; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}


/* Idiomas: com mais de 3 idiomas os botões saem do cabeçalho no celular e vão para o painel do menu */
.menu-lang { display: none; }
@media (max-width: 980px) {
  .site-header .language-nav--many { display: none; }
  .main-nav .menu-lang { display: flex; padding: .55rem 0 .1rem; }
  .main-nav .menu-lang .language-nav > svg { display: block; }
  .main-nav .menu-lang .language-nav > a,
  [data-js] .main-nav .menu-lang .language-nav > a { min-width: 44px; min-height: 44px; padding: .16em .27em; border-bottom: 0; font-size: .875rem; font-weight: 500; }
}

/* Alvos de toque de 44 px no celular, sem mexer no espaçamento (margem negativa compensa) */
@media (max-width: 980px) {
  .language-nav > a, .language-nav .lang-current { min-width: 44px; min-height: 44px; }
  .footer-bottom a, .footer-links a, .field-citation a, .source-box li a, .route-sources a, .breadcrumbs a { display: inline-flex; align-items: center; min-height: 44px; margin-block: -10px; }
}

/* Fase 2: selo do idioma do guia e modelos de página (escolha, roteiro, época, passeio) */
.guide-seal { display: inline-flex; margin: .4rem 0 0; padding: .24rem .49rem; background: #f5ecda; border: 1px solid #e3d3b2; border-radius: 4px; color: #5a4524; font-size: .84rem; font-weight: 650; line-height: 1.22; }
.guide-seal.is-other { background: #fbe9d9; border-color: #efc7a3; color: #7a3a12; }
.guide-seal-inline { display: block; margin-top: .3rem; font-size: .82rem; font-weight: 650; color: #5a4524; }
.guide-seal-inline.is-other { color: #7a3a12; }
.model-block { margin-block: clamp(1.6rem, 3.4vw, 2.6rem); }
.model-block h2 { margin-bottom: 1rem; }
.model-table-wrap { overflow-x: auto; }
.model-table { width: 100%; border-collapse: collapse; font-size: .95rem; background: #fffaf0; border: 1px solid #e8ddc9; }
.model-table th, .model-table td { padding: .7rem .85rem; text-align: left; vertical-align: top; border-bottom: 1px solid #e8ddc9; line-height: 1.35; }
.model-table thead th { background: #f3e9d6; font-size: .84rem; text-transform: uppercase; letter-spacing: .04em; color: #4b3b25; }
.model-table tbody th a { font-weight: 650; }
.day-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.day-list li { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr); gap: .9rem; padding: 1rem 1.1rem; background: #fffaf0; border: 1px solid #e8ddc9; border-radius: 6px; }
.day-n { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: var(--forest); color: #fff; font: 500 1.05rem var(--mono); }
.day-list h3 { margin: 0 0 .35rem; font-size: 1.2rem; }
.day-list p { margin: 0 0 .5rem; }
.day-offer a { font-weight: 650; }
.check-list { margin: 0; padding-left: 1.2rem; display: grid; gap: .45rem; }
@media (max-width: 720px) {
  .model-table, .model-table tbody, .model-table tr, .model-table th, .model-table td { display: block; width: 100%; }
  .model-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .model-table tr { padding: .5rem 0; border-bottom: 2px solid #e3d3b2; }
  .model-table th, .model-table td { border: 0; padding: .3rem .85rem; }
  .model-table td::before { content: attr(data-label); display: block; font-size: .76rem; text-transform: uppercase; letter-spacing: .04em; color: #695642; }
  .model-table--months td::before { content: none; }
}
