/* ═══════════════════════════════════════════════════════════════
   HOLY SMOKE — Dark contemplative theme
   Extracted from holy-smoke/index.html
   ═══════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════════════════
   HOLY SMOKE — Book Three: A Contemplative Guide to Dying Well
   Inherits from cookbook.css for illuminated manuscript styling
   ═══════════════════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════════════════
   1. DARK THEME COLOR DEFINITIONS
   ═══════════════════════════════════════════════════════════════════════════ */
/* Scoped to body.holy-smoke to avoid overriding global :root tokens */
body.holy-smoke {
    --bg-deep: #0a0a0f;
    --bg-mid: #12121a;
    --bg-card: #1a1a24;
    --bg-elevated: #222230;
    --border-subtle: var(--white-08);
    --border-gold: var(--gold-30);

    /* Override base text tokens so cookbook.css components render correctly on dark bg */
    --text-primary: var(--ivory);
    --text-secondary: var(--ivory-85);
    --text-muted: var(--ivory-70);

    /* Light text aliases for components that use them directly */
    --light-text-primary: var(--ivory);
    --light-text-secondary: var(--ivory-90);
    --light-text-muted: var(--ivory-85);

    /* Hero gradient stops */
    --hs-hero-deep: #06060a;
    --hs-hero-mid: #0a0a10;
    --hs-hero-light: #0e0e14;

    /* Quote banner */
    --hs-banner-start: #3a3a4a;
    --hs-banner-end: #2a2a35;
}

/* ═══════════════════════════════════════════════════════════════════════════
   2. PAGE-LEVEL DEFAULTS
   ═══════════════════════════════════════════════════════════════════════════ */

/*
 * Global element reset for dark page.
 * terraforms.css sets h1/h2/h3/strong/em to light-theme colours (--black, --burgundy).
 * body.holy-smoke does not carry theme-dark, so every base element that touches
 * text colour must be overridden here.
 */
body.holy-smoke h1,
body.holy-smoke h2,
body.holy-smoke h3,
body.holy-smoke h4 {
    color: var(--ivory);
}
body.holy-smoke strong {
    color: var(--ivory);
}
body.holy-smoke em {
    color: var(--gold);
}

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

/* ═══════════════════════════════════════════════════════════════════════════
   3. NAVIGATION — Dark theme override
   ═══════════════════════════════════════════════════════════════════════════ */
.nav {
    background: rgba(10, 10, 15, 0.95);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--white-05);
}
.nav-logo, .nav-logo span { color: var(--gold); }
.nav-link, .nav-dropdown__trigger { color: var(--light-text-secondary); }
.nav-link:hover, .nav-dropdown__trigger:hover { color: var(--gold); }
.nav-dropdown__menu { background: var(--bg-card); border: 1px solid var(--border-subtle); }
.nav-dropdown__menu a { color: var(--light-text-secondary); }
.nav-dropdown__menu a:hover { color: var(--gold); background: var(--gold-08); }
.nav-toggle__bar { background: var(--light-text-secondary); }
.nav-toggle.active .nav-toggle__bar { background: var(--light-text-secondary); }
.nav-dropdown__arrow { color: var(--light-text-muted); font-size: 0.6em; }

/* Mobile menu overrides — dark-themed pages need cream mobile nav
   TODO: Move to shared nav component when nav is componentised */
@media (max-width: 768px) {
    .nav {
        background: rgba(10, 10, 15, 0.95);
    }
    .nav-toggle {
        background: transparent;
    }
    .nav-toggle__bar {
        background: var(--light-text-muted);
    }
    .nav.menu-open .nav-toggle__bar {
        background: var(--charcoal, #252320);
    }
    .nav-logo, .nav-logo span {
        color: var(--gold);
    }
    .nav-links, .nav__links {
        background-color: var(--cream, #F4F0E8);
    }
    .nav-links a,
    .nav__links a,
    .nav-link,
    .nav-dropdown__trigger {
        color: var(--charcoal, #252320);
        background: transparent;
    }
    .nav-link-title {
        color: var(--charcoal, #252320);
    }
    .nav-link-desc {
        color: var(--earth, #5C564E);
    }
    .nav-section-header {
        color: var(--gold);
    }
    .nav-dropdown__menu {
        background: transparent;
        border: none;
    }
    .nav-dropdown__menu a,
    .nav-dropdown__menu .nav-link-title {
        color: var(--charcoal, #252320);
    }
    .nav-dropdown__menu .nav-link-desc {
        color: var(--earth, #5C564E);
    }
}

/* ═══════════════════════════════════════════════════════════════════════════
   4. SPLASH HERO — Ethereal smoke aesthetic
   ═══════════════════════════════════════════════════════════════════════════ */
.tf-cookbook-cover {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background:
        radial-gradient(ellipse at 30% 40%, rgba(168, 155, 124, 0.08) 0%, transparent 50%),
        radial-gradient(ellipse at 70% 60%, rgba(100, 100, 120, 0.06) 0%, transparent 40%),
        linear-gradient(180deg, var(--hs-hero-deep) 0%, var(--hs-hero-mid) 30%, var(--hs-hero-light) 50%, var(--hs-hero-mid) 70%, var(--hs-hero-deep) 100%);
    position: relative;
    overflow: hidden;
}

/* Smoke wisps animation */
.smoke-wisps {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}
.smoke-wisp {
    position: absolute;
    width: 200px;
    height: 200px;
    background: radial-gradient(ellipse at center, rgba(168, 155, 124, 0.06) 0%, transparent 70%);
    border-radius: var(--radius-full);
    filter: blur(40px);
    animation: wisp-float 20s ease-in-out infinite;
}
@keyframes wisp-float {
    0%, 100% {
        transform: translateY(0) translateX(0) scale(1);
        opacity: 0.3;
    }
    33% {
        transform: translateY(-50px) translateX(30px) scale(1.1);
        opacity: 0.5;
    }
    66% {
        transform: translateY(-20px) translateX(-20px) scale(0.9);
        opacity: 0.4;
    }
}
.smoke-wisp:nth-child(1) { top: 10%; left: 15%; animation-delay: 0s; animation-duration: 25s; }
.smoke-wisp:nth-child(2) { top: 30%; left: 70%; animation-delay: -5s; animation-duration: 22s; }
.smoke-wisp:nth-child(3) { top: 60%; left: 25%; animation-delay: -10s; animation-duration: 28s; }
.smoke-wisp:nth-child(4) { top: 75%; left: 80%; animation-delay: -3s; animation-duration: 20s; }
.smoke-wisp:nth-child(5) { top: 45%; left: 50%; animation-delay: -8s; animation-duration: 24s; }

.tf-cookbook-cover__inner {
    position: relative;
    z-index: 1;
}
.tf-cookbook-cover__flourish { display: none; }
.tf-cookbook-cover__label {
    color: var(--gold);
}
.tf-cookbook-cover__title {
    font-size: clamp(2.5rem, 8vw, 4rem);
    color: var(--gold);
    letter-spacing: 0.1em;
}
.tf-cookbook-cover__rule { display: none; }
.tf-cookbook-cover__subtitle {
    color: var(--light-text-primary);
    max-width: 540px;
    opacity: 0.95;
}
.tf-cookbook-cover__cta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
    margin-top: var(--spacing-md);
    justify-content: flex-start;
}
.tf-cookbook-cover__btn {
    display: inline-block;
    font-family: var(--font-important);
    font-size: var(--text-sm);
    font-weight: 500;
    letter-spacing: 0.08em;
    text-decoration: none;
    padding: 0.75rem 1.75rem;
    border: 1px solid var(--gold-30);
    color: var(--ivory);
    background: transparent;
    transition: border-color 0.2s, color 0.2s, background 0.2s;
}
.tf-cookbook-cover__btn:hover {
    border-color: var(--gold);
    color: var(--gold);
}
.tf-cookbook-cover__btn--primary {
    background: var(--gold-08);
    border-color: var(--gold);
    color: var(--gold);
}
.tf-cookbook-cover__btn--primary:hover {
    background: var(--gold-20);
}
.tf-cookbook-cover__scroll {
    font-size: var(--text-2xl);
    color: var(--light-text-muted);
    animation: scroll-hint 2s ease-in-out infinite;
}
@keyframes scroll-hint {
    0%, 100% { opacity: 0.5; transform: translateX(-50%) translateY(0); }
    50% { opacity: 1; transform: translateX(-50%) translateY(8px); }
}

/* ═══════════════════════════════════════════════════════════════════════════
   5. DARK SECTIONS
   ═══════════════════════════════════════════════════════════════════════════ */
.dark-section {
    background: var(--bg-deep);
    padding: var(--spacing-xl) 0;
}
.dark-section > .container {
    display: block;
    max-width: var(--max-width);
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--page-padding);
    padding-right: var(--page-padding);
    box-sizing: border-box;
}
.dark-section .section-label {
    display: block;
    font-family: var(--font-important);
    font-size: var(--text-xs);
    font-weight: 500;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: var(--spacing-sm);
}
.dark-section .section-title {
    font-family: var(--font-important);
    font-size: var(--text-2xl);
    font-weight: 500;
    letter-spacing: 0.02em;
    color: var(--light-text-primary);
    margin-bottom: var(--spacing-lg);
}
.dark-section p {
    color: var(--light-text-secondary);
    line-height: 1.8;
    font-size: var(--text-base);
}
.dark-section strong {
    color: var(--light-text-primary);
    font-weight: 600;
}

/* Key insight card */
.key-insight {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-left: 4px solid var(--gold);
    padding: var(--spacing-lg);
}
.key-insight p {
    font-family: var(--font-body);
    font-size: var(--text-base);
    line-height: 1.8;
    color: var(--light-text-secondary);
    margin: 0 0 var(--paragraph-gap, 1.75em);
}
.key-insight p:last-child {
    margin-bottom: 0;
}
.key-insight strong {
    color: var(--light-text-primary);
}

/* ═══════════════════════════════════════════════════════════════════════════
   6. STATS SECTION
   ═══════════════════════════════════════════════════════════════════════════ */
.stats-section {
    background: var(--bg-deep);
    padding: var(--spacing-xl) 0 var(--spacing-xxl);
}
.stats-section > .container {
    display: block;
    max-width: var(--max-width);
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--page-padding);
    padding-right: var(--page-padding);
    box-sizing: border-box;
}
.stats-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-sm);
    width: 100%;
    margin: 0;
    padding: 0;
}
.stats-row--2col {
    grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 600px) {
    .stats-row { grid-template-columns: repeat(2, 1fr); }
    .stats-row--2col { grid-template-columns: 1fr; }
}
.stat-card {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    padding: var(--spacing-md);
    text-align: center;
}
.stat-card__number {
    font-family: var(--font-important);
    font-size: var(--text-3xl);
    font-weight: 500;
    color: var(--gold);
    line-height: 1;
    margin-bottom: var(--spacing-xs);
}
.stat-card__label {
    font-family: var(--font-important);
    font-size: var(--text-2xs);
    color: var(--light-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    opacity: 0.9;
}
/* Insight-style stat cards (text layout, not number layout) */
.stat-card__title {
    font-family: var(--font-important);
    font-size: var(--text-lg);
    font-weight: 500;
    color: var(--light-text-primary);
    margin: 0 0 var(--spacing-sm);
    letter-spacing: 0.01em;
    text-align: left;
}
.stat-card__title--burgundy {
    color: var(--gold);
}
.stat-card__body {
    font-family: var(--font-body);
    font-size: var(--text-base);
    line-height: 1.8;
    color: var(--light-text-secondary);
    margin: 0;
    text-align: left;
}

/* ═══════════════════════════════════════════════════════════════════════════
   7. QUOTE BANNER — Muted smoky gradient
   ═══════════════════════════════════════════════════════════════════════════ */
.teal-banner {
    background: linear-gradient(135deg, var(--hs-banner-start) 0%, var(--hs-banner-end) 100%);
    padding: var(--spacing-lg) 0;
}
.teal-banner > .container {
    display: block;
    max-width: var(--max-width);
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--page-padding);
    padding-right: var(--page-padding);
    box-sizing: border-box;
}
.teal-banner__mark {
    font-family: var(--font-display);
    font-size: var(--text-2xl);
    color: var(--gold-60);
    margin: 0 0 var(--spacing-xs);
}
.teal-banner__quote {
    font-family: var(--font-body);
    font-size: var(--text-lg);
    font-weight: 400;
    color: var(--light-text-primary);
    line-height: 2;
    margin: 0 0 var(--spacing-md);
    opacity: 0.95;
}
.teal-banner__source {
    font-family: var(--font-important);
    font-size: var(--text-xs);
    font-weight: 500;
    letter-spacing: 0.12em;
    color: var(--gold);
    text-transform: uppercase;
    display: block;
}

/* ═══════════════════════════════════════════════════════════════════════════
   8. PREFACE / WELCOME SECTION
   ═══════════════════════════════════════════════════════════════════════════ */
.tf-cookbook-toc__preface {
    max-width: var(--max-width);
    width: 100%;
    margin: 0 auto var(--spacing-xl);
    padding: 0;
    box-sizing: border-box;
}
.tf-cookbook-toc__preface h2 {
    font-family: var(--font-important);
    font-size: var(--text-2xl);
    color: var(--gold);
    margin-bottom: var(--spacing-md);
}
.tf-cookbook-toc__preface p {
    font-family: var(--font-body);
    color: var(--light-text-secondary);
    font-size: var(--text-base);
    line-height: 1.8;
    margin-bottom: var(--spacing-md);
}
.tf-cookbook-toc__preface strong {
    color: var(--light-text-primary);
}

/* ═══════════════════════════════════════════════════════════════════════════
   9. TRADITIONS SECTION
   ═══════════════════════════════════════════════════════════════════════════ */
.traditions-section {
    background: var(--bg-mid);
    padding: var(--spacing-xxl) 0;
}
.traditions-section > .container {
    display: block;
    max-width: var(--max-width);
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--page-padding);
    padding-right: var(--page-padding);
    box-sizing: border-box;
}
.traditions-section .section-label {
    display: block;
    font-family: var(--font-important);
    font-size: var(--text-xs);
    font-weight: 500;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: var(--spacing-sm);
}
.traditions-section .section-title {
    font-family: var(--font-important);
    font-size: var(--text-2xl);
    font-weight: 500;
    letter-spacing: 0.02em;
    color: var(--light-text-primary);
    margin-bottom: var(--spacing-md);
}
.traditions-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 500px), 1fr));
    gap: var(--spacing-lg);
    margin-top: var(--spacing-xl);
}

/* Enhanced tradition cards for Holy Smoke */
.tf-cookbook-chapter {
    position: relative;
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    padding: var(--spacing-lg) var(--spacing-md);
    overflow: hidden;
    cursor: default;
    pointer-events: none;
}

/* Decorative corners */
.tf-cookbook-chapter__corner {
    position: absolute;
    width: 20px;
    height: 20px;
    border-color: var(--gold);
    opacity: 0.3;
}
.tf-cookbook-chapter__corner--tl {
    top: 0;
    left: 0;
    border-top: 1px solid;
    border-left: 1px solid;
}
.tf-cookbook-chapter__corner--tr {
    top: 0;
    right: 0;
    border-top: 1px solid;
    border-right: 1px solid;
}
.tf-cookbook-chapter__corner--bl {
    bottom: 0;
    left: 0;
    border-bottom: 1px solid;
    border-left: 1px solid;
}
.tf-cookbook-chapter__corner--br {
    bottom: 0;
    right: 0;
    border-bottom: 1px solid;
    border-right: 1px solid;
}

/* Symbol */
.tf-cookbook-chapter__symbol {
    position: absolute;
    top: var(--spacing-md);
    right: var(--spacing-md);
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--gold-08);
    border: 1px solid var(--border-gold);
    border-radius: var(--radius-full);
}
.tf-cookbook-chapter__symbol-char {
    font-family: var(--font-display);
    font-size: var(--text-2xl);
    color: var(--gold);
    font-weight: 500;
}

/* Content */
.tf-cookbook-chapter__content {
    position: relative;
    z-index: 1;
}
.tf-cookbook-chapter__origin {
    display: block;
    font-family: var(--font-mono);
    font-size: var(--text-2xs);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: var(--spacing-xs);
    opacity: 0.85;
}
.tf-cookbook-chapter__title {
    font-family: var(--font-display);
    font-size: var(--text-3xl);
    color: var(--light-text-primary);
    margin: 0 0 var(--spacing-sm-plus);
    letter-spacing: 0.02em;
}
.tf-cookbook-chapter__desc {
    font-family: var(--font-body);
    font-size: var(--text-xs-plus);
    line-height: 1.7;
    color: var(--ivory-90);
    margin: 0 0 var(--spacing-md);
}

/* Quote */
.tf-cookbook-chapter__quote {
    display: block;
    font-family: var(--font-body);
    font-size: var(--text-xs-plus);
    font-style: italic;
    line-height: 1.6;
    color: var(--ivory-70);
    padding: var(--spacing-sm) 0;
    margin: var(--spacing-md) 0;
    border-left: 2px solid var(--gold-30);
    padding-left: var(--spacing-md);
}
.tf-cookbook-chapter__quote-source {
    display: block;
    font-style: normal;
    font-family: var(--font-mono);
    font-size: var(--text-2xs);
    letter-spacing: 0.05em;
    color: var(--gold);
    margin-top: var(--spacing-xs);
    opacity: 0.8;
}

/* Divider */
.tf-cookbook-chapter__divider {
    text-align: center;
    color: var(--gold);
    opacity: 0.3;
    margin: var(--spacing-md) 0;
    font-size: var(--text-xs-plus);
}

/* Footer with key concept and practices */
.tf-cookbook-chapter__footer {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}
.tf-cookbook-chapter__key {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2xs);
}
.tf-cookbook-chapter__key-label {
    font-family: var(--font-mono);
    font-size: var(--text-2xs);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--gold);
    opacity: 0.8;
}
.tf-cookbook-chapter__key {
    font-family: var(--font-important);
    font-size: var(--text-xs-plus);
    color: var(--light-text-primary);
}
.tf-cookbook-chapter__practices {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-xs);
}
.tf-cookbook-chapter__practice {
    display: inline-block;
    font-family: var(--font-mono);
    font-size: var(--text-2xs);
    letter-spacing: 0.05em;
    padding: var(--spacing-2xs) var(--spacing-xs-plus);
    background: var(--gold-08);
    border: 1px solid var(--gold-20);
    color: var(--light-text-secondary);
    border-radius: var(--radius-md);
}

/* Texture and glow (removed for static design) */
.tf-cookbook-chapter__texture {
    display: none;
}
.tf-cookbook-chapter__glow {
    display: none;
}
.tf-cookbook-chapter__inner-border {
    display: none;
}

@media (max-width: 768px) {
    .traditions-grid {
        grid-template-columns: 1fr;
    }
    .tf-cookbook-chapter {
        padding: var(--spacing-md) var(--spacing-sm);
    }
    .tf-cookbook-chapter__symbol {
        width: 40px;
        height: 40px;
    }
    .tf-cookbook-chapter__symbol-char {
        font-size: var(--text-xl);
    }
    .tf-cookbook-chapter__title {
        font-size: var(--text-2xl);
    }
    /* Mobile reading improvements */
    .dark-section {
        padding: var(--spacing-lg) 0;
    }
    .stats-section {
        padding: var(--spacing-lg) 0 var(--spacing-xl);
    }
    .traditions-section {
        padding: var(--spacing-xl) 0;
    }
    .key-insight {
        padding: var(--spacing-md);
    }
    .teal-banner {
        padding: var(--spacing-md) 0;
    }
    .tf-cookbook-toc__preface {
        margin-bottom: var(--spacing-lg);
    }
    .section-title {
        font-size: var(--text-xl);
    }
    .topics-grid {
        grid-template-columns: 1fr;
        gap: var(--spacing-sm);
    }
}

@media (max-width: 480px) {
    /* Extra small screens - tighter spacing */
    .tf-cookbook-cover__inner {
        padding: var(--spacing-md) var(--spacing-sm);
    }
    .tf-cookbook-cover__title {
        font-size: clamp(1.75rem, 10vw, 2.5rem);
    }
    .tf-cookbook-cover__subtitle {
        font-size: var(--text-xs-plus);
        line-height: 1.7;
    }
    .dark-section > .container,
    .stats-section > .container,
    .traditions-section > .container,
    .teal-banner > .container {
        padding-left: var(--spacing-sm);
        padding-right: var(--spacing-sm);
    }
    .key-insight {
        padding: var(--spacing-sm);
    }
    .key-insight p {
        font-size: var(--text-xs-plus);
    }
    .tf-cookbook-chapter {
        padding: var(--spacing-sm);
    }
    .tf-cookbook-chapter__desc {
        font-size: var(--text-xs-plus);
    }
    .tf-cookbook-chapter__quote {
        font-size: var(--text-xs);
        padding-left: var(--spacing-sm);
    }
    .stat-card {
        padding: var(--spacing-sm);
    }
    .stat-card__number {
        font-size: var(--text-2xl);
    }
    .topic-card {
        padding: var(--spacing-md);
    }
    .topics-grid {
        grid-template-columns: 1fr;
        gap: var(--spacing-sm);
    }
    .teal-banner__quote {
        font-size: var(--text-base);
        line-height: 1.8;
    }
    .section-title {
        font-size: var(--text-lg);
        margin-bottom: var(--spacing-md);
    }
    .section-label {
        margin-bottom: var(--spacing-xs);
    }
    .site-footer > .container {
        padding-left: var(--spacing-sm);
        padding-right: var(--spacing-sm);
    }
}

/* ═══════════════════════════════════════════════════════════════════════════
   7. TOPICS SECTION
   ═══════════════════════════════════════════════════════════════════════════ */
.topics-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--spacing-md);
    margin-top: var(--spacing-lg);
}
.topic-card {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    padding: var(--spacing-lg);
    text-decoration: none;
    transition: all var(--dur-moderate) ease;
}
.topic-card:hover {
    border-color: var(--border-gold);
    background: var(--bg-elevated);
}
.topic-card__title {
    font-family: var(--font-important);
    font-size: var(--text-base);
    font-weight: 600;
    color: var(--light-text-primary);
    margin: 0 0 var(--spacing-xs);
}
.topic-card__desc {
    font-family: var(--font-body);
    font-size: var(--text-sm);
    color: var(--light-text-secondary);
    line-height: 1.7;
    margin: 0;
}

/* ═══════════════════════════════════════════════════════════════════════════
   8. FOOTER
   ═══════════════════════════════════════════════════════════════════════════ */
.site-footer {
    background: var(--bg-deep);
    border-top: 1px solid var(--border-subtle);
    padding: var(--spacing-lg) 0;
}
.site-footer > .container {
    display: block;
    max-width: var(--max-width);
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--page-padding);
    padding-right: var(--page-padding);
    box-sizing: border-box;
    text-align: center;
}
.site-footer__text {
    font-family: var(--font-body);
    font-size: var(--text-sm);
    color: var(--light-text-secondary);
}
.site-footer__logo {
    font-family: var(--font-display);
    color: var(--gold);
}