/* EYVI HERO / ABOUT — v35 autoplay + smoother About + 220svh */
.eyvi-hero-widget *,
.eyvi-hero-widget *::before,
.eyvi-hero-widget *::after {
  box-sizing: border-box;
}

.eyvi-hero-widget {
  position: relative;
  width: 100%;
  /* Krótsza strefa czytania: 220svh / 2.2 strony scrolla. */
  height: 220vh;
  height: 220svh;
  min-height: 220vh;
  min-height: 220svh;
  padding: 0;
  margin: 0;
  overflow: visible;
  background: #141414;
  color: #f5f3ed;
  font-family: 'Lato', sans-serif;
}

.eyvi-hero-stage {
  --eyvi-claims-opacity: 0;
  --eyvi-claims-offset: 56px;
  --eyvi-claims-push: 0px;
  --eyvi-shade-opacity: 0;

  position: sticky;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100vh;
  height: 100svh;
  min-height: 100vh;
  min-height: 100svh;
  margin: 0;
  padding: 0;
  overflow: hidden;
  isolation: isolate;
  background: #141414;
}

.eyvi-hero-video {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  display: block;
  width: max(100vw, calc(100svh * 16 / 9));
  height: max(100svh, calc(100vw * 9 / 16));
  min-width: 100%;
  min-height: 100%;
  transform: translate(-50%, -50%);
  border: 0;
  background: #141414;
  pointer-events: none;
}

/* ------------------------------------------------------------
   MOBILE HERO VIDEO — pełnoekranowe wideo pionowe/cropped cover
   Film Vimeo jest poziomy, więc na telefonie jest powiększony
   do wysokości viewportu i świadomie przycięty po bokach.
   ------------------------------------------------------------ */
@media (max-width: 767px) {
  .eyvi-hero-widget {
    height: 220dvh;
    min-height: 220dvh;
  }

  .eyvi-hero-stage {
    width: 100vw;
    height: 100dvh;
    min-height: 100dvh;
    margin-left: calc(50% - 50vw);
  }

  .eyvi-hero-video {
    width: max(100vw, calc(100dvh * 16 / 9)) !important;
    height: max(100dvh, calc(100vw * 9 / 16)) !important;
    min-width: max(100vw, calc(100dvh * 16 / 9)) !important;
    min-height: max(100dvh, calc(100vw * 9 / 16)) !important;
    transform: translate3d(-50%, -50%, 0) !important;
  }

  .eyvi-hero-shade {
    width: 100vw;
    height: 100dvh;
  }
}

.eyvi-hero-shade {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  opacity: var(--eyvi-shade-opacity);
  background: linear-gradient(
    180deg,
    rgba(20, 20, 20, 0) 0%,
    rgba(20, 20, 20, 0) 24%,
    rgba(20, 20, 20, .10) 40%,
    rgba(20, 20, 20, .34) 52%,
    rgba(20, 20, 20, .62) 64%,
    rgba(20, 20, 20, .84) 74%,
    #141414 86%
  );
  will-change: opacity;
}

/* MENU */
body.eyvi-hero-entry-clean #eyvi-header .top-menu,
body.eyvi-hero-clean #eyvi-header .top-menu {
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(-110%) !important;
  pointer-events: none !important;
  transition: none !important;
}

body.eyvi-hero-revealed #eyvi-header .top-menu {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
  pointer-events: auto !important;
}

/* CLAIMY */
.eyhc-center {
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  z-index: 30;
  width: min(1280px, calc(100vw - 48px));
  opacity: var(--eyvi-claims-opacity);
  transform: translate(
    -50%,
    calc(-50% + var(--eyvi-claims-offset) - var(--eyvi-claims-push))
  );
  pointer-events: none;
  font-family: 'Lato', sans-serif;
  font-style: normal;
  font-weight: 300;
  color: #f5f3ed;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
  text-align: center;
  will-change: opacity, transform;
}

.eyvi-hero-stage.eyvi-return-claim-lift .eyhc-center {
  animation: eyviReturnClaimLift .82s cubic-bezier(.22, 1, .36, 1) both;
}

@keyframes eyviReturnClaimLift {
  from {
    transform: translate(
      -50%,
      calc(-50% + var(--eyvi-claims-offset) - var(--eyvi-claims-push) + 18px)
    );
  }
  to {
    transform: translate(
      -50%,
      calc(-50% + var(--eyvi-claims-offset) - var(--eyvi-claims-push) - 12px)
    );
  }
}

.eyhc-center__sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.eyhc-center__text {
  position: relative;
  display: inline-block;
  max-width: 100%;
  font-family: 'Lato', sans-serif;
  font-style: normal;
  font-weight: 300;
  font-size: clamp(26px, 5.1vw, 72px);
  line-height: .96;
  letter-spacing: -.045em;
  text-transform: uppercase;
  color: rgba(245, 243, 237, .96);
  white-space: nowrap;
  word-break: normal;
  transition: opacity .06s ease;
  will-change: opacity, transform, filter;
  isolation: isolate;
}

.eyhc-center__label {
  position: relative;
  z-index: 2;
}

.eyhc-center__text::before,
.eyhc-center__text::after {
  content: attr(data-glitch);
  position: absolute;
  inset: 0;
  z-index: 1;
  opacity: 0;
  pointer-events: none;
  color: rgba(245, 243, 237, .96);
  mix-blend-mode: screen;
}

.eyhc-center__text::before {
  color: #40e2eb;
  transform: translate(2px, 0);
}

.eyhc-center__text::after {
  color: #ff3df2;
  transform: translate(-2px, 0);
}

.eyhc-center__text.is-glitching {
  animation: eyhcTextGlitchMain .36s steps(2, end);
}

.eyhc-center__text.is-glitching::before {
  opacity: .9;
  animation: eyhcTextGlitchBefore .36s steps(2, end);
}

.eyhc-center__text.is-glitching::after {
  opacity: .75;
  animation: eyhcTextGlitchAfter .36s steps(2, end);
}

@keyframes eyhcTextGlitchMain {
  0%   { transform: translate(0, 0); filter: none; }
  16%  { transform: translate(-1px, 1px); filter: contrast(1.35); }
  32%  { transform: translate(2px, -1px); filter: contrast(1.8); }
  48%  { transform: translate(-2px, 0); filter: contrast(1.25); }
  68%  { transform: translate(1px, 1px); filter: none; }
  100% { transform: translate(0, 0); filter: none; }
}

@keyframes eyhcTextGlitchBefore {
  0%   { clip-path: inset(0 0 82% 0); transform: translate(2px, -1px); }
  25%  { clip-path: inset(18% 0 58% 0); transform: translate(-3px, 1px); }
  50%  { clip-path: inset(62% 0 18% 0); transform: translate(3px, 0); }
  75%  { clip-path: inset(42% 0 38% 0); transform: translate(-2px, -1px); }
  100% { clip-path: inset(0 0 100% 0); transform: translate(0, 0); }
}

@keyframes eyhcTextGlitchAfter {
  0%   { clip-path: inset(70% 0 8% 0); transform: translate(-2px, 1px); }
  25%  { clip-path: inset(6% 0 76% 0); transform: translate(3px, -1px); }
  50%  { clip-path: inset(36% 0 44% 0); transform: translate(-3px, 0); }
  75%  { clip-path: inset(80% 0 4% 0); transform: translate(2px, 1px); }
  100% { clip-path: inset(0 0 100% 0); transform: translate(0, 0); }
}

@media (min-width: 1500px) {
  .eyhc-center {
    width: min(1440px, calc(100vw - 96px));
  }

  .eyhc-center__text {
    font-size: clamp(48px, 3.9vw, 82px);
  }
}

@media (max-width: 1200px) {
  .eyhc-center {
    width: calc(100vw - 40px);
  }

  .eyhc-center__text {
    font-size: clamp(24px, 4.2vw, 56px);
  }
}

@media (max-width: 900px) {
  .eyhc-center {
    width: calc(100vw - 36px);
  }

  .eyhc-center__text {
    font-size: clamp(28px, 7vw, 56px);
    line-height: .98;
    letter-spacing: -.04em;
    white-space: normal;
    text-wrap: balance;
  }
}

@media (max-width: 767px) {
  .eyhc-center__text {
    font-size: clamp(28px, 10vw, 44px);
  }
}

@media (max-width: 380px) {
  .eyhc-center {
    width: calc(100vw - 28px);
  }

  .eyhc-center__text {
    font-size: clamp(25px, 9vw, 36px);
  }
}

@media (max-height: 620px) and (min-width: 768px) {
  .eyhc-center__text {
    font-size: clamp(26px, 3.4vw, 54px);
  }
}

/* ============================================================
   ISTNIEJĄCY KONTENER ABOUT
   ============================================================ */

#about.eyvi-about-overlap {
  --eyvi-about-reveal: 0;
  --eyvi-about-blend-lift: clamp(180px, 22svh, 280px);

  /* Domyślne wartości reveal copy — gdy hero.js jeszcze nie wystartował,
     tekst pozostaje w starym stanie spoczynkowym (.82 / 40px). */
  --eyvi-about-copy-opacity: .82;
  --eyvi-about-copy-lift: 40px;
  --eyvi-about-copy-base-y: -72px;

  position: relative !important;
  z-index: 4;
  width: 100%;
  height: 547px !important;
  min-height: 547px !important;
  max-height: 547px !important;
  margin-top: -547px !important;
  overflow: visible !important;
  isolation: isolate;
  background: transparent !important;
}

#about.eyvi-about-overlap::before {
  content: "";
  position: absolute;
  top: calc(-1 * var(--eyvi-about-blend-lift));
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    rgba(20, 20, 20, 0) 0%,
    rgba(20, 20, 20, .02) 8%,
    rgba(20, 20, 20, .06) 16%,
    rgba(20, 20, 20, .13) 24%,
    rgba(20, 20, 20, .24) 32%,
    rgba(20, 20, 20, .38) 40%,
    rgba(20, 20, 20, .54) 48%,
    rgba(20, 20, 20, .70) 56%,
    rgba(20, 20, 20, .84) 63%,
    rgba(20, 20, 20, .94) 70%,
    #141414 78%,
    #141414 100%
  );
}

#about.eyvi-about-overlap::after {
  content: "";
  position: absolute;
  top: calc(-1 * var(--eyvi-about-blend-lift));
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(
    ellipse 72% 52% at 50% 58%,
    rgba(20, 20, 20, .30) 0%,
    rgba(20, 20, 20, .17) 42%,
    rgba(20, 20, 20, .05) 62%,
    rgba(20, 20, 20, 0) 82%
  );
}

#about.eyvi-about-overlap > *,
#about.eyvi-about-overlap .e-con-inner {
  position: relative;
  z-index: 1;
  height: 100%;
}

/* Tekst About sterowany scrollem przez hero.js (zmienne reveal).
   Reveal startuje wcześniej — patrz aboutCopyIn w hero.js. */
#about.eyvi-about-overlap .eyvi-copy-soft {
  opacity: var(--eyvi-about-copy-opacity, .82) !important;
  visibility: visible !important;
  transform: translateY(calc(var(--eyvi-about-copy-base-y, -72px) + var(--eyvi-about-copy-lift, 40px))) !important;
  transition: none !important;
  will-change: opacity, transform !important;
}

/* Elementor / motion effects nie mogą ukrywać tekstu w trakcie idle-snapu. */
#about.eyvi-about-overlap .eyvi-copy-soft.elementor-invisible,
#about.eyvi-about-overlap .eyvi-copy-soft .elementor-invisible {
  opacity: var(--eyvi-about-copy-opacity, .82) !important;
  visibility: visible !important;
  transform: translateY(calc(var(--eyvi-about-copy-base-y, -72px) + var(--eyvi-about-copy-lift, 40px))) !important;
  animation: none !important;
}

@media (max-width: 767px) {
  #about.eyvi-about-overlap {
    --eyvi-about-blend-lift: clamp(128px, 18dvh, 196px);
    --eyvi-about-copy-base-y: -42px;
    height: 547px !important;
    min-height: 547px !important;
    max-height: 547px !important;
    margin-top: -547px !important;
  }
}

/* ODSTĘP ABOUT → SHOWREEL */
.eyvi-about-showreel-spacing {
  position: relative;
  z-index: 3;
  display: block;
  width: 100%;
  /* Bufor po About, żeby showreel nie startował natychmiast po puszczeniu scrolla. */
  height: clamp(320px, var(--eyvi-about-read-buffer-desktop, 46svh), 620px);
  min-height: clamp(320px, var(--eyvi-about-read-buffer-desktop, 46svh), 620px);
  background: #141414;
  pointer-events: none;
}

@media (max-width: 767px) {
  .eyvi-about-showreel-spacing {
    height: clamp(220px, var(--eyvi-about-read-buffer-mobile, 34dvh), 420px);
    min-height: clamp(220px, var(--eyvi-about-read-buffer-mobile, 34dvh), 420px);
  }
}



/* v29 AUDIT FIX — bezpieczny powrót na Hero po kliknięciu ikony „do góry”.
   Podczas scrollTo z dołu strony Hero nie może zostać w stanie handoff/pointer-events:none. */
#hero.eyvi-hero-widget[data-eyvi-returning-top="true"],
.eyvi-hero-widget[data-eyvi-returning-top="true"] {
  pointer-events: auto !important;
  z-index: 1 !important;
}

#hero.eyvi-hero-widget[data-eyvi-returning-top="true"] .eyvi-hero-stage,
.eyvi-hero-widget[data-eyvi-returning-top="true"] .eyvi-hero-stage {
  background: #141414 !important;
}

@media (prefers-reduced-motion: reduce) {
  .eyvi-hero-shade,
  .eyhc-center,
  .eyhc-center__text,
  .eyhc-center__text::before,
  .eyhc-center__text::after,
  #about.eyvi-about-overlap .eyvi-copy-soft {
    animation: none !important;
    transition: none !important;
  }

  .eyhc-center__text::before,
  .eyhc-center__text::after {
    opacity: 0 !important;
  }

  /* Reduced motion: tekst About w pełni czytelny, bez animowanego reveal. */
  #about.eyvi-about-overlap .eyvi-copy-soft {
    opacity: 1 !important;
    transform: translateY(var(--eyvi-about-copy-base-y, -72px)) !important;
  }
}

/* ============================================================
   FIX HERO FREE SCROLL — zgodne z globalnym snapem
   ============================================================ */

#hero.eyvi-hero-widget,
.eyvi-hero-widget {
  height: 220vh !important;
  height: 220svh !important;
  min-height: 220vh !important;
  min-height: 220svh !important;
  overflow: visible !important;
  scroll-snap-align: start;
}

#hero [data-eyvi-hero-stage],
#hero .eyvi-hero-stage,
.eyvi-hero-stage {
  position: sticky !important;
  top: 0 !important;
  height: 100vh !important;
  height: 100svh !important;
  min-height: 100vh !important;
  min-height: 100svh !important;
  overflow: hidden !important;
}

#hero[data-eyvi-free-scroll="true"],
#hero[data-eyvi-long-scroll="true"] {
  overscroll-behavior: auto;
}

@media (max-width: 767px) {
  #hero.eyvi-hero-widget,
  .eyvi-hero-widget {
    height: 220dvh !important;
    min-height: 220dvh !important;
  }

  #hero [data-eyvi-hero-stage],
  #hero .eyvi-hero-stage,
  .eyvi-hero-stage {
    height: 100dvh !important;
    min-height: 100dvh !important;
  }
}

/* ─────────────────────────────────────────────
   EYVI HERO / ABOUT — v35 AUTOPLAY / SMOOTHER HANDOFF / 220SVH
   Cel:
   - film Hero nie przebija pod tekstem About,
   - About dostaje pełniejsze krycie zanim copy osiągnie pełną widoczność,
   - overlap jest minimalnie mniej agresywny niż -547px,
   - cinematic look Hero zostaje zachowany,
   - brak stałego zmniejszania wideo.
   Wklejony jako część pełnego CSS.
───────────────────────────────────────────── */

/* 1. Sticky Hero ma dodatkowy handoff-scrim sterowany z JS.
   Warstwa leży nad wideo i zwykłym shade, ale pod claimem. */
.eyvi-hero-stage {
  --eyvi-hero-handoff-opacity: 0;
}

.eyvi-hero-stage::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  opacity: var(--eyvi-hero-handoff-opacity, 0);
  background: linear-gradient(
    180deg,
    rgba(20, 20, 20, 0) 0%,
    rgba(20, 20, 20, .04) 12%,
    rgba(20, 20, 20, .16) 28%,
    rgba(20, 20, 20, .42) 45%,
    rgba(20, 20, 20, .72) 62%,
    rgba(20, 20, 20, .92) 76%,
    #141414 90%,
    #141414 100%
  );
  will-change: opacity;
}

/* 2. Hero shade wygasza film trochę wcześniej i pełniej.
   To nadal jest gradient, nie czarna plansza. */
.eyvi-hero-shade {
  background: linear-gradient(
    180deg,
    rgba(20, 20, 20, 0) 0%,
    rgba(20, 20, 20, 0) 14%,
    rgba(20, 20, 20, .08) 28%,
    rgba(20, 20, 20, .24) 42%,
    rgba(20, 20, 20, .50) 56%,
    rgba(20, 20, 20, .76) 70%,
    rgba(20, 20, 20, .94) 84%,
    #141414 96%,
    #141414 100%
  ) !important;
}

/* 3. About: nie zmieniamy wysokości sekcji.
   Zmniejszamy tylko agresywność overlapu, żeby gradient miał gdzie pracować.
   Było: margin-top:-547px. Teraz About nadal nachodzi na Hero, ale nie całym
   swoim wymiarem naraz. */
#about.eyvi-about-overlap {
  --eyvi-about-overlap: clamp(468px, 58svh, 512px);
  --eyvi-about-blend-lift: clamp(180px, 22svh, 280px);
  --eyvi-about-cover-opacity: 1;
  --eyvi-about-bg-opacity: 1;
  --eyvi-about-radial-opacity: 1;

  z-index: 8 !important;
  margin-top: calc(-1 * var(--eyvi-about-overlap)) !important;
  background:
    linear-gradient(
      180deg,
      rgba(20, 20, 20, 0) 0,
      rgba(20, 20, 20, var(--eyvi-about-bg-opacity, 1)) 54px,
      rgba(20, 20, 20, var(--eyvi-about-bg-opacity, 1)) 100%
    ) !important;
}

/* 4. Główne krycie About.
   Kluczowa zmiana: pełne #141414 pojawia się dużo wcześniej w warstwie,
   więc tekst nie leży już na materiale wideo. */
#about.eyvi-about-overlap::before {
  top: calc(-1 * var(--eyvi-about-blend-lift)) !important;
  bottom: 0 !important;
  z-index: 0 !important;
  opacity: var(--eyvi-about-cover-opacity, 1) !important;

  background: linear-gradient(
    180deg,
    rgba(20, 20, 20, 0) 0%,
    rgba(20, 20, 20, .02) 8%,
    rgba(20, 20, 20, .06) 16%,
    rgba(20, 20, 20, .13) 24%,
    rgba(20, 20, 20, .24) 32%,
    rgba(20, 20, 20, .38) 40%,
    rgba(20, 20, 20, .54) 48%,
    rgba(20, 20, 20, .70) 56%,
    rgba(20, 20, 20, .84) 63%,
    rgba(20, 20, 20, .94) 70%,
    #141414 78%,
    #141414 100%
  ) !important;
}

/* 5. Radialne domknięcie środka pod tekstem.
   Nie robi czarnej luki, tylko zagęszcza środek kadru, gdzie znajduje się copy. */
#about.eyvi-about-overlap::after {
  top: calc(-1 * var(--eyvi-about-blend-lift)) !important;
  bottom: 0 !important;
  z-index: 0 !important;
  opacity: var(--eyvi-about-radial-opacity, 1) !important;

  background: radial-gradient(
    ellipse 82% 66% at 50% 54%,
    rgba(20, 20, 20, .58) 0%,
    rgba(20, 20, 20, .42) 34%,
    rgba(20, 20, 20, .20) 58%,
    rgba(20, 20, 20, .06) 78%,
    rgba(20, 20, 20, 0) 94%
  ) !important;
}

/* 6. Treść About zawsze nad overlayami. */
#about.eyvi-about-overlap > *,
#about.eyvi-about-overlap .e-con-inner {
  position: relative !important;
  z-index: 2 !important;
}

#about.eyvi-about-overlap .eyvi-copy-soft,
#about.eyvi-about-overlap .eyvi-copy-soft.elementor-invisible,
#about.eyvi-about-overlap .eyvi-copy-soft .elementor-invisible {
  text-shadow:
    0 2px 12px rgba(0, 0, 0, .30),
    0 12px 36px rgba(0, 0, 0, .24) !important;
}

/* 7. Spacing do Showreela zostaje czarny i stabilny, żeby nie pojawiła się luka. */
.eyvi-about-showreel-spacing {
  --eyvi-about-read-buffer: var(--eyvi-about-read-buffer-desktop, 46svh);
  z-index: 6 !important;
  background: #141414 !important;
}

/* 8. Claim Hero: cień tylko poprawia czytelność na jasnych klatkach wideo. */
.eyhc-center__text {
  text-shadow:
    0 2px 8px rgba(0, 0, 0, .48),
    0 8px 24px rgba(0, 0, 0, .36),
    0 16px 42px rgba(0, 0, 0, .24) !important;
}

.eyhc-center__text::before,
.eyhc-center__text::after {
  text-shadow:
    0 2px 8px rgba(0, 0, 0, .40),
    0 8px 22px rgba(0, 0, 0, .28),
    0 14px 34px rgba(0, 0, 0, .18) !important;
}

/* 9. Mobile: zachowujemy fullscreen/cropped video.
   Nie zmniejszamy filmu; mocniej domykamy gradienty i dajemy bezpieczny overlap. */
@media (max-width: 767px) {
  #about.eyvi-about-overlap {
    --eyvi-about-overlap: clamp(456px, 64dvh, 508px);
    --eyvi-about-blend-lift: clamp(128px, 18dvh, 196px);
    --eyvi-about-copy-base-y: -42px;
    margin-top: calc(-1 * var(--eyvi-about-overlap)) !important;
  }

  #about.eyvi-about-overlap::before {
    background: linear-gradient(
      180deg,
      rgba(20, 20, 20, 0) 0%,
      rgba(20, 20, 20, .02) 8%,
      rgba(20, 20, 20, .06) 16%,
      rgba(20, 20, 20, .13) 24%,
      rgba(20, 20, 20, .24) 32%,
      rgba(20, 20, 20, .38) 40%,
      rgba(20, 20, 20, .54) 48%,
      rgba(20, 20, 20, .70) 56%,
      rgba(20, 20, 20, .84) 64%,
      rgba(20, 20, 20, .94) 70%,
      #141414 76%,
      #141414 100%
    ) !important;
  }

  #about.eyvi-about-overlap::after {
    background: radial-gradient(
      ellipse 92% 72% at 50% 52%,
      rgba(20, 20, 20, .62) 0%,
      rgba(20, 20, 20, .44) 36%,
      rgba(20, 20, 20, .20) 60%,
      rgba(20, 20, 20, .05) 80%,
      rgba(20, 20, 20, 0) 96%
    ) !important;
  }

  .eyvi-hero-stage::after {
    background: linear-gradient(
      180deg,
      rgba(20, 20, 20, 0) 0%,
      rgba(20, 20, 20, .06) 14%,
      rgba(20, 20, 20, .22) 32%,
      rgba(20, 20, 20, .52) 52%,
      rgba(20, 20, 20, .82) 70%,
      #141414 90%,
      #141414 100%
    );
  }

  .eyhc-center__text {
    text-shadow:
      0 2px 10px rgba(0, 0, 0, .54),
      0 9px 26px rgba(0, 0, 0, .38),
      0 18px 44px rgba(0, 0, 0, .25) !important;
  }

  .eyhc-center__text::before,
  .eyhc-center__text::after {
    text-shadow:
      0 2px 10px rgba(0, 0, 0, .44),
      0 9px 24px rgba(0, 0, 0, .30),
      0 16px 38px rgba(0, 0, 0, .20) !important;
  }
}
.eyvi-hero-video {
  object-fit: cover;
  object-position: center center;
}

video.eyvi-hero-video {
  border: 0;
  outline: 0;
  background: #141414;
  pointer-events: none;
}

/* 10. Minimalny fallback — gdyby mimo wszystko konkretny materiał wideo był
   zbyt jasny w dolnej części kadru, odkomentuj TYLKO ten blok.
   Nie jest aktywny domyślnie, bo najpierw naprawiamy gradienty i warstwy. */
/*
.eyvi-hero-video {
  transform: translate(-50%, -50%) scale(.985);
}

@media (max-width: 767px) {
  .eyvi-hero-video {
    transform: translate3d(-50%, -50%, 0) scale(.985) !important;
  }
}
*/



/* ============================================================
   EYVI HERO + ABOUT COPY SOFT — plugin v1.1
   Połączona sekcja About używana bezpośrednio po Hero.
   ============================================================ */

.eyvi-copy-soft {
  max-width: 1040px;
  margin: 0 auto;
  padding: 0 clamp(24px, 5vw, 80px);
  font-family: var(--eyvi-font, 'Lato', sans-serif);
  color: #F5F3ED;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
}

.eyvi-copy-soft p {
  margin: 0;
  font-size: clamp(20px, 2.35vw, 36px);
  line-height: 1.34;
  font-weight: 300;
  letter-spacing: -0.008em;
  color: rgba(245, 243, 237, .82);
}

.eyvi-copy-soft p + p {
  margin-top: clamp(18px, 2.2vw, 32px);
  color: rgba(245, 243, 237, .58);
}

.eyvi-copy-soft .eyvi-copy-word {
  display: inline-block;
  position: relative;
  will-change: transform, opacity, filter, color;
}

.eyvi-copy-soft .eyvi-copy-word.is-key {
  color: rgba(245, 243, 237, .9);
}

.eyvi-copy-soft.is-copy-prepared .eyvi-copy-word {
  opacity: 0;
  transform: translate3d(0, 20px, 0);
  filter: blur(5px);
}

.eyvi-copy-soft.is-copy-animated .eyvi-copy-word {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  filter: blur(0);
}

.eyvi-copy-soft .eyvi-copy-word.is-soft-pulse {
  color: #40E2EB;
  text-shadow: 0 0 14px rgba(64, 226, 235, .22);
  transition: color .42s ease, text-shadow .42s ease;
}

#about.eyvi-about-overlap .eyvi-copy-soft {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

@media (max-width: 767px) {
  .eyvi-copy-soft {
    padding: 0 clamp(20px, 6vw, 32px);
  }

  .eyvi-copy-soft p {
    font-size: clamp(20px, 5.4vw, 30px);
    line-height: 1.38;
    letter-spacing: -0.004em;
  }

  .eyvi-copy-soft p + p {
    margin-top: 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .eyvi-copy-soft.is-copy-prepared .eyvi-copy-word,
  .eyvi-copy-soft .eyvi-copy-word {
    transform: none !important;
    opacity: 1 !important;
    filter: none !important;
    transition: none !important;
  }
}

/* EYVI Plugin v1.2 — Elementor editable scroll height */
.eyvi-hero-widget {
  height: calc(var(--eyvi-hero-scroll-vh, 220) * 1vh) !important;
  height: calc(var(--eyvi-hero-scroll-vh, 220) * 1svh) !important;
  min-height: calc(var(--eyvi-hero-scroll-vh, 220) * 1vh) !important;
  min-height: calc(var(--eyvi-hero-scroll-vh, 220) * 1svh) !important;
}
@media (max-width: 767px) {
  .eyvi-hero-widget {
    height: calc(var(--eyvi-hero-scroll-mobile-vh, var(--eyvi-hero-scroll-vh, 220)) * 1dvh) !important;
    min-height: calc(var(--eyvi-hero-scroll-mobile-vh, var(--eyvi-hero-scroll-vh, 220)) * 1dvh) !important;
  }
}

/* ============================================================
   EYVI plugin v1.3.2 — Elementor font/position controls
   ============================================================ */
.eyvi-hero-widget {
  --eyvi-hero-claim-x: 0px;
  --eyvi-hero-claim-y: 0px;
}

.eyvi-hero-widget .eyhc-center {
  margin-left: var(--eyvi-hero-claim-x, 0px);
  margin-top: var(--eyvi-hero-claim-y, 0px);
}

#about.eyvi-about-overlap {
  --eyvi-about-x: 0px;
  --eyvi-about-y: 0px;
}

#about.eyvi-about-overlap .eyvi-copy-soft {
  text-align: center;
  align-items: center;
  transform: translate3d(var(--eyvi-about-x, 0px), var(--eyvi-about-y, 0px), 0);
}

#about.eyvi-about-overlap .eyvi-copy-soft p {
  width: 100%;
}


/* v1.3.8 — About reading buffer before Showreel.
   Showreel must not pull the user away immediately after About copy appears. */
.eyvi-about-showreel-spacing {
  --eyvi-about-read-buffer: var(--eyvi-about-read-buffer-desktop, 46svh);
  height: clamp(320px, var(--eyvi-about-read-buffer), 620px) !important;
  min-height: clamp(320px, var(--eyvi-about-read-buffer), 620px) !important;
  background: #141414 !important;
}

@media (max-width: 767px) {
  .eyvi-about-showreel-spacing {
    --eyvi-about-read-buffer: var(--eyvi-about-read-buffer-mobile, 34dvh);
    height: clamp(220px, var(--eyvi-about-read-buffer), 420px) !important;
    min-height: clamp(220px, var(--eyvi-about-read-buffer), 420px) !important;
  }
}