/* V13.3: keep mobile choices reachable, with room to read. */
.journey-filter .filter-more{display:none}
@media(max-width:780px){
 .nav .links{inset:100% 0 auto;transform:none;display:none;flex-flow:column nowrap;align-items:stretch;justify-content:flex-start;width:100%;max-width:none;max-height:calc(100svh - 124px);height:auto;overflow-y:auto;padding:12px 20px 20px;gap:4px!important}
 .nav .links.open{display:flex;flex-flow:column nowrap}
 .nav .links a{flex:none;width:100%;min-height:48px;margin:0}
 .nav .links .nav-cta{margin-top:6px}
 body:has(.menu[aria-expanded="true"]) .travel-contact{visibility:hidden}
 .journey-path{scrollbar-width:thin;scroll-padding-inline:16px}
 .interest-switch{display:grid;grid-template-columns:1fr;gap:0;margin-block:24px}
 .interest-switch button{min-height:48px;text-align:left;font-size:14px!important;line-height:1.7;padding:12px 0}
 .programme-switch button{min-height:48px;min-width:70px}
 .departure-link{display:inline-flex;align-items:center;min-height:44px;min-width:70px;justify-content:flex-end}
 .flow-section h2{font-size:clamp(25px,6.8vw,30px)!important;text-wrap:pretty}
 .editorial-home .world-copy>p:not(.eyebrow):not(.data-note){font-size:14px!important;line-height:1.95!important}
 .editorial-home .world-copy .data-note{font-size:12px!important;line-height:1.9!important;letter-spacing:0!important}
 .editorial-home .hero .world-copy .flow-link{font-size:13px}
 .travel-contact{display:flex;align-items:center;gap:6px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom,0px))}
 .travel-contact-link{min-height:62px;padding:5px 13px 5px 5px}
 .travel-contact-portrait{width:50px;height:50px;flex-basis:50px}
 .travel-contact-control{padding:0;min-height:44px;height:44px}
 .travel-contact-pause{min-width:44px;width:44px;min-height:44px;height:44px;border:1px solid #8bb89e55;border-radius:50%;padding:0;font-size:0!important;letter-spacing:0!important}
 .travel-contact-pause::before{content:'Ⅱ';font-size:15px}
 .travel-contact-pause[aria-pressed="true"]::before{content:'▶';font-size:12px}
 .site-footer,.brand-footer{padding-bottom:104px!important}
 html{scroll-padding-bottom:96px}
 .journey-filter{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important}
 .journey-filter>label:has(#destinationFilter){order:0;grid-column:1/-1}
 .journey-filter>label:has(#monthFilter){order:1}
 .journey-filter>label:has(#yearFilter){order:2}
 .journey-filter .filter-more{display:block;order:3;grid-column:1/-1;min-height:44px;background:transparent;color:#aee6d6;border:0;border-bottom:1px solid #53746b;padding:10px 0;text-align:left}
 .journey-filter>.filter-secondary{display:none;order:4;grid-column:1/-1}
 .journey-filter.filters-expanded>.filter-secondary{display:flex}
 .journey-filter #searchTrips{order:5;background:#a1e7d5!important;color:#072923!important;min-height:48px;font-size:14px!important;letter-spacing:0!important}
 .journey-filter #resetFilters{order:6;min-height:48px;background:transparent!important;color:#c7d8d2!important;font-size:14px!important;letter-spacing:0!important}
 .journey-filter :is(input,select){min-height:48px;font-size:16px!important;width:100%;min-width:0}
 #filterSummary{scroll-margin-top:140px}
}
@media(prefers-reduced-motion:reduce){.travel-contact{transition:none}}
/* Safari (iPhone and Mac) draws its own select 28px tall and rounded, ignoring the filter's height and padding: without
   the native look Month and Year stand 48px like Destination, with the chevron drawn here instead. */
.journey-filter select{-webkit-appearance:none;appearance:none;border-radius:0;min-height:48px;padding:10px 40px 10px 10px;line-height:1.6;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23c7d8d2' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:12px 8px}
/* A phone on its side is 340–400px tall: the sticky header and the LINE button took 43–74% of it. The header scrolls
   away with the page, and the button keeps the phone's one-row size (a Pixel on its side is wider than 780px). */
@media(orientation:landscape) and (max-height:500px){
 .nav{position:relative!important}
 html.js-motion body .programme-header{position:absolute}
 .travel-contact{display:flex;align-items:center;gap:6px;right:calc(12px + env(safe-area-inset-right,0px));bottom:calc(8px + env(safe-area-inset-bottom,0px))}
 .travel-contact-link{gap:8px;min-height:52px;padding:4px 12px 4px 4px}
 .travel-contact-portrait{width:42px;height:42px;flex-basis:42px}
 .travel-contact-copy{gap:0}
 .travel-contact-copy strong{font-size:.875rem;line-height:1.45}
 .travel-contact-copy small{font-size:.75rem;line-height:1.45}
 .travel-contact-control{padding:0;min-height:44px;height:44px}
 .travel-contact-pause{min-width:44px;width:44px;min-height:44px;height:44px;border:1px solid #8bb89e55;border-radius:50%;padding:0;font-size:0!important;letter-spacing:0!important}
 .travel-contact-pause::before{content:'Ⅱ';font-size:15px}
 .travel-contact-pause[aria-pressed="true"]::before{content:'▶';font-size:12px}
}