/* Wildlens mobile-first rebuild.
 * This is intentionally loaded last and scoped to phone widths.
 */
@media (max-width: 767px) {
  :root { --wl-phone-gutter: 16px; --wl-phone-radius: 18px; }
  html { width: 100%; max-width: 100%; overflow-x: hidden; scroll-behavior: smooth; }
  body { width: 100%; max-width: 100%; overflow-x: hidden; background: #fbfaf7; }
  body, button, input, select, textarea { -webkit-font-smoothing: antialiased; }
  main, section, article, div { min-width: 0; }
  p { text-wrap: pretty; }
  a, button, summary { touch-action: manipulation; }

  /* Header: calm, compact, always available, never covering content. */
  .wl-topbar { display: none; }
  .wl-site-header { position: sticky; top: 0; z-index: 1000; min-height: 64px; }
  .wl-site-header__inner { width: calc(100% - 20px); min-height: 64px; gap: 8px; }
  .wl-brand { min-width: 0; max-width: calc(100% - 98px); gap: 8px; }
  .wl-brand img, .wl-brand .custom-logo { max-width: 42px; max-height: 37px; }
  .wl-brand__copy { min-width: 0; }
  .wl-brand__copy strong { overflow: hidden; font-size: .93rem; letter-spacing: -.04em; text-overflow: ellipsis; white-space: nowrap; }
  .wl-brand__copy small { margin-top: 3px; font-size: .36rem; letter-spacing: .14em; }
  .wl-header-actions { flex: 0 0 auto; gap: 5px; }
  .wl-header-actions .wl-header-cta { display: none !important; }
  .wl-icon-button, .wl-menu-toggle { width: 42px; height: 42px; border-radius: 12px; }
  .wl-mobile-menu { max-height: calc(100dvh - 64px); overflow-y: auto; overscroll-behavior: contain; box-shadow: 0 20px 40px rgba(2,44,34,.12); }
  .wl-mobile-menu__inner { width: calc(100% - 32px); padding: 8px 0 calc(18px + env(safe-area-inset-bottom)); }
  .wl-mobile-menu a, .wl-mobile-menu summary { min-height: 50px; padding: 13px 4px; font-size: .78rem; }
  .wl-mobile-menu details div { padding: 4px 0 10px 12px; }
  .wl-mobile-menu details div a { min-height: 46px; padding: 11px 4px; }
  .wl-mobile-menu__cta { min-height: 52px !important; margin-top: 10px; border-radius: 12px !important; }

  /* Homepage hero: one strong story, no cramped stacked desktop fragments. */
  .wl-homepage .wl-flagship-hero { width: 100%; margin: 0; padding: 0 8px; }
  .wl-homepage .wl-flagship-hero__frame { min-height: 715px; border-radius: 0 0 24px 24px; clip-path: none; box-shadow: 0 18px 40px rgba(2,44,34,.17); }
  .wl-homepage .wl-flagship-hero__image { object-position: 68% center; transform: scale(1.02); }
  .wl-homepage .wl-flagship-hero__scrim { background: linear-gradient(0deg, rgba(3,22,18,.98) 0%, rgba(3,22,18,.82) 46%, rgba(3,22,18,.12) 100%); }
  .wl-homepage .wl-flagship-hero__content { width: calc(100% - 24px); min-height: 715px; padding: 90px 0 16px; align-items: end; }
  .wl-homepage .wl-flagship-hero__story { padding: 19px 17px 16px; border: 1px solid rgba(255,255,255,.14); border-radius: 18px; background: rgba(3,22,18,.72); box-shadow: 0 16px 34px rgba(0,0,0,.12); backdrop-filter: blur(14px); }
  .wl-homepage .wl-flagship-hero__kicker { margin-bottom: 14px; font-size: .56rem; }
  .wl-homepage .wl-flagship-hero h1 { max-width: 9ch; font-size: clamp(2.65rem, 14.2vw, 4.1rem); line-height: .92; letter-spacing: -.065em; }
  .wl-homepage .wl-flagship-hero__lead { margin-top: 14px; font-size: .89rem; line-height: 1.55; }
  .wl-homepage .wl-flagship-hero__actions { display: grid; grid-template-columns: 1fr; gap: 8px; margin-top: 18px; }
  .wl-homepage .wl-flagship-button { width: 100%; min-height: 52px; border-radius: 12px; font-size: .65rem; }
  .wl-homepage .wl-flagship-hero__trust { gap: 7px; margin-top: 15px; padding-top: 14px; }
  .wl-homepage .wl-flagship-hero__trust li { flex-basis: 78%; padding: 10px 11px; border-radius: 13px; }
  .wl-homepage .wl-flagship-hero__reassurance { margin-top: 13px; font-size: .62rem; }
  .wl-homepage .wl-flagship-hero__scroll { display: none; }

  /* Shared homepage rhythm. */
  .wl-homepage > section:not(.wl-flagship-hero):not(.wl-home-journey-nav) { padding-block: 42px !important; }
  .wl-homepage .wl-home-shell, .wl-homepage .max-w-7xl, .wl-homepage .max-w-4xl { width: calc(100% - 32px) !important; max-width: none !important; margin-inline: auto; }
  .wl-homepage .wl-home-intro__grid, .wl-homepage .wl-home-process__intro, .wl-homepage .wl-home-section-heading { gap: 15px; }
  .wl-homepage h2, .wl-homepage .section-title-fix-lg { font-size: clamp(1.95rem, 9.2vw, 3rem) !important; line-height: 1.02 !important; letter-spacing: -.055em; }
  .wl-homepage .wl-home-intro p, .wl-homepage .wl-home-process p, .wl-homepage .wl-home-section-heading p { font-size: .88rem; line-height: 1.65; }
  .wl-homepage .wl-home-promises__grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 8px; }
  .wl-homepage .wl-home-promise-card { min-height: 104px; padding: 13px; border-radius: 14px; }
  .wl-homepage .wl-home-promise-card strong { display: block; font-size: .77rem; line-height: 1.2; }
  .wl-homepage .wl-home-promise-card span:last-child { display: block; margin-top: 6px; font-size: .65rem; line-height: 1.45; }
  .wl-homepage .wl-home-process__grid { display: flex !important; gap: 10px; overflow-x: auto; padding: 4px 0 12px; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .wl-homepage .wl-home-process__grid::-webkit-scrollbar { display: none; }
  .wl-homepage .wl-home-process-card { flex: 0 0 84vw; padding: 18px !important; border-radius: 16px; scroll-snap-align: start; }

  /* Forms are a vertical conversation, not a squeezed desktop grid. */
  .wl-homepage #safari-planner-form { display: grid; grid-template-columns: 1fr !important; gap: 12px !important; }
  .wl-homepage #safari-planner-form > div { display: grid; grid-template-columns: 1fr !important; gap: 12px !important; }
  .wl-homepage #safari-planner-form label { margin-bottom: 6px; font-size: .62rem; }
  .wl-homepage #safari-planner-form input, .wl-homepage #safari-planner-form select, .wl-homepage #safari-planner-form button { width: 100%; min-height: 52px; font-size: 16px !important; }
  .wl-homepage #safari-planner-form button { border-radius: 12px; }
  .wl-homepage .wl-home-start-here__grid { display: grid; grid-template-columns: 1fr; gap: 9px; }
  .wl-homepage .wl-home-start-card { min-height: 118px; padding: 17px; border-radius: 16px; }

  /* All homepage card rails become intentional swipe modules. */
  .wl-homepage [data-wl-rail] { display: flex !important; width: calc(100vw - 32px); margin-inline: auto; gap: 10px !important; overflow-x: auto !important; padding: 3px 2px 13px; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .wl-homepage [data-wl-rail]::-webkit-scrollbar { display: none; }
  .wl-homepage [data-wl-rail] > * { flex: 0 0 84vw !important; width: 84vw !important; scroll-snap-align: start; }
  .wl-homepage .wl-style-card, .wl-homepage .wl-home-tour-card, .wl-homepage .wl-home-journal-card { min-height: 0; overflow: hidden; border-radius: 17px !important; }
  .wl-homepage .wl-style-card-image { height: 205px !important; object-fit: cover; }
  .wl-homepage .wl-style-card-actions { display: grid; grid-template-columns: 1fr; gap: 7px; }
  .wl-homepage .wl-style-card-actions a { min-height: 46px; display: flex; align-items: center; justify-content: center; border-radius: 10px; }
  .wl-homepage .wl-rail-tools { width: calc(100% - 32px); margin-inline: auto; }
  .wl-homepage .wl-rail-button { width: 42px; height: 42px; }

  /* Destination and tour cards used by homepage. */
  .wl-homepage .wl-destination-card, .wl-homepage .wl-destinations-card { min-height: 360px; }
  .wl-homepage .wl-home-tours-showcase__actions { display: grid; grid-template-columns: 1fr; gap: 8px; }
  .wl-homepage .wl-home-tours-showcase__actions a { width: 100%; justify-content: center; }

  /* Fixed actions must never hide content or fight each other. */
  .wl-mobile-conversion-bar { right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); left: 10px; padding: 5px; border: 1px solid rgba(255,255,255,.16); border-radius: 15px; box-shadow: 0 12px 30px rgba(2,44,34,.22); }
  .wl-mobile-conversion-bar a { min-height: 47px; border-radius: 11px; }
  .wl-homepage { padding-bottom: 82px; }
}

@media (max-width: 390px) {
  .wl-homepage .wl-home-promises__grid { grid-template-columns: 1fr !important; }
  .wl-homepage .wl-flagship-hero__frame, .wl-homepage .wl-flagship-hero__content { min-height: 675px; }
  .wl-homepage .wl-flagship-hero h1 { font-size: clamp(2.48rem, 13.7vw, 3.5rem); }
}

/* Viewport repair: the site must scroll as one full-width document on phones. */
@media (max-width: 767px) {
  html, body { width: 100% !important; min-width: 0 !important; max-width: none !important; height: auto !important; min-height: 100% !important; max-height: none !important; overflow-x: hidden !important; overflow-y: visible !important; }
  #page, #content, .site, .site-content, .site-main, main#primary, main.wl-homepage { width: 100% !important; max-width: none !important; height: auto !important; min-height: 0 !important; max-height: none !important; overflow: visible !important; }
  .wl-homepage { padding-bottom: calc(98px + env(safe-area-inset-bottom)) !important; }
  .wl-mobile-conversion-bar { opacity: 0; pointer-events: none; transform: translateY(calc(100% + 18px)); transition: opacity .24s ease, transform .24s ease; }
  .wl-mobile-conversion-bar.is-visible { opacity: 1; pointer-events: auto; transform: translateY(0); }
  .wl-mobile-menu, .wl-search-dialog__panel, .wl-compare-modal__panel, .wl-cookie-banner { overflow-y: auto !important; }
}
@media (prefers-reduced-motion: reduce) {
  .wl-mobile-conversion-bar { transition: none; }
}