/* Mobile storefront slideshow. One flow: heading, product stage, offer, navigation.
   Desktop image offsets deliberately do not apply inside the mobile stage. */
@media (max-width:820px) {
  .hero:has(.promo-product) .promo-product-stage .hero-slide-foreground:is([src$="showcase-billet14-v1-original.png"],[src$="showcase-dracarys-v1-original.jpg"],[src$="showcase-ak105-v1-original.jpg"]){transform:rotate(43deg) scale(1.35)}
  body:has(.hero .promo-product) { --hero-rail-space:48px; }
  body:has(.hero .promo-product) .header-top { display:none; }
  body:has(.hero .promo-product) .site-header { position:absolute; inset:0 0 auto; }
  body:has(.hero .promo-product) .header-main { min-height:68px; padding:12px 16px; width:100%; }
  body:has(.hero .promo-product) .brand img { width:130px; height:auto; }
  body:has(.hero .promo-product) .menu-button { width:44px; height:44px; min-width:44px; padding:10px; gap:5px; display:flex; flex-direction:column; justify-content:center; }
  body:has(.hero .promo-product) .menu-button span:not(.sr-only) { position:relative; inset:auto; display:block; width:24px; height:2px; min-height:2px; margin:0; }
  .hero:has(.promo-product) { height:auto; min-height:0; max-height:none; padding:76px 0 24px; overflow:hidden; overflow-anchor:none; isolation:isolate; background:#020713; }
  .hero:has(.promo-product) .hero-content { display:grid; position:relative; inset:auto; width:100%; max-width:600px; margin:0 auto; padding:0 16px; z-index:4; }
  .hero:has(.promo-product) .hero-slide { grid-area:1/1; display:grid; align-content:start; gap:8px; grid-template-columns:minmax(0,1fr); position:relative; inset:auto; width:100%; height:auto; min-height:0; margin:0; padding:0; transform:none; transition:none; }
  .hero:has(.promo-product) .hero-slide:not(.is-active) { visibility:hidden; pointer-events:none; }
  .hero:has(.promo-product) .hero-slide.is-active { visibility:visible; opacity:1; }
  .hero:has(.promo-product) .hero-slide > * { animation:none!important; }
  .hero:has(.promo-product) .promo-product::before,
  .hero:has(.promo-product) .promo-product::after,
  .hero:has(.promo-product) .hero-title::after,
  .hero:has(.promo-product) .hero-note::before { content:none; }
  .hero:has(.promo-product) .hero-pulse-splash,
  .hero:has(.promo-product) .cert-badge,
  .hero:has(.promo-product) .social-dock { display:none; }
  .hero:has(.promo-product) .promo-background { inset:0; width:100%; height:100%; background-color:#020713; background-image:linear-gradient(180deg,transparent 0,transparent 330px,#020713 440px),url('/assets/images/slideshow/hpa-studio-camo-v1.jpg'); background-position:0 0,64% top; background-size:100% 100%,auto 440px; background-repeat:no-repeat; background-blend-mode:normal; }
  .hero:has(.promo-product) .promo-background::before,
  .hero:has(.promo-product) .promo-background::after { content:none; }
  .hero:has(.promo-product) .hero-vignette { background:linear-gradient(180deg,transparent 60%,#000 100%); pointer-events:none; }
  .hero:has(.promo-product) .promo-background img { object-position:var(--mx,50%) var(--my,50%); transform:scale(var(--mz,1)); transform-origin:var(--mx,50%) var(--my,50%); }
  .hero:has(.promo-product) .promo-kicker { margin:0; max-width:calc(100% - var(--hero-rail-space)); font:800 10px/1.4 Inter,sans-serif; letter-spacing:.18em; color:#59dbff; }
  .hero:has(.promo-product) .promo-kicker::before { width:22px; }
  .hero:has(.promo-product) .hero-title { display:block; max-width:calc(100% - var(--hero-rail-space)); margin:0; font-size:clamp(34px,10vw,48px); line-height:1; font-weight:400; letter-spacing:.005em; }
  .hero:has(.promo-product) .hero-title span { display:inline; }
  .hero:has(.promo-product) .hero-title span + span::before { content:' '; }
  .hero:has(.promo-product) .hero-title span:last-child { color:#59dbff; }
  .hero:has(.promo-product) .hero-title-art { width:auto; max-width:80%; max-height:76px; object-fit:contain; }
  .hero:has(.promo-product) .promo-product-stage { display:flex; position:relative; align-items:center; justify-content:center; width:calc(100% - var(--hero-rail-space)); height:clamp(160px,24svh,220px); min-width:0; margin:0; padding:10px 3px 20px; isolation:isolate; z-index:3; }
  .hero:has(.promo-product) .promo-product-stage::before { content:''; position:absolute; inset:4% -7% 0; z-index:-1; background:radial-gradient(ellipse at 50% 48%,#25bdff55 0%,#155bff25 35%,transparent 68%); filter:blur(9px); }
  .hero:has(.promo-product) .promo-product-stage::after { content:''; position:absolute; left:5%; right:5%; bottom:4px; height:23px; z-index:-1; border-radius:50%; background:radial-gradient(ellipse,#26bfff70, #1061ff20 45%,transparent 70%); box-shadow:0 -4px 22px #155bff25; }
  .hero:has(.promo-product) .promo-product-stage .hero-slide-foreground { position:static; inset:auto; display:block; width:100%; height:100%; min-width:0; max-width:100%; max-height:100%; margin:0; object-fit:contain; opacity:1; transform:none; filter:drop-shadow(0 14px 14px #000a) drop-shadow(0 0 12px #168fff38); }
  .hero:has(.promo-product) .promo-product-stage .hero-slide-foreground:is([src$="showcase-mtw-xbr-v2-original.jpg"],[src$="showcase-mtw-billet-v1.png"]) { transform:rotate(43deg) scale(1.35); }
  .hero:has(.promo-product) .promo-product-stage--engine .hero-slide-foreground { width:94%; height:80%; transform:rotate(13deg); }
  /* The shared storefront sheet marks these three legacy values important. */
  .hero:has(.promo-product) .hero-note { max-width:calc(100% - var(--hero-rail-space))!important; min-height:35px; margin:0; padding:0; font-family:Inter,sans-serif; font-size:12px!important; line-height:1.45!important; font-weight:400; text-transform:none; color:#cad5e8; letter-spacing:0; }
  .hero:has(.promo-product) .promo-price { display:grid; grid-template-columns:repeat(2,max-content); align-items:center; gap:3px 9px; max-width:calc(100% - var(--hero-rail-space)); margin:2px 0 0; font-family:var(--display); font-size:30px; line-height:1; color:#59dbff; text-shadow:none; }
  .hero:has(.promo-product) .promo-price-now { font-size:30px; white-space:nowrap; }
  .hero:has(.promo-product) .promo-price-before { grid-column:1/-1; font:400 13px/1.2 Inter,sans-serif; color:#a3adc0; text-decoration:line-through; }
  .hero:has(.promo-product) .promo-price-badge { padding:5px 7px; background:#155bff; color:white; font:800 10px/1.2 Inter,sans-serif; }
  .hero:has(.promo-product) .promo-price small { grid-column:1/-1; font:400 10px/1.3 Inter,sans-serif; color:#aebbd1; letter-spacing:0; }
  .hero:has(.promo-product) .promo-mini-actions { display:flex; flex-wrap:wrap; gap:5px; max-width:calc(100% - var(--hero-rail-space)); margin:0; }
  .hero:has(.promo-product) .promo-mini-actions span { display:inline-block; padding:5px 7px; border:1px solid #319ddf70; background:#041328b0; color:#bdeaff; font:700 8px/1.2 Inter,sans-serif; letter-spacing:.06em; text-transform:uppercase; }
  .hero:has(.promo-product) .hero-cta { position:relative; inset:auto; justify-self:start; display:flex; align-items:center; justify-content:center; width:calc(100% - var(--hero-rail-space)); min-width:0; min-height:44px; margin:2px 0 0; padding:10px 15px; border:1px solid #59dbff; background:linear-gradient(110deg,#155bff,#10bcef); box-shadow:0 8px 22px #155bff25; font:400 18px/1 var(--display); color:#fff; text-decoration:none; }
  .hero:has(.promo-product) .hero-cta::after { content:'→'; margin-left:14px; }
  .hero:has(.promo-product) .slider-dots { position:relative; inset:auto; display:grid; grid-template-columns:repeat(var(--slide-count,3),minmax(76px,1fr)); gap:6px; width:calc(100% - 32px); max-width:568px; height:auto; margin:18px auto 0; padding:0; overflow-x:auto; overscroll-behavior-x:contain; z-index:5; }
  .hero:has(.promo-product) .slider-dots::before { content:none; }
  .hero:has(.promo-product) .slider-product-button { display:grid; grid-template-columns:auto minmax(0,1fr); grid-template-rows:auto 32px; gap:3px 5px; align-items:center; width:100%; min-width:0; height:74px; padding:7px; border:1px solid #296ba778; border-radius:0; background:linear-gradient(140deg,#081628,#030811); box-shadow:none; clip-path:none; transform:none; }
  .hero:has(.promo-product) .slider-product-button.is-active { border-color:#35d4ff; background:linear-gradient(130deg,#0e4180,#06152c); box-shadow:inset 3px 0 #27d4ff,0 0 12px #155bff30; }
  .hero:has(.promo-product) .slider-product-button::before,
  .hero:has(.promo-product) .slider-product-button::after { content:none; }
  .hero:has(.promo-product) .slide-card-number { font:400 16px/1 var(--display); color:#59dbff; }
  .hero:has(.promo-product) .slide-card-title { min-width:0; padding:0; border:0; font:400 11px/1.1 var(--display); letter-spacing:.01em; white-space:normal; }
  .hero:has(.promo-product) .slide-card-image { grid-column:1/-1; display:block; width:100%; height:32px; object-fit:contain; }
  .hero:has(.promo-product) .slide-card-title::before { content:none; }
  .hero:has(.promo-product) .slider-product-arrow { display:none!important; }
  .hero:has(.promo-product) .hero-cta:focus-visible,
  .hero:has(.promo-product) .slider-product-button:focus-visible { outline:2px solid white; outline-offset:3px; }
  body:has(.hero .promo-product) .side-rail-actions { position:fixed; top:clamp(180px,32svh,280px); right:6px; bottom:auto; width:40px; gap:10px; transform:none; z-index:89; }
  body:has(.hero .promo-product) .side-rail-action { width:40px; height:94px; }
  body:has(.hero .promo-product) .side-rail-action-card { width:94px; min-height:38px; padding:5px 7px; gap:4px; border-radius:15px; animation:none; }
  body:has(.hero .promo-product) .side-rail-action-icon { width:23px; height:23px; font-size:12px; }
  body:has(.hero .promo-product) .side-rail-action-copy small { font-size:6px; }
  body:has(.hero .promo-product) .side-rail-action-copy strong { font-size:9px; }
  body:has(.hero .promo-product) .side-rail-action-engraving .side-rail-action-copy strong { font-size:8px; }
  body:has(.hero .promo-product) .wolverine-assistant { right:7px; top:calc(clamp(180px,32svh,280px) + 208px); bottom:auto; transform:scale(.74); transform-origin:right top; }
  body.assistant-open:has(.hero .promo-product) .wolverine-assistant { top:auto; bottom:calc(88px + env(safe-area-inset-bottom)); transform:none; }
  .hero:has(.promo-product) .promo-banner { min-height:380px; }
  @media (max-width:360px) {
    .hero:has(.promo-product) .hero-content { padding-inline:12px; }
    .hero:has(.promo-product) .hero-title { font-size:33px; }
    .hero:has(.promo-product) .promo-product-stage { height:160px; }
    .hero:has(.promo-product) .promo-mini-actions span { font-size:7px; padding:4px 5px; }
    .hero:has(.promo-product) .slider-dots { width:calc(100% - 24px); }
  }
  @media (prefers-reduced-motion:reduce) {
    .hero:has(.promo-product) *, .hero:has(.promo-product) *::before, .hero:has(.promo-product) *::after { animation:none; transition:none; }
  }
}