/*
 * Site chrome, on every page: the skip link, the header with its mega menu
 * and its mobile panel, the footer, the mobile action bar.
 */

/* Skip link ------------------------------------------------------------ */

.skip-link:focus {
  position: fixed;
  top: var(--azul-space-s);
  left: var(--azul-space-s);
  z-index: var(--z-skip);
  width: auto;
  height: auto;
  clip-path: none;
  padding: var(--azul-space-xs) var(--azul-space-s);
  background: var(--azul-surface);
}

/* Header ------------------------------------------------------------- */

/* Fixed over the page. Transparent with a soft shade over a hero, solid
   white once the page scrolls or a panel is open, compact further down. */
.site-header {
  position: fixed;
  top: var(--wp-admin--admin-bar--height, 0px);
  right: 0;
  left: 0;
  z-index: var(--z-header);
  background: #fff;
  color: var(--azul-ink);
  box-shadow: 0 1px 0 var(--azul-line);
  transition: background-color var(--azul-t) ease, box-shadow var(--azul-t) ease, color var(--azul-t) ease;
}

.site-main { padding-top: calc(var(--azul-header-h) + var(--azul-space-l)); }
.has-hero .site-main { padding-top: 0; }

.has-hero .site-header { background: transparent; box-shadow: none; color: #fff; }
.has-hero .site-header::before { content: ""; position: absolute; inset: 0 0 -40px; z-index: -1; background: linear-gradient(180deg, rgba(var(--azul-veil), .55) 0%, rgba(var(--azul-veil), 0) 100%); pointer-events: none; transition: opacity var(--azul-t) ease; }
.has-hero .site-header:is(.is-solid, .is-mega, .is-open) { background: #fff; color: var(--azul-ink); box-shadow: 0 1px 0 var(--azul-line), 0 8px 24px -16px rgba(15, 51, 80, .35); }
.site-header:is(.is-solid, .is-mega, .is-open)::before { opacity: 0; }
/* Scrim over the page while a mega panel is open. */
.site-header::after { content: ""; position: absolute; top: 100%; right: 0; left: 0; z-index: -1; height: 100vh; background: rgba(var(--azul-veil), .35); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity var(--azul-t-fast) ease, visibility 0s var(--azul-t-fast); }
.site-header.is-mega::after { opacity: 1; visibility: visible; transition: opacity var(--azul-t-fast) ease; }

.site-header :where(ul) { margin: 0; padding: 0; list-style: none; }
.site-header :where(p) { margin: 0; }

.site-header__bar { position: relative; display: flex; align-items: center; gap: 16px; height: var(--azul-header-h); transition: height var(--azul-t) ease; }

.site-header__logo { display: flex; flex: none; align-items: center; color: inherit; text-decoration: none; }
.site-header__logo-img { display: block; width: auto; height: 52px; max-width: 180px; object-fit: contain; transition: height var(--azul-t) ease, filter var(--azul-t) ease; }
.site-header.is-compact .site-header__logo-img { height: 42px; }
/* The logo turns white over a hero. */
.has-hero .site-header:not(.is-solid, .is-mega, .is-open) .site-header__logo-img { filter: brightness(0) invert(1); }
/* Over a light hero the header keeps its ink colours and its own logo. */
.has-hero-light .site-header { color: var(--azul-navy); }
.has-hero-light .site-header::before { content: none; }
.has-hero-light .site-header:not(.is-solid, .is-mega, .is-open) .site-header__logo-img { filter: none; }
.has-hero-light .site-header:not(.is-solid, .is-mega, .is-open) .menu-bar__top:hover,
.has-hero-light .site-header:not(.is-solid, .is-mega, .is-open) .menu-bar__item.is-open > .menu-bar__top { background: rgba(11, 47, 75, .08); }
.site-header__logo:hover { color: inherit; }
/* Over a package hero on a large screen the bar opens as wide as the hero content. */
@media (min-width: 1600px) {
  .has-hero-package .site-header .shell--wide { width: min(100% - 2 * var(--azul-gutter), 1680px); }
}

/* Wordmark fallback, when no logo is set. */
.brand { display: inline-flex; flex-direction: column; align-items: flex-start; color: inherit; line-height: 1; }
.brand__name { display: inline-flex; align-items: center; gap: .2em; font-family: var(--azul-font-display); font-size: 2.2rem; letter-spacing: -.01em; }
.brand__wave { width: .95em; height: auto; margin-top: .12em; }
.brand__place { margin-top: .35rem; font-size: .62rem; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; }

.site-nav { flex: 1; min-width: 0; }

/* Top level */
.menu-bar { display: flex; align-items: center; justify-content: center; gap: 2px; }

.menu-bar__top {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 40px;
  padding: 0 12px;
  border: 0;
  border-radius: var(--azul-radius-s);
  background: none;
  color: inherit;
  font: inherit;
  font-size: var(--azul-text-base);
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--azul-t-fast) ease, color var(--azul-t-fast) ease;
}

.menu-bar__top .icon { width: 14px; height: 14px; stroke-width: 2; transition: transform .2s ease; }
.menu-bar__top:hover,
.menu-bar__item.is-open > .menu-bar__top { background: rgba(255, 255, 255, .14); color: inherit; }
.site-header:is(.is-solid, .is-mega) .menu-bar__top:hover,
.site-header:is(.is-solid, .is-mega) .menu-bar__item.is-open > .menu-bar__top,
.site-header:not(.has-hero *) .menu-bar__top:hover { background: #f6eee6; color: var(--azul-ink); }
.menu-bar__item.is-open > .menu-bar__top .icon { transform: rotate(180deg); }
.menu-bar__item.is-current > .menu-bar__top { box-shadow: inset 0 -2px 0 var(--azul-coral); border-radius: 0; }

/* Mega panel: it comes out from under the bar. Closed panels are not rendered,
   so their photos load on first opening only. The bar's shadow falls on it. */
.mega { position: absolute; top: 100%; right: 0; left: 0; z-index: 2; display: none; color: var(--azul-ink); clip-path: inset(0 -60px -90px); }
.menu-bar__item.is-open > .mega { display: block; }
.mega::after { content: ""; position: absolute; top: 0; right: 0; left: 0; height: 14px; background: linear-gradient(180deg, rgba(11, 47, 75, .12), rgba(11, 47, 75, 0)); pointer-events: none; }
.mega__inner { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); gap: 18px 36px; padding: 24px 32px 32px; border-radius: 0 0 var(--azul-radius) var(--azul-radius); background: var(--azul-ground); box-shadow: 0 16px 32px -20px rgba(15, 51, 80, .3); transition: transform .22s ease; }
@starting-style {
  .menu-bar__item.is-open > .mega .mega__inner { transform: translateY(-24px); }
}
.mega__inner--pair { grid-template-columns: minmax(0, 1fr); }
.mega__head { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.mega__kicker { display: flex; align-items: center; gap: 14px; color: var(--azul-cta); font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.mega__kicker::after { content: ""; width: 56px; height: 1.5px; background: currentColor; }
.mega__all { display: inline-flex; align-items: center; gap: 8px; color: var(--azul-ink); font-size: var(--azul-text-md); font-weight: 600; text-decoration: none; }
.mega__all:hover { color: var(--azul-cta); }
.mega__all .icon { width: 16px; height: 16px; color: var(--azul-cta); }
.mega__media { display: block; overflow: hidden; background: var(--azul-sand-3); }
.mega__img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.mega__title { font-family: var(--azul-font-display); letter-spacing: -.015em; }
.mega__go .icon { display: block; }

/* The large photo, its text on a shade at the bottom. */
.mega__features { display: grid; gap: 20px; }
.mega__inner--pair .mega__features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mega__feature a { position: relative; display: block; height: 100%; min-height: 300px; overflow: hidden; border-radius: var(--azul-radius); color: #fff; text-decoration: none; box-shadow: var(--azul-shadow-photo); }
.mega__feature a:hover { color: #fff; }
.mega__feature a:hover .mega__img { transform: scale(1.03); }
.mega__feature .mega__media { position: absolute; inset: 0; }
.mega__feature a::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(var(--azul-veil), .72) 0%, rgba(var(--azul-veil), .3) 34%, rgba(var(--azul-veil), 0) 60%); pointer-events: none; }
.mega__feature .mega__body { position: absolute; z-index: 1; right: 88px; bottom: 22px; left: 26px; display: flex; flex-direction: column; gap: 4px; }
.mega__feature .mega__title { font-size: clamp(1.9rem, 1.2rem + 1.2vw, 2.5rem); line-height: 1.1; }
.mega__feature .mega__text { font-size: var(--azul-text-lg); line-height: 1.4; }
.mega__feature .mega__badge { color: #fff; font-size: .82rem; font-weight: 600; }
.mega__feature .mega__go { position: absolute; z-index: 1; right: 22px; bottom: 22px; display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--azul-radius-s); background: var(--azul-cta); }
.mega__feature .mega__go .icon { width: 20px; height: 20px; }
/* With a label the button holds its text and the arrow; rows keep the arrow alone. */
.mega__feature .mega__go:has(.mega__go-label) { display: inline-flex; align-items: center; justify-self: start; gap: 10px; width: auto; padding-inline: 16px; color: #fff; font-size: .95rem; font-weight: 600; line-height: 1; white-space: nowrap; }
.mega__row .mega__go-label { display: none; }

/* The rows share the height of the large photo. */
.mega__rows { display: grid; grid-auto-rows: 1fr; }
.mega__row { display: grid; }
.mega__row:not(:last-child) { border-bottom: 1px solid var(--azul-line); }
.mega__row a { display: grid; grid-template-columns: 136px minmax(0, 1fr) auto; align-items: center; gap: 22px; padding: 10px 0; color: var(--azul-ink); text-decoration: none; }
.mega__row:first-child a { padding-top: 0; }
.mega__row:last-child a { padding-bottom: 0; }
.mega__row a:hover { color: var(--azul-ink); }
.mega__row .mega__media { aspect-ratio: 16 / 10; border-radius: var(--azul-radius-s); box-shadow: var(--azul-shadow-photo); }
.mega__row a:hover .mega__img { transform: scale(1.04); }
.mega__row .mega__body { display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: 2px 12px; }
.mega__row .mega__title { font-size: clamp(1.25rem, 1rem + .45vw, 1.5rem); line-height: 1.2; }
.mega__row .mega__badge { color: var(--azul-cta); font-size: .78rem; font-weight: 600; }
.mega__row .mega__text { grid-column: 1 / -1; color: var(--azul-ink-soft); font-size: var(--azul-text-base); line-height: 1.4; }
.mega__row .mega__go { color: var(--azul-cta); transition: transform .2s ease; }
.mega__row a:hover .mega__go { transform: translateX(4px); }
.mega__row .mega__go .icon { width: 24px; height: 24px; }

/* The compact panels, Guesthouse, Packages and About: a lower photo, a thin rule before
   the rows. Packages has its rows in two columns, filled top to bottom, with
   their badge and no text; Guesthouse has its three in one, with their text. */
@media (min-width: 1024px) {
  :is(.mega__inner--compact, .mega__inner--retreats) { gap: 16px; padding-block: 20px 26px; }
  :is(.mega__inner--compact, .mega__inner--retreats) .mega__feature a { min-height: 232px; }
  :is(.mega__inner--compact, .mega__inner--retreats) .mega__feature .mega__title { font-size: clamp(1.75rem, 1.2rem + .9vw, 2.25rem); }
  :is(.mega__inner--compact, .mega__inner--retreats) .mega__feature .mega__text { font-size: var(--azul-text-base); }
  .mega__inner--compact { grid-template-columns: minmax(0, .78fr) minmax(0, 1fr); column-gap: 0; }
  .mega__inner--compact .mega__feature a::after { background: linear-gradient(0deg, rgba(var(--azul-veil), .82) 0%, rgba(var(--azul-veil), .62) 42%, rgba(var(--azul-veil), 0) 78%); }
  .mega__inner--compact .mega__feature .mega__badge { order: 1; align-self: flex-start; margin-top: 6px; padding: 3px 10px; border: 1.5px solid var(--azul-cta); border-radius: var(--azul-radius-xs); font-size: .72rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
  .mega__inner--compact .mega__rows { margin-left: 24px; border-left: 1px solid var(--azul-line); }
  .mega__inner--packages .mega__rows { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, 1fr); grid-auto-rows: auto; grid-auto-flow: column; }
  .mega__inner--compact .mega__row:is(*, :first-child, :last-child) a { grid-template-columns: 96px minmax(0, 1fr) auto; gap: 14px; height: 100%; padding: 8px 14px 8px 20px; }
  .mega__inner--packages .mega__row:nth-child(odd) { border-bottom: 1px solid var(--azul-line); }
  .mega__inner--packages .mega__row:nth-child(even) { border-bottom: 0; }
  .mega__inner--packages .mega__row:nth-child(n + 3) { border-left: 1px solid var(--azul-line); }
  .mega__inner--compact .mega__row .mega__media { aspect-ratio: 16 / 10; }
  .mega__inner--packages .mega__row .mega__media { aspect-ratio: 5 / 4; }
  .mega__inner--compact .mega__row .mega__body { grid-template-columns: minmax(0, 1fr); gap: 5px; }
  .mega__inner--compact .mega__row .mega__title { font-size: clamp(1.1rem, .95rem + .3vw, 1.3rem); line-height: 1.15; }
  .mega__inner--compact .mega__row .mega__badge { font-size: .7rem; font-weight: 700; letter-spacing: .05em; line-height: 1.3; text-transform: uppercase; }
  .mega__inner--compact .mega__row .mega__text { font-size: var(--azul-text-md); line-height: 1.3; }
  .mega__inner--packages .mega__row .mega__text { display: none; }
  .mega__inner--compact .mega__row .mega__go .icon { width: 20px; height: 20px; }

  /* The first package reads like the others: a square photo, its title and
     text beside it, not over it. Text and button sit together, centred
     vertically against the photo (two flexible rows around them). */
  .mega__inner--packages .mega__feature a { display: grid; grid-template-columns: minmax(0, 42%) minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto auto minmax(0, 1fr); gap: 0 20px; overflow: visible; padding-right: 20px; border-radius: 0; color: var(--azul-ink); box-shadow: none; }
  .mega__inner--packages .mega__feature a:hover { color: var(--azul-ink); }
  .mega__inner--packages .mega__feature a::after { content: none; }
  .mega__inner--packages .mega__feature .mega__media { position: static; grid-column: 1; grid-row: 1 / -1; aspect-ratio: 1; align-self: center; border-radius: var(--azul-radius); box-shadow: var(--azul-shadow-photo); }
  .mega__inner--packages .mega__feature .mega__body { position: static; grid-column: 2; grid-row: 2; gap: 6px; }
  .mega__inner--packages .mega__feature .mega__text { color: var(--azul-ink-soft); line-height: 1.35; }
  .mega__inner--packages .mega__feature .mega__badge { color: var(--azul-cta); }
  .mega__inner--packages .mega__feature .mega__go { position: static; grid-column: 2; grid-row: 3; margin-top: 12px; color: #fff; }
  @media (min-width: 1280px) {
    .mega__inner--packages .mega__feature a { grid-template-columns: minmax(0, 50%) minmax(0, 1fr); }
    .mega__inner--packages .mega__feature .mega__media { aspect-ratio: auto; align-self: stretch; min-height: 0; }
  }

  /* The About panel with many rows: a narrower photo, three rows in each of
     two columns, filled top to bottom. */
  .mega__inner--columns { grid-template-columns: minmax(0, .46fr) minmax(0, 1fr); }
  .mega__inner--columns .mega__rows { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(3, 1fr); grid-auto-rows: auto; grid-auto-flow: column; }
  .mega__inner--columns .mega__row:nth-child(3n) { border-bottom: 0; }
  .mega__inner--columns .mega__row:nth-child(n + 4) { border-left: 1px solid var(--azul-line); }
  .mega__inner--columns .mega__row .mega__media { aspect-ratio: 5 / 4; }

  /* The retreats panel: the first photo twice as wide, a line of facts on it. */
  .mega__inner--retreats .mega__features { grid-template-columns: minmax(0, 2.13fr) minmax(0, 1fr); }
  .mega__inner--retreats .mega__feature a::after { background: linear-gradient(0deg, rgba(var(--azul-veil), .86) 0%, rgba(var(--azul-veil), .68) 42%, rgba(var(--azul-veil), 0) 76%); }
  .mega__facts { display: flex; flex-wrap: wrap; gap: 8px 0; margin-top: 12px; }
  .mega__fact { display: flex; align-items: center; gap: 10px; padding-inline: 18px; border-left: 1px solid rgba(255, 255, 255, .4); font-size: var(--azul-text-sm); line-height: 1.25; }
  .mega__fact:first-child { padding-left: 0; border-left: 0; }
  .mega__fact strong { display: block; font-weight: 600; }
  .mega__fact .icon { flex: none; width: 26px; height: 26px; color: #f59a55; }
}
@media (min-width: 1024px) and (max-width: 1199px) {
  .mega__inner--compact .mega__row:is(*, :first-child, :last-child) a { grid-template-columns: 72px minmax(0, 1fr) auto; }
}

/* Tools: booking + language */
.site-header__tools { display: flex; flex: none; align-items: center; gap: 8px; }
.site-header__book { min-height: 46px; padding: 0 20px; }
.site-header__book .icon { width: 20px; height: 20px; }
.site-nav__foot,
.site-header__toggle { display: none; }
/* Booking funnel: logo on the left, the way back and the languages on the right. */
.site-header--funnel .site-header__bar { justify-content: space-between; }
.site-header--funnel .site-header__tools { gap: 20px; }
.site-header__back { color: var(--azul-ink-soft); font-size: var(--azul-text-sm); font-weight: 500; text-decoration: none; white-space: nowrap; }
.site-header__back:hover { color: var(--azul-ink); text-decoration: underline; text-underline-offset: 3px; }

/* Language switcher: a flag row, or a dropdown (<details>). */
.lang-switcher { display: flex; flex-wrap: wrap; gap: .2rem; margin: 0; padding: 0; list-style: none; }
.lang-switcher a { display: inline-flex; align-items: center; gap: .45em; padding: .35em .55em; border-radius: var(--azul-radius-xs); color: inherit; font-size: var(--azul-text-sm); font-weight: 600; letter-spacing: .05em; text-decoration: none; transition: color var(--azul-t-fast) var(--azul-ease), background-color var(--azul-t-fast) var(--azul-ease); }
.lang-switcher__flag { display: block; flex: none; width: 20px; height: 14px; border-radius: 1.5px; box-shadow: 0 0 0 1px var(--azul-hairline); }
.lang-switcher--dropdown { display: block; position: relative; }
.lang-switcher__current { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 10px; border-radius: var(--azul-radius-s); color: inherit; font-size: var(--azul-text-base); font-weight: 600; cursor: pointer; list-style: none; user-select: none; transition: background-color var(--azul-t-fast) var(--azul-ease); }
.lang-switcher__current::-webkit-details-marker { display: none; }
.lang-switcher__current:hover,
.lang-switcher--dropdown[open] .lang-switcher__current { background: rgba(255, 255, 255, .14); }
.site-header.is-solid .lang-switcher__current:hover,
.site-header.is-solid .lang-switcher--dropdown[open] .lang-switcher__current,
body:not(.has-hero) .lang-switcher__current:hover { background: #f6eee6; }
.lang-switcher__chevron { width: 7px; height: 7px; margin: -3px 0 0 .1em; border-right: 1.75px solid currentColor; border-bottom: 1.75px solid currentColor; transform: rotate(45deg); transition: transform var(--azul-t) var(--azul-ease); }
.lang-switcher--dropdown[open] .lang-switcher__chevron { transform: translateY(3px) rotate(-135deg); }
.lang-switcher__menu { position: absolute; top: calc(100% + 8px); right: 0; z-index: 60; min-width: 170px; margin: 0; padding: 6px; list-style: none; border-radius: var(--azul-radius); background: #fff; box-shadow: var(--azul-shadow-pop); }
.lang-switcher--dropdown::details-content { opacity: 0; transform: translateY(-.3rem); transition: opacity var(--azul-t) var(--azul-ease), transform var(--azul-t) var(--azul-ease), content-visibility var(--azul-t) allow-discrete; }
.lang-switcher--dropdown[open]::details-content { opacity: 1; transform: none; }
.lang-switcher__menu a { display: flex; width: 100%; gap: 10px; padding: 9px 10px; border-radius: var(--azul-radius-s); color: var(--azul-ink); font-size: var(--azul-text-md); font-weight: 400; letter-spacing: 0; white-space: nowrap; }
.lang-switcher__menu a:hover,
.lang-switcher__menu a.is-current { background: var(--azul-paper); color: var(--azul-ink); }

.site-header a:focus-visible,
.site-header button:focus-visible,
.site-header summary:focus-visible { outline-offset: 2px; }

/* Narrow desktops: a tighter top level. */
@media (max-width: 1279px) and (min-width: 1024px) {
  .menu-bar__top { padding: 0 8px; font-size: var(--azul-text-md); }
}

/* Tablet and mobile: full-height panel with accordions. */
@media (max-width: 1023px) {
  .site-header__bar { gap: 8px; }
  .site-header__logo { margin-right: auto; }
  .site-header__logo-img,
  .site-header.is-compact .site-header__logo-img { height: 42px; max-width: 140px; }
  .site-header__tools .site-header__book { display: none; }
  .lang-switcher__current { padding: 0 8px; font-size: var(--azul-text-md); }

  .site-header__toggle { display: grid; flex: none; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; background: none; color: inherit; cursor: pointer; }
  .site-header__burger { display: grid; gap: 5px; width: 24px; }
  .site-header__burger span { display: block; height: 2px; border-radius: 2px; background: currentColor; transition: transform var(--azul-t) ease, opacity .2s ease; }
  .site-header.is-open .site-header__burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .site-header.is-open .site-header__burger span:nth-child(2) { opacity: 0; }
  .site-header.is-open .site-header__burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  .site-nav { position: fixed; top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--azul-header-h)); right: 0; bottom: 0; left: 0; overflow-y: auto; overscroll-behavior: contain; background: #fff; color: var(--azul-ink); opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity .2s ease, transform .2s ease, visibility 0s .2s; }
  .site-header.is-open .site-nav { opacity: 1; visibility: visible; transform: none; transition: opacity .2s ease, transform .2s ease; }
  .site-nav__panel { width: min(640px, 100% - 2 * var(--azul-gutter)); margin-inline: auto; padding: 8px 0 calc(32px + env(safe-area-inset-bottom)); }

  .menu-bar { flex-direction: column; align-items: stretch; gap: 0; }
  .menu-bar__item { border-bottom: 1px solid var(--azul-line); }
  .menu-bar__top { justify-content: space-between; width: 100%; height: auto; padding: 16px 0; border-radius: 0; font-size: var(--azul-text-xl); }
  .menu-bar__top:hover,
  .menu-bar__item.is-open > .menu-bar__top,
  .site-header.is-solid .menu-bar__top:hover,
  .site-header.is-solid .menu-bar__item.is-open > .menu-bar__top { background: none; }
  .menu-bar__item.is-open > .menu-bar__top { color: var(--azul-coral); }
  .menu-bar__item:is(.is-open, .is-current) > .menu-bar__top { box-shadow: none; }
  .menu-bar__top .icon { width: 18px; height: 18px; }

  .mega { position: static; clip-path: none; }
  .mega::after,
  .mega__facts,
  .mega__kicker,
  .mega__text,
  .mega__badge,
  .mega__feature a::after,
  .mega__go,
  .mega__feature .mega__go { display: none; }
  .mega__inner { display: flex; flex-direction: column; gap: 8px; padding: 0 0 16px; border-radius: 0; background: none; box-shadow: none; transition: none; }
  .mega__head { order: 1; }
  .mega__all { justify-content: center; width: 100%; margin-top: 4px; padding: 11px 16px; border: 1.5px solid var(--azul-coral); border-radius: var(--azul-radius-s); color: var(--azul-coral); }
  .mega__all .icon { color: inherit; }
  .mega__features,
  .mega__inner--pair .mega__features,
  .mega__rows { display: flex; flex-direction: column; gap: 8px; }
  .mega__row { display: block; }
  .mega__row:not(:last-child) { border-bottom: 0; }
  .mega__feature a,
  .mega__row:is(*, :first-child, :last-child) a { position: static; display: flex; align-items: center; gap: 0; min-height: 0; height: auto; padding: 0; overflow: visible; border-radius: 0; color: var(--azul-ink); box-shadow: none; }
  .mega__feature a:hover { color: var(--azul-ink); }
  .mega__feature .mega__media,
  .mega__row .mega__media { position: static; flex: none; width: 64px; height: 48px; border-radius: var(--azul-radius-s); box-shadow: none; aspect-ratio: auto; }
  .mega__feature .mega__body,
  .mega__row .mega__body { position: static; display: block; padding: 0 0 0 12px; }
  .mega__feature .mega__title,
  .mega__row .mega__title { font-family: inherit; font-size: var(--azul-text-base); font-weight: 600; line-height: 1.3; letter-spacing: 0; }

  .site-nav__foot { display: flex; flex-direction: column; gap: 10px; margin-top: 20px; }
  .site-nav__foot .button { min-height: 52px; }
}

/* Footer ------------------------------------------------------------- */

.site-footer { background: var(--azul-ground); color: var(--azul-ink-soft); font-size: var(--azul-text-base); line-height: 1.6; }
.site-footer :where(p) { margin: 0; }
.site-footer :where(ul) { margin: 0; padding: 0; list-style: none; }
.site-footer ul.shell { margin-inline: auto; }
.site-footer a:focus-visible { border-radius: var(--azul-radius-xs); }

/* Call-to-action band on the group photo. */
.site-footer__band { position: relative; padding: clamp(64px, 4.5vw, 84px) 0 clamp(84px, 6vw, 104px); background: var(--azul-navy); color: #fff; isolation: isolate; }
/* Light veil: dark only behind the text on the left and under the reassurance row, the sunset stays bright. */
.site-footer__band::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(var(--azul-veil), .7) 0%, rgba(var(--azul-veil), .42) 34%, rgba(var(--azul-veil), 0) 60%), linear-gradient(0deg, rgba(var(--azul-veil), .6) 0%, rgba(var(--azul-veil), 0) 28%); }
/* Surfer facing the sunset waves: keep the sun and the surfer in frame. */
.site-footer__band-img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; filter: saturate(1.08) contrast(1.04); }
.site-footer__band-inner { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; }
/* The text column holds the left part of the photo, as on the mockup. */
.site-footer__band-copy { width: min(100%, 620px); }
.site-footer__kicker { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; color: rgba(255, 255, 255, .92); font-size: var(--azul-text-sm); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.site-footer__kicker::before { content: ""; width: 34px; height: 3px; border-radius: 2px; background: var(--azul-coral); }
.site-footer__band-title { color: #fff; font-family: var(--azul-font-display); font-size: clamp(2.4rem, 1.5rem + 2.6vw, 3.9rem); line-height: 1.02; letter-spacing: -.015em; text-shadow: 0 2px 18px rgba(var(--azul-veil), .25); }
/* Orange brush stroke under the title (same mask as the arched underlines). */
.site-footer__band-stroke { display: block; width: min(62%, 300px); height: 16px; margin-top: 10px; background: var(--azul-orange); -webkit-mask: url("../img/marks/arch-soft.webp") center / 100% 100% no-repeat; mask: url("../img/marks/arch-soft.webp") center / 100% 100% no-repeat; }
.site-footer__band-lead { margin-top: 16px; color: #fff; font-size: var(--azul-text-xl); line-height: 1.6; text-shadow: 0 1px 10px rgba(var(--azul-veil), .3); }
.site-footer__band-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 24px; }
.site-footer__band-actions .button { min-height: 56px; padding-inline: 26px; font-size: var(--azul-text-lg); }
.site-footer__band-actions .button .icon { width: 22px; height: 22px; }

/* Main area */
.site-footer__main { position: relative; padding: 56px 0 24px; }
/* The footer rises over the band on the same gentle wave as the sections
   (layout.css), mirrored so the two edges of the band differ. */
.site-footer__main::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: calc(100% - 1px);
  left: 0;
  height: 30px;
  background: var(--azul-ground);
  pointer-events: none;
  transform: scaleX(-1);
  -webkit-mask: url("../img/marks/section-wave.svg") center bottom / 100% 100% no-repeat;
  mask: url("../img/marks/section-wave.svg") center bottom / 100% 100% no-repeat;
}
.site-footer__grid { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(0, 3.2fr) minmax(250px, 1fr); gap: 40px; align-items: start; }
.site-footer__logo { display: inline-flex; color: var(--azul-ink); text-decoration: none; }
.site-footer__logo-img { display: block; width: auto; height: 44px; max-width: 220px; object-fit: contain; }
.site-footer__about { margin: 18px 0 20px; font-size: .906rem; line-height: 1.6; }
.site-footer__follow { margin: 0; padding: 0; list-style: none; }
.site-footer__cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(112px, 1fr)); gap: 28px 20px; }
.site-footer__heading { margin-bottom: 14px; color: var(--azul-ink); font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.site-footer__col li + li { margin-top: 8px; }
.site-footer__col a { color: var(--azul-ink); font-size: .906rem; line-height: 1.35; text-decoration: none; }
.site-footer__col a:hover { color: var(--azul-coral); }
.site-footer__side { display: flex; flex-direction: column; gap: 24px; padding-left: 32px; border-left: 1px solid var(--azul-line); }
.site-footer__contact li + li { margin-top: 16px; }
.site-footer__contact a { display: flex; align-items: flex-start; gap: 12px; color: var(--azul-ink); font-size: .906rem; line-height: 1.4; text-decoration: none; }
.site-footer__contact a:hover span { color: var(--azul-coral); }
.site-footer__contact .icon { width: 22px; height: 22px; margin-top: 1px; }
.site-footer__contact span { display: flex; flex-direction: column; min-width: 0; overflow-wrap: anywhere; }
.site-footer__contact small { color: var(--azul-ink-soft); font-size: var(--azul-text-sm); }
.site-footer__contact small.is-accent { color: var(--azul-coral); }
.site-footer__map { position: relative; display: block; overflow: hidden; border: 1px solid var(--azul-line); border-radius: var(--azul-radius); text-decoration: none; }
.site-footer__map-img { display: block; width: 100%; height: auto; }
.site-footer__map-cta { position: absolute; right: 10px; bottom: 10px; left: 10px; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 8px 10px; border-radius: var(--azul-radius); background: rgba(255, 255, 255, .94); color: var(--azul-ink); font-size: var(--azul-text-sm); font-weight: 600; box-shadow: 0 4px 14px rgba(15, 51, 80, .18); }
.site-footer__map-cta .icon { width: 16px; height: 16px; color: var(--azul-coral); }

/* Reassurance and legal bar */
.site-footer__bottom { background: var(--azul-navy); color: rgba(255, 255, 255, .78); }
.site-footer__trust { display: grid; grid-template-columns: repeat(4, 1fr); padding: 30px 0; }
.site-footer__trust li { display: flex; align-items: center; gap: 16px; padding: 4px 24px; }
.site-footer__trust li + li { border-left: 1px solid rgba(255, 255, 255, .16); }
.site-footer__trust .icon { width: 36px; height: 36px; color: #fff; stroke-width: 1.3; }
.site-footer__trust span { display: flex; flex-direction: column; }
.site-footer__trust strong { color: #fff; font-size: .969rem; font-weight: 600; }
.site-footer__trust small { font-size: .844rem; }
.site-footer__legal { border-top: 1px solid rgba(255, 255, 255, .14); }
.site-footer__legal-inner { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; padding: 18px 0 22px; font-size: var(--azul-text-sm); }
.site-footer__legal-links { display: flex; flex-wrap: wrap; gap: 6px 20px; }
.site-footer__legal a,
.site-footer__consent { color: rgba(255, 255, 255, .78); text-decoration: none; }
.site-footer__legal a:hover,
.site-footer__consent:hover { color: #fff; }
.site-footer__consent { padding: 0; border: 0; background: none; font: inherit; cursor: pointer; }
/* Credit: a thin, quiet line at the very foot of the legal bar. */
.site-footer__credit { flex-basis: 100%; order: 9; margin: 4px 0 -12px; padding-top: 8px; border-top: 1px solid rgba(255, 255, 255, .08); color: rgba(255, 255, 255, .6); font-size: .68rem; letter-spacing: .02em; line-height: 1.4; text-align: center; }
.site-footer__legal .site-footer__credit a { color: inherit; text-decoration: none; }
.site-footer__legal .site-footer__credit a:hover { color: rgba(255, 255, 255, .8); }
.site-footer .lang-switcher--footer { margin-left: auto; gap: 4px; }
.site-footer .lang-switcher--footer a { padding: 3px 7px; color: rgba(255, 255, 255, .78); }
.site-footer .lang-switcher--footer .lang-switcher__flag { display: none; }
.site-footer .lang-switcher--footer a:hover,
.site-footer .lang-switcher--footer a.is-current { background: rgba(255, 255, 255, .14); color: #fff; }
.site-footer__badge { display: block; width: auto; height: 25px; padding: 2px 6px; border-radius: var(--azul-radius-xs); background: #fff; }
/* Booking page: one thin line, light, no photo band nor columns. */
.site-footer--slim { border-top: 1px solid var(--azul-line); background: var(--azul-surface); color: var(--azul-ink-soft); }
.site-footer--slim .site-footer__legal { border-top: 0; }
.site-footer--slim .site-footer__legal-inner { gap: 8px 24px; padding: 14px 0; font-size: var(--azul-text-xs); }
.site-footer--slim .site-footer__copy { margin: 0; }
.site-footer--slim .site-footer__legal a,
.site-footer--slim .site-footer__consent { color: var(--azul-ink-soft); }
.site-footer--slim .site-footer__legal a:hover,
.site-footer--slim .site-footer__consent:hover { color: var(--azul-ink); }
.site-footer--slim .site-footer__badge { margin-left: auto; height: 22px; padding: 0; }
@media (max-width: 719px) {
  .site-footer--slim .site-footer__legal-inner { justify-content: center; text-align: center; }
  .site-footer--slim .site-footer__legal-links { justify-content: center; gap: 4px 16px; }
  .site-footer--slim .site-footer__badge { margin: 0 auto; }
}

@media (max-width: 1199px) {
  .site-footer__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .site-footer__cols { grid-column: 1 / -1; order: 3; }
  .site-footer__side { padding-left: 0; border-left: 0; }
  .site-footer__trust { grid-template-columns: repeat(2, 1fr); gap: 20px 0; }
  .site-footer__trust li:nth-child(3) { border-left: 0; }
}

@media (max-width: 767px) {
  .site-footer__band { padding-block: 56px 64px; }
  .site-footer__band-inner { grid-template-columns: 1fr; }
  .site-footer__band-actions { flex-direction: column; }
  .site-footer__band-actions .button { width: 100%; }
  .site-footer__band-img { object-position: 74% 40%; }
  .site-footer__band::before { background: linear-gradient(180deg, rgba(60, 24, 8, .38) 0%, rgba(40, 24, 24, .4) 38%, rgba(var(--azul-veil), .75) 100%); }
  .site-footer__main::before { height: 16px; }
  .site-footer__grid { grid-template-columns: 1fr; gap: 36px; }
  .site-footer__cols { grid-template-columns: 1fr 1fr; order: 0; }
  .site-footer__trust { grid-template-columns: 1fr; gap: 0; padding: 20px 0; }
  .site-footer__trust li { padding: 12px 0; }
  .site-footer__trust li + li { border-top: 1px solid rgba(255, 255, 255, .12); border-left: 0; }
  .site-footer .lang-switcher--footer { margin-left: 0; }
}

/* Phone: each link column is its heading, then its links as tags on wrapping
   rows, instead of two tall columns of one link per line. */
@media (max-width: 719px) {
  .site-footer__cols { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .site-footer__cols .site-footer__heading { margin-bottom: 8px; }
  .site-footer__col ul { display: flex; flex-wrap: wrap; gap: 6px; }
  .site-footer__col li + li { margin-top: 0; }
  .site-footer__col a { display: flex; align-items: center; min-height: 32px; padding: 4px 10px; border: 1px solid var(--azul-line); border-radius: var(--azul-radius-xs); background: var(--azul-surface); font-size: .86rem; line-height: 1.2; }
}

/* Mobile action bar --------------------------------------------------- */

@media (max-width: 1023px) {
  body { padding-bottom: var(--azul-bar-h); }
}

/* viewport-fit=cover: the page keeps clear of a side notch in landscape. */
body, .site-header, .site-nav { padding-right: env(safe-area-inset-right); padding-left: env(safe-area-inset-left); }

.mobile-bar { position: fixed; inset: auto 0 0; z-index: var(--z-bar); display: flex; justify-content: space-around; align-items: stretch; height: var(--azul-bar-h); padding: 0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); background: var(--azul-surface); border-top: 1px solid var(--azul-line); box-shadow: var(--azul-shadow-bar); transition: transform .25s ease; }
.has-nav-open .mobile-bar { transform: translateY(100%); }
.mobile-bar__item { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .2rem; min-width: 0; padding: .35rem .2rem; color: var(--azul-ink-soft); text-decoration: none; font-size: .68rem; letter-spacing: .01em; line-height: 1.1; transition: color var(--azul-t-fast) var(--azul-ease); }
.mobile-bar__item:active .mobile-bar__icon { transform: scale(.92); }
.mobile-bar__icon { transition: transform var(--azul-t-fast) var(--azul-ease); }
.mobile-bar__item.is-current { color: var(--azul-coral-dark); }
.mobile-bar__icon { display: inline-flex; }
.mobile-bar__icon .icon { width: 24px; height: 24px; }
.mobile-bar__label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mobile-bar__item--primary { color: var(--azul-coral); }
.mobile-bar__item--primary .mobile-bar__icon { width: 40px; height: 40px; padding: 8px; box-sizing: border-box; margin-top: -.5rem; border-radius: var(--azul-radius-s); background: var(--azul-coral); color: #fff; box-shadow: 0 6px 16px -8px rgba(173, 69, 34, .8); }
.mobile-bar__item--primary .mobile-bar__label { font-weight: 600; color: var(--azul-coral-dark); }

@media (min-width: 1024px) { .mobile-bar { display: none; } }