/* SEO-Study.ru — targeted layout hotfix, 2026-09-05.
   Keeps the existing visual system; fixes text collisions and responsive overflow. */
.hero-grid > *,
.split > *,
.two-col > * { min-width: 0; }

.label {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  flex-wrap: wrap;
}

.v15-metrics { overflow: hidden; }
.v15-metric { min-width: 0 !important; }
.v15-metric b {
  white-space: normal !important;
  font-size: clamp(32px, 2.7vw, 44px) !important;
  line-height: 1.02 !important;
  letter-spacing: -.035em;
  text-wrap: balance;
  overflow-wrap: normal;
  word-break: normal;
}
.v15-metric span {
  overflow-wrap: break-word;
}

.role-tile h3,
.card h3,
.note h3 {
  overflow-wrap: break-word;
  word-break: normal;
}

@media (max-width: 1180px) {
  /* site-v14 has a more-specific two-column rule with !important;
     override it so the intended responsive one-column layout actually works. */
  .section-purple .wrap.split,
  .section.purple .wrap.split {
    grid-template-columns: 1fr !important;
  }
  .role-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .v15-metric b {
    font-size: clamp(34px, 4vw, 42px) !important;
  }
}

@media (max-width: 760px) {
  .role-grid { grid-template-columns: 1fr !important; }
}

@media (max-width: 640px) {
  .hero-grid > *,
  .split > *,
  .two-col > * { min-width: 0 !important; }

  .label {
    font-size: 12px;
    line-height: 1.35;
  }

  .v15-metric b { font-size: 34px !important; }

  .caption {
    left: 14px;
    right: 14px;
    max-width: calc(100% - 28px);
  }
}

/* Contrast guard: light cards placed on purple sections must keep dark text.
   The section-level heading rules intentionally make bare headings white,
   but must not leak into light cards/forms. */
.section-purple :is(.form-card,.card,.note,.role-tile,.full-bleed-card,.expert-panel,.book-card,.pdf-cover),
.section.purple :is(.form-card,.card,.note,.role-tile,.full-bleed-card,.expert-panel,.book-card,.pdf-cover) {
  color: var(--ink);
}
.section-purple :is(.form-card,.card,.note,.role-tile,.full-bleed-card,.expert-panel,.book-card,.pdf-cover) :is(h1,h2,h3,.h1,.h2,.h3),
.section.purple :is(.form-card,.card,.note,.role-tile,.full-bleed-card,.expert-panel,.book-card,.pdf-cover) :is(h1,h2,h3,.h1,.h2,.h3) {
  color: var(--ink) !important;
}
.section-purple :is(.form-card,.card,.note,.role-tile,.full-bleed-card,.expert-panel,.book-card,.pdf-cover) :is(.lead,.text,.muted),
.section.purple :is(.form-card,.card,.note,.role-tile,.full-bleed-card,.expert-panel,.book-card,.pdf-cover) :is(.lead,.text,.muted) {
  color: var(--muted) !important;
}
/* Form controls on light cards: explicit colors avoid inherited white text. */
.section-purple .form-card :is(label,.checks,.consent),
.section.purple .form-card :is(label,.checks,.consent) {
  color: var(--muted);
}
.section-purple .form-card :is(input,select,textarea),
.section.purple .form-card :is(input,select,textarea) {
  color: var(--ink);
  background: #fff;
}

/* Strong form contrast on dark sections and readable placeholders. */
.section-purple .form-card,
.section.purple .form-card {
  background: var(--card) !important;
}
.form-card :is(input,textarea)::placeholder {
  color: #76677D;
  opacity: 1;
}