/* =========================================================================
   GradeUP – verejny web. Brand tema nad Bootstrapom 5.
   Dizajn podla Figma navrhu (docs/design); telo = Inter, nadpisy = Plus Jakarta Sans
   (oba self-hosted).
   ========================================================================= */

/* —— Font: Inter (variabilny, self-hosted; pokryva hrubky 100–900) —— */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('../fonts/InterVariable.woff2') format('woff2');
}

/* —— Display font pre nadpisy: Plus Jakarta Sans (self-hosted, variabilny 200–800) ——
   Nahrada za navrhovy komercny "Co Headline Light" (task #5:web). Nadpisy beru font
   cez premennu --gu-heading-font, takze pripadna vymena je zmena na jednom mieste. */
@font-face {
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 200 800;
    font-display: swap;
    src: url('../fonts/plus-jakarta-sans-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext = slovenska diakritika (č, ď, ľ, ň, š, ť, ž, ĺ, ŕ, ô) */
@font-face {
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 200 800;
    font-display: swap;
    src: url('../fonts/plus-jakarta-sans-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
    --gu-heading-font: 'Plus Jakarta Sans', 'Inter', sans-serif;
    /* Presne farby z Figma navrhu */
    --gu-ink: #212124;          /* text, "GRADE" */
    --gu-ink-2: #2a2a2d;        /* tmavsi variant / hover */
    --gu-primary: #590dcc;      /* fialova (akcent "UP", nadpisy) */
    --gu-primary-dark: #48099f; /* hover fialovej */
    --gu-blue: #3d6bff;         /* modry akcent, odkazy */
    --gu-orange: #faaf3c;       /* CTA / zvyraznenie */
    --gu-orange-dark: #ef9f20;  /* hover oranzovej */
    --gu-lavender: #ecf2ff;     /* svetle pozadie sekcii / hero / footer */
    --gu-lavender-2: #dbe4fb;   /* jemne ramy, pill pozadie */
    --gu-muted: #6b7080;        /* stlmeny text */
    --gu-line: #e2e5ee;         /* ramy inputov / kariet */

    --bs-primary: var(--gu-primary);
    --bs-primary-rgb: 89, 13, 204;
    --bs-body-color: var(--gu-ink);
    --bs-body-bg: #ffffff;
    --bs-body-font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --bs-border-radius: .75rem;
    --bs-border-radius-lg: 1.25rem;
    --bs-border-radius-xl: 1.75rem;
    --bs-link-color: var(--gu-blue);
    --bs-link-color-rgb: 61, 107, 255;
    --bs-link-hover-color: var(--gu-primary);
}

body {
    color: var(--gu-ink);
    font-family: var(--bs-body-font-family);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, .h1, .h2, .h3, .h4 { font-weight: 800; letter-spacing: -.01em; }

/* Display nadpisy pouzivaju Poppins (blizky navrhovemu "Co Headline"); telo ostava Inter. */
.gu-hero h1, .gu-hero .gu-year, .gu-heading, .gu-display, .gu-cta-title, .gu-note-title { font-family: var(--gu-heading-font); }

a { color: var(--gu-blue); text-decoration: none; }
a:hover { color: var(--gu-primary); }

/* Velky "display" nadpis stranky (uppercase, tucny) — napr. REGISTRACIA */
.gu-display {
    font-weight: 800; text-transform: uppercase; letter-spacing: -.01em;
    line-height: 1.02;
}
.gu-display .hl { color: var(--gu-primary); }
.gu-display .hl-blue { color: var(--gu-blue); }

/* —— Tlacidla —— */
.btn { border-radius: 999px; padding: .7rem 1.6rem; font-weight: 700; }
.btn-lg { padding: .9rem 2rem; font-size: 1rem; }

/* Oranzove CTA – tmavy text na oranzovej (podla navrhu) */
.btn-cta {
    --bs-btn-color: var(--gu-ink); --bs-btn-bg: var(--gu-orange); --bs-btn-border-color: var(--gu-orange);
    --bs-btn-hover-color: var(--gu-ink); --bs-btn-hover-bg: var(--gu-orange-dark); --bs-btn-hover-border-color: var(--gu-orange-dark);
    --bs-btn-active-color: var(--gu-ink); --bs-btn-active-bg: var(--gu-orange-dark); --bs-btn-active-border-color: var(--gu-orange-dark);
    color: var(--gu-ink); font-weight: 700;
}
.btn-primary {
    --bs-btn-bg: var(--gu-primary); --bs-btn-border-color: var(--gu-primary);
    --bs-btn-hover-bg: var(--gu-primary-dark); --bs-btn-hover-border-color: var(--gu-primary-dark);
    --bs-btn-active-bg: var(--gu-primary-dark); --bs-btn-active-border-color: var(--gu-primary-dark);
    --bs-btn-disabled-bg: var(--gu-primary); --bs-btn-disabled-border-color: var(--gu-primary);
}
/* Outline fialove – biele pozadie, tmavy text, fialovy ram (podla navrhu) */
.btn-outline-primary {
    --bs-btn-color: var(--gu-ink); --bs-btn-border-color: var(--gu-primary);
    --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--gu-primary); --bs-btn-hover-border-color: var(--gu-primary);
    --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--gu-primary); --bs-btn-active-border-color: var(--gu-primary);
    background: #fff; border-width: 1.5px;
}
/* Sipka za textom tlacidla (napr. "Zistit viac →") */
.btn .gu-arrow { display: inline-block; margin-left: .5rem; transition: transform .15s ease; }
.btn:hover .gu-arrow { transform: translateX(3px); }

/* —— Cookie lišta (IDSK/GOV.UK vzhľad) —— */
.gu-cookie { background: #e0e0e0; color: #0b0c0c; padding: 1.25rem 0; border-bottom: 1px solid #b1b4b6; }
.gu-cookie[hidden], .gu-cookie__message[hidden] { display: none !important; }
.gu-cookie__heading { font-size: 1.2rem; font-weight: 700; margin: 0 0 .5rem; color: #0b0c0c; }
.gu-cookie__heading:focus-visible { outline: 3px solid #ffdd00; outline-offset: 2px; }
.gu-cookie__content { max-width: 45rem; }
.gu-cookie__content p { margin: 0 0 .6rem; font-size: .95rem; line-height: 1.5; }
.gu-cookie__content p:last-child { margin-bottom: 0; }
.gu-cookie__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-top: 1rem; }
.gu-cookie__btn {
    background: #078814; color: #fff; border: 0; border-radius: 0;
    box-shadow: 0 2px 0 #00490b; padding: .5rem .9rem; font-size: .95rem; font-weight: 600;
    cursor: pointer; line-height: 1.2;
}
.gu-cookie__btn:hover { background: #05690f; }
.gu-cookie__btn:focus {
    outline: 3px solid transparent; background: #ffdd00; color: #0b0c0c;
    box-shadow: 0 4px 0 #0b0c0c;
}
.gu-cookie__link { color: #126dff; text-decoration: underline; }
.gu-cookie__link:hover { color: #072c66; }
.gu-cookie__link:focus { outline: 3px solid transparent; background: #ffdd00; color: #0b0c0c; box-shadow: 0 -2px #ffdd00, 0 4px #0b0c0c; text-decoration: none; }
/* Nastavenia cookies — kategórie a prepínač (task #44) */
.gu-cookie__categories { list-style: none; margin: 1rem 0 0; padding: 0; max-width: 45rem; }
.gu-cookie__category { border-top: 1px solid #b1b4b6; padding: .85rem 0; }
.gu-cookie__category:last-child { border-bottom: 1px solid #b1b4b6; }
.gu-cookie__category-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.gu-cookie__category-name { font-weight: 700; font-size: 1rem; margin: 0; }
.gu-cookie__category-state { font-size: .85rem; font-weight: 600; color: #505a5f; white-space: nowrap; }
.gu-cookie__category-desc { margin: .35rem 0 0; font-size: .9rem; line-height: 1.5; color: #0b0c0c; }
.gu-cookie__switch { position: relative; flex-shrink: 0; width: 3rem; height: 1.6rem; }
.gu-cookie__switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; z-index: 1; }
.gu-cookie__switch label {
    position: absolute; inset: 0; border-radius: 999px; background: #505a5f; cursor: pointer;
    transition: background .15s;
}
.gu-cookie__switch label::after {
    content: ''; position: absolute; top: .2rem; left: .2rem; width: 1.2rem; height: 1.2rem;
    border-radius: 50%; background: #fff; transition: transform .15s;
}
.gu-cookie__switch input:checked + label { background: #078814; }
.gu-cookie__switch input:checked + label::after { transform: translateX(1.4rem); }
.gu-cookie__switch input:focus-visible + label { outline: 3px solid #ffdd00; outline-offset: 2px; }

/* —— Navbar —— */
.gu-navbar { background: var(--gu-lavender); padding-block: 1.15rem; }
.gu-brand { font-weight: 800; font-size: 1.5rem; color: var(--gu-ink); text-decoration: none; line-height: 1; }
.gu-brand span { color: var(--gu-primary); }
.gu-logo { height: 58px; width: auto; display: block; }
.gu-logo--footer { height: 100px; }
.gu-navbar .nav-link { color: var(--gu-ink); font-weight: 600; padding-inline: .9rem; }
.gu-navbar .nav-link:hover, .gu-navbar .nav-link.active { color: var(--gu-primary); }

/* —— Stitok / eyebrow pill —— */
.gu-pill {
    display: inline-block; padding: .4rem 1.1rem; border-radius: 999px;
    background: #fff; border: 1px solid var(--gu-primary); color: var(--gu-primary);
    font-weight: 700; font-size: .78rem; letter-spacing: .06em; text-transform: uppercase;
}
.gu-pill--tint { background: #590dcc1a; border-color: #3d6bff; color: #3d6bff; }
/* Hero: bublina ma presne sirku nadpisu (stlpec inline-flex sa roztiahne podla najsirsieho dietata = h1)
   a drzi vysku aj bez textu, kym textaciu nedodaju. */
.gu-hero-head { display: inline-flex; flex-direction: column; align-items: stretch; }
.gu-pill--hero { display: block; width: 100%; min-height: 2.1rem; text-align: center; white-space: normal; line-height: 1.35; }

/* —— Hero —— */
/* Lavender pozadie je iba za hlavickou (navbar); hero je biely (podla navrhu). */
.gu-hero { background: #fff; padding: 4.5rem 0 4rem; }
.gu-hero h1 { font-size: clamp(3rem, 7vw, 5rem); line-height: .98; margin-bottom: .25rem; text-transform: uppercase; }
.gu-hero h1 .up { color: var(--gu-primary); }
.gu-hero .gu-year { font-size: clamp(2rem, 4.5vw, 3rem); font-weight: 800; color: var(--gu-ink); }
.gu-hero .gu-date, .gu-hero .gu-place { padding-left: 4rem; position: relative; font-weight: 700; }
.gu-hero .gu-date::before, .gu-hero .gu-place::before {
    content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
    width: 2.4rem; height: 2px;
}
.gu-hero .gu-date::before { background: var(--gu-orange); }
.gu-hero .gu-place { color: var(--gu-blue); }
.gu-hero .gu-place::before { background: #b9ccff; }
.gu-hero-note {
    background: rgba(236, 242, 255, .5);       /* #ECF2FF @ 50% */
    border: 1px solid rgba(61, 107, 255, .25); /* #3D6BFF @ 25% */
    border-radius: 1rem;
    color: rgba(33, 33, 36, .5);               /* #212124 @ 50% */
}
.gu-hero-art img { max-width: 100%; height: auto; }
/* Hero ilustracia (studenti) – bez pozadia, zarovnana vpravo */
.gu-hero-illust { display: block; width: 100%; max-width: 520px; height: auto; margin-inline: auto; }
/* Hero kruhy (Landing) – inline SVG 1:1 podla navrhu */
.gu-hero-circles { display: block; width: 100%; max-width: 560px; height: auto; margin-inline: auto; }
/* fallback ilustracia, kym nie je realny obrazok */
.gu-hero-art {
    position: relative; min-height: 360px; border-radius: 1.5rem;
    background:
        radial-gradient(circle at 70% 30%, #fff 0 42%, transparent 42%),
        radial-gradient(circle at 30% 75%, #dfe8ff 0 35%, transparent 35%),
        linear-gradient(135deg, #f4f7ff, #e6edff);
    display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.gu-hero-art .gu-datebubble {
    width: 190px; height: 190px; border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, #b79cff, var(--gu-primary));
    color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center;
    box-shadow: 0 20px 50px rgba(89,13,204,.30);
}
.gu-hero-art .gu-datebubble .d { font-size: 3.2rem; font-weight: 800; line-height: 1; }

/* Loga spolufinancovania (EU / Program Slovensko / MSVVaM) */
.gu-fund-logos { display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; }
.gu-fund-logos img { height: 42px; width: auto; }
/* Loga v hero — sirka priblizne ako text nadpisu GRADEUP (~380px).
   Dvojnasobna trieda kvoli specificite (inak by .gu-fund-img max-width:100% prebilo). */
.gu-fund-img.gu-hero-fund { width: 100%; max-width: 380px; }

/* —— Odpocet (podla navrhu: sivo-lavender pruh, oranzove boxy, dvojbodky) —— */
.gu-countdown { background: var(--gu-lavender); }
.gu-count-title { text-align: center; color: var(--gu-ink); font-weight: 600; margin-bottom: 1.25rem; }
.gu-count-row { display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap; gap: .5rem 1rem; }
.gu-count-item { text-align: center; }
.gu-count-box {
    background: var(--gu-orange); border-radius: 16px;
    min-width: 83px; height: 80px; padding: 0 .5rem;
    display: flex; align-items: center; justify-content: center;
}
.gu-count-box .num { font-size: 2.2rem; font-weight: 800; color: var(--gu-ink); line-height: 1; }
.gu-count-item .lbl { margin-top: .6rem; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--gu-muted); }
.gu-count-sep { height: 80px; display: flex; align-items: center; font-size: 2rem; font-weight: 800; color: #c9ccd8; }
/* Na mobile (task #23) 2x2 „stvorcek": dni:hodiny hore, minuty:sekundy dole.
   Mriezka ma 3 stlpce (udaj — dvojbodka — udaj) a prostredna dvojbodka
   (druhy span v poradi) sa skryva, takze zvysne dve delia dvojice v riadkoch. */
@media (max-width: 575.98px) {
    .gu-count-row {
        display: grid; grid-template-columns: auto auto auto;
        justify-content: center; align-items: start; gap: 1.25rem .75rem;
    }
    .gu-count-sep:nth-of-type(2) { display: none; }
}

/* —— Rychle odkazy (CHCEM) — modry pruh #3D6BFF @ 80% podla navrhu —— */
.gu-quick { background: rgba(61, 107, 255, .8); color: #fff; }
.gu-quick .gu-heading { font-size: clamp(2.5rem, 5vw, 3.5rem); }
.gu-quick a {
    color: #fff; font-weight: 700; text-decoration: none; opacity: .95;
    text-transform: uppercase; letter-spacing: .04em;
}
.gu-quick a:hover { opacity: 1; color: #fff; }

/* —— Sekcie —— */
.gu-section { padding: 4rem 0; }
.gu-section--tint { background: var(--gu-lavender); }
.gu-section--purple { background: var(--gu-primary); color: #fff; }
.gu-section--purple .gu-eyebrow, .gu-section--purple .gu-heading { color: #fff; }
.gu-eyebrow { color: #6b6e78; font-weight: 500; text-transform: uppercase; letter-spacing: .18em; font-size: .8rem; }
.gu-heading { font-weight: 800; text-transform: uppercase; }
.gu-heading .hl { color: var(--gu-primary); }
.gu-heading .hl-blue { color: var(--gu-blue); }
.gu-section--purple .gu-heading .hl { color: var(--gu-orange); }

/* —— Sekcia "Co zazijete" (modry band #6489FF, biele karty s liniovymi ikonami) —— */
.gu-experience { background: #6489ff; color: #fff; }
.gu-experience .gu-eyebrow { color: rgba(255,255,255,.8); }
.gu-experience .gu-heading { color: #fff; }
.gu-exp-card { border: 0; border-radius: 1.25rem; padding: 1.75rem 1.5rem 1.75rem; box-shadow: 0 10px 30px rgba(33,33,36,.08); }
.gu-exp-icon {
    width: 56px; height: 56px; border-radius: 14px;
    background: #e6dbf8; color: var(--gu-primary);
    display: flex; align-items: center; justify-content: center;
}
.gu-exp-icon svg { width: 26px; height: 26px; }
.gu-exp-card p { margin-bottom: 1.5rem; }
.gu-exp-line { display: block; width: 46px; height: 3px; border-radius: 2px; background: var(--gu-primary); }
.gu-exp-line--blue { background: var(--gu-blue); }

/* Zvyraznena poznamka (napr. "Vstup je mozny po registracii") */
.gu-note-card {
    background: #fff6e6; border: 1px solid var(--gu-orange); border-radius: var(--bs-border-radius-lg);
    padding: 1.75rem 2rem;
}
.gu-note-card .gu-note-title { font-weight: 800; color: var(--gu-primary); }
.gu-spoznaj-text { max-width: 52rem; }

/* Inline zvyraznenie textu */
.gu-hl { color: var(--gu-primary); font-weight: 700; }
.gu-hl-blue { color: var(--gu-blue); }

/* Ilustracia pod CTA v sekcii Registracia. */
.gu-registracia-illust { display: block; width: 100%; max-width: 520px; height: auto; margin-inline: auto; }

/* —— Karty —— */
.card { border: 1px solid var(--gu-line); border-radius: var(--bs-border-radius-lg); }
.gu-card-lift { transition: transform .15s ease, box-shadow .15s ease; }
.gu-card-lift:hover { transform: translateY(-3px); box-shadow: 0 12px 30px rgba(33,33,36,.10); }

.gu-card-photo { position: relative; }
/* Stvorec namiesto 4:3 a taziskom orezu hore — portrety maju tvar v hornej tretine (task #31). */
.gu-speaker-img { aspect-ratio: 1/1; object-fit: cover; object-position: 50% 15%; width: 100%; border-radius: var(--bs-border-radius-lg) var(--bs-border-radius-lg) 0 0; }

/* —— Rečníci: horizontálny riadok (fotka vľavo + info vpravo) —— */
.gu-speaker-row {
    display: flex; flex-wrap: wrap; background: #fff;
    border: 1px solid var(--gu-line); border-radius: var(--bs-border-radius-lg); overflow: hidden;
}
.gu-speaker-photo { position: relative; flex: 0 0 300px; max-width: 300px; min-height: 300px; background: var(--gu-lavender); }
.gu-speaker-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 15%; }
.gu-speaker-tag {
    /* Bublina pri spodnom okraji fotky, nie hore - tvare byvaju v hornej tretine (task #27). */
    position: absolute; bottom: 1rem; left: 1rem; z-index: 1; max-width: calc(100% - 2rem);
    background: var(--gu-primary); color: #fff; font-size: .78rem; font-weight: 700;
    padding: .35rem .9rem; border-radius: 999px;
}
.gu-speaker-body { flex: 1 1 340px; padding: 1.5rem 1.75rem; }
.gu-speaker-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.gu-speaker-name { font-size: 1.4rem; font-weight: 800; margin: 0 0 .15rem; }
.gu-speaker-role { color: var(--gu-primary); font-weight: 600; font-size: .9rem; }
.gu-speaker-socials { position: relative; z-index: 2; display: flex; gap: .55rem; flex-shrink: 0; }
.gu-soc { display: inline-flex; }
.gu-soc--x { color: #000; }
.gu-soc--in { color: #0a66c2; }
.gu-soc--web { color: var(--gu-primary); }
.gu-speaker-bio { margin: 1rem 0; color: var(--gu-ink); }
.gu-speaker-talks__title { font-weight: 800; margin-bottom: .5rem; }
.gu-talk {
    display: flex; align-items: center; gap: .75rem;
    background: var(--gu-lavender); border-radius: .6rem; padding: .55rem .9rem; margin-bottom: .4rem;
    transition: background .15s ease;
}
.gu-talk:hover { background: var(--gu-lavender-2); }
.gu-talk__time { font-weight: 700; min-width: 3rem; color: var(--gu-ink); }
.gu-talk__dot { width: 10px; height: 10px; border-radius: 50%; background: var(--gu-primary); flex-shrink: 0; }
.gu-talk__name { flex: 1; color: var(--gu-ink); }
.gu-talk__room { color: var(--gu-muted); font-weight: 600; white-space: nowrap; }
@media (max-width: 575.98px) {
    /* Na mobile fotka na celu sirku ako stvorec (predtym 220px na vysku — hlavy boli odrezane, task #31). */
    .gu-speaker-photo { flex-basis: 100%; max-width: 100%; aspect-ratio: 1/1; height: auto; min-height: 0; }
}
.gu-icon-badge {
    width: 48px; height: 48px; border-radius: .75rem; display: inline-flex; align-items: center; justify-content: center;
    background: var(--gu-lavender); color: var(--gu-primary); font-size: 1.4rem;
}

/* —— Formulare —— */
.gu-form-label, .form-label {
    font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
    font-size: .78rem; color: var(--gu-ink); margin-bottom: .5rem;
}
.form-control, .form-select {
    border: 1px solid var(--gu-line); border-radius: 999px;
    padding: .85rem 1.4rem; font-size: .95rem; color: var(--gu-ink);
}
textarea.form-control { border-radius: 1.25rem; }
.form-control::placeholder { color: #9aa0ae; letter-spacing: .04em; }
.form-control:focus, .form-select:focus {
    border-color: var(--gu-primary); box-shadow: 0 0 0 .2rem rgba(89,13,204,.12);
}
.form-check-input:checked { background-color: var(--gu-primary); border-color: var(--gu-primary); }
.form-check-input:focus { border-color: var(--gu-primary); box-shadow: 0 0 0 .2rem rgba(89,13,204,.12); }

/* —— Searchable select (okres) —— */
.gu-ss { position: relative; }
.gu-ss-native { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.gu-ss-list {
    position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + 4px);
    margin: 0; padding: .35rem; list-style: none; max-height: 260px; overflow-y: auto;
    background: #fff; border: 1px solid var(--gu-line); border-radius: 1rem;
    box-shadow: 0 16px 40px rgba(33,33,36,.12);
}
.gu-ss-option { padding: .55rem .9rem; border-radius: .6rem; cursor: pointer; }
.gu-ss-option:hover { background: var(--gu-lavender); color: var(--gu-primary); }

/* Biela karta pre obsah / formular na tintovanom pozadi */
.gu-card-panel {
    background: #fff; color: var(--gu-ink); border-radius: var(--bs-border-radius-xl);
    padding: clamp(1.5rem, 4vw, 3.5rem);
    box-shadow: 0 20px 60px rgba(33,33,36,.06);
}

/* program */
.gu-prog-intro { max-width: 46rem; color: var(--gu-ink); font-size: 1.05rem; }
.gu-prog-row { border: 0; border-radius: 1rem; background: var(--gu-lavender); overflow: hidden; }
.gu-prog-time { font-weight: 800; color: var(--gu-ink); }
/* Badge miestnosti v zozname (skryty, ked je zoznam filtrovany na jednu miestnost). */
.gu-prog-room {
    display: inline-block; margin-bottom: .3rem; padding: .15rem .6rem; border-radius: 999px;
    background: #fff; border: 1px solid var(--gu-primary); color: var(--gu-primary);
    font-size: .7rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
}
#gu-prog-list.is-filtered .gu-prog-room { display: none; }
.gu-prog-dot { width: 14px; height: 14px; border-radius: 50%; background: var(--gu-primary); flex-shrink: 0; }
/* margin-left:auto drzi sipku pri pravom okraji aj vtedy, ked na uzkom displeji
   zalomi pod titulok (inak by ostala vlavo pod casom). */
.gu-prog-chevron { color: var(--gu-ink); flex-shrink: 0; margin-left: auto; transition: transform .15s ease; }
/* Rozbalitelny detail bloku (task #23): sipka dole = „rozbalit", po otvoreni sa otoci hore.
   Skryvame nativny trojuholnik <summary> (WebKit ma vlastny pseudo-element). */
.gu-prog-details > summary { cursor: pointer; list-style: none; }
.gu-prog-details > summary::-webkit-details-marker { display: none; }
.gu-prog-details > summary::marker { content: ''; }
.gu-prog-details > summary:hover { background: var(--gu-lavender-2); }
.gu-prog-details > summary:focus-visible { outline: 2px solid var(--gu-primary); outline-offset: -2px; }
.gu-prog-details[open] .gu-prog-chevron { transform: rotate(180deg); }
.gu-prog-panel { border-top: 1px solid rgba(33,33,36,.08); padding-top: 1rem; }
.gu-prog-panel .gu-prose { color: var(--gu-ink); }
/* Ramik s prihlasenim na workshop — oddeleny od popisu, aby bolo zjavne, ze
   ucast na workshope vyzaduje samostatne prihlasenie (task #23). */
.gu-ws-signup {
    background: #fff6e6; border: 1px solid var(--gu-orange); border-radius: 1.25rem;
    padding: 1.25rem 1.5rem;
}
.gu-ws-signup__title { font-weight: 800; color: var(--gu-primary); margin-bottom: .25rem; }
.gu-ws-signup__note { font-size: .875rem; color: var(--gu-muted); margin-bottom: 1rem; }
.gu-ws-signup__note strong { color: var(--gu-ink); }
.gu-prog-cta { background: var(--gu-orange); color: var(--gu-ink); font-weight: 700; padding: .5rem 1.25rem; border-radius: 999px; white-space: nowrap; }
/* Filter Konferencia / Workshopy */
.gu-prog-filter { display: flex; flex-wrap: wrap; gap: .75rem; }
/* Mriezka programu len od tabletu; na mobile ostava zoznam s filtrom miestnosti. */
.gu-prog-prehlad { display: none; }
@media (min-width: 768px) { .gu-prog-prehlad:not([hidden]) { display: block; } }
.gu-prog-fbtn {
    border: 1px solid var(--gu-orange); background: #fdf3e0; color: var(--gu-muted);
    font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
    padding: .7rem 1.75rem; border-radius: 1rem; cursor: pointer;
}
.gu-prog-fbtn.is-active { background: var(--gu-orange); color: var(--gu-ink); }
/* Akcny pruh workshopu (kapacita + prihlasit/odhlasit) — pätička vnútri karty */
.gu-prog-foot { border-top: 1px solid rgba(33,33,36,.08); }

/* —— Program: mriezka (stlpce miestnosti, riadky = zaciatky blokov, vyska podla obsahu) —— */
.gu-grid-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: .5rem; }
.gu-grid-wrap:focus-visible { outline: 2px solid var(--gu-primary); outline-offset: 4px; border-radius: 1rem; }
.gu-grid {
    display: grid; position: relative;
    grid-template-columns: 4rem repeat(var(--gu-grid-cols), minmax(12rem, 1fr));
    grid-auto-rows: auto; column-gap: .75rem; row-gap: .5rem;
    min-width: calc(4rem + var(--gu-grid-cols) * 12.75rem);
}
.gu-grid__corner, .gu-grid__room { position: sticky; top: 0; z-index: 3; background: #fff; }
.gu-grid__room {
    font-weight: 800; color: var(--gu-ink); text-align: center; font-size: .95rem;
    border-bottom: 2px solid var(--gu-primary); padding: .4rem .5rem .55rem; margin-bottom: .5rem;
}
.gu-grid__time { font-size: .8rem; font-weight: 700; color: var(--gu-muted); padding-top: .5rem; align-self: start; }
.gu-grid__line { border-top: 1px dashed rgba(33,33,36,.14); margin-top: -.25rem; pointer-events: none; align-self: start; }
.gu-grid__cell { display: flex; flex-direction: column; gap: .5rem; min-width: 0; z-index: 1; }
.gu-grid__blok {
    flex: 1 1 auto; display: flex; flex-direction: column; gap: .2rem;
    padding: .65rem .8rem; border-radius: .85rem; background: var(--gu-lavender); color: var(--gu-ink);
    text-decoration: none; border-left: 4px solid var(--gu-primary); font-size: .88rem; line-height: 1.35;
    transition: background .15s ease, transform .15s ease, box-shadow .15s ease;
}
/* Hover/focus len na odkaze: blok bez detailu (task #41) je div bez href — nema sa co rozbalit, tak ani
   nesignalizuje klikatelnost. Ostava mu title (tooltip) aj oznacenie textu. */
a.gu-grid__blok:hover { background: var(--gu-lavender-2); transform: translateY(-1px); box-shadow: 0 .5rem 1rem rgba(33,33,36,.08); color: var(--gu-ink); }
a.gu-grid__blok:focus-visible { outline: 2px solid var(--gu-primary); outline-offset: 2px; }
/* Detail bloku priamo v osi (task #40): novy riadok na celu sirku pod kliknutym blokom,
   so sipkou pod stredom bloku (--gu-detail-arrow nastavuje skript). */
.gu-grid__blok.is-selected { outline: 3px solid var(--gu-primary); outline-offset: 2px; box-shadow: 0 .5rem 1.25rem rgba(89,13,204,.18); }
/* Okraje: os je v rolovacom kontajneri (overflow), preto panel nesiaha az po jeho hrany — vpravo odstup na ram. */
.gu-grid__detail { position: relative; margin: 1rem .5rem .5rem 0; padding-top: .75rem; z-index: 2; outline: none; }
.gu-grid__detail::before {
    content: ""; position: absolute; top: -.25rem; left: var(--gu-detail-arrow, 3rem);
    width: 1.1rem; height: 1.1rem; transform: translateX(-50%) rotate(45deg);
    background: var(--gu-lavender); border-left: 3px solid var(--gu-primary); border-top: 3px solid var(--gu-primary);
}
.gu-grid__detail .gu-prog-row { box-shadow: 0 0 0 3px var(--gu-primary); }
.gu-grid__detail-close {
    /* Roh panelu (mimo hlavicky riadku, aby neprekryval sipku rozbalenia). */
    position: absolute; top: -.35rem; right: .35rem; z-index: 3; width: 32px; height: 32px; border-radius: 50%;
    border: 0; background: #fff; color: var(--gu-ink); font-size: 1.3rem; line-height: 1; cursor: pointer;
    box-shadow: 0 .25rem .75rem rgba(33,33,36,.12);
}
.gu-grid__detail-close:hover { background: var(--gu-primary); color: #fff; }
/* Bloky s prihlasovanim (workshop, diskusia, ...) — modifikator dava sablona podla TypBloku::maPrihlasovanie(). */
.gu-grid__blok--prihlasovanie { border-left-color: var(--gu-orange); background: #fff4e3; }
a.gu-grid__blok--prihlasovanie:hover { background: #ffe9c9; }
.gu-grid__blok--prestavka, .gu-grid__blok--networking { background: #f1f1f5; border-left-color: #b6b8c4; }
.gu-grid__cas { font-weight: 800; font-size: .78rem; color: var(--gu-primary); }
.gu-grid__blok--prihlasovanie .gu-grid__cas { color: #b45f06; }
.gu-grid__titulok { font-weight: 700; }
.gu-grid__recnici { color: var(--gu-muted); font-size: .8rem; }
.gu-grid__tag { margin-top: .25rem; align-self: flex-start; font-size: .66rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: #b45f06; }

/* aktuality */
.gu-meta { color: var(--gu-muted); font-size: .85rem; }

/* —— Sekcia Aktuality (biely band + oranzova linka hore, karty s kategoriou-pilulkou) —— */
.gu-news-section { background: #fff; border-top: 3px solid var(--gu-orange); }
.gu-news-card { border: 0; border-radius: 1.25rem; overflow: hidden; box-shadow: 0 12px 30px rgba(33,33,36,.08); }
.gu-news-card .card-body { padding: 1.5rem; }
.gu-news-photo { position: relative; aspect-ratio: 4/3; background: var(--gu-lavender); overflow: hidden; }
.gu-news-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gu-news-tag {
    position: absolute; top: 1rem; left: 1rem; z-index: 1;
    background: var(--gu-primary); color: #fff; font-size: .8rem; font-weight: 700;
    padding: .4rem 1rem; border-radius: 999px;
}
.gu-news-date { display: flex; align-items: center; gap: .6rem; color: var(--gu-muted); font-size: .85rem; margin-bottom: .5rem; }
.gu-news-dash { display: inline-block; width: 24px; height: 2px; background: var(--gu-primary); }

/* —— FAQ (akordeon otazka/odpoved, levandulove pilulky) —— */
.gu-faq-list { display: flex; flex-direction: column; gap: 1rem; }
.gu-faq-item { background: var(--gu-lavender); border-radius: 1.25rem; }
.gu-faq-q {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    padding: 1.15rem 1.75rem; cursor: pointer;
    font-weight: 700; color: var(--gu-ink);
    list-style: none;
}
.gu-faq-q::-webkit-details-marker { display: none; }
.gu-faq-chevron { flex-shrink: 0; color: var(--gu-ink); transition: transform .2s ease; }
.gu-faq-item[open] .gu-faq-chevron { transform: rotate(180deg); }
.gu-faq-a { padding: 0 1.75rem 1.35rem; color: var(--gu-muted); }

/* —— Prakticke informacie (mapa + info stlpec) —— */
.gu-map { border-radius: 1.25rem; overflow: hidden; box-shadow: 0 12px 30px rgba(33,33,36,.08); aspect-ratio: 4/3; background: var(--gu-lavender); }
.gu-map iframe { width: 100%; height: 100%; border: 0; display: block; }
.gu-map-consent { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 2rem; color: var(--gu-muted); }
.gu-info { display: flex; flex-direction: column; gap: 1.5rem; }
.gu-info-head { display: flex; align-items: center; gap: .6rem; font-weight: 800; color: var(--gu-ink); margin-bottom: .35rem; }
.gu-info-head svg { color: var(--gu-blue); flex-shrink: 0; }
.gu-info-body { color: var(--gu-ink); text-transform: uppercase; letter-spacing: .02em; }
.gu-info-body a { color: inherit; text-decoration: none; }
.gu-info-body a:hover { text-decoration: underline; }

/* —— Sekcia "Mate otazku?" (modry band + biela karta s formularom) —— */
.gu-kontakt { background: #6489ff; color: #fff; }
.gu-kontakt-title { font-family: var(--gu-heading-font); font-weight: 800; font-size: clamp(2.2rem, 5vw, 3.2rem); color: #fff; margin-bottom: .5rem; }
.gu-kontakt .gu-eyebrow { color: rgba(255,255,255,.85); }

/* Display nadpis BEZ uppercase (napr. "Naše tlačové správy") */
.gu-title { font-family: var(--gu-heading-font); font-weight: 800; font-size: clamp(2.2rem, 5vw, 3.4rem); line-height: 1.05; color: var(--gu-ink); }

/* —— Sekcia "V mediach" (tlacove spravy) —— */
.gu-press-featured { display: block; position: relative; border-radius: 1.5rem; overflow: hidden; background: var(--gu-lavender-2, #dbe4fb); aspect-ratio: 4/3; }
.gu-press-featured img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gu-press-featured__text {
    position: absolute; left: 0; right: 0; bottom: 0;
    padding: 3rem 5.5rem 1.5rem 1.5rem;
    color: #fff; font-weight: 600; line-height: 1.35;
    background: linear-gradient(to top, rgba(20,20,30,.82) 15%, rgba(20,20,30,0));
}
.gu-press-featured__text a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.gu-press-featured__text a:hover { text-decoration: none; }
.gu-press-arrow {
    position: absolute; right: 1.25rem; bottom: 1.25rem; z-index: 1;
    width: 56px; height: 56px; border-radius: 50%;
    background: #fff; color: var(--gu-blue);
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 8px 24px rgba(33,33,36,.2);
}
.gu-press-card {
    display: block; background: #fff; border-radius: 1.25rem; padding: 1.5rem 1.75rem;
    box-shadow: 0 12px 30px rgba(33,33,36,.06); color: var(--gu-ink); text-decoration: none;
    transition: transform .15s ease, box-shadow .15s ease;
}
.gu-press-card:hover { transform: translateY(-2px); box-shadow: 0 16px 36px rgba(33,33,36,.10); }
.gu-press-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; }
.gu-press-logo img { max-height: 32px; max-width: 150px; object-fit: contain; display: block; }
.gu-press-logo span { font-weight: 800; }
.gu-press-year { color: var(--gu-muted); font-weight: 600; flex-shrink: 0; }
.gu-press-title { font-weight: 700; color: var(--gu-ink); margin: 0 0 .85rem; }
.gu-press-more { display: inline-flex; align-items: center; gap: .4rem; color: var(--gu-orange-dark); font-weight: 700; }

/* —— Sekcia Partneri (funding loga hore + logá partnerov) —— */
.gu-partneri-funding { text-align: center; margin-bottom: 3.5rem; }
.gu-partneri-funding img { width: 100%; max-width: 760px; height: auto; }
/* Mriezka log: sirka stlpca je ohranicena (140–240px), takze na desktope vyjdu
   max 4 v riadku a dalsie partnerske loga sa zalamu do dalsich riadkov. Pri
   mensom pocte partnerov sa boxy nerozpiju na celu sirku; zarovnane su zlava,
   aby nadvazovali na podnadpis skupiny (aj jedine logo stoji v prvom stlpci). */
.gu-partner-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 170px));
    justify-content: start; gap: 1.5rem; max-width: 66rem;
}
@media (min-width: 576px) {
    .gu-partner-grid { grid-template-columns: repeat(auto-fit, minmax(200px, 240px)); }
}
.gu-partner-logo {
    display: flex; align-items: center; justify-content: center; text-align: center;
    min-height: 150px; padding: 1.5rem; background: #fff;
    border: 1px solid var(--gu-line); border-radius: 1.25rem;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.gu-partner-logo:hover {
    transform: translateY(-2px); border-color: var(--gu-lavender-2);
    box-shadow: 0 .5rem 1.5rem rgba(33, 33, 36, .08);
}
.gu-partner-logo img { max-height: 96px; max-width: 100%; object-fit: contain; display: block; }
.gu-partner-name { font-weight: 700; color: var(--gu-muted); }
/* Skupiny partnerov podla typu (generalni, odborni, ...) — podnadpis + vlastny slider. */
.gu-partner-group + .gu-partner-group { margin-top: 3rem; }
.gu-partner-group__title {
    font-size: 1.1rem; font-weight: 800; color: var(--gu-ink); text-align: left;
    margin: 0 0 1.5rem; letter-spacing: .01em;
}
/* Slider partnerov: strany po 8, vodorovny scroll so snapom (funguje aj bez JS — prstom / touchpadom),
   JS doplna sipky, bodky a autoplay. */
.gu-partner-slider { position: relative; }
.gu-partner-track {
    display: flex; align-items: flex-start; overflow-x: auto; scroll-snap-type: x mandatory;
    scrollbar-width: none; -webkit-overflow-scrolling: touch;
    /* Zvisly padding + zaporny margin: aby overflow neorezal tien a focus ring kariet hore/dole.
       Vodorovne nie — cez bocny padding by presvital okraj dalsej strany. */
    padding: 2rem 0; margin: -2rem 0;
}
@media (prefers-reduced-motion: no-preference) { .gu-partner-track { scroll-behavior: smooth; } }
.gu-partner-track::-webkit-scrollbar { display: none; }
.gu-partner-track:focus-visible { outline: 2px solid var(--gu-primary); outline-offset: 4px; border-radius: 1rem; }
/* min-width: 0 — inak si flex polozka vezme min-content sirku mriezky a na mobile pretecie. */
.gu-partner-page { flex: 0 0 100%; width: 100%; min-width: 0; scroll-snap-align: start; scroll-snap-stop: always; }
/* Pri viacerych stranach ma mriezka pevny pocet stlpcov (2 / 4), aby strana po 8 bola vzdy 2x4 alebo 4x2
   a nie napr. 3+3+2 pri sirke 992–1199px. Pri jednej strane ostava auto-fit (centrovane boxy). */
.gu-partner-slider--pages .gu-partner-grid { grid-template-columns: repeat(2, minmax(0, 240px)); }
@media (min-width: 992px) {
    .gu-partner-slider--pages .gu-partner-grid { grid-template-columns: repeat(4, minmax(0, 240px)); }
}
.gu-partner-nav {
    position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
    width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--gu-line);
    background: #fff; color: var(--gu-primary); display: none; align-items: center; justify-content: center;
    box-shadow: 0 .5rem 1.25rem rgba(33, 33, 36, .10); cursor: pointer; transition: background .15s ease, color .15s ease;
}
.gu-partner-nav:hover { background: var(--gu-primary); color: #fff; }
.gu-partner-nav[aria-disabled="true"] { opacity: .35; cursor: default; }
.gu-partner-nav[aria-disabled="true"]:hover { background: #fff; color: var(--gu-primary); }
.gu-partner-nav--prev { left: -.5rem; }
.gu-partner-nav--next { right: -.5rem; }
@media (min-width: 1200px) {
    .gu-partner-nav--prev { left: -1.5rem; }
    .gu-partner-nav--next { right: -1.5rem; }
}
/* Sipky az od tabletu — na mobile prekryvaju okraje kariet; posuva sa prstom, stav ukazuju bodky. */
@media (min-width: 576px) {
    .gu-partner-slider.is-ready .gu-partner-nav { display: inline-flex; }
}
/* Bodky zlava, aby sedeli s mriezkou zarovnanou k podnadpisu. */
.gu-partner-dots { display: flex; justify-content: flex-start; gap: .5rem; margin-top: 1.75rem; padding-left: .25rem; }
.gu-partner-dots:empty { display: none; }
.gu-partner-dot {
    width: 10px; height: 10px; border-radius: 50%; border: 0; padding: 0; cursor: pointer;
    background: var(--gu-lavender-2); transition: background .15s ease, transform .15s ease;
}
.gu-partner-dot[aria-current="true"] { background: var(--gu-primary); transform: scale(1.25); }

/* —— CTA box (ohraniceny, so zaoblenim) —— */
.gu-cta-band { background: linear-gradient(135deg, var(--gu-primary), #7b3cff); color: #fff; border-radius: var(--bs-border-radius-lg); }
.gu-cta-box {
    background: #f1f1f5; border: 2px solid var(--gu-orange); border-radius: 1.75rem;
    padding: clamp(2rem, 3vw, 3rem); text-align: center;
}
.gu-cta-box h2, .gu-cta-box .gu-cta-title {
    color: var(--gu-primary); font-weight: 800; text-transform: uppercase;
    font-size: clamp(1.7rem, 2.6vw, 2.3rem); line-height: 1.1;
}

/* —— Footer (svetly, podla navrhu) —— */
.gu-footer { background: var(--gu-lavender); color: var(--gu-ink); padding: 3rem 0 2.5rem; }
.gu-footer-inner { padding-top: 1rem; }
.gu-footer a { color: var(--gu-ink); text-decoration: none; }
.gu-footer a:hover { color: var(--gu-primary); }
.gu-footer .gu-brand { color: var(--gu-ink); }
.gu-footer .gu-brand span { color: var(--gu-ink); font-size: clamp(2.5rem, 4vw, 3.4rem); font-weight: 800; line-height: 1; }
/* Nazov narodneho projektu: povodne Bootstrap .small (.875rem), na ziadost ministerstva
   zvacseny o tretinu (task #46). */
.gu-footer-projekt { font-size: calc(.875rem * 4 / 3); line-height: 1.45; }
.gu-footer-nav { display: grid; gap: .75rem; }
.gu-social { display: flex; gap: 1rem; align-items: center; }
.gu-soc { display: inline-flex; transition: transform .15s ease; }
.gu-soc:hover { transform: translateY(-2px); }
.gu-soc svg { width: 28px; height: 28px; display: block; }
/* Vyssia specificita (.gu-footer prefix) kvoli .gu-footer a { color: ink } a :hover. */
.gu-footer .gu-soc--fb { color: #1877F2; }
.gu-footer .gu-soc--yt { color: #FF0000; }
.gu-footer .gu-soc--in { color: #0A66C2; }
.gu-funding-strip { background: #fff; border-radius: 1rem; padding: 1rem 1.25rem; display: inline-flex; max-width: 100%; }
.gu-fund-img { max-width: 100%; height: auto; display: block; }
/* docasny placeholder loga spolufinancovania, kym nebudu realne obrazky */
.gu-logo-ph {
    border: 1px dashed #c9ccd8; border-radius: .5rem; padding: .5rem .6rem;
    font-size: .62rem; color: var(--gu-muted); text-align: center; line-height: 1.25; background: #fafbff;
}

/* Anti-spam honeypot — mimo obrazovky, skryte pred pouzivatelmi aj asistivnymi technologiami */
.gu-hp { position: absolute; left: -9999px; top: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* obsah CMS stranok / clankov */
/* Spoznajte nas - organizacny tim na stranke Kontakt (task #28) */
.gu-tim-foto { margin: 0 0 2.5rem; border-radius: 1rem; overflow: hidden; background: var(--gu-lavender); }
.gu-tim-foto img { display: block; width: 100%; height: auto; }
.gu-tim-clen {
    background: #fff; border: 1px solid var(--gu-line); border-radius: var(--bs-border-radius-lg);
    padding: 1.5rem; display: flex; flex-direction: column; gap: 1rem;
}
.gu-tim-clen__head { display: flex; align-items: center; gap: 1rem; }
.gu-tim-clen__foto { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; flex-shrink: 0; background: var(--gu-lavender); }
.gu-tim-clen__meno { display: flex; flex-direction: column; gap: .25rem; min-width: 0; }
.gu-tim-clen__meno .gu-soc { align-items: center; gap: .35rem; font-size: .85rem; font-weight: 600; text-decoration: none; }
.gu-tim-clen__meno .gu-soc svg { width: 20px; height: 20px; } /* prebija 28px z paticky */
.gu-tim-clen__meno .gu-soc:hover { transform: none; text-decoration: underline; }
.gu-tim-clen__bio { color: var(--gu-ink); font-size: .95rem; }
.gu-tim-clen__bio > :last-child { margin-bottom: 0; }

/* Materialy (prilohy) programoveho bloku - task #31935 */
.gu-materialy__title { font-weight: 600; margin-bottom: .5rem; }
.gu-materialy__list { list-style: none; margin: 0; padding: 0; }
.gu-materialy__list li { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; padding: .4rem 0; }
.gu-materialy__list a { font-weight: 500; }
.gu-materialy__ext { display: inline-block; min-width: 3rem; text-align: center; padding: .1rem .4rem; border-radius: .4rem; background: rgba(89, 13, 204, .1); color: var(--gu-primary); font-size: .72rem; font-weight: 700; letter-spacing: .03em; }
.gu-materialy__size { color: var(--gu-muted); font-size: .85rem; }
.gu-prose { max-width: 760px; }
.gu-prose img { max-width: 100%; height: auto; border-radius: .75rem; }
.gu-prose h2, .gu-prose h3 { margin-top: 1.5rem; }

/* —— Chybove stranky (404 / 500 / ...) —— */
.gu-error-page { display: flex; flex-direction: column; min-height: 100vh; background: #fff; }
.gu-error-head { padding: 1.25rem 0; }
.gu-error {
    flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
    text-align: center; padding: 1rem 0 4rem; max-width: 720px;
}
.gu-error-art {
    position: relative; display: grid; place-items: center; margin-bottom: 1.5rem;
    width: clamp(14rem, 38vw, 19rem); aspect-ratio: 1;
}
/* Sustredne prstence — rovnaky motiv ako kruhy v hero sekcii na uvodke. */
.gu-error-art::before,
.gu-error-art::after {
    content: ''; position: absolute; border-radius: 50%;
    border: 1px solid rgba(89, 13, 204, .5);
}
.gu-error-art::before { inset: 0; background: rgba(89, 13, 204, .05); }
.gu-error-art::after { inset: 12%; background: rgba(89, 13, 204, .12); }
.gu-error-code {
    position: relative; font-family: var(--gu-heading-font); font-weight: 800;
    font-size: clamp(4rem, 12vw, 6.5rem); line-height: 1; letter-spacing: -.03em;
    color: var(--gu-primary);
}
.gu-error-dot { position: absolute; border-radius: 50%; }
.gu-error-dot--orange {
    width: 2.6rem; height: 2.6rem; top: -.6rem; right: -1rem;
    background: rgba(250, 175, 60, .2); border: 1px solid var(--gu-orange);
}
.gu-error-dot--blue {
    width: 1.7rem; height: 1.7rem; bottom: .4rem; left: -1.4rem;
    background: var(--gu-lavender); border: 1px solid var(--gu-blue);
}
.gu-error-text { color: var(--gu-muted); font-size: 1.05rem; max-width: 34rem; }
.gu-error-foot { background: var(--gu-lavender); padding: 1.5rem 0; text-align: center; color: var(--gu-muted); font-size: .9rem; }
