/* =====================================================================
   Foxy Art Cup - начална (PLAN 4.2) - 1:1 от makets/final/assets/maket.css,
   блок „4.2 НАЧАЛНА". Зарежда се и на „За мен" (повтаря категории, числа,
   мисия, отзиви), затова всичко е по клас, не по #котва.
   Общите компоненти (.sec-head, .card-*, .usp, .acc, .review, .carousel,
   .dots, .arrow, .grid12) са в base.css - тук не се дублират.
   ===================================================================== */

/* Колоните на мрежите не разпъват страницата от дълга дума/снимка (maket.css, общия ред за min-width) */
.split > *, .chisla > * { min-width: 0; }

/* ---------- Хиро карусел ---------- */
.hero { padding-top: 24px; }
.hero__track { display: grid; grid-auto-flow: column; grid-auto-columns: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; border-radius: var(--r-hero); }
.hero__track::-webkit-scrollbar { display: none; }
.slide { scroll-snap-align: start; display: grid; grid-template-columns: 5fr 7fr; align-items: stretch; background: var(--c-surface); border-radius: var(--r-hero); }
.slide__body { display: grid; align-content: center; justify-items: start; gap: 16px; padding: 56px 40px 56px 48px; }
.slide__body h1, .slide__body .h1 { font-size: var(--t-display); line-height: 1.1; font-weight: 800; letter-spacing: -.02em; }
.slide__body .lead { color: var(--c-muted); }
.slide__btns { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }
.slide__img { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 0 var(--r-hero) var(--r-hero) 0; } /* снимка - запълва клетката на грида */
.hero__nav { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 16px; }
.hero__arrows { display: flex; gap: 10px; }
@media (max-width: 1023px) {
  .slide { grid-template-columns: 1fr; }
  .slide__img { order: -1; height: auto; aspect-ratio: 4 / 3; border-radius: var(--r-hero) var(--r-hero) 0 0; } /* height:auto - iOS Safari разтяга height:100% до цялата карта и снимката застава под текста (29.09) */
  .slide__body { padding: 24px 20px 28px; gap: 12px; }
}
.trust { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 12px; margin-top: 20px; }
.trust .chip { background: #fff; border-color: var(--c-border); color: var(--c-text); font-size: 14px; padding: 9px 16px; }
.trust .chip svg { color: var(--c-primary); }
@media (max-width: 767px) { .trust { justify-content: flex-start; } .trust .chip { white-space: normal; } }

/* ---------- От идея до красив подарък (числа) ---------- */
.chisla { display: grid; grid-template-columns: 5fr 7fr; gap: var(--sp-block) 48px; align-items: center; }
.chisla__nums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap-cards); }
.num { display: grid; gap: 6px; padding: 24px 20px; background: #fff; border-radius: var(--r-card); border: 1px solid var(--c-border); }
.num strong { font-size: var(--t-h1); line-height: 1; font-weight: 800; color: var(--c-accent); letter-spacing: -.02em; }
.num span { font-size: 15px; line-height: 1.4; color: var(--c-muted); }
@media (max-width: 1023px) { .chisla { grid-template-columns: 1fr; } }
@media (max-width: 767px) { .chisla__nums { grid-template-columns: 1fr; } .num { grid-template-columns: auto 1fr; align-items: center; gap: 16px; padding: 18px; } }

/* ---------- Две колони: текст + снимка (Какво целя?, ЧЗВ) ---------- */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-block) 56px; align-items: center; }
.split--57 { grid-template-columns: 5fr 7fr; align-items: start; }
.split__img { border-radius: var(--r-card); width: 100%; aspect-ratio: 4 / 5; object-fit: cover; } /* снимка в колоната */
.split__body { display: grid; gap: 16px; align-content: center; justify-items: start; }
.split__usps { display: grid; gap: 20px; margin-top: 8px; }
@media (max-width: 1023px) { .split, .split--57 { grid-template-columns: 1fr; } .split__img--first { order: -1; } }

/* ---------- Коя съм аз? ---------- */
.az { text-align: center; }
.az__in { display: grid; gap: 16px; justify-items: center; }
.az__sign { display: flex; align-items: center; gap: 12px; text-align: left; font-weight: 700; line-height: 1.35; }
.az__sign img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; object-position: 50% 20%; } /* миниатюра - размерът е на снимката */
.az__sign span { display: block; font-weight: 500; font-size: 14px; color: var(--c-muted); }

/* ---------- Промоция ---------- */
.promo { display: grid; grid-template-columns: 7fr 5fr; gap: 24px 40px; align-items: center; padding: 48px 56px; background: var(--c-accent-soft); border-radius: var(--r-hero); }
.promo__body { display: grid; gap: 12px; justify-items: start; }
.promo__cta { justify-self: end; display: grid; gap: 10px; justify-items: end; }
.promo__cta .promo__big { font-size: clamp(64px, calc(64px + 56 * (100vw - 390px) / 634), 120px); line-height: .9; font-weight: 800; color: var(--c-primary); letter-spacing: -.04em; }
@media (max-width: 1023px) { .promo { grid-template-columns: 1fr; padding: 28px 22px; } .promo__cta { justify-self: start; justify-items: start; } }

/* ---------- ЧЗВ ---------- */
.faq-wrap .split__img { aspect-ratio: 4 / 5; }
@media (max-width: 1023px) { .faq-wrap .split__img { display: none; } }
