/* Extracted from sk/references.html; keep this link after site-wide styles. */
/* === Typografia === */
      * {
        --body-font-size: 18px;
        --h1-font-size: 80px;
        --h2-font-size: 64px;
        --h3-font-size: 36px;
        --h4-font-size: 26px;
        --h5-font-size: 22px;
        --h6-font-size: 18px;
      }
      body { font-size: 18px; }
      p { font-size: 18px; }
      p.lead { font-size: 22px; line-height: 1.6; }

      /* Zmenšenie nadpisov na tabletoch a telefónoch */
      @media (max-width: 1199px) {
        * {
          --h1-font-size: 56px;
          --h2-font-size: 44px;
          --h3-font-size: 30px;
          --h4-font-size: 22px;
          --h5-font-size: 20px;
        }
        p.lead { font-size: 20px; }
      }
      @media (max-width: 575px) {
        * {
          --h1-font-size: 40px;
          --h2-font-size: 32px;
          --h3-font-size: 26px;
          --h4-font-size: 20px;
        }
        body { font-size: 17px; }
        p { font-size: 17px; }
        p.lead { font-size: 18px; }
      }

      /* Svetlé fialové pozadie pre body */
      body.dark-scheme {
        background: var(--color-surface-soft) !important;
      }
      header.smaller {
        background: var(--color-text) !important;
      }
      #wrapper {
        background:
          radial-gradient(ellipse 55% 25% at 22% 14%, rgba(140,90,255,0.22) 0%, rgba(180,140,255,0.08) 50%, transparent 85%),
          radial-gradient(ellipse 50% 22% at 78% 30%, rgba(190,150,255,0.18) 0%, rgba(210,180,255,0.06) 55%, transparent 88%),
          radial-gradient(ellipse 55% 25% at 22% 48%, rgba(140,90,255,0.20) 0%, rgba(180,140,255,0.07) 55%, transparent 88%),
          radial-gradient(ellipse 50% 22% at 78% 66%, rgba(190,150,255,0.18) 0%, rgba(210,180,255,0.06) 55%, transparent 88%),
          radial-gradient(ellipse 55% 25% at 22% 84%, rgba(140,90,255,0.16) 0%, transparent 85%),
          var(--color-surface-accent);
      }
      html, body { background: transparent !important; }

      /* === Hero banner — stlmenie tmavých vrstiev pre lepší presvit obrázka === */
      #section-hero .sw-overlay { opacity: 0.35 !important; }
      #section-hero .gradient-edge-top.color { opacity: 0.25 !important; }
      #section-hero .gradient-edge-bottom { opacity: 0.5 !important; }
      #section-hero .abs-centered { top: 60% !important; }
      @media (max-width: 1199px) { #section-hero .abs-centered { top: 55% !important; } }
      #section-hero .hero-subheadline {
        font-size: 3.4rem;
        line-height: 1.15;
        font-weight: 700;
      }
      @media (max-width: 1199px) { #section-hero .hero-subheadline { font-size: 2.2rem; } }

      /* Certifikáty — na mobile sú logá pri max-width:49% príliš malé */
      @media (max-width: 1199px) {
        #section-certificates .row.g-2 img { max-width: 72% !important; }
      }
      @media (max-width: 767px) {
        /* 2 logá vedľa seba namiesto jedného cez celú šírku */
        #section-certificates .row.g-2 > [class*="col-"] { flex: 0 0 50%; max-width: 50%; }
        #section-certificates .row.g-2 img { max-width: 78% !important; }
      }
      @media (max-width: 575px) { #section-hero .hero-subheadline { font-size: 1.5rem; } }

      /* === Štvorcové karty prípadových štúdií === */
      .case-card-sq {
        position: relative;
        display: block;
        aspect-ratio: 1 / 1;
        border-radius: 16px;
        overflow: hidden;
        background: #0c1530;
        border: 1px solid rgba(255,255,255,0.06);
        transition: transform .35s ease, box-shadow .45s ease;
        text-decoration: none;
      }
      .case-card-sq:hover {
        transform: translateY(-6px);
        box-shadow: 0 24px 50px rgba(0,0,0,0.4);
      }
      .case-card-sq .case-card-bg {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        z-index: 0;
        transition: transform .8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
      }
      .case-card-sq:hover .case-card-bg { transform: scale(1.1); }
      .case-card-sq .case-card-shade {
        position: absolute;
        inset: 0;
        z-index: 1;
        background: linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,0.85) 100%);
      }
      .case-card-sq .case-card-overlay {
        position: absolute;
        inset: 0;
        z-index: 2;
        opacity: 0;
        transition: opacity .45s ease;
        background: radial-gradient(circle at center, var(--primary-color) 0%, transparent 70%);
        mix-blend-mode: screen;
      }
      .case-card-sq:hover .case-card-overlay { opacity: 0.55; }
      .case-card-sq .case-card-title {
        position: absolute;
        left: 0; right: 0; bottom: 0;
        padding: 20px 22px;
        margin: 0;
        z-index: 3;
        color: #ffffff;
        font-size: 1.2rem;
        font-weight: 600;
        line-height: 1.3;
      }

      /* Aktívne tlačidlo prepínača */
      .case-tab-btn.active,
      .case-tab-btn.active:hover,
      .case-tab-btn.active:focus {
        background: var(--btn-hover-bg) !important;
        color: #ffffff !important;
      }
      .case-tab-btn.active span {
        transform: none !important;
        opacity: 1 !important;
      }

      /* Zoznam preklikateľných odvetví */
      .case-industry-list {
        text-align: center;
        line-height: 2.2;
        margin-bottom: 8px;
      }
      .case-industry-list a {
        color: #ffffff;
        text-decoration: underline;
        text-underline-offset: 4px;
        text-decoration-thickness: 1px;
        padding: 0 10px;
        white-space: nowrap;
        display: inline-block;
        transition: color .25s ease;
      }
      .case-industry-list a:hover { color: var(--primary-color); }
      .case-industry-list .case-industry-sep { color: rgba(255,255,255,0.35); }
      /* Odvetvia bez štúdie — nie sú klikateľné (zatiaľ) */
      .case-industry-list .case-industry-soon {
        color: rgba(255,255,255,0.4);
        text-decoration: none;
        padding: 0 10px;
        white-space: nowrap;
        display: inline-block;
        cursor: default;
      }
      .case-card-soon {
        cursor: default;
        pointer-events: none;
      }

      /* Videostory — play tlačidlo na karte */
      .yt-card .yt-play {
        position: absolute;
        top: 42%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 58px;
        height: 58px;
        border-radius: 50%;
        background: rgba(118, 77, 240, 0.92);
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 3;
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35);
        transition: transform .25s ease, background .25s ease;
      }
      .yt-card .yt-play::after {
        content: "";
        margin-left: 5px;
        border-style: solid;
        border-width: 10px 0 10px 17px;
        border-color: transparent transparent transparent #ffffff;
      }
      .yt-card:hover .yt-play {
        transform: translate(-50%, -50%) scale(1.08);
        background: rgba(118, 77, 240, 1);
      }

      /* Slider prípadových štúdií */
      .case-slider-wrap {
        position: relative;
        padding: 0 160px;
      }
      .case-slider .owl-nav button.owl-prev,
      .case-slider .owl-nav button.owl-next {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 36px;
        height: 36px;
        border-radius: 50%;
        background: rgba(255,255,255,0.08) !important;
        border: 1px solid rgba(255,255,255,0.2) !important;
        color: #ffffff !important;
        font-size: 16px !important;
        line-height: 1 !important;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: background .25s ease, color .25s ease, border-color .25s ease;
      }
      .case-slider .owl-nav button.owl-prev { left: -110px; }
      .case-slider .owl-nav button.owl-next { right: -110px; }
      .case-slider .owl-nav button.owl-prev:hover,
      .case-slider .owl-nav button.owl-next:hover {
        background: var(--primary-color) !important;
        border-color: var(--primary-color) !important;
      }
      .case-slider .owl-nav button.disabled { opacity: 0.35; cursor: default; }
      .case-slider .owl-nav button span { font-size: 20px; line-height: 1; }
      /* Šípky sú 36x36 px, na mobile pod odporúčaným dotykovým minimom 44x44 px.
         Zväčšuje ich priehľadný prekryv, nie samotné tlačidlo: kruh a jeho tieň
         ostávajú vizuálne rovnaké a nemení sa ani odsadenie obalu (.case-slider-wrap),
         ktoré je na 575 px iba 44 px a väčšie tlačidlo by sa doň nezmestilo. */
      .case-slider .owl-nav button.owl-prev::after,
      .case-slider .owl-nav button.owl-next::after {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: 44px;
        height: 44px;
        transform: translate(-50%, -50%);
      }

      @media (max-width: 1199px) {
        .case-slider-wrap { padding: 0 100px; }
        .case-slider .owl-nav button.owl-prev { left: -70px; }
        .case-slider .owl-nav button.owl-next { right: -70px; }
      }
      @media (max-width: 767px) {
        .case-slider-wrap { padding: 0 60px; }
        .case-slider .owl-nav button.owl-prev { left: -44px; }
        .case-slider .owl-nav button.owl-next { right: -44px; }
      }
      @media (max-width: 575px) {
        .case-slider-wrap { padding: 0 44px; }
        .case-slider .owl-nav button.owl-prev { left: -38px; }
        .case-slider .owl-nav button.owl-next { right: -38px; }
      }

      /* === Logo carousel — Dôverujú nám (zladené s index.html) === */
      .owl-6 img {
        filter: grayscale(1) brightness(1.4);
        opacity: 0.7;
        transition: filter .3s ease, opacity .3s ease;
      }
      .owl-6 img:hover {
        filter: grayscale(0) brightness(1);
        opacity: 1;
      }

      /* === Sekcia Certifikáty — svetlé pozadie ako na home page === */
      #section-certificates {
        background: transparent !important;
        background-color: transparent !important;
        position: relative;
      }
      #section-certificates,
      #section-certificates h1, #section-certificates h2, #section-certificates h3,
      #section-certificates h4, #section-certificates p, #section-certificates span,
      #section-certificates .subtitle {
        color: var(--color-text-strong) !important;
      }
      #section-certificates h1, #section-certificates h2 {
        background: linear-gradient(180deg, var(--color-text-strong) 0%, #7c5cbf 85%) !important;
        -webkit-background-clip: text !important;
        -webkit-text-fill-color: transparent !important;
        background-clip: text !important;
      }

      /* === Kontaktný formulár v sekcii Spojme sa — minimalistický === */
      #section-venue {
        background-color: var(--color-surface-soft) !important;
      }
      #section-venue,
      #section-venue h1, #section-venue h2, #section-venue h3,
      #section-venue h4, #section-venue p, #section-venue span,
      #section-venue .subtitle {
        color: var(--color-text-strong) !important;
      }
      #section-venue h1, #section-venue h2 {
        background: linear-gradient(180deg, var(--color-text-strong) 0%, #7c5cbf 85%) !important;
        -webkit-background-clip: text !important;
        -webkit-text-fill-color: transparent !important;
        background-clip: text !important;
      }
      #section-venue .contact-form-simple {
        max-width: 720px;
        margin: 0 auto;
        padding: 60px 0;
      }
      @media (max-width: 767px) { #section-venue .contact-form-simple { padding: 40px 0; } }
      #section-venue .contact-form-simple input[type="text"],
      #section-venue .contact-form-simple input[type="email"],
      #section-venue .contact-form-simple textarea {
        width: 100%;
        background: transparent;
        border: none;
        border-bottom: 1px solid rgba(26, 16, 64, 0.25);
        border-radius: 0;
        color: var(--color-text-strong) !important;
        padding: 14px 4px;
        font-size: 1rem;
        font-family: inherit;
        transition: border-color .25s ease;
      }
      #section-venue .contact-form-simple textarea { min-height: 110px; resize: vertical; }
      #section-venue .contact-form-simple input::placeholder,
      #section-venue .contact-form-simple textarea::placeholder { color: rgba(26, 16, 64, 0.65); }
      #section-venue .contact-form-simple input:focus,
      #section-venue .contact-form-simple textarea:focus {
        outline: none;
        border-bottom-color: var(--primary-color);
      }
      #section-venue .contact-form-simple .form-submit-row {
        margin-top: 28px;
        text-align: center;
      }
      #section-venue .contact-form-simple button.btn-main,
      #section-venue .contact-form-simple button.btn-main:hover,
      #section-venue .contact-form-simple button.btn-main:focus {
        background: var(--primary-color);
        color: #ffffff !important;
        border: none;
        cursor: pointer;
        font-family: var(--btn-font-family);
        font-size: var(--btn-font-size);
        font-weight: var(--btn-font-weight);
        letter-spacing: var(--btn-letter-spacing);
        padding: var(--btn-padding);
        text-transform: var(--btn-text-transform);
        border-radius: var(--btn-rounded);
      }
      #section-venue .contact-form-simple button.btn-main span { color: #ffffff !important; }
      #section-venue .contact-form-simple button.btn-main.fx-slide { position: relative; overflow: hidden; }
      #section-venue .contact-form-simple button.btn-main.fx-slide span { display: block; position: relative; transition: all .3s ease-in-out; }
      #section-venue .contact-form-simple button.btn-main.fx-slide:hover { background: var(--btn-hover-bg); }
      #section-venue .contact-form-simple button.btn-main.fx-slide:hover span { transform: translate(0, 40px); opacity: 0; }
      #section-venue .contact-form-simple button.btn-main.fx-slide:before {
        content: attr(data-hover-text);
        color: #ffffff !important;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, calc(-50% + 40px));
        opacity: 0;
        transition: all .3s ease-in-out;
      }
      #section-venue .contact-form-simple button.btn-main.fx-slide:hover:before { opacity: 1; transform: translate(-50%, -50%); }