/* =============================================================================
   style-theme.css — премиум визуален слой
   ОУ „Алеко Константинов“, гр. Пловдив

   Зарежда се СЛЕД style-editorial.css на всяка страница и надгражда базовите
   стилове: тухлено + маслинено + бяло, glassmorphism навигация,
   заоблени ъгли, меки сенки, hover микро-интеракции и луксозна хронология.

   Структурата на HTML не е променяна — всичко тук е само визуален слой, така
   че цялата логика в script-editorial.js продължава да работи непокътната.

   Секции:
     1. Токени (цветове, радиуси, сенки, преходи)
     2. Навигация — glassmorphism
     3. Карти и контейнери — радиуси и дълбочина
     4. Бутони и връзки — hover с уголемяване и сияние
     5. Хронология „Нашата история“ — fade-in-up
     6. Медийна мрежа — Новини, Алеко ТВ, Вестник
     7. Чат уиджет „Алекознайко“
     8. Мобилна визия
     9. prefers-reduced-motion
============================================================================= */

/* ---------------------------------------------------------------------------
   1. ТОКЕНИ
--------------------------------------------------------------------------- */

:root{
  /* тухлено — основен авторитетен цвят */
  --clay:#A24C36;
  --clay-deep:#7C3A29;
  --clay-soft:#C06A4E;
  --clay-tint:#F4E2D9;
  --clay-mist:#FDF8F4;

  /* маслинено — акцент за живот и движение */
  --sage:#6E9C5C;
  --sage-deep:#2F6F66;
  --sage-tint:#E3EAD9;

  /* радиуси — минималистично заоблени, единна система */
  --r-sm:10px;
  --r-md:14px;
  --r-lg:16px;
  --r-pill:999px;

  /* сенки — меки, синкави, с усещане за дълбочина */
  --sh-1:0 2px 8px rgba(36,30,25,.05);
  --sh-2:0 10px 30px rgba(36,30,25,.09);
  --sh-3:0 18px 44px -12px rgba(36,30,25,.16);
  --sh-4:0 28px 64px -20px rgba(36,30,25,.24);
  --sh-glow:0 0 0 4px rgba(162,76,54,.12);
  --sh-glow-em:0 0 0 4px rgba(110,156,92,.16);

  /* стъкло */
  --glass:rgba(251,248,241,.72);
  --glass-line:rgba(255,255,255,.65);

  --ease:cubic-bezier(.16,.8,.3,1);
  --t:all .3s ease;
}

/* ---------------------------------------------------------------------------
   2. НАВИГАЦИЯ — GLASSMORPHISM
   Плаващ стъклен бар, който се отделя от съдържанието при скролване.
--------------------------------------------------------------------------- */

.ed-nav{
  transition:padding .35s var(--ease), background .35s ease,
             box-shadow .35s ease, top .25s ease,
             left .35s var(--ease), right .35s var(--ease),
             border-radius .35s ease;
}

.ed-nav.scrolled{
  top:calc(var(--ed-banner-h, 0px) + 12px);
  left:16px;
  right:16px;
  padding:14px 32px;
  border-radius:var(--r-lg);
  background:var(--glass);
  backdrop-filter:blur(18px) saturate(1.6);
  -webkit-backdrop-filter:blur(18px) saturate(1.6);
  border:1px solid var(--glass-line);
  box-shadow:var(--sh-2), inset 0 1px 0 rgba(255,255,255,.8);
}

/* тънка синя нишка по долния ръб — подсказва, че барът е „над“ страницата */
.ed-nav.scrolled::after{
  content:'';
  position:absolute;
  left:22px; right:22px; bottom:0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(162,76,54,.22), transparent);
  pointer-events:none;
}

.ed-nav.scrolled .ed-wordmark{ color:var(--clay); }
.ed-nav.scrolled .ed-wordmark sup{ color:var(--sage); }

.ed-menu-btn{ border-radius:var(--r-pill); padding:6px 12px; margin-left:-12px; transition:var(--t); }
.ed-menu-btn:hover{ background:rgba(162,76,54,.07); transform:scale(1.04); }
.ed-nav.on-dark:not(.scrolled) .ed-menu-btn:hover{ background:rgba(255,255,255,.14); }

.ed-contact{
  padding:8px 18px;
  border-radius:var(--r-pill);
  background:var(--clay);
  color:#fff !important;
  font-weight:700;
  transition:var(--t);
}
.ed-contact:hover{
  transform:scale(1.05);
  background:var(--clay-deep);
  box-shadow:var(--sh-glow), var(--sh-2);
}

/* стъклен ефект и за fullscreen менюто */
.ed-overlay{
  background:linear-gradient(180deg, rgba(251,248,241,.94), rgba(248,240,226,.97));
  backdrop-filter:blur(22px) saturate(1.4);
  -webkit-backdrop-filter:blur(22px) saturate(1.4);
}
.ed-ov-item{ border-radius:var(--r-md); transition:var(--t); }
.ed-ov-item:hover,
.ed-ov-item.active{
  color:var(--clay);
  transform:translateX(8px);
}
.ed-ov-panel{
  border-radius:var(--r-md);
  background:rgba(255,255,255,.7);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:var(--sh-2);
}
.ed-ov-panel a{ border-radius:var(--r-sm); transition:var(--t); }
.ed-ov-panel a:hover{ color:var(--clay); background:var(--clay-tint); padding-left:14px; }
.ed-ov-panel a.current{ color:var(--sage-deep); font-weight:700; }

/* ---------------------------------------------------------------------------
   3. КАРТИ И КОНТЕЙНЕРИ — единна система от радиуси и дълбочина
--------------------------------------------------------------------------- */

.ed-prog-card,
.ed-news-card,
.ed-news-hero,
.ed-media-card,
.ed-doc-cat,
.ed-doc-cat-btn,
.ed-doc-cat-panel,
.ed-page-card,
.ed-team-card,
.ed-info-card,
.ed-stat-card,
.ed-pin-text{
  border-radius:var(--r-lg);
}

.ed-prog-card{
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--sh-1);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease),
             border-color .3s ease;
}
/* фините тонирани фонове се заменят с чисто бяло + цветен ляв кант, за да
   остане фонът четлив, а цветът да носи информация, не декорация */
.ed-prog-card:nth-of-type(6n+1),
.ed-prog-card:nth-of-type(6n+2),
.ed-prog-card:nth-of-type(6n+3),
.ed-prog-card:nth-of-type(6n+4),
.ed-prog-card:nth-of-type(6n+5),
.ed-prog-card:nth-of-type(6n+6){ background:#fff; }

.ed-prog-card::after{
  content:'';
  position:absolute;
  left:0; top:22px; bottom:22px;
  width:3px;
  border-radius:0 3px 3px 0;
  background:linear-gradient(180deg, var(--clay), var(--sage));
  opacity:.55;
  transition:opacity .35s ease, top .35s var(--ease), bottom .35s var(--ease);
}
.ed-prog-card:hover{
  transform:translateY(-8px) scale(1.015);
  border-color:rgba(162,76,54,.28);
  box-shadow:var(--sh-4), var(--sh-glow);
}
.ed-prog-card:hover::after{ opacity:1; top:12px; bottom:12px; }
.ed-prog-card .p-ic{ color:var(--clay); transition:var(--t); }
.ed-prog-card:hover .p-ic{ transform:scale(1.12); color:var(--sage-deep); }
.ed-prog-card .p-n{ color:var(--clay-tint); }
.ed-prog-card:hover .p-arrow{ color:var(--sage); transform:translateX(5px); }
.ed-prog-card .p-arrow{ transition:var(--t); }

.ed-doc-cat-btn{ transition:var(--t); }
.ed-doc-cat-btn:hover{
  transform:translateY(-3px) scale(1.01);
  box-shadow:var(--sh-3), var(--sh-glow);
}
/* Свиването на категориите ставаше само с grid-template-rows:0fr. Ако нещо в
   съдържанието има собствена височина, при този начин то се подава навън и
   документите надничат под затворения ред. Затова тук слагаме и изрично
   отрязване по височина — то работи при всякакво съдържание и браузър. */
.ed-doc-cat-panel{
  overflow:hidden;
  max-height:0;
  box-shadow:none;
  transition:max-height .5s cubic-bezier(.16,.8,.3,1), grid-template-rows .5s cubic-bezier(.16,.8,.3,1);
}
.ed-doc-cat-panel.open{
  max-height:5000px;
  box-shadow:none;
}
.ed-doc-cat-panel > *{ overflow:hidden; min-height:0; }

/* ---------------------------------------------------------------------------
   4. БУТОНИ И ВРЪЗКИ — уголемяване + фино сияние
--------------------------------------------------------------------------- */

.ed-hero-cta,
.ed-filter-chip,
.ed-cat-back,
.ed-btn{
  border-radius:var(--r-pill);
  transition:var(--t);
}

.ed-hero-cta{
  background:var(--clay);
  color:#fff;
  box-shadow:var(--sh-3);
}
.ed-hero-cta:hover{
  transform:scale(1.05) translateY(-2px);
  background:var(--clay-deep);
  box-shadow:var(--sh-4), 0 0 0 5px rgba(255,255,255,.22);
}

.ed-filter-chip{ border:1px solid var(--line); background:#fff; }
.ed-filter-chip:hover{
  transform:translateY(-2px) scale(1.04);
  border-color:var(--clay);
  color:var(--clay);
  box-shadow:var(--sh-glow);
}
.ed-filter-chip.active{
  background:var(--clay);
  border-color:var(--clay);
  color:#fff;
  box-shadow:var(--sh-2);
}

/* маслинено подчертаване на текстовите връзки в съдържанието */
.ed-footer-col a,
.ed-overlay-foot a{ transition:var(--t); }
.ed-footer-col a:hover,
.ed-overlay-foot a:hover{ color:var(--sage); transform:translateX(3px); }

/* ---------------------------------------------------------------------------
   5. ХРОНОЛОГИЯ „НАШАТА ИСТОРИЯ“ — fade-in-up с луксозни точки и линия
--------------------------------------------------------------------------- */

.ed-history-hline{ padding-top:6px; }

/* линията става градиент синьо → маслинено, с меко сияние */
.ed-history-hline::before{
  height:2px;
  border-radius:2px;
  background:linear-gradient(90deg,
    rgba(162,76,54,.15) 0%,
    var(--clay) 18%,
    var(--clay-soft) 52%,
    var(--sage) 86%,
    rgba(110,156,92,.15) 100%);
  box-shadow:0 1px 10px rgba(162,76,54,.18);
}

/* всяка карта влиза отдолу нагоре, с плътен стъпков ритъм.
   !important е нужен, защото базовият HTML носи inline transition-delay
   до 2.2s — твърде бавно, за да се чете като едно движение. */
.ed-history-hline .ed-hl-item{
  opacity:0;
  transform:translateY(26px);
  transition:opacity .6s ease, transform .7s var(--ease);
}
.ed-history-hline .ed-hl-item.in{ opacity:1; transform:none; }
.ed-history-hline .ed-hl-item:nth-child(1){ transition-delay:.05s !important; }
.ed-history-hline .ed-hl-item:nth-child(2){ transition-delay:.17s !important; }
.ed-history-hline .ed-hl-item:nth-child(3){ transition-delay:.29s !important; }
.ed-history-hline .ed-hl-item:nth-child(4){ transition-delay:.41s !important; }

.ed-hl-year{
  color:var(--clay);
  font-weight:500;
  letter-spacing:-.01em;
}

/* точката: бял пръстен, синя сърцевина, смарагдов ореол при влизане */
.ed-hl-dot{
  width:15px; height:15px;
  background:var(--clay);
  border:3px solid #fff;
  box-shadow:0 0 0 1px rgba(162,76,54,.25), 0 4px 12px rgba(162,76,54,.3);
}
.ed-hl-item.in .ed-hl-dot{ animation:edDotBloom .9s var(--ease) .2s both; }
@keyframes edDotBloom{
  0%  { transform:scale(0); box-shadow:0 0 0 0 rgba(110,156,92,.45); }
  55% { transform:scale(1.18); box-shadow:0 0 0 10px rgba(110,156,92,0); }
  100%{ transform:scale(1); box-shadow:0 0 0 1px rgba(162,76,54,.25), 0 4px 12px rgba(162,76,54,.3); }
}

.ed-hl-item{ padding:0 10px; }
.ed-hl-text{ color:var(--ink-soft); }

.ed-history-banner{ border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--sh-3); }
.ed-history-big{ color:var(--clay); }

/* ---------------------------------------------------------------------------
   6. МЕДИЙНА МРЕЖА — Новини, Алеко ТВ, Училищен вестник
--------------------------------------------------------------------------- */

.ed-news-hero{
  box-shadow:var(--sh-3);
  transition:transform .45s var(--ease), box-shadow .45s var(--ease);
}
.ed-news-hero:hover{ transform:translateY(-6px) scale(1.008); box-shadow:var(--sh-4); }
.ed-news-hero .nh-tag{
  border-radius:var(--r-pill);
  background:var(--sage);
  color:#fff;
  font-weight:700;
}

.ed-news-spine-item{
  border-radius:var(--r-md);
  padding:16px 18px;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--sh-1);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .3s;
}
.ed-news-spine-item:hover{
  transform:translateX(6px);
  border-color:rgba(162,76,54,.25);
  box-shadow:var(--sh-2);
}
.ed-news-spine-item .nsi-dot{ background:var(--sage); box-shadow:0 0 0 3px rgba(110,156,92,.16); }
.ed-news-spine-item .nsi-cat{ color:var(--clay); font-weight:700; }

.ed-news-card{
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--sh-1);
  overflow:hidden;
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .3s;
}
.ed-news-card:hover{
  transform:translateY(-6px);
  border-color:rgba(162,76,54,.25);
  box-shadow:var(--sh-3);
}

.ed-media-card{
  border-radius:var(--r-lg);
  box-shadow:var(--sh-3);
  transition:transform .45s var(--ease), box-shadow .45s var(--ease);
}
.ed-media-card:hover{ transform:translateY(-6px); box-shadow:var(--sh-4); }
.ed-media-mascot{ background:linear-gradient(200deg, var(--clay) 0%, var(--clay-deep) 72%); }
.ed-media-video:hover .mc-play{ background:var(--sage); }
.ed-media-card .mc-kicker{ color:rgba(255,255,255,.82); }

/* placeholders за видео и PDF — рамка с фин шах вместо празно поле */
.ed-media-ph,
.ed-video-ph,
.ed-pdf-ph{
  border-radius:var(--r-md);
  border:1px dashed rgba(162,76,54,.3);
  background:
    linear-gradient(135deg, rgba(162,76,54,.04) 25%, transparent 25%) 0 0/16px 16px,
    var(--clay-mist);
  color:var(--clay);
}

/* ---------------------------------------------------------------------------
   7. ЧАТ УИДЖЕТ „АЛЕКОЗНАЙКО“
--------------------------------------------------------------------------- */

.ed-chat-fab{
  border:3px solid #fff;
  background:var(--clay-tint);
  box-shadow:0 14px 34px -10px rgba(162,76,54,.5);
}
.ed-chat-fab:hover{ transform:scale(1.08) translateY(-3px); box-shadow:0 20px 44px -12px rgba(162,76,54,.55); }

/* двоен пулс: смарагдова точка + бавен син ореол около целия бутон */
.ed-chat-fab::after{
  content:'';
  position:absolute;
  inset:-3px;
  border-radius:50%;
  border:2px solid rgba(162,76,54,.4);
  animation:edFabHalo 2.8s var(--ease) infinite;
  pointer-events:none;
}
@keyframes edFabHalo{
  0%  { transform:scale(1); opacity:.6; }
  70% { transform:scale(1.45); opacity:0; }
  100%{ transform:scale(1.45); opacity:0; }
}
.ed-chat-ping{ background:var(--sage); border-color:#fff; }
.ed-chat-ping::after{ background:var(--sage); }

.ed-chat-panel{
  width:368px;
  border-radius:20px;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:0 34px 76px -22px rgba(36,30,25,.42);
}
.ed-chat-header{
  background:linear-gradient(135deg, var(--clay) 0%, var(--clay-deep) 100%);
  color:#fff;
}
.ed-chat-header .ch-status{ color:rgba(255,255,255,.78); }
.ed-chat-header .ch-status .dot{ background:#A8C286; box-shadow:0 0 0 3px rgba(168,194,134,.25); }
.ed-chat-header img{ border-color:rgba(255,255,255,.55); }
.ed-chat-close{ background:rgba(255,255,255,.16); color:#fff; transition:var(--t); }
.ed-chat-close:hover{ background:rgba(255,255,255,.3); transform:scale(1.08); }

.ed-chat-body{ background:var(--clay-mist); }
.ed-chat-msg{
  border-radius:var(--r-lg);
  box-shadow:var(--sh-1);
  animation:edMsgIn .35s var(--ease) both;
}
@keyframes edMsgIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
.ed-chat-msg.bot{ background:#fff; color:var(--ink); border:1px solid var(--line); border-bottom-left-radius:5px; }
.ed-chat-msg.user{
  background:var(--clay);
  color:#fff;
  border-bottom-right-radius:5px;
  box-shadow:0 6px 16px -6px rgba(162,76,54,.45);
}

.ed-chat-quick{ background:var(--clay-mist); }
.ed-chat-quick .qc{
  color:var(--clay);
  background:#fff;
  border:1px solid rgba(162,76,54,.2);
  transition:var(--t);
}
.ed-chat-quick .qc:hover{
  background:var(--clay);
  color:#fff;
  transform:translateY(-2px) scale(1.04);
  box-shadow:var(--sh-glow);
}

.ed-chat-input{ background:#fff; }
.ed-chat-input input{ background:var(--clay-mist); border:1px solid var(--line); }
.ed-chat-input input:focus{ outline:none; border-color:var(--clay); box-shadow:var(--sh-glow); }
.ed-chat-input button{ background:var(--clay); color:#fff; }
.ed-chat-input button:hover{ background:var(--clay-deep); transform:scale(1.08); box-shadow:var(--sh-glow); }

/* ---------------------------------------------------------------------------
   8. МОБИЛНА ВИЗИЯ
--------------------------------------------------------------------------- */

@media (max-width:900px){
  .ed-nav.scrolled{
    top:calc(var(--ed-banner-h, 0px) + 8px);
    left:8px; right:8px;
    padding:12px 18px;
    border-radius:var(--r-md);
  }
  .ed-contact{ padding:7px 14px; }
}

@media (max-width:760px){
  /* хронологията става вертикална линия с точки отляво — истински timeline,
     вместо четири центрирани блока един под друг */
  .ed-history-hline{ flex-direction:column; gap:28px; padding-left:30px; }
  .ed-history-hline::before{
    display:block;
    top:8px; bottom:8px; left:6px;
    right:auto;
    width:2px; height:auto;
    transform:scaleY(0);
    transform-origin:top;
    background:linear-gradient(180deg, var(--clay), var(--clay-soft), var(--sage));
    transition:transform 1.6s var(--ease) .1s;
  }
  .ed-history-hline.in::before{ transform:scaleY(1); }
  .ed-hl-item{ align-items:flex-start; text-align:left; padding:0; }
  .ed-hl-year{ margin-bottom:8px; font-size:30px; }
  .ed-hl-dot{ position:absolute; left:-30px; margin:0; top:14px; }
  .ed-hl-item{ position:relative; }
  .ed-hl-text{ max-width:100%; }
}

@media (max-width:560px){
  .ed-chat-panel{
    position:fixed;
    right:10px; left:10px; bottom:10px;
    width:auto;
    height:min(78vh, 540px);
    border-radius:18px;
  }
  .ed-prog-card:hover{ transform:none; }
}

/* ---------------------------------------------------------------------------
   9. PREFERS-REDUCED-MOTION
--------------------------------------------------------------------------- */

@media (prefers-reduced-motion:reduce){
  .ed-nav, .ed-prog-card, .ed-news-card, .ed-media-card,
  .ed-hero-cta, .ed-filter-chip, .ed-chat-msg,
  .ed-history-hline .ed-hl-item, .ed-history-hline::before{
    transition:none !important;
    animation:none !important;
  }
  .ed-history-hline .ed-hl-item{ opacity:1; transform:none; }
  .ed-history-hline::before{ transform:scaleX(1); }
  .ed-chat-fab::after{ animation:none; opacity:0; }
  .ed-hl-item.in .ed-hl-dot{ animation:none; transform:scale(1); }
  .ed-prog-card:hover, .ed-hero-cta:hover, .ed-filter-chip:hover,
  .ed-doc-cat-btn:hover, .ed-contact:hover{ transform:none; }
}

/* ---------------------------------------------------------------------------
   10. СЕКЦИОННИ ИДЕНТИЧНОСТИ
   Всеки раздел носи свой акцент през --brick / --brick-deep / --brick-bg
   (дефинирани в style-editorial.css върху body[data-theme]). Тук им добавяме
   собствено сияние, за да се усеща характерът, а не само цветът.
--------------------------------------------------------------------------- */

body{ --accent:var(--brick); --accent-deep:var(--brick-deep); --accent-bg:var(--brick-bg); }
body{ --accent-glow:0 0 0 4px color-mix(in srgb, var(--accent) 16%, transparent); }

/* заглавната лента на всяка вътрешна страница поема акцента на раздела */
.ed-cover{ box-shadow:inset 0 -1px 0 rgba(255,255,255,.2), var(--sh-3); }
/* светлият ъгъл вече е нарисуван вътре в самите SVG кавъри (секция 34),
   затова тук не слагаме втори слой — той се биеше с воала за четимост */
.ed-page-title{ color:var(--accent-deep); }
.ed-kicker{ color:var(--accent); }

/* плочките на раздела: акцентна икона, акцентен кант и сияние при посочване */
.ed-doc-cat-btn{
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--sh-1);
  cursor:pointer;
}
.ed-doc-cat-btn .ic{
  border-radius:var(--r-md);
  background:var(--accent-bg);
  color:var(--accent-deep);
  transition:transform .35s var(--ease), background .3s ease;
}
.ed-doc-cat-btn:hover{
  transform:translateY(-5px);
  border-color:var(--accent);
  box-shadow:var(--sh-3), var(--accent-glow);
}
.ed-doc-cat-btn:hover .ic{ transform:scale(1.1) rotate(-3deg); background:var(--accent); color:#fff; }
.ed-doc-cat-btn .chev{ color:var(--accent); transition:transform .3s ease; }
.ed-doc-cat-btn:hover .chev{ transform:translateX(4px); }
.ed-doc-cat-btn[aria-expanded="true"]{ border-color:var(--accent); box-shadow:var(--accent-glow); }

/* „Прием“ — плочките се четат като стъпки: номер в ъгъла и светване при hover */
[data-theme="priem"] .ed-doc-cat-grid{ counter-reset:stepnum; }
[data-theme="priem"] .ed-doc-cat-grid .ed-doc-cat-btn::after{
  counter-increment:stepnum;
  content:counter(stepnum);
  position:absolute; left:26px; top:22px;
  font-family:'Fraunces',serif; font-style:italic; font-size:15px;
  color:var(--accent);
  opacity:.5;
  transition:opacity .3s ease;
}
[data-theme="priem"] .ed-doc-cat-grid .ed-doc-cat-btn:hover::after{ opacity:1; }

/* „Учебен процес“ — редовете с графици стават чисти карти с цветен таг */
.ed-sub-item{
  border-radius:var(--r-md);
  border:1px solid var(--line);
  background:#fff;
  transition:transform .3s var(--ease), box-shadow .3s ease, border-color .3s;
}
.ed-sub-item:hover{
  transform:translateY(-3px);
  border-color:var(--accent);
  box-shadow:var(--sh-2), var(--accent-glow);
}
.ed-spine-cats .ed-sub-item::before{
  content:'';
  display:inline-block;
  width:6px; height:6px; margin-right:10px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 0 3px var(--accent-bg);
  vertical-align:middle;
}

/* ---------------------------------------------------------------------------
   11. ВЪЛНООБРАЗНИ РАЗДЕЛИТЕЛИ МЕЖДУ СЕКЦИИТЕ
   Инлайн SVG като background — без нов HTML, без допълнителна заявка.
--------------------------------------------------------------------------- */

.ed-programs, .ed-news, .ed-footer{ position:relative; }
.ed-programs::before, .ed-news::before, .ed-footer::before{
  content:'';
  position:absolute;
  top:-46px; left:0; right:0;
  height:46px;
  pointer-events:none;
  background-repeat:no-repeat;
  background-size:100% 100%;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 46' preserveAspectRatio='none'%3E%3Cpath d='M0 46 C 240 6 480 6 720 24 C 960 42 1200 42 1440 12 L1440 46 Z' fill='%23FBFCFE'/%3E%3C/svg%3E");
}
.ed-footer::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 46' preserveAspectRatio='none'%3E%3Cpath d='M0 0 C 240 40 480 40 720 22 C 960 4 1200 4 1440 34 L1440 0 Z' fill='%23FBFCFE'/%3E%3C/svg%3E");
  top:auto; bottom:100%;
}

/* ---------------------------------------------------------------------------
   12. ХРОНОЛОГИЯТА — 3D РАЗКРИВАНЕ И СВЕТЕЩИ ВРЪЗКИ
--------------------------------------------------------------------------- */

.ed-history-hline{ perspective:1100px; }
.ed-history-hline .ed-hl-item{
  transform:translateY(30px) rotateX(-14deg) scale(.97);
  transform-origin:50% 100%;
  transition:opacity .7s ease, transform .85s var(--ease);
}
.ed-history-hline .ed-hl-item.in{ transform:none; }

/* светеща нишка, която пробягва по линията след като тя се изчертае */
.ed-history-hline::after{
  content:'';
  position:absolute;
  top:56px; left:0;
  width:22%; height:4px;
  border-radius:4px;
  background:linear-gradient(90deg, transparent, rgba(192,106,78,.85), transparent);
  filter:blur(1px);
  opacity:0;
}
.ed-history-hline.in::after{ animation:edSpark 2.8s var(--ease) .9s infinite; }
@keyframes edSpark{
  0%  { left:-22%; opacity:0; }
  18% { opacity:.9; }
  82% { opacity:.9; }
  100%{ left:100%; opacity:0; }
}

.ed-hl-year{ text-shadow:0 2px 14px rgba(162,76,54,.14); }

/* ---------------------------------------------------------------------------
   14. ЧАТЪТ — „ОНЛАЙН“ ПУЛС И ТРИ ТОЧКИ „ПИШЕ…“
--------------------------------------------------------------------------- */

.ed-chat-header .ch-status .dot{ position:relative; }
.ed-chat-header .ch-status .dot::after{
  content:'';
  position:absolute; inset:0;
  border-radius:50%;
  background:#A8C286;
  animation:edOnlinePulse 2s var(--ease) infinite;
}
@keyframes edOnlinePulse{
  0%  { transform:scale(1); opacity:.8; }
  100%{ transform:scale(3); opacity:0; }
}

.ed-chat-msg.typing{
  display:flex; align-items:center; gap:5px;
  padding:14px 16px;
  animation:none;
  opacity:1;
}
.ed-chat-msg.typing .td{
  width:7px; height:7px;
  border-radius:50%;
  background:var(--clay-soft);
  animation:edTypeBounce 1.1s ease-in-out infinite;
}
.ed-chat-msg.typing .td:nth-child(2){ animation-delay:.16s; }
.ed-chat-msg.typing .td:nth-child(3){ animation-delay:.32s; }
@keyframes edTypeBounce{
  0%,62%,100%{ transform:translateY(0); opacity:.45; }
  31%        { transform:translateY(-6px); opacity:1; }
}

@media (prefers-reduced-motion:reduce){
  .ed-history-hline .ed-hl-item{ transform:none !important; }
  .ed-history-hline.in::after,
  .ed-chat-header .ch-status .dot::after,
  .ed-chat-msg.typing .td,
  .ed-episode-card .ep-thumb::after{ animation:none; }
}

/* ---------------------------------------------------------------------------
   15. МЕНЮТО — ПЛАВАЩО МАТОВО СТЪКЛО И ПАДАЩ ЕДИНЕН КОНТЕЙНЕР
   Подменюто вече не е странична решетка, а един елегантен контейнер, който
   се спуска точно под своя раздел, в един стълб, с икона пред всеки линк.
--------------------------------------------------------------------------- */

.ed-ov-group{ position:relative; }

.ed-ov-panel{
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  right:auto;
  margin-left:0;
  width:min(340px, calc(100vw - 48px));
  padding:10px;
  display:flex;
  flex-direction:column;
  gap:2px;
  border-radius:16px;
  background:rgba(255,255,255,.78);
  backdrop-filter:blur(20px) saturate(1.5);
  -webkit-backdrop-filter:blur(20px) saturate(1.5);
  border:1px solid rgba(255,255,255,.7);
  box-shadow:0 20px 48px -16px rgba(36,30,25,.22), inset 0 1px 0 rgba(255,255,255,.9);
  opacity:0;
  transform:translateY(-8px);
  pointer-events:none;
  z-index:5;
  transition:opacity .4s ease-in-out, transform .4s ease-in-out;
}
.ed-ov-panel.active{
  opacity:1;
  transform:none;
  pointer-events:auto;
}

.ed-ov-panel a{
  display:flex;
  align-items:center;
  gap:11px;
  padding:11px 14px;
  border-radius:12px;
  font-family:'Manrope',sans-serif;
  font-style:normal;
  font-size:14.5px;
  font-weight:600;
  line-height:1.35;
  color:var(--ink-soft);
  background:none;
  transition:all .4s ease-in-out;
}
.ed-ov-panel a:hover{
  color:var(--brick);
  background:var(--brick-bg);
  padding-left:18px;
  transform:scale(1.015);
}
.ed-ov-panel a.current{
  color:var(--brick);
  background:var(--brick-bg);
}

/* иконите са inline SVG маски, затова поемат цвета на самия линк */
.ed-ov-panel a::before{
  content:'';
  flex:0 0 auto;
  width:17px; height:17px;
  background:currentColor;
  opacity:.7;
  mask:var(--ic) center/contain no-repeat;
  -webkit-mask:var(--ic) center/contain no-repeat;
  transition:opacity .4s ease-in-out, transform .4s ease-in-out;
}
.ed-ov-panel a:hover::before{ opacity:1; transform:scale(1.12); }

/* по едно семейство икони, разпознати по адреса на линка */
.ed-ov-panel a{ --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3C/svg%3E"); }
.ed-ov-panel a[href*="#about"]{ --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cline x1='12' y1='16' x2='12' y2='11'/%3E%3Cline x1='12' y1='8' x2='12.01' y2='8'/%3E%3C/svg%3E"); }
.ed-ov-panel a[href*="vizia"]{ --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); }
.ed-ov-panel a[href*="ekip"]{ --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M23 21v-2a4 4 0 0 0-3-3.87'/%3E%3C/svg%3E"); }
.ed-ov-panel a[href*="kvalifikacii"]{ --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='6'/%3E%3Cpath d='M8.2 13.9 7 22l5-3 5 3-1.2-8.1'/%3E%3C/svg%3E"); }
.ed-ov-panel a[href*="materialna-baza"]{ --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18'/%3E%3Cpath d='M5 21V7l7-4 7 4v14'/%3E%3Cpath d='M10 21v-6h4v6'/%3E%3C/svg%3E"); }
.ed-ov-panel a[href*="razpisanie"]{ --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpolyline points='12 7 12 12 16 14'/%3E%3C/svg%3E"); }
.ed-ov-panel a[href*="grafici"], .ed-ov-panel a[href*="sreshti"]{ --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='17' rx='2'/%3E%3Cline x1='3' y1='9' x2='21' y2='9'/%3E%3Cline x1='8' y1='2' x2='8' y2='5'/%3E%3Cline x1='16' y1='2' x2='16' y2='5'/%3E%3C/svg%3E"); }
.ed-ov-panel a[href*="nvo"]{ --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='3'/%3E%3Cpolyline points='8 12 11 15 16 9'/%3E%3C/svg%3E"); }
.ed-ov-panel a[href*="priem1"]{ --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cline x1='19' y1='8' x2='19' y2='14'/%3E%3Cline x1='16' y1='11' x2='22' y2='11'/%3E%3C/svg%3E"); }
.ed-ov-panel a[href*="priem5"]{ --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpolyline points='10 8 14 12 10 16'/%3E%3C/svg%3E"); }
.ed-ov-panel a[href*="svobodni"]{ --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.5' y2='16.5'/%3E%3C/svg%3E"); }
.ed-ov-panel a[href*="uniformi"]{ --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 3 4 6v5h3v10h10V11h3V6l-5-3'/%3E%3Cpath d='M9 3a3 3 0 0 0 6 0'/%3E%3C/svg%3E"); }
.ed-ov-panel a[href*="vtori-chas"]{ --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.4 8.4 0 0 1-9 8.4 9 9 0 0 1-3.9-.9L3 21l1.9-5.1A8.4 8.4 0 0 1 4 11.5 8.5 8.5 0 0 1 12.5 3a8.5 8.5 0 0 1 8.5 8.5z'/%3E%3C/svg%3E"); }
.ed-ov-panel a[href*="uchebnici"]{ --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z'/%3E%3Cpath d='M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z'/%3E%3C/svg%3E"); }
.ed-ov-panel a[href*="blanki"]{ --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 2v6h6'/%3E%3Cline x1='16' y1='13' x2='8' y2='13'/%3E%3Cline x1='16' y1='17' x2='8' y2='17'/%3E%3C/svg%3E"); }
.ed-ov-panel a[href*="dnevnik"]{ --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='3' width='20' height='14' rx='2'/%3E%3Cline x1='8' y1='21' x2='16' y2='21'/%3E%3Cline x1='12' y1='17' x2='12' y2='21'/%3E%3C/svg%3E"); }

/* на телефон контейнерът влиза в потока и избутва списъка надолу, вместо да
   покрива следващите раздели — така акордеонът остава четим с един пръст */
@media (max-width:760px){
  .ed-ov-panel{
    position:static;
    width:100%;
    margin:6px 0 10px;
    transform:none;
    max-height:0;
    padding:0 10px;
    overflow:hidden;
    transition:max-height .45s ease-in-out, opacity .35s ease-in-out, padding .35s ease-in-out;
  }
  .ed-ov-panel.active{ max-height:520px; padding:10px; }
  .ed-ov-panel a{ font-size:15px; }
}

/* ---------------------------------------------------------------------------
   16. МЕДИЯ И НОВИНИ — СВЕТЛА, СВЕЖА ВИЗИЯ
   Заменя тъмния премиум вид от предишната версия: бяло и меко сиво като
   основа, тухлено и маслинено само като акцент.
--------------------------------------------------------------------------- */

.ed-episode-card{
  border-radius:var(--r-lg);
  padding:12px;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--sh-2);
  transition:transform .4s ease-in-out, box-shadow .4s ease-in-out, border-color .4s ease-in-out;
}
.ed-episode-card:hover{
  transform:translateY(-5px) scale(1.01);
  border-color:var(--brick);
  box-shadow:var(--sh-4), var(--accent-glow);
}
.ed-episode-card .ep-thumb{
  border-radius:var(--r-md);
  background:linear-gradient(135deg, #FDF9F5 0%, #F5EDE6 100%);
  border:1px solid var(--line);
  box-shadow:inset 0 1px 0 #fff;
}
.ed-episode-card .ep-t{ color:var(--ink); }
.ed-episode-card .ep-meta{ color:var(--muted); }

/* светъл, ясен бутон за пускане — бял кръг със син триъгълник и мек пулс */
.ed-episode-card .ep-thumb::after{
  content:'';
  position:absolute; left:50%; top:50%;
  width:56px; height:56px; margin:-28px 0 0 -28px;
  border-radius:50%;
  background:rgba(255,255,255,.92)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%231B3E8F'%3E%3Cpath d='M9 6v12l9-6z'/%3E%3C/svg%3E")
    center/22px no-repeat;
  box-shadow:0 8px 22px -6px rgba(36,30,25,.3), 0 0 0 0 rgba(162,76,54,.35);
  animation:edPlayPulseLight 2.6s ease-in-out infinite;
  pointer-events:none;
  transition:transform .4s ease-in-out;
}
.ed-episode-card:hover .ep-thumb::after{ transform:scale(1.1); }
@keyframes edPlayPulseLight{
  0%  { box-shadow:0 8px 22px -6px rgba(36,30,25,.3), 0 0 0 0 rgba(162,76,54,.35); }
  70% { box-shadow:0 8px 22px -6px rgba(36,30,25,.3), 0 0 0 16px rgba(162,76,54,0); }
  100%{ box-shadow:0 8px 22px -6px rgba(36,30,25,.3), 0 0 0 0 rgba(162,76,54,0); }
}

/* Алеко ТВ и Алекознайко минават от виолетово към тухлено и маслинено,
   за да остане цялата медийна част светла и училищна */
[data-theme="alekotv"]{ --brick:#A0472E; --brick-deep:#7C3A29; --brick-bg:#F4E2D9; }
[data-theme="alekoznaiko"]{ --brick:#5C7A46; --brick-deep:#425934; --brick-bg:#E3EAD9; }

.ed-alekotv-banner{ border-radius:var(--r-lg); box-shadow:var(--sh-3); overflow:hidden; }

.ed-news-hero::after{
  background:linear-gradient(200deg, rgba(162,76,54,.05) 0%, rgba(36,30,25,.42) 62%, rgba(36,30,25,.72) 100%);
}
.ed-media-video::after{
  background:linear-gradient(200deg, rgba(162,76,54,.08) 0%, rgba(36,30,25,.4) 58%, rgba(36,30,25,.68) 100%);
}

/* ---------------------------------------------------------------------------
   17. МИКРО-ИНТЕРАКЦИИ — единен ритъм 0.4s ease-in-out
--------------------------------------------------------------------------- */

.ed-hero-cta, .ed-contact, .ed-filter-chip, .ed-chat-quick .qc,
.ed-doc-cat-btn, .ed-prog-card, .ed-episode-card, .ed-sub-item,
.ed-news-card, .ed-media-card, .ed-footer-col a, .ed-overlay-foot a{
  transition:all .4s ease-in-out;
}
a, button{ cursor:pointer; }
.ed-doc-cat-btn, .ed-prog-card, .ed-episode-card{ cursor:pointer; }

@media (prefers-reduced-motion:reduce){
  .ed-episode-card .ep-thumb::after{ animation:none; }
  .ed-ov-panel{ transition:opacity .01s linear; }
}

/* ---------------------------------------------------------------------------
   18. МЕНЮ ОТСТРАНИ С РАЗТЯГАНЕ НАСТРАНИ
   Хоризонталната лента имаше вграден проблем: подсекциите трябваше да отиват
   някъде под редицата, а точно там стоят долните линкове (Е-дневник,
   Обществен съвет, ЗЗЛД, Контакти) — колкото и място да резервирам, двете се
   караха за същата зона.

   Сега разделите стоят в стълб отляво, а подсекциите се разтягат НАДЯСНО, в
   празното поле до тях. Долните линкове са закотвени най-долу в стълба и
   физически няма как да бъдат застигнати — разтягането тръгва встрани, не
   надолу.
--------------------------------------------------------------------------- */

.ed-overlay{
  top:calc(var(--ed-banner-h, 0px) + 84px);
  bottom:24px;
  left:24px;
  right:auto;
  width:min(330px, 84vw);
  max-height:none;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  padding:20px 18px;
  border-radius:22px;
  background:rgba(255,255,255,.74);
  backdrop-filter:blur(26px) saturate(1.7);
  -webkit-backdrop-filter:blur(26px) saturate(1.7);
  border:1px solid rgba(255,255,255,.75);
  box-shadow:0 30px 70px -24px rgba(36,30,25,.3), inset 0 1px 0 rgba(255,255,255,.95);
  transform:translateX(-18px);
  overflow:visible;
}
.ed-overlay.open{ transform:none; }

.ed-overlay-main{
  flex-direction:column;
  align-items:stretch;
  gap:2px;
  width:100%;
  align-self:stretch;
  padding-bottom:0;
}

.ed-ov-item{
  font-family:'Manrope',sans-serif;
  font-style:normal;
  font-weight:700;
  font-size:15.5px;
  letter-spacing:0;
  line-height:1.25;
  width:100%;
  padding:12px 14px;
  border-radius:12px;
  color:var(--ink);
  transform:translateX(-10px);
  transition:all .4s ease-in-out;
}
.ed-overlay.open .ed-ov-item{ transform:none; }
.ed-ov-item::before{ display:none; }
/* прозрачен мост НАДЯСНО: пътят на мишката към разтеглената лента остава
   вътре в активната зона на раздела */
.ed-ov-item::after{
  content:'';
  position:absolute;
  left:100%;
  top:-6px;
  bottom:-6px;
  width:26px;
}
.ed-ov-item:hover, .ed-ov-item.active{
  padding-left:14px;
  color:#fff;
  background:var(--brick);
  box-shadow:0 8px 20px -8px rgba(162,76,54,.5);
  transform:translateX(3px) scale(1.01);
}
.ed-ov-item.current{ box-shadow:inset 0 0 0 1.5px var(--brick); }
.ed-ov-item .ed-ov-chev{ margin-left:auto; font-size:1em; transform:none; }
.ed-ov-item.active .ed-ov-chev{ transform:rotate(90deg); }

/* --- лентата с подсекциите: изстрелва се надясно от своя раздел --- */
.ed-ov-group{ position:relative; }
.ed-ov-panel{
  position:absolute;
  top:-8px;
  left:calc(100% + 22px);
  right:auto;
  width:max-content;
  max-width:min(620px, calc(100vw - 420px));
  margin:0;
  padding:12px;
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  align-items:center;
  gap:7px;
  border-radius:18px;
  background:rgba(255,255,255,.8);
  backdrop-filter:blur(22px) saturate(1.6);
  -webkit-backdrop-filter:blur(22px) saturate(1.6);
  border:1px solid rgba(255,255,255,.8);
  box-shadow:0 24px 56px -20px rgba(36,30,25,.26), inset 0 1px 0 rgba(255,255,255,.95);
  opacity:0;
  transform:none;
  clip-path:inset(0 100% 0 0 round 18px);
  pointer-events:none;
  z-index:5;
  transition:clip-path .45s cubic-bezier(.16,.8,.3,1) .3s,
             opacity .3s ease-in-out .3s;
}
.ed-ov-panel.active{
  opacity:1;
  clip-path:inset(0 0 0 0 round 18px);
  pointer-events:auto;
  transition:clip-path .5s cubic-bezier(.16,.8,.3,1), opacity .3s ease-in-out;
}
/* мост отляво на лентата, за да няма пропаст между нея и раздела */
.ed-ov-panel::before{
  content:'';
  position:absolute;
  left:-24px;
  top:0; bottom:0;
  width:24px;
}

.ed-ov-panel a{
  padding:9px 14px;
  border-radius:var(--r-pill);
  font-family:'Manrope',sans-serif;
  font-style:normal;
  font-size:13.5px;
  font-weight:600;
  color:var(--ink-soft);
  background:rgba(255,255,255,.72);
  border:1px solid rgba(162,76,54,.12);
  white-space:nowrap;
  transition:all .4s ease-in-out;
}
.ed-ov-panel a:hover{
  padding-left:14px;
  color:#fff;
  background:var(--brick);
  border-color:var(--brick);
  transform:translateY(-3px) scale(1.04);
  box-shadow:0 10px 24px -10px rgba(162,76,54,.55);
}
.ed-ov-panel a.current{ color:var(--brick); background:var(--brick-bg); border-color:var(--brick); }
.ed-ov-panel a::before{ width:15px; height:15px; }

/* --- долните линкове: закотвени най-долу в стълба --- */
.ed-overlay-foot{
  display:flex;
  flex-direction:column;
  gap:2px;
  margin-top:auto;
  padding-top:16px;
  border-top:1px solid rgba(162,76,54,.14);
}
.ed-overlay-foot a{
  padding:9px 14px;
  border-radius:10px;
  font-size:13px;
  font-weight:600;
  color:var(--muted);
  transition:all .4s ease-in-out;
}
.ed-overlay-foot a:hover{
  color:var(--brick);
  background:var(--brick-bg);
  transform:translateX(4px);
}

/* --- мобилно: стълбът заема почти целия екран, подсекциите падат под своя
       раздел като акордеон (встрани няма място) --- */
@media (max-width:900px){
  .ed-ov-panel{ max-width:min(420px, calc(100vw - 380px)); }
}
@media (max-width:760px){
  .ed-overlay{
    top:0; bottom:0; right:0; left:auto;
    width:min(86vw, 370px);
    padding:calc(var(--ed-banner-h,0px) + 88px) 20px 28px;
    border-radius:22px 0 0 22px;
    transform:translateX(102%);
    overflow-y:auto;
    transition:transform .5s cubic-bezier(.16,.8,.3,1), opacity .3s ease;
  }
  .ed-overlay.open{ transform:none; }
  .ed-ov-item{ font-size:16px; padding:13px 14px; }
  .ed-ov-item::after{ display:none; }
  .ed-ov-panel{
    position:static;
    width:100%;
    max-width:none;
    margin:4px 0 10px;
    padding:0 8px;
    max-height:0;
    overflow:hidden;
    flex-direction:column;
    align-items:stretch;
    background:rgba(255,255,255,.55);
    box-shadow:none;
    clip-path:none;
    transition:max-height .45s ease-in-out, opacity .35s ease-in-out, padding .35s ease-in-out;
  }
  .ed-ov-panel.active{
    max-height:560px;
    padding:8px;
    clip-path:none;
    opacity:1;
    pointer-events:auto;
    transition:max-height .45s ease-in-out, opacity .3s ease-in-out, padding .35s ease-in-out;
  }
  .ed-ov-panel a{ white-space:normal; }
}

/* ===========================================================================
   21. ВЪТРЕШНО ОФОРМЛЕНИЕ НА СЕКЦИИТЕ — ТРИ РАЗЛИЧНИ ПОДХОДА
   Проблемът с предишния вид: всеки ред беше самостоятелна бяла карта с кант и
   сянка, независимо дали е стъпка от процес, справочен запис или дълъг
   обяснителен текст. Еднакви кутии = нулева иерархия, а текстът се разтягаше
   през целия екран, оставяйки дясната половина празна.

   Сега подходът зависи от съдържанието:
     Б → Прием и Учебен процес (процеси): двуколонно, с номерирани стъпки
     А → Документи, ЗЗЛД, Контакти (справочник): разчертан индекс без кутии
     В → дълги описания навсякъде: свиват се и се отварят при клик (JS)

   Общо за всички: една рамка вместо три, без сенки по редовете, и дължина на
   реда до 72 знака.
=========================================================================== */

/* --- махаме трите вложени рамки: остава само гръбнакът отляво --- */
.ed-doc-cat-panel{
  background:none;
  border:0;
  box-shadow:none;
  border-radius:0;
  overflow:hidden;      /* пази отрязването от секция 39 */
}
.ed-doc-cat-inner{ padding-left:0; padding-right:0; }

.ed-doc-cat-btn{
  background:none;
  border:0;
  border-bottom:1px solid var(--line);
  border-radius:0;
  box-shadow:none;
  padding:18px 4px;
}
.ed-doc-cat-btn:hover{
  transform:none;
  border-color:var(--brick);
  box-shadow:none;
  background:linear-gradient(90deg, var(--brick-bg) 0%, transparent 70%);
}
.ed-doc-cat-btn[aria-expanded="true"]{
  border-color:var(--brick);
  box-shadow:none;
  background:none;
}
/* етикетът на подсекцията вече не е сериф курсив — това е упътване, не заглавие */
.ed-doc-cat-btn .t{
  font-family:'Manrope',sans-serif;
  font-style:normal;
  font-weight:800;
  font-size:clamp(17px,1.9vw,21px);
  letter-spacing:-.01em;
  color:var(--ink);
}
/* точката застава до заглавието, а не на свой ред над него */
.ed-doc-cat-btn .sc-dot{
  flex:0 0 auto;
  width:8px; height:8px;
  margin-right:2px;
  border-radius:50%;
  background:var(--brick);
  box-shadow:0 0 0 4px var(--brick-bg);
}

/* ---------------------------------------------------------------------------
   Б. ПРОЦЕСИ — Прием и Учебен процес
   Двуколонно: отляво номер и заглавие, отдясно описанието. Вертикална линия
   свързва стъпките, за да се четат като последователност, а не като списък.
--------------------------------------------------------------------------- */

[data-theme="priem"] .ed-doc-cat-inner,
[data-theme="uchproc"] .ed-doc-cat-inner{
  counter-reset:stepn;
  position:relative;
  padding:10px 0 6px;
}
/* линията на процеса */
[data-theme="priem"] .ed-doc-cat-inner::before,
[data-theme="uchproc"] .ed-doc-cat-inner::before{
  content:'';
  position:absolute;
  left:13px;
  top:34px;
  bottom:34px;
  width:2px;
  border-radius:2px;
  background:linear-gradient(180deg, var(--brick) 0%, var(--brick-bg) 100%);
  opacity:.5;
}

[data-theme="priem"] .ed-sub-item,
[data-theme="uchproc"] .ed-sub-item{
  position:relative;
  display:grid;
  grid-template-columns:28px minmax(0, 300px) minmax(0, 1fr);
  align-items:start;
  gap:0 26px;
  padding:22px 0 24px 0;
  margin:0;
  background:none;
  border:0;
  border-bottom:1px solid var(--line);
  border-radius:0;
  box-shadow:none;
  transform:none;
}
[data-theme="priem"] .ed-sub-item:last-child,
[data-theme="uchproc"] .ed-sub-item:last-child{ border-bottom:0; }

[data-theme="priem"] .ed-sub-item:hover,
[data-theme="uchproc"] .ed-sub-item:hover{
  transform:none;
  box-shadow:none;
  border-color:var(--line);
}
[data-theme="priem"] .ed-sub-item::before,
[data-theme="uchproc"] .ed-sub-item::before{
  counter-increment:stepn;
  content:counter(stepn, decimal-leading-zero);
  grid-column:1;
  display:block;
  width:28px; height:28px;
  margin:0;
  border-radius:50%;
  background:#fff;
  border:2px solid var(--brick);
  box-shadow:none;
  color:var(--brick);
  font-family:'Manrope',sans-serif;
  font-size:11px;
  font-weight:800;
  line-height:25px;
  text-align:center;
  vertical-align:baseline;
  transition:background .4s ease-in-out, color .4s ease-in-out;
}
[data-theme="priem"] .ed-sub-item:hover::before,
[data-theme="uchproc"] .ed-sub-item:hover::before{
  background:var(--brick);
  color:#fff;
}
[data-theme="priem"] .ed-sub-item .t,
[data-theme="uchproc"] .ed-sub-item .t{
  grid-column:2;
  font-size:16.5px;
  font-weight:800;
  line-height:1.35;
  color:var(--ink);
  padding-top:3px;
}
[data-theme="priem"] .ed-sub-item .d,
[data-theme="uchproc"] .ed-sub-item .d{
  grid-column:3;
  max-width:72ch;
  font-size:14.5px;
  line-height:1.72;
  color:var(--ink-soft);
  padding-top:4px;
}

@media (max-width:860px){
  [data-theme="priem"] .ed-sub-item,
  [data-theme="uchproc"] .ed-sub-item{
    grid-template-columns:28px minmax(0, 1fr);
    gap:6px 18px;
  }
  [data-theme="priem"] .ed-sub-item .t,
  [data-theme="uchproc"] .ed-sub-item .t{ grid-column:2; }
  [data-theme="priem"] .ed-sub-item .d,
  [data-theme="uchproc"] .ed-sub-item .d{ grid-column:2; padding-top:2px; }
}

/* ---------------------------------------------------------------------------
   А. СПРАВОЧНИК — Документи, ЗЗЛД, Обществен съвет, Контакти
   Разчертан индекс: тънки линии вместо карти, тесен стълб отляво за етикета,
   съдържанието отдясно. Тук човек търси едно име в дълъг списък — кутиите
   само му пречат.
--------------------------------------------------------------------------- */

[data-theme="info"] .ed-doc-grid{
  display:block;
  margin:0;
}
[data-theme="info"] .ed-doc-card{
  display:grid;
  grid-template-columns:34px minmax(0, 1fr) auto;
  align-items:center;
  gap:0 18px;
  padding:15px 6px;
  margin:0;
  background:none;
  border:0;
  border-bottom:1px solid var(--line);
  border-radius:0;
  box-shadow:none;
  transition:background .3s ease-in-out;
}
[data-theme="info"] .ed-doc-card:hover{
  background:linear-gradient(90deg, var(--brick-bg) 0%, transparent 82%);
  transform:none;
  box-shadow:none;
}
[data-theme="info"] .ed-doc-card .fic{
  grid-row:1 / span 2;
  grid-column:1;
  width:34px; height:34px;
  display:grid;
  place-items:center;
  border-radius:9px;
  background:var(--brick-bg);
  color:var(--brick-deep);
}
[data-theme="info"] .ed-doc-card .fname{
  grid-column:2;
  text-align:left;
  font-size:15px;
  font-weight:700;
  color:var(--ink);
  background:none;
  border:0;
  padding:0;
}
[data-theme="info"] .ed-doc-card .fname:hover{ color:var(--brick); }
[data-theme="info"] .ed-doc-card .doc-preview{
  grid-column:2;
  max-width:72ch;
  margin:2px 0 0;
  font-size:13px;
  line-height:1.6;
}
[data-theme="info"] .ed-doc-card .doc-actions{
  grid-column:3;
  grid-row:1 / span 2;
  display:flex;
  align-items:center;
  gap:10px;
  opacity:0;
  transform:translateX(6px);
  transition:all .3s ease-in-out;
}
[data-theme="info"] .ed-doc-card:hover .doc-actions,
[data-theme="info"] .ed-doc-card:focus-within .doc-actions{
  opacity:1;
  transform:none;
}
@media (max-width:760px){
  [data-theme="info"] .ed-doc-card{
    grid-template-columns:34px minmax(0, 1fr);
    padding:16px 4px;
  }
  [data-theme="info"] .ed-doc-card .doc-actions{
    grid-column:2;
    grid-row:auto;
    opacity:1;
    transform:none;
    margin-top:8px;
  }
}

/* ---------------------------------------------------------------------------
   В. ДЪЛГИ ОПИСАНИЯ — свиване с бутон
   Класът .is-long се добавя от JS само на редове с наистина дълъг текст.
--------------------------------------------------------------------------- */

.ed-sub-item .d{ max-width:72ch; }

.ed-sub-item.is-long .d{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  transition:none;
}
.ed-sub-item.is-long.is-open .d{
  display:block;
  overflow:visible;
}
.ed-more-btn{
  grid-column:3;
  justify-self:start;
  margin-top:8px;
  padding:5px 12px 5px 0;
  background:none;
  border:0;
  font-family:'Manrope',sans-serif;
  font-size:12.5px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--brick);
  display:inline-flex;
  align-items:center;
  gap:6px;
  transition:all .3s ease-in-out;
}
.ed-more-btn::after{
  content:'';
  width:12px; height:12px;
  background:currentColor;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;
  transition:transform .3s ease-in-out;
}
.ed-more-btn:hover{ gap:9px; }
.ed-sub-item.is-open .ed-more-btn::after{ transform:rotate(180deg); }

@media (max-width:860px){
  .ed-more-btn{ grid-column:2; }
}

/* редовете в останалите раздели (За родители, Проекти) също губят кутиите,
   но запазват простия си вид на списък с тънки разделители */
[data-theme="roditeli"] .ed-sub-item,
[data-theme="proekti"] .ed-sub-item,
body:not([data-theme]) .ed-sub-item{
  background:none;
  border:0;
  border-bottom:1px solid var(--line);
  border-radius:0;
  box-shadow:none;
  padding:18px 4px;
  transform:none;
}
[data-theme="roditeli"] .ed-sub-item:hover,
[data-theme="proekti"] .ed-sub-item:hover,
body:not([data-theme]) .ed-sub-item:hover{
  transform:none;
  box-shadow:none;
  border-color:var(--line);
  background:linear-gradient(90deg, var(--brick-bg) 0%, transparent 76%);
}
[data-theme="roditeli"] .ed-sub-item:last-child,
[data-theme="proekti"] .ed-sub-item:last-child,
body:not([data-theme]) .ed-sub-item:last-child{ border-bottom:0; }
.ed-spine-cats .ed-sub-item::before{ display:none; }
/* ...но не и в процесите, където ::before носи номера на стъпката */
[data-theme="priem"] .ed-spine-cats .ed-sub-item::before,
[data-theme="uchproc"] .ed-spine-cats .ed-sub-item::before{ display:block; }

/* ===========================================================================
   22. ЦВЯТ НА ПЛОЧКИТЕ В ЛЕНТАТА „УЧИЛИЩЕТО ОТБЛИЗО“
   По-рано ги направих всичките бели, за да е фонът чист. Резултатът е шест
   еднакви бели квадрата — окото няма за какво да се захване. Сега всяка
   плочка носи свой много светъл тон, а иконата и номерът ѝ са в наситената
   версия на същия тон. Тоновете остават в синьо-маслиненото семейство, за да
   не се разпадне палитрата.
=========================================================================== */

.ed-prog-card:nth-of-type(6n+1){ background:linear-gradient(165deg, #FFFFFF 0%, #F6E8DF 100%); --tone:#A24C36; }
.ed-prog-card:nth-of-type(6n+2){ background:linear-gradient(165deg, #FFFFFF 0%, #E7EEDC 100%); --tone:#5C7A46; }
.ed-prog-card:nth-of-type(6n+3){ background:linear-gradient(165deg, #FFFFFF 0%, #F7EAE1 100%); --tone:#C06A4E; }
.ed-prog-card:nth-of-type(6n+4){ background:linear-gradient(165deg, #FFFFFF 0%, #F6EBD6 100%); --tone:#B8863B; }
.ed-prog-card:nth-of-type(6n+5){ background:linear-gradient(165deg, #FFFFFF 0%, #F3E7E9 100%); --tone:#8C4B66; }
.ed-prog-card:nth-of-type(6n+6){ background:linear-gradient(165deg, #FFFFFF 0%, #E9EFDF 100%); --tone:#6E9C5C; }

.ed-prog-card{ border-color:rgba(255,255,255,.9); }
.ed-prog-card .p-ic{
  background:rgba(255,255,255,.85);
  color:var(--tone, var(--clay));
  box-shadow:0 4px 12px -4px rgba(36,30,25,.14);
}
.ed-prog-card:hover .p-ic{ background:var(--tone, var(--clay)); color:#fff; }
.ed-prog-card .p-n{ color:var(--tone, var(--clay)); opacity:.38; }
.ed-prog-card::after{
  background:linear-gradient(180deg, var(--tone, var(--clay)), transparent);
  opacity:.6;
}
.ed-prog-card:hover{ border-color:var(--tone, var(--clay)); }
.ed-prog-card:hover .p-arrow{ color:var(--tone, var(--clay)); }

/* ===========================================================================
   24. БЪРЗ РЕЖИМ НА МЕНЮТО + ВИДИМИ ЛИНКОВЕ В ТЕКСТА
=========================================================================== */

/* Щом една лента вече е отворена (.cat-open), преминаването към друг раздел
   не минава през гратисното забавяне: новата лента се разтяга за 0.16s, а
   старата изчезва веднага. Забавянето остава само за първото отваряне и за
   излизането от менюто, където пази мишката да не „изпусне“ подсекциите. */
.ed-overlay.cat-open .ed-ov-panel{
  transition:clip-path .16s cubic-bezier(.16,.8,.3,1),
             opacity .12s ease-in-out;
}
.ed-overlay.cat-open .ed-ov-panel.active{
  transition:clip-path .2s cubic-bezier(.16,.8,.3,1),
             opacity .14s ease-in-out;
}
/* самите пилюли също реагират по-живо, докато менюто е разгърнато */
.ed-overlay.cat-open .ed-ov-item{ transition:all .18s ease-in-out; }
.ed-overlay.cat-open .ed-ov-panel a{ transition:all .18s ease-in-out; }

/* --- линковете вътре в текста ---
   Глобалното правило в style-editorial.css е a{ color:inherit }, което е
   правилно за навигацията и картите, но прави линк в средата на абзац
   неразличим от обикновен текст. Тук му връщаме цвят и подчертаване. */
.ed-sub-item .d a,
.ed-doc-card .doc-preview a,
.ed-page-hero p a,
.ed-about-closing a,
.f-lab a,
.ed-note a{
  color:var(--brick);
  font-weight:700;
  white-space:nowrap;
  border-bottom:1.5px solid var(--brick-bg);
  padding-bottom:1px;
  transition:all .3s ease-in-out;
}
.ed-sub-item .d a:hover,
.ed-doc-card .doc-preview a:hover,
.ed-page-hero p a:hover,
.ed-about-closing a:hover,
.f-lab a:hover,
.ed-note a:hover{
  color:var(--brick-deep);
  background:var(--brick-bg);
  border-bottom-color:var(--brick);
  border-radius:4px;
  padding:1px 5px;
  margin:0 -5px;
}
/* стрелка след линка, за да личи, че води някъде */
.ed-sub-item .d a::after{ content:' →'; font-weight:400; }


/* ===========================================================================
   25. „УЧИЛИЩЕТО ОТБЛИЗО“ — СВЕТЛА СЕКЦИЯ
   След няколко опита с тъмна сцена, прожектор и слънце изводът е прост:
   секцията иска да бъде светла като целия сайт. Тъмната лента винаги
   изглеждаше или мътна, или залепена отгоре, а вълнообразният разделител
   правеше точно онзи рязък ръб, който трябваше да избегнем.

   Затова тук няма сцена, няма лъч и няма тъмнина. Остават кремавият фон на
   страницата, тъмно заглавие и шест плочки в свежи тонове с меки сенки.
   Цветовете са от времевата линия на „Нашата история“, за да си говорят
   двете секции.
=========================================================================== */

.ed-programs{
  position:relative;
  background:none;
  border-radius:0;
  box-shadow:none;
  overflow:visible;
  padding-top:96px;
  padding-bottom:104px;
}
/* вълнообразният разделител точно тук правеше видима черта — махнат */
.ed-programs::before,
.ed-programs::after{ display:none; }

.ed-programs .ed-kicker{ color:var(--brick); }
.ed-programs .ed-h2{ color:var(--ink); text-shadow:none; }
.ed-programs-head p{ color:var(--ink-soft); }

/* --- плочките: бели, с тон от времевата линия --- */
.ed-prog-card{
  border:1px solid var(--line);
  box-shadow:0 8px 24px -14px rgba(36,30,25,.2);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .3s ease;
}
.ed-prog-card:nth-of-type(6n+1){ background:linear-gradient(165deg, #FFFFFF 0%, #F9E9E2 100%); --tone:#A24C36; }
.ed-prog-card:nth-of-type(6n+2){ background:linear-gradient(165deg, #FFFFFF 0%, #EBF2E4 100%); --tone:#6E9C5C; }
.ed-prog-card:nth-of-type(6n+3){ background:linear-gradient(165deg, #FFFFFF 0%, #FBEBDF 100%); --tone:#C06A4E; }
.ed-prog-card:nth-of-type(6n+4){ background:linear-gradient(165deg, #FFFFFF 0%, #E4F0EC 100%); --tone:#2F6F66; }
.ed-prog-card:nth-of-type(6n+5){ background:linear-gradient(165deg, #FFFFFF 0%, #FCF0D9 100%); --tone:#B8863B; }
.ed-prog-card:nth-of-type(6n+6){ background:linear-gradient(165deg, #FFFFFF 0%, #EEF2E2 100%); --tone:#5C7A46; }

.ed-prog-card .p-ic{
  background:#fff;
  color:var(--tone);
  box-shadow:0 3px 10px -4px rgba(36,30,25,.22);
}
.ed-prog-card .p-n{ color:var(--tone); opacity:.4; }
.ed-prog-card::after{ background:linear-gradient(180deg, var(--tone), transparent); opacity:.7; }
.ed-prog-card::before{
  background:linear-gradient(118deg, transparent 0%, rgba(255,255,255,.75) 46%, transparent 100%);
}
.ed-prog-card:hover{
  transform:translateY(-8px);
  border-color:var(--tone);
  box-shadow:0 26px 52px -22px rgba(36,30,25,.3);
}
.ed-prog-card:hover .p-ic{ background:var(--tone); color:#fff; }
.ed-prog-card:hover .p-arrow{ color:var(--tone); }

@media (max-width:760px){
  .ed-programs{ padding-top:72px; padding-bottom:80px; }
  /* лентата върви плавно: маската върху движещ се слой е скъпа, а блиците и
     дълбоките сенки се преизчисляват при всяка стъпка */
  .ed-prog-marquee{ -webkit-mask-image:none; mask-image:none; }
  .ed-prog-track{
    will-change:transform;
    transform:translateZ(0);
    backface-visibility:hidden;
    animation-duration:46s;
  }
  .ed-prog-card{
    box-shadow:0 6px 16px -10px rgba(36,30,25,.22);
    transition:none;
  }
  .ed-prog-card::before{ display:none; }
}

/* ===========================================================================
   26. „НАШАТА ИСТОРИЯ“ — РОТАЦИЯ НА ПОСТИЖЕНИЯТА
   Досега целият блок беше филмова ролка: превъртеше се вертикално на 38
   секунди в безкраен цикъл, а съдържанието беше удвоено, за да няма шев.
   Оттам идваше и повтореното изречение. Проблемът не е в движението, а в
   това какво се движи: движеща се текстова маса не може да се чете, а
   орденът — най-силният факт на училището — минаваше и си отиваше.

   Сега се върти само късото: шест отличия минават едно по едно, всяко застава
   около четири секунди, спира при посочване. Обяснителният текст и числата
   стоят на място.
=========================================================================== */

.ed-achieve{
  position:relative;
  max-width:820px;
  margin:0 auto 34px;
  padding:34px 28px 26px;
  text-align:center;
}
.ed-achieve-label{
  display:inline-block;
  margin-bottom:18px;
  font-family:'Manrope',sans-serif;
  font-size:11.5px;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--muted);
}
/* тънки тухлени черти горе и долу — блокът се чете като плакет */
.ed-achieve::before,
.ed-achieve::after{
  content:'';
  position:absolute;
  left:50%;
  width:74px;
  height:1.5px;
  margin-left:-37px;
  background:linear-gradient(90deg, transparent, var(--brick), transparent);
}
.ed-achieve::before{ top:0; }
.ed-achieve::after{ bottom:0; }

/* прозорецът: висок колкото два реда, за да не подскача страницата */
.ed-achieve-window{
  position:relative;
  height:3.1em;
  display:flex;
  align-items:center;
  justify-content:center;
}
.ed-achieve-line{
  position:absolute;
  left:0; right:0;
  margin:0;
  font-family:'Fraunces',serif;
  font-style:italic;
  font-weight:400;
  font-size:clamp(20px,2.9vw,31px);
  line-height:1.32;
  color:var(--brick);
  opacity:0;
  transform:translateY(42%);
  transition:opacity .55s ease, transform .7s cubic-bezier(.16,.8,.3,1);
  pointer-events:none;
}
.ed-achieve-line.is-on{ opacity:1; transform:none; }
.ed-achieve-line.is-out{ opacity:0; transform:translateY(-42%); }

/* лентичка, която показва колко остава до следващото */
.ed-achieve-bar{
  position:relative;
  width:132px;
  height:2px;
  margin:22px auto 0;
  border-radius:2px;
  background:var(--line);
  overflow:hidden;
}
.ed-achieve-bar span{
  position:absolute;
  left:0; top:0; bottom:0;
  width:100%;
  border-radius:2px;
  background:linear-gradient(90deg, var(--brick), #C06A4E, #6E9C5C);
  transform-origin:left center;
  transform:scaleX(0);
}
.ed-achieve[data-running="1"] .ed-achieve-bar span{
  animation:edAchieveBar var(--hold, 4200ms) linear forwards;
}
@keyframes edAchieveBar{ from{ transform:scaleX(0); } to{ transform:scaleX(1); } }

/* --- числата --- */
.ed-fact-strip{ justify-content:center; gap:clamp(28px,6vw,86px); }
.ed-fact-strip .fact{ text-align:center; }
.ed-team-cta{
  display:inline-block;
  margin-bottom:10px;
  padding:11px 22px;
  border-radius:999px;
  background:var(--brick);
  color:#fff !important;
  font-family:'Manrope',sans-serif;
  font-size:14px;
  font-weight:700;
  border:0;
  transition:all .3s ease-in-out;
}
.ed-team-cta:hover{
  background:var(--brick-deep);
  transform:translateY(-2px) scale(1.03);
  box-shadow:0 12px 26px -12px rgba(162,76,54,.55);
}
.ed-team-cta::after{ content:' →'; }
.fact-link .f-lab{ max-width:190px; }

@media (max-width:640px){
  .ed-achieve{ padding:28px 14px 22px; margin-bottom:26px; }
  .ed-achieve-window{ height:4.4em; }
  .ed-achieve-line{ font-size:19px; }
}

/* без анимация: всички отличия се показват като списък, нищо не се крие */
@media (prefers-reduced-motion:reduce){
  .ed-achieve-window{ height:auto; display:block; }
  .ed-achieve-line{
    position:static;
    opacity:1;
    transform:none;
    margin:0 0 12px;
    font-size:19px;
  }
  .ed-achieve-bar{ display:none; }
}

/* ===========================================================================
   27. НОВИНИ И РУБРИКИ — ХОРИЗОНТАЛЕН АКТ
   Заменя двата стари блока: голяма новина с три бели кутии отдясно и реда с
   двете медийни карти. Проблемите там бяха три — кутиите бяха единствените в
   сайта, всички новини бяха с еднаква тежест, а „Клубове и медии“ повтаряше
   плочките от „Училището отблизо“.

   Сега петте неща са един акт: скролът надолу превежда лентата настрани.
   Секцията е висока точно колкото трябва, за да минат всички панели, а вътре
   стои залепен екран. Скролът остава нормален — нищо не се прихваща.
=========================================================================== */

.hz{ position:relative; }
.hz-sticky{
  position:sticky; top:0;
  height:100vh;
  display:flex; flex-direction:column; justify-content:center;
  overflow:hidden;
}

.hz-head{
  position:absolute; top:clamp(26px,5vh,58px); left:0; right:0;
  z-index:4;
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:20px; padding:0 clamp(20px,5vw,90px);
}
.hz-head .ed-h2{ margin:0; font-size:clamp(26px,3.4vw,46px); }
.hz-all{
  display:inline-block; margin-top:10px;
  font-family:'Manrope',sans-serif; font-size:12px; font-weight:800;
  letter-spacing:.12em; text-transform:uppercase; color:var(--brick);
  border-bottom:1.5px solid var(--brick-bg); padding-bottom:3px;
  transition:all .3s ease-in-out;
}
.hz-all:hover{ border-bottom-color:var(--brick); }
.hz-count{
  font-family:'Fraunces',serif; font-style:italic;
  font-size:clamp(20px,2.4vw,32px); color:var(--brick); white-space:nowrap;
}
.hz-count i{ font-style:normal; font-size:.5em; color:var(--muted); letter-spacing:.1em; }

.hz-track{
  display:flex; align-items:center;
  gap:clamp(22px,2.6vw,44px);
  padding:0 clamp(20px,5vw,90px);
  will-change:transform;
}
.hz-panel{
  flex:0 0 clamp(300px,68vw,860px);
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  gap:clamp(20px,3vw,48px); align-items:center;
}
.hz-media{
  position:relative; border-radius:16px; overflow:hidden; aspect-ratio:4/3;
  box-shadow:0 26px 60px -28px rgba(36,30,25,.5);
}
.hz-media span{
  position:absolute; inset:0; display:block;
  background-size:cover; background-position:center;
  transform:scale(1.06);
  transition:transform 1.2s cubic-bezier(.16,.8,.3,1);
}
.hz-panel:hover .hz-media span{ transform:scale(1.11); }
.hz-media::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(118deg, rgba(255,255,255,.22) 0%, transparent 42%);
}

.hz-text{ display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.hz-num{
  font-family:'Fraunces',serif; font-style:italic;
  font-size:clamp(34px,4.6vw,62px); line-height:.9;
  color:var(--brick); opacity:.28;
}
.hz-cat{
  font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800;
  letter-spacing:.16em; text-transform:uppercase; color:var(--muted);
}
.hz-t{
  margin:0; max-width:20ch;
  font-family:'Fraunces',serif; font-weight:400;
  font-size:clamp(23px,2.9vw,40px); line-height:1.14; color:var(--ink);
}
.hz-lead{
  margin:0; max-width:40ch;
  font-family:'Manrope',sans-serif; font-size:14.5px; line-height:1.7;
  color:var(--ink-soft);
}
.hz-cta{
  margin-top:6px; padding:12px 22px; border-radius:999px;
  background:var(--brick); color:#fff !important;
  font-family:'Manrope',sans-serif; font-size:12.5px; font-weight:800;
  letter-spacing:.09em; text-transform:uppercase;
  transition:all .35s ease-in-out;
}
.hz-cta:hover{
  background:var(--brick-deep);
  transform:translateY(-3px);
  box-shadow:0 16px 32px -14px rgba(162,76,54,.6);
}

/* ориентири: напредък и точки */
.hz-bar{
  position:absolute; z-index:4;
  bottom:clamp(24px,5vh,54px);
  left:clamp(20px,5vw,90px); right:clamp(20px,5vw,90px);
  height:2px; border-radius:2px; background:var(--line);
}
.hz-bar i{
  position:absolute; left:0; top:0; bottom:0; width:0%;
  border-radius:2px;
  background:linear-gradient(90deg, var(--brick), #C06A4E 60%, #6E9C5C);
}
.hz-dots{
  position:absolute; z-index:4;
  bottom:clamp(38px,7vh,74px); left:50%; transform:translateX(-50%);
  display:flex; gap:9px;
}
.hz-dot{
  width:8px; height:8px; padding:0; border:0; border-radius:50%;
  background:var(--line-2); cursor:pointer;
  transition:all .35s ease-in-out;
}
.hz-dot:hover{ background:var(--brick-bg); }
.hz-dot.is-on{ background:var(--brick); transform:scale(1.5); }
.hz-dot:focus-visible{ outline:2px solid var(--brick); outline-offset:3px; }

/* --- телефон: нормален вертикален списък --- */
@media (max-width:860px){
  .hz-sticky{ position:static; height:auto; padding:0 0 30px; overflow:visible; }
  .hz-head{
    position:static; padding:0 20px; margin-bottom:26px;
    flex-direction:column; align-items:flex-start;
  }
  .hz-track{ flex-direction:column; transform:none !important; padding:0 20px; gap:46px; }
  .hz-panel{ flex:none; grid-template-columns:1fr; gap:18px; }
  .hz-media{ aspect-ratio:16/11; }
  .hz-num{ font-size:34px; }
  .hz-bar, .hz-dots, .hz-count{ display:none; }
}

/* ===========================================================================
   28. СТРАНИЦА „НОВИНИ“ — СЪЩИЯТ ЕЗИК КАТО НАЧАЛНАТА
   Решетката от фото-плочки беше последното място с карти. Сега новините са
   редове: дата в тесен стълб отляво, малък кадър, заглавие и едно изречение,
   тънки косъмчета между тях. Същата логика като дневника в началната страница,
   а филтрите продължават да работят — само скриват редове, вместо плочки.
=========================================================================== */

.nl{ margin-top:8px; }
.nl-item{ border-top:1px solid var(--line); }
.nl-item:last-of-type{ border-bottom:1px solid var(--line); }
.nl-item[hidden]{ display:none; }

.nl-link{
  display:grid;
  grid-template-columns:clamp(92px,10vw,122px) clamp(150px,17vw,220px) minmax(0,1fr) auto;
  align-items:center;
  gap:0 clamp(18px,2.6vw,38px);
  padding:22px 6px;
  transition:padding-left .45s cubic-bezier(.16,.8,.3,1), background .4s ease;
}
.nl-link:hover{
  padding-left:18px;
  background:linear-gradient(90deg, var(--brick-bg) 0%, transparent 76%);
}

.nl-when{ display:flex; flex-direction:column; }
.nl-when b{
  font-family:'Fraunces',serif; font-style:italic; font-weight:400;
  font-size:clamp(20px,2.1vw,27px); line-height:1.05; color:var(--brick);
}
.nl-when i{
  margin-top:4px; font-style:normal;
  font-family:'Manrope',sans-serif; font-size:11px; font-weight:700;
  letter-spacing:.13em; text-transform:uppercase; color:var(--muted);
}

.nl-media{
  position:relative; display:block;
  aspect-ratio:16/10; border-radius:11px; overflow:hidden;
  box-shadow:0 10px 26px -14px rgba(36,30,25,.4);
}
.nl-media img{
  width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.03);
  transition:transform .8s cubic-bezier(.16,.8,.3,1), filter .5s ease;
  filter:saturate(.95);
}
.nl-link:hover .nl-media img{ transform:scale(1.1); filter:saturate(1.05); }
.nl-badge{
  position:absolute; left:9px; top:9px;
  padding:4px 10px; border-radius:999px;
  background:var(--brick); color:#fff;
  font-family:'Manrope',sans-serif; font-size:9.5px; font-weight:800;
  letter-spacing:.13em; text-transform:uppercase;
}

.nl-body{ display:flex; flex-direction:column; gap:7px; min-width:0; }
.nl-cat{
  font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800;
  letter-spacing:.16em; text-transform:uppercase; color:var(--muted);
  transition:color .35s ease;
}
.nl-t{
  font-family:'Fraunces',serif; font-weight:400;
  font-size:clamp(18px,2vw,26px); line-height:1.26; color:var(--ink);
  transition:color .35s ease;
}
.nl-lead{
  max-width:56ch;
  font-family:'Manrope',sans-serif; font-size:13.5px; line-height:1.68;
  color:var(--ink-soft);
}
.nl-go{
  font-family:'Manrope',sans-serif; font-size:19px; color:var(--brick);
  opacity:0; transform:translateX(-8px);
  transition:all .4s cubic-bezier(.16,.8,.3,1);
}
.nl-link:hover .nl-cat{ color:var(--brick); }
.nl-link:hover .nl-t{ color:var(--brick-deep); }
.nl-link:hover .nl-go{ opacity:1; transform:none; }

.nl-empty{
  margin:34px 0 0; padding:26px 0;
  border-top:1px solid var(--line);
  font-family:'Manrope',sans-serif; font-size:14px; color:var(--muted);
  text-align:center;
}

@media (max-width:860px){
  .nl-link{
    grid-template-columns:82px minmax(0,1fr);
    grid-template-areas:'when body' 'media media';
    gap:14px 16px;
    padding:20px 2px;
  }
  .nl-when{ grid-area:when; }
  .nl-body{ grid-area:body; }
  .nl-media{ grid-area:media; aspect-ratio:16/9; }
  .nl-go{ display:none; }
  .nl-lead{ font-size:13px; }
}

/* ако залепването не работи, актът се държи като вертикален списък */
.hz.hz-fallback .hz-sticky{ position:static; height:auto; padding:0 0 30px; overflow:visible; }
.hz.hz-fallback .hz-head{ position:static; padding:0 clamp(20px,5vw,90px); margin-bottom:26px; }
.hz.hz-fallback .hz-track{ flex-direction:column; transform:none !important; gap:52px; }
.hz.hz-fallback .hz-panel{ flex:none; }
.hz.hz-fallback .hz-bar,
.hz.hz-fallback .hz-dots,
.hz.hz-fallback .hz-count{ display:none; }

/* ===========================================================================
   29. ВЪРТЯЩА СЕ ЛЕНТА С НОВИНИТЕ
   Заменя хоризонталния акт на началната страница. Картите стоят на дъга в
   перспектива и при всяко превъртане се наместват по ред: активната отпред в
   цял размер, съседните назад и настрани с все по-малък размер и рязкост.
   Лентата е кръгова — след последната идва първата.

   Иерархията е без рамки: само активната карта разкрива уводното изречение и
   бутона. Съседните показват само категория и заглавие, затова окото веднага
   знае кое е водещото.

   Стиловете на акта (секция 27) остават в файла — ако решим да го сложим на
   страница „Новини“, е готов; в HTML на началната страница вече го няма.
=========================================================================== */

.bl{ position:relative; padding:18px 0 0; }
.bl-stage{
  position:relative;
  height:clamp(390px,50vh,500px);
  perspective:1600px;
  perspective-origin:50% 44%;
  cursor:grab;
  touch-action:pan-y;
}
.bl-stage.is-drag{ cursor:grabbing; }

.bl-card{
  position:absolute; left:50%; top:0;
  width:clamp(280px,34vw,450px);
  margin-left:calc(clamp(280px,34vw,450px) / -2);
  display:block;
  border-radius:16px; overflow:hidden;
  background:var(--cream-3);
  border:1px solid var(--line);
  transform-style:preserve-3d;
  transition:transform .85s cubic-bezier(.2,.9,.25,1),
             opacity .6s ease, box-shadow .6s ease, filter .6s ease;
  will-change:transform;
}
.bl-img{
  display:block;
  height:clamp(176px,21vh,230px);
  background-size:cover; background-position:center;
}
.bl-info{ display:block; padding:18px 20px 22px; }
.bl-cat{
  display:block; margin-bottom:8px;
  font-family:'Manrope',sans-serif; font-size:10px; font-weight:800;
  letter-spacing:.16em; text-transform:uppercase; color:var(--muted);
}
.bl-t{
  display:block;
  font-family:'Fraunces',serif; font-weight:400;
  font-size:clamp(17px,1.5vw,21px); line-height:1.22; color:var(--ink);
}
.bl-lead{
  display:block; margin-top:9px;
  max-height:0; overflow:hidden; opacity:0;
  font-family:'Manrope',sans-serif; font-size:13px; line-height:1.62;
  color:var(--ink-soft);
  transition:max-height .6s ease, opacity .5s ease;
}
.bl-cta{
  display:block; margin-top:0;
  max-height:0; overflow:hidden; opacity:0;
  font-family:'Manrope',sans-serif; font-size:11.5px; font-weight:800;
  letter-spacing:.1em; text-transform:uppercase; color:var(--brick);
  transition:max-height .6s ease, opacity .5s ease, margin-top .5s ease;
}
.bl-card.is-on .bl-lead{ max-height:5.4em; opacity:1; }
.bl-card.is-on .bl-cta{ max-height:2em; opacity:1; margin-top:12px; }
.bl-card.is-on{ border-color:var(--brick-bg); }

.bl-num{
  position:absolute; z-index:3; right:14px; top:12px;
  padding:5px 11px; border-radius:999px;
  background:rgba(251,248,241,.9);
  backdrop-filter:blur(6px);
  font-family:'Fraunces',serif; font-style:italic; font-size:14px;
  color:var(--brick);
}

/* --- номерата долу --- */
.bl-ticks{
  display:flex; justify-content:center; align-items:center;
  gap:clamp(10px,1.6vw,22px);
  margin-top:clamp(18px,3vh,32px);
}
.bl-tick{
  position:relative; padding:8px 4px 12px;
  border:0; background:none; cursor:pointer;
  font-family:'Fraunces',serif; font-style:italic; font-size:15px;
  color:var(--muted);
  transition:all .35s ease-in-out;
}
.bl-tick b{ font-weight:400; }
.bl-tick i{
  position:absolute; left:0; right:0; bottom:0;
  display:block; height:2px; border-radius:2px;
  background:var(--line); overflow:hidden;
}
.bl-tick i::after{
  content:''; position:absolute; inset:0; border-radius:2px;
  background:linear-gradient(90deg, var(--brick), #C06A4E 60%, #6E9C5C);
  transform:scaleX(0); transform-origin:left;
}
.bl-tick:hover{ color:var(--brick); }
.bl-tick:focus-visible{ outline:2px solid var(--brick); outline-offset:3px; }
.bl-tick.is-on{ color:var(--brick); font-size:20px; }
.bl[data-running="1"] .bl-tick.is-on i::after{
  animation:blTick var(--hold,5200ms) linear forwards;
}
@keyframes blTick{ from{ transform:scaleX(0); } to{ transform:scaleX(1); } }

.bl-hint{
  margin:14px auto 0; width:max-content;
  font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; color:var(--muted);
}

@media (max-width:760px){
  .bl-stage{ height:clamp(410px,62vh,520px); perspective:1100px; }
  .bl-card{
    width:clamp(250px,82vw,340px);
    margin-left:calc(clamp(250px,82vw,340px) / -2);
  }
  .bl-img{ height:158px; }
}
@media (prefers-reduced-motion:reduce){
  .bl-card{ transition:none; }
  .bl-tick.is-on i::after{ animation:none; transform:scaleX(1); }
}


/* ===========================================================================
   31. РУБРИКИ И КЛУБОВЕ — СОБСТВЕН РАЗДЕЛ
   Алеко ТВ и Алекознайко бяха достъпни само като панели във въртящата се
   лента с новините — трябваше да чакаш да дойдат техните номера. Тук имат
   свой раздел под нея, а редът отдолу води до останалите рубрики.
=========================================================================== */

.rb-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:clamp(18px,2.4vw,32px);
}
.rb-card{
  display:flex; flex-direction:column;
  border-radius:16px; overflow:hidden;
  background:var(--cream-3);
  border:1px solid var(--line);
  box-shadow:0 10px 26px -18px rgba(36,30,25,.35);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .3s ease;
}
.rb-card:hover{
  transform:translateY(-6px);
  border-color:var(--brick);
  box-shadow:0 26px 52px -24px rgba(36,30,25,.42);
}
.rb-img{
  position:relative; display:block;
  aspect-ratio:16/9;
  background-size:cover; background-position:center;
}
.rb-play{
  position:absolute; left:50%; top:50%;
  width:52px; height:52px; margin:-26px 0 0 -26px;
  display:grid; place-items:center; border-radius:50%;
  background:rgba(251,248,241,.94); color:var(--brick);
  box-shadow:0 8px 22px -8px rgba(36,30,25,.5);
  transition:all .4s ease-in-out;
}
.rb-card:hover .rb-play{ background:var(--brick); color:#fff; transform:scale(1.1); }
.rb-body{ display:block; padding:20px 22px 24px; }
.rb-kick{
  display:block; margin-bottom:8px;
  font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800;
  letter-spacing:.16em; text-transform:uppercase; color:var(--brick);
}
.rb-t{
  display:block;
  font-family:'Fraunces',serif; font-weight:400;
  font-size:clamp(18px,1.9vw,24px); line-height:1.24; color:var(--ink);
}
.rb-sub{
  display:block; margin-top:9px; max-width:44ch;
  font-family:'Manrope',sans-serif; font-size:13.5px; line-height:1.65;
  color:var(--ink-soft);
}

@media (max-width:760px){
  .rb-grid{ grid-template-columns:1fr; }
}

/* ===========================================================================
   32. ГЕРОЙСКИЯТ КАДЪР — КИНО ЛЕНТА И СВЕТЕЩА НИШКА
   Кадърът беше височина 100vh — цял екран, при който посетителят не вижда,
   че отдолу има съдържание. Сега е кинематографична лента 2.35:1 от ръб до
   ръб: на широк монитор заема около половината екран, значи веднага се показва
   и началото на „Нашата история“. Съотношението се води по ширината, затова
   изглежда еднакво на всеки монитор, вместо да се изрязва на нисък.

   Надписите, заглавието дума по дума и полароидът остават както си бяха.

   Отгоре: тънка светеща нишка пресича кадъра по средата на всеки 7 секунди,
   а по средата остава едва видима постоянна линия като хоризонт. Същият език
   като искрата по времевата линия в „Нашата история“.
=========================================================================== */

.ed-hero{
  height:auto;
  min-height:auto;
  max-height:none;
  overflow:visible;
  background:var(--cream);
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:0;
  padding:calc(var(--ed-banner-h, 0px) + clamp(98px,11vh,124px)) 0 clamp(20px,3vh,36px);
}

/* --- лентата --- */
.ed-hero-bg{
  position:relative;
  flex:0 0 auto;
  width:100vw;
  margin-left:calc(50% - 50vw);
  aspect-ratio:2.35 / 1;
  max-height:62vh;
  min-height:340px;
  overflow:hidden;
  display:flex;
  align-items:flex-end;
}

/* надписите остават долу в кадъра */
/* Надписите се вдигат по-високо в кадъра: движещата се лента стои плътно под
   него и текстът опираше в нея. Сега между тях има въздух, а редовете имат
   повече място по ширина, за да не се пренасят на повече редове. */
.ed-hero .ed-hero-inner{
  position:absolute; z-index:4;
  left:0; right:0; bottom:0;
  padding:0 clamp(20px,5vw,80px) clamp(64px,10vh,120px);
}
.ed-hero .ed-hero-sub{ max-width:66ch; }



/* показалецът за скрол вече е под лентата, върху кремавото */
.ed-hero .ed-scroll-cue{
  position:relative; left:auto; bottom:auto;
  align-self:center; transform:none;
}
.ed-hero .ed-scroll-cue .line{ background:var(--brick); opacity:.5; }

/* --- светещата нишка: закотвена за САМОТО ЗАГЛАВИЕ ---
   По-рано беше позиционирана спрямо долния край на кадъра, а той се мени с
   височината на екрана — затова нишката се озоваваше някъде другаде, вместо
   под името. Сега е псевдоелемент на самото заглавие, значи винаги минава
   точно под него, на всеки екран. */
.ed-hero .ed-hero-inner h1{ position:relative; }

/* постоянната бледа линия под името */
.ed-hero .ed-hero-inner h1::after{
  content:'';
  position:absolute;
  left:50%; bottom:-18px;
  transform:translateX(-50%);
  width:min(720px, 94%);
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,246,232,.3) 22%, rgba(255,246,232,.3) 78%, transparent);
  pointer-events:none;
}
/* искрата, която пробягва по нея */
.ed-hero .ed-hero-inner h1::before{
  content:'';
  position:absolute;
  bottom:-19px; left:4%;
  width:26%; height:3px;
  border-radius:3px;
  background:linear-gradient(90deg,
    transparent,
    rgba(255,246,232,.95) 45%,
    rgba(192,106,78,.9) 62%,
    transparent);
  box-shadow:0 0 18px 3px rgba(255,236,190,.35);
  filter:blur(.4px);
  pointer-events:none;
  animation:fxThread 7s cubic-bezier(.5,0,.5,1) infinite;
}
@keyframes fxThread{
  0%   { left:-26%; opacity:0; }
  12%  { opacity:1; }
  80%  { opacity:1; }
  100% { left:100%; opacity:0; }
}
/* старият елемент в разметката вече не се ползва */
.fx-thread{ display:none; }

@media (max-width:860px){
  .ed-hero-bg{ aspect-ratio:16 / 10; max-height:none; min-height:300px; }
}
@media (max-width:760px){
  /* на телефон кадърът е по-висок, за да не е ивица */
  .ed-hero-bg{ aspect-ratio:4 / 3; max-height:none; min-height:340px; }
}

@media (prefers-reduced-motion:reduce){
  /* линията под името остава, спира само искрата */
  .ed-hero .ed-hero-inner h1::before{ animation:none; opacity:0; }
}

/* Менюто е върху кремаво и е в тъмен текст, затова затъмняващият воал в
   горния ръб на кадъра е излишен — само мърсеше картината. */
.ed-hero .ed-nav-scrim{ display:none; }

/* ===========================================================================
   33. НОВИНАРСКА ЛЕНТА НАЙ-ОТДОЛУ
   Закаченото съобщение беше полароид в кадъра. В ниската кино лента то нямаше
   място: блъскаше се с бутона „Контакти“ и с логото, а на телефон лягаше върху
   заглавието. Сега е тънка лента, закачена най-долу на екрана, в която текстът
   тече бавно отдясно наляво — както важните съобщения в новините.

   Нарочно е сдържана: 34 пиксела висока, полупрозрачна с размиване, дребен
   текст в разредка. Показва се само когато е активна и докато не е изтекла —
   същата логика като преди, същите атрибути data-active и data-expires.

   Бутонът „Контакти“ е махнат от бара на всички 26 страници — заради него
   логото се съкращаваше. Контактите остават в менюто, долу в списъка.
=========================================================================== */

.ed-ticker{
  margin-top:10px;
  /* Стои веднага под заглавната снимка, в потока на страницата — не е закачена
     за долния край на екрана. Разлива се на цялата ширина, за да продължи
     ръбовете на кадъра. */
  position:relative;
  left:50%;
  width:100vw;
  margin-left:-50vw;
  z-index:5;
  height:36px;
  display:flex; align-items:center;
  background:rgba(251,248,241,.82);
  backdrop-filter:blur(12px) saturate(1.3);
  -webkit-backdrop-filter:blur(12px) saturate(1.3);
  border-top:1px solid rgba(162,76,54,.14);
  border-bottom:1px solid rgba(162,76,54,.14);
  opacity:0;
  transform:translateY(-8px);
  pointer-events:none;
  transition:opacity .6s ease, transform .7s cubic-bezier(.16,.8,.3,1);
}
.ed-ticker.active{
  opacity:1;
  transform:none;
  pointer-events:auto;
}

/* релсата реже, а пътечката се движи — затова текстът изчезва плавно в ръбовете */
.tk-rail{
  flex:1; min-width:0; overflow:hidden;
  -webkit-mask:linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
  mask:linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}
.tk-track{
  display:flex; width:max-content;
  animation:tkRun 68s linear infinite;
}
.ed-ticker:hover .tk-track{ animation-play-state:paused; }
@keyframes tkRun{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

.tk-item{
  display:inline-flex; align-items:center; gap:12px;
  padding-right:64px;
  white-space:nowrap;
  font-family:'Manrope',sans-serif;
  font-size:11.5px; font-weight:600;
  letter-spacing:.1em;
  color:var(--ink-soft);
}
.tk-dot{
  width:6px; height:6px; border-radius:50%;
  background:var(--brick);
  box-shadow:0 0 0 3px rgba(162,76,54,.14);
  flex:0 0 auto;
}
.tk-msg{ text-transform:uppercase; }
.tk-link{
  font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:var(--brick);
  border-bottom:1px solid rgba(162,76,54,.35);
  padding-bottom:1px;
  transition:border-color .3s ease;
}
.tk-link:hover{ border-bottom-color:var(--brick); }

@media (max-width:760px){
  .ed-ticker{ height:32px; }
  .tk-item{ font-size:10.5px; padding-right:48px; gap:9px; }
  .tk-track{ animation-duration:52s; }
}
@media (prefers-reduced-motion:reduce){
  /* без движение лентата само стои, а текстът се чете отляво */
  .tk-track{ animation:none; }
  .tk-rail{ -webkit-mask:none; mask:none; }
}

/* ===========================================================================
   34. СКИНОВЕ НА РАЗДЕЛИТЕ — РИСУВАНИ КАВЪРИ
   Всеки раздел има свой кавър: истинска SVG рисунка в папка art/, в цвета на
   собствената си палитра, с абстрактен мотив по темата. Същият език като
   тапетите на плочките в „Материална база“.

   Четиринайсет файла, общо под 17 KB — рязки на всеки екран, нула растерни
   изображения. Върху рисунката минава мек светлинен ъгъл за обем, а надписите
   стоят над всичко.

   Мотивите: Прием — стъпки към отворена врата. Учебен процес — тетрадка,
   часовник и книга. За родители — преливащи форми и сърце. Проекти —
   съзвездие и глобус. Документи — наслоени листове с печат. Рубрики и Алеко ТВ
   — вълна с бутон за пускане и еквалайзер. Алекознайко — крушка и балон за
   реплика. Екип — редица фигури. Квалификации — стъпала и лавров венец.
   Материална база — план на сграда. Новини — колони на вестник. Визия —
   изгряващи дъги и компас. За ученици — раница, тетрадка и молив.
=========================================================================== */

.ed-cover{
  position:relative;
  overflow:hidden;
  background-image:url('art/cover-default.svg');
  background-size:cover;
  background-position:center;
}
.ed-cover-stack{ position:relative; z-index:3; }
.ed-cover-figures{ display:none; }   /* старите общи фигури вече не трябват */

[data-theme="priem"]        .ed-cover{ background-image:url('art/cover-priem.svg'); }
[data-theme="uchproc"]      .ed-cover{ background-image:url('art/cover-uchproc.svg'); }
[data-theme="roditeli"]     .ed-cover{ background-image:url('art/cover-roditeli.svg'); }
[data-theme="proekti"]      .ed-cover{ background-image:url('art/cover-proekti.svg'); }
[data-theme="info"]         .ed-cover{ background-image:url('art/cover-info.svg'); }
[data-theme="alekotv"]      .ed-cover{ background-image:url('art/cover-media.svg'); }
[data-theme="media"]        .ed-cover{ background-image:url('art/cover-media.svg'); }
[data-theme="alekoznaiko"]  .ed-cover{ background-image:url('art/cover-alekoznaiko.svg'); }
[data-theme="ekip"]         .ed-cover{ background-image:url('art/cover-ekip.svg'); }
[data-theme="kvalifikacii"] .ed-cover{ background-image:url('art/cover-kvalifikacii.svg'); }
[data-theme="baza"]         .ed-cover{ background-image:url('art/cover-baza.svg'); }
[data-theme="novini"]       .ed-cover{ background-image:url('art/cover-novini.svg'); }
[data-theme="vizia"]        .ed-cover{ background-image:url('art/cover-vizia.svg'); }
[data-theme="uchenici"]     .ed-cover{ background-image:url('art/cover-uchenici.svg'); }

/* лек тъмен воал в долния край — за да се чете заглавието върху рисунката */
.ed-cover::after{
  content:'';
  position:absolute; inset:0; z-index:2;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(36,30,25,.06) 0%, transparent 34%, rgba(26,18,14,.42) 100%);
}
.ed-cover-title{ position:relative; z-index:3; }
.ed-cover-icon{ position:relative; z-index:3; }

/* върху рисунката заглавието и иконата са светли — така се четат и на тъмно,
   и на светло място в кавъра */
.ed-cover-title{ color:#FFFDF7; text-shadow:0 2px 26px rgba(26,18,14,.5); }
.ed-cover-icon{ color:rgba(255,253,247,.94); }
.ed-cover .ed-kicker{ color:rgba(255,246,232,.82); }

/* ===========================================================================
   35. СКИН НА ЦЯЛАТА СТРАНИЦА
   Досега разделът се познаваше само по кавъра. Сега целият раздел носи своя
   характер: фонът на страницата е с лек оттенък от палитрата си, зад
   съдържанието минава едва видима шарка, повтаряща мотива от кавъра, а
   секциите, картите и връзките поемат акцентния цвят.

   Шарката е върху main::before — значи е на страницата, не на екрана, и не
   пречи при скролване. Държана е между 3 и 6 процента: трябва да се усеща,
   не да се вижда.
=========================================================================== */

[data-theme]{
  background:
    linear-gradient(180deg,
      color-mix(in srgb, var(--brick-bg) 55%, var(--cream)) 0%,
      var(--cream) 46%,
      color-mix(in srgb, var(--brick-bg) 35%, var(--cream)) 100%);
}
[data-theme] main{ position:relative; }
[data-theme] main::before{
  content:'';
  position:absolute; inset:0;
  z-index:0;
  pointer-events:none;
  opacity:.05;
}
/* Прозорците за преглед (снимка, документ) са position:fixed и трябва да
   останат такива — затова не ги пипаме. Преди това правило ги правеше
   relative и те се отваряха някъде долу в страницата, вместо върху екрана. */
/* Прозорците за преглед са position:fixed и трябва да останат такива.
   Изключенията се изброяват по клас — ако утре се появи нов прозорец, добавя
   се и той, иначе ще се отваря в потока, някъде долу под съдържанието. */
[data-theme] main > *:not(.ed-doc-preview):not(.ed-video-preview){ position:relative; z-index:1; }

/* тънка акцентна черта над всяка секция — свързва страницата с кавъра */
[data-theme] .ed-section + .ed-section{
  border-top:1px solid color-mix(in srgb, var(--brick) 18%, transparent);
}
/* заглавията на секциите и надписите поемат цвета на раздела */
[data-theme] .ed-kicker{ color:var(--brick); }
[data-theme] .ed-page-title{ color:var(--brick-deep); }
/* картите и панелите — лек оттенък вместо голо бяло */
[data-theme] .ed-doc-cat-btn:hover,
[data-theme] .ed-sub-item:hover{
  background:linear-gradient(90deg, var(--brick-bg) 0%, transparent 76%);
}
[data-theme] .ed-doc-card{
  background:linear-gradient(170deg, #fff 0%, color-mix(in srgb, var(--brick-bg) 42%, #fff) 100%);
}
[data-theme] .ed-photo-tile{ box-shadow:0 14px 34px -20px color-mix(in srgb, var(--brick-deep) 55%, transparent); }

/* --- шарките: всяка повтаря мотива от своя кавър --- */

/* Прием — стъпки по път */
[data-theme="priem"] main::before{
  background:
    radial-gradient(circle at 12% 30%, var(--brick) 0 9px, transparent 10px),
    radial-gradient(circle at 32% 34%, var(--brick) 0 8px, transparent 9px),
    radial-gradient(circle at 52% 30%, var(--brick) 0 8px, transparent 9px),
    radial-gradient(circle at 72% 34%, var(--brick) 0 9px, transparent 10px);
  background-size:520px 520px;
}
/* Учебен процес — разграфена тетрадка */
[data-theme="uchproc"] main::before{
  background:
    linear-gradient(0deg, var(--brick) 0 1px, transparent 1px),
    linear-gradient(90deg, var(--brick) 0 1px, transparent 1px);
  background-size:34px 34px;
  opacity:.07;
}
/* За родители — преливащи форми */
[data-theme="roditeli"] main::before{
  background:
    radial-gradient(28% 22% at 18% 12%, var(--brick) 0 60%, transparent 62%),
    radial-gradient(24% 18% at 78% 42%, var(--brick) 0 60%, transparent 62%),
    radial-gradient(26% 20% at 38% 78%, var(--brick) 0 60%, transparent 62%);
  background-size:900px 900px;
  opacity:.06;
}
/* Проекти — съзвездие */
[data-theme="proekti"] main::before{
  background-image:
    radial-gradient(circle at 10% 20%, var(--brick) 0 4px, transparent 5px),
    radial-gradient(circle at 42% 8%, var(--brick) 0 5px, transparent 6px),
    radial-gradient(circle at 74% 26%, var(--brick) 0 4px, transparent 5px),
    radial-gradient(circle at 26% 62%, var(--brick) 0 4px, transparent 5px),
    radial-gradient(circle at 62% 76%, var(--brick) 0 5px, transparent 6px);
  background-size:640px 640px;
  opacity:.08;
}
/* Документи — наслоени листове */
[data-theme="info"] main::before{
  background:repeating-linear-gradient(104deg,
    transparent 0 60px, var(--brick) 60px 61px, transparent 61px 140px);
}
/* Рубрики и клубове — прожектор в ъгъла, чийто сноп осветява знаците на
   клубовете: камерата на Алеко ТВ, крушката на Алекознайко и два знака,
   оставени за клубовете, които предстоят. Рисунката е ЕДНА — не се повтаря
   и стои закована спрямо екрана, затова не се движи при скролване. */
[data-theme="media"] main::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 680 340' preserveAspectRatio='xMinYMin slice'%3E%3Cdefs%3E%3ClinearGradient id='snop' x1='0' y1='0' x2='1' y2='0.6'%3E%3Cstop offset='0' stop-color='%23B8863B' stop-opacity='0.22'/%3E%3Cstop offset='0.55' stop-color='%23B8863B' stop-opacity='0.10'/%3E%3Cstop offset='1' stop-color='%23B8863B' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M118 12 L680 240 L680 340 L420 340 L132 62 Z' fill='url(%23snop)'/%3E%3Cg opacity='0.16' fill='none' stroke='%232F6F66' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 14 L70 44'/%3E%3Cpath d='M60 26 L118 12 L132 62 L74 76 Z'/%3E%3Cpath d='M118 12 l14 -12 M132 62 l16 12'/%3E%3C/g%3E%3Cg opacity='0.15' fill='none' stroke='%232F6F66' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='220' y='137' width='40' height='26' rx='4'/%3E%3Ccircle cx='232' cy='150' r='7'/%3E%3Cpath d='M260 142 l14 -6 v20 l-14 -6 z'/%3E%3Ccircle cx='370' cy='196' r='13'/%3E%3Cpath d='M362 212 h16 M365 218 h10'/%3E%3Ccircle cx='462' cy='246' r='7'/%3E%3Cpath d='M469 246 v-26 l15 -5 v10'/%3E%3Cpath d='M330 254 l24 -24'/%3E%3Cpath d='M354 230 l12 -12 l9 9 l-12 12 z'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:left top;
  background-size:cover;
  background-attachment:fixed;
  opacity:1;
}
/* по телефоните заковаването се държи капризно — там рисунката просто стои
   най-горе на страницата и се плъзга с нея */
@media (max-width:760px){
  [data-theme="media"] main::before{ background-attachment:scroll; background-size:150% auto; }
}
/* Алеко ТВ — вълна (сигналът в ефир) */
[data-theme="alekotv"] main::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 80'%3E%3Cpath d='M0 40 C 50 8 100 72 150 40 C 200 8 250 72 300 40 C 350 8 400 72 450 40' fill='none' stroke='%23000' stroke-width='3'/%3E%3C/svg%3E");
  background-size:400px 80px;
  opacity:.06;
}
/* Алекознайко — крушки */
[data-theme="alekoznaiko"] main::before{
  background:
    radial-gradient(circle at 20% 24%, var(--brick) 0 26px, transparent 27px),
    radial-gradient(circle at 70% 64%, var(--brick) 0 20px, transparent 21px);
  background-size:560px 560px;
  opacity:.05;
}
/* Екип — редица кръгове */
[data-theme="ekip"] main::before{
  background:radial-gradient(circle at 50% 40%, var(--brick) 0 22px, transparent 23px);
  background-size:150px 150px;
}
/* Квалификации — стъпала */
[data-theme="kvalifikacii"] main::before{
  background:
    linear-gradient(0deg, var(--brick) 0 22px, transparent 22px) 0% 100%/60px 22px repeat-x,
    linear-gradient(0deg, var(--brick) 0 44px, transparent 44px) 60px 100%/60px 44px repeat-x,
    linear-gradient(0deg, var(--brick) 0 66px, transparent 66px) 120px 100%/60px 66px repeat-x;
  opacity:.045;
}
/* Материална база — план на сграда */
[data-theme="baza"] main::before{
  background:
    linear-gradient(0deg, var(--brick) 0 1.5px, transparent 1.5px),
    linear-gradient(90deg, var(--brick) 0 1.5px, transparent 1.5px);
  background-size:180px 120px;
  opacity:.06;
}
/* Новини — колони на вестник */
[data-theme="novini"] main::before{
  background:
    repeating-linear-gradient(90deg, var(--brick) 0 1px, transparent 1px 220px),
    repeating-linear-gradient(0deg, var(--brick) 0 1px, transparent 1px 16px);
  opacity:.045;
}
/* Визия — изгряващи дъги */
[data-theme="vizia"] main::before{
  background:
    radial-gradient(120% 60% at 50% 104%, transparent 0 46%, var(--brick) 46% 47%, transparent 47%),
    radial-gradient(96% 48% at 50% 104%, transparent 0 46%, var(--brick) 46% 47%, transparent 47%),
    radial-gradient(72% 36% at 50% 104%, transparent 0 46%, var(--brick) 46% 47%, transparent 47%),
    radial-gradient(48% 24% at 50% 104%, transparent 0 46%, var(--brick) 46% 47%, transparent 47%);
  background-size:1200px 900px;
  background-repeat:repeat-x;
  opacity:.09;
}
/* За ученици — тетрадка на редове */
[data-theme="uchenici"] main::before{
  background:
    linear-gradient(0deg, var(--brick) 0 1px, transparent 1px),
    linear-gradient(90deg, var(--brick) 0 2px, transparent 2px);
  background-size:100% 26px, 90px 100%;
  opacity:.05;
}

@media (prefers-reduced-motion:reduce){
  [data-theme] main::before{ opacity:.03; }
}

/* ===========================================================================
   36. СТРАНИЦА НА ПУБЛИКАЦИЯ
   Дотук новините бяха само заглавия в списък — нямаше къде да се прочете
   самата новина. Тази страница е шаблонът: заглавна снимка, водещ абзац,
   текст в четима колона и галерия със снимки от деня.
=========================================================================== */

.ar-head{ max-width:760px; margin:0 auto 34px; text-align:center; }
.ar-head .ed-kicker{ display:block; margin-bottom:14px; }
.ar-lead{
  margin:18px auto 0; max-width:62ch;
  font-family:'Fraunces',serif; font-style:italic; font-weight:400;
  font-size:clamp(17px,1.8vw,22px); line-height:1.55;
  color:var(--ink-soft);
}

.ar-hero{
  margin:0 auto 42px;
  max-width:1100px;
  border-radius:16px; overflow:hidden;
  box-shadow:0 26px 60px -30px rgba(36,30,25,.45);
}
.ar-hero img{ width:100%; height:auto; display:block; }

.ar-body{ max-width:68ch; margin:0 auto; }
.ar-p{
  margin:0 0 20px;
  font-family:'Manrope',sans-serif;
  font-size:15.5px; line-height:1.85;
  color:var(--ink-soft);
}
/* първият абзац започва с по-голяма буква — дава ритъм на текста */
.ar-p:first-child::first-letter{
  float:left;
  font-family:'Fraunces',serif; font-style:italic; font-weight:400;
  font-size:64px; line-height:.82;
  margin:6px 12px 0 0;
  color:var(--brick);
}

/* галерията: палците са отделни файлове, големите се отварят в прегледа */
.ed-photo-grid{ grid-template-columns:repeat(auto-fill, minmax(min(100%,240px), 1fr)); }
.ed-photo-tile .pt-n{ opacity:.7; }

@media (max-width:640px){
  .ar-hero{ border-radius:12px; margin-bottom:30px; }
  .ar-p{ font-size:15px; }
  .ar-p:first-child::first-letter{ font-size:52px; }
}

/* връзки към социалните мрежи във футъра */
.f-soc{ display:inline-flex; align-items:center; gap:9px; }
.f-soc svg{ flex:0 0 auto; opacity:.8; transition:opacity .3s ease, transform .3s ease; }
.f-soc:hover svg{ opacity:1; transform:scale(1.12); }

/* ===========================================================================
   37. ПРЕЛИСТВАНЕ В ПРЕГЛЕДА НА СНИМКИ
   Дотук прегледът показваше една снимка и трябваше да се затваря, за да се
   види следващата. Сега има стрелки, брояч, клавиши със стрелките и плъзгане
   с пръст. Стрелките се създават от JS, затова работят на всяка страница с
   галерия, без да се пипа разметката ѝ.
=========================================================================== */

.ph-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  z-index:5;
  width:52px; height:52px;
  display:grid; place-items:center;
  border:0; border-radius:50%;
  cursor:pointer;
  background:rgba(251,248,241,.9);
  color:var(--ink);
  box-shadow:0 10px 26px -12px rgba(20,12,9,.5);
  transition:all .3s ease-in-out;
}
.ph-nav.prev{ left:14px; }
.ph-nav.next{ right:14px; }
.ph-nav:hover{ background:#fff; transform:translateY(-50%) scale(1.08); }
.ph-nav:focus-visible{ outline:2px solid var(--brick); outline-offset:3px; }

.ph-count{
  font-family:'Manrope',sans-serif;
  font-size:12px; font-weight:800;
  letter-spacing:.1em;
  color:var(--muted);
  margin-right:14px;
  white-space:nowrap;
}

@media (max-width:640px){
  .ph-nav{ width:44px; height:44px; }
  .ph-nav.prev{ left:8px; }
  .ph-nav.next{ right:8px; }
  .ph-count{ margin-right:10px; font-size:11px; }
}

/* ===========================================================================
   38. ЛЕНТИ — ПРОЕКТИ И МАТЕРИАЛНА БАЗА
   Кутийки една до друга не дават място за текст и всичко изглежда еднакво
   важно. Тук всяка тема има собствена лента през цялата ширина: рисунка от
   едната страна, текст от другата, голям номер и факти под него. Лентите се
   редуват — една с рисунка отляво, следващата отдясно — и всяка втора носи
   лек оттенък, за да се чете като отделно място.
=========================================================================== */

.pb{
  position:relative;
  left:50%; width:100vw; margin-left:-50vw;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);
  align-items:stretch;
  min-height:clamp(340px,42vw,520px);
}
.pb:nth-of-type(even){ background:color-mix(in srgb, var(--brick-bg) 46%, var(--cream)); }

.pb-art{
  background-size:cover; background-position:center;
  min-height:240px;
}
.pb-text{
  display:flex; flex-direction:column; align-items:flex-start;
  gap:12px;
  padding:clamp(34px,4.6vw,72px) clamp(22px,5vw,90px);
  justify-content:center;
  max-width:820px;
}
/* редуване: при „right“ рисунката минава отдясно */
.pb-right .pb-art{ grid-column:2; grid-row:1; }
.pb-right .pb-text{ grid-column:1; grid-row:1; margin-left:auto; }

.pb-n{
  font-family:'Fraunces',serif; font-style:italic;
  font-size:clamp(30px,3.4vw,50px); line-height:.9;
  color:var(--brick); opacity:.32;
}
.pb-kick{
  font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800;
  letter-spacing:.16em; text-transform:uppercase; color:var(--brick);
}
.pb-t{
  margin:0; max-width:26ch;
  font-family:'Fraunces',serif; font-weight:400;
  font-size:clamp(22px,2.6vw,36px); line-height:1.16; color:var(--ink);
}
.pb-p{
  margin:0; max-width:62ch;
  font-family:'Manrope',sans-serif; font-size:14.5px; line-height:1.78;
  color:var(--ink-soft);
}
.pb-facts{
  display:flex; flex-wrap:wrap; gap:10px 28px;
  margin-top:8px; padding-top:16px;
  border-top:1px solid var(--line);
  width:100%;
}
.pb-fact{ display:flex; flex-direction:column; gap:3px; max-width:26ch; }
.pb-fact b{
  font-family:'Fraunces',serif; font-style:italic; font-weight:400;
  font-size:18px; color:var(--brick-deep);
}
.pb-fact span{
  font-family:'Manrope',sans-serif; font-size:12.5px; line-height:1.5;
  color:var(--muted);
}
.pb-note{
  margin:6px 0 0;
  font-family:'Manrope',sans-serif; font-size:12px; line-height:1.6;
  color:var(--muted);
}
.pb-link{
  margin-top:10px;
  font-family:'Manrope',sans-serif; font-size:12.5px; font-weight:800;
  letter-spacing:.1em; text-transform:uppercase; color:var(--brick);
  border-bottom:1.5px solid var(--brick-bg); padding-bottom:3px;
  transition:all .3s ease-in-out;
}
.pb-link:hover{ border-bottom-color:var(--brick); }

/* архив — тънък списък, без кутии */
.pb-arch{ list-style:none; margin:0; padding:0; }
.pb-arch li{
  padding:15px 4px;
  border-top:1px solid var(--line);
  font-family:'Manrope',sans-serif; font-size:14.5px; color:var(--ink-soft);
}
.pb-arch li:last-child{ border-bottom:1px solid var(--line); }

@media (max-width:860px){
  .pb{ grid-template-columns:1fr; min-height:0; }
  /* На телефон рисунката се показва ЦЯЛА. Преди отворът беше 16:9, а рисунките
     са 4:3 — значи се изрязваха отгоре и отдолу, а „дишането“ ги уголемяваше и
     режеше още. Сега пропорцията съвпада, картинката се побира, а дишането
     спира: на малък екран то само мести кадъра, без да се усеща. */
  .pb-art{
    grid-column:1 !important; grid-row:1 !important;
    aspect-ratio:4/3; min-height:0;
    background-size:contain !important;
    background-repeat:no-repeat;
    background-position:center !important;
    animation:none !important;
  }
  .pb-text{ grid-column:1 !important; grid-row:2 !important; margin:0 !important; padding:26px 20px 34px; }
  .pb-t{ max-width:none; }
}

/* ===========================================================================
   39. НОРМАТИВНИ ДОКУМЕНТИ — ГРУПИ И ТЪРСАЧКА
   Девет затворени реда един под друг натежаваха. Сега категориите са в три
   групи по смисъл, а отгоре има търсачка, която филтрира по име на документ и
   отваря само категориите с попадения.
=========================================================================== */

.doc-group{ margin-bottom:clamp(30px,4vh,52px); }
.doc-group-t{
  margin:0 0 14px;
  padding-bottom:10px;
  border-bottom:1px solid color-mix(in srgb, var(--brick) 22%, transparent);
  font-family:'Manrope',sans-serif; font-size:11px; font-weight:800;
  letter-spacing:.18em; text-transform:uppercase; color:var(--brick);
}

.doc-search{ margin:0 0 clamp(24px,3.4vh,38px); }
.ds-lab{
  display:block; margin-bottom:8px;
  font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800;
  letter-spacing:.16em; text-transform:uppercase; color:var(--muted);
}
.ds-box{
  display:flex; align-items:center; gap:10px;
  padding:13px 16px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
  transition:border-color .3s ease, box-shadow .3s ease;
}
.ds-box:focus-within{
  border-color:var(--brick);
  box-shadow:0 0 0 4px color-mix(in srgb, var(--brick) 12%, transparent);
}
.ds-box svg{ color:var(--muted); flex:0 0 auto; }
.ds-box input{
  flex:1; min-width:0;
  border:0; outline:none; background:none;
  font-family:'Manrope',sans-serif; font-size:14.5px; color:var(--ink);
}
.ds-box input::placeholder{ color:var(--muted); }
.ds-clear{
  border:0; background:none; cursor:pointer;
  font-size:14px; color:var(--muted); padding:2px 4px;
}
.ds-clear:hover{ color:var(--brick); }
.ds-hint{
  margin:10px 0 0;
  font-family:'Manrope',sans-serif; font-size:12.5px; color:var(--muted);
}
/* при търсене скриваме несъвпадащите карти и цели категории */
.ed-doc-card[hidden], .ed-doc-cat[hidden], .doc-group[hidden]{ display:none !important; }



/* ===========================================================================
   40. ПЛУВАЩИ ФИГУРИ ОТ РАЗДЕЛИТЕ
   Платното е закотвено за екрана, над фона на страницата и под съдържанието ѝ.
   Логиката е в figuri.js — там са и обясненията за дълбочината и формите.
=========================================================================== */
/* Платното стои над фона на страницата и под съдържанието ѝ.
   ВАЖНО: тук се пипа само main. Менюто, наслоеният панел и чатът са fixed по
   природа — направят ли се relative, влизат в потока и бутат страницата надолу.
   Точно това създаваше голямото разстояние над геройския кадър. */
.figuri{
  position:fixed; inset:0; z-index:0;
  pointer-events:none;
}
main{ position:relative; z-index:1; }
.ed-footer{ position:relative; z-index:1; }
/* снимката в „Нашата история“ се смекчава, за да не гаси фигурите под себе си */
.ed-about-wash{ opacity:.5; }

/* ===========================================================================
   41. ОЖИВЯВАНЕ НА КАВЪРИТЕ И ТАПЕТИТЕ
   Рисунките са SVG файлове, ползвани като фон. Вътрешните им анимации не се
   изпълняват, когато файлът е фон — браузърът го рисува като неподвижна
   картинка. Затова движението идва отвън, върху самия слой:

   1. ДИШАНЕ — рисунката много бавно се приближава и отдалечава, 26 секунди за
      цикъл. Достатъчно, за да не е замръзнала, недостатъчно, за да разсейва.
   2. СВЕТЛИНА — мека ивица минава косо през кавъра на всеки 9 секунди, като
      слънце през прозорец.
   3. ПАРАЛАКС — при скролиране рисунката се измества по-бавно от страницата,
      затова кавърът изглежда по-дълбок от текста върху него.
   4. ТАПЕТИТЕ на плочките се приближават при посочване и по тях минава блик.
=========================================================================== */

/* --- 1. дишане ---
   Важи само ако рисунката не е вградена (клас has-art). Когато е вградена,
   линиите ѝ се движат сами и дишането на целия слой е излишно. */
.ed-cover:not(.has-art){
  background-size:112% auto;
  animation:coverDishane 26s ease-in-out infinite alternate;
}
@keyframes coverDishane{
  0%   { background-size:112% auto; background-position:48% 42%; }
  100% { background-size:124% auto; background-position:52% 58%; }
}

/* --- 2. светлината през кавъра --- */
.ed-cover::before{
  content:'';
  position:absolute; z-index:2;
  top:-20%; bottom:-20%; left:-40%; width:34%;
  pointer-events:none;
  background:linear-gradient(100deg, transparent, rgba(255,252,242,.34) 46%, transparent);
  filter:blur(14px);
  transform:skewX(-12deg);
  animation:coverSvetlina 9s ease-in-out infinite;
}
@keyframes coverSvetlina{
  0%   { left:-40%; opacity:0; }
  18%  { opacity:1; }
  72%  { opacity:.9; }
  100% { left:112%; opacity:0; }
}

/* --- 3. паралакс при скролиране (стойността идва от JS) --- */
.ed-cover{ background-position-y:calc(42% + var(--cover-shift, 0px)); }

/* --- 4. тапетите на плочките --- */
.ed-photo-tile img{
  transition:transform 1.1s cubic-bezier(.16,.8,.3,1), filter .5s ease;
}
.ed-photo-tile:hover img{ transform:scale(1.07); filter:saturate(1.08); }
.ed-photo-tile::after{
  content:'';
  position:absolute; inset:0; z-index:2;
  pointer-events:none;
  background:linear-gradient(104deg, transparent 38%, rgba(255,255,255,.5) 50%, transparent 62%);
  transform:translateX(-120%);
  transition:transform 1.1s cubic-bezier(.16,.8,.3,1);
}
.ed-photo-tile:hover::after{ transform:translateX(120%); }

/* лентите в проектите и материалната база — рисунката диша и там */
.pb-art{
  background-size:112% auto;
  animation:coverDishane 30s ease-in-out infinite alternate;
}

@media (prefers-reduced-motion:reduce){
  .ed-cover, .pb-art{ animation:none; background-size:cover; }
  .ed-cover::before{ animation:none; opacity:0; }
  .ed-photo-tile:hover img{ transform:none; }
}

/* ===========================================================================
   42. ЖИВИ ЛИНИИ В КАВЪРА
   Рисунката вече е вградена в страницата (виж края на script-editorial.js),
   затова всяка линия и всяка форма могат да се движат поотделно:
   линиите се изчертават веднъж при отваряне, после дишат;
   формите пулсират много бавно и с различно закъснение.
   Ако вграждането не сработи, кавърът остава фон както преди — нищо не се чупи.
=========================================================================== */

.cover-art{
  position:absolute; inset:0; z-index:1;
  pointer-events:none;
  overflow:hidden;
}
.cover-art svg{ width:100%; height:100%; display:block; }
/* когато рисунката е вградена, фонът на кавъра остава само за цвят */
.has-art{ background-size:cover; animation:none; }
.has-art::before{ z-index:2; }

/* линиите се изчертават, после дишат */
.la-linia{
  stroke-dasharray:1400;
  stroke-dashoffset:1400;
  animation:laChertane 2.4s cubic-bezier(.16,.8,.3,1) forwards,
            laDishane 7s ease-in-out infinite alternate 2.6s;
}
@keyframes laChertane{ to{ stroke-dashoffset:0; } }
@keyframes laDishane{
  0%   { opacity:.7; transform:translateY(0); }
  100% { opacity:1;  transform:translateY(-3px); }
}
/* формите пулсират бавно */
.la-forma{
  transform-box:fill-box;
  transform-origin:center;
  animation:laPulsirane 9s ease-in-out infinite alternate;
}
@keyframes laPulsirane{
  0%   { opacity:.78; transform:scale(1); }
  100% { opacity:1;   transform:scale(1.05); }
}

@media (prefers-reduced-motion:reduce){
  .la-linia, .la-forma{ animation:none; stroke-dashoffset:0; }
}

/* ===========================================================================
   43. СКИЦИ НА СЦЕНИ — АЛЕКО ТВ И ЗА РОДИТЕЛИ
   Повторението на един и същ кадър по страницата отпада: вместо това има две
   различни сцени — студиото горе и монтажната по-долу. Всяка се показва веднъж
   и всяка има свое движение.

   Същият подход е приложен и на „За родители“: портата на училището, родител и
   дете за ръка, тетрадка със съобщение и часовник за срещите.
=========================================================================== */

[data-theme="alekotv"]{
  background:linear-gradient(180deg,
    color-mix(in srgb, #DDEAE6 70%, var(--cream)) 0%,
    var(--cream) 30%,
    var(--cream) 62%,
    color-mix(in srgb, #DDEAE6 48%, var(--cream)) 100%);
}
[data-theme="roditeli"]{
  background:linear-gradient(180deg,
    color-mix(in srgb, var(--brick-bg) 62%, var(--cream)) 0%,
    var(--cream) 32%,
    var(--cream) 66%,
    color-mix(in srgb, var(--brick-bg) 44%, var(--cream)) 100%);
}
/* повтарящата се шарка на тези два раздела отпада — сцените я заместват */
[data-theme="alekotv"] main::before,
[data-theme="roditeli"] main::before{ display:none !important; }

/* Когато рисунката е вградена в кавъра, фоновото ѝ копие се маха. Без това
   едната се вижда през другата и всичко изглежда удвоено. */
.ed-cover.has-art{ background-image:none !important; animation:none; }
.ed-cover.has-art::before{ z-index:3; }

/* --- рамката на сцените --- */
.scena{
  position:relative;
  width:100vw; margin-left:calc(50% - 50vw);
  height:clamp(200px,24vw,340px);
  pointer-events:none;
  opacity:.92;
}
.scena svg{ width:100%; height:100%; display:block; }
.scena-gore{ margin-top:76px; }
.scena-dolu{ margin:clamp(24px,4vh,50px) 0 0; opacity:.8; }

/* ================= ДВИЖЕНИЕ В СТУДИОТО ================= */
.st-cam1{ transform-box:fill-box; transform-origin:70% 60%; animation:tvPan 14s ease-in-out infinite alternate; }
.st-cam2{ transform-box:fill-box; transform-origin:30% 60%; animation:tvPan2 18s ease-in-out infinite alternate; }
@keyframes tvPan{ 0%{ transform:rotate(-2.2deg); } 100%{ transform:rotate(2.6deg); } }
@keyframes tvPan2{ 0%{ transform:rotate(2deg); } 100%{ transform:rotate(-2.4deg); } }
.st-beam, .st-lamp{ transform-box:fill-box; transform-origin:top center; animation:tvLuch 6s ease-in-out infinite alternate; }
@keyframes tvLuch{ 0%{ opacity:.5; transform:rotate(-3deg); } 100%{ opacity:1; transform:rotate(3deg); } }
.st-tally{ animation:tvTally 2.4s steps(1,end) infinite; }
.st-tally2{ animation:tvTally 2.4s steps(1,end) infinite .8s; }
@keyframes tvTally{ 0%,55%{ opacity:1; } 56%,100%{ opacity:.15; } }
.st-boom{ transform-box:fill-box; transform-origin:0% 100%; animation:tvBoom 11s ease-in-out infinite alternate; }
@keyframes tvBoom{ 0%{ transform:rotate(-1.6deg); } 100%{ transform:rotate(2deg); } }
.st-mon path[stroke="#2F6F66"]{ stroke-dasharray:240; stroke-dashoffset:240; animation:tvSignal 3.2s linear infinite; }
@keyframes tvSignal{ to{ stroke-dashoffset:-240; } }
.st-sign{ animation:tvSign 5s ease-in-out infinite; }
@keyframes tvSign{ 0%,100%{ opacity:1; } 50%{ opacity:.5; } }

/* ================= ДВИЖЕНИЕ В МОНТАЖНАТА ================= */
/* курсорът на времевата линия минава напред-назад, както при монтаж */
.st-playhead{ transform-box:fill-box; animation:tvPlayhead 9s ease-in-out infinite alternate; }
@keyframes tvPlayhead{ 0%{ transform:translateX(-104px); } 100%{ transform:translateX(238px); } }
.st-clips rect{ animation:tvClip 5s ease-in-out infinite alternate; }
.st-clips rect:nth-child(2){ animation-delay:.6s; }
.st-clips rect:nth-child(3){ animation-delay:1.2s; }
.st-clips rect:nth-child(4){ animation-delay:1.8s; }
@keyframes tvClip{ 0%{ opacity:.55; } 100%{ opacity:1; } }
.st-clap{ transform-box:fill-box; transform-origin:0% 100%; animation:tvClap 7s ease-in-out infinite; }
@keyframes tvClap{ 0%,88%,100%{ transform:rotate(0); } 92%{ transform:rotate(-3deg); } 96%{ transform:rotate(1deg); } }
.st-wave{ stroke-dasharray:60 14; animation:tvWave 4s linear infinite; }
@keyframes tvWave{ to{ stroke-dashoffset:-148; } }
.st-screen{ transform-box:fill-box; transform-origin:center; animation:tvScreen 16s ease-in-out infinite alternate; }
@keyframes tvScreen{ 0%{ transform:translateY(0); } 100%{ transform:translateY(-5px); } }

/* ================= ДВИЖЕНИЕ ПРИ „ЗА РОДИТЕЛИ“ ================= */
/* двамата се полюляват, сякаш вървят */
.rd-pair{ transform-box:fill-box; transform-origin:50% 100%; animation:rdWalk 7s ease-in-out infinite alternate; }
@keyframes rdWalk{ 0%{ transform:translateX(-10px) rotate(-.6deg); } 100%{ transform:translateX(12px) rotate(.6deg); } }
.rd-child{ transform-box:fill-box; transform-origin:50% 100%; animation:rdSkok 2.6s ease-in-out infinite; }
@keyframes rdSkok{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-6px); } }
/* сърцето бие */
.rd-heart{ transform-box:fill-box; transform-origin:center; animation:rdHeart 2.2s ease-in-out infinite; }
@keyframes rdHeart{ 0%,100%{ transform:scale(1); opacity:.7; } 24%{ transform:scale(1.14); opacity:1; } 40%{ transform:scale(1.02); } }
/* стрелките на часовника се движат */
.rd-hand-m{ transform-box:fill-box; transform-origin:0% 0%; animation:rdMin 12s linear infinite; }
.rd-hand-h{ transform-box:fill-box; transform-origin:50% 100%; animation:rdChas 72s linear infinite; }
@keyframes rdMin{ to{ transform:rotate(360deg); } }
@keyframes rdChas{ to{ transform:rotate(360deg); } }
/* редовете в тетрадката се изписват */
.rd-note path{ stroke-dasharray:120; stroke-dashoffset:120; animation:rdPishe 9s ease-in-out infinite; }
.rd-note path:nth-of-type(2){ animation-delay:.9s; }
.rd-note path:nth-of-type(3){ animation-delay:1.8s; }
@keyframes rdPishe{ 0%{ stroke-dashoffset:120; } 40%,86%{ stroke-dashoffset:0; } 100%{ stroke-dashoffset:120; } }
/* портата леко се отваря */
.rd-gate{ transform-box:fill-box; transform-origin:50% 100%; animation:rdGate 18s ease-in-out infinite alternate; }
@keyframes rdGate{ 0%{ transform:scaleX(1); } 100%{ transform:scaleX(1.012); } }

@media (max-width:760px){
  .scena{ height:180px; }
  .scena-gore{ margin-top:64px; }
}
@media (prefers-reduced-motion:reduce){
  .scena *{ animation:none !important; }
  .rd-note path, .st-wave, .st-mon path[stroke="#2F6F66"]{ stroke-dashoffset:0; }
}

/* ===========================================================================
   44. РЕЧНИК НА ДВИЖЕНИЕТО В СКИЦИТЕ
   Всеки кавър е скица с цветни петна и линии. Частите ѝ носят класове от този
   речник, затова една и съща дума значи едно и също движение навсякъде:
   люлеене, подскок, изчертаване, пулс, бавно въртене, мигане, течение.
   Така кавърите се движат, без да има по един стил за всеки поотделно.
=========================================================================== */

.cover-art *{ transform-box:fill-box; }

.an-sway{ transform-origin:50% 100%; animation:anSway 7s ease-in-out infinite alternate; }
@keyframes anSway{ 0%{ transform:rotate(-1.8deg); } 100%{ transform:rotate(2deg); } }

.an-bob{ transform-origin:50% 100%; animation:anBob 5.5s ease-in-out infinite alternate; }
@keyframes anBob{ 0%{ transform:translateY(0); } 100%{ transform:translateY(-7px); } }

.an-walk{ transform-origin:50% 100%; animation:anWalk 6s ease-in-out infinite alternate; }
@keyframes anWalk{ 0%{ transform:translateX(-16px); } 100%{ transform:translateX(22px); } }

.an-draw{ stroke-dasharray:320; stroke-dashoffset:320; animation:anDraw 9s ease-in-out infinite; }
@keyframes anDraw{ 0%{ stroke-dashoffset:320; } 38%,84%{ stroke-dashoffset:0; } 100%{ stroke-dashoffset:320; } }

.an-pulse{ transform-origin:center; animation:anPulse 2.6s ease-in-out infinite; }
@keyframes anPulse{ 0%,100%{ transform:scale(1); opacity:.75; } 45%{ transform:scale(1.16); opacity:1; } }

.an-spin-slow{ transform-origin:center; animation:anSpin 60s linear infinite; }
@keyframes anSpin{ to{ transform:rotate(360deg); } }

.an-blink{ animation:anBlink 2.4s steps(1,end) infinite; }
@keyframes anBlink{ 0%,55%{ opacity:1; } 56%,100%{ opacity:.14; } }

.an-flow{ stroke-dasharray:56 16; animation:anFlow 4s linear infinite; }
@keyframes anFlow{ to{ stroke-dashoffset:-144; } }

.an-rise{ transform-origin:50% 100%; animation:anRise 12s ease-in-out infinite alternate; }
@keyframes anRise{ 0%{ transform:translateY(6px); opacity:.8; } 100%{ transform:translateY(-4px); opacity:1; } }

.an-sun{ transform-origin:center; animation:anSun 9s ease-in-out infinite alternate; }
@keyframes anSun{ 0%{ transform:translateY(10px) scale(.96); } 100%{ transform:translateY(-6px) scale(1.04); } }

.an-hand-m{ transform-origin:0% 0%; animation:anSpin 12s linear infinite; }
.an-hand-h{ transform-origin:50% 100%; animation:anSpin 72s linear infinite; }
.an-needle{ transform-origin:50% 100%; animation:anNeedle 14s ease-in-out infinite alternate; }
@keyframes anNeedle{ 0%{ transform:rotate(-16deg); } 100%{ transform:rotate(22deg); } }

.an-beam{ transform-origin:top center; animation:anBeam 6s ease-in-out infinite alternate; }
@keyframes anBeam{ 0%{ transform:rotate(-3deg); opacity:.7; } 100%{ transform:rotate(3deg); opacity:1; } }

.an-pan{ transform-origin:70% 60%; animation:anPan 13s ease-in-out infinite alternate; }
@keyframes anPan{ 0%{ transform:rotate(-2.4deg); } 100%{ transform:rotate(2.6deg); } }

.an-glow{ animation:anGlow 4.4s ease-in-out infinite alternate; }
@keyframes anGlow{ 0%{ opacity:.78; } 100%{ opacity:1; } }
.an-rays{ transform-origin:50% 120%; animation:anRays 4.4s ease-in-out infinite alternate; }
@keyframes anRays{ 0%{ transform:scale(.9); opacity:.5; } 100%{ transform:scale(1.08); opacity:1; } }

.an-shuffle > g:nth-child(1){ animation:anShuffle 8s ease-in-out infinite alternate; }
.an-shuffle > g:nth-child(2){ animation:anShuffle 8s ease-in-out infinite alternate .5s; }
.an-shuffle > g:nth-child(3){ animation:anShuffle 8s ease-in-out infinite alternate 1s; }
@keyframes anShuffle{ 0%{ transform:translateY(0) rotate(0); } 100%{ transform:translateY(-6px) rotate(-1deg); } }

.an-stamp{ transform-origin:center; animation:anStamp 6s ease-in-out infinite; }
@keyframes anStamp{ 0%,70%,100%{ transform:scale(1) rotate(0); } 78%{ transform:scale(.9) rotate(-4deg); } 86%{ transform:scale(1.04) rotate(2deg); } }

.an-ball{ transform-origin:50% 100%; animation:anBall 3.2s cubic-bezier(.3,0,.7,1) infinite; }
@keyframes anBall{ 0%,100%{ transform:translateY(0) scaleY(1); } 42%{ transform:translateY(-40px) scaleY(1.04); } 50%{ transform:translateY(-40px); } 96%{ transform:translateY(0) scaleY(.92); } }

.an-tree{ transform-origin:50% 100%; animation:anTree 8s ease-in-out infinite alternate; }
@keyframes anTree{ 0%{ transform:rotate(-1.2deg) scale(1); } 100%{ transform:rotate(1.4deg) scale(1.02); } }

.an-mic{ transform-origin:50% 100%; animation:anBob 4.6s ease-in-out infinite alternate; }
.an-flash{ animation:anFlash 5s steps(1,end) infinite; }
@keyframes anFlash{ 0%,86%{ opacity:.55; } 88%{ opacity:1; } 92%{ opacity:.4; } 94%{ opacity:1; } 96%,100%{ opacity:.55; } }

.an-pencil{ transform-origin:0% 100%; animation:anPencil 7s ease-in-out infinite alternate; }
@keyframes anPencil{ 0%{ transform:translate(0,0) rotate(0); } 100%{ transform:translate(-14px,10px) rotate(-2deg); } }

.an-ribbon{ transform-origin:50% 0%; animation:anSway 4s ease-in-out infinite alternate; }
.an-route{ stroke-dasharray:14 12; animation:anFlow 9s linear infinite; }
.an-plane{ offset-path:none; animation:anPlane 14s ease-in-out infinite alternate; }
@keyframes anPlane{
  0%   { transform:translate(140px, 196px) rotate(-16deg); }
  50%  { transform:translate(680px, 138px) rotate(-6deg); }
  100% { transform:translate(1090px, 98px) rotate(-10deg); }
}
.an-steps rect{ animation:anBob 6s ease-in-out infinite alternate; }
.an-steps rect:nth-child(2){ animation-delay:.3s; }
.an-steps rect:nth-child(3){ animation-delay:.6s; }
.an-steps rect:nth-child(4){ animation-delay:.9s; }
.an-clock{ transform-origin:center; animation:anBob 7s ease-in-out infinite alternate; }

@media (prefers-reduced-motion:reduce){
  .cover-art *{ animation:none !important; }
  .an-draw, .an-flow, .an-route{ stroke-dashoffset:0 !important; }
}

/* ===========================================================================
   45. ЧАСОВЕ НА УЧЕБНИЯ ДЕН
   Дневното разписание е най-търсеното нещо в първите седмици. Затова часовете
   стоят направо в страницата, в три колони по етапи, а не само като файл за
   сваляне. Голямото междучасие е обозначено, защото между третия и четвъртия
   час има 35 минути и това всеки родител го пита.
=========================================================================== */

.zv-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(100%,240px), 1fr));
  gap:clamp(16px,2.4vw,30px);
}
.zv-col{
  padding:18px 20px 20px;
  border-radius:14px;
  background:linear-gradient(170deg, #fff 0%, color-mix(in srgb, var(--brick-bg) 40%, #fff) 100%);
  border:1px solid var(--line);
}
.zv-head{
  margin-bottom:12px; padding-bottom:10px;
  border-bottom:1px solid color-mix(in srgb, var(--brick) 20%, transparent);
  font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800;
  letter-spacing:.16em; text-transform:uppercase; color:var(--brick);
}
.zv-row{
  display:flex; align-items:baseline; gap:10px;
  padding:6px 0;
  font-family:'Manrope',sans-serif; font-size:13.5px; color:var(--ink-soft);
}
.zv-row b{
  flex:0 0 22px;
  font-family:'Fraunces',serif; font-style:italic; font-weight:400;
  font-size:16px; color:var(--brick);
}
.zv-pauza{
  margin:4px 0;
  font-size:11.5px; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:var(--muted);
}
.zv-pauza span{ border-top:1px dashed var(--line-2); padding-top:8px; width:100%; }

/* ===========================================================================
   46. ГРАФИЦИ В ТАБЛИЦА
   Графиците на консултациите, втория час на класа и приемното време са дълги
   списъци с учители. Като файл за сваляне са безполезни на телефон, затова
   стоят направо в страницата като таблица — и файлът остава за тези, които го
   искат. На тесен екран таблицата се плъзга хоризонтално сама.
=========================================================================== */

.gr-opis{
  margin:0 0 16px; max-width:70ch;
  font-family:'Manrope',sans-serif; font-size:13.5px; line-height:1.7;
  color:var(--ink-soft);
}
.gr-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.gr-tabl{
  width:100%; min-width:520px;
  border-collapse:collapse;
  font-family:'Manrope',sans-serif; font-size:13.5px;
}
.gr-tabl th{
  text-align:left; padding:10px 14px;
  border-bottom:1.5px solid color-mix(in srgb, var(--brick) 30%, transparent);
  font-size:10.5px; font-weight:800; letter-spacing:.14em;
  text-transform:uppercase; color:var(--brick);
  white-space:nowrap;
}
.gr-tabl td{
  padding:11px 14px;
  border-bottom:1px solid var(--line);
  color:var(--ink-soft);
  vertical-align:top;
}
.gr-tabl tbody tr:hover td{ background:color-mix(in srgb, var(--brick-bg) 40%, transparent); }
.gr-ime{ font-weight:700; color:var(--ink); white-space:nowrap; }
.gr-chas{ font-variant-numeric:tabular-nums; white-space:nowrap; color:var(--brick-deep); }
.gr-kab{ color:var(--muted); }

@media (max-width:640px){
  .gr-tabl{ font-size:12.5px; min-width:480px; }
  .gr-tabl th, .gr-tabl td{ padding:9px 10px; }
}

/* ===========================================================================
   47. КАВЪРИТЕ НА ТЕЛЕФОН
   Рисунките са в пропорция 5.33:1, а мястото на кавъра на телефон е около
   1.4:1. При запълване (slice) се показва само тясна ивица от средата — оттам
   идваше усещането, че кавърите не се зареждат: виждаше се едно уголемено
   парче без смисъл.

   На телефон рисунката се СВИВА ЦЯЛА (meet, задава се от JS), а фонът ѝ се
   скрива, защото не запълва цялата височина. Вместо него цветът идва от самия
   кавър — градиент по палитрата на раздела, който важи автоматично за всички.
=========================================================================== */

.ed-cover.has-art{
  background:linear-gradient(140deg,
    color-mix(in srgb, var(--brick-bg) 86%, #fff) 0%,
    color-mix(in srgb, var(--brick-bg) 54%, var(--cream)) 58%,
    color-mix(in srgb, var(--brick-bg) 72%, #fff) 100%) !important;
}

@media (max-width:760px){
  /* кавърът става по-нисък — рисунката така изглежда по-голяма */
  .ed-cover{ height:208px; }
  /* фоновият правоъгълник на рисунката се скрива: при свиване той не покрива
     цялата площ и се получава лента с друг цвят */
  .cover-art .scene-bg, .scena .scene-bg{ display:none; }
  /* сцените на Алеко ТВ също се свиват цели */
  .scena{ height:150px; }
}

/* ===========================================================================
   48. ОТБЕЛЯЗАНО ВАЖНО
   Неучебните дни са това, което родителят търси в графика, затова не стоят в
   общия текст, а в отделен блок с тухлен гръбнак и удебелени дати.
=========================================================================== */

.vazhno{
  display:block;
  margin:14px 0 4px;
  padding:14px 18px;
  border-left:3px solid var(--brick);
  border-radius:0 10px 10px 0;
  background:linear-gradient(90deg,
    color-mix(in srgb, var(--brick-bg) 70%, transparent) 0%,
    transparent 92%);
  font-family:'Manrope',sans-serif;
  font-size:13px; line-height:1.7; color:var(--ink-soft);
}
.vazhno > b{
  display:block; margin-bottom:10px;
  font-size:10.5px; font-weight:800; letter-spacing:.16em;
  text-transform:uppercase; color:var(--brick);
}
.vazhno-dni{
  display:flex; flex-direction:column; gap:7px;
  margin-bottom:12px;
}
.vazhno-dni > span{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:8px;
  padding-bottom:7px;
  border-bottom:1px solid color-mix(in srgb, var(--brick) 14%, transparent);
}
.vazhno-dni > span:last-child{ border-bottom:0; padding-bottom:0; }
.vazhno-dni b{
  font-family:'Fraunces',serif; font-style:italic; font-weight:400;
  font-size:16px; color:var(--brick-deep);
}

/* екскурзии: показва се само текущият месец */
.ek-red[hidden]{ display:none !important; }
.ek-bel{
  margin:14px 0 0; padding-top:12px;
  border-top:1px solid var(--line);
  font-family:'Manrope',sans-serif; font-size:12.5px; line-height:1.7;
  color:var(--muted);
}
.ek-prazno{
  margin:0; font-family:'Manrope',sans-serif; font-size:13.5px;
  line-height:1.7; color:var(--ink-soft);
}

/* подзаглавие и списък в статия */
.ar-pod{
  margin:34px 0 14px;
  font-family:'Fraunces',serif; font-weight:400;
  font-size:clamp(19px,2.1vw,25px); color:var(--ink);
}
.ar-spisak{ margin:0; padding:0; list-style:none; }
.ar-spisak li{
  position:relative;
  padding:11px 0 11px 26px;
  border-top:1px solid var(--line);
  font-family:'Manrope',sans-serif; font-size:14.5px; line-height:1.7;
  color:var(--ink-soft);
}
.ar-spisak li:last-child{ border-bottom:1px solid var(--line); }
.ar-spisak li::before{
  content:''; position:absolute; left:4px; top:21px;
  width:7px; height:7px; border-radius:50%;
  background:var(--brick);
}
.ar-prazno{
  margin:0; padding:26px 0;
  border-top:1px solid var(--line);
  text-align:center;
  font-family:'Manrope',sans-serif; font-size:13.5px; color:var(--muted);
}

/* ===========================================================================
   50. ГОДИНИТЕ СЕ УГОЛЕМЯВАТ ЕДНА СЛЕД ДРУГА
   Хронологията минава като поредица: годината се приближава леко, застоява се
   и отстъпва, а следващата поема. Стъпката е същата като на редовете, затова
   движението върви с появата им, а не отделно от нея.
=========================================================================== */

.ed-hl-year{
  display:inline-block;
  transform-origin:left center;
  will-change:transform;
}
.ed-hl-item.in .ed-hl-year{ animation:godinaFokus 4.6s cubic-bezier(.3,0,.3,1) both; }
.ed-hl-item:nth-of-type(1).in .ed-hl-year{ animation-delay:.2s; }
.ed-hl-item:nth-of-type(2).in .ed-hl-year{ animation-delay:.9s; }
.ed-hl-item:nth-of-type(3).in .ed-hl-year{ animation-delay:1.6s; }
.ed-hl-item:nth-of-type(4).in .ed-hl-year{ animation-delay:2.3s; }
@keyframes godinaFokus{
  0%   { transform:scale(1);    color:var(--brick); }
  14%  { transform:scale(1.16); color:var(--brick-deep); }
  46%  { transform:scale(1.16); color:var(--brick-deep); }
  100% { transform:scale(1);    color:var(--brick); }
}


@media (prefers-reduced-motion:reduce){
  .ed-hl-item.in .ed-hl-year{ animation:none; }
}


/* ===========================================================================
   49. ПРИЗРАКЪТ В ХРОНОЛОГИЯТА
   Един-единствен призрак за цялата хронология, а не по един на всяка година.
   Появява се ту при една дата, ту при друга, на случаен принцип, сменя портрета
   и изчезва. Никога не се виждат два наведнъж — така е и по-призрачно, и по-
   спокойно за окото.

   Движението и местата се задават от скрипта; тук е само видът: сиво, меко,
   с лек наклон и бавно плаване, докато е на екрана.
=========================================================================== */

.ed-history-hline{ position:relative; }
.hl-duh{
  position:absolute;
  left:0; top:0;
  width:clamp(104px,12vw,164px);
  height:clamp(128px,15vw,196px);
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
  filter:grayscale(1) contrast(1.06);
  opacity:0;
  pointer-events:none;
  z-index:0;
  transition:opacity 1.6s ease-in-out, transform 3.4s cubic-bezier(.25,.6,.3,1);
  will-change:opacity, transform;
}
.hl-duh.tuk{ opacity:.42; }
/* съдържанието на редовете стои над него */
.ed-hl-item{ position:relative; z-index:1; }

@media (max-width:860px){
  .hl-duh{ width:96px; height:120px; }
  .hl-duh.tuk{ opacity:.26; }
}
@media (prefers-reduced-motion:reduce){
  .hl-duh{ transition:opacity 1s ease; }
}

/* ===========================================================================
   51. НАЙ-СКОРОШНОТО СЪБИТИЕ
   Между заглавния кадър и историята остана въздух. Там стои картонче с
   най-новото събитие — закачено с кабарче, леко килнато, като бележка на
   дъска. Съдържанието идва от sadarzhanie.js, тоест не се пише втори път.

   Картончето е леко наклонено и се изправя при посочване; кабарчето хвърля
   своя сянка. Датата е изнесена отляво в едър шрифт — тя е първото, което
   родителят търси.
=========================================================================== */

.sabitie{
  position:relative;
  padding:clamp(34px,5vh,64px) 0 clamp(10px,2vh,24px);
}
.sab-wrap{ display:flex; justify-content:center; }

.sab-kart{
  position:relative;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:clamp(18px,3vw,38px);
  width:min(980px, 100%);
  padding:clamp(20px,2.6vw,30px) clamp(22px,3vw,36px);
  border-radius:16px;
  background:linear-gradient(168deg, #fff 0%, color-mix(in srgb, var(--brick-bg) 46%, #fff) 100%);
  border:1px solid var(--line);
  box-shadow:0 30px 60px -34px rgba(36,30,25,.42);
  transform:rotate(-.7deg);
  transition:transform .5s cubic-bezier(.16,.8,.3,1), box-shadow .5s ease;
}
.sab-kart:hover{
  transform:rotate(0deg) translateY(-3px);
  box-shadow:0 38px 70px -34px rgba(36,30,25,.5);
}
/* кабарчето */
.sab-pin{
  position:absolute; left:50%; top:-11px;
  width:22px; height:22px; border-radius:50%;
  transform:translateX(-50%);
  background:radial-gradient(circle at 34% 30%, #E07A5F, var(--brick) 60%, var(--brick-deep));
  box-shadow:0 6px 12px -4px rgba(36,30,25,.5), inset 0 -2px 4px rgba(0,0,0,.25);
}
.sab-pin::after{
  content:''; position:absolute; left:50%; top:16px;
  width:2px; height:10px; transform:translateX(-50%);
  background:linear-gradient(180deg, rgba(36,30,25,.35), transparent);
}

/* датата */
.sab-data{
  display:flex; flex-direction:column; align-items:center;
  padding-right:clamp(16px,2vw,26px);
  border-right:1px solid var(--line);
  min-width:78px;
}
.sab-den{
  font-family:'Fraunces',serif; font-style:italic; font-weight:400;
  font-size:clamp(34px,4.4vw,52px); line-height:.9; color:var(--brick);
}
.sab-mes{
  margin-top:6px;
  font-family:'Manrope',sans-serif; font-style:normal;
  font-size:10.5px; font-weight:800; letter-spacing:.16em;
  text-transform:uppercase; color:var(--muted);
}

.sab-kicker{
  font-family:'Manrope',sans-serif; font-size:10px; font-weight:800;
  letter-spacing:.18em; text-transform:uppercase; color:var(--brick);
  margin-bottom:8px;
}
.sab-zagl{
  margin:0 0 8px;
  font-family:'Fraunces',serif; font-weight:400;
  font-size:clamp(19px,2.2vw,27px); line-height:1.2; color:var(--ink);
}
.sab-uvod{
  margin:0 0 12px; max-width:62ch;
  font-family:'Manrope',sans-serif; font-size:14px; line-height:1.7;
  color:var(--ink-soft);
}
.sab-cta{
  font-family:'Manrope',sans-serif; font-size:12px; font-weight:800;
  letter-spacing:.1em; text-transform:uppercase; color:var(--brick);
  border-bottom:1.5px solid var(--brick-bg); padding-bottom:3px;
  transition:border-color .3s ease;
}
.sab-cta:hover{ border-bottom-color:var(--brick); }

.sab-snimka{
  width:clamp(92px,11vw,140px);
  aspect-ratio:1/1;
  border-radius:12px;
  background-size:cover; background-position:center;
  box-shadow:0 16px 30px -18px rgba(36,30,25,.5);
  transform:rotate(1.6deg);
  transition:transform .5s cubic-bezier(.16,.8,.3,1);
}
.sab-kart:hover .sab-snimka{ transform:rotate(0deg) scale(1.03); }

@media (max-width:760px){
  .sab-kart{
    grid-template-columns:auto 1fr;
    gap:14px 16px;
    transform:rotate(-.5deg);
  }
  .sab-snimka{ grid-column:1 / -1; width:100%; aspect-ratio:16/9; transform:none; }
  .sab-uvod{ font-size:13.5px; }
}
@media (prefers-reduced-motion:reduce){
  .sab-kart, .sab-snimka{ transition:none; }
}

/* ===========================================================================
   52. АЛЕКОЗНАЙКО — БЮРОТО НА МАЛКИЯ ИЗСЛЕДОВАТЕЛ
   Страницата на помощника получава своя сцена: бюро с отворена тетрадка, лупа,
   която обикаля над нея, крушка с лъчи и три балона с въпроси, които изникват
   един след друг — както в истински разговор.

   Движението ползва общия речник (секция 44) и добавя две свои думи: обикалящa
   лупа и балони, които се появяват последователно и се задържат.
=========================================================================== */

.znaiko-scena{ height:clamp(220px,26vw,360px); }

/* лупата обикаля над тетрадката и се приближава */
.an-lupa{
  transform-box:fill-box; transform-origin:center;
  animation:znLupa 11s ease-in-out infinite;
}
@keyframes znLupa{
  0%   { transform:translate(0,0) scale(1); }
  25%  { transform:translate(-90px,26px) scale(1.06); }
  50%  { transform:translate(-30px,52px) scale(1); }
  75%  { transform:translate(60px,20px) scale(1.04); }
  100% { transform:translate(0,0) scale(1); }
}

/* балоните с въпроси: изникват един след друг и остават, после се сменят */
.bal{ transform-box:fill-box; transform-origin:0% 100%; opacity:0; }
.bal-1{ animation:znBalon 13s ease-in-out infinite 0s; }
.bal-2{ animation:znBalon 13s ease-in-out infinite 3.4s; }
.bal-3{ animation:znBalon 13s ease-in-out infinite 6.8s; }
@keyframes znBalon{
  0%   { opacity:0; transform:scale(.86) translateY(10px); }
  6%   { opacity:1; transform:scale(1) translateY(0); }
  26%  { opacity:1; transform:scale(1) translateY(-3px); }
  33%  { opacity:0; transform:scale(.96) translateY(-12px); }
  100% { opacity:0; }
}

/* въпросителните плуват нагоре-надолу, всяка със свой ритъм */
.an-pitanki text{ transform-box:fill-box; transform-origin:center; }
.an-pitanki text:nth-child(1){ animation:znPluva 6s ease-in-out infinite alternate; }
.an-pitanki text:nth-child(2){ animation:znPluva 7.4s ease-in-out infinite alternate .8s; }
.an-pitanki text:nth-child(3){ animation:znPluva 5.6s ease-in-out infinite alternate 1.6s; }
@keyframes znPluva{
  0%   { transform:translateY(0) rotate(-3deg); opacity:.5; }
  100% { transform:translateY(-14px) rotate(4deg); opacity:.85; }
}

@media (prefers-reduced-motion:reduce){
  .an-lupa, .bal, .an-pitanki text{ animation:none; }
  .bal-1{ opacity:1; }
}

/* ===========================================================================
   53. АЛЕКОЗНАЙКО — СТРАНИЦАТА КАТО РАЗГОВОР
   Страницата на чат-помощника се чете като чат: въпросите отдясно, отговорите
   отляво, видеата прикачени в репликите. Формата съвпада със съдържанието —
   това е и разликата от обикновен списък с видеа.

   Репликите се появяват при скролване, а преди всеки отговор за миг светват
   трите точки „пиша“ — детайлът, който прави разговора жив.
=========================================================================== */

.razgovor{ max-width:820px; padding-bottom:clamp(30px,5vh,60px); }

.rz-red{
  display:flex; align-items:flex-end; gap:12px;
  margin:0 0 clamp(14px,2.2vh,22px);
}
.rz-red.rz-az{ justify-content:flex-end; }

.rz-mehur{
  position:relative;
  max-width:min(560px, 86%);
  padding:14px 18px;
  border-radius:18px;
  font-family:'Manrope',sans-serif; font-size:14.5px; line-height:1.68;
}
/* въпросите на децата */
.rz-az .rz-mehur{
  background:linear-gradient(160deg, var(--brick) 0%, var(--brick-deep) 100%);
  color:#FFF6EC;
  border-bottom-right-radius:6px;
  box-shadow:0 14px 28px -16px rgba(124,58,41,.6);
}
/* отговорите на Алекознайко */
.rz-ot .rz-mehur{
  background:#fff;
  color:var(--ink-soft);
  border:1px solid var(--line);
  border-bottom-left-radius:6px;
  box-shadow:0 16px 34px -22px rgba(36,30,25,.4);
}
.rz-tekst{ display:block; }

/* личицето до отговорите */
.rz-lice{
  flex:0 0 auto;
  width:42px; height:42px; border-radius:50%;
  overflow:hidden;
  background:var(--brick-bg);
  border:2px solid #fff;
  box-shadow:0 8px 18px -10px rgba(36,30,25,.5);
}
.rz-lice img{ width:100%; height:100%; object-fit:cover; display:block; }

/* трите точки „пиша“ — светват за миг преди текста */
.rz-pisha{
  display:flex; gap:5px; align-items:center;
  height:16px; margin-bottom:8px;
}
.rz-pisha i{
  width:6px; height:6px; border-radius:50%;
  background:var(--brick); opacity:.35;
  animation:rzTochka 1.2s ease-in-out infinite;
}
.rz-pisha i:nth-child(2){ animation-delay:.16s; }
.rz-pisha i:nth-child(3){ animation-delay:.32s; }
@keyframes rzTochka{
  0%,100%{ transform:translateY(0); opacity:.3; }
  40%    { transform:translateY(-4px); opacity:.9; }
}
/* щом репликата е дошла, точките си отиват */
.rz-red.in .rz-pisha{ animation:rzKrai .4s ease forwards 1.1s; }
@keyframes rzKrai{ to{ opacity:0; height:0; margin:0; } }
/* а текстът идва след тях */
.rz-red.rz-ot.in .rz-tekst,
.rz-red.rz-ot.in .rz-video,
.rz-red.rz-ot.in .rz-cta{ animation:rzTekst .5s ease both 1.2s; }
@keyframes rzTekst{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
.rz-red.rz-ot .rz-tekst,
.rz-red.rz-ot .rz-video,
.rz-red.rz-ot .rz-cta{ opacity:0; }

/* прикаченото видео вътре в репликата */
.rz-video{
  margin-top:12px;
  border-radius:12px; overflow:hidden;
  background:#000;
  box-shadow:0 14px 30px -18px rgba(36,30,25,.55);
}
.rz-video video{ width:100%; display:block; aspect-ratio:16/9; object-fit:cover; background:#000; }
.rz-etiket{
  display:block; padding:9px 12px;
  background:color-mix(in srgb, var(--brick-bg) 60%, #fff);
  font-size:11.5px; font-weight:800; letter-spacing:.08em;
  text-transform:uppercase; color:var(--brick-deep);
}

.rz-cta{
  display:inline-block; margin-top:12px;
  padding:11px 20px; border:0; border-radius:999px; cursor:pointer;
  background:var(--brick); color:#fff;
  font-family:'Manrope',sans-serif; font-size:12.5px; font-weight:800;
  letter-spacing:.08em;
  transition:transform .3s ease, box-shadow .3s ease, background .3s ease;
}
.rz-cta:hover{
  background:var(--brick-deep);
  transform:translateY(-2px);
  box-shadow:0 14px 26px -14px rgba(124,58,41,.7);
}

@media (max-width:640px){
  .rz-mehur{ max-width:92%; font-size:14px; padding:12px 15px; }
  .rz-lice{ width:34px; height:34px; }
}
@media (prefers-reduced-motion:reduce){
  .rz-pisha{ display:none; }
  .rz-red.rz-ot .rz-tekst, .rz-red.rz-ot .rz-video, .rz-red.rz-ot .rz-cta{ opacity:1; animation:none; }
}

/* ===========================================================================
   54. СТЕНА ОТ МОНИТОРИ (Алеко ТВ)
   Големият банер се биеше със скицата на студиото — беше в друг мащаб и друг
   език. Сега същата картинка е вътре в три малки телевизора, всеки показва
   своя трета от нея. Така банерът се превръща в част от студиото, вместо да
   стои над него.

   Средният е малко по-голям и с лампичка „на ефир“. По екраните минават
   сканиращи линии и бавен отблясък, както по истинско стъкло.
=========================================================================== */

.tv-stena{
  display:flex; align-items:flex-end; justify-content:center;
  gap:clamp(12px,2vw,26px);
  margin:clamp(6px,1.4vh,16px) auto clamp(18px,3vh,34px);
  padding:0 clamp(14px,3vw,30px);
  max-width:1100px;
}

.tv-set{
  position:relative;
  flex:1 1 0;
  max-width:340px;
  padding:12px 12px 20px;
  border-radius:16px;
  background:linear-gradient(168deg, #F3E3D6 0%, color-mix(in srgb, var(--brick-bg) 80%, #E8D5C6) 100%);
  border:1px solid rgba(124,58,41,.22);
  box-shadow:0 22px 44px -26px rgba(36,30,25,.55), inset 0 1px 0 rgba(255,255,255,.7);
  transform:rotate(-1deg);
  transition:transform .45s cubic-bezier(.16,.8,.3,1), box-shadow .45s ease;
}
.tv-set:nth-child(2){ transform:rotate(0deg) translateY(-14px); z-index:2; max-width:420px; }
.tv-set:nth-child(3){ transform:rotate(1.2deg); }
.tv-set:hover{ transform:rotate(0deg) translateY(-6px); box-shadow:0 30px 56px -26px rgba(36,30,25,.6); }

.tv-ekran{
  position:relative;
  aspect-ratio:5/4;
  border-radius:10px;
  /* Височината следва ширината (auto), затова картинката НЕ се разтяга.
     При 300% ширина всеки екран показва по една трета от кадъра, а излишната
     височина просто се изрязва — както е и при истински екран. */
  background-size:300% auto;
  background-repeat:no-repeat;
  box-shadow:inset 0 0 0 2px rgba(36,30,25,.35), inset 0 10px 24px -14px rgba(0,0,0,.6);
  overflow:hidden;
}
.tv-1 .tv-ekran{ background-position:left center; }
.tv-2 .tv-ekran{ background-position:center center; }
.tv-3 .tv-ekran{ background-position:right center; }

/* сканиращи линии и отблясък по стъклото */
.tv-ekran::before{
  content:''; position:absolute; inset:0;
  background:repeating-linear-gradient(0deg, rgba(0,0,0,.14) 0 1px, transparent 1px 3px);
  opacity:.5;
}
.tv-ekran::after{
  content:''; position:absolute; top:-40%; bottom:-40%; left:-60%; width:40%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.28) 50%, transparent);
  transform:skewX(-14deg);
  animation:tvOtblqsak 9s ease-in-out infinite;
}
@keyframes tvOtblqsak{ 0%{ left:-60%; } 55%{ left:120%; } 100%{ left:120%; } }

/* копчетата под екрана */
.tv-kopcheta{
  position:absolute; left:16px; bottom:6px;
  display:flex; gap:7px;
}
.tv-kopcheta i{
  width:8px; height:8px; border-radius:50%;
  background:rgba(36,30,25,.3);
  box-shadow:inset 0 -1px 2px rgba(0,0,0,.35);
}
/* лампичката на средния */
.tv-lampa{
  position:absolute; right:16px; bottom:5px;
  width:9px; height:9px; border-radius:50%;
  background:#FF6B57;
  box-shadow:0 0 10px 2px rgba(255,107,87,.7);
  animation:tvLampa 2.4s steps(1,end) infinite;
}
@keyframes tvLampa{ 0%,55%{ opacity:1; } 56%,100%{ opacity:.25; } }

@media (max-width:760px){
  /* на телефон остава само средният — трите един до друг стават нечетими */
  .tv-stena{ gap:0; }
  .tv-1, .tv-3{ display:none; }
  .tv-set:nth-child(2){ transform:none; max-width:100%; }
}
@media (prefers-reduced-motion:reduce){
  .tv-ekran::after, .tv-lampa{ animation:none; }
  .tv-lampa{ opacity:1; }
}

/* ===========================================================================
   55. ЗАВЕСАТА — ИЗПЛУВАНЕ НА ВСЯКА ДУМА
   Досега всяка дума изплуваше за 0.6 секунди. Проблемът не беше в паузата
   между думите, а в самото появяване: то е рязко и окото не успява да я хване,
   докато следващата вече светва.

   Тук изплуването е удвоено, с по-меко забавяне в края, и думата тръгва от
   по-далеч — така движението се усеща и се проследява, вместо да мигне.
=========================================================================== */

.cw-frag{
  transform:translateY(46px) scale(.86);
  filter:blur(9px);
  transition:
    opacity 2.1s cubic-bezier(.18,.72,.24,1),
    transform 2.3s cubic-bezier(.18,.72,.24,1),
    filter 1.9s ease-out;
}
.cw-frag.lit{ transform:none; filter:blur(0); }

/* излизането остава по-бързо — там няма какво да се чете */
.cw-frag.gone{ transition-duration:.6s; filter:blur(4px); }

/* ===========================================================================
   56. ЗАВЕСАТА — МАСТИЛО ВЪРХУ ХАРТИЯ
   Завесата вече не е тъмен екран с думи, а лист хартия, върху който се изписва
   изречението. Листът е от две половини, които накрая се разтварят настрани и
   показват сайта.

   Три неща, които бяха сгрешени по пътя и са решени тук:
   1. Нито една дума не стъпва на шева. Думите вляво са закотвени ОТ ШЕВА и
      растат наляво, тези вдясно — обратното. Затова колкото и дълга да е дума,
      не се разполовява при отварянето.
   2. „Добре дошли“ изчезва НАПЪЛНО, преди листът да тръгне. Анимацията, която
      го е изписала, се отменя изрично — иначе тя го държи видим и надписът
      остава върху отворената страница.
   3. Хартията е истинска: зърно, влакна и топла светлина, а не сив фон.
=========================================================================== */

.ed-curtain{ background:none; }

/* двете половини хартия */
.ed-hartia{
  position:absolute; top:0; bottom:0; width:50.4%;
  overflow:hidden; z-index:1;
  transition:transform 1.4s cubic-bezier(.76,0,.24,1);
}
.ed-hartia.l{ left:0; }
.ed-hartia.d{ right:0; }
.ed-hartia i{
  position:absolute; inset:0;
  background:
    radial-gradient(90% 70% at 22% 6%, rgba(255,250,240,.96), transparent 62%),
    linear-gradient(168deg, #FDF8EE 0%, #F4E9D7 52%, #EADCC6 100%);
}
.ed-hartia i::before,
.ed-hartia i::after{ content:''; position:absolute; inset:0; mix-blend-mode:multiply; }
.ed-hartia i::before{ filter:url(#zurno); opacity:.3; }
.ed-hartia i::after{ filter:url(#vlakna); opacity:.22; }
.ed-hartia.l i{ box-shadow:inset -26px 0 40px -26px rgba(92,66,44,.5); }
.ed-hartia.d i{ box-shadow:inset 26px 0 40px -26px rgba(92,66,44,.5); }

.ed-shev{
  position:absolute; left:50%; top:0; bottom:0; width:1px; z-index:2;
  background:linear-gradient(180deg, transparent, rgba(92,66,44,.18) 12%, rgba(92,66,44,.18) 88%, transparent);
}

/* мастилото */
.ed-curtain .cw-frag{
  font-family:'Marck Script', cursive;
  font-style:normal;
  color:#2B2119;
  z-index:3;
  filter:blur(15px) contrast(2.4);
  transform:scale(1.14);
  transition:
    opacity 2.1s cubic-bezier(.2,.72,.24,1),
    transform 2.2s cubic-bezier(.2,.72,.24,1),
    filter 1.9s ease-out;
}
.ed-curtain .cw-frag:nth-of-type(even){ color:#7C3A29; }
.ed-curtain .cw-frag:nth-of-type(5n){ color:#3F5A47; }
.ed-curtain .cw-frag.lit{ transform:none; filter:blur(0) contrast(1); }
/* попиването: мастилото потъва в листа */
.ed-curtain .cw-frag.gone{
  opacity:0; filter:blur(12px); transform:scale(.95);
  transition-duration:.9s;
}

/* „Добре дошли“ */
.ed-curtain .cw-frag.big{
  font-family:'Marck Script', cursive;
  /* Размерът се задава ТУК. При пренаписването на разметката той отпадна и
     надписът остана с обикновения шрифт на страницата — тоест дребен. */
  font-size:clamp(46px, 9.5vw, 120px);
  line-height:1.05;
  color:#7C3A29;
  z-index:4;
  top:50% !important; left:50% !important;
  transform:translate(-50%,-50%) scale(1.2);
  filter:blur(22px);
  transition:opacity 1.5s ease, transform 1.5s cubic-bezier(.2,.7,.2,1), filter 1.4s ease;
}
.ed-curtain .cw-frag.big.lit{ transform:translate(-50%,-50%) scale(1); filter:blur(0); }
/* изчезва НАПЪЛНО, преди листът да тръгне */
.ed-curtain .cw-frag.big.gone{
  opacity:0 !important;
  filter:blur(14px);
  transform:translate(-50%,-50%) scale(.96);
  transition-duration:.7s;
}

/* разтварянето */
.ed-curtain.open .ed-hartia.l{ transform:translateX(-101%); }
.ed-curtain.open .ed-hartia.d{ transform:translateX(101%); }
.ed-curtain.open .ed-shev{ opacity:0; transition:opacity .3s; }
.ed-curtain.open .cw-frag.big{ opacity:0 !important; }

@media (max-width:640px){
  .ed-curtain .cw-frag{ font-size:clamp(17px,4.6vw,30px) !important; }
  .ed-curtain .cw-frag.big{ font-size:clamp(38px,11vw,64px) !important; }
}

/* картата на Алекознайко носи сцената му: тя е рисунка, не снимка — затова се
   показва цяла, върху топъл фон, вместо да се изрязва */
.rb-znaiko .rb-img{
  background-size:cover;
  background-position:center 40%;
  background-color:#F7EAD2;
}


/* ===========================================================================
   57. РИСУНКИ ЗА ПЛОЧКИТЕ В „УЧИЛИЩЕТО ОТБЛИЗО“

   Шест рисунки в пропорцията на плочката (4:3). Правилото е писано така, че
   да оцелее при три обичайни спъвания:
     1) кой файл на коя плочка се казва ТУК, в стила, а не само в разметката —
        ако някой ден инлайн стилът на картата отпадне, рисунката остава;
     2) няма color-mix() — старите браузъри го изхвърлят заедно с цялото
        правило и плочката оставаше без рисунка. Светлият тон вече е готов цвят
        (--tint), не се смята в движение;
     3) селекторът е с раздела отпред (.ed-programs ...), значи е по-силен от
        цветовете със съкратеното background по-горе, които иначе изтриват
        картинката.
=========================================================================== */

/* Лентата върти дванайсет карти: шестте оригинала и копията им в същия ред,
   затова цикълът 6n+N улучва еднакво и двете групи. */
.ed-programs .ed-prog-card:nth-of-type(6n+1){ --plocha:url("art/plochki/za-nas.svg");    --tone:#A24C36; --tint:#F6E8E2; }
.ed-programs .ed-prog-card:nth-of-type(6n+2){ --plocha:url("art/plochki/uchproc.svg");   --tone:#2F6F66; --tint:#E2EFEC; }
.ed-programs .ed-prog-card:nth-of-type(6n+3){ --plocha:url("art/plochki/priem.svg");     --tone:#C06A4E; --tint:#FAEAE2; }
.ed-programs .ed-prog-card:nth-of-type(6n+4){ --plocha:url("art/plochki/proekti.svg");   --tone:#B8863B; --tint:#FAF0DE; }
.ed-programs .ed-prog-card:nth-of-type(6n+5){ --plocha:url("art/plochki/roditeli.svg");  --tone:#8C4B66; --tint:#F5E6EC; }
.ed-programs .ed-prog-card:nth-of-type(6n+6){ --plocha:url("art/plochki/dokumenti.svg"); --tone:#55708C; --tint:#E6ECF3; }

.ed-programs .ed-prog-card:nth-of-type(n){
  background-image:
    /* 1. тънък воал, само колкото текстът да остане четим */
    linear-gradient(165deg, rgba(255,253,247,.34), rgba(255,253,247,.12)),
    /* 2. самата рисунка */
    var(--plocha, none),
    /* 3. цветът на плочката */
    linear-gradient(165deg, #FFFFFF 0%, var(--tint, #F6E8E2) 100%);
  background-size:cover, cover, cover;
  background-position:center, center, center;
  background-repeat:no-repeat, no-repeat, no-repeat;
  /* ако рисунката по някаква причина не се зареди, отдолу пак стои цвят, а не бяло */
  background-color:var(--tint, #F6E8E2);
  transition:
    border-color .35s,
    box-shadow .45s cubic-bezier(.16,.8,.3,1),
    transform .45s cubic-bezier(.16,.8,.3,1),
    background-image .45s ease;
}
/* при посочване воалът си отива почти напълно */
.ed-programs .ed-prog-card:nth-of-type(n):hover{
  background-image:
    linear-gradient(165deg, rgba(255,253,247,.12), rgba(255,253,247,0)),
    var(--plocha, none),
    linear-gradient(165deg, #FFFFFF 0%, var(--tint, #F6E8E2) 100%);
}

/* ===========================================================================
   58. КЛУБ „ТВОРИЛНИЦА – СЛАДКО И СОЛЕНО“ (tvorilnica.html)
   Страницата е подредена като останалите раздели: рисуван кавър, лек скин
   и спокойни карти в цвета на клуба — не пренесен плакат.
=========================================================================== */
[data-theme="tvorilnica"]{ --brick:#A8385E; --brick-deep:#732440; --brick-bg:#F6DDE5; --tw-salt:#4C7A2E; --tw-salt-bg:#E3EED8; --tw-wood:#9A6B3F; }
[data-theme="tvorilnica"] .ed-cover{ background-image:url('art/cover-tvorilnica.svg'); }
/* скин: карирана покривка, почти незабележима */
[data-theme="tvorilnica"] main::before{
  background:
    repeating-linear-gradient(0deg, var(--brick) 0 18px, transparent 18px 36px),
    repeating-linear-gradient(90deg, var(--brick) 0 18px, transparent 18px 36px);
  opacity:.028;
}

/* логото в реда на „Рубрики и клубове“ */
.ed-rubric-row .rr-icon.rr-logo{ padding:0; background:#fff; overflow:hidden; }
.ed-rubric-row .rr-icon.rr-logo img{ width:100%; height:100%; object-fit:cover; display:block; }

/* увод: текст вляво, логото на клуба вдясно като печат */
.tv-intro{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:clamp(24px,4vw,56px); align-items:center; margin-bottom:clamp(36px,5vw,56px); }
.tv-intro p{ margin:0 0 14px; font-size:17px; line-height:1.75; color:var(--ink-soft); max-width:60ch; }
.tv-motto{ font-family:'Fraunces',serif; font-style:italic; font-size:clamp(22px,2.4vw,28px); color:var(--brick-deep); margin:0; }
.tv-badge{ width:clamp(130px,16vw,180px); aspect-ratio:1; border-radius:50%; display:block;
  box-shadow:0 0 0 6px var(--cream-3,#FBF8F1), 0 0 0 7px var(--line,#E7DDCD), 0 20px 40px -22px rgba(36,30,25,.5);
  transform:rotate(-4deg); transition:transform .5s cubic-bezier(.16,.8,.3,1); }
.tv-badge:hover{ transform:rotate(0) scale(1.03); }
@media (max-width:640px){ .tv-intro{ grid-template-columns:1fr; justify-items:center; text-align:center; } .tv-intro .tv-badge{ order:-1; } }

/* дейностите — в стила на картите на сайта */
.tv-acts{ display:grid; grid-template-columns:repeat(auto-fit, minmax(190px,1fr)); gap:clamp(14px,1.8vw,22px); }
.tv-act{ background:var(--cream-3,#FBF8F1); border:1px solid var(--line,#E7DDCD); border-radius:16px; padding:26px 22px 24px;
  box-shadow:0 10px 26px -20px rgba(36,30,25,.35);
  transition:transform .4s cubic-bezier(.16,.8,.3,1), border-color .3s, box-shadow .4s; }
.tv-act:hover{ transform:translateY(-5px); border-color:var(--brick); box-shadow:0 22px 44px -24px rgba(36,30,25,.42); }
.tv-act .tv-ic{ width:50px; height:50px; border-radius:50%; background:var(--brick-bg); color:var(--brick);
  display:flex; align-items:center; justify-content:center; padding:12px; margin-bottom:16px; }
.tv-act .tv-ic svg{ width:100%; height:100%; }
.tv-act h3{ margin:0 0 8px; font-family:'Fraunces',serif; font-weight:400; font-size:21px; line-height:1.2; color:var(--ink); }
.tv-act p{ margin:0; font-size:14px; line-height:1.65; color:var(--ink-soft); }

/* защо да дойдеш */
.tv-why{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(20px,3vw,40px); margin-top:clamp(40px,5vw,60px); }
.tv-why div{ border-left:3px solid var(--brick); border-radius:0; padding:4px 0 4px 20px; }
.tv-why b{ display:block; font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--brick); margin-bottom:8px; }
.tv-why span{ font-size:16px; line-height:1.7; color:var(--ink); }
@media (max-width:640px){ .tv-why{ grid-template-columns:1fr; } }

/* призивът */
.tv-cta{ text-align:center; margin-top:clamp(40px,5vw,60px); }
.tv-cta p{ font-family:'Fraunces',serif; font-style:italic; font-size:clamp(24px,2.8vw,32px); line-height:1.3; color:var(--ink); margin:18px 0 6px; }
.tv-cta small{ display:block; font-size:15px; color:var(--brick-deep); margin-bottom:24px; }
.tv-btn{ display:inline-flex; align-items:center; gap:10px; padding:13px 26px; border-radius:999px; background:var(--brick); color:#fff;
  font-family:'Manrope',sans-serif; font-weight:700; font-size:14px; text-decoration:none; transition:background .3s, transform .3s; }
.tv-btn:hover{ background:var(--brick-deep); transform:translateY(-2px); }

/* плакатът — скрит зад бутона, отваря се голям */
.tv-poster{ margin:clamp(40px,5vw,56px) auto 0; max-width:420px; }
.tv-poster a{ display:block; border-radius:14px; overflow:hidden; border:1px solid var(--line,#E7DDCD);
  box-shadow:0 18px 40px -24px rgba(36,30,25,.45); transition:transform .35s cubic-bezier(.16,.8,.3,1); }
.tv-poster a:hover{ transform:translateY(-4px); }
.tv-poster img{ width:100%; height:auto; display:block; }
.tv-poster figcaption{ text-align:center; margin-top:12px; font-size:13px; color:var(--ink-soft); }

/* ===========================================================================
   58б. ТВОРИЛНИЦА — СОБСТВЕНО ЛИЦЕ
   Тетрадка с рецепта, дъска с инструменти, превключвател „сладко/солено“,
   буркани и корково табло с плаката. Класовете са с представка tw-.
=========================================================================== */
.tw-block{ margin-top:clamp(56px,7vw,90px); }
.tw-h{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(26px,3vw,36px); line-height:1.15; color:var(--ink); margin:6px 0 0; }
.tw-hand{ font-family:'Marck Script','Fraunces',cursive; }

/* ---- рецептата ---- */
.tw-recipe-wrap{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:clamp(28px,5vw,64px); align-items:center; }
.tw-recipe{ position:relative; background:#FFFEFA; border-radius:6px; padding:34px 30px 30px 64px;
  background-image:linear-gradient(90deg, transparent 46px, rgba(200,60,80,.45) 46px 48px, transparent 48px),
                   repeating-linear-gradient(180deg, transparent 0 33px, rgba(80,130,190,.22) 33px 34px);
  box-shadow:0 24px 50px -28px rgba(60,30,20,.5), 0 0 0 1px rgba(0,0,0,.04);
  transform:rotate(-1.5deg); transition:transform .6s cubic-bezier(.16,.8,.3,1); }
.tw-recipe:hover{ transform:rotate(0); }
.tw-recipe::before, .tw-recipe::after{ content:''; position:absolute; width:110px; height:30px; top:-12px; background:rgba(232,200,119,.55);
  box-shadow:0 2px 4px rgba(0,0,0,.06); }
.tw-recipe::before{ left:-18px; transform:rotate(-24deg); }
.tw-recipe::after{ right:-18px; transform:rotate(20deg); background:rgba(168,56,94,.28); }
.tw-recipe h3{ font-family:'Marck Script',cursive; font-weight:400; font-size:clamp(34px,4vw,44px); line-height:1; color:var(--brick-deep); margin:0 0 4px; }
.tw-recipe .tw-meta{ font-size:13px; color:var(--ink-soft); margin:0 0 18px; }
.tw-recipe h4{ font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:var(--brick); margin:18px 0 6px; }
.tw-recipe ul, .tw-recipe ol{ margin:0; padding-left:20px; font-family:'Marck Script',cursive; font-size:22px; line-height:34px; color:#2B3A55; }
.tw-recipe li::marker{ color:var(--brick); }
.tw-intro p{ margin:0 0 14px; font-size:18px; line-height:1.8; color:var(--ink-soft); }
.tw-intro .tw-logo{ width:clamp(120px,14vw,160px); aspect-ratio:1; border-radius:50%; display:block; margin:0 0 20px;
  box-shadow:0 0 0 6px #fff, 0 16px 34px -18px rgba(60,30,20,.5); transform:rotate(-6deg); }
.tw-intro .tw-motto{ font-family:'Marck Script',cursive; font-size:clamp(28px,3vw,36px); color:var(--brick-deep); margin:0; line-height:1.2; }
@media (max-width:760px){ .tw-recipe-wrap{ grid-template-columns:1fr; } .tw-intro{ order:-1; text-align:center; } .tw-intro .tw-logo{ margin:0 auto 18px; } .tw-recipe{ padding-left:58px; } }

/* ---- дъската с инструменти ---- */
.tw-board{ position:relative; margin-top:26px; border-radius:18px; padding:46px clamp(16px,3vw,40px) 40px;
  background-color:#C9A276;
  background-image:radial-gradient(circle, rgba(70,40,15,.35) 3.2px, transparent 3.6px),
                   linear-gradient(135deg, #D2AE84, #BE9468);
  background-size:30px 30px, cover;
  box-shadow:inset 0 0 0 10px #9A6B3F, inset 0 0 0 12px rgba(0,0,0,.08), 0 24px 50px -30px rgba(60,30,20,.6); }
.tw-tags{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:clamp(10px,1.6vw,20px); }
.tw-tag{ position:relative; padding-top:44px; perspective:900px; cursor:pointer; border:0; background:none; font:inherit; text-align:center; }
.tw-tag::before{ content:''; position:absolute; top:4px; left:50%; width:14px; height:14px; margin-left:-7px; border-radius:50%;
  background:radial-gradient(circle at 35% 35%, #f3f3f3, #8a8a8a); box-shadow:0 2px 3px rgba(0,0,0,.35); z-index:2; }
.tw-tag::after{ content:''; position:absolute; top:12px; left:50%; width:2px; height:36px; margin-left:-1px; background:#6B4A2A; transform-origin:top; }
.tw-swing{ display:block; transform-origin:50% -34px; animation:twSwing 5s ease-in-out infinite alternate; }
.tw-tag:nth-child(2) .tw-swing{ animation-delay:-1.2s; } .tw-tag:nth-child(3) .tw-swing{ animation-delay:-2.4s; }
.tw-tag:nth-child(4) .tw-swing{ animation-delay:-.6s; } .tw-tag:nth-child(5) .tw-swing{ animation-delay:-3s; }
@keyframes twSwing{ from{ transform:rotate(-2.5deg); } to{ transform:rotate(2.5deg); } }
.tw-tag:hover .tw-swing{ animation-duration:1.2s; }
.tw-flip{ display:block; position:relative; min-height:230px; transform-style:preserve-3d; transition:transform .8s cubic-bezier(.3,1.3,.5,1); }
.tw-tag.open .tw-flip{ transform:rotateY(180deg); }
.tw-face{ position:absolute; inset:0; backface-visibility:hidden; -webkit-backface-visibility:hidden;
  background:#FFF8EA; border-radius:10px 10px 16px 16px; padding:34px 14px 18px;
  clip-path:polygon(22% 0, 78% 0, 100% 14%, 100% 100%, 0 100%, 0 14%);
  box-shadow:0 14px 26px -16px rgba(40,20,5,.7); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; }
.tw-face::before{ content:''; position:absolute; top:12px; left:50%; width:12px; height:12px; margin-left:-6px; border-radius:50%; background:#C9A276; box-shadow:inset 0 1px 2px rgba(0,0,0,.4); }
.tw-face.back{ transform:rotateY(180deg); background:var(--c-bg,#F6DDE5); }
.tw-face .tw-ic{ width:54px; height:54px; border-radius:50%; background:var(--c-bg,#F6DDE5); color:var(--c,#A8385E); padding:12px; }
.tw-face .tw-ic svg{ width:100%; height:100%; display:block; }
.tw-face b{ font-family:'Fraunces',serif; font-weight:400; font-size:19px; line-height:1.2; color:var(--ink); }
.tw-face small{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); font-weight:700; }
.tw-face.back p{ margin:0; font-size:14px; line-height:1.6; color:var(--c-deep,#732440); }
.tw-tag.t1{ --c:#A8385E; --c-deep:#732440; --c-bg:#F6DDE5; }
.tw-tag.t2{ --c:#9A6B3F; --c-deep:#5E3E20; --c-bg:#F1E2CF; }
.tw-tag.t3{ --c:#B5673C; --c-deep:#7A3F1E; --c-bg:#F6E3D3; }
.tw-tag.t4{ --c:#4F72A8; --c-deep:#2C4570; --c-bg:#E1E9F5; }
.tw-tag.t5{ --c:#4C7A2E; --c-deep:#2E4F18; --c-bg:#E3EED8; }
.tw-board-note{ text-align:center; margin:22px 0 0; font-family:'Marck Script',cursive; font-size:22px; color:#3A2410; opacity:.85; }
@media (max-width:1000px){ .tw-tags{ grid-template-columns:repeat(3,minmax(0,1fr)); row-gap:26px; } }
@media (max-width:560px){ .tw-tags{ grid-template-columns:repeat(2,minmax(0,1fr)); } .tw-flip{ min-height:210px; } }

/* ---- сладко или солено ---- */
.tw-ss{ margin-top:26px; border-radius:24px; padding:clamp(26px,4vw,44px); background:var(--brick-bg); transition:background .7s ease;
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(24px,4vw,56px); align-items:center; }
.tw-ss.salt{ background:var(--tw-salt-bg); }
.tw-switch{ display:inline-flex; position:relative; padding:6px; border-radius:999px; background:#fff; box-shadow:0 10px 24px -14px rgba(0,0,0,.35); }
.tw-switch button{ position:relative; z-index:1; border:0; background:none; cursor:pointer; padding:12px 26px; border-radius:999px;
  font-family:'Manrope',sans-serif; font-weight:800; font-size:15px; color:var(--ink-soft); transition:color .4s; }
.tw-switch button.on{ color:#fff; }
.tw-switch i{ position:absolute; top:6px; bottom:6px; left:6px; width:calc(50% - 6px); border-radius:999px; background:var(--brick);
  transition:transform .55s cubic-bezier(.34,1.4,.5,1), background .5s; }
.tw-ss.salt .tw-switch i{ transform:translateX(100%); background:var(--tw-salt); }
.tw-ss h3{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(28px,3vw,38px); line-height:1.1; margin:24px 0 12px; color:var(--brick-deep); transition:color .5s; }
.tw-ss.salt h3{ color:#2E4F18; }
.tw-ss ul{ list-style:none; margin:0; padding:0; }
.tw-ss li{ display:flex; align-items:center; gap:12px; padding:10px 0; border-bottom:1px dashed rgba(0,0,0,.12); font-size:17px; color:var(--ink); }
.tw-ss li:last-child{ border-bottom:0; }
.tw-ss li span{ width:10px; height:10px; border-radius:50%; background:var(--brick); flex:0 0 auto; transition:background .5s; }
.tw-ss.salt li span{ background:var(--tw-salt); }
.tw-side[hidden]{ display:none !important; }
.tw-side{ animation:twIn .5s ease both; }
@keyframes twIn{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
.tw-plate{ position:relative; width:100%; max-width:340px; aspect-ratio:1; margin:0 auto; }
.tw-plate svg{ width:100%; height:100%; display:block; }
.tw-plate .tw-art{ transition:opacity .5s, transform .6s cubic-bezier(.34,1.4,.5,1); transform-origin:50% 50%; }
.tw-ss .tw-art.salt, .tw-ss.salt .tw-art.sweet{ opacity:0; transform:scale(.6) rotate(-30deg); }
.tw-ss.salt .tw-art.salt{ opacity:1; transform:none; }
@media (max-width:760px){ .tw-ss{ grid-template-columns:1fr; text-align:center; } .tw-ss ul{ text-align:left; } .tw-plate{ max-width:240px; } }

/* ---- бурканите ---- */
.tw-jars{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(24px,4vw,56px); max-width:820px; margin:30px auto 0; }
.tw-jar{ position:relative; padding:0 10px; }
.tw-lid{ height:34px; margin:0 14%; border-radius:10px 10px 4px 4px; background:repeating-linear-gradient(90deg, var(--jar-lid) 0 8px, rgba(255,255,255,.25) 8px 10px); box-shadow:0 4px 0 rgba(0,0,0,.1); }
.tw-glass{ position:relative; margin-top:4px; border-radius:26px 26px 38px 38px; padding:40px 20px 34px; min-height:250px;
  background:linear-gradient(90deg, rgba(255,255,255,.75), rgba(255,255,255,.35) 30%, rgba(255,255,255,.55));
  box-shadow:inset 0 0 0 2px rgba(120,140,150,.28), inset 12px 0 0 rgba(255,255,255,.5), 0 24px 40px -26px rgba(60,30,20,.45); }
.tw-label{ background:#FFF8EA; border-radius:6px; padding:18px 18px 16px; text-align:center; box-shadow:0 2px 0 rgba(0,0,0,.06); border:1px dashed rgba(0,0,0,.18); transform:rotate(-1deg); }
.tw-jar:nth-child(2) .tw-label{ transform:rotate(1.2deg); }
.tw-label b{ display:block; font-family:'Marck Script',cursive; font-weight:400; font-size:30px; color:var(--jar-ink); margin-bottom:8px; }
.tw-label span{ font-size:15px; line-height:1.65; color:var(--ink); }
.tw-beads{ display:flex; justify-content:center; gap:6px; margin-top:18px; }
.tw-beads i{ width:14px; height:14px; border-radius:50%; background:var(--b); animation:twBob 3s ease-in-out infinite alternate; }
.tw-beads i:nth-child(2){ animation-delay:-.6s; } .tw-beads i:nth-child(3){ animation-delay:-1.2s; } .tw-beads i:nth-child(4){ animation-delay:-1.8s; } .tw-beads i:nth-child(5){ animation-delay:-2.4s; }
@keyframes twBob{ from{ transform:translateY(0); } to{ transform:translateY(-6px); } }
@media (max-width:640px){ .tw-jars{ grid-template-columns:1fr; } }

/* ---- корковото табло ---- */
.tw-cork{ margin-top:30px; border-radius:18px; padding:clamp(28px,4vw,48px);
  background-color:#C8A171;
  background-image:radial-gradient(rgba(90,55,20,.28) 1px, transparent 1.4px), radial-gradient(rgba(255,240,210,.35) 1px, transparent 1.4px);
  background-size:9px 9px, 13px 13px; background-position:0 0, 4px 6px;
  box-shadow:inset 0 0 0 10px #8E6238, 0 24px 50px -30px rgba(60,30,20,.6);
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.8fr); gap:clamp(24px,4vw,48px); align-items:center; }
.tw-pinned{ position:relative; background:#fff; padding:10px; border-radius:3px; transform:rotate(-2deg); box-shadow:0 20px 34px -18px rgba(40,20,5,.7); transition:transform .5s cubic-bezier(.16,.8,.3,1); max-width:440px; justify-self:center; }
.tw-pinned:hover{ transform:rotate(0) translateY(-4px); }
.tw-pinned img{ width:100%; height:auto; display:block; }
.tw-pin{ position:absolute; top:-12px; left:50%; width:26px; height:26px; margin-left:-13px; border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #F29AB3, #A8385E 60%, #6A1D38); box-shadow:0 6px 8px -2px rgba(0,0,0,.45); }
.tw-sticky{ background:#FFE98A; padding:26px 24px; transform:rotate(3deg); box-shadow:0 18px 30px -18px rgba(40,20,5,.7); position:relative; }
.tw-sticky::before{ content:''; position:absolute; top:-10px; left:50%; width:90px; height:24px; margin-left:-45px; background:rgba(255,255,255,.55); transform:rotate(-3deg); }
.tw-sticky p{ margin:0; font-family:'Marck Script',cursive; font-size:clamp(26px,2.8vw,32px); line-height:1.25; color:#3A2410; }
.tw-sticky small{ display:block; margin-top:14px; font-family:'Marck Script',cursive; font-size:22px; color:var(--brick-deep); }
.tw-cork figcaption{ text-align:center; margin-top:10px; font-size:12px; color:var(--ink-soft); }
@media (max-width:760px){ .tw-cork{ grid-template-columns:1fr; } .tw-sticky{ transform:rotate(1.5deg); } }
@media (prefers-reduced-motion:reduce){ .tw-swing, .tw-beads i{ animation:none; } }

/* ===========================================================================
   59. КЛУБ „ПЪТЕШЕСТВЕНИЦИ КЪМ ЗНАНИЕ“ (pateshestvenici.html)
   Страницата е пътешествие: бордна карта за часа и мястото, компас с
   посоките на клуба, игра със столици, легенда на картата и плакат-картичка.
   Всички класове са с представка pz-, за да не се бъркат с другите клубове.
=========================================================================== */
[data-theme="patesh"]{ --brick:#2E6E78; --brick-deep:#1F4A51; --brick-bg:#DCEBEB; --pz-brass:#B8863B; --pz-red:#B03A3A; --pz-paper:#FBF4E4; }
[data-theme="patesh"] .ed-cover{ background-image:url('art/cover-patesh.svg'); }
[data-theme="patesh"] main::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 220'%3E%3Cg fill='none' stroke='%232E6E78' stroke-width='1.6'%3E%3Cpath d='M0 55q160-26 320 0M0 165q160-26 320 0'/%3E%3Cpath d='M80 0q-24 110 0 220M240 0q24 110 0 220'/%3E%3C/g%3E%3C/svg%3E"); background-size:320px 220px; opacity:.06; }

.pz-h{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(26px,3vw,36px); line-height:1.15; color:var(--ink); margin:6px 0 0; }
.pz-block{ margin-top:clamp(56px,7vw,90px); }

/* ---- 1. бордна карта ---- */
.pz-pass{ display:grid; grid-template-columns:minmax(0,1fr) 190px; max-width:860px; margin:0 auto;
  background:var(--pz-paper); border-radius:18px; position:relative;
  box-shadow:0 1px 0 rgba(255,255,255,.8) inset, 0 24px 50px -28px rgba(31,74,81,.55), 0 0 0 1px rgba(46,110,120,.16);
  transform:rotate(-1.2deg); transition:transform .6s cubic-bezier(.16,.8,.3,1); }
.pz-pass:hover{ transform:rotate(0); }
.pz-pass-main{ padding:26px 30px 24px; }
.pz-pass-top{ display:flex; justify-content:space-between; align-items:center; gap:16px; padding-bottom:16px; margin-bottom:18px; border-bottom:1px solid rgba(46,110,120,.2); }
.pz-pass-brand{ display:flex; align-items:center; gap:10px; font-family:'Manrope',sans-serif; font-weight:800; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--brick-deep); }
.pz-pass-brand svg{ width:26px; height:26px; color:var(--brick); }
.pz-pass-class{ font-family:'Manrope',sans-serif; font-weight:800; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:#fff; background:var(--brick); padding:6px 12px; border-radius:999px; }
.pz-route{ display:flex; align-items:center; gap:18px; margin-bottom:20px; }
.pz-route .pz-city b{ display:block; font-family:'Fraunces',serif; font-weight:500; font-size:clamp(30px,4vw,44px); line-height:1; color:var(--brick-deep); }
.pz-route .pz-city span{ font-size:12px; color:var(--ink-soft); }
.pz-route .pz-fly{ flex:1; position:relative; height:2px; background:repeating-linear-gradient(90deg, var(--brick) 0 6px, transparent 6px 12px); opacity:.6; }
.pz-route .pz-fly svg{ position:absolute; left:50%; top:50%; width:26px; height:26px; margin:-13px 0 0 -13px; color:var(--brick-deep); background:var(--pz-paper); padding:2px; animation:pzFly 6s ease-in-out infinite alternate; }
@keyframes pzFly{ from{ left:18%; } to{ left:82%; } }
.pz-fields{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.pz-fields b{ display:block; font-family:'Manrope',sans-serif; font-size:10px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:4px; }
.pz-fields span{ font-family:'Fraunces',serif; font-size:18px; line-height:1.2; color:var(--ink); }
.pz-pass-stub{ position:relative; padding:26px 22px; border-left:2px dashed rgba(46,110,120,.35); display:flex; flex-direction:column; justify-content:space-between; gap:14px; text-align:center; }
.pz-pass-stub::before, .pz-pass-stub::after{ content:''; position:absolute; left:-13px; width:24px; height:24px; border-radius:50%; background:var(--cream,#F7F1E8); }
.pz-pass-stub::before{ top:-12px; } .pz-pass-stub::after{ bottom:-12px; }
.pz-gate b{ display:block; font-family:'Manrope',sans-serif; font-size:10px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft); }
.pz-gate span{ font-family:'Fraunces',serif; font-size:40px; line-height:1.05; color:var(--brick-deep); }
.pz-barcode{ height:52px; border-radius:4px; background:repeating-linear-gradient(90deg, var(--ink) 0 2px, transparent 2px 4px, var(--ink) 4px 5px, transparent 5px 8px, var(--ink) 8px 11px, transparent 11px 13px); opacity:.75; }
@media (max-width:700px){
  .pz-pass{ grid-template-columns:1fr; transform:none; }
  .pz-pass-stub{ border-left:0; border-top:2px dashed rgba(46,110,120,.35); flex-direction:row; align-items:center; }
  .pz-pass-stub::before, .pz-pass-stub::after{ top:-13px; left:auto; bottom:auto; }
  .pz-pass-stub::before{ left:-12px; } .pz-pass-stub::after{ right:-12px; }
  .pz-barcode{ flex:1; }
  .pz-fields{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* ---- 2. дневник на пътешественика ---- */
.pz-diary{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:clamp(24px,4vw,56px); align-items:center; max-width:980px; margin-left:auto; margin-right:auto; }
.pz-stamp{ position:relative; width:clamp(150px,18vw,200px); aspect-ratio:1; }
.pz-stamp img{ width:100%; height:100%; border-radius:50%; object-fit:cover; display:block; filter:saturate(.9); }
.pz-stamp svg{ position:absolute; inset:-14px; width:calc(100% + 28px); height:calc(100% + 28px); color:var(--brick); animation:pzSpin 40s linear infinite; }
@keyframes pzSpin{ to{ transform:rotate(360deg); } }
.pz-diary p{ margin:0 0 14px; font-size:18px; line-height:1.8; color:var(--ink-soft); }
.pz-diary p:first-child::first-letter{ float:left; font-family:'Fraunces',serif; font-size:64px; line-height:.85; padding:6px 10px 0 0; color:var(--brick); }
.pz-diary .pz-motto{ font-family:'Fraunces',serif; font-style:italic; font-size:clamp(22px,2.4vw,28px); color:var(--brick-deep); margin:0; }
@media (max-width:700px){ .pz-diary{ grid-template-columns:1fr; justify-items:center; } }

/* ---- 3. компасът с посоките ---- */
.pz-compass-wrap{ display:grid; grid-template-columns:minmax(260px,420px) minmax(0,1fr); gap:clamp(28px,5vw,70px); align-items:center; margin-top:28px; }
.pz-compass{ position:relative; width:100%; aspect-ratio:1; }
.pz-compass svg.pz-dial{ width:100%; height:100%; display:block; }
.pz-needle{ position:absolute; inset:0; transition:transform 1.1s cubic-bezier(.34,1.4,.5,1); pointer-events:none; }
.pz-needle svg{ width:100%; height:100%; display:block; }
.pz-dir{ position:absolute; width:64px; height:64px; margin:-32px 0 0 -32px; border-radius:50%; border:0; cursor:pointer;
  background:var(--pz-paper); color:var(--brick-deep); font-family:'Fraunces',serif; font-size:24px;
  box-shadow:0 0 0 1px rgba(46,110,120,.25), 0 10px 22px -12px rgba(31,74,81,.6); transition:background .3s, color .3s, transform .3s; }
.pz-dir:hover{ transform:scale(1.08); }
.pz-dir.on{ background:var(--brick); color:#fff; }
.pz-dir[data-d="0"]{ left:50%; top:7%; } .pz-dir[data-d="1"]{ left:93%; top:50%; }
.pz-dir[data-d="2"]{ left:50%; top:93%; } .pz-dir[data-d="3"]{ left:7%; top:50%; }
.pz-panel{ position:relative; min-height:240px; }
.pz-card{ position:absolute; inset:0 auto auto 0; width:100%; opacity:0; transform:translateY(14px); transition:opacity .45s, transform .45s; pointer-events:none; }
.pz-card.on{ position:relative; opacity:1; transform:none; pointer-events:auto; }
.pz-card .pz-ico{ width:56px; height:56px; border-radius:16px; background:var(--brick-bg); color:var(--brick); padding:13px; margin-bottom:18px; }
.pz-card .pz-ico svg{ width:100%; height:100%; display:block; }
.pz-card b{ display:block; font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:var(--pz-brass); margin-bottom:8px; }
.pz-card h3{ margin:0 0 12px; font-family:'Fraunces',serif; font-weight:400; font-size:clamp(28px,3vw,38px); line-height:1.1; color:var(--ink); }
.pz-card p{ margin:0; font-size:17px; line-height:1.75; color:var(--ink-soft); max-width:46ch; }
.pz-goal{ margin-top:26px; display:flex; align-items:center; gap:14px; padding:16px 20px; border-radius:14px; background:var(--pz-paper); border:1px dashed rgba(184,134,59,.55); }
.pz-goal svg{ flex:0 0 auto; width:34px; height:34px; color:var(--pz-red); }
.pz-goal span{ font-size:15px; line-height:1.55; color:var(--ink); }
@media (max-width:760px){ .pz-compass-wrap{ grid-template-columns:1fr; } .pz-compass{ max-width:340px; margin:0 auto; } .pz-dir{ width:54px; height:54px; margin:-27px 0 0 -27px; font-size:20px; } }

/* ---- 4. играта ---- */
.pz-quiz{ max-width:760px; margin:26px auto 0; background:var(--pz-paper); border-radius:20px; padding:clamp(22px,3vw,34px);
  box-shadow:0 0 0 1px rgba(46,110,120,.16), 0 24px 50px -30px rgba(31,74,81,.5); position:relative; overflow:hidden; }
.pz-q-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:18px; }
.pz-q-top b{ font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--brick); }
.pz-dots{ display:flex; gap:6px; }
.pz-dots i{ width:22px; height:6px; border-radius:3px; background:rgba(46,110,120,.18); transition:background .3s; }
.pz-dots i.done{ background:var(--brick); } .pz-dots i.miss{ background:var(--pz-red); opacity:.6; }
.pz-q{ font-family:'Fraunces',serif; font-size:clamp(22px,2.6vw,30px); line-height:1.25; color:var(--ink); margin:0 0 20px; }
.pz-opts{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.pz-opts button{ text-align:left; padding:15px 18px; border-radius:12px; border:1px solid rgba(46,110,120,.25); background:#fff; cursor:pointer;
  font-family:'Manrope',sans-serif; font-size:16px; font-weight:600; color:var(--ink); transition:border-color .2s, background .2s, transform .2s; }
.pz-opts button:hover:not(:disabled){ border-color:var(--brick); transform:translateY(-2px); }
.pz-opts button.ok{ background:#E2F0E6; border-color:#3E7A5A; color:#23543A; }
.pz-opts button.no{ background:#F7E1DF; border-color:var(--pz-red); color:#7A2626; }
.pz-opts button:disabled{ cursor:default; }
.pz-fb{ min-height:26px; margin:16px 0 0; font-size:15px; color:var(--ink-soft); }
.pz-next{ margin-top:10px; }
.pz-end{ text-align:center; padding:10px 0; }
.pz-end .pz-seal{ width:130px; height:130px; margin:0 auto 14px; color:var(--pz-red); animation:pzStamp .6s cubic-bezier(.3,1.6,.5,1) both; }
@keyframes pzStamp{ from{ transform:scale(2.2) rotate(-24deg); opacity:0; } to{ transform:scale(1) rotate(-10deg); opacity:1; } }
.pz-end h3{ font-family:'Fraunces',serif; font-weight:400; font-size:30px; margin:0 0 6px; color:var(--ink); }
.pz-end p{ margin:0 0 18px; color:var(--ink-soft); }
@media (max-width:560px){ .pz-opts{ grid-template-columns:1fr; } }

/* ---- 5. легендата ---- */
.pz-legend{ max-width:760px; margin:26px auto 0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border:2px solid var(--ink); border-radius:4px; background:var(--pz-paper); }
.pz-legend > div{ padding:22px 20px; border-right:1px solid rgba(58,50,43,.25); }
.pz-legend > div:last-child{ border-right:0; }
.pz-legend svg{ width:30px; height:30px; margin-bottom:10px; }
.pz-legend b{ display:block; font-family:'Fraunces',serif; font-weight:500; font-size:20px; color:var(--ink); margin-bottom:6px; }
.pz-legend span{ font-size:14px; line-height:1.6; color:var(--ink-soft); }
.pz-legend-cap{ max-width:760px; margin:0 auto; display:flex; justify-content:space-between; font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-soft); padding:0 4px 8px; }
@media (max-width:700px){ .pz-legend{ grid-template-columns:1fr; } .pz-legend > div{ border-right:0; border-bottom:1px solid rgba(58,50,43,.25); } .pz-legend > div:last-child{ border-bottom:0; } }

/* ---- 6. плакатът като пощенска картичка ---- */
.pz-card-post{ max-width:520px; margin:30px auto 0; position:relative; background:#fff; padding:14px; border-radius:6px;
  box-shadow:0 26px 50px -26px rgba(36,30,25,.55); transform:rotate(1.6deg); transition:transform .5s cubic-bezier(.16,.8,.3,1); }
.pz-card-post:hover{ transform:rotate(0) translateY(-4px); }
.pz-card-post img{ width:100%; height:auto; display:block; border-radius:2px; }
.pz-postmark{ position:absolute; right:-26px; top:-26px; width:128px; height:128px; color:var(--pz-red); transform:rotate(12deg); pointer-events:none; }
.pz-card-post figcaption{ text-align:center; margin-top:12px; font-size:13px; color:var(--ink-soft); }
@media (max-width:560px){ .pz-postmark{ right:-6px; top:-30px; width:100px; height:100px; } }
@media (prefers-reduced-motion:reduce){ .pz-stamp svg, .pz-route .pz-fly svg{ animation:none; } .pz-needle{ transition:none; } }

/* Начална страница — блокът „Нашите рубрики и клубове“ с три карти */
/* четири карти — две по две; на телефон една под друга */
.rb-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
@media (max-width:760px){ .rb-grid{ grid-template-columns:1fr; } }
.rb-img-patesh{ background:#F1E4C8 url('art/rb-patesh.svg') center/cover no-repeat; display:grid; place-items:center; }
.rb-img-patesh img{ position:relative; width:30%; max-width:110px; height:auto; aspect-ratio:1; border-radius:50%; object-fit:cover;
  box-shadow:0 0 0 5px #fff, 0 12px 26px -8px rgba(40,50,40,.35); transition:transform .6s ease; }
.rb-patesh .rb-kick{ color:#2E6E78; }
.rb-patesh:hover{ border-color:#2E6E78; }
.rb-patesh:hover .rb-img-patesh img{ transform:rotate(18deg) scale(1.06); }
.rb-img-tvor{ background:#F6E9DD url('art/rb-tvorilnica.svg') center/cover no-repeat; display:grid; place-items:center; }
.rb-img-tvor img{ position:relative; width:30%; max-width:110px; height:auto; aspect-ratio:1; border-radius:50%;
  box-shadow:0 0 0 5px #fff, 0 12px 26px -8px rgba(60,30,20,.35); transition:transform .4s ease; }
.rb-tvor .rb-kick{ color:#A8385E; }
.rb-tvor:hover{ border-color:#A8385E; }
.rb-tvor:hover .rb-img-tvor img{ transform:scale(1.06) rotate(-4deg); }

/* Творилница — снимки и видео от заниманията */
.tv-media{ margin-top:clamp(48px,6vw,72px); }
.tv-empty{ aspect-ratio:16/10; border-radius:13px; border:2px dashed rgba(176,58,94,.3); background:var(--cream-3,#FBF8F1);
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:6px; padding:20px; }
.tv-empty-ic{ width:46px; height:46px; border-radius:50%; background:var(--brick-bg); color:var(--brick); padding:11px; margin-bottom:6px; }
.tv-empty-ic svg{ width:100%; height:100%; display:block; }
.tv-empty b{ font-family:'Fraunces',serif; font-weight:400; font-size:19px; color:var(--ink); }
.tv-empty span:last-child{ font-size:13px; line-height:1.55; color:var(--ink-soft); max-width:30ch; }
.tv-gallery:has(.ed-photo-tile) .tv-empty{ display:none; }

.pz-quiz [hidden]{ display:none !important; }

/* ===========================================================================
   60. АЛЕКО ТВ — ТЕЛЕВИЗИОННА СТАНЦИЯ (alekotv.html)
   Голям ретро телевизор, в който се пускат епизодите направо; епизодите са
   видеокасети на рафт; екипът е на клапи; накрая — бутон REC към канала.
   Класовете са с представка atv-.
=========================================================================== */
.atv-block{ margin-top:clamp(56px,7vw,90px); }
.atv-h{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(26px,3vw,36px); line-height:1.15; color:var(--ink); margin:6px 0 0; }

/* ---- надписът „в ефир“ ---- */
.atv-onair{ display:flex; justify-content:center; margin-bottom:26px; }
.atv-onair span{ display:inline-flex; align-items:center; gap:12px; padding:10px 22px; border-radius:10px;
  font-family:'Manrope',sans-serif; font-weight:800; font-size:14px; letter-spacing:.28em; text-transform:uppercase;
  color:#fff; background:#C8321E; box-shadow:0 0 0 3px #2A1A14, 0 0 28px rgba(200,50,30,.55); animation:atvOn 2.4s ease-in-out infinite; }
.atv-onair i{ width:10px; height:10px; border-radius:50%; background:#fff; box-shadow:0 0 10px #fff; }
@keyframes atvOn{ 0%,100%{ opacity:1; } 50%{ opacity:.72; box-shadow:0 0 0 3px #2A1A14, 0 0 8px rgba(200,50,30,.25); } }

/* ---- телевизорът ---- */
.atv-tv{ position:relative; max-width:980px; margin:0 auto; padding-top:60px; }
.atv-ant{ position:absolute; top:0; left:50%; width:240px; height:70px; margin-left:-120px; pointer-events:none; }
.atv-ant::before, .atv-ant::after{ content:''; position:absolute; bottom:6px; left:50%; width:3px; height:78px; background:#3A2A22; border-radius:2px; transform-origin:bottom; }
.atv-ant::before{ transform:rotate(-34deg); } .atv-ant::after{ transform:rotate(30deg); }
.atv-ant i{ position:absolute; bottom:0; left:50%; width:44px; height:18px; margin-left:-22px; border-radius:22px 22px 4px 4px; background:#3A2A22; }
.atv-body{ position:relative; display:grid; grid-template-columns:minmax(0,1fr) 150px; gap:22px; padding:26px;
  border-radius:34px; background:linear-gradient(160deg, #7A4B33, #5B3525 55%, #4A2B1E);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.18), inset 0 -6px 0 rgba(0,0,0,.25), 0 40px 70px -36px rgba(40,20,10,.8); }
.atv-body::before{ content:''; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background:repeating-linear-gradient(95deg, rgba(255,255,255,.035) 0 3px, transparent 3px 9px); }
.atv-bezel{ position:relative; border-radius:26px; padding:14px; background:#1E1714; box-shadow:inset 0 0 0 2px #0E0A08, inset 0 8px 20px rgba(0,0,0,.6); }
.atv-screen{ position:relative; aspect-ratio:16/9; border-radius:20px / 26px; overflow:hidden; background:#0C0C0C; }
.atv-screen img, .atv-screen iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; display:block; object-fit:cover; }
.atv-screen::after{ content:''; position:absolute; inset:0; pointer-events:none; z-index:3; border-radius:inherit;
  background:repeating-linear-gradient(0deg, rgba(0,0,0,.16) 0 1px, transparent 1px 3px),
             radial-gradient(120% 90% at 50% 50%, transparent 55%, rgba(0,0,0,.55) 100%);
  box-shadow:inset 0 0 60px rgba(0,0,0,.5); }
.atv-screen.playing::after{ opacity:.35; }
.atv-glare{ position:absolute; inset:0; z-index:4; pointer-events:none; border-radius:inherit;
  background:linear-gradient(125deg, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 32%); }
.atv-static{ position:absolute; inset:-20%; z-index:5; pointer-events:none; opacity:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 1.4 0'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E");
  background-color:#222; }
.atv-screen.switching .atv-static{ animation:atvStatic .55s steps(6) both; }
@keyframes atvStatic{ 0%{ opacity:1; transform:translate(0,0); } 30%{ transform:translate(-6%,4%); } 60%{ transform:translate(5%,-3%); opacity:.9; } 100%{ opacity:0; transform:translate(0,0); } }
.atv-play{ position:absolute; left:50%; top:50%; z-index:6; width:92px; height:92px; margin:-46px 0 0 -46px; border-radius:50%; border:0; cursor:pointer;
  background:rgba(200,50,30,.92); color:#fff; display:grid; place-items:center; box-shadow:0 0 0 8px rgba(255,255,255,.18), 0 16px 34px rgba(0,0,0,.5);
  transition:transform .3s cubic-bezier(.34,1.4,.5,1), background .3s; }
.atv-play:hover{ transform:scale(1.1); background:#D8391F; }
.atv-play svg{ width:34px; height:34px; margin-left:5px; }
.atv-osd{ position:absolute; left:18px; right:18px; bottom:14px; z-index:6; display:flex; justify-content:space-between; align-items:flex-end; gap:12px; pointer-events:none;
  font-family:'Manrope',sans-serif; color:#fff; text-shadow:0 2px 8px rgba(0,0,0,.8); }
.atv-osd b{ font-size:clamp(15px,1.8vw,20px); font-weight:800; }
.atv-osd span{ font-size:12px; font-weight:800; letter-spacing:.18em; color:#7CFF9B; font-variant-numeric:tabular-nums; }
.atv-screen.playing .atv-osd, .atv-screen.playing .atv-play{ display:none; }
.atv-panel{ position:relative; display:flex; flex-direction:column; align-items:center; gap:16px; padding:10px 0; }
.atv-led{ width:100%; padding:10px 8px; border-radius:10px; background:#0F1A12; box-shadow:inset 0 2px 8px rgba(0,0,0,.7);
  font-family:'Courier New',monospace; font-weight:700; font-size:26px; letter-spacing:.12em; text-align:center; color:#7CFF9B; text-shadow:0 0 10px rgba(124,255,155,.7); }
.atv-led small{ display:block; font-size:10px; letter-spacing:.2em; color:#4F9A64; text-shadow:none; }
.atv-knob{ position:relative; width:74px; height:74px; border-radius:50%; border:0; cursor:pointer;
  background:radial-gradient(circle at 35% 30%, #F0E2CC, #B79E7C 55%, #7E6647); box-shadow:0 8px 16px -6px rgba(0,0,0,.6), inset 0 -3px 6px rgba(0,0,0,.25);
  transition:transform .6s cubic-bezier(.34,1.4,.5,1); }
.atv-knob::after{ content:''; position:absolute; top:8px; left:50%; width:4px; height:20px; margin-left:-2px; border-radius:2px; background:#4A2B1E; }
.atv-knob span{ position:absolute; left:0; right:0; bottom:-22px; font-family:'Manrope',sans-serif; font-size:10px; font-weight:800; letter-spacing:.16em; color:#F3E4D0; text-transform:uppercase; }
.atv-knob-row{ display:flex; gap:12px; margin-top:6px; }
.atv-ch{ width:52px; height:40px; border-radius:10px; border:0; cursor:pointer; background:#2A1C16; color:#F3E4D0;
  font-family:'Manrope',sans-serif; font-weight:800; font-size:13px; box-shadow:inset 0 -3px 0 rgba(0,0,0,.4), 0 4px 8px -4px rgba(0,0,0,.6); transition:transform .15s; }
.atv-ch:active{ transform:translateY(2px); box-shadow:inset 0 -1px 0 rgba(0,0,0,.4); }
.atv-grill{ width:100%; flex:1; min-height:60px; border-radius:10px; background:repeating-linear-gradient(0deg, #2A1C16 0 3px, transparent 3px 8px); opacity:.8; }
.atv-power{ width:12px; height:12px; border-radius:50%; background:#FF4A2E; box-shadow:0 0 10px #FF4A2E; animation:atvOn 2.4s ease-in-out infinite; }
.atv-legs{ display:flex; justify-content:space-between; padding:0 12%; }
.atv-legs i{ width:16px; height:34px; background:#3A2A22; border-radius:0 0 6px 6px; }
.atv-legs i:first-child{ transform:skewX(12deg); } .atv-legs i:last-child{ transform:skewX(-12deg); }
@media (max-width:760px){
  .atv-body{ grid-template-columns:1fr; padding:14px; border-radius:24px; gap:14px; }
  .atv-bezel{ padding:8px; border-radius:18px; }
  .atv-panel{ flex-direction:row; flex-wrap:wrap; justify-content:center; padding:0 0 6px; gap:12px; }
  .atv-led{ width:auto; font-size:20px; padding:8px 14px; }
  .atv-knob{ width:52px; height:52px; } .atv-knob span, .atv-grill{ display:none; }
  .atv-knob-row{ margin-top:0; }
  .atv-play{ width:66px; height:66px; margin:-33px 0 0 -33px; } .atv-play svg{ width:26px; height:26px; }
  .atv-ant{ transform:scale(.7); transform-origin:bottom; }
}

/* ---- рафтът с касети ---- */
.atv-shelf{ margin-top:26px; padding:28px clamp(16px,2.6vw,34px) 0; border-radius:16px 16px 0 0; background:linear-gradient(180deg, rgba(160,71,46,.06), rgba(160,71,46,.12)); }
.atv-tapes{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:clamp(12px,1.6vw,20px) clamp(10px,1.4vw,18px); }
.atv-plank{ height:18px; border-radius:0 0 8px 8px; background:linear-gradient(180deg, #8C5A3C, #6B4128); box-shadow:0 14px 24px -14px rgba(40,20,10,.7); margin-bottom:6px; }
.atv-tape{ position:relative; display:block; width:100%; border:0; padding:0; background:none; cursor:pointer; text-align:left; font:inherit;
  transition:transform .4s cubic-bezier(.34,1.4,.5,1); }
.atv-tape:hover{ transform:translateY(-8px) rotate(-1.5deg); }
.atv-tape.on{ transform:translateY(-12px); }
.atv-case{ position:relative; display:block; aspect-ratio:1.75; border-radius:8px; background:linear-gradient(180deg, #2A2A2A, #161616);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12), 0 14px 22px -14px rgba(0,0,0,.8); padding:8% 7% 0; }
.atv-tape.on .atv-case{ box-shadow:inset 0 1px 0 rgba(255,255,255,.12), 0 0 0 3px #C8321E, 0 18px 26px -14px rgba(200,50,30,.7); }
.atv-label{ display:flex; align-items:center; gap:8px; height:46%; border-radius:4px; background:#FFF8EA; padding:4px 6px; overflow:hidden;
  background-image:linear-gradient(180deg, transparent 0 62%, rgba(160,71,46,.9) 62% 72%, transparent 72%); }
.atv-label img{ height:100%; aspect-ratio:4/3; object-fit:cover; border-radius:2px; flex:0 0 auto; background:#ddd; }
.atv-label b{ font-family:'Marck Script',cursive; font-weight:400; font-size:clamp(16px,1.6vw,21px); line-height:1; color:#2B2B2B; white-space:nowrap; }
.atv-window{ position:absolute; left:22%; right:22%; bottom:12%; height:26%; border-radius:6px; background:rgba(40,40,40,.9);
  box-shadow:inset 0 0 0 2px #3A3A3A; display:flex; justify-content:space-between; align-items:center; padding:0 8%; }
.atv-reel{ width:34%; aspect-ratio:1; border-radius:50%; max-height:90%;
  background:radial-gradient(circle, #EEE 0 18%, transparent 19%), conic-gradient(#CFCFCF 0 12%, #5A5A5A 12% 33%, #CFCFCF 33% 45%, #5A5A5A 45% 66%, #CFCFCF 66% 78%, #5A5A5A 78%); }
.atv-tape.on .atv-reel{ animation:atvReel 1.6s linear infinite; }
@keyframes atvReel{ to{ transform:rotate(360deg); } }
.atv-ep{ display:block; margin-top:10px; font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--brick); }
@media (max-width:1000px){ .atv-tapes{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:560px){ .atv-tapes{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* ---- екипът на клапи ---- */
.atv-crew{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(14px,2vw,24px); margin-top:26px; }
.atv-clap{ position:relative; padding-top:34px; }
.atv-clap-top{ position:absolute; top:0; left:0; right:0; height:30px; border-radius:6px 6px 2px 2px; transform-origin:8px 100%;
  background:repeating-linear-gradient(-55deg, #1E1E1E 0 16px, #F3EADF 16px 32px); transform:rotate(-14deg);
  transition:transform .35s cubic-bezier(.5,-0.5,.3,1.6); box-shadow:0 4px 8px -4px rgba(0,0,0,.5); }
.atv-clap:hover .atv-clap-top, .atv-clap.snap .atv-clap-top{ transform:rotate(0); }
.atv-clap-body{ background:#1E1E1E; color:#F3EADF; border-radius:4px 4px 12px 12px; padding:22px 20px 22px; min-height:210px;
  box-shadow:0 22px 40px -24px rgba(0,0,0,.7); }
.atv-clap-body::before{ content:''; display:block; height:8px; margin:-22px -20px 18px; background:repeating-linear-gradient(-55deg, #1E1E1E 0 16px, #F3EADF 16px 32px); opacity:.9; }
.atv-clap-body small{ display:block; font-family:'Courier New',monospace; font-size:11px; letter-spacing:.14em; color:#9F9486; margin-bottom:8px; }
.atv-clap-body b{ display:block; font-family:'Marck Script',cursive; font-weight:400; font-size:34px; line-height:1; color:#fff; margin-bottom:10px; }
.atv-clap-body p{ margin:0; font-size:14px; line-height:1.6; color:#D8CEC1; }
@media (max-width:1000px){ .atv-crew{ grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:30px; } }
@media (max-width:520px){ .atv-crew{ grid-template-columns:1fr; } }

/* ---- REC ---- */
.atv-rec{ text-align:center; margin-top:clamp(56px,7vw,90px); }
.atv-rec a{ display:inline-flex; align-items:center; gap:16px; padding:18px 32px 18px 22px; border-radius:999px; text-decoration:none;
  background:#1E1E1E; color:#fff; font-family:'Manrope',sans-serif; font-weight:800; font-size:16px; letter-spacing:.04em;
  box-shadow:0 20px 40px -20px rgba(0,0,0,.7); transition:transform .3s cubic-bezier(.34,1.4,.5,1); }
.atv-rec a:hover{ transform:translateY(-3px) scale(1.03); }
.atv-rec a i{ width:22px; height:22px; border-radius:50%; background:#E0341C; box-shadow:0 0 0 5px rgba(224,52,28,.25); animation:atvOn 1.4s ease-in-out infinite; }
.atv-rec a em{ font-style:normal; font-family:'Courier New',monospace; color:#E0341C; letter-spacing:.2em; }
.atv-rec p{ margin:16px 0 0; color:var(--ink-soft); font-size:14px; }
@media (prefers-reduced-motion:reduce){ .atv-onair span, .atv-power, .atv-rec a i, .atv-tape.on .atv-reel{ animation:none; } }

/* ===========================================================================
   61. АЛЕКОЗНАЙКО — КЛАСНАТА СТАЯ (alekoznaiko.html)
   Балон „Знаеше ли, че…“ с факти, черна дъска с уроците като полароидни
   снимки на магнити, прожекционен екран, който се спуска, и кутия „Питай ме“,
   която праща въпроса направо в чата. Класовете са с представка zk-.
=========================================================================== */
.zk-block{ margin-top:clamp(56px,7vw,90px); }
.zk-h{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(26px,3vw,36px); line-height:1.15; color:var(--ink); margin:6px 0 0; }

/* ---- знаеше ли, че ---- */
.zk-hero{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:clamp(20px,4vw,56px); align-items:end; max-width:1000px; margin:0 auto; }
.zk-me{ position:relative; width:clamp(130px,17vw,200px); }
.zk-me img{ width:100%; height:auto; display:block; position:relative; z-index:1; animation:zkBob 3.6s ease-in-out infinite; transform-origin:50% 100%; cursor:pointer; }
.zk-me::after{ content:''; position:absolute; left:12%; right:12%; bottom:-6px; height:16px; border-radius:50%; background:rgba(40,50,30,.22); filter:blur(3px); animation:zkShadow 3.6s ease-in-out infinite; }
@keyframes zkBob{ 0%,100%{ transform:translateY(0) rotate(-1deg); } 50%{ transform:translateY(-10px) rotate(1.5deg); } }
@keyframes zkShadow{ 0%,100%{ transform:scaleX(1); opacity:1; } 50%{ transform:scaleX(.8); opacity:.6; } }
.zk-me.hop img{ animation:zkHop .6s cubic-bezier(.3,1.6,.5,1); }
@keyframes zkHop{ 0%{ transform:translateY(0); } 40%{ transform:translateY(-34px) rotate(-6deg); } 100%{ transform:translateY(0); } }
.zk-bubble{ position:relative; background:#FFFEF8; border-radius:28px; padding:clamp(24px,3vw,36px) clamp(24px,3vw,40px);
  box-shadow:0 0 0 3px var(--ink), 8px 10px 0 0 var(--brick); margin-bottom:40px; }
.zk-bubble::before{ content:''; position:absolute; left:-26px; bottom:34px; width:40px; height:34px; background:#FFFEF8;
  clip-path:polygon(100% 0, 0 100%, 100% 70%); filter:drop-shadow(-3px 0 0 var(--ink)); }
.zk-bubble .zk-k{ display:flex; justify-content:space-between; align-items:center; gap:12px; font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:var(--brick); margin-bottom:12px; }
.zk-bubble .zk-k span{ color:var(--ink-soft); letter-spacing:.1em; }
.zk-fact{ font-family:'Fraunces',serif; font-size:clamp(22px,2.6vw,32px); line-height:1.3; color:var(--ink); margin:0 0 20px; min-height:2.6em; transition:opacity .3s, transform .3s; }
.zk-fact.out{ opacity:0; transform:translateY(8px); }
.zk-more{ display:inline-flex; align-items:center; gap:10px; border:0; cursor:pointer; padding:12px 22px; border-radius:999px; background:var(--brick); color:#fff;
  font-family:'Manrope',sans-serif; font-weight:800; font-size:14px; transition:transform .3s cubic-bezier(.34,1.4,.5,1), background .3s; }
.zk-more:hover{ transform:translateY(-2px); background:var(--brick-deep); }
.zk-more svg{ width:18px; height:18px; transition:transform .5s; }
.zk-more:hover svg{ transform:rotate(180deg); }
.zk-name{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(34px,4.4vw,54px); line-height:1; margin:0 0 10px; color:var(--ink); }
.zk-lead{ margin:0 0 26px; font-size:17px; line-height:1.7; color:var(--ink-soft); max-width:56ch; }
@media (max-width:700px){ .zk-hero{ grid-template-columns:1fr; justify-items:center; text-align:center; } .zk-bubble{ margin-bottom:0; text-align:left; } .zk-bubble::before{ left:50%; bottom:auto; top:-28px; transform:rotate(90deg); } .zk-me{ order:2; } }

/* ---- прожекционният екран ---- */
.zk-proj{ max-width:900px; margin:0 auto; position:relative; }
.zk-roller{ position:relative; z-index:2; height:22px; margin:0 -14px; border-radius:11px; background:linear-gradient(180deg, #5E5E5E, #2E2E2E); box-shadow:0 8px 14px -8px rgba(0,0,0,.6); }
.zk-roller::before, .zk-roller::after{ content:''; position:absolute; top:3px; width:16px; height:16px; border-radius:50%; background:#1E1E1E; }
.zk-roller::before{ left:4px; } .zk-roller::after{ right:4px; }
.zk-sheet{ position:relative; margin:0 6px; overflow:hidden; max-height:0; transition:max-height 1.1s cubic-bezier(.5,0,.2,1); }
.zk-proj.down .zk-sheet{ max-height:900px; }
.zk-sheet-in{ background:#FAFAF7; padding:18px 18px 34px; box-shadow:inset 0 0 0 1px rgba(0,0,0,.06); }
.zk-sheet video{ width:100%; aspect-ratio:16/9; display:block; background:#111; border-radius:4px; }
.zk-sheet-cap{ display:flex; justify-content:space-between; gap:12px; margin-top:12px; font-family:'Manrope',sans-serif; font-size:13px; color:var(--ink-soft); }
.zk-sheet-cap b{ color:var(--ink); }
.zk-pull{ position:absolute; left:50%; bottom:-30px; width:4px; height:30px; margin-left:-2px; background:#3A3A3A; }
.zk-pull::after{ content:''; position:absolute; bottom:-10px; left:50%; width:18px; height:14px; margin-left:-9px; border-radius:50% 50% 6px 6px; background:#3A3A3A; }
.zk-hint{ text-align:center; margin:18px 0 0; font-family:'Marck Script',cursive; font-size:24px; color:var(--brick-deep); transition:opacity .4s; }
.zk-proj.down + .zk-hint{ opacity:0; height:0; margin:0; overflow:hidden; }

/* ---- черната дъска ---- */
.zk-board{ position:relative; margin-top:60px; border-radius:10px; padding:clamp(26px,4vw,48px) clamp(20px,4vw,48px) clamp(56px,6vw,70px);
  background-color:#2F4A3A;
  background-image:radial-gradient(60% 40% at 25% 30%, rgba(255,255,255,.07), transparent 70%),
                   radial-gradient(40% 30% at 80% 70%, rgba(255,255,255,.05), transparent 70%),
                   radial-gradient(rgba(0,0,0,.18) 1px, transparent 1.4px);
  background-size:auto, auto, 5px 5px;
  box-shadow:inset 0 0 0 14px #8A5A34, inset 0 0 0 16px #6B4226, inset 0 0 40px rgba(0,0,0,.45), 0 30px 60px -34px rgba(20,30,20,.8); color:rgba(255,255,255,.9); }
.zk-chalk-title{ font-family:'Marck Script',cursive; font-weight:400; font-size:clamp(34px,4.6vw,56px); line-height:1.05; text-align:center; margin:6px 0 4px; color:rgba(255,255,255,.9);
  text-shadow:0 0 1px rgba(255,255,255,.6), 0 0 8px rgba(255,255,255,.12); }
.zk-chalk-sub{ text-align:center; font-family:'Marck Script',cursive; font-size:22px; color:rgba(255,236,160,.8); margin:0 0 30px; }
.zk-doodle{ position:absolute; pointer-events:none; color:rgba(255,255,255,.45); }
.zk-doodle.d1{ left:4%; top:12%; width:70px; } .zk-doodle.d2{ right:5%; top:10%; width:60px; } .zk-doodle.d3{ right:8%; bottom:16%; width:90px; }
.zk-pics{ position:relative; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(18px,3vw,36px); max-width:880px; margin:0 auto; }
.zk-pic{ position:relative; display:block; border:0; cursor:pointer; background:#FFFEF8; padding:10px 10px 0; border-radius:3px; text-align:center; font:inherit;
  box-shadow:0 18px 30px -16px rgba(0,0,0,.7); transition:transform .45s cubic-bezier(.34,1.4,.5,1); }
.zk-pic:nth-child(1){ transform:rotate(-4deg); } .zk-pic:nth-child(2){ transform:rotate(2.5deg) translateY(12px); } .zk-pic:nth-child(3){ transform:rotate(-1.5deg); }
.zk-pic:hover{ transform:rotate(0) translateY(-8px) scale(1.03); z-index:2; }
.zk-pic.on{ box-shadow:0 0 0 4px #FFD95E, 0 18px 30px -16px rgba(0,0,0,.7); }
.zk-pic::before{ content:''; position:absolute; top:-10px; left:50%; width:26px; height:26px; margin-left:-13px; border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #FFE59A, #E0A930 60%, #9C6C12); box-shadow:0 5px 7px -2px rgba(0,0,0,.5); z-index:2; }
.zk-pic:nth-child(2)::before{ background:radial-gradient(circle at 35% 30%, #BFE4FF, #3E86C8 60%, #1D4E7C); }
.zk-pic:nth-child(3)::before{ background:radial-gradient(circle at 35% 30%, #FFC2B0, #D2553F 60%, #8A2A1A); }
.zk-pic img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block; background:#ddd; }
.zk-pic .zk-play{ position:absolute; left:50%; top:calc(10px + (100% - 64px) / 2); width:52px; height:52px; margin:-26px 0 0 -26px; border-radius:50%;
  background:rgba(255,254,248,.92); color:var(--brick-deep); display:grid; place-items:center; box-shadow:0 6px 16px rgba(0,0,0,.35); transition:transform .3s; }
.zk-pic:hover .zk-play{ transform:scale(1.12); }
.zk-pic .zk-play svg{ width:20px; height:20px; margin-left:3px; }
.zk-pic b{ display:block; font-family:'Marck Script',cursive; font-weight:400; font-size:22px; line-height:1.1; color:#2B2B2B; padding:10px 4px 4px; }
.zk-pic small{ display:block; font-family:'Manrope',sans-serif; font-size:10px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:#8A8A8A; padding-bottom:12px; }
.zk-tray{ position:absolute; left:6%; right:6%; bottom:14px; height:14px; border-radius:3px; background:#7A4E2C; box-shadow:0 4px 0 #5A3820; }
.zk-tray i{ position:absolute; bottom:12px; height:9px; border-radius:3px; background:#F4F1E8; }
.zk-tray i:nth-child(1){ left:18%; width:46px; transform:rotate(-4deg); } .zk-tray i:nth-child(2){ left:26%; width:30px; background:#FFD2D2; }
.zk-tray i:nth-child(3){ left:31%; width:26px; background:#FFF0A8; transform:rotate(5deg); }
.zk-tray b{ position:absolute; right:14%; bottom:12px; width:70px; height:22px; border-radius:4px; background:linear-gradient(180deg, #D9C4A0 0 55%, #3A3A3A 55%); }
@media (max-width:700px){ .zk-pics{ grid-template-columns:1fr; max-width:320px; } .zk-pic:nth-child(n){ transform:rotate(-1deg); } .zk-doodle{ display:none; } }

/* ---- питай ме ---- */
.zk-ask{ max-width:820px; margin:26px auto 0; }
.zk-ask form{ display:flex; gap:10px; background:#FFFEF8; border-radius:999px; padding:8px; box-shadow:0 0 0 3px var(--ink), 6px 8px 0 0 var(--brick); }
.zk-ask input{ flex:1; min-width:0; border:0; background:transparent; padding:12px 18px; font-family:'Fraunces',serif; font-size:clamp(18px,2vw,22px); color:var(--ink); outline:none; }
.zk-ask button[type="submit"]{ border:0; cursor:pointer; padding:12px 24px; border-radius:999px; background:var(--brick); color:#fff; font-family:'Manrope',sans-serif; font-weight:800; font-size:14px; white-space:nowrap; }
.zk-ask button[type="submit"]:hover{ background:var(--brick-deep); }
.zk-chips{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:22px; }
.zk-chips button{ border:1px solid var(--line,#E7DDCD); background:var(--cream-3,#FBF8F1); cursor:pointer; padding:10px 16px; border-radius:999px;
  font-family:'Manrope',sans-serif; font-size:14px; font-weight:600; color:var(--ink); transition:border-color .2s, transform .2s, background .2s; }
.zk-chips button:hover{ border-color:var(--brick); background:#fff; transform:translateY(-2px); }
.zk-err{ min-height:20px; margin:10px 0 0; text-align:center; font-size:13px; color:#A0472E; }
@media (max-width:520px){ .zk-ask form{ border-radius:22px; flex-direction:column; } }
@media (prefers-reduced-motion:reduce){ .zk-me img, .zk-me::after{ animation:none; } .zk-sheet{ transition:none; } }

/* ===========================================================================
   62. ЗА РОДИТЕЛИ — ТАБЛО ЗА РОДИТЕЛЯ (roditeli.html)
   Първо полезното: търсачка, бързи бутони и „днес“. После разделите като
   папка с цветни разделители — всеки със своя цвят и своя начин да се
   намери нужното. Класовете са с представка rp-.
=========================================================================== */
[data-theme="roditeli"] .rp-sec{ scroll-margin-top:96px; }
.rp-h{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(26px,3vw,36px); line-height:1.15; color:var(--ink); margin:0; }
.rp-lead{ margin:8px 0 0; font-size:16px; line-height:1.65; color:var(--ink-soft); max-width:62ch; }

/* ---- търсачката ---- */
.rp-search{ position:relative; max-width:780px; margin:0 auto; z-index:5; }
.rp-search-box{ display:flex; align-items:center; gap:12px; background:#fff; border-radius:18px; padding:8px 8px 8px 22px;
  box-shadow:0 0 0 1px var(--line,#E7DDCD), 0 20px 40px -26px rgba(107,54,80,.5); transition:box-shadow .25s; }
.rp-search-box:focus-within{ box-shadow:0 0 0 2px var(--brick), 0 20px 40px -26px rgba(107,54,80,.6); }
.rp-search-box svg{ width:22px; height:22px; color:var(--brick); flex:0 0 auto; }
.rp-search input{ flex:1; min-width:0; border:0; outline:none; background:transparent; padding:14px 0; font-family:'Fraunces',serif; font-size:clamp(17px,1.9vw,21px); color:var(--ink); }
.rp-search input::placeholder{ color:#A89C92; }
.rp-clear{ border:0; background:var(--brick-bg); color:var(--brick-deep); width:36px; height:36px; border-radius:50%; cursor:pointer; font-size:16px; display:none; }
.rp-search.has .rp-clear{ display:block; }
.rp-results{ position:absolute; left:0; right:0; top:calc(100% + 8px); background:#fff; border-radius:16px; padding:8px; display:none;
  box-shadow:0 0 0 1px var(--line,#E7DDCD), 0 26px 50px -24px rgba(40,20,30,.45); max-height:420px; overflow:auto; }
.rp-search.has .rp-results{ display:block; }
.rp-results button{ display:flex; align-items:center; gap:12px; width:100%; border:0; background:none; text-align:left; cursor:pointer; padding:11px 12px; border-radius:10px; font:inherit; }
.rp-results button:hover, .rp-results button.sel{ background:var(--brick-bg); }
.rp-results .tag{ flex:0 0 auto; font-family:'Manrope',sans-serif; font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; padding:4px 8px; border-radius:6px; color:#fff; background:var(--tc,#8C4B66); }
.rp-results .txt{ font-size:15px; color:var(--ink); line-height:1.35; }
.rp-results .txt small{ display:block; color:var(--ink-soft); font-size:13px; }
.rp-results mark{ background:#FFE58A; color:inherit; border-radius:3px; padding:0 1px; }
.rp-none{ padding:14px; font-size:14px; color:var(--ink-soft); }
.rp-hint{ text-align:center; margin:12px 0 0; font-size:13px; color:var(--ink-soft); }
.rp-hint button{ border:0; background:none; color:var(--brick); font:inherit; font-weight:700; cursor:pointer; text-decoration:underline; text-underline-offset:3px; padding:0 2px; }

/* ---- бързите бутони ---- */
.rp-quick{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:14px; margin-top:34px; }
.rp-q{ position:relative; display:flex; flex-direction:column; gap:10px; padding:20px 16px 18px; border-radius:18px; text-decoration:none; color:var(--ink);
  background:var(--cream-3,#FBF8F1); border:1px solid var(--line,#E7DDCD); overflow:hidden;
  transition:transform .35s cubic-bezier(.34,1.4,.5,1), border-color .3s, box-shadow .35s; }
.rp-q::after{ content:''; position:absolute; left:0; right:0; top:0; height:5px; background:var(--tc); }
.rp-q:hover{ transform:translateY(-5px); border-color:var(--tc); box-shadow:0 20px 34px -22px rgba(40,20,30,.45); }
.rp-q .ic{ width:46px; height:46px; border-radius:14px; background:var(--tb); color:var(--tc); padding:11px; }
.rp-q .ic svg{ width:100%; height:100%; display:block; }
.rp-q b{ font-family:'Fraunces',serif; font-weight:400; font-size:18px; line-height:1.2; }
.rp-q small{ font-size:12.5px; color:var(--ink-soft); line-height:1.4; }
.rp-q .ext{ position:absolute; right:12px; top:14px; font-size:13px; color:var(--tc); }
@media (max-width:1100px){ .rp-quick{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:560px){ .rp-quick{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .rp-q{ padding:16px 14px; } }

/* ---- лентата „днес“ ---- */
.rp-today{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:22px; }
.rp-today > div{ display:flex; align-items:center; gap:16px; padding:18px 20px; border-radius:16px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.rp-today .big{ flex:0 0 auto; width:62px; height:62px; border-radius:16px; display:grid; place-items:center; text-align:center; line-height:1;
  background:var(--brick); color:#fff; font-family:'Fraunces',serif; font-size:26px; }
.rp-today .big small{ display:block; font-family:'Manrope',sans-serif; font-size:9.5px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; opacity:.85; margin-top:3px; }
.rp-today .big.b2{ background:#4F72A8; }
.rp-today b{ display:block; font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:4px; }
.rp-today span{ font-size:15.5px; line-height:1.45; color:var(--ink); }
.rp-today a{ color:var(--brick); font-weight:700; }
@media (max-width:760px){ .rp-today{ grid-template-columns:1fr; } }

/* ---- разделите като папка с разделители ---- */
.rp-sec{ position:relative; margin-top:clamp(64px,8vw,100px); padding-top:40px; border-top:2px solid var(--tc); }
.rp-tab{ position:absolute; top:-2px; left:0; transform:translateY(-100%); display:inline-flex; align-items:center; gap:8px;
  padding:9px 18px 8px; border-radius:12px 12px 0 0; background:var(--tc); color:#fff;
  font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.rp-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; margin-bottom:26px; }
.rp-dl{ display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border-radius:999px; text-decoration:none; font-family:'Manrope',sans-serif; font-weight:700; font-size:13px;
  color:var(--tc); background:var(--tb); transition:transform .2s; white-space:nowrap; }
.rp-dl:hover{ transform:translateY(-2px); }
.rp-dl svg{ width:16px; height:16px; }

/* ---- срещи с учители ---- */
.rp-filter{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:18px; }
.rp-chip{ border:1px solid var(--line,#E7DDCD); background:#fff; cursor:pointer; padding:9px 15px; border-radius:999px;
  font-family:'Manrope',sans-serif; font-size:13.5px; font-weight:700; color:var(--ink); transition:background .2s, color .2s, border-color .2s; }
.rp-chip:hover{ border-color:var(--tc); }
.rp-chip.on{ background:var(--tc); border-color:var(--tc); color:#fff; }
.rp-chip .n{ opacity:.6; font-weight:600; margin-left:4px; }
.rp-find{ flex:1; min-width:200px; border:1px solid var(--line,#E7DDCD); border-radius:999px; padding:10px 16px; font:inherit; font-size:14px; outline:none; background:#fff; }
.rp-find:focus{ border-color:var(--tc); }
.rp-cards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:12px; }
.rp-t{ position:relative; padding:16px 18px; border-radius:14px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); transition:box-shadow .25s, transform .25s; }
.rp-t:hover{ transform:translateY(-2px); box-shadow:0 0 0 1px var(--tc), 0 14px 26px -18px rgba(40,20,30,.4); }
.rp-t b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:18px; line-height:1.2; color:var(--ink); margin-bottom:10px; padding-right:48px; }
.rp-t .row{ display:flex; flex-wrap:wrap; gap:6px 14px; font-size:13.5px; color:var(--ink-soft); }
.rp-t .row span{ display:inline-flex; align-items:center; gap:6px; }
.rp-t .row svg{ width:14px; height:14px; color:var(--tc); }
.rp-t .today{ position:absolute; right:12px; top:12px; font-family:'Manrope',sans-serif; font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  color:#fff; background:#3E7A5A; padding:4px 8px; border-radius:6px; }
.rp-t.flash, .rp-item.flash{ animation:rpFlash 1.8s ease; }
@keyframes rpFlash{ 0%,40%{ box-shadow:0 0 0 3px #FFD95E, 0 0 0 9px rgba(255,217,94,.35); } 100%{ box-shadow:0 0 0 1px var(--line,#E7DDCD); } }
.rp-empty{ padding:24px; text-align:center; color:var(--ink-soft); font-size:15px; display:none; }

/* ---- родителски срещи: линия на годината ---- */
.rp-year{ margin-top:40px; }
.rp-year h3{ font-family:'Fraunces',serif; font-weight:400; font-size:24px; margin:0 0 20px; color:var(--ink); }
.rp-line{ position:relative; display:grid; gap:14px; padding-left:34px; }
.rp-line::before{ content:''; position:absolute; left:11px; top:6px; bottom:6px; width:2px; background:repeating-linear-gradient(180deg, var(--tc) 0 6px, transparent 6px 12px); opacity:.5; }
.rp-m{ position:relative; padding:14px 18px; border-radius:14px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.rp-m::before{ content:''; position:absolute; left:-29px; top:18px; width:14px; height:14px; border-radius:50%; background:#fff; border:3px solid var(--tc); }
.rp-m.past{ opacity:.55; } .rp-m.past::before{ background:var(--tc); }
.rp-m.next{ box-shadow:0 0 0 2px var(--tc), 0 16px 30px -20px rgba(40,20,30,.45); }
.rp-m.next::before{ background:#FFD95E; border-color:var(--tc); box-shadow:0 0 0 5px rgba(255,217,94,.35); }
.rp-m .when{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:6px; }
.rp-m .when b{ font-family:'Fraunces',serif; font-weight:500; font-size:17px; color:var(--ink); }
.rp-m .when i{ font-style:normal; font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.08em; padding:3px 8px; border-radius:6px; background:var(--tb); color:var(--tc); }
.rp-m .when em{ font-style:normal; font-family:'Manrope',sans-serif; font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:#fff; background:var(--tc); padding:3px 8px; border-radius:6px; }
.rp-m p{ margin:0; font-size:15px; line-height:1.6; color:var(--ink-soft); }
.rp-note{ margin-top:18px; padding:14px 18px; border-radius:12px; background:var(--tb); font-size:14px; line-height:1.6; color:var(--ink); }

/* ---- втори час на класа: избор на клас ---- */
.rp-classes{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:18px; }
.rp-classes button{ min-width:62px; }
.rp-pick{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:22px; align-items:center; padding:24px 26px; border-radius:18px; background:var(--tb); margin-bottom:22px; }
.rp-pick .cls{ width:96px; height:96px; border-radius:24px; background:var(--tc); color:#fff; display:grid; place-items:center; font-family:'Fraunces',serif; font-size:34px; line-height:1; text-align:center; }
.rp-pick .cls small{ display:block; font-family:'Manrope',sans-serif; font-size:10px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; opacity:.8; margin-top:4px; }
.rp-pick b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:24px; color:var(--ink); margin-bottom:6px; }
.rp-pick span{ font-size:16px; color:var(--ink); }
.rp-pick.empty{ grid-template-columns:1fr; text-align:center; color:var(--ink-soft); }
.rp-info{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:22px; }
.rp-info div{ padding:16px 18px; border-radius:14px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.rp-info b{ display:block; font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--tc); margin-bottom:6px; }
.rp-info span{ font-size:14px; line-height:1.6; color:var(--ink-soft); }
.rp-more{ margin-top:18px; }
.rp-more summary{ cursor:pointer; font-family:'Manrope',sans-serif; font-weight:700; font-size:14px; color:var(--tc); padding:8px 0; }
@media (max-width:760px){ .rp-info{ grid-template-columns:1fr; } .rp-pick{ grid-template-columns:1fr; justify-items:center; text-align:center; } }

/* ---- бланки ---- */
.rp-rule{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; padding:18px 22px; border-radius:16px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); margin-bottom:18px; }
.rp-rule .d{ display:flex; align-items:baseline; gap:8px; }
.rp-rule .d b{ font-family:'Fraunces',serif; font-weight:500; font-size:34px; color:var(--tc); line-height:1; }
.rp-rule .d span{ font-size:14px; color:var(--ink); line-height:1.3; }
.rp-rule .sep{ width:1px; align-self:stretch; background:var(--line,#E7DDCD); }
.rp-rule p{ margin:0; flex:1; min-width:200px; font-size:14px; color:var(--ink-soft); line-height:1.55; }
.rp-forms{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.rp-form{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:16px; padding:20px; border-radius:16px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); transition:box-shadow .25s, transform .25s; }
.rp-form:hover{ transform:translateY(-3px); box-shadow:0 0 0 1px var(--tc), 0 18px 30px -22px rgba(40,20,30,.45); }
.rp-sheet{ position:relative; width:52px; height:64px; border-radius:6px; background:var(--tb); }
.rp-sheet::before{ content:''; position:absolute; right:0; top:0; width:16px; height:16px; background:linear-gradient(225deg, var(--cream,#F7F1E8) 50%, rgba(0,0,0,.12) 50%); border-radius:0 6px 0 4px; }
.rp-sheet i{ position:absolute; left:10px; right:12px; height:3px; border-radius:2px; background:var(--tc); opacity:.35; }
.rp-sheet i:nth-child(1){ top:22px; } .rp-sheet i:nth-child(2){ top:30px; } .rp-sheet i:nth-child(3){ top:38px; right:22px; }
.rp-sheet em{ position:absolute; left:-6px; bottom:6px; font-style:normal; font-family:'Manrope',sans-serif; font-size:9px; font-weight:800; letter-spacing:.06em; padding:2px 6px; border-radius:4px; background:var(--tc); color:#fff; }
.rp-form b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:18px; line-height:1.25; color:var(--ink); margin-bottom:6px; }
.rp-form p{ margin:0 0 12px; font-size:14px; line-height:1.55; color:var(--ink-soft); }
@media (max-width:760px){ .rp-forms{ grid-template-columns:1fr; } .rp-rule .sep{ display:none; } }

/* ---- униформи ---- */
.rp-uni{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:18px; }
.rp-shop{ padding:24px; border-radius:18px; background:var(--tb); }
.rp-shop b.name{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:26px; color:var(--ink); margin-bottom:4px; }
.rp-shop p{ margin:0 0 6px; font-size:15px; line-height:1.55; color:var(--ink); }
.rp-shop a.tel{ display:inline-flex; margin-top:12px; padding:10px 18px; border-radius:999px; background:var(--tc); color:#fff; text-decoration:none; font-family:'Manrope',sans-serif; font-weight:800; font-size:14px; }
.rp-periods{ display:grid; gap:10px; }
.rp-period{ display:flex; gap:14px; align-items:center; padding:14px 16px; border-radius:14px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.rp-period b{ display:block; font-size:14.5px; color:var(--ink); }
.rp-period span{ font-size:13.5px; color:var(--ink-soft); line-height:1.5; }
.rp-period svg{ flex:0 0 auto; width:22px; height:22px; color:var(--tc); }
.rp-prices{ display:flex; flex-wrap:wrap; gap:12px; margin-top:22px; align-items:center; }
.rp-price{ position:relative; padding:10px 16px 10px 28px; background:#fff; border-radius:6px 12px 12px 6px; box-shadow:0 0 0 1px var(--line,#E7DDCD); font-size:14px; color:var(--ink); }
.rp-price::before{ content:''; position:absolute; left:10px; top:50%; width:8px; height:8px; margin-top:-4px; border-radius:50%; background:var(--cream,#F7F1E8); box-shadow:inset 0 0 0 2px var(--tc); }
.rp-price b{ font-family:'Fraunces',serif; font-weight:500; color:var(--tc); margin-left:4px; }
.rp-pdf{ border:0; cursor:pointer; }
@media (max-width:760px){ .rp-uni{ grid-template-columns:1fr; } }

/* ---- учебници и е-дневник ---- */
.rp-duo{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.rp-links{ display:grid; gap:10px; }
.rp-links a{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 18px; border-radius:14px; background:#fff; text-decoration:none; color:var(--ink);
  box-shadow:0 0 0 1px var(--line,#E7DDCD); font-size:15.5px; transition:transform .2s, box-shadow .2s; }
.rp-links a:hover{ transform:translateX(4px); box-shadow:0 0 0 1px var(--tc); }
.rp-links a.main{ background:var(--tc); color:#fff; box-shadow:none; font-weight:700; }
.rp-links a span{ color:var(--tc); } .rp-links a.main span{ color:#fff; }
.rp-soon{ padding:22px; border-radius:16px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); font-size:15px; line-height:1.65; color:var(--ink-soft); }
.rp-soon b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:20px; color:var(--ink); margin-bottom:6px; }
@media (max-width:760px){ .rp-duo{ grid-template-columns:1fr; } }

/* ===========================================================================
   63. ПРИЕМ — ПЪТЯТ ДО ПЪРВИЯ ЗВЪНЕЦ (priem.html)
   Стъпките на приема са квадратчета от дама, нарисувани с тебешир; до тях —
   калкулатор „кога тръгва детето“, списък с документи за отмятане, район и
   свободни места. Фактите са по Наредбата на Община Пловдив. Представка pq-.
=========================================================================== */
[data-theme="priem"] .pq-sec{ scroll-margin-top:96px; }
.pq-h{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(26px,3vw,36px); line-height:1.15; color:var(--ink); margin:6px 0 0; }
.pq-lead{ margin:8px 0 0; font-size:16px; line-height:1.65; color:var(--ink-soft); max-width:64ch; }
.pq-sec{ margin-top:clamp(60px,8vw,96px); }

/* ---- превключвател 1. / 5. клас ---- */
.pq-switch{ display:flex; justify-content:center; gap:12px; flex-wrap:wrap; }
.pq-switch a{ display:flex; align-items:center; gap:14px; padding:14px 22px 14px 14px; border-radius:18px; text-decoration:none; color:var(--ink);
  background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); transition:transform .3s cubic-bezier(.34,1.4,.5,1), box-shadow .3s; }
.pq-switch a:hover{ transform:translateY(-4px); box-shadow:0 0 0 2px var(--brick), 0 16px 30px -20px rgba(80,50,10,.45); }
.pq-switch .n{ width:52px; height:52px; border-radius:14px; display:grid; place-items:center; background:var(--brick); color:#fff; font-family:'Fraunces',serif; font-size:26px; }
.pq-switch .n.alt{ background:#4F72A8; } .pq-switch .n.z{ background:#3E7A5A; }
.pq-switch b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:19px; }
.pq-switch small{ font-size:12.5px; color:var(--ink-soft); }

/* ---- калкулаторът на годините ---- */
.pq-age{ margin-top:30px; display:grid; grid-template-columns:auto minmax(0,1fr); gap:clamp(18px,3vw,36px); align-items:center;
  padding:clamp(22px,3vw,32px); border-radius:22px; background:var(--brick-bg); }
.pq-age label{ display:block; font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--brick-deep); margin-bottom:8px; }
.pq-age select{ font-family:'Fraunces',serif; font-size:30px; padding:8px 44px 8px 18px; border-radius:14px; border:2px solid var(--brick); background:#fff; color:var(--ink); cursor:pointer;
  appearance:none; -webkit-appearance:none; background-image:linear-gradient(45deg, transparent 50%, var(--brick) 50%), linear-gradient(135deg, var(--brick) 50%, transparent 50%);
  background-position:calc(100% - 22px) 55%, calc(100% - 15px) 55%; background-size:7px 7px; background-repeat:no-repeat; }
.pq-age-out b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:clamp(20px,2.4vw,26px); line-height:1.3; color:var(--ink); margin-bottom:6px; }
.pq-age-out span{ font-size:15px; line-height:1.6; color:var(--ink-soft); }
.pq-age-out mark{ background:#fff; color:var(--brick-deep); padding:1px 8px; border-radius:6px; font-weight:700; }
@media (max-width:640px){ .pq-age{ grid-template-columns:1fr; } }

/* ---- дамата ---- */
.pq-court{ position:relative; margin-top:28px; padding:clamp(28px,4vw,48px) clamp(16px,3vw,36px); border-radius:22px;
  background-color:#5E6064;
  background-image:radial-gradient(rgba(255,255,255,.06) 1px, transparent 1.4px), radial-gradient(rgba(0,0,0,.18) 1px, transparent 1.6px);
  background-size:7px 7px, 11px 11px; background-position:0 0, 3px 5px;
  box-shadow:inset 0 0 60px rgba(0,0,0,.35), 0 26px 50px -30px rgba(30,30,30,.7); }
.pq-hop{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; max-width:880px; margin:0 auto; counter-reset:hop; }
.pq-sq{ position:relative; border:3px solid rgba(255,255,255,.82); border-radius:6px 10px 7px 12px; padding:22px 22px 20px 70px; color:#fff; min-height:150px;
  background:rgba(255,255,255,.03); cursor:pointer; text-align:left; font:inherit; transition:background .3s, transform .35s cubic-bezier(.34,1.4,.5,1);
  filter:drop-shadow(0 0 1px rgba(255,255,255,.3)); }
.pq-sq:nth-child(odd){ transform:rotate(-.6deg); } .pq-sq:nth-child(even){ transform:rotate(.7deg); }
.pq-sq.wide{ grid-column:1 / -1; }
.pq-sq:hover{ background:rgba(255,255,255,.08); }
.pq-sq.on{ background:rgba(255,217,94,.14); border-color:#FFD95E; }
.pq-sq .num{ position:absolute; left:16px; top:14px; font-family:'Marck Script',cursive; font-size:48px; line-height:1; color:var(--c,#FFD95E); }
.pq-sq b{ display:block; font-family:'Marck Script',cursive; font-weight:400; font-size:clamp(26px,2.8vw,32px); line-height:1.05; margin-bottom:8px; color:#fff; }
.pq-sq p{ margin:0; font-size:15px; line-height:1.6; color:rgba(255,255,255,.86); }
.pq-sq ul{ margin:10px 0 0; padding-left:18px; font-size:14.5px; line-height:1.6; color:rgba(255,255,255,.86); }
.pq-sq .more{ display:block; max-height:0; overflow:hidden; transition:max-height .5s ease; }
.pq-sq.on .more{ max-height:420px; }
.pq-sq .tap{ display:inline-block; margin-top:10px; font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#FFD95E; }
.pq-sq.on .tap{ display:none; }
.pq-stone{ position:absolute; width:26px; height:20px; border-radius:48% 52% 45% 55%; background:radial-gradient(circle at 35% 30%, #F4B45F, #B4741A 60%, #6E4308);
  box-shadow:0 6px 8px -2px rgba(0,0,0,.6); transition:left .7s cubic-bezier(.34,1.4,.5,1), top .7s cubic-bezier(.34,1.4,.5,1); pointer-events:none; z-index:3; left:-40px; top:-40px; }
.pq-bell{ grid-column:1 / -1; justify-self:center; text-align:center; padding:18px 30px; border:3px dashed rgba(255,217,94,.8); border-radius:50%/40%; color:#FFD95E; }
.pq-bell b{ display:block; font-family:'Marck Script',cursive; font-weight:400; font-size:clamp(30px,3.4vw,40px); line-height:1; }
.pq-bell span{ font-size:14px; color:rgba(255,255,255,.8); }
.pq-court-note{ text-align:center; margin:22px 0 0; font-family:'Marck Script',cursive; font-size:22px; color:rgba(255,255,255,.75); }
@media (max-width:700px){ .pq-hop{ grid-template-columns:1fr; } .pq-sq{ padding-left:62px; min-height:0; } }

/* ---- документите ---- */
.pq-docs{ display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:22px; align-items:start; margin-top:26px; }
.pq-list{ background:#fff; border-radius:20px; padding:10px 8px; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.pq-chk{ display:flex; gap:16px; align-items:flex-start; padding:16px 18px; border-radius:14px; cursor:pointer; transition:background .2s; }
.pq-chk:hover{ background:var(--brick-bg); }
.pq-chk input{ position:absolute; opacity:0; pointer-events:none; }
.pq-box{ flex:0 0 auto; width:30px; height:30px; border-radius:9px; border:2px solid var(--brick); display:grid; place-items:center; transition:background .2s; margin-top:2px; }
.pq-box svg{ width:18px; height:18px; color:#fff; opacity:0; transform:scale(.4); transition:opacity .2s, transform .3s cubic-bezier(.34,1.6,.5,1); }
.pq-chk input:checked + .pq-box{ background:var(--brick); }
.pq-chk input:checked + .pq-box svg{ opacity:1; transform:none; }
.pq-chk input:focus-visible + .pq-box{ box-shadow:0 0 0 3px rgba(180,116,26,.35); }
.pq-chk b{ display:block; font-size:16px; color:var(--ink); line-height:1.35; }
.pq-chk small{ display:block; margin-top:3px; font-size:13.5px; color:var(--ink-soft); line-height:1.5; }
.pq-chk input:checked ~ span b{ text-decoration:line-through; text-decoration-color:var(--brick); opacity:.6; }
.pq-prog{ position:sticky; top:100px; padding:24px; border-radius:20px; background:var(--brick-bg); text-align:center; }
.pq-ring{ width:140px; height:140px; margin:0 auto 12px; position:relative; }
.pq-ring svg{ width:100%; height:100%; transform:rotate(-90deg); }
.pq-ring circle{ fill:none; stroke-width:12; }
.pq-ring .bg{ stroke:rgba(180,116,26,.18); } .pq-ring .fg{ stroke:var(--brick); stroke-linecap:round; transition:stroke-dashoffset .6s cubic-bezier(.34,1.2,.5,1); }
.pq-ring span{ position:absolute; inset:0; display:grid; place-items:center; font-family:'Fraunces',serif; font-size:34px; color:var(--brick-deep); }
.pq-prog b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:20px; color:var(--ink); margin-bottom:6px; }
.pq-prog p{ margin:0 0 14px; font-size:14px; line-height:1.55; color:var(--ink-soft); }
.pq-prog button{ border:0; background:none; color:var(--brick-deep); font:inherit; font-size:13px; font-weight:700; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
@media (max-width:760px){ .pq-docs{ grid-template-columns:1fr; } .pq-prog{ position:static; } }

/* ---- карти: район, наредба, разширена подготовка ---- */
.pq-cards{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:26px; }
.pq-card{ padding:22px; border-radius:18px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); display:flex; flex-direction:column; gap:10px; }
.pq-card .ic{ width:48px; height:48px; border-radius:14px; background:var(--brick-bg); color:var(--brick); padding:11px; }
.pq-card .ic svg{ width:100%; height:100%; display:block; }
.pq-card b{ font-family:'Fraunces',serif; font-weight:400; font-size:20px; line-height:1.2; color:var(--ink); }
.pq-card p{ margin:0; font-size:14.5px; line-height:1.6; color:var(--ink-soft); flex:1; }
.pq-btn{ align-self:flex-start; display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border-radius:999px; border:0; cursor:pointer; text-decoration:none;
  background:var(--brick); color:#fff; font-family:'Manrope',sans-serif; font-weight:800; font-size:13px; transition:background .2s, transform .2s; }
.pq-btn:hover{ background:var(--brick-deep); transform:translateY(-2px); }
.pq-btn svg{ width:15px; height:15px; }
.pq-duo{ display:flex; gap:8px; flex-wrap:wrap; }
.pq-duo span{ padding:8px 12px; border-radius:10px; background:var(--brick-bg); font-size:13.5px; font-weight:600; color:var(--brick-deep); }
@media (max-width:900px){ .pq-cards{ grid-template-columns:1fr; } }

/* ---- 5. клас и свободни места ---- */
.pq-pair{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.pq-five{ padding:26px; border-radius:20px; background:#E1E9F5; }
.pq-five b.t{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:24px; color:var(--ink); margin-bottom:8px; }
.pq-five p{ margin:0 0 14px; font-size:15px; line-height:1.65; color:var(--ink); }
.pq-five a{ color:#2C4570; font-weight:700; }
.pq-seats{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:22px; align-items:center; padding:26px; border-radius:20px; background:#E3EED8; }
.pq-seats .big{ font-family:'Fraunces',serif; font-size:84px; line-height:.9; color:#2E4F18; }
.pq-seats b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:22px; color:var(--ink); margin-bottom:6px; }
.pq-seats p{ margin:0; font-size:14.5px; line-height:1.6; color:var(--ink-soft); }
@media (max-width:760px){ .pq-pair{ grid-template-columns:1fr; } }

/* ===========================================================================
   64. УЧЕБЕН ПРОЦЕС — УЧИЛИЩНИЯТ ЧАСОВНИК И ГОДИНАТА (ucheben-proces.html)
   „Сега в училище“ с жив часовник и звънец, линийка на деня, годината в
   малки календарчета с ваканциите (по заповедта на МОН), обратно броене,
   контролни, консултации, екскурзии и НВО. Представка uc-.
=========================================================================== */
[data-theme="uchproc"] .uc-sec{ scroll-margin-top:96px; }
.uc-sec{ margin-top:clamp(60px,8vw,96px); }
.uc-h{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(26px,3vw,36px); line-height:1.15; color:var(--ink); margin:6px 0 0; }
.uc-lead{ margin:8px 0 22px; font-size:16px; line-height:1.65; color:var(--ink-soft); max-width:64ch; }
.uc-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:18px; flex-wrap:wrap; }
.uc-dl{ display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border-radius:999px; text-decoration:none; font-family:'Manrope',sans-serif; font-weight:700; font-size:13px; color:var(--brick-deep); background:var(--brick-bg); white-space:nowrap; transition:transform .2s; }
.uc-dl:hover{ transform:translateY(-2px); } .uc-dl svg{ width:16px; height:16px; }

/* ---- избор на клас ---- */
.uc-stage{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:8px; margin-bottom:18px; }
.uc-stage span{ font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft); margin-right:6px; }
.uc-stage button{ border:1px solid var(--line,#E7DDCD); background:#fff; cursor:pointer; padding:9px 16px; border-radius:999px; font-family:'Manrope',sans-serif; font-weight:700; font-size:14px; color:var(--ink); transition:all .2s; }
.uc-stage button.on{ background:var(--brick); border-color:var(--brick); color:#fff; }

/* ---- сега в училище ---- */
.uc-now{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:clamp(18px,3vw,36px); align-items:center;
  padding:clamp(22px,3vw,34px); border-radius:26px; background:linear-gradient(135deg, #1F4D46, #2F6F66); color:#fff; box-shadow:0 30px 60px -34px rgba(20,60,55,.8); }
.uc-clock{ position:relative; width:clamp(120px,14vw,150px); aspect-ratio:1; border-radius:50%; background:#FBF8F1; box-shadow:0 0 0 6px rgba(255,255,255,.18), inset 0 0 0 2px #1F4D46; }
.uc-clock i{ position:absolute; left:50%; bottom:50%; transform-origin:50% 100%; border-radius:3px; background:#1F2E2B; }
.uc-clock .hh{ width:6px; height:28%; margin-left:-3px; } .uc-clock .mm{ width:4px; height:38%; margin-left:-2px; } .uc-clock .ss{ width:2px; height:42%; margin-left:-1px; background:#D2553F; }
.uc-clock b{ position:absolute; left:50%; top:50%; width:12px; height:12px; margin:-6px 0 0 -6px; border-radius:50%; background:#D2553F; }
.uc-clock em{ position:absolute; left:50%; top:6px; width:2px; height:8px; margin-left:-1px; background:#1F4D46; transform-origin:50% calc(clamp(120px,14vw,150px)/2 - 6px); }
.uc-state small{ display:block; font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; opacity:.75; margin-bottom:6px; }
.uc-state b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:clamp(26px,3.2vw,40px); line-height:1.1; margin-bottom:8px; }
.uc-state span{ font-size:15.5px; opacity:.9; line-height:1.5; }
.uc-bar{ height:8px; border-radius:4px; background:rgba(255,255,255,.18); margin-top:14px; overflow:hidden; }
.uc-bar i{ display:block; height:100%; width:0; border-radius:4px; background:#FFD95E; transition:width 1s linear; }
.uc-bell{ text-align:center; min-width:130px; }
.uc-bell svg{ width:46px; height:46px; color:#FFD95E; }
.uc-bell.ring svg{ animation:ucRing 1s ease-in-out infinite; transform-origin:50% 10%; }
@keyframes ucRing{ 0%,100%{ transform:rotate(0); } 20%{ transform:rotate(14deg); } 40%{ transform:rotate(-12deg); } 60%{ transform:rotate(8deg); } 80%{ transform:rotate(-4deg); } }
.uc-bell b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:30px; line-height:1; margin-top:6px; font-variant-numeric:tabular-nums; }
.uc-bell span{ font-size:12px; opacity:.8; }
@media (max-width:760px){ .uc-now{ grid-template-columns:1fr; justify-items:center; text-align:center; } }

/* ---- линийката на деня ---- */
.uc-ruler{ position:relative; margin-top:22px; padding:16px 16px 34px; border-radius:18px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); overflow-x:auto; }
.uc-track{ position:relative; height:64px; min-width:760px; }
.uc-blk{ position:absolute; top:0; height:44px; border-radius:8px; display:flex; align-items:center; justify-content:center; font-family:'Manrope',sans-serif; font-size:12px; font-weight:800; color:#fff; overflow:hidden; white-space:nowrap; cursor:default; }
.uc-blk.l{ background:#2F6F66; } .uc-blk.o{ background:#6E9C5C; } .uc-blk.s{ background:#4F72A8; } .uc-blk.i{ background:#B5673C; }
.uc-blk.now{ box-shadow:0 0 0 3px #FFD95E; z-index:2; }
.uc-tick{ position:absolute; top:50px; font-family:'Manrope',sans-serif; font-size:11px; color:var(--ink-soft); transform:translateX(-50%); }
.uc-tick::before{ content:''; position:absolute; left:50%; top:-6px; width:1px; height:5px; background:var(--ink-soft); }
.uc-needle{ position:absolute; top:-8px; bottom:6px; width:2px; background:#D2553F; z-index:3; display:none; }
.uc-needle::before{ content:''; position:absolute; top:-5px; left:-5px; width:12px; height:12px; border-radius:50%; background:#D2553F; }
.uc-legend{ display:flex; flex-wrap:wrap; gap:14px; margin-top:12px; font-size:13px; color:var(--ink-soft); }
.uc-legend i{ display:inline-block; width:12px; height:12px; border-radius:3px; margin-right:6px; vertical-align:-1px; }
.uc-hours{ display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:8px; margin-top:16px; }
.uc-hours div{ padding:10px 12px; border-radius:10px; background:var(--brick-bg); font-size:13.5px; color:var(--ink); }
.uc-hours div b{ font-family:'Fraunces',serif; font-weight:500; margin-right:6px; color:var(--brick-deep); }
.uc-hours div.brk{ background:#FFF1BF; }
.uc-hours div.now{ box-shadow:0 0 0 2px var(--brick); }

/* ---- обратно броене ---- */
.uc-count{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:22px; }
.uc-count div{ padding:16px 18px; border-radius:16px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.uc-count b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:38px; line-height:1; color:var(--c,#2F6F66); }
.uc-count b small{ font-size:15px; margin-left:4px; color:var(--ink-soft); }
.uc-count span{ display:block; margin-top:6px; font-size:13.5px; line-height:1.4; color:var(--ink-soft); }
@media (max-width:900px){ .uc-count{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* ---- годината ---- */
.uc-year{ display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:14px; }
.uc-mon{ padding:14px 14px 12px; border-radius:16px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.uc-mon.cur{ box-shadow:0 0 0 2px var(--brick); }
.uc-mon h4{ margin:0 0 8px; display:flex; justify-content:space-between; font-family:'Fraunces',serif; font-weight:400; font-size:18px; color:var(--ink); }
.uc-mon h4 small{ font-family:'Manrope',sans-serif; font-size:11px; color:var(--ink-soft); font-weight:700; }
.uc-days{ display:grid; grid-template-columns:repeat(7,1fr); gap:2px; text-align:center; }
.uc-days span{ font-size:11.5px; line-height:24px; border-radius:6px; color:var(--ink); position:relative; font-variant-numeric:tabular-nums; }
.uc-days .wd{ font-family:'Manrope',sans-serif; font-size:9.5px; font-weight:800; color:var(--ink-soft); line-height:18px; }
.uc-days .we{ color:#B3A89E; }
.uc-days .vac{ background:#FFE8A8; color:#6E5200; }
.uc-days .off{ background:#F6D3DF; color:#732440; }
.uc-days .hol{ background:#F4C2B8; color:#7A2626; }
.uc-days .exam{ background:#D5E0F4; color:#2C4570; }
.uc-days .ev::after{ content:''; position:absolute; left:50%; bottom:1px; width:4px; height:4px; margin-left:-2px; border-radius:50%; background:#2F6F66; }
.uc-days .today{ box-shadow:inset 0 0 0 2px #D2553F; font-weight:800; }
.uc-days .out{ opacity:.35; }
.uc-days span[title]{ cursor:help; }
.uc-evs{ margin:10px 0 0; padding:0; list-style:none; font-size:12.5px; line-height:1.45; color:var(--ink-soft); }
.uc-evs li{ padding:4px 0 4px 12px; border-top:1px dashed var(--line,#E7DDCD); position:relative; }
.uc-evs li::before{ content:''; position:absolute; left:0; top:10px; width:5px; height:5px; border-radius:50%; background:var(--brick); }
.uc-key{ display:flex; flex-wrap:wrap; gap:14px; margin:0 0 16px; font-size:13px; color:var(--ink-soft); }
.uc-key i{ display:inline-block; width:14px; height:14px; border-radius:4px; margin-right:6px; vertical-align:-2px; }

/* ---- документи ---- */
.uc-docs{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:14px; }
.uc-doc{ display:flex; flex-direction:column; gap:8px; padding:20px; border-radius:16px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); text-decoration:none; color:var(--ink); transition:transform .25s, box-shadow .25s; }
.uc-doc:hover{ transform:translateY(-3px); box-shadow:0 0 0 1px var(--brick), 0 18px 30px -22px rgba(20,60,55,.5); }
.uc-doc .ic{ width:44px; height:44px; border-radius:12px; background:var(--brick-bg); color:var(--brick); padding:10px; }
.uc-doc .ic svg{ width:100%; height:100%; display:block; }
.uc-doc b{ font-family:'Fraunces',serif; font-weight:400; font-size:19px; line-height:1.2; }
.uc-doc p{ margin:0; font-size:14px; line-height:1.55; color:var(--ink-soft); flex:1; }
.uc-doc em{ font-style:normal; font-family:'Manrope',sans-serif; font-size:12px; font-weight:800; color:var(--brick); }
.uc-offdays{ display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; }
.uc-offdays span{ padding:9px 14px; border-radius:12px; background:#F6D3DF; font-size:13.5px; color:#732440; }
.uc-offdays b{ font-weight:800; margin-right:6px; }
.uc-soon{ display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.uc-soon span, .uc-soon a{ padding:10px 14px; border-radius:12px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); font-size:14px; color:var(--ink); text-decoration:none; }
.uc-soon span small{ color:var(--ink-soft); margin-left:6px; }
.uc-soon a{ box-shadow:0 0 0 2px var(--brick); font-weight:700; }

/* ---- контролни ---- */
.uc-tests{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.uc-test{ position:relative; padding:20px 20px 18px; border-radius:16px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.uc-test .m{ display:inline-block; font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; padding:5px 10px; border-radius:8px; background:var(--brick-bg); color:var(--brick-deep); margin-bottom:10px; }
.uc-test.cur{ box-shadow:0 0 0 2px var(--brick); } .uc-test.cur .m{ background:var(--brick); color:#fff; }
.uc-test.past{ opacity:.55; }
.uc-test b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:19px; margin-bottom:6px; }
.uc-test p{ margin:0 0 12px; font-size:14px; line-height:1.55; color:var(--ink-soft); }
@media (max-width:900px){ .uc-tests{ grid-template-columns:1fr; } }

/* ---- екскурзии ---- */
.uc-trips{ display:grid; gap:12px; }
.uc-trips .ek-red{ display:grid; grid-template-columns:auto minmax(0,1fr); background:#fff; border-radius:14px; overflow:hidden; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.uc-trips .ek-red[hidden]{ display:none; }
.uc-trips .ek-red .t{ display:flex; align-items:center; padding:18px 22px; background:var(--brick); color:#fff; font-family:'Fraunces',serif; font-size:18px; border-right:2px dashed rgba(255,255,255,.6); }
.uc-trips .ek-red .d{ padding:18px 22px; font-size:15px; line-height:1.55; color:var(--ink); }
.uc-trips .ek-prazno{ margin:0; padding:26px; border-radius:16px; text-align:center; background:var(--brick-bg); font-size:15.5px; line-height:1.6; color:var(--ink); }
.uc-trips .ek-bel{ margin:4px 0 0; font-size:13.5px; color:var(--ink-soft); display:flex; gap:10px; align-items:flex-start; }
.uc-trips .ek-bel::before{ content:'🔒'; }
@media (max-width:560px){ .uc-trips .ek-red{ grid-template-columns:1fr; } .uc-trips .ek-red .t{ border-right:0; border-bottom:2px dashed rgba(255,255,255,.6); } }

/* ---- НВО ---- */
.uc-nvo{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.uc-nv{ padding:26px; border-radius:22px; background:var(--c-bg); }
.uc-nv .top{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:16px; }
.uc-nv .top b{ font-family:'Fraunces',serif; font-weight:400; font-size:28px; color:var(--ink); }
.uc-nv .left{ text-align:right; }
.uc-nv .left strong{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:44px; line-height:1; color:var(--c); }
.uc-nv .left span{ font-size:12px; color:var(--ink-soft); }
.uc-ex{ display:flex; align-items:center; gap:14px; padding:12px 14px; border-radius:12px; background:#fff; margin-top:8px; }
.uc-ex .d{ width:54px; text-align:center; font-family:'Fraunces',serif; font-size:24px; line-height:1; color:var(--c); }
.uc-ex .d small{ display:block; font-family:'Manrope',sans-serif; font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); }
.uc-ex b{ font-size:15px; color:var(--ink); } .uc-ex span{ display:block; font-size:12.5px; color:var(--ink-soft); }
@media (max-width:760px){ .uc-nvo{ grid-template-columns:1fr; } }

/* ===========================================================================
   65. ДОКУМЕНТИ — КАРТОТЕКАТА (dokumenti.html)
   Дървен шкаф с чекмеджета за всяка категория, търсачка във всички
   документи, учебните планове като таблица с класове и бюджетът по години и
   тримесечия. Преглед на PDF в прозореца на сайта. Представка dk-.
=========================================================================== */
[data-theme="info"] .dk-cat{ scroll-margin-top:96px; }
.dk-h{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(24px,2.8vw,32px); line-height:1.15; color:var(--ink); margin:0; }

/* ---- търсачка ---- */
.dk-search{ display:flex; align-items:center; gap:12px; max-width:780px; margin:0 auto; background:#fff; border-radius:18px; padding:8px 8px 8px 22px;
  box-shadow:0 0 0 1px var(--line,#E7DDCD), 0 20px 40px -26px rgba(50,65,82,.55); }
.dk-search:focus-within{ box-shadow:0 0 0 2px var(--brick), 0 20px 40px -26px rgba(50,65,82,.6); }
.dk-search svg{ width:22px; height:22px; color:var(--brick); flex:0 0 auto; }
.dk-search input{ flex:1; min-width:0; border:0; outline:none; background:transparent; padding:14px 0; font-family:'Fraunces',serif; font-size:clamp(17px,1.9vw,21px); color:var(--ink); }
.dk-count{ font-family:'Manrope',sans-serif; font-size:12px; font-weight:800; color:var(--brick-deep); background:var(--brick-bg); padding:8px 12px; border-radius:10px; white-space:nowrap; }

/* ---- шкафът ---- */
.dk-cabinet{ margin:34px auto 0; max-width:1080px; padding:18px; border-radius:18px;
  background:linear-gradient(180deg, #8C6440, #6E4C2E); box-shadow:inset 0 2px 0 rgba(255,255,255,.18), 0 30px 60px -34px rgba(40,25,10,.8); }
.dk-cabinet::before{ content:''; display:block; height:10px; margin:-18px -18px 14px; border-radius:18px 18px 0 0; background:#5A3C22; }
.dk-plates{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.dk-col b.plate{ display:block; margin:0 0 10px; text-align:center; font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.2em; text-transform:uppercase;
  color:#F3E2C4; opacity:.85; }
.dk-drawers{ display:grid; gap:10px; }
.dk-drawer{ position:relative; display:flex; align-items:center; gap:12px; width:100%; border:0; cursor:pointer; text-align:left; font:inherit;
  padding:14px 14px 14px 16px; border-radius:8px; background:linear-gradient(180deg, #B08256, #9A6E45); color:#2A1A0C;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3), inset 0 -3px 0 rgba(0,0,0,.18), 0 4px 0 #4E331C;
  transition:transform .35s cubic-bezier(.34,1.4,.5,1), box-shadow .3s; }
.dk-drawer:hover{ transform:translateY(-2px) scale(1.015); }
.dk-drawer.on{ transform:translateY(6px) scale(1.03); box-shadow:inset 0 1px 0 rgba(255,255,255,.3), 0 14px 22px -10px rgba(0,0,0,.55), 0 0 0 3px #FFD95E; z-index:2; }
.dk-card-holder{ flex:1; min-width:0; background:#FBF4E4; border-radius:3px; padding:6px 10px; box-shadow:inset 0 0 0 2px #C9A46A, 0 1px 0 rgba(0,0,0,.2); }
.dk-card-holder b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:15.5px; line-height:1.2; color:#2A1A0C; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dk-card-holder small{ font-family:'Manrope',sans-serif; font-size:11px; font-weight:700; color:#7A5A32; }
.dk-handle{ flex:0 0 auto; width:34px; height:14px; border-radius:7px; background:radial-gradient(circle at 50% 30%, #F3D58C, #B98A2E 70%); box-shadow:0 2px 0 rgba(0,0,0,.35); }
.dk-all{ display:flex; justify-content:center; margin-top:14px; }
.dk-all button{ border:0; cursor:pointer; padding:10px 20px; border-radius:999px; background:#FBF4E4; color:#4E331C; font-family:'Manrope',sans-serif; font-weight:800; font-size:13px; }
.dk-all button.on{ background:#FFD95E; }
@media (max-width:900px){ .dk-plates{ grid-template-columns:1fr; } }

/* ---- категориите ---- */
.dk-cat{ margin-top:clamp(48px,6vw,72px); }
.dk-cat[hidden]{ display:none; }
.dk-cat-head{ display:flex; align-items:center; gap:14px; margin-bottom:16px; }
.dk-cat-head .n{ font-family:'Manrope',sans-serif; font-size:12px; font-weight:800; color:var(--brick-deep); background:var(--brick-bg); padding:5px 10px; border-radius:8px; }
.dk-list{ display:grid; gap:10px; }
.dk-doc{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:16px; align-items:center; padding:14px 16px; border-radius:14px; background:#fff;
  box-shadow:0 0 0 1px var(--line,#E7DDCD); transition:box-shadow .2s, transform .2s; }
.dk-doc:hover{ box-shadow:0 0 0 1px var(--brick), 0 14px 26px -20px rgba(50,65,82,.5); transform:translateX(3px); }
.dk-doc[hidden]{ display:none; }
.dk-type{ width:44px; height:52px; border-radius:5px; position:relative; display:grid; place-items:end center; padding-bottom:7px;
  font-family:'Manrope',sans-serif; font-size:9.5px; font-weight:800; letter-spacing:.06em; color:#fff; background:#C0503C; }
.dk-type::before{ content:''; position:absolute; right:0; top:0; width:13px; height:13px; background:linear-gradient(225deg, var(--cream,#F7F1E8) 50%, rgba(0,0,0,.2) 50%); border-radius:0 5px 0 3px; }
.dk-type.docx{ background:#3E6FB0; }
.dk-doc b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:17px; line-height:1.3; color:var(--ink); }
.dk-doc p{ margin:3px 0 0; font-size:13.5px; line-height:1.5; color:var(--ink-soft); }
.dk-doc mark{ background:#FFE58A; color:inherit; border-radius:3px; padding:0 1px; }
.dk-acts{ display:flex; gap:6px; }
.dk-acts button, .dk-acts a{ display:inline-flex; align-items:center; gap:6px; border:0; cursor:pointer; padding:9px 13px; border-radius:10px; text-decoration:none;
  font-family:'Manrope',sans-serif; font-weight:700; font-size:12.5px; background:var(--brick-bg); color:var(--brick-deep); transition:background .2s; white-space:nowrap; }
.dk-acts button:hover, .dk-acts a:hover{ background:var(--brick); color:#fff; }
.dk-acts svg{ width:14px; height:14px; }
.dk-soon{ font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); background:#EFEAE2; padding:8px 12px; border-radius:10px; }
@media (max-width:640px){ .dk-doc{ grid-template-columns:auto minmax(0,1fr); } .dk-acts{ grid-column:1 / -1; } }

/* ---- учебни планове ---- */
.dk-uup{ display:grid; gap:10px; }
.dk-grade{ display:grid; grid-template-columns:90px repeat(4,minmax(0,1fr)); gap:8px; align-items:center; }
.dk-grade > b{ font-family:'Fraunces',serif; font-weight:400; font-size:20px; color:var(--ink); }
.dk-grade button{ border:0; cursor:pointer; padding:16px 8px; border-radius:12px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD);
  font-family:'Fraunces',serif; font-size:22px; color:var(--brick-deep); transition:transform .25s cubic-bezier(.34,1.4,.5,1), background .2s, color .2s; }
.dk-grade button small{ display:block; font-family:'Manrope',sans-serif; font-size:10px; font-weight:800; letter-spacing:.1em; color:var(--ink-soft); margin-top:2px; }
.dk-grade button:hover{ transform:translateY(-3px); background:var(--brick); color:#fff; }
.dk-grade button:hover small{ color:rgba(255,255,255,.8); }
.dk-grade button[hidden]{ display:none; }
@media (max-width:560px){ .dk-grade{ grid-template-columns:60px repeat(4,minmax(0,1fr)); } .dk-grade button{ padding:12px 4px; font-size:18px; } }

/* ---- бюджет ---- */
.dk-years{ display:grid; gap:12px; }
.dk-year{ display:grid; grid-template-columns:110px minmax(0,1fr); gap:14px; align-items:center; padding:16px; border-radius:16px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.dk-year > b{ font-family:'Fraunces',serif; font-weight:400; font-size:30px; color:var(--brick-deep); }
.dk-qs{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.dk-q{ border:0; cursor:pointer; padding:14px 10px; border-radius:12px; background:var(--brick-bg); color:var(--brick-deep); font-family:'Manrope',sans-serif; font-weight:800; font-size:14px; transition:background .2s, color .2s; }
.dk-q small{ display:block; font-weight:600; font-size:11px; opacity:.75; margin-top:2px; }
.dk-q:hover{ background:var(--brick); color:#fff; }
.dk-q.empty{ background:transparent; box-shadow:inset 0 0 0 1px dashed; color:var(--ink-soft); cursor:default; border:1px dashed var(--line,#E7DDCD); }
@media (max-width:560px){ .dk-year{ grid-template-columns:1fr; } .dk-qs{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.dk-person{ margin-top:12px; padding:16px 18px; border-radius:14px; background:var(--brick-bg); font-size:14.5px; line-height:1.6; color:var(--ink); }
.dk-person a{ color:var(--brick-deep); font-weight:700; }
.dk-none{ display:none; text-align:center; padding:30px; font-size:15px; color:var(--ink-soft); }
.dk-grade[hidden], .dk-year[hidden]{ display:none; }

/* ===========================================================================
   66. ЕКИП — УЧИЛИЩНИЯТ АЛБУМ (ekip.html)
   Портрети като снимки от албум (с инициали, докато няма снимки), търсачка
   и филтри по групи, „Кой учи моето дете?“ за началния етап и предметите в
   прогимназията като цветни ленти. Представка ek-.
=========================================================================== */
.ek-h{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(26px,3vw,36px); line-height:1.15; color:var(--ink); margin:6px 0 18px; }
.ek-sec{ margin-top:clamp(56px,7vw,86px); scroll-margin-top:96px; }
.ek-sec[hidden], .ek-card[hidden], .ek-subj[hidden], .ek-class[hidden], .ek-grade[hidden]{ display:none; }

/* ---- търсене и филтри ---- */
.ek-tools{ position:sticky; top:74px; z-index:6; padding:12px; margin:0 -12px; border-radius:18px; background:rgba(247,241,232,.92); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.ek-search{ display:flex; align-items:center; gap:12px; background:#fff; border-radius:16px; padding:6px 6px 6px 18px; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.ek-search:focus-within{ box-shadow:0 0 0 2px var(--brick); }
.ek-search svg{ width:20px; height:20px; color:var(--brick); flex:0 0 auto; }
.ek-search input{ flex:1; min-width:0; border:0; outline:none; background:transparent; padding:12px 0; font-family:'Fraunces',serif; font-size:19px; color:var(--ink); }
.ek-search span{ font-family:'Manrope',sans-serif; font-size:12px; font-weight:800; color:var(--brick-deep); background:var(--brick-bg); padding:8px 12px; border-radius:10px; white-space:nowrap; }
.ek-chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.ek-chips button{ border:1px solid var(--line,#E7DDCD); background:#fff; cursor:pointer; padding:8px 14px; border-radius:999px; font-family:'Manrope',sans-serif; font-weight:700; font-size:13.5px; color:var(--ink); transition:all .2s; }
.ek-chips button i{ font-style:normal; opacity:.55; margin-left:4px; }
.ek-chips button.on{ background:var(--brick); border-color:var(--brick); color:#fff; }

/* ---- портрет ---- */
.ek-pic{ position:relative; width:72px; height:84px; flex:0 0 auto; background:#fff; padding:5px 5px 14px; border-radius:3px; box-shadow:0 8px 16px -10px rgba(40,30,20,.55), 0 0 0 1px rgba(0,0,0,.05); transform:rotate(var(--rot,-2deg)); }
.ek-pic span{ display:grid; place-items:center; width:100%; height:100%; border-radius:2px; background:var(--pc,#46586B); color:#fff; font-family:'Fraunces',serif; font-size:24px; letter-spacing:.02em;
  background-image:radial-gradient(120% 90% at 30% 20%, rgba(255,255,255,.28), transparent 60%); }
.ek-card{ display:flex; gap:16px; align-items:center; padding:14px 16px; border-radius:16px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); transition:transform .25s, box-shadow .25s; }
.ek-card:hover{ transform:translateY(-3px); box-shadow:0 0 0 1px var(--brick), 0 16px 28px -20px rgba(40,30,20,.5); }
.ek-card:hover .ek-pic{ transform:rotate(0) scale(1.04); }
.ek-card b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:18px; line-height:1.2; color:var(--ink); }
.ek-card small{ display:block; margin-top:3px; font-size:13px; color:var(--ink-soft); line-height:1.4; }
.ek-card mark{ background:#FFE58A; color:inherit; border-radius:3px; padding:0 1px; }
.ek-links{ display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.ek-links a{ display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:8px; background:var(--brick-bg); color:var(--brick-deep); text-decoration:none; font-family:'Manrope',sans-serif; font-weight:700; font-size:12px; }
.ek-links a:hover{ background:var(--brick); color:#fff; }
.ek-links svg{ width:13px; height:13px; }
.ek-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:12px; }

/* ---- ръководство ---- */
.ek-lead{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; }
.ek-lead .ek-card{ flex-direction:column; text-align:center; padding:24px 16px 18px; }
.ek-lead .ek-pic{ width:110px; height:128px; padding:7px 7px 20px; }
.ek-lead .ek-pic span{ font-size:36px; }
.ek-lead .ek-links{ justify-content:center; }
@media (max-width:1000px){ .ek-lead{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* ---- кой учи моето дете ---- */
.ek-who{ padding:clamp(20px,3vw,30px); border-radius:22px; background:var(--brick-bg); }
.ek-who-pick{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.ek-who-pick button{ border:0; cursor:pointer; width:52px; padding:10px 0; border-radius:12px; background:#fff; font-family:'Fraunces',serif; font-size:19px; color:var(--brick-deep); transition:all .2s; }
.ek-who-pick button.on{ background:var(--brick); color:#fff; transform:translateY(-2px); }
.ek-who-pick .sep{ width:1px; height:30px; background:rgba(0,0,0,.12); margin:0 4px; }
.ek-who-out{ margin-top:18px; display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:12px; }
.ek-who-out p{ margin:0; font-size:15px; color:var(--ink-soft); }

/* ---- класове в началния етап ---- */
.ek-grade{ margin-bottom:22px; }
.ek-grade > b{ display:block; font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:10px; }
.ek-classes{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.ek-class{ position:relative; padding:40px 14px 14px; border-radius:18px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); display:grid; gap:10px; }
.ek-class .tag{ position:absolute; left:14px; top:-12px; padding:6px 14px; border-radius:10px; background:var(--brick); color:#fff; font-family:'Fraunces',serif; font-size:20px; box-shadow:0 8px 14px -8px rgba(0,0,0,.4); }
.ek-class .ek-card{ box-shadow:none; padding:4px; }
.ek-class .ek-card:hover{ transform:none; box-shadow:none; }
.ek-class .ek-pic{ width:56px; height:66px; padding:4px 4px 11px; } .ek-class .ek-pic span{ font-size:19px; }
.ek-class .ek-card b{ font-size:16px; }
@media (max-width:1000px){ .ek-classes{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px){ .ek-classes{ grid-template-columns:1fr; } }

/* ---- предмети ---- */
.ek-subjects{ display:grid; gap:14px; }
.ek-subj{ display:grid; grid-template-columns:230px minmax(0,1fr); gap:14px; align-items:start; }
.ek-ribbon{ position:sticky; top:190px; padding:14px 16px; border-radius:12px 4px 4px 12px; background:var(--sc,#46586B); color:#fff; clip-path:polygon(0 0, 100% 0, 92% 50%, 100% 100%, 0 100%); padding-right:30px; }
.ek-ribbon b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:17px; line-height:1.25; }
.ek-ribbon small{ font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; opacity:.8; }
@media (max-width:760px){ .ek-subj{ grid-template-columns:1fr; } .ek-ribbon{ position:static; } }
.ek-none{ display:none; text-align:center; padding:30px; color:var(--ink-soft); }

/* ===========================================================================
   67. МАТЕРИАЛНА БАЗА — РАЗХОДКА ИЗ УЧИЛИЩЕТО (materialna-baza.html)
   Обиколка със спирки: вляво голяма рисувана сцена на мястото, вдясно
   маршрутът с пунктир. Не е точен план на сградата. Представка mb-.
=========================================================================== */
.mb-tour{ display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:clamp(18px,3vw,34px); align-items:start; }
.mb-stage{ position:relative; border-radius:24px; overflow:hidden; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD), 0 30px 60px -36px rgba(60,30,45,.55); }
.mb-scene{ position:relative; aspect-ratio:16/9; background:linear-gradient(160deg, var(--brick-bg), #FBF4EA); overflow:hidden; }
.mb-scene img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1.04); transition:opacity .5s, transform .8s cubic-bezier(.34,1.3,.5,1); }
.mb-scene img.on{ opacity:1; transform:none; }
.mb-num{ position:absolute; left:20px; top:18px; font-family:'Fraunces',serif; font-size:64px; line-height:1; color:var(--brick); opacity:.18; }
.mb-text{ padding:clamp(20px,3vw,30px); }
.mb-text small{ font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:var(--brick); }
.mb-text h3{ margin:6px 0 10px; font-family:'Fraunces',serif; font-weight:400; font-size:clamp(26px,3vw,36px); line-height:1.1; color:var(--ink); }
.mb-text p{ margin:0; font-size:16.5px; line-height:1.7; color:var(--ink-soft); max-width:62ch; }
.mb-badge{ display:inline-flex; align-items:center; gap:8px; margin-top:14px; padding:9px 14px; border-radius:12px; background:#E1E9F5; color:#2C4570; font-size:14px; font-weight:600; }
.mb-nav{ display:flex; justify-content:space-between; align-items:center; gap:10px; padding:0 clamp(20px,3vw,30px) clamp(20px,3vw,26px); }
.mb-nav button{ border:0; cursor:pointer; padding:11px 18px; border-radius:999px; background:var(--brick-bg); color:var(--brick-deep); font-family:'Manrope',sans-serif; font-weight:800; font-size:13.5px; transition:background .2s, color .2s; }
.mb-nav button:hover{ background:var(--brick); color:#fff; }
.mb-nav span{ font-family:'Manrope',sans-serif; font-size:12.5px; font-weight:700; color:var(--ink-soft); }
.mb-route{ position:relative; display:grid; gap:6px; padding-left:28px; }
.mb-route::before{ content:''; position:absolute; left:11px; top:18px; bottom:18px; width:2px; background:repeating-linear-gradient(180deg, var(--brick) 0 5px, transparent 5px 11px); opacity:.45; }
.mb-stop{ position:relative; display:flex; align-items:center; gap:12px; width:100%; border:0; cursor:pointer; text-align:left; font:inherit; padding:12px 14px; border-radius:14px; background:transparent; transition:background .2s; }
.mb-stop::before{ content:''; position:absolute; left:-23px; top:50%; width:12px; height:12px; margin-top:-6px; border-radius:50%; background:#fff; border:3px solid var(--brick); transition:transform .3s; }
.mb-stop:hover{ background:#fff; }
.mb-stop.on{ background:#fff; box-shadow:0 0 0 2px var(--brick); }
.mb-stop.on::before{ background:#FFD95E; transform:scale(1.35); }
.mb-stop.seen::before{ background:var(--brick); }
.mb-stop b{ font-family:'Fraunces',serif; font-weight:400; font-size:17px; color:var(--ink); line-height:1.2; }
.mb-stop small{ display:block; font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); }
.mb-note{ margin-top:14px; font-size:12.5px; color:var(--ink-soft); }
@media (max-width:860px){ .mb-tour{ grid-template-columns:1fr; } .mb-route{ order:-1; grid-auto-flow:column; grid-auto-columns:max-content; overflow-x:auto; padding:0 0 8px; }
  .mb-route::before{ display:none; } .mb-stop{ background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); } .mb-stop::before{ display:none; } }

/* ===========================================================================
   68. ВИЗИЯ — ДЪРВОТО НА ЦЕННОСТИТЕ (vizia.html)
   Голям цитат, после ствол, по който растат клони с ценностите — листата
   разлистват при скролване. Представка vz-.
=========================================================================== */
.vz-quote{ max-width:900px; margin:0 auto; text-align:center; }
.vz-quote p{ margin:0; font-family:'Fraunces',serif; font-style:italic; font-size:clamp(26px,3.4vw,42px); line-height:1.3; color:var(--ink); }
.vz-quote p::before{ content:'„'; color:var(--brick); } .vz-quote p::after{ content:'“'; color:var(--brick); }
.vz-quote span{ display:block; margin-top:18px; font-size:17px; line-height:1.7; color:var(--ink-soft); }
.vz-tree{ position:relative; max-width:980px; margin:clamp(50px,7vw,80px) auto 0; padding:20px 0 120px; }
.vz-trunk{ position:absolute; left:50%; top:0; bottom:60px; width:14px; margin-left:-7px; border-radius:7px; background:linear-gradient(90deg, #7A5226, #9A6B34 50%, #7A5226); }
.vz-roots{ position:absolute; left:50%; bottom:0; width:260px; height:80px; margin-left:-130px; }
.vz-branch{ position:relative; display:flex; margin-bottom:34px; }
.vz-branch:nth-child(odd){ justify-content:flex-start; } .vz-branch:nth-child(even){ justify-content:flex-end; }
.vz-card{ position:relative; width:calc(50% - 60px); padding:22px 24px; border-radius:20px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD), 0 20px 40px -30px rgba(80,60,20,.5); }
.vz-card::before{ content:''; position:absolute; top:34px; width:58px; height:3px; background:#8A5E2C; border-radius:2px; }
.vz-branch:nth-child(odd) .vz-card::before{ right:-58px; } .vz-branch:nth-child(even) .vz-card::before{ left:-58px; }
.vz-leaf{ position:absolute; top:12px; width:46px; height:46px; transform:scale(0) rotate(-40deg); transition:transform .8s cubic-bezier(.34,1.6,.5,1) .15s; }
.vz-branch:nth-child(odd) .vz-leaf{ right:-48px; } .vz-branch:nth-child(even) .vz-leaf{ left:-48px; }
.vz-branch.grown .vz-leaf{ transform:scale(1) rotate(0); }
.vz-card small{ font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:var(--brick); }
.vz-card h3{ margin:6px 0 8px; font-family:'Fraunces',serif; font-weight:400; font-size:24px; line-height:1.2; color:var(--ink); }
.vz-card p{ margin:0; font-size:15.5px; line-height:1.7; color:var(--ink-soft); }
@media (max-width:760px){
  .vz-trunk{ left:22px; } .vz-roots{ display:none; }
  .vz-branch, .vz-branch:nth-child(even){ justify-content:flex-end; }
  .vz-card{ width:calc(100% - 64px); } .vz-branch .vz-card::before, .vz-branch:nth-child(even) .vz-card::before{ left:-34px; right:auto; width:34px; }
  .vz-branch .vz-leaf, .vz-branch:nth-child(even) .vz-leaf{ left:-58px; right:auto; width:36px; height:36px; }
}

/* ===========================================================================
   69. КОНТАКТИ — КОГО ДА ТЪРСЯ ЗА КАКВО (kontakti.html)
   Три големи бутона (обади се, пиши, ела), помощник „какво ви трябва?“,
   карта и телефоните на ръководството. Представка kt-.
=========================================================================== */
.kt-big{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.kt-b{ position:relative; display:flex; flex-direction:column; gap:10px; padding:26px 24px; border-radius:22px; text-decoration:none; color:#fff; overflow:hidden;
  background:var(--c); box-shadow:0 26px 46px -30px rgba(30,40,55,.8); transition:transform .35s cubic-bezier(.34,1.4,.5,1); }
.kt-b:hover{ transform:translateY(-5px); }
.kt-b::after{ content:''; position:absolute; right:-40px; bottom:-40px; width:150px; height:150px; border-radius:50%; background:rgba(255,255,255,.1); }
.kt-b .ic{ width:50px; height:50px; border-radius:14px; background:rgba(255,255,255,.18); padding:12px; }
.kt-b .ic svg{ width:100%; height:100%; display:block; }
.kt-b small{ font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; opacity:.8; }
.kt-b b{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(20px,2.2vw,26px); line-height:1.25; }
.kt-b span.sub{ font-size:14px; opacity:.85; }
.kt-b .row{ display:flex; flex-wrap:wrap; gap:8px; position:relative; z-index:1; }
.kt-b .row a, .kt-b .row button{ border:0; cursor:pointer; padding:9px 14px; border-radius:10px; background:rgba(255,255,255,.2); color:#fff; font-family:'Manrope',sans-serif; font-weight:800; font-size:13.5px; text-decoration:none; }
.kt-b .row a:hover, .kt-b .row button:hover{ background:rgba(255,255,255,.32); }
@media (max-width:900px){ .kt-big{ grid-template-columns:1fr; } }
.kt-sec{ margin-top:clamp(56px,7vw,86px); }
.kt-h{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(26px,3vw,36px); line-height:1.15; color:var(--ink); margin:6px 0 18px; }
.kt-need{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.kt-need button{ display:flex; align-items:center; gap:12px; border:0; cursor:pointer; text-align:left; font:inherit; padding:16px 18px; border-radius:16px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); transition:all .2s; }
.kt-need button:hover{ box-shadow:0 0 0 1px var(--brick); transform:translateY(-2px); }
.kt-need button.on{ background:var(--brick); box-shadow:none; }
.kt-need button.on b{ color:#fff; }
.kt-need button span{ font-size:24px; }
.kt-need b{ font-family:'Fraunces',serif; font-weight:400; font-size:17px; color:var(--ink); line-height:1.25; }
@media (max-width:760px){ .kt-need{ grid-template-columns:1fr; } }
.kt-ans{ margin-top:14px; padding:22px 24px; border-radius:20px; background:var(--brick-bg); display:none; }
.kt-ans.on{ display:block; animation:ktIn .4s ease; }
@keyframes ktIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
.kt-ans b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:22px; color:var(--ink); margin-bottom:8px; }
.kt-ans p{ margin:0 0 12px; font-size:15.5px; line-height:1.65; color:var(--ink); }
.kt-ans .acts{ display:flex; flex-wrap:wrap; gap:8px; }
.kt-ans .acts a{ padding:10px 16px; border-radius:999px; background:var(--brick); color:#fff; text-decoration:none; font-family:'Manrope',sans-serif; font-weight:800; font-size:13.5px; }
.kt-ans .acts a.alt{ background:#fff; color:var(--brick-deep); }
.kt-map{ display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:16px; }
.kt-frame{ position:relative; border-radius:20px; overflow:hidden; min-height:320px; background:var(--brick-bg); box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.kt-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.kt-frame .fb{ position:absolute; inset:0; display:grid; place-items:center; text-align:center; padding:20px; font-size:14px; color:var(--ink-soft); }
.kt-people{ display:grid; gap:10px; align-content:start; }
.kt-p{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px 16px; border-radius:14px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.kt-p b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:17px; color:var(--ink); }
.kt-p small{ font-size:12.5px; color:var(--ink-soft); }
.kt-p a{ white-space:nowrap; padding:9px 12px; border-radius:10px; background:var(--brick-bg); color:var(--brick-deep); text-decoration:none; font-family:'Manrope',sans-serif; font-weight:800; font-size:13px; }
@media (max-width:860px){ .kt-map{ grid-template-columns:1fr; } }
.kt-toast{ position:fixed; left:50%; bottom:calc(24px + env(safe-area-inset-bottom,0px)); transform:translate(-50%, 20px); opacity:0; pointer-events:none; z-index:50;
  padding:12px 20px; border-radius:999px; background:#1E2A36; color:#fff; font-family:'Manrope',sans-serif; font-weight:700; font-size:14px; transition:all .3s; }
.kt-toast.on{ opacity:1; transform:translate(-50%, 0); }

/* ===========================================================================
   70. ПРОЕКТИ И ПРОГРАМИ — ИЗЛОЖБАТА (proekti-programi.html)
   Активните проекти са постери на стена с живи броячи и лента на периода;
   националните програми — табелки; архивът — рафт с папки. Представка pp-.
=========================================================================== */
.pp-wall{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(16px,2.4vw,26px); }
.pp-poster{ position:relative; display:flex; flex-direction:column; border-radius:6px; background:#fff; padding:26px 24px 22px; text-decoration:none; color:var(--ink);
  box-shadow:0 1px 0 rgba(0,0,0,.05), 0 30px 50px -34px rgba(40,30,20,.6); transform:rotate(var(--r,0deg)); transition:transform .45s cubic-bezier(.34,1.4,.5,1), box-shadow .3s; }
.pp-poster:hover{ transform:rotate(0) translateY(-6px); box-shadow:0 36px 60px -34px rgba(40,30,20,.7); }
.pp-poster::before{ content:''; position:absolute; top:-9px; left:50%; width:90px; height:22px; margin-left:-45px; background:rgba(232,200,119,.6); transform:rotate(-2deg); }
.pp-band{ height:8px; margin:-26px -24px 20px; border-radius:6px 6px 0 0; background:var(--pc,#2F6F66); }
.pp-poster .no{ font-family:'Fraunces',serif; font-size:48px; line-height:1; color:var(--pc); opacity:.25; position:absolute; right:18px; top:22px; }
.pp-poster small{ font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--pc); padding-right:50px; }
.pp-poster h3{ margin:8px 0 12px; font-family:'Fraunces',serif; font-weight:400; font-size:23px; line-height:1.2; }
.pp-poster p{ margin:0 0 12px; font-size:14.5px; line-height:1.65; color:var(--ink-soft); }
.pp-stats{ display:grid; gap:8px; margin:6px 0 14px; }
.pp-stat{ display:flex; gap:12px; align-items:baseline; padding:10px 12px; border-radius:10px; background:var(--pb,#E3EEE9); }
.pp-stat b{ font-family:'Fraunces',serif; font-weight:400; font-size:28px; line-height:1; color:var(--pc); min-width:52px; }
.pp-stat span{ font-size:13px; line-height:1.4; color:var(--ink); }
.pp-period{ margin:4px 0 14px; }
.pp-period .bar{ height:8px; border-radius:4px; background:rgba(0,0,0,.08); overflow:hidden; }
.pp-period .bar i{ display:block; height:100%; width:0; border-radius:4px; background:var(--pc); transition:width 1.4s cubic-bezier(.3,1,.4,1); }
.pp-period .lbl{ display:flex; justify-content:space-between; margin-top:6px; font-size:12px; color:var(--ink-soft); }
.pp-code{ display:inline-block; font-family:'Courier New',monospace; font-size:12px; padding:5px 8px; border-radius:6px; background:#F1ECE4; color:var(--ink); word-break:break-all; margin-bottom:12px; }
.pp-eu{ display:flex; align-items:center; gap:10px; margin:auto 0 12px; font-size:12px; color:var(--ink-soft); }
.pp-eu svg{ width:40px; height:27px; flex:0 0 auto; }
.pp-more{ margin-top:auto; align-self:flex-start; font-family:'Manrope',sans-serif; font-weight:800; font-size:13.5px; color:var(--pc); }
@media (max-width:1000px){ .pp-wall{ grid-template-columns:1fr; } .pp-poster{ transform:none; } }
.pp-plates{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:clamp(40px,5vw,60px); }
.pp-plate{ padding:24px; border-radius:18px; background:linear-gradient(135deg,#FBF4E4,#F3E6CC); box-shadow:inset 0 0 0 2px #D9C29A, 0 20px 40px -30px rgba(80,60,20,.5); position:relative; }
.pp-plate::before, .pp-plate::after{ content:''; position:absolute; top:12px; width:10px; height:10px; border-radius:50%; background:radial-gradient(circle at 35% 35%, #F3D58C, #9C7A2E); }
.pp-plate::before{ left:12px; } .pp-plate::after{ right:12px; }
.pp-plate small{ font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#8F6420; }
.pp-plate h3{ margin:6px 0 10px; font-family:'Fraunces',serif; font-weight:400; font-size:23px; color:var(--ink); }
.pp-plate p{ margin:0 0 10px; font-size:14.5px; line-height:1.65; color:var(--ink-soft); }
.pp-tags{ display:flex; flex-wrap:wrap; gap:6px; }
.pp-tags span{ padding:6px 10px; border-radius:8px; background:#fff; font-size:12.5px; color:var(--ink); box-shadow:0 0 0 1px #E7D7B8; }
@media (max-width:760px){ .pp-plates{ grid-template-columns:1fr; } }
.pp-shelf{ margin-top:clamp(48px,6vw,70px); }
.pp-folders{ display:flex; gap:10px; overflow-x:auto; padding:22px 6px 0; border-bottom:14px solid #8C6440; box-shadow:0 20px 30px -24px rgba(40,25,10,.6); }
.pp-folder{ flex:0 0 190px; min-height:170px; padding:26px 14px 14px; border-radius:6px 6px 0 0; position:relative; background:var(--fc); color:#fff;
  font-family:'Fraunces',serif; font-size:16px; line-height:1.3; box-shadow:inset 0 -6px 0 rgba(0,0,0,.12); transition:transform .3s; }
.pp-folder:hover{ transform:translateY(-10px); }
.pp-folder::before{ content:''; position:absolute; top:-12px; left:14px; width:70px; height:14px; border-radius:6px 6px 0 0; background:var(--fc); }
.pp-folder small{ display:block; margin-top:10px; font-family:'Manrope',sans-serif; font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; opacity:.75; }

/* ===========================================================================
   71. КВАЛИФИКАЦИИ — СТЕНАТА СЪС СЕРТИФИКАТИ (kvalifikacii.html)
   Броячи за всички години, филтър по година и всяко обучение като
   сертификат с печат. Представка kv-.
=========================================================================== */
.kv-stats{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.kv-stat{ padding:20px; border-radius:18px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); text-align:center; }
.kv-stat b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:44px; line-height:1; color:var(--brick); }
.kv-stat span{ display:block; margin-top:6px; font-size:13.5px; color:var(--ink-soft); }
@media (max-width:760px){ .kv-stats{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.kv-years{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin:30px 0 26px; }
.kv-years button{ border:1px solid var(--line,#E7DDCD); background:#fff; cursor:pointer; padding:9px 16px; border-radius:999px; font-family:'Manrope',sans-serif; font-weight:800; font-size:14px; color:var(--ink); }
.kv-years button.on{ background:var(--brick); border-color:var(--brick); color:#fff; }
.kv-wall{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(16px,2.4vw,26px); }
.kv-cert{ position:relative; padding:26px 26px 22px; background:#FFFDF6; border-radius:4px;
  box-shadow:inset 0 0 0 8px #FFFDF6, inset 0 0 0 9px var(--brick), inset 0 0 0 12px #FFFDF6, inset 0 0 0 13px rgba(0,0,0,.08), 0 24px 40px -30px rgba(40,30,20,.6);
  transform:rotate(var(--r,0deg)); transition:transform .4s cubic-bezier(.34,1.4,.5,1); }
.kv-cert:hover{ transform:rotate(0) translateY(-4px); }
.kv-cert[hidden]{ display:none; }
.kv-cert .when{ font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--brick); }
.kv-cert h3{ margin:8px 0 14px; font-family:'Fraunces',serif; font-weight:400; font-size:20px; line-height:1.3; color:var(--ink); padding-right:70px; }
.kv-cert dl{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:6px 12px; margin:0; font-size:13.5px; line-height:1.45; }
.kv-cert dt{ color:var(--ink-soft); } .kv-cert dd{ margin:0; color:var(--ink); }
.kv-seal{ position:absolute; right:18px; top:18px; width:62px; height:62px; border-radius:50%; display:grid; place-items:center; text-align:center;
  background:radial-gradient(circle, var(--brick) 0 58%, transparent 60%), repeating-conic-gradient(var(--brick) 0 8deg, transparent 8deg 16deg);
  color:#fff; font-family:'Fraunces',serif; font-size:17px; line-height:1; }
.kv-seal small{ display:block; font-family:'Manrope',sans-serif; font-size:8px; font-weight:800; letter-spacing:.08em; }
@media (max-width:760px){ .kv-wall{ grid-template-columns:1fr; } .kv-cert{ transform:none; } }

/* ===========================================================================
   72. ОБЩЕСТВЕН СЪВЕТ, ЗЗЛД, Е-ДНЕВНИК
   Представки os-, zz-, ed2-.
=========================================================================== */
.os-table{ position:relative; max-width:760px; margin:0 auto; aspect-ratio:2.2; }
.os-table svg{ width:100%; height:100%; display:block; }
.os-duo{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:22px; }
.os-card{ padding:24px; border-radius:20px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.os-card .ic{ width:50px; height:50px; border-radius:14px; background:var(--brick-bg); color:var(--brick); padding:12px; margin-bottom:12px; }
.os-card .ic svg{ width:100%; height:100%; display:block; }
.os-card h3{ margin:0 0 8px; font-family:'Fraunces',serif; font-weight:400; font-size:22px; color:var(--ink); }
.os-card p{ margin:0; font-size:15px; line-height:1.65; color:var(--ink-soft); }
.os-ex{ margin-top:16px; padding:18px 22px; border-radius:16px; background:var(--brick-bg); font-size:15px; line-height:1.65; color:var(--ink); }
.os-ex a{ color:var(--brick-deep); font-weight:700; }
@media (max-width:760px){ .os-duo{ grid-template-columns:1fr; } }

.zz-dpo{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:22px; align-items:center; padding:clamp(22px,3vw,32px); border-radius:24px; color:#fff;
  background:linear-gradient(140deg,#324152,#1E2A36); box-shadow:0 30px 60px -34px rgba(20,30,45,.8); }
.zz-lock{ width:92px; height:92px; border-radius:24px; background:rgba(255,255,255,.1); display:grid; place-items:center; }
.zz-lock svg{ width:52px; height:52px; color:#FFD95E; }
.zz-dpo small{ font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; opacity:.75; }
.zz-dpo b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:clamp(24px,2.8vw,32px); margin:6px 0 12px; }
.zz-dpo .row{ display:flex; flex-wrap:wrap; gap:8px; }
.zz-dpo .row a{ padding:10px 16px; border-radius:10px; background:rgba(255,255,255,.14); color:#fff; text-decoration:none; font-family:'Manrope',sans-serif; font-weight:800; font-size:14px; }
.zz-dpo .row a:hover{ background:rgba(255,255,255,.26); }
@media (max-width:560px){ .zz-dpo{ grid-template-columns:1fr; } }
.zz-env{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:26px; }
.zz-e{ position:relative; padding:60px 20px 20px; border-radius:10px; background:#FBF6EC; box-shadow:0 0 0 1px #E7DCC6, 0 20px 36px -28px rgba(40,30,20,.55); overflow:hidden; }
.zz-e::before{ content:''; position:absolute; left:0; right:0; top:0; height:56px; background:linear-gradient(to bottom right, #EFE4CF 49.5%, transparent 50%) left/50% 100% no-repeat, linear-gradient(to bottom left, #EFE4CF 49.5%, transparent 50%) right/50% 100% no-repeat; }
.zz-e .wax{ position:absolute; left:50%; top:30px; width:40px; height:40px; margin-left:-20px; border-radius:50%; background:radial-gradient(circle at 35% 30%, #E07A6A, #A8322A 65%); box-shadow:0 4px 8px rgba(0,0,0,.25); display:grid; place-items:center; color:#fff; font-family:'Fraunces',serif; font-size:15px; }
.zz-e b{ display:block; margin-top:14px; font-family:'Fraunces',serif; font-weight:400; font-size:18px; line-height:1.3; color:var(--ink); min-height:3.9em; }
.zz-e .acts{ display:flex; gap:6px; margin-top:12px; }
.zz-e .acts button, .zz-e .acts a{ border:0; cursor:pointer; padding:9px 13px; border-radius:10px; background:var(--brick-bg); color:var(--brick-deep); text-decoration:none; font-family:'Manrope',sans-serif; font-weight:800; font-size:12.5px; }
.zz-e .acts button:hover, .zz-e .acts a:hover{ background:var(--brick); color:#fff; }
@media (max-width:860px){ .zz-env{ grid-template-columns:1fr; } }
.zz-rights{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:18px; }
.zz-rights div{ padding:16px; border-radius:14px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.zz-rights b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:17px; color:var(--ink); margin-bottom:4px; }
.zz-rights span{ font-size:13px; line-height:1.5; color:var(--ink-soft); }
@media (max-width:900px){ .zz-rights{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

.ed2-wrap{ display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:clamp(24px,5vw,60px); align-items:center; }
.ed2-steps{ display:grid; gap:14px; counter-reset:st; }
.ed2-step{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:16px; align-items:start; padding:20px; border-radius:18px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.ed2-step .n{ width:48px; height:48px; border-radius:14px; display:grid; place-items:center; background:var(--brick); color:#fff; font-family:'Fraunces',serif; font-size:24px; }
.ed2-step b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:21px; color:var(--ink); margin-bottom:4px; }
.ed2-step p{ margin:0 0 10px; font-size:14.5px; line-height:1.6; color:var(--ink-soft); }
.ed2-step a{ display:inline-flex; padding:9px 14px; border-radius:10px; background:var(--brick-bg); color:var(--brick-deep); text-decoration:none; font-family:'Manrope',sans-serif; font-weight:800; font-size:13px; }
.ed2-step a.main{ background:var(--brick); color:#fff; }
.ed2-phone{ position:relative; width:260px; height:520px; margin:0 auto; border-radius:40px; background:#1E1E22; padding:14px; box-shadow:0 40px 70px -40px rgba(0,0,0,.7); }
.ed2-phone::before{ content:''; position:absolute; top:22px; left:50%; width:80px; height:18px; margin-left:-40px; border-radius:10px; background:#000; z-index:2; }
.ed2-screen{ width:100%; height:100%; border-radius:28px; background:#F4F6FA; overflow:hidden; padding:50px 14px 14px; display:grid; gap:10px; align-content:start; }
.ed2-screen .hd{ font-family:'Manrope',sans-serif; font-weight:800; font-size:15px; color:#1E2A36; }
.ed2-row{ display:flex; justify-content:space-between; align-items:center; padding:12px; border-radius:14px; background:#fff; box-shadow:0 2px 6px rgba(0,0,0,.05); font-family:'Manrope',sans-serif; font-size:13px; color:#1E2A36; opacity:0; transform:translateY(10px); animation:ed2In .5s ease forwards; }
.ed2-row:nth-child(2){ animation-delay:.3s; } .ed2-row:nth-child(3){ animation-delay:.6s; } .ed2-row:nth-child(4){ animation-delay:.9s; } .ed2-row:nth-child(5){ animation-delay:1.2s; } .ed2-row:nth-child(6){ animation-delay:1.5s; }
@keyframes ed2In{ to{ opacity:1; transform:none; } }
.ed2-row i{ font-style:normal; font-weight:800; padding:4px 10px; border-radius:8px; background:#E3EED8; color:#2E4F18; }
.ed2-row i.b{ background:#E1E9F5; color:#2C4570; } .ed2-row i.r{ background:#F6D3DF; color:#732440; }
@media (max-width:860px){ .ed2-wrap{ grid-template-columns:1fr; } .ed2-phone{ transform:scale(.85); margin:-30px auto; } }

/* Обществен съвет — ясна версия: кой е в съвета и какво решава (os2-) */
.os2-who{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.os2-p{ display:flex; gap:16px; align-items:center; padding:20px; border-radius:18px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.os2-p .ic{ flex:0 0 auto; width:58px; height:58px; border-radius:16px; display:grid; place-items:center; font-size:30px; background:var(--b); }
.os2-p b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:19px; color:var(--ink); margin-bottom:3px; }
.os2-p span{ font-size:13.5px; line-height:1.5; color:var(--ink-soft); }
@media (max-width:860px){ .os2-who{ grid-template-columns:1fr; } }
.os2-does{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.os2-d{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:16px; align-items:start; padding:18px 20px; border-radius:16px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.os2-d .v{ font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; padding:6px 10px; border-radius:8px; white-space:nowrap; background:var(--vb); color:var(--vc); }
.os2-d b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:18px; line-height:1.3; color:var(--ink); }
.os2-d a{ display:inline-block; margin-top:8px; font-family:'Manrope',sans-serif; font-weight:800; font-size:13px; color:var(--brick-deep); text-decoration:none; }
.os2-d a:hover{ text-decoration:underline; }
@media (max-width:860px){ .os2-does{ grid-template-columns:1fr; } }
.os2-key{ display:flex; flex-wrap:wrap; gap:10px; margin:0 0 16px; font-size:13.5px; color:var(--ink-soft); }
.os2-key span{ display:inline-flex; align-items:center; gap:6px; }
.os2-key i{ font-style:normal; font-family:'Manrope',sans-serif; font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; padding:4px 8px; border-radius:6px; }
.os2-sec{ margin-top:clamp(48px,6vw,72px); }
.os2-src{ margin-top:14px; font-size:13px; color:var(--ink-soft); }

/* Менюто: първият ред във всяка лента води към целия раздел */
.ed-ov-panel a.ed-ov-all{ color:var(--brick); font-weight:800; }
.ed-ov-panel a.ed-ov-all:hover{ color:var(--brick-deep); }
.ed-ov-item[data-href]{ cursor:pointer; }

/* За родители — втори час на класа: един и същ избор за всички класове */
.rp-vpick{ display:grid; gap:12px; margin-bottom:18px; }
.rp-vrow{ display:grid; grid-template-columns:170px minmax(0,1fr); gap:14px; align-items:start; padding:16px 18px; border-radius:16px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.rp-vrow > b{ font-family:'Fraunces',serif; font-weight:400; font-size:19px; color:var(--ink); padding-top:6px; }
.rp-vrow > b small{ display:block; font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft); margin-top:3px; }
.rp-vrow .rp-classes{ margin:0; }
.rp-chip.rp-name{ font-size:13px; }
.rp-pick .cls{ font-size:30px; }
@media (max-width:640px){ .rp-vrow{ grid-template-columns:1fr; } }

/* ===========================================================================
   73. ПОПРАВКИ СЛЕД ПРОВЕРКАТА НА ТЕЛЕФОН
=========================================================================== */
/* Материална база: маршрутът с копчетата разпъваше колоната до 1100px и
   рисунката излизаше огромна и изрязана. Колоната вече не може да расте. */
@media (max-width:860px){
  .mb-tour{ grid-template-columns:minmax(0,1fr); }
  .mb-tour > *{ min-width:0; }
  .mb-route{ max-width:100%; }
}
/* Алеко ТВ: на тесен екран заглавието и „СЕЗОН 1 · КАНАЛ 01“ се застъпваха */
@media (max-width:560px){
  .atv-osd{ left:12px; right:12px; bottom:10px; flex-direction:column; align-items:flex-start; gap:2px; }
  .atv-osd b{ font-size:13px; }
  .atv-osd span{ font-size:9.5px; }
  .atv-play{ top:42%; }
}
/* Дребните надписи с главни букви стават поне 11px на телефон */
@media (max-width:640px){
  .rp-t .today, .kv-cert .when, .ek-ribbon small, .atv-ep, .os2-d .v, .pp-folder small, .rb-kick,
  .dk-col b.plate, .pp-poster small, .pp-plate small, .uc-state small, .ed2-row, .zz-dpo small,
  .kt-b small, .rp-today b, .mb-stop small, .pq-sq .tap{ font-size:11px; }
}

/* ===========================================================================
   74. КЛУБ „МАЖОРЕТЕН СЪСТАВ“ (mazhoretki.html)
   Страницата е с отделна, модерна визия: светъл градиент, едра типография,
   бенто мрежа, викторина и табло на изявите. Класовете са с представка mzh-.
=========================================================================== */
[data-theme="mazhoretki"]{ --brick:#D6334A; --brick-deep:#8E1F30; --brick-bg:#FBE3E6; --mz-gold:#C9982F; }
[data-theme="mazhoretki"] .ed-cover{ background-image:url('art/cover-mazhoretki.svg'); }

/* ---- Мажоретки, вариант Ж: модерна, но светла (mzh-) ---- */
.mzh{ --hot:#D6334A; --hot2:#8E1F30; --gold:#C9982F; --ink:#241B1E; --dim:#6E6168; --line:rgba(36,27,30,.1); --soft:#FFF7F3;
  margin:0 calc(50% - 50vw); padding:0 0 clamp(50px,7vw,90px); background:linear-gradient(180deg,#FFF7F3 0%, #FDF1EC 45%, #F9EDE6 100%); color:var(--ink); overflow:hidden; position:relative; }
.mzh::before, .mzh::after{ content:''; position:absolute; border-radius:50%; filter:blur(60px); opacity:.5; pointer-events:none; }
.mzh::before{ width:420px; height:420px; background:rgba(214,51,74,.22); top:8%; right:-120px; animation:mzhFloat 18s ease-in-out infinite alternate; }
.mzh::after{ width:380px; height:380px; background:rgba(201,152,47,.26); bottom:12%; left:-130px; animation:mzhFloat 22s ease-in-out infinite alternate-reverse; }
@keyframes mzhFloat{ from{ transform:translate(0,0); } to{ transform:translate(-40px,50px); } }
.mzh-wrap{ position:relative; z-index:1; max-width:1180px; margin:0 auto; padding:0 clamp(18px,4vw,48px); }
.mzh h1,.mzh h2,.mzh h3{ font-family:'Manrope',sans-serif; letter-spacing:-.025em; }

.mzh-hero{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(24px,4vw,56px); align-items:center; padding:clamp(34px,6vw,74px) 0 clamp(26px,4vw,48px); }
.mzh-tag{ display:inline-flex; align-items:center; gap:10px; padding:8px 15px; border-radius:999px; background:#fff; box-shadow:0 0 0 1px var(--line);
  font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:var(--hot2); }
.mzh-tag i{ width:7px; height:7px; border-radius:50%; background:var(--hot); animation:mzhBlink 2s ease-in-out infinite; }
@keyframes mzhBlink{ 0%,100%{ opacity:1; } 50%{ opacity:.3; } }
.mzh-h1{ margin:20px 0 0; font-weight:800; font-size:clamp(40px,7vw,92px); line-height:.95; color:var(--ink); }
.mzh-h1 em{ font-style:normal; background:linear-gradient(120deg,var(--hot),var(--gold)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.mzh-lead{ margin:20px 0 0; font-size:clamp(16px,1.7vw,19px); line-height:1.75; color:var(--dim); max-width:46ch; }
.mzh-meta{ display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.mzh-meta span{ padding:10px 16px; border-radius:12px; background:#fff; box-shadow:0 0 0 1px var(--line); font-family:'Manrope',sans-serif; font-size:13.5px; font-weight:700; }
.mzh-meta b{ color:var(--hot); margin-right:6px; }
.mzh-shot{ position:relative; border-radius:26px; overflow:hidden; aspect-ratio:4/5; box-shadow:0 30px 60px -34px rgba(90,30,40,.5); cursor:pointer; }
.mzh-shot img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform 1.1s cubic-bezier(.2,.8,.3,1); }
.mzh-shot:hover img{ transform:scale(1.06); }
.mzh-shot figcaption{ position:absolute; left:16px; bottom:14px; z-index:2; font-family:'Manrope',sans-serif; font-size:12.5px; font-weight:700; color:#fff; text-shadow:0 2px 10px rgba(0,0,0,.6); }
@media (max-width:860px){ .mzh-hero{ grid-template-columns:1fr; } .mzh-shot{ aspect-ratio:16/11; } }

.mzh-ticker{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:12px 0; overflow:hidden; background:#fff; }
.mzh-track{ display:flex; gap:40px; width:max-content; animation:mzhRun 28s linear infinite; }
.mzh-track span{ font-family:'Manrope',sans-serif; font-weight:800; font-size:clamp(17px,2.2vw,26px); color:rgba(36,27,30,.16); white-space:nowrap; }
.mzh-track i{ font-style:normal; color:var(--hot); }
@keyframes mzhRun{ to{ transform:translateX(-50%); } }

.mzh-bento{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-top:clamp(34px,5vw,60px); }
.mzh-card{ position:relative; border-radius:22px; background:#fff; box-shadow:0 0 0 1px var(--line), 0 18px 34px -28px rgba(90,40,50,.5); padding:24px; overflow:hidden;
  opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.8,.3,1), box-shadow .3s; }
.mzh-card.in{ opacity:1; transform:none; }
.mzh-card:hover{ box-shadow:0 0 0 1px rgba(214,51,74,.35), 0 26px 44px -26px rgba(90,40,50,.55); }
.mzh-card .no{ font-family:'Manrope',sans-serif; font-size:12px; font-weight:800; letter-spacing:.18em; color:var(--hot); }
.mzh-card h3{ margin:12px 0 8px; font-size:20px; font-weight:800; }
.mzh-card p{ margin:0; font-size:14.5px; line-height:1.65; color:var(--dim); }
.mzh-card.wide{ grid-column:span 2; }
.mzh-card.accent{ background:linear-gradient(140deg,var(--hot),var(--hot2)); color:#fff; }
.mzh-card.accent h3{ font-size:25px; } .mzh-card.accent p{ color:rgba(255,255,255,.85); }
.mzh-card.photo{ padding:0; min-height:220px; cursor:pointer; }
.mzh-card.photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1s cubic-bezier(.2,.8,.3,1); }
.mzh-card.photo:hover img{ transform:scale(1.05); }
.mzh-card.photo::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 50%, rgba(20,10,14,.75)); }
.mzh-card.photo figcaption{ position:absolute; left:16px; bottom:14px; z-index:2; font-family:'Manrope',sans-serif; font-size:12.5px; font-weight:700; color:#fff; }
@media (max-width:900px){ .mzh-bento{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px){ .mzh-bento{ grid-template-columns:1fr; } .mzh-card.wide{ grid-column:span 1; } }

.mzh-beat{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:clamp(24px,4vw,52px); align-items:center; margin-top:14px;
  padding:clamp(24px,4vw,40px); border-radius:26px; background:#fff; box-shadow:0 0 0 1px var(--line), 0 22px 40px -32px rgba(90,40,50,.5); }
.mzh-pad{ position:relative; width:clamp(140px,18vw,190px); aspect-ratio:1; border-radius:50%; border:0; cursor:pointer; color:var(--hot2);
  background:radial-gradient(circle at 40% 34%, #fff, #F3E4DC); box-shadow:0 0 0 10px rgba(214,51,74,.12), inset 0 -8px 20px rgba(90,40,50,.12);
  font-family:'Manrope',sans-serif; font-weight:800; font-size:clamp(34px,4.6vw,52px); transition:transform .12s, box-shadow .25s; }
.mzh-pad:active{ transform:scale(.97); }
.mzh-pad.hit{ box-shadow:0 0 0 16px rgba(214,51,74,.16), 0 0 44px rgba(214,51,74,.3); }
.mzh-pad small{ display:block; font-size:11px; letter-spacing:.2em; color:var(--dim); }
.mzh-beat h3{ font-size:clamp(22px,2.6vw,30px); font-weight:800; margin:12px 0 10px; }
.mzh-beat p{ margin:0 0 18px; font-size:16px; line-height:1.7; color:var(--dim); max-width:44ch; }
.mzh-keys{ display:flex; flex-wrap:wrap; gap:8px; }
.mzh-key{ width:52px; height:52px; border-radius:14px; border:0; cursor:pointer; background:#F6ECE7; color:var(--ink); font-family:'Manrope',sans-serif; font-weight:800; font-size:17px; transition:all .2s; }
.mzh-key.on{ background:var(--hot); color:#fff; }
.mzh-run{ height:52px; padding:0 22px; border-radius:14px; border:0; cursor:pointer; background:var(--gold); color:#2A1F06; font-family:'Manrope',sans-serif; font-weight:800; font-size:14px; }
@media (max-width:640px){ .mzh-beat{ grid-template-columns:1fr; justify-items:center; text-align:center; } .mzh-keys{ justify-content:center; } }

/* викторина */
.mzh-quiz{ margin-top:14px; padding:clamp(24px,4vw,40px); border-radius:26px; background:#fff; box-shadow:0 0 0 1px var(--line), 0 22px 40px -32px rgba(90,40,50,.5); }
.mzh-qtop{ display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; font-family:'Manrope',sans-serif; font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--hot); }
.mzh-qdots{ display:flex; gap:6px; }
.mzh-qdots i{ width:22px; height:6px; border-radius:3px; background:rgba(36,27,30,.14); }
.mzh-qdots i.ok{ background:#3FA96A; } .mzh-qdots i.no{ background:var(--hot); opacity:.55; }
.mzh-q{ font-family:'Manrope',sans-serif; font-weight:800; font-size:clamp(20px,2.4vw,27px); line-height:1.3; margin:0 0 18px; }
.mzh-opts{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.mzh-opts button{ text-align:left; padding:15px 18px; border-radius:14px; border:0; cursor:pointer; background:#F7EFEA; color:var(--ink);
  font-family:'Manrope',sans-serif; font-size:16px; font-weight:700; transition:transform .2s, background .2s; }
.mzh-opts button:hover:not(:disabled){ transform:translateY(-2px); background:#F3E4DC; }
.mzh-opts button.ok{ background:#E2F3E8; color:#1F6B3F; } .mzh-opts button.no{ background:#FBE3E6; color:#8E1F30; }
.mzh-fb{ min-height:26px; margin:16px 0 0; font-size:15.5px; line-height:1.6; color:var(--dim); }
.mzh-next{ margin-top:12px; height:48px; padding:0 22px; border-radius:14px; border:0; cursor:pointer; background:var(--hot); color:#fff; font-family:'Manrope',sans-serif; font-weight:800; font-size:14.5px; }
.mzh-end{ text-align:center; padding:8px 0; }
.mzh-end b{ display:block; font-family:'Manrope',sans-serif; font-weight:800; font-size:clamp(22px,2.6vw,30px); }
.mzh-end span{ display:block; margin:8px 0 16px; color:var(--dim); }
@media (max-width:560px){ .mzh-opts{ grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce){ .mzh::before,.mzh::after,.mzh-track,.mzh-tag i{ animation:none; } .mzh-card{ opacity:1; transform:none; } }

/* Мажоретки — табло на изявите (снимки и видеа) */
.mzh-board{ margin-top:14px; padding:clamp(24px,4vw,40px); border-radius:26px; background:#fff; box-shadow:0 0 0 1px var(--line), 0 22px 40px -32px rgba(90,40,50,.5); }
.mzh-bhead{ display:flex; justify-content:space-between; align-items:flex-end; gap:16px; flex-wrap:wrap; margin-bottom:18px; }
.mzh-bhead h3{ margin:6px 0 0; font-size:clamp(22px,2.6vw,30px); font-weight:800; }
.mzh-bhead .no{ font-family:'Manrope',sans-serif; font-size:12px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:var(--hot); }
.mzh-bhead span.count{ font-family:'Manrope',sans-serif; font-size:13px; font-weight:700; color:var(--dim); }
.mzh-tiles{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.mzh-tile{ position:relative; border:0; padding:0; border-radius:16px; overflow:hidden; cursor:pointer; background:#F3E4DC; aspect-ratio:4/3;
  box-shadow:0 0 0 1px var(--line); transition:transform .4s cubic-bezier(.2,.8,.3,1), box-shadow .3s; }
.mzh-tile img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .8s cubic-bezier(.2,.8,.3,1); }
.mzh-tile:hover{ transform:translateY(-4px); box-shadow:0 0 0 1px rgba(214,51,74,.4), 0 18px 30px -20px rgba(90,40,50,.5); }
.mzh-tile:hover img{ transform:scale(1.06); }
.mzh-tile figcaption{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:22px 12px 10px; text-align:left;
  background:linear-gradient(180deg, transparent, rgba(20,10,14,.8)); color:#fff; font-family:'Manrope',sans-serif; font-size:12.5px; font-weight:700; }
.mzh-tile .kind{ position:absolute; left:10px; top:10px; z-index:2; display:inline-flex; align-items:center; gap:6px; padding:5px 9px; border-radius:8px;
  background:rgba(255,255,255,.92); color:var(--hot2); font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.mzh-tile .play{ position:absolute; left:50%; top:50%; width:52px; height:52px; margin:-26px 0 0 -26px; z-index:2; border-radius:50%; background:rgba(214,51,74,.94); color:#fff;
  display:grid; place-items:center; box-shadow:0 8px 20px rgba(0,0,0,.35); transition:transform .3s; }
.mzh-tile:hover .play{ transform:scale(1.12); }
.mzh-tile .play svg{ width:20px; height:20px; margin-left:3px; }
.mzh-board .note{ margin:16px 0 0; font-size:14px; line-height:1.6; color:var(--dim); }
.mzh-player{ margin-top:14px; border-radius:18px; overflow:hidden; background:#000; display:none; }
.mzh-player.on{ display:block; }
.mzh-player video, .mzh-player iframe{ width:100%; aspect-ratio:16/9; display:block; border:0; }
@media (max-width:900px){ .mzh-tiles{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:480px){ .mzh-tiles{ grid-template-columns:1fr; } }

/* Началната — картата на мажоретния състав: рисувана сцена и знак в средата,
   както при Творилница и Пътешественици */
.rb-img-mazh{ background:#F6E7E0 url('art/rb-mazhoretki.svg') center/cover no-repeat; display:grid; place-items:center; }
.rb-img-mazh img{ position:relative; width:30%; max-width:110px; height:auto; aspect-ratio:1; border-radius:50%; object-fit:cover;
  box-shadow:0 0 0 5px #fff, 0 12px 26px -8px rgba(90,30,40,.4); transition:transform .5s ease; }
.rb-mazh .rb-kick{ color:#C02A42; }
.rb-mazh:hover{ border-color:#C02A42; }
.rb-mazh:hover .rb-img-mazh img{ transform:scale(1.06) rotate(-4deg); }

/* ===========================================================================
   75. КЛУБ ПО ХАНДБАЛ (handbal.html) — страница в стила на сайта
   Герой със снимка, факти, постижения, галерия, а най-долу игрището и
   стрелбата по вратата. Представка hn-.
=========================================================================== */
[data-theme="handbal"]{ --brick:#1E7A6B; --brick-deep:#14564C; --brick-bg:#DCEFEA; --hb-amber:#E8A33D; --hb-court:#0F2A31; --hb-line:#8BD9C7; }
[data-theme="handbal"] .ed-cover{ background-image:url('art/cover-handbal.svg'); }

.hn-hero{ display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,480px); gap:clamp(24px,4vw,56px); align-items:center; margin-top:clamp(20px,3vw,34px); }
.hn-lead{ font-size:clamp(16px,1.8vw,19px); line-height:1.8; color:var(--ink-soft); max-width:50ch; }
.hn-facts{ display:grid; gap:10px; margin-top:24px; max-width:460px; }
.hn-fact{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:14px; padding:14px 18px; border-radius:16px;
  background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); transition:transform .25s, box-shadow .25s; }
.hn-fact:hover{ transform:translateX(4px); box-shadow:0 0 0 1px var(--brick), 0 12px 22px -16px rgba(20,86,76,.5); }
.hn-fact .ic{ width:38px; height:38px; border-radius:12px; background:var(--brick-bg); color:var(--brick-deep); display:grid; place-items:center; }
.hn-fact .ic svg{ width:20px; height:20px; }
.hn-fact b{ font-family:'Fraunces',serif; font-weight:400; font-size:19px; color:var(--ink); display:block; }
.hn-fact span{ font-size:14px; color:var(--ink-soft); }
.hn-fact em{ font-style:normal; font-family:'Manrope',sans-serif; font-size:12px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--brick); white-space:nowrap; }
.hn-photo{ position:relative; border-radius:26px; overflow:hidden; aspect-ratio:4/3; cursor:pointer;
  box-shadow:0 30px 58px -34px rgba(20,60,50,.6); }
.hn-photo img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform 1.1s cubic-bezier(.2,.8,.3,1); }
.hn-photo:hover img{ transform:scale(1.05); }
.hn-photo figcaption{ position:absolute; left:0; right:0; bottom:0; padding:28px 16px 14px; color:#fff;
  background:linear-gradient(180deg,transparent,rgba(8,30,26,.82)); font-family:'Manrope',sans-serif; font-size:13px; font-weight:700; }
@media (max-width:900px){ .hn-hero{ grid-template-columns:1fr; } }

/* постиженията */
.hn-win{ margin:clamp(34px,5vw,56px) calc(50% - 50vw) 0; padding:clamp(28px,4vw,46px) clamp(18px,5vw,50px);
  background:linear-gradient(150deg,#14564C,#0F2A31); color:#EAF6F2; }
.hn-win-in{ max-width:1180px; margin:0 auto; display:grid; grid-template-columns:auto minmax(0,1fr); gap:clamp(20px,4vw,48px); align-items:center; }
.hn-cup{ font-size:clamp(46px,7vw,86px); line-height:1; }
.hn-win h3{ margin:0 0 10px; font-family:'Fraunces',serif; font-weight:400; font-size:clamp(24px,3.2vw,38px); line-height:1.15; }
.hn-win h3 em{ font-style:normal; color:var(--hb-amber); }
.hn-win p{ margin:0; font-size:16.5px; line-height:1.75; color:rgba(234,246,242,.78); max-width:60ch; }
@media (max-width:640px){ .hn-win-in{ grid-template-columns:1fr; } }

/* галерия */
.hn-gal{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:20px; }
.hn-gal figure{ position:relative; margin:0; border-radius:16px; overflow:hidden; aspect-ratio:4/3; cursor:pointer; background:#DCEFEA;
  box-shadow:0 0 0 1px var(--line,#E7DDCD); transition:transform .35s cubic-bezier(.2,.8,.3,1), box-shadow .3s; }
.hn-gal img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .8s ease; }
.hn-gal figure:hover{ transform:translateY(-4px); box-shadow:0 0 0 1px var(--brick), 0 18px 30px -20px rgba(20,60,50,.5); }
.hn-gal figure:hover img{ transform:scale(1.06); }
.hn-gal figcaption{ position:absolute; left:0; right:0; bottom:0; padding:24px 10px 9px; color:#fff;
  background:linear-gradient(180deg,transparent,rgba(8,30,26,.8)); font-family:'Manrope',sans-serif; font-size:12px; font-weight:700; }
@media (max-width:900px){ .hn-gal{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* правилата */
.hn-rules{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:20px; }
.hn-rule{ padding:22px 20px; border-radius:18px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); transition:transform .3s, box-shadow .3s; }
.hn-rule:hover{ transform:translateY(-4px); box-shadow:0 0 0 1px var(--brick), 0 18px 30px -22px rgba(20,86,76,.5); }
.hn-rule b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:clamp(30px,4vw,44px); line-height:1; color:var(--brick); }
.hn-rule span{ display:block; margin-top:8px; font-family:'Manrope',sans-serif; font-size:14.5px; font-weight:700; color:var(--ink); }
.hn-rule p{ margin:6px 0 0; font-size:13.5px; line-height:1.6; color:var(--ink-soft); }
@media (max-width:900px){ .hn-rules{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* играта долу */
.hn-play{ margin-top:clamp(34px,5vw,56px); padding:clamp(22px,3.4vw,38px); border-radius:28px;
  background:linear-gradient(160deg,#16414A,#0F2A31); color:#EAF6F2; }
.hn-play .ed-kicker{ color:var(--hb-line); }
.hn-play h3{ margin:8px 0 6px; font-family:'Fraunces',serif; font-weight:400; font-size:clamp(24px,3vw,34px); color:#EAF6F2; }
.hn-play p.sub{ margin:0 0 20px; font-size:16px; line-height:1.7; color:rgba(234,246,242,.72); max-width:60ch; }
.hn-two{ display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:clamp(20px,3vw,40px); align-items:center; }
@media (max-width:860px){ .hn-two{ grid-template-columns:1fr; } }

/* --- Хандбал: игрището, позициите и стрелбата (от играта долу на страницата) --- */
.hb-court{ position:relative; border-radius:20px; overflow:hidden; background:linear-gradient(160deg,#17454E,#0F2A31); box-shadow:0 26px 50px -32px rgba(10,40,45,.9); }
.hb-court svg{ width:100%; height:auto; display:block; }
.hb-pos{ position:absolute; width:40px; height:40px; margin:-20px 0 0 -20px; border-radius:50%; border:0; cursor:pointer;
  background:rgba(234,246,242,.9); color:#0F2A31; font-family:'Manrope',sans-serif; font-weight:800; font-size:13px;
  box-shadow:0 0 0 2px rgba(139,217,199,.6), 0 8px 16px -8px rgba(0,0,0,.6); transition:transform .3s cubic-bezier(.34,1.5,.5,1), background .25s; }
.hb-pos:hover{ transform:scale(1.12); }
.hb-pos.on{ background:var(--hb-amber); box-shadow:0 0 0 4px rgba(232,163,61,.35), 0 8px 18px -6px rgba(0,0,0,.6); }
.hb-panel{ min-height:200px; }
.hb-panel small{ font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:var(--brick); }
.hb-panel h3{ margin:8px 0 10px; font-family:'Manrope',sans-serif; font-weight:800; font-size:clamp(22px,2.6vw,30px); color:var(--ink); }
.hb-panel p{ margin:0; font-size:16px; line-height:1.75; color:var(--ink-soft); max-width:42ch; }
@media (max-width:860px){ .hb-court-wrap{ grid-template-columns:1fr; } }

/* правилата */
.hb-rules{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.hb-rule{ padding:24px 20px; border-radius:18px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); transition:transform .35s cubic-bezier(.2,.8,.3,1), box-shadow .3s; }
.hb-rule:hover{ transform:translateY(-4px); box-shadow:0 0 0 1px var(--brick), 0 20px 34px -24px rgba(20,86,76,.5); }
.hb-rule b{ display:block; font-family:'Manrope',sans-serif; font-weight:800; font-size:clamp(34px,4.4vw,48px); line-height:1; color:var(--brick); }
.hb-rule span{ display:block; margin-top:8px; font-family:'Manrope',sans-serif; font-size:15px; font-weight:700; color:var(--ink); }
.hb-rule p{ margin:6px 0 0; font-size:13.5px; line-height:1.6; color:var(--ink-soft); }
@media (max-width:900px){ .hb-rules{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* предстои */
.hb-soon{ padding:26px; border-radius:18px; background:var(--brick-bg); display:grid; grid-template-columns:auto minmax(0,1fr); gap:18px; align-items:center; }
.hb-soon .ic{ width:52px; height:52px; border-radius:16px; background:#fff; color:var(--brick); display:grid; place-items:center; font-size:24px; }
.hb-soon b{ display:block; font-family:'Manrope',sans-serif; font-weight:800; font-size:18px; color:var(--ink); margin-bottom:4px; }
.hb-soon span{ font-size:15px; line-height:1.6; color:var(--ink-soft); }

/* Хандбал — живата атака и стрелбата (само на тази страница) */
.hb-ball{ position:absolute; width:26px; height:26px; margin:-13px 0 0 -13px; border-radius:50%; z-index:3; pointer-events:none;
  background:radial-gradient(circle at 34% 30%, #FFD79A, #E8A33D 60%, #B9741F);
  box-shadow:0 6px 14px -4px rgba(0,0,0,.6), inset 0 -3px 6px rgba(0,0,0,.25);
  transition:left .5s cubic-bezier(.35,.9,.4,1), top .5s cubic-bezier(.35,.9,.4,1), transform .5s; opacity:0; }
.hb-ball.on{ opacity:1; }
.hb-ball.spin{ animation:hbSpin .5s linear; }
@keyframes hbSpin{ to{ transform:rotate(360deg); } }
.hb-flash{ position:absolute; inset:0; z-index:4; display:grid; place-items:center; pointer-events:none; opacity:0; }
.hb-flash.go{ animation:hbFlash 1.4s ease; }
.hb-flash b{ font-family:'Manrope',sans-serif; font-weight:800; font-size:clamp(34px,6vw,64px); color:#E8A33D; letter-spacing:.06em;
  text-shadow:0 6px 30px rgba(232,163,61,.6); }
@keyframes hbFlash{ 0%{ opacity:0; transform:scale(.7); } 30%{ opacity:1; transform:scale(1.05); } 100%{ opacity:0; transform:scale(1.1); } }
.hb-run{ display:inline-flex; align-items:center; gap:10px; margin-top:16px; border:0; cursor:pointer; padding:13px 24px; border-radius:999px;
  background:var(--brick); color:#fff; font-family:'Manrope',sans-serif; font-weight:800; font-size:14.5px; transition:background .3s, transform .3s; }
.hb-run:hover{ background:var(--brick-deep); transform:translateY(-2px); }
.hb-say{ margin:12px 0 0; min-height:24px; font-family:'Manrope',sans-serif; font-weight:700; font-size:15px; color:var(--brick-deep); }

/* стрелба по вратата */
.hb-shoot{ margin-top:26px; padding:clamp(22px,3.4vw,36px); border-radius:24px; background:linear-gradient(160deg,#16414A,#0F2A31); color:#EAF6F2; }
.hb-goal{ position:relative; width:100%; max-width:640px; margin:0 auto; aspect-ratio:2/1; border-radius:14px; overflow:hidden;
  background:linear-gradient(180deg,#123840,#0C2329); box-shadow:inset 0 0 0 1px rgba(139,217,199,.25); }
.hb-goal svg{ position:absolute; inset:0; width:100%; height:100%; }
.hb-keeper{ position:absolute; left:50%; top:50%; width:9%; height:27%; margin-left:-4.5%; border-radius:12px 12px 6px 6px;
  background:linear-gradient(180deg,#E8A33D,#C9812A); box-shadow:0 8px 18px -8px rgba(0,0,0,.7); }
.hb-keeper::before{ content:''; position:absolute; left:50%; top:-26%; width:52%; height:34%; margin-left:-26%; border-radius:50%; background:#F3D9A8; }
.hb-keeper::after{ content:''; position:absolute; left:-32%; right:-32%; top:14%; height:16%; border-radius:8px; background:#E8A33D; opacity:.85; }
.hb-shot{ position:absolute; width:20px; height:20px; margin:-10px 0 0 -10px; border-radius:50%; z-index:3;
  background:radial-gradient(circle at 34% 30%, #FFD79A, #E8A33D 60%, #B9741F); opacity:0; }
.hb-shot.fly{ animation:hbFly .55s cubic-bezier(.3,.8,.5,1) forwards; }
@keyframes hbFly{ from{ opacity:1; transform:translate(0,0) scale(1); } to{ opacity:1; transform:translate(var(--dx), var(--dy)) scale(.8); } }
.hb-shoot .keys{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:20px; }
.hb-shoot .keys button{ border:0; cursor:pointer; padding:13px 20px; border-radius:14px; background:rgba(234,246,242,.12); color:#EAF6F2;
  font-family:'Manrope',sans-serif; font-weight:800; font-size:14px; transition:background .2s, transform .2s; }
.hb-shoot .keys button:hover{ background:rgba(234,246,242,.22); transform:translateY(-2px); }
.hb-shoot .keys button.main{ background:var(--hb-amber); color:#22160A; }
.hb-shoot h3{ margin:0 0 6px; font-family:'Manrope',sans-serif; font-weight:800; font-size:clamp(22px,2.6vw,30px); text-align:center; }
.hb-shoot .sub{ margin:0 0 20px; text-align:center; font-size:15px; color:rgba(234,246,242,.7); }
.hb-tally{ display:flex; justify-content:center; gap:10px; margin:18px 0 0; }
.hb-tally i{ width:26px; height:8px; border-radius:4px; background:rgba(234,246,242,.2); }
.hb-tally i.goal{ background:#6BD39B; } .hb-tally i.save{ background:#E05A5A; opacity:.7; }
.hb-result{ margin-top:14px; text-align:center; font-family:'Manrope',sans-serif; font-weight:800; font-size:clamp(18px,2.2vw,24px); }
.hb-result small{ display:block; margin-top:6px; font-size:14px; font-weight:600; color:rgba(234,246,242,.7); }

/* Хандбал — още заигравка: живо табло, треперене на мрежата, броячи */
.hb-scoreboard .live{ color:#6BD39B; }
.hb-scoreboard .row.big span{ font-size:26px; }
.hb-goal.shake{ animation:hbShake .5s ease; }
@keyframes hbShake{ 20%{ transform:translateX(-4px); } 40%{ transform:translateX(4px); } 60%{ transform:translateX(-2px); } 100%{ transform:none; } }
.hb-goal .netflash{ position:absolute; inset:0; background:radial-gradient(circle at var(--gx,50%) var(--gy,50%), rgba(107,211,155,.45), transparent 45%); opacity:0; pointer-events:none; }
.hb-goal .netflash.go{ animation:hbNet .6s ease; }
@keyframes hbNet{ 0%{ opacity:0; } 25%{ opacity:1; } 100%{ opacity:0; } }
.hb-court .hb-ball{ cursor:grab; pointer-events:auto; }
.hb-court .hb-ball.drag{ cursor:grabbing; transition:none; transform:scale(1.12); }
.hb-hint{ margin:10px 0 0; font-size:13.5px; color:var(--ink-soft); }
.hb-rule b{ font-variant-numeric:tabular-nums; }

/* Новина „Европейски ден на спорта“ — програмата на деня (ds-) */
.ds-prog{ display:grid; gap:10px; margin:26px 0 0; }
.ds-row{ display:grid; grid-template-columns:104px minmax(0,1fr); gap:18px; align-items:start; padding:16px 18px; border-radius:16px;
  background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); transition:transform .3s, box-shadow .3s; }
.ds-row:hover{ transform:translateX(4px); box-shadow:0 0 0 1px var(--brick), 0 14px 26px -20px rgba(40,30,20,.4); }
.ds-row .t{ font-family:'Fraunces',serif; font-size:22px; line-height:1.1; color:var(--brick-deep); }
.ds-row .t small{ display:block; font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); margin-top:4px; }
.ds-row b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:19px; color:var(--ink); margin-bottom:4px; }
.ds-row p{ margin:0; font-size:14.5px; line-height:1.6; color:var(--ink-soft); }
.ds-note{ margin-top:22px; padding:20px 24px; border-radius:16px; background:var(--brick-bg); display:flex; gap:14px; align-items:center; }
.ds-note span{ font-size:26px; }
.ds-note b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:20px; color:var(--ink); margin-bottom:4px; }
.ds-note p{ margin:0; font-size:15px; line-height:1.6; color:var(--ink-soft); }
@media (max-width:640px){ .ds-row{ grid-template-columns:1fr; gap:6px; } }

/* ===========================================================================
   76. НАЧАЛНА — ВИТРИНА НА КЛУБОВЕТЕ (rb2-)
   Големите карти станаха твърде дълги с всеки нов клуб. Витрината е по-ниска
   и побира всички на един екран, с филтър по вид.
=========================================================================== */
.rb2-tools{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 20px; }
.rb2-tools button{ border:1px solid var(--line,#E7DDCD); background:#fff; cursor:pointer; padding:9px 16px; border-radius:999px;
  font-family:'Manrope',sans-serif; font-weight:700; font-size:13.5px; color:var(--ink); transition:all .2s; }
.rb2-tools button i{ font-style:normal; opacity:.5; margin-left:5px; }
.rb2-tools button:hover{ border-color:var(--brick); }
.rb2-tools button.on{ background:var(--brick); border-color:var(--brick); color:#fff; }
.rb2-tools button.on i{ opacity:.75; }
.rb2-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(12px,1.6vw,18px); }
.rb2-card{ position:relative; display:flex; flex-direction:column; border-radius:18px; overflow:hidden; text-decoration:none; color:var(--ink);
  background:var(--cream-3,#FBF8F1); box-shadow:0 0 0 1px var(--line,#E7DDCD);
  transition:transform .4s cubic-bezier(.2,.8,.3,1), box-shadow .3s, opacity .3s; }
.rb2-card:hover{ transform:translateY(-5px); box-shadow:0 0 0 1px var(--brick), 0 22px 38px -26px rgba(60,40,30,.5); }
.rb2-card[hidden]{ display:none; }
.rb2-img{ position:relative; aspect-ratio:16/9; background:#EFE6DB center/cover no-repeat; display:grid; place-items:center; overflow:hidden; }
.rb2-img img{ width:30%; max-width:84px; aspect-ratio:1; border-radius:50%; object-fit:cover; box-shadow:0 0 0 4px #fff, 0 10px 20px -8px rgba(50,30,20,.35); transition:transform .5s ease; }
.rb2-img.photo img{ width:100%; max-width:none; aspect-ratio:auto; height:100%; border-radius:0; box-shadow:none; object-fit:cover; }
.rb2-card:hover .rb2-img img{ transform:scale(1.06); }
.rb2-cat{ position:absolute; left:10px; top:10px; z-index:2; padding:5px 10px; border-radius:8px; background:rgba(255,253,247,.94);
  font-family:'Manrope',sans-serif; font-size:10px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--c,#A24C36); }
.rb2-play{ position:absolute; right:10px; bottom:10px; z-index:2; width:34px; height:34px; border-radius:50%; background:rgba(255,253,247,.94);
  display:grid; place-items:center; color:var(--brick); box-shadow:0 6px 14px -6px rgba(0,0,0,.4); }
.rb2-body{ padding:14px 16px 16px; display:flex; flex-direction:column; gap:5px; flex:1; }
.rb2-body b{ font-family:'Fraunces',serif; font-weight:400; font-size:19px; line-height:1.2; }
.rb2-body span{ font-size:13.5px; line-height:1.55; color:var(--ink-soft); }
.rb2-body em{ margin-top:auto; padding-top:8px; font-style:normal; font-family:'Manrope',sans-serif; font-size:12.5px; font-weight:800; color:var(--c,#A24C36); }
.rb2-none{ display:none; padding:26px; text-align:center; color:var(--ink-soft); }
@media (max-width:900px){ .rb2-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px){ .rb2-grid{ grid-template-columns:1fr; } .rb2-img{ aspect-ratio:16/7; } }
/* витрината: рисуваните сцени зад знаците */
.rb2-img.rb-img-tvor{ background:#F6E9DD url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NDAgMzYwIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWlkWU1pZCBzbGljZSI+CjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iYmciIHgxPSIwIiB5MT0iMCIgeDI9IjEiIHkyPSIxIj48c3RvcCBvZmZzZXQ9IjAiIHN0b3AtY29sb3I9IiNGQUVGRTYiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiNGMkUyRDIiLz48L2xpbmVhckdyYWRpZW50Pgo8ZmlsdGVyIGlkPSJzb2Z0IiB4PSItMzAlIiB5PSItMzAlIiB3aWR0aD0iMTYwJSIgaGVpZ2h0PSIxNjAlIj48ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyMiIvPjwvZmlsdGVyPjwvZGVmcz4KPHJlY3Qgd2lkdGg9IjY0MCIgaGVpZ2h0PSIzNjAiIGZpbGw9InVybCgjYmcpIi8+CjxnIGZpbHRlcj0idXJsKCNzb2Z0KSI+PGVsbGlwc2UgY3g9IjEyMCIgY3k9IjE5MCIgcng9IjE1MCIgcnk9IjExMCIgZmlsbD0iI0E4Mzg1RSIgZmlsbC1vcGFjaXR5PSIuMTYiLz48ZWxsaXBzZSBjeD0iNTMwIiBjeT0iMTcwIiByeD0iMTUwIiByeT0iMTEwIiBmaWxsPSIjNkU5QzVDIiBmaWxsLW9wYWNpdHk9Ii4xNiIvPjxlbGxpcHNlIGN4PSIzMjAiIGN5PSIzMzAiIHJ4PSIyMjAiIHJ5PSI2MCIgZmlsbD0iI0M5OEEzQSIgZmlsbC1vcGFjaXR5PSIuMTYiLz48L2c+CjxnIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzNBMzIyQiIgc3Ryb2tlLXdpZHRoPSIyLjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+CjxwYXRoIGQ9Ik0wIDMwMEg2NDAiIHN0cm9rZS1vcGFjaXR5PSIuMyIvPgo8cGF0aCBkPSJNNzYgMzAwbC04LTQ4aDkybC04IDQ4eiIgZmlsbD0iI0E4Mzg1RSIgZmlsbC1vcGFjaXR5PSIuMjIiLz48cGF0aCBkPSJNOTAgMzAwbC00LTQ4TTExNCAzMDB2LTQ4TTEzOCAzMDBsNC00OCIgc3Ryb2tlLW9wYWNpdHk9Ii4zNSIvPgo8cGF0aCBkPSJNNjAgMjUycS00LTI2IDI0LTI4cTQtMjQgMzQtMjBxMzItMiAzNCAyMHEyOCA0IDI0IDI4eiIgZmlsbD0iIzdBNEEzNiIgZmlsbC1vcGFjaXR5PSIuMzUiLz4KPGNpcmNsZSBjeD0iMTE2IiBjeT0iMTk2IiByPSI5IiBmaWxsPSIjQTgzODVFIiBmaWxsLW9wYWNpdHk9Ii41NSIvPjxwYXRoIGQ9Ik0xMTYgMTg3cTQtMTIgMTQtMTQiLz4KPHBhdGggZD0iTTQ3MCAyOTBxNzAgMjIgMTQwIDB2MTJxLTcwIDIyLTE0MCAweiIgZmlsbD0iI0M5OEEzQSIgZmlsbC1vcGFjaXR5PSIuMzUiLz48cGF0aCBkPSJNNDcwIDI5MHE3MC0yMCAxNDAgMCIgZmlsbD0iI0Y0RDU4QSIgZmlsbC1vcGFjaXR5PSIuNSIvPgo8Y2lyY2xlIGN4PSI1MTQiIGN5PSIyOTAiIHI9IjciIGZpbGw9IiNDMDUwM0MiIGZpbGwtb3BhY2l0eT0iLjUiLz48Y2lyY2xlIGN4PSI1NjYiIGN5PSIyODYiIHI9IjciIGZpbGw9IiNDMDUwM0MiIGZpbGwtb3BhY2l0eT0iLjUiLz4KPHBhdGggZD0iTTUzOCAyOTZxMTAtMTIgMjAtNHEtMTAgMTAtMjAgNHoiIGZpbGw9IiM2RTlDNUMiIGZpbGwtb3BhY2l0eT0iLjU1Ii8+CjxwYXRoIGQ9Ik01MjAgMjUycS04LTE0IDAtMjhxOC0xNCAwLTI4TTU2MCAyNDhxLTgtMTQgMC0yOHE4LTE0IDAtMjgiIHN0cm9rZS1vcGFjaXR5PSIuNCIvPgo8cGF0aCBkPSJNMTk2IDcwYy01LTctMTYtMy0xMyA1IDIgNSAxMyAxMiAxMyAxMnMxMS03IDEzLTEyYzMtOC04LTEyLTEzLTV6IiBmaWxsPSIjQTgzODVFIiBmaWxsLW9wYWNpdHk9Ii4zIi8+CjxwYXRoIGQ9Ik00NTIgNjRsNCA5IDEwIDItNyA3IDIgMTAtOS01LTkgNSAyLTEwLTctNyAxMC0yeiIgZmlsbD0iI0M5OEEzQSIgZmlsbC1vcGFjaXR5PSIuMzUiLz4KPHJlY3QgeD0iMjUwIiB5PSIzMTYiIHdpZHRoPSIxNDAiIGhlaWdodD0iMTYiIHJ4PSI4IiBmaWxsPSIjQzk4QTNBIiBmaWxsLW9wYWNpdHk9Ii4zNSIvPjxwYXRoIGQ9Ik0yNTAgMzI0aC0zME0zOTAgMzI0aDMwIiBzdHJva2Utd2lkdGg9IjUiIHN0cm9rZS1vcGFjaXR5PSIuMyIvPgo8L2c+PC9zdmc+Cg==') center/cover no-repeat; }
.rb2-img.rb-img-patesh{ background:#F1E4C8 url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NDAgMzYwIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWlkWU1pZCBzbGljZSI+CjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iYmciIHgxPSIwIiB5MT0iMCIgeDI9IjEiIHkyPSIxIj48c3RvcCBvZmZzZXQ9IjAiIHN0b3AtY29sb3I9IiNGN0VERDgiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiNFREREQkQiLz48L2xpbmVhckdyYWRpZW50Pgo8ZmlsdGVyIGlkPSJzb2Z0IiB4PSItMzAlIiB5PSItMzAlIiB3aWR0aD0iMTYwJSIgaGVpZ2h0PSIxNjAlIj48ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyMiIvPjwvZmlsdGVyPjwvZGVmcz4KPHJlY3Qgd2lkdGg9IjY0MCIgaGVpZ2h0PSIzNjAiIGZpbGw9InVybCgjYmcpIi8+CjxnIGZpbHRlcj0idXJsKCNzb2Z0KSI+PGVsbGlwc2UgY3g9IjEyMCIgY3k9IjE5MCIgcng9IjE1MCIgcnk9IjExMCIgZmlsbD0iIzJFNkU3OCIgZmlsbC1vcGFjaXR5PSIuMTgiLz48ZWxsaXBzZSBjeD0iNTMwIiBjeT0iMTgwIiByeD0iMTUwIiByeT0iMTEwIiBmaWxsPSIjOEE5QTNBIiBmaWxsLW9wYWNpdHk9Ii4xOCIvPjxlbGxpcHNlIGN4PSIzMjAiIGN5PSIzMzAiIHJ4PSIyMjAiIHJ5PSI2MCIgZmlsbD0iI0I4ODYzQiIgZmlsbC1vcGFjaXR5PSIuMTQiLz48L2c+CjxnIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzNBMzIyQiIgc3Ryb2tlLXdpZHRoPSIyLjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+CjxwYXRoIGQ9Ik0wIDcwUTMyMCA0MCA2NDAgNzBNMCAxNTBRMzIwIDEyNiA2NDAgMTUwTTAgMjMwUTMyMCAyMTIgNjQwIDIzMCIgc3Ryb2tlLW9wYWNpdHk9Ii4wNyIvPgo8cGF0aCBkPSJNMCAzMDBINjQwIiBzdHJva2Utb3BhY2l0eT0iLjMiLz4KPGNpcmNsZSBjeD0iMTEyIiBjeT0iMjE0IiByPSI1NCIgZmlsbD0iIzZGQTNBOCIgZmlsbC1vcGFjaXR5PSIuMzUiLz4KPHBhdGggZD0iTTU4IDIxNGgxMDhNNjYgMTg2cTQ2IDEwIDkyIDBNNjYgMjQycTQ2LTEwIDkyIDBNMTEyIDE2MHEtMzAgNTQgMCAxMDhNMTEyIDE2MHEzMCA1NCAwIDEwOCIgc3Ryb2tlLW9wYWNpdHk9Ii4zNSIvPgo8cGF0aCBkPSJNODggMTkwcTEyLTkgMjYgMHE0IDE2LTggMjFxLTE4IDEtMTgtMjF6TTEyNCAyMjhxMTQtNCAyMCA2cS00IDEzLTE2IDEweiIgZmlsbD0iIzhBOUEzQSIgZmlsbC1vcGFjaXR5PSIuNSIvPgo8cGF0aCBkPSJNNjAgMTcwcS0zMCA0NCAwIDkwIiBzdHJva2Utd2lkdGg9IjQiIHN0cm9rZS1vcGFjaXR5PSIuNCIvPjxwYXRoIGQ9Ik0xMTIgMjY4djE0TTg0IDMwMHEyOC0xOCA1NiAweiIgZmlsbD0iI0I4ODYzQiIgZmlsbC1vcGFjaXR5PSIuNCIvPgo8Y2lyY2xlIGN4PSI1MzYiIGN5PSIyMzYiIHI9IjQ2IiBmaWxsPSIjRThDODc3IiBmaWxsLW9wYWNpdHk9Ii40NSIvPjxjaXJjbGUgY3g9IjUzNiIgY3k9IjIzNiIgcj0iMzUiIGZpbGw9IiNGRkY4RTYiIGZpbGwtb3BhY2l0eT0iLjciLz48Y2lyY2xlIGN4PSI1MzYiIGN5PSIxODIiIHI9IjgiLz4KPHBhdGggZD0iTTUzNiAyMDhsNyAyOC03IDI4LTctMjh6IiBmaWxsPSIjQjAzQTNBIiBmaWxsLW9wYWNpdHk9Ii40NSIvPgo8cGF0aCBkPSJNMTkwIDk2cTcwLTQwIDEzMC0yMHQxMzAtMjIiIHN0cm9rZS1kYXNoYXJyYXk9IjMgOSIgc3Ryb2tlLW9wYWNpdHk9Ii41Ii8+CjxwYXRoIGQ9Ik00NTIgNDZsMjAgOC0yMCA4IDUtOHoiIGZpbGw9IiMyRTZFNzgiIGZpbGwtb3BhY2l0eT0iLjUiLz4KPC9nPjwvc3ZnPgo=') center/cover no-repeat; }
.rb2-img.rb-img-mazh{ background:#F6E7E0 url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NDAgMzYwIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWlkWU1pZCBzbGljZSI+CjxkZWZzPgogPGxpbmVhckdyYWRpZW50IGlkPSJiZyIgeDE9IjAiIHkxPSIwIiB4Mj0iMSIgeTI9IjEiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI0ZDRjVFRSIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI0Y0RTdEQSIvPjwvbGluZWFyR3JhZGllbnQ+CiA8bGluZWFyR3JhZGllbnQgaWQ9InNoZWxsIiB4MT0iMCIgeTE9IjAiIHgyPSIwIiB5Mj0iMSI+PHN0b3Agb2Zmc2V0PSIwIiBzdG9wLWNvbG9yPSIjQzY0NDU3Ii8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjOUUyMzM3Ii8+PC9saW5lYXJHcmFkaWVudD4KIDxmaWx0ZXIgaWQ9InNvZnQiIHg9Ii0zMCUiIHk9Ii0zMCUiIHdpZHRoPSIxNjAlIiBoZWlnaHQ9IjE2MCUiPjxmZUdhdXNzaWFuQmx1ciBzdGREZXZpYXRpb249IjI4Ii8+PC9maWx0ZXI+CjwvZGVmcz4KPHJlY3Qgd2lkdGg9IjY0MCIgaGVpZ2h0PSIzNjAiIGZpbGw9InVybCgjYmcpIi8+CjxnIGZpbHRlcj0idXJsKCNzb2Z0KSI+CiAgPGVsbGlwc2UgY3g9IjE0MCIgY3k9IjE4MCIgcng9IjE1MCIgcnk9IjExMiIgZmlsbD0iI0MwMkE0MiIgZmlsbC1vcGFjaXR5PSIuMTIiLz4KICA8ZWxsaXBzZSBjeD0iNTEwIiBjeT0iMTUwIiByeD0iMTUwIiByeT0iMTEwIiBmaWxsPSIjQzk5ODJGIiBmaWxsLW9wYWNpdHk9Ii4xOCIvPgogIDxlbGxpcHNlIGN4PSIzMzAiIGN5PSIzMzAiIHJ4PSIyNDAiIHJ5PSI2NCIgZmlsbD0iIzhFMUYzMCIgZmlsbC1vcGFjaXR5PSIuMDciLz4KPC9nPgo8bGluZSB4MT0iMCIgeTE9IjI1NiIgeDI9IjY0MCIgeTI9IjI1NiIgc3Ryb2tlPSIjMkUyQTI2IiBzdHJva2Utb3BhY2l0eT0iLjE4IiBzdHJva2Utd2lkdGg9IjEuNiIvPgo8ZWxsaXBzZSBjeD0iMTAwIiBjeT0iMjYwIiByeD0iNTgiIHJ5PSI2IiBmaWxsPSIjOEUxRjMwIiBmaWxsLW9wYWNpdHk9Ii4wOSIvPgo8ZWxsaXBzZSBjeD0iNDg2IiBjeT0iMjYwIiByeD0iNDAiIHJ5PSI1IiBmaWxsPSIjOEUxRjMwIiBmaWxsLW9wYWNpdHk9Ii4wOSIvPgo8IS0tINGC0YrQv9Cw0L0gLS0+CjxwYXRoIGQ9Ik00NiAxNTZ2NTZhNTQgMTUgMCAwIDAgMTA4IDB2LTU2eiIgZmlsbD0idXJsKCNzaGVsbCkiLz4KPHBhdGggZD0iTTU4LjAgMjEyIEw2OC44IDE1NiBMNzkuNiAyMTIiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI0M5OTgyRiIgc3Ryb2tlLW9wYWNpdHk9Ii44IiBzdHJva2Utd2lkdGg9IjIuMiIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPjxwYXRoIGQ9Ik03OS42IDIxMiBMOTAuNCAxNTYgTDEwMS4yIDIxMiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzk5ODJGIiBzdHJva2Utb3BhY2l0eT0iLjgiIHN0cm9rZS13aWR0aD0iMi4yIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+PHBhdGggZD0iTTEwMS4yIDIxMiBMMTEyLjAgMTU2IEwxMjIuOCAyMTIiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI0M5OTgyRiIgc3Ryb2tlLW9wYWNpdHk9Ii44IiBzdHJva2Utd2lkdGg9IjIuMiIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPjxwYXRoIGQ9Ik0xMjIuOCAyMTIgTDEzMy42IDE1NiBMMTQ0LjQgMjEyIiBmaWxsPSJub25lIiBzdHJva2U9IiNDOTk4MkYiIHN0cm9rZS1vcGFjaXR5PSIuOCIgc3Ryb2tlLXdpZHRoPSIyLjIiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz48cGF0aCBkPSJNMTQ0LjQgMjEyIEwxNTUuMiAxNTYgTDE2Ni4wIDIxMiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzk5ODJGIiBzdHJva2Utb3BhY2l0eT0iLjgiIHN0cm9rZS13aWR0aD0iMi4yIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxlbGxpcHNlIGN4PSIxMDAiIGN5PSIxNTYiIHJ4PSI1NCIgcnk9IjE1IiBmaWxsPSIjRkZGOUYyIiBzdHJva2U9IiMyRTJBMjYiIHN0cm9rZS1vcGFjaXR5PSIuNiIgc3Ryb2tlLXdpZHRoPSIxLjgiLz4KPGVsbGlwc2UgY3g9IjEwMCIgY3k9IjE1NiIgcng9IjQyIiByeT0iMTAiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI0M5OTgyRiIgc3Ryb2tlLW9wYWNpdHk9Ii40NSIgc3Ryb2tlLXdpZHRoPSIxLjIiLz4KPHBhdGggZD0iTTQ2IDE1NnY1Nk0xNTQgMTU2djU2IiBzdHJva2U9IiMyRTJBMjYiIHN0cm9rZS1vcGFjaXR5PSIuMjUiIHN0cm9rZS13aWR0aD0iMS40IiBmaWxsPSJub25lIi8+CjxlbGxpcHNlIGN4PSIxMDAiIGN5PSIyMTIiIHJ4PSI1NCIgcnk9IjE1IiBmaWxsPSJub25lIiBzdHJva2U9IiMyRTJBMjYiIHN0cm9rZS1vcGFjaXR5PSIuMjIiIHN0cm9rZS13aWR0aD0iMS40Ii8+CjwhLS0g0L/QsNC70LrQuCAtLT4KPGcgc3Ryb2tlPSIjQjQ4QTU2IiBzdHJva2Utd2lkdGg9IjQuNiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIj48cGF0aCBkPSJNMTQyIDExOGw2Ni0zMCIvPjxwYXRoIGQ9Ik0xNTQgMTMwbDY2LTMwIi8+PC9nPgo8Y2lyY2xlIGN4PSIyMTAiIGN5PSI4NiIgcj0iNCIgZmlsbD0iI0I0OEE1NiIvPjxjaXJjbGUgY3g9IjIyMiIgY3k9Ijk4IiByPSI0IiBmaWxsPSIjQjQ4QTU2Ii8+CjwhLS0g0LrQuNCy0LXRgCAtLT48Zz4KICA8cGF0aCBkPSJNNDU2IDIzMnYtNjZxMC0yNiAzMC0yNnQzMCAyNnY2NnoiIGZpbGw9InVybCgjc2hlbGwpIi8+CiAgPHBhdGggZD0iTTQ1MCAyMzJoNzJ2OHEwIDYtNiA2aC02MHEtNiAwLTYtNnoiIGZpbGw9IiMyRTJBMjYiIGZpbGwtb3BhY2l0eT0iLjgyIi8+CiAgPHBhdGggZD0iTTQ1NiAxOThoNjAiIHN0cm9rZT0iI0M5OTgyRiIgc3Ryb2tlLXdpZHRoPSIyLjYiIHN0cm9rZS1vcGFjaXR5PSIuOSIgZmlsbD0ibm9uZSIvPgogIDxwYXRoIGQ9Ik00NjIgMTc2aDQ4IiBzdHJva2U9IiNDOTk4MkYiIHN0cm9rZS13aWR0aD0iMS44IiBzdHJva2Utb3BhY2l0eT0iLjU1IiBmaWxsPSJub25lIi8+CiAgPGNpcmNsZSBjeD0iNDg2IiBjeT0iMTg4IiByPSI3LjUiIGZpbGw9IiNGRkY5RjIiLz48Y2lyY2xlIGN4PSI0ODYiIGN5PSIxODgiIHI9IjMiIGZpbGw9IiNDMDJBNDIiLz4KICA8cGF0aCBkPSJNNDU2IDIxNHEzMCA4IDYwIDAiIHN0cm9rZT0iI0ZGRjlGMiIgc3Ryb2tlLW9wYWNpdHk9Ii41IiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9Im5vbmUiLz4KICA8cGF0aCBkPSJNNDg2IDE0MHYtMTQiIHN0cm9rZT0iI0M5OTgyRiIgc3Ryb2tlLXdpZHRoPSIyLjQiIGZpbGw9Im5vbmUiLz4KICA8cGF0aCBkPSJNNDg2IDEyNnEtMTAtMjIgMC0zMiAxMCAxMCAwIDMyeiIgZmlsbD0iI0ZGRjlGMiIgc3Ryb2tlPSIjMkUyQTI2IiBzdHJva2Utb3BhY2l0eT0iLjI4IiBzdHJva2Utd2lkdGg9IjEuMiIvPgo8L2c+CjwhLS0g0L/QvtC80L/QvtC9IC0tPgo8cGF0aCBkPSJNNTcwIDI1NHYtMzAiIHN0cm9rZT0iI0I0OEE1NiIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbGluZWNhcD0icm91bmQiIGZpbGw9Im5vbmUiLz4KPHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1OTYuMCAyMTYuMCIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1OTEuMCAyMTkuNyIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1OTAuMCAyMjMuMyIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1ODguNSAyMjYuNyIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1ODkuOSAyMzIuNyIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1ODMuNyAyMzIuMyIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1ODAuNyAyMzQuNSIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NzcuMyAyMzYuMCIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NzQuNSAyNDEuNiIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NzAuMCAyMzcuMyIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NjYuMyAyMzcuMCIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NjIuNyAyMzYuMCIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NTcuMCAyMzguNSIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NTYuMyAyMzIuMyIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NTMuNyAyMjkuNyIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NTEuNSAyMjYuNyIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NDUuNiAyMjQuOSIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NDkuMCAyMTkuNyIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NDguNyAyMTYuMCIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NDkuMCAyMTIuMyIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NDUuNiAyMDcuMSIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NTEuNSAyMDUuMyIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NTMuNyAyMDIuMyIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NTYuMyAxOTkuNyIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NTcuMCAxOTMuNSIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NjIuNyAxOTYuMCIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NjYuMyAxOTUuMCIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NzAuMCAxOTQuNyIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NzQuNSAxOTAuNCIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1NzcuMyAxOTYuMCIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1ODAuNyAxOTcuNSIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1ODMuNyAxOTkuNyIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1ODkuOSAxOTkuMyIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1ODguNSAyMDUuMyIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1OTAuMCAyMDguNyIgc3Ryb2tlPSIjRkZGNkYyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTU3MC4wIDIxNi4wIEw1OTEuMCAyMTIuMyIgc3Ryb2tlPSIjQzAyQTQyIiBzdHJva2Utd2lkdGg9IjQuMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PGNpcmNsZSBjeD0iNTcwLjAiIGN5PSIyMTYuMCIgcj0iNS43IiBmaWxsPSIjQzk5ODJGIi8+CjwhLS0g0LrQvtC90YTQtdGC0LggLS0+CjxnIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIzLjIiIHN0cm9rZS1vcGFjaXR5PSIuNSI+CiAgPHBhdGggZD0iTTk2IDcybDkgNSIgc3Ryb2tlPSIjQzAyQTQyIi8+PHBhdGggZD0iTTI2MiA1NGwtNCAxMCIgc3Ryb2tlPSIjQzk5ODJGIi8+CiAgPHBhdGggZD0iTTU2MCA4NGwxMC00IiBzdHJva2U9IiNDMDJBNDIiLz48cGF0aCBkPSJNMzkyIDYybDQgMTAiIHN0cm9rZT0iI0M5OTgyRiIvPgo8L2c+Cjwvc3ZnPg==') center/cover no-repeat; }

/* Хандбал — часовник, тактическа дъска и серия голове */
.hb-clock{ display:flex; align-items:center; gap:10px; margin-top:14px; }
.hb-clock button{ flex:1; border:0; cursor:pointer; padding:11px 14px; border-radius:12px; background:rgba(139,217,199,.16); color:#EAF6F2;
  font-family:'Manrope',sans-serif; font-weight:800; font-size:13px; transition:background .2s; }
.hb-clock button:hover{ background:rgba(139,217,199,.28); }
.hb-scoreboard .row.time span{ font-size:24px; letter-spacing:.06em; }
.hb-scoreboard .row.time.hot span{ color:#E8A33D; animation:hbTick 1s steps(2) infinite; }
@keyframes hbTick{ 50%{ opacity:.45; } }
.hb-tools{ display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.hb-tools button{ border:1px solid var(--line,#E7DDCD); background:#fff; cursor:pointer; padding:9px 15px; border-radius:999px;
  font-family:'Manrope',sans-serif; font-weight:700; font-size:13px; color:var(--ink); transition:all .2s; }
.hb-tools button:hover{ border-color:var(--brick); color:var(--brick-deep); }
.hb-pos{ touch-action:none; }
.hb-pos.moved{ box-shadow:0 0 0 2px var(--hb-amber), 0 8px 18px -6px rgba(0,0,0,.6); }
.hb-streak{ display:inline-flex; align-items:center; gap:8px; margin-left:10px; padding:6px 12px; border-radius:999px;
  background:rgba(232,163,61,.18); color:#E8A33D; font-family:'Manrope',sans-serif; font-weight:800; font-size:12.5px; }
.hb-streak[hidden]{ display:none; }
#hbConfetti{ position:fixed; inset:0; width:100%; height:100%; pointer-events:none; z-index:30; }
@media (prefers-reduced-motion:reduce){ #hbConfetti{ display:none; } }

/* ---- Хандбал, вариант 2: дъската на треньора (hb2-) ---- */
.hb2{ --mk-green:#1E7A6B; --mk-red:#D6334A; --mk-blue:#2F5FA8; --mk-ink:#24302F; --board:#FBFBF7;
  margin:0 calc(50% - 50vw); padding:clamp(28px,5vw,56px) clamp(16px,4vw,48px) clamp(50px,7vw,84px); background:#E9E2D6; }
.hb2-frame{ max-width:1180px; margin:0 auto; padding:clamp(16px,2.4vw,26px); border-radius:18px;
  background:linear-gradient(180deg,#B98E58,#966C3C); box-shadow:0 30px 60px -34px rgba(60,40,20,.7); }
.hb2-board{ position:relative; border-radius:10px; background:var(--board); padding:clamp(20px,3.4vw,40px); overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(36,48,47,.12), inset 0 8px 30px rgba(36,48,47,.06); }
.hb2-board::after{ content:''; position:absolute; inset:0; pointer-events:none;
  background:repeating-linear-gradient(115deg, rgba(36,48,47,.02) 0 2px, transparent 2px 7px); }
.hb2-head{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:clamp(20px,3vw,40px); align-items:center; }
.hb2-kick{ font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.24em; text-transform:uppercase; color:var(--mk-red); }
.hb2-h1{ margin:12px 0 0; font-family:'Marck Script',cursive; font-weight:400; font-size:clamp(46px,8vw,104px); line-height:.9; color:var(--mk-ink); }
.hb2-h1 em{ font-style:normal; color:var(--mk-green); }
.hb2-lead{ margin:16px 0 0; font-size:clamp(15.5px,1.7vw,18px); line-height:1.75; color:#4C5A58; max-width:46ch; }
.hb2-note{ position:relative; width:230px; padding:20px 18px 22px; background:#FFE98A; box-shadow:0 16px 30px -18px rgba(60,40,10,.6); transform:rotate(2.4deg); }
.hb2-note::before{ content:''; position:absolute; top:-10px; left:50%; width:84px; height:22px; margin-left:-42px; background:rgba(255,255,255,.55); transform:rotate(-2deg); }
.hb2-note b{ display:block; font-family:'Marck Script',cursive; font-size:26px; color:#3A2A10; margin-bottom:8px; }
.hb2-note div{ display:flex; justify-content:space-between; gap:10px; padding:5px 0; border-bottom:1px dashed rgba(60,40,10,.3); font-size:14px; color:#4A3A16; }
.hb2-note div:last-child{ border-bottom:0; }
.hb2-note span{ font-weight:700; }
@media (max-width:760px){ .hb2-head{ grid-template-columns:1fr; } .hb2-note{ width:auto; transform:none; } }

/* тактиката */
.hb2-tac{ margin-top:clamp(28px,4vw,48px); display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr); gap:clamp(20px,3vw,40px); align-items:center; }
.hb2-court{ position:relative; }
.hb2-court svg{ width:100%; height:auto; display:block; }
.hb2-court .draw{ stroke-dasharray:var(--len,600); stroke-dashoffset:var(--len,600); }
.hb2-court .draw.go{ animation:hb2Draw 1.1s ease forwards; }
@keyframes hb2Draw{ to{ stroke-dashoffset:0; } }
.hb2-chip{ font-family:'Manrope',sans-serif; font-weight:800; font-size:12px; }
.hb2-plays{ display:grid; gap:8px; }
.hb2-plays button{ text-align:left; border:2px solid rgba(36,48,47,.15); background:transparent; cursor:pointer; padding:14px 16px; border-radius:12px;
  font-family:'Manrope',sans-serif; font-weight:700; font-size:15px; color:var(--mk-ink); transition:all .2s; }
.hb2-plays button b{ display:block; font-family:'Marck Script',cursive; font-weight:400; font-size:24px; color:var(--mk-green); }
.hb2-plays button:hover{ border-color:var(--mk-green); }
.hb2-plays button.on{ border-color:var(--mk-red); background:rgba(214,51,74,.06); }
.hb2-plays p{ margin:10px 2px 0; font-size:14.5px; line-height:1.6; color:#4C5A58; }
@media (max-width:860px){ .hb2-tac{ grid-template-columns:1fr; } }

/* разписание на тренировката */
.hb2-train{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:clamp(28px,4vw,44px); }
.hb2-step{ position:relative; padding:20px 18px; border-radius:14px; background:rgba(30,122,107,.07); border:2px dashed rgba(30,122,107,.35); }
.hb2-step b{ display:block; font-family:'Marck Script',cursive; font-size:30px; color:var(--mk-green); line-height:1; }
.hb2-step span{ display:block; margin:6px 0 4px; font-family:'Manrope',sans-serif; font-weight:800; font-size:15px; color:var(--mk-ink); }
.hb2-step p{ margin:0; font-size:13.5px; line-height:1.6; color:#4C5A58; }
@media (max-width:900px){ .hb2-train{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* речник с обръщащи се карти */
.hb2-cards{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:16px; }
.hb2-flip{ perspective:900px; border:0; background:none; padding:0; cursor:pointer; aspect-ratio:3/2; }
.hb2-in{ display:block; position:relative; width:100%; height:100%; transform-style:preserve-3d; transition:transform .7s cubic-bezier(.3,1.2,.4,1); }
.hb2-flip.on .hb2-in{ transform:rotateY(180deg); }
.hb2-face{ position:absolute; inset:0; backface-visibility:hidden; -webkit-backface-visibility:hidden; border-radius:14px; display:grid; place-items:center; padding:14px; text-align:center; }
.hb2-face.front{ background:#fff; border:2px solid rgba(36,48,47,.22); border-radius:14px; box-shadow:0 10px 20px -16px rgba(36,48,47,.5); font-family:'Marck Script',cursive; font-size:27px; color:var(--mk-ink); }
.hb2-flip:hover .hb2-face.front{ border-color:var(--mk-green); }
.hb2-face.back{ transform:rotateY(180deg); background:var(--mk-green); border-radius:14px; color:#F4FBF9; font-size:14px; line-height:1.55; font-family:'Manrope',sans-serif; }
@media (max-width:900px){ .hb2-cards{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.hb2-hint{ margin:14px 0 0; font-family:'Marck Script',cursive; font-size:20px; color:#6B7A78; text-align:center; }

/* Хандбал — прожектор в залата, дълбочина и топка по скрола */
.hb-board{ isolation:isolate; }
.hb-board .hb-spot{ position:absolute; inset:-20%; z-index:0; pointer-events:none; opacity:.9; transition:opacity .4s;
  background:radial-gradient(420px 420px at var(--mx,50%) var(--my,30%), rgba(232,163,61,.22), rgba(139,217,199,.08) 45%, transparent 70%); }
.hb-board .hb-lines{ transition:transform .25s ease-out; }
.hb-in{ position:relative; z-index:2; }
.hb-scoreboard{ transition:transform .25s ease-out; }
.hb-h1{ text-shadow:0 10px 40px rgba(232,163,61,.18); }
.hb-progress{ position:fixed; left:0; right:0; bottom:0; height:44px; z-index:25; pointer-events:none; }
.hb-progress i{ position:absolute; left:0; right:0; bottom:16px; height:2px; background:linear-gradient(90deg, rgba(30,122,107,.35), rgba(232,163,61,.5)); }
.hb-progress b{ position:absolute; bottom:8px; left:0; width:18px; height:18px; border-radius:50%; transform:translateX(-50%);
  background:radial-gradient(circle at 34% 30%, #FFD79A, #E8A33D 60%, #B9741F); box-shadow:0 4px 10px -2px rgba(0,0,0,.45); }
.hb-progress b::after{ content:''; position:absolute; inset:3px; border-radius:50%; border:1px solid rgba(138,90,30,.5); border-left-color:transparent; border-right-color:transparent; }
@media (max-width:640px){ .hb-progress{ display:none; } }
@media (prefers-reduced-motion:reduce){ .hb-board .hb-spot{ display:none; } .hb-progress{ display:none; } }

/* ---- Хандбал, вариант 3: светла модерна визия (hbm-) ---- */
.hbm{ --hot:#E2593A; --deep:#1E7A6B; --gold:#D9A02B; --ink:#1F2A28; --dim:#647572; --line:rgba(31,42,40,.1);
  margin:0 calc(50% - 50vw); padding:0 0 clamp(50px,7vw,90px); position:relative; overflow:hidden;
  background:linear-gradient(180deg,#F6FAF8 0%, #EFF6F2 45%, #F7F2EA 100%); color:var(--ink); }
.hbm::before, .hbm::after{ content:''; position:absolute; border-radius:50%; filter:blur(70px); pointer-events:none; }
.hbm::before{ width:440px; height:440px; background:rgba(30,122,107,.2); top:-80px; right:-120px; animation:hbmFloat 20s ease-in-out infinite alternate; }
.hbm::after{ width:380px; height:380px; background:rgba(226,89,58,.16); bottom:8%; left:-120px; animation:hbmFloat 24s ease-in-out infinite alternate-reverse; }
@keyframes hbmFloat{ to{ transform:translate(50px,-40px); } }
.hbm-wrap{ position:relative; z-index:1; max-width:1180px; margin:0 auto; padding:0 clamp(18px,4vw,48px); }
.hbm h1,.hbm h2,.hbm h3{ font-family:'Manrope',sans-serif; letter-spacing:-.025em; }

.hbm-hero{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(24px,4vw,56px); align-items:center; padding:clamp(34px,6vw,76px) 0 clamp(24px,4vw,44px); }
.hbm-tag{ display:inline-flex; align-items:center; gap:10px; padding:8px 15px; border-radius:999px; background:#fff; box-shadow:0 0 0 1px var(--line);
  font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:var(--deep); }
.hbm-tag i{ width:7px; height:7px; border-radius:50%; background:var(--hot); animation:hbmBlink 1.8s ease-in-out infinite; }
@keyframes hbmBlink{ 0%,100%{ opacity:1; } 50%{ opacity:.3; } }
.hbm-h1{ margin:20px 0 0; font-weight:800; font-size:clamp(40px,7vw,92px); line-height:.95; }
.hbm-h1 em{ font-style:normal; background:linear-gradient(120deg,var(--hot),var(--gold)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hbm-lead{ margin:20px 0 0; font-size:clamp(16px,1.7vw,19px); line-height:1.75; color:var(--dim); max-width:46ch; }
.hbm-stats{ display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.hbm-stats span{ padding:12px 18px; border-radius:14px; background:#fff; box-shadow:0 0 0 1px var(--line); font-family:'Manrope',sans-serif; font-size:14px; font-weight:700; }
.hbm-stats b{ display:block; font-size:24px; color:var(--deep); }
.hbm-visual{ position:relative; border-radius:28px; overflow:hidden; aspect-ratio:4/3; background:linear-gradient(150deg,#1E7A6B,#134A43); box-shadow:0 34px 60px -34px rgba(20,70,60,.6); }
.hbm-visual svg{ position:absolute; inset:0; width:100%; height:100%; }
.hbm-visual .pill{ position:absolute; left:18px; top:18px; z-index:2; padding:7px 13px; border-radius:999px; background:rgba(255,255,255,.92);
  font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--deep); }
@media (max-width:860px){ .hbm-hero{ grid-template-columns:1fr; } }

.hbm-ticker{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:12px 0; overflow:hidden; background:#fff; }
.hbm-track{ display:flex; gap:40px; width:max-content; animation:hbmRun 26s linear infinite; }
.hbm-track span{ font-family:'Manrope',sans-serif; font-weight:800; font-size:clamp(17px,2.2vw,26px); color:rgba(31,42,40,.14); white-space:nowrap; }
.hbm-track i{ font-style:normal; color:var(--hot); }
@keyframes hbmRun{ to{ transform:translateX(-50%); } }

.hbm-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-top:clamp(32px,5vw,58px); }
.hbm-card{ position:relative; border-radius:22px; background:#fff; box-shadow:0 0 0 1px var(--line), 0 18px 34px -30px rgba(30,60,55,.55); padding:24px; overflow:hidden;
  opacity:0; transform:translateY(20px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.8,.3,1), box-shadow .3s; }
.hbm-card.in{ opacity:1; transform:none; }
.hbm-card:hover{ box-shadow:0 0 0 1px rgba(30,122,107,.35), 0 26px 44px -26px rgba(30,60,55,.5); }
.hbm-card .no{ font-family:'Manrope',sans-serif; font-size:12px; font-weight:800; letter-spacing:.16em; color:var(--hot); }
.hbm-card h3{ margin:12px 0 8px; font-size:20px; font-weight:800; }
.hbm-card p{ margin:0; font-size:14.5px; line-height:1.65; color:var(--dim); }
.hbm-card.wide{ grid-column:span 2; }
.hbm-card.accent{ background:linear-gradient(140deg,var(--deep),#12433C); color:#F2FAF7; }
.hbm-card.accent h3{ font-size:25px; } .hbm-card.accent p{ color:rgba(242,250,247,.82); }
.hbm-card.num b{ display:block; font-family:'Manrope',sans-serif; font-weight:800; font-size:clamp(34px,4.4vw,52px); line-height:1; color:var(--deep); }
/* места, които чакат информация */
.hbm-slot{ background:transparent; box-shadow:none; border:2px dashed rgba(31,42,40,.18); }
.hbm-slot .ic{ width:44px; height:44px; border-radius:12px; background:rgba(30,122,107,.1); color:var(--deep); display:grid; place-items:center; font-size:20px; margin-bottom:12px; }
.hbm-slot h3{ margin:0 0 6px; }
.hbm-slot em{ font-style:normal; display:inline-block; margin-top:10px; padding:5px 10px; border-radius:8px; background:rgba(217,160,43,.16);
  font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#8A6410; }
@media (max-width:900px){ .hbm-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px){ .hbm-grid{ grid-template-columns:1fr; } .hbm-card.wide{ grid-column:span 1; } }

.hbm-play{ display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:clamp(20px,3vw,44px); align-items:center; margin-top:14px;
  padding:clamp(22px,3.4vw,38px); border-radius:26px; background:#fff; box-shadow:0 0 0 1px var(--line), 0 22px 40px -32px rgba(30,60,55,.5); }
@media (max-width:860px){ .hbm-play{ grid-template-columns:1fr; } }
.hbm-btn{ display:inline-flex; align-items:center; gap:10px; margin-top:14px; border:0; cursor:pointer; padding:13px 22px; border-radius:14px;
  background:var(--deep); color:#fff; font-family:'Manrope',sans-serif; font-weight:800; font-size:14px; transition:background .25s, transform .25s; }
.hbm-btn:hover{ background:#14564C; transform:translateY(-2px); }
.hbm-btn.alt{ background:var(--hot); } .hbm-btn.alt:hover{ background:#C4472B; }

/* ===========================================================================
   76. НАЧАЛНА — ВИТРИНА НА КЛУБОВЕТЕ (rb2-)
   Големите карти станаха твърде дълги с всеки нов клуб. Витрината е по-ниска
   и побира всички на един екран, с филтър по вид.
=========================================================================== */
.rb2-tools{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 20px; }
.rb2-tools button{ border:1px solid var(--line,#E7DDCD); background:#fff; cursor:pointer; padding:9px 16px; border-radius:999px;
  font-family:'Manrope',sans-serif; font-weight:700; font-size:13.5px; color:var(--ink); transition:all .2s; }
.rb2-tools button i{ font-style:normal; opacity:.5; margin-left:5px; }
.rb2-tools button:hover{ border-color:var(--brick); }
.rb2-tools button.on{ background:var(--brick); border-color:var(--brick); color:#fff; }
.rb2-tools button.on i{ opacity:.75; }
.rb2-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(12px,1.6vw,18px); }
.rb2-card{ position:relative; display:flex; flex-direction:column; border-radius:18px; overflow:hidden; text-decoration:none; color:var(--ink);
  background:var(--cream-3,#FBF8F1); box-shadow:0 0 0 1px var(--line,#E7DDCD);
  transition:transform .4s cubic-bezier(.2,.8,.3,1), box-shadow .3s, opacity .3s; }
.rb2-card:hover{ transform:translateY(-5px); box-shadow:0 0 0 1px var(--brick), 0 22px 38px -26px rgba(60,40,30,.5); }
.rb2-card[hidden]{ display:none; }
.rb2-img{ position:relative; aspect-ratio:16/9; background:#EFE6DB center/cover no-repeat; display:grid; place-items:center; overflow:hidden; }
.rb2-img img{ width:30%; max-width:84px; aspect-ratio:1; border-radius:50%; object-fit:cover; box-shadow:0 0 0 4px #fff, 0 10px 20px -8px rgba(50,30,20,.35); transition:transform .5s ease; }
.rb2-img.photo img{ width:100%; max-width:none; aspect-ratio:auto; height:100%; border-radius:0; box-shadow:none; object-fit:cover; }
.rb2-card:hover .rb2-img img{ transform:scale(1.06); }
.rb2-cat{ position:absolute; left:10px; top:10px; z-index:2; padding:5px 10px; border-radius:8px; background:rgba(255,253,247,.94);
  font-family:'Manrope',sans-serif; font-size:10px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--c,#A24C36); }
.rb2-play{ position:absolute; right:10px; bottom:10px; z-index:2; width:34px; height:34px; border-radius:50%; background:rgba(255,253,247,.94);
  display:grid; place-items:center; color:var(--brick); box-shadow:0 6px 14px -6px rgba(0,0,0,.4); }
.rb2-body{ padding:14px 16px 16px; display:flex; flex-direction:column; gap:5px; flex:1; }
.rb2-body b{ font-family:'Fraunces',serif; font-weight:400; font-size:19px; line-height:1.2; }
.rb2-body span{ font-size:13.5px; line-height:1.55; color:var(--ink-soft); }
.rb2-body em{ margin-top:auto; padding-top:8px; font-style:normal; font-family:'Manrope',sans-serif; font-size:12.5px; font-weight:800; color:var(--c,#A24C36); }
.rb2-none{ display:none; padding:26px; text-align:center; color:var(--ink-soft); }
@media (max-width:900px){ .rb2-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px){ .rb2-grid{ grid-template-columns:1fr; } .rb2-img{ aspect-ratio:16/7; } }
/* витрината: рисуваните сцени зад знаците */
.rb2-img.rb-img-tvor{ background:#F6E9DD url('art/rb-tvorilnica.svg') center/cover no-repeat; }
.rb2-img.rb-img-patesh{ background:#F1E4C8 url('art/rb-patesh.svg') center/cover no-repeat; }
.rb2-img.rb-img-mazh{ background:#F6E7E0 url('art/rb-mazhoretki.svg') center/cover no-repeat; }

/* Хандбал — часовник, тактическа дъска и серия голове */
.hb-clock{ display:flex; align-items:center; gap:10px; margin-top:14px; }
.hb-clock button{ flex:1; border:0; cursor:pointer; padding:11px 14px; border-radius:12px; background:rgba(139,217,199,.16); color:#EAF6F2;
  font-family:'Manrope',sans-serif; font-weight:800; font-size:13px; transition:background .2s; }
.hb-clock button:hover{ background:rgba(139,217,199,.28); }
.hb-scoreboard .row.time span{ font-size:24px; letter-spacing:.06em; }
.hb-scoreboard .row.time.hot span{ color:#E8A33D; animation:hbTick 1s steps(2) infinite; }
@keyframes hbTick{ 50%{ opacity:.45; } }
.hb-tools{ display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.hb-tools button{ border:1px solid var(--line,#E7DDCD); background:#fff; cursor:pointer; padding:9px 15px; border-radius:999px;
  font-family:'Manrope',sans-serif; font-weight:700; font-size:13px; color:var(--ink); transition:all .2s; }
.hb-tools button:hover{ border-color:var(--brick); color:var(--brick-deep); }
.hb-pos{ touch-action:none; }
.hb-pos.moved{ box-shadow:0 0 0 2px var(--hb-amber), 0 8px 18px -6px rgba(0,0,0,.6); }
.hb-streak{ display:inline-flex; align-items:center; gap:8px; margin-left:10px; padding:6px 12px; border-radius:999px;
  background:rgba(232,163,61,.18); color:#E8A33D; font-family:'Manrope',sans-serif; font-weight:800; font-size:12.5px; }
.hb-streak[hidden]{ display:none; }
#hbConfetti{ position:fixed; inset:0; width:100%; height:100%; pointer-events:none; z-index:30; }
@media (prefers-reduced-motion:reduce){ #hbConfetti{ display:none; } }

/* ---- Хандбал, вариант 2: дъската на треньора (hb2-) ---- */
.hb2{ --mk-green:#1E7A6B; --mk-red:#D6334A; --mk-blue:#2F5FA8; --mk-ink:#24302F; --board:#FBFBF7;
  margin:0 calc(50% - 50vw); padding:clamp(28px,5vw,56px) clamp(16px,4vw,48px) clamp(50px,7vw,84px); background:#E9E2D6; }
.hb2-frame{ max-width:1180px; margin:0 auto; padding:clamp(16px,2.4vw,26px); border-radius:18px;
  background:linear-gradient(180deg,#B98E58,#966C3C); box-shadow:0 30px 60px -34px rgba(60,40,20,.7); }
.hb2-board{ position:relative; border-radius:10px; background:var(--board); padding:clamp(20px,3.4vw,40px); overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(36,48,47,.12), inset 0 8px 30px rgba(36,48,47,.06); }
.hb2-board::after{ content:''; position:absolute; inset:0; pointer-events:none;
  background:repeating-linear-gradient(115deg, rgba(36,48,47,.02) 0 2px, transparent 2px 7px); }
.hb2-head{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:clamp(20px,3vw,40px); align-items:center; }
.hb2-kick{ font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.24em; text-transform:uppercase; color:var(--mk-red); }
.hb2-h1{ margin:12px 0 0; font-family:'Marck Script',cursive; font-weight:400; font-size:clamp(46px,8vw,104px); line-height:.9; color:var(--mk-ink); }
.hb2-h1 em{ font-style:normal; color:var(--mk-green); }
.hb2-lead{ margin:16px 0 0; font-size:clamp(15.5px,1.7vw,18px); line-height:1.75; color:#4C5A58; max-width:46ch; }
.hb2-note{ position:relative; width:230px; padding:20px 18px 22px; background:#FFE98A; box-shadow:0 16px 30px -18px rgba(60,40,10,.6); transform:rotate(2.4deg); }
.hb2-note::before{ content:''; position:absolute; top:-10px; left:50%; width:84px; height:22px; margin-left:-42px; background:rgba(255,255,255,.55); transform:rotate(-2deg); }
.hb2-note b{ display:block; font-family:'Marck Script',cursive; font-size:26px; color:#3A2A10; margin-bottom:8px; }
.hb2-note div{ display:flex; justify-content:space-between; gap:10px; padding:5px 0; border-bottom:1px dashed rgba(60,40,10,.3); font-size:14px; color:#4A3A16; }
.hb2-note div:last-child{ border-bottom:0; }
.hb2-note span{ font-weight:700; }
@media (max-width:760px){ .hb2-head{ grid-template-columns:1fr; } .hb2-note{ width:auto; transform:none; } }

/* тактиката */
.hb2-tac{ margin-top:clamp(28px,4vw,48px); display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr); gap:clamp(20px,3vw,40px); align-items:center; }
.hb2-court{ position:relative; }
.hb2-court svg{ width:100%; height:auto; display:block; }
.hb2-court .draw{ stroke-dasharray:var(--len,600); stroke-dashoffset:var(--len,600); }
.hb2-court .draw.go{ animation:hb2Draw 1.1s ease forwards; }
@keyframes hb2Draw{ to{ stroke-dashoffset:0; } }
.hb2-chip{ font-family:'Manrope',sans-serif; font-weight:800; font-size:12px; }
.hb2-plays{ display:grid; gap:8px; }
.hb2-plays button{ text-align:left; border:2px solid rgba(36,48,47,.15); background:transparent; cursor:pointer; padding:14px 16px; border-radius:12px;
  font-family:'Manrope',sans-serif; font-weight:700; font-size:15px; color:var(--mk-ink); transition:all .2s; }
.hb2-plays button b{ display:block; font-family:'Marck Script',cursive; font-weight:400; font-size:24px; color:var(--mk-green); }
.hb2-plays button:hover{ border-color:var(--mk-green); }
.hb2-plays button.on{ border-color:var(--mk-red); background:rgba(214,51,74,.06); }
.hb2-plays p{ margin:10px 2px 0; font-size:14.5px; line-height:1.6; color:#4C5A58; }
@media (max-width:860px){ .hb2-tac{ grid-template-columns:1fr; } }

/* разписание на тренировката */
.hb2-train{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:clamp(28px,4vw,44px); }
.hb2-step{ position:relative; padding:20px 18px; border-radius:14px; background:rgba(30,122,107,.07); border:2px dashed rgba(30,122,107,.35); }
.hb2-step b{ display:block; font-family:'Marck Script',cursive; font-size:30px; color:var(--mk-green); line-height:1; }
.hb2-step span{ display:block; margin:6px 0 4px; font-family:'Manrope',sans-serif; font-weight:800; font-size:15px; color:var(--mk-ink); }
.hb2-step p{ margin:0; font-size:13.5px; line-height:1.6; color:#4C5A58; }
@media (max-width:900px){ .hb2-train{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* речник с обръщащи се карти */
.hb2-cards{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:16px; }
.hb2-flip{ perspective:900px; border:0; background:none; padding:0; cursor:pointer; aspect-ratio:3/2; }
.hb2-in{ display:block; position:relative; width:100%; height:100%; transform-style:preserve-3d; transition:transform .7s cubic-bezier(.3,1.2,.4,1); }
.hb2-flip.on .hb2-in{ transform:rotateY(180deg); }
.hb2-face{ position:absolute; inset:0; backface-visibility:hidden; -webkit-backface-visibility:hidden; border-radius:14px; display:grid; place-items:center; padding:14px; text-align:center; }
.hb2-face.front{ background:#fff; border:2px solid rgba(36,48,47,.22); border-radius:14px; box-shadow:0 10px 20px -16px rgba(36,48,47,.5); font-family:'Marck Script',cursive; font-size:27px; color:var(--mk-ink); }
.hb2-flip:hover .hb2-face.front{ border-color:var(--mk-green); }
.hb2-face.back{ transform:rotateY(180deg); background:var(--mk-green); border-radius:14px; color:#F4FBF9; font-size:14px; line-height:1.55; font-family:'Manrope',sans-serif; }
@media (max-width:900px){ .hb2-cards{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.hb2-hint{ margin:14px 0 0; font-family:'Marck Script',cursive; font-size:20px; color:#6B7A78; text-align:center; }

/* Хандбал — прожектор в залата, дълбочина и топка по скрола */
.hb-board{ isolation:isolate; }
.hb-board .hb-spot{ position:absolute; inset:-20%; z-index:0; pointer-events:none; opacity:.9; transition:opacity .4s;
  background:radial-gradient(420px 420px at var(--mx,50%) var(--my,30%), rgba(232,163,61,.22), rgba(139,217,199,.08) 45%, transparent 70%); }
.hb-board .hb-lines{ transition:transform .25s ease-out; }
.hb-in{ position:relative; z-index:2; }
.hb-scoreboard{ transition:transform .25s ease-out; }
.hb-h1{ text-shadow:0 10px 40px rgba(232,163,61,.18); }
.hb-progress{ position:fixed; left:0; right:0; bottom:0; height:44px; z-index:25; pointer-events:none; }
.hb-progress i{ position:absolute; left:0; right:0; bottom:16px; height:2px; background:linear-gradient(90deg, rgba(30,122,107,.35), rgba(232,163,61,.5)); }
.hb-progress b{ position:absolute; bottom:8px; left:0; width:18px; height:18px; border-radius:50%; transform:translateX(-50%);
  background:radial-gradient(circle at 34% 30%, #FFD79A, #E8A33D 60%, #B9741F); box-shadow:0 4px 10px -2px rgba(0,0,0,.45); }
.hb-progress b::after{ content:''; position:absolute; inset:3px; border-radius:50%; border:1px solid rgba(138,90,30,.5); border-left-color:transparent; border-right-color:transparent; }
@media (max-width:640px){ .hb-progress{ display:none; } }
@media (prefers-reduced-motion:reduce){ .hb-board .hb-spot{ display:none; } .hb-progress{ display:none; } }

/* ---- Хандбал, вариант 3: светла модерна визия (hbm-) ---- */
.hbm{ --hot:#E2593A; --deep:#1E7A6B; --gold:#D9A02B; --ink:#1F2A28; --dim:#647572; --line:rgba(31,42,40,.1);
  margin:0 calc(50% - 50vw); padding:0 0 clamp(50px,7vw,90px); position:relative; overflow:hidden;
  background:linear-gradient(180deg,#F6FAF8 0%, #EFF6F2 45%, #F7F2EA 100%); color:var(--ink); }
.hbm::before, .hbm::after{ content:''; position:absolute; border-radius:50%; filter:blur(70px); pointer-events:none; }
.hbm::before{ width:440px; height:440px; background:rgba(30,122,107,.2); top:-80px; right:-120px; animation:hbmFloat 20s ease-in-out infinite alternate; }
.hbm::after{ width:380px; height:380px; background:rgba(226,89,58,.16); bottom:8%; left:-120px; animation:hbmFloat 24s ease-in-out infinite alternate-reverse; }
@keyframes hbmFloat{ to{ transform:translate(50px,-40px); } }
.hbm-wrap{ position:relative; z-index:1; max-width:1180px; margin:0 auto; padding:0 clamp(18px,4vw,48px); }
.hbm h1,.hbm h2,.hbm h3{ font-family:'Manrope',sans-serif; letter-spacing:-.025em; }

.hbm-hero{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(24px,4vw,56px); align-items:center; padding:clamp(34px,6vw,76px) 0 clamp(24px,4vw,44px); }
.hbm-tag{ display:inline-flex; align-items:center; gap:10px; padding:8px 15px; border-radius:999px; background:#fff; box-shadow:0 0 0 1px var(--line);
  font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:var(--deep); }
.hbm-tag i{ width:7px; height:7px; border-radius:50%; background:var(--hot); animation:hbmBlink 1.8s ease-in-out infinite; }
@keyframes hbmBlink{ 0%,100%{ opacity:1; } 50%{ opacity:.3; } }
.hbm-h1{ margin:20px 0 0; font-weight:800; font-size:clamp(40px,7vw,92px); line-height:.95; }
.hbm-h1 em{ font-style:normal; background:linear-gradient(120deg,var(--hot),var(--gold)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hbm-lead{ margin:20px 0 0; font-size:clamp(16px,1.7vw,19px); line-height:1.75; color:var(--dim); max-width:46ch; }
.hbm-stats{ display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.hbm-stats span{ padding:12px 18px; border-radius:14px; background:#fff; box-shadow:0 0 0 1px var(--line); font-family:'Manrope',sans-serif; font-size:14px; font-weight:700; }
.hbm-stats b{ display:block; font-size:24px; color:var(--deep); }
.hbm-visual{ position:relative; border-radius:28px; overflow:hidden; aspect-ratio:4/3; background:linear-gradient(150deg,#1E7A6B,#134A43); box-shadow:0 34px 60px -34px rgba(20,70,60,.6); }
.hbm-visual svg{ position:absolute; inset:0; width:100%; height:100%; }
.hbm-visual .pill{ position:absolute; left:18px; top:18px; z-index:2; padding:7px 13px; border-radius:999px; background:rgba(255,255,255,.92);
  font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--deep); }
@media (max-width:860px){ .hbm-hero{ grid-template-columns:1fr; } }

.hbm-ticker{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:12px 0; overflow:hidden; background:#fff; }
.hbm-track{ display:flex; gap:40px; width:max-content; animation:hbmRun 26s linear infinite; }
.hbm-track span{ font-family:'Manrope',sans-serif; font-weight:800; font-size:clamp(17px,2.2vw,26px); color:rgba(31,42,40,.14); white-space:nowrap; }
.hbm-track i{ font-style:normal; color:var(--hot); }
@keyframes hbmRun{ to{ transform:translateX(-50%); } }

.hbm-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-top:clamp(32px,5vw,58px); }
.hbm-card{ position:relative; border-radius:22px; background:#fff; box-shadow:0 0 0 1px var(--line), 0 18px 34px -30px rgba(30,60,55,.55); padding:24px; overflow:hidden;
  opacity:0; transform:translateY(20px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.8,.3,1), box-shadow .3s; }
.hbm-card.in{ opacity:1; transform:none; }
.hbm-card:hover{ box-shadow:0 0 0 1px rgba(30,122,107,.35), 0 26px 44px -26px rgba(30,60,55,.5); }
.hbm-card .no{ font-family:'Manrope',sans-serif; font-size:12px; font-weight:800; letter-spacing:.16em; color:var(--hot); }
.hbm-card h3{ margin:12px 0 8px; font-size:20px; font-weight:800; }
.hbm-card p{ margin:0; font-size:14.5px; line-height:1.65; color:var(--dim); }
.hbm-card.wide{ grid-column:span 2; }
.hbm-card.accent{ background:linear-gradient(140deg,var(--deep),#12433C); color:#F2FAF7; }
.hbm-card.accent h3{ font-size:25px; } .hbm-card.accent p{ color:rgba(242,250,247,.82); }
.hbm-card.num b{ display:block; font-family:'Manrope',sans-serif; font-weight:800; font-size:clamp(34px,4.4vw,52px); line-height:1; color:var(--deep); }
/* места, които чакат информация */
.hbm-slot{ background:transparent; box-shadow:none; border:2px dashed rgba(31,42,40,.18); }
.hbm-slot .ic{ width:44px; height:44px; border-radius:12px; background:rgba(30,122,107,.1); color:var(--deep); display:grid; place-items:center; font-size:20px; margin-bottom:12px; }
.hbm-slot h3{ margin:0 0 6px; }
.hbm-slot em{ font-style:normal; display:inline-block; margin-top:10px; padding:5px 10px; border-radius:8px; background:rgba(217,160,43,.16);
  font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#8A6410; }
@media (max-width:900px){ .hbm-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px){ .hbm-grid{ grid-template-columns:1fr; } .hbm-card.wide{ grid-column:span 1; } }

.hbm-play{ display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:clamp(20px,3vw,44px); align-items:center; margin-top:14px;
  padding:clamp(22px,3.4vw,38px); border-radius:26px; background:#fff; box-shadow:0 0 0 1px var(--line), 0 22px 40px -32px rgba(30,60,55,.5); }
@media (max-width:860px){ .hbm-play{ grid-template-columns:1fr; } }
.hbm-btn{ display:inline-flex; align-items:center; gap:10px; margin-top:14px; border:0; cursor:pointer; padding:13px 22px; border-radius:14px;
  background:var(--deep); color:#fff; font-family:'Manrope',sans-serif; font-weight:800; font-size:14px; transition:background .25s, transform .25s; }
.hbm-btn:hover{ background:#14564C; transform:translateY(-2px); }
.hbm-btn.alt{ background:var(--hot); } .hbm-btn.alt:hover{ background:#C4472B; }

/* витрината — картата на хандбала */
.rb2-img.rb-img-hb{ background:#E8F2ED url('art/rb-handbal.svg') center/cover no-repeat; }
.rb-hb .rb-kick, .rb-hb .rb2-body em{ color:#1E7A6B; }

/* Новина „Ден на спорта“ — видео и галерия */
.ds-video{ position:relative; margin:30px 0 0; border-radius:20px; overflow:hidden; background:#000; box-shadow:0 26px 50px -32px rgba(40,30,20,.7); }
.ds-video video{ width:100%; aspect-ratio:16/9; display:block; background:#000; }
.ds-cap{ margin:10px 2px 0; font-size:13.5px; color:var(--ink-soft); }
.ds-gal{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:20px; }
.ds-shot{ position:relative; border:0; padding:0; border-radius:14px; overflow:hidden; cursor:pointer; aspect-ratio:4/3; background:#EFE6DB;
  box-shadow:0 0 0 1px var(--line,#E7DDCD); transition:transform .35s cubic-bezier(.2,.8,.3,1), box-shadow .3s; }
.ds-shot img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .7s ease; }
.ds-shot:hover{ transform:translateY(-4px); box-shadow:0 0 0 1px var(--brick), 0 18px 30px -20px rgba(40,30,20,.5); }
.ds-shot:hover img{ transform:scale(1.06); }
.ds-shot figcaption{ position:absolute; left:0; right:0; bottom:0; padding:22px 10px 8px; text-align:left;
  background:linear-gradient(180deg, transparent, rgba(30,20,14,.8)); color:#fff; font-family:'Manrope',sans-serif; font-size:12px; font-weight:700; }
@media (max-width:900px){ .ds-gal{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* ===========================================================================
   77. НОВИНАТА ЗА ДЕНЯ НА СПОРТА — СОБСТВЕН ДИЗАЙН
   Вариант А „Репортаж“ (dsa-) и вариант Б „Часовник на деня“ (dsb-).
=========================================================================== */
/* --- общо: лента на прочетеното --- */
.dsx-prog{ position:fixed; left:0; top:0; height:3px; z-index:40; background:linear-gradient(90deg,#1E7A6B,#E8A33D); width:0; }

/* --- Вариант А: репортаж --- */
.dsa-hero{ position:relative; margin:0 calc(50% - 50vw); height:clamp(420px,80vh,760px); overflow:hidden; background:#14181A; }
.dsa-hero img{ position:absolute; inset:0; width:100%; height:108%; object-fit:cover; object-position:50% 45%; animation:dsaZoom 24s ease-in-out infinite alternate; }
@keyframes dsaZoom{ from{ transform:scale(1); } to{ transform:scale(1.08); } }
.dsa-hero::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,14,16,.5), rgba(10,14,16,.15) 35%, rgba(10,14,16,.9)); }
.dsa-in{ position:absolute; inset:auto 0 0 0; z-index:2; padding:0 clamp(20px,6vw,80px) clamp(36px,6vw,70px); color:#F7F1E8; max-width:1180px; margin:0 auto; }
.dsa-kick{ display:inline-flex; align-items:center; gap:10px; padding:7px 14px; border-radius:999px; background:rgba(232,163,61,.92); color:#2A1A06;
  font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.2em; text-transform:uppercase; }
.dsa-h1{ margin:18px 0 0; font-family:'Fraunces',serif; font-weight:400; font-size:clamp(34px,6vw,76px); line-height:1.02; }
.dsa-lead{ margin:16px 0 0; font-size:clamp(16px,1.9vw,21px); line-height:1.7; color:rgba(247,241,232,.86); max-width:60ch; }
.dsa-body{ max-width:720px; margin:clamp(34px,5vw,60px) auto 0; }
.dsa-body p{ margin:0 0 20px; font-size:18px; line-height:1.85; color:var(--ink); }
.dsa-body p:first-of-type::first-letter{ float:left; font-family:'Fraunces',serif; font-size:74px; line-height:.82; padding:6px 12px 0 0; color:var(--brick); }
.dsa-quote{ margin:34px 0; padding:26px 0 26px 28px; border-left:4px solid var(--brick); font-family:'Fraunces',serif; font-style:italic; font-size:clamp(22px,2.6vw,30px); line-height:1.4; color:var(--ink); }
.dsa-video{ margin:clamp(30px,5vw,56px) calc(50% - 50vw); position:relative; background:#0B0F10; }
.dsa-video video{ display:block; width:min(1180px,100%); margin:0 auto; aspect-ratio:16/9; }
.dsa-vcap{ max-width:1180px; margin:10px auto 0; padding:0 clamp(20px,4vw,40px) 26px; color:rgba(247,241,232,.7); font-size:13.5px; }
.dsa-time{ max-width:760px; margin:0 auto; position:relative; padding-left:26px; }
.dsa-time::before{ content:''; position:absolute; left:6px; top:8px; bottom:8px; width:2px; background:repeating-linear-gradient(180deg,var(--brick) 0 6px, transparent 6px 12px); opacity:.5; }
.dsa-t{ position:relative; padding:14px 0 14px 18px; }
.dsa-t::before{ content:''; position:absolute; left:-25px; top:22px; width:12px; height:12px; border-radius:50%; background:#fff; box-shadow:0 0 0 3px var(--brick); }
.dsa-t b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:20px; color:var(--brick-deep); }
.dsa-t span{ display:block; font-size:15.5px; line-height:1.6; color:var(--ink-soft); }
.dsa-mos{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:18px; }
.dsa-mos figure{ position:relative; margin:0; border:0; padding:0; cursor:pointer; overflow:hidden; border-radius:14px; aspect-ratio:4/3; background:#EFE6DB; }
.dsa-mos figure:nth-child(1){ grid-column:span 2; grid-row:span 2; aspect-ratio:auto; }
.dsa-mos img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .7s ease; }
.dsa-mos figure:hover img{ transform:scale(1.05); }
.dsa-mos figcaption{ position:absolute; left:0; right:0; bottom:0; padding:22px 10px 8px; background:linear-gradient(180deg,transparent,rgba(20,14,10,.8));
  color:#fff; font-family:'Manrope',sans-serif; font-size:12px; font-weight:700; }
@media (max-width:760px){ .dsa-mos{ grid-template-columns:repeat(2,minmax(0,1fr)); } .dsa-mos figure:nth-child(1){ grid-column:span 2; grid-row:auto; aspect-ratio:4/3; } }

/* Новината, вариант А — отстояние от ръба на телефон */
@media (max-width:700px){
  .dsa-body{ padding:0 18px; }
  .dsa-quote{ margin:26px 0; padding:18px 0 18px 18px; }
  .dsa-time{ padding-left:24px; margin-left:18px; margin-right:18px; }
  .dsa-mos{ padding:0 12px; }
  .dsa-vcap{ padding:0 18px 22px; }
}

/* --- Новината: диапозитиви до текста (dk-) --- */
.dk-stage{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:clamp(24px,4vw,56px); align-items:center;
  max-width:1180px; margin:clamp(30px,5vw,56px) auto 0; }
.dk-txt p{ margin:0 0 18px; font-size:17.5px; line-height:1.85; color:var(--ink); }
.dk-txt .mark{ display:inline-flex; align-items:center; gap:8px; margin-bottom:12px; padding:6px 13px; border-radius:999px;
  background:rgba(30,122,107,.1); color:#14564C; font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.dk-slides{ position:relative; border-radius:22px; overflow:hidden; aspect-ratio:4/3; background:#0E1513; box-shadow:0 30px 60px -36px rgba(30,20,10,.7); }
.dk-slides img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1.04);
  transition:opacity 1.1s ease, transform 5s ease; }
.dk-slides img.on{ opacity:1; transform:scale(1); }
.dk-cap{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:34px 16px 14px; color:#fff;
  background:linear-gradient(180deg,transparent,rgba(8,14,12,.85)); font-family:'Manrope',sans-serif; font-size:13px; font-weight:700; }
.dk-dots{ position:absolute; right:14px; top:14px; z-index:3; display:flex; gap:6px; }
.dk-dots i{ width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.45); transition:all .3s; }
.dk-dots i.on{ background:#E8A33D; width:20px; border-radius:4px; }
.dk-stage:nth-of-type(even) .dk-slides{ order:-1; }
@media (max-width:860px){ .dk-stage{ grid-template-columns:1fr; } .dk-stage:nth-of-type(even) .dk-slides{ order:0; } }

/* Учебен процес — график по БДП (bd-) */
.bd-pick{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 18px; }
.bd-pick button{ border:1px solid var(--line,#E7DDCD); background:#fff; cursor:pointer; padding:10px 16px; border-radius:999px;
  font-family:'Fraunces',serif; font-size:17px; color:var(--ink); transition:all .2s; }
.bd-pick button.on{ background:var(--brick); border-color:var(--brick); color:#fff; }
.bd-card{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:clamp(18px,3vw,32px); align-items:center;
  padding:clamp(20px,3vw,30px); border-radius:20px; background:#fff; box-shadow:0 0 0 1px var(--line,#E7DDCD); }
.bd-card .cls{ display:grid; place-items:center; width:92px; height:92px; border-radius:22px; background:var(--brick-bg); color:var(--brick-deep);
  font-family:'Fraunces',serif; font-size:30px; line-height:1; text-align:center; }
.bd-card .cls small{ display:block; font-family:'Manrope',sans-serif; font-size:10px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); margin-top:4px; }
.bd-when{ font-family:'Fraunces',serif; font-size:clamp(20px,2.4vw,26px); color:var(--ink); margin-bottom:12px; }
.bd-dates{ display:flex; flex-wrap:wrap; gap:10px; }
.bd-d{ display:flex; align-items:center; gap:10px; padding:10px 14px; border-radius:12px; background:var(--brick-bg); font-size:15px; color:var(--ink); }
.bd-d b{ font-family:'Fraunces',serif; font-weight:500; font-size:18px; color:var(--brick-deep); }
.bd-d.past{ opacity:.5; }
.bd-d.next{ box-shadow:0 0 0 2px var(--brick); }
.bd-note{ margin:14px 0 0; font-size:13.5px; color:var(--ink-soft); }
@media (max-width:560px){ .bd-card{ grid-template-columns:1fr; justify-items:center; text-align:center; } .bd-dates{ justify-content:center; } }

/* ===========================================================================
   78. НАЧАЛНА — УНИФОРМАТА (un-)
   Блок с превключвател „ежедневна / официална“, елементите като етикетчета
   и място за видео. Тонът е покана, не заповед.
=========================================================================== */
.un{ margin:0 calc(50% - 50vw); padding:clamp(40px,6vw,80px) clamp(18px,5vw,60px); background:linear-gradient(160deg,#EAF1F8,#F5F1E6); }
.un-in{ max-width:1180px; margin:0 auto; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:clamp(24px,4vw,56px); align-items:center; }
.un-kick{ font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.22em; text-transform:uppercase; color:#1F5C8C; }
.un-h{ margin:14px 0 0; font-family:'Fraunces',serif; font-weight:400; font-size:clamp(28px,4vw,50px); line-height:1.05; color:var(--ink); }
.un-h em{ font-style:normal; color:#C9982F; }
.un-lead{ margin:16px 0 0; font-size:17px; line-height:1.8; color:var(--ink-soft); max-width:46ch; }
.un-switch{ display:inline-flex; padding:5px; margin-top:22px; border-radius:999px; background:#fff; box-shadow:0 0 0 1px rgba(31,92,140,.18); }
.un-switch button{ border:0; cursor:pointer; padding:11px 20px; border-radius:999px; background:transparent; color:var(--ink);
  font-family:'Manrope',sans-serif; font-weight:800; font-size:14px; transition:background .25s, color .25s; }
.un-switch button.on{ background:#1F5C8C; color:#fff; }
.un-items{ display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; min-height:84px; }
.un-items span{ display:inline-flex; align-items:center; gap:8px; padding:10px 15px; border-radius:12px; background:#fff;
  box-shadow:0 0 0 1px rgba(31,92,140,.14); font-size:14.5px; color:var(--ink); animation:unIn .4s ease backwards; }
.un-items span i{ font-style:normal; width:14px; height:14px; border-radius:4px; background:var(--c,#1F5C8C); }
.un-items span:nth-child(2){ animation-delay:.05s; } .un-items span:nth-child(3){ animation-delay:.1s; }
.un-items span:nth-child(4){ animation-delay:.15s; } .un-items span:nth-child(5){ animation-delay:.2s; }
@keyframes unIn{ from{ opacity:0; transform:translateY(8px); } }
.un-note{ margin:18px 0 0; font-size:13.5px; line-height:1.6; color:var(--ink-soft); }
.un-note a{ color:#14568C; font-weight:700; }
.un-media{ position:relative; border-radius:24px; overflow:hidden; background:#0E1A24; aspect-ratio:16/9; box-shadow:0 30px 60px -34px rgba(20,40,60,.6); }
.un-media iframe, .un-media video{ position:absolute; inset:0; width:100%; height:100%; border:0; display:block; }
.un-soon{ position:absolute; inset:0; display:grid; place-items:center; text-align:center; padding:26px; color:#DCE9F5; }
.un-soon b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:clamp(20px,2.4vw,26px); margin-bottom:6px; }
.un-soon span{ font-size:14.5px; color:rgba(220,233,245,.7); }
@media (max-width:860px){ .un-in{ grid-template-columns:1fr; } }

/* --- Униформата като книжка с приказка (ps-) --- */
.un{ background:linear-gradient(160deg,#EFE6D8,#F7F0E5); }
.ps-wrap{ perspective:1800px; max-width:1060px; margin:0 auto; }
.ps-book{ position:relative; display:grid; grid-template-columns:1fr 1fr; border-radius:8px 16px 16px 8px;
  background:linear-gradient(90deg,#F6F0E2 0 50%, #FBF6EC 50% 100%);
  box-shadow:0 40px 70px -40px rgba(70,50,25,.6), 0 0 0 1px rgba(120,95,55,.18), inset 0 0 60px rgba(150,120,70,.07);
  min-height:clamp(430px,58vh,580px); }
.ps-book::before{ content:''; position:absolute; left:50%; top:0; bottom:0; width:46px; margin-left:-23px; pointer-events:none; z-index:2;
  background:linear-gradient(90deg, rgba(120,95,55,0), rgba(120,95,55,.2) 45%, rgba(120,95,55,.26) 50%, rgba(120,95,55,.2) 55%, rgba(120,95,55,0)); }
.ps-page{ position:relative; padding:clamp(26px,4vw,46px) clamp(24px,3.4vw,42px); display:flex; flex-direction:column; justify-content:center; }
.ps-page.left{ border-right:1px solid rgba(120,95,55,.12); }
.ps-num{ position:absolute; bottom:16px; font-family:'Fraunces',serif; font-size:13px; color:rgba(90,70,40,.5); }
.ps-page.left .ps-num{ left:clamp(24px,3.4vw,42px); }
.ps-page.right .ps-num{ right:clamp(24px,3.4vw,42px); }
.ps-chapter{ display:inline-flex; align-items:center; gap:10px; font-family:'Manrope',sans-serif; font-size:11px; font-weight:800;
  letter-spacing:.22em; text-transform:uppercase; color:#B0892E; }
.ps-chapter i{ display:block; width:26px; height:1px; background:#B0892E; opacity:.55; }
.ps-text{ margin:16px 0 0; font-family:'Fraunces',serif; font-weight:400; font-size:clamp(19px,2.1vw,25px); line-height:1.62; color:#2E2721; min-height:6.4em; }
.ps-text b{ font-weight:400; display:inline-block; opacity:0; transform:translateY(10px); animation:psWord .5s cubic-bezier(.2,.85,.3,1) forwards; }
@keyframes psWord{ to{ opacity:1; transform:none; } }
.ps-text em{ font-style:italic; color:#8A5A1E; }
.ps-photo{ position:relative; margin:auto; width:100%; max-width:320px; padding:12px 12px 58px; background:#fff; border-radius:3px;
  box-shadow:0 18px 34px -22px rgba(70,50,25,.75); transform:rotate(-1.2deg); }
.ps-frame{ position:relative; aspect-ratio:3/4; overflow:hidden; background:#0B1620; }
.ps-frame video, .ps-frame img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .7s ease; }
.ps-frame video.on, .ps-frame img.on{ opacity:1; }
.ps-cap{ position:absolute; left:12px; right:12px; bottom:10px; text-align:center; font-family:'Marck Script',cursive; font-size:19px; line-height:1.25; color:#4A3A22; }
.ps-book.turn .ps-page.right{ animation:psTurn .7s cubic-bezier(.4,.05,.3,1); transform-origin:left center; }
@keyframes psTurn{ 0%{ transform:rotateY(0); } 45%{ transform:rotateY(-70deg); filter:brightness(.92); } 100%{ transform:rotateY(0); } }
.ps-book.turn-back .ps-page.left{ animation:psTurnBack .7s cubic-bezier(.4,.05,.3,1); transform-origin:right center; }
@keyframes psTurnBack{ 0%{ transform:rotateY(0); } 45%{ transform:rotateY(70deg); filter:brightness(.92); } 100%{ transform:rotateY(0); } }
.ps-ctrl{ display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:22px; }
.ps-go{ border:0; cursor:pointer; padding:14px 26px; border-radius:999px; background:#8A5A1E; color:#FFF8EE;
  font-family:'Manrope',sans-serif; font-weight:800; font-size:15px; box-shadow:0 14px 26px -16px rgba(90,60,20,.9); transition:transform .25s, background .25s; }
.ps-go:hover{ background:#6F4715; transform:translateY(-2px); }
.ps-small{ border:0; cursor:pointer; width:44px; height:44px; border-radius:50%; background:#FFF8EE; color:#8A5A1E; font-size:18px;
  box-shadow:0 0 0 1px rgba(120,95,55,.25); transition:transform .2s; }
.ps-small:hover{ transform:translateY(-2px); }
.ps-small[disabled]{ opacity:.35; cursor:default; }
.ps-line{ display:flex; gap:4px; margin-left:auto; }
.ps-line i{ width:14px; height:3px; border-radius:2px; background:rgba(120,95,55,.25); transition:all .4s; }
.ps-line i.on{ background:#B0892E; width:26px; }
.ps-line i.done{ background:rgba(176,137,46,.5); }
.ps-veil{ position:absolute; inset:0; z-index:5; display:grid; place-items:center; text-align:center; padding:30px; border-radius:8px 16px 16px 8px;
  background:linear-gradient(150deg,#1F5C8C,#14385A); color:#F7EFE0; cursor:pointer;
  transition:opacity .8s, visibility .8s, transform .8s cubic-bezier(.4,.05,.3,1); transform-origin:left center; }
.ps-veil.gone{ opacity:0; visibility:hidden; transform:rotateY(-105deg); }
.ps-veil b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:clamp(26px,3.4vw,40px); line-height:1.2; }
.ps-veil span{ display:block; font-size:15px; color:rgba(247,239,224,.75); }
.ps-veil .orn{ display:block; width:60px; height:1px; background:rgba(232,200,119,.7); margin:18px auto; }
@media (max-width:860px){
  .ps-book{ grid-template-columns:1fr; min-height:0; background:#FBF6EC; }
  .ps-book::before{ display:none; }
  .ps-page.left{ border-right:0; border-top:1px solid rgba(120,95,55,.14); order:2; }
  .ps-page.right{ order:1; padding-bottom:6px; }
  .ps-photo{ max-width:280px; }
  .ps-num{ display:none; }
  .ps-text{ min-height:7em; }
}


/* Начална — само корицата на книжката, която води към пълната приказка */
.pk{ margin:0 calc(50% - 50vw); padding:clamp(40px,6vw,80px) clamp(18px,5vw,50px); background:linear-gradient(160deg,#EFE6D8,#F7F0E5); }
.pk-in{ max-width:1180px; margin:0 auto; display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,360px); gap:clamp(28px,5vw,64px); align-items:center; }
.pk-kick{ font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.22em; text-transform:uppercase; color:#B0892E; }
.pk-h{ margin:14px 0 0; font-family:'Fraunces',serif; font-weight:400; font-size:clamp(28px,4vw,48px); line-height:1.08; color:#2E2721; }
.pk-h em{ font-style:normal; color:#8A5A1E; }
.pk-p{ margin:16px 0 0; font-size:17px; line-height:1.8; color:#5C513F; max-width:46ch; }
.pk-go{ display:inline-flex; align-items:center; gap:10px; margin-top:24px; padding:15px 28px; border-radius:999px; background:#8A5A1E; color:#FFF8EE;
  text-decoration:none; font-family:'Manrope',sans-serif; font-weight:800; font-size:15px;
  box-shadow:0 16px 28px -18px rgba(90,60,20,.95); transition:transform .25s, background .25s; }
.pk-go:hover{ background:#6F4715; transform:translateY(-2px); }
.pk-cover{ position:relative; aspect-ratio:3/4; border-radius:8px 16px 16px 8px; overflow:hidden; display:grid; place-items:center; text-align:center;
  padding:30px; color:#F7EFE0; text-decoration:none; background:linear-gradient(150deg,#1F5C8C,#14385A);
  box-shadow:0 40px 70px -40px rgba(20,40,60,.8), inset 0 0 0 1px rgba(255,255,255,.12);
  transition:transform .5s cubic-bezier(.2,.8,.3,1), box-shadow .4s; transform-origin:left center; }
.pk-cover::before{ content:''; position:absolute; left:0; top:0; bottom:0; width:16px;
  background:linear-gradient(90deg, rgba(0,0,0,.35), rgba(255,255,255,.06)); }
.pk-cover::after{ content:''; position:absolute; inset:16px; border:1px solid rgba(232,200,119,.35); border-radius:4px; pointer-events:none; }
.pk-cover:hover{ transform:rotateY(-12deg) translateX(-4px); box-shadow:26px 40px 70px -40px rgba(20,40,60,.85), inset 0 0 0 1px rgba(255,255,255,.14); }
.pk-cover b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:clamp(23px,2.8vw,32px); line-height:1.2; }
.pk-cover .orn{ display:block; width:54px; height:1px; background:rgba(232,200,119,.7); margin:16px auto; }
.pk-cover span{ display:block; font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:rgba(247,239,224,.7); }
@media (max-width:860px){ .pk-in{ grid-template-columns:1fr; } .pk-cover{ max-width:280px; margin:0 auto; order:-1; } }

.pk-p em{ font-style:italic; color:#8A5A1E; }

/* Алеко ТВ — набор за нов сезон (cast-) */
.cast{ position:relative; margin:0 0 clamp(30px,4vw,44px); padding:clamp(24px,3.6vw,38px); border-radius:24px; overflow:hidden;
  background:radial-gradient(120% 130% at 12% 0%, #3A2470, #241246 55%, #180C33); color:#F6EFFF;
  box-shadow:0 34px 60px -38px rgba(30,10,60,.85); }
.cast::before{ content:''; position:absolute; inset:0; pointer-events:none; opacity:.35;
  background:radial-gradient(circle at 12% 18%, rgba(232,163,61,.5), transparent 18%),
             radial-gradient(circle at 88% 12%, rgba(78,205,196,.4), transparent 16%),
             radial-gradient(circle at 76% 84%, rgba(232,163,61,.35), transparent 20%); }
.cast-top{ position:relative; z-index:1; display:flex; flex-wrap:wrap; align-items:center; gap:14px; }
.cast-on{ display:inline-flex; align-items:center; gap:9px; padding:8px 15px; border-radius:999px; background:#E2593A; color:#fff;
  font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.2em; text-transform:uppercase; }
.cast-on i{ width:8px; height:8px; border-radius:50%; background:#fff; animation:castBlink 1.5s ease-in-out infinite; }
@keyframes castBlink{ 50%{ opacity:.3; } }
.cast-season{ display:inline-grid; place-items:center; width:58px; height:58px; border-radius:50%; background:linear-gradient(140deg,#E8A33D,#C9822A);
  color:#2A1A06; font-family:'Manrope',sans-serif; font-weight:800; line-height:1; text-align:center; font-size:11px; letter-spacing:.06em; }
.cast-season b{ display:block; font-size:22px; }
.cast h2{ position:relative; z-index:1; margin:18px 0 0; font-family:'Manrope',sans-serif; font-weight:800; font-size:clamp(28px,4.6vw,52px); line-height:1.04; letter-spacing:-.02em; }
.cast h2 em{ font-style:normal; color:#E8A33D; }
.cast p.lead{ position:relative; z-index:1; margin:14px 0 0; font-size:16.5px; line-height:1.75; color:rgba(246,239,255,.8); max-width:56ch; }
.cast-roles{ position:relative; z-index:1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:24px; }
.cast-role{ border:0; text-align:left; cursor:pointer; padding:18px; border-radius:18px; color:#fff; background:var(--c,#4ECDC4);
  box-shadow:0 16px 28px -20px rgba(0,0,0,.8); transition:transform .3s cubic-bezier(.34,1.4,.5,1), box-shadow .3s; }
.cast-role:hover{ transform:translateY(-4px); }
.cast-role b{ display:block; font-family:'Manrope',sans-serif; font-weight:800; font-size:19px; margin:10px 0 6px; }
.cast-role span{ display:block; font-size:13.5px; line-height:1.6; opacity:.92; max-height:0; overflow:hidden; transition:max-height .45s ease; }
.cast-role.on span{ max-height:120px; }
.cast-role svg{ width:26px; height:26px; }
.cast-note{ position:relative; z-index:1; margin:22px 0 0; font-size:17px; line-height:1.7; }
.cast-note em{ font-style:normal; color:#E8A33D; font-weight:700; }
.cast-cta{ position:relative; z-index:1; display:flex; flex-wrap:wrap; align-items:center; gap:14px; margin-top:20px; padding:18px 22px; border-radius:18px;
  background:rgba(246,239,255,.1); border:1px solid rgba(246,239,255,.18); }
.cast-cta b{ font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:#E8A33D; display:block; }
.cast-cta span{ display:block; font-family:'Fraunces',serif; font-size:clamp(20px,2.4vw,26px); margin-top:4px; }
.cast-cta small{ display:block; margin-top:4px; font-size:13.5px; color:rgba(246,239,255,.7); }
.cast-cta a{ margin-left:auto; padding:13px 22px; border-radius:999px; background:#E8A33D; color:#2A1A06; text-decoration:none;
  font-family:'Manrope',sans-serif; font-weight:800; font-size:14.5px; transition:transform .2s, background .2s; }
.cast-cta a:hover{ background:#D9922C; transform:translateY(-2px); }
@media (max-width:900px){ .cast-roles{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px){ .cast-roles{ grid-template-columns:1fr; } .cast-cta a{ margin-left:0; } }
/* Хандбал — герой на страницата */
.hn-top{ position:relative; margin:0 calc(50% - 50vw); padding:clamp(48px,8vw,96px) clamp(18px,5vw,50px) clamp(34px,5vw,60px); overflow:hidden;
  background:linear-gradient(150deg,#0F2A31,#16414A 55%,#1E7A6B); color:#EAF6F2; }
.hn-top-art{ position:absolute; inset:auto 0 0 0; height:100%; opacity:.5; pointer-events:none; }
.hn-top-in{ position:relative; z-index:1; max-width:1180px; margin:0 auto; }
.hn-tag{ display:inline-flex; align-items:center; gap:10px; padding:8px 15px; border-radius:999px; background:rgba(234,246,242,.12);
  font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:#8BD9C7; }
.hn-tag i{ width:7px; height:7px; border-radius:50%; background:#E8A33D; }
.hn-h1{ margin:18px 0 0; font-family:'Fraunces',serif; font-weight:400; font-size:clamp(36px,6vw,78px); line-height:1.02; }
.hn-h1 em{ font-style:normal; color:#E8A33D; }
.hn-sub{ margin:16px 0 0; font-size:clamp(16px,1.8vw,19px); line-height:1.8; color:rgba(234,246,242,.8); max-width:56ch; }

/* Хандбал — по-едро и по-разиграно */
.hn-h1{ font-size:clamp(40px,7.4vw,92px); }
.hn-sub{ font-size:clamp(17px,2vw,21px); }
.hn-fact{ padding:18px 22px; }
.hn-fact b{ font-size:clamp(22px,2.4vw,27px); }
.hn-fact span{ font-size:15px; }
.hn-fact em{ font-size:13px; }
.hn-fact .ic{ width:46px; height:46px; }
.hn-fact .ic svg{ width:24px; height:24px; }
.hn-lead{ font-size:clamp(17px,2vw,21px); }
.hn-win h3{ font-size:clamp(28px,4.4vw,52px); }
.hn-win p{ font-size:17.5px; }
.hn-rule b{ font-size:clamp(38px,5.4vw,60px); }
.hn-rule span{ font-size:16px; }

/* топката подскача в героя */
.hn-top-ball{ position:absolute; right:clamp(20px,8vw,120px); bottom:18px; width:clamp(54px,7vw,84px); aspect-ratio:1; border-radius:50%; z-index:1;
  background:radial-gradient(circle at 34% 30%, #FFD79A, #E8A33D 60%, #B9741F); box-shadow:0 18px 28px -14px rgba(0,0,0,.6);
  animation:hnBounce 2.6s cubic-bezier(.3,0,.5,1) infinite; }
.hn-top-ball::after{ content:''; position:absolute; inset:14%; border-radius:50%; border:2px solid rgba(138,90,30,.45);
  border-left-color:transparent; border-right-color:transparent; }
@keyframes hnBounce{ 0%,100%{ transform:translateY(0) rotate(0); } 45%{ transform:translateY(-54px) rotate(160deg); } 55%{ transform:translateY(-54px) rotate(200deg); } }
.hn-top-ball .shadow{ position:absolute; left:10%; right:10%; bottom:-14px; height:10px; border-radius:50%; background:rgba(0,0,0,.35); filter:blur(4px); }

/* галерията: първата снимка е голяма и всички се накланят леко */
.hn-gal figure:first-child{ grid-column:span 2; grid-row:span 2; aspect-ratio:auto; }
.hn-gal figure:hover{ transform:translateY(-5px) rotate(-.6deg); }
.hn-gal figcaption{ font-size:13.5px; }

/* купата подскача, когато стигнеш до нея */
.hn-cup{ display:inline-block; animation:hnCup 3.4s ease-in-out infinite; transform-origin:50% 90%; }
@keyframes hnCup{ 0%,100%{ transform:rotate(-4deg); } 50%{ transform:rotate(4deg) translateY(-6px); } }

@media (max-width:900px){ .hn-gal figure:first-child{ grid-column:span 2; grid-row:auto; aspect-ratio:4/3; } }
@media (prefers-reduced-motion:reduce){ .hn-top-ball, .hn-cup{ animation:none; } }
@media (max-width:700px){
  .hn-top-ball{ display:none; }
  .hn-fact{ grid-template-columns:auto minmax(0,1fr); padding:16px 18px; }
  .hn-fact em{ grid-column:2; margin-top:6px; }
  .hn-fact b{ font-size:21px; }
}

/* Начална — лента с преки пътеки (подрежда се сама, виж preki.js) */
.qk{ position:relative; margin:0 calc(50% - 50vw); padding:clamp(26px,3.4vw,40px) clamp(18px,5vw,50px);
  background:linear-gradient(180deg,#FBF6EC,#F6EFE2); border-bottom:1px solid rgba(122,42,51,.1); overflow:hidden; }
.qk::before{ content:''; position:absolute; left:50%; top:0; width:1px; height:22px; background:rgba(122,42,51,.25); }
.qk-in{ position:relative; max-width:1180px; margin:0 auto; display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:10px; }
.qk-lbl{ width:100%; text-align:center; margin-bottom:6px; font-family:'Fraunces',serif; font-style:italic; font-weight:400;
  font-size:clamp(15px,1.7vw,18px); color:var(--brick-deep); }
.qk a{ position:relative; display:inline-flex; align-items:center; gap:11px; padding:13px 20px 13px 14px; border-radius:16px;
  background:#fff; text-decoration:none; color:var(--ink); font-family:'Manrope',sans-serif; font-size:14.5px; font-weight:700;
  box-shadow:0 0 0 1px rgba(122,42,51,.12), 0 10px 20px -16px rgba(90,50,30,.5);
  opacity:0; transform:translateY(10px); animation:qkIn .55s cubic-bezier(.2,.8,.3,1) forwards;
  transition:transform .25s cubic-bezier(.2,.8,.3,1), box-shadow .25s, color .25s; }
.qk a:nth-child(2){ animation-delay:.04s; } .qk a:nth-child(3){ animation-delay:.08s; }
.qk a:nth-child(4){ animation-delay:.12s; } .qk a:nth-child(5){ animation-delay:.16s; } .qk a:nth-child(6){ animation-delay:.2s; }
@keyframes qkIn{ to{ opacity:1; transform:none; } }
.qk a .ic{ display:grid; place-items:center; width:34px; height:34px; border-radius:11px; background:var(--brick-bg); color:var(--brick-deep);
  transition:background .25s, color .25s, transform .25s; }
.qk a .ic svg{ width:17px; height:17px; }
.qk a::after{ content:'→'; font-family:'Manrope',sans-serif; font-weight:800; color:var(--brick); opacity:0; transform:translateX(-6px);
  transition:opacity .25s, transform .25s; }
.qk a:hover{ transform:translateY(-3px); color:var(--brick-deep); box-shadow:0 0 0 1px var(--brick), 0 18px 28px -18px rgba(122,42,51,.55); }
.qk a:hover .ic{ background:var(--brick); color:#fff; transform:rotate(-6deg); }
.qk a:hover::after{ opacity:1; transform:none; }
.qk a[hidden]{ display:none; }
@media (max-width:640px){
  .qk{ padding:22px 16px; }
  .qk-in{ justify-content:flex-start; gap:8px; }
  .qk-lbl{ text-align:left; font-size:15px; }
  .qk a{ padding:11px 15px 11px 11px; font-size:13.5px; }
  .qk a .ic{ width:30px; height:30px; }
  .qk a::after{ display:none; }
}
@media (prefers-reduced-motion:reduce){ .qk a{ animation:none; opacity:1; transform:none; } }

/* За родители — най-теглените бланки най-отгоре */
.rp-top{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:0 0 22px; }
.rp-top a{ display:flex; align-items:center; gap:14px; padding:18px 20px; border-radius:18px; text-decoration:none; background:var(--tb,#DCEBE7);
  box-shadow:0 0 0 1px rgba(47,111,102,.2); transition:transform .25s, box-shadow .25s; }
.rp-top a:hover{ transform:translateY(-3px); box-shadow:0 0 0 1px var(--tc,#2F6F66), 0 16px 26px -18px rgba(30,80,70,.5); }
.rp-top .ic{ width:42px; height:42px; flex:0 0 auto; border-radius:12px; background:#fff; color:var(--tc,#2F6F66); display:grid; place-items:center; }
.rp-top .ic svg{ width:20px; height:20px; }
.rp-top b{ display:block; font-family:'Fraunces',serif; font-weight:400; font-size:19px; color:var(--ink); }
.rp-top span{ display:block; font-size:13.5px; color:var(--ink-soft); margin-top:2px; }
.rp-top em{ margin-left:auto; font-style:normal; font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--tc,#2F6F66); white-space:nowrap; }
@media (max-width:760px){ .rp-top{ grid-template-columns:1fr; } .rp-top em{ display:none; } }

/* Лентата с преки пътеки — три картончета с кратко обяснение */
.qk-in{ gap:14px; }
.qk a{ padding:16px 22px 16px 16px; border-radius:18px; align-items:center; }
.qk-txt b{ display:block; font-family:'Manrope',sans-serif; font-size:16px; font-weight:800; color:var(--ink); line-height:1.2; }
.qk-txt span{ display:block; margin-top:3px; font-family:'Manrope',sans-serif; font-size:12.5px; font-weight:600; color:var(--ink-soft); }
.qk a:hover .qk-txt b{ color:var(--brick-deep); }
.qk a .ic{ width:40px; height:40px; border-radius:13px; }
.qk a .ic svg{ width:19px; height:19px; }
@media (max-width:640px){
  .qk-in{ gap:10px; }
  .qk a{ width:100%; padding:14px 16px; }
  .qk-txt b{ font-size:15px; } .qk-txt span{ font-size:12px; }
}

/* ---------------------------------------------------------------------------
   Клубни ленти „Нашите рубрики и клубове“ (начална страница и rubriki.html)
   Всеки клуб е висока лента; отворената се разтваря, останалите остават тесни.
   Отгоре скоба групира секциите по националната програма.
--------------------------------------------------------------------------- */
.kb{ display:flex; gap:18px; align-items:stretch; margin-top:6px; }
.kb-g{ display:flex; flex-direction:column; min-width:0; flex:3 1 0; transition:flex-grow .7s cubic-bezier(.2,.8,.2,1); }
.kb-ot{ flex-grow:5; }
.kb-np.has-open{ flex-grow:7; }
.kb-ot.has-open{ flex-grow:9; }
.kb-lab{ position:relative; display:flex; align-items:center; gap:10px; padding:0 2px 14px; font-size:13.5px; font-weight:600; color:var(--ink-soft); line-height:1.3; }
.kb-lab::after{ content:""; position:absolute; left:0; right:0; bottom:5px; height:9px; border:2px solid currentColor; border-bottom:0; border-radius:8px 8px 0 0; opacity:.28; }
.kb-np .kb-lab{ color:#22305E; }
.kb-np .kb-lab b{ font-family:'Fraunces',serif; font-weight:500; font-style:italic; font-size:16px; color:var(--ink); }
.kb-seal{ flex:none; display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:#22305E; color:#F7D9A8; font-size:11px; font-weight:800; letter-spacing:.04em; box-shadow:0 0 0 3px var(--cream), 0 0 0 4.5px #F07A2E; }
.kb-row{ display:flex; gap:8px; height:clamp(420px,52vh,500px); }
.kb-p{ position:relative; flex:1 1 0; min-width:0; border-radius:22px; overflow:hidden; background:var(--c); color:#fff; text-decoration:none; isolation:isolate;
  transition:flex-grow .7s cubic-bezier(.2,.8,.2,1), transform .5s cubic-bezier(.2,.8,.2,1); outline-offset:4px; }
.kb-p.on{ flex-grow:5; }
.kb-p::before{ content:""; position:absolute; inset:0; z-index:-1; background:radial-gradient(120% 80% at 100% 0%, color-mix(in srgb,var(--c2) 38%,transparent), transparent 60%), linear-gradient(180deg, transparent 40%, rgba(0,0,0,.28)); }
.kb-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; opacity:.0; transition:opacity .6s; }
.kb-p.on .kb-bg{ opacity:.42; }
.kb-motif{ position:absolute; z-index:-1; width:150%; max-width:none; right:-28%; top:-6%; fill:none; stroke:var(--c2); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; opacity:.18; transform:rotate(-8deg) scale(.9); transition:transform 1.1s cubic-bezier(.2,.8,.2,1), opacity .6s, width .7s; pointer-events:none; }
.kb-p.on .kb-motif{ width:84%; right:-10%; top:-8%; opacity:.34; transform:rotate(0) scale(1); }
.kb-em{ position:absolute; top:18px; left:50%; width:46px; height:46px; margin-left:-23px; border-radius:50%; overflow:hidden; background:var(--cream-3); box-shadow:0 0 0 3px color-mix(in srgb,var(--c2) 70%,transparent);
  transition:all .6s cubic-bezier(.34,1.4,.64,1); }
.kb-em img{ width:100%; height:100%; object-fit:cover; display:block; }
.kb-em-tv{ display:grid; place-items:center; background:var(--c2); color:var(--c); }
.kb-em-tv svg{ width:60%; }
.kb-p.on .kb-em{ top:26px; left:28px; margin-left:0; width:96px; height:96px; box-shadow:0 0 0 4px var(--c2), 0 18px 34px -14px rgba(0,0,0,.6); }
.kb-vt{ position:absolute; left:50%; bottom:24px; transform:translateX(-50%) rotate(180deg); writing-mode:vertical-rl; font-family:'Fraunces',serif; font-size:22px; font-weight:500; white-space:nowrap; letter-spacing:.01em; transition:opacity .3s; }
.kb-p.on .kb-vt{ opacity:0; }
.kb-in{ position:absolute; left:28px; right:28px; bottom:26px; min-width:300px; display:flex; flex-direction:column; align-items:flex-start; gap:10px; opacity:0; transform:translateY(16px); transition:opacity .25s, transform .25s; pointer-events:none; }
.kb-p.on .kb-in{ opacity:1; transform:none; transition:opacity .5s .25s, transform .6s .25s cubic-bezier(.2,.8,.2,1); }
.kb-in small{ font-size:13px; font-weight:700; color:var(--c2); }
.kb-in b{ font-family:'Fraunces',serif; font-weight:500; font-size:clamp(30px,3vw,42px); line-height:1.02; letter-spacing:-.02em; max-width:12ch; }
.kb-d{ font-size:15px; line-height:1.55; color:rgba(255,255,255,.86); max-width:34ch; }
.kb-ch{ display:flex; flex-wrap:wrap; gap:6px; }
.kb-ch i{ font-style:normal; font-size:12.5px; font-weight:700; padding:6px 11px; border-radius:99px; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.22); }
.kb-in em{ font-style:normal; font-weight:800; font-size:14px; margin-top:4px; padding:11px 18px; border-radius:99px; background:var(--c2); color:var(--c); transition:transform .3s; }
.kb-p.on:hover .kb-in em{ transform:translateX(4px); }
.kb-p:focus-visible{ outline:3px solid var(--c2); }
/* влизане — лентите изгряват една след друга, веднъж */
.kb .kb-p{ opacity:0; transform:translateY(40px); }
.kb.in .kb-p{ opacity:1; transform:none; transition:flex-grow .7s cubic-bezier(.2,.8,.2,1), opacity .7s calc(var(--i)*.07s), transform .9s calc(var(--i)*.07s) cubic-bezier(.2,.8,.2,1); }
@media (max-width:900px){
  .kb{ flex-direction:column; gap:26px; }
  .kb-row{ flex-direction:column; height:auto; }
  .kb-p{ flex:none; height:78px; transition:height .6s cubic-bezier(.2,.8,.2,1), opacity .7s, transform .9s; }
  .kb-p.on{ height:360px; }
  .kb-em{ top:16px; left:16px; margin-left:0; }
  .kb-p.on .kb-em{ top:20px; left:20px; width:78px; height:78px; }
  .kb-vt{ writing-mode:horizontal-tb; transform:none; left:76px; bottom:auto; top:24px; font-size:21px; }
  .kb-in{ left:20px; right:20px; bottom:20px; min-width:0; }
  .kb-motif{ width:70%; right:-12%; top:-30%; }
  .kb-p.on .kb-motif{ width:70%; top:-6%; }
  .kb.in .kb-p{ transition:height .6s cubic-bezier(.2,.8,.2,1), opacity .7s calc(var(--i)*.05s), transform .9s calc(var(--i)*.05s); }
}
@media (prefers-reduced-motion:reduce){
  .kb .kb-p, .kb.in .kb-p{ opacity:1; transform:none; transition:none; }
  .kb-g, .kb-em, .kb-motif, .kb-in{ transition:none !important; }
}

/* ---------------------------------------------------------------------------
   Национална програма — общ печат и бележка за графика
--------------------------------------------------------------------------- */
.np-seal{ display:inline-flex; align-items:center; gap:10px; padding:6px 14px 6px 6px; border-radius:99px; font-size:13px; font-weight:700; line-height:1.3;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.24); color:inherit; max-width:100%; }
.np-seal i{ flex:none; font-style:normal; display:grid; place-items:center; width:30px; height:30px; border-radius:50%; font-size:10.5px; font-weight:800; background:var(--np-a,#F07A2E); color:var(--np-b,#172248); }
.np-soon{ margin-top:clamp(30px,4vw,48px); padding:22px 26px; border-radius:20px; border:2px dashed color-mix(in srgb,var(--brick) 45%,transparent); background:color-mix(in srgb,var(--brick-bg) 60%,#fff); max-width:720px; }
.np-soon b{ font-family:'Fraunces',serif; font-weight:500; font-size:21px; color:var(--ink); }
.np-soon p{ margin:6px 0 0; font-size:15.5px; line-height:1.7; color:var(--ink-soft); }

/* ---------------------------------------------------------------------------
   Баскетбол (basketbol.html) — нощна зала: тъмносиньо, оранжева топка
--------------------------------------------------------------------------- */
[data-theme="basketbol"]{ --brick:#D9601F; --brick-deep:#22305E; --brick-bg:#FBE6D6; --bk-navy:#172248; --bk-or:#F07A2E; --bk-cream:#F7E6D2; }
.bk-top{ position:relative; margin:0 calc(50% - 50vw); padding:clamp(70px,10vw,130px) clamp(18px,5vw,50px) clamp(48px,7vw,90px); overflow:hidden;
  background:radial-gradient(80% 120% at 85% 10%, #2B3C78, transparent 60%), var(--bk-navy); color:var(--bk-cream); }
.bk-lines{ position:absolute; inset:0; width:100%; height:100%; }
.bk-top-in{ position:relative; max-width:1180px; margin:0 auto; }
.bk-h1{ font-family:'Fraunces',serif; font-weight:500; font-size:clamp(64px,13vw,190px); line-height:.9; letter-spacing:-.04em; margin:22px 0 18px; color:var(--bk-cream); }
.bk-sub{ font-size:clamp(16px,1.8vw,20px); line-height:1.7; max-width:46ch; color:rgba(247,230,210,.82); margin:0; }
.bk-ball{ position:absolute; right:clamp(-60px,4vw,90px); bottom:clamp(-90px,-4vw,-30px); width:clamp(180px,30vw,380px); animation:bkDrop 1.5s cubic-bezier(.3,0,.4,1) both; }
.bk-ball svg{ width:100%; display:block; filter:drop-shadow(0 30px 40px rgba(0,0,0,.45)); animation:bkSpin 30s linear infinite; }
@keyframes bkDrop{ 0%{ transform:translateY(-120%); } 45%{ transform:translateY(0); } 62%{ transform:translateY(-22%); } 78%{ transform:translateY(0); } 88%{ transform:translateY(-6%); } 100%{ transform:translateY(0); } }
@keyframes bkSpin{ to{ transform:rotate(360deg); } }
.bk-h2{ margin:clamp(40px,6vw,70px) 0 18px; }
.bk-rules{ margin:clamp(40px,6vw,70px) calc(50% - 50vw) 0; padding:clamp(28px,4vw,44px) clamp(18px,5vw,50px); background:var(--bk-or); color:var(--bk-navy); }
.bk-rules-in{ max-width:1180px; margin:0 auto; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
.bk-rule b{ display:block; font-family:'Fraunces',serif; font-weight:500; font-size:clamp(44px,6vw,78px); line-height:1; letter-spacing:-.03em; }
.bk-rule span{ display:block; margin-top:6px; font-size:15px; font-weight:600; max-width:20ch; }
.bk-game{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(22px,4vw,50px); align-items:center; padding:clamp(22px,3vw,34px); border-radius:28px; background:var(--bk-navy); color:var(--bk-cream); }
.bk-game h2{ font-family:'Fraunces',serif; font-weight:500; font-size:clamp(30px,3.6vw,44px); margin:0 0 10px; color:var(--bk-cream); }
.bk-game p{ font-size:15.5px; line-height:1.7; color:rgba(247,230,210,.8); }
.bk-go,.bk-again{ border:0; cursor:pointer; font:800 16px 'Manrope',sans-serif; padding:14px 30px; border-radius:99px; background:var(--bk-or); color:var(--bk-navy); margin-top:8px; transition:transform .2s; }
.bk-go:active{ transform:scale(.96); }
.bk-go:disabled{ opacity:.45; cursor:default; }
.bk-again{ background:var(--bk-cream); }
.bk-tally{ display:flex; gap:8px; margin-top:18px; min-height:22px; }
.bk-tally i{ width:20px; height:20px; border-radius:50%; border:2px solid rgba(247,230,210,.4); }
.bk-tally i.hit{ background:var(--bk-or); border-color:var(--bk-or); }
.bk-tally i.miss{ background:transparent; border-color:#E05555; position:relative; }
.bk-msg{ min-height:1.7em; font-weight:700; color:var(--bk-cream) !important; }
.bk-court{ position:relative; border-radius:20px; background:linear-gradient(180deg,#22305E,#121A38); overflow:hidden; }
.bk-court svg{ display:block; width:100%; height:auto; }
.bk-shot{ position:absolute; left:8%; top:78%; width:7%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle at 35% 30%,#FFB98A,#EE6A2C 55%,#A63B14); box-shadow:inset 0 0 0 2px rgba(58,26,12,.5); transform:translate(-50%,-50%); }
.bk-meter{ position:absolute; left:6%; right:6%; bottom:6%; height:14px; border-radius:99px; background:rgba(247,230,210,.18); }
.bk-zone{ position:absolute; top:0; bottom:0; border-radius:99px; background:#5CC48A; transition:left .4s, width .4s; }
.bk-needle{ position:absolute; top:-6px; width:6px; height:26px; margin-left:-3px; border-radius:3px; background:var(--bk-cream); box-shadow:0 0 0 2px var(--bk-navy); }
@media (max-width:900px){ .bk-game{ grid-template-columns:1fr; } .bk-rules-in{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (prefers-reduced-motion:reduce){ .bk-ball, .bk-ball svg{ animation:none; } }

.hn-np{ --np-a:#E8A33D; --np-b:#0F2A31; margin:12px 0 0; display:inline-flex; color:#EAF6F2; }
.hn-top-in .hn-np{ margin-left:10px; vertical-align:middle; }
@media (max-width:600px){ .hn-top-in .hn-np{ margin-left:0; display:flex; width:fit-content; } }
.kb-lab{ height:58px; align-items:flex-end; padding-bottom:16px; box-sizing:border-box; }
.kb-lab::after{ bottom:4px; }
.kb-bg{ -webkit-mask-image:linear-gradient(180deg,#000 30%,transparent 78%); mask-image:linear-gradient(180deg,#000 30%,transparent 78%); }
.kb-p.on .kb-bg{ opacity:.5; }
.kb-p:has(.kb-bg) .kb-motif{ display:none; }
.kb-p.on .kb-motif{ opacity:.26; }
@media (max-width:900px){ .kb-lab{ height:auto; } }
[data-theme="basketbol"] .bk-top + .ed-section{ padding-bottom:10px; }

/* ---------------------------------------------------------------------------
   СКЕЛЕТ — места за попълване (баскетбол, хореография). Махат се, щом дойде
   истинската информация: класовете sk-* стоят само там, където още липсва нещо.
--------------------------------------------------------------------------- */
.sk-t{ background:repeating-linear-gradient(135deg, rgba(240,180,60,.22) 0 8px, rgba(240,180,60,.1) 8px 16px); border-radius:6px; padding:0 4px; box-decoration-break:clone; -webkit-box-decoration-break:clone; }
.sk-ph, .sk-g{ display:grid; place-items:center; background:repeating-linear-gradient(135deg, color-mix(in srgb,var(--brick) 14%,#fff) 0 14px, color-mix(in srgb,var(--brick) 7%,#fff) 14px 28px) !important; outline:2px dashed color-mix(in srgb,var(--brick) 50%,transparent); outline-offset:-8px; cursor:default !important; }
.sk-ph{ aspect-ratio:4/3; }
.sk-ph-in{ display:flex; flex-direction:column; align-items:center; gap:8px; font-weight:800; font-size:14px; color:var(--brick-deep); }
.sk-ph-in svg{ width:40px; height:40px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.hn-gal .sk-g:first-child .sk-ph-in svg{ width:64px; height:64px; }
.sk-g figcaption, .sk-ph figcaption{ background:linear-gradient(180deg,transparent,rgba(0,0,0,.45)) !important; }
.sk-list{ list-style:none; margin:18px 0 0; padding:0; display:grid; gap:8px; max-width:640px; }
.sk-list li{ display:grid; grid-template-columns:90px minmax(0,1fr) auto; gap:14px; padding:10px 14px; border-radius:12px; background:rgba(255,255,255,.08) !important; font-size:15px; }
.sk-list b{ font-family:'Fraunces',serif; font-weight:500; }
.sk-list i{ font-style:normal; font-weight:800; }
.bk-win{ background:linear-gradient(150deg,#22305E,#121A38) !important; color:#F7E6D2 !important; }
.bk-win h3 em, .bk-win .sk-list i{ color:#F07A2E; }
.bk-win p{ color:rgba(255,255,255,.78) !important; }
.sk-quote{ margin:clamp(36px,5vw,60px) 0 0; padding:0 0 0 26px; border-left:4px solid var(--brick); max-width:760px; }
.sk-quote p{ font-family:'Fraunces',serif; font-style:italic; font-size:clamp(20px,2.4vw,27px); line-height:1.5; color:var(--ink); margin:0 0 12px; }
.sk-quote cite{ font-style:normal; font-weight:700; font-size:14.5px; color:var(--ink-soft); }
[data-theme="basketbol"] .hn-fact .ic, [data-theme="horeografia"] .hn-fact .ic{ background:var(--brick-bg); color:var(--brick-deep); }
@media (max-width:900px){ .hn-gal{ grid-template-columns:repeat(2,minmax(0,1fr)); } .sk-list li{ grid-template-columns:70px minmax(0,1fr); } .sk-list li i{ grid-column:2; } }

/* ---------------------------------------------------------------------------
   Хореография (horeografia.html) — фолклор: черен вълнен сукман, червена шевица,
   бяло ленено платно и злато. Шевицата е кръстат бод (art/shevica-*.svg).
--------------------------------------------------------------------------- */
[data-theme="horeografia"]{ --brick:#B3202A; --brick-deep:#5A1016; --brick-bg:#F6E1DE; --hz-wool:#2A1B1E; --hz-red:#C8202E; --hz-linen:#F3EDE2; --hz-gold:#E2B44A; --np-a:#C8202E; --np-b:#F3EDE2; }
.hz-top{ position:relative; margin:0 calc(50% - 50vw); padding:clamp(80px,11vw,140px) clamp(18px,5vw,50px) clamp(70px,9vw,110px); overflow:hidden;
  background:radial-gradient(60% 80% at 80% 20%, rgba(200,32,46,.22), transparent 70%), repeating-linear-gradient(0deg, rgba(255,255,255,.018) 0 2px, transparent 2px 5px), var(--hz-wool); color:var(--hz-linen); }
.hz-top::before{ content:""; position:absolute; right:clamp(-40px,6vw,120px); top:50%; width:clamp(200px,30vw,400px); aspect-ratio:1; transform:translateY(-50%) rotate(0deg);
  background:url('art/shevica-motiv.svg') center/contain no-repeat; opacity:.95; image-rendering:pixelated; animation:hzStitch 1.6s steps(13) both; }
@keyframes hzStitch{ from{ clip-path:inset(0 0 100% 0); } to{ clip-path:inset(0 0 0 0); } }
.hz-top-in{ position:relative; max-width:1180px; margin:0 auto; }
.hz-h1{ font-family:'Fraunces',serif; font-weight:400; font-style:italic; font-size:clamp(52px,10.5vw,150px); line-height:.95; letter-spacing:-.03em; margin:24px 0 20px; color:var(--hz-linen); max-width:9ch; }
.hz-sub{ font-size:clamp(16px,1.8vw,20px); line-height:1.7; max-width:44ch; color:rgba(243,237,226,.82); margin:0; }
.hz-hem{ position:absolute; left:0; right:0; bottom:0; height:42px; background:url('art/shevica-lenta.svg') 0 50%/auto 34px repeat-x, var(--hz-linen); border-top:3px solid var(--hz-red); }
.hz-open{ padding-bottom:20px !important; }
.hz-intro{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr); gap:clamp(28px,5vw,70px); align-items:start; }
.hz-lead{ font-size:clamp(17px,1.9vw,21px); line-height:1.8; color:var(--ink); margin:clamp(14px,2vw,24px) 0 0; max-width:52ch; }
.hz-prog{ position:relative; background:var(--hz-linen); padding:28px 28px 24px; border:1px solid #D9CDB8; box-shadow:0 26px 40px -30px rgba(42,27,30,.6); }
.hz-prog::before, .hz-prog::after{ content:""; position:absolute; left:0; right:0; height:18px; background:url('art/shevica-lenta.svg') 0 50%/auto 16px repeat-x; }
.hz-prog::before{ top:-9px; } .hz-prog::after{ bottom:-9px; }
.hz-prog-h{ display:block; font-family:'Fraunces',serif; font-style:italic; font-size:28px; color:var(--hz-red); margin:6px 0 10px; }
.hz-prog dl{ margin:0; }
.hz-prog dl div{ display:grid; grid-template-columns:110px minmax(0,1fr); gap:12px; padding:10px 0; border-top:1px dashed #CDBFA6; }
.hz-prog dt{ font-weight:700; font-size:14px; color:var(--ink-soft); }
.hz-prog dd{ margin:0; font-size:15.5px; color:var(--ink); }
.hz-h2{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(30px,4.2vw,50px); line-height:1.1; color:var(--ink); margin:0 0 12px; }
.hz-p{ font-size:16.5px; line-height:1.75; color:var(--ink-soft); max-width:62ch; margin:0 0 22px; }
.hz-light{ color:var(--hz-linen); }
p.hz-light{ color:rgba(243,237,226,.8); }
/* ритмите */
.hz-rhythm{ margin-top:clamp(50px,7vw,90px); padding:clamp(44px,6vw,80px) 0; background:var(--hz-wool); color:var(--hz-linen); border-top:6px solid var(--hz-red); }
.hz-dances{ display:flex; flex-wrap:wrap; gap:8px; margin:6px 0 26px; }
.hz-dances button{ border:1px solid rgba(243,237,226,.28); background:transparent; color:var(--hz-linen); font:700 15px 'Manrope',sans-serif; padding:10px 16px; border-radius:99px; cursor:pointer; }
.hz-dances button small{ font-weight:600; opacity:.7; margin-left:4px; }
.hz-dances button.on{ background:var(--hz-linen); color:var(--hz-wool); border-color:var(--hz-linen); }
.hz-meter{ display:flex; gap:6px; height:58px; max-width:760px; }
.hz-meter span{ position:relative; border-radius:10px; background:rgba(243,237,226,.1); border:1px solid rgba(243,237,226,.2); display:grid; place-items:center; font-family:'Fraunces',serif; font-size:20px; transition:background .07s, transform .07s; }
.hz-meter span.long{ background:rgba(200,32,46,.22); border-color:rgba(200,32,46,.6); }
.hz-meter span.now{ background:var(--hz-gold); color:var(--hz-wool); transform:translateY(-4px); }
.hz-meter span.long.now{ background:var(--hz-red); color:var(--hz-linen); }
.hz-count{ margin:10px 0 0; font-size:14px; color:rgba(243,237,226,.7); min-height:1.4em; }
.hz-line{ display:block; width:100%; max-width:760px; height:auto; margin:10px 0 6px; overflow:visible; }
.hz-line .p{ transition:transform .12s ease-out; }
.hz-line .p.up{ transform:translateY(-10px); }
.hz-line .p.up.big{ transform:translateY(-18px); }
.hz-ctrl{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-top:8px; }
.hz-play,.hz-step{ border:0; cursor:pointer; font:800 16px 'Manrope',sans-serif; padding:14px 26px; border-radius:99px; }
.hz-play{ background:rgba(243,237,226,.12); color:var(--hz-linen); }
.hz-step{ background:var(--hz-red); color:var(--hz-linen); min-width:150px; transition:transform .08s; }
.hz-step:active{ transform:scale(.94); }
.hz-step:disabled{ opacity:.4; cursor:default; }
.hz-slow{ display:flex; align-items:center; gap:8px; font-size:14px; font-weight:600; color:rgba(243,237,226,.8); margin-left:6px; cursor:pointer; }
.hz-slow input{ accent-color:var(--hz-red); width:18px; height:18px; }
.hz-msg{ min-height:1.6em; font-weight:800; font-size:18px; color:var(--hz-gold); margin:16px 0 0; }
.hz-score{ margin:4px 0 0; color:rgba(243,237,226,.75); }
.hz-score b{ color:var(--hz-linen); font-size:18px; }
/* обичаите */
.hz-cal{ list-style:none; margin:10px 0 0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; border-top:3px solid var(--hz-red); }
.hz-cal li{ padding:22px 22px 6px 0; border-right:1px dashed #CDBFA6; margin-right:22px; }
.hz-cal li:last-child{ border-right:0; margin-right:0; }
.hz-when{ display:inline-block; font-size:13px; font-weight:800; color:var(--hz-red); }
.hz-cal b{ display:block; font-family:'Fraunces',serif; font-weight:500; font-size:26px; color:var(--ink); margin:6px 0 6px; }
.hz-cal p{ margin:0; font-size:15.5px; line-height:1.65; color:var(--ink-soft); }
.hz-note{ margin:26px 0 0; font-size:15.5px; color:var(--ink); }
/* сцената */
.hz-stage{ padding:clamp(48px,6vw,84px) 0 clamp(36px,5vw,60px); background:radial-gradient(70% 60% at 50% 0%, rgba(226,180,74,.18), transparent 70%), #1F1416; color:var(--hz-linen); }
.hz-bill{ list-style:none; margin:4px 0 34px; padding:0; max-width:820px; }
.hz-bill li{ display:grid; grid-template-columns:auto 1fr auto auto; gap:14px; align-items:baseline; padding:13px 0; border-bottom:1px solid rgba(243,237,226,.14); font-size:15.5px; }
.hz-bill li > span{ font-family:'Fraunces',serif; font-style:italic; color:var(--hz-gold); }
.hz-bill i{ border-bottom:2px dotted rgba(243,237,226,.3); transform:translateY(-4px); order:2; }
.hz-bill b{ order:1; font-weight:700; }
.hz-bill em{ order:3; font-style:normal; font-weight:800; color:var(--hz-gold); }
.hz-bill li > span{ order:0; }
.hz-film{ display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:12px; scrollbar-color:rgba(243,237,226,.3) transparent; }
.hz-film figure{ position:relative; flex:none; margin:0; height:300px; aspect-ratio:3/4; scroll-snap-align:start; border-radius:6px; overflow:hidden; }
.hz-film figure.w{ aspect-ratio:3/2; }
.hz-film figure.t{ height:300px; aspect-ratio:2/3; }
.hz-film figcaption{ position:absolute; left:0; right:0; bottom:0; padding:22px 12px 10px; font-size:13px; font-weight:700; color:#fff; }
.hz-film .sk-g{ background:repeating-linear-gradient(135deg, rgba(200,32,46,.25) 0 14px, rgba(200,32,46,.12) 14px 28px) !important; outline-color:rgba(226,180,74,.5); }
.hz-film .sk-ph-in{ color:var(--hz-linen); }
.hz-hint{ font-size:13px; opacity:.6; margin:8px 0 0; }
.hz-stage .sk-t{ background:repeating-linear-gradient(135deg, rgba(226,180,74,.3) 0 8px, rgba(226,180,74,.14) 8px 16px); }
.hz-quote{ border-left-color:var(--hz-red); }
@media (max-width:900px){
  .hz-intro{ grid-template-columns:1fr; }
  .hz-cal{ grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:10px; }
  .hz-cal li:nth-child(2){ border-right:0; margin-right:0; }
  .hz-top::before{ opacity:.25; right:-60px; }
  .hz-bill li{ grid-template-columns:1fr; gap:2px; } .hz-bill i{ display:none; }
  .hz-film figure, .hz-film figure.t{ height:240px; }
}
@media (max-width:520px){ .hz-cal{ grid-template-columns:1fr; } .hz-cal li{ border-right:0; margin-right:0; } .hz-prog dl div{ grid-template-columns:96px minmax(0,1fr); } }
@media (prefers-reduced-motion:reduce){ .hz-top::before{ animation:none; } .hz-line .p{ transition:none; } }
.hz-line .lg{ transform-box:fill-box; transition:transform .1s; }

/* баскетбол — таблото, тактическата дъска, статистиката, хайлайтите */
.bk-sb-wrap{ margin-top:0; padding:clamp(46px,6vw,80px) 0; background:#0E1430; color:var(--bk-cream); }
.bk-sb-in{ display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,560px); gap:clamp(28px,5vw,70px); align-items:center; }
.bk-lead2{ font-size:clamp(17px,1.9vw,21px); line-height:1.8; color:rgba(247,230,210,.88); margin:0; max-width:46ch; }
.bk-sb{ background:#07090F; border-radius:18px; padding:18px; box-shadow:inset 0 0 0 3px #1E2747, 0 30px 50px -30px #000;
  background-image:radial-gradient(rgba(255,255,255,.05) 1px, transparent 1.2px); background-size:6px 6px; font-family:'Oswald','Manrope',sans-serif; }
.bk-sb-top{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:14px; font-size:15px; letter-spacing:.06em; color:#9FB0E8; }
.bk-sb-top span:last-child{ text-align:right; }
.bk-clock{ display:grid; place-items:center; width:86px; height:62px; border-radius:10px; background:#160606; box-shadow:inset 0 0 0 2px #3A0E0E; }
.bk-clock b{ font-size:44px; font-weight:600; color:#FF3B30; text-shadow:0 0 12px rgba(255,59,48,.7); font-variant-numeric:tabular-nums; }
.bk-sb-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-top:16px; }
.bk-sb-grid div, .bk-sb-foot{ background:#0B0F1C; border-radius:10px; padding:10px 12px; box-shadow:inset 0 0 0 1px #1E2747; }
.bk-sb small{ display:block; font-size:12.5px; letter-spacing:.06em; color:#8091C8; }
.bk-sb b{ display:inline-block; margin-top:4px; font-size:clamp(18px,2vw,24px); font-weight:500; color:#FFB020; text-shadow:0 0 10px rgba(255,176,32,.55); }
.bk-sb-foot{ margin-top:8px; display:grid; grid-template-columns:auto 1fr; gap:4px 14px; align-items:baseline; }
.bk-sb-foot b{ font-size:18px; margin:0; }
.bk-sb .sk-t{ background:repeating-linear-gradient(135deg, rgba(255,176,32,.18) 0 6px, transparent 6px 12px); }
.bk-p{ font-size:16.5px; line-height:1.75; color:var(--ink-soft); max-width:62ch; margin:0 0 22px; }
.bk-light{ color:var(--bk-cream) !important; } p.bk-light{ color:rgba(247,230,210,.78) !important; }
.bk-h2{ margin-top:0 !important; }
.bk-tac-sec{ padding-top:clamp(50px,7vw,90px) !important; padding-bottom:clamp(40px,5vw,70px) !important; }
.bk-tac{ display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(20px,4vw,50px); align-items:start; }
.bk-plays{ display:grid; gap:10px; }
.bk-plays button{ text-align:left; border:0; cursor:pointer; padding:16px 18px; border-radius:14px; background:#fff; box-shadow:0 0 0 1px #E7DDCD; font-family:'Manrope',sans-serif; transition:box-shadow .2s, transform .2s; }
.bk-plays button b{ display:block; font-family:'Fraunces',serif; font-weight:500; font-size:23px; color:var(--ink); }
.bk-plays button span{ font-size:14.5px; line-height:1.55; color:var(--ink-soft); }
.bk-plays button.on{ box-shadow:0 0 0 2px var(--bk-or), 0 16px 26px -18px rgba(240,122,46,.7); transform:translateX(6px); }
.bk-plays button:focus-visible{ outline:3px solid var(--bk-navy); outline-offset:3px; }
.bk-wb{ position:relative; background:#FBFBF8; border-radius:10px; padding:14px; box-shadow:0 0 0 10px #D8DCE3, 0 0 0 12px #B8BEC9, 0 30px 50px -30px rgba(23,34,72,.5); }
.bk-wb svg{ display:block; width:100%; height:auto; }
.bk-wb .ln{ fill:none; stroke:#3A4255; stroke-width:2.2; opacity:.55; }
.bk-wb .o circle{ fill:#fff; stroke:#1F4FD8; stroke-width:3.4; }
.bk-wb .o text{ font:700 17px 'Manrope',sans-serif; fill:#1F4FD8; text-anchor:middle; }
.bk-wb .x path{ stroke:#D8262C; stroke-width:4.4; stroke-linecap:round; }
.bk-wb #bkMarks path{ fill:none; stroke:#1F4FD8; stroke-width:3.4; stroke-linecap:round; stroke-linejoin:round; }
.bk-wb #bkMarks path.red{ stroke:#D8262C; }
.bk-wb #bkMarks path.dash{ stroke-dasharray:9 9; }
#bkBallT{ fill:#EE6A2C; stroke:#3A1A0C; stroke-width:1.6; }
.bk-replay{ position:absolute; right:22px; bottom:22px; border:0; cursor:pointer; font:700 13.5px 'Manrope',sans-serif; padding:8px 14px; border-radius:99px; background:var(--bk-navy); color:var(--bk-cream); }
.bk-box-sec{ padding:clamp(48px,6vw,84px) 0; background:var(--bk-navy); }
.bk-box-scroll{ overflow-x:auto; border-radius:14px; }
.bk-box{ width:100%; min-width:620px; border-collapse:collapse; font-size:15.5px; color:var(--bk-cream); background:#1D2A58; }
.bk-box th{ text-align:left; font:600 14px 'Oswald','Manrope',sans-serif; letter-spacing:.05em; color:#0E1430; background:var(--bk-or); padding:12px 16px; }
.bk-box td{ padding:13px 16px; border-top:1px solid rgba(247,230,210,.12); }
.bk-box tbody tr:nth-child(even) td{ background:rgba(255,255,255,.03); }
.bk-box td:last-child{ font-weight:800; color:#FFB020; }
.bk-hl{ columns:3 260px; column-gap:12px; margin-top:4px; }
.bk-hl figure{ position:relative; break-inside:avoid; margin:0 0 12px; border-radius:14px; overflow:hidden; aspect-ratio:4/3; }
.bk-hl figure.h2{ aspect-ratio:3/4; }
.bk-hl figcaption{ position:absolute; left:0; right:0; bottom:0; padding:22px 12px 10px; font-size:13px; font-weight:700; color:#fff; }
.bk-note{ margin:clamp(30px,4vw,50px) 0 0; padding:24px 28px; background:#FBFBF8; border-radius:8px; box-shadow:0 0 0 8px #D8DCE3; max-width:760px; }
.bk-note p{ margin:0 0 10px; font-family:'Fraunces',serif; font-style:italic; font-size:clamp(19px,2.3vw,25px); line-height:1.5; color:#1F4FD8; }
.bk-note cite{ font-style:normal; font-weight:700; font-size:14.5px; color:var(--ink-soft); }
@media (max-width:900px){ .bk-sb-in, .bk-tac{ grid-template-columns:1fr; } .bk-sb-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } .bk-plays{ grid-template-columns:repeat(2,minmax(0,1fr)); } .bk-plays button span{ display:none; } .bk-plays button.on{ transform:none; } }

/* Секциите с .wrap губеха страничния си отстъп, защото .ed-section (в
   style-editorial.css) го нулира с padding:… 0. На тесни екрани текстът опираше
   в ръба. Връщаме отстъпа там, където екранът е по-тесен от рамката. */
@media (max-width:1340px){ .ed-section.wrap{ padding-left:clamp(20px,4vw,56px); padding-right:clamp(20px,4vw,56px); } }

.bk-top-in{ z-index:2; }
@media (max-width:600px){
  .bk-ball{ width:150px; right:-46px; bottom:-56px; opacity:.85; }
  .bk-sub{ text-shadow:0 1px 12px rgba(23,34,72,.9); }
}

/* Режим „на живо“ за страниците, които още чакат информация:
   <body data-skel="hide"> скрива празните части (.sk-hide), а там, където
   стои само „[ден]“, „[час]“ и т.н., показва „скоро“. Щом всичко се попълни,
   атрибутът data-skel и класовете sk-hide / sk-t се махат. */
[data-skel="hide"] .sk-hide{ display:none !important; }
[data-skel="hide"] .sk-t{ background:none; padding:0; font-size:0 !important; }
[data-skel="hide"] .sk-t::after{ content:"скоро"; font-size:1rem; opacity:.75; }
[data-skel="hide"] .bk-sb .sk-t::after{ font-size:clamp(18px,2vw,24px); }
[data-skel="hide"] .hz-prog .sk-t::after{ font-size:15.5px; font-style:italic; }

/* ---------------------------------------------------------------------------
   „Последно от училищния живот“ — първа страница на училищен вестник.
   Водеща новина с цялата снимка + колона с още новини и най-новото видео.
   Всеки запис носи листче от календар с датата. Попълва се от sadarzhanie.js.
--------------------------------------------------------------------------- */
.vs{ display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:clamp(22px,3.4vw,44px); align-items:start; }
.vs a{ text-decoration:none; color:inherit; }
.vs-lead{ display:block; }
.vs-ph{ position:relative; display:block; aspect-ratio:4/3; border-radius:20px; overflow:hidden; background:#2A231D; isolation:isolate; }
.vs-ph::before{ content:""; position:absolute; inset:-30px; z-index:-1; background:var(--bg) center/cover; filter:blur(26px) saturate(1.2) brightness(.6); }
.vs-ph img{ width:100%; height:100%; object-fit:contain; display:block; transition:transform .9s cubic-bezier(.2,.8,.3,1); }
.vs-lead:hover .vs-ph img{ transform:scale(1.03); }
.vs-date{ flex:none; display:grid; grid-template-rows:auto 1fr; width:58px; border-radius:8px; overflow:hidden; background:#FFFDF8; text-align:center;
  box-shadow:0 1px 0 #E3D8C4, 0 10px 18px -12px rgba(36,30,25,.6); }
.vs-date i{ font-style:normal; font-size:11.5px; font-weight:800; letter-spacing:.04em; color:#fff; background:var(--clay,#A24C36); padding:3px 0 2px; }
.vs-date b{ font-family:'Fraunces',serif; font-weight:500; font-size:26px; line-height:1.25; color:var(--ink); padding:2px 0 4px; }
.vs-ph .vs-date{ position:absolute; top:16px; left:16px; width:76px; transform:rotate(-4deg); }
.vs-ph .vs-date b{ font-size:36px; }
.vs-ph .vs-date i{ font-size:13px; }
.vs-lt{ display:flex; flex-direction:column; gap:8px; padding:18px 4px 0; }
.vs-lt small, .vs-rt small{ font-size:13px; font-weight:700; color:var(--clay,#A24C36); }
.vs-lt b{ font-family:'Fraunces',serif; font-weight:500; font-size:clamp(25px,2.7vw,34px); line-height:1.15; color:var(--ink); letter-spacing:-.01em; }
.vs-lt > span{ font-size:16.5px; line-height:1.65; color:var(--ink-soft); max-width:56ch; }
.vs-lt em{ font-style:normal; font-weight:800; font-size:14.5px; color:var(--ink); margin-top:4px; }
.vs-lead:hover .vs-lt em{ color:var(--clay,#A24C36); }
.vs-side{ display:flex; flex-direction:column; border-top:2px solid var(--ink); }
.vs-row, .vs-vid{ display:grid; grid-template-columns:auto minmax(0,1fr) 96px; gap:16px; align-items:start; padding:18px 0; border-bottom:1px solid #DDD2BF; }
.vs-rt{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.vs-rt b{ font-family:'Fraunces',serif; font-weight:500; font-size:19.5px; line-height:1.25; color:var(--ink); }
.vs-rt > span{ font-size:14.5px; line-height:1.55; color:var(--ink-soft); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.vs-row:hover .vs-rt b, .vs-vid:hover .vs-rt b{ color:var(--clay,#A24C36); }
.vs-th{ width:96px; height:96px; object-fit:cover; border-radius:12px; }
.vs-vid{ grid-template-columns:120px minmax(0,1fr); }
.vs-vimg{ position:relative; display:block; width:120px; aspect-ratio:16/9; border-radius:10px; overflow:hidden; background:#2A231D; }
.vs-vimg img{ width:100%; height:100%; object-fit:cover; display:block; }
.vs-play{ position:absolute; inset:0; display:grid; place-items:center; }
.vs-play svg{ width:34px; height:34px; padding:8px 7px 8px 9px; border-radius:50%; fill:#fff; background:rgba(162,76,54,.92); transition:transform .25s; }
.vs-vid:hover .vs-play svg{ transform:scale(1.12); }
.vs-all{ align-self:flex-start; margin-top:18px; font-weight:800; font-size:14.5px; color:var(--ink); border-bottom:2px solid var(--clay,#A24C36); padding-bottom:2px; }
.vs a:focus-visible{ outline:3px solid var(--clay,#A24C36); outline-offset:4px; border-radius:12px; }
@media (max-width:900px){
  .vs{ grid-template-columns:1fr; }
  .vs-ph{ aspect-ratio:4/3.4; }
  .vs-row{ grid-template-columns:auto minmax(0,1fr) 76px; gap:12px; }
  .vs-th{ width:76px; height:76px; }
  .vs-date{ width:50px; } .vs-date b{ font-size:22px; }
}
@media (prefers-reduced-motion:reduce){ .vs-ph img, .vs-play svg{ transition:none; } }
@media (min-width:901px){ .vs-all{ display:none; } }

/* Новина „Изберете клуб заедно с детето си“ (novina-klubove-2026.html) */
.kn-h{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(26px,3.2vw,38px); color:var(--ink); margin:clamp(40px,5vw,64px) 0 18px; }
.kn-sub{ font-size:16px; color:var(--ink-soft); margin:-8px 0 18px; }
.kn-steps{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); counter-reset:kn; position:relative; }
.kn-steps::before{ content:""; position:absolute; left:0; right:0; top:22px; height:3px; background:linear-gradient(90deg, var(--brick) 0 30%, #DDD2BF 30% 100%); }
.kn-st{ position:relative; counter-increment:kn; padding-right:18px; }
.kn-st::before{ content:counter(kn); position:relative; display:grid; place-items:center; width:46px; height:46px; border-radius:50%; font-family:'Fraunces',serif; font-size:21px;
  background:var(--cream); color:var(--ink-soft); box-shadow:inset 0 0 0 2px #CDBFA6, 0 0 0 6px var(--cream); }
.kn-st.now::before{ background:var(--brick); color:#fff; box-shadow:0 0 0 6px var(--cream); }
.kn-st b{ display:block; font-family:'Fraunces',serif; font-weight:500; font-size:22px; color:var(--ink); margin:14px 0 4px; }
.kn-st p{ margin:0; font-size:15px; line-height:1.6; color:var(--ink-soft); }
.kn-st.soon b{ color:var(--ink-soft); }
.kn-here{ position:absolute; top:-6px; left:56px; font-size:12.5px; font-weight:800; color:#fff; background:var(--ink); padding:5px 10px; border-radius:99px; white-space:nowrap; }
.kn-here::before{ content:""; position:absolute; left:-5px; top:50%; margin-top:-5px; border:5px solid transparent; border-left:0; border-right-color:var(--ink); }
.kn-clubs{ padding-top:10px !important; }
.kn-ask{ margin-top:clamp(34px,4vw,50px); padding:22px 26px; border-radius:18px; background:#fff; box-shadow:0 0 0 1px #E7DDCD; max-width:760px; }
.kn-ask b{ font-family:'Fraunces',serif; font-weight:500; font-size:22px; color:var(--ink); }
.kn-ask p{ margin:6px 0 0; font-size:15.5px; line-height:1.7; color:var(--ink-soft); }
.kn-ask a{ color:var(--brick-deep,var(--clay)); font-weight:700; }
@media (max-width:900px){
  .kn-steps{ grid-template-columns:1fr; gap:22px; }
  .kn-steps::before{ left:22px; right:auto; top:0; bottom:0; width:3px; height:auto; background:linear-gradient(180deg, var(--brick) 0 36%, #DDD2BF 36% 100%); }
  .kn-st{ display:grid; grid-template-columns:46px minmax(0,1fr); column-gap:16px; padding:0; }
  .kn-st::before{ grid-row:span 2; }
  .kn-st b{ margin:6px 0 2px; }
  .kn-here{ position:static; justify-self:start; grid-column:2; margin-top:8px; }
  .kn-here::before{ display:none; }
}
.bk-lead2 b{ color:#fff; font-weight:700; }
.bk-lead-sm{ margin-top:14px !important; font-size:15px !important; color:rgba(247,230,210,.65) !important; }
.bk-sb-foot{ grid-template-columns:auto 1fr; }
.bk-where-h{ font-family:'Fraunces',serif; font-weight:400; font-size:26px; color:var(--bk-cream); margin:34px 0 12px; }
.bk-where{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.bk-where li{ padding:10px 16px; border-radius:99px; background:rgba(247,230,210,.08); border:1px solid rgba(247,230,210,.2); color:var(--bk-cream); font-size:15px; font-weight:600; }
.bk-where li::before{ content:""; display:inline-block; width:9px; height:9px; border-radius:50%; background:var(--bk-or); margin-right:9px; vertical-align:1px; }
.bk-box td:first-child{ white-space:nowrap; }

/* баскетбол — галерия „Хайлайти“ (снимките са до ~740 px, затова 2 × 2, без разтягане) */
.bk-hl{ columns:auto; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; max-width:1100px; }
.bk-hl figure{ position:relative; margin:0; border-radius:16px; overflow:hidden; aspect-ratio:16/9; cursor:zoom-in; background:#172248; }
.bk-hl figure img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .8s cubic-bezier(.2,.8,.3,1); }
.bk-hl figure:hover img{ transform:scale(1.04); }
.bk-hl figure:focus-visible{ outline:3px solid var(--bk-or); outline-offset:3px; }
.bk-hl figcaption{ position:absolute; left:0; right:0; bottom:0; padding:28px 14px 11px; font-size:13.5px; font-weight:700; color:#fff; background:linear-gradient(180deg,transparent,rgba(14,20,48,.85)); }
@media (max-width:600px){ .bk-hl{ grid-template-columns:1fr; } }
.hz-prog dd small{ font-size:13.5px; color:var(--ink-soft); }
.hz-prog dt{ font-family:'Fraunces',serif; font-style:italic; font-size:17px; font-weight:500; color:var(--hz-red); }
/* хореография — снимката на групата, в рамка от шевица */
.hz-photo-sec{ padding-top:clamp(30px,4vw,50px); }
.hz-photo{ position:relative; margin:0 auto; max-width:900px; padding:14px; background:var(--hz-linen); border:1px solid #D9CDB8; box-shadow:0 30px 50px -34px rgba(42,27,30,.7); cursor:zoom-in; }
.hz-photo::before, .hz-photo::after{ content:""; position:absolute; left:0; right:0; height:18px; background:url('art/shevica-lenta.svg') 0 50%/auto 16px repeat-x; }
.hz-photo::before{ top:-9px; } .hz-photo::after{ bottom:-9px; }
.hz-photo img{ display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; }
.hz-photo figcaption{ padding:12px 4px 2px; font-family:'Fraunces',serif; font-style:italic; font-size:17px; color:var(--hz-red); text-align:center; }
.hz-photo:focus-visible{ outline:3px solid var(--hz-red); outline-offset:4px; }
.hz-photo-sec + .hz-rhythm{ margin-top:clamp(50px,6vw,80px); }

/* Алеко ТВ — обложката на сезон 2 и промото в телевизора */
.atv-cover-wrap{ margin-top:clamp(18px,3vw,34px); }
.atv-cover{ margin:0; border-radius:22px; overflow:hidden; box-shadow:0 30px 60px -36px rgba(20,24,70,.75); background:#14184A; }
.atv-cover img{ display:block; width:100%; height:auto; }
.atv-promo{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:1; background:#000; }
.atv-screen.no-promo .atv-promo, .atv-screen.no-promo .atv-sound{ display:none; }
.atv-screen:not(.no-promo) .atv-play{ left:auto; top:auto; right:16px; bottom:58px; margin:0; width:60px; height:60px; }
.atv-screen:not(.no-promo) .atv-play svg{ width:24px; height:24px; }
.atv-sound{ position:absolute; right:12px; top:12px; z-index:7; border:0; cursor:pointer; font:700 12.5px 'Manrope',sans-serif; padding:7px 12px; border-radius:99px; background:rgba(0,0,0,.55); color:#fff; backdrop-filter:blur(4px); }
.atv-sound[aria-pressed="true"]{ background:#E0452B; }
.atv-cover-wrap{ padding-left:0; padding-right:0; }
@media (max-width:1340px){ .atv-cover-wrap{ padding-left:clamp(20px,4vw,56px); padding-right:clamp(20px,4vw,56px); } }

/* ===========================================================================
   Алеко ТВ — тъмното студио на сезон 2 (body.atv-dark).
   Кавърът (art/alekotv-cover.jpg) задава света: синя сцена, топли прожектори
   от горните ъгли, бели рисунки с линия (звезди, REC, клапа, камера, микрофон),
   жълти и сини щрихи и жълта четка под ключовите думи — като под „Сезон 2“.
=========================================================================== */
body.atv-dark{ background:#0B1237; }
body.atv-dark main{
  --ink:#F4F2FF; --ink-soft:rgba(222,226,255,.74); --brick:#FFC928; --brick-deep:#FFC928;
  --atv-y:#FFC928; --atv-c:#1FD1E6; --atv-v:#2B1C6E;
  color:var(--ink);
  background:
    radial-gradient(60vw 50vw at -10% 8%, rgba(255,178,72,.16), transparent 60%),
    radial-gradient(60vw 50vw at 110% 8%, rgba(255,178,72,.14), transparent 60%),
    radial-gradient(70vw 40vw at 50% 55%, rgba(31,120,230,.18), transparent 70%),
    linear-gradient(180deg, #0F1A4E 0%, #0B1237 45%, #120F33 100%);
  overflow:hidden;
}
/* кавърът */
.atv-hero{ position:relative; margin-top:0; }
.atv-hero picture, .atv-hero img{ display:block; width:100%; }
.atv-hero img{ height:min(56.25vw, 88vh); min-height:420px; object-fit:cover; object-position:50% 46%; }
.atv-hero::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:46%; background:linear-gradient(180deg, transparent, #0F1A4E 92%); pointer-events:none; }
.atv-hero-txt{ position:relative; z-index:2; margin-top:clamp(-210px,-13vw,-90px); text-align:center; }
.atv-hero-txt .ed-kicker{ color:var(--atv-c); }
.atv-hero-txt .ed-page-title{ color:#fff; font-style:normal; font-weight:500; text-shadow:0 4px 30px rgba(0,0,0,.5); margin-left:auto; margin-right:auto; }
.atv-hero-txt .ed-page-title::after{ display:none; }
.atv-hero-txt p{ max-width:60ch; margin:14px auto 0; color:var(--ink-soft); font-size:clamp(16px,1.7vw,19px); line-height:1.7; }
@media (max-width:700px){ .atv-hero img{ height:auto; min-height:0; aspect-ratio:4/3; } .atv-hero-txt{ margin-top:-60px; } }
/* четката */
.brush{ position:relative; z-index:0; white-space:nowrap; padding:0 .12em; }
.brush::before{ content:""; position:absolute; z-index:-1; left:-.08em; right:-.08em; bottom:-.02em; height:.62em; background:url('art/brush-yellow.svg') center/100% 100% no-repeat; transform:rotate(-1.5deg); opacity:.95; }
.atv-h .brush, .ed-page-title .brush{ color:#21155C; }
.ed-page-title .brush::before{ height:.9em; bottom:.02em; }
/* рисунките с бяла линия и щрихите */
.atv-stage, .atv-block, .atv-crew-dd{ position:relative; }
.atv-crew-dd{ height:0; }
.dd{ position:absolute; width:var(--s,48px); height:var(--s,48px); transform:rotate(var(--r,0deg)); pointer-events:none; z-index:0; opacity:.9; animation:ddFloat 7s ease-in-out infinite alternate; }
.dd svg{ width:100%; height:100%; overflow:visible; fill:none; stroke:#fff; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 0 6px rgba(120,200,255,.35)); }
.dd-str{ width:80px; height:60px; }
.dd-str svg path{ stroke-width:6; }
.dd:nth-of-type(2n){ animation-duration:9s; animation-delay:-3s; }
@keyframes ddFloat{ from{ translate:0 0; } to{ translate:0 -10px; } }
/* телевизорът стои в лъча на прожектор */
body.atv-dark .atv-tv{ position:relative; z-index:1; }
body.atv-dark .atv-tv::before{ content:""; position:absolute; left:50%; top:-120px; width:140%; height:150%; transform:translateX(-50%); z-index:-1; pointer-events:none;
  background:radial-gradient(50% 55% at 50% 30%, rgba(255,214,140,.22), transparent 70%); }
body.atv-dark .atv-onair span{ box-shadow:0 0 0 2px rgba(255,255,255,.12), 0 0 30px rgba(224,52,28,.45); }
body.atv-dark .atv-shelf{ background:linear-gradient(180deg, rgba(31,209,230,.06), rgba(31,209,230,.13)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
body.atv-dark .atv-ep{ color:var(--ink-soft); }
body.atv-dark .ed-kicker{ color:var(--atv-c); }
body.atv-dark .atv-rec a{ background:#fff; color:#1A1440; box-shadow:0 18px 40px -16px rgba(255,201,40,.55); }
body.atv-dark .atv-rec p{ color:var(--ink-soft); }
body.atv-dark main .ed-section{ position:relative; z-index:1; }
@media (max-width:700px){ .dd{ --s:38px !important; opacity:.7; } .dd-rec{ --s:56px !important; } }
@media (prefers-reduced-motion:reduce){ .dd{ animation:none; } }
body.atv-dark .atv-crew{ margin-top:clamp(46px,5vw,64px); }
body.atv-dark .ed-footer::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 46' preserveAspectRatio='none'%3E%3Cpath d='M0 0 C 240 40 480 40 720 22 C 960 4 1200 4 1440 34 L1440 0 Z' fill='%23120F33'/%3E%3C/svg%3E"); }
body.atv-dark main{ background-color:#0F1A4E; }
.atv-hero::after{ display:none; }
.atv-hero picture{ position:relative; }
.atv-hero picture::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:42%; background:linear-gradient(180deg, rgba(15,26,78,0), #0F1A4E 96%); pointer-events:none; }
body.atv-dark main{
  background:
    radial-gradient(55vw 45vw at -10% 32%, rgba(255,178,72,.14), transparent 60%),
    radial-gradient(55vw 45vw at 110% 34%, rgba(255,178,72,.12), transparent 60%),
    radial-gradient(70vw 40vw at 50% 60%, rgba(31,120,230,.16), transparent 70%),
    linear-gradient(180deg, #0F1A4E 0%, #0F1A4E 12%, #0B1237 50%, #120F33 100%);
}
.atv-hero{ background:#0F1A4E; }
body.atv-dark main{
  background:
    radial-gradient(55vw 40vw at -10% 48%, rgba(255,178,72,.13), transparent 60%),
    radial-gradient(55vw 40vw at 110% 52%, rgba(255,178,72,.11), transparent 60%),
    radial-gradient(70vw 40vw at 50% 70%, rgba(31,120,230,.15), transparent 70%),
    linear-gradient(180deg, #0F1A4E 0%, #0F1A4E 22%, #0B1237 55%, #120F33 100%);
}
/* Алеко ТВ в лентите — сцената от кавъра на сезон 2 */

/* Лентите със снимки — като кавъра на Алеко ТВ: в затворено положение снимката
   е приглушена и оцветена в цвета на клуба, в отворено свети почти цяла и плавно
   се стопява към текста долу. */
.kb-bg{ opacity:.26; mix-blend-mode:luminosity; filter:contrast(1.08); transform:scale(1.08); transition:opacity .7s, transform 1.2s cubic-bezier(.2,.8,.2,1), filter .7s;
  -webkit-mask-image:linear-gradient(180deg,#000 40%,transparent 92%); mask-image:linear-gradient(180deg,#000 40%,transparent 92%); }
.kb-p.on .kb-bg{ opacity:.9; mix-blend-mode:normal; filter:saturate(1.08) contrast(1.04); transform:scale(1); }
.kb-p:has(.kb-bg)::before{ background:radial-gradient(120% 70% at 100% 0%, color-mix(in srgb,var(--c2) 30%,transparent), transparent 60%), linear-gradient(180deg, transparent 22%, color-mix(in srgb,var(--c) 82%,transparent) 54%, var(--c) 84%); z-index:-1; }
.kb-p .kb-bg{ z-index:-2; }
.kb-p.on .kb-in b, .kb-p.on .kb-d{ text-shadow:0 2px 18px rgba(0,0,0,.45); }
@media (max-width:900px){ .kb-bg{ -webkit-mask-image:linear-gradient(90deg,#000 30%,transparent 95%); mask-image:linear-gradient(90deg,#000 30%,transparent 95%); } .kb-p.on .kb-bg{ -webkit-mask-image:linear-gradient(180deg,#000 30%,transparent 90%); mask-image:linear-gradient(180deg,#000 30%,transparent 90%); } }

/* ===========================================================================
   Фото-кавър на клубните страници (.pc): реалистичната снимка стои вдясно на
   цяла височина и се стопява наляво в цвета на заглавната част; текстът е вляво.
   На телефон снимката е отгоре, текстът под нея.
=========================================================================== */
.pc{ min-height:min(88vh, 780px); display:flex; align-items:center; isolation:isolate; }
.pc > div:first-child, .pc .hn-top-in, .pc .bk-top-in, .pc .hz-top-in{ position:relative; z-index:2; width:100%; }
.pc .bk-top-in > *, .pc .hn-top-in > *, .pc .hz-top-in > *{ max-width:min(560px, 52vw); }
.pc-ph{ position:absolute; z-index:0; top:0; right:0; bottom:0; width:min(58vw, 820px); margin:0; pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 34%); mask-image:linear-gradient(90deg, transparent 0%, #000 34%); }
.pc-ph img{ width:100%; height:100%; object-fit:cover; object-position:50% 40%; display:block; animation:pcIn 1.6s cubic-bezier(.2,.8,.2,1) both; }
.pc-ph::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 55%, rgba(0,0,0,.35)); }
@keyframes pcIn{ from{ transform:scale(1.08); opacity:0; } to{ transform:scale(1); opacity:1; } }
/* в баскетбола и хандбала старите рисунки на игрището отстъпват на снимката */
.pc .bk-lines{ opacity:.25; -webkit-mask-image:linear-gradient(90deg,#000 30%,transparent 60%); mask-image:linear-gradient(90deg,#000 30%,transparent 60%); }
.pc .hn-top-art{ opacity:.35; }
.hz-top.pc::before{ display:none; }
.hz-top.pc .hz-hem{ z-index:3; }
.hz-top.pc .pc-ph{ bottom:42px; }
.bk-top.pc{ background:radial-gradient(60% 90% at 0% 10%, rgba(255,178,72,.12), transparent 60%), #0E1430; }
.hn-top.pc .pc-ph img{ object-position:60% 40%; }
@media (max-width:820px){
  .pc{ display:block; min-height:0; padding-top:0 !important; }
  .pc-ph{ position:relative; width:auto; height:62vh; margin:0 calc(-1 * clamp(18px,5vw,50px)) -24vh; -webkit-mask-image:linear-gradient(180deg,#000 50%,transparent 98%); mask-image:linear-gradient(180deg,#000 50%,transparent 98%); }
  .pc .bk-top-in, .pc .hn-top-in, .pc .hz-top-in{ order:2; }
  .pc .bk-top-in > *, .pc .hn-top-in > *, .pc .hz-top-in > *{ max-width:none; }
  .hz-top.pc .pc-ph{ bottom:auto; }
}
@media (prefers-reduced-motion:reduce){ .pc-ph img{ animation:none; } }
.hn-top.pc{ background:radial-gradient(70% 90% at 0% 20%, rgba(232,163,61,.10), transparent 60%), linear-gradient(90deg, #0E3236 0%, #0C2232 45%, #0A1426 100%); }
.pc .hn-top-art{ display:none; }
/* баскетбол — топлите прожектори и боке от кавъра продължават в тъмните ленти */
.bk-sb-wrap, .bk-box-sec{ position:relative; isolation:isolate; }
.bk-sb-wrap::before, .bk-box-sec::before{ content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(40vw 30vw at 100% 0%, rgba(255,178,72,.16), transparent 60%),
    radial-gradient(12px 12px at 88% 18%, rgba(255,200,120,.55), transparent 70%),
    radial-gradient(18px 18px at 93% 34%, rgba(255,200,120,.35), transparent 70%),
    radial-gradient(10px 10px at 80% 10%, rgba(255,200,120,.45), transparent 70%),
    radial-gradient(22px 22px at 6% 80%, rgba(120,170,255,.25), transparent 70%),
    radial-gradient(14px 14px at 12% 90%, rgba(120,170,255,.3), transparent 70%); }
.bk-box-sec{ background:radial-gradient(50vw 30vw at 0% 0%, rgba(255,178,72,.10), transparent 60%), var(--bk-navy); }

/* ===========================================================================
   Вплитане на реалистичните кадри в самите страници.
   Текстурите са изрязани от кадрите: паркет (tx-parket), син терен (tx-teren),
   мрежа на вратата (tx-mreja), сцена (tx-scena); размитите варианти (blur-*)
   са фон на тъмните ленти. Прожекторите и боке са общи (.arena-glow).
=========================================================================== */
/* общо — лента-под между разделите */
.tx-floor{ height:clamp(90px,11vw,150px); margin:0 calc(50% - 50vw); background-size:cover; background-position:center; position:relative; }
.tx-floor::before, .tx-floor::after{ content:""; position:absolute; left:0; right:0; height:45%; pointer-events:none; }
.tx-floor::before{ top:0; background:linear-gradient(180deg, var(--floor-from,#0B1230), transparent); }
.tx-floor::after{ bottom:0; background:linear-gradient(0deg, var(--floor-to,#0B1230), transparent); }
.tx-parket{ background-image:url('art/tx-parket.jpg'); }
.tx-teren{ background-image:url('art/tx-handbal-teren.jpg'); }

/* ---------- БАСКЕТБОЛ: цялата страница е залата ---------- */
[data-theme="basketbol"] main{ background:#0B1230; }
[data-theme="basketbol"] .tx-floor{ --floor-from:#0E1430; --floor-to:#0B1230; }
.bk-tac-sec, .bk-hl-sec{ position:relative; isolation:isolate; }
.bk-tac-sec::before, .bk-hl-sec::before{ content:""; position:absolute; inset:0 calc(50% - 50vw); z-index:-1; pointer-events:none;
  background:
    radial-gradient(38vw 30vw at 0% 0%, rgba(255,178,72,.14), transparent 62%),
    radial-gradient(38vw 30vw at 100% 0%, rgba(255,178,72,.12), transparent 62%),
    radial-gradient(14px 14px at 6% 14%, rgba(255,205,130,.5), transparent 70%),
    radial-gradient(22px 22px at 94% 22%, rgba(255,205,130,.35), transparent 70%),
    radial-gradient(10px 10px at 88% 8%, rgba(255,205,130,.55), transparent 70%); }
[data-theme="basketbol"] .bk-h2, [data-theme="basketbol"] .bk-tac-sec .ed-h2, [data-theme="basketbol"] .bk-hl-sec .ed-h2{ color:#F7E6D2; }
[data-theme="basketbol"] .bk-tac-sec .bk-p{ color:rgba(247,230,210,.75); }
.bk-plays button{ --ink:#1E1A16; --ink-soft:#5B5246; }
.bk-plays button:not(.on){ background:rgba(255,255,255,.92); }
.bk-wb{ box-shadow:0 0 0 10px #D8DCE3, 0 0 0 12px #B8BEC9, 0 40px 80px -30px rgba(0,0,0,.8), 0 0 120px -20px rgba(255,190,100,.35); }
/* правилата — нарисувани върху паркета */
.bk-rules{ position:relative; isolation:isolate; color:#fff !important; background:#5B3416 url('art/tx-parket.jpg') center/cover !important; }
.bk-rules::before{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(11,18,48,.55), rgba(11,18,48,.25) 40%, rgba(11,18,48,.6)); }
.bk-rules::after{ content:""; position:absolute; z-index:-1; left:50%; top:50%; width:min(70vw,900px); aspect-ratio:3; transform:translate(-50%,-50%); border:3px solid rgba(255,255,255,.35); border-radius:50%; pointer-events:none; }
.bk-rule b{ color:#fff; text-shadow:0 2px 0 rgba(0,0,0,.25); }
.bk-rule span{ color:rgba(255,255,255,.9); }
/* играта — в размития кадър на залата */
.bk-game{ background:linear-gradient(90deg, rgba(14,20,48,.92), rgba(14,20,48,.55)), url('art/blur-basketbol.jpg') center/cover !important; box-shadow:0 40px 80px -40px rgba(0,0,0,.9), inset 0 0 0 1px rgba(255,255,255,.06); }
[data-theme="basketbol"] .ed-footer::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 46' preserveAspectRatio='none'%3E%3Cpath d='M0 0 C 240 40 480 40 720 22 C 960 4 1200 4 1440 34 L1440 0 Z' fill='%230B1230'/%3E%3C/svg%3E"); }

/* ---------- ХАНДБАЛ: синята зала ---------- */
[data-theme="handbal"] main{ background:#0A1426; }
[data-theme="handbal"] .tx-floor{ --floor-from:#0A1426; --floor-to:#0A1426; }
[data-theme="handbal"] main > .ed-section{ position:relative; isolation:isolate; }
[data-theme="handbal"] main > .ed-section::before{ content:""; position:absolute; inset:0 calc(50% - 50vw); z-index:-1; pointer-events:none;
  background:
    radial-gradient(40vw 30vw at 100% 0%, rgba(255,190,100,.12), transparent 62%),
    radial-gradient(40vw 30vw at 0% 30%, rgba(60,140,255,.12), transparent 62%),
    radial-gradient(16px 16px at 92% 10%, rgba(255,210,140,.5), transparent 70%),
    radial-gradient(10px 10px at 86% 18%, rgba(255,210,140,.45), transparent 70%); }
[data-theme="handbal"] main > .ed-section > .ed-h2, [data-theme="handbal"] main > .ed-section h2.ed-h2, [data-theme="handbal"] .hn-lead{ color:#EAF2FF; }
[data-theme="handbal"] main > .ed-section .ed-kicker{ color:#FFB54A; }
[data-theme="handbal"] main > .ed-section > p, [data-theme="handbal"] .hn-play p{ color:rgba(234,242,255,.78); }
.hn-fact, .hn-rule{ --ink:#14232B; --ink-soft:#4C5D66; }
/* мрежата на вратата — фина шарка в горния десен ъгъл на разделите */
[data-theme="handbal"] main > .ed-section::after{ content:""; position:absolute; top:0; right:calc(50% - 50vw); width:min(30vw,340px); height:min(60vw,700px); z-index:-1; pointer-events:none;
  background:url('art/tx-mreja.jpg') center/cover; mix-blend-mode:screen; opacity:.18;
  -webkit-mask-image:linear-gradient(225deg,#000 20%,transparent 70%); mask-image:linear-gradient(225deg,#000 20%,transparent 70%); }
/* лентата с успехите — на синия терен, с червено-бялата греда отгоре */
.hn-win{ position:relative; isolation:isolate; background:#123A6A url('art/tx-handbal-teren.jpg') center/cover !important; border-top:10px solid transparent; border-image:repeating-linear-gradient(90deg,#D62E2E 0 46px,#F2F2F2 46px 92px) 10; }
.hn-win::before{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg, rgba(8,18,40,.85), rgba(8,18,40,.45)); }
.hn-play{ background:linear-gradient(90deg, rgba(10,20,38,.94), rgba(10,20,38,.7)), url('art/blur-handbal.jpg') center/cover !important; }
[data-theme="handbal"] .ed-footer::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 46' preserveAspectRatio='none'%3E%3Cpath d='M0 0 C 240 40 480 40 720 22 C 960 4 1200 4 1440 34 L1440 0 Z' fill='%230A1426'/%3E%3C/svg%3E"); }

/* ---------- ХОРЕОГРАФИЯ: сцената от кадъра ---------- */
.hz-rhythm{ position:relative; isolation:isolate; background:#1E1416 !important; }
.hz-rhythm::before{ content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(90deg, rgba(30,20,22,.96) 30%, rgba(30,20,22,.7)), url('art/blur-horeografia.jpg') right center/cover; }
.hz-rhythm::after{ content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(36vw 28vw at 100% 0%, rgba(255,190,110,.2), transparent 62%), radial-gradient(14px 14px at 90% 10%, rgba(255,210,150,.55), transparent 70%), radial-gradient(20px 20px at 96% 26%, rgba(255,210,150,.35), transparent 70%); }
.hz-floor{ height:70px; max-width:760px; margin:12px 0 -76px; border-radius:6px; background:url('art/tx-scena.jpg') center/cover; opacity:.85;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 40%,#000 70%,transparent); mask-image:linear-gradient(180deg,transparent,#000 40%,#000 70%,transparent); }
.hz-line{ position:relative; }
.hz-stage{ background:radial-gradient(60% 50% at 50% 0%, rgba(255,190,110,.18), transparent 70%), linear-gradient(180deg, rgba(31,20,22,.92), rgba(31,20,22,.98)), url('art/blur-horeografia.jpg') center/cover !important; }
[data-theme="handbal"] .hb-panel h3{ color:#EAF2FF; }
[data-theme="handbal"] .hn-play h3{ color:#EAF2FF; }
.bk-hl-sec{ padding-bottom:clamp(40px,5vw,70px) !important; }
/* хореография — носията отблизо, лента между ритмите и обичаите */
.hz-nosia{ position:relative; margin:0 calc(50% - 50vw); height:clamp(260px,30vw,420px); overflow:hidden; background:#1E1416; }
.hz-nosia img{ width:100%; height:100%; object-fit:cover; object-position:50% 38%; display:block; }
.hz-nosia::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, #1E1416 0%, transparent 22%, transparent 60%, var(--hz-linen,#F3EDE2) 100%), linear-gradient(90deg, rgba(30,20,22,.85), transparent 55%); }
.hz-nosia figcaption{ position:absolute; z-index:1; left:max(24px, calc(50% - 590px)); top:50%; transform:translateY(-50%); max-width:34ch; color:#FBEFF5; }
.hz-nosia figcaption b{ display:block; font-family:'Fraunces',serif; font-style:italic; font-weight:400; font-size:clamp(28px,3.6vw,46px); line-height:1.1; margin-bottom:8px; }
.hz-nosia figcaption span{ font-size:16px; line-height:1.65; color:rgba(251,239,245,.82); }

/* ===========================================================================
   Фото-кавър за Творилница и Пътешественици (.ph-top) + „залепени“ изрезки
   от кадъра (.el) до краткия текст за клуба.
=========================================================================== */
.ph-top{ position:relative; margin:0 calc(50% - 50vw); padding:clamp(100px,12vw,150px) clamp(18px,5vw,50px) clamp(60px,7vw,90px); overflow:hidden; color:#FBF3E6; }
.ph-top-in{ max-width:1180px; margin:0 auto; }
.ph-top .ed-kicker{ color:#F2C26B; }
.ph-h1{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(46px,7.4vw,104px); line-height:.98; letter-spacing:-.025em; margin:16px 0 18px; color:#FBF3E6; }
.ph-h1 em{ display:block; font-style:italic; color:#F2C26B; }
.ph-lead{ font-size:clamp(16px,1.8vw,20px); line-height:1.7; color:rgba(251,243,230,.84); margin:0; }
.ph-tvor{ background:radial-gradient(50% 70% at 0% 0%, rgba(255,186,96,.16), transparent 60%), #17120F; }
.ph-patesh{ background:radial-gradient(50% 70% at 0% 0%, rgba(255,186,96,.14), transparent 60%), linear-gradient(90deg,#120E0B 30%, #0C1430); }
/* изрезките — като снимки, залепени върху масата */
.ph-stick{ display:flex; gap:14px; margin-top:clamp(26px,3.4vw,40px); align-items:flex-start; }
.el{ margin:0; position:relative; flex:none; }
.el img{ display:block; width:100%; height:100%; object-fit:cover; }
.el-pol{ width:clamp(108px,11vw,140px); padding:7px 7px 26px; background:#FBF6EC; box-shadow:0 18px 30px -16px rgba(0,0,0,.7); }
.el-pol img{ aspect-ratio:1; }
.el-pol figcaption{ position:absolute; left:0; right:0; bottom:5px; text-align:center; font-family:'Fraunces',serif; font-style:italic; font-size:14px; color:#5A3E28; }
.el-post{ width:clamp(120px,12vw,160px); padding:6px; background:#F4EAD6; box-shadow:0 18px 30px -16px rgba(0,0,0,.7); }
.el-post img{ aspect-ratio:4/3; }
.el-round{ width:clamp(92px,9vw,118px); aspect-ratio:1; border-radius:50%; overflow:hidden; box-shadow:0 0 0 5px #C9A15A, 0 18px 30px -14px rgba(0,0,0,.8); }
.el.r1{ transform:rotate(-6deg); } .el.r2{ transform:rotate(3deg) translateY(8px); } .el.r3{ transform:rotate(-2deg); }
.el::before{ content:""; position:absolute; z-index:2; top:-9px; left:50%; width:54px; height:18px; margin-left:-27px; background:rgba(242,214,150,.75); transform:rotate(-4deg); box-shadow:0 1px 2px rgba(0,0,0,.2); }
.el-round::before{ display:none; }
@media (max-width:820px){ .ph-top{ padding-top:0; } .ph-stick{ justify-content:flex-start; } .el-pol{ width:96px; } .el-post{ width:110px; } }

/* текстурни ленти */
.tx-masa{ background-image:url('art/tx-masa.jpg'); --floor-from:#17120F; --floor-to:var(--cream); }
.tx-kartichki{ background-image:url('art/tx-kartichki.jpg'); --floor-from:#0E0F1C; --floor-to:var(--cream); height:clamp(130px,16vw,220px); }

/* ---------- ТВОРИЛНИЦА: работилницата под топлите лампи ---------- */
[data-theme="tvorilnica"] main{ background:
  radial-gradient(40vw 30vw at 0% 18%, rgba(255,186,96,.14), transparent 60%),
  radial-gradient(40vw 30vw at 100% 22%, rgba(255,186,96,.12), transparent 60%),
  var(--cream); }
.tw-room{ position:relative; }
.tw-room::before{ content:""; position:absolute; inset:0; pointer-events:none; z-index:0; opacity:.5;
  background-image:radial-gradient(1.6px 1.6px at 12% 8%, #fff, transparent), radial-gradient(1.2px 1.2px at 30% 22%, #fff, transparent), radial-gradient(1.8px 1.8px at 74% 12%, #fff, transparent), radial-gradient(1.2px 1.2px at 88% 40%, #fff, transparent), radial-gradient(1.4px 1.4px at 52% 66%, #fff, transparent); }
.tw-block{ position:relative; }
.el-side{ position:absolute; right:0; top:-14px; transform:rotate(5deg); z-index:2; }
@media (max-width:700px){ .el-side{ width:84px; top:-30px; } }

/* ---------- ПЪТЕШЕСТВЕНИЦИ: старата карта зад разделите ---------- */
.pz-room{ position:relative; isolation:isolate; }
.pz-room::before{ content:""; position:absolute; inset:0 calc(50% - 50vw); z-index:-1; pointer-events:none; opacity:.12;
  background:url('art/tx-karta.jpg') center top/900px auto repeat;
  -webkit-mask-image:linear-gradient(180deg,#000,transparent 60%); mask-image:linear-gradient(180deg,#000,transparent 60%); }
[data-theme="patesh"] main{ background:radial-gradient(40vw 30vw at 100% 12%, rgba(255,186,96,.12), transparent 60%), var(--cream); }

/* ---------- МАЖОРЕТКИ: заглавната част е сцената с кадъра ---------- */
.mzh-stagewrap{ position:relative; isolation:isolate; color:#FFF3EC; }
.mzh-stagewrap::before{ content:""; position:absolute; z-index:-1; top:-140px; bottom:0; left:calc(50% - 50vw); right:calc(50% - 50vw); pointer-events:none;
  background:radial-gradient(40vw 40vw at 85% 10%, rgba(255,196,110,.22), transparent 60%), radial-gradient(40vw 40vw at 0% 100%, rgba(40,90,200,.25), transparent 60%), #0E1022; }
.mzh-stagewrap .mzh-h1{ color:#FFF3EC; }
.mzh-stagewrap .mzh-h1 em{ color:#F2C26B; }
.mzh-stagewrap .mzh-lead{ color:rgba(255,243,236,.82); }
.mzh-stagewrap .mzh-tag{ color:#FFD9A0; background:rgba(255,255,255,.08); }
.mzh-stagewrap .mzh-meta span{ color:rgba(255,243,236,.9); border-color:rgba(242,194,107,.35); }
/* номерата в краткото описание — като златните копчета на куртката */
.mzh-stagewrap .mzh-meta b{ display:inline-grid; place-items:center; width:30px; height:30px; border-radius:50%; margin-right:8px; color:#5A3A08;
  background:radial-gradient(circle at 35% 30%, #FFF0B8, #E2B44A 45%, #9C6F1C); box-shadow:0 2px 6px rgba(0,0,0,.4); font-size:11.5px; }
.mzh-shot-stage{ cursor:default; box-shadow:0 40px 80px -30px rgba(0,0,0,.85), 0 0 0 1px rgba(255,255,255,.06); }
.mzh-shot-stage:hover img{ transform:none; }
.mzh-confetti{ position:absolute; inset:0; pointer-events:none;
  background-image:
    radial-gradient(3px 6px at 20% 10%, #F2C26B, transparent), radial-gradient(4px 3px at 70% 18%, #E8384F, transparent),
    radial-gradient(3px 5px at 40% 30%, #4FB3FF, transparent), radial-gradient(5px 3px at 85% 40%, #F2C26B, transparent),
    radial-gradient(3px 6px at 10% 55%, #E8384F, transparent), radial-gradient(4px 4px at 60% 60%, #fff, transparent);
  animation:mzConf 6s linear infinite; }
@keyframes mzConf{ from{ background-position:0 -40px; } to{ background-position:0 600px; } }
/* червено-златната лента под заглавната част — ширитите от куртката */
.mzh-ticker{ border-top:4px solid #C9982F; border-bottom:4px solid #C9982F; }
@media (prefers-reduced-motion:reduce){ .mzh-confetti{ animation:none; } }
.ph-top-in{ position:relative; z-index:2; width:100%; }
.ph-top-in > *{ max-width:min(600px, 50vw); }
@media (max-width:820px){ .ph-top-in > *{ max-width:none; } }
.mzh-stagewrap .mzh-meta span{ background:rgba(255,255,255,.06) !important; border:1px solid rgba(242,194,107,.3) !important; color:#FFF3EC !important; }
.mzh-ticker{ background:linear-gradient(90deg,#8E1F30,#B8283E,#8E1F30) !important; }
.mzh-ticker .mzh-track span{ color:#FFE6B0 !important; -webkit-text-stroke:0 !important; }
.mzh-ticker .mzh-track i{ color:#F2C26B !important; }

/* ===========================================================================
   Целите страници на Творилница, Пътешественици и Мажоретки — в света на кадъра.
=========================================================================== */
/* Творилница — тъмната работилница */
[data-theme="tvorilnica"] main{ background:
  radial-gradient(40vw 30vw at 0% 12%, rgba(255,186,96,.16), transparent 60%),
  radial-gradient(40vw 30vw at 100% 30%, rgba(255,186,96,.12), transparent 60%),
  radial-gradient(40vw 30vw at 0% 70%, rgba(255,186,96,.10), transparent 60%),
  linear-gradient(180deg,#1B1511,#15100D 60%,#120D0A) !important; }
[data-theme="tvorilnica"] .tx-masa{ --floor-to:#1B1511; }
/* Пътешественици — кабинетът на изследователя */
[data-theme="patesh"] main{ background:
  radial-gradient(40vw 30vw at 100% 10%, rgba(255,186,96,.14), transparent 60%),
  radial-gradient(50vw 40vw at 0% 50%, rgba(40,80,180,.18), transparent 60%),
  linear-gradient(180deg,#120E0B,#0F1124 60%,#0C0F22) !important; }
[data-theme="patesh"] .tx-kartichki{ --floor-to:#120E0B; }
.pz-room::before{ opacity:.1; background:url('art/tx-karta.jpg') center top/cover no-repeat; -webkit-mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.5) 50%,transparent 95%); mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.5) 50%,transparent 95%); mix-blend-mode:luminosity; }
/* Мажоретки — цялата страница е сцената */
[data-theme="mazhoretki"] main, [data-theme="mazhoretki"] .mzh{ background:
  radial-gradient(40vw 30vw at 100% 20%, rgba(255,196,110,.14), transparent 60%),
  radial-gradient(40vw 40vw at 0% 60%, rgba(40,90,200,.18), transparent 60%),
  #0E1022 !important; }
/* текстът директно върху тъмния фон */
[data-theme="tvorilnica"] .tw-h, [data-theme="patesh"] .pz-h{ color:#FBF3E6; }
[data-theme="tvorilnica"] .tw-block > .ed-kicker, [data-theme="patesh"] .pz-block > .ed-kicker{ color:#F2C26B; }
[data-theme="tvorilnica"] .tw-intro p{ color:rgba(251,243,230,.82); }
[data-theme="tvorilnica"] .tw-motto{ color:#F2C26B !important; }
[data-theme="tvorilnica"] .tv-media .ed-kicker{ color:#F2C26B; }
[data-theme="tvorilnica"] .tv-media h2, [data-theme="tvorilnica"] .tv-media .ed-h2{ color:#FBF3E6; }
[data-theme="tvorilnica"] .tv-empty{ background:rgba(255,255,255,.04); border-color:rgba(242,194,107,.3); color:rgba(251,243,230,.6); }
[data-theme="patesh"] .pz-room p, [data-theme="patesh"] .pz-motto{ color:rgba(251,243,230,.82); }
[data-theme="patesh"] .pz-motto{ color:#F2C26B !important; }
[data-theme="patesh"] .pz-card h3{ color:#FBF3E6; }
[data-theme="patesh"] .pz-card p{ color:rgba(251,243,230,.8); }
[data-theme="patesh"] .pz-legend-cap{ color:rgba(251,243,230,.6); }
[data-theme="patesh"] .pz-compass text, [data-theme="patesh"] .pz-compass textPath{ fill:#F2C26B; }
[data-theme="patesh"] .pz-opts button{ color:#1E1A16; }

[data-theme="tvorilnica"] .ed-footer::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 46' preserveAspectRatio='none'%3E%3Cpath d='M0 0 C 240 40 480 40 720 22 C 960 4 1200 4 1440 34 L1440 0 Z' fill='%23120D0A'/%3E%3C/svg%3E"); }
[data-theme="patesh"] .ed-footer::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 46' preserveAspectRatio='none'%3E%3Cpath d='M0 0 C 240 40 480 40 720 22 C 960 4 1200 4 1440 34 L1440 0 Z' fill='%230C0F22'/%3E%3C/svg%3E"); }
[data-theme="mazhoretki"] .ed-footer::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 46' preserveAspectRatio='none'%3E%3Cpath d='M0 0 C 240 40 480 40 720 22 C 960 4 1200 4 1440 34 L1440 0 Z' fill='%230E1022'/%3E%3C/svg%3E"); }
/* мажоретки — конфетите и прожекторите продължават по цялата сцена */
.mzh-wrap:not(.mzh-stagewrap){ position:relative; isolation:isolate; }
.mzh-wrap:not(.mzh-stagewrap)::before{ content:""; position:absolute; z-index:-1; inset:-40px calc(50% - 50vw) 0; pointer-events:none; opacity:.8;
  background-image:
    radial-gradient(3px 7px at 6% 4%, #F2C26B, transparent), radial-gradient(5px 3px at 94% 8%, #E8384F, transparent),
    radial-gradient(3px 5px at 12% 30%, #4FB3FF, transparent), radial-gradient(5px 3px at 90% 34%, #F2C26B, transparent),
    radial-gradient(3px 6px at 4% 58%, #E8384F, transparent), radial-gradient(4px 4px at 96% 62%, #fff, transparent),
    radial-gradient(3px 6px at 8% 84%, #F2C26B, transparent), radial-gradient(5px 3px at 92% 90%, #4FB3FF, transparent),
    radial-gradient(30vw 24vw at 100% 0%, rgba(255,196,110,.12), transparent 60%); }
.mzh-card:not(.photo):not(.accent), .mzh-beat, .mzh-quiz, .mzh-board{ box-shadow:0 0 0 1px rgba(242,194,107,.25), 0 30px 60px -30px rgba(0,0,0,.8) !important; }
.mzh-card:not(.photo):not(.accent){ border-top:4px solid #C9982F; }

/* ===========================================================================
   „Рубрики и клубове“ — мозайка от кадрите на клубовете и тъмна сцена.
=========================================================================== */
body.rb-dark main{ background:radial-gradient(40vw 30vw at 0% 30%, rgba(255,186,96,.10), transparent 60%), radial-gradient(40vw 30vw at 100% 60%, rgba(40,90,200,.16), transparent 60%), #0D0F1E; }
.rb-hero{ position:relative; margin:0 calc(50% - 50vw); min-height:min(78vh,700px); display:flex; align-items:flex-end; overflow:hidden; background:#0D0F1E; }
.rb-mosaic{ position:absolute; inset:0; display:flex; gap:6px; }
.rb-mosaic span{ flex:1; position:relative; overflow:hidden; animation:rbUp 1.2s calc(var(--i)*.08s) cubic-bezier(.2,.8,.2,1) both; }
.rb-mosaic img{ transform:scale(1.04); }
.rb-mosaic img{ width:100%; height:100%; object-fit:cover; display:block; filter:saturate(.95); }
@keyframes rbUp{ from{ opacity:0; transform:translateY(40px); } to{ opacity:1; transform:none; } }
.rb-mosaic::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(13,15,30,.55) 0%, rgba(13,15,30,.25) 30%, rgba(13,15,30,.85) 75%, #0D0F1E 100%); }
.rb-hero-in{ position:relative; z-index:2; width:100%; padding-bottom:clamp(40px,6vw,70px); }
.rb-hero-in .ed-kicker{ color:#F2C26B; }
.rb-h1{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(50px,8vw,112px); line-height:.95; letter-spacing:-.03em; margin:14px 0 16px; color:#FBF3E6; }
.rb-h1 em{ font-style:italic; color:#F2C26B; }
.rb-hero-in p{ max-width:56ch; font-size:clamp(16px,1.8vw,20px); line-height:1.7; color:rgba(251,243,230,.82); margin:0; }
body.rb-dark .kb-lab{ color:rgba(251,243,230,.75); }
body.rb-dark .kb-np .kb-lab, body.rb-dark .kb-np .kb-lab b{ color:#FBF3E6; }
body.rb-dark .kb-seal{ box-shadow:0 0 0 3px #0D0F1E, 0 0 0 4.5px #F07A2E; }
body.rb-dark main .ed-h2{ color:#FBF3E6; }
/* редовете — като малки афиши с кадъра отляво */
body.rb-dark .ed-rubric-list{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; border:0; }
body.rb-dark .ed-rubric-row{ display:grid; grid-template-columns:120px minmax(0,1fr) auto; gap:18px; align-items:center; padding:12px 18px 12px 12px; border:0 !important; border-radius:18px;
  background:rgba(255,255,255,.04); box-shadow:inset 0 0 0 1px rgba(255,255,255,.07); transition:background .3s, transform .3s, box-shadow .3s; }
body.rb-dark .ed-rubric-row:hover{ background:rgba(255,255,255,.08); transform:translateY(-3px); box-shadow:inset 0 0 0 1px rgba(242,194,107,.35), 0 20px 40px -24px rgba(0,0,0,.8); }
.rr-photo{ display:block; width:120px; height:120px; border-radius:12px; overflow:hidden; }
.rr-photo img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .8s cubic-bezier(.2,.8,.3,1); }
.ed-rubric-row:hover .rr-photo img{ transform:scale(1.08); }
body.rb-dark .rr-t{ color:#FBF3E6; }
body.rb-dark .rr-d{ color:rgba(251,243,230,.7); }
body.rb-dark .rr-arrow{ color:#F2C26B; }
body.rb-dark main p, body.rb-dark main .ed-section > p{ color:rgba(251,243,230,.75); }
body.rb-dark .ed-footer::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 46' preserveAspectRatio='none'%3E%3Cpath d='M0 0 C 240 40 480 40 720 22 C 960 4 1200 4 1440 34 L1440 0 Z' fill='%230D0F1E'/%3E%3C/svg%3E"); }
@media (max-width:900px){ body.rb-dark .ed-rubric-list{ grid-template-columns:1fr; } body.rb-dark .ed-rubric-row{ grid-template-columns:88px minmax(0,1fr) auto; } .rr-photo{ width:88px; height:88px; } .rb-mosaic span:nth-child(n+5){ display:none; } }
@media (prefers-reduced-motion:reduce){ .rb-mosaic span{ animation:none; } }
body.rb-dark main::before, body.rb-dark main::after{ display:none !important; }

/* ===========================================================================
   Алекознайко — нощната библиотека от кадъра: светещата книга, крушката,
   хвърчащите въпросителни и бележки. Цялата страница е в нея.
=========================================================================== */
[data-theme="alekoznaiko"] main{ background:
  radial-gradient(40vw 30vw at 0% 20%, rgba(255,190,100,.14), transparent 60%),
  radial-gradient(40vw 30vw at 100% 45%, rgba(255,190,100,.10), transparent 60%),
  radial-gradient(50vw 40vw at 50% 80%, rgba(50,90,190,.18), transparent 65%),
  linear-gradient(180deg,#0E1428,#0B1022 60%,#0A0E1E) !important; }
[data-theme="alekoznaiko"] main::before{ display:none !important; }
.zk-cover{ position:relative; margin:0 calc(50% - 50vw); padding:clamp(100px,11vw,140px) clamp(18px,5vw,50px) clamp(50px,6vw,80px); overflow:hidden;
  background:radial-gradient(50% 70% at 0% 0%, rgba(255,190,100,.16), transparent 60%), #0E1428; color:#F6F0E4; }
.zk-cover-in{ position:relative; z-index:2; max-width:1180px; margin:0 auto; width:100%; }
.zk-cover-in .zk-hero{ max-width:min(720px, 58vw); }
.zk-cover .ed-kicker{ color:#F2C26B; }
.zk-cover .zk-name{ color:#FBF3E6; }
.zk-cover .zk-lead{ color:rgba(246,240,228,.82); }
.zk-cover .zk-me img{ filter:drop-shadow(0 20px 30px rgba(0,0,0,.6)) drop-shadow(0 0 40px rgba(255,200,120,.25)); }
/* балонът с факта — като светеща бележка от книгата */
.zk-cover .zk-bubble{ background:#FFF6DF !important; box-shadow:0 0 0 1px rgba(255,214,140,.5), 0 0 50px -10px rgba(255,200,120,.55), 0 24px 40px -20px rgba(0,0,0,.7) !important; }
/* хвърчащите въпросителни */
.zk-q{ position:absolute; inset:0; z-index:1; pointer-events:none; }
.zk-q i{ position:absolute; font-style:normal; font-family:'Fraunces',serif; color:#FFE3A6; text-shadow:0 0 14px rgba(255,200,120,.9); opacity:.0; animation:zkQ 9s ease-in-out infinite; }
.zk-q i:nth-child(1){ left:44%; top:70%; font-size:28px; animation-delay:0s; }
.zk-q i:nth-child(2){ left:52%; top:76%; font-size:18px; animation-delay:1.5s; }
.zk-q i:nth-child(3){ left:40%; top:60%; font-size:22px; animation-delay:3s; }
.zk-q i:nth-child(4){ left:6%; top:80%; font-size:20px; animation-delay:4.5s; }
.zk-q i:nth-child(5){ left:30%; top:22%; font-size:16px; animation-delay:6s; }
.zk-q i:nth-child(6){ left:56%; top:30%; font-size:24px; animation-delay:7.5s; }
@keyframes zkQ{ 0%{ opacity:0; transform:translateY(20px) rotate(-8deg); } 20%{ opacity:.85; } 70%{ opacity:.6; } 100%{ opacity:0; transform:translateY(-90px) rotate(10deg); } }
.tx-biblioteka{ background-image:url('art/tx-biblioteka.jpg'); --floor-from:#0E1428; --floor-to:#0E1428; }
/* вътре — заглавията светли, топлите лампи над разделите */
.zk-room{ position:relative; isolation:isolate; }
.zk-room::before{ content:""; position:absolute; inset:0 calc(50% - 50vw); z-index:-1; pointer-events:none;
  background:radial-gradient(14px 14px at 8% 6%, rgba(255,214,150,.6), transparent 70%), radial-gradient(10px 10px at 92% 14%, rgba(255,214,150,.5), transparent 70%),
    radial-gradient(20px 20px at 96% 48%, rgba(255,214,150,.3), transparent 70%), radial-gradient(12px 12px at 4% 70%, rgba(255,214,150,.4), transparent 70%); }
[data-theme="alekoznaiko"] .zk-h{ color:#FBF3E6; }
[data-theme="alekoznaiko"] .zk-block > .ed-kicker{ color:#F2C26B; }
[data-theme="alekoznaiko"] .zk-hint{ color:rgba(246,240,228,.6); }
[data-theme="alekoznaiko"] .ed-footer::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 46' preserveAspectRatio='none'%3E%3Cpath d='M0 0 C 240 40 480 40 720 22 C 960 4 1200 4 1440 34 L1440 0 Z' fill='%230A0E1E'/%3E%3C/svg%3E"); }
@media (max-width:820px){ .zk-cover{ padding-top:0; } .zk-cover-in .zk-hero{ max-width:none; } }
@media (prefers-reduced-motion:reduce){ .zk-q i{ animation:none; opacity:.5; } }
.zk-cover-in .zk-hero{ margin-left:0 !important; margin-right:auto !important; max-width:min(680px, 52vw); }
.zk-q i:nth-child(1){ left:66%; top:70%; } .zk-q i:nth-child(2){ left:74%; top:78%; } .zk-q i:nth-child(3){ left:62%; top:58%; }
.zk-q i:nth-child(4){ left:90%; top:66%; } .zk-q i:nth-child(5){ left:70%; top:24%; } .zk-q i:nth-child(6){ left:84%; top:36%; }
.zk-cover .zk-me img{ border-radius:16px; }
@media (max-width:820px){ .zk-cover-in .zk-hero{ max-width:none; } .zk-q{ display:none; } }

/* Начална страница — клубовете на тъмна сцена на цяла ширина (като „Рубрики“) */
.home-stage{ position:relative; isolation:isolate; padding-top:clamp(90px,10vw,130px) !important; padding-bottom:clamp(70px,8vw,110px) !important; }
.home-stage::before{ content:""; position:absolute; z-index:-1; top:0; bottom:0; left:calc(50% - 50vw); right:calc(50% - 50vw); pointer-events:none;
  background:
    radial-gradient(40vw 30vw at 0% 30%, rgba(255,186,96,.12), transparent 60%),
    radial-gradient(40vw 30vw at 100% 70%, rgba(40,90,200,.18), transparent 60%),
    radial-gradient(12px 12px at 6% 18%, rgba(255,214,150,.55), transparent 70%),
    radial-gradient(18px 18px at 95% 24%, rgba(255,214,150,.35), transparent 70%),
    #0D0F1E; }
.home-stage .ed-kicker{ color:#F2C26B !important; }
.home-stage .ed-h2{ color:#FBF3E6 !important; }
.home-stage .ed-news-head a{ color:#FBF3E6 !important; border-color:#F2C26B !important; }
.home-stage .kb-lab{ color:rgba(251,243,230,.75); }
.home-stage .kb-np .kb-lab, .home-stage .kb-np .kb-lab b{ color:#FBF3E6; }
.home-stage .kb-seal{ box-shadow:0 0 0 3px #0D0F1E, 0 0 0 4.5px #F07A2E; }
.home-stage + *{ margin-top:0; }
body:has(.home-stage) .ed-footer::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 46' preserveAspectRatio='none'%3E%3Cpath d='M0 0 C 240 40 480 40 720 22 C 960 4 1200 4 1440 34 L1440 0 Z' fill='%230D0F1E'/%3E%3C/svg%3E"); }
.home-stage::after{ content:""; position:absolute; z-index:-1; top:-1px; left:calc(50% - 50vw); right:calc(50% - 50vw); height:46px; pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 46' preserveAspectRatio='none'%3E%3Cpath d='M0 0 C 240 40 480 40 720 22 C 960 4 1200 4 1440 34 L1440 0 Z' fill='%23F4EEE3'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat; }

/* ===========================================================================
   Начална — „Разгледай“: шест врати към училището с реалистичните кадри.
=========================================================================== */
.rz-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-auto-rows:clamp(190px,17vw,240px); gap:14px; margin-top:clamp(24px,3vw,36px); }
.rz-card{ position:relative; overflow:hidden; border-radius:20px; text-decoration:none; color:#fff; isolation:isolate; background:#2A231D;
  box-shadow:0 24px 44px -30px rgba(60,35,20,.65); transition:transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s; }
.rz-card.big{ grid-column:span 2; grid-row:span 2; }
.rz-card.wide{ grid-column:span 2; }
.rz-card img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; transition:transform 1.1s cubic-bezier(.2,.8,.2,1); }
.rz-card::after{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(20,14,10,0) 35%, rgba(20,14,10,.78) 100%); transition:opacity .4s; }
.rz-card:hover{ transform:translateY(-4px); box-shadow:0 30px 60px -30px rgba(60,35,20,.85); }
.rz-card:hover img{ transform:scale(1.06); }
.rz-card:focus-visible{ outline:3px solid var(--clay,#A24C36); outline-offset:4px; }
.rz-n{ position:absolute; top:16px; right:18px; font-family:'Fraunces',serif; font-style:italic; font-size:18px; color:rgba(255,255,255,.85); text-shadow:0 2px 10px rgba(0,0,0,.5); }
.rz-txt{ position:absolute; left:20px; right:20px; bottom:18px; display:flex; flex-direction:column; gap:5px; }
.rz-txt b{ font-family:'Fraunces',serif; font-weight:500; font-size:clamp(22px,2.2vw,28px); line-height:1.1; text-shadow:0 2px 16px rgba(0,0,0,.5); }
.rz-card.big .rz-txt b{ font-size:clamp(32px,3.4vw,46px); }
.rz-txt span{ font-size:14.5px; line-height:1.5; color:rgba(255,255,255,.86); max-width:44ch; }
.rz-txt em{ font-style:normal; font-size:13.5px; font-weight:800; color:#FFD58A; margin-top:2px; opacity:0; transform:translateY(6px); transition:opacity .3s, transform .3s; }
.rz-card:hover .rz-txt em, .rz-card.big .rz-txt em{ opacity:1; transform:none; }
@media (max-width:900px){ .rz-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:200px; } .rz-card.big{ grid-row:span 2; } .rz-card.wide{ grid-column:span 2; } }
@media (max-width:560px){ .rz-grid{ grid-template-columns:1fr; grid-auto-rows:210px; } .rz-card.big, .rz-card.wide{ grid-column:auto; grid-row:auto; } .rz-card.big{ grid-row:span 1; height:auto; } .rz-txt em{ opacity:1; transform:none; } }

/* ===========================================================================
   Широк фото-кавър за информационните страници (.pw-hero) — първо „Прием“.
   Кадърът е на цяла ширина, текстът вляво върху мек преход; надолу страницата
   остава светла, за да се четат сроковете и документите спокойно.
=========================================================================== */
.pw-hero{ position:relative; margin:0 calc(50% - 50vw); min-height:min(86vh, 760px); display:flex; align-items:flex-end; overflow:hidden; background:#2A1C12; color:#FFF7EC; }
.pw-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:60% 55%; animation:pcIn 1.6s cubic-bezier(.2,.8,.2,1) both; }
.pw-hero::before{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg, rgba(30,18,10,.88) 0%, rgba(30,18,10,.55) 42%, rgba(30,18,10,0) 70%), linear-gradient(180deg, rgba(30,18,10,.45) 0%, transparent 25%, transparent 70%, rgba(30,18,10,.55) 100%); }
.pw-hero::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:46px; z-index:2;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 46' preserveAspectRatio='none'%3E%3Cpath d='M0 46 C 240 6 480 6 720 24 C 960 42 1200 42 1440 12 L1440 46 Z' fill='%23F4EEE3'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat; }
.pw-in{ position:relative; z-index:3; width:100%; padding-top:clamp(110px,12vw,150px); padding-bottom:clamp(80px,9vw,120px); }
.pw-in > *{ max-width:min(620px, 56vw); }
.pw-in .ed-kicker{ color:#FFC879; }
.pw-h1{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(42px,6.4vw,90px); line-height:1; letter-spacing:-.025em; margin:14px 0 16px; color:#FFF7EC; text-shadow:0 4px 30px rgba(0,0,0,.4); }
.pw-h1 em{ display:block; font-style:italic; color:#FFC879; }
.pw-in p{ font-size:clamp(16px,1.8vw,20px); line-height:1.7; color:rgba(255,247,236,.86); margin:0; }
@media (max-width:820px){ .pw-in > *{ max-width:none; } .pw-hero::before{ background:linear-gradient(180deg, rgba(30,18,10,.3), rgba(30,18,10,.85) 70%); } .pw-img{ object-position:62% 50%; } }
/* „Разгледай“ — пак като въртяща се лента, но с кадрите (спира при посочване) */
.rz-belt .ed-prog-track{ gap:18px; animation-duration:56s; }
.rz-belt .rz-card{ flex:0 0 clamp(280px,30vw,400px); height:clamp(240px,24vw,300px); }
.rz-belt .rz-txt em{ opacity:1; transform:none; }
@media (max-width:640px){ .rz-belt .rz-card{ flex-basis:80vw; height:230px; } }

/* ===========================================================================
   Начална — „Последно от училищния живот“ влиза в тъмната сцена заедно с
   клубовете: вълната е само веднъж (над новините), двата раздела са едно цяло.
=========================================================================== */
.home-stage.hs-news{ padding-bottom:clamp(40px,5vw,70px) !important; }
.hs-news ~ .home-stage::after{ display:none; }
.hs-news ~ .home-stage{ padding-top:clamp(40px,5vw,70px) !important; }
.hs-news ~ .home-stage::before{ background:
    radial-gradient(40vw 30vw at 100% 60%, rgba(40,90,200,.18), transparent 60%),
    radial-gradient(14px 14px at 4% 30%, rgba(255,214,150,.45), transparent 70%),
    #0D0F1E; }
.hs-news .ed-news-head p{ color:rgba(251,243,230,.72); }
/* водещата новина — като кадър на голям екран */
.hs-news .vs-ph{ box-shadow:0 40px 80px -40px rgba(0,0,0,.9), 0 0 0 1px rgba(255,255,255,.06); }
.hs-news .vs-lt small, .hs-news .vs-rt small{ color:#F2C26B; }
.hs-news .vs-lt b{ color:#FBF3E6; }
.hs-news .vs-lt > span{ color:rgba(251,243,230,.78); }
.hs-news .vs-lt em{ color:#FBF3E6; }
.hs-news .vs-lead:hover .vs-lt em{ color:#F2C26B; }
/* колоната — като светещи картички */
.hs-news .vs-side{ border-top:0; gap:10px; }
.hs-news .vs-row, .hs-news .vs-vid{ padding:14px; border:0; border-radius:16px; background:rgba(255,255,255,.04); box-shadow:inset 0 0 0 1px rgba(255,255,255,.07); transition:background .3s, transform .3s; }
.hs-news .vs-row:hover, .hs-news .vs-vid:hover{ background:rgba(255,255,255,.08); transform:translateX(4px); }
.hs-news .vs-rt b{ color:#FBF3E6; }
.hs-news .vs-row:hover .vs-rt b, .hs-news .vs-vid:hover .vs-rt b{ color:#F2C26B; }
.hs-news .vs-rt > span{ color:rgba(251,243,230,.7); }
.hs-news .vs-all{ color:#FBF3E6; border-color:#F2C26B; }
.hs-news .vs-date{ box-shadow:0 10px 20px -10px rgba(0,0,0,.8); }

/* Менюто — фин фон от кадъра на раздела (виж края на script-editorial.js) */
.ed-ov-bg{ position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden;
  -webkit-mask-image:linear-gradient(160deg, rgba(0,0,0,.75) 0%, #000 60%); mask-image:linear-gradient(160deg, rgba(0,0,0,.75) 0%, #000 60%); border-radius:inherit; }
.ed-ov-bg img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1.04); filter:saturate(.85) sepia(.12);
  transition:opacity 1s ease, transform 6s ease; }
.ed-ov-bg img.on{ opacity:.42; transform:scale(1); }
.ed-overlay > *:not(.ed-ov-bg){ position:relative; z-index:1; }
@media (prefers-reduced-motion:reduce){ .ed-ov-bg img{ transition:opacity .3s; transform:none; } }
/* лек кремав воал зад надписите, за да се четат и при по-видимия кадър */
.ed-ov-bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(251,248,241,.55) 0%, rgba(251,248,241,.2) 60%, rgba(251,248,241,0) 100%); }
.ed-ov-item:not(.active):not(:hover){ text-shadow:0 1px 10px rgba(251,248,241,.9); }
/* статиите (новини и проекти) — кавърът е истинската снимка от събитието */
.pw-news .pw-img{ object-position:50% 45%; }
.pw-h1-news{ font-size:clamp(36px,5vw,68px); line-height:1.05; }
.pw-news::before{ background:linear-gradient(90deg, rgba(20,14,10,.9) 0%, rgba(20,14,10,.6) 45%, rgba(20,14,10,.1) 75%), linear-gradient(180deg, rgba(20,14,10,.45) 0%, transparent 25%, transparent 70%, rgba(20,14,10,.55) 100%); }
.pw-h1-news em{ display:inline; font-style:italic; color:#FFC879; }

/* ===========================================================================
   ЧАТЪТ С АЛЕКОЗНАЙКО — в нощната му библиотека (като страницата му):
   бутон с топъл ореол и въпросителни, покана „Здравей!“, тъмен прозорец с
   библиотеката в заглавието, бележки-съобщения и златни бутони.
=========================================================================== */
.ed-chat-fab{ width:74px !important; height:74px !important; overflow:visible !important; border:3px solid #FFE3A6 !important;
  background:radial-gradient(circle at 50% 35%, #2A3566, #0E1428) !important;
  box-shadow:0 0 0 6px rgba(255,200,120,.16), 0 0 36px rgba(255,200,120,.45), 0 18px 34px -12px rgba(0,0,0,.6) !important; }
.ed-chat-fab img{ border-radius:50%; }
.ed-chat-fab::after{ border-color:rgba(255,214,140,.7) !important; }
.ed-chat-fab:hover{ box-shadow:0 0 0 8px rgba(255,200,120,.22), 0 0 50px rgba(255,200,120,.6), 0 22px 40px -12px rgba(0,0,0,.6) !important; }
.ed-chat-ping{ background:#5BD18A !important; border-color:#0E1428 !important; }
.ed-chat-qs{ position:absolute; inset:-14px; pointer-events:none; }
.ed-chat-qs i{ position:absolute; font-style:normal; font-family:'Fraunces',serif; font-size:16px; color:#FFE3A6; text-shadow:0 0 10px rgba(255,200,120,.9); opacity:0; animation:zkFabQ 5s ease-in-out infinite; }
.ed-chat-qs i:nth-child(1){ left:-4px; top:20px; } .ed-chat-qs i:nth-child(2){ left:30px; top:-10px; animation-delay:1.6s; font-size:13px; } .ed-chat-qs i:nth-child(3){ right:-6px; top:16px; animation-delay:3.2s; }
@keyframes zkFabQ{ 0%{ opacity:0; transform:translateY(8px) rotate(-10deg); } 25%{ opacity:.9; } 70%{ opacity:.5; } 100%{ opacity:0; transform:translateY(-22px) rotate(12deg); } }
/* поканата */
.ed-chat-tip{ position:absolute; right:88px; bottom:14px; width:max-content; max-width:230px; text-align:left; border:0; cursor:pointer;
  padding:12px 16px; border-radius:16px 16px 4px 16px; background:#FFF6DF; color:#2A2015; font:600 14px/1.45 'Manrope',sans-serif;
  box-shadow:0 0 0 1px rgba(255,214,140,.6), 0 0 40px -6px rgba(255,200,120,.6), 0 18px 34px -16px rgba(0,0,0,.5);
  opacity:0; transform:translateX(12px) scale(.96); pointer-events:none; transition:opacity .4s, transform .5s cubic-bezier(.2,.8,.2,1); }
.ed-chat-tip b{ display:block; font-family:'Fraunces',serif; font-weight:500; font-size:17px; color:#8A5A10; }
.ed-chat-tip.on{ opacity:1; transform:none; pointer-events:auto; }
/* прозорецът */
.ed-chat-panel{ width:380px !important; height:560px !important; max-height:calc(100vh - 40px) !important; border-radius:24px !important; overflow:hidden;
  background:#0E1428 !important; border:1px solid rgba(255,214,140,.25) !important;
  box-shadow:0 0 0 1px rgba(255,255,255,.04), 0 0 60px -10px rgba(255,190,100,.35), 0 40px 90px -30px rgba(0,0,0,.8) !important; }
.ed-chat-header{ position:relative; isolation:isolate; padding:20px 16px 18px 18px !important; min-height:92px;
  background:linear-gradient(180deg, rgba(14,20,40,.25), rgba(14,20,40,.9)), url('art/chat-fon.jpg') center 40%/cover !important; }
.ed-chat-header::after{ content:"?   ?    ?"; position:absolute; right:56px; top:12px; font-family:'Fraunces',serif; font-size:15px; letter-spacing:.3em; color:#FFE3A6; text-shadow:0 0 10px rgba(255,200,120,.9); opacity:.7; pointer-events:none; }
.ed-chat-header img{ width:52px !important; height:52px !important; border:2px solid #FFE3A6 !important; box-shadow:0 0 20px rgba(255,200,120,.5); background:#2A3566; }
.ed-chat-header .ch-name{ font-family:'Fraunces',serif; font-size:21px !important; color:#FFF6DF; }
.ed-chat-header .ch-status{ color:rgba(255,246,223,.75) !important; }
.ed-chat-header .ch-status .dot{ background:#5BD18A !important; box-shadow:0 0 0 3px rgba(91,209,138,.25), 0 0 10px #5BD18A !important; }
.ed-chat-close{ background:rgba(255,255,255,.12) !important; }
.ed-chat-body{ background:radial-gradient(80% 50% at 50% 0%, rgba(255,190,100,.10), transparent 70%), #0E1428 !important; }
.ed-chat-body::-webkit-scrollbar{ width:6px; } .ed-chat-body::-webkit-scrollbar-thumb{ background:rgba(255,214,140,.25); border-radius:3px; }
.ed-chat-msg{ font-size:14px !important; }
.ed-chat-msg.bot{ background:#FFF6DF !important; color:#2A2015 !important; border:0 !important; box-shadow:0 0 24px -8px rgba(255,200,120,.45) !important; }
.ed-chat-msg.user{ background:linear-gradient(135deg,#F2C26B,#D9952E) !important; color:#1E1408 !important; font-weight:600; box-shadow:0 8px 20px -10px rgba(242,194,107,.6) !important; }
.ed-chat-msg.typing{ background:rgba(255,246,223,.12) !important; }
.ed-chat-msg.typing .td{ background:#FFE3A6 !important; }
.ed-chat-quick{ background:#0E1428 !important; }
.ed-chat-quick .qc{ background:rgba(255,255,255,.05) !important; color:#FFE3A6 !important; border:1px solid rgba(255,214,140,.35) !important; }
.ed-chat-quick .qc:hover{ background:#F2C26B !important; color:#1E1408 !important; box-shadow:0 0 20px rgba(242,194,107,.5) !important; }
.ed-chat-input{ background:#0B1022 !important; border-top:1px solid rgba(255,255,255,.08) !important; }
.ed-chat-input input{ background:rgba(255,255,255,.06) !important; border:1px solid rgba(255,214,140,.25) !important; color:#FFF6DF !important; }
.ed-chat-input input::placeholder{ color:rgba(255,246,223,.45); }
.ed-chat-input input:focus{ border-color:#F2C26B !important; box-shadow:0 0 0 3px rgba(242,194,107,.2) !important; }
.ed-chat-input button{ background:linear-gradient(135deg,#F2C26B,#D9952E) !important; color:#1E1408 !important; }
@media (max-width:520px){ .ed-chat-panel{ width:calc(100vw - 24px) !important; height:calc(100vh - 100px) !important; } .ed-chat-tip{ right:84px; max-width:190px; font-size:13px; } }
@media (prefers-reduced-motion:reduce){ .ed-chat-qs i{ animation:none; } }

/* ===========================================================================
   Клуб „Религия“ (religia.html) — светъл, топъл и спокоен: слънчевата класна
   стая от кадъра, пастелите от детските рисунки (небесно синьо, тревно зелено,
   златните куполи), шарените яйца. Без игри.
=========================================================================== */
[data-theme="religia"]{ --brick:#B07A2A; --brick-deep:#7A5418; --brick-bg:#FBF0DA; --rl-gold:#C9963A; --rl-sky:#8DB8DA; --rl-green:#7EAE5C; --rl-red:#C8503E; --rl-paper:#FFFBF2; }
[data-theme="religia"] main{ background:radial-gradient(50vw 40vw at 100% 0%, rgba(255,214,140,.22), transparent 60%), radial-gradient(40vw 30vw at 0% 60%, rgba(141,184,218,.16), transparent 60%), #FBF6EC; }
/* светлият кавър: воалът е кремав, текстът тъмен */
.pw-light{ background:#F6EEDC; color:#2E2416; }
.pw-light::before{ background:linear-gradient(90deg, rgba(251,246,236,.97) 0%, rgba(251,246,236,.86) 34%, rgba(251,246,236,.25) 62%, rgba(251,246,236,0) 78%), linear-gradient(180deg, rgba(251,246,236,.5) 0%, transparent 22%) !important; }
.pw-light::after{ background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 46' preserveAspectRatio='none'%3E%3Cpath d='M0 46 C 240 6 480 6 720 24 C 960 42 1200 42 1440 12 L1440 46 Z' fill='%23FBF6EC'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat !important; }
.pw-light .ed-kicker{ color:var(--rl-gold) !important; }
.pw-light .pw-h1{ color:#2E2416 !important; text-shadow:none !important; }
.pw-light .pw-h1 em{ color:var(--rl-gold) !important; }
.pw-light .pw-in p{ color:#5A4A34 !important; }
.rl-open{ padding-bottom:20px !important; }
.rl-intro{ display:grid; grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr); gap:clamp(28px,5vw,64px); align-items:start; }
.rl-h{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(30px,4vw,48px); line-height:1.1; color:#2E2416; margin:8px 0 14px; }
.rl-lead{ font-size:clamp(17px,1.9vw,20px); line-height:1.8; color:#5A4A34; max-width:54ch; margin:0; }
/* програмката — светъл пергамент със златна рамка */
.rl-prog{ position:relative; background:var(--rl-paper); padding:26px 26px 22px; border-radius:6px; box-shadow:inset 0 0 0 1px #E8D6AE, inset 0 0 0 6px var(--rl-paper), inset 0 0 0 7px rgba(201,150,58,.55), 0 24px 44px -30px rgba(120,80,20,.5); }
.rl-prog-h{ display:block; font-family:'Fraunces',serif; font-style:italic; font-size:26px; color:var(--rl-gold); margin-bottom:8px; }
.rl-prog dl{ margin:0; } .rl-prog dl div{ display:grid; grid-template-columns:96px minmax(0,1fr); gap:12px; padding:10px 0; border-top:1px dashed #E2CFA6; }
.rl-prog dt{ font-weight:700; font-size:14px; color:#8A7350; } .rl-prog dd{ margin:0; font-size:15.5px; color:#2E2416; }
[data-skel="hide"] .rl-prog .sk-t::after{ font-size:15.5px; font-style:italic; }
/* четирите карти — с цветовете от детските рисунки */
.rl-cards{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-top:clamp(34px,4vw,50px); }
.rl-card{ position:relative; padding:24px 22px 26px; border-radius:22px; background:#fff; box-shadow:0 1px 0 #EADBBF, 0 24px 40px -32px rgba(120,80,20,.55); overflow:hidden; }
.rl-card::before{ content:""; position:absolute; left:0; right:0; top:0; height:6px; background:var(--c,var(--rl-gold)); }
.rl-card:nth-child(1){ --c:var(--rl-sky); } .rl-card:nth-child(2){ --c:var(--rl-red); } .rl-card:nth-child(3){ --c:var(--rl-green); } .rl-card:nth-child(4){ --c:var(--rl-gold); }
.rl-n{ font-family:'Fraunces',serif; font-style:italic; font-size:15px; color:var(--c); }
.rl-card b{ display:block; font-family:'Fraunces',serif; font-weight:500; font-size:25px; color:#2E2416; margin:6px 0 6px; }
.rl-card p{ margin:0; font-size:15px; line-height:1.65; color:#5A4A34; }
/* мисълта */
.rl-quote-sec{ margin-top:clamp(50px,6vw,80px); padding:clamp(48px,6vw,80px) 0; background:linear-gradient(180deg, rgba(141,184,218,.18), rgba(255,214,140,.16)); }
.rl-quote{ margin:0 auto; max-width:820px; text-align:center; }
.rl-quote blockquote{ margin:0; }
.rl-quote p{ font-family:'Fraunces',serif; font-style:italic; font-weight:400; font-size:clamp(24px,3.2vw,38px); line-height:1.4; color:#2E2416; margin:0; }
.rl-quote p::first-letter{ font-size:1.6em; color:var(--rl-gold); }
.rl-quote figcaption{ margin-top:16px; font-size:14px; font-weight:800; letter-spacing:.08em; color:var(--rl-gold); }
.rl-quote::before{ content:""; display:block; width:120px; height:2px; margin:0 auto 26px; background:linear-gradient(90deg, transparent, var(--rl-gold), transparent); }
/* празниците — лента с цветни върхове като шарени яйца */
.rl-feasts{ list-style:none; margin:clamp(20px,3vw,32px) 0 0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.rl-f{ position:relative; padding:22px 22px 24px 74px; border-radius:20px; background:#fff; box-shadow:0 1px 0 #EADBBF, 0 20px 36px -30px rgba(120,80,20,.5); }
.rl-f::before{ content:""; position:absolute; left:22px; top:24px; width:34px; height:44px; border-radius:50% 50% 48% 48% / 60% 60% 40% 40%;
  background:repeating-linear-gradient(0deg, var(--e1) 0 7px, #fff 7px 10px, var(--e2) 10px 16px, #fff 16px 19px); box-shadow:inset -4px -4px 8px rgba(0,0,0,.12); }
.rl-f:nth-child(1){ --e1:var(--rl-red); --e2:var(--rl-gold); } .rl-f:nth-child(2){ --e1:var(--rl-sky); --e2:#fff; } .rl-f:nth-child(3){ --e1:var(--rl-green); --e2:var(--rl-gold); }
.rl-f:nth-child(4){ --e1:var(--rl-red); --e2:var(--rl-green); } .rl-f:nth-child(5){ --e1:var(--rl-gold); --e2:var(--rl-sky); } .rl-f:nth-child(6){ --e1:var(--rl-sky); --e2:var(--rl-red); }
.rl-when{ font-size:13px; font-weight:800; color:var(--rl-gold); }
.rl-f b{ display:block; font-family:'Fraunces',serif; font-weight:500; font-size:22px; color:#2E2416; margin:4px 0 4px; }
.rl-f p{ margin:0; font-size:15px; line-height:1.6; color:#5A4A34; }
@media (max-width:900px){ .rl-intro{ grid-template-columns:1fr; } .rl-cards{ grid-template-columns:repeat(2,minmax(0,1fr)); } .rl-feasts{ grid-template-columns:1fr; }
  .pw-light::before{ background:linear-gradient(180deg, rgba(251,246,236,.2), rgba(251,246,236,.96) 62%) !important; } }
@media (max-width:520px){ .rl-cards{ grid-template-columns:1fr; } }

/* ===========================================================================
   Клуб „Религия“ — ДЕТСКАТА КНИЖКА (rlb-). Акварелна хартия, пастелни щрихи,
   разтворена книга за заглавие, „Съдържание“, „Кръгът на годината“ и бележка
   в тетрадка. Светло, топло и спокойно — без игри.
=========================================================================== */
[data-theme="religia"] main{ background:
  radial-gradient(40vw 30vw at 8% 12%, rgba(141,184,218,.20), transparent 60%),
  radial-gradient(36vw 28vw at 92% 30%, rgba(242,213,138,.26), transparent 60%),
  radial-gradient(40vw 30vw at 20% 80%, rgba(126,174,92,.14), transparent 60%),
  #FBF6EC !important; }
/* разтворената книга */
.rlb-hero{ padding:clamp(100px,11vw,140px) clamp(16px,4vw,40px) clamp(40px,5vw,70px); }
.rlb-book{ position:relative; max-width:1180px; margin:0 auto; display:grid; grid-template-columns:1fr 1.15fr; background:#FFFDF7; border-radius:10px;
  box-shadow:0 2px 0 #EEE2C8, 0 4px 0 #F6EDDA, 0 6px 0 #EEE2C8, 0 50px 80px -40px rgba(110,80,30,.55); }
.rlb-book::before{ content:""; position:absolute; left:46.5%; top:0; bottom:0; width:60px; margin-left:-30px; pointer-events:none;
  background:linear-gradient(90deg, transparent, rgba(110,80,30,.12) 45%, rgba(110,80,30,.18) 50%, rgba(110,80,30,.12) 55%, transparent); }
.rlb-page{ position:relative; padding:clamp(28px,4vw,56px); }
.rlb-kick{ font-size:12.5px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:#C9963A; }
.rlb-h1{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(54px,7vw,100px); line-height:1; color:#2E2416; margin:18px 0 4px; letter-spacing:-.02em; }
.rlb-cap{ display:inline-block; font-style:italic; color:#C8503E; font-size:1.25em; line-height:.8; margin-right:2px; text-shadow:3px 3px 0 rgba(242,213,138,.8); }
.rlb-stroke{ width:min(300px,80%); height:20px; display:block; margin:6px 0 18px; }
.rlb-stroke path, .rlb-ic svg *, .rlb-heart svg *{ fill:none; stroke-width:5; stroke-linecap:round; stroke-linejoin:round; filter:url(#rlCrayon); }
.rlb-sub{ font-family:'Fraunces',serif; font-style:italic; font-size:clamp(19px,2vw,24px); line-height:1.5; color:#5A4A34; margin:0; max-width:24ch; }
/* разделителят-панделка със заниманията */
.rlb-bookmark{ position:relative; margin-top:clamp(28px,3.5vw,44px); padding:16px 18px 16px 22px; background:#FFF6DF; border-left:6px solid #C8503E; border-radius:0 10px 10px 0; max-width:340px; display:grid; gap:7px; box-shadow:0 14px 24px -20px rgba(110,80,30,.6); }
.rlb-bookmark::after{ content:""; position:absolute; left:-6px; bottom:-18px; border:9px solid #C8503E; border-bottom-color:transparent; border-right-width:0; border-left-width:6px; }
.rlb-bookmark b{ font-family:'Fraunces',serif; font-style:italic; font-weight:500; font-size:20px; color:#C8503E; }
.rlb-bookmark span{ display:grid; grid-template-columns:78px 1fr; gap:10px; font-size:14.5px; }
.rlb-bookmark i{ font-style:normal; font-weight:700; color:#8A7350; } .rlb-bookmark em{ font-style:normal; color:#2E2416; }
[data-skel="hide"] .rlb-bookmark .sk-t::after{ font-size:14.5px; font-style:italic; }
.rlb-right{ padding:clamp(20px,2.4vw,34px); }
.rlb-pic{ margin:0; height:100%; min-height:360px; background:#fff; padding:10px; border-radius:4px; box-shadow:0 0 0 1px #EEE2C8; transform:rotate(.6deg); }
.rlb-pic img{ width:100%; height:100%; object-fit:cover; display:block; border-radius:2px; animation:pcIn 1.4s cubic-bezier(.2,.8,.2,1) both; }
.rlb-pnum{ position:absolute; right:clamp(28px,3vw,40px); bottom:10px; font-family:'Fraunces',serif; font-style:italic; font-size:13px; color:#B8A27A; }
/* съдържанието */
.rlb-toc-sec{ padding-top:clamp(30px,4vw,50px) !important; }
.rlb-toc{ max-width:900px; margin:0 auto; }
.rlb-h{ font-family:'Fraunces',serif; font-weight:400; font-size:clamp(32px,4vw,50px); color:#2E2416; margin:0 0 18px; }
.rlb-toc .rlb-h{ text-align:center; font-style:italic; }
.rlb-toc ol{ list-style:none; margin:0; padding:0; counter-reset:t; }
.rlb-toc li{ display:grid; grid-template-columns:56px auto 1fr; grid-template-rows:auto auto; column-gap:16px; align-items:center; padding:16px 0; border-bottom:1px dashed #E2CFA6; counter-increment:t; }
.rlb-ic{ grid-row:span 2; width:52px; height:52px; display:grid; place-items:center; border-radius:50%; background:color-mix(in srgb,var(--c) 18%,#fff); }
.rlb-ic svg{ width:34px; height:34px; } .rlb-ic svg *{ stroke:var(--c); stroke-width:3.4; }
.rlb-toc b{ font-family:'Fraunces',serif; font-weight:500; font-size:26px; color:#2E2416; }
.rlb-toc i{ align-self:end; margin-bottom:9px; border-bottom:2px dotted #D9C49A; min-width:40px; }
.rlb-toc i::after{ content:"глава " counter(t); float:right; transform:translateY(12px); font-family:'Fraunces',serif; font-style:italic; font-size:14px; color:#B8A27A; background:#FBF6EC; padding-left:8px; }
.rlb-toc em{ grid-column:2 / 4; font-style:normal; font-size:15.5px; line-height:1.6; color:#5A4A34; }
/* кръгът на годината */
.rlb-year{ padding:clamp(50px,6vw,90px) 0; background:linear-gradient(180deg, rgba(141,184,218,.16), rgba(242,213,138,.18)); }
.rlb-year-in{ display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,440px); gap:clamp(30px,5vw,70px); align-items:center; }
.rlb-year-txt > p{ font-size:17px; line-height:1.75; color:#5A4A34; max-width:48ch; margin:0 0 20px; }
.rlb-legend{ list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.rlb-legend li{ position:relative; padding:10px 14px 10px 46px; border-radius:14px; background:rgba(255,255,255,.7); font-size:14.5px; color:#5A4A34; line-height:1.5; }
.rlb-legend li::before{ content:""; position:absolute; left:14px; top:12px; width:20px; height:26px; border-radius:50% 50% 48% 48% / 60% 60% 40% 40%; background:repeating-linear-gradient(0deg, var(--e) 0 6px, #fff 6px 8px); }
.rlb-legend b{ display:block; color:#2E2416; font-weight:700; }
.rlb-wheel{ position:relative; }
.rlb-wheel svg{ display:block; width:100%; height:auto; overflow:visible; }
.w-ring{ fill:none; stroke:#C9963A; stroke-width:3; stroke-dasharray:2 8; stroke-linecap:round; }
.w-ring2{ fill:rgba(255,253,247,.85); stroke:#EEE2C8; stroke-width:2; }
.w-months text{ font:700 12px 'Manrope',sans-serif; fill:#B8A27A; text-anchor:middle; }
.w-eggs g{ animation:rlEgg 1s calc(var(--d)) cubic-bezier(.34,1.56,.64,1) both; }
@keyframes rlEgg{ from{ opacity:0; } to{ opacity:1; } }
.rlb-candle{ position:absolute; left:50%; top:50%; width:30px; height:90px; margin:-30px 0 0 -15px; }
.rlb-candle .wx{ position:absolute; left:7px; bottom:0; width:16px; height:62px; border-radius:3px; background:linear-gradient(90deg,#E9C76A,#F7E2A2 45%,#D9AE4A); }
.rlb-candle .fl{ position:absolute; left:8px; top:0; width:14px; height:24px; border-radius:50% 50% 50% 50% / 70% 70% 30% 30%; background:radial-gradient(circle at 50% 70%, #FFF6C8, #FFC24A 60%, rgba(255,140,40,0) 72%); box-shadow:0 0 30px 10px rgba(255,200,90,.45); animation:rlFlame 3s ease-in-out infinite; transform-origin:50% 100%; }
@keyframes rlFlame{ 0%,100%{ transform:scale(1) rotate(-2deg); } 50%{ transform:scale(1.06,1.12) rotate(2deg); } }
/* мисълта — в тетрадка */
.rlb-note{ position:relative; max-width:760px; margin:0 auto; padding:34px 40px 30px 76px; background:
  linear-gradient(90deg, transparent 54px, rgba(200,80,62,.45) 54px, rgba(200,80,62,.45) 56px, transparent 56px),
  repeating-linear-gradient(180deg, #FFFDF7 0 35px, #D7E6F2 35px 36px); border-radius:6px; box-shadow:0 30px 50px -36px rgba(110,80,30,.55); transform:rotate(-.6deg); }
.rlb-note blockquote{ margin:0; } .rlb-note p{ font-family:'Fraunces',serif; font-style:italic; font-size:clamp(21px,2.6vw,30px); line-height:36px; color:#2E2416; margin:0; }
.rlb-note figcaption{ margin-top:12px; font-weight:800; font-size:13.5px; letter-spacing:.06em; color:#C9963A; }
.rlb-heart{ position:absolute; right:22px; bottom:16px; width:42px; height:42px; } .rlb-heart svg *{ stroke:#C8503E; stroke-width:3.4; }
[data-theme="religia"] .ed-footer::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 46' preserveAspectRatio='none'%3E%3Cpath d='M0 0 C 240 40 480 40 720 22 C 960 4 1200 4 1440 34 L1440 0 Z' fill='%23FBF6EC'/%3E%3C/svg%3E"); }
@media (max-width:900px){ .rlb-book{ grid-template-columns:1fr; } .rlb-book::before{ display:none; } .rlb-right{ order:-1; } .rlb-pic{ min-height:240px; } .rlb-year-in{ grid-template-columns:1fr; } .rlb-wheel{ max-width:360px; margin:0 auto; } .rlb-note{ padding:28px 22px 28px 66px; } }
@media (prefers-reduced-motion:reduce){ .rlb-candle .fl, .w-eggs g{ animation:none; } }
/* „Из нашия албум“ — снимките са залепени в книжката с тиксо */
.rlb-album-sec{ padding-top:clamp(30px,4vw,50px) !important; }
.rlb-album-p{ font-size:17px; line-height:1.7; color:#5A4A34; max-width:56ch; margin:-6px 0 26px; }
.rlb-album{ columns:4 220px; column-gap:22px; padding:clamp(18px,2.4vw,30px); background:#FFFDF7; border-radius:10px;
  box-shadow:0 2px 0 #EEE2C8, 0 4px 0 #F6EDDA, 0 40px 70px -40px rgba(110,80,30,.5); }
.rlb-ph{ position:relative; break-inside:avoid; margin:0 0 26px; padding:8px 8px 30px; background:#fff; cursor:zoom-in;
  rotate:var(--r); box-shadow:0 1px 0 #EADBBF, 0 14px 22px -16px rgba(110,80,30,.6); transition:rotate .4s, scale .4s, box-shadow .4s; }
.rlb-ph::before{ content:""; position:absolute; top:-10px; left:50%; width:62px; height:20px; margin-left:-31px; background:rgba(242,213,138,.7); transform:rotate(calc(var(--r) * -2)); }
.rlb-ph:nth-child(3n)::before{ background:rgba(141,184,218,.6); } .rlb-ph:nth-child(3n+2)::before{ background:rgba(200,80,62,.35); }
.rlb-ph img{ display:block; width:100%; height:auto; }
.rlb-ph figcaption{ position:absolute; left:0; right:0; bottom:6px; text-align:center; font-family:'Fraunces',serif; font-style:italic; font-size:15px; color:#5A4A34; }
.rlb-ph:hover, .rlb-ph:focus-visible{ rotate:0deg; scale:1.03; box-shadow:0 1px 0 #EADBBF, 0 24px 34px -18px rgba(110,80,30,.7); z-index:2; outline:none; }
@media (max-width:600px){ .rlb-album{ columns:2 140px; column-gap:14px; } }
/* „Предговор“ — целите на клуба, като първата страница на книжката */
.rlb-pre-sec{ padding-top:clamp(34px,4vw,56px) !important; padding-bottom:0 !important; }
.rlb-pre{ position:relative; max-width:860px; margin:0 auto; padding:clamp(28px,4vw,50px) clamp(24px,4.5vw,60px); background:#FFFDF7; border-radius:10px;
  box-shadow:0 2px 0 #EEE2C8, 0 4px 0 #F6EDDA, 0 40px 70px -40px rgba(110,80,30,.5); }
.rlb-pre::after{ content:"стр. 2"; position:absolute; right:26px; bottom:12px; font-family:'Fraunces',serif; font-style:italic; font-size:13px; color:#B8A27A; }
.rlb-pre .rlb-h{ text-align:center; font-style:italic; }
.rlb-pre-lead{ font-size:clamp(17px,1.9vw,20px); line-height:1.8; color:#3E3220; margin:0 0 22px; }
.rlb-cap2{ float:left; font-family:'Fraunces',serif; font-style:italic; font-size:64px; line-height:.85; margin:6px 10px 0 0; color:#C8503E; text-shadow:3px 3px 0 rgba(242,213,138,.8); }
.rlb-goals{ list-style:none; margin:0; padding:0; counter-reset:g; display:grid; gap:12px; clear:both; }
.rlb-goals li{ counter-increment:g; position:relative; padding:12px 16px 12px 58px; border-radius:14px; background:#FBF3E2; font-size:16.5px; line-height:1.6; color:#3E3220; }
.rlb-goals li::before{ content:counter(g); position:absolute; left:14px; top:50%; margin-top:-17px; width:34px; height:34px; display:grid; place-items:center; border-radius:50%;
  font-family:'Fraunces',serif; font-style:italic; font-size:18px; color:#fff; background:var(--gc,#C9963A); }
.rlb-goals li:nth-child(1){ --gc:#8DB8DA; } .rlb-goals li:nth-child(2){ --gc:#C8503E; } .rlb-goals li:nth-child(3){ --gc:#7EAE5C; } .rlb-goals li:nth-child(4){ --gc:#C9963A; } .rlb-goals li:nth-child(5){ --gc:#9C7BC8; }
.rlb-goals b{ color:#2E2416; }
.rlb-bookmark span{ grid-template-columns:96px 1fr; font-size:15.5px; }
.rlb-who{ margin-top:4px; padding-top:8px; border-top:1px dashed #E2CFA6; }

/* ===========================================================================
   79. УЧЕБЕН ПРОЦЕС — ОТКРИТ УРОК ПО БДП, I КЛАС (bd-ev-)
=========================================================================== */
.bd-event{ margin-top:30px; padding-top:26px; border-top:1px solid var(--line,#E7DDCD); }
.bd-ev-head{ display:flex; flex-wrap:wrap; align-items:baseline; gap:12px; margin-bottom:10px; }
.bd-ev-date{ font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--brick-deep); background:var(--brick-bg); padding:5px 12px; border-radius:999px; }
.bd-ev-h{ margin:0; font-family:'Fraunces',serif; font-weight:400; font-size:clamp(20px,2.4vw,26px); color:var(--ink); }
.bd-ev-text{ margin:0 0 16px; font-size:16px; line-height:1.75; color:var(--ink); max-width:72ch; }
.bd-ev-gal{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.bd-ev-gal figure{ position:relative; margin:0; border:0; padding:0; cursor:pointer; overflow:hidden; border-radius:14px; aspect-ratio:3/4; background:#EFE6DB; }
.bd-ev-gal img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease; }
.bd-ev-gal figure:hover img{ transform:scale(1.05); }
@media (max-width:760px){ .bd-ev-gal{ grid-template-columns:repeat(2,minmax(0,1fr)); } }



/* ===========================================================================
   80. АЛЕКО ТВ — СЕЗОН 2: ЗАСТАВКАТА И ТЕКСТЪТ „СЕ ЗАВРЪЩА“ (atv2-)
   Блок между заглавния кадър и телевизора: вляво текстът, вдясно видеото.
=========================================================================== */
.atv2{ position:relative; z-index:2; }
.atv2-grid{ display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.3fr); gap:clamp(24px,4vw,56px); align-items:center; }
.atv2-lead{ margin:18px 0 6px; font-family:'Fraunces',serif; font-size:clamp(20px,2.2vw,26px); line-height:1.3; color:var(--ink); }
.atv2-p{ margin:0 0 18px; font-size:17px; line-height:1.65; color:var(--ink); }
.atv2-soon{ display:inline-flex; align-items:center; gap:10px; margin:0; padding:10px 18px; border-radius:999px; background:#FFD84D; color:#1B1B3A; font-weight:800; font-size:15px; line-height:1.3; }
.atv2-soon i{ width:10px; height:10px; border-radius:50%; background:#D1242F; flex:none; animation:atv2rec 1.4s ease-in-out infinite; }
@keyframes atv2rec{ 50%{ opacity:.25; } }
.atv2-vid{ position:relative; border-radius:18px; overflow:hidden; background:#000; aspect-ratio:16/9; box-shadow:0 18px 44px -16px rgba(15,26,78,.55); }
.atv2-vid video{ position:absolute; inset:0; width:100%; height:100%; display:block; object-fit:cover; background:#000; }
@media (max-width:860px){ .atv2-grid{ grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce){ .atv2-soon i{ animation:none; } }


/* ═══ 81. ЗЗЛД — четири документа (zz-env4): две по две, на телефон — една колона ═══ */
.zz-env4{ grid-template-columns:repeat(2,minmax(0,1fr)); }
@media (max-width:860px){ .zz-env4{ grid-template-columns:1fr; } }

/* ═══ 82. Документи — запис-събитие (dk-type.ev): тухлена значка „УРОК“ вместо PDF ═══ */
.dk-type.ev{ background:#B5472E; font-size:9.5px; letter-spacing:.02em; }

/* ═══ 83. Екип — двата имейла на учителя се виждат като текст (ek-mails) ═══ */
.ek-mails{ display:flex; flex-direction:column; gap:3px; margin-top:8px; max-width:100%; }
.ek-mails a{ font-family:'Manrope',sans-serif; font-weight:600; font-size:12px; line-height:1.35; color:var(--brick-deep); text-decoration:none; overflow-wrap:anywhere; }
.ek-mails a:hover{ color:var(--brick); text-decoration:underline; }
.ek-links:empty{ display:none; }
.ek-lead .ek-mails{ align-items:center; text-align:center; }
.ek-class .ek-mails a{ font-size:11.5px; }

/* ═══ 84. Директор — приемно и работно време (ek-hours в „Екип“, kt-h в „Контакти“) ═══ */
.ek-hours{ display:flex; flex-direction:column; gap:3px; margin-top:10px; padding-top:10px; border-top:1px dashed var(--line,#E7DDCD); font-family:'Manrope',sans-serif; font-size:12.5px; line-height:1.4; color:var(--ink-soft); }
.ek-hours b{ display:inline; font-family:'Manrope',sans-serif; font-weight:800; font-size:inherit; color:var(--ink); }
.ek-lead .ek-hours{ align-items:center; text-align:center; }
.kt-p small.kt-h{ display:block; margin-top:6px; line-height:1.45; }

/* ═══ 85. Алеко ТВ — касетите по сезони (atv-sz) и бутонът „Гледай Епизод 1“ (atv2-go) ═══ */
.atv-sz{ margin:0 0 12px; font-family:'Manrope',sans-serif; font-weight:800; font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--brick); }
.atv-tapes + .atv-sz{ margin-top:26px; }
.atv-tapes-new{ margin-bottom:4px; }
body.atv-dark .atv-sz{ color:var(--ink-soft); }
.atv2-go{ display:inline-block; margin-top:14px; padding:12px 22px; border-radius:999px; background:var(--brick); color:#fff; text-decoration:none; font-family:'Manrope',sans-serif; font-weight:800; font-size:14.5px; }
.atv2-go:hover{ background:var(--brick-deep); }

/* ═══ 86. Клуб „Религия“ — ново събитие над албума (rlb-ev-): дата, текст и снимки като в албум ═══ */
.rlb-ev-sec{ padding-top:clamp(30px,4vw,50px) !important; }
.rlb-ev{ margin-bottom:22px; }
.rlb-ev-date{ display:inline-block; margin-bottom:10px; font-family:'Manrope',sans-serif; font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#8A3A24; background:#F6DCCF; padding:5px 12px; border-radius:999px; }
.rlb-ev-text{ margin:-6px 0 0; font-size:17px; line-height:1.75; color:#3E3220; max-width:68ch; }