/* Small-screen storefront: navigation, legibility, and product discovery. */
@media (max-width: 960px) {
  header > nav { display: none !important; }
  .menu-toggle { display: grid; place-items: center; }
  .mobile-menu { overflow-y: auto; overscroll-behavior: contain; padding-bottom: max(28px, env(safe-area-inset-bottom)); }
  .mobile-menu nav a { min-height: 54px; }
  .mobile-menu-help { border-top: 1px solid var(--line); margin-top: 22px; padding-top: 19px; }
  .mobile-menu-help strong { display: block; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: #515a55; margin-bottom: 8px; }
  .mobile-menu-help a, .mobile-menu-help button { display: flex; align-items: center; width: 100%; min-height: 46px; padding: 10px 0; border: 0; border-bottom: 1px solid var(--line); background: none; font: inherit; font-size: 16px; text-align: left; }
}

@media (max-width: 700px) {
  html { scroll-padding-top: 82px; }
  body { overflow-x: clip; }
  header { height: 66px; min-height: 66px; padding: 8px 4%; gap: 6px; flex-wrap: nowrap; }
  header .logo { flex: 0 1 auto; min-width: 0; }
  header .logo .brand-name { font-size: clamp(12px, 3.6vw, 16px); letter-spacing: .07em; white-space: nowrap; }
  header .logo .brand-mark { font-size: 28px; margin-right: 4px; }
  header .nav-tools { gap: 0; flex-shrink: 0; }
  header .nav-tools button { min-width: 42px; min-height: 44px; padding: 8px; }
  header .nav-tools #favorites-open { display: none; }
  header .cart-trigger { min-width: 62px; min-height: 44px; padding: 8px; font-size: 13px; flex-shrink: 0; }
  header .menu-toggle { order: 5; flex-shrink: 0; min-width: 44px; width: 44px; height: 44px; font-size: 21px; }
  .announcement { min-height: 32px; padding: 7px 5%; font-size: 12px; line-height: 1.35; }
  .mobile-menu { width: min(420px, 100%); padding: 20px 6% 28px; }
  .mobile-menu-title { padding-bottom: 14px; }
  .mobile-menu-title .close { min-width: 44px; min-height: 44px; }
  .mobile-menu nav { margin-top: 8px; }
  .mobile-menu nav a { padding: 11px 0; font-size: 20px; line-height: 1.3; }
  .mobile-menu p { margin-top: 18px; }

  h2 { font-size: clamp(27px, 7vw, 36px); line-height: 1.19; letter-spacing: -.03em; }
  .eyebrow, .micro-label, .path-number { font-size: 13px; }
  .page-heading { margin: 0; padding: 27px 5% 21px; }
  .page-heading h1 { font-size: clamp(31px, 8vw, 42px); line-height: 1.13; letter-spacing: -.04em; }
  .page-heading p { font-size: 16px; line-height: 1.55; }
  .section-head > p, .shop-paths .section-head p { font-size: 16px; }
  .button, .text-link { min-height: 44px; }

  .studio-hero { height: auto; min-height: 625px; }
  .studio-hero .zen-copy { max-width: none; width: 100%; padding: 29px 6% 16px; }
  .studio-hero .zen-copy h1 { font-size: clamp(31px, 8vw, 42px); line-height: 1.11; margin: 17px 0 14px; }
  .studio-hero .zen-copy p { font-size: 16px; line-height: 1.55; max-width: 35ch; }
  .studio-hero .zen-actions { gap: 10px 18px; margin-top: 17px; flex-wrap: wrap; }
  .studio-hero .button { font-size: 14px; padding: 13px 17px; }
  .studio-hero .hero-secondary-link { font-size: 14px; }
  .studio-hero-image { object-fit: contain; object-position: center bottom; }
  .studio-hero::after { background: linear-gradient(#fff 0%, #fffffff5 23%, #ffffff70 42%, #ffffff00 63%); }
  .studio-image-note { bottom: 78px; right: 5%; max-width: 48%; line-height: 1.35; }
  .browse-dock { left: 4%; right: 4%; bottom: max(8px, env(safe-area-inset-bottom)); min-height: 52px; padding: 12px 18px; font-size: 15px; }
  .shop-paths { padding: 36px 5%; }
  .shop-path-grid { gap: 10px; margin: 19px 0 14px; }
  .shop-path-grid > a { min-height: 145px; padding: 20px; }
  .shop-path-grid h3 { font-size: 25px; margin: 12px 0 8px; }
  .shop-path-grid p, .shop-path-grid strong { font-size: 15px; }
  .launch-promo { padding: 26px 5%; }
  .launch-promo p { font-size: 16px; }
  .zen-numbers { padding-inline: 5%; }
  .zen-numbers span { font-size: 13px; }
  .zen-lineup { padding: 40px 5%; }
  .zen-lineup .home-cars { grid-template-columns: 1fr !important; gap: 20px; }
  .home-cars .product-top h3 { font-size: 19px; }
  .home-cars .sample { aspect-ratio: 1.65; }

  .catalog-layout { padding: 0 5% 42px; gap: 17px; }
  .mobile-filter-toggle { width: 100%; min-height: 48px; font-size: 16px; }
  .catalog-sidebar { grid-template-columns: 1fr; padding: 16px; gap: 6px; }
  .catalog-sidebar label[for=search], .catalog-sidebar label[for=family], .catalog-sidebar input, .catalog-sidebar select { grid-column: 1; grid-row: auto; }
  .catalog-sidebar label { font-size: 14px; }
  .catalog-sidebar input, .catalog-sidebar select, .sort-label select { width: 100%; min-height: 46px; font-size: 16px; }
  .family-browser { grid-column: 1; }
  .family-choices { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
  .family-choices button { min-height: 70px; font-size: 13px; }
  .catalog-layout .toolbar { display: grid; gap: 14px; }
  .catalog-layout .filters { gap: 7px; }
  .catalog-layout .filters button { min-height: 44px; font-size: 14px; padding: 10px 13px; }
  .sort-label { font-size: 15px; }
  .catalog-display-row { flex-wrap: wrap; gap: 8px; }
  .catalog-view { max-width: 100%; }
  .catalog-view button { min-height: 44px; font-size: 14px; }
  .catalog-page-range, .results-meta { font-size: 14px; line-height: 1.45; }
  .catalog-products .product-top h3 { font-size: 17px; line-height: 1.35; }
  .catalog-products .price { font-size: 18px; line-height: 1.45; }
  .catalog-products .price span, .catalog-products .product-card small { font-size: 14px; line-height: 1.4; }
  .catalog-products .card-tools button { min-height: 44px; font-size: 14px; }
  .catalog-products .card-tools [data-favorite] { min-width: 44px; }
  .pagination { gap: 7px; }
  .pagination button { min-height: 44px; min-width: 44px; font-size: 14px; }
  .catalog-note { font-size: 14px; line-height: 1.6; }

  .product-page { padding: 18px 5% 40px; gap: 20px; }
  .product-buy > p, .product-visual > .muted { font-size: 15px; line-height: 1.55; }
  .product-buy h1 { font-size: clamp(29px, 8vw, 38px); }
  .product-visual .supplier-photo { aspect-ratio: 1.5; }
  .gallery-buttons { gap: 8px; }
  .gallery-buttons button { min-height: 52px; flex: 1; min-width: 0; padding-right: 6px; font-size: 14px; }
  .gallery-buttons img { width: 50px; height: 38px; }
  .mini-specs { padding: 16px 0; margin-top: 19px; gap: 6px; }
  .mini-specs b { font-size: 18px; }
  .mini-specs span { font-size: 13px; line-height: 1.3; }
  .variant-options label > span { min-height: 56px; font-size: 15px; }
  .product-terms, .product-buy dl, .product-buy .notice { font-size: 14px; line-height: 1.55; }
  .product-dock:not([hidden]) { gap: 10px; padding: 10px 5% max(10px, env(safe-area-inset-bottom)); }
  .product-dock strong { font-size: 19px; }
  .product-dock .button { min-height: 48px; font-size: 14px; padding: 11px 13px; }
  .product-dock span#dock-format { font-size: 13px; }
  .quick-dialog { width: calc(100% - 12px); max-height: 95dvh; }
  .quick-copy { padding: 22px 18px; }
  .quick-description, .quick-copy .quick-note { font-size: 15px; }
  .quick-close, .close { min-width: 44px; min-height: 44px; }

  .legal-page, .account-page { padding: 28px 5% 44px; }
  .legal-page p, .legal-page li, .account-page p, .account-page li { font-size: 16px; line-height: 1.6; }
  .account-benefits span { font-size: 14px; }
  #auth-form input:not([type=checkbox]), #account-form input:not([type=radio]), #withdrawal-form input, #withdrawal-form textarea { min-height: 48px; font-size: 16px; }
  .format-table { overflow-x: auto; }
  .format-table table { min-width: 600px; }

  footer { padding: 38px 5% 22px; }
  .footer-top { gap: 17px; padding-bottom: 26px; }
  .footer-links { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; border-top: 1px solid #555; padding-top: 13px; }
  .footer-links a { display: flex; align-items: center; min-height: 44px; font-size: 15px; }
  .legal-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; padding: 15px 0; font-size: 14px; }
  .legal-links a { display: flex; align-items: center; min-height: 44px; }
  .footer-bottom { font-size: 13px; line-height: 1.5; }
  .drawer { padding: 25px 18px max(25px, env(safe-area-inset-bottom)); }
  .cart-quantity button { min-width: 44px; min-height: 44px; }
}

@media (max-width: 430px) {
  header { padding-inline: 3%; gap: 4px; }
  header .logo .brand-name { font-size: 12px; letter-spacing: .035em; }
  header .logo .brand-mark { font-size: 25px; margin-right: 2px; }
  header .cart-trigger { min-width: 58px; padding: 7px 4px; }
  .studio-hero { min-height: 575px; }
  .studio-hero .zen-copy h1 { font-size: clamp(29px, 7.8vw, 34px); }
  .studio-hero .zen-copy p { font-size: 15px; }
  .catalog-layout .catalog-products { grid-template-columns: 1fr; gap: 18px; }
  .catalog-products .sample { aspect-ratio: 1.6; }
  .catalog-products .card-tools { flex-wrap: nowrap; }
  .catalog-products .card-tools [data-compare] { width: auto; flex: 1; }
  .catalog-products .card-tools [data-quick-view] { flex: 1; }
  .family-choices { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .mini-specs b { font-size: 16px; }
  .product-dock span#dock-format { max-width: 100px; }
  .legal-links { grid-template-columns: 1fr 1fr; }
}
