/* Homepage-only visual correction; catalogue and shared pages are unchanged. */
[data-page="home-v4"] { --home-canvas:#f4f4f2; background:var(--home-canvas); }
[data-page="home-v4"] .wrapper,[data-page="home-v4"] .content { background:var(--home-canvas); }
[data-page="home-v4"] .container { max-width:1600px; }
[data-page="home-v4"] .home-v4-shell { padding-top:12px; padding-bottom:0; }
[data-page="home-v4"] .home-v4-hero__card { min-height:510px; display:grid; grid-template-columns:.88fr 1.12fr; gap:24px; padding:40px; border-radius:28px; background:#101112; }
[data-page="home-v4"] .home-v4-hero__copy { max-width:none; text-shadow:none; }
[data-page="home-v4"] .home-v4-hero__copy h1 { font-size:clamp(42px,5.1vw,76px); line-height:1; letter-spacing:-.055em; }
[data-page="home-v4"] .home-v4-hero__copy p { font-size:18px; font-weight:400; text-shadow:none; }
[data-page="home-v4"] .home-v4-hero__mat { position:static; width:116%; height:510px; margin:-20px -8%; max-height:none; max-width:none; object-fit:contain; object-position:center; filter:drop-shadow(0 22px 28px rgba(0,0,0,.42)); }
[data-page="home-v4"] .home-v4-rotator { display:inline-block; min-width:10.5ch; color:var(--v4-red); }
[data-page="home-v4"] .home-v4-rotator > span { display:block; transition:opacity .18s ease,transform .18s ease; }
[data-page="home-v4"] .home-v4-rotator.is-changing > span { opacity:0; transform:translateY(-5px); }
[data-page="home-v4"] .home-v4-vehicle-selector { margin:8px 0 0; padding:20px 24px; box-shadow:none; border-radius:24px; }
[data-page="home-v4"] .home-v4-vehicle-selector__heading { margin-bottom:14px; }
[data-page="home-v4"] :is(.advantages,.home-v4-products,.video-reviews,.home-v4-about,.home-v4-comparison,.v4-articles,.v4-instagram,.v4-faq,.v4-reviews) { padding-top:56px; padding-bottom:16px; background:var(--home-canvas); }
[data-page="home-v4"] :is(.home-v4-products__header h2,.video-reviews__title,.advantages .section__title) { font-size:clamp(32px,3.8vw,54px); line-height:1.06; letter-spacing:-.045em; }
[data-page="home-v4"] .home-v4-products__header { margin-bottom:24px; }
[data-page="home-v4"] .home-v4-products__tabs { padding:5px; gap:5px; background:#e7e7e3; border-radius:15px; }
[data-page="home-v4"] .home-v4-products__tabs button { border:0; background:transparent; box-shadow:none; }
[data-page="home-v4"] .home-v4-products__tabs button[aria-selected="true"] { background:#151515; color:#fff; border-color:#151515; box-shadow:none; }
[data-page="home-v4"] .home-v4-product-card { border-radius:24px; box-shadow:none; }
[data-page="home-v4"] .home-v4-products__more-title { margin:32px 0 16px; }
[data-page="home-v4"] .home-v4-products__secondary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
[data-page="home-v4"] .home-v4-secondary-card { display:grid; grid-template-columns:1fr 1fr; align-items:stretch; height:auto; min-height:230px; padding:16px; gap:20px; border:1px solid #e0e0dc; border-radius:24px; background:white; box-shadow:none; }
[data-page="home-v4"] .home-v4-secondary-card > div { display:flex; flex-direction:column; justify-content:center; align-items:flex-start; max-width:none; padding:12px; }
[data-page="home-v4"] .home-v4-secondary-card h4 { font-size:26px; }
[data-page="home-v4"] .home-v4-secondary-card p { font-size:16px; line-height:1.45; margin:10px 0 18px; }
[data-page="home-v4"] .home-v4-secondary-card a { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 18px; font-size:14px; border-radius:10px; }
[data-page="home-v4"] .home-v4-secondary-card img { position:static; width:100%; height:220px; max-width:100%; object-fit:cover; border-radius:16px; align-self:center; }
[data-page="home-v4"] :is(button,a,select):focus-visible { outline:3px solid #e11d1d; outline-offset:4px; }
@media(max-width:899px) {
 [data-page="home-v4"] .site-header-v4 .about-info { min-height:64px; padding:8px 0; gap:12px; }
 [data-page="home-v4"] .site-header-v4 .logo__image { width:130px; }
 [data-page="home-v4"] .site-header-v4 > .container { padding:0 16px; }
 [data-page="home-v4"] .home-v4-header__actions { gap:8px; margin-left:auto; }
 [data-page="home-v4"] .home-v4-header__burger { width:44px; height:44px; border-radius:12px; }
 [data-page="home-v4"] .home-v4-shell { padding:8px 12px 0; }
 [data-page="home-v4"] .home-v4-hero__card { display:flex; flex-direction:column; align-items:stretch; gap:12px; min-height:0; padding:22px 20px 14px; border-radius:24px; }
 [data-page="home-v4"] .home-v4-hero__copy h1 { font-size:clamp(31px,8.3vw,37px); line-height:1; letter-spacing:-.05em; }
 [data-page="home-v4"] .home-v4-hero__copy p { max-width:none; margin:10px 0 0; font-size:16px; line-height:1.3; }
 [data-page="home-v4"] .home-v4-hero__copy p br { display:none; }
 [data-page="home-v4"] .home-v4-hero__copy p br::after { content:' '; }
 [data-page="home-v4"] .home-v4-hero__mat { position:static; width:112%; height:250px; margin:-8px -6% -2px; max-width:none; max-height:none; object-fit:contain; object-position:center; }
 [data-page="home-v4"] .home-v4-vehicle-selector { padding:16px; margin:8px 0 0; border-radius:22px; }
 [data-page="home-v4"] .home-v4-vehicle-selector__heading { margin-bottom:12px; font-size:22px; line-height:1.1; }
 [data-page="home-v4"] .home-v4-vehicle-selector__fields { grid-template-columns:1fr 1fr; gap:8px; }
 [data-page="home-v4"] .home-v4-vehicle-selector select { height:48px; font-size:16px; padding:0 10px; }
 [data-page="home-v4"] .home-v4-vehicle-selector label:nth-child(3) { grid-column:1/-1; }
 [data-page="home-v4"] .home-v4-vehicle-selector button { grid-column:1/-1; min-height:50px; margin:0; font-size:14px; }
 [data-page="home-v4"] :is(.advantages,.home-v4-products,.video-reviews,.home-v4-about,.home-v4-comparison,.v4-articles,.v4-instagram,.v4-faq,.v4-reviews) { padding-top:40px; padding-bottom:8px; }
 [data-page="home-v4"] .home-v4-products .container { padding:0 16px; }
 [data-page="home-v4"] .home-v4-products__header { margin-bottom:18px; }
 [data-page="home-v4"] .home-v4-products__header p { font-size:16px; }
 [data-page="home-v4"] .home-v4-products__tabs { margin-bottom:10px; }
 [data-page="home-v4"] .home-v4-products__tabs button { min-height:46px; font-size:16px; }
 [data-page="home-v4"] .home-v4-product-card--mobile { min-height:0; padding:14px 16px 18px; text-align:left; }
 [data-page="home-v4"] .home-v4-product-card--mobile .home-v4-product-card__stage { height:220px; flex-basis:220px; padding:8px; background:#f4f4f2; }
 [data-page="home-v4"] .home-v4-product-card--mobile .home-v4-product-card__stage img { filter:none; }
 [data-page="home-v4"] .home-v4-product-card--mobile h3 { margin-top:18px; font-size:26px; }
 [data-page="home-v4"] .home-v4-product-card--mobile p { margin:8px 0 16px; font-size:16px; line-height:1.4; }
 [data-page="home-v4"] .home-v4-product-card--mobile .home-v4-product-card__cta { text-align:center; min-height:48px; }
 [data-page="home-v4"] .home-v4-products__secondary { grid-template-columns:1fr; gap:12px; }
 [data-page="home-v4"] .home-v4-secondary-card { grid-template-columns:1fr 1fr; min-height:180px; padding:12px; gap:12px; border-radius:22px; }
 [data-page="home-v4"] .home-v4-secondary-card > div { padding:4px; }
 [data-page="home-v4"] .home-v4-secondary-card h4 { font-size:22px; }
 [data-page="home-v4"] .home-v4-secondary-card p { font-size:14px; margin:8px 0 12px; }
 [data-page="home-v4"] .home-v4-secondary-card img { height:165px; border-radius:14px; }
 [data-page="home-v4"] .video-reviews__title { text-align:left; margin-bottom:20px; }
 [data-page="home-v4"] .home-v4-about .advantages-2__left-inner { height:470px; }
 [data-page="home-v4"] .home-v4-about .heading-secondary { font-size:38px; }
 [data-page="home-v4"] .home-v4-about .section__header { margin-bottom:24px; }
 [data-page="home-v4"] .home-v4-comparison .comparison__images { height:390px; }
}
@media(prefers-reduced-motion:reduce) { [data-page="home-v4"] .home-v4-rotator > span { transition:none; } }

[data-page="home-v4"] .v4-reviews .v4-section-head h2 { color:#111; }
[data-page="home-v4"] .v4-reviews .v4-section-head span { color:#666; }
@media(max-width:899px) {
 [data-page="home-v4"] .v4-faq h2 { font-size:48px; }
 [data-page="home-v4"] .home-v4-contact h2 { font-size:44px; }
 [data-page="home-v4"] .home-v4-contact__form label { font-size:14px; }
}

/* ========================================================================
   HERO OVERLAY CORRECTION — EVASOTA composition adapted to EVATECH.
   The product image is deliberately full-bleed and sits BEHIND the copy.
   EVATECH content, image asset and vehicle-selector logic remain unchanged.
   ======================================================================== */
[data-page="home-v4"] .home-v4-hero__card {
  position: relative;
  isolation: isolate;
  display: block;
  min-height: clamp(560px, 68vh, 720px);
  overflow: hidden;
  padding: 0;
  border-radius: 28px;
  background:#101112;
}

[data-page="home-v4"] .home-v4-hero__card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 58% 45%, rgba(255,255,255,.045), transparent 35%),
    #101112;
}

[data-page="home-v4"] .home-v4-hero__card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(8,9,10,.94) 0%, rgba(8,9,10,.72) 27%, rgba(8,9,10,.20) 49%, rgba(8,9,10,0) 69%),
    linear-gradient(0deg, rgba(8,9,10,.23) 0%, rgba(8,9,10,0) 40%);
}

[data-page="home-v4"] .home-v4-hero__copy {
  position: absolute;
  left: clamp(30px, 4.2vw, 68px);
  bottom: clamp(34px, 4.2vw, 66px);
  z-index: 3;
  width: min(44%, 620px);
  max-width: 620px;
  text-shadow: 0 3px 20px rgba(0,0,0,.48);
}

[data-page="home-v4"] .home-v4-hero__copy h1 {
  font-size: clamp(48px, 5.35vw, 82px);
  line-height: .94;
  letter-spacing: -.06em;
}

[data-page="home-v4"] .home-v4-hero__copy p {
  max-width: 390px;
  margin-top: 22px;
  color: rgba(255,255,255,.76);
  font-size: clamp(17px, 1.35vw, 20px);
  line-height: 1.32;
  text-shadow: 0 2px 14px rgba(0,0,0,.72);
}

[data-page="home-v4"] .home-v4-hero__mat {
  position: absolute;
  left: 55%;
  top: 50%;
  z-index: 1;
  width: auto;
  /* Match the EVASOTA hero principle: show the complete product artwork.
     The previous 124% height deliberately enlarged the image beyond the
     card and cropped the top/bottom.  Keep a real margin around the mat set. */
  height: calc(100% - 124px);
  max-width: 58%;
  max-height: calc(100% - 124px);
  margin: 0;
  object-fit: contain;
  object-position: center;
  transform: translate(-50%, -50%);
  filter: drop-shadow(0 26px 34px rgba(0,0,0,.46));
  pointer-events: none;
  user-select: none;
}

/* Tablet / mobile: same visual principle as EVASOTA — the mat becomes the
   hero background layer, while the headline stays above it. */
@media (max-width: 899px) {
  [data-page="home-v4"] .home-v4-hero__card {
    display: block;
    min-height: 500px;
    height: 500px;
    padding: 0;
    border-radius: 24px;
  }

  [data-page="home-v4"] .home-v4-hero__card::after {
    background:
      linear-gradient(180deg, rgba(8,9,10,.90) 0%, rgba(8,9,10,.58) 26%, rgba(8,9,10,.12) 50%, rgba(8,9,10,0) 68%),
      linear-gradient(90deg, rgba(8,9,10,.58) 0%, rgba(8,9,10,.08) 58%, rgba(8,9,10,0) 82%);
  }

  [data-page="home-v4"] .home-v4-hero__copy {
    position: absolute;
    top: 24px;
    right: 18px;
    bottom: auto;
    left: 20px;
    z-index: 3;
    width: auto;
    max-width: 310px;
    text-shadow: 0 2px 16px rgba(0,0,0,.60);
  }

  [data-page="home-v4"] .home-v4-hero__copy h1 {
    font-size: clamp(34px, 9.6vw, 42px);
    line-height: .94;
    letter-spacing: -.055em;
  }

  [data-page="home-v4"] .home-v4-hero__copy p {
    max-width: 270px;
    margin-top: 18px;
    color: rgba(255,255,255,.70);
    font-size: 16px;
    line-height: 1.3;
  }

  [data-page="home-v4"] .home-v4-hero__mat {
    position: absolute;
    left: 54%;
    top: 52%;
    width: auto;
    height: 92%;
    max-width: 94%;
    max-height: 92%;
    margin: 0;
    object-fit: contain;
    object-position: center;
    transform: translate(-50%, -50%);
    filter: drop-shadow(0 18px 24px rgba(0,0,0,.40));
  }
}

@media (max-width: 430px) {
  /* Approved mobile hero: ~10% shorter card, product slightly larger and
     deliberately layered behind the copy while remaining fully readable. */
  [data-page="home-v4"] .home-v4-hero__card {
    min-height: 450px;
    height: 450px;
  }

  [data-page="home-v4"] .home-v4-hero__copy {
    top: 22px;
    left: 18px;
    right: 16px;
    max-width: 292px;
  }

  [data-page="home-v4"] .home-v4-hero__copy h1 {
    font-size: clamp(33px, 9.45vw, 39px);
  }

  [data-page="home-v4"] .home-v4-hero__copy p {
    max-width: 260px;
    margin-top: 16px;
    font-size: 15px;
  }

  [data-page="home-v4"] .home-v4-hero__mat {
    left: 52%;
    top: 55%;
    height: 98%;
    max-width: 96%;
    max-height: 98%;
  }
}

@media (max-width: 360px) {
  [data-page="home-v4"] .home-v4-hero__card {
    min-height: 427px;
    height: 427px;
  }

  [data-page="home-v4"] .home-v4-hero__copy h1 {
    font-size: 32px;
  }

  [data-page="home-v4"] .home-v4-hero__mat {
    left: 52%;
    top: 56%;
    height: 98%;
    max-width: 97%;
    max-height: 98%;
  }
}


/* ========================================================================
   DESKTOP LAYOUT CORRECTION V2
   - centers and reduces Video Reviews on desktop
   - constrains the before/after comparison so portrait source photos are not
     excessively cropped by the widened homepage container
   Mobile/tablet rules remain controlled by the existing responsive CSS.
   ======================================================================== */
@media (min-width: 900px) {
  [data-page="home-v4"] .video-reviews__header,
  [data-page="home-v4"] .video-reviews__swiper {
    width: min(100%, 1040px);
    max-width: 1040px;
    margin-right: auto;
    margin-left: auto;
  }

  [data-page="home-v4"] .video-reviews__swiper {
    overflow: hidden;
  }

  [data-page="home-v4"] .video-reviews__card {
    border-radius: 18px;
    box-shadow: 0 10px 24px rgba(20,20,20,.08);
  }

  [data-page="home-v4"] .video-reviews__play {
    width: 56px;
    height: 56px;
  }

  [data-page="home-v4"] .home-v4-comparison .comparison {
    width: min(calc(100% - 48px), 900px);
    max-width: 900px;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0;
    padding-left: 0;
  }

  [data-page="home-v4"] .home-v4-comparison .comparison__header {
    margin-bottom: 34px;
  }

  [data-page="home-v4"] .home-v4-comparison .heading-secondary {
    font-size: clamp(42px, 4.2vw, 62px);
  }

  [data-page="home-v4"] .home-v4-comparison .comparison__head-col-2 {
    width: 76px;
    height: 76px;
    flex-basis: 76px;
    font-size: 22px;
  }

  [data-page="home-v4"] .home-v4-comparison .comparison__body {
    border-radius: 24px;
  }

  [data-page="home-v4"] .home-v4-comparison .comparison__images {
    height: auto;
    aspect-ratio: 4 / 3;
  }

  [data-page="home-v4"] .home-v4-comparison .comparison__image {
    object-position: center 52%;
  }
}

/* Mobile manufacturer image: keep the information panel at the top so it does
   not cover the EVA mat in the lower part of the photo. Desktop is unchanged. */
@media (max-width: 700px) {
  [data-page="home-v4"] .home-v4-about .advantages-2__left-inner {
    align-items: flex-start;
  }
}

/* ========================================================================
   MOBILE HERO FINAL TIGHT-FIT PATCH — 2026-09-13
   Requested changes:
   1) keep the hero card ~10% shorter;
   2) make the mat artwork ~10% smaller than the current QA version;
   3) move the artwork upward and inward/centered;
   4) remove the light side strips around the mobile hero.
   Desktop/tablet >=431px remain unchanged.
   ======================================================================== */
@media (max-width: 430px) {
  /* Remove the 12px mobile shell gutters that were showing as light strips
     on the left/right sides of the black hero card. */
  [data-page="home-v4"] .home-v4-shell {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Keep the already approved ~10% shorter hero. */
  [data-page="home-v4"] .home-v4-hero__card {
    min-height: 450px;
    height: 450px;
  }

  /* Current QA artwork was max-width:96%, height/max-height:98%.
     Reduce by ~10% and center it farther inside the card. */
  [data-page="home-v4"] .home-v4-hero__mat {
    left: 50%;
    top: 52%;
    width: auto;
    height: 88%;
    max-width: 86%;
    max-height: 88%;
    margin: 0;
    object-fit: contain;
    object-position: center;
    transform: translate(-50%, -50%);
  }
}

@media (max-width: 360px) {
  [data-page="home-v4"] .home-v4-hero__card {
    min-height: 427px;
    height: 427px;
  }

  /* Same ~10% artwork reduction on narrow phones. */
  [data-page="home-v4"] .home-v4-hero__mat {
    left: 50%;
    top: 52%;
    height: 88%;
    max-width: 87%;
    max-height: 88%;
  }
}