/* clean — общите медийни части на чистите страници (02.10.2026): видео от YouTube като фасада и акордеон с картинки. */
/* видео от YouTube като фасада (xp-video: картинка и бутон; site.js зарежда видеото при натискане) — общо за всички чисти страници (02.10.2026) */
.xp-clean .xp-video { position: relative; margin: 0; aspect-ratio: 16 / 9; overflow: hidden; background: var(--wp--preset--color--black); }
.xp-clean .xp-video :is(img, iframe) { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; object-fit: cover; }
.xp-clean .xp-video__play { position: absolute; left: 50%; top: 50%; width: var(--wp--custom--svc-videocard--play-w); height: var(--wp--custom--svc-videocard--play-h); transform: var(--wp--custom--svc-videocard--play-shift); background: var(--wp--custom--svc-videocard--play-bg); border-radius: var(--wp--custom--svc-videocard--play-radius); }
.xp-clean .xp-video__play::after { content: ""; position: absolute; left: var(--wp--custom--svc-videocard--arrow-left); top: var(--wp--custom--svc-videocard--arrow-top); border-left: var(--wp--custom--svc-videocard--arrow-w) solid var(--wp--preset--color--white); border-top: var(--wp--custom--svc-videocard--arrow-h) solid transparent; border-bottom: var(--wp--custom--svc-videocard--arrow-h) solid transparent; }
/* акордеон с картинки (xp-imgacc; За нас, Academy — Divi Next Image Accordion, imgacc.css): 4 карти в ред, при посочване картата се
   разширява, синьо поле и текстът; снимката е първият блок (xp-imgacc__bg) отзад; на телефон картите са една под друга */
.xp-clean .xp-imgacc { display: flex; width: var(--wp--custom--imgacc--w); height: var(--wp--custom--imgacc--h); margin: var(--wp--custom--imgacc--top) 0 0; overflow: hidden; }
.xp-clean .xp-imgacc__item { position: relative; isolation: isolate; flex: 1; min-width: 0; margin: 0; padding: var(--wp--custom--imgacc--pad); overflow: hidden; color: var(--wp--preset--color--white); transition: flex .4s ease; }
.xp-clean .xp-imgacc__item:is(:hover, :focus-within) { flex: 3; }
.xp-clean .xp-imgacc__item::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--wp--custom--imgacc--overlay); opacity: 0; transition: opacity .4s ease; }
.xp-clean .xp-imgacc__item:is(:hover, :focus-within)::before { opacity: 1; }
.xp-clean .xp-imgacc__item > .xp-imgacc__bg { position: absolute; inset: 0; z-index: -2; margin: 0; }
.xp-clean .xp-imgacc__item > .xp-imgacc__bg img { width: 100%; height: 100%; object-fit: cover; }
.xp-clean .xp-imgacc__item > :not(.xp-imgacc__bg) { margin: 0 0 var(--wp--custom--imgacc--gap); color: inherit; opacity: 0; transition: opacity .4s ease; }
.xp-clean .xp-imgacc__item:is(:hover, :focus-within) > :not(.xp-imgacc__bg) { opacity: 1; }
@media (max-width: 767px) { .xp-clean .xp-imgacc { flex-direction: column; width: auto; height: var(--wp--custom--imgacc--h-phone); } }
/* вертикално видео (YouTube Shorts, xp-video--short; „Instant Experience“): беше 9:16, 22vw, в средата на колоната.
   (026 ВЛ.21, 22.10.2026) рамката е 16:9 като на живо (Divi et_pb_video показва вертикалното видео в хоризонтална рамка с черни полета;
   Велислав 060–065 на 1366–1920: у нас блокът беше ~2,5× по-висок — 1050–1350 срещу 410–620 px). Ширините (22vw; svc-media 36/38vw на
   компютър) остават; П4: 5 видеа на /instant-experience/, 4 в кейса ХИВ BG/EN. */
.xp-clean .xp-video.xp-video--short { aspect-ratio: 16 / 9; width: var(--wp--custom--video--short-w); max-width: 100%; margin: 0 auto; }
@media (max-width: 767px) { .xp-clean .xp-video.xp-video--short { width: var(--wp--custom--video--short-w-phone); } }
/* Бутон „нагоре“ на чистите страници (04.10.2026): правилата бяха само в стария theme.css, който чистите не зареждат — бутонът
   излизаше като бяла ивица ~25 px със синя стрелка под футъра (пълният преглед, 20 от 23 стр.); като Divi: каре 40 px вдясно, 125 px от долу */
.xp-totop { position: fixed; right: 0; bottom: var(--wp--custom--totop--bottom); z-index: 9999; display: flex; align-items: center; justify-content: center; width: var(--wp--custom--totop--size); height: var(--wp--custom--totop--size); border-radius: var(--wp--custom--totop--radius); background: var(--wp--custom--totop--bg); color: var(--wp--preset--color--white); opacity: 0; visibility: hidden; translate: 100% 0; transition: opacity 1s cubic-bezier(.77, 0, .175, 1), translate 1s cubic-bezier(.77, 0, .175, 1), visibility 0s linear 1s; }
.xp-totop.is-on { opacity: 1; visibility: visible; translate: 0 0; transition-delay: 0s; }
.xp-totop:focus-visible { outline: var(--wp--custom--totop--outline) solid var(--wp--preset--color--white); outline-offset: var(--wp--custom--totop--outline-offset); }
@media (max-width: 767px), (prefers-reduced-motion: reduce) { .xp-totop { transition: none; } }
