/* =========================================================
   Drive Hub Sites — Mobile polish (≤899px)
   Aggressive / speed-forward: pulses, left-slides, press snaps
   ========================================================= */

/* ——— Safe-area insets ——— */
@supports (padding: env(safe-area-inset-top)) {
  .dhs-progress {
    top: env(safe-area-inset-top);
    left: env(safe-area-inset-left);
    right: env(safe-area-inset-right);
  }

  .dhs-header {
    padding-top: env(safe-area-inset-top);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }

  .dhs-mobile {
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }

  .dhs-mobile__inner {
    padding-left: max(1.5rem, env(safe-area-inset-left));
    padding-right: max(1.5rem, env(safe-area-inset-right));
    padding-bottom: max(2rem, calc(env(safe-area-inset-bottom) + 1rem));
  }

  .dhs-hero__scroll {
    right: max(1.5rem, calc(env(safe-area-inset-right) + 0.75rem));
    bottom: max(2rem, calc(env(safe-area-inset-bottom) + 1.25rem));
  }

  .dhs-footer {
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }
}

/* ——— ≤899px: tablet / phone ——— */
@media (max-width: 899px) {
  /* Tap targets ≥44px */
  .dhs-burger {
    width: 44px;
    height: 44px;
  }

  .dhs-nav__cta {
    min-height: 44px;
    padding: 0.65rem 1.1rem;
    align-items: center;
  }

  .dhs-mobile__cta {
    min-height: 44px;
    padding: 0.85rem 1.5rem;
    align-items: center;
    justify-content: center;
  }

  .dhs-mobile__link {
    min-height: 44px;
    display: flex;
    align-items: center;
  }

  .dhs-social a {
    width: 44px;
    height: 44px;
  }

  .dhs-top {
    width: 44px;
    height: 44px;
  }

  .dhs-filter__bar button {
    min-height: 44px;
    padding: 0.55rem 1rem;
  }

  .dhs-btn {
    min-height: 44px;
  }

  /* Press snaps — active, not just hover */
  .dhs-btn:active,
  .dhs-nav__cta:active,
  .dhs-mobile__cta:active,
  .dhs-top:active,
  .dhs-social a:active,
  .dhs-filter__bar button:active {
    transform: scale(0.96);
    transition-duration: 0.08s;
  }

  .dhs-btn--pulse:active {
    animation-play-state: paused;
  }

  .dhs-channel:active {
    transform: translateX(4px) scale(0.98);
  }

  /* Hero viewport */
  .dhs-hero {
    min-height: 100svh;
    min-height: 100dvh;
  }

  .dhs-hero__content {
    padding-top: calc(var(--dhs-header) + env(safe-area-inset-top, 0px) + 2.5rem);
    margin-bottom: 3.75rem;
  }

  .dhs-hero__cta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
  }

  /* Ken-burns / slow scale-in on hero media */
  .dhs-hero__media img {
    transform: scale(1.12);
    animation: dhsKenBurns 14s var(--dhs-ease) forwards;
    will-change: transform;
  }

  /* Hero entrance cascade — slide+fade from left (overrides soft reveal) */
  .dhs-hero .dhs-hero__brand.dhs-reveal,
  .dhs-hero .dhs-hero__brand-jp.dhs-reveal,
  .dhs-hero .dhs-hero__tag.dhs-reveal,
  .dhs-hero .dhs-hero__lead.dhs-reveal,
  .dhs-hero .dhs-hero__cta.dhs-reveal {
    opacity: 0;
    transform: translateX(-48px);
    transition: none;
  }

  .dhs-hero.is-ready .dhs-hero__brand,
  .dhs-hero.is-ready .dhs-hero__brand-jp,
  .dhs-hero.is-ready .dhs-hero__tag,
  .dhs-hero.is-ready .dhs-hero__lead,
  .dhs-hero.is-ready .dhs-hero__cta {
    animation: dhsHeroIn 0.55s var(--dhs-ease) forwards;
  }

  .dhs-hero.is-ready .dhs-hero__brand { animation-delay: 0.05s; }
  .dhs-hero.is-ready .dhs-hero__brand-jp { animation-delay: 0.14s; }
  .dhs-hero.is-ready .dhs-hero__tag { animation-delay: 0.24s; }
  .dhs-hero.is-ready .dhs-hero__lead { animation-delay: 0.34s; }
  .dhs-hero.is-ready .dhs-hero__cta { animation-delay: 0.46s; }

  /* Image zoom-on-reveal / touch — aggressive punch-in */
  .dhs-lane__media img,
  .dhs-tease__img img,
  .dhs-cmp__img img,
  .dhs-article__img img {
    transform: scale(1);
    transition: transform 0.55s var(--dhs-ease);
    will-change: transform;
  }

  .dhs-lane__row.is-in .dhs-lane__media img,
  .dhs-lane__row.is-touch .dhs-lane__media img,
  .dhs-lane__row:hover .dhs-lane__media img,
  .dhs-tease__card.is-in .dhs-tease__img img,
  .dhs-tease__card.is-touch .dhs-tease__img img,
  .dhs-cmp.is-in .dhs-cmp__img img,
  .dhs-cmp.is-touch .dhs-cmp__img img,
  .dhs-article.is-in .dhs-article__img img,
  .dhs-article.is-touch .dhs-article__img img {
    transform: scale(1.08);
  }

  /* Hover-only image zooms → also respond to .is-touch */
  .dhs-svcbay.is-touch .dhs-svcbay__media img,
  .dhs-cut.is-touch img {
    transform: scale(1.06);
  }

  .dhs-tach__note.is-touch .dhs-tach__note-media img {
    transform: scale(1.04);
  }

  /* Full-bleed sections: use dynamic viewport */
  .dhs-soundwall,
  .dhs-ignite,
  .dhs-svc-hero,
  .dhs-mast,
  .dhs-dock,
  .dhs-pitgate {
    min-height: 70svh;
    min-height: 70dvh;
  }

  .dhs-mobile {
    min-height: 100svh;
    min-height: 100dvh;
  }

  /* Coarse pointer: kill parallax jank */
  @media (pointer: coarse) {
    [data-dhs-parallax] {
      transform: none !important;
      will-change: auto;
    }
  }
}

/* ——— ≤699px: narrow phones ——— */
@media (max-width: 699px) {
  .dhs-hero__cta {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  .dhs-hero__cta .dhs-btn {
    width: 100%;
    max-width: 100%;
  }

  .dhs-hero__brand {
    font-size: clamp(36px, 12vw, 52px);
  }

  .dhs-hero__tag {
    max-width: 14ch;
  }

  .dhs-hero__lead {
    max-width: 32ch;
    font-size: 14px;
  }

  .dhs-hero__content {
    margin-bottom: 3.25rem;
  }

  .dhs-hero__scroll {
    right: max(1rem, env(safe-area-inset-right, 0px));
    bottom: max(1.5rem, calc(env(safe-area-inset-bottom, 0px) + 1rem));
  }

  .dhs-mobile__cta {
    align-self: stretch;
    width: 100%;
    justify-content: center;
  }

  .dhs-filter__bar {
    gap: 0.4rem;
  }

  .dhs-filter__bar button {
    flex: 1 1 auto;
    min-width: calc(50% - 0.4rem);
  }
}

/* ——— Keyframes ——— */
@keyframes dhsHeroIn {
  from {
    opacity: 0;
    transform: translateX(-48px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes dhsKenBurns {
  0% {
    transform: scale(1.12) translate3d(0, 0, 0);
  }
  100% {
    transform: scale(1.02) translate3d(-1.5%, -1%, 0);
  }
}

/* ——— Reduced motion ——— */
@media (prefers-reduced-motion: reduce) {
  .dhs-hero__media img {
    animation: none !important;
    transform: none !important;
  }

  .dhs-hero .dhs-hero__brand.dhs-reveal,
  .dhs-hero .dhs-hero__brand-jp.dhs-reveal,
  .dhs-hero .dhs-hero__tag.dhs-reveal,
  .dhs-hero .dhs-hero__lead.dhs-reveal,
  .dhs-hero .dhs-hero__cta.dhs-reveal,
  .dhs-hero.is-ready .dhs-hero__brand,
  .dhs-hero.is-ready .dhs-hero__brand-jp,
  .dhs-hero.is-ready .dhs-hero__tag,
  .dhs-hero.is-ready .dhs-hero__lead,
  .dhs-hero.is-ready .dhs-hero__cta {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
    transition: none !important;
  }

  .dhs-lane__media img,
  .dhs-tease__img img,
  .dhs-cmp__img img,
  .dhs-article__img img {
    transition: none !important;
    transform: none !important;
  }
}