:root {
    --dsm-primary: #1d4ed8;
    --dsm-bg: #f7f8fb;
    --dsm-soft: #eef4ff;
}

body {
    background: var(--dsm-bg);
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 20;
}

.hero {
    padding: 72px 0 48px;
    background: linear-gradient(135deg, #eef4ff, #ffffff);
}

.eyebrow {
    color: var(--dsm-primary);
    font-weight: 800;
    text-transform: uppercase;
    font-size: 0.82rem;
    letter-spacing: 0.08em;
}

.hero h1,
.page-title {
    letter-spacing: -0.04em;
}

.hero h1 {
    line-height: 1.05;
}

.lead {
    color: #6b7280;
}

.section {
    padding: 48px 0;
}

.event-card,
.dsm-card {
    border: 1px solid #e5e7eb;
    border-radius: 1.25rem;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.06);
    background: #ffffff;
}

.participant-card {
    border: 1px solid #e5e7eb;
    border-radius: 1rem;
    background: #ffffff;
}

.participant-card.is-template {
    display: none;
}

.role-section {
    border-radius: 1.25rem;
    border: 1px solid #e5e7eb;
    background: #ffffff;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.05);
}

.table-responsive {
    border-radius: 1rem;
}

textarea {
    min-height: 90px;
}

.step-number {
    width: 44px;
    height: 44px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    background: var(--dsm-soft);
    color: var(--dsm-primary);
    font-size: 1.1rem;
}

.display-2,
.display-3,
.display-6 {
    letter-spacing: -0.05em;
}

@media (max-width: 768px) {
    .hero {
        padding: 56px 0 36px;
    }

    .section {
        padding: 36px 0;
    }
}