/* Final mobile-only corrections. Keep this stylesheet last in the cascade. */
@media (max-width: 760px) {
  /* Work: slower glass reveal and a bottom-right corner shared with the image. */
  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    [data-loc="src/web/pages/Home.tsx:254"]
    .triptych-panel
    .av-work-card-meta {
    left: 12px !important;
    right: 0 !important;
    bottom: 0 !important;
    width: auto !important;
    border-radius: 14px 14px 8px 14px !important;
    transition-property: transform, background, border-color, box-shadow,
      backdrop-filter, -webkit-backdrop-filter !important;
    transition-duration: 1.05s !important;
    transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1) !important;
  }

  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    [data-loc="src/web/pages/Home.tsx:254"]
    .triptych-panel
    .av-work-card-meta
    :is(span, b, em),
  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    [data-loc="src/web/pages/Home.tsx:254"]
    .triptych-panel
    .av-work-card-meta::after {
    transition-duration: 0.92s !important;
    transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1) !important;
  }

  /* About: let the chart use the card width and give the plot readable height. */
  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    [data-loc="src/web/pages/Home.tsx:368"].av-about-experience
    > [data-loc="src/web/pages/Home.tsx:395"].av-about-panel--financial {
    height: 430px !important;
    min-height: 430px !important;
  }

  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    [data-loc="src/web/pages/Home.tsx:368"].av-about-experience
    > [data-loc="src/web/pages/Home.tsx:395"].av-about-panel--financial
    [data-loc="src/web/pages/Home.tsx:397"] {
    inset: 0 0 auto !important;
    width: 100% !important;
    height: 270px !important;
    min-height: 270px !important;
    padding: 10px 8px 8px !important;
    border-radius: 6px 6px 0 0 !important;
  }

  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    [data-loc="src/web/pages/Home.tsx:368"].av-about-experience
    > [data-loc="src/web/pages/Home.tsx:395"].av-about-panel--financial
    .av-about-chart,
  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    [data-loc="src/web/pages/Home.tsx:368"].av-about-experience
    > [data-loc="src/web/pages/Home.tsx:395"].av-about-panel--financial
    .av-about-chart
    svg {
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
  }

  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    [data-loc="src/web/pages/Home.tsx:368"].av-about-experience
    > [data-loc="src/web/pages/Home.tsx:395"].av-about-panel--financial
    > .av-about-module {
    height: 160px !important;
    min-height: 160px !important;
  }

  /* About / Our Team: zoom the people, not the surrounding room. */
  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    [data-loc="src/web/pages/Home.tsx:368"].av-about-experience
    > [data-loc="src/web/pages/Home.tsx:371"].av-about-panel--team {
    height: 430px !important;
    min-height: 430px !important;
  }

  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    [data-loc="src/web/pages/Home.tsx:368"].av-about-experience
    > [data-loc="src/web/pages/Home.tsx:371"].av-about-panel--team
    [data-loc="src/web/pages/Home.tsx:372"] {
    object-position: 50% 56% !important;
    transform: scale(1.3) !important;
    transform-origin: 50% 56% !important;
  }

  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    [data-loc="src/web/pages/Home.tsx:368"].av-about-experience
    > [data-loc="src/web/pages/Home.tsx:371"].av-about-panel--team:is(:hover, :focus-within)
    [data-loc="src/web/pages/Home.tsx:372"] {
    transform: scale(1.3) !important;
  }

  /* Story: retain the horizontal reel rail while removing excess portrait height. */
  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    [data-loc="src/web/pages/Home.tsx:406"].av-story-journal-v4 {
    height: 553px !important;
    height: min(553px, 70svh) !important;
    min-height: 0 !important;
    max-height: 553px !important;
  }

  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    .av-story-journal-v4
    #reels-scroll
    > .av-story-glass-card:nth-child(n) {
    height: 390px !important;
    height: min(390px, calc(70svh - 163px)) !important;
    min-height: 0 !important;
    max-height: 390px !important;
  }

  /* Home Process: mobile uses the six useful phase cards only. */
  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    .process-triptych-grid.av-process-architecture {
    min-height: 0 !important;
    gap: 12px !important;
  }

  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    .process-triptych-grid.av-process-architecture
    :is(.av-process-preview, .av-process-current, .av-process-path) {
    display: none !important;
  }

  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    .process-triptych-grid.av-process-architecture
    .av-process-step
    .av-specular-button__fx {
    display: none !important;
  }

  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    .process-triptych-grid.av-process-architecture
    .av-process-step {
    contain: layout paint !important;
    touch-action: manipulation !important;
    transition: background-color 0.18s ease, color 0.18s ease !important;
  }

  /* Footer: remove the square link sizing inherited by the logo anchor. */
  html body #root .av-footer-logo-link {
    width: 112px !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
  }

  html body #root .av-footer-logo-link .av-footer-logo,
  html body #root .av-footer-logo-link img {
    width: 112px !important;
    height: auto !important;
    max-width: 100% !important;
  }
}

/* The dedicated Process page avoids WebGL/scroll-heavy decoration on phones. */
@media (max-width: 900px), (pointer: coarse) {
  .av-process-v4.is-mobile-lite
    :is(
      [data-process-threads-root],
      [data-process-hero-threads-root],
      [data-process-continuity-threads-root]
    ) {
    display: none !important;
  }

  .av-process-v4.is-mobile-lite
    .av-process-hero__signal {
    display: none !important;
    animation: none !important;
  }

  .av-process-v4.is-mobile-lite .av-process-sequence__scanner {
    animation: none !important;
  }

  .av-process-v4.is-mobile-lite .av-process-threshold__cta::before {
    animation: none !important;
  }
}

@media (max-width: 380px) {
  html body #root:has([data-loc="src/web/pages/Home.tsx:188"])
    .av-story-journal-v4
    #reels-scroll
    > .av-story-glass-card:nth-child(n) {
    height: 370px !important;
    height: min(370px, calc(70svh - 163px)) !important;
    min-height: 0 !important;
    max-height: 370px !important;
  }
}
