/* Phone layouts are kept together so desktop artwork retains its proportions. */
.home-hero-art{display:none}
.work-time .phone-icon{display:block;width:22px;height:22px;flex:none}

@media(max-width:720px){
  html{scrollbar-gutter:auto;scroll-padding-top:16px}
  body.site-layout{background:#f9f3e4;font-weight:400}
  .paper-grain{position:absolute;opacity:.05}
  .site-layout .home-page .header{
    position:relative;inset:auto;z-index:10;height:72px;padding:10px 16px;
    display:grid;grid-template-columns:52px minmax(0,1fr) 44px 44px;gap:8px;
    background:none;border-bottom:1px solid #193d3610;
  }
  .site-layout:not(.catalog-page) .home-page{
    --mobile-home-art-height:clamp(240px,70vw,350px);
    --mobile-home-scene-height:calc(72px + var(--mobile-home-art-height));
  }
  .site-layout:not(.catalog-page) .home-page .header{
    background-color:#bfe3ec;
    background-image:linear-gradient(90deg,rgba(255,253,244,.28),rgba(255,253,244,.06) 62%,transparent),url("assets/hero-yeti-reference.webp");
    background-repeat:no-repeat;
    background-size:100% 100%,auto var(--mobile-home-scene-height);
    background-position:left top,83% top;
    border-bottom:0;
  }
  .site-layout:not(.catalog-page) .home-page{background:#e2f1f3}
  .site-layout .home-page .header .logo{width:52px;height:48px;transform:none}
  .site-layout .home-page .header .logo-copy{display:grid;padding:0;min-width:0;gap:4px}
  .site-layout .home-page .header .logo-copy b{font-size:13px;line-height:1.2;letter-spacing:0}
  .site-layout .home-page .header .logo-copy span{font-size:7px;line-height:1.2;letter-spacing:.7px}
  .site-layout .home-page .header .work-time{grid-column:3;grid-row:1;width:44px;height:44px;margin:0;padding:11px;border-radius:13px;justify-content:center}
  .site-layout .home-page .header .work-time>b{display:none}
  .site-layout .home-page .header .menu-button{grid-column:4;grid-row:1;display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin:0;padding:11px;gap:5px;border-radius:13px;background:#ffffff80;cursor:pointer}
  .menu-button i{width:22px;height:2px;border-radius:2px;transition:transform .2s}
  .menu-button[aria-expanded="true"] i:first-child{transform:translateY(3.5px) rotate(45deg)}
  .menu-button[aria-expanded="true"] i:nth-child(2){opacity:0}
  .menu-button[aria-expanded="true"] i:last-child{transform:translateY(-3.5px) rotate(-45deg)}
  .site-layout .home-page .header .nav{position:absolute;inset:71px 12px auto;display:none;margin:0;padding:12px;gap:4px;border-radius:0 0 18px 18px;background:#fffaf0;box-shadow:0 14px 24px #15353124}
  .site-layout .home-page .header .nav.open{display:flex;align-items:stretch}
  .site-layout .home-page .header .nav a{display:block;min-height:48px;padding:15px 14px;font:500 16px/1.2 Oswald,sans-serif;border:0;border-radius:9px}
  .site-layout .home-page .header .nav a[aria-current="page"]{background:#fae9e2;color:#dc1227;border:0;box-shadow:inset 3px 0 #f10b21}
  .menu-button:focus-visible,.work-time:focus-visible{outline:3px solid #173f38;outline-offset:3px}

  .site-layout .home-hero{display:flex;flex-direction:column;height:auto;min-height:0;background:linear-gradient(#e2f1f3,#eaf4f1 44%,#f9f3e4 85%);overflow:hidden}
  .site-layout .home-hero:before,.site-layout .home-hero:after{content:none}
  .site-layout .home-hero-copy{position:relative;inset:auto;z-index:2;order:2;max-width:none;padding:18px 20px 0}
  .site-layout .home-hero-copy h1{font-size:clamp(30px,8.7vw,48px);line-height:1.02;letter-spacing:-.7px}
  .site-layout .home-hero-copy h1 em{white-space:normal}
  .site-layout .home-hero-copy p{max-width:360px;margin:15px 0 18px;font-size:16px;line-height:1.35;color:#253b39}
  .site-layout .home-hero-copy p br{display:none}
  .site-layout .home-hero-copy>a{display:flex;justify-content:space-between;width:100%;max-width:380px;min-height:52px;padding:14px 20px;border-radius:14px;font-size:17px}
  .site-layout .home-hero-art{display:block;position:relative;order:1;height:var(--mobile-home-art-height);margin:0;background-image:linear-gradient(90deg,rgba(255,253,244,.28),rgba(255,253,244,.06) 62%,transparent),url("assets/hero-yeti-reference.webp");background-repeat:no-repeat;background-size:100% 100%,auto var(--mobile-home-scene-height);background-position:left top,83% -72px;mask-image:linear-gradient(#000 0%,#000 86%,transparent);-webkit-mask-image:linear-gradient(#000 0%,#000 86%,transparent)}
  .site-layout .home-hero .hero-sign{display:none}
  .site-layout .home-hero .benefits{position:relative;inset:auto;order:3;width:auto;grid-template-columns:1fr 1fr;gap:16px 20px;margin:0;padding:22px 20px 26px;background:none}
  .site-layout .home-hero .benefits article{flex-direction:row;align-items:center;gap:10px;font-size:12px;line-height:1.25}
  .site-layout .home-hero .benefits svg{width:27px;height:27px}

  .home-page .home-categories{padding:24px 16px 28px;background:#f9f3e4}
  .home-section-title{align-items:center;gap:12px;margin-bottom:18px}
  .home-section-title h2{max-width:240px;font-size:27px;line-height:1.08}
  .home-section-title a{flex:none;font-size:12px;line-height:1.3;padding:12px 0}
  .category-grid{gap:12px;margin:0 -16px;padding:0 16px 8px;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#becbbe transparent}
  .new-category-card{flex:0 0 72%;max-width:280px;height:290px;scroll-snap-align:center;border-radius:16px;padding:18px}
  .new-category-card span{font-size:27px;line-height:1.05;padding-right:27px}
  .new-category-card small{font-size:14px;line-height:1.25;margin-top:7px;padding-right:28px;font-weight:400}
  .new-category-card>b{width:34px;height:34px;right:14px;bottom:20px;font-size:23px}

  .tour-promo{margin:0 16px 24px;border-radius:18px;grid-template-columns:1fr}
  .tour-promo-photo{height:270px}
  .tour-promo-photo>p{font-size:34px;top:20px;left:23px}
  .tour-promo-copy{padding:25px 23px 28px}
  .tour-promo-copy h2{font-size:38px}
  .tour-promo-copy h2>span{font-size:40px;margin-left:18px}
  .tour-promo-intro{font-size:17px;line-height:1.35;margin:16px 0}
  .tour-promo-intro br{display:none}
  .tour-promo-features{font-size:15px;line-height:1.35;gap:12px}
  .tour-promo-features svg{width:22px;height:22px;flex-basis:22px}
  .tour-promo-peaks,.tour-promo-motto{display:none}
  .tour-promo-button{width:100%;min-height:50px;margin-top:23px;border-radius:13px;font-size:17px;padding:14px 18px}
  .tour-promo-collage{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:8px;height:auto;min-height:0;padding:24px 12px 28px}
  .tour-postcard{position:relative;inset:auto;width:auto;margin:0;padding:5px 5px 7px;box-shadow:1px 3px 7px #24352830}
  .tour-postcard img{aspect-ratio:1;object-fit:cover}
  .tour-postcard figcaption{font-size:clamp(16px,4.2vw,22px);line-height:1.05;white-space:normal;padding:7px 0 0}
  .tour-postcard-road{transform:rotate(-4deg)}
  .tour-postcard-sunset{transform:rotate(4deg);margin-top:14px}
  .tour-postcard-mountains{transform:rotate(-3deg)}
  .tour-promo-leaves,.tour-promo-compass{display:none}

  .home-page .bottom-grid{gap:18px;margin:0;padding:0 16px 24px;background:#f9f3e4}
  .home-page .new-contact{aspect-ratio:auto;min-height:0;padding:23px;background:#ed1729;border-radius:16px}
  .home-page .new-contact h2{position:static;max-width:none;transform:none;margin:0 0 18px;font:500 35px/1 Caveat,cursive}
  .home-page .new-contact h2 br{display:none}
  .home-page .new-contact>.contact-details{position:static;width:auto;padding:0;gap:16px}
  .home-page .new-contact address,.home-page .new-contact .contact-hours{font-size:15px;line-height:1.4;gap:12px;white-space:normal}
  .home-page .new-contact address>svg,.home-page .contact-hours svg{width:22px;height:26px;margin:0}
  .home-page .new-social{margin:3px 0 0;gap:14px}
  .home-page .new-social a{width:44px;height:44px}
  .home-page .new-social svg{width:25px;height:25px}
  .home-page .new-faq,.home-page .location-card{padding:22px 18px;border-radius:16px}
  .home-page .mini-heading{align-items:flex-start}
  .home-page .mini-heading h2{white-space:normal;font-size:23px;line-height:1.15;letter-spacing:0}
  .home-page .faq-toggle-all{min-height:44px;font-size:12px}
  .home-page .new-faq summary{min-height:50px;padding:12px;font-size:15px;line-height:1.3}
  .home-page .new-faq details p{font-size:14px;line-height:1.45;padding:2px 12px 15px}
  .home-page .location-card h2{font-size:23px}
  .home-page .location-card>p{font-size:15px;line-height:1.3;margin:13px 0}
  .home-page .location-card small{font-size:12px;line-height:1.3;margin-top:5px}
  .home-page .location-route{min-height:44px;font-size:13px}

  .site-layout.catalog-page .rental-page{--rental-masthead-height:340px}
  .site-layout.catalog-page .rental-page:before{background-position:60% center;background-image:linear-gradient(90deg,#eaf5f0d9,#eaf5f050),url("assets/catalog-mountains.webp")}
  .catalog-page .catalog-main{padding:0 16px 24px}
  .site-layout.catalog-page .rental-banner{min-height:268px;margin:0 -16px;padding:24px 20px 34px;background:none}
  .catalog-page .rental-banner-copy{max-width:100%}
  .catalog-page .rental-breadcrumbs{font-size:13px;line-height:1.3;margin-bottom:20px}
  .catalog-page .rental-banner h1{font-size:clamp(32px,8.5vw,46px);line-height:1.06;letter-spacing:-.5px}
  .catalog-page .rental-banner p{max-width:430px;font-size:16px;line-height:1.4;margin-top:16px}
  .catalog-page .rental-banner p br{display:none}
  .catalog-page .catalog-toolbar{padding:25px 0 16px}
  .catalog-page .catalog-toolbar h2{font-size:25px;line-height:1.15}
  .catalog-page .catalog-toolbar .catalog-nav{flex-wrap:nowrap;overflow-x:auto;gap:8px;margin:16px -16px 0;padding:0 16px 8px;scrollbar-width:thin;scrollbar-color:#becbbe transparent}
  .catalog-page .catalog-nav button{flex:none;min-height:44px;padding:12px 15px;font-size:13px;border-radius:12px;white-space:nowrap}
  .catalog-page .catalog-products{gap:18px}
  .catalog-page .catalog-products .bike-product{border-radius:16px}
  .catalog-page .catalog-products .product-copy{padding:20px}
  .catalog-page .catalog-products .product-copy h3{font-size:26px;line-height:1.15}
  .catalog-page .catalog-products .product-copy>p{font-size:16px;line-height:1.4}
  .catalog-page .catalog-products .rental-rates span{font-size:21px;padding:12px 4px}
  .catalog-page .catalog-products .rental-rates b{font-size:11px}
  .tours-view .route-card{border-radius:16px}
  .tours-view .route-image{aspect-ratio:4/3}
  .tours-view .route-copy{padding:22px 20px}
  .tours-view .route-copy p,.tours-view .route-copy ul{font-size:16px;line-height:1.4}
  .tours-view .route-contact{min-height:50px;font-size:15px}
  .contact-info-card,.contact-social-card{padding:24px 20px;border-radius:16px}
  .contact-social-grid{gap:18px 12px}
  .contact-social-item{min-height:44px;font-size:16px}
  .contact-social-item>svg{width:40px;height:40px;flex-basis:40px;padding:9px}
  .contact-map-footer>a{min-height:48px;width:100%;justify-content:space-between;font-size:15px}

  .home-footer{padding:26px 20px 22px;border-radius:0;gap:18px 12px}
  .home-footer nav{display:grid;grid-template-columns:1fr 1fr;gap:4px 16px;white-space:normal}
  .home-footer nav a{display:flex;align-items:center;min-height:44px;padding:10px 0;font-size:14px}
  .home-footer .footer-social{display:flex;gap:18px}
  .home-footer .footer-social a{width:44px;height:44px}
  .home-footer .footer-social svg{width:24px;height:24px}
  .home-footer .footer-mountain-note{display:none}
  .home-footer small{grid-row:4;font-size:12px;line-height:1.4}
}
@media(max-width:360px){
  .site-layout .home-page .header{padding:10px 12px;gap:6px;grid-template-columns:44px minmax(0,1fr) 42px 42px}
  .site-layout .home-page .header .logo{width:44px}
  .site-layout .home-page .header .logo-copy b{font-size:11px}
  .site-layout .home-page .header .logo-copy span{font-size:6px}
  .site-layout .home-hero-copy{padding-left:16px;padding-right:16px}
  .site-layout .home-hero .benefits{gap:14px 12px;padding-left:16px;padding-right:16px}
  .home-section-title h2{font-size:24px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.menu-button i{transition:none}}