@charset "UTF-8";

:root {
    --canvas: #f7f8fa;
    --surface: #fff;
    --surface-alt: #eef1f4;
    --text: #18212b;
    --muted: #4e5c69;
    --primary: #234e70;
    --on-primary: #fff;
    --secondary: #356859;
    --on-secondary: #fff;
    --accent: #e7b93f;
    --on-accent: #302400;
    --focus: #234e70;
    --border: #c9d1d8;
    --heading-weight: 700;
    --shell: min(100% - 2rem, 76rem);
    --radius-sm: .75rem;
    --radius-md: 1.25rem;
    --radius-lg: 2rem;
    --shadow-sm: 0 .4rem 1.2rem rgb(24 33 43 / .08);
    --shadow-lg: 0 1.25rem 3.5rem rgb(24 33 43 / .14);
    --ease: cubic-bezier(.2, .8, .2, 1);
    --theme-artwork: none;
    --theme-artwork-pending: none;
    --footer-panel: color-mix(in srgb, var(--primary) 82%, #000 18%);
    --on-footer-panel: var(--on-primary);
}

*, *::before, *::after { box-sizing: border-box; }

html { color-scheme: light; scroll-behavior: smooth; }

body {
    position: relative;
    isolation: isolate;
    margin: 0;
    min-width: 0;
    overflow-x: clip;
    color: var(--text);
    background: var(--canvas);
    font: 400 1rem/1.65 "Segoe UI", "Noto Sans", Arial, sans-serif;
    text-rendering: optimizeLegibility;
}

/* Theme artwork belongs to the whole page; it is deliberately independent of slides. */
.theme-atmosphere {
    position: fixed;
    z-index: -2;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    background: var(--canvas);
}
.theme-atmosphere__wash { position: absolute; inset: 0; }
.theme-atmosphere__wash { background: var(--canvas); }
html.theme-artwork-ready { --theme-artwork: var(--theme-artwork-pending); }
main { position: relative; z-index: 1; isolation: isolate; background: transparent; }

/* Real typography: every profile pairs a display face for headings with the
   Sofia Sans reading face (self-hosted woff2, cyrillic + latin subsets in
   fonts.css). System stacks remain as fallbacks while the webfonts stream in. */
body[data-typography] { --font-body: "Sofia Sans", "Segoe UI", "Noto Sans", Arial, sans-serif; font-family: var(--font-body); }
body[data-typography] :is(h1, h2, h3, .hero-copy h2, .page-hero h1) { font-family: var(--font-display, var(--font-body)); }
body[data-typography="comfortaa-sofia"] { --font-display: "Comfortaa", "Trebuchet MS", sans-serif; }
body[data-typography="rubik-sofia"] { --font-display: "Rubik", "Trebuchet MS", sans-serif; --font-body: "Rubik", "Sofia Sans", "Segoe UI", sans-serif; }
body[data-typography="marmelad-sofia"] { --font-display: "Marmelad", "Segoe UI", sans-serif; }
body[data-typography="yeseva-sofia"] { --font-display: "Yeseva One", Georgia, serif; }
body[data-typography="sofia-rounded"],
body[data-typography="sofia-clean"] { --font-display: "Sofia Sans", "Segoe UI", sans-serif; }
/* Theme-token profiles keep their system stacks until the F16 typography pass. */
/* Russo и Montserrat не са налични локално, а Arial чупи мярката на темите:
   двата профила ползват наличния геометричен Rubik за заглавия и Sofia Sans за
   текст — същият характер, реални метрики. */
body[data-typography="russo-sofia"],
body[data-typography="montserrat-sofia"] { --font-body: "Sofia Sans", "Segoe UI", Arial, sans-serif; --font-display: "Rubik", "Trebuchet MS", Arial, sans-serif; }
body[data-typography="ptserif-sofia"] { --font-body: Georgia, "Times New Roman", serif; --font-display: Georgia, serif; }
/* „Pangolin" не се хоства от сайта, а Comic Sans MS липсва на повечето
   устройства (Android/Linux) — темата падаше на системен sans и в текста.
   Профилът сочи към заредено семейство: Marmelad за заглавия (закръглен,
   близък по характер) и Sofia Sans за текста, както във всички профили. */
body[data-typography="pangolin-sofia"] { --font-body: "Sofia Sans", "Segoe UI", sans-serif; --font-display: "Marmelad", "Comic Sans MS", "Trebuchet MS", sans-serif; }

img, picture { display: block; max-width: 100%; }
img { height: auto; }
button, input, textarea, select { font: inherit; }
a { color: var(--primary); text-underline-offset: .18em; }
a:hover { text-decoration-thickness: .14em; }
h1, h2, h3 { margin-block: 0 .65em; font-weight: var(--heading-weight); line-height: 1.12; text-wrap: balance; }
h1 { font-size: clamp(2.2rem, 7vw, 5rem); letter-spacing: -.045em; }
h2 { font-size: clamp(1.65rem, 4vw, 3rem); letter-spacing: -.025em; }
h3 { font-size: clamp(1.15rem, 2vw, 1.45rem); }
p { margin-block: 0 1rem; }

:focus-visible { outline: .2rem solid var(--focus); outline-offset: .22rem; }
::selection { color: var(--on-primary); background: var(--primary); }

.shell { width: var(--shell); margin-inline: auto; }
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}
.skip-link {
    position: fixed;
    inset: .75rem auto auto .75rem;
    z-index: 1000;
    translate: 0 -180%;
    padding: .75rem 1rem;
    color: var(--on-primary);
    background: var(--primary);
    border-radius: .5rem;
    font-weight: 700;
}
.skip-link:focus { translate: 0; }
.eyebrow {
    margin: 0 0 .65rem;
    color: var(--primary);
    font-size: .79rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.button {
    display: inline-flex;
    min-height: 3rem;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    padding: .75rem 1.2rem;
    border: .12rem solid transparent;
    border-radius: 999px;
    font-weight: 750;
    text-decoration: none;
    transition: translate .18s var(--ease), box-shadow .18s var(--ease), background-color .18s;
}
.button:hover { translate: 0 -.12rem; box-shadow: var(--shadow-sm); }
.button--primary { color: var(--on-primary); background: var(--primary); }
.button--secondary { color: var(--on-secondary); background: var(--secondary); }
.text-link, .card-link {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    gap: .5rem;
    color: var(--primary);
    font-weight: 750;
}

/* Header and navigation */
.site-header {
    position: relative;
    z-index: 50;
    color: var(--text);
    background: color-mix(in srgb, var(--surface) 98%, var(--canvas));
    border-bottom: 1px solid var(--border);
}
.header-ribbon { display: flex; height: .3rem; }
.header-ribbon span { flex: 1; background: var(--primary); }
.header-ribbon span:nth-child(2) { background: var(--accent); }
.header-ribbon span:nth-child(3) { background: var(--secondary); }
.site-header__inner {
    display: flex;
    min-height: 5.5rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}
.brand { display: inline-flex; min-width: 0; align-items: center; gap: .75rem; color: var(--text); text-decoration: none; }
.brand__logo { width: auto; max-width: min(14rem, 42vw); height: 4rem; object-fit: contain; object-position: left center; }
.brand__mark {
    position: relative;
    display: grid;
    width: 3.25rem;
    aspect-ratio: 1;
    flex: 0 0 auto;
    place-items: center;
    overflow: hidden;
    background: var(--primary);
    border: .28rem solid var(--surface);
    border-radius: 50% 45% 50% 42%;
    box-shadow: 0 0 0 .12rem var(--primary);
    rotate: -6deg;
}
.brand__mark::before, .brand__mark::after, .brand__mark span::before, .brand__mark span::after {
    content: "";
    position: absolute;
    width: .45rem;
    aspect-ratio: 1;
    background: var(--on-primary);
    border-radius: 50%;
}
.brand__mark::before { inset: .7rem auto auto .65rem; }
.brand__mark::after { inset: .7rem .65rem auto auto; }
.brand__mark span::before { inset: auto auto .65rem .7rem; }
.brand__mark span::after { inset: auto .65rem .65rem auto; }
.brand__words { display: grid; min-width: 0; line-height: 1.2; }
.brand__words strong { min-width: 0; overflow: hidden; font-size: clamp(1rem, 2.1vw, 1.35rem); text-overflow: ellipsis; white-space: nowrap; }
.brand__words small { min-width: 0; margin-top: .28rem; overflow: hidden; color: var(--muted); font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; }
.nav-toggle {
    display: none;
    min-width: 3rem;
    min-height: 3rem;
    align-items: center;
    gap: .55rem;
    color: var(--on-primary);
    background: var(--primary);
    border: 0;
    border-radius: 999px;
    cursor: pointer;
}
.nav-toggle__lines, .nav-toggle__lines::before, .nav-toggle__lines::after {
    display: block;
    width: 1.1rem;
    height: .13rem;
    content: "";
    background: currentColor;
    border-radius: 1rem;
}
.nav-toggle__lines { position: relative; }
.nav-toggle__lines::before { position: absolute; translate: 0 -.35rem; }
.nav-toggle__lines::after { position: absolute; translate: 0 .35rem; }
.primary-nav { min-width: 0; }
.primary-nav__list, .nav-submenu, .footer-links, .social-links { padding: 0; margin: 0; list-style: none; }
.primary-nav__list { display: flex; align-items: center; justify-content: flex-end; gap: .5rem; }
.primary-nav__item > a, .nav-parent-link {
    display: flex;
    min-height: 2.6rem;
    align-items: center;
    padding: .5rem 1rem;
    color: var(--text);
    border-radius: 999px;
    font-size: clamp(.8rem, .9vw, .9rem);
    font-weight: 700;
    letter-spacing: .01em;
    text-decoration: none;
    white-space: nowrap;
    transition: background .16s var(--ease), color .16s var(--ease);
}
.primary-nav__item > a[aria-current="page"], .nav-parent-link[aria-current="page"] {
    color: var(--on-primary);
    background: var(--primary);
}
.primary-nav__item.is-current-trail .nav-parent-link:not([aria-current="page"]) { background: var(--surface-alt); }
/* An item with a submenu is ONE pill: the container carries the shape and clips
   the link + disclosure halves, so the caret sits inside the pill, centred. */
/* No overflow clipping here: the dropdown submenu is positioned inside this
   container. The unified pill comes from half-radii on the two halves instead. */
.nav-group { position: relative; display: grid; grid-template-columns: minmax(0, auto) 1.7rem; align-items: stretch; }
.nav-group > .nav-parent-link { border-radius: 999px 0 0 999px; padding-right: .5rem; }
.nav-disclosure {
    display: grid;
    width: 1.7rem;
    min-height: 2.6rem;
    place-items: center;
    padding: 0 .45rem 0 0;
    color: var(--text);
    background: transparent;
    border: 0;
    border-radius: 0 999px 999px 0;
    cursor: pointer;
    transition: background .16s var(--ease), color .16s var(--ease);
}
.nav-disclosure span { display: block; font-size: 1.05rem; line-height: 1; translate: 0 -22%; transition: rotate .18s var(--ease); }
.nav-group.is-open > .nav-disclosure span { rotate: 180deg; }
.nav-submenu {
    position: absolute;
    z-index: 2;
    inset: calc(100% + .4rem) 0 auto auto;
    width: max-content;
    max-width: min(24rem, calc(100vw - 2rem));
    max-height: calc(100vh - 6rem);
    max-height: calc(100dvh - 6rem);
    min-width: 13rem;
    padding: .5rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 1rem;
    box-shadow: var(--shadow-lg);
}
.nav-submenu[hidden] { display: none; }
.nav-submenu a { display: flex; min-height: 2.75rem; align-items: center; padding: .65rem .8rem; color: var(--text); border-radius: .65rem; text-decoration: none; overflow-wrap: anywhere; }
.nav-submenu a[aria-current="page"] { color: var(--on-secondary); background: var(--secondary); }

@media (min-width: 68.001rem) and (hover: hover) and (pointer: fine) {
    .primary-nav__item > a:hover, .nav-parent-link:hover, .nav-disclosure:hover,
    .nav-group.is-open > .nav-parent-link, .nav-group.is-open > .nav-disclosure {
        color: var(--on-primary);
        background: var(--primary);
    }
    .nav-submenu a:hover { color: var(--on-secondary); background: var(--secondary); }
}

/* Hero slider */
.hero-slider { position: relative; overflow: visible; background: var(--surface-alt); isolation: isolate; }
.hero-slider__viewport { position: relative; min-height: clamp(34rem, 72svh, 48rem); }
.hero-slide { position: absolute; inset: 0; min-height: inherit; overflow: hidden; }
.hero-slide:not([hidden]) { display: grid; }
.hero-slide__media { position: absolute; inset: 0; z-index: -2; overflow: hidden; background: var(--surface-alt); }
.hero-slide--with-copy .hero-slide__media::after { position: absolute; inset: 0; content: ""; background: linear-gradient(90deg, color-mix(in srgb, var(--canvas) 82%, transparent) 0 28%, color-mix(in srgb, var(--canvas) 52%, transparent) 52%, transparent); }
.hero-slide__media picture, .hero-slide__media img { width: 100%; height: 100%; }
.hero-slide__media img { object-fit: cover; }
.hero-slide__video-toggle { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; padding: 0; color: transparent; background: transparent; border: 0; cursor: pointer; opacity: 0; }
.hero-slide__video-toggle:focus { outline: 0; }
.hero-slide__video-toggle:focus-visible { outline: 2px solid rgba(255,255,255,.9); outline-offset: -7px; opacity: 1; }
.hero-slide__art { position: absolute; inset: 0; overflow: hidden; background: radial-gradient(circle at 75% 30%, var(--accent) 0 8%, transparent 8.5%), radial-gradient(circle at 83% 68%, var(--secondary) 0 13%, transparent 13.5%), linear-gradient(130deg, var(--surface-alt), color-mix(in srgb, var(--primary) 18%, var(--canvas))); }
.hero-slide__art--fallback { display: none; }
.hero-slide__media.is-media-missing picture { display: none; }
.hero-slide__media.is-media-missing .hero-slide__art--fallback { display: block; }
.hero-slide__art span { position: absolute; display: block; border: .5rem solid color-mix(in srgb, var(--surface) 55%, transparent); border-radius: 50%; }
.hero-slide__art span:nth-child(1) { width: 18rem; aspect-ratio: 1; inset: 8% 9% auto auto; }
.hero-slide__art span:nth-child(2) { width: 9rem; aspect-ratio: 1; inset: auto 28% 8% auto; }
.hero-slide__art span:nth-child(3) { width: 4rem; aspect-ratio: 1; inset: 16% 38% auto auto; }
.hero-slide__content { display: flex; min-height: inherit; align-items: end; padding-block: 3rem 6rem; }
.hero-copy {
    width: min(100%, 34rem);
    padding: clamp(1.15rem, 2.6vw, 1.85rem);
    background: linear-gradient(135deg, color-mix(in srgb, var(--surface) 96%, var(--canvas)), color-mix(in srgb, var(--surface) 90%, var(--canvas)));
    border: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
    border-left: .32rem solid var(--primary);
    border-radius: 1.1rem;
    box-shadow: 0 .9rem 2.5rem rgb(20 32 28 / .14);
}
.hero-copy h2 { color: var(--text); font-size: clamp(1.7rem, 4vw, 3.25rem); }
.hero-copy > p:not(.eyebrow) { max-width: 36rem; color: var(--muted); font-size: clamp(1.05rem, 2vw, 1.3rem); }
.slider-controls {
    position: absolute;
    inset: auto 0 1.5rem;
    z-index: 4;
    display: flex;
    align-items: center;
    gap: .55rem;
}
.slider-arrow, .slider-dot {
    display: grid;
    min-width: 2.75rem;
    min-height: 2.75rem;
    place-items: center;
    color: var(--text);
    background: var(--surface);
    border: 1px solid var(--border);
    cursor: pointer;
}
.slider-arrow { border-radius: 999px; font-weight: 800; }
.slider-dots { display: flex; max-width: min(20rem, 52vw); gap: .2rem; padding: .15rem; overflow-x: auto; background: var(--surface); border: 1px solid var(--border); border-radius: 999px; scrollbar-width: none; }
.slider-dots::-webkit-scrollbar { display: none; }
.slider-dot { min-width: 2.4rem; border: 0; border-radius: 999px; }
.slider-dot span { width: .55rem; aspect-ratio: 1; background: var(--border); border-radius: 50%; }
.slider-dot[aria-current="true"] span { width: 1.4rem; background: var(--primary); border-radius: 1rem; }
.hero-slide.is-entering .hero-copy { animation: slide-copy-in .45s var(--ease) both; }
@keyframes slide-copy-in { from { opacity: 0; translate: 0 1rem; } }

/* Home sections and cards */
.home-sections { background: transparent; }
.home-section {
    position: relative;
    isolation: isolate;
    overflow: clip;
    padding-block: clamp(4.5rem, 9vw, 8rem);
    background: color-mix(in srgb, var(--canvas) 94%, var(--surface));
}
.home-section:nth-child(even) { background: color-mix(in srgb, var(--surface-alt) 86%, transparent); }
.home-section:nth-child(even)::after {
    inset: -12rem auto auto -10rem;
    background-position: 18% 22%;
    border-radius: 0 0 52% 48%;
    scale: -1 1;
}
.home-section > .shell { position: relative; z-index: 1; }
.section-transition { position: absolute; inset: -.8rem 0 auto; height: 1.6rem; overflow: hidden; pointer-events: none; }
.section-transition::before { position: absolute; inset: .65rem 0 auto; height: .25rem; content: ""; background: var(--accent); opacity: .55; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 1.5rem; margin-bottom: 2rem; }
.section-heading h2 { margin-bottom: 0; }
.content-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2.5vw, 1.6rem); }
.content-card {
    position: relative;
    display: flex;
    min-width: 0;
    flex-direction: column;
    overflow: hidden;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    transition: translate .2s var(--ease), box-shadow .2s var(--ease);
}
.content-card:hover { translate: 0 -.25rem; box-shadow: var(--shadow-lg); }
.card-media { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--surface-alt); }
.card-media img { width: 100%; height: 100%; object-fit: cover; transition: scale .5s var(--ease); }
.content-card:hover .card-media img { scale: 1.035; }
.card-art, .gallery-art {
    position: absolute;
    inset: 0;
    display: block;
    overflow: hidden;
    background: linear-gradient(145deg, color-mix(in srgb, var(--primary) 15%, var(--surface)), color-mix(in srgb, var(--accent) 28%, var(--surface)));
}
.card-art i, .gallery-art i { position: absolute; display: block; border-radius: 50%; }
.card-art i:nth-child(1), .gallery-art i:nth-child(1) { width: 42%; aspect-ratio: 1; inset: 12% 9% auto auto; background: var(--accent); opacity: .7; }
.card-art i:nth-child(2), .gallery-art i:nth-child(2) { width: 28%; aspect-ratio: 1; inset: auto auto 8% 12%; background: var(--secondary); opacity: .68; }
.card-art i:nth-child(3), .gallery-art i:nth-child(3) { width: 14%; aspect-ratio: 1; inset: 16% auto auto 18%; background: var(--primary); opacity: .58; }
.content-card__body { display: grid; grid-template-columns: auto minmax(0, 1fr); flex: 1; gap: .9rem; padding: 1.35rem; }
.content-card__body:not(:has(> .card-date)) { grid-template-columns: minmax(0, 1fr); }
.content-card__body h2, .content-card__body h3 {
    max-width: 100%;
    margin-bottom: .7rem;
    font-size: clamp(1.2rem, 1.75vw, 1.55rem);
    overflow-wrap: anywhere;
}
.content-card__body h2 a, .content-card__body h3 a { color: var(--text); text-decoration: none; }
.content-card__body p { color: var(--muted); }
.content-card__copy .card-link { margin-top: auto; }
.card-meta { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .75rem; color: var(--muted); font-size: .8rem; font-weight: 700; }
.card-meta span { color: var(--primary); }
/* Карта за група: кръгла снимка, име, кратко описание. Един и същ изглед на
   началната страница и в списъка — вж. Shared/_GroupCardItems.cshtml. */
.group-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem); }
.group-card { display: grid; justify-items: center; gap: .45rem; min-width: 0; padding: 1.1rem 1rem 1.2rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); color: var(--text); text-align: center; text-decoration: none; }
.group-card__photo { display: grid; place-items: center; width: 6.4rem; aspect-ratio: 1; overflow: hidden; background: var(--surface-alt); border-radius: 50%; font-size: 2rem; font-weight: 900; }
.group-card__photo img { width: 100%; height: 100%; object-fit: cover; }
.group-card__name { font-size: 1.02rem; font-weight: 850; }
.group-card__summary { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--muted); font-size: .85rem; line-height: 1.4; }
/* Карта за албум: корица, име, брой снимки — еднаква навсякъде. Старата
   мозайка 7/5 правеше един и същ албум различно голям на всяка страница. */
.gallery-preview-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem); }
.gallery-card { overflow: hidden; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); }
.gallery-card > a { display: grid; color: var(--text); text-decoration: none; }
.gallery-card__media { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; }
.gallery-card__media > img { width: 100%; height: 100%; object-fit: cover; }
.gallery-card__copy { display: grid; gap: .35rem; padding: 1.1rem 1.25rem; }
.gallery-card__copy strong { font-size: 1.05rem; line-height: 1.3; }
.gallery-card__copy small, .gallery-card__copy > span { color: var(--muted); }
.empty-state { padding: 1.5rem; color: var(--muted); background: var(--surface); border: 1px dashed var(--border); border-radius: var(--radius-md); }

/* Inner pages */
.breadcrumbs { padding-block: 1rem; }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: .35rem .65rem; padding: 0; margin: 0; list-style: none; color: var(--muted); font-size: .9rem; }
.breadcrumbs li:not(:last-child)::after { margin-left: .65rem; content: "/"; color: var(--border); }
.page-hero {
    /* An inner page announces itself and steps aside: the band stays compact so real
       content is visible without scrolling. */
    position: relative;
    min-height: 10.5rem;
    display: grid;
    align-items: end;
    overflow: hidden;
    background: linear-gradient(90deg, var(--surface-alt) 0 52%, color-mix(in srgb, var(--surface-alt) 55%, var(--canvas)));
}
.page-hero__inner { position: relative; z-index: 2; padding-block: 1.8rem 2.1rem; }
.page-hero__inner h1 { max-width: 60rem; margin-bottom: 0; font-size: clamp(2rem, 4.5vw, 3.4rem); }
.page-hero__decor { position: absolute; width: 25rem; aspect-ratio: 1; inset: -8rem 5% auto auto; border: 3rem solid color-mix(in srgb, var(--accent) 35%, transparent); border-radius: 50%; opacity: .7; }
.page-content, .listing-page, .detail-page, .contact-page { padding-block: clamp(3rem, 7vw, 6rem); }
.page-lead { max-width: 52rem; margin-bottom: 2.5rem; color: var(--muted); font-size: clamp(1.1rem, 2.1vw, 1.35rem); }
/* Блоков поток, а не решетка: само така текстът може да обтича основното
   изображение и да продължи под него, както е в редактора. */
/* Плочата е широка колкото блоковете с карти: една и съща лява граница за
   пътя до страницата, за плочата и за решетката — навсякъде в сайта. */
/* `flow-root` кара плочата да обгърне обтичаното изображение. Без него, когато
   текстът е кратък, снимката увисва извън бялото поле и сереже отдолу. */
.content-section { display: flow-root; padding: clamp(1.5rem, 4vw, 3rem); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.content-section > * + * { margin-top: 1.5rem; }
.content-section + .content-section { margin-top: 2rem; }
/* Избраното „Основно изображение“ застава вляво в съдържанието; редовете
   минават покрай него и се стичат надолу. Снимките, които не са основни, си
   остават в лентата под текста. */
.content-section__media { float: left; width: min(22rem, 42%); margin: .35rem 1.75rem .75rem 0; }
.content-section__media img { width: 100%; border-radius: var(--radius-md); }
/* Лентите и списъците не се качват до изображението — те започват на чист ред. */
.content-section > :is(.photo-grid, .related-content) { clear: both; }
@media (max-width: 48rem) {
    .content-section__media { float: none; width: 100%; margin: 0 0 1rem; }
}
.rich-text { min-width: 0; overflow-wrap: anywhere; }
.rich-text > :first-child { margin-top: 0; }
.rich-text > :last-child { margin-bottom: 0; }
.rich-text h2, .rich-text h3 { margin-top: 1.4em; }
.rich-text a { overflow-wrap: anywhere; }
.rich-text table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.rich-text th, .rich-text td { padding: .6rem; border: 1px solid var(--border); }
.detail-page { max-width: 70rem; }
.detail-page__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-bottom: 1.4rem; color: var(--muted); }
.badge { display: inline-flex; padding: .35rem .75rem; color: var(--on-secondary); background: var(--secondary); border-radius: 999px; font-size: .8rem; font-weight: 800; }
.detail-cover { margin: 2rem 0; overflow: hidden; border-radius: var(--radius-lg); }
.detail-cover img { width: 100%; max-height: 38rem; object-fit: cover; }
.detail-body { max-width: 50rem; margin-inline: auto; font-size: 1.08rem; }
.related-content { max-width: 70rem; padding-top: 2.5rem; margin: 2.5rem auto 0; border-top: 1px solid var(--border); }
.related-content > h2 { margin-bottom: 1.25rem; }
.content-grid--listing { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.gallery-preview-grid--listing { row-gap: 1.5rem; }
.photo-grid { columns: 3 18rem; column-gap: 1rem; }
.photo-card { break-inside: avoid; padding: .55rem; margin: 0 0 1rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); }
.photo-card img { width: 100%; border-radius: calc(var(--radius-md) - .35rem); }
.photo-card figcaption { padding: .65rem .4rem .25rem; color: var(--muted); }
.document-list { display: grid; gap: 1rem; padding: 0; margin: 0; list-style: none; }
.document-card { display: block; }
.document-card__link { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 1rem; padding: 1rem 1.15rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); color: inherit; text-decoration: none; }
.document-card__type { display: grid; place-items: center; width: 2.9rem; height: 2.9rem; border-radius: .7rem; background: var(--primary); color: var(--on-primary); font-size: .68rem; font-weight: 900; text-transform: uppercase; }
.document-card__text { display: grid; gap: .15rem; min-width: 0; }
.document-card__text small { color: var(--muted); }
.document-card__go { display: grid; place-items: center; width: 2.1rem; height: 2.1rem; border-radius: 50%; background: var(--surface-alt); }
.document-card__go svg { width: 1.05rem; height: 1.05rem; }
/* Датата на картата е знак, а не ред текст: денят отгоре, месецът отдолу.
   Темите я обличат различно, но структурата е една за целия сайт. */
.card-date { display: grid; place-items: center; align-self: start; width: 3rem; padding: .4rem 0 .45rem; border-radius: .85rem; background: var(--primary); color: var(--on-primary); line-height: 1; }
.card-date b { font-size: 1.15rem; }
.card-date span { font-size: .72rem; }
.content-card__copy { display: flex; flex-direction: column; align-items: start; min-width: 0; }
.file-type { flex: 0 0 auto; display: block; width: 2.9rem; }
.file-type svg { display: block; width: 100%; height: auto; }
.file-type img { display: block; width: 40px; height: 40px; max-width: 100%; object-fit: contain; }
.file-type__sheet { fill: var(--ft-tint, #eef1f5); stroke: var(--ft-ink, #93a1b3); stroke-width: 1.6; stroke-linejoin: round; }
.file-type__fold { fill: color-mix(in srgb, var(--ft-ink, #93a1b3) 24%, #fff); stroke: var(--ft-ink, #93a1b3); stroke-width: 1.6; stroke-linejoin: round; }
.file-type__mark { fill: none; stroke: var(--ft-ink, #93a1b3); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.file-type__ribbon { fill: var(--ft-ink,#93a1b3); stroke: none; }

.file-type--pdf { --ft-ink: #C4362F; --ft-tint: #FDECEA; }
.file-type--word { --ft-ink: #2A5CA8; --ft-tint: #EAF1FB; }
.file-type--excel { --ft-ink: #217346; --ft-tint: #E8F5ED; }
.file-type--slides { --ft-ink: #C2551F; --ft-tint: #FDEFE6; }
.file-type--image { --ft-ink: #7A4FA3; --ft-tint: #F3ECFA; }
.file-type--archive { --ft-ink: #8A6A2F; --ft-tint: #FAF2E2; }
.file-type--file { --ft-ink: #6B7788; --ft-tint: #EFF2F6; }
.button__icon { width: 1.05rem; height: 1.05rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.document-card__title { display: block; overflow: hidden; font-size: 1.02rem; text-overflow: ellipsis; white-space: nowrap; }
.staff-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.staff-card { display: grid; grid-template-columns: 9rem 1fr; gap: 1.25rem; padding: 1.25rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); }
.staff-card__portrait { position: relative; min-height: 10rem; overflow: hidden; background: var(--surface-alt); border-radius: var(--radius-md); }
.staff-card__portrait img { width: 100%; height: 100%; object-fit: cover; }
.staff-card__portrait > span { position: absolute; inset: 18% 20%; border-radius: 50% 50% 42% 42%; background: var(--accent); }
.staff-card__portrait > span::after { position: absolute; width: 130%; height: 70%; inset: 70% auto auto -15%; content: ""; background: var(--secondary); border-radius: 50% 50% 0 0; }
.staff-card__role { color: var(--muted); font-weight: 700; }
.staff-card__documents { margin-top: 1rem; }
.staff-card__documents .document-card__link { padding: .8rem .9rem; }

/* Page and block card presentation: ten deliberate, reusable layouts. */
.staff-roles { display: grid; gap: clamp(2.75rem, 6vw, 5rem); }
.staff-role-group { display: grid; gap: 1.35rem; }
.staff-role-group__heading { position: relative; max-width: 70rem; }
.staff-role-group__heading h2, .staff-role-group__heading h3 { display: inline-block; margin: 0; }
.staff-role-group__heading h2::after, .staff-role-group__heading h3::after { display: block; width: 3.5rem; height: .25rem; margin-top: .55rem; content: ""; background: var(--accent); border-radius: 999px; }
.staff-role-group .staff-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 34rem)); }
.staff-role-group[data-role-alignment="left"] .staff-grid { justify-content: start; }
.staff-role-group[data-role-alignment="center"] .staff-grid { justify-content: center; }
.staff-role-group[data-role-alignment="right"] .staff-grid { justify-content: end; }
.staff-role-group[data-role-alignment="left"] .staff-role-group__heading { margin-right: auto; text-align: left; }
.staff-role-group[data-role-alignment="center"] .staff-role-group__heading { margin-inline: auto; text-align: center; }
.staff-role-group[data-role-alignment="center"] .staff-role-group__heading h2::after,
.staff-role-group[data-role-alignment="center"] .staff-role-group__heading h3::after { margin-inline: auto; }
.staff-role-group[data-role-alignment="right"] .staff-role-group__heading { margin-left: auto; text-align: right; }
.staff-role-group[data-role-alignment="right"] .staff-role-group__heading h2::after,
.staff-role-group[data-role-alignment="right"] .staff-role-group__heading h3::after { margin-left: auto; }

:is(.content-grid, .group-grid, .gallery-preview-grid)[data-card-layout="portrait-circle"],
:where([data-card-layout="portrait-circle"]) :is(.content-grid, .group-grid, .gallery-preview-grid) { grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
:where([data-card-layout="portrait-circle"]) :is(.content-card, .group-card, .gallery-card, .staff-card) { display: flex; min-width: 0; flex-direction: column; align-items: center; padding: 1.4rem; text-align: center; }
:where([data-card-layout="portrait-circle"]) :is(.card-media, .gallery-card__media, .staff-card__portrait) { width: clamp(8rem, 60%, 12rem); height: auto; aspect-ratio: 1; flex: none; margin: 0 auto 1rem; border: .35rem solid color-mix(in srgb, var(--accent) 38%, var(--surface)); border-radius: 50%; box-shadow: 0 .75rem 2rem color-mix(in srgb, var(--text) 12%, transparent); }
:where([data-card-layout="portrait-circle"]) :is(.card-media, .gallery-card__media, .staff-card__portrait) img { width: 100%; height: 100%; object-fit: cover; }
:where([data-card-layout="portrait-circle"]) :is(.content-card__body, .gallery-card__copy, .staff-card__copy) { width: 100%; align-items: center; text-align: center; }
:where([data-card-layout="portrait-circle"]) .group-card__number { position: absolute; z-index: 2; inset: 1rem 1rem auto auto; }
:where([data-card-layout="portrait-circle"]) .group-card > img { width: 10rem; height: 10rem; border-radius: 50%; }

:is(.content-grid, .group-grid, .gallery-preview-grid)[data-card-layout="portrait-square"],
:where([data-card-layout="portrait-square"]) :is(.content-grid, .group-grid, .gallery-preview-grid) { grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); }
:where([data-card-layout="portrait-square"]) :is(.content-card, .group-card, .gallery-card, .staff-card) { display: flex; min-width: 0; flex-direction: column; padding: 1rem; }
:where([data-card-layout="portrait-square"]) :is(.card-media, .gallery-card__media, .staff-card__portrait, .group-card > img) { width: 100%; height: auto; aspect-ratio: 1; margin: 0 0 1rem; border-radius: calc(var(--radius-md) - .25rem); }
:where([data-card-layout="portrait-square"]) :is(.card-media, .gallery-card__media, .staff-card__portrait, .group-card > img) img { width: 100%; height: 100%; object-fit: cover; }

:where([data-card-layout="soft-frame"]) :is(.content-card, .group-card, .gallery-card, .staff-card, .content-section, .document-card, .contact-panel) { border: .18rem solid color-mix(in srgb, var(--primary) 18%, var(--border)); outline: .45rem solid color-mix(in srgb, var(--accent) 8%, transparent); outline-offset: -.6rem; border-radius: clamp(1.25rem, 3vw, 2rem); box-shadow: 0 1rem 2.5rem color-mix(in srgb, var(--primary) 10%, transparent); }
:where([data-card-layout="soft-frame"]) :is(.card-media, .gallery-card__media, .staff-card__portrait, .group-card > img) { border-radius: clamp(1rem, 2.5vw, 1.6rem); }

:is(.content-grid, .group-grid, .gallery-preview-grid)[data-card-layout="horizontal-left"],
:where([data-card-layout="horizontal-left"]) :is(.content-grid, .group-grid, .gallery-preview-grid) { grid-template-columns: 1fr; }
:where([data-card-layout="horizontal-left"]) :is(.content-card, .group-card, .gallery-card, .staff-card) { display: grid; grid-template-columns: minmax(9rem, 34%) minmax(0, 1fr); align-items: stretch; }
:where([data-card-layout="horizontal-left"]) :is(.card-media, .gallery-card__media, .staff-card__portrait, .group-card > img, .group-card__photo) { width: 100%; height: 100%; min-height: 12rem; aspect-ratio: auto; margin: 0; border-radius: 0; }
:where([data-card-layout="horizontal-left"]) :is(.card-media, .gallery-card__media, .staff-card__portrait, .group-card > img, .group-card__photo) img { width: 100%; height: 100%; object-fit: cover; }

:is(.content-grid, .group-grid, .gallery-preview-grid)[data-card-layout="horizontal-right"],
:where([data-card-layout="horizontal-right"]) :is(.content-grid, .group-grid, .gallery-preview-grid) { grid-template-columns: 1fr; }
:where([data-card-layout="horizontal-right"]) :is(.content-card, .group-card, .gallery-card, .staff-card) { display: grid; grid-template-columns: minmax(0, 1fr) minmax(9rem, 34%); align-items: stretch; }
:where([data-card-layout="horizontal-right"]) :is(.card-media, .gallery-card__media, .staff-card__portrait, .group-card > img, .group-card__photo) { width: 100%; height: 100%; min-height: 12rem; aspect-ratio: auto; grid-column: 2; grid-row: 1; margin: 0; border-radius: 0; }
:where([data-card-layout="horizontal-right"]) :is(.content-card__body, .gallery-card__copy, .staff-card__copy, .group-card > div:not(.group-card__number):not(.group-card__photo)) { grid-column: 1; grid-row: 1; }
:where([data-card-layout="horizontal-right"]) :is(.card-media, .gallery-card__media, .staff-card__portrait, .group-card > img, .group-card__photo) img { width: 100%; height: 100%; object-fit: cover; }

:where([data-card-layout="image-overlay"]) :is(.content-card, .group-card, .gallery-card, .staff-card) { position: relative; display: grid; min-height: 23rem; padding: 0; overflow: hidden; color: #fff; background: #17382d; }
:where([data-card-layout="image-overlay"]) :is(.card-media, .gallery-card__media, .staff-card__portrait, .group-card > img, .group-card__photo) { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; border-radius: 0; }
:where([data-card-layout="image-overlay"]) .group-card::before { position: absolute; inset: 0; z-index: 1; content: ""; background: linear-gradient(0deg, rgba(9, 31, 24, .94), rgba(9, 31, 24, .08) 75%); pointer-events: none; }
:where([data-card-layout="image-overlay"]) :is(.card-media, .gallery-card__media, .staff-card__portrait, .group-card > img, .group-card__photo)::after { position: absolute; inset: 0; content: ""; background: linear-gradient(0deg, rgba(9, 31, 24, .94), rgba(9, 31, 24, .08) 75%); }
:where([data-card-layout="image-overlay"]) :is(.card-media, .gallery-card__media, .staff-card__portrait, .group-card > img, .group-card__photo) img { width: 100%; height: 100%; object-fit: cover; }
:where([data-card-layout="image-overlay"]) :is(.content-card__body, .gallery-card__copy, .staff-card__copy, .group-card > div:not(.group-card__number):not(.group-card__photo)) { position: relative; z-index: 2; align-self: end; padding: 1.5rem; color: #fff; }
:where([data-card-layout="image-overlay"]) :is(h2, h3, h4, a, p, small, .staff-card__role, .card-meta) { color: inherit; }

:is(.content-grid, .group-grid, .gallery-preview-grid, .staff-grid)[data-card-layout="compact"],
:where([data-card-layout="compact"]) :is(.content-grid, .group-grid, .gallery-preview-grid, .staff-grid) { grid-template-columns: 1fr; gap: .65rem; }
:where([data-card-layout="compact"]) :is(.content-card, .group-card, .gallery-card, .staff-card, .document-card) { display: grid; min-height: 0; grid-template-columns: 5rem minmax(0, 1fr); align-items: center; gap: .9rem; padding: .75rem; border-radius: 1rem; box-shadow: none; }
:where([data-card-layout="compact"]) :is(.card-media, .gallery-card__media, .staff-card__portrait, .group-card > img) { width: 5rem; height: 5rem; min-height: 0; aspect-ratio: 1; grid-column: 1; grid-row: 1; margin: 0; border-radius: .8rem; }
:where([data-card-layout="compact"]) :is(.content-card__body, .gallery-card__copy, .staff-card__copy) { grid-column: 2; grid-row: 1; padding: .25rem; }
:where([data-card-layout="compact"]) :is(.content-card__body p, .rich-text, .card-link) { display: none; }

:is(.content-grid, .group-grid, .gallery-preview-grid)[data-card-layout="editorial"],
:where([data-card-layout="editorial"]) :is(.content-grid, .group-grid, .gallery-preview-grid) { grid-template-columns: repeat(12, 1fr); }
:where([data-card-layout="editorial"]) :is(.content-card, .group-card, .gallery-card) { grid-column: span 4; border-width: 0 0 1px; border-radius: 0; box-shadow: none; }
:where([data-card-layout="editorial"]) :is(.content-card, .group-card, .gallery-card):first-child { grid-column: span 8; }
:where([data-card-layout="editorial"]) :is(.content-card__body h2, .content-card__body h3, .gallery-card__copy strong, .staff-card h3) { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(1.35rem, 3vw, 2rem); }
:where([data-card-layout="editorial"]) .staff-card { border: 0; border-bottom: 1px solid var(--border); border-radius: 0; box-shadow: none; }

:where([data-card-layout="playful"]) :is(.content-card, .group-card, .gallery-card, .staff-card, .content-section, .document-card, .contact-panel) { border: .18rem solid color-mix(in srgb, var(--secondary) 42%, var(--border)); border-radius: 2rem .8rem 2.4rem 1rem; box-shadow: .6rem .7rem 0 color-mix(in srgb, var(--accent) 22%, transparent); transform: rotate(-.35deg); }
:where([data-card-layout="playful"]) :is(.content-card, .group-card, .gallery-card, .staff-card):nth-child(even) { border-radius: .8rem 2.2rem 1rem 2.4rem; transform: rotate(.35deg); }
:where([data-card-layout="playful"]) :is(.card-media, .gallery-card__media, .staff-card__portrait, .group-card > img) { border-radius: 1.5rem .65rem 1.8rem .8rem; }

.home-spacer { min-height: clamp(2rem, 5vw, 5rem); }
.contact-page { display: grid; grid-template-columns: minmax(18rem, .8fr) minmax(0, 1.2fr); gap: 1.5rem; }
.contact-panel, .map-panel { padding: clamp(1.25rem, 3vw, 2rem); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.contact-list { display: grid; gap: 1.1rem; margin: 2rem 0 0; }
.contact-list div { position: relative; padding-bottom: 1rem; padding-left: 3.6rem; border-bottom: 1px solid var(--border); }
.contact-list dt { color: var(--muted); font-size: .8rem; font-weight: 750; text-transform: uppercase; }
.contact-list dd { margin: .25rem 0 0; font-size: 1.05rem; }
.contact-ico { position: absolute; top: .05rem; left: 0; width: 2.6rem; height: 2.6rem; display: grid; place-items: center; color: var(--primary); background: color-mix(in srgb, var(--primary) 12%, var(--surface)); border-radius: .9rem; }
.contact-ico svg { width: 1.3rem; height: 1.3rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.map-panel { display: flex; min-height: 34rem; flex-direction: column; }
.map-panel iframe { width: 100%; min-height: 28rem; flex: 1; border: 0; border-radius: var(--radius-md); }
.map-link { margin-top: 1rem; align-self: start; }
.map-placeholder { display: grid; min-height: 28rem; place-items: center; align-content: center; text-align: center; color: var(--muted); background: var(--surface-alt); border-radius: var(--radius-md); }
.map-placeholder > span { font-size: 4rem; color: var(--primary); }
.contact-form-panel {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(15rem, .65fr) minmax(0, 1.35fr);
    gap: clamp(1.5rem, 5vw, 4rem);
    padding: clamp(1.5rem, 4vw, 3rem);
    scroll-margin-top: 7rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
}
.contact-form-panel__intro p:last-child { color: var(--muted); }
.contact-form { display: grid; gap: 1.25rem; }
.contact-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.field { display: grid; gap: .4rem; }
.field label, .contact-consent { font-weight: 720; }
.field input, .field textarea {
    width: 100%;
    padding: .78rem .9rem;
    color: var(--text);
    background: var(--canvas);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
}
.field textarea { min-height: 10rem; resize: vertical; }
.field input:focus, .field textarea:focus { border-color: var(--focus); }
.field-hint { margin: -.65rem 0 0; color: var(--muted); font-size: .88rem; }
.contact-consent { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: .7rem; }
.contact-consent input { width: 1.2rem; height: 1.2rem; margin-top: .2rem; accent-color: var(--primary); }
.contact-form .button { justify-self: start; cursor: pointer; }
.contact-honeypot { position: absolute; width: 1px; height: 1px; inset: auto auto auto -10000px; overflow: hidden; }

.public-notice-layer {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: grid;
    place-items: center;
    padding: 1rem;
    background: rgb(24 33 43 / .58);
    backdrop-filter: blur(.35rem);
}
.public-notice {
    display: grid;
    width: min(100%, 32rem);
    justify-items: center;
    padding: clamp(1.5rem, 5vw, 2.75rem);
    text-align: center;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
}
/* Semantic colors stay fixed across themes: a red error and a green success must
   read as such no matter what palette the site uses. */
.public-notice__icon { display: grid; width: 4rem; aspect-ratio: 1; place-items: center; margin-bottom: 1rem; color: #fff; background: #2f9e63; border-radius: 50%; font-size: 2rem; font-weight: 900; }
.public-notice-layer--error .public-notice__icon { color: #fff; background: #d64545; }
.public-notice p { color: var(--muted); }
.has-public-notice { overflow: hidden; }

.faq-list { display: grid; width: 100%; gap: .75rem; }
.faq-item { overflow: clip; background: var(--canvas); border: 1px solid var(--border); border-radius: var(--radius-md); }
.faq-item summary { display: grid; min-height: 3.5rem; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 1rem; padding: 1rem 1.25rem; color: var(--text); cursor: pointer; font-weight: 780; list-style: none; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item__mark { display: grid; width: 2rem; aspect-ratio: 1; place-items: center; color: var(--on-primary); background: var(--primary); border-radius: 50%; transition: rotate .18s var(--ease); }
.faq-item[open] .faq-item__mark { rotate: 45deg; }
.faq-item__answer { padding: 0 1.25rem 1.25rem; border-top: 1px solid var(--border); }
.faq-item__answer > :first-child { margin-top: 1.1rem; }

.video-block { width: 100%; margin: 0; }
.video-block__player, .video-block__frame { width: 100%; overflow: hidden; background: #000; border-radius: var(--radius-md); }
.video-block__player { display: block; max-height: 42rem; }
.video-block__frame { aspect-ratio: 16 / 9; }
.video-block__frame iframe { width: 100%; height: 100%; border: 0; }
.video-block figcaption { padding-top: .65rem; color: var(--muted); text-align: center; }
.not-found { display: grid; min-height: 65svh; place-items: center; align-content: center; padding-block: 5rem; text-align: center; }
.not-found__art { display: flex; align-items: center; gap: 1rem; color: var(--primary); font-size: clamp(5rem, 18vw, 10rem); font-weight: 900; line-height: 1; }
.not-found__art i { width: clamp(4rem, 12vw, 7rem); aspect-ratio: 1; background: var(--accent); border: 1rem dotted var(--secondary); border-radius: 50%; }
.not-found__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; margin-top: 1rem; }

/* Generic admin-selectable button families that every theme honours. */
body[data-button-shape="capsule"] .button { border-radius: 999px; }
body[data-button-shape="soft"] .button { border-radius: 1.1rem 1.35rem 1.15rem 1.4rem / 1.3rem 1.1rem 1.4rem 1.2rem; }

/* Footer */
/* No exposed artwork strip above the reading band: the scalloped decor is the
   entire transition, and the band starts immediately below it. */
.site-footer { position: relative; z-index: 1; isolation: isolate; overflow: hidden; color: var(--on-primary); background: var(--primary); }
.site-footer::before {
    position: absolute;
    z-index: -1;
    inset: 0;
    content: "";
    background-image: linear-gradient(color-mix(in srgb, var(--primary) 88%, transparent), var(--primary));
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: .7;
}
.footer-decor { position: absolute; inset: -1.5rem 0 auto; display: flex; height: 3rem; overflow: hidden; }
.footer-decor span { flex: 1; background: var(--primary); border-radius: 50% 50% 0 0; }
.footer-decor span:nth-child(2) { background: var(--secondary); }
.footer-decor span:nth-child(3) { background: var(--accent); }
/* Themed footers sit on busy illustrated art, so the content rides on its own
   calm panel. That keeps every reading surface at one predictable contrast
   instead of depending on whatever the theme happens to paint behind it. */
.site-footer__panel {
    padding: 2.5rem 0 1.25rem;
    color: var(--on-footer-panel);
    background: var(--footer-panel);
    box-shadow: 0 -0.5rem 2.5rem rgb(0 0 0 / .18);
}
.footer-identity { display: grid; gap: .5rem; align-content: start; }
.footer-identity__logo { width: auto; max-width: 12rem; height: auto; max-height: 4rem; object-fit: contain; object-position: left center; }
.footer-identity h2 { margin: .25rem 0 0; font-size: 1.05rem; }
/* No opacity muting on panel text: the panel ink is chosen at exactly the AA
   threshold for some palettes, so any alpha would drop it below 4.5:1. */
.footer-identity__tagline { margin: 0; }
.footer-identity__social { margin-top: .5rem; }
.footer-column { display: grid; align-content: start; }

/* Brand marks are drawn for light ground, so each sits on its own white plate.
   Equal plate size keeps logos of different proportions optically aligned. */
.footer-brands { display: flex; flex-wrap: wrap; gap: .75rem; padding: 0; margin: 0; list-style: none; }
.footer-brand-card {
    display: grid;
    width: 10.5rem;
    height: 3.9rem;
    place-items: center;
    padding: .6rem .9rem;
    background: #fff;
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-sm);
    text-decoration: none;
    transition: transform .18s var(--ease), box-shadow .18s var(--ease);
}
.footer-brand-card:hover, .footer-brand-card:focus-visible { transform: translateY(-2px); box-shadow: var(--shadow-lg); }
.footer-brand-card__logo { width: auto; max-width: 100%; height: auto; max-height: 2.5rem; object-fit: contain; }
.footer-brand-card__glyph { width: 1.5rem; height: 1.5rem; color: #1877f2; }
.footer-brand-card--inline { grid-auto-flow: column; gap: .55rem; align-content: center; justify-content: center; }
.footer-brand-card__wordmark { color: #18212b; font-weight: 700; text-align: center; }
@media (prefers-reduced-motion: reduce) {
    .footer-brand-card { transition: none; }
    .footer-brand-card:hover, .footer-brand-card:focus-visible { transform: none; }
}
.footer-credit { margin-left: .5rem; }
.footer-credit::before { content: "·"; margin-right: .5rem; opacity: .6; }
.site-footer__legal-links { display: flex; flex-wrap: wrap; gap: .5rem 1rem; }

/* Consent gate for third-party embeds. The notice takes the embed's place at the
   same footprint so accepting never shifts the layout (CLS 0). */
.embed-consent { display: grid; }
/* display:grid on the blocks below would defeat the hidden attribute (author
   display beats the UA [hidden] rule), so hidden is re-asserted explicitly. */
.embed-consent__notice[hidden], .embed-consent__frame[hidden], .embed-consent__manage[hidden] { display: none; }
.embed-consent__notice {
    display: grid;
    min-height: 16rem;
    place-content: center;
    justify-items: center;
    gap: .9rem;
    padding: 1.75rem;
    text-align: center;
    background: var(--surface-alt);
    border: 1px dashed var(--border);
    border-radius: var(--radius-sm);
}
.embed-consent__notice p { max-width: 26rem; margin: 0; color: var(--muted); }
.embed-consent__icon {
    display: grid;
    width: 3rem;
    height: 3rem;
    place-items: center;
    color: var(--primary);
    background: color-mix(in srgb, var(--primary) 12%, transparent);
    border-radius: 50%;
}
.embed-consent__icon svg { width: 1.6rem; height: 1.6rem; }
.embed-consent__frame { display: grid; }
.embed-consent__frame iframe { width: 100%; min-height: 16rem; border: 0; border-radius: var(--radius-sm); }
.embed-consent__manage { margin: .4rem 0 0; text-align: right; }
.embed-consent__revoke {
    padding: 0;
    color: var(--muted);
    font-size: .8rem;
    background: none;
    border: 0;
    text-decoration: underline;
    cursor: pointer;
}
.embed-consent__revoke:hover, .embed-consent__revoke:focus-visible { color: var(--text); }

/* Universal gallery lightbox. Native <dialog> supplies the focus trap and Esc;
   pinch zoom stays native because pointer handling only reads single-pointer X. */
.lightbox {
    width: min(100vw, 100%);
    max-width: none;
    height: 100dvh;
    max-height: none;
    padding: 0;
    /* The scrim lives on the dialog itself, not on ::backdrop: the dialog already
       covers the viewport, and painting here is reliable across engines (the
       computed ::backdrop colour applied but did not paint in headless Chrome). */
    background: rgb(10 14 12 / .92);
    border: 0;
}
/* Само отвореният диалог се показва: `display` без това условие надделява над
   вградения стил `dialog:not([open]) { display: none }` и затвореният диалог
   остава на страницата като празно поле под футъра. */
.lightbox[open] { display: grid; place-items: center; }
.lightbox::backdrop { background: transparent; }
.lightbox__figure { display: grid; gap: .6rem; margin: 0; justify-items: center; touch-action: pinch-zoom; }
.lightbox__image {
    max-width: min(92vw, 70rem);
    max-height: 82dvh;
    width: auto;
    height: auto;
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-lg);
    background: #101512;
}
.lightbox__caption { max-width: 60ch; color: #fff; text-align: center; opacity: .9; }
.lightbox__caption:empty { display: none; }
.lightbox__counter { position: fixed; bottom: 1rem; left: 50%; translate: -50% 0; margin: 0; color: #fff; opacity: .8; font-size: .9rem; }
.lightbox__close, .lightbox__nav {
    position: fixed;
    display: grid;
    width: 3rem;
    height: 3rem;
    place-items: center;
    color: #fff;
    background: rgb(255 255 255 / .14);
    border: 0;
    border-radius: 50%;
    cursor: pointer;
}
.lightbox__close:hover, .lightbox__nav:hover, .lightbox__close:focus-visible, .lightbox__nav:focus-visible { background: rgb(255 255 255 / .3); }
.lightbox__close svg, .lightbox__nav svg { width: 1.5rem; height: 1.5rem; }
.lightbox__close { top: 1rem; right: 1rem; }
.lightbox__nav--prev { left: 1rem; top: 50%; translate: 0 -50%; }
.lightbox__nav--next { right: 1rem; top: 50%; translate: 0 -50%; }
@media (max-width: 48rem) {
    .lightbox__nav--prev { left: .4rem; }
    .lightbox__nav--next { right: .4rem; }
    .lightbox__image { max-width: 96vw; }
}
.footer-card__label { display: grid; gap: .1rem; min-width: 0; font-weight: 600; overflow-wrap: anywhere; }
.footer-card__hint { font-weight: 400; font-size: .82rem; letter-spacing: .06em; }
/* Columns follow the sections that actually exist. A fixed four-column track left
   a dead gap whenever a site had no quick links or extra social profiles. */
.site-footer__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
    gap: 2rem 3rem;
    padding-block: 2.25rem 3rem;
}
.site-footer__grid > :first-child { grid-column: span 1; }
.site-footer h2 { margin-bottom: 1rem; color: inherit; font-size: 1rem; letter-spacing: .04em; }
.site-footer a { color: inherit; }
.footer-brand { display: flex; align-items: start; gap: 1rem; }
.brand__mark--footer { background: var(--accent); box-shadow: 0 0 0 .12rem var(--accent); }
.footer-links, .social-links, .site-footer address { display: grid; gap: .65rem; font-style: normal; }
/* Contact rows are icon + text pairs. The icon is decorative: the link type is
   already conveyed by the tel:/mailto: target and the text itself. */
.footer-contact__row {
    display: grid;
    grid-template-columns: 1.15rem minmax(0, 1fr);
    gap: .6rem;
    align-items: start;
    min-height: 1.65rem;
    text-decoration: none;
}
a.footer-contact__row { align-items: center; }
.footer-contact__icon { width: 1.15rem; height: 1.15rem; margin-top: .12rem; opacity: .75; }
a.footer-contact__row .footer-contact__icon { margin-top: 0; }
a.footer-contact__row:hover .footer-contact__icon, a.footer-contact__row:focus-visible .footer-contact__icon { opacity: 1; }
.footer-contact__email { overflow-wrap: anywhere; }
.site-footer__legal { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .8rem; padding-block: 1rem; border-top: 1px solid color-mix(in srgb, currentcolor 25%, transparent); font-size: .85rem; }
.site-footer__legal p { margin: 0; }
.site-footer__legal > span { display: flex; flex-wrap: wrap; gap: .5rem 1rem; }

@media (max-width: 68rem) {
    .brand__words { max-width: min(16rem, 40vw); }
    .nav-toggle { display: flex; flex: 0 0 auto; }
    .primary-nav {
        position: absolute;
        inset: calc(100% + 1px) 0 auto;
        display: none;
        max-height: calc(100svh - 6rem);
        padding: 1rem;
        overflow-y: auto;
        background: var(--surface);
        border-bottom: 1px solid var(--border);
        box-shadow: var(--shadow-lg);
    }
    .primary-nav.is-open { display: block; }
    .primary-nav__list { width: min(100%, 48rem); margin-inline: auto; flex-direction: column; align-items: stretch; }
    .nav-group { grid-template-columns: minmax(0, 1fr) 3rem; }
    body[data-theme][data-renderer] .primary-nav__item > a,
    body[data-theme][data-renderer] .nav-parent-link,
    body[data-theme][data-renderer] .nav-disclosure {
        min-height: 3rem;
        padding-inline: 1rem;
        border-radius: .75rem;
        font-size: .94rem;
    }
    body[data-theme][data-renderer] .nav-disclosure { width: 3rem; padding: 0; }
    .nav-group.is-open > .nav-parent-link, .nav-group.is-open > .nav-disclosure { color: var(--text); background: var(--surface-alt); }
    .nav-submenu { position: static; width: auto; max-width: none; max-height: none; min-width: 0; grid-column: 1 / -1; margin: .2rem .5rem .75rem; overflow-y: visible; overscroll-behavior: auto; box-shadow: none; }
    .content-grid, .content-grid--listing { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .site-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .staff-grid { grid-template-columns: 1fr; }
}

@media (max-width: 48rem) {
    :root { --shell: min(100% - 1.25rem, 76rem); }
    main::before { background-size: auto 120svh; }
    .home-section::after { width: 24rem; opacity: calc(var(--theme-section-art-opacity, .12) * .72); }
    .hero-slider__viewport { min-height: clamp(28rem, 64svh, 34rem); }
    .hero-slide--with-copy .hero-slide__media::after { background: linear-gradient(0deg, color-mix(in srgb, var(--canvas) 86%, transparent) 0 28%, color-mix(in srgb, var(--canvas) 52%, transparent) 58%, transparent); }
    .hero-slide__content { align-items: end; padding-block: 3rem 6.25rem; }
    .hero-copy { padding: 1.35rem; }
    .slider-controls { justify-content: center; }
    .section-heading { align-items: start; flex-direction: column; gap: .35rem; }
    .content-grid, .content-grid--listing, .group-grid, .staff-grid { grid-template-columns: 1fr; }
    .gallery-preview-grid { grid-template-columns: 1fr; }
    .gallery-card, .gallery-card:nth-child(n) { grid-column: auto; }
    .content-section:has(.content-section__media), .contact-page, .contact-form-panel { grid-template-columns: 1fr; }
    .contact-form__grid { grid-template-columns: 1fr; }
    .document-card__link { grid-template-columns: auto minmax(0, 1fr); }
    .staff-card { grid-template-columns: 6.5rem 1fr; }
    :where([data-card-layout="horizontal-left"], [data-card-layout="horizontal-right"]) :is(.content-card, .group-card, .gallery-card, .staff-card) { grid-template-columns: 7rem minmax(0, 1fr); }
    :where([data-card-layout="horizontal-left"], [data-card-layout="horizontal-right"]) :is(.card-media, .gallery-card__media, .staff-card__portrait, .group-card > img, .group-card__photo) { min-height: 9rem; grid-column: 1; grid-row: 1; }
    :where([data-card-layout="horizontal-left"], [data-card-layout="horizontal-right"]) :is(.content-card__body, .gallery-card__copy, .staff-card__copy, .group-card > div:not(.group-card__number):not(.group-card__photo)) { grid-column: 2; grid-row: 1; }
    :is(.content-grid, .group-grid, .gallery-preview-grid)[data-card-layout="editorial"],
    :where([data-card-layout="editorial"]) :is(.content-grid, .group-grid, .gallery-preview-grid) { grid-template-columns: 1fr; }
    :where([data-card-layout="editorial"]) :is(.content-card, .group-card, .gallery-card, .content-card:first-child, .group-card:first-child, .gallery-card:first-child) { grid-column: auto; }
    .site-footer__grid { grid-template-columns: 1fr; }
}

@media (max-width: 24rem) {
    .brand__mark { width: 2.65rem; }
    .brand__words strong { max-width: 9rem; }
    .nav-toggle { min-width: 2.8rem; padding-inline: .65rem; }
    .nav-toggle [data-nav-label] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
    .slider-controls { gap: .2rem; }
    .slider-arrow { display: none; }
    .slider-dots { gap: 0; }
    .slider-dot { min-width: 2rem; }
    .group-card { grid-template-columns: 1fr; }
    .staff-card { grid-template-columns: 1fr; }
    .staff-card__portrait { width: 8rem; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; }
    .content-card:hover, .button:hover { translate: none; }
    .content-card:hover .card-media img { scale: 1; }
}

/* `content-visibility: auto` + `contain-intrinsic-size` пропускаше рисуването на
   изнесеното съдържание и слагаше ЗАМЕСТИТЕЛ с фиксирана височина (34rem за
   картите, 48/64rem за секциите). Когато истинската карта е по-ниска от
   заместителя — на телефон естествената ѝ височина е ~25rem — разликата остава
   като МЪРТВО БЯЛО ПОЛЕ под текста, и то във всяка карта, включително най-
   високата. Печалбата в скорост е нищожна за 12 страници; коректната височина
   е по-важна. (THEME-TRAPS #27) */

@media (forced-colors: active) {
    *, *::before, *::after { box-shadow: none !important; }
    .theme-atmosphere, .header-ribbon, .footer-decor, .section-transition, .page-hero__decor, .hero-slide__art, .card-art, .gallery-art { display: none !important; }
    .button, .content-card, .group-card, .gallery-card, .contact-panel, .map-panel, .contact-form-panel, .public-notice, .faq-item { border: 2px solid CanvasText; }
}

@media print {
    .theme-atmosphere, .site-header, .site-footer, .slider-controls, .breadcrumbs, .button, .text-link { display: none !important; }
    body { color: #000; background: #fff; }
    main { width: 100%; }
    a { color: inherit; text-decoration: underline; }
}

/* ============================================================
   Slider layout kinds. The base look is the wide hero; each
   modifier reshapes the same slide DOM without layout shift:
   every kind fixes its own viewport height up front.
   ============================================================ */
.hero-slider--full-screen .hero-slider__viewport { min-height: clamp(38rem, 92svh, 60rem); }

/* Wave hero: full-bleed media with a soft double wave rolling over the bottom edge. */
.hero-slider--layered-story .hero-slide__media::before,
.hero-slider--layered-story .hero-slide__media::after {
    content: "";
    position: absolute;
    bottom: -9rem;
    left: -22%;
    z-index: 1;
    width: 150%;
    height: 13rem;
    background: color-mix(in srgb, var(--secondary) 45%, var(--canvas));
    border-radius: 48% 52% 0 0 / 100% 100% 0 0;
    rotate: -2.2deg;
    opacity: .85;
}
.hero-slider--layered-story .hero-slide__media::after {
    bottom: -9.6rem;
    left: -8%;
    background: var(--canvas);
    rotate: 1.6deg;
    opacity: 1;
}

.hero-slider--card-deck { padding: clamp(1.25rem, 3vw, 2.25rem) clamp(1rem, 4vw, 4rem) .5rem; background: transparent; }
.hero-slider--card-deck .hero-slide { overflow: hidden; border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); }
.hero-slider--card-deck .hero-slider__viewport { min-height: clamp(30rem, 62svh, 42rem); }
.hero-slider--card-deck .hero-slider__viewport::before,
.hero-slider--card-deck .hero-slider__viewport::after {
    content: "";
    position: absolute;
    inset: 1.25rem -.4rem -.65rem;
    z-index: -1;
    background: color-mix(in srgb, var(--secondary) 30%, var(--surface));
    border-radius: var(--radius-lg);
    rotate: 1.1deg;
}
.hero-slider--card-deck .hero-slider__viewport::after { inset: 2.25rem .4rem -1.2rem; background: color-mix(in srgb, var(--accent) 26%, var(--surface)); rotate: -1.3deg; }

.hero-slider--text-focus .hero-slider__viewport { min-height: clamp(26rem, 56svh, 34rem); }
.hero-slider--text-focus .hero-slide--with-copy .hero-slide__media::after { background: color-mix(in srgb, var(--canvas) 78%, transparent); }
.hero-slider--text-focus .hero-slide__content { align-items: center; justify-content: center; text-align: center; }
.hero-slider--text-focus .hero-copy > p:not(.eyebrow) { margin-inline: auto; }

.hero-slider--image-focus .hero-slide--with-copy .hero-slide__media::after { background: linear-gradient(0deg, color-mix(in srgb, var(--canvas) 88%, transparent) 0 22%, transparent 45%); }
.hero-slider--image-focus .hero-slide__content { align-items: end; padding-block: 2rem 4.5rem; }

.hero-slider--split-panel .hero-slide__media { inset: 0 0 0 40%; clip-path: polygon(11% 0, 100% 0, 100% 100%, 0 100%); }
.hero-slider--split-panel .hero-slide--with-copy .hero-slide__media::after { background: linear-gradient(104deg, var(--canvas) 6%, transparent 26%); }
.hero-slider--split-panel { background: var(--canvas); }
.hero-slider--split-panel .hero-slide::before,
.hero-slider--split-panel .hero-slide::after {
    content: "";
    position: absolute;
    top: -6%;
    bottom: -6%;
    z-index: 1;
    width: 1.4rem;
    background: var(--accent);
    rotate: 6deg;
}
.hero-slider--split-panel .hero-slide::before { left: 42.5%; }
.hero-slider--split-panel .hero-slide::after { left: 45%; width: .55rem; background: var(--secondary); }
.hero-slider--split-panel .hero-slide__content { align-items: center; }
.hero-slider--split-panel .hero-copy { max-width: 38%; background: none; box-shadow: none; }

/* Dry brush stroke: the photo lives inside a ragged horizontal paint stroke,
   with a second offset stroke in the secondary colour layered behind. */
.hero-slider--arch-window { --brush: polygon(6.0% 14.5%, 10.0% 15.6%, 14.0% 14.6%, 18.0% 15.4%, 22.0% 15.2%, 26.0% 12.5%, 30.0% 12.1%, 34.0% 15.4%, 38.0% 12.7%, 42.0% 12.3%, 46.0% 15.4%, 50.0% 12.9%, 54.0% 14.2%, 58.0% 12.4%, 62.0% 12.9%, 66.0% 10.5%, 70.0% 12.4%, 74.0% 13.2%, 78.0% 11.4%, 82.0% 12.1%, 86.0% 11.6%, 90.0% 8.7%, 94.0% 11.5%, 97.5% 14.0%, 88.0% 20.0%, 99.5% 26.0%, 90.0% 33.0%, 101.0% 42.0%, 89.0% 52.0%, 97.0% 58.0%, 88.0% 64.0%, 94.0% 78.8%, 90.0% 77.6%, 86.0% 76.6%, 82.0% 80.8%, 78.0% 79.2%, 74.0% 80.6%, 70.0% 81.6%, 66.0% 81.1%, 62.0% 82.3%, 58.0% 80.0%, 54.0% 82.2%, 50.0% 80.7%, 46.0% 83.3%, 42.0% 83.3%, 38.0% 79.8%, 34.0% 80.2%, 30.0% 80.8%, 26.0% 84.7%, 22.0% 82.4%, 18.0% 83.5%, 14.0% 82.2%, 10.0% 83.4%, 6.0% 83.1%, 2.5% 86.0%, 11.0% 79.0%, 0.5% 72.0%, 10.0% 64.0%, -1.0% 54.0%, 11.0% 46.0%, 3.0% 40.0%, 11.0% 33.0%); background: var(--canvas); }
.hero-slider--arch-window .hero-slide__media { inset: 2% 2% 4%; clip-path: var(--brush); }
.hero-slider--arch-window .hero-slide::before {
    content: "";
    position: absolute;
    inset: 5% 0 1% 4%;
    z-index: -3;
    clip-path: var(--brush);
    background: color-mix(in srgb, var(--secondary) 55%, var(--canvas));
}
.hero-slider--arch-window .hero-slide--with-copy .hero-slide__media::after { background: linear-gradient(90deg, color-mix(in srgb, var(--canvas) 78%, transparent) 0 24%, transparent 55%); }

.hero-slider--circle-spot { background: var(--canvas); }
.hero-slider--circle-spot { --splat: polygon(96.8% 50.0%, 98.0% 53.1%, 99.0% 56.4%, 99.4% 59.8%, 99.2% 63.2%, 98.3% 66.4%, 96.6% 69.3%, 94.2% 71.8%, 91.5% 73.9%, 88.5% 75.7%, 85.5% 77.3%, 82.8% 78.7%, 80.3% 80.3%, 78.1% 82.0%, 76.1% 84.1%, 74.3% 86.4%, 72.4% 88.8%, 70.3% 91.2%, 67.9% 93.2%, 65.1% 94.6%, 62.1% 95.3%, 59.0% 95.2%, 55.9% 94.5%, 52.9% 93.6%, 50.0% 92.7%, 47.2% 92.0%, 44.5% 91.7%, 41.7% 91.8%, 38.7% 92.2%, 35.5% 92.6%, 32.2% 93.0%, 28.8% 93.1%, 25.4% 92.6%, 22.3% 91.5%, 19.6% 89.6%, 17.4% 87.1%, 15.8% 84.2%, 14.8% 80.9%, 14.1% 77.6%, 13.6% 74.3%, 13.1% 71.3%, 12.4% 68.6%, 11.3% 66.0%, 9.9% 63.6%, 8.1% 61.2%, 6.2% 58.7%, 4.7% 56.0%, 3.7% 53.0%, 3.4% 50.0%, 3.9% 47.0%, 4.9% 44.1%, 6.1% 41.3%, 7.0% 38.5%, 7.6% 35.6%, 8.0% 32.6%, 8.2% 29.4%, 8.4% 26.0%, 9.0% 22.6%, 10.1% 19.4%, 11.7% 16.4%, 14.0% 14.0%, 16.7% 12.1%, 19.9% 10.8%, 23.3% 10.0%, 26.7% 9.7%, 30.1% 9.7%, 33.3% 9.7%, 36.3% 9.7%, 39.1% 9.5%, 41.8% 8.8%, 44.4% 7.8%, 47.2% 6.5%, 50.0% 5.2%, 53.0% 4.0%, 56.1% 3.5%, 59.2% 3.7%, 62.1% 4.7%, 64.8% 6.4%, 67.2% 8.5%, 69.5% 10.6%, 71.7% 12.4%, 74.2% 13.8%, 76.9% 15.0%, 79.8% 16.0%, 82.9% 17.1%, 86.0% 18.5%, 88.7% 20.3%, 90.9% 22.7%, 92.5% 25.5%, 93.4% 28.6%, 93.8% 31.9%, 93.9% 35.1%, 94.0% 38.2%, 94.3% 41.2%, 94.8% 44.1%, 95.7% 47.0%); }
.hero-slider--circle-spot .hero-slide__media {
    inset: 50% 6% auto auto;
    width: min(38rem, 40vw);
    aspect-ratio: 1.04;
    height: auto;
    max-height: 84%;
    clip-path: var(--splat);
    rotate: -3deg;
    translate: 0 -50%;
}
.hero-slider--circle-spot .hero-slide--with-copy .hero-slide__media::after { content: none; }
/* The colored under-splat peeks out behind the photo, and two loose droplets
   complete the spill. */
.hero-slider--circle-spot .hero-slide::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 5%;
    z-index: -3;
    width: min(39.5rem, 41.5vw);
    aspect-ratio: 1.04;
    max-height: 86%;
    clip-path: var(--splat);
    background: color-mix(in srgb, var(--accent) 60%, var(--canvas));
    rotate: 4deg;
    translate: 1.2% calc(-50% + .9rem);
}
.hero-slider--circle-spot .hero-slide::after {
    content: "";
    position: absolute;
    bottom: 13%;
    right: 43%;
    z-index: -3;
    width: 2.4rem;
    aspect-ratio: 1;
    background: var(--secondary);
    border-radius: 62% 38% 55% 45% / 48% 60% 40% 52%;
    rotate: -18deg;
}
.hero-slider--circle-spot .hero-slide__content { align-items: center; }
.hero-slider--circle-spot .hero-copy { max-width: 42%; }

.hero-slider--polaroid { background: var(--canvas); }
.hero-slider--polaroid .hero-slide__media { inset: clamp(1.5rem, 5svh, 3.5rem) 14% clamp(3.5rem, 9svh, 5.5rem); border: .9rem solid var(--surface); border-bottom-width: 3.2rem; border-radius: .4rem; box-shadow: var(--shadow-lg); rotate: -1.2deg; }
.hero-slider--polaroid .hero-slide__media::before { content: ""; position: absolute; top: -1.7rem; left: 50%; z-index: 2; width: 8rem; height: 1.9rem; background: color-mix(in srgb, var(--accent) 55%, transparent); rotate: -2deg; translate: -50% 0; border-radius: .15rem; }
.hero-slider--polaroid .hero-slide--with-copy .hero-slide__media::after { content: none; }

@media (max-width: 56rem) {
    .hero-slider--split-panel .hero-slide__media { inset: 0; }
    .hero-slider--split-panel .hero-copy, .hero-slider--circle-spot .hero-copy { max-width: none; }
    .hero-slider--circle-spot .hero-slide__media { inset: 1.25rem auto auto 50%; width: min(22rem, 84vw); translate: -50% 0; }
    .hero-slider--circle-spot .hero-slide__content { align-items: end; }
    .hero-slider--polaroid .hero-slide__media { inset: 1rem 6% 4.5rem; }
}

/* The public homepage slider intentionally mirrors the admin live preview. */
.hero-slider { width: min(1180px, calc(100% - 2rem)); margin: clamp(1rem, 2.5vw, 1.8rem) auto clamp(1.4rem, 3vw, 2.4rem); overflow: hidden; background: #eeeef4; border-radius: 12px; box-shadow: 0 14px 34px rgba(29,28,57,.12); isolation: isolate; }
.hero-slider__viewport { min-height: 0; aspect-ratio: 16 / 7; }
.hero-slide { min-height: 0; }
.hero-slide__media { inset: 0; z-index: 0; }
.hero-slider .hero-slide__media::before { content: none !important; display: none !important; }
.hero-slide--with-copy .hero-slide__media::after { background: linear-gradient(90deg, rgba(35,31,70,.78), rgba(35,31,70,.12) 72%); }
.hero-slide__content.shell { position: relative; z-index: 2; max-width: none; min-height: 100%; align-items: center; padding: 0 7%; }
.hero-copy { width: min(50%, 34rem); padding: 0; color: #fff; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
.hero-copy h2 { color: #fff; font-size: 3.2rem; line-height: 1.08; letter-spacing: 0; }
.hero-copy .eyebrow { color: #e9dd8b; }
.hero-copy > p:not(.eyebrow) { color: rgba(255,255,255,.86); font-size: 1.2rem; }
.hero-copy .button { color: #5142ad; background: #fff; }
.slider-controls { position: absolute; inset: 0; z-index: 3; display: block; width: 100%; max-width: none; padding: 0; pointer-events: none; }
.slider-controls > * { pointer-events: auto; }
.slider-arrow { position: absolute; top: 50%; width: 44px; min-width: 44px; height: 44px; min-height: 44px; padding: 0; color: #fff; background: rgba(28,25,58,.22); border: 1px solid rgba(255,255,255,.4); opacity: .5; transform: translateY(-50%); }
.slider-arrow[data-slider-previous] { left: 10px; }
.slider-arrow[data-slider-next] { right: 10px; }
.slider-dots { position: absolute; left: 50%; bottom: 0; display: flex; align-items: center; gap: 0; max-width: min(18rem, 72vw); min-height: 44px; padding: 0; overflow-x: auto; background: transparent; border: 0; border-radius: 0; scrollbar-width: none; transform: translateX(-50%); }
.slider-dots::-webkit-scrollbar { display: none; }
.slider-dot { position: relative; width: 44px; min-width: 44px; height: 44px; min-height: 44px; padding: 0; background: transparent; border: 0; border-radius: 999px; }
.slider-dot::before { display: block; width: 6px; height: 6px; content: ""; background: rgba(255,255,255,.55); border-radius: 999px; box-shadow: 0 0 0 1px rgba(28,25,58,.08); }
.slider-dot span { display: none; }
.slider-dot[aria-current="true"] { width: 44px; background: transparent; }
.slider-dot[aria-current="true"]::before { width: 18px; background: #fff; }
.hero-slider--full-screen .hero-slider__viewport { min-height: 0; aspect-ratio: 16 / 8.6; }
.hero-slider--card-deck { padding: 0; border: 10px solid #f7f7fb; border-radius: 18px; }
.hero-slider--card-deck .hero-slider__viewport { min-height: 0; }
.hero-slider--card-deck .hero-slider__viewport::before,
.hero-slider--card-deck .hero-slider__viewport::after,
.hero-slider--split-panel .hero-slide::before,
.hero-slider--split-panel .hero-slide::after,
.hero-slider--circle-spot .hero-slide::before,
.hero-slider--circle-spot .hero-slide::after,
.hero-slider--polaroid .hero-slide__media::before { content: none; }
.hero-slider--layered-story .hero-slide__media { clip-path: inset(0 0 8% 0 round 0 0 45% 45%); }
.hero-slider--text-focus .hero-slide--with-copy .hero-slide__media::after { background: rgba(35,31,70,.62); }
.hero-slider--text-focus .hero-slide__content { justify-content: center; text-align: center; }
.hero-slider--text-focus .hero-copy { width: min(72%, 44rem); }
.hero-slider--text-focus .hero-copy > p:not(.eyebrow) { margin-inline: auto; }
.hero-slider--image-focus .hero-slide--with-copy .hero-slide__media::after { background: linear-gradient(0deg, rgba(35,31,70,.72), transparent 36%); }
.hero-slider--image-focus .hero-slide__content { align-items: end; padding-bottom: 6%; }
.hero-slider--split-panel { background: #fdf4ec; }
.hero-slider--split-panel .hero-slide__media { inset: 0 0 0 44%; clip-path: none; }
.hero-slider--split-panel .hero-slide__media picture,
.hero-slider--split-panel .hero-slide__media img { width: 100%; height: 100%; }
.hero-slider--split-panel .hero-slide--with-copy .hero-slide__media::after { background: linear-gradient(90deg, #fdf4ec 0, transparent 26%); }
.hero-slider--split-panel .hero-copy { width: 36%; color: #33324e; }
.hero-slider--split-panel .hero-copy h2 { color: #33324e; }
.hero-slider--split-panel .hero-copy > p:not(.eyebrow) { color: #6b6a84; }
.hero-slider--arch-window { background: #fdf4ec; }
.hero-slider--arch-window .hero-slide__media { inset: 7% 6% 0; clip-path: inset(0 0 0 0 round 45% 45% 0 0); }
.hero-slider--arch-window .hero-slide--with-copy .hero-slide__media::after { clip-path: inset(0 0 0 0 round 45% 45% 0 0); }
.hero-slider--circle-spot { background: #fdf4ec; }
.hero-slider--circle-spot .hero-slide__media { inset: auto 5% auto auto; top: 50%; width: 40%; height: auto; aspect-ratio: 1.08; border-radius: 58% 42% 55% 45% / 52% 46% 58% 44%; transform: translateY(-50%) rotate(-2.5deg); box-shadow: 0 0 0 6px rgba(240,180,60,.35), 0 14px 30px rgba(29,28,57,.18); clip-path: none; }
.hero-slider--circle-spot .hero-slide--with-copy .hero-slide__media::after { content: none; }
.hero-slider--circle-spot .hero-copy { width: 42%; color: #33324e; }
.hero-slider--circle-spot .hero-copy h2 { color: #33324e; }
.hero-slider--circle-spot .hero-copy > p:not(.eyebrow) { color: #6b6a84; }
.hero-slider--polaroid { background: #fdf4ec; }
.hero-slider--polaroid .hero-slide__media { inset: 6% 14% 16%; border: 7px solid #fff; border-bottom-width: 26px; border-radius: 4px; box-shadow: 0 14px 30px rgba(29,28,57,.18); rotate: -1.2deg; }
.hero-slider--polaroid .hero-slide--with-copy .hero-slide__media::after { content: none; }
@media (max-width: 56rem) {
    .hero-slider { width: min(100% - 1rem, 40rem); border-radius: 10px; }
    .hero-slider .hero-slider__viewport { aspect-ratio: auto; min-height: max(20rem, var(--slider-copy-height, 26rem)); }
    .hero-slider .hero-copy { width: 100%; max-width: none; min-width: 0; padding: 0; overflow-wrap: anywhere; }
    .hero-slider .hero-slide__content.shell { width: 100%; padding: 1.75rem 3.25rem 3rem; align-items: center; }
    .hero-slider .hero-copy h2 { font-size: 1.5rem; line-height: 1.2; margin-bottom: .65rem; letter-spacing: 0; }
    .hero-slider .hero-copy > p:not(.eyebrow) { font-size: 1rem; line-height: 1.45; margin-block: .65rem; }
    .hero-slider .hero-copy .eyebrow { font-size: .75rem; letter-spacing: 0; margin-block: 0 .5rem; }
    .hero-slider .hero-copy .button { min-height: 44px; max-width: 100%; height: auto; padding: .6rem .9rem; font-size: .9rem; line-height: 1.35; white-space: normal; overflow-wrap: anywhere; }
    .hero-slider .hero-copy .button span { flex-shrink: 0; }
    .hero-slider--split-panel .hero-slide__media,
    .hero-slider--circle-spot .hero-slide__media { inset: 0; top: auto; width: auto; height: auto; transform: none; border-radius: 0; box-shadow: none; rotate: 0deg; }
    .hero-slider--polaroid .hero-slide__media { inset: 1rem 6% 4.5rem; }
}
@media (max-width: 24rem) {
    .slider-arrow { display: none; }
    .hero-slider .hero-slide__content.shell { padding-inline: 1.25rem; }
}

/* Летописна книга — четец с прелистване.
   Мерките повтарят четеца от предишния сайт: светъл фон с лек оттенък, чер кръгъл
   бутон за затваряне, дискретни стрелки по края и една лента с бутони долу. */
.book-shelf { display: grid; justify-items: center; gap: 2rem; }
.book { display: grid; justify-items: center; width: 100%; }

/* Затворената книга: корицата такава, каквато е, върху сива подложка. */
.book-thumb { display: grid; gap: .75rem; justify-items: center; width: min(22rem, 82vw); padding: 0; background: none; border: 0; cursor: pointer; }
.book-thumb__paper { position: relative; display: block; width: 100%; padding: 1px; background: #ccc; box-shadow: 0 1px 2px rgb(0 0 0 / .22); transition: transform .25s var(--ease), box-shadow .25s var(--ease); }
.book-thumb:hover .book-thumb__paper, .book-thumb:focus-visible .book-thumb__paper { transform: translateY(-.25rem); box-shadow: 0 .7rem 1.6rem rgb(0 0 0 / .25); }
.book-thumb__paper::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgb(0 0 0 / .10) 0 3px, transparent 3px); pointer-events: none; }
.book-thumb canvas { display: block; width: 100%; height: auto; background: #fff; }
.book-thumb__title { color: var(--text); font-weight: 650; font-size: 1.05rem; text-align: center; }

/* Четецът заема целия екран. */
body.book-open { overflow: hidden; }
.book-overlay { position: fixed; inset: 0; z-index: 9999; display: grid; grid-template-rows: 1fr; background-color: color-mix(in srgb, var(--secondary) 78%, #06151a); background-image: var(--book-reader-background-d, none); background-repeat: no-repeat; background-position: right bottom; background-size: min(44rem, 48vw) auto; background-blend-mode: soft-light; }
.book-overlay > * { position: relative; z-index: 1; }
.book-overlay[hidden] { display: none; }
.book-overlay svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.book-close { position: absolute; top: 5px; right: 5px; z-index: 6; width: 40px; height: 40px; padding: 10px; display: grid; place-items: center; background: #000; color: #fff; border: 0; border-radius: 50%; cursor: pointer; transition: transform .2s var(--ease); }
.book-close:hover { transform: scale(1.06); }
/* Четецът получава фокус при отваряне; пръстенът се показва само при работа
   с клавиатура, за да не се вижда цветен ореол при щракване с мишка. */
.book-close:focus { outline: none; }
.book-close:focus-visible { outline: 2px solid #000; outline-offset: 3px; }
.book-bar__btn:focus { outline: none; }
.book-bar__btn:focus-visible { outline: 2px solid #555; outline-offset: -3px; }

/* Дискретни стрелки по края — без фон, едва видими, както в стария четец. */
.book-edge { position: absolute; top: 50%; translate: 0 -50%; z-index: 5; width: 40px; height: 64px; padding: 14px; display: grid; place-items: center; background: none; color: #000; border: 0; border-radius: 50%; opacity: .3; cursor: pointer; transition: opacity .2s var(--ease); }
.book-edge:hover { opacity: .65; }
.book-edge--prev { left: 6px; }
.book-edge--next { right: 6px; }
.book-edge svg { stroke-width: 1.4; }

.book-viewport { position: relative; overflow: hidden; display: grid; place-items: center; padding: 1.6rem 3.2rem 4.4rem; touch-action: none; }
.book-zoom { transition: transform .25s var(--ease); will-change: transform; }
.is-zoomed .book-viewport { cursor: grab; }
.is-zoomed .book-viewport:active { cursor: grabbing; }

/* Книгата: две страници на гръб, с ръбове на листата отстрани. */
.book-vol { position: relative; display: flex; perspective: 2800px; filter: drop-shadow(0 .9rem 1.6rem rgb(0 0 0 / .22)); }
.book-vol.is-swapping { animation: book-swap .26s var(--ease); }
@keyframes book-swap { from { opacity: .3; } }
.book-vol::before, .book-vol::after { content: ""; position: absolute; top: .4%; bottom: .4%; pointer-events: none; background: repeating-linear-gradient(90deg, #fcfcfa 0 1px, #d6d2c8 1px 2px); }
.book-vol::before { right: 100%; width: var(--stack-left, 0px); border-radius: 2px 0 0 2px; }
.book-vol::after { left: 100%; width: var(--stack-right, 0px); border-radius: 0 2px 2px 0; }
.book-vol::before, .book-vol::after { display: none; }
.book-page { position: relative; flex: 1 1 50%; overflow: hidden; background: #fff; }
.book-vol.is-single .book-page--left { display: none; }
.book-page--left::after, .book-page--right::after { content: ""; position: absolute; inset-block: 0; width: 6%; pointer-events: none; }
.book-page--left::after { right: 0; background: linear-gradient(270deg, rgb(0 0 0 / .15), transparent); }
.book-page--right::after { left: 0; background: linear-gradient(90deg, rgb(0 0 0 / .15), transparent); }
.book-vol.is-single .book-page--right::after { display: none; }
.book-page.is-empty { background: #f6f6f4; }
.book-page.is-empty canvas { visibility: hidden; }
.book-page canvas { display: block; width: 100%; height: 100%; }

/* Летящият лист: две лица, панта при гърба, истинско завъртане. */
.book-sheet { --book-turn-angle: 0deg; --book-curl-progress: 0; --book-curl-opacity: 0; position: absolute; inset-block: 0; width: 50%; z-index: 4; transform-style: preserve-3d; pointer-events: none; }
.book-sheet[hidden] { display: none; }
.book-sheet.from-right { left: 50%; transform-origin: left center; }
.book-sheet.from-left { left: 0; transform-origin: right center; }
.book-vol.is-single .book-sheet { width: 100%; left: 0; }
.book-sheet.is-dragging { transform: rotateY(var(--book-turn-angle)); transition: none; }
.book-sheet.is-settling { transform: rotateY(var(--book-turn-angle)); transition: transform .2s cubic-bezier(.2,.8,.2,1); }
.book-sheet::before { content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none; opacity: var(--book-curl-opacity); background: linear-gradient(90deg, rgb(0 0 0 / .32), transparent 24%, rgb(255 255 255 / .35) 54%, transparent 78%); mix-blend-mode: multiply; }
.book-sheet.from-right.is-turned { animation: book-leaf-fwd .7s cubic-bezier(.38,.06,.28,.97) both; }
.book-sheet.from-left.is-turned { animation: book-leaf-back .7s cubic-bezier(.38,.06,.28,.97) both; }
@keyframes book-leaf-fwd { to { transform: rotateY(-180deg); } }
@keyframes book-leaf-back { to { transform: rotateY(180deg); } }
.book-sheet__face { position: absolute; inset: 0; overflow: hidden; background: #fff; backface-visibility: hidden; }
.book-sheet__face canvas { display: block; width: 100%; height: 100%; }
.book-sheet__face--back { transform: rotateY(180deg); }
.book-sheet__face::after { content: ""; position: absolute; inset: 0; pointer-events: none; }
.book-sheet.from-right .book-sheet__face--front::after { background: linear-gradient(90deg, rgb(0 0 0 / .2), transparent 32%); }
.book-sheet.from-right .book-sheet__face--back::after { background: linear-gradient(270deg, rgb(0 0 0 / .2), transparent 32%); }
.book-sheet.from-left .book-sheet__face--front::after { background: linear-gradient(270deg, rgb(0 0 0 / .2), transparent 32%); }
.book-sheet.from-left .book-sheet__face--back::after { background: linear-gradient(90deg, rgb(0 0 0 / .2), transparent 32%); }
@media (prefers-reduced-motion: reduce) { .book-sheet.is-turned { animation: none !important; } .book-zoom { transition: none; } }

/* Лентата долу: един слят блок, точно както в предишния четец. */
.book-bar { position: absolute; bottom: 10px; left: 50%; translate: -50% 0; z-index: 6; display: flex; align-items: stretch; height: 40px; background: #f7f7f7; border-radius: 5px; box-shadow: 0 1px 4px rgb(0 0 0 / .3); overflow: hidden; }
.book-bar__btn { width: 35px; padding: 10px; display: grid; place-items: center; background: #f7f7f7; color: #888; border: 0; cursor: pointer; transition: background .18s var(--ease), color .18s var(--ease); }
.book-bar__btn:hover:not(.is-disabled) { background: #ececec; color: #555; }
.book-bar__btn.is-disabled, .book-bar__btn:disabled { color: #ccc; cursor: default; }
.book-bar__page { min-width: 50px; padding: 0 5px; display: grid; place-items: center; background: rgb(0 0 0 / .03); color: #888; font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }

.book-loading { position: absolute; inset: auto 0 4.2rem; z-index: 5; margin: 0; color: #555; text-align: center; font-weight: 600; }
.book-loading[hidden] { display: none; }

@media (max-width: 799px) {
    .book-overlay { background-image: var(--book-reader-background-m, var(--book-reader-background-d, none)); background-position: center bottom; background-size: min(24rem, 76vw) auto; }
    .book-viewport { padding: .6rem 2.4rem 3.8rem; }
    .book-edge { width: 32px; height: 52px; padding: 10px; }
    .book-edge--prev { left: 2px; }
    .book-edge--next { right: 2px; }
}
@media (forced-colors: active) {
    .book-overlay { background: Canvas; }
    .book-bar { border: 1px solid CanvasText; }
}



/* Content reveal animations (admin-selectable; JS adds html.reveal-ready, so content
   is never hidden without JavaScript). */
html.reveal-ready body[data-animation]:not([data-animation="none"]) [data-reveal] {
    opacity: 0;
    transition: opacity .55s ease, transform .55s ease;
    will-change: opacity, transform;
}
html.reveal-ready body[data-animation="fade-up"] [data-reveal] { transform: translateY(1.4rem); }
html.reveal-ready body[data-animation="fade-down"] [data-reveal] { transform: translateY(-1.4rem); }
html.reveal-ready body[data-animation="fade-left"] [data-reveal] { transform: translateX(-1.6rem); }
html.reveal-ready body[data-animation="fade-right"] [data-reveal] { transform: translateX(1.6rem); }
html.reveal-ready body[data-animation="zoom-in"] [data-reveal] { transform: scale(.92); }
html.reveal-ready body[data-animation="zoom-soft"] [data-reveal] { transform: scale(.97); }
html.reveal-ready body[data-animation="slide-up"] [data-reveal] { transform: translateY(2.4rem); }
html.reveal-ready body[data-animation="pop"] [data-reveal] { transform: scale(.85); transition-timing-function: cubic-bezier(.34,1.56,.64,1), cubic-bezier(.34,1.56,.64,1); }
html.reveal-ready body[data-animation="flip-soft"] [data-reveal] { transform: perspective(900px) rotateX(7deg) translateY(.9rem); }
html.reveal-ready body[data-animation="stagger-reveal"] [data-reveal] { transform: translateY(1.2rem); transition-delay: var(--reveal-delay, 0s); }
html.reveal-ready body[data-animation] [data-reveal].is-revealed { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
    html.reveal-ready body[data-animation] [data-reveal] { opacity: 1 !important; transform: none !important; transition: none !important; }
}
.rich-text figure.content-figure, .content-body figure.content-figure { margin: 1.6rem 0; }
.rich-text img, .content-body img { max-width: 100% !important; height: auto !important; }
.rich-text figure.content-figure img, .content-body figure.content-figure img { width: 100%; height: auto; border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.rich-text figure.content-figure figcaption, .content-body figure.content-figure figcaption { margin-top: .5rem; color: var(--muted); font-size: .92rem; text-align: center; }

/* Движение на самите карти (избира се в дизайн студиото, отделно от появяването
   на разделите). Изключва се напълно при намалено движение. */
@media (prefers-reduced-motion: no-preference) {
    body[data-card-animation]:not([data-card-animation="none"]) :is(.content-card, .group-card, .gallery-card, .staff-card) {
        transition: transform .32s var(--ease), box-shadow .32s var(--ease), border-color .32s var(--ease);
        will-change: transform;
    }
    body[data-card-animation="lift"] :is(.content-card, .group-card, .gallery-card, .staff-card):hover {
        transform: translateY(-.5rem);
        box-shadow: 0 1.4rem 2.6rem color-mix(in srgb, var(--text) 20%, transparent);
    }
    body[data-card-animation="tilt"] :is(.content-card, .group-card, .gallery-card, .staff-card) { transform-style: preserve-3d; }
    body[data-card-animation="tilt"] :is(.content-card, .group-card, .gallery-card, .staff-card):hover {
        transform: perspective(900px) rotateX(3deg) rotateY(-3deg) translateY(-.25rem);
        box-shadow: 0 1.2rem 2.2rem color-mix(in srgb, var(--text) 18%, transparent);
    }
    body[data-card-animation="glow"] :is(.content-card, .group-card, .gallery-card, .staff-card):hover {
        border-color: var(--accent);
        box-shadow: 0 0 0 .28rem color-mix(in srgb, var(--accent) 40%, transparent), 0 .9rem 2rem color-mix(in srgb, var(--text) 14%, transparent);
    }
    body[data-card-animation="zoom-cover"] :is(.content-card, .group-card, .gallery-card) :is(.card-media, .gallery-card__media) { overflow: hidden; }
    body[data-card-animation="zoom-cover"] :is(.content-card, .group-card, .gallery-card) :is(.card-media, .gallery-card__media) img {
        transition: transform .5s var(--ease);
    }
    body[data-card-animation="zoom-cover"] :is(.content-card, .group-card, .gallery-card):hover :is(.card-media, .gallery-card__media) img {
        transform: scale(1.07);
    }
    body[data-card-animation="rise-shadow"] :is(.content-card, .group-card, .gallery-card, .staff-card):hover {
        transform: translateY(-.28rem) scale(1.012);
        box-shadow: 0 1.8rem 3rem color-mix(in srgb, var(--primary) 22%, transparent);
    }
    body[data-card-animation="border-draw"] :is(.content-card, .group-card, .gallery-card, .staff-card) { position: relative; }
    body[data-card-animation="border-draw"] :is(.content-card, .group-card, .gallery-card, .staff-card)::before {
        content: ""; position: absolute; inset: 0; z-index: 4; pointer-events: none;
        border: .18rem solid var(--primary); border-radius: inherit;
        clip-path: inset(0 100% 100% 0); transition: clip-path .45s var(--ease);
    }
    body[data-card-animation="border-draw"] :is(.content-card, .group-card, .gallery-card, .staff-card):hover::before {
        clip-path: inset(0);
    }
}

/* Подредени карти: в един ред всички карти са еднакво високи, краткият текст е
   с еднакъв брой редове, а връзката „Прочетете“ винаги стои най-долу. Без това
   картите се разминаваха с по един-два реда и редът изглеждаше небрежен. */
.content-grid { align-items: stretch; }
.content-grid > .content-card { height: 100%; }
.content-card__body { gap: .5rem; }
.content-card__body > h3 {
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
    overflow: hidden; margin: 0;
}
.content-card__body > p {
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;
    overflow: hidden; margin: 0; color: var(--muted);
}
.content-card__body > .card-link { margin-top: auto; padding-top: .55rem; }
.group-card, .gallery-card, .staff-card { height: 100%; }
:is(.group-card, .staff-card) :is(h3, p) {
    display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden;
}
:is(.group-card, .staff-card) h3 { -webkit-line-clamp: 2; }
:is(.group-card, .staff-card) p { -webkit-line-clamp: 3; }

/* MOTIF-ANCHORS */
/* Мотиви на темата: рисуваните предмети се повтарят на едни и същи места във
   всички теми, за да има цялост — както е в „Калинка“. Всяка тема подава само
   двата си образа през променливите по-долу; местата им са общи.
     --theme-spot    : един предмет (256px), за акценти
     --theme-corner  : сноп предмети (720px), за ъгли на секции и долния колонтитул */
body[data-decoration-density="none"] .theme-spot,
body[data-decoration-density="none"] .home-section::after,
body[data-decoration-density="none"] .site-footer::after { display: none; }

/* 1) Активната страница в менюто получава знака на темата. */
body:not([data-decoration-density="none"]) .primary-nav__item > a[aria-current="page"]::before,
body:not([data-decoration-density="none"]) .primary-nav__item > .nav-group[data-current] > summary::before {
    content: var(--theme-spot-content, none);
    position: absolute;
    inset: 50% auto auto .5rem;
    translate: 0 -50%;
    width: 1.4rem;
    aspect-ratio: 1.35;
    background: var(--theme-spot) center / contain no-repeat;
    rotate: -10deg;
    pointer-events: none;
}
body:not([data-decoration-density="none"]) .primary-nav__item > a[aria-current="page"] {
    position: relative;
    padding-left: 2.2rem;
}

/* 2) Заглавието на всяка секция носи същия знак, по-едър. */
body:not([data-decoration-density="none"]) .section-heading {
    position: relative;
    padding-left: clamp(3.2rem, 5vw, 4.6rem);
}
body:not([data-decoration-density="none"]) .section-heading::before {
    content: var(--theme-spot-content, none);
    position: absolute;
    inset: -.35rem auto auto 0;
    width: clamp(2.6rem, 4.4vw, 3.8rem);
    aspect-ratio: 1.35;
    background: var(--theme-spot) center / contain no-repeat;
    filter: drop-shadow(0 .3rem .4rem rgb(24 33 43 / .18));
    rotate: -8deg;
    pointer-events: none;
}

/* 2b) Вътрешният hero използва конкретния предмет на темата вместо общ размит
   пръстен. Така страницата носи характер, без голяма фонова илюстрация зад текста. */
body:not([data-decoration-density="none"]) .page-hero__decor {
    inset: 1.15rem auto auto max(1rem, calc((100vw - 76rem) / 2));
    width: clamp(4.2rem, 7vw, 6.7rem);
    border: 0;
    background: var(--theme-spot) center / contain no-repeat;
    filter: drop-shadow(0 .35rem .45rem rgb(24 33 43 / .18));
    opacity: .96;
    rotate: -8deg;
}

/* 3) Всяка трета карта носи знака в горния си ъгъл. */
body:not([data-decoration-density="none"]) .content-card:nth-child(3n + 1) {
    position: relative;
}
body:not([data-decoration-density="none"]) .content-card:nth-child(3n + 1)::after {
    content: var(--theme-spot-content, none);
    position: absolute;
    z-index: 3;
    inset: .6rem .6rem auto auto;
    width: 2.5rem;
    aspect-ratio: 1.35;
    background: var(--theme-spot) center / contain no-repeat;
    filter: drop-shadow(0 .18rem .22rem rgb(24 37 23 / .2));
    rotate: 12deg;
    pointer-events: none;
}

/* 4) Ъглите на секциите в началната страница носят снопа, редувайки страните. */
body:not([data-decoration-density="none"]) .home-section { overflow: visible; }
body:not([data-decoration-density="none"]) .home-section::after {
    content: var(--theme-corner-content, none);
    position: absolute;
    z-index: 0;
    inset: auto -2.5rem -3.5rem auto;
    width: min(26rem, 32vw);
    aspect-ratio: 1.41;
    background: var(--theme-corner) right bottom / contain no-repeat;
    opacity: .92;
    pointer-events: none;
}
body:not([data-decoration-density="none"]) .home-section:nth-child(2n)::after {
    inset: auto auto -3.5rem -2.5rem;
    background-position: left bottom;
    scale: -1 1;
}

/* 5) Долният колонтитул носи снопа в десния си ъгъл. */
body:not([data-decoration-density="none"]) .site-footer { position: relative; overflow: hidden; }
body:not([data-decoration-density="none"]) .site-footer::after {
    content: var(--theme-corner-content, none);
    position: absolute;
    z-index: 0;
    inset: auto -1.5rem -2rem auto;
    width: min(24rem, 30vw);
    aspect-ratio: 1.41;
    background: var(--theme-corner) right bottom / contain no-repeat;
    opacity: .5;
    pointer-events: none;
}
body:not([data-decoration-density="none"]) .site-footer > * { position: relative; z-index: 1; }

/* Ниска плътност на украсата: остават само знаците, снопчетата се скриват. */
body[data-decoration-density="low"] .home-section::after,
body[data-decoration-density="low"] .site-footer::after { display: none; }

@media (max-width: 48rem) {
    body:not([data-decoration-density="none"]) .home-section::after { width: 15rem; inset: auto -1.5rem -2rem auto; }
    body:not([data-decoration-density="none"]) .site-footer::after { width: 13rem; }
    body:not([data-decoration-density="none"]) .section-heading { padding-left: 3.2rem; }
}
@media (prefers-reduced-motion: no-preference) {
    body:not([data-decoration-density="none"]) .content-card:nth-child(3n + 1)::after { transition: rotate .35s var(--ease), scale .35s var(--ease); }
    body:not([data-decoration-density="none"]) .content-card:nth-child(3n + 1):hover::after { rotate: 0deg; scale: 1.08; }
}

/* Голямата сцена вече не се разтяга като фон на цялата страница. Темата се чете
   през ясни мотиви, разделители, палитра и форми; сцената остава само като малък
   спокоен ъглов акцент, ако темата има такава. */
.theme-atmosphere__art {
    position: absolute;
    inset: auto 0 0 auto;
    width: min(36rem, 42vw);
    height: min(26rem, 58svh);
    background-image: var(--theme-artwork);
    background-position: var(--theme-art-position, right bottom);
    background-repeat: no-repeat;
    background-size: var(--theme-art-size, contain);
    background-attachment: scroll;
    opacity: var(--theme-art-opacity, .16);
    mask-image: linear-gradient(135deg, transparent 0 16%, #000 42%);
}
@media (max-width: 48rem) {
    body:not([data-decoration-density="none"]) .page-hero__decor {
        width: 3.8rem;
        inset: 1rem auto auto 1rem;
    }

    .theme-atmosphere__art {
        width: 18rem;
        height: 18rem;
        background-position: var(--theme-art-position-mobile, center top);
        background-size: var(--theme-art-size-mobile, contain);
        opacity: var(--theme-art-opacity-mobile, .12);
    }
}

/* Основното изображение се отваря като всяка друга снимка: връзката е самата
   картина, затова носи нейната форма. */
.content-section__media > a { display: block; overflow: hidden; border-radius: var(--radius-md); }
.content-section__media > a img { display: block; transition: scale .25s var(--ease); }
.content-section__media > a:hover img { scale: 1.03; }

/* Съобщение за бисквитки: тясна лента долу, която не закрива съдържанието. */
.cookie-notice { position: fixed; z-index: 60; inset: auto 1rem 1rem; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 1rem; max-width: 62rem; margin-inline: auto; padding: .9rem 1.15rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-lg); }
.cookie-notice[hidden] { display: none; }
.cookie-notice p { flex: 1 1 22rem; margin: 0; color: var(--muted); font-size: .88rem; line-height: 1.5; }
.cookie-notice a { color: var(--primary); }
.cookie-notice .button { flex: none; }

/* Плъзгане с пръст по всички слайдери: вертикалното скролване остава на
   браузъра, хоризонталният жест стига до слайдера. */
[data-slider-root] { touch-action: pan-y; }