/* Traverse Outdoors: responsive phone layout, 2026-09-09. */
:root { --traverse-header-height: 150px; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--traverse-header-height) + 16px); }
*, *::before, *::after { box-sizing: border-box; }
img { max-width: 100%; }
button, a, summary { -webkit-tap-highlight-color: rgba(232,196,139,.25); touch-action: manipulation; }
:is(a,button,summary):focus-visible { outline: 3px solid #b77a23; outline-offset: 4px; }
main [id] { scroll-margin-top: 16px; }
.booking-dialog { overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
@media (max-width: 1250px) {
 .header .nav { max-height: calc(100vh - var(--traverse-header-height) - 12px); max-height: calc(100dvh - var(--traverse-header-height) - 12px); overscroll-behavior: contain; gap: 4px; padding: 12px max(20px,env(safe-area-inset-right)) 20px max(20px,env(safe-area-inset-left)); }
 .header .nav a { display: flex; align-items: center; min-height: 48px; padding: 10px 12px; font-size: 1rem; }
 .header .menu-button { min-width: 48px; min-height: 48px; border: 1px solid #9baa9666; border-radius: 4px; }
}
@media (max-width: 900px) {
 .experience-grid { grid-template-columns: 1fr; }
 .speaker-grid { grid-template-columns: 1fr; gap: 28px; }
 .speaker-art { min-height: 320px; }
 .wrap { width: calc(100% - 40px); max-width: 720px; }
 .experience, .ticket-card, .schedule { min-width: 0; }
 .experience { padding: 28px; }
 .experience-photo { width: calc(100% + 56px); max-width: none; height: auto; margin: -28px -28px 24px; }
 .ticket-grid { grid-template-columns: 1fr; }
 .quick-facts { grid-template-columns: 1fr; gap: 18px; }
 .quick-facts > div { border: 0; padding: 0; }
 .quick-facts > div span { display: block; }
 .quick-facts strong { font-size: 1rem; }
 .quick-facts small { font-size: .8125rem; margin-bottom: 4px; }
 .section, .visit-section, .speaker-section { padding-block: 48px; }
 .experience p:not(.eyebrow), .speaker-copy > p:not(.eyebrow), .section-top > p,
 .ticket-card > p, .visit-grid p, .faqs details > p, .faq-section > div > p:not(.eyebrow),
 .community p:not(.eyebrow), .booking-dialog p { font-size: 1rem; line-height: 1.65; }
 .ticket-card ul, .faqs summary, .night-switch button, .schedule-row h4, .button { font-size: 1rem; }
 .card-detail, .fineprint, .arrival, .ticket-extras, .photo-grid figcaption,
 .speaker-copy p.small-note, .schedule-row p, .schedule-row time, .schedule .text-link,
 .footer > div:not(.brand):not(.footer-bottom), .footer-bottom { font-size: .875rem; line-height: 1.6; }
 .button, .night-switch button, .text-link, .more-photos summary, .footer a { min-height: 48px; }
 .footer a { display: inline-flex; align-items: center; }
 .night-switch button { justify-content: center; }
 .photo-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
 .photo-grid figure { min-width: 0; }
 .photo-grid figcaption { padding-block: 10px; }
 .booking-dialog { width: calc(100% - 24px)!important; max-width: 510px!important; max-height: calc(100vh - 32px)!important; max-height: calc(100dvh - 32px)!important; padding: 28px 24px!important; overflow-y: auto; }
 .booking-dialog [data-slot=dialog-title] { font-size: clamp(1.5rem,6vw,2rem); padding-right: 20px; overflow-wrap: anywhere; }
 .booking-dialog > button { width: 44px; height: 44px; top: 4px; right: 4px; }
 .booking-total { flex-wrap: wrap; gap: 12px; }
}
@media (max-width: 760px) {
 .header { height: auto; min-height: 0; grid-template-columns: minmax(0,1fr) 48px; gap: 10px 12px; padding: 10px max(16px,env(safe-area-inset-right)) 10px max(16px,env(safe-area-inset-left)); }
 .header .brand { grid-area: 1/1; width: min(205px,100%); justify-self: start; }
 .header .menu-button { grid-area: 1/2; justify-self: end; }
 .header-actions { grid-area: 2/1/auto/-1; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; width: 100%; }
 .header .social-links { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 0; width: 100%; }
 .header .social-links a { min-width: 0; min-height: 48px; padding: 3px 1px; }
 .header .social-links span { font-size: .75rem; line-height: 1.3; }
 .header .nav-ticket { width: auto; min-height: 48px; margin: 0; padding: 10px 12px; font-size: .9375rem; gap: 6px; }
 .header .nav-ticket svg { display: none; }
 .hero-content { padding-top: 36px; padding-bottom: 24px; }
 .hero h1 { font-size: clamp(2rem,8.3vw,3.5rem); line-height: 1.08; }
 .hero h1 em { font-size: inherit; }
 .hero p { margin-top: 20px; font-size: 1rem; }
 .hero .actions { margin-top: 24px; gap: 16px; }
 .hero-footer { margin-top: 28px; letter-spacing: .08em; font-size: .75rem; }
 .hero-footer span:last-child { display: block; }
 .eyebrow { font-size: .8125rem; letter-spacing: .11em; }
 .section h2, .speaker-copy h2, .visit-grid h2, .faq-section h2 { font-size: clamp(1.9rem,7.5vw,3rem); line-height: 1.15; }
 .section-top { margin-bottom: 28px; }
 .ticket-card { padding: 24px; }
 .ticket-card h3 { font-size: clamp(1.6rem,6vw,2rem); }
 .ticket-heading .eyebrow, .ticket-heading .tag { font-size: .75rem; }
 .ticket-extras { align-items: flex-start; gap: 16px; }
 .schedule { padding: 24px; }
 .closing { padding-block: 44px; }
 .closing h2 { font-size: clamp(2rem,8vw,3rem); }
 .mobile-cta { display: flex; position: sticky; bottom: 0; z-index: 25; padding: 10px max(16px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)); gap: 12px; }
 .mobile-cta > span { font-size: .875rem; }
 .mobile-cta .button { min-width: 120px; }
 .toast { bottom: calc(90px + env(safe-area-inset-bottom)); max-width: calc(100% - 24px); font-size: .9375rem; }
 .preview-note, .preview-note span { font-size: .75rem; line-height: 1.5; }
}
@media (max-width: 390px) {
 .header-actions { grid-template-columns: minmax(0,1fr); gap: 6px; }
 .header .nav-ticket { display: none; } /* Existing sticky ticket action remains available. */
 .header .social-links { width: 100%; }
 .wrap { width: calc(100% - 32px); }
 .photo-grid { grid-template-columns: 1fr; }
 .hero .actions { flex-direction: column; align-items: stretch; }
 .hero-link { min-height: 48px; justify-content: center; }
 .night-switch { width: 100%; }
 .night-switch button { flex-basis: 100%; }
 .footer { grid-template-columns: 1fr; }
 .schedule-row { grid-template-columns: 1fr; gap: 6px; }
}
@media (max-height: 500px) and (orientation: landscape) {
 .header { position: relative; }
 html { scroll-padding-top: 16px; }
 .header .nav { max-height: 70vh; max-height: 70dvh; }
 .mobile-cta { position: static; }
 .booking-dialog { max-height: calc(100vh - 16px)!important; max-height: calc(100dvh - 16px)!important; padding: 24px!important; }
}
@media (prefers-reduced-motion: reduce) {
 html { scroll-behavior: auto!important; }
 *, *::before, *::after { animation-duration: .01ms!important; transition-duration: .01ms!important; animation-iteration-count: 1!important; }
}