/* ── Контейнер контенту (Figma: Main → Контент) ───────────── */
.l-content{display:flex;flex-direction:column;gap:8.8rem;padding:4rem 4.8rem 9.6rem}

/* ── Hero / Слайдер  1064×520 ─────────────────────────────── */
/* Swiper ставить блоку margin-inline:auto. У flex-колонці це скасовує
   розтягування, і секція схлопується в нуль — тому ширину задаємо явно. */
.s-hero{position:relative;align-self:stretch;margin-inline:0;height:52rem;border-radius:2.8rem;overflow:hidden;box-shadow:var(--e-hero)}
/* Перемиканням слайдів керує Swiper (перехресне затухання).
   Нам лишається лише розкладка всередині слайда за макетом. */
.s-hero__slide{position:relative;width:100%;height:100%;overflow:hidden}
.s-hero__slide picture{display:contents}
.s-hero .swiper-wrapper{height:100%}
.s-hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* Затемнення з макета розраховане на темне фото. Ілюстрації розділів
   світлі, тому додаємо другий м'який шар під самим текстом —
   підпис лишається читабельним на будь-якому зображенні. */
.s-hero__scrim{position:absolute;inset:0;
  background:linear-gradient(90deg, rgba(14,31,46,.68) 0%, rgba(14,31,46,.34) 42%, rgba(14,31,46,0) 78%)}
.s-hero__slide.is-dim::after{content:"";position:absolute;left:0;top:0;width:62%;height:100%;pointer-events:none;
  background:linear-gradient(90deg, rgba(14,31,46,.30) 0%, rgba(14,31,46,0) 100%)}
.s-hero__text{z-index:1}
.s-hero__text{position:absolute;left:9.6rem;top:10.8rem;width:52rem}
.s-hero__overline{font:600 1.2rem/1.6rem var(--f-body);letter-spacing:0.096rem;text-transform:uppercase;color:#FFD1DE}
.s-hero__title{margin-top:1.6rem;font:700 5.6rem/6.4rem var(--f-head);letter-spacing:-0.084rem;color:#fff}
.s-hero__sub{margin-top:1.8rem;font:400 1.8rem/3rem var(--f-body);color:rgba(255,255,255,.9)}
.s-hero__actions{margin-top:3.2rem;display:flex;gap:1.4rem}
.s-hero__arrow{position:absolute;z-index:3;top:23.8rem;width:4.4rem;height:4.4rem;border-radius:var(--r-full);
  background:var(--c-bg-surface);color:var(--c-text-primary);display:grid;place-items:center;box-shadow:var(--e-float)}
.s-hero__arrow--prev{left:2.4rem}
.s-hero__arrow--next{left:99.6rem}
.s-hero__arrow svg{width:2rem;height:2rem}
/* Swiper вішає на елемент свої класи пагінації й тягне власну
   позицію знизу по центру. Селектор із трьох класів переважує її. */
.s-hero .s-hero__dots.swiper-pagination-bullets{position:absolute;z-index:3;left:9.6rem;right:auto;top:45.2rem;bottom:auto;width:auto;
  transform:none;display:flex;align-items:center;gap:0.8rem}
.s-hero .s-hero__dots .s-hero__dot{width:0.8rem;height:0.8rem;margin:0;border-radius:var(--r-full);background:rgba(255,255,255,.55);opacity:1;padding:0}
.s-hero .s-hero__dots .s-hero__dot.is-active{width:2.2rem;background:var(--c-brand-primary)}

/* ── Спільні елементи секцій ──────────────────────────────── */
.s-title-center{display:flex;flex-direction:column;align-items:center;gap:0.6rem}
.s-title-center__h{font:700 3.6rem/4.4rem var(--f-head);letter-spacing:-0.018rem;color:var(--c-text-primary);text-align:center}
.s-title-center__flourish{display:block;line-height:0;width:10.4rem;height:1.4rem;color:var(--c-brand-rose)}
.s-title-center__flourish svg{width:10.4rem;height:1.4rem}
.s-title-row{display:flex;align-items:center;gap:1.2rem;height:4rem}
.s-title-row__icon{display:block;line-height:0;width:2.2rem;height:2.2rem;color:var(--c-brand-primary);flex:0 0 auto}
.s-title-row__icon svg{width:2.2rem;height:2.2rem}
.s-title-row__h{flex:1 1 auto;font:600 2.6rem/3.4rem var(--f-head);color:var(--c-text-primary)}
.s-title-row__link{font:600 1.4rem/2rem var(--f-body);color:var(--c-brand-primary);white-space:nowrap}

.c-badge{display:inline-flex;align-items:center;justify-content:center;height:2.4rem;min-width:7rem;padding:0 1.1rem;
  border-radius:var(--r-full);font:600 1.1rem/1.4rem var(--f-body);letter-spacing:0.044rem;color:var(--c-text-inverse)}
.c-badge--knyga{background:var(--c-cat-knyga)}
.c-badge--virsh{background:var(--c-cat-virsh)}
.c-badge--kazka{background:var(--c-cat-kazka)}
.c-badge--pisnya{background:var(--c-cat-pisnya)}
.c-badge--animaciya{background:var(--c-cat-animaciya)}
.c-badge--video{background:var(--c-cat-video)}
.c-badge--novynka{background:var(--c-brand-primary)}

.c-meta{display:inline-flex;align-items:center;gap:0.6rem;white-space:nowrap;line-height:1.8rem;font:500 1.3rem/1.8rem var(--f-body);color:var(--c-text-muted)}
.c-meta svg{width:1.5rem;height:1.5rem;flex:0 0 auto}

.c-like{width:3.4rem;height:3.4rem;border-radius:var(--r-full);background:var(--c-bg-surface);
  color:var(--c-text-primary);display:grid;place-items:center;box-shadow:var(--e-float);flex:0 0 auto}
.c-like svg{width:2rem;height:2rem}

/* ── Секція / Моя творчість  1064×600 ─────────────────────── */
.s-cats{display:flex;flex-direction:column;gap:3.4rem}
.s-cats__head{display:flex;flex-direction:column;align-items:center;gap:1.4rem}
.s-cats__sub{font:400 1.8rem/3rem var(--f-body);color:var(--c-text-secondary);text-align:center}
.s-cats__grid{display:flex;gap:2.4rem}
.c-card-cat{flex:1 1 0;min-width:0;display:flex;flex-direction:column;background:var(--c-bg-surface);
  border-radius:1.8rem;overflow:hidden;box-shadow:var(--e-card);text-decoration:none}
.c-card-cat:hover{box-shadow:var(--e-card-hover);text-decoration:none}
.c-card-cat__img{width:100%;height:29.2rem;object-fit:cover;display:block}
.c-card-cat__body{display:flex;flex-direction:column;gap:0.9rem;padding:2rem}
.c-card-cat__title{font:600 1.8rem/2.6rem var(--f-head);color:var(--c-text-primary)}
.c-card-cat__desc{font:400 1.4rem/2.2rem var(--f-body);color:var(--c-text-secondary)}
.c-card-cat__cta{display:inline-flex;align-items:center;gap:0.7rem;height:3.8rem;
  font:600 1.3rem/1.8rem var(--f-body);color:var(--c-brand-primary)}
.c-card-cat__cta svg{width:1.8rem;height:1.8rem}

/* ── Секція / Останні новинки  1064×402 ───────────────────── */
.s-latest{display:flex;flex-direction:column;gap:3rem}
.s-latest__grid{display:flex;gap:2.4rem}
.c-card-media{flex:1 1 0;min-width:0;display:flex;flex-direction:column;background:var(--c-bg-surface);
  border-radius:1.8rem;overflow:hidden;box-shadow:var(--e-card)}
.c-card-media:hover{box-shadow:var(--e-card-hover)}
.c-card-media__media{position:relative;height:16.8rem}
.c-card-media__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.c-card-media__top{position:relative;display:flex;align-items:flex-start;justify-content:space-between;padding:1.2rem}
.c-card-media__body{display:flex;flex-direction:column;gap:0.8rem;padding:1.8rem 1.8rem 1.6rem}
.c-card-media__title{font:600 1.8rem/2.6rem var(--f-head);color:var(--c-text-primary)}
.c-card-media__desc{font:400 1.4rem/2.2rem var(--f-body);color:var(--c-text-secondary)}
.c-card-media__foot{display:flex;align-items:center;justify-content:space-between;padding-top:0.6rem;height:4.4rem}
.c-card-media__cta{display:inline-flex;align-items:center;gap:0.7rem;height:3.8rem;white-space:nowrap;
  font:600 1.3rem/1.8rem var(--f-body);color:var(--c-brand-primary)}
.c-card-media__cta svg{width:1.8rem;height:1.8rem}

/* ── Секція / Книжки автора  1064×636 ─────────────────────── */
.s-books{display:flex;flex-direction:column;gap:3rem}
.s-books__grid{display:flex;gap:2.4rem}
.c-card-book{flex:1 1 0;min-width:0;display:flex;flex-direction:column;background:var(--c-bg-surface);
  border-radius:1.8rem;overflow:hidden;box-shadow:var(--e-card)}
.c-card-book:hover{box-shadow:var(--e-card-hover)}
.c-card-book__cover{position:relative;height:31.6rem}
.c-card-book__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.c-card-book__badge{position:relative;display:inline-flex;margin:1.2rem 0 0 1.2rem}
.c-card-book__body{flex:1 1 auto;display:flex;flex-direction:column;justify-content:space-between;gap:0.8rem;padding:1.8rem;height:25rem}
.c-card-book__title{font:600 1.8rem/2.6rem var(--f-head);color:var(--c-text-primary)}
.c-card-book__desc{font:400 1.4rem/2.2rem var(--f-body);color:var(--c-text-secondary)}
.c-card-book__meta{display:flex;align-items:center;gap:1.6rem;padding-top:0.4rem;height:2.2rem}
.c-card-book__price{display:flex;align-items:center;gap:0.8rem;padding-top:0.2rem;height:2.6rem;
  font:700 1.8rem/2.4rem var(--f-body);color:var(--c-text-primary)}
.c-card-book__cta{display:flex;align-items:center;justify-content:center;gap:0.7rem;height:3.8rem;
  border-radius:1.2rem;background:var(--c-brand-primary);color:var(--c-text-inverse);
  font:600 1.3rem/1.8rem var(--f-body);box-shadow:var(--e-button)}
.c-card-book__cta:hover{background:var(--c-brand-primary-hover);text-decoration:none}
.c-card-book__cta svg{width:1.8rem;height:1.8rem}

/* ── Секція / Слухати  1064×422 ───────────────────────────── */
.s-listen{display:flex;flex-direction:column;gap:3rem}
.s-listen__row{display:flex;gap:3.2rem}
.c-player{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:2rem;
  padding:2.4rem 2.4rem 2.2rem;background:var(--c-bg-surface);border-radius:2rem;box-shadow:var(--e-card)}
.c-player__track{display:flex;align-items:center;gap:1.6rem;height:8.8rem}
.c-player__cover{width:8.4rem;height:8.4rem;border-radius:1.4rem;object-fit:cover;flex:0 0 auto}
.c-player__info{display:flex;flex-direction:column;gap:0.7rem;align-items:flex-start}
.c-player__title{font:600 2rem/2.8rem var(--f-head);color:var(--c-text-primary)}
.c-player__sub{font:400 1.4rem/2.2rem var(--f-body);color:var(--c-text-secondary)}
.c-wave{display:flex;align-items:center;gap:0.4rem;height:4.4rem}
.c-wave__bar{width:0.3rem;border-radius:0.2rem;background:var(--c-border-strong);flex:0 0 auto}
.c-wave__bar.is-played{background:var(--c-brand-primary)}
.c-player__controls{display:flex;align-items:center;gap:1.4rem;height:5.2rem}
.c-player__time{font:500 1.3rem/1.8rem var(--f-body);color:var(--c-text-muted)}
.c-player__spacer{flex:1 1 auto}
.c-player__step{width:2rem;height:2rem;color:var(--c-text-secondary);flex:0 0 auto;display:grid;place-items:center}
.c-player__step svg{width:2rem;height:2rem}
.c-player__play{width:5.2rem;height:5.2rem;border-radius:var(--r-full);background:var(--c-brand-primary);
  color:#fff;display:grid;place-items:center;flex:0 0 auto}
.c-player__play svg{width:1.8rem;height:1.8rem}
.c-player__extra{display:flex;align-items:center;gap:1rem;padding-top:0.4rem;height:2.2rem}
.c-player__extra svg{width:1.8rem;height:1.8rem;flex:0 0 auto}
.c-player__vol{width:1.8rem;height:1.8rem;color:var(--c-text-muted)}
.c-player__volbar{width:8rem;height:0.4rem;border-radius:var(--r-full);background:var(--c-border-strong);flex:0 0 auto}
.c-player__buy{display:inline-flex;align-items:center;gap:1rem;font:500 1.3rem/1.8rem var(--f-body);color:var(--c-text-secondary)}
.c-player__buy svg{color:var(--c-brand-primary)}

.c-playlist{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:1rem;
  padding:2.2rem 2.4rem;background:var(--c-bg-surface);border-radius:2rem;box-shadow:var(--e-card)}
.c-playlist__head{display:flex;flex-direction:column;gap:0.4rem;padding-bottom:0.6rem}
.c-playlist__title{font:600 2rem/2.8rem var(--f-head);color:var(--c-text-primary)}
.c-playlist__meta{font:500 1.3rem/1.8rem var(--f-body);color:var(--c-text-muted)}
.c-row{display:flex;align-items:center;gap:1.4rem;height:6.4rem;padding:0 1.6rem 0 1.2rem;
  border:1px solid var(--c-border-subtle);border-radius:1.4rem;background:var(--c-bg-surface)}
.c-row:hover{background:var(--c-bg-cream)}
.c-row__play{width:3.8rem;height:3.8rem;border-radius:var(--r-full);background:var(--c-brand-primary);
  color:#fff;display:grid;place-items:center;flex:0 0 auto}
.c-row__play svg{width:1.8rem;height:1.8rem}
.c-row__text{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:0.2rem}
.c-row__name{font:600 1.6rem/2.6rem var(--f-body);color:var(--c-text-primary)}
.c-row__sub{font:500 1.3rem/1.8rem var(--f-body);color:var(--c-text-muted)}
.c-row__time{font:500 1.3rem/1.8rem var(--f-body);color:var(--c-text-muted);flex:0 0 auto}
.c-row__like{width:1.9rem;height:1.9rem;color:#C3B8AF;flex:0 0 auto;display:grid;place-items:center}
.c-row__like svg{width:1.9rem;height:1.9rem}
.c-playlist__more{font:600 1.4rem/2rem var(--f-body);color:var(--c-brand-primary);align-self:flex-start}

/* ── Банер / Цитата автора  1064×240 ──────────────────────── */
.s-quote{display:flex;align-items:center;gap:3.4rem;padding:3rem 5.6rem 3rem 4rem;
  background:var(--c-bg-cream);border-radius:2.4rem}
.s-quote__feather{width:20.6rem;height:18rem;object-fit:contain;flex:0 0 auto}
.s-quote__text{font:400 3.2rem/5rem var(--f-script);color:var(--c-text-primary)}
.s-quote__spacer{flex:1 1 auto}
.s-quote__heart{width:4.6rem;height:4.6rem;color:var(--c-brand-rose);flex:0 0 auto;display:grid;place-items:center}
.s-quote__heart svg{width:4.6rem;height:4.6rem;stroke-width:1.28}

/* ── Блок / Про автора  1064×348 ──────────────────────────── */
.s-about{display:flex;background:var(--c-bg-surface);border-radius:2.4rem;overflow:hidden;box-shadow:var(--e-card)}
.s-about__img{width:43rem;height:34.8rem;object-fit:cover;flex:0 0 auto}
/* У макеті фрейм «Текст» має фіксовану висоту 348 і вертикальне
   центрування: вміст (310) вищий за внутрішній відступ 40, тому Figma
   центрує його і фактичний відступ виходить 19. Відтворюємо саме це. */
.s-about__text{flex:1 1 auto;min-width:0;height:34.8rem;display:flex;flex-direction:column;justify-content:center;gap:1.4rem;padding:0 4.4rem}
.s-about__overline{font:600 1.2rem/1.6rem var(--f-body);letter-spacing:0.096rem;color:var(--c-brand-primary);text-transform:uppercase}
.s-about__title{font:700 3.6rem/4.4rem var(--f-head);letter-spacing:-0.018rem;color:var(--c-text-primary)}
.s-about__desc{font:400 1.8rem/3rem var(--f-body);color:var(--c-text-secondary)}
.s-about__stats{display:flex;gap:3.4rem;padding:0.8rem 0 0.4rem}
.s-about__stat{display:flex;flex-direction:column;gap:0.2rem}
.s-about__num{font:700 1.8rem/2.4rem var(--f-body);color:var(--c-brand-primary)}
.s-about__cap{font:500 1.3rem/1.8rem var(--f-body);color:var(--c-text-muted)}
.s-about__cta{display:inline-flex;align-items:center;gap:0.9rem;height:4.8rem;align-self:flex-start;
  font:600 1.5rem/2rem var(--f-body);color:var(--c-brand-primary)}
.s-about__cta svg{width:1.8rem;height:1.8rem}

/* ── Секція / Зворотний зв'язок  1064×640 ─────────────────── */
.s-contact{display:flex;gap:3.2rem}
.s-contact__img{width:51.6rem;height:64rem;object-fit:cover;border-radius:2.4rem;flex:0 0 auto}
.s-form{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:1.4rem;
  padding:3.2rem 3.2rem 3rem;background:var(--c-bg-surface);border-radius:2.4rem;box-shadow:var(--e-card)}
.s-form__overline{font:600 1.2rem/1.6rem var(--f-body);letter-spacing:0.096rem;color:var(--c-brand-primary);text-transform:uppercase}
.s-form__title{font:600 2.6rem/3.4rem var(--f-head);color:var(--c-text-primary)}
.s-form__desc{font:400 1.6rem/2.6rem var(--f-body);color:var(--c-text-secondary)}
.s-form__space{height:0.6rem}
.s-form__row{display:flex;gap:1.2rem}
.c-field{display:flex;align-items:center;gap:1.1rem;height:5.4rem;padding:0 1.6rem;
  background:var(--c-bg-surface);border:1px solid var(--c-border-subtle);border-radius:1.2rem}
.c-field--grow{flex:1 1 0;min-width:0}
.c-field--area{align-items:flex-start;height:12.8rem;padding:1.6rem}
.c-field svg{width:1.8rem;height:1.8rem;flex:0 0 auto;color:var(--c-text-muted)}
.c-field__input{flex:1 1 auto;min-width:0;border:0;background:none;outline:0;
  font:400 1.6rem/2.6rem var(--f-body);color:var(--c-text-primary);resize:none}
.c-field__input::placeholder{color:var(--c-text-muted)}
.c-field select.c-field__input{appearance:none;color:var(--c-text-muted)}
.c-field__chevron{width:1.8rem;height:1.8rem;color:var(--c-text-muted);flex:0 0 auto}
.s-form__agree{display:flex;align-items:center;gap:1rem;padding-top:0.2rem;height:2.4rem}
.s-form__check{width:1.9rem;height:1.9rem;border:1.4px solid var(--c-border-strong);border-radius:0.5rem;
  background:var(--c-bg-surface);appearance:none;flex:0 0 auto;margin:0}
.s-form__check:checked{background:var(--c-brand-primary);border-color:var(--c-brand-primary)}
.s-form__agree label{font:400 1.4rem/2.2rem var(--f-body);color:var(--c-text-secondary)}
.s-form__submit{display:flex;align-items:center;justify-content:center;height:4.8rem;border-radius:1.2rem;
  background:var(--c-brand-primary);color:var(--c-text-inverse);font:600 1.5rem/2rem var(--f-body);box-shadow:var(--e-button)}
.s-form__submit:hover{background:var(--c-brand-primary-hover)}
.s-form__note{text-align:center;font:500 1.3rem/1.8rem var(--f-body);color:var(--c-text-muted)}

/* Тексти з редактора: один абзац має поводитись точно як рядок у макеті. */
.s-hero__title p,.s-hero__sub p,.c-card-cat__desc p,.c-card-media__desc p,
.c-card-book__title p,.c-card-book__desc p,.s-quote__text p,
.s-about__desc p,.s-form__desc p{margin:0}
.s-hero__title a,.s-quote__text a{color:inherit;text-decoration:underline}

/* ── Стани полів (Figma: Input / Поле → Стан=Error, Field / Помилка) ── */
.c-field--filled{border-color:var(--c-border-strong)}
.c-field.is-error{background:var(--c-state-error-soft);border-color:var(--c-state-error);border-width:1.5px}
.c-field.is-error svg{color:var(--c-state-error)}
.c-field.is-error .c-field__input{color:var(--c-state-error)}
.c-field.is-error .c-field__input::placeholder{color:var(--c-state-error)}
.s-form__field{display:flex;flex-direction:column;gap:0.8rem}
.s-form__field--grow{flex:1 1 0;min-width:0}
.c-error{display:flex;align-items:center;gap:0.8rem;font:500 1.3rem/1.8rem var(--f-body);color:var(--c-state-error)}
.c-error svg{width:1.5rem;height:1.5rem;flex:0 0 auto}
.s-form__check.is-error{background:var(--c-state-error-soft);border-color:var(--c-state-error);border-width:1.5px}
/* Підпис згоди має лишатися в одному рядку з чекбоксом і переносити
   текст усередині себе, а підказка про помилку — йти окремим рядком. */
.s-form__agree{flex-wrap:wrap}
.s-form__agree label{flex:1 1 0;min-width:0}
.s-form__agree .c-error{flex-basis:100%}
.s-form__hint{text-align:center;font:500 1.3rem/1.8rem var(--f-body);color:var(--c-text-muted)}

/* Пастка для ботів: не видно людині, але поле справжнє. */
.ylc-hp{position:absolute!important;left:-999.9rem;width:0.1rem;height:0.1rem;overflow:hidden}

/* ── Попап «Повідомлення надіслано» (Figma 93:141) ────────── */
.c-modal{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center}
.c-modal[hidden]{display:none}
.c-modal__scrim{position:absolute;inset:0;background:var(--c-bg-scrim);opacity:.55}
.c-modal__box{position:relative;width:48rem;display:flex;flex-direction:column;align-items:center;gap:1.6rem;
  padding:4rem;background:var(--c-bg-surface);border-radius:2.4rem;text-align:center;box-shadow:var(--e-hero)}
.c-modal__icon{width:8.4rem;height:8.4rem;border-radius:var(--r-full);background:var(--c-brand-primary-soft);
  color:var(--c-brand-primary);display:grid;place-items:center}
.c-modal__icon svg{width:3.6rem;height:3.6rem}
.c-modal__title{font:600 2.6rem/3.4rem var(--f-head);color:var(--c-text-primary)}
.c-modal__text{font:400 1.6rem/2.6rem var(--f-body);color:var(--c-text-secondary)}
.c-modal__cta{display:flex;align-items:center;justify-content:center;width:100%;height:4.8rem;border-radius:1.2rem;
  background:var(--c-brand-primary);color:var(--c-text-inverse);font:600 1.5rem/2rem var(--f-body)}
.c-modal__link{font:600 1.4rem/2rem var(--f-body);color:var(--c-brand-primary)}
.c-modal__close{position:absolute;top:-2.1rem;right:-2.1rem;width:4.2rem;height:4.2rem;border-radius:var(--r-full);
  background:var(--c-bg-surface);color:var(--c-text-primary);display:grid;place-items:center;box-shadow:var(--e-float)}
.c-modal__close svg{width:1.9rem;height:1.9rem}
@media (max-width:767px){
  .c-modal__box{width:33.4rem;padding:2.8rem 2.4rem;gap:1.4rem;border-radius:2rem}
  .c-modal__title{font:600 2rem/2.8rem var(--f-head)}
  .c-modal__text{font:400 1.5rem/2.4rem var(--f-body)}
}

/* Довжина підписів у картках задана макетом: назва — до 2 рядків,
   опис — рівно 2. Обрізаємо, щоб довільний текст із адмінки
   не ламав сітку каталогу. */
.c-card-media__title,.c-card-book__title,.c-card-cat__title{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}
.c-card-media__title{-webkit-line-clamp:1}
.c-card-book__title,.c-card-cat__title{-webkit-line-clamp:2}
.c-card-media__desc,.c-card-book__desc,.c-card-cat__desc{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:4.4rem}
.c-row__name{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden}

/* ── Плеєр: справжні кнопки ───────────────────────────────── */
.c-player audio{display:none}
.c-player__play-icon,.c-player__pause-icon{display:grid;place-items:center}
.c-player__pause-icon{display:none}
.c-player.is-playing .c-player__play-icon{display:none}
.c-player.is-playing .c-player__pause-icon{display:grid}
.c-player__play svg{width:1.8rem;height:1.8rem}
.c-wave{cursor:pointer}
.c-wave__bar{transition:background-color .15s ease}
.c-player__vol{width:1.8rem;height:1.8rem;color:var(--c-text-muted);display:grid;place-items:center;flex:0 0 auto}
.c-player__vol.is-muted{color:var(--c-state-error)}
.c-player__volbar{position:relative;width:8rem;height:0.4rem;border-radius:var(--r-full);
  background:var(--c-border-strong);flex:0 0 auto;cursor:pointer}
.c-player__volfill{position:absolute;left:0;top:0;height:100%;width:80%;
  border-radius:var(--r-full);background:var(--c-brand-primary)}
.c-player__step:hover,.c-player__vol:hover{color:var(--c-brand-primary)}

@media (max-width:767px){
  /* Хвиля з 67 смуг не вміщається у 302 px: показуємо кожну другу
     й розтягуємо по всій ширині, пропорції програного зберігаються. */
  .c-wave{justify-content:space-between;gap:0;overflow:hidden}
  .c-wave__bar:nth-child(even){display:none}
}