/* clean — „Примери и казуси“: въртележките с карти от записи (carousel.css: Splide xp-splide и Blog Extras xp-be; плъзгането и точките —
   site.js) и картата (theme.css .xp-card) без бутона; бутонът, картинките с превъртане и скритият текст — clean.more.css. */
.xp-b-svc-examples .xp-carousel--cards { position: relative; }
.xp-b-svc-examples .xp-splide { --xp-cards-gap: var(--wp--custom--svc-examples--splide-gap); }
.xp-b-svc-examples .xp-be { --xp-cards-gap: var(--wp--custom--svc-examples--be-gap); }
.xp-b-svc-examples .xp-carousel--cards .wp-block-post-template { display: flex; gap: var(--xp-cards-gap); margin: 0; padding: 0; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.xp-b-svc-examples .xp-carousel--cards .wp-block-post-template::-webkit-scrollbar { display: none; }
.xp-b-svc-examples .xp-carousel--cards .wp-block-post-template > li { flex: 0 0 calc((100% - 2 * var(--xp-cards-gap)) / 3); min-width: 0; margin: 0; list-style: none; scroll-snap-align: start; }
.xp-b-svc-examples .xp-carousel--cards > .xp-carousel__nav, .xp-b-svc-examples .xp-be > .xp-carousel__dots { display: none; }
.xp-b-svc-examples .xp-splide > .xp-carousel__dots { display: flex; position: absolute; top: 100%; left: 0; right: 0; justify-content: center; align-items: center; gap: var(--wp--custom--svc-examples--dot-gap); margin-top: var(--wp--custom--svc-examples--dots-top); }
.xp-b-svc-examples .xp-carousel__dots button { width: var(--wp--custom--svc-examples--dot); height: var(--wp--custom--svc-examples--dot); padding: 0; border: 0; border-radius: 50%; background: var(--wp--custom--svc-examples--dot-color); opacity: .7; cursor: pointer; }
.xp-b-svc-examples .xp-carousel__dots .is-active { width: var(--wp--custom--svc-examples--dot-on); height: var(--wp--custom--svc-examples--dot-on); background: var(--wp--preset--color--white); }
/* картата; заглавието и откъсът 20 px от рамката — WordPress („constrained“) им дава margin auto !important, затова ширината е по-малка */
.xp-b-svc-examples .xp-card { display: flow-root; position: relative; height: 100%; border: var(--wp--custom--border--thin) solid var(--wp--custom--svc-examples--card-border); background: var(--wp--preset--color--white); }
.xp-b-svc-examples .xp-splide .xp-card { padding-bottom: var(--wp--custom--svc-examples--card-pb); }
.xp-b-svc-examples .xp-be .xp-card { padding-bottom: var(--wp--custom--svc-examples--be-pb); }
.xp-b-svc-examples .xp-card .wp-block-post-featured-image { overflow: hidden; } /* (L/S 05.10) „Кариери“ 1082 → 311 px */
.xp-b-svc-examples .xp-card .wp-block-post-featured-image img { display: block; width: 100%; height: auto; contain-intrinsic-size: none; }
.xp-b-svc-examples .xp-card .wp-block-post-featured-image img:not(.size-medium_large) { aspect-ratio: 16 / 9; object-fit: cover; }
.xp-b-svc-examples .xp-card .post_title { width: var(--wp--custom--svc-examples--card-inner); margin: var(--wp--custom--space--20) auto; padding: 0 0 var(--wp--custom--space--20); border-bottom: var(--wp--custom--svc-examples--line-w) solid var(--wp--custom--svc-examples--line); color: var(--wp--preset--color--black); font-size: var(--t-sub); font-weight: var(--wp--custom--weight--bold); line-height: var(--t-lh-head); text-transform: uppercase; letter-spacing: var(--t-caps); }
.xp-b-svc-examples .xp-card .post_excerpt p { max-height: var(--wp--custom--svc-examples--excerpt-h); overflow: hidden; }
.xp-b-svc-examples .xp-card .post_excerpt { width: var(--wp--custom--svc-examples--card-inner); max-height: var(--wp--custom--svc-examples--excerpt-h); margin: var(--wp--custom--space--20) auto; overflow: hidden; }
.xp-b-svc-examples .xp-card :is(.post_excerpt, .post_excerpt p) { color: var(--wp--preset--color--black); font-size: var(--t-small); font-weight: var(--wp--custom--weight--light); line-height: var(--t-lh-small); }
.xp-b-svc-examples .xp-card .post_excerpt p { margin: 0; }
.xp-b-svc-examples .xp-splide .xp-card .post_excerpt { height: var(--wp--custom--svc-examples--excerpt-h); max-height: none; }
.xp-b-svc-examples .xp-be .xp-card .post_excerpt { margin-bottom: var(--wp--custom--svc-examples--be-btn-gap); }
.xp-b-svc-examples .xp-card .post_date { position: absolute; bottom: var(--wp--custom--space--20); left: var(--wp--custom--space--20); color: var(--wp--preset--color--black); font-size: var(--t-label); font-weight: var(--wp--custom--weight--medium); }
.xp-b-svc-examples .xp-be .xp-card .post_date::before { content: ""; display: inline-block; width: var(--wp--custom--svc-examples--cal); height: var(--wp--custom--svc-examples--cal); margin-right: var(--wp--custom--svc-examples--cal-gap); vertical-align: var(--wp--custom--svc-examples--cal-lift); background: currentColor; mask: url("../../assets/img/calendar.svg") center / contain no-repeat; }
@media (max-width: 980px) {
	.xp-b-svc-examples .xp-be { --xp-cards-gap: var(--wp--custom--svc-examples--be-gap-tablet); }
	.xp-b-svc-examples .xp-splide .wp-block-post-template > li { flex-basis: var(--wp--custom--svc-examples--card-w-tablet); }
	.xp-b-svc-examples .xp-be .wp-block-post-template > li { flex-basis: 100%; }
	.xp-b-svc-examples .xp-splide > .xp-carousel__dots { position: static; margin-top: var(--wp--custom--svc-examples--dots-top-tablet); }
}
