/* ══════════════════════════════════════════════════════════
   BASE - PURE DARKNESS
   ═══════════════════════════════════════════════════════════ */

*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

body {
    background: var(--void);
    color: var(--star-primary);
    font-family: var(--font-body);
    font-size: clamp(16px, 1.2vw, 18px);
    line-height: 1.6;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    color: inherit;
    text-decoration: none;
}

ul,
ol {
    list-style: none;
}

/* ══════════════════════════════════════════════════════════
   TYPOGRAPHY - PRECISION & HIERARCHY
   ═══════════════════════════════════════════════════════════ */

.title-massive {
    font-size: clamp(60px, 12vw, 180px);
    font-weight: 200;
    letter-spacing: -0.02em;
    line-height: 0.9;
    margin: 0;
}

.subtitle-refined {
    font-size: clamp(18px, 2vw, 24px);
    font-weight: 300;
    letter-spacing: 0.05em;
    color: var(--star-secondary);
    margin-top: 20px;
    margin-bottom: 40px;
}

.manifesto {
    font-size: clamp(16px, 1.5vw, 20px);
    line-height: 1.8;
    color: var(--star-tertiary);
    max-width: 600px;
    margin-bottom: 60px;
}

.heading-colossal {
    font-size: clamp(48px, 8vw, 120px);
    font-weight: 300;
    letter-spacing: -0.02em;
    line-height: 1.1;
    margin-bottom: 40px;
}

.heading-large {
    font-size: clamp(32px, 5vw, 72px);
    font-weight: 300;
    letter-spacing: -0.01em;
    margin-bottom: 30px;
}

.heading-refined {
    font-size: clamp(24px, 3vw, 48px);
    font-weight: 400;
    margin-bottom: 20px;
}

.heading-massive-centered {
    font-size: clamp(48px, 10vw, 140px);
    font-weight: 200;
    text-align: center;
    line-height: 1;
    margin-bottom: 60px;
}

.label-minimal {
    font-size: 11px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--star-secondary);
    font-weight: 500;
    display: block;
    margin-bottom: 20px;
}

.description-wide {
    font-size: clamp(18px, 2vw, 24px);
    line-height: 1.6;
    color: var(--star-secondary);
    max-width: 800px;
}

.description-compact {
    font-size: 16px;
    color: var(--star-secondary);
    line-height: 1.5;
    margin-bottom: 15px;
}

/* ══════════════════════════════════════════════════════════
   LAYOUT - GENEROUS SPACE
   ═══════════════════════════════════════════════════════════ */

.section-breathe {
    padding: var(--space-section) 5vw;
}

.section-breathe-large {
    padding: calc(var(--space-section) * 1.5) 5vw;
}

.container-fluid {
    max-width: 1800px;
    margin: 0 auto;
}

.container-standard {
    max-width: 1400px;
    margin: 0 auto;
}

.container-narrow {
    max-width: 900px;
    margin: 0 auto;
}

.bg-deeper {
    background-color: var(--deeper);
}

.bg-deepest {
    background-color: var(--deepest);
}