.elementor-1214 .elementor-element.elementor-element-5cfb1718{--display:flex;--min-height:100vh;}.elementor-1214 .elementor-element.elementor-element-5cfb1718.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-1214 .elementor-element.elementor-element-4d580d.elementor-element{--flex-grow:0;--flex-shrink:0;}@media(max-width:767px){.elementor-1214 .elementor-element.elementor-element-4d580d{width:var( --container-widget-width, 364px );max-width:364px;--container-widget-width:364px;--container-widget-flex-grow:0;}}@media(min-width:768px){.elementor-1214 .elementor-element.elementor-element-5cfb1718{--width:97.854%;}}/* Start custom CSS for html, class: .elementor-element-4d580d *//* ZÁKLAD SEKCIE */
    .intro-section {
      position: relative;
      width: 100%;
      min-height: 100vh;
      overflow: hidden;
      background-color: #020817; /* keď sa video nenačíta, nebude čierny pás */
    }

    /* SPOLOČNÉ NASTAVENIE PRE VIDEÁ */
    .intro-video {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    /* default: desktop / tablet */
    .intro-desktop {
      display: block;
    }
    .intro-mobile {
      display: none;
    }

    /* mobil – zobrazí sa iba mobilné video */
    @media (max-width: 767px) {
      .intro-desktop {
        display: none;
      }
      .intro-mobile {
        display: block;
      }

      /* na mobile môžeš overlay trochu zdvihnúť vyššie */
      .intro-overlay {
        bottom: 40px;
        padding: 0 16px;
      }
    }

    /* OVERLAY FORMULÁR NA VIDEU – FINÁLNY DIZAJN */

    .intro-overlay {
      position: absolute;
      left: 0;
      right: 0;
      bottom: 72px; /* vzdialenosť od spodku videa (nad mute tlačidlo) */
      display: flex;
      justify-content: center;
      padding: 0 16px;
      pointer-events: none; /* klikateľná bude len kartička vo vnútri */
      z-index: 2;
    }

    .intro-overlay-card {
      max-width: 560px;
      width: 100%;
      border-radius: 20px;
      padding: 18px 18px 16px;
      background: radial-gradient(
        circle at 0% 0%,
        rgba(2, 125, 252, 0.22),
        rgba(2, 7, 21, 0.97) 65%
      );
      border: 1px solid rgba(2, 125, 252, 0.42);
      box-shadow: 0 0 32px rgba(0, 0, 0, 0.88), 0 0 30px rgba(2, 125, 252, 0.38);
      text-align: center;
      color: #f5f7ff;
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
      pointer-events: auto; /* toto je klikateľné */
    }

    /* menší, jemný text ako v pôvodnom formulári */
    .intro-overlay-card h2 {
      font-size: 14px;
      line-height: 1.6;
      margin: 0 0 12px;
      font-weight: 400;
      color: rgba(224, 231, 255, 0.82);
    }

    .intro-overlay-form {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      row-gap: 10px;
      column-gap: 0;
      margin: 0;
    }

    .intro-overlay-input-wrap {
      flex: 1 1 auto;
      min-width: 0;
    }

    .intro-overlay-input {
      width: 100%;
      border-radius: 999px;
      border: 1px solid rgba(2, 125, 252, 0.6);
      background: rgba(3, 9, 29, 0.9);
      padding: 10px 16px;
      font-size: 13px;
      color: #f5f7ff;
      outline: none;
      box-shadow: 0 0 0 1px rgba(5, 21, 56, 0.85);
      transition: border-color 0.2s ease, box-shadow 0.2s ease,
        background 0.2s ease;
    }

    .intro-overlay-input::placeholder {
      color: rgba(174, 195, 239, 0.7);
    }

    .intro-overlay-input:focus {
      border-color: #027dfc;
      background: rgba(5, 14, 40, 0.98);
      box-shadow: 0 0 0 1px rgba(2, 125, 252, 0.62),
        0 0 18px rgba(2, 125, 252, 0.5);
    }

    .intro-overlay-submit {
      width: 100%;
    }

    /* silnejší glow na CTA, ako v pôvodnom formulári */
    .intro-overlay-submit button {
      width: 100%;
      padding: 10px 22px;
      font-size: 11px;
      letter-spacing: 0.17em;
      text-transform: uppercase;
      border-radius: 999px;
      border: 1px solid #027dfc;
      background: rgba(0, 0, 0, 0.35);
      color: #ffffff;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      box-shadow: 0 0 20px rgba(2, 125, 252, 0.6),
        0 0 40px rgba(2, 125, 252, 0.35);
      transition: background 0.2s ease, transform 0.15s ease,
        box-shadow 0.2s ease;
    }

    .intro-overlay-submit button:hover {
      background: rgba(2, 125, 252, 0.18);
      box-shadow: 0 0 24px rgba(2, 125, 252, 0.75),
        0 0 46px rgba(2, 125, 252, 0.4);
      transform: translateY(-1px);
    }


    /* Desktop: input + button vedľa seba */
    @media (min-width: 768px) {
      .intro-overlay {
        bottom: 56px;
        padding: 0 24px;
      }

      .intro-overlay-card {
        padding: 18px 24px 16px;
      }

      .intro-overlay-form {
        flex-direction: row;
        align-items: center;
        row-gap: 0;
        column-gap: 10px;
      }

      .intro-overlay-submit {
        width: auto;
        flex: 0 0 auto;
      }

      .intro-overlay-submit button {
        width: auto;
      }
    }

    /* MUTE IKONKA */
 #intro-section .intro-controls{
  left: auto !important;
  right: 20px !important;
  bottom: 80px !important;
  z-index: 6;
}


    
    /* BACK / SPÄŤ TLAČIDLO */
.intro-back {
  position: absolute;
  right: 20px;
  bottom: 24px;
  z-index: 3;
}

.intro-back a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #e8efff;
  text-decoration: none;
  border-radius: 999px;
  border: 1px solid rgba(2, 125, 252, 0.55);
  background: rgba(0, 0, 0, 0.35);
  box-shadow:
    0 0 14px rgba(2, 125, 252, 0.45),
    0 0 28px rgba(2, 125, 252, 0.25);
  backdrop-filter: blur(10px);
  transition:
    background 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.15s ease;
}

.intro-back a:hover {
  background: rgba(2, 125, 252, 0.18);
  box-shadow:
    0 0 18px rgba(2, 125, 252, 0.7),
    0 0 36px rgba(2, 125, 252, 0.4);
  transform: translateY(-1px);
}


    .illariy-mute {
      cursor: pointer;
    }

    .illariy-mute svg {
      filter: drop-shadow(0 0 6px rgba(2, 125, 252, 0.85));
      opacity: 0.7;
      transition: opacity 0.2s ease, filter 0.2s ease;
    }

    .illariy-mute.is-unmuted svg {
      opacity: 1;
      filter: drop-shadow(0 0 10px rgba(2, 125, 252, 1));
    }

    .illariy-mute.is-muted svg {
      opacity: 0.45;
      filter: drop-shadow(0 0 3px rgba(2, 125, 252, 0.4));
    }

    /* prepínanie ikon mute / sound */
    .icon-sound {
      display: none;
    }
    .illariy-mute.is-unmuted .icon-sound {
      display: inline;
    }
    .illariy-mute.is-unmuted .icon-muted {
      display: none;
    }
 /* =========================
   MUTE / UNMUTE = rovnaký štýl ako SPÄŤ
   ========================= */

/* pozícia: nad SPÄŤ */
#intro-section .intro-controls{
  position: absolute;
  left: auto !important;
  right: 10px !important;
  bottom: 70px !important; /* dolaď podľa výšky */
  z-index: 20 !important;
}

/* klikateľný pill ako SPÄŤ */
#intro-section .illariy-mute{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 14px;             /* väčší „touch target“ */
  border-radius: 999px;
  border: 1px solid rgba(2, 125, 252, 0.55);
  background: rgba(0, 0, 0, 0.35);
  box-shadow:
    0 0 14px rgba(2, 125, 252, 0.45),
    0 0 28px rgba(2, 125, 252, 0.25);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  cursor: pointer;
  transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}

#intro-section .illariy-mute:hover{
  background: rgba(2, 125, 252, 0.18);
  box-shadow:
    0 0 18px rgba(2, 125, 252, 0.7),
    0 0 36px rgba(2, 125, 252, 0.4);
  transform: translateY(-1px);
}

/* ikonka väčšia + biela (prepíše aj inline stroke v SVG) */
#intro-section .illariy-mute svg{
  width: 20px;
  height: 20px;
}

#intro-section .illariy-mute svg,
#intro-section .illariy-mute svg *{
  stroke: #ffffff !important;
  opacity: 1 !important;
  filter: drop-shadow(0 0 10px rgba(255,255,255,0.35));
}

/* nech muted nie je “vyblednuté” – musí byť vždy čitateľné */
#intro-section .illariy-mute.is-muted svg,
#intro-section .illariy-mute.is-muted svg *{
  opacity: 1 !important;
  filter: drop-shadow(0 0 10px rgba(255,255,255,0.25));
}/* End custom CSS */