:root {
    --font-body: "Raleway", "Segoe UI", sans-serif;
    --font-heading: "Golos Text", "Segoe UI", sans-serif;
    --font-accent: "Caveat", cursive;
}

body {
    font-family: var(--font-body);
}

h1,
.sidebar-brand,
.sidebar-brand strong,
.brand strong,
.hero-banner h1,
.page-head h1,
.form-heading h2,
.auth-intro-copy h1 {
    font-family: var(--font-heading);
    font-weight: 700;
    letter-spacing: -.025em;
}

h2, h3, h4,
.section-heading h2,
.watch-body h3,
.certificate-card-body h3,
.stat-ring-wrap h2,
.announcement-card h3 {
    font-family: var(--font-body);
}

.eyebrow,
.hero-kicker {
    font-family: var(--font-accent);
    font-size: 21px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: .01em;
    text-transform: none;
}

.accent-heart {
    width: .9em;
    height: .9em;
    display: inline-block;
    margin-left: .08em;
    overflow: visible;
    fill: currentColor;
    vertical-align: -.08em;
    transform-origin: center;
    animation: accent-heart-beat 2.8s ease-in-out infinite;
}

@keyframes accent-heart-beat {
    0%, 88%, 100% { transform: scale(1) rotate(-3deg); }
    92% { transform: scale(1.15) rotate(1deg); }
    96% { transform: scale(1.04) rotate(-2deg); }
}

@media (prefers-reduced-motion: reduce) {
    .accent-heart { animation: none; }
}
