/* ================================================================
   gasasosoaskrupina.sk — nadstavba nad Opax HrConsulting témou
   Tu píšeme VLASTNÉ úpravy. Témove CSS zostáva nedotknuté v /assets/theme/.
   ================================================================ */

/* Nadpisový font — Poppins (Google Fonts). Téma má Cal Sans cez @import
   v style.css; tu ho prepisujeme cez CSS variable + vlastný import, aby
   theme nebolo treba editovať. */
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap");

/* High-tech gradient pre hero a key sekcie */
:root {
    --school-grad-hero: linear-gradient(135deg, #182850 0%, #560d50 55%, #640450 100%);
    --school-grad-soft: linear-gradient(135deg, rgba(24,40,80,.06) 0%, rgba(86,13,80,.06) 55%, rgba(100,4,80,.06) 100%);
    --school-focus: #560d50;
    /* Override theme var — všade, kde téma používa var(--vkl-family-font1), sa
       aktivuje Manrope namiesto Cal Sans. */
    --vkl-family-font1: "Poppins", "Open Sans", system-ui, sans-serif;
}

/* ================================================================
   Accessibility — viditeľný focus indicator a skip-link (WCAG 2.2 AA)
   ================================================================ */
:focus { outline: 2px solid transparent; outline-offset: 2px; }
:focus-visible {
    outline: 3px solid var(--school-focus) !important;
    outline-offset: 3px !important;
    border-radius: 4px;
    box-shadow: 0 0 0 3px rgba(255,255,255,.6) !important;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid var(--school-focus) !important;
    outline-offset: 3px !important;
    box-shadow: 0 0 0 3px rgba(255,255,255,.6) !important;
}
/* Na tmavých pozadiach (hero, footer) potrebujeme žltý ring, aby bol viditeľný */
.school-hero :focus-visible,
.breadcrumb-wrapper :focus-visible,
.cta-wrap7 :focus-visible,
.vl-footer-10 :focus-visible {
    outline: 3px solid #ffd54a !important;
    box-shadow: 0 0 0 3px rgba(11,41,82,.55) !important;
}

.skip-link {
    position: absolute; top: -48px; left: 12px; z-index: 10000;
    background: #0b2952; color: #fff;
    padding: 10px 16px; border-radius: 6px;
    font-weight: 700; text-decoration: none;
    transition: top .15s ease;
}
.skip-link:focus {
    top: 12px;
    outline: 3px solid #ffd54a !important;
    color: #fff;
}

/* ked uživatel preferuje reduced motion — zruš jarallax/sal animácie */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }
    /* SAL skrýva [data-sal] na opacity:0 a odkrýva ho až JS-om pri scrolle.
       Pri reduced-motion (a ako poistka, keď JS zlyhá) zobraz obsah hneď,
       nech nezávisí od reveal animácie. */
    [data-sal] {
        opacity: 1 !important;
        transform: none !important;
    }
}

/* ---- HERO ---- */
.school-hero {
    background: var(--school-grad-hero);
    padding: 46px 0 120px;    /* top zmenšený z 140px → ~1/3 */
    position: relative;
    overflow: hidden;
}
.school-hero::before {
    content: "";
    position: absolute; inset: 0;
    background:
      radial-gradient(900px 400px at 85% 10%, rgba(255,255,255,.18), transparent 60%),
      radial-gradient(600px 300px at 10% 90%, rgba(255,255,255,.10), transparent 60%);
    pointer-events: none;
}
.school-hero .container { position: relative; z-index: 1; }
.school-hero .banner-thumb-10 {
    border-radius: 16px; overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,.25);
}
.school-hero .banner-thumb-10 img {
    width: 100%; height: auto; display: block;
}
.school-hero .banner__wrap10 .para {
    color: #fff;
    opacity: .92;
    font-size: 1.02rem;
    line-height: 1.6;
}
/* Hero CTA tlačidlá (Prijímacie konanie + DOD) — pod H1 */
.school-hero__cta { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 50px; }
.school-hero__cta .primary-btn-10 { display: inline-flex; align-items: center; gap: 8px; }

.school-hero .expbox__wrap10 {
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.20);
    backdrop-filter: blur(6px);
    padding: 16px 20px; border-radius: 12px;
    display: inline-block;
    margin-top: 4px;
}
.school-hero .expbox__wrap10 .title {
    /* !important prebíja globálne h3 {font-size:24px !important} — inak je counter maličký. */
    color: #fff; font-weight: 800; font-size: 2.8rem !important; line-height: 1; margin: 0;
    display: inline-flex; align-items: baseline; gap: 2px;
}
.school-hero .expbox__wrap10 .title span { color: #fff; }
.school-hero .expbox__wrap10 .para {
    color: #fff; opacity: .95;
    margin: 6px 0 0;
    font-size: 1.15rem;
    font-weight: 600;
    letter-spacing: .3px;
}

/* Banner thumb — ponecháva Opax image-anime animáciu, len doladený box-shadow.
   Pevný pomer strán podľa pôvodného home1.jpg (870×466 ≈ 1.87:1) — slajdy
   rôznych rozmerov sa zarezávajú na šírku (object-fit: cover). */
.school-hero .banner-thumb-10 {
    border-radius: 18px; overflow: hidden;
    box-shadow: 0 30px 70px rgba(0,0,0,.35);
    aspect-ratio: 870 / 466;
}
.school-hero .banner-thumb-10 > img {
    width: 100%; height: 100%; display: block;
    object-fit: cover; object-position: center;
}
.school-hero .banner-thumb-10 .schoolHeroSlider {
    width: 100%; height: 100%;
}
.school-hero .banner-thumb-10 .schoolHeroSlider .swiper-wrapper {
    height: 100%;
}
.school-hero .banner-thumb-10 .schoolHeroSlider .swiper-slide {
    height: 100%;
}
.school-hero .banner-thumb-10 .schoolHeroSlider .school-hero__slide-link {
    display: block; width: 100%; height: 100%;
}
.school-hero .banner-thumb-10 .schoolHeroSlider .swiper-slide img {
    width: 100%; height: 100%; display: block;
    object-fit: cover; object-position: center top;
}

.primary-btn-10--ghost {
    background: transparent !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.55) !important;
}
.primary-btn-10--ghost:hover {
    background: rgba(255,255,255,.12) !important;
    color: #fff !important;
}
.school-hero .title,
.school-hero .para {
    color: #fff;
}
.school-hero .title {
    /* !important prebíja globálne h1 {font-size:44px !important}, inak by sa
       responzívny clamp neuplatnil a titulok by bol malý. */
    font-size: clamp(2.4rem, 5.2vw, 4.25rem) !important;
    line-height: 1.12;
    letter-spacing: .4px;
    word-spacing: 2px;
    font-weight: 800;
}
.school-hero .title span {
    letter-spacing: .8px;
}
.school-hero .title span {
    background: linear-gradient(135deg, #fff 0%, #ffd9f0 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    /* Téma (.banner__wrap10 .title span) dáva underline → evokuje link. Preč. */
    text-decoration: none;
}
.school-hero .para { font-size: 1.125rem; opacity: .92; }
.school-hero .primary-btn-10 {
    background: #fff;
    color: #182850;
}
.school-hero .primary-btn-10:hover {
    background: #f3a712;
    color: #182850;   /* tmavomodrá na jantárovej ≈ 7:1 (WCAG 1.4.3) */
}

/* ===========================================================
   HEADER — dvojvrstvový: top najtmavší, menu panel #0A1E5C
   =========================================================== */

/* TOP pás (email + telefón) — o trochu tmavší súrodenec menu panela (#0A1E5C) */
.header-top10 {
    background: #06143F !important;
    color: #fff;
    padding: 4px 0;
    font-size: .8rem;
}
.header-top10 .container { padding-left: 10px; padding-right: 10px; }
.header-top10 .para,
.header-top10 p,
.header-top10 a,
.header-top10 li,
.header-top10 ul li {
    color: #fff !important;
    font-size: .8rem;
    line-height: 1.4;
}
.header-top10 p { margin: 0; }
.header-top10 a:hover { color: #ffd54a !important; }
.header-top10 .header-top-content-10 a {
    text-decoration: underline; text-underline-offset: 3px;
}
.header-top10 .header-iconlist ul {
    list-style: none; margin: 0; padding: 0;
    display: inline-flex; gap: 14px; justify-content: flex-end;
}
.header-top10 .header-iconlist li { display: inline-flex; align-items: center; gap: 4px; }

/* Hlavný header s menu — tmavomodrý panel (aj v sticky state pri scrolle) */
.vl-header-area,
.vl-header-area--solid,
.vl-header-area.vl-transparent-header,
.vl-header-area--solid.vl-transparent-header,
#vl-header-sticky.header-sticky,
.vl-header-area.header-sticky,
.vl-header-area--solid.header-sticky {
    background: #0A1E5C !important;   /* sýtejšia tmavo modrá — číta sa ako modrá, nie čierna */
    box-shadow: 0 2px 10px rgba(0,0,0,.25);
}
#vl-header-sticky.header-sticky { box-shadow: 0 6px 20px rgba(0,0,0,.35) !important; }

/* Menu text zostáva vždy biely aj v sticky state (Opax ho inak prepína na tmavú farbu) */
#vl-header-sticky.header-sticky .vl-main-menu nav > ul > li > a,
.header-sticky .vl-main-menu nav > ul > li > a {
    color: #fff !important;
}
#vl-header-sticky.header-sticky .vl-main-menu nav > ul > li > a:hover,
.header-sticky .vl-main-menu nav > ul > li > a:hover,
#vl-header-sticky.header-sticky .vl-main-menu nav > ul > li:hover > a,
.header-sticky .vl-main-menu nav > ul > li:hover > a {
    color: #ffd54a !important;
}

/* Logo v headeri — biele horizontálne, priamo na tmavom paneli (bez kartičky) */
.school-logo { padding: 8px 0; }
.school-logo a {
    display: inline-block;
}
.school-logo img {
    max-height: 96px;
    width: auto;
    display: block;
    transition: none !important;
    filter: none !important;
}
@media (max-width: 1600px) {
    .school-logo img { max-height: 72px; }
}
@media (max-width: 767px) {
    .school-logo img { max-height: 48px; }
}

/* Hlavné menu — biele položky na tmavom panele */
.vl-main-menu nav > ul {
    list-style: none; margin: 0; padding: 0;
    display: inline-flex; gap: 6px; justify-content: center;
    flex-wrap: wrap;
}
/* Téma dáva každej položke margin-right:30px (asymetrický pravý odstup) —
   nulujeme, rozostup rieši gap na <ul>. */
.vl-main-menu nav > ul > li { position: relative; margin: 0; }
.vl-main-menu nav > ul > li > a {
    /* Čisto biely + bold = ostrý kontrast na tmavej navy (tenký biely text
       pôsobí na tmavom pozadí sivo kvôli anti-aliasingu). !important istí
       proti témovým/sticky prepnutiam na tmavú farbu.
       Snažšie odsadenie (8px 12px) → pilulka sedí tesnejšie okolo textu,
       nevytvára dojem „prázdneho paddingu" vedľa položky. */
    color: #fff !important;
    padding: 8px 12px;
    display: inline-flex; align-items: center; gap: 4px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 700;
    transition: background .15s, color .15s;
}
.vl-main-menu nav > ul > li > a:hover,
.vl-main-menu nav > ul > li:hover > a {
    background: rgba(255,255,255,.12);
    color: #ffd54a !important;
}
/* Šípka podmenu — menšia a tesne pri texte, aby položky s podmenu
   nevyzerali širšie/asymetricky oproti položkám bez podmenu. */
.vl-main-menu nav > ul > li > a .downarrow {
    font-size: .72rem; opacity: .9; margin-left: -1px;
}

/* Header "Kontakt" tlačidlo — biele na tmavom */
.vl-header-btn .primary-btn-10 {
    background: transparent !important;
    color: #fff !important;
    border: 1.5px solid rgba(255,255,255,.6) !important;
}
.vl-header-btn .primary-btn-10:hover {
    background: #fff !important;
    color: #010C41 !important;
}

/* Mobile hamburger — <button> (button reset) */
.vl-header-bar .menu-bar {
    color: #fff; font-size: 1.5rem; line-height: 1;
    padding: 8px 12px; border-radius: 8px;
    background: rgba(255,255,255,.08);
    border: none; cursor: pointer;
    text-decoration: none;
    display: inline-grid; place-items: center;
}
.vl-header-bar .menu-bar:hover { background: rgba(255,255,255,.15); color: #ffd54a; }

/* Search toggle (ikona lupy v hlavičke) */
.vl-header-search-btn {
    width: 42px; height: 42px;
    display: inline-grid; place-items: center;
    border-radius: 50%;
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.25);
    color: #fff; cursor: pointer;
    transition: background .2s ease, color .2s ease, transform .2s ease;
}
.vl-header-search-btn:hover {
    background: #fff; color: #010C41;
    transform: scale(1.05);
}
.vl-header-search-btn i { font-size: 1rem; }

/* ===== Fullscreen search overlay ===== */
.vl-header-search-bar {
    position: fixed; inset: 0;
    /* téma (style.css) dáva height:400px → overlay nekryl celú obrazovku a klik
       pod 400px padal na stránku za ním (dialog sa nezavrel). Prebíjame na plnú výšku. */
    height: 100vh; height: 100dvh;
    background: rgba(1,12,65,.96);
    backdrop-filter: blur(8px);
    z-index: 9999;
    opacity: 0; visibility: hidden;
    transform: scale(1.02);
    transition: opacity .25s ease, transform .25s ease, visibility 0s linear .25s;
    display: flex; align-items: flex-start;
    overflow: visible;
    padding: clamp(72px, 10vh, 120px) 0 40px;
}
.vl-header-search-bar.vl-search-open {
    opacity: 1; visibility: visible;
    transform: scale(1);
    transition: opacity .25s ease, transform .25s ease;
}
.vl-search-close {
    position: absolute; top: 24px; right: 28px;
    width: 52px; height: 52px;
    border: none; background: rgba(255,255,255,.10);
    color: #fff; font-size: 2rem; line-height: 1;
    border-radius: 50%; cursor: pointer;
    transition: background .2s, transform .2s;
}
.vl-search-close:hover { background: #fff; color: #010C41; transform: rotate(90deg); }
.vl-search-bar-title {
    color: #fff; font-weight: 800;
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    letter-spacing: .6px;
}
.contact-search-form-box form {
    position: relative;
    display: flex; align-items: center;
    background: #fff; border-radius: 14px;
    padding: 6px 6px 6px 20px;
    box-shadow: 0 24px 60px rgba(0,0,0,.45);
}
.contact-search-form-box input[type=search] {
    flex: 1; border: none; outline: none;
    padding: 16px 6px; font-size: 1.1rem;
    background: transparent; color: #010C41;
    min-width: 0;
}
.contact-search-form-box button[type=submit] {
    flex: 0 0 auto;
    background: var(--school-grad-hero);
    color: #fff; border: none;
    width: 52px; height: 52px; border-radius: 10px;
    cursor: pointer;
    display: inline-grid; place-items: center;
    transition: filter .2s ease;
}
.contact-search-form-box button[type=submit]:hover { filter: brightness(1.1); }
.contact-search-form-box button[type=submit] i { font-size: 1.1rem; }

body.vl-search-open-body { overflow: hidden; }

/* ===== Instantné vyhľadávanie v menu (combobox) =====
   Pole + zoznam tvoria JEDNU bielu kartu (žiadna tmavá medzera v rohoch). */
.site-search {
    position: relative; text-align: left;
    max-width: 640px; margin: 0 auto;
}
/* Vyhľadávacie pole (pill) — stojí na mieste, nikdy sa nehýbe. */
.site-search__field {
    display: flex; align-items: center;
    padding-left: 22px;
    background: #fff; border-radius: 16px;
    box-shadow: 0 24px 60px rgba(0,0,0,.45);
}
.site-search__icon {
    flex: 0 0 auto; margin-right: 14px;
    color: #560d50; font-size: 1.05rem; pointer-events: none;
}
.site-search__input {
    flex: 1 1 auto; border: none; outline: none;
    padding: 18px 20px 18px 0; font-size: 1.15rem;
    background: transparent; color: #010C41;
    min-width: 0;
}
.site-search__input::placeholder { color: #8a90a6; }
/* Fokus neukazujeme na inpute (škaredý obdĺžnik), ale na poli. */
.site-search__input:focus,
.site-search__input:focus-visible {
    outline: none !important;
    box-shadow: none !important;
}
.site-search__field:focus-within {
    box-shadow: 0 0 0 3px var(--school-focus), 0 24px 60px rgba(0,0,0,.45);
}
/* Zoznam = plávajúci dropdown pod poľom. position:absolute → nemení polohu
   inputu (ten stojí) a preteká von z karty do viditeľnej (tmavej) zóny. */
.site-search__results {
    position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: 5;
    list-style: none; margin: 0; padding: 6px;
    background: #fff; border-radius: 14px;
    box-shadow: 0 24px 60px rgba(0,0,0,.35);
    max-height: calc(100vh - 220px);
    max-height: calc(100dvh - 220px);
    overflow-y: auto;
}
.site-search__results:empty { display: none; }
.site-search__item {
    display: flex; align-items: baseline; gap: 10px;
    padding: 11px 16px; border-radius: 10px;
    cursor: pointer; color: #07203f;
    transition: background .12s ease;
}
.site-search__item.is-active,
.site-search__item:hover { background: var(--school-grad-soft); }
.site-search__label { font-weight: 600; font-size: 1.02rem; }
.site-search__group {
    margin-left: auto; font-size: .8rem; color: #6b7280;
    white-space: nowrap; flex: 0 0 auto;
}
.site-search__empty {
    position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: 5;
    margin: 0; padding: 16px; text-align: center;
    color: #6b7280; background: #fff; border-radius: 14px;
    box-shadow: 0 24px 60px rgba(0,0,0,.35);
}

/* ---- Širší container (1600px na veľkých monitoroch) ---- */
@media (min-width: 1400px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1600px !important;
    }
}

/* ---- Scroll-to-top ikona — posúvame o 1.5× vlastnej veľkosti vyššie,
        aby sa neprekrývala s PixyChat widgetom vpravo dole ---- */
.progress-wrap {
    bottom: 114px !important;  /* default 30 + 84 (= 1.5 × 56px) */
}
@media (max-width: 767px) {
    .progress-wrap {
        bottom: 90px !important;  /* na mobile menšia margin od spodnej hrany */
        right: 16px !important;
    }
}
.vl-main-menu .submenu {
    display: none; position: absolute; top: 100%; left: 0;
    min-width: 260px; padding: .5rem 0; margin: 0;
    list-style: none; background: #fff;
    box-shadow: 0 10px 28px rgba(0,0,0,.25);
    border-radius: 8px; z-index: 100;
    border-top: 3px solid #560d50;
}
.vl-main-menu .has-dropdown:hover > .submenu { display: block; }
.vl-main-menu .submenu li { display: block; }
/* Tmavá navy + !important — Opax pravidlo .vl-main-menu-white-10 ... a:hover
   (style.css:10600) má vyššiu špecificitu a inak prepne text na svetlú farbu. */
.vl-main-menu .submenu li a {
    display: block; padding: .6rem 0 .6rem 1rem; color: #07203f !important;
    font-size: .95rem; text-decoration: none; font-weight: 600;
}
.vl-main-menu .submenu li a:hover { background: var(--school-grad-soft); color: #07203f !important; }
.vl-main-menu .submenu .submenu {
    top: 0; left: 100%;
    border-top: none; border-left: 3px solid #560d50;
}

/* ---- Breadcrumb ---- */
.breadcrumb-wrapper {
    background: var(--school-grad-hero);
    padding: 80px 0 60px;
    color: #fff;
    text-align: center;
}
.breadcrumb-wrapper--compact { padding: 36px 0 28px; }
.breadcrumb-wrapper .title { color: #fff; font-size: clamp(1.75rem, 3.5vw, 2.5rem); }
.breadcrumb-wrapper nav ul {
    list-style: none; padding: 0; margin: 0;
    display: inline-flex; gap: 12px; align-items: center;
    flex-wrap: wrap; justify-content: center;
}
.breadcrumb-wrapper nav ul a { color: rgba(255,255,255,.85); text-decoration: none; }
.breadcrumb-wrapper nav ul a:hover,
.breadcrumb-wrapper nav ul a.active { color: #fff; }
.breadcrumb-wrapper nav ul span[aria-current] { color: #fff; font-weight: 600; }

/* ---- Hlavný nadpis článku ---- */
.article-head__title {
    font-size: clamp(1.75rem, 3.5vw, 2.5rem);
    font-weight: 800;
    line-height: 1.15;
    color: #0b2952;
    margin: 0 0 4px;
    background: linear-gradient(135deg, #182850 0%, #560d50 70%, #640450 110%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

/* ---- Dokumenty — čistý zoznam (dátum · ikona+názov+stiahnutie · veľkosť) ---- */
.documents-block h2.h4 { color: #0b2952; font-weight: 800; }
.documents-table { background: transparent; }
.documents-table thead th {
    font-weight: 600; color: #6c757d; font-size: .78rem;
    text-transform: uppercase; letter-spacing: .4px;
    border-bottom: 1px solid #e5e7eb; padding-bottom: 10px;
}
.documents-table tbody td {
    vertical-align: middle; font-size: .95rem;
    border-bottom: 1px solid #f0f1f4; padding: 12px 8px;
}
.documents-table .doc-date { color: #6c757d; font-size: .9rem; white-space: nowrap; }
.documents-table .doc-size { color: #6c757d; font-size: .88rem; white-space: nowrap; }

/* riadok: malá typová ikona + názov (otvorí) + download ikonka (stiahne) */
.documents-table .doc-row { display: inline-flex; align-items: center; gap: 8px; }
.documents-table .doc-type-ico { font-size: 1.05rem; flex: 0 0 auto; }
.documents-table .doc-link {
    color: #0b2952; text-decoration: none; font-weight: 600;
}
.documents-table .doc-link:hover { color: #560d50; text-decoration: underline; }
.documents-table .doc-dl {
    color: #9aa1ad; font-size: .9rem; line-height: 1; flex: 0 0 auto;
    transition: color .2s;
}
.documents-table .doc-dl:hover { color: #560d50; }
.documents-table .doc-desc { font-size: .82rem; margin-top: 2px; }

/* ---- Karty aktualít / blog ---- */
.blog__wrap10 {
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 4px 14px rgba(10,30,60,.06);
    height: 100%;
    transition: background .25s ease, transform .25s ease, box-shadow .25s ease;
    display: flex; flex-direction: column;
}
.blog__wrap10:hover,
.blog__wrap10:focus-within {
    background: #182850;
    transform: translateY(-4px);
    box-shadow: 0 18px 40px rgba(24,40,80,.35);
}
/* Na hover karty všetok text v contentu biely + čitateľný */
.blog__wrap10:hover .blog__wrap10-content .title,
.blog__wrap10:hover .blog__wrap10-content .title a,
.blog__wrap10:hover .blog__wrap10-content .para,
.blog__wrap10:hover .blog__wrap10-content .meta,
.blog__wrap10:hover .blog__wrap10-content .meta time,
.blog__wrap10:hover .blog__wrap10-content .meta i,
.blog__wrap10:focus-within .blog__wrap10-content .title,
.blog__wrap10:focus-within .blog__wrap10-content .title a,
.blog__wrap10:focus-within .blog__wrap10-content .para,
.blog__wrap10:focus-within .blog__wrap10-content .meta {
    color: #fff;
}
.blog__wrap10:hover .blog__wrap10-content .title a:hover {
    color: #ffd54a;
}
.blog__wrap10-thumb {
    position: relative;
    /* Opax style.css dáva pevnú height: 400px — tá prebíja aspect-ratio.
       Preto height: auto !important, inak box ostane na výšku a nie je square. */
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    width: 100%;
    overflow: hidden;
    background: #f3f4f6;
}
.blog__wrap10-thumb a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 2;           /* nad Opax .image-anime::after overlay */
    cursor: pointer;
}
/* Opax .image-anime dekoratívny overlay nesmie pohlcovať klik na link */
.image-anime::after,
.image-anime::before {
    pointer-events: none;
}
.blog__wrap10-thumb img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100%;
    object-fit: cover !important;
    display: block;
}
/* Logo fallback — logo je 600×502 px. object-fit: contain ho zmenší tak,
   aby sa celé zmestilo na šírku štvorcového boxu (nie orezaný výsek).
   Padding dáva logu vzduch okolo. Centrované na soft gradient. */
.blog__wrap10-thumb--logo {
    background: var(--school-grad-soft);
}
.blog__wrap10-thumb--logo a {
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
}
.blog__wrap10-thumb--logo img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    padding: 16%;
    background: transparent;
}
.blog__wrap10-content {
    padding: 14px 18px 18px;
    flex: 1;
    display: flex; flex-direction: column;
}
.blog__wrap10-content .meta {
    font-size: .82rem; color: #6c757d;
    margin: 0;
    display: flex; align-items: center; gap: 6px;
    line-height: 1.2;
}
/* Globálne h3 {font-size:24px !important} nafukuje strut → široké riadkovanie.
   Prebíjame na veľkosť karty + tesnejší line-height a malý odstup od dátumu. */
.blog__wrap10-content .title {
    margin: 3px 0 0;
    font-size: 1.05rem !important; line-height: 1.28 !important;
}
.blog__wrap10-content .title a {
    color: #0b2952; text-decoration: none;
    font-size: 1.05rem !important; line-height: 1.28; font-weight: 700;
}
.blog__wrap10-content .title a:hover { color: #560d50; }
.blog__wrap10-content .para {
    color: #4a5568;
    margin-top: 6px;
    margin-bottom: 0;
    font-size: .92rem;
    line-height: 1.45;
}

/* ---- Service / oznam boxy ---- */
.service__box10 {
    background: #fff; border-radius: 12px; padding: 28px;
    border: 1px solid rgba(10,30,60,.06);
    height: 100%;
    transition: border-color .2s, box-shadow .2s;
}
.service__box10:hover {
    border-color: #560d50;
    box-shadow: 0 10px 24px rgba(86,13,80,.12);
}
.service__box10-content .title a {
    color: #0b2952; text-decoration: none; font-weight: 700;
}
.service__box10-content .title a:hover { color: #560d50; }
.service__box10-content .readmore {
    color: #560d50; text-decoration: none; font-weight: 600; margin-top: 14px; display: inline-block;
}
.service__box10-content .readmore:hover { color: #640450; }

/* ---- Odbory na home (NÁVRH) ---- */
.odbory-home {
    background: var(--school-grad-soft);
    position: relative;
}
/* Podnadpis kategórie odborov (študijné / učebné / nadstavbové / so ZS) */
.odbory-kat { margin-bottom: 10px; }
.odbory-kat__title {
    display: flex; align-items: center; justify-content: center; gap: 16px;
    text-align: center;
    font-size: 22px; line-height: 1.2;
    margin: 18px 0 28px;
    color: #182850;
}
.odbory-kat:first-of-type .odbory-kat__title { margin-top: 0; }
.odbory-kat__title::before,
.odbory-kat__title::after {
    content: ""; flex: 0 1 90px; height: 2px;
    background: var(--school-grad-hero); opacity: .25; border-radius: 2px;
}
/* karta odboru = service box + gradientová ikona + meta pills */
.odbor-card {
    display: flex; flex-direction: column;
    height: 100%;
    position: relative; overflow: hidden;
}
/* tenký gradientový prúžok navrchu karty pri hoveri */
.odbor-card::before {
    content: ""; position: absolute; inset: 0 0 auto 0; height: 4px;
    background: var(--school-grad-hero);
    transform: scaleX(0); transform-origin: left;
    transition: transform .25s ease;
}
.odbor-card:hover::before { transform: scaleX(1); }
/* väčší rozostup riadkov pri viacriadkovom názve odboru */
.odbor-card .title { line-height: 1.4; }
.odbor-card .service__box10-icon { margin-bottom: 18px; }
.odbor-card .service__box10-icon span {
    width: 60px; height: 60px; border-radius: 14px;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--school-grad-hero);
    color: #fff; font-size: 24px; line-height: 1;
    box-shadow: 0 10px 22px rgba(86,13,80,.28);
    transition: transform .25s ease;
}
.odbor-card:hover .service__box10-icon span { transform: translateY(-2px) rotate(-3deg); }
.odbor-card .service__box10-content { display: flex; flex-direction: column; flex: 1 1 auto; }
.odbor-card .readmore { margin-top: auto; }

/* meta riadok (kód / dĺžka / ukončenie) */
.odbor-meta {
    list-style: none; margin: 0 0 12px; padding: 0;
    display: flex; flex-wrap: wrap; gap: 8px;
    font-size: .8rem;
}
.odbor-meta li {
    display: inline-flex; align-items: center; gap: 5px;
    background: rgba(86,13,80,.07); color: #560d50;
    padding: 4px 10px; border-radius: 999px; font-weight: 600;
}
.odbor-meta li i { font-size: .82em; }
.odbor-meta__kod {
    background: var(--school-grad-hero) !important;
    color: #fff !important; letter-spacing: .04em;
}

/* ---- Variant FILL: karta s pozadím v našich farbách ---- */
.odbory-home--fill { background: #fff; }   /* sekcia svetlá, kontrast nesú karty */
.odbor-card--fill {
    background: var(--school-grad-hero);
    border-color: transparent;
    box-shadow: 0 14px 32px rgba(86,13,80,.22);
}
.odbor-card--fill:hover {
    border-color: transparent;
    box-shadow: 0 18px 40px rgba(86,13,80,.32);
}
.odbor-card--fill::before { display: none; }   /* prúžok netreba, celá karta je gradient */

/* ikona: matné biele "frosted" pole, vnútri biela ikona */
.odbor-card--fill .service__box10-icon span {
    background: rgba(255,255,255,.16);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.35);
    color: #fff;
}
.odbor-card--fill:hover .service__box10-icon span { transform: translateY(-2px); }

/* nadpis + odkaz biele (override gradient-clip nadpisu z global pravidla) */
.odbor-card--fill .service__box10-content .title,
.odbor-card--fill .service__box10-content .title a {
    color: #fff !important;
    -webkit-text-fill-color: #fff;   /* zruší background-clip:text z global nadpisov */
    background: none;
}
.odbor-card--fill .service__box10-content .title a:hover { color: #ffe3f7 !important; }
.odbor-card--fill .service__box10-content .para { color: rgba(255,255,255,.9); }
.odbor-card--fill .service__box10-content .readmore { color: #fff; }
.odbor-card--fill .service__box10-content .readmore:hover { color: #ffe3f7; }

/* meta pills na gradiente: priehľadné biele, kód = plné biele pole */
.odbor-card--fill .odbor-meta li {
    background: rgba(255,255,255,.15); color: #fff;
}
.odbor-card--fill .odbor-meta__kod {
    background: #fff !important; color: #560d50 !important;
}

/* ---- Variant SOFT: biela karta, jemný diagonálny náznak gradientu ---- */
.odbory-home--soft { background: #fff; }
.odbor-card--soft {
    /* biela karta s jemným náznakom našich farieb do pravého horného rohu */
    background: linear-gradient(to top right, #ffffff 55%, rgba(86,13,80,.08) 100%);
    border-color: rgba(10,30,60,.08);
    box-shadow: 0 6px 18px rgba(10,30,60,.05);
    transition: background .35s ease;
}
/* hover: len o čosi výraznejší gradient — nič iné sa nehýbe */
.odbor-card--soft:hover {
    background: linear-gradient(to top right, #ffffff 38%, rgba(86,13,80,.16) 100%);
    border-color: rgba(10,30,60,.08);
    box-shadow: 0 6px 18px rgba(10,30,60,.05);
}
.odbor-card--soft::before { display: none; }                         /* žiadny horný prúžok */
.odbor-card--soft:hover .service__box10-icon span { transform: none; } /* ikona sa nehýbe */

/* hlavná ikona: bez gradientu — jemné tónované pole, ikona v našej farbe */
.odbor-card--soft .service__box10-icon span {
    background: rgba(86,13,80,.08);
    box-shadow: none;
    color: #560d50;
}
/* kód odboru: bežný pill, nie gradient */
.odbor-card--soft .odbor-meta__kod {
    background: rgba(86,13,80,.07) !important;
    color: #560d50 !important;
    letter-spacing: normal;
}
/* jednovetová charakteristika namiesto odkazu — menšie písmo */
.odbor-popis {
    font-size: .85rem; line-height: 1.5; color: #4a5568;
    margin: 4px 0 0;
}

/* ---- Variant SOFT2: ako soft, ale s fotkou odboru navrchu ---- */
/*   default: fotka mierne stlmená (saturácia + jas dole),                 */
/*   hover: fotka sa priblíži (scale) a rozjasní + karta sa nadvihne.      */
/*   Zaujímavý tvar = asymetrické zaoblenie rohov.                         */
.odbory-home--soft2 { background: #fff; }
.odbor-card--soft2 {
    padding: 0;                                   /* fotka ide po okraj karty */
    background: #fff;
    border: 1px solid rgba(10,30,60,.08);
    border-radius: 26px 8px 26px 8px;             /* asymetrický „kapsulový" tvar */
    box-shadow: 0 8px 24px rgba(10,30,60,.07);
    transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.odbor-card--soft2:hover {
    transform: translateY(-4px);
    border-color: rgba(86,13,80,.18);
    box-shadow: 0 18px 42px rgba(86,13,80,.18);
    /* len jemný gradient v obsahovej časti — prebíja plnú fialovú z vendor témy
       (.service__box10-iconbox:hover) */
    background: linear-gradient(to top right, #ffffff 45%, rgba(86,13,80,.10) 100%);
}
/* téma pri hoveri prefarbuje nadpis na bielo — vrátime čitateľnú tmavú */
.odbor-card--soft2:hover .service__box10-content .title,
.odbor-card--soft2:hover .service__box10-content .title a { color: #0b2952; }
.odbor-card--soft2:hover .service__box10-content .title a:hover { color: #560d50; }
.odbor-card--soft2::before { display: none; }     /* žiadny horný prúžok */

/* fotka hore */
.odbor-card__thumb {
    display: block; position: relative; overflow: hidden;
    aspect-ratio: 16 / 11;
    border-radius: 25px 7px 0 0;                  /* kopíruje horné rohy karty */
}
.odbor-card__thumb img {
    width: 100%; height: 100%; object-fit: cover;
    transform: scale(1.02);
    filter: saturate(.82) brightness(.92);
    transition: transform .6s cubic-bezier(.2,.8,.2,1), filter .45s ease;
}
.odbor-card--soft2:hover .odbor-card__thumb img {
    transform: scale(1.1);                        /* priblíženie */
    filter: saturate(1.05) brightness(1.04);      /* rozjasnenie */
}
/* jemný gradientový závoj v našich farbách na spodku fotky */
.odbor-card__thumb::before {
    content: ""; position: absolute; inset: 0; z-index: 1;
    background: linear-gradient(to top, rgba(86,13,80,.34) 0%, rgba(86,13,80,0) 42%);
    pointer-events: none;
}

/* obsah pod fotkou */
.odbor-card--soft2 .service__box10-content { padding: 22px 24px 26px; }
.odbor-card--soft2 .odbor-meta__kod {
    background: rgba(86,13,80,.07) !important;
    color: #560d50 !important; letter-spacing: normal;
}

/* reduced-motion: žiadne posuny ani zoom */
@media (prefers-reduced-motion: reduce) {
    .odbor-card--soft2,
    .odbor-card--soft2:hover { transform: none; }
    .odbor-card--soft2 .odbor-card__thumb img,
    .odbor-card--soft2:hover .odbor-card__thumb img { transform: none; transition: filter .3s ease; }
}

/* ---- Counter box ---- */
.counterbox__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 20px;
}
.counterbox__single {
    background: var(--school-grad-soft);
    border-radius: 12px;
    padding: 24px;
    text-align: left;
    border: 1px solid rgba(86,13,80,.12);
}
.counterbox__single .title { font-size: 2rem; color: #560d50; margin: 0; font-weight: 800; }
.counterbox__single p { margin: 0; color: #0b2952; font-weight: 600; }

/* ---- CTA sekcia ---- */
.cta-wrap7 {
    background: var(--school-grad-hero);
    color: #fff;
    border-radius: 20px;
    margin: 40px 15px;
    padding: 60px 40px;
}
.cta-wrap7 .title, .cta-wrap7 .para { color: #fff; }
.cta-wrap7 .primary-btn-10 { background: #fff; color: #182850; }
.cta-wrap7 .primary-btn-10:hover { background: #f3a712; color: #182850; }

/* ---- Primárne tlačítko (fallback) ---- */
.primary-btn-10 {
    display: inline-flex;
    align-items: center; gap: 10px;
    padding: 12px 22px; border-radius: 8px;
    background: #182850; color: #fff;
    text-decoration: none; font-weight: 600;
    border: none; cursor: pointer;
    transition: background .2s, color .2s;
}
.primary-btn-10:hover { background: #560d50; color: #fff; }

/* ---- Sekcie s nadpismi ---- */
.vl-section-title .sub-title {
    color: #560d50;
    font-size: .95rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 1px;
}
.vl-section-title .sub-title span { margin-right: 8px; color: #640450; }
.vl-section-title .title {
    color: #0b2952; font-weight: 700;
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    line-height: 1.25;
}
.vl-section-title .title span {
    background: linear-gradient(135deg, #560d50, #640450);
    -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* ---- Article detail ---- */
.vl-service-sidebar-content-wrap { background: #fff; border-radius: 14px; padding: 32px; box-shadow: 0 2px 14px rgba(17,23,39,.05); }
.vl-service-large-thumb img { width: 100%; border-radius: 10px; display: block; }
/* Titulná fotka — klikateľná do lightboxu, so zoom badge v rohu */
.vl-service-large-thumb a { position: relative; display: block; overflow: hidden; border-radius: 10px; }
.vl-service-large-thumb a img { transition: transform .4s ease; }
.vl-service-large-thumb a:hover img { transform: scale(1.03); }
.thumb-zoom {
    position: absolute; right: 12px; bottom: 12px;
    width: 40px; height: 40px; border-radius: 8px;
    background: rgba(11,41,82,.85); color: #fff;
    display: grid; place-items: center;
    opacity: 0; transition: opacity .2s ease; pointer-events: none;
}
.vl-service-large-thumb a:hover .thumb-zoom,
.vl-service-large-thumb a:focus-visible .thumb-zoom { opacity: 1; }
.vl-blog-user-manin-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 14px; padding: 20px; border-radius: 10px;
    background: var(--school-grad-soft);
}
.vl-blog-sin-authbox { display: flex; gap: 10px; align-items: center; }
.vl-blog-sin-authbox .icon {
    width: 42px; height: 42px; border-radius: 10px;
    display: grid; place-items: center;
    background: #fff; color: #560d50;
}
.vl-blog-sin-authbox .content .para { font-size: .8rem; color: #6c757d; margin: 0; }
.vl-blog-sin-authbox .content .title { font-size: 1rem; color: #0b2952; margin: 0; font-weight: 600; }

.article-body h1, .article-body h2, .article-body h3,
.article-body h4, .article-body h5, .article-body h6 {
    color: #0b2952; font-weight: 700; margin-top: 1.25em;
}
.article-body h3 {
    font-size: 1.55rem;
    letter-spacing: .5px;
    margin-top: 1.4em;
    margin-bottom: .5em;
}
.article-body h2 {
    font-size: 1.9rem;
    letter-spacing: .4px;
}
.article-body p { font-size: 18px !important; line-height: 1.7; color: #333; margin-bottom: 1em; }
.article-body a { color: #560d50; text-decoration: underline; text-underline-offset: 2px; }
.article-body a:hover { color: #640450; }
.article-body img { max-width: 100%; height: auto; border-radius: 8px; }
.article-body table { width: 100%; border-collapse: collapse; margin: 1em 0; }
.article-body th, .article-body td { padding: .75rem; border: 1px solid #e5e7eb; text-align: left; }
.article-body th { background: #f8fafc; }

/* Zoznamy v texte článku — Opax reset (ul{margin:0;padding:0}, li{list-style:none})
   im berie odrážky aj odsadenie. Vraciame ich, ale LEN v .article-body,
   aby sa nerozbilo menu, breadcrumb a iné ul/li na webe. */
/* Odrážka kreslená cez ::before pseudo-element (nie list-style/::marker),
   aby ju neovplyvnil žiadny theme reset ani inline list-style:none z editora.
   !important kvôli inline štýlom, ktoré WYSIWYG vkladá priamo do obsahu. */
.article-body ul,
.article-body ol { margin: 1em 0 !important; padding-left: 1.75em !important; }  /* odsadenie zľava */
.article-body ul { list-style: none !important; }
.article-body ol { list-style: decimal outside !important; }
.article-body li { margin-bottom: .5em; line-height: 1.7; }                      /* vizuálny margin každej li */
/* vlastná disc odrážka */
.article-body ul > li { position: relative; padding-left: .4em; }
.article-body ul > li::before {
    content: "";
    position: absolute;
    left: -.85em;
    top: .62em;
    width: .42em;
    height: .42em;
    background: #560d50;       /* odrážka v school farbe */
    border-radius: 50%;
}
.article-body ol > li::marker { color: #560d50; }
/* vnorené zoznamy: 2. úroveň prázdny krúžok, 3. štvorček */
.article-body ul ul,
.article-body ol ol { margin: .4em 0 !important; }
.article-body ul ul > li::before { background: transparent; border: 1px solid #560d50; }
.article-body ul ul ul > li::before { border-radius: 0; background: #560d50; border: 0; }

/* Globálne H3 (mimo article-body) — tiež o pár px väčšie a s letter-spacing */
.vl-service-sidebar-content-wrap h3 { letter-spacing: .4px; }

/* ---- Pagination ---- */
.pagination-wrap { display: flex; justify-content: center; }
.pagination-wrap .pagination {
    list-style: none; margin: 0; padding: 0;
    display: inline-flex; gap: 6px; flex-wrap: wrap;
}
.pagination-wrap .page-link {
    display: inline-block; padding: 8px 14px; border-radius: 8px;
    background: #fff; color: #0b2952; text-decoration: none;
    border: 1px solid rgba(24,40,80,.12); font-weight: 600;
    transition: background .2s, color .2s, border-color .2s;
}
.pagination-wrap .page-link:hover {
    background: var(--school-grad-soft); border-color: rgba(86,13,80,.25);
}
.pagination-wrap .page-item.active .page-link {
    background: var(--school-grad-hero); color: #fff; border-color: transparent;
}

/* ===== Fotogaléria (lightbox + responzívny grid, max-width:100%) ===== */
.gallery h2.h4 { color: #0b2952; font-weight: 800; letter-spacing: .4px; }
.gallery__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 12px;
}
.gallery__item {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 10px;
    background: #f3f4f6;
    aspect-ratio: 4 / 3;
    max-width: 100%;
    text-decoration: none;
    transition: transform .25s ease, box-shadow .25s ease;
}
/* Vyššia špecificita než .vl-service-sidebar-content-wrap img {height:auto},
   inak by sa thumb nenatiahol na výšku rodiča (orezáva sa cez object-fit). */
.gallery__grid .gallery__item img {
    width: 100%;
    height: 100%;
    max-width: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    transition: transform .4s ease;
}
.gallery__item:hover { box-shadow: 0 12px 26px rgba(10,30,60,.18); transform: translateY(-2px); }
.gallery__item:hover img { transform: scale(1.05); }
.gallery__zoom {
    position: absolute; right: 10px; bottom: 10px;
    width: 36px; height: 36px; border-radius: 8px;
    background: rgba(11,41,82,.85); color: #fff;
    display: grid; place-items: center;
    opacity: 0; transition: opacity .2s ease;
    pointer-events: none;
}
.gallery__item:hover .gallery__zoom,
.gallery__item:focus-visible .gallery__zoom { opacity: 1; }
.gallery__caption {
    position: absolute; left: 0; right: 0; bottom: 0;
    padding: 8px 12px;
    color: #fff; font-size: .82rem;
    background: linear-gradient(180deg, transparent, rgba(0,0,0,.72));
}

/* Akékoľvek obrázky v content boxe */
.vl-service-sidebar-content-wrap img { max-width: 100%; height: auto; }

/* ===== Magnific-popup zoom animácia (.mfp-with-zoom) ===== */
.mfp-with-zoom .mfp-container,
.mfp-with-zoom.mfp-bg { opacity: 0; transition: all .3s ease-out; }
.mfp-with-zoom.mfp-ready .mfp-container { opacity: 1; }
.mfp-with-zoom.mfp-ready.mfp-bg { opacity: .8; }
.mfp-with-zoom.mfp-removing .mfp-container,
.mfp-with-zoom.mfp-removing.mfp-bg { opacity: 0; }

/* ===== Oznamy — tabuľka (dátum · foto-lightbox · názov→telo) ===== */
.oznamy-table { background: transparent; }
.oznamy-table thead th {
    font-weight: 600; color: #6c757d; font-size: .78rem;
    text-transform: uppercase; letter-spacing: .4px;
    border-bottom: 1px solid #e5e7eb; padding-bottom: 10px;
}
.oznamy-table tbody td {
    vertical-align: middle; border-bottom: 1px solid #f0f1f4; padding: 14px 8px;
}
.oznamy-table .oznamy-date { color: #6c757d; font-size: .9rem; white-space: nowrap; }
.oznamy-table .oznamy-cell { display: flex; gap: 14px; align-items: flex-start; }
.oznamy-table .oznamy-cell__body { flex: 1; min-width: 0; }
.oznamy-table .oznamy-thumb {
    position: relative; display: block; flex: 0 0 auto; width: 80px; height: 60px;
    border-radius: 8px; overflow: hidden; background: #f3f4f6;
}
.oznamy-table .oznamy-thumb img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; transition: transform .4s ease; }
.oznamy-table .oznamy-thumb:hover img { transform: scale(1.06); }
.oznamy-table .oznamy-thumb .thumb-zoom { width: 28px; height: 28px; right: 6px; bottom: 6px; font-size: .8rem; }
.oznamy-table .oznamy-link { color: #0b2952; text-decoration: none; font-weight: 700; font-size: 1.02rem; }
.oznamy-table .oznamy-link:hover { color: #560d50; text-decoration: underline; }
.oznamy-table .oznamy-desc { font-size: .85rem; margin-top: 3px; line-height: 1.4; }

/* ---- Preloader vypnutý — často visel a blokoval obsah ---- */
.preloader { display: none !important; }

/* ---- Responzívne fix: vl-main-menu je na XL+ viditeľné, na mobile skryté — už rieši d-none d-xl-block ---- */

/* ---- Font-stack — Open Sans pre body, Cal Sans pre nadpisy ----
   Opax definuje:
     --vkl-family-font1: 'Cal Sans', sans-serif   (nadpisy) — NECHÁVAME
     --vkl-family-font2: 'Mulish', sans-serif     (body)    — prepíšeme na Open Sans
*/
:root {
    --vkl-family-font2: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif !important;
}

/* Body / text — Open Sans */
html, body,
p, a, span, li, ul, ol, div,
button, input, textarea, select,
.sub-title, .para,
.vl-section-title .sub-title,
.blog__wrap10-content .para,
.blog__wrap10-content .meta,
.service__box10-content .para,
.primary-btn-10,
.vl-main-menu a,
.vl-footer-10, .vl-footer-10 p, .vl-footer-10 a, .vl-footer-10 li, .vl-footer-10 span,
.article-body p, .article-body a, .article-body li, .article-body span, .article-body ul, .article-body ol,
.vl-sidebar-widget .vl-service-list a, .rec__post-content .ttitle a, .sb-contact p,
.documents-table, .documents-table td, .documents-table th {
    font-family: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif !important;
}

/* Mapa stránok — stromová štruktúra */
.sitemap-tree__root,
.sitemap-tree__children {
    list-style: none;
    margin: 0;
    padding: 0;
}
.sitemap-tree__root > .sitemap-tree__item {
    margin-bottom: 28px;
}
.sitemap-tree__root > .sitemap-tree__item:last-child {
    margin-bottom: 0;
}
.sitemap-tree__root > .sitemap-tree__item > .sitemap-tree__link {
    display: inline-block;
    font-size: 1.15rem;
    font-weight: 700;
    padding-bottom: 8px;
    border-bottom: 2px solid rgba(108, 76, 240, .25);
    margin-bottom: 10px;
}
.sitemap-tree__children {
    margin-left: 4px;
    border-left: 2px solid rgba(108, 76, 240, .18);
}
.sitemap-tree__children .sitemap-tree__item {
    position: relative;
    padding-left: 18px;
}
.sitemap-tree__children .sitemap-tree__item::before {
    content: "";
    position: absolute;
    left: 0;
    top: .8em;
    width: 12px;
    height: 2px;
    background: rgba(108, 76, 240, .18);
}
.sitemap-tree__link {
    text-decoration: none;
    line-height: 1.9;
    transition: color .15s ease;
}
.sitemap-tree__link:hover,
.sitemap-tree__link:focus-visible {
    color: #6c4cf0;
    text-decoration: underline;
}

/* Riadok „posledná aktualizácia" vo footeri — čitateľné, odsadené od copyrightu */
.footer-lastmod {
    font-size: .95rem !important;
    opacity: .8;
    margin-top: 14px;
}

/* Riadok „Technický prevádzkovateľ" v 1. stĺpci footra — mimo .vl-footer-content-6,
   preto nededí svetlú farbu textu; nastavujeme explicitne. */
.footer-provozovatel {
    color: rgba(255, 255, 255, 0.9);
    font-size: 1rem;
}
.footer-provozovatel a {
    color: rgba(255, 255, 255, 0.9);
    text-decoration: underline;
}
.footer-provozovatel a:hover,
.footer-provozovatel a:focus-visible {
    color: #fff;
}

/* Nadpisy — Cal Sans (Opax default, už importovaný v theme style.css).
   Anchory aj spany vnútri nadpisov sú v zozname, lebo globálna Open Sans rule
   pre `a`/`span` by inak prebila dedenie z h1-h6 (polovica nadpisu by mala iný font). */
h1, h2, h3, h4, h5, h6,
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a,
h1 span, h2 span, h3 span, h4 span, h5 span, h6 span,
.title, .title a, .title span,
.article-head__title span,
.vl-section-title .title,
.blog__wrap10-content .title, .blog__wrap10-content .title a,
.service__box10-content .title,
.article-head__title,
.breadcrumb-wrapper .title,
.school-hero .title,
.vl-search-bar-title,
.vl-footer-widget-title,
.article-body h1, .article-body h2, .article-body h3, .article-body h4, .article-body h5, .article-body h6,
.article-body h1 a, .article-body h2 a, .article-body h3 a, .article-body h4 a, .article-body h5 a, .article-body h6 a {
    font-family: "Poppins", "Open Sans", system-ui, sans-serif !important;
    letter-spacing: -0.01em !important;
}

/* Veľkosti nadpisov — ladené pre Poppins (ktorý má širší rez ako Cal Sans). */
h1, .article-body h1 { font-size: 44px !important; }
h2, .article-body h2 { font-size: 34px !important; }
h3, .article-body h3 { font-size: 24px !important; }
h4, .article-body h4 { font-size: 20px !important; }
h5, .article-body h5 { font-size: 17px !important; }
h6, .article-body h6 { font-size: 15px !important; }

/* Sekčné nadpisy v detail článku (fotogaléria, dokumenty) — menšie, aby
   nekonkurovali hlavnému h1 titulku článku. */
.gallery > h2,
.documents-block > h2 { font-size: 20px !important; }

body { color: #1a1a1a; }

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


/* ================================================================
   SIDEBAR — natívne komponenty témy Opax (.vl-sidebar-widget,
   .vl-service-list, .rec__post). Školská paleta sa aplikuje len
   tu cez scoped override premenných témy — markup v
   partial_content/sidebar.php zostáva 1:1 s témou.
   ================================================================ */

/* Sekcia so sidebarom (detail článku + výpis tagu) — celá biela vrátane
   hlavnej obsahovej časti. Trieda vkl-gray-white-bg sa používa LEN tu. */
.vkl-gray-white-bg { background: #fff; }

/* Prefarbenie demo-fialovej témy na školskú paletu — IBA v sidebar-i:
   --vkl-text-primary-color-1 = hover/výplň pill odkazov (demo #644AF9 → školská)
   --vkl-bg-gray-bg-1         = pozadie panelov (demo levanduľa → jemný školský tón) */
.sidebar__wrapper {
    --vkl-text-primary-color-1: #560d50;
    --vkl-bg-gray-bg-1: #f4eef3;
    position: sticky;
    top: 90px;
}

/* Nadpis widgetu — v téme je regular; pre školu výraznejší (tučný, tmavý,
   s plnou linkou školskej farby — nie gradient). */
.sidebar__wrapper .title {
    font-weight: 800;
    color: var(--vkl-text-heading-color-1);
    padding-bottom: 14px;
    margin-bottom: 18px;
    border-bottom: 2px solid #560d50;
}
.sidebar__wrapper .sb-center .title { border-bottom-color: rgba(86,13,80,.25); }

/* Pill odkazy — poznámka pod label (span je v téme absolútne pozicovaný
   vpravo a slúži na šípku/počet; .sb-note ho prepíše na druhý riadok). */
.sidebar__wrapper .vl-service-list a { padding-right: 44px; margin-bottom: 12px; }
.sidebar__wrapper .vl-service-list a .sb-note {
    position: static; display: block;
    font-size: .8rem; font-weight: 400; margin-top: 2px;
    color: var(--vkl-text-paragraph-color-1, #5b6373);
}
.sidebar__wrapper .vl-service-list a:hover .sb-note { color: rgba(255,255,255,.85); }
.sb-ql-icon { width: 20px; text-align: center; margin-right: 6px; }

/* "Zobraziť všetky" — posledný riadok zoznamu, decentný textový odkaz */
.sb-more {
    background: transparent !important; box-shadow: none;
    padding: 6px 2px 0 !important; margin-bottom: 0 !important;
    font-weight: 600; color: #560d50 !important;
}
.sb-more:hover { color: #640450 !important; background: transparent !important; }
.sb-list-after { margin-top: 8px; }

/* rec__post — náhľady menšie než 120px demo (sidebar je užší).
   .ttitle je <h3>, takže prebíjame globálne h3 {font-size:24px !important}. */
.sidebar__wrapper .rec__post-thumb img { width: 84px; height: 84px; object-fit: cover; }
.sidebar__wrapper .rec__post-content .para { font-size: .82rem; margin: 0; }
.sidebar__wrapper .rec__post-content .ttitle { padding-top: 5px; font-size: 15px !important; font-weight: 600; line-height: 1.4; }
.sidebar__wrapper .rec__post-content .ttitle a { color: var(--vkl-text-heading-color-1); transition: color .2s; }
.sidebar__wrapper .rec__post-content .ttitle a:hover { color: #560d50; }

/* Centrovaný panel (zriaďovateľ, plagát) */
.sb-center { text-align: center; }
.sb-center .title { padding-bottom: 16px; }
.sb-logo-link img { max-height: 80px; width: auto; }
.sb-poster img { max-width: 100%; border-radius: 8px; }
.sb-project-link { display: inline-block; }
.sb-project-link img { max-width: 100%; height: auto; border-radius: 8px; transition: opacity .2s; }
.sb-project-link:hover img { opacity: .9; }

/* Partneri — chipy v štýle témy (.tag-list). IT FIT je <span> bez odkazu,
   tak mu dáme rovnaký chip vzhľad ako .tag-list a. */
.sidebar__wrapper .tag-list span {
    background: var(--vkl-text-text-white);
    border-radius: 8px; padding: 10px;
    color: var(--vkl-text-heading-color-1);
    font-size: var(--vkl-font-size-font-s16, 16px);
    font-weight: var(--vkl-weight-semibold, 600);
    display: inline-block; margin-bottom: 16px; margin-right: 6px;
}

/* Kontakt — väčší, čitateľný text */
.sb-contact p { margin: 0 0 12px; font-size: 1rem; line-height: 1.5; display: flex; gap: 10px; align-items: flex-start; color: var(--vkl-text-heading-color-1); }
.sb-contact i { color: #560d50; margin-top: 5px; flex: 0 0 16px; }
.sb-contact a { color: var(--vkl-text-heading-color-1); text-decoration: none; }
.sb-contact a:hover { color: #560d50; }


/* ================================================================
   A11Y nadstavba — forced-colors, mobilné menu, pauza slideru, 404
   ================================================================ */

/* Gradientové (background-clip:text) nadpisy zmiznú vo Windows High Contrast /
   forced-colors režime (color:transparent) — vrátime ich na systémovú farbu. */
@media (forced-colors: active) {
    .school-hero .title span,
    .vl-section-title .title span,
    .article-head__title,
    .err-code {
        -webkit-text-fill-color: CanvasText;
        color: CanvasText;
        background: none;
    }
}

/* ---- Mobilné menu — vlastný prístupný panel (#mobile-nav) ---- */
.school-mobnav[hidden] { display: none; }
.school-mobnav { position: fixed; inset: 0; z-index: 10001; }
.school-mobnav__overlay {
    position: absolute; inset: 0;
    background: rgba(1,9,48,.55);
    opacity: 0; transition: opacity .25s ease;
}
.school-mobnav.is-open .school-mobnav__overlay { opacity: 1; }
.school-mobnav__panel {
    position: absolute; top: 0; right: 0; bottom: 0;
    width: min(86vw, 360px);
    background: #010C41; color: #fff;
    padding: 18px 20px 28px;
    box-shadow: -10px 0 40px rgba(0,0,0,.4);
    overflow-y: auto;
    transform: translateX(100%);
    transition: transform .25s ease;
    display: flex; flex-direction: column; gap: 18px;
}
.school-mobnav.is-open .school-mobnav__panel { transform: translateX(0); }
.school-mobnav__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.school-mobnav__title { font-weight: 700; font-size: 1rem; }
.school-mobnav__close {
    width: 42px; height: 42px; flex: 0 0 auto;
    border: none; cursor: pointer; border-radius: 8px;
    background: rgba(255,255,255,.1); color: #fff; font-size: 1.3rem;
    display: inline-grid; place-items: center;
}
.school-mobnav__close:hover { background: rgba(255,255,255,.2); color: #ffd54a; }
.school-mobnav__list, .school-mobnav__list .submenu { list-style: none; margin: 0; padding: 0; }
.school-mobnav__list li { display: block; }
.school-mobnav__link {
    display: block; width: 100%; text-align: left;
    padding: 11px 10px; color: #fff; text-decoration: none;
    font-weight: 600; border-radius: 8px;
    border-bottom: 1px solid rgba(255,255,255,.08);
    background: transparent; border-left: none; border-right: none; border-top: none;
    font-family: inherit; font-size: inherit; cursor: pointer;
}
.school-mobnav__link:hover { background: rgba(255,255,255,.1); color: #ffd54a; }
/* riadok: odkaz + samostatný toggle (položka má cieľ aj deti) */
.school-mobnav__row { display: flex; align-items: stretch; gap: 4px; }
.school-mobnav__row .school-mobnav__link { flex: 1 1 auto; border-bottom: none; }
.school-mobnav__row, .school-mobnav__toggle-full { border-bottom: 1px solid rgba(255,255,255,.08); }
/* toggle tlačidlo (samotný chevron) */
.school-mobnav__toggle {
    flex: 0 0 auto; width: 46px;
    border: none; background: transparent; color: #fff;
    cursor: pointer; border-radius: 8px;
    display: inline-grid; place-items: center;
}
.school-mobnav__toggle:hover { background: rgba(255,255,255,.1); color: #ffd54a; }
/* celý riadok je toggle (položka má deti, ale žiadny cieľ) */
.school-mobnav__toggle-full {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.school-mobnav__chev { display: inline-block; transition: transform .2s ease; }
@media (prefers-reduced-motion: reduce) { .school-mobnav__chev { transition: none; } }
.school-mobnav__list li.is-expanded > .school-mobnav__row .school-mobnav__chev,
.school-mobnav__list li.is-expanded > .school-mobnav__toggle-full .school-mobnav__chev { transform: rotate(180deg); }
/* submenu — akordeón s jemnou animáciou (grid-rows 0fr→1fr).
   visibility:hidden v zbalenom stave vyradí odkazy z poradia Tabu aj zo screen-readera
   (nielen vizuálne skrytie) → WCAG. Prepína sa s oneskorením, takže animácia dobehne. */
.school-mobnav__sub {
    display: grid;
    grid-template-rows: 0fr;
    visibility: hidden;
    transition: grid-template-rows .28s ease, visibility .28s;
}
.school-mobnav__list li.is-expanded > .school-mobnav__sub {
    grid-template-rows: 1fr;
    visibility: visible;
}
.school-mobnav__sub > .submenu {
    overflow: hidden;
    opacity: 0;
    transition: opacity .28s ease;
}
.school-mobnav__list li.is-expanded > .school-mobnav__sub > .submenu { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
    .school-mobnav__sub,
    .school-mobnav__sub > .submenu { transition: none; }
}
.school-mobnav__list .submenu {
    position: static; background: transparent;
    box-shadow: none; border: none; border-radius: 0;
    padding-left: 14px; min-width: 0;
}
.school-mobnav__list .submenu .school-mobnav__link { font-weight: 500; color: rgba(255,255,255,.85); }
.school-mobnav__list .submenu .school-mobnav__link:hover { color: #ffd54a; }
.school-mobnav__cta { display: flex; flex-direction: column; gap: 10px; }
.school-mobnav__cta .primary-btn-10 { justify-content: center; }
.primary-btn-10--ghost-dark {
    background: transparent; color: #fff;
    border: 1.5px solid rgba(255,255,255,.5);
}
.primary-btn-10--ghost-dark:hover { background: rgba(255,255,255,.12); color: #fff; }
.school-mobnav__contact { display: flex; flex-direction: column; gap: 8px; margin-top: auto; }
.school-mobnav__contact a { color: rgba(255,255,255,.85); text-decoration: none; font-size: .92rem; }
.school-mobnav__contact a:hover { color: #ffd54a; }
body.mobnav-open { overflow: hidden; }

/* ---- Hero slider — tlačidlo pauza/spustiť (WCAG 2.2.2 Pause, Stop, Hide) ---- */
.school-hero__playpause {
    position: absolute; right: 12px; bottom: 12px; z-index: 5;
    width: 40px; height: 40px; border-radius: 50%;
    border: 1px solid rgba(255,255,255,.5);
    background: rgba(1,12,65,.7); color: #fff; cursor: pointer;
    display: inline-grid; place-items: center;
    transition: background .2s, transform .2s;
}
.school-hero__playpause:hover { background: rgba(1,12,65,.95); transform: scale(1.06); }
.school-hero .swiper-pagination { bottom: 10px; }
.school-hero .swiper-pagination .swiper-pagination-bullet { background: #fff; opacity: .55; }
.school-hero .swiper-pagination .swiper-pagination-bullet-active { opacity: 1; }

/* ---- 404 / chybová stránka — veľký kód (dekoratívny), nadpis je <h1> ---- */
.err-code {
    font-size: clamp(3.5rem, 12vw, 7rem);
    font-weight: 800; line-height: 1;
    margin: 0 0 6px;
    background: linear-gradient(135deg, #182850 0%, #560d50 70%, #640450 110%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.error-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.error-actions__or { color: #4a5578; font-weight: 600; }
/* Ponuka odborov vnútri obsahového stĺpca 404 — bez sekčného pozadia/tieňa. */
.error-odbory { background: none; }
.error-odbory .odbory-kat__title { justify-content: flex-start; }
.error-odbory .odbory-kat__title::before { display: none; }

/* ================================================================
   DETAIL ODBORU — marketingová šablóna (odbor_detail_view.php)
   Reuse: .vl-section-title, .gallery, .cta-wrap7, .primary-btn-10.
   Nové komponenty + prefarbenie témových (testimonial, accordion).
   ================================================================ */

/* ---- 1. Hero odboru ---- */
.odbor-hero {
    background: var(--school-grad-hero);
    color: #fff;
    padding: 28px 0 80px;
    position: relative;
    overflow: hidden;
}
.odbor-hero::before {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background:
      radial-gradient(900px 400px at 85% 0%, rgba(255,255,255,.16), transparent 60%),
      radial-gradient(600px 320px at 5% 100%, rgba(255,255,255,.10), transparent 60%);
}
.odbor-hero .container { position: relative; z-index: 1; }

/* breadcrumb v hero */
.odbor-hero__crumb ul {
    list-style: none; margin: 0 0 22px; padding: 0;
    display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
    font-size: .86rem;
}
.odbor-hero__crumb a { color: rgba(255,255,255,.8); text-decoration: none; }
.odbor-hero__crumb a:hover { color: #fff; }
.odbor-hero__crumb i { font-size: .7rem; color: rgba(255,255,255,.5); }
.odbor-hero__crumb span[aria-current] { color: #fff; font-weight: 600; }

.odbor-hero__badge {
    display: inline-block; margin-bottom: 16px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.28);
    padding: 6px 16px; border-radius: 999px;
    font-size: .82rem; font-weight: 700; letter-spacing: .04em;
    text-transform: uppercase;
}
.odbor-hero__title {
    color: #fff !important;
    font-size: clamp(2.1rem, 4.6vw, 3.6rem) !important;
    line-height: 1.1; font-weight: 800; margin: 0 0 10px;
}
.odbor-hero__kod {
    display: inline-flex; align-items: center; gap: 6px;
    background: #fff; color: #560d50;
    font-weight: 700; letter-spacing: .03em;
    padding: 5px 14px; border-radius: 8px;
    margin: 0 0 18px;
}
.odbor-hero__kod i { font-size: .85em; }
.odbor-hero__hook {
    color: rgba(255,255,255,.94);
    font-size: 1.12rem; line-height: 1.6; max-width: 38em;
    margin: 0 0 28px;
}

/* Tlačidlo „Charakteristika ŠkVP odboru" (PDF na stiahnutie) v hero */
.odbor-hero__skvp {
    display: inline-flex; align-items: center; gap: 14px;
    background: #fff; color: #182850;
    border-radius: 12px; padding: 14px 20px; margin: 0 0 28px;
    text-decoration: none; max-width: 100%;
    box-shadow: 0 10px 26px rgba(10,15,40,.28);
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}
.odbor-hero__skvp:hover,
.odbor-hero__skvp:focus-visible {
    transform: translateY(-2px); background: #f3a712; color: #182850;
    box-shadow: 0 14px 30px rgba(10,15,40,.34);
}
.odbor-hero__skvp-ico { font-size: 1.7rem; line-height: 1; color: #d93025; flex: 0 0 auto; }
.odbor-hero__skvp:hover .odbor-hero__skvp-ico,
.odbor-hero__skvp:focus-visible .odbor-hero__skvp-ico { color: #182850; }
.odbor-hero__skvp-body { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; }
.odbor-hero__skvp-main { font-weight: 800; font-size: 1.08rem; }
.odbor-hero__skvp-meta {
    font-size: .8rem; font-weight: 600; opacity: .7;
    text-transform: uppercase; letter-spacing: .03em; margin-top: 2px;
}
.odbor-hero__skvp-dl { margin-left: 8px; font-size: 1.1rem; color: #560d50; flex: 0 0 auto; }
.odbor-hero__skvp:hover .odbor-hero__skvp-dl,
.odbor-hero__skvp:focus-visible .odbor-hero__skvp-dl { color: #182850; }

.odbor-hero__cta { display: flex; flex-wrap: wrap; gap: 14px; }
.odbor-hero__cta .primary-btn-10 { background: #fff; color: #182850; }
.odbor-hero__cta .primary-btn-10:hover { background: #f3a712; color: #182850; }
.odbor-hero__thumb {
    border-radius: 18px; overflow: hidden;
    box-shadow: 0 30px 70px rgba(0,0,0,.35);
    aspect-ratio: 4 / 3;
}
.odbor-hero__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 991px) { .odbor-hero__thumb { margin-top: 30px; } }

/* ---- 2. Rýchle fakty ---- */
.odbor-facts { margin-top: -48px; position: relative; z-index: 3; }
.odbor-facts__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 16px;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 18px 50px rgba(10,30,60,.14);
    padding: 26px;
    border: 1px solid rgba(10,30,60,.05);
}
.odbor-facts__item { display: flex; gap: 14px; align-items: center; }
.odbor-facts__item + .odbor-facts__item { position: relative; }
.odbor-facts__icon {
    flex: 0 0 auto; width: 50px; height: 50px; border-radius: 12px;
    display: inline-grid; place-items: center;
    background: var(--school-grad-soft); color: #560d50; font-size: 1.2rem;
}
.odbor-facts__body { display: flex; flex-direction: column; min-width: 0; }
.odbor-facts__label { font-size: .78rem; color: #6c757d; text-transform: uppercase; letter-spacing: .03em; }
.odbor-facts__value { font-size: 1.05rem; font-weight: 700; color: #0b2952; line-height: 1.25; }

/* ---- 3.+4. Profil + checklist ---- */
.odbor-split__media { border-radius: 18px; overflow: hidden; box-shadow: 0 20px 50px rgba(10,30,60,.16); }
.odbor-split__media img { width: 100%; height: 100%; object-fit: cover; display: block; aspect-ratio: 4 / 3; }
.odbor-split__text { font-size: 1.05rem; line-height: 1.7; color: #4a5568; }
.odbor-split__subhead { color: #0b2952; font-weight: 700; margin: 26px 0 16px; font-size: 1.2rem !important; }
.odbor-split__cta { margin-top: 30px; }

.odbor-checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.odbor-checklist li {
    display: flex; gap: 12px; align-items: flex-start;
    color: #1f2937; font-size: 1rem; line-height: 1.5;
}
.odbor-checklist__tick {
    flex: 0 0 auto; width: 26px; height: 26px; border-radius: 50%;
    display: inline-grid; place-items: center; margin-top: 1px;
    background: var(--school-grad-hero); color: #fff; font-size: .72rem;
}

/* ---- 5. Benefit karty ---- */
.odbor-benefits { background: var(--school-grad-soft); }
.odbor-benefit {
    background: #fff; border-radius: 16px; padding: 30px 28px; height: 100%;
    border: 1px solid rgba(10,30,60,.06);
    transition: transform .25s ease, box-shadow .25s ease;
}
.odbor-benefit:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(86,13,80,.14); }
.odbor-benefit__icon {
    width: 58px; height: 58px; border-radius: 14px;
    display: inline-grid; place-items: center; margin-bottom: 18px;
    background: var(--school-grad-hero); color: #fff; font-size: 1.4rem;
    box-shadow: 0 10px 22px rgba(86,13,80,.28);
}
.odbor-benefit__title { color: #0b2952; font-weight: 700; font-size: 1.2rem !important; margin: 0 0 8px; }
.odbor-benefit__text { color: #4a5568; font-size: .96rem; line-height: 1.6; margin: 0; }

/* ---- 6. Uplatnenie + 7. Partneri ---- */
.odbor-careers__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.odbor-careers__list li {
    display: flex; gap: 14px; align-items: center;
    background: #fff; border: 1px solid rgba(10,30,60,.07);
    border-left: 4px solid #560d50;
    border-radius: 10px; padding: 16px 18px;
    font-size: 1.02rem; font-weight: 600; color: #0b2952;
}
.odbor-careers__list li i { color: #560d50; }

.odbor-partners {
    background: var(--school-grad-hero); color: #fff;
    border-radius: 16px; padding: 30px 28px; height: 100%;
}
.odbor-partners__head { color: #fff; font-weight: 700; font-size: 1.2rem !important; margin: 0 0 8px; display: flex; gap: 10px; align-items: center; }
.odbor-partners__sub { color: rgba(255,255,255,.85); font-size: .95rem; margin: 0 0 18px; }
.odbor-partners__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.odbor-partners__list li {
    background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.22);
    border-radius: 8px; padding: 10px 14px; font-weight: 600; font-size: .92rem;
}

/* ---- 8b. Dokumenty v detaile odboru — tesne medzi okolitými sekciami ---- */
/* Rušíme vlastné pt/pb sekcie aj mt-40/mb-40 partiálu. Hore stiahneme aj pb-70
   predošlej sekcie (margin-top: -40), dole už netreba — CTA/ďalšia sekcia má
   vlastný horný odstup. */
.odbor-documents { padding-top: 0; padding-bottom: 0; margin-top: -40px; }
.odbor-documents .documents-block { margin-top: 0 !important; margin-bottom: 0 !important; }

/* ---- 9. Testimonials — prefarbenie témového .vl-testimonial-wrap-inner ---- */
.odbor-testimonial { background: var(--school-grad-soft); }
.odbor-testimonial .vl-testimonial-wrap-inner {
    background: #fff; border-radius: 16px; padding: 30px 28px; height: 100%;
    border: 1px solid rgba(10,30,60,.06);
    box-shadow: 0 6px 18px rgba(10,30,60,.05);
}
.odbor-testimonial .vl-testimonial-wrap-inner .icon ul {
    list-style: none; display: flex; gap: 4px; padding: 0; margin: 0 0 14px;
}
.odbor-testimonial .vl-testimonial-wrap-inner .icon i { color: #f3a712; }
.odbor-testimonial .vl-testimonial-wrap-inner .content .para { color: #374151; font-size: 1rem; line-height: 1.65; }
.odbor-testimonial .vl-testimonial-wrap-inner .title { color: #0b2952; margin: 18px 0 2px; font-size: 1.1rem !important; }
.odbor-testimonial .vl-testimonial-wrap-inner > .para { color: #560d50; font-weight: 600; font-size: .9rem; margin: 0; }

/* ---- 10. Podmienky prijatia (čistý HTML text z admina) + info panel ---- */
.odbor-podmienky__body { color: #374151; font-size: 1.02rem; line-height: 1.7; }
.odbor-podmienky__body > *:first-child { margin-top: 0; }
.odbor-podmienky__body > *:last-child { margin-bottom: 0; }
.odbor-podmienky__body h2,
.odbor-podmienky__body h3,
.odbor-podmienky__body h4 { color: #0b2952; font-weight: 700; margin: 26px 0 12px; }
.odbor-podmienky__body h3 { font-size: 1.25rem; }
.odbor-podmienky__body h4 { font-size: 1.1rem; }
.odbor-podmienky__body p { margin: 0 0 14px; }
.odbor-podmienky__body ul,
.odbor-podmienky__body ol { margin: 0 0 16px; padding-left: 22px; }
.odbor-podmienky__body li { margin-bottom: 8px; }
.odbor-podmienky__body a { color: #560d50; text-decoration: underline; }
.odbor-podmienky__body table { width: 100%; border-collapse: collapse; margin: 0 0 16px; }
.odbor-podmienky__body th,
.odbor-podmienky__body td { border: 1px solid rgba(10,30,60,.12); padding: 10px 12px; text-align: left; }
.odbor-podmienky__body th { background: var(--school-grad-soft); color: #0b2952; }

/* ---- 10b. (legacy) FAQ akordeón — ponechané, ak by sa FAQ vrátilo ---- */
.odbor-faq .vl-accordion-item {
    background: #fff; border: 1px solid rgba(10,30,60,.08);
    border-radius: 12px; margin-bottom: 14px; overflow: hidden;
}
.odbor-faq .vl-accordion-button {
    width: 100%; text-align: left; border: none; background: #fff;
    padding: 20px 22px; font-weight: 700; color: #0b2952; font-size: 1.05rem;
    display: flex; justify-content: space-between; align-items: center; gap: 16px;
    cursor: pointer;
}
.odbor-faq .vl-accordion-button:not(.collapsed) { color: #560d50; }
.odbor-faq .vl-faqarrow { flex: 0 0 auto; transition: transform .25s ease; color: #560d50; }
.odbor-faq .vl-accordion-button:not(.collapsed) .vl-faqarrow { transform: rotate(180deg); }
/* Rozbaľovanie cez grid-template-rows (0fr→1fr) — animované, bez Bootstrapu. */
.odbor-faq .accordion-collapse {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows .3s ease;
}
.odbor-faq .accordion-collapse.show { grid-template-rows: 1fr; }
.odbor-faq .vl-accordion-body { overflow: hidden; min-height: 0; padding: 0 22px 22px; }
.odbor-faq .vl-accordion-body .para { color: #4a5568; line-height: 1.65; margin: 0; }

.odbor-info {
    background: var(--school-grad-soft);
    border: 1px solid rgba(86,13,80,.12);
    border-radius: 16px; padding: 30px 28px;
    position: sticky; top: 90px;
}
.odbor-info__head { color: #0b2952; font-weight: 800; font-size: 1.3rem !important; margin: 0 0 8px; }
.odbor-info__sub { color: #4a5568; font-size: .96rem; line-height: 1.6; margin: 0 0 20px; }
.odbor-info__contact { list-style: none; margin: 0 0 22px; padding: 0; display: grid; gap: 12px; }
.odbor-info__contact li { display: flex; gap: 12px; align-items: center; color: #0b2952; font-size: 1rem; }
.odbor-info__contact i { color: #560d50; width: 18px; text-align: center; }
.odbor-info__contact a { color: #0b2952; text-decoration: none; }
.odbor-info__contact a:hover { color: #560d50; }
.odbor-info__plan {
    display: inline-flex; align-items: center; gap: 10px;
    background: var(--school-grad-hero); color: #fff;
    padding: 12px 20px; border-radius: 8px; font-weight: 600; text-decoration: none;
}
.odbor-info__plan:hover { filter: brightness(1.08); color: #fff; }

/* CTA nadpis v detaile odboru — biely (cta-wrap7 má tmavé pozadie) */
.odbor-faq + .container .cta-wrap7 .title span,
.cta-wrap7 .title span {
    -webkit-text-fill-color: #fff; color: #fff; background: none;
}

/* ---- Listing odborov — filter podľa skupiny ---- */
.odbory-filter {
    display: flex; flex-wrap: wrap; gap: 10px;
    justify-content: center; margin-bottom: 40px;
}
.odbory-filter__btn {
    border: 1px solid rgba(86,13,80,.20);
    background: #fff; color: #560d50;
    padding: 9px 18px; border-radius: 999px;
    font-weight: 600; font-size: .92rem; cursor: pointer;
    transition: background .2s, color .2s, border-color .2s;
}
.odbory-filter__btn:hover { border-color: #560d50; }
.odbory-filter__btn.is-active {
    background: var(--school-grad-hero); color: #fff; border-color: transparent;
}
.odbory-grid__item[hidden] { display: none; }
.odbory-empty { text-align: center; color: #6c757d; padding: 24px 0; font-size: 1.02rem; }

/* ============================================================ */
/* ===== PREČO ÍSŤ K NÁM — icon karty ========================= */
/* ============================================================ */
.why-area { background: var(--school-grad-soft); }
.sub-title.justify-content-center { display: flex; justify-content: center; }
.why-card {
    height: 100%;
    background: #fff;
    border: 1px solid rgba(10,30,60,.08);
    border-radius: 18px;
    padding: 32px 28px;
    box-shadow: 0 6px 18px rgba(10,30,60,.05);
    transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.why-card:hover {
    transform: translateY(-4px);
    border-color: rgba(86,13,80,.18);
    box-shadow: 0 16px 38px rgba(86,13,80,.15);
}
.why-card__icon span {
    width: 62px; height: 62px; border-radius: 16px;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--school-grad-hero); color: #fff; font-size: 25px; line-height: 1;
    box-shadow: 0 10px 22px rgba(86,13,80,.28);
    margin-bottom: 22px;
}
.why-card__title { font-size: 1.18rem; margin: 0 0 10px; }
.why-card__text { font-size: .92rem; line-height: 1.6; color: #4a5568; margin: 0; }

/* ============================================================ */
/* ===== REFERENCIE — karty s hodnotením ====================== */
/* ============================================================ */
/* Sekcia má tmavé pozadie (vkl-gray-bg-19 = #010C41); téma však dáva
   nadpisom tmavú farbu → bledý override, aby boli čitateľné. */
.ref-area .vl-section-title-10 .sub-title { color: #c8d2ee; }
.ref-area .vl-section-title-10 .title { color: #fff; }
/* Zdedený gradient .vl-section-title .title span je tmavofialový (#560d50)
   → na tmavom pozadí #010C41 nečitateľný. Prebijeme na svetlý akcent
   (kontrast voči #010C41 ≈ 9:1, spĺňa WCAG 2.2 AA). */
.ref-area .vl-section-title-10 .title span {
    background: none;
    -webkit-background-clip: border-box; background-clip: border-box;
    color: #c9b8ff;
}

.ref-card {
    position: relative;
    height: 100%;
    background: #fff;
    border: 1px solid rgba(10,30,60,.08);
    border-radius: 18px;
    padding: 30px 28px;
    box-shadow: 0 6px 18px rgba(10,30,60,.05);
    display: flex; flex-direction: column;
    transition: transform .18s ease, box-shadow .18s ease;
}
/* Klikateľná karta → detail recenzie (plný text). Odkaz „Čítať celú
   recenziu" sa cez ::after roztiahne na celú kartu, takže klik kdekoľvek
   otvorí detail; ostáva prístupné z klávesnice (fokus na odkaze). */
.ref-card--link:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(10,30,60,.12); }
.ref-card__more {
    margin-top: 22px; align-self: flex-start;
    font-weight: 700; font-size: .92rem; text-decoration: none;
    color: #560d50; display: inline-flex; align-items: center; gap: 8px;
}
.ref-card__more span[aria-hidden] { transition: transform .18s ease; }
.ref-card--link:hover .ref-card__more span[aria-hidden] { transform: translateX(4px); }
.ref-card--link .ref-card__more::after {
    content: ""; position: absolute; inset: 0; border-radius: 18px;
}
.ref-card__more:focus-visible { outline: 2px solid #560d50; outline-offset: 3px; border-radius: 4px; }
.ref-card__stars { color: #f5a623; font-size: .9rem; margin-bottom: 16px; letter-spacing: 2px; }
.ref-card__text {
    font-size: .98rem; line-height: 1.6; color: #2d3748;
    margin: 0 0 24px; flex: 1 1 auto; font-style: italic;
}
.ref-card__author { display: flex; align-items: center; gap: 14px; }
.ref-card__avatar {
    width: 46px; height: 46px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--school-grad-hero); color: #fff;
    font-weight: 700; font-size: 1.1rem; flex: 0 0 auto;
    overflow: hidden;
}
.ref-card__avatar--photo { background: none; }
.ref-card__avatar--photo img {
    width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block;
}
.ref-card__who { display: flex; flex-direction: column; line-height: 1.3; }
.ref-card__who strong { color: #07203f; }
.ref-card__who small { color: #6c757d; }

/* ============================================================ */
/* ===== PARTNERI — mriežka log (placeholder dlaždice) ======== */
/* ============================================================ */
.partner-intro { max-width: 760px; margin-inline: auto; color: #4a5568; }
.partner-grid {
    list-style: none; margin: 0; padding: 0;
    display: flex; flex-wrap: wrap; justify-content: center;
    gap: 18px;
}
.partner-logo {
    position: relative;
    flex: 0 1 190px;
    min-height: 96px;
    display: flex; align-items: center; justify-content: center;
    text-align: center;
    padding: 18px 16px;
    background: #fff;
    border: 1px solid rgba(10,30,60,.10);
    border-radius: 14px;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.partner-logo:hover {
    transform: translateY(-3px);
    border-color: rgba(86,13,80,.2);
    box-shadow: 0 12px 26px rgba(86,13,80,.12);
}
.partner-logo__name { font-weight: 700; color: #07203f; font-size: .98rem; }
.partner-logo__img {
    max-width: 100%; max-height: 60px; width: auto; height: auto;
    object-fit: contain;
    filter: grayscale(100%); opacity: .78;
    transition: filter .25s ease, opacity .25s ease;
}
.partner-logo:hover .partner-logo__img { filter: grayscale(0); opacity: 1; }
.partner-logo__badge {
    position: absolute; top: 8px; right: 8px;
    z-index: 2;
    font-size: .62rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
    background: var(--school-grad-hero); color: #fff;
    padding: 2px 8px; border-radius: 999px;
    box-shadow: 0 2px 6px rgba(86,13,80,.28);
    pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
    .why-card, .why-card:hover,
    .partner-logo, .partner-logo:hover { transform: none; }
}