/* =====================================================
   BASE — сброс + типографика + утилиты
   Подключать после tokens.css
   ===================================================== */

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-sans);color:var(--color-ink);background:var(--color-cream);line-height:var(--leading-normal);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}

/* ── Контейнер ── */
.container{width:min(var(--container-max),var(--container-gutter));margin-inline:auto}

/* ── Секция ── */
section{padding:var(--space-section) 0}

/* ── Типографические утилиты ── */
.serif{font-family:var(--font-serif);font-weight:600;letter-spacing:.005em}
.eyebrow{font-size:var(--text-xxs);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--color-gold-deep);font-weight:700}

/* ── Section head (центрированный заголовок секции) ── */
.section-head{text-align:center;max-width:680px;margin:0 auto}
.section-head h2{font-family:var(--font-serif);font-size:var(--text-h2);color:var(--color-espresso);margin:12px 0 14px}
.section-head p{color:var(--color-muted);font-size:var(--text-lg)}

/* ── Чеклист ── */
.checklist{list-style:none;display:flex;flex-direction:column;gap:12px;margin-top:8px}
.checklist li{display:flex;gap:12px;align-items:flex-start;font-weight:500}
.checklist li::before{content:"";flex:0 0 22px;height:22px;margin-top:2px;background:var(--color-gold-deep);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/></svg>") center/contain no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/></svg>") center/contain no-repeat}

/* ── Split layout ── */
.split{display:grid;grid-template-columns:1.05fr 1fr;gap:var(--gap-cols);align-items:center}
.split img{border-radius:var(--radius);box-shadow:var(--shadow);width:100%;height:100%;object-fit:cover;min-height:380px}
.split h2{font-family:var(--font-serif);font-size:var(--text-h3);color:var(--color-espresso);margin:12px 0 18px}
.split p{color:var(--color-muted);margin-bottom:16px}

@media(max-width:900px){
  .split{grid-template-columns:1fr;gap:30px}
}
@media(max-width:600px){
  section{padding:var(--space-section-sm) 0}
}
