/* Spirit of Kenya — mobile refinement layer */
h1 em,
h2 em {
  color: var(--red) !important;
}

.dark-section h1 em,
.dark-section h2 em {
  color: var(--red-bright) !important;
}

.header-inner {
  position: relative;
  z-index: 4;
}

.menu-button {
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.mobile-panel {
  z-index: 2 !important;
  height: 100dvh;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  pointer-events: none;
  transition: opacity .32s ease, visibility .32s ease, transform .42s cubic-bezier(.22, 1, .36, 1) !important;
}

.mobile-panel.is-open {
  pointer-events: auto;
}

.mobile-panel-inner {
  height: auto !important;
  min-height: calc(100dvh - 150px);
  padding-bottom: max(28px, env(safe-area-inset-bottom));
}

html.sok-menu-open,
html.sok-menu-open body {
  overflow: hidden !important;
  overscroll-behavior: none;
}

.site-header.is-menu-open,
.site-header:has(.menu-button.is-open) {
  background: var(--charcoal);
  color: var(--cream);
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none;
}

.site-header.is-menu-open .brand img,
.site-header:has(.menu-button.is-open) .brand img {
  filter: brightness(0) invert(1) !important;
}

.site-header .brand {
  transition: width .3s ease, opacity .24s ease, transform .24s ease;
}

.mobile-about-group {
  position: relative;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 0;
  padding: 17px 0 18px;
}

.mobile-about-group > p {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  margin: 0 0 9px;
  color: var(--cream);
  font-family: var(--display);
  font-size: 31px;
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: 1;
  text-transform: none;
}

.mobile-about-group > p::before {
  content: "06";
  position: static;
  align-self: start;
  padding-top: 3px;
  color: var(--sand);
  font-family: var(--sans);
  font-size: 10px;
  letter-spacing: .1em;
}

.mobile-about-group a {
  grid-column: 2;
  display: block;
  margin: 0;
  padding: 6px 0;
  border-bottom: 1px solid rgba(255,255,255,.09);
  color: rgba(247,244,236,.82);
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .09em;
  line-height: 1.25;
  text-transform: uppercase;
}

.mobile-about-group a:last-child {
  border-bottom: 0;
}

.mobile-about-group + a > span {
  color: transparent !important;
}

.mobile-about-group + a > span::after {
  content: "07";
  color: var(--sand);
}

.mobile-panel-inner > .button.button-cream,
.mobile-panel-inner > .mobile-plan-cta {
  position: relative;
  min-height: 74px;
  background: var(--red);
  color: #fff;
  font-size: 14px;
  letter-spacing: .14em;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.1), 0 18px 38px rgba(0,0,0,.22);
}

.mobile-panel-inner > .button.button-cream::after {
  content: "";
  position: absolute;
  inset: 5px;
  border: 1px solid rgba(255,255,255,.16);
  pointer-events: none;
}

.mobile-panel-inner > .button.button-cream span,
.mobile-panel-inner > .mobile-plan-cta span {
  display: none !important;
}

.sok-mobile-plan-bar {
  display: none;
}

@media (max-width: 760px) {
  :root {
    --sok-mobile-header: 106px;
  }

  html,
  body {
    max-width: 100%;
    overflow-x: clip;
  }

  .site-header,
  .site-header.is-scrolled,
  .site-header.is-menu-open,
  .site-header:has(.menu-button.is-open) {
    height: var(--sok-mobile-header) !important;
  }

  .site-header.is-scrolled:not(.is-menu-open):not(:has(.menu-button.is-open)) {
    height: 96px !important;
  }

  .header-inner {
    width: calc(100% - 28px) !important;
    gap: 12px;
  }

  .brand,
  .site-header.is-scrolled .brand {
    width: min(184px, 55vw) !important;
  }

  .brand img {
    max-height: 80px !important;
  }

  .header-actions {
    gap: 10px;
  }

  .menu-button {
    display: flex !important;
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    border-color: currentColor;
  }

  .menu-button span {
    width: 23px;
  }

  .header-actions .button {
    display: none;
  }

  .mobile-panel {
    inset: 0;
    padding: calc(var(--sok-mobile-header) + 18px) 22px max(34px, env(safe-area-inset-bottom));
    background:
      radial-gradient(circle at 88% 8%, rgba(181,38,45,.12), transparent 27%),
      var(--charcoal);
    transform: translateY(-14px);
  }

  .mobile-panel-inner {
    min-height: calc(100dvh - var(--sok-mobile-header) - 52px);
  }

  .mobile-panel-inner > .eyebrow {
    margin-bottom: 12px;
    color: rgba(247,244,236,.7);
    font-size: 10px;
  }

  .mobile-panel-inner > a:not(.button) {
    min-height: 58px;
    padding: 10px 0;
    display: flex;
    align-items: center;
    font-size: clamp(30px, 9vw, 38px);
    line-height: .95;
  }

  .mobile-about-group > p {
    min-height: 58px;
    align-items: center;
    margin-bottom: 7px;
    font-size: clamp(30px, 9vw, 38px);
    line-height: .95;
  }

  .mobile-about-group > p::before {
    align-self: center;
    padding-top: 0;
  }

  .mobile-panel-inner > a > span {
    width: 34px;
    flex: 0 0 34px;
    align-self: flex-start;
    padding-top: 2px;
  }

  .mobile-language-row {
    padding-top: 20px;
  }

  .mobile-language-row .language-switcher {
    min-height: 48px;
    padding: 5px 14px;
  }

  .mobile-language-row .language-switcher select {
    min-height: 38px;
    font-size: 13px;
  }

  .mobile-panel-inner > .button.button-cream,
  .mobile-panel-inner > .mobile-plan-cta {
    display: inline-flex;
    width: 100%;
    min-height: 76px;
    margin-top: 24px;
    font-size: 15px;
  }

  .mobile-contact {
    gap: 5px;
    margin-top: 30px;
    padding: 22px 0 6px;
    border-top: 1px solid rgba(255,255,255,.16);
    font-size: 14px;
    line-height: 1.5;
  }

  /* The key mobile pattern from /newc: a real fixed overlay, without iOS backdrop clipping. */
  .site-header.is-menu-open,
  .site-header:has(.menu-button.is-open) {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  .site-header.is-menu-open::after,
  .site-header:has(.menu-button.is-open)::after {
    content: "";
    position: fixed;
    z-index: 3;
    inset: 0 0 auto;
    height: var(--sok-mobile-header);
    border-bottom: 1px solid rgba(255,255,255,.09);
    background: rgba(29,31,28,.98);
    pointer-events: none;
  }

  .site-header.is-menu-open .header-inner,
  .site-header:has(.menu-button.is-open) .header-inner {
    z-index: 4;
  }

  .site-header.is-mobile-menu-scrolled .brand {
    opacity: 0;
    transform: translateY(-8px);
    pointer-events: none;
  }

  /* Give every page enough air below the larger navigation. */
  .page-hero,
  .contact-hero,
  .journal-hero,
  .article-hero,
  .gallery-hero {
    scroll-margin-top: var(--sok-mobile-header);
  }

  .faq-hero,
  .stays-hero,
  .stay-detail-hero {
    padding-top: calc(var(--sok-mobile-header) + 46px) !important;
  }

  /* Homepage hero becomes a composed mobile hero instead of a desktop crop plus loose blocks. */
  .brand-hero {
    height: min(820px, 88svh) !important;
    min-height: 690px !important;
    padding-top: 0 !important;
    overflow: hidden !important;
  }

  .brand-hero .hero-media {
    position: absolute !important;
    inset: 0 !important;
    aspect-ratio: auto !important;
  }

  .brand-hero .hero-media img {
    width: 100%;
    height: 100%;
    object-fit: cover !important;
    object-position: 62% center !important;
  }

  .brand-hero::before {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 0;
    background: linear-gradient(180deg, rgba(12,14,12,.22) 0%, rgba(12,14,12,.05) 35%, rgba(12,14,12,.84) 100%);
    pointer-events: none;
  }

  .brand-hero-lockup {
    z-index: 2;
    top: calc(var(--sok-mobile-header) + 34px) !important;
    left: 22px !important;
    width: min(310px, 78vw) !important;
  }

  .brand-hero-actions {
    position: absolute !important;
    z-index: 2;
    inset: auto 20px 34px !important;
    padding: 0 !important;
    gap: 18px !important;
    background: transparent !important;
  }

  .brand-hero-actions > div:first-child {
    max-width: 330px;
  }

  .brand-hero-actions > div:first-child p:last-child {
    font-size: 14px;
    line-height: 1.55;
  }

  .brand-hero-actions > div:last-child {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    align-items: stretch !important;
    gap: 10px !important;
  }

  .brand-hero-actions .home-film-trigger {
    grid-column: 1 / -1;
    min-height: 66px !important;
  }

  .brand-hero-actions .button {
    width: auto !important;
    min-width: 0;
    min-height: 62px;
    padding-inline: 12px;
    font-size: 10px;
  }

  .brand-hero-actions .text-link {
    min-height: 62px;
    padding: 0 8px 5px;
    justify-content: center;
    text-align: center;
    font-size: 9px;
  }

  .finder-wrap {
    width: calc(100% - 20px) !important;
    margin-top: -12px !important;
  }

  .finder-heading {
    min-height: 118px !important;
    padding: 22px !important;
  }

  .finder label {
    min-height: 104px !important;
  }

  .finder select,
  .form-grid input,
  .form-grid select,
  .form-grid textarea,
  button,
  .button {
    touch-action: manipulation;
  }

  .section-header {
    gap: 22px;
  }

  .section-header h2,
  .editorial-title h2 {
    font-size: clamp(48px, 14vw, 62px);
    line-height: .93;
  }

  /* Swipeable editorial rails are more natural on mobile than very long one-card columns. */
  .destination-rail,
  .featured-grid,
  .home-stays-grid,
  .home-journal-grid,
  .journal-grid {
    width: calc(100vw - 20px);
    margin-left: -10px;
    padding: 0 10px 18px;
    display: grid !important;
    grid-auto-flow: column;
    grid-auto-columns: min(84vw, 390px);
    grid-template-columns: none !important;
    gap: 12px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-padding-left: 10px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .destination-rail::-webkit-scrollbar,
  .featured-grid::-webkit-scrollbar,
  .home-stays-grid::-webkit-scrollbar,
  .home-journal-grid::-webkit-scrollbar,
  .journal-grid::-webkit-scrollbar {
    display: none;
  }

  .destination-rail > *,
  .featured-grid > *,
  .home-stays-grid > *,
  .home-journal-grid > *,
  .journal-grid > * {
    grid-column: auto !important;
    scroll-snap-align: start;
  }

  .destination-card {
    min-height: 510px !important;
  }

  .home-stay-card,
  .home-stay-card.wide,
  .stay-feature,
  .stay-feature.large {
    min-height: 510px !important;
  }

  .safari-card,
  .home-stay-card,
  .journal-card,
  .destination-card {
    transform: translateZ(0);
  }

  .review-proof {
    width: calc(100% - 24px) !important;
    margin-inline: auto;
    grid-template-columns: 1fr 1fr !important;
  }

  .review-proof > div {
    grid-column: 1 / -1 !important;
  }

  .review-proof > a {
    min-height: 145px !important;
    padding: 24px 18px !important;
  }

  .review-proof > a strong {
    font-size: 52px;
  }

  /* Persistent, thumb-friendly conversion affordance inspired by /newc. */
  .sok-mobile-plan-bar {
    position: fixed;
    z-index: 80;
    right: 14px;
    bottom: max(14px, env(safe-area-inset-bottom));
    min-height: 54px;
    padding: 0 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 999px;
    background: var(--red);
    color: #fff;
    box-shadow: 0 18px 42px rgba(30,12,12,.28);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .13em;
    text-transform: uppercase;
    transition: opacity .25s ease, transform .25s ease;
  }

  html.sok-menu-open .sok-mobile-plan-bar,
  body.sok-contact-page .sok-mobile-plan-bar {
    opacity: 0;
    pointer-events: none;
    transform: translateY(12px);
  }

  /* 2026-08-08: escondido até se passar o herói (classe posta pelo
     mobile-refinement.js) — evita duplicar o CTA do hero e tapar títulos */
  .sok-mobile-plan-bar:not(.sok-plan-visible) {
    opacity: 0;
    pointer-events: none;
    transform: translateY(12px);
  }

  .site-footer {
    padding-bottom: 88px;
  }
}

@media (max-width: 430px) {
  :root {
    --sok-mobile-header: 102px;
  }

  .brand,
  .site-header.is-scrolled .brand {
    width: min(172px, 53vw) !important;
  }

  .brand-hero {
    min-height: 660px !important;
  }

  .brand-hero-lockup {
    width: min(286px, 78vw) !important;
  }

  .brand-hero-actions {
    inset-inline: 16px !important;
    bottom: 26px !important;
  }

  .mobile-panel {
    padding-inline: 18px;
  }

  .mobile-panel-inner > a:not(.button) {
    font-size: clamp(29px, 8.7vw, 36px);
  }

  .finder {
    grid-template-columns: 1fr !important;
  }

  .finder-heading,
  .finder-button {
    grid-column: auto !important;
  }

  .finder label {
    border-left: 0 !important;
    min-height: 92px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mobile-panel,
  .sok-mobile-plan-bar {
    transition-duration: .01ms !important;
  }
}

/* ---------------------------------------------------------------
   «Handpicked favourites»: a grelha estava fixada em duas linhas de
   360px, feita para seis cartões. Como o bloco passou a mostrar os
   alojamentos marcados como destaque (podem ser mais), as linhas a
   seguir precisam da mesma altura, senão os cartões extra ficam com
   altura zero.
   --------------------------------------------------------------- */
@media (min-width: 761px) {
  .stays-editorial-grid { grid-auto-rows: 360px; }
}

/* ---------------------------------------------------------------
   Menu de topo em desktop: os 11px a negrito eram pequenos de mais
   para leitura fácil. A 13px há folga de sobra — sobram 176px na
   largura mínima em que o menu ainda aparece (1120px).
   --------------------------------------------------------------- */
@media (min-width: 1101px) {
  .desktop-nav a,
  .desktop-nav .nav-dropdown-trigger,
  .header-actions .language-switcher select { font-size: 13px; }
  /* só cabem as duas letras: mais largo que isto e a setinha fica a léguas */
  .header-actions .language-switcher select { width: 23px; }
}

/* ---------------------------------------------------------------
   TripAdvisor e SafariBookings: a marca de cada plataforma ao lado
   do nome, sempre que se lhes liga — nos cartões de avaliação da
   homepage e dos testemunhos, nos links de "ler as avaliações" e no
   rodapé. As marcas são as verdadeiras, reduzidas a uma silhueta que
   toma a cor do texto à volta, para não destoarem do desenho.
   --------------------------------------------------------------- */
a[href*="tripadvisor"]::before,
a[href*="safaribookings"]::before,
a[href*="instagram"]::before {
  content: "";
  flex: 0 0 auto;
  display: inline-block;
  width: var(--sok-marca-tam, 22px);
  height: var(--sok-marca-tam, 22px);
  margin-right: .5em;
  vertical-align: -.3em;
  background-color: currentColor;
  opacity: .9;
  -webkit-mask: center / contain no-repeat var(--sok-marca);
  mask: center / contain no-repeat var(--sok-marca);
}
a[href*="tripadvisor"]::before { --sok-marca: url("data:image/png;base64,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"); }
a[href*="instagram"]::before { --sok-marca: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+PHJlY3QgeD0iMi41IiB5PSIyLjUiIHdpZHRoPSIxOSIgaGVpZ2h0PSIxOSIgcng9IjUuNCIvPjxjaXJjbGUgY3g9IjEyIiBjeT0iMTIiIHI9IjQuNiIvPjxjaXJjbGUgY3g9IjE3LjYiIGN5PSI2LjQiIHI9IjEuMjUiIGZpbGw9IiMwMDAiIHN0cm9rZT0ibm9uZSIvPjwvc3ZnPg=="); }
a[href*="safaribookings"]::before { --sok-marca: url("data:image/png;base64,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"); }

/* nos cartões de avaliação há espaço: a marca fica maior e por cima */
.testimonial-proof > a::before,
.review-proof > a::before { --sok-marca-tam: 30px; margin: 0 0 12px; }
.review-proof > a::before { margin: 0 12px 0 0; align-self: center; }

/* nos dois links largos o texto está centrado: a marca acompanha-o */
.review-links > a { justify-content: center; align-items: center; }
.review-links > a::before { margin-right: .6em; }

/* ---------------------------------------------------------------
   Pesquisa da homepage: a caixa foi desenhada para quatro campos.
   Ficaram dois — o país e a duração — porque o botão leva às viagens
   e a data não filtra nada. Os campos e o botão mantêm a largura que
   sempre tiveram; é o título que fica com o espaço que sobra, senão
   os dois campos ficavam esticados e perdidos na linha.
   --------------------------------------------------------------- */
@media (min-width: 901px) {
  .finder { grid-template-columns: 2.2fr 1fr 1fr .8fr; }
}

/* ---------------------------------------------------------------
   Rodapé: a empresa irmã, logo abaixo dos ícones sociais — como o
   Soul of Tanzania faz para nós. Mais discreta do que os links
   sociais, em caixa normal.
   --------------------------------------------------------------- */
.sok-sister {
  display: inline-block;
  margin-top: 22px;
  font-size: 12px;
  color: rgba(255, 255, 255, .58);
  transition: color .2s;
}
.sok-sister:hover { color: #f3efe6; }

@media (min-width: 1101px) {
  .nav-dropdown-trigger::after,
  .header-actions .language-switcher.sok-tem-menu::after {
    content: "";
    width: 9px; height: 6px;
    margin-left: .45em;
    flex: 0 0 auto;
    background-color: currentColor;
    opacity: .75;
    transition: transform .22s, opacity .22s;
    -webkit-mask: center / contain no-repeat url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMiA4IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS13aWR0aD0iMS43IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik0xLjUgMiA2IDYuMiAxMC41IDIiLz48L3N2Zz4=");
    mask: center / contain no-repeat url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMiA4IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS13aWR0aD0iMS43IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik0xLjUgMiA2IDYuMiAxMC41IDIiLz48L3N2Zz4=");
  }
  .nav-dropdown:hover .nav-dropdown-trigger::after,
  .header-actions .language-switcher.sok-tem-menu:hover::after { transform: rotate(180deg); opacity: 1; }

  .header-actions .language-switcher.sok-tem-menu { position: relative; }
  .header-actions .language-switcher.sok-tem-menu select { pointer-events: none; }

  .sok-lang-menu {
    position: absolute; top: 100%; left: 50%;
    transform: translate(-50%, -7px);
    width: 168px; padding: 12px;
    background: #faf8f2fa; border: 1px solid #1717141a;
    box-shadow: 0 24px 60px #11131024;
    color: var(--ink);
    opacity: 0; visibility: hidden;
    transition: opacity .22s, visibility .22s, transform .22s;
    z-index: 30;
  }
  .language-switcher.sok-tem-menu:hover .sok-lang-menu,
  .sok-lang-menu:hover {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0);
  }
  /* ponte invisível: o rato não cai no vazio entre o EN e o menu */
  .sok-lang-menu::before {
    content: "";
    position: absolute;
    left: 0; right: 0;
    top: -14px; height: 14px;
  }
  .sok-lang-menu button {
    display: block;
    width: 100%;
    padding: 11px 10px;
    background: none;
    border: 0;
    border-bottom: 1px solid #17171410;
    color: inherit;
    font-family: inherit;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    text-align: left;
    cursor: pointer;
  }
  .sok-lang-menu button:last-child { border-bottom: 0; }
  .sok-lang-menu button:hover,
  .sok-lang-menu button.on { color: var(--red); }
  .header-actions .language-switcher.sok-tem-menu select { pointer-events: none; }
}

/* ---------------------------------------------------------------
   Menu do telemóvel: o selector de língua era um quadrado solto com
   «EN» dentro. Passa a ser uma fila com as quatro línguas, a activa
   preenchida. Os estilos essenciais também vão inline pelo
   header-menus.js, para sobreviverem a CSS antigo em cache.
   --------------------------------------------------------------- */
.language-switcher.is-mobile.sok-tem-linha select { display: none; }
.language-switcher.is-mobile.sok-tem-linha {
  border: 0;
  padding: 0;
  background: none;
  width: auto;
}
.language-switcher.is-mobile .sok-lang-row { display: flex; gap: 10px; }
.language-switcher.is-mobile .sok-lang-row button {
  font-family: inherit;
  font-size: 12px;
  letter-spacing: .8px;
  width: 54px;
  padding: 12px 0;
  background: none;
  border: 1px solid rgba(255, 255, 255, .28);
  color: #f3efe6;
  cursor: pointer;
  transition: background .2s, color .2s, border-color .2s;
}
.language-switcher.is-mobile .sok-lang-row button.on {
  background: #f3efe6;
  border-color: #f3efe6;
  color: #15171a;
}

/* ---------------------------------------------------------------
   Menu do telemóvel: sem os números 01–07 antes de cada capítulo.
   Vêm de dois sítios — um <span> dentro de cada link grande e um
   ::before no cabeçalho do grupo "About".
   --------------------------------------------------------------- */
.mobile-panel-inner > a:not(.button) > span { display: none; }
.mobile-about-group > p::before { content: none; }

/* ---------------------------------------------------------------
   /thank-you/: o convite aos jogos por baixo do botão, enquanto a
   resposta do consultor não chega.
   --------------------------------------------------------------- */
.sok-quiz-invite {
  margin: 26px 0 0;
  font-size: 14px;
  color: rgba(255, 255, 255, .62);
}
.sok-quiz-invite a {
  color: #f3efe6;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color .2s;
}
.sok-quiz-invite a:hover { color: #fff; }

/* ---------------------------------------------------------------
   Telemóvel: dois arranjos.
   1) A banda das reviews da homepage era uma grelha de duas colunas
      fixas (~536px) que transbordava um ecrã de 375 — o cartão do
      TripAdvisor ficava cortado. Passa a empilhar.
   2) O herói das páginas de viagem esticava a fotografia por um
      contentor vertical inteiro (object-fit: cover): num panorama
      de 1000×378 via-se ~15% da largura, tudo ampliado. Passa a
      mostrar a fotografia à proporção natural, com o título e o
      texto por baixo — como a galeria mais abaixo na mesma página.
      No desktop nada muda.
   --------------------------------------------------------------- */
@media (max-width: 760px) {
  .review-proof {
    grid-template-columns: 1fr !important;
    justify-items: start;
    row-gap: 18px;
  }
  .review-proof > div { width: auto !important; max-width: 100%; }

  .journey-hero.original-journey-hero {
    display: block;
    min-height: 0 !important;
    height: auto !important;
    padding-top: var(--sok-mobile-header, 106px) !important;
  }
  .journey-hero.original-journey-hero .journey-hero-media { position: static; height: auto; }
  .journey-hero.original-journey-hero .journey-hero-media img {
    position: static;
    display: block;
    width: 100%;
    height: auto;
    object-fit: unset;
  }
  .journey-hero.original-journey-hero .journey-hero-overlay { display: none; }
  .journey-hero.original-journey-hero .journey-hero-copy { position: static; padding: 26px 22px 90px; }
}

/* 2026-08-09: focal point do hero na página de safaris — o corte mobile decapitava a leoa
   (a foto é panorâmica; a cabeça está no quarto esquerdo, o corte é horizontal) */
@media (max-width: 820px) {
  .page-hero-image img[src*="110540utI"] { object-position: 24% 50%; }
}

/* 2026-08-09d: a banda "Handpicked on the coast" nunca é preenchida na página
   beach-extension (grelha vazia de 700px) — esconde-se até ter conteúdo */
.beach-stays-featured:has(.stays-editorial-grid:empty) { display: none; }

/* 2026-08-09g: no telemóvel, no topo da homepage, a marca aparecia duas vezes
   (logo do header + lockup do hero). O do header entra quando se faz scroll. */
@media (max-width: 760px) {
  body:has(.brand-hero-lockup) .site-header:not(.is-scrolled):not(.is-menu-open):not(:has(.menu-button.is-open)) .brand {
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s ease;
  }
}

/* ============================================================================
   2026-08-09h — legibilidade e áreas de toque no telemóvel
   Havia texto informativo a 8 e 9px e ligações com 14–21px de altura útil.
   Nada disto muda no desktop: o desenho fica igual acima de 900px.
   ========================================================================= */
@media (max-width: 899px) {

  /* --- piso de tamanho: nada de conteúdo abaixo de 12px --- */
  .eyebrow,
  .card-kicker,
  .footer-label,
  .image-credit,
  .text-link,
  .finder label span,
  .finder-button,
  .nav-dropdown-menu a,
  .review-proof span,
  .intro-visual figcaption span,
  .intro-visual figcaption small,
  .destination-card span,
  .destination-card b,
  .safari-badges span,
  .safari-card-body .card-footer span,
  .safari-card-body .card-footer a,
  .experience-card span,
  .home-stay-card span,
  .home-journal-grid time,
  .home-journal-grid a,
  .trust-quote a,
  .footer-bottom span,
  .social-row a,
  .footer-cta a,
  .sok-sister,
  .sok-mobile-plan-bar,
  .home-film-trigger strong,
  .home-film-trigger small,
  .home-film-trigger b { font-size: 12px; }

  /* a assinatura do lockup é lettering da marca — sobe menos, mas sobe */
  .brand-hero-tagline span { font-size: 11px; }

  /* --- áreas de toque --- */
  /* ligações soltas: passam a ter 44px de altura útil */
  .text-link,
  .footer-cta a,
  .sok-sister,
  .mobile-about-group a,
  .mobile-contact a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }

  /* ligações apertadas dentro de cartões e rodapé: o alvo cresce com padding
     e a margem negativa devolve o espaço, por isso o desenho não se mexe */
  .footer-links a,
  .safari-card-body .card-footer a,
  .home-journal-grid article > a,
  .trust-quote a {
    display: inline-block;
    padding-block: 13px;
    margin-block: -13px;
  }

  /* os selects do finder tinham 21px de caixa */
  .finder label select,
  .finder select { min-height: 44px; }
}

/* 2026-08-09h (remate): estes seis casos tinham regras mais específicas nos
   chunks do export e continuavam a 9–10px. Como este ficheiro existe
   precisamente para sobrepor o export, aqui o !important é o instrumento certo. */
@media (max-width: 899px) {
  .brand-hero-actions .button,
  .brand-hero-actions .text-link,
  .review-proof span,
  .home-journal-grid article > a,
  .home-journal-grid time { font-size: 12px !important; }

  /* títulos-ligação dos cartões: alvo de 44px sem mexer no desenho */
  .safari-card-body h3 a,
  .home-journal-grid h3 a {
    display: inline-block;
    padding-block: 6px;
    margin-block: -6px;
  }
  .home-journal-grid h3 a { padding-block: 15px; margin-block: -15px; }
}

/* ============================================================================
   2026-08-09i — remates da capa
   ========================================================================= */

/* (1) Entre «Follow your curiosity» e «Where the day ends beautifully» somavam
   150px + 145px de padding com o MESMO fundo dos dois lados: 295px de branco
   sem nada que o justificasse. Nas outras fronteiras o fundo muda e não se nota. */
.experience-section + .home-stays-section { padding-top: 40px; }

/* (2) «The humans behind the journey» e «Why Spirit» tinham exactamente o mesmo
   tom e ficavam colados: 2083px seguidos de escuro, que se lêem como um cartão
   gigante mal fechado. O segundo passa a um tom um pouco mais claro, com um
   filete a marcar onde um acaba e o outro começa. */
.home-human-section + .trust-section {
  background: #2A2C27;
  border-top: 1px solid rgba(244, 240, 232, .10);
  padding-top: 110px;
}

/* (3) «Arrive as a guest. Leave as a friend.» flutuava no fundo da secção sem
   nada que o prendesse — ganha o mesmo filete e encosta ao bloco de cima. */
.home-human-section + .trust-section .trust-quote {
  margin-top: 64px;
  padding-top: 72px;
  border-top: 1px solid rgba(244, 240, 232, .12);
}

/* (4) A «barra cinzenta» entre o mosaico da galeria e o «Your turn» era o
   padding-bottom de 140px da galeria — fundo escuro sem conteúdo nenhum,
   logo antes de uma secção clara. */
.home-gallery-section:has(+ .final-cta) { padding-bottom: 64px; }

/* ============================================================================
   2026-08-09j — telemóvel: grelha das estadias, imagens dos cartões-capa,
   ritmo do menu, e as avaliações no bloco «Arrive as a guest»
   ========================================================================= */

/* (1) A grelha das estadias da capa nunca teve regra de telemóvel: mantinha
   duas colunas de 315px (642px num ecrã de 375) e linhas fixas de 370px com
   cartões de 510px — daí as imagens coladas e a segunda coluna fora do ecrã. */
@media (max-width: 899px) {
  /* a declaração das colunas do export tem mais especificidade do que um
     selector de classe simples — aqui o !important é o instrumento certo */
  .home-stays-section .home-stays-grid,
  .home-stays-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto !important;
    grid-auto-flow: row !important;
    grid-auto-columns: auto !important;
    gap: 16px !important;
  }
  .home-stays-grid > .home-stay-card,
  .home-stays-grid > .home-stay-card.wide {
    grid-column: auto !important;
    grid-row: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: 380px !important;
  }
}

/* (2) Cartões cuja legenda é uma camada absoluta por cima da fotografia: a
   imagem estava em fluxo normal e parava à altura natural (224px num cartão
   de 510px), deixando meia caixa cinzenta. Com object-fit:cover a preencher,
   cobre sempre. Não mexe nos cartões de catálogo, onde o texto vem MESMO por
   baixo da foto e a altura é do conteúdo. */
.stay-feature,
.guest-memory-grid figure { position: relative; overflow: hidden; }
.stay-feature img,
.guest-memory-grid figure img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* (3) No menu de telemóvel o grupo «About» tinha 17/18px de padding contra os
   10/10px das outras entradas — dava um degrau antes do About e outro depois
   dos subcapítulos. */
.mobile-panel-inner .mobile-about-group { padding-top: 10px; padding-bottom: 10px; }

/* (4) Avaliações dentro do bloco «Arrive as a guest» (ver home.php) */
.trust-quote .trust-scores {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 48px;
  margin: 40px 0 34px;
}
.trust-quote .trust-scores a {
  display: flex;
  align-items: baseline;
  gap: 12px;
  text-decoration: none;
  border: 0;
  color: inherit;
}
.trust-quote .trust-scores strong {
  font-family: var(--font-display, Georgia, serif);
  font-size: 34px;
  font-weight: 400;
  line-height: 1;
  color: #F4F0E8;
}
.trust-quote .trust-scores small { font-size: 15px; opacity: .55; }
.trust-quote .trust-scores span {
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  line-height: 1.7;
  color: rgba(244, 240, 232, .62);
}
@media (max-width: 899px) {
  .trust-quote .trust-scores { gap: 18px 28px; margin: 30px 0 26px; }
  .trust-quote .trust-scores strong { font-size: 28px; }
}

/* ============================================================================
   2026-08-09k — o widget «Find your wild» não parecia clicável
   Os dois <select> tinham appearance:none sem borda, sem fundo e sem seta:
   liam-se como texto estático. Ganham caixa, seta e altura de toque.
   ========================================================================= */
.finder label {
  display: block;
  position: relative;
  /* a etiqueta esticava até ao fundo da célula da grelha e a seta ia com ela */
  align-self: start;
}
.finder label select {
  width: 100%;
  min-height: 46px;
  padding: 10px 34px 10px 12px;
  background-color: rgba(255, 255, 255, .06);
  border: 1px solid rgba(31, 33, 30, .22);
  border-radius: 2px;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
/* seta desenhada em CSS — não depende de imagem nem de webfont */
.finder label::after {
  content: '';
  position: absolute;
  right: 14px;
  bottom: 19px;
  width: 8px; height: 8px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
  opacity: .55;
  pointer-events: none;
}
.finder label select:hover { border-color: rgba(31, 33, 30, .42); }
.finder label select:focus-visible { outline: 2px solid #9F2B33; outline-offset: 2px; }

/* rodapé: telefone e morada (2026-08-09) */
.footer-links .footer-note {
  display: block;
  font-size: 12px;
  line-height: 1.6;
  opacity: .62;
  font-style: normal;
  margin-bottom: 6px;
}

/* ============================================================================
   2026-08-09m — capa: «humans» + «why spirit» + «arrive as a guest» num só bloco
   Eram três secções escuras seguidas com mais de 2000px no total. Agora é uma:
   história à esquerda da fotografia, quatro razões como apontamento, a frase da
   marca numa linha e as avaliações. O tom próprio do antigo «Why Spirit» deixa
   de ser preciso — já não há duas secções coladas para distinguir.
   ========================================================================= */
.home-human-merged { background: #1F211E; }

/* ---- 2026-08-10: a coluna do texto levava oito blocos ----
   História, quatro razões, frase da marca, avaliações e dois botões na mesma
   coluna estreita. Só cabia à custa de tirar o ar entre eles, e ficou tudo
   colado. Agora a coluna fica com a história e os botões, e o resto desce para
   uma faixa própria a toda a largura (`.human-below`), onde as quatro razões
   cabem lado a lado. A coluna recupera o respiro do desenho original.
   NOTA: a grelha de duas colunas só existe acima de 1100px — as regras antigas
   estavam em `min-width: 900px`, ou seja também apanhavam a versão de coluna
   única, onde não faziam sentido nenhum. */
.home-human-merged .home-human-copy {
  /* 2026-08-10: o ar por baixo da frase da marca era o mesmo do topo (~94px) e
     era o que estava a esticar a fotografia ao lado. Passa a metade: a coluna
     encolhe ~47px, a ampliação da foto desce de 1,48x para ~1,41x e o remate
     continua a respirar. */
  padding-block: clamp(76px, 6.5vw, 108px) clamp(38px, 3.25vw, 54px);
  align-self: center;
}
.home-human-merged .home-human-copy h2 { margin: 0 0 28px; }
.home-human-merged .home-human-copy .lead { margin-bottom: 20px; }
.home-human-merged .human-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 28px;
  margin-top: 36px;
}
.home-human-merged .human-actions .button { margin-top: 0; }

.home-human-merged .human-below {
  grid-column: 1 / -1;
  border-top: 1px solid rgba(244, 240, 232, .12);
  padding: clamp(40px, 4.2vw, 60px) clamp(45px, 7vw, 120px) clamp(46px, 4.6vw, 66px);
}
.home-human-merged .human-reasons {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 30px 44px;
}
.home-human-merged .human-reasons li { display: block; }
.home-human-merged .human-reasons b {
  display: block;
  font-size: 12px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #F4F0E8;
  margin-bottom: 6px;
  font-weight: 600;
}
.home-human-merged .human-reasons span {
  display: block;
  font-size: 14px;
  line-height: 1.65;
  color: rgba(244, 240, 232, .58);
}

/* 2026-08-10 (3): a frase da marca passou para dentro da coluna do texto, por
   baixo dos botões. As avaliações que a acompanhavam saíram da secção — eram o
   mesmo bloco do topo repetido — e foram para junto do CTA final. A faixa larga
   acaba agora nas quatro razões. */
.home-human-merged .home-human-copy .human-line {
  margin: clamp(30px, 3vw, 42px) 0 0;
  font-family: var(--font-display, Georgia, serif);
  font-size: clamp(23px, 2.1vw, 29px);
  line-height: 1.24;
  color: #F4F0E8;
}
.home-human-merged .home-human-copy .human-line em { font-style: italic; opacity: .72; }

@media (max-width: 1100px) {
  .home-human-merged .human-reasons { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 36px; }
}
/* prova social junto ao CTA final: o mesmo facto noutro registo — pequeno,
   funcional e sem link de saída, porque a tarefa aqui é tirar o risco do clique,
   não apresentar a casa. Em cima é triagem a 48px; aqui é uma nota de rodapé. */
.final-cta .cta-proof {
  margin: 26px 0 0;
  font-size: 12px;
  line-height: 1.6;
  letter-spacing: .09em;
  text-transform: uppercase;
  opacity: .55;
}

/* 2026-08-10: o cartão «Find your wild» tinha um buraco no terço de baixo. As
   duas células dos selectores são `align-self: start` e ficavam 55px mais
   curtas do que a linha da grelha, deixando um rectângulo branco entre os
   filetes verticais; e o título, num bloco com 34px de padding, ficava
   encostado ao topo. Era este o «espaço em branco» antes das avaliações — não
   os 56px que separam o cartão da tira, esses é que o fazem flutuar. */
@media (min-width: 900px) {
  .finder > label { align-self: stretch !important; display: flex; flex-direction: column; justify-content: center; }
  .finder-heading { display: flex; flex-direction: column; justify-content: center; }
}

@media (max-width: 760px) {
  .home-human-merged .home-human-copy { padding-block: 72px; }
  .home-human-merged .human-below { padding: 40px 20px 54px; }
  .home-human-merged .human-reasons { grid-template-columns: 1fr; gap: 20px; }
  .final-cta .cta-proof { font-size: 11px; letter-spacing: .07em; margin-top: 22px; }
}

/* No telemóvel a frase cabia numa linha por um triz e ficava encostada às duas
   margens. Passa a dístico de duas linhas — que é como ela se lê, e é como
   aparece no herói da página de testemunhos. */
@media (max-width: 520px) {
  .home-human-merged .human-line em { display: block; margin-top: 2px; }
}

/* 2026-08-09: o botão fixo «Design my safari» tapava o fim do conteúdo no
   telemóvel — chegava a cortar as legendas das fotografias. A página passa a
   reservar-lhe espaço em baixo em vez de lho roubar. */
@media (max-width: 760px) {
  body { padding-bottom: 84px; }
  body:has(.sok-mobile-plan-bar[hidden]),
  body.sok-contact-page { padding-bottom: 0; }
}

/* ---- 2026-08-10: a fotografia volta a preencher a banda ----
   Chegou a ficar `sticky` com proporção 3/2 para não ser esticada. Resolvia a
   nitidez mas o scroll ficava estranho: a imagem prendia-se ao topo enquanto o
   texto passava todo ao lado. Com as razões fora da coluna a banda encolheu, e
   a fotografia (1000x666 reais) só precisa de ~1,2x para a preencher — que não
   se vê. Sem sticky, sem recorte forçado, como no desenho original. */
/* o <picture> é inline por omissão: sem `display:block` o `height:100%` do <img>
   não tem contra o que resolver e a fotografia colapsa para a altura natural */
.home-human-merged .home-human-image picture { display: block; height: 100%; width: 100%; }
.home-human-merged .home-human-image img { height: 100%; width: 100%; object-fit: cover; }

@media (min-width: 1101px) {
  .home-human-merged { align-items: stretch; }
  .home-human-merged .home-human-image {
    position: static;
    align-self: stretch;
    height: auto;
    aspect-ratio: auto;
  }
}

/* ---- 2026-08-10: subscrição da newsletter no rodapé ----
   Existia no site antigo e perdeu-se na passagem para este. O gateway é o
   mesmo de sempre; faltava só a forma. Tom discreto: é um rodapé, não um CTA. */
.site-footer .sok-news { margin-top: 26px; max-width: 340px; }
.site-footer .sok-news .footer-label { display: block; margin-bottom: 10px; }
.site-footer .sok-news-row { display: flex; gap: 0; align-items: stretch; }
.site-footer .sok-news-row input {
  flex: 1 1 auto;
  min-width: 0;
  background: transparent;
  border: 1px solid rgba(244, 240, 232, .28);
  border-right: 0;
  color: inherit;
  font: inherit;
  font-size: 14px;
  padding: 11px 14px;
  border-radius: 0;
}
.site-footer .sok-news-row input::placeholder { color: currentColor; opacity: .45; }
.site-footer .sok-news-row input:focus-visible { outline: 2px solid currentColor; outline-offset: -2px; }
.site-footer .sok-news-row button {
  flex: 0 0 auto;
  border: 1px solid rgba(244, 240, 232, .28);
  background: rgba(244, 240, 232, .1);
  color: inherit;
  font: inherit;
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 0 18px;
  cursor: pointer;
  transition: background .2s ease;
}
.site-footer .sok-news-row button:hover { background: rgba(244, 240, 232, .2); }
.site-footer .sok-news-status:empty { display: none; }
.site-footer .sok-news-status {
  margin: 10px 0 0;
  font-size: 12.5px;
  line-height: 1.5;
  opacity: .72;
}
@media (max-width: 760px) {
  .site-footer .sok-news { max-width: none; }
}

/* ---- 2026-08-10: passo final do pedido — mês preferido + orçamento aproximado
   Os mesmos dois campos que a Soul já tinha. O slider arranca na conta
   (dias × preço por pessoa por dia do nível escolhido), não num número fixo. */
/* 2026-08-10 (2): o slider estava 16px abaixo do selector do mês e as caixas
   tinham três alturas diferentes — 50px o select, 44px o slider, 54px todos os
   outros campos do formulário. Agora as duas células têm a mesma caixa de 54px
   dos restantes campos e o cursor centra-se lá dentro. */
.safari-planner .planner-final-extras { margin-top: 18px; align-items: start; }
.safari-planner .planner-final-extras select {
  width: 100%; min-height: 54px; padding: 0 14px;
  border: 1px solid rgba(23,23,20,.22);
  background: #fff; color: inherit; font: inherit; font-size: 15px; border-radius: 0;
}
.safari-planner .planner-final-extras output { color: #b5262d; font-weight: 700; font-variant-numeric: tabular-nums; }
/* o embrulho dá ao slider a mesma caixa de 54px do select ao lado; o cursor
   fica centrado nela em vez de encostado ao topo */
.safari-planner .planner-final-extras .range-wrap {
  display: flex; align-items: center; min-height: 54px; width: 100%;
}
.safari-planner .planner-final-extras input[type="range"] {
  width: 100%; margin: 0; accent-color: #b5262d; background: transparent;
}
.safari-planner .budget-hint {
  display: block; margin-top: 6px; font-size: 12.5px; line-height: 1.5;
  letter-spacing: 0; text-transform: none; opacity: .62;
}
@media (max-width: 760px) {
  .safari-planner .planner-final-extras { grid-template-columns: 1fr; }
}

/* ---- 2026-08-10: CTA flutuante CONTEXTUAL ----
   Só existe onde há uma coisa concreta a pedir, e diz qual. O botão do
   cabeçalho está sempre visível e já diz «Design my safari» — um flutuante que
   repetisse isso seria ruído. Entra quando o CTA do herói sai do ecrã, para
   nunca haver dois a pedir o mesmo ao mesmo tempo. */
.sok-fab {
  position: fixed;
  right: clamp(16px, 2.2vw, 28px);
  bottom: clamp(16px, 2.2vw, 28px);
  z-index: 120;
  display: inline-flex;
  align-items: center;
  gap: 11px;
  max-width: calc(100vw - 32px);
  padding: 7px 20px 7px 7px;
  border-radius: 999px;
  background: #171714;
  color: #F4F0E8;
  text-decoration: none;
  box-shadow: 0 14px 34px rgba(23, 23, 20, .34);
  opacity: 0;
  visibility: hidden;
  transform: translateY(14px);
  transition: opacity .3s ease, transform .3s ease, visibility .3s, background .25s ease;
}
.sok-fab.show { opacity: 1; visibility: visible; transform: none; }
.sok-fab:hover { background: #b5262d; }
.sok-fab-dot {
  display: grid; place-items: center;
  width: 38px; height: 38px; flex: 0 0 38px;
  border-radius: 50%; background: #b5262d; color: #fff; font-size: 15px;
  transition: background .25s ease;
}
.sok-fab:hover .sok-fab-dot { background: #171714; }
.sok-fab b {
  font-size: 11px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; white-space: nowrap;
}
@media (max-width: 420px) {
  .sok-fab b { font-size: 10px; letter-spacing: .1em; }
  .sok-fab-dot { width: 34px; height: 34px; flex: 0 0 34px; }
}
@media (prefers-reduced-motion: reduce) {
  .sok-fab { transition: opacity .01s, visibility .01s; transform: none; }
}

/* ---- 2026-08-10 (2): cartões das rotas do Monte Quénia ----
   Havia duas secções a listar as mesmas três rotas — texto sem foto e depois
   foto sem texto. Agora é uma só: foto, número, duração, descrição e link. */
.editorial-cards.route-cards article > a { display: block; color: inherit; text-decoration: none; }
.editorial-cards.route-cards article > a picture,
.editorial-cards.route-cards article > a img {
  display: block; width: 100%; height: auto; margin-bottom: 18px; aspect-ratio: 4 / 3; object-fit: cover;
}
.editorial-cards.route-cards .route-card-go {
  display: inline-block; margin-top: 14px; font-size: 11px; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase; font-style: normal; color: #b5262d;
}
.editorial-cards.route-cards article > a:hover .route-card-go { text-decoration: underline; }
.editorial-cards.route-cards article > a:hover img { opacity: .92; }
/* a página tinha buracos verticais enormes entre secções */
.mount-photo-credits { margin-top: 22px; font-size: 11.5px; opacity: .55; }

/* ---------------------------------------------------------------------------
   2026-08-10 — fotografia do dia nas rotas do Monte Quénia.
   O componente do itinerário pinta a foto como background-image, e um fundo
   CSS não sabe escolher a imagem pela LARGURA da caixa (o image-set() só
   responde à densidade do ecrã). Como esta caixa mede ~34vw e cresce com a
   janela, num monitor grande servia-se uma imagem pequena para o espaço.
   Nestes slides passa a haver um <img> a sério, com srcset/sizes, e estas
   regras dão-lhe o mesmo comportamento visual que o `background-size: cover`.
--------------------------------------------------------------------------- */
.original-itinerary .swiper-slide.com-img { display: block; overflow: hidden; }
.original-itinerary .swiper-slide.com-img picture { display: block; width: 100%; height: 100%; }
.original-itinerary .swiper-slide.com-img img {
  display: block; width: 100%; height: 100%; min-height: inherit;
  object-fit: cover; object-position: 50% 50%;
}

/* ---------------------------------------------------------------------------
   2026-08-10 — pedir a partir do cartão da listagem.
   Eram dois cliques até um pedido com viagem agarrada (abrir a ficha e só lá
   dentro carregar no botão), enquanto o «Criar o meu safari» do cabeçalho
   levava ao formulário em branco num só. Era daí que vinham quase todos os
   pedidos sem viagem associada.
--------------------------------------------------------------------------- */
/* 2026-08-11: era uma linha de texto com um filete por cima e passava
   despercebida. Passa a ter forma de botão — contorno fino, o mesmo da paleta
   do cartão — sem ganhar peso de cor: só ao passar o rato é que se enche.
   Fica alinhado à esquerda e não à largura toda, para não competir com o
   título da viagem. */
.safari-card .card-request {
  display: inline-block; margin-top: 14px;
  padding: 9px 16px;
  border: 1px solid rgba(168, 72, 31, .38); border-radius: 2px;
  font-family: var(--font-mono, inherit);
  font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase;
  color: #A8481F; text-decoration: none; background: transparent;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.safari-card .card-request:hover,
.safari-card .card-request:focus-visible {
  background: #A8481F; border-color: #A8481F; color: #fff; text-decoration: none;
}
@media (max-width: 640px) {
  .safari-card .card-request { font-size: 11px; padding: 10px 16px; }
}

/* ---------------------------------------------------------------------------
   2026-08-10 — EXPERIÊNCIA ?customTours=1 (não está em produção).
   A grelha de destinos é de botões curtos e herdava uma coluna larga; com o
   nome da viagem, os dias e três parques por baixo, cada cartão passava a
   ocupar a largura toda e a lista ficava quilométrica. Passa a grelha própria,
   com colunas estreitas e o texto secundário contido.
--------------------------------------------------------------------------- */
.planner-choice-grid.tour-choices {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 10px;
}
/* a grelha genérica traz 44px de folga em baixo, pensada para os passos que
   acabam aí; aqui vem logo a seguir o bloco do «nenhuma destas» e as duas
   folgas somadas separavam-no dos cartões */
.planner-choice-grid.tour-choices { padding-bottom: 8px; }
.planner-choice-grid.tour-choices button {
  text-align: left; padding: 14px 16px; min-height: 0;
}
.planner-choice-grid.tour-choices button strong {
  display: block; font-size: 15px; line-height: 1.25;
}
.planner-choice-grid.tour-choices button span {
  display: block; margin-top: 5px;
  font-size: 12px; line-height: 1.4; opacity: .7;
}
.planner-obrig {
  margin: 10px 0 0; padding: 9px 14px; max-width: 60ch;
  border-left: 3px solid #A8481F; background: rgba(168, 72, 31, .06);
  font-size: 13.5px; line-height: 1.5; color: #A8481F;
}
/* o botão e a nota estavam soltos como irmãos da grelha e encostavam à margem
   do passo, desalinhados dos cartões — passam a viver num bloco com a mesma
   caixa da grelha */
/* 2026-08-11 — o bloco tinha `margin-top` mas nunca ganhou a caixa horizontal,
   por isso encostava à margem do passo enquanto os cartões estavam a 42px: o
   botão e a nota apareciam desalinhados e a colar-se ao traço dos controlos.
   Estes 42px/20px são os MESMOS de .planner-question e .planner-choice-grid
   nos chunks do Next, e o 760px é o breakpoint onde eles trocam de valor —
   se um dia mudarem lá, muda aqui também. */
.planner-tour-foot { margin-top: 0; padding: 0 42px 44px; }
@media (max-width: 760px) {
  .planner-tour-foot { padding: 0 20px 30px; }
}
.planner-tour-none { margin: 10px 0 0; max-width: 62ch; font-size: 13.5px; line-height: 1.55; opacity: .72; }
.planner-tour-skip {
  display: inline-block; margin: 0;
  padding: 12px 20px; border: 1px solid rgba(33,26,18,.2);
  background: transparent; border-radius: 2px; cursor: pointer;
  font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase;
}
.planner-tour-skip:hover { border-color: #A8481F; color: #A8481F; }
@media (max-width: 700px) {
  .planner-choice-grid.tour-choices { grid-template-columns: 1fr; }
  .planner-choice-grid.tour-choices button { padding: 12px 14px; }
  .planner-choice-grid.tour-choices button strong { font-size: 14px; }
}

/* ===========================================================================
   «Your safari at a glance» — o bloco branco do topo das viagens (2026-08-11)

   Tinha 130px de respiro em cima e em baixo: numa viagem de duas paragens são
   260px de padding para 212px de conteúdo, e o bloco ocupava mais de metade
   do ecrã para dizer uma frase e listar dois parques. O respiro passa a
   acompanhar a largura da janela — 92px num ecrã grande, 56px num pequeno —
   e as duas colunas encostam ao topo, que é onde o olho as procura.
   O valor de origem está em _next/static/chunks/05ekxfekci3c2.css.
   =========================================================================== */
.original-route-overview {
  padding-top: clamp(56px, 6vw, 92px);
  padding-bottom: clamp(56px, 6vw, 92px);
  align-items: start;
}
/* a lista de paragens não precisa de tanto ar entre linhas quando são poucas */
.original-route-overview li { padding: 15px 0; }
@media (max-width: 900px) {
  .original-route-overview { gap: 34px; padding-top: 48px; padding-bottom: 48px; }
}

/* ===========================================================================
   LINK DE PROPOSTA E PDF NA PÁGINA DA VIAGEM (2026-08-11)

   O cartão com o nome do cliente vive DENTRO do herói escuro, por baixo da
   ficha da viagem: é a primeira coisa que ele vê quando abre o link que o
   consultor lhe mandou. Vidro escuro com o traço vermelho da casa à esquerda,
   para se ler por cima da fotografia sem lhe roubar o palco.
   =========================================================================== */
.sok-pessoal {
  margin: 22px 0 0; padding: 14px 18px 15px 20px; max-width: 42ch;
  border-left: 3px solid var(--red, #be1622);
  background: linear-gradient(90deg, rgba(0,0,0,.42), rgba(0,0,0,.16));
  backdrop-filter: blur(2px);
}
.sok-pessoal-eyebrow {
  margin: 0; font-size: 10px; letter-spacing: .2em; text-transform: uppercase;
  color: rgba(255,255,255,.72);
}
.sok-pessoal-nome {
  margin: 5px 0 0; font-family: var(--display, Georgia, serif); font-weight: 400;
  font-size: clamp(22px, 2.6vw, 32px); line-height: 1.1; color: #fff;
}
.sok-pessoal-nota {
  margin: 9px 0 0; font-size: 13px; line-height: 1.55; color: rgba(255,255,255,.78);
}
.sok-pessoal-nota span { white-space: nowrap; }
.sok-pessoal-nota span::before { content: ' · '; opacity: .6; }

/* o botão do PDF: discreto numa visita normal, com moldura quando o link é de
   proposta — aí é a acção que a pessoa veio fazer */
.sok-pdf {
  display: inline-flex; align-items: center; gap: .6em; margin-top: 18px;
  font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase;
  color: rgba(255,255,255,.86); text-decoration: none;
  border-bottom: 1px solid rgba(255,255,255,.35); padding-bottom: 3px;
}
.sok-pdf:hover { color: #fff; border-bottom-color: #fff; }
.sok-pdf.destaque {
  padding: 12px 20px; border: 1px solid rgba(255,255,255,.45); border-bottom-width: 1px;
  color: #fff;
}
.sok-pdf.destaque:hover { background: var(--red, #be1622); border-color: var(--red, #be1622); }
@media (max-width: 760px) {
  .sok-pessoal { max-width: none; padding: 12px 14px 13px 16px; }
  .sok-pdf { margin-top: 14px; }
}

/* a linha das noites, à direita do nome da paragem (2026-08-11) */
.original-route-overview li { align-items: baseline; }
.original-route-overview li em {
  display: block; margin-top: 3px;
  font-family: var(--sans, system-ui, sans-serif); font-style: normal;
  font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--muted, #8A7D6B);
}
.original-route-overview .route-lead { color: var(--muted, #8A7D6B); }