/* ================================================================
   DWDG — scale.css v6
   ================================================================ */

/* ── 1. BASE FONT SIZE ──────────────────────────────────────────── */
body { font-size: 15px; }

/* ── 2. HERO H1 ─────────────────────────────────────────────────── */
.hero-grid h1 {
  font-size: clamp(2.2rem, 4.2vw, 3.8rem) !important;
  line-height: 0.92 !important;
}

/* ── 3. HERO INTRO ──────────────────────────────────────────────── */
.hero-intro {
  font-size: clamp(0.9rem, 1.3vw, 1.05rem) !important;
  line-height: 1.5 !important;
  letter-spacing: -0.01em !important;
}

/* ── 4. CONVICTION BUBBLES — HARD FIX ──────────────────────────── */
/* The base CSS uses clamp(200px, 23vw, 300px) — way too large.
   We force fixed sizes that match the design screenshots exactly. */
.conviction-visual {
  min-height: 200px !important;
}

.conviction {
  width: 160px !important;          /* fixed px, not vw-based */
  aspect-ratio: 1 !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  line-height: 1.25 !important;
}

.conviction-light {
  box-shadow: 0 0 40px rgba(18,201,95,.18) !important;
}

.conviction-strong {
  margin-left: -12px !important;
  box-shadow: 0 0 56px rgba(18,201,95,.28) !important;
}

.conviction-dot {
  font-size: 0.85rem !important;
  margin-inline: -4px -6px !important;
}

.convictions-label {
  font-size: clamp(0.85rem, 1.3vw, 1rem) !important;
  line-height: 1.3 !important;
  letter-spacing: -0.01em !important;
  white-space: nowrap !important;
}

/* Conviction grid matches hero-grid proportions so visual aligns under h1 */
.convictions {
  grid-template-columns: minmax(200px, 0.9fr) minmax(320px, 1.45fr) !important;
  gap: clamp(48px, 8vw, 112px) !important;
}

/* ── 5. SECTION H2 ──────────────────────────────────────────────── */
h2 {
  font-size: clamp(1.4rem, 2.2vw, 1.9rem);
  line-height: 1.05;
}

/* ── 6. H3 (work cards, pub cards) ─────────────────────────────── */
h3 {
  font-size: clamp(0.95rem, 1.45vw, 1.2rem);
  line-height: 1.15;
}

/* ── 7. JOIN SECTION TITLE ──────────────────────────────────────── */
.join h2 {
  font-size: clamp(1.7rem, 3.2vw, 2.8rem) !important;
  line-height: 0.96 !important;
}
.join-copy p {
  font-size: clamp(0.875rem, 1.2vw, 0.975rem) !important;
  line-height: 1.5 !important;
  letter-spacing: -0.01em !important;
}

/* ── 8. WORK CARD TEXT ──────────────────────────────────────────── */
.work-copy p {
  font-size: clamp(0.82rem, 1.05vw, 0.92rem);
  line-height: 1.55;
}

/* ── 9. FUTURE GENERATIONS ──────────────────────────────────────── */
.future-head h2 { font-size: clamp(1.4rem, 2.2vw, 1.9rem); }
.future-head p  { font-size: clamp(0.85rem, 1.1vw, 0.95rem); line-height: 1.55; }
.generation-body h3 { font-size: 1.35rem !important; }
.generation-body p  { font-size: 0.85rem; line-height: 1.5; }

/* ── 10. INSIGHT CARDS ──────────────────────────────────────────── */
.insight-copy h3 {
  font-size: clamp(0.78rem, 1.15vw, 0.92rem) !important;
  min-height: 80px !important;
  padding: 10px 12px !important;
  line-height: 1.2 !important;
  letter-spacing: -0.02em !important;
}

/* ── 11. SECTION HEADINGS for specific sections ─────────────────── */
#works-heading, #insights-heading, #pub-heading, #future-heading {
  font-size: clamp(1.3rem, 2vw, 1.75rem) !important;
}

/* ── 12. FOOTER ─────────────────────────────────────────────────── */
.footer-col-title  { font-size: 0.8rem; }
.footer-sub-list li { font-size: 0.74rem; }
.footer-copy, .footer-bottom > a { font-size: 0.74rem; }

/* ── 13. EYEBROW ────────────────────────────────────────────────── */
.eyebrow { font-size: 0.58rem !important; letter-spacing: 0.05em !important; }

/* ── 14. RESPONSIVE: keep bubbles small on mobile too ───────────── */
@media (max-width: 760px) {
  .conviction {
    width: min(38vw, 140px) !important;
    font-size: 0.7rem !important;
  }
  .conviction-strong { margin-left: -8px !important; }
}
