/* ============================================================
   LUXCIS V26 — ISOLATED HERO VIDEO PATCH
   Scope: hero area only. Existing styles.css remains untouched.
   ============================================================ */

/* Desktop cinematic layer covers the old Cardiff/Tesla hero artwork only. */
.luxcis-hero-video-desktop{
  position:absolute;
  inset:0 0 auto 0;
  width:100%;
  height:41.5%;
  z-index:1;
  overflow:hidden;
  background:#030303;
  pointer-events:none;
}
.luxcis-hero-video-desktop video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 51%;
}
.luxcis-hero-video-shade{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(0,0,0,.80) 0%,rgba(0,0,0,.58) 26%,rgba(0,0,0,.16) 54%,rgba(0,0,0,.05) 100%),
    linear-gradient(180deg,rgba(0,0,0,.10) 0%,rgba(0,0,0,.02) 63%,rgba(0,0,0,.92) 100%);
}

/* Rebuild only the desktop hero copy that was baked into the old background image. */
.luxcis-hero-ui-desktop{
  position:absolute;
  left:1.65%;
  top:1.55%;
  width:35.5%;
  height:31.5%;
  z-index:15;
  pointer-events:none;
}
.luxcis-hero-ui-desktop img{
  display:block;
  width:72%;
  max-width:390px;
  height:auto;
}
.luxcis-hero-ui-desktop h1{
  margin:7.3% 0 0;
  color:#fff;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(28px,3.05vw,50px);
  font-weight:500;
  line-height:1.04;
  letter-spacing:-.025em;
  text-shadow:0 4px 22px rgba(0,0,0,.88);
}
.luxcis-hero-ui-desktop h1 span{color:#f1c455}
.luxcis-hero-ui-desktop p{
  margin:3.8% 0 0;
  color:#f0f0f0;
  font-size:clamp(11px,1.05vw,17px);
  line-height:1.42;
  text-shadow:0 3px 16px rgba(0,0,0,.95);
}

/* Existing invisible hero actions become visible because the old baked buttons are now hidden. */
@media(min-width:701px){
  .stage>.top-nav,
  .stage>.phone,
  .stage>.whatsapp,
  .stage>.hero-quote,
  .stage>.hero-services,
  .stage>.hero-fleet-link,
  .stage>.luxcis-review-strip-desktop{z-index:30!important}

  .hero-quote,
  .hero-services{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:6px!important;
    font-size:clamp(10px,.91vw,14px)!important;
    font-weight:600!important;
    text-transform:uppercase!important;
    text-decoration:none!important;
    letter-spacing:0!important;
  }
  .hero-quote{
    border:1px solid #e0a51e!important;
    background:linear-gradient(135deg,#f1c455,#c98f16)!important;
    color:#070707!important;
  }
  .hero-quote::after{content:"GET INSTANT QUOTE   →"}
  .hero-services{
    border:1px solid #d99a00!important;
    background:rgba(0,0,0,.84)!important;
    color:#fff!important;
  }
  .hero-services::after{content:"OUR SERVICES   →"}

  /* Phone / WhatsApp were also baked into the old picture; render their real links cleanly. */
  .stage>.phone,
  .stage>.whatsapp{
    left:auto!important;
    right:1.7%!important;
    width:13.4%!important;
    min-width:168px!important;
    height:3.45%!important;
    display:flex!important;
    align-items:center!important;
    padding:0 13px!important;
    border:1px solid rgba(216,167,45,.78)!important;
    border-radius:6px!important;
    background:rgba(3,3,3,.83)!important;
    color:#fff!important;
    text-decoration:none!important;
    font-size:clamp(10px,.86vw,14px)!important;
    backdrop-filter:blur(8px);
  }
  .stage>.phone{top:1.3%!important;color:#f1c455!important}
  .stage>.phone::before{content:"☎  07341 923368"}
  .stage>.whatsapp{top:4.95%!important}
  .stage>.whatsapp::before{content:"◉  WhatsApp"}
}

/* Mobile: use the same video, but crop around chauffeur/car and reduce the logo obstruction. */
.luxcis-hero-video-mobile,
.luxcis-mobile-video-shade{display:none}

@media(max-width:700px){
  .luxcis-hero-video-desktop,
  .luxcis-hero-ui-desktop{display:none!important}

  .mobile-hero{
    background:#000!important;
    isolation:isolate;
  }
  .luxcis-hero-video-mobile{
    display:block;
    position:absolute;
    z-index:0;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:69% center;
    pointer-events:none;
  }
  .luxcis-mobile-video-shade{
    display:block;
    position:absolute;
    z-index:1;
    inset:0;
    pointer-events:none;
    background:
      linear-gradient(180deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,.08) 28%,rgba(0,0,0,.20) 52%,rgba(0,0,0,.94) 80%,#000 100%),
      linear-gradient(90deg,rgba(0,0,0,.24),rgba(0,0,0,.02) 70%);
  }
  .mobile-logo{
    z-index:3!important;
    width:min(225px,61vw)!important;
    margin:14px 0 0 8px!important;
    filter:drop-shadow(0 4px 14px rgba(0,0,0,.82));
  }
  .mobile-hero-copy{
    z-index:3!important;
    left:18px!important;
    right:18px!important;
    bottom:28px!important;
  }
  .mobile-hero-copy h1{
    font-size:clamp(34px,10.5vw,52px)!important;
    line-height:1.01!important;
    text-shadow:0 4px 20px #000!important;
  }
  .mobile-hero-copy p{
    max-width:94%!important;
    font-size:14px!important;
    line-height:1.45!important;
  }
  .luxcis-review-strip-mobile{position:relative;z-index:4}
}

@media(max-width:430px){
  .luxcis-hero-video-mobile{object-position:72% center}
  .mobile-logo{width:min(205px,58vw)!important;margin-top:10px!important}
  .mobile-hero-copy h1{font-size:clamp(32px,10vw,45px)!important}
}

/* Accessibility/performance fallback. */
@media(prefers-reduced-motion:reduce){
  .luxcis-hero-video-desktop video,
  .luxcis-hero-video-mobile{display:none!important}
  .luxcis-hero-video-desktop{background:url("assets/luxcis-airport-hero-v25-poster.jpg") center/cover no-repeat}
  @media(max-width:700px){.mobile-hero{background:url("assets/luxcis-airport-hero-v25-poster.jpg") 70% center/cover no-repeat!important}}
}

/* ============================================================
   V26 POLISH — visual alignment only. No site sections touched.
   ============================================================ */
@media(min-width:701px){
  /* Transparent logo: no black rectangle, blends directly into moving hero. */
  .luxcis-hero-ui-desktop img{
    width:68%!important;
    max-width:360px!important;
    background:transparent!important;
    filter:drop-shadow(0 4px 16px rgba(0,0,0,.72));
  }

  /* Restore the exact three-button rhythm: same Y, same height, 1% gaps. */
  .hero-fleet-link{
    left:35%!important;
    top:33.8990%!important;
    width:15%!important;
    height:4.7%!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    border-radius:6px!important;
    box-sizing:border-box!important;
    gap:16px!important;
    font-size:clamp(10px,.91vw,14px)!important;
    font-weight:600!important;
  }
  .hero-fleet-link span{
    font-size:1.35em!important;
    transform:none!important;
  }

  /* Preserve a clean breathing gap between action row and review strip. */
  .luxcis-review-strip-desktop{
    top:39.25%!important;
  }
}

@media(max-width:700px){
  /* Transparent, deliberately restrained mobile logo so it never dominates the scene. */
  .mobile-logo{
    width:min(180px,48vw)!important;
    margin:10px 0 0 10px!important;
    background:transparent!important;
    filter:drop-shadow(0 3px 12px rgba(0,0,0,.85));
  }
}
@media(max-width:430px){
  .mobile-logo{
    width:min(165px,45vw)!important;
    margin:8px 0 0 8px!important;
  }
}

/* ============================================================
   V27 FINAL POLISH — ONLY requested visual corrections
   1) Desktop Google/Trustpilot strip lower
   2) Mobile video brighter/more visible
   3) Mobile LUXCIS logo larger
   No booking/fleet/services/site logic touched.
   ============================================================ */

@media(min-width:701px){
  /* Move the Google + Trustpilot panel substantially lower (~3 cm visually
     on a typical desktop display), while keeping the action buttons untouched. */
  .luxcis-review-strip-desktop{
    top:47.0%!important;
  }
}

@media(max-width:700px){
  /* Give the moving airport scene more visual presence. */
  .luxcis-hero-video-mobile{
    object-position:64% center!important;
    filter:brightness(1.10) contrast(1.03)!important;
  }

  /* Lighter treatment through the upper/middle frame; retain darkness only
     where the text needs legibility near the bottom. */
  .luxcis-mobile-video-shade{
    background:
      linear-gradient(180deg,
        rgba(0,0,0,.14) 0%,
        rgba(0,0,0,.03) 30%,
        rgba(0,0,0,.08) 52%,
        rgba(0,0,0,.56) 74%,
        rgba(0,0,0,.92) 91%,
        #000 100%),
      linear-gradient(90deg,rgba(0,0,0,.10),rgba(0,0,0,0) 72%)!important;
  }

  /* Bigger transparent logo, still clear of the main subject. */
  .mobile-logo{
    width:min(270px,72vw)!important;
    margin:12px 0 0 12px!important;
  }
}

@media(max-width:430px){
  .luxcis-hero-video-mobile{
    object-position:66% center!important;
  }
  .mobile-logo{
    width:min(245px,68vw)!important;
    margin:10px 0 0 10px!important;
  }
}

/* V28 micro-adjustments requested 2026-09-04 — ONLY review strip + mobile logo */
@media(min-width:701px){
  .luxcis-review-strip-desktop{top:43.0%!important;}
}
@media(max-width:700px){
  .mobile-logo{width:min(305px,80vw)!important;margin:12px 0 0 12px!important;}
}
@media(max-width:430px){
  .mobile-logo{width:min(285px,78vw)!important;margin:10px 0 0 10px!important;}
}

/* V29 micro-adjustments — ONLY requested changes */
@media(min-width:701px){
  /* Raise Google + Trustpilot approx. another 1 cm from V28. */
  .luxcis-review-strip-desktop{top:41.7%!important;}
}
@media(max-width:700px){
  /* Nudge the larger mobile logo slightly to the right. */
  .mobile-logo{margin-left:20px!important;}
}
@media(max-width:430px){
  .mobile-logo{margin-left:18px!important;}
}

/* V30 desktop micro-fix — ONLY requested desktop corrections.
   Mobile rules remain exactly as in V29. */
@media(min-width:701px){
  /* Extend the moving hero layer down to the booking panel so the retired
     Cardiff/Tesla artwork can no longer bleed through below the video. */
  .luxcis-hero-video-desktop{
    height:46.5%!important;
  }

  /* Centre Google + Trustpilot visually in the breathing space between
     the CTA row and the booking/search panel. */
  .luxcis-review-strip-desktop{
    top:40.2%!important;
  }

  /* WhatsApp label only: brand-green text, no layout/size changes. */
  .stage>.whatsapp,
  .stage>.whatsapp::before{
    color:#25D366!important;
  }
}

/* V32 corrective micro-fix: V31 booking transform fully removed.
   Keep the booking/search geometry exactly as the known-good V30.
   Only create ~0.5 cm extra breathing room above the booking frame by
   ending the desktop video slightly earlier; no booking controls move. */
@media(min-width:701px){
  .luxcis-hero-video-desktop{height:45.75%!important;}
}