/* Светлина — styles for sections, header, footer and menus.
   Colours and fonts come from theme.json (--wp--preset--*); this file only adds layout.
   Every section carries .is-light or .is-dark (chosen from its background colour),
   and the --sv-* custom properties below flip text/line colours accordingly. */

:root {
	--sun-tint: var(--wp--preset--color--sun-tint);
	--sun-wash: var(--wp--preset--color--sun-wash);
	--sun-warm: var(--wp--preset--color--sun-warm);
	--sun-soft: var(--wp--preset--color--sun-soft);
	--sun-gold: var(--wp--preset--color--sun-gold);
	--blue: var(--wp--preset--color--blue);
	--blue-deep: var(--wp--preset--color--blue-deep);
	--sky: var(--wp--preset--color--sky);
	--white: var(--wp--preset--color--white);
	--mist: var(--wp--preset--color--mist);
	--paper: var(--wp--preset--color--paper);
	--ink: var(--wp--preset--color--ink);
	--ink-soft: var(--wp--preset--color--ink-soft);
	--line: var(--wp--preset--color--line);

	/* Палитра на игривия стил (.sv-look-kids), взета от корицата „Уча и играя“ */
	--cream: var(--wp--preset--color--cream);
	--peach: var(--wp--preset--color--peach);
	--peach-deep: #f6cd9a;
	--berry: var(--wp--preset--color--berry);
	--berry-deep: var(--wp--preset--color--berry-deep);
	--azure: var(--wp--preset--color--azure);
	--tang: var(--wp--preset--color--tang);
	--leaf: var(--wp--preset--color--leaf);
	--grape: var(--wp--preset--color--grape);
	--poppy: var(--wp--preset--color--poppy);
	--sunny: var(--wp--preset--color--sunny);
	--teal: var(--wp--preset--color--teal);
	--navy: var(--wp--preset--color--blue-deep);

	--f-display: var(--wp--preset--font-family--display);
	--f-body: var(--wp--preset--font-family--body);

	--step--1: 0.8125rem;
	--step-0: 1.0625rem;
	--step-1: 1.25rem;
	--step-2: clamp(1.4rem, 1.15rem + 1vw, 1.85rem);
	--step-3: clamp(1.75rem, 1.25rem + 2vw, 2.6rem);
	--step-4: clamp(2.2rem, 1.3rem + 3.4vw, 3.9rem);

	--sv-wrap: 1200px;
	--r: 6px;
}

html { scroll-behavior: smooth; }
body {
	-webkit-font-smoothing: antialiased;
	font-feature-settings: "locl" 0; /* без българските ръкописни форми на т, д, в — по-строг вид */
}
:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; }

.sv-wrap {
	width: 100%;
	max-width: calc(var(--sv-wrap) + 2 * 32px);
	margin-inline: auto;
	padding-inline: 16px;
	box-sizing: border-box;
}
@media (min-width: 720px) {
	.sv-wrap { padding-inline: 32px; }
}

/* ---------- Секции и тон ---------- */
.sv-section {
	--sv-fg: var(--ink);
	--sv-soft: var(--ink-soft);
	--sv-head: var(--ink);
	--sv-accent: var(--blue);
	--sv-line: var(--line);
	--sv-surface: var(--white);
	--sv-card: var(--mist);
	--sv-mark: var(--sun-warm);
	--sv-pt: clamp(72px, 10vw, 136px);
	--sv-pb: clamp(72px, 10vw, 136px);
	--sv-wave: clamp(34px, 5vw, 64px);
	color: var(--sv-fg);
	padding-block: var(--sv-pt) var(--sv-pb);
	box-sizing: border-box;
	position: relative;
}
.sv-section.is-dark {
	--sv-fg: #fff;
	--sv-soft: #d6e4fb;
	--sv-head: #fff;
	--sv-accent: var(--sky);
	--sv-line: rgba(255, 255, 255, 0.18);
	--sv-surface: rgba(255, 255, 255, 0.08);
	--sv-card: rgba(255, 255, 255, 0.08);
}
:where(.sv-section) a { color: inherit; }
.sv-section h1, .sv-section h2, .sv-section h3, .sv-section h4 {
	font-family: var(--f-display);
	color: var(--sv-head);
	line-height: 1.15;
	margin: 0;
	font-weight: 700;
	letter-spacing: -.01em;
	text-wrap: balance;
}
.sv-section p { margin: 0; }

/* Стандартен фон на всеки блок (inline стилът от редактора го замества) */
.sv-hero { background: var(--blue); }
.sv-stages { background: var(--blue-deep); }
.sv-cta, .sv-quote { background: var(--blue); }
.sv-mission, .sv-contact, .sv-author { background: var(--paper); }
.sv-feature, .sv-about, .sv-faq { background: var(--mist); }
.sv-pillars, .sv-roadmap, .sv-book-hero, .sv-shelf { background: var(--white); }
.sv-stages { --sv-pt: 0px; --sv-pb: 0px; }
.sv-book-hero { --sv-pt: clamp(32px, 5vw, 64px); --sv-pb: clamp(72px, 9vw, 120px); }

.sv-stack { display: grid; gap: 18px; }
.sv-muted { color: var(--sv-soft); }
.sv-row { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: center; }
.sv-sec-title { font-size: var(--step-3); }

/* Надзаглавие с кратка жълта линия */
.sv-eyebrow {
	font-family: var(--f-display); font-weight: 700; font-size: var(--step--1);
	letter-spacing: .16em; text-transform: uppercase; color: var(--sv-accent);
	display: inline-flex; align-items: center; gap: 14px;
}
.sv-eyebrow::before { content: ""; width: 28px; height: 3px; background: var(--sun-gold); flex: none; }
.sv-lead { font-size: var(--step-1); line-height: 1.6; color: var(--sv-soft); max-width: 58ch; }

/* Бутони */
.sv-btn {
	display: inline-flex; align-items: center; gap: 12px;
	font-family: var(--f-display); font-weight: 700; font-size: .95rem; letter-spacing: .01em;
	padding: 15px 24px; border-radius: var(--r); text-decoration: none;
	border: 1.5px solid transparent; transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.sv-btn svg { width: 18px; height: 18px; flex: none; transition: transform .2s ease; }
.sv-btn:hover svg { transform: translateX(3px); }
.sv-btn--blue { background: var(--blue); color: var(--white); }
.sv-btn--blue:hover { background: var(--blue-deep); color: var(--white); }
.sv-btn--sun { background: var(--sun-warm); color: var(--ink); }
.sv-btn--sun:hover { background: var(--sun-gold); color: var(--ink); }
.sv-btn--line { border-color: var(--line); color: var(--ink); background: var(--white); }
.sv-btn--line:hover { border-color: var(--blue); color: var(--blue); }
.sv-btn--ghost { border-color: rgba(255, 255, 255, .5); color: var(--white); }
.sv-btn--ghost:hover { border-color: var(--white); background: rgba(255, 255, 255, .08); color: var(--white); }
.sv-link-arrow { font-family: var(--f-display); font-weight: 700; color: var(--sv-accent); text-decoration: none; display: inline-flex; align-items: center; gap: 10px; }
.sv-link-arrow svg { width: 18px; height: 18px; transition: transform .2s ease; }
.sv-link-arrow:hover svg { transform: translateX(3px); }

.sv-ph-note {
	font-family: var(--f-body); font-size: .75rem; font-weight: 600; color: var(--ink-soft);
	border: 1px dashed #b7c2d6; padding: 2px 8px; border-radius: 3px; display: inline-block; line-height: 1.5;
}

/* ---------- Корици ---------- */
.sv-book { position: relative; width: 100%; max-width: 100%; aspect-ratio: 210 / 297; }
.sv-book::after { /* страници отстрани */
	content: ""; position: absolute; top: 1.2%; bottom: 1.2%; right: -2.6%; width: 2.8%;
	background: repeating-linear-gradient(90deg, #fbfaf7 0 1px, #e9e5dc 1px 2px);
	border-radius: 0 2px 2px 0; box-shadow: 0 0 0 1px rgba(20, 40, 79, .06);
}
.sv-book-photo img { display: block; width: 100%; height: auto; border-radius: 2px 4px 4px 2px; box-shadow: 0 18px 34px -16px rgba(15, 47, 104, .45), 0 40px 60px -40px rgba(15, 47, 104, .35); }
.sv-cover {
	--bg: var(--white); --band: var(--blue); --tx: var(--ink); --acc: var(--sun-warm);
	position: absolute; inset: 0; z-index: 1; overflow: hidden;
	background: var(--bg); color: var(--tx); border-radius: 2px 4px 4px 2px;
	box-shadow: 0 1px 1px rgba(20, 40, 79, .08), 0 18px 34px -16px rgba(15, 47, 104, .45), 0 40px 60px -40px rgba(15, 47, 104, .35);
	display: grid; grid-template-rows: auto auto 1fr auto; container-type: inline-size;
}
.sv-cover::before { /* гръб */
	content: ""; position: absolute; inset: 0 auto 0 0; width: 5%; z-index: 2;
	background: linear-gradient(90deg, rgba(0, 0, 0, .18), rgba(255, 255, 255, .22) 45%, rgba(0, 0, 0, .06));
}
.sv-cover .c-band { background: var(--band); color: var(--white); padding: 7cqw 9cqw 6cqw 12cqw; display: flex; justify-content: space-between; align-items: center; gap: 4cqw; }
.sv-cover .c-series { font-family: var(--f-display); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; font-size: 4.4cqw; }
.sv-cover .c-mark { width: 11cqw; height: 11cqw; color: var(--acc); flex: none; }
.sv-cover .c-body { padding: 9cqw 9cqw 0 12cqw; display: grid; align-content: start; gap: 4cqw; }
.sv-cover .c-title { font-family: var(--f-display); font-weight: 800; font-size: 13cqw; line-height: 1; letter-spacing: -.02em; color: var(--band); }
.sv-cover .c-sub { font-family: var(--f-body); font-size: 4.6cqw; line-height: 1.35; color: var(--ink-soft); }
.sv-cover .c-rule { width: 22cqw; height: 1.4cqw; background: var(--acc); }
.sv-cover .c-art { margin: 6cqw 0 0 12cqw; height: 100%; min-height: 0; position: relative; overflow: hidden; }
.sv-cover .c-art svg { position: absolute; right: -14cqw; bottom: -18cqw; width: 78cqw; height: 78cqw; color: var(--acc); opacity: .9; }
.sv-cover .c-foot { display: flex; justify-content: space-between; align-items: center; gap: 4cqw; padding: 5cqw 9cqw 6cqw 12cqw; border-top: 1px solid rgba(20, 40, 79, .1); font-size: 4cqw; font-family: var(--f-display); font-weight: 600; }
.sv-cover .c-age { background: var(--band); color: var(--white); padding: 1cqw 3cqw; border-radius: 1cqw; font-weight: 700; white-space: nowrap; }
.sv-cover--blue { --bg: var(--blue); --band: var(--blue-deep); --tx: var(--white); }
.sv-cover--blue .c-title { color: var(--white); }
.sv-cover--blue .c-sub { color: var(--sky); }
.sv-cover--blue .c-foot { border-color: rgba(255, 255, 255, .18); }
.sv-cover--blue .c-age { background: var(--sun-warm); color: var(--ink); }
.sv-cover--sky { --bg: #eef5ff; --band: #2b5eb5; }
.sv-cover--sun { --bg: var(--sun-warm); --band: var(--blue); --acc: var(--white); }
.sv-cover--sun .c-sub { color: var(--ink); }
.sv-cover--sun .c-foot { border-color: rgba(20, 40, 79, .15); }

.sv-photo-ph {
	position: relative; overflow: hidden; max-width: 100%; border-radius: 2px;
	background: linear-gradient(135deg, #e9eef7, #f6f8fc);
	display: grid; place-items: end start; padding: 16px;
}
.sv-photo-ph::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(135deg, transparent 0 22px, rgba(25, 75, 163, .045) 22px 23px); }
.sv-photo-ph > * { position: relative; background: var(--white); }

/* ---------- Hero ---------- */
.sv-hero { overflow: hidden; --sv-pt: 0px; --sv-pb: 0px; }
.sv-hero::after { content: ""; position: absolute; right: -180px; top: -220px; width: 640px; height: 640px; border-radius: 50%; border: 1px solid rgba(255, 222, 26, .28); pointer-events: none; }
.sv-hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(40px, 6vw, 96px); align-items: center; padding-block: clamp(56px, 8vw, 112px) clamp(48px, 6vw, 80px); }
.sv-hero__copy { display: grid; gap: 28px; min-width: 0; justify-items: start; }
.sv-hero h1 { font-size: var(--step-4); font-weight: 800; letter-spacing: -.025em; }
.sv-hero h1 span { color: var(--sun-warm); }
.sv-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; }
/* Рафтът с корици: светъл слънчев фон по подразбиране; избран фон (.is-dark-bg при тъмен) сменя и цветовете на линията и надписа */
.sv-shelf-art { position: relative; aspect-ratio: 1 / 1.02; width: 100%; max-width: 520px; justify-self: end; background: linear-gradient(180deg, var(--sun-tint), var(--sun-wash)); box-shadow: inset 0 0 0 1px rgba(255, 194, 0, .28); }
.sv-shelf-art.is-dark-bg { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); }
.sv-shelf-art::before { content: ""; position: absolute; left: 0; right: 0; bottom: 14%; height: 2px; background: var(--sun-gold); opacity: .7; }
.sv-shelf-art.is-dark-bg::before { background: var(--sun-warm); opacity: .8; }
.sv-shelf-art__book { position: absolute; bottom: 14%; }
.sv-shelf-art .b1 { width: 40%; left: 7%; }
.sv-shelf-art .b2 { width: 44%; left: 30%; z-index: 2; }
.sv-shelf-art .b3 { width: 38%; right: 6%; }
.sv-shelf-art__caption { position: absolute; left: 7%; right: 7%; bottom: 4%; display: flex; justify-content: space-between; gap: 12px; font-size: .78rem; color: var(--ink-soft); }
.sv-shelf-art.is-dark-bg .sv-shelf-art__caption { color: var(--sky); }

/* ---------- Етапи ---------- */
.sv-stages__grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.sv-stage { padding: 26px 24px 30px 0; display: grid; gap: 6px; align-content: start; min-width: 0; }
.sv-stage + .sv-stage { border-left: 1px solid var(--sv-line); padding-left: 24px; }
.sv-stage small { font-family: var(--f-display); font-weight: 700; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--sv-accent); }
.sv-stage b { font-family: var(--f-display); font-weight: 700; font-size: 1.1rem; color: var(--sv-head); }
.sv-stage__status { font-size: .85rem; color: var(--sv-soft); display: inline-flex; align-items: center; gap: 8px; }
.sv-stage__status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; opacity: .4; }
.sv-stage.is-current { box-shadow: inset 0 3px 0 var(--sun-warm); }
.sv-stage.is-current .sv-stage__status { color: var(--sun-warm); font-weight: 700; }
.sv-stage.is-current .sv-stage__status::before { background: var(--sun-gold); opacity: 1; }
.is-light .sv-stage.is-current .sv-stage__status { color: var(--blue); }

/* ---------- Мисия ---------- */
.sv-mission__grid { display: grid; grid-template-columns: 1fr 2.4fr; gap: clamp(24px, 5vw, 80px); align-items: start; }
.sv-mission h2 { padding-left: clamp(20px, 3vw, 40px); border-left: 4px solid var(--sv-accent); font-size: var(--step-4); font-weight: 800; letter-spacing: -.025em; color: var(--sv-accent); max-width: 16ch; }
.sv-mission h2 em { font-style: normal; background: linear-gradient(transparent 78%, var(--sv-mark) 78% 94%, transparent 94%); }

/* ---------- Философия ---------- */
.sv-pillars__head { display: grid; grid-template-columns: 1fr 1.3fr; gap: clamp(24px, 5vw, 80px); align-items: end; margin-bottom: clamp(48px, 6vw, 72px); }
.sv-pillars__head h2 { font-size: var(--step-3); }
.sv-pillars__items { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--sv-line); }
.sv-pillar { display: grid; gap: 14px; align-content: start; padding: 36px clamp(24px, 3vw, 40px) 40px; background: var(--sv-card); position: relative; min-width: 0; }
.sv-pillar + .sv-pillar { border-left: 1px solid var(--sv-line); }
.sv-pillar::before { content: ""; position: absolute; top: -1px; left: -1px; right: -1px; height: 4px; background: var(--sv-accent); }
.sv-pillar svg { width: 30px; height: 30px; color: var(--sv-accent); }
.sv-pillar h3 { font-size: var(--step-1); }
.sv-pillar p { color: var(--sv-soft); }

/* ---------- Цитат ---------- */
.sv-quote__grid { display: grid; grid-template-columns: 1fr 3fr; gap: clamp(24px, 5vw, 80px); align-items: start; }
.sv-quote__mark { font-family: var(--f-display); font-weight: 800; font-size: clamp(5rem, 10vw, 9rem); line-height: .7; color: var(--sun-warm); }
.sv-quote blockquote { margin: 0; padding: 0; border: 0; display: grid; gap: 28px; min-width: 0; }
.sv-quote blockquote p { font-family: var(--f-display); font-weight: 600; font-size: var(--step-3); line-height: 1.3; letter-spacing: -.015em; color: var(--sv-head); max-width: 30ch; }
.sv-quote cite { font-style: normal; font-size: .9rem; color: var(--sv-accent); display: inline-flex; gap: 14px; align-items: center; letter-spacing: .04em; }
.sv-quote cite::before { content: ""; width: 28px; height: 2px; background: var(--sun-warm); }

/* ---------- Представено издание ---------- */
.sv-feature__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 96px); align-items: center; }
.sv-feature__art { background: var(--sv-surface); border: 1px solid var(--sv-line); padding: clamp(40px, 7vw, 80px) clamp(56px, 9vw, 110px); min-width: 0; }
.sv-feature__art .sv-book, .sv-feature__art .sv-book-photo { max-width: 320px; margin-inline: auto; }
.sv-feature__copy { display: grid; gap: 24px; min-width: 0; justify-items: start; }
.sv-feature h2 { font-size: var(--step-3); }
.sv-specs-mini { margin: 0; display: grid; border-top: 1px solid var(--sv-line); width: 100%; }
.sv-specs-mini > div { display: grid; grid-template-columns: 9rem 1fr; gap: 16px; padding-block: 12px; border-bottom: 1px solid var(--sv-line); }
.sv-specs-mini dt { font-size: .85rem; color: var(--sv-soft); }
.sv-specs-mini dd { margin: 0; font-weight: 700; }

/* ---------- Поглед към бъдещето ---------- */
.sv-roadmap__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
.sv-roadmap__copy { display: grid; gap: 22px; min-width: 0; }
.sv-roadmap h2 { font-size: var(--step-3); }
.sv-roadmap__copy p { color: var(--sv-soft); max-width: 58ch; }
.sv-roadmap__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--sv-line); min-width: 0; }
.sv-roadmap__list li { display: grid; grid-template-columns: 3rem 1fr auto; gap: 16px; padding-block: 24px; border-bottom: 1px solid var(--sv-line); align-items: baseline; margin: 0; }
.sv-roadmap .n { font-family: var(--f-display); font-weight: 700; color: var(--sv-accent); font-variant-numeric: tabular-nums; }
.sv-roadmap h3 { font-size: var(--step-1); margin-bottom: 4px; }
.sv-roadmap__list p { color: var(--sv-soft); font-size: .97rem; }
.sv-roadmap .tag { font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--sv-soft); white-space: nowrap; }
.sv-roadmap li:first-child .tag { color: var(--sv-accent); }

/* ---------- Контакти ---------- */
.sv-contact__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: clamp(24px, 4vw, 56px); align-items: start; }
.sv-contact h2 { font-size: var(--step-3); }
.sv-contact__card { display: grid; gap: 10px; padding: 24px; background: var(--sv-surface); border-top: 3px solid var(--sv-accent); min-width: 0; justify-items: start; }
.sv-contact h3 { font-size: .75rem; letter-spacing: .16em; text-transform: uppercase; color: var(--sv-soft); }
.sv-big { font-family: var(--f-display); font-weight: 700; font-size: var(--step-1); color: var(--sv-accent); overflow-wrap: anywhere; text-decoration: none; }

/* ---------- Книга: заглавна секция ---------- */
.sv-book-hero__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
.sv-crumbs { grid-column: 1 / -1; font-size: .85rem; color: var(--sv-soft); display: flex; gap: 10px; flex-wrap: wrap; }
.sv-crumbs a { color: var(--sv-soft); text-decoration: none; }
.sv-crumbs a:hover { color: var(--sv-accent); }
.sv-book-hero__art { background: var(--mist); padding: clamp(40px, 7vw, 88px) clamp(56px, 10vw, 120px); min-width: 0; position: sticky; top: 110px; }
.sv-book-hero__art .sv-cover-frame { position: relative; max-width: 340px; margin-inline: auto; }
.sv-book-hero__art .sv-ph-note { display: table; margin: 40px auto 0; background: var(--white); }
.sv-book-hero__copy { display: grid; gap: 26px; min-width: 0; justify-items: start; }
.sv-book-hero h1 { font-size: var(--step-4); font-weight: 800; letter-spacing: -.025em; }
.sv-by { font-size: var(--step-1); color: var(--sv-soft); margin-top: -12px; }
.sv-by b { color: var(--sv-head); font-weight: 700; }
.sv-keys { display: grid; grid-template-columns: repeat(3, auto); justify-content: start; list-style: none; margin: 0; padding: 0; border-block: 1px solid var(--sv-line); }
.sv-keys li { font-family: var(--f-display); font-weight: 700; color: var(--sv-accent); padding: 14px 20px 14px 0; margin: 0; }
.sv-keys li + li { border-left: 1px solid var(--sv-line); padding-left: 20px; }
.sv-golden { font-family: var(--f-display); font-weight: 600; font-size: var(--step-2); color: var(--sv-head); line-height: 1.35; max-width: 32ch; letter-spacing: -.01em; }
.sv-golden mark { background: linear-gradient(transparent 80%, var(--sv-mark) 80% 96%, transparent 96%); color: inherit; }
.sv-quick { margin: 0; display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--sv-line); width: 100%; box-sizing: border-box; }
.sv-quick > div { padding: 14px 16px; display: grid; gap: 2px; min-width: 0; }
.sv-quick > div + div { border-left: 1px solid var(--sv-line); }
.sv-quick dt { font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--sv-soft); }
.sv-quick dd { margin: 0; font-weight: 700; }

/* ---------- Книга: за изданието ---------- */
.sv-about__grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
.sv-about__copy { display: grid; gap: 22px; min-width: 0; }
.sv-about__copy p { color: var(--sv-soft); max-width: 62ch; }
.sv-inside { list-style: none; margin: 12px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--sv-line); }
.sv-inside li { display: grid; grid-template-columns: 28px 1fr; gap: 14px; align-items: start; padding: 18px 16px 18px 0; border-bottom: 1px solid var(--sv-line); font-family: var(--f-display); font-weight: 600; color: var(--sv-head); min-width: 0; margin: 0; }
.sv-inside li:nth-child(even) { padding-left: 16px; border-left: 1px solid var(--sv-line); }
.sv-inside svg { width: 24px; height: 24px; color: var(--sv-accent); }
.sv-specs { background: var(--sv-surface); border: 1px solid var(--sv-line); padding: clamp(24px, 3.5vw, 36px); display: grid; gap: 20px; min-width: 0; position: relative; justify-items: start; }
.sv-specs::before { content: ""; position: absolute; inset: -1px -1px auto; height: 4px; background: var(--sv-accent); }
.sv-specs h3 { font-size: var(--step-2); }
.sv-specs dl { margin: 0; display: grid; width: 100%; }
.sv-specs dl > div { display: grid; grid-template-columns: 8.5rem 1fr; gap: 12px; padding-block: 13px; border-top: 1px solid var(--sv-line); }
.sv-specs dt { color: var(--sv-soft); font-size: .92rem; }
.sv-specs dd { margin: 0; font-weight: 700; }

/* ---------- Книга: за автора ---------- */
.sv-author__grid { display: grid; grid-template-columns: .75fr 1.25fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
.sv-author__photo { aspect-ratio: 4 / 5; position: sticky; top: 110px; }
.sv-author__photo img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 2px; }
.sv-author__copy { display: grid; gap: 20px; min-width: 0; }
.sv-sub { font-family: var(--f-display); font-weight: 600; color: var(--sv-accent); font-size: var(--step-1); }
.sv-author__copy p { color: var(--sv-soft); max-width: 64ch; }
.sv-author__copy p.sv-sub { color: var(--sv-accent); }
.sv-author__copy p strong { color: var(--sv-head); }
.sv-stats { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 12px; border-top: 1px solid var(--sv-line); }
.sv-stats div { padding: 22px 20px 0 0; display: grid; gap: 6px; align-content: start; min-width: 0; }
.sv-stats div + div { padding-left: 20px; border-left: 1px solid var(--sv-line); }
.sv-stats b { font-family: var(--f-display); font-weight: 800; font-size: var(--step-3); color: var(--sv-accent); line-height: 1; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.sv-stats span { font-size: .9rem; color: var(--sv-soft); line-height: 1.45; }

/* ---------- Книга: други издания ---------- */
.sv-shelf__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 16px; margin-bottom: 48px; }
.sv-shelf__items { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(20px, 3.5vw, 44px); }
.sv-shelf__items figure { margin: 0; display: grid; gap: 18px; min-width: 0; align-content: start; }
.sv-shelf__frame { background: var(--sv-card); padding: 14% 16%; }
.sv-shelf__items figcaption { font-family: var(--f-display); font-weight: 700; line-height: 1.35; }
.sv-shelf__items figcaption small { display: block; font-family: var(--f-body); font-weight: 400; color: var(--sv-soft); font-size: .88rem; margin-top: 2px; }

/* ---------- Книга: лято с кауза ---------- */
.sv-faq__grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
.sv-faq__intro { display: grid; gap: 20px; position: sticky; top: 110px; min-width: 0; justify-items: start; }
.sv-faq__intro .sv-sec-title { font-size: var(--step-2); }
.sv-faq__intro p { color: var(--sv-soft); }
.sv-faq__intro h3 { font-size: var(--step-1); color: var(--sv-accent); }
.sv-faq__list { border-top: 1px solid var(--sv-line); min-width: 0; }
.sv-faq__list details { border-bottom: 1px solid var(--sv-line); }
.sv-faq__list summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 3rem 1fr 24px; gap: 16px; align-items: baseline; padding: 26px 0; }
.sv-faq__list summary::-webkit-details-marker { display: none; }
.sv-faq__list .n { font-family: var(--f-display); font-weight: 700; color: var(--sv-accent); font-variant-numeric: tabular-nums; }
.sv-faq__list summary h4 { font-size: var(--step-1); font-weight: 700; }
.sv-faq__list summary:hover h4 { color: var(--sv-accent); }
.sv-faq__list .chev { width: 20px; height: 20px; color: var(--sv-accent); transition: transform .2s ease; align-self: center; }
.sv-faq__list details[open] .chev { transform: rotate(45deg); }
.sv-faq__list .body { padding: 0 40px 28px calc(3rem + 16px); color: var(--sv-soft); display: grid; gap: 12px; }
.sv-faq__list .body ul { margin: 0; padding-left: 1.1em; display: grid; gap: 6px; }
.sv-faq__list .body li::marker { color: var(--sv-accent); }
.sv-faq__list .body em { color: var(--sv-head); font-weight: 700; font-style: normal; }

/* ---------- Призив за действие ---------- */
.sv-cta__grid { display: grid; grid-template-columns: 1fr auto; gap: 32px; align-items: center; }
.sv-cta h2 { font-size: var(--step-3); max-width: 22ch; }
.sv-cta p { color: var(--sv-accent); margin-top: 14px; }

/* ---------- Книга: допълнения към заглавната секция ---------- */
.sv-book-hero h1 em { font-style: normal; }
.sv-h1-main, .sv-h1-sub { display: block; }
.sv-h1-sub { font-size: .5em; font-weight: 700; letter-spacing: -.01em; color: var(--sv-accent); margin-top: .25em; line-height: 1.15; }
.sv-sticker {
	position: absolute; z-index: 2; right: -4%; top: -5%; width: clamp(78px, 10vw, 112px); aspect-ratio: 1; border-radius: 50%;
	background: var(--sun-warm); color: var(--ink); display: grid; place-content: center; text-align: center;
	font-family: var(--f-display); font-weight: 900; line-height: 1; transform: rotate(10deg);
}
.sv-sticker b { font-size: clamp(1.25rem, 2.2vw, 1.75rem); letter-spacing: -.02em; }
.sv-sticker span { font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; margin-top: 4px; }

/* ---------- Книга: плочки с букви (STREAMS) ---------- */
.sv-streams { background: var(--white); }
.sv-streams__head { display: grid; gap: 16px; justify-items: center; text-align: center; margin-bottom: clamp(32px, 5vw, 56px); }
.sv-streams__head p { color: var(--sv-soft); max-width: 60ch; }
.sv-streams__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--n, 7), minmax(0, 1fr)); gap: clamp(10px, 1.6vw, 20px); }
.sv-streams__list li {
	--c: var(--sv-accent);
	display: grid; justify-items: center; align-content: start; gap: 4px; text-align: center; padding: 18px 8px 20px; min-width: 0; margin: 0;
	background: var(--sv-card); border-top: 3px solid var(--c);
}
.sv-streams .ltr { font-family: var(--f-display); font-weight: 800; font-size: clamp(2.6rem, 5vw, 4rem); line-height: 1; color: var(--c); }
.sv-streams .bg { font-family: var(--f-display); font-weight: 700; line-height: 1.2; margin-top: 6px; overflow-wrap: anywhere; }
.sv-streams .en { font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: var(--sv-soft); font-weight: 700; }

/* ---------- Декорации (облаци, слънце, вълна), общи за всички секции ---------- */
.sv-section.has-decor { overflow: clip; } /* clip, не hidden: sticky елементите вътре продължават да работят */
.sv-section.has-decor > .sv-wrap { position: relative; z-index: 2; }
.sv-decor { position: absolute; display: block; pointer-events: none; z-index: 0; }
.sv-cloud { height: auto; color: #fff; opacity: .85; }
.sv-cloud--a { width: clamp(150px, 20vw, 280px); left: -3%; bottom: 14%; }
.sv-cloud--b { width: clamp(120px, 14vw, 200px); right: 4%; top: 10%; opacity: .7; }
.is-dark > .sv-cloud { opacity: .14; }
.is-dark > .sv-cloud--a { width: clamp(120px, 15vw, 220px); left: 4%; bottom: 8%; }
/* a big sun that peeks in from the bottom-right corner of its square (the svg only shows that quarter) and slowly turns */
.sv-sunface { right: -60px; top: 12%; width: clamp(200px, 28vw, 380px); height: auto; color: var(--sun-warm); opacity: .3; animation: sv-spin 60s linear infinite; }
.sv-wave { left: 0; width: 100%; height: var(--sv-wave); z-index: 1; }
.sv-wave--top { top: -1px; }
.sv-wave--bottom { bottom: -1px; }
/* the wave overlaps half of the section's own padding, so the content keeps a similar rhythm */
.sv-section.has-wave-top { padding-top: calc(var(--sv-pt) + var(--sv-wave) / 2); }
.sv-section.has-wave-bottom { padding-bottom: calc(var(--sv-pb) + var(--sv-wave) / 2); }
@keyframes sv-spin { to { transform: rotate(360deg); } }

/* ---------- Топ лента ---------- */
.sv-topbar { border-bottom: 1px solid var(--line); font-size: .8125rem; color: var(--ink-soft); background: var(--white); }
.sv-topbar .sv-wrap { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-block: 9px; }
.sv-topbar p { margin: 0; font-size: inherit; }
.sv-topbar .wp-block-social-links { gap: 0; margin: 0; padding: 0; font-size: inherit; line-height: inherit; }
.sv-topbar .wp-social-link { background: none !important; color: inherit !important; font-size: inherit; margin: 0; }
.sv-topbar .wp-social-link a { padding: 0; display: flex; align-items: center; gap: 8px; color: var(--ink-soft); text-decoration: none; }
.sv-topbar .wp-social-link a:hover { color: var(--blue); }
.sv-topbar .wp-social-link svg { width: 15px; height: 15px; }
.sv-topbar .wp-social-link a .wp-block-social-link-label { font-size: inherit; line-height: inherit; margin: 0; padding: 0; }
.sv-topbar .wp-social-link a { line-height: inherit; }

/* The sample's plain "f" instead of the social-links block's circular logo */
.sv-topbar .wp-social-link-facebook svg, .sv-footer .wp-social-link-facebook svg { display: none; }
.sv-topbar .wp-social-link-facebook a::before, .sv-footer .wp-social-link-facebook a::before {
	content: ""; flex: none; width: 15px; height: 15px; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.5 21v-7.5h2.6l.4-3h-3V8.6c0-.9.3-1.5 1.5-1.5h1.6V4.4c-.3 0-1.2-.1-2.3-.1-2.3 0-3.9 1.4-3.9 4v2.2H7.8v3h2.6V21h3.1z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.5 21v-7.5h2.6l.4-3h-3V8.6c0-.9.3-1.5 1.5-1.5h1.6V4.4c-.3 0-1.2-.1-2.3-.1-2.3 0-3.9 1.4-3.9 4v2.2H7.8v3h2.6V21h3.1z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.sv-footer .wp-social-link-facebook a::before { width: 18px; height: 18px; }

/* ---------- Хедър и меню ---------- */
header.wp-block-template-part { position: sticky; top: 0; z-index: 50; }
.admin-bar header.wp-block-template-part { top: 32px; }
@media (max-width: 782px) { .admin-bar header.wp-block-template-part { top: 46px; } }
/* No backdrop-filter here: it would make the header the containing block of the fixed mobile-menu overlay and clip it. */
.sv-header { background: rgba(255, 255, 255, .96); border-bottom: 1px solid var(--line); }
.sv-header .sv-wrap { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-block: 16px; }
.sv-header .wp-block-site-logo { margin: 0; line-height: 0; }
.sv-header .wp-block-site-logo img { height: 46px; width: auto; }

.sv-nav .wp-block-navigation__container { gap: 36px; align-items: center; }
.sv-nav .wp-block-navigation-item__content {
	font-family: var(--f-display); font-weight: 600; font-size: .98rem; text-decoration: none;
	color: var(--ink); padding: 6px 0; border-bottom: 2px solid transparent;
}
.sv-nav .wp-block-navigation-item__content:hover { color: var(--blue); }
.sv-nav .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content { color: var(--blue); border-bottom-color: var(--sun-gold); }
.sv-nav .sv-nav-btn > .wp-block-navigation-item__content {
	background: var(--blue); color: var(--white); padding: 11px 18px; border-radius: var(--r); border: 1.5px solid transparent; border-bottom: 0;
	transition: background .2s ease;
}
.sv-nav .sv-nav-btn > .wp-block-navigation-item__content:hover { background: var(--blue-deep); color: var(--white); }
/* Don't set `display` here: core hides the open button on desktop and the close button until the overlay opens. */
.sv-nav .wp-block-navigation__responsive-container-open,
.sv-nav .wp-block-navigation__responsive-container-close {
	border: 1px solid var(--line); border-radius: var(--r); width: 44px; height: 44px;
	align-items: center; justify-content: center; color: var(--ink);
}
.sv-nav .wp-block-navigation__responsive-container.is-menu-open { padding: 0; background: var(--white); }
.sv-nav .is-menu-open .wp-block-navigation__responsive-dialog { padding: 16px max(16px, 4vw) 28px; }
.sv-nav .is-menu-open .wp-block-navigation__responsive-container-content { width: 100%; padding-top: 24px; align-items: stretch !important; justify-content: flex-start; }
.sv-nav .is-menu-open .wp-block-navigation__container { gap: 0; width: 100%; align-items: stretch !important; justify-content: flex-start; }
.sv-nav .is-menu-open .wp-block-navigation-item { width: 100%; align-items: stretch !important; }
.sv-nav .is-menu-open .wp-block-navigation-item__content { display: block; padding: 14px 0 !important; border-bottom: 1px solid var(--line); text-align: left; }
.sv-nav .is-menu-open .current-menu-item > .wp-block-navigation-item__content { box-shadow: inset 3px 0 0 var(--sun-gold); padding-left: 12px !important; }
.sv-nav .is-menu-open .sv-nav-btn > .wp-block-navigation-item__content { margin-top: 14px; text-align: center; border: 1.5px solid transparent; box-shadow: none; padding: 14px 18px !important; }

/* ---------- Футър ---------- */
.sv-footer { background: var(--blue-deep); color: #c9d6ef; }
.sv-footer .sv-wrap { padding-block: 72px 28px; display: grid; gap: 48px; }
.sv-footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 40px; align-items: start; }
.sv-footer-grid > * { margin: 0; min-width: 0; }
.sv-footer h4 { color: var(--white); font-size: .78rem; margin: 0 0 18px; letter-spacing: .16em; text-transform: uppercase; font-family: var(--f-display); font-weight: 700; }
.sv-footer a { color: #c9d6ef; text-decoration: none; }
.sv-footer a:hover { color: var(--white); }
.sv-footer .wp-block-site-logo { display: inline-block; background: var(--white); padding: 12px 16px; border-radius: var(--r); line-height: 0; margin: 0; }
.sv-footer .wp-block-site-logo img { height: 40px; width: auto; }
.sv-footer p { margin: 0; }
.sv-footer .sv-footer-about { max-width: 36ch; color: #a9bbdf; font-size: .95rem; margin-top: 20px; }
.sv-footer .wp-block-navigation { display: block; }
.sv-footer .wp-block-navigation .wp-block-navigation__container { display: flex; gap: 10px; align-items: flex-start; flex-direction: column; }
.sv-footer .wp-block-navigation-item__content { color: #c9d6ef; padding: 0; line-height: 1.65; }
.sv-footer .wp-block-social-links { gap: 0; margin: 0; padding: 0; font-size: inherit; line-height: inherit; }
.sv-footer .wp-social-link { background: none !important; color: inherit !important; margin: 0; font-size: inherit; }
.sv-footer .wp-social-link a { padding: 0; display: flex; align-items: center; gap: 10px; color: #c9d6ef; }
.sv-footer .wp-social-link a:hover { color: var(--white); }
.sv-footer .wp-social-link svg { width: 18px; height: 18px; }
.sv-footer .wp-social-link a .wp-block-social-link-label { font-size: inherit; line-height: inherit; margin: 0; padding: 0; }
.sv-footer .wp-social-link a { line-height: inherit; }
.sv-footer-bottom { border-top: 1px solid rgba(255, 255, 255, .14); padding-top: 22px; font-size: .85rem; color: #8ea4cf; }
.sv-footer-bottom p { margin: 0; }

/* ---------- Обикновени страници и блог ---------- */
.sv-page { padding-block: clamp(40px, 6vw, 80px); }
.sv-page .wp-block-post-title, .sv-page .sv-page-title, .sv-page .wp-block-query-title { font-family: var(--f-display); font-size: var(--step-4); font-weight: 800; letter-spacing: -.025em; margin-bottom: 32px; }
.sv-posts .wp-block-post-title { font-size: var(--step-2); }
.sv-posts .wp-block-post-title a { text-decoration: none; color: var(--ink); }
.sv-posts .wp-block-post-title a:hover { color: var(--blue); }
.sv-posts .wp-block-post { padding-block: 28px; border-bottom: 1px solid var(--line); }

/* ---------- Адаптивност ---------- */
@media (max-width: 960px) {
	.sv-hero__grid, .sv-mission__grid, .sv-pillars__head, .sv-feature__grid, .sv-roadmap__grid, .sv-quote__grid, .sv-contact__grid,
	.sv-book-hero__grid, .sv-about__grid, .sv-author__grid, .sv-faq__grid, .sv-cta__grid { grid-template-columns: 1fr; }
	.sv-shelf-art { justify-self: start; max-width: 460px; }
	.sv-stages__grid { grid-template-columns: 1fr 1fr; }
	.sv-stage:nth-child(3) { border-left: 0; padding-left: 0; }
	.sv-stage:nth-child(n+3) { border-top: 1px solid var(--sv-line); }
	.sv-pillars__items { grid-template-columns: 1fr; }
	.sv-pillar + .sv-pillar { border-left: 0; border-top: 1px solid var(--sv-line); }
	.sv-book-hero__art, .sv-author__photo, .sv-faq__intro { position: static; }
	.sv-author__photo { max-width: 420px; }
	.sv-shelf__items { grid-template-columns: repeat(2, 1fr); }
	.sv-quick { grid-template-columns: 1fr 1fr; }
	.sv-quick > div:nth-child(3) { border-left: 0; }
	.sv-quick > div:nth-child(n+3) { border-top: 1px solid var(--sv-line); }
	.sv-footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 782px) {
	.sv-topbar .sv-hide-sm { display: none; }
}
@media (max-width: 560px) {
	.sv-stages__grid { grid-template-columns: 1fr; }
	.sv-stage + .sv-stage { border-left: 0; padding-left: 0; border-top: 1px solid var(--sv-line); }
	.sv-specs-mini > div, .sv-specs dl > div { grid-template-columns: 1fr; gap: 0; }
	.sv-roadmap__list li { grid-template-columns: 2.2rem 1fr; }
	.sv-roadmap .tag { grid-column: 2; }
	.sv-inside, .sv-stats { grid-template-columns: 1fr; }
	.sv-inside li:nth-child(even) { padding-left: 0; border-left: 0; }
	.sv-stats div + div { padding-left: 0; border-left: 0; }
	.sv-stats div { padding-bottom: 18px; border-bottom: 1px solid var(--sv-line); }
	.sv-keys { grid-template-columns: 1fr; }
	.sv-keys li + li { border-left: 0; padding-left: 0; border-top: 1px solid var(--sv-line); }
	.sv-faq__list summary { grid-template-columns: 2.2rem 1fr 20px; gap: 10px; }
	.sv-faq__list .body { padding: 0 0 24px; }
	.sv-footer-grid { grid-template-columns: 1fr; }
}
/* ==========================================================================
   Игрив стил — „Уча и играя“ (секция с .sv-look-kids; хедърът следва първата секция на страницата).
   Подменя токените на синия стил с палитрата от корицата и добавя по-меки форми.
   ========================================================================== */
.sv-look-kids, body.sv-page-kids .sv-topbar, body.sv-page-kids .sv-header {
	--blue: var(--berry);
	--blue-deep: var(--berry-deep);
	--mist: var(--cream);
	--paper: var(--cream);
	--ink: #272256;
	--ink-soft: #675b72;
	--line: #f1dcbc;
	--r: 999px;
}
.sv-look-kids.sv-section.is-dark { --sv-accent: var(--peach); --sv-soft: #ffe9cf; }

/* Стандартни фонове */
.sv-look-kids.sv-shelf { background: var(--mist); }
.sv-look-kids.sv-author { background: var(--white); }
.sv-look-kids.sv-faq { background: var(--peach); }
.sv-look-kids.sv-book-hero:not(.has-custom-bg) {
	background:
		radial-gradient(ellipse at 24% 36%, rgba(255, 255, 255, .7), transparent 55%),
		linear-gradient(180deg, #ffeccc 0%, #ffd9a0 100%);
}

/* Общи компоненти */
.sv-look-kids.is-light .sv-eyebrow { color: var(--berry-deep); }
.sv-look-kids .sv-sec-title { font-weight: 800; }
.sv-look-kids .sv-eyebrow::before { width: 12px; height: 12px; border-radius: 50%; background: var(--sunny); box-shadow: 0 0 0 4px rgba(255, 201, 60, .35); }
.sv-look-kids .sv-btn { font-weight: 800; padding: 15px 26px; border-width: 2px; transition: transform .15s ease, box-shadow .15s ease, background .2s ease, color .2s ease, border-color .2s ease; }
.sv-look-kids .sv-btn--blue { background: var(--berry); box-shadow: 0 4px 0 var(--berry-deep); }
.sv-look-kids .sv-btn--blue:hover { background: var(--berry); transform: translateY(2px); box-shadow: 0 2px 0 var(--berry-deep); }
.sv-look-kids .sv-btn--sun { box-shadow: 0 4px 0 #d9a400; }
.sv-look-kids .sv-btn--sun:hover { background: var(--sun-warm); transform: translateY(2px); box-shadow: 0 2px 0 #d9a400; }
.sv-look-kids .sv-btn--line { background: var(--white); border-color: var(--peach-deep); }
.sv-look-kids .sv-btn--line:hover { border-color: var(--berry); color: var(--berry-deep); }
.sv-look-kids .sv-ph-note { border-color: #d9b98a; }
.sv-look-kids .sv-sunface { color: var(--sunny); }

/* Топ лента и хедър */
body.sv-page-kids .sv-topbar { background: var(--cream); border-bottom-color: var(--peach); }
body.sv-page-kids .sv-header { border-bottom: 3px solid var(--peach); }
body.sv-page-kids .sv-nav .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content { border-bottom-color: var(--sunny); border-bottom-width: 3px; }
body.sv-page-kids .sv-nav .sv-nav-btn > .wp-block-navigation-item__content { box-shadow: 0 3px 0 var(--berry-deep); font-weight: 800; }
body.sv-page-kids .sv-nav .wp-block-navigation__responsive-container-open,
body.sv-page-kids .sv-nav .wp-block-navigation__responsive-container-close { border-color: var(--peach-deep); }
body.sv-page-kids .sv-nav .is-menu-open .current-menu-item > .wp-block-navigation-item__content { box-shadow: inset 3px 0 0 var(--sunny); }

/* Заглавна секция */
.sv-look-kids.sv-book-hero { overflow: clip; --sv-pt: clamp(28px, 4vw, 52px); }
.sv-look-kids .sv-book-hero__grid { grid-template-columns: .95fr 1.05fr; align-items: center; gap: clamp(32px, 5vw, 80px); }
.sv-look-kids .sv-book-hero__art { background: none; padding: 0; display: grid; justify-items: center; }
.sv-look-kids .sv-book-hero__art::before { /* лъчи зад корицата */
	content: ""; position: absolute; z-index: 0; left: 50%; top: 42%; width: 230%; aspect-ratio: 1; transform: translate(-50%, -50%);
	background: repeating-conic-gradient(from 0deg, rgba(255, 255, 255, .4) 0 6deg, transparent 6deg 18deg);
	-webkit-mask-image: radial-gradient(circle, #000 0, transparent 38%); mask-image: radial-gradient(circle, #000 0, transparent 38%);
	pointer-events: none;
}
.sv-look-kids .sv-cover-frame { z-index: 1; width: 100%; max-width: 520px; transform: rotate(-2deg); }
.sv-look-kids .sv-cover-frame .sv-book-photo img {
	box-sizing: border-box; border: 8px solid var(--white); border-radius: 26px;
	box-shadow: 0 3px 0 rgba(143, 48, 71, .12), 0 28px 50px -22px rgba(143, 48, 71, .55), 0 50px 70px -50px rgba(143, 48, 71, .4);
}
.sv-look-kids .sv-sticker { background: var(--sunny); color: var(--berry-deep); border: 4px solid var(--white); box-shadow: 0 6px 0 rgba(143, 48, 71, .22); }
.sv-look-kids .sv-book-hero__art .sv-ph-note { position: relative; z-index: 1; margin-top: 32px; background: rgba(255, 255, 255, .8); }
.sv-look-kids .sv-book-hero__copy { position: relative; z-index: 1; gap: 24px; }
.sv-look-kids.sv-book-hero h1 {
	display: grid; gap: .1em; font-weight: 900; letter-spacing: 0; line-height: .95; text-transform: uppercase;
	font-size: clamp(2.7rem, 1.3rem + 5vw, 5rem); color: var(--berry);
	-webkit-text-stroke: .13em var(--white); paint-order: stroke fill; filter: drop-shadow(0 .06em 0 rgba(143, 48, 71, .28));
}
.sv-look-kids.sv-book-hero h1 em { text-transform: none; font-size: .78em; }
.sv-look-kids .sv-h1-sub { color: var(--leaf); font-size: .5em; letter-spacing: .01em; margin-top: .1em; font-weight: 900; line-height: inherit; }
.sv-look-kids .sv-by { margin-top: 0; }
.sv-look-kids .sv-keys { display: flex; flex-wrap: wrap; gap: 10px; border: 0; }
.sv-look-kids .sv-keys li, .sv-look-kids .sv-keys li + li {
	--c: var(--azure); font-weight: 800; color: var(--ink); padding: 8px 16px 8px 12px; border-radius: 999px; background: var(--white);
	border: 2px solid color-mix(in srgb, var(--c) 55%, #fff); display: inline-flex; align-items: center; gap: 9px;
}
.sv-look-kids .sv-keys li:nth-child(3n+2) { --c: var(--tang); }
.sv-look-kids .sv-keys li:nth-child(3n) { --c: var(--grape); }
.sv-look-kids .sv-keys li::before { content: ""; width: 12px; height: 12px; border-radius: 50%; background: var(--c); flex: none; }
.sv-look-kids .sv-golden { font-weight: 700; line-height: 1.35; }
.sv-look-kids .sv-golden mark { background: linear-gradient(transparent 52%, #ffd34d 52% 92%, transparent 92%); border-radius: 4px; padding-inline: 2px; }
.sv-look-kids.sv-book-hero .sv-lead { color: #5a4d68; }
.sv-look-kids .sv-quick { border: 0; gap: 10px; }
.sv-look-kids .sv-quick > div, .sv-look-kids .sv-quick > div + div { padding: 14px 16px; background: var(--white); border: 2px solid var(--peach); border-radius: 18px; }
.sv-look-kids .sv-quick dt { font-weight: 700; }
.sv-look-kids .sv-quick dd { font-weight: 800; }

/* STREAMS */
.sv-look-kids.sv-streams { padding-block: clamp(56px, 8vw, 104px); }
.sv-look-kids .sv-c-azure { --c: var(--azure); }
.sv-look-kids .sv-c-tang { --c: var(--tang); }
.sv-look-kids .sv-c-leaf { --c: var(--leaf); }
.sv-look-kids .sv-c-grape { --c: var(--grape); }
.sv-look-kids .sv-c-poppy { --c: var(--poppy); }
.sv-look-kids .sv-c-sunny { --c: var(--sunny); }
.sv-look-kids .sv-c-teal { --c: var(--teal); }
.sv-look-kids .sv-c-berry { --c: var(--berry); }
.sv-look-kids .sv-streams__list li {
	padding: 18px 8px 20px; border-radius: 26px; background: color-mix(in srgb, var(--c) 15%, #fff);
	border: 2px solid color-mix(in srgb, var(--c) 40%, #fff); transform: rotate(var(--tilt, -1.5deg)); transition: transform .2s ease;
}
.sv-look-kids .sv-streams__list li:nth-child(even) { --tilt: 1.5deg; }
.sv-look-kids .sv-streams__list li:hover { transform: rotate(0) translateY(-6px); }
.sv-look-kids.sv-streams .ltr {
	font-weight: 900; font-size: clamp(3rem, 5.4vw, 4.6rem);
	-webkit-text-stroke: .05em color-mix(in srgb, var(--c) 55%, #000); paint-order: stroke fill; text-shadow: 0 .06em 0 color-mix(in srgb, var(--c) 55%, #000);
}
.sv-look-kids.sv-streams .bg { font-weight: 800; }

/* За изданието */
.sv-look-kids .sv-inside { border-top: 0; gap: 12px; }
.sv-look-kids .sv-inside li, .sv-look-kids .sv-inside li:nth-child(even) {
	--c: var(--azure); grid-template-columns: 44px 1fr; gap: 14px; align-items: center; padding: 14px 16px 14px 14px;
	background: var(--white); border: 2px solid var(--peach); border-radius: 20px; font-weight: 700; color: var(--ink);
}
.sv-look-kids .sv-inside li:nth-child(4n+2) { --c: var(--tang); }
.sv-look-kids .sv-inside li:nth-child(4n+3) { --c: var(--leaf); }
.sv-look-kids .sv-inside li:nth-child(4n) { --c: var(--grape); }
.sv-look-kids .sv-inside svg { box-sizing: content-box; width: 24px; height: 24px; padding: 10px; border-radius: 50%; background: color-mix(in srgb, var(--c) 22%, #fff); color: color-mix(in srgb, var(--c) 70%, #000); }
.sv-look-kids .sv-specs { border: 2px solid var(--peach); border-radius: 28px; padding: clamp(28px, 3.5vw, 40px) clamp(24px, 3.5vw, 36px) clamp(24px, 3.5vw, 36px); overflow: hidden; }
.sv-look-kids .sv-specs::before {
	inset: 0 0 auto; height: 10px;
	background: linear-gradient(90deg, var(--azure) 0 14.28%, var(--tang) 0 28.56%, var(--leaf) 0 42.84%, var(--grape) 0 57.12%, var(--poppy) 0 71.4%, var(--sunny) 0 85.68%, var(--teal) 0);
}
.sv-look-kids .sv-specs dl > div { border-top: 2px dashed var(--peach); }
.sv-look-kids .sv-specs dd { font-weight: 800; }

/* За автора */
.sv-look-kids .sv-author__photo { border-radius: 999px 999px 28px 28px; border: 6px solid var(--peach); background: linear-gradient(160deg, #ffe3bb, #fff3dc); overflow: hidden; }
.sv-look-kids .sv-author__photo img { border-radius: 0; }
.sv-look-kids .sv-photo-ph::before { background: repeating-linear-gradient(135deg, transparent 0 22px, rgba(192, 74, 99, .06) 22px 23px); }
.sv-look-kids .sv-stats { border-top: 0; gap: 12px; margin-top: 12px; }
.sv-look-kids .sv-stats div, .sv-look-kids .sv-stats div + div { --c: var(--berry); padding: 20px 18px; background: var(--cream); border: 2px dashed var(--peach-deep); border-radius: 22px; }
.sv-look-kids .sv-stats div:nth-child(3n+2) { --c: #2f7fb8; }
.sv-look-kids .sv-stats div:nth-child(3n) { --c: #3f7d1f; }
.sv-look-kids .sv-stats b { font-weight: 900; color: var(--c); }

/* Други издания */
.sv-look-kids .sv-shelf__items { gap: clamp(16px, 2.5vw, 32px); }
.sv-look-kids .sv-shelf__frame { --t: #ffe9c6; background: var(--t); border-radius: 28px; }
.sv-look-kids .sv-shelf__items figure:nth-child(4n+2) .sv-shelf__frame { --t: #dff0fb; }
.sv-look-kids .sv-shelf__items figure:nth-child(4n+3) .sv-shelf__frame { --t: #e6f4d8; }
.sv-look-kids .sv-shelf__items figure:nth-child(4n) .sv-shelf__frame { --t: #f0e4f6; }
.sv-look-kids .sv-cover { border-radius: 3px 8px 8px 3px; }
.sv-look-kids .sv-cover--sky { --bg: #fff1dc; --band: var(--tang); }
.sv-look-kids .sv-cover .c-mark { color: var(--sunny); }
.sv-look-kids .sv-shelf__items figcaption { font-weight: 800; }

/* Лято с кауза */
.sv-look-kids .sv-faq__intro p { color: #5a4d68; }
.sv-look-kids .sv-faq__intro h3 { color: var(--berry-deep); }
.sv-look-kids .sv-faq__list { border-top: 0; display: grid; gap: 14px; }
.sv-look-kids .sv-faq__list details {
	--c: var(--azure); background: var(--white); border: 2px solid var(--white); border-radius: 24px;
	box-shadow: 0 4px 0 rgba(143, 48, 71, .1); transition: border-color .2s ease;
}
.sv-look-kids .sv-faq__list details:nth-child(4n+2) { --c: var(--tang); }
.sv-look-kids .sv-faq__list details:nth-child(4n+3) { --c: var(--leaf); }
.sv-look-kids .sv-faq__list details:nth-child(4n) { --c: var(--grape); }
.sv-look-kids .sv-faq__list details[open] { border-color: color-mix(in srgb, var(--c) 60%, #fff); }
.sv-look-kids .sv-faq__list summary { grid-template-columns: 44px 1fr 28px; gap: 16px; align-items: center; padding: 18px 20px; }
.sv-look-kids .sv-faq__list .n { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: color-mix(in srgb, var(--c) 24%, #fff); color: var(--ink); font-weight: 800; }
.sv-look-kids .sv-faq__list summary h4 { font-weight: 800; }
.sv-look-kids .sv-faq__list summary:hover h4 { color: var(--berry-deep); }
.sv-look-kids .sv-faq__list .chev { box-sizing: border-box; width: 28px; height: 28px; padding: 5px; border-radius: 50%; background: var(--cream); color: var(--berry); }
.sv-look-kids .sv-faq__list .body { padding: 0 28px 26px calc(44px + 16px + 20px); }
.sv-look-kids .sv-faq__list .body li::marker { color: var(--c); }

/* Призив за действие */
.sv-look-kids.sv-cta h2 { font-weight: 900; }

@media (max-width: 960px) {
	.sv-streams__list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.sv-look-kids .sv-book-hero__grid { grid-template-columns: 1fr; }
	.sv-look-kids .sv-book-hero__art { max-width: 460px; margin-inline: auto; width: 100%; }
}
@media (max-width: 560px) {
	.sv-streams__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.sv-streams__list li:last-child:nth-child(odd) { grid-column: 1 / -1; }
	.sv-look-kids .sv-cover-frame { max-width: 88%; }
	.sv-look-kids .sv-faq__list summary { grid-template-columns: 38px 1fr 24px; gap: 12px; padding: 16px; }
	.sv-look-kids .sv-faq__list .n { width: 38px; height: 38px; }
	.sv-look-kids .sv-faq__list .body { padding: 0 18px 22px; }
	.sv-look-kids .sv-stats div, .sv-look-kids .sv-stats div + div { padding: 20px 18px; }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
