/* ============================================================
   Virtual Automotiv — hero fixes
   Added 2026-09-06. Loaded AFTER index-DSqga_mm.css.
   Overrides only. No existing rule, bundle or component is edited,
   so this survives a rebuild and reverts by deleting one <link>.
   ============================================================ */

/* 1 + 2. Hero video fills the frame at every width, and a still frame sits
   behind it so the hero is never blank.

   Was:  .hero-video{object-fit:contain;background:#000}
         @media (min-width:768px){.hero-video{object-fit:cover}}
   Below 768px that letterboxed a 16:9 clip inside a tall phone viewport,
   leaving a black band above the picture.

   The two <video> elements (HeroSection.tsx:450 and :461) carry no poster
   attribute, so until the first frame decodes they are transparent and the
   black background showed through. The poster file below is frame 1 of the
   opening clip (moved out of this file 2026-09-16 so the CSS loads faster), so the handoff to live video is invisible. */
.hero-video{
  object-fit: cover !important;
  object-position: center center !important;
  background: #000 url("/media/hero-poster_f159cc55.jpg") center center / cover no-repeat !important;
}

/* 3. Remove the duplicated logo.
   HeroSection.tsx:561 renders a second monogram + wordmark lockup at 45%
   opacity, absolutely positioned at top:clamp(56px,8vh,80px) — directly
   behind the fixed nav, where it collides with the real nav logo and reads
   as a rendering fault. */
[data-loc="client/src/components/HeroSection.tsx:561"]{
  display: none !important;
}

/* ---- mobile touch-target fixes (Sep 7 2026) ---- */
@media (max-width: 1023px){
  /* product carousel dots are 8x8 - expand the tappable area, keep the dot's look.
     width = dot + the 12px flex gap, so neighbouring targets meet but never overlap. */
  [data-loc="client/src/components/ProductCarousel.tsx:470"]{ position: relative; }
  [data-loc="client/src/components/ProductCarousel.tsx:470"]::after{
    content: ""; position: absolute; top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% + 12px); height: 44px;
  }
  [data-loc="client/src/components/Navbar.tsx:231"]{ min-width: 44px; min-height: 44px; }
  [data-loc="client/src/components/HeroSection.tsx:music-control"],
  [data-loc="client/src/components/HeroSection.tsx:590"],
  [data-loc="client/src/components/HeroSection.tsx:863"],
  [data-loc="client/src/components/ProductCarousel.tsx:374"]{ min-height: 44px; }
}

@media (max-width: 1023px){
  [data-loc="client/src/components/Navbar.tsx:85"],
  [data-loc="client/src/components/ProductCarousel.tsx:499"],
  [data-loc="client/src/components/ProductCarousel.tsx:511"],
  [data-loc="client/src/components/CTASection.tsx:78"],
  [data-loc="client/src/components/CTASection.tsx:87"],
  [data-loc="client/src/components/CookieConsent.tsx:174"],
  [data-loc="client/src/components/CookieConsent.tsx:204"]{ min-height: 44px !important; }

  [data-loc="client/src/components/TeamSection.tsx:186"],
  [data-loc="client/src/components/CTASection.tsx:101"],
  [data-loc="client/src/components/Footer.tsx:108"],
  [data-loc="client/src/components/Footer.tsx:127"],
  [data-loc="client/src/components/Footer.tsx:146"],
  [data-loc="client/src/components/Footer.tsx:163"],
  [data-loc="client/src/components/Footer.tsx:196"],
  [data-loc="client/src/components/Footer.tsx:214"],
  [data-loc="client/src/components/Footer.tsx:232"],
  [data-loc="client/src/components/CookieConsent.tsx:148"]{
    display: inline-flex; align-items: center; min-height: 44px;
  }
}

/* 2026-09-16 — Intro text box sits in the lower third on laptop/desktop
   screens (about 135px lower than the original on a 1440x900 laptop).
   Set by screen height so it lands in the same spot on every screen; the
   120px floor keeps it clear of the Play With Sound / Skip Intro buttons.
   Font and box size unchanged. Phones and tablets unchanged.
   Delete this block to restore the original position. */
@media (min-width: 1024px) {
  [data-loc="client/src/components/HeroSection.tsx:482"] {
    padding-bottom: max(13.3vh, 120px) !important;
  }
}

/* 2026-09-16 — Readability.
   1. Contrast (all screens): two elements fell just under WCAG AA 4.5:1.
      - Product carousel CTA: white on #0081ec was 3.92:1 -> #0073d1, 4.8:1.
      - Footer "Manage Cookie Preferences": #0079ba on black was 4.44:1 -> #1a8fd0, 5.9:1.
   2. Phones only: every text element that rendered under 12px is raised to
      12-13px. Values are overridden by data-loc because the sizes are set
      inline in the app bundle. Delete this block to restore the old sizes. */
[data-loc="client/src/components/ProductCarousel.tsx:374"]:not(:hover){
  background: #0073d1 !important;
}
[data-loc="client/src/components/Footer.tsx:232"]{
  color: #1a8fd0 !important;
}
@media (max-width: 767px){
  /* body copy: 11.5px -> 13px */
  [data-loc="client/src/components/MissionSection.tsx:125"],
  [data-loc="client/src/components/MissionSection.tsx:140"],
  [data-loc="client/src/components/TeamSection.tsx:248"]{
    font-size: 13px !important;
  }
  /* team bios are clipped to a preview height; keep the same number of lines */
  [data-loc="client/src/components/TeamSection.tsx:172"]{
    font-size: 12.5px !important;
    line-height: 1.6 !important;
  }
  /* labels, tags and small buttons: 9.6-11.5px -> 12px */
  [data-loc="client/src/components/HeroSection.tsx:music-control"],
  [data-loc="client/src/components/HeroSection.tsx:590"],
  [data-loc="client/src/components/ProductCarousel.tsx:309"],
  [data-loc="client/src/components/ProductCarousel.tsx:374"],
  [data-loc="client/src/components/MissionSection.tsx:113"],
  [data-loc="client/src/components/TeamSection.tsx:134"],
  [data-loc="client/src/components/TeamSection.tsx:152"],
  [data-loc="client/src/components/TeamSection.tsx:186"],
  [data-loc="client/src/components/TeamSection.tsx:273"],
  [data-loc="client/src/components/CookieConsent.tsx:123"],
  [data-loc="client/src/components/CookieConsent.tsx:174"],
  [data-loc="client/src/components/CookieConsent.tsx:204"]{
    font-size: 12px !important;
  }
  [data-loc="client/src/components/CookieConsent.tsx:136"]{
    font-size: 12.5px !important;
  }
  /* keep Play With Sound and Skip Intro side by side on narrow phones */
  [data-loc="client/src/components/HeroSection.tsx:music-control"],
  [data-loc="client/src/components/HeroSection.tsx:590"]{
    letter-spacing: 0.08em !important;
    padding: 0.6rem 0.8rem !important;
  }
  /* While the intro plays, the centred "Scroll" cue sat on top of the
     Play With Sound / Skip Intro buttons on phones. Hide it only while those
     buttons are on screen; it returns once the intro ends. */
  :has(> [data-loc="client/src/components/HeroSection.tsx:music-control"]) > [data-loc="client/src/components/HeroSection.tsx:863"]{
    display: none !important;
  }
}
@media (max-width: 359px){
  [data-loc="client/src/components/HeroSection.tsx:music-control"],
  [data-loc="client/src/components/HeroSection.tsx:590"]{
    font-size: 10.5px !important;
    letter-spacing: 0.04em !important;
    padding: 0.55rem 0.6rem !important;
  }
}
