/* ==========================================================================
   TUNBRIDGE WELLNESS AFTERDARK - STYLESHEET
   A nocturnal sister portal for curious talks, folklore, and esoteric gatherings.
   Palette: Rich Plum Purple (matching main TW site) & Fiery Witchy Orange.
   ========================================================================== */

@font-face {
    font-family: 'Germania-Fallback';
    src: local('Times New Roman'), local('Georgia'), local('serif');
    ascent-override: 95%;
    descent-override: 25%;
    line-gap-override: 0%;
    size-adjust: 105%;
}

:root {
    --ad-bg-deep: #0E0A14;
    --ad-bg-surface: #171122;
    --ad-bg-card: #20172C;
    --ad-bg-card-hover: #2A1D3A;
    --ad-bg-card-glow: rgba(125, 90, 128, 0.2);

    /* Purple System (Rooted in TW brand plum #6C536D, enriched for nocturnal contrast) */
    --ad-purple-brand: #7D5A80;
    --ad-purple-light: #C4A2C6;
    --ad-purple-bright: #E4D0E6;
    --ad-purple-deep: #2A1730;
    --ad-purple-glow: 0 8px 30px rgba(125, 90, 128, 0.28);

    /* Muted Warm Dusk Amber / Terracotta (Refined, candlelit, replacing neon orange) */
    --ad-orange: #D48259;
    --ad-orange-light: #E5A27E;
    --ad-orange-bright: #F2BA9D;
    --ad-orange-glow: 0 4px 18px rgba(212, 130, 89, 0.25);

    /* Text */
    --ad-text-bright: #FAF7F5;
    --ad-text-body: #C9C4D0;
    --ad-text-muted: #8E8798;

    /* Borders */
    --ad-border-subtle: rgba(255, 255, 255, 0.08);
    --ad-border-purple: rgba(125, 90, 128, 0.35);
    --ad-border-orange: rgba(212, 130, 89, 0.35);

    /* Fonts */
    --ad-font-gothic: 'Germania One', 'Germania-Fallback', serif;
    --ad-font-serif: 'DM Serif Display', serif;
    --ad-font-sans: 'Inter', sans-serif;

    --ad-radius-sm: 8px;
    --ad-radius-md: 16px;
    --ad-radius-lg: 28px;
    --ad-radius-pill: 999px;

    --ad-transition: 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

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

/* Base Resets & Typography */
html {
    scroll-behavior: smooth;
}

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

a, button, input, select, textarea, label, [role="button"] {
    touch-action: manipulation;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.container, .ad-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 5%;
    box-sizing: border-box;
}

.purple, span.purple {
    color: var(--ad-purple-light);
}

.orange, span.orange {
    color: var(--ad-orange);
}

body.afterdark-body {
    background-color: var(--ad-bg-deep);
    color: var(--ad-text-body);
    font-family: var(--ad-font-sans);
    line-height: 1.65;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    position: relative;
    background-image: 
        radial-gradient(circle at 85% 12%, rgba(125, 90, 128, 0.28) 0%, transparent 45%),
        radial-gradient(circle at 15% 35%, rgba(212, 130, 89, 0.08) 0%, transparent 35%),
        radial-gradient(circle at 75% 70%, rgba(45, 24, 53, 0.5) 0%, transparent 50%),
        linear-gradient(180deg, #0E0A14 0%, #150F1E 50%, #0E0A14 100%);
    background-attachment: fixed;
}

/* Ambient Subtle Grain / Vignette */
body.afterdark-body::before {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(circle at 50% 50%, transparent 60%, rgba(0, 0, 0, 0.65) 100%);
    z-index: 999;
}

/* Headings */
h1.ad-title, h2.ad-title, h3.ad-title, .ad-gothic {
    font-family: var(--ad-font-gothic);
    letter-spacing: 0.03em;
    color: var(--ad-text-bright);
    margin: 0;
    font-weight: 400;
}

.ad-orange-text {
    color: var(--ad-orange);
}

.ad-purple-text {
    color: var(--ad-purple-light);
}

.ad-serif-italic {
    font-family: var(--ad-font-serif);
    font-style: italic;
    font-weight: 400;
}

.ad-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.76rem;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ad-orange);
    margin-bottom: 1rem;
}

.ad-eyebrow::before, .ad-eyebrow::after {
    content: '✦';
    font-size: 0.65rem;
    color: var(--ad-purple-light);
}

.ad-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 5%;
    box-sizing: border-box;
}

.ad-section-pad {
    padding: 6rem 0;
    position: relative;
}

/* Navigation Overrides for Afterdark */
.nav-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 5%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    box-sizing: border-box;
}

.brand-wordmark {
    display: flex;
    flex-direction: column;
    line-height: 0.95;
}

.nav-links {
    display: flex;
    align-items: center;
    gap: 1.8rem;
}

.nav-burger {
    display: none;
    flex-direction: column;
    gap: 5px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.5rem;
}

.nav-burger span {
    display: block;
    width: 22px;
    height: 2px;
    background: var(--ad-orange);
    border-radius: 2px;
    transition: all 0.3s ease;
}

.nav-burger.is-open span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.nav-burger.is-open span:nth-child(2) {
    opacity: 0;
}

.nav-burger.is-open span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

.nav-weather-notch-wrapper,
#nav-weather-notch-wrapper {
    position: absolute;
    top: 100%;
    right: max(28px, calc((100% - 1200px) / 2 + 2%));
    left: auto;
    transform: none;
    z-index: 1050;
    pointer-events: none;
    min-height: 38px;
    contain: layout;
}

.nav-weather-notch {
    position: relative;
    width: 120px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: auto;
    clip-path: polygon(0 0, 100% 0, calc(100% - 18px) 100%, 18px 100%);
    -webkit-clip-path: polygon(0 0, 100% 0, calc(100% - 18px) 100%, 18px 100%);
}

nav.afterdark-nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    padding: 1rem 0;
    background-color: rgba(12, 10, 15, 0.88);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--ad-border-purple);
    transition: all var(--ad-transition);
}

nav.afterdark-nav.scrolled {
    padding: 0.75rem 0;
    background-color: rgba(12, 10, 15, 0.96);
    border-bottom: 1px solid var(--ad-border-orange);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.6);
}

.brand-lockup--afterdark {
    display: flex;
    align-items: center;
    gap: 1rem;
    text-decoration: none;
    color: inherit;
}

/* ==========================================================================
   3D COIN FLIP LOGO (Owl <-> Tree)
   ========================================================================== */
.brand-mark--afterdark.ad-coin-container {
    width: 52px;
    height: 52px;
    perspective: 1000px;
    -webkit-perspective: 1000px;
    position: relative;
    cursor: pointer;
    filter: drop-shadow(0 0 12px rgba(212, 130, 89, 0.4));
    transition: filter var(--ad-transition);
}

.brand-mark--afterdark-footer.ad-coin-container {
    width: 88px;
    height: 88px;
    perspective: 1000px;
    -webkit-perspective: 1000px;
    position: relative;
    cursor: pointer;
    display: inline-block;
    filter: drop-shadow(0 0 16px rgba(212, 130, 89, 0.35));
    transition: filter var(--ad-transition);
}

.ad-coin-inner {
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    transition: transform 0.65s cubic-bezier(0.34, 1.4, 0.64, 1);
    animation: coinIntroSpin 1.1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* On page load: spins 540 degrees (1.5 turns) starting from Tree and settling onto Owl */
@keyframes coinIntroSpin {
    0% {
        transform: rotateY(540deg) scale(0.75);
        filter: drop-shadow(0 0 4px rgba(108, 83, 109, 0.5));
    }
    60% {
        transform: rotateY(-20deg) scale(1.1);
        filter: drop-shadow(0 0 20px rgba(212, 130, 89, 0.7));
    }
    80% {
        transform: rotateY(12deg) scale(1.02);
    }
    100% {
        transform: rotateY(0deg) scale(1);
        filter: drop-shadow(0 0 10px rgba(212, 130, 89, 0.4));
    }
}

.ad-coin-face {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.ad-coin-face img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 50%;
    display: block;
}

/* Front face = Owl (0deg, shown in Afterdark) */
.ad-coin-front {
    transform: rotateY(0deg);
    z-index: 2;
}

/* Back face = Tree (180deg, facing away until flipped) */
.ad-coin-back {
    transform: rotateY(180deg);
    z-index: 1;
}

/* On hover over the brand lockup or coin (or mobile tap .is-flipped): flip 180 degrees to show the Tree! */
.brand-lockup--afterdark:hover .ad-coin-inner,
.brand-lockup--afterdark-footer:hover .ad-coin-inner,
.ad-coin-container:hover .ad-coin-inner,
.ad-coin-inner.is-flipped {
    transform: rotateY(180deg) scale(1.06);
    animation: none;
}

.brand-lockup--afterdark:hover .ad-coin-container,
.brand-lockup--afterdark-footer:hover .brand-mark--afterdark-footer,
.ad-coin-container:hover,
.ad-coin-container.is-flipped {
    filter: drop-shadow(0 0 18px rgba(212, 130, 89, 0.75)) drop-shadow(0 0 25px rgba(108, 83, 109, 0.6));
}

.nav-title-img--afterdark {
    height: 48px;
    width: auto;
    transition: height var(--ad-transition);
    display: block;
    margin-bottom: 2px;
}

.brand-tagline--afterdark {
    font-family: var(--ad-font-gothic);
    font-size: 0.95rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ad-orange);
    text-shadow: 0 0 10px rgba(212, 130, 89, 0.45);
    display: block;
    line-height: 1;
    margin-top: 0.2rem;
    transition: all var(--ad-transition);
}

/* Scrolled state: compact header while preserving AFTERDARK branding */
nav.afterdark-nav.scrolled {
    padding: 0.6rem 0;
    background-color: rgba(12, 10, 15, 0.96);
    border-bottom: 1px solid var(--ad-border-purple);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.75);
}

nav.afterdark-nav.scrolled .brand-mark--afterdark.ad-coin-container {
    width: 44px;
    height: 44px;
}

nav.afterdark-nav.scrolled .nav-title-img--afterdark {
    height: 36px;
}

nav.afterdark-nav.scrolled .brand-tagline--afterdark {
    font-size: 0.8rem;
    margin-top: 0.1rem;
    opacity: 1 !important;
    max-height: 22px !important;
    overflow: visible !important;
}

nav.afterdark-nav .nav-links a {
    color: var(--ad-text-body);
    font-size: 0.88rem;
    font-weight: 500;
    text-decoration: none;
    transition: color var(--ad-transition);
}

nav.afterdark-nav .nav-links a:hover,
nav.afterdark-nav .nav-links a.active {
    color: var(--ad-orange-light);
    text-shadow: 0 0 10px rgba(212, 130, 89, 0.4);
}

.cta-pill--ad-orange {
    background: linear-gradient(135deg, #2D1A33 0%, #1B0F20 100%) !important;
    color: var(--ad-orange) !important;
    border: 1px solid var(--ad-border-orange) !important;
    font-weight: 600 !important;
    padding: 0.6rem 1.4rem !important;
    border-radius: var(--ad-radius-pill) !important;
    box-shadow: 0 2px 14px rgba(0, 0, 0, 0.4) !important;
    transition: all var(--ad-transition) !important;
    text-decoration: none;
}

.cta-pill--ad-orange:hover {
    background: linear-gradient(135deg, #3C2244 0%, #26152D 100%) !important;
    color: var(--ad-orange-light) !important;
    border-color: var(--ad-orange-light) !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 20px rgba(212, 130, 89, 0.25) !important;
}

/* ==========================================================================
   AFTERDARK AUTH HEADER & SUBTLE GHOST PILL
   ========================================================================== */
.ad-nav-action-container {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
}

.ad-nav-auth-container {
    display: inline-flex;
    align-items: center;
    position: relative;
}

.ad-nav-auth-logged-out {
    display: inline-flex;
    align-items: center;
}

.ad-nav-auth-logged-in {
    display: inline-flex;
    align-items: center;
}

.ad-nav-auth-logged-out.hidden,
.ad-nav-auth-logged-in.hidden {
    display: none !important;
}

body.user-logged-in .ad-nav-auth-logged-out,
html.user-logged-in .ad-nav-auth-logged-out,
body.user-logged-in #ad-nav-auth-logged-out,
html.user-logged-in #ad-nav-auth-logged-out {
    display: none !important;
}

body.user-logged-in .ad-nav-auth-logged-in,
html.user-logged-in .ad-nav-auth-logged-in,
body.user-logged-in #ad-nav-auth-logged-in,
html.user-logged-in #ad-nav-auth-logged-in {
    display: inline-flex !important;
}

body.user-logged-out .ad-nav-auth-logged-in,
html.user-logged-out .ad-nav-auth-logged-in,
body.user-logged-out #ad-nav-auth-logged-in,
html.user-logged-out #ad-nav-auth-logged-in {
    display: none !important;
}

body.user-logged-out .ad-nav-auth-logged-out,
html.user-logged-out .ad-nav-auth-logged-out,
body.user-logged-out #ad-nav-auth-logged-out,
html.user-logged-out #ad-nav-auth-logged-out {
    display: inline-flex !important;
}

/* Subtle Ghost Pill for Afterdark Sign In */
.cta-pill--ad-ghost {
    background: rgba(23, 17, 34, 0.65) !important;
    color: var(--ad-text-body) !important;
    border: 1px solid rgba(212, 130, 89, 0.35) !important;
    font-weight: 500 !important;
    font-size: 0.88rem !important;
    padding: 0.58rem 1.25rem !important;
    border-radius: var(--ad-radius-pill) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    transition: all var(--ad-transition) !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.cta-pill--ad-ghost:hover {
    background: linear-gradient(135deg, rgba(45, 26, 51, 0.9) 0%, rgba(27, 15, 32, 0.9) 100%) !important;
    color: var(--ad-orange-bright) !important;
    border-color: var(--ad-orange) !important;
    box-shadow: 0 0 16px rgba(212, 130, 89, 0.35), 0 2px 10px rgba(0, 0, 0, 0.5) !important;
    transform: translateY(-2px);
    text-shadow: 0 0 8px rgba(212, 130, 89, 0.4);
}

/* Nocturnal Avatar & Dropdown */
.ad-user-avatar-container {
    position: relative;
    cursor: pointer;
    z-index: 2010;
}

.ad-user-avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 35%, #2D1A33 0%, #150E1A 100%);
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid rgba(212, 130, 89, 0.45);
    box-shadow: 0 0 10px rgba(125, 90, 128, 0.3), 0 2px 6px rgba(0, 0, 0, 0.5);
    transition: all var(--ad-transition);
}

.ad-user-avatar-container:hover .ad-user-avatar,
.ad-user-avatar-container.is-open .ad-user-avatar,
.ad-user-avatar-container:focus-within .ad-user-avatar {
    border-color: var(--ad-orange-bright);
    box-shadow: 0 0 14px rgba(212, 130, 89, 0.45), 0 0 6px rgba(255, 255, 255, 0.15);
    transform: scale(1.04);
}

.ad-user-avatar-initials {
    font-family: var(--ad-font-serif);
    font-size: 0.95rem;
    color: var(--ad-orange-bright);
    font-weight: 500;
    text-shadow: 0 0 8px rgba(212, 130, 89, 0.5);
}

.ad-user-dropdown {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    background: #171122;
    border-radius: var(--ad-radius-md);
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.85), 0 0 20px rgba(125, 90, 128, 0.25);
    border: 1px solid var(--ad-border-purple);
    min-width: 220px;
    white-space: nowrap;
    padding: 0.5rem;
    z-index: 2020;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(10px);
    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
}

.ad-user-dropdown::before {
    content: '';
    position: absolute;
    top: -12px;
    left: 0;
    right: 0;
    height: 12px;
    background: transparent;
}

.ad-user-avatar-container.is-open .ad-user-dropdown,
.ad-user-avatar-container:hover .ad-user-dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.ad-user-dropdown .user-dropdown-link {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.65rem 0.85rem;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--ad-text-body) !important;
    border-radius: var(--ad-radius-sm);
    text-decoration: none;
    transition: all var(--ad-transition);
    background: transparent;
    border: none;
    width: 100%;
    cursor: pointer;
    font-family: var(--ad-font-sans);
    text-align: left;
    box-sizing: border-box;
}

.ad-user-dropdown .user-dropdown-link > * {
    pointer-events: none;
}

.ad-user-dropdown .user-dropdown-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ad-orange-bright, #F7931E);
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    transition: color var(--ad-transition);
}

.ad-user-dropdown .user-dropdown-label {
    flex: 1;
}

.ad-user-dropdown .user-dropdown-divider {
    height: 1px;
    background: rgba(212, 130, 89, 0.2);
    margin: 0.35rem 0.4rem;
    border: none;
}

.ad-user-dropdown .user-dropdown-link:hover {
    background: rgba(212, 130, 89, 0.12) !important;
    color: var(--ad-orange-bright) !important;
    text-shadow: 0 0 8px rgba(212, 130, 89, 0.35);
}

.ad-user-dropdown .user-dropdown-link.is-button {
    border-top: none;
    margin-top: 0;
    padding-top: 0.65rem;
    color: #e57373 !important;
}

.ad-user-dropdown .user-dropdown-link.is-button .user-dropdown-icon {
    color: #e57373 !important;
}

.ad-user-dropdown .user-dropdown-link.is-button:hover {
    background: rgba(229, 115, 115, 0.12) !important;
    color: #ff8a80 !important;
    text-shadow: none;
}

.ad-user-dropdown .user-dropdown-link.is-button:hover .user-dropdown-icon {
    color: #ff8a80 !important;
}

/* Burger menu in dark */
nav.afterdark-nav .nav-burger span {
    background: var(--ad-orange);
}

/* Mobile Actions in Header (hidden on desktop) */
.nav-mobile-actions {
    display: none;
    align-items: center;
    gap: 0.75rem;
}

.cta-pill--mobile-header {
    display: none;
}

/* ==========================================================================
   HERO SECTION
   ========================================================================== */
.ad-hero {
    min-height: 92vh;
    display: flex;
    align-items: center;
    padding-top: calc(var(--header-height, 100px) + 3rem);
    padding-bottom: 5rem;
    position: relative;
    contain: layout;
}

.ad-hero-grid {
    display: grid;
    grid-template-columns: 1.25fr 0.95fr;
    gap: 4.5rem;
    align-items: start;
    contain: layout;
}

.ad-hero-content {
    contain: layout;
}

.ad-hero-content h1 {
    font-family: var(--ad-font-gothic);
    font-size: clamp(3.2rem, 6.5vw, 5.2rem);
    line-height: 1.15;
    color: var(--ad-text-bright);
    margin: 0.6rem 0 1.6rem;
    letter-spacing: 0.02em;
    min-height: 2.3em;
    contain: layout;
}

.ad-hero-content h1 span.orange {
    color: var(--ad-orange);
    text-shadow: 0 0 24px rgba(212, 130, 89, 0.35);
}

.ad-hero-content h1 span.purple {
    color: var(--ad-purple-light);
    text-shadow: 0 0 24px rgba(125, 90, 128, 0.5);
}

.ad-hero-content p.ad-intro {
    font-size: 1.15rem;
    color: var(--ad-text-body);
    line-height: 1.7;
    max-width: 540px;
    margin-bottom: 2.5rem;
}

.ad-hero-actions {
    display: flex;
    gap: 1.2rem;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 3.5rem;
    contain: layout;
}

.btn-ad-primary {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    background: linear-gradient(135deg, #7A587B 0%, #543756 100%);
    color: #FAF7F5;
    font-weight: 600;
    padding: 0.95rem 2.2rem;
    border-radius: var(--ad-radius-pill);
    font-size: 0.95rem;
    text-decoration: none;
    border: 1px solid rgba(212, 130, 89, 0.38);
    box-shadow: 0 4px 20px rgba(122, 88, 123, 0.35);
    transition: all var(--ad-transition);
}

.btn-ad-primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(122, 88, 123, 0.5), 0 0 15px rgba(212, 130, 89, 0.3);
    background: linear-gradient(135deg, #8E6890 0%, #68466A 100%);
    border-color: rgba(229, 162, 126, 0.6);
    color: #FFFFFF;
}

.btn-ad-secondary {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    background: rgba(125, 90, 128, 0.14);
    color: var(--ad-purple-light);
    border: 1.5px solid rgba(196, 162, 198, 0.35);
    font-weight: 500;
    padding: 0.95rem 2rem;
    border-radius: var(--ad-radius-pill);
    font-size: 0.95rem;
    text-decoration: none;
    transition: all var(--ad-transition);
    backdrop-filter: blur(8px);
}

.btn-ad-secondary:hover {
    background: rgba(125, 90, 128, 0.28);
    border-color: var(--ad-purple-light);
    color: #FFFFFF;
    transform: translateY(-2px);
    box-shadow: 0 4px 20px rgba(125, 90, 128, 0.25);
}

.btn-ad-outline {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: transparent;
    color: var(--ad-purple-light);
    border: 1.5px solid rgba(196, 162, 198, 0.3);
    font-weight: 500;
    padding: 0.65rem 1.4rem;
    border-radius: var(--ad-radius-pill);
    font-size: 0.85rem;
    text-decoration: none;
    transition: all var(--ad-transition);
}

.btn-ad-outline:hover {
    border-color: var(--ad-purple-light);
    color: #FFFFFF;
    background: rgba(125, 90, 128, 0.15);
}

.ad-hero-meta {
    display: flex;
    align-items: center;
    gap: 2rem;
    border-top: 1px solid var(--ad-border-purple);
    padding-top: 2rem;
}

.ad-meta-item strong {
    display: block;
    font-family: var(--ad-font-gothic);
    font-size: 1.6rem;
    color: var(--ad-orange);
    line-height: 1;
}

.ad-meta-item span {
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ad-purple-light);
}

.ad-meta-divider {
    width: 1px;
    height: 32px;
    background: var(--ad-border-purple);
}

/* Hero Visual Portal Card */
.ad-hero-visual {
    position: relative;
}

.ad-portal-frame {
    position: relative;
    border-radius: 240px 240px var(--ad-radius-lg) var(--ad-radius-lg);
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.85);
    background: #110E17;
}

.ad-portal-image {
    width: 100%;
    aspect-ratio: 3 / 3.9;
    border-radius: 239px 239px calc(var(--ad-radius-lg) - 1px) calc(var(--ad-radius-lg) - 1px);
    background-size: cover;
    background-position: center;
    position: relative;
}

.ad-portal-image::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 40%, rgba(12, 10, 15, 0.85) 100%);
}

.ad-floating-badge {
    position: absolute;
    background: rgba(20, 17, 26, 0.9);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--ad-border-purple);
    padding: 0.65rem 1.25rem;
    border-radius: var(--ad-radius-pill);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 0.82rem;
    color: var(--ad-text-bright);
    white-space: nowrap;
    animation: floatBadge 5s ease-in-out infinite;
}

.ad-badge-1 {
    top: 15%;
    left: -8%;
    border-color: var(--ad-border-orange);
}

.ad-badge-2 {
    bottom: 12%;
    right: -6%;
    animation-delay: 2.2s;
    border-color: var(--ad-border-purple);
}

@keyframes floatBadge {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-8px); }
}

/* ==========================================================================
   FEATURED EVENT: CONSCIOUS SESSIONS (Spotlight on Legendary & Ghostly Kent)
   ========================================================================== */
.ad-spotlight-section {
    background: linear-gradient(180deg, transparent 0%, rgba(26, 21, 34, 0.5) 30%, transparent 100%);
}

.ad-section-header {
    text-align: center;
    max-width: 700px;
    margin: 0 auto 4rem;
}

.ad-section-header h2 {
    font-size: clamp(2.4rem, 4.5vw, 3.4rem);
    margin-top: 0.4rem;
    margin-bottom: 1rem;
    color: var(--ad-purple-bright);
}

.ad-section-header p {
    color: var(--ad-text-muted);
    font-size: 1.05rem;
}

.ad-section-header-split {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 2rem;
    margin-bottom: 3.5rem;
    flex-wrap: wrap;
}

.ad-section-header-split h2 {
    font-size: clamp(2.2rem, 4vw, 3.2rem);
    margin-top: 0.4rem;
    margin-bottom: 0.6rem;
    color: var(--ad-purple-bright);
}

.ad-section-header-split p {
    color: var(--ad-text-muted);
    font-size: 1.05rem;
    max-width: 650px;
    margin: 0;
}

.ad-sessions-stack {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    max-width: 1140px;
    margin: 0 auto;
}

#conscious-sessions.ad-spotlight-section {
    padding: 3rem 0 3.5rem;
}

#conscious-sessions .ad-section-header {
    margin: 0 auto 2rem;
    text-align: center;
}

#conscious-sessions .ad-section-header h2 {
    font-size: clamp(1.8rem, 2.8vw, 2.4rem);
    margin-top: 0.2rem;
    margin-bottom: 0.4rem;
}

#conscious-sessions .ad-section-header p {
    font-size: 0.95rem;
    line-height: 1.5;
    max-width: 620px;
}

.ad-event-showcase-card {
    background: var(--ad-bg-card);
    border: 1px solid var(--ad-border-purple);
    border-radius: var(--ad-radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.7), var(--ad-purple-glow);
    transition: transform var(--ad-transition), box-shadow var(--ad-transition), border-color var(--ad-transition);
}

.ad-event-showcase-card:hover {
    transform: translateY(-4px);
    border-color: var(--ad-border-orange);
    box-shadow: 0 25px 70px rgba(0, 0, 0, 0.85), var(--ad-orange-glow);
}

.ad-showcase-image-col {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background-size: cover;
    background-position: center center;
    background-color: #000;
}

.ad-showcase-image-col::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 55%, rgba(12, 10, 15, 0.6) 80%, var(--ad-bg-card) 100%);
}

.ad-showcase-tag {
    position: absolute;
    top: 1rem;
    left: 1rem;
    background: rgba(12, 10, 15, 0.9);
    border: 1px solid var(--ad-orange);
    color: var(--ad-orange);
    padding: 0.3rem 0.8rem;
    border-radius: var(--ad-radius-pill);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    backdrop-filter: blur(8px);
    z-index: 2;
}

.ad-showcase-info-col {
    padding: 1.35rem 1.6rem 1.45rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex: 1;
}

.ad-event-series-label {
    font-family: var(--ad-font-gothic);
    font-size: 0.88rem;
    color: var(--ad-orange);
    margin-bottom: 0.2rem;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.ad-event-showcase-title {
    font-family: var(--ad-font-gothic);
    font-size: clamp(1.15rem, 1.35vw, 1.34rem);
    line-height: 1.22;
    color: var(--ad-text-bright);
    margin-bottom: 0.3rem;
    min-height: 2.2rem;
    display: flex;
    align-items: center;
}

.ad-event-subtitle {
    font-family: var(--ad-font-serif);
    font-style: italic;
    font-size: 0.88rem;
    color: var(--ad-purple-light);
    margin-bottom: 0.5rem;
    line-height: 1.32;
}

.ad-event-description {
    font-size: 0.84rem;
    color: var(--ad-text-body);
    margin-bottom: 0.75rem;
    line-height: 1.5;
}

.ad-desc-tailoff {
    color: var(--ad-orange);
    text-decoration: none;
    font-weight: 600;
    font-size: 0.82rem;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    transition: color var(--ad-transition), text-shadow var(--ad-transition);
}

.ad-desc-tailoff:hover {
    color: #ff9858;
    text-shadow: 0 0 8px rgba(212, 130, 89, 0.5);
    text-decoration: underline;
}

.ad-speaker-box {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background: rgba(108, 83, 109, 0.12);
    border: 1px solid var(--ad-border-purple);
    padding: 0.5rem 0.8rem;
    border-radius: var(--ad-radius-md);
    margin-bottom: 0.75rem;
    min-height: 62px;
}

.ad-speaker-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1.5px solid var(--ad-orange);
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--ad-bg-deep);
    color: var(--ad-orange);
    font-family: var(--ad-font-gothic);
    font-size: 0.95rem;
    flex-shrink: 0;
}

.ad-speaker-details strong {
    display: block;
    color: var(--ad-text-bright);
    font-size: 0.84rem;
}

.ad-speaker-details span {
    font-size: 0.74rem;
    color: var(--ad-text-muted);
    line-height: 1.3;
}

.ad-event-meta-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--ad-border-purple);
}

.ad-event-meta-cell {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
}

.ad-event-meta-cell svg {
    color: var(--ad-orange);
    flex-shrink: 0;
    margin-top: 2px;
}

.ad-event-meta-cell strong {
    display: block;
    font-size: 0.82rem;
    color: var(--ad-text-bright);
}

.ad-event-meta-cell span {
    font-size: 0.76rem;
    color: var(--ad-text-muted);
}

.ad-showcase-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.ad-ticket-pricing {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
}

.ad-ticket-pricing span {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ad-text-muted);
    white-space: nowrap;
}

.ad-ticket-pricing strong {
    font-family: var(--ad-font-gothic);
    font-size: 0.92rem;
    color: var(--ad-orange);
    white-space: nowrap;
}

.ad-action-btn-group {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    flex-wrap: nowrap;
}

.ad-showcase-actions .btn-ad-primary,
.ad-showcase-actions .btn-ad-secondary {
    padding: 0.44rem 0.95rem;
    font-size: 0.81rem;
    white-space: nowrap;
}

@media (max-width: 900px) {
    .ad-sessions-stack {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
}

@media (max-width: 520px) {
    .ad-showcase-actions {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    .ad-action-btn-group {
        width: 100%;
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}

/* ==========================================================================
   FEATURED SERIES: THE COVEN (Witchy Monthly Meetup)
   ========================================================================== */
.ad-coven-section {
    position: relative;
}

.ad-coven-banner {
    background: radial-gradient(circle at 10% 50%, rgba(108, 83, 109, 0.45) 0%, transparent 65%),
                linear-gradient(135deg, rgba(26, 21, 34, 0.95) 0%, rgba(16, 13, 21, 0.98) 100%);
    border: 1px solid var(--ad-border-purple);
    border-radius: var(--ad-radius-lg);
    padding: 4.5rem 3.5rem;
    margin-bottom: 3.5rem;
    position: relative;
    overflow: hidden;
}

.ad-coven-banner::after {
    content: '☾';
    position: absolute;
    right: 3%;
    top: -5%;
    font-size: 16rem;
    color: rgba(212, 130, 89, 0.05);
    pointer-events: none;
    line-height: 1;
}

.ad-coven-banner-inner {
    max-width: 780px;
    position: relative;
    z-index: 1;
}

.ad-coven-banner h3 {
    font-family: var(--ad-font-gothic);
    font-size: clamp(2.2rem, 4vw, 3.2rem);
    color: var(--ad-text-bright);
    margin-bottom: 0.8rem;
}

.ad-coven-banner p.coven-lead {
    font-size: 1.12rem;
    color: var(--ad-text-body);
    line-height: 1.7;
    margin-bottom: 2rem;
}

.ad-coven-pillars {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

.ad-pillar-card {
    background: var(--ad-bg-card);
    border: 1px solid var(--ad-border-purple);
    border-radius: var(--ad-radius-md);
    padding: 2.2rem 1.8rem;
    transition: all var(--ad-transition);
    display: flex;
    flex-direction: column;
}

.ad-pillar-card:hover {
    border-color: var(--ad-border-orange);
    background: var(--ad-bg-card-hover);
    transform: translateY(-4px);
    box-shadow: var(--ad-orange-glow);
}

.ad-pillar-icon {
    font-size: 2rem;
    color: var(--ad-orange);
    margin-bottom: 1.2rem;
    line-height: 1;
}

.ad-pillar-card h4 {
    font-family: var(--ad-font-gothic);
    font-size: 1.35rem;
    color: var(--ad-purple-bright);
    margin-bottom: 0.8rem;
}

.ad-pillar-card p {
    font-size: 0.9rem;
    color: var(--ad-text-muted);
    line-height: 1.6;
    margin: 0;
}

/* ==========================================================================
   CURATED NOCTURNAL TOPICS / GATHERINGS
   ========================================================================== */
.ad-gatherings-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    margin-top: 3rem;
}

.ad-gathering-card {
    background: var(--ad-bg-card);
    border: 1px solid var(--ad-border-purple);
    border-radius: var(--ad-radius-md);
    padding: 2rem 1.5rem;
    transition: all var(--ad-transition);
    position: relative;
    overflow: hidden;
}

.ad-gathering-card:hover {
    border-color: var(--ad-border-orange);
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6);
}

.ad-gathering-badge {
    font-size: 0.7rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--ad-orange);
    margin-bottom: 0.8rem;
    display: block;
}

.ad-gathering-card h3,
.ad-gathering-card h4 {
    font-family: var(--ad-font-gothic);
    font-size: 1.25rem;
    color: var(--ad-purple-bright);
    margin-bottom: 0.65rem;
}

.ad-gathering-card p {
    font-size: 0.85rem;
    color: var(--ad-text-muted);
    line-height: 1.6;
    margin: 0;
}

/* ==========================================================================
   THE NOCTURNAL COLLECTIVE (Call for Practitioners & Esoteric Guides)
   ========================================================================== */
.ad-collective-card {
    position: relative;
    background: radial-gradient(circle at 10% 20%, rgba(108, 83, 109, 0.25) 0%, transparent 60%),
                radial-gradient(circle at 90% 80%, rgba(212, 130, 89, 0.12) 0%, transparent 60%),
                linear-gradient(135deg, #16121D 0%, #0D0B12 100%);
    border: 1px solid var(--ad-border-purple);
    border-radius: var(--ad-radius-lg);
    padding: 4.5rem 3.5rem;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.75), var(--ad-purple-glow);
    overflow: hidden;
    transition: border-color var(--ad-transition), box-shadow var(--ad-transition);
}

.ad-collective-card:hover {
    border-color: rgba(212, 130, 89, 0.45);
    box-shadow: 0 25px 70px rgba(0, 0, 0, 0.85), var(--ad-orange-glow);
}

.ad-collective-header {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 3.2rem;
}

.ad-collective-header h2 {
    font-size: clamp(2.3rem, 4.2vw, 3.4rem);
    margin-top: 0.4rem;
    margin-bottom: 1.1rem;
    color: var(--ad-purple-bright);
}

.ad-collective-intro {
    color: var(--ad-text-body);
    font-size: 1.05rem;
    line-height: 1.7;
    margin: 0;
}

.ad-collective-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.8rem;
    margin-bottom: 3.5rem;
}

.ad-collective-perk {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(184, 149, 185, 0.18);
    border-radius: var(--ad-radius-md);
    padding: 2.2rem 1.6rem;
    display: flex;
    gap: 1.1rem;
    align-items: flex-start;
    transition: all var(--ad-transition);
}

.ad-collective-perk:hover {
    background: rgba(255, 255, 255, 0.04);
    border-color: var(--ad-border-orange);
    transform: translateY(-3px);
}

.ad-perk-icon {
    font-size: 1.6rem;
    color: var(--ad-orange);
    line-height: 1;
    flex-shrink: 0;
    margin-top: 2px;
}

.ad-perk-body h4 {
    font-family: var(--ad-font-gothic);
    font-size: 1.25rem;
    color: var(--ad-text-bright);
    margin-bottom: 0.5rem;
}

.ad-perk-body p {
    font-size: 0.88rem;
    color: var(--ad-text-muted);
    line-height: 1.6;
    margin: 0;
}

.ad-collective-action-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    padding-top: 2.8rem;
    border-top: 1px solid var(--ad-border-purple);
    flex-wrap: wrap;
}

.ad-collective-action-text {
    max-width: 560px;
}

.ad-collective-action-text h3 {
    font-family: var(--ad-font-gothic);
    font-size: 1.55rem;
    color: var(--ad-purple-bright);
    margin-bottom: 0.4rem;
}

.ad-collective-action-text p {
    font-size: 0.92rem;
    color: var(--ad-text-muted);
    line-height: 1.55;
    margin: 0;
}

.ad-collective-action-btns {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

/* Journal Collective Callout Banner */
.ad-journal-collective-banner {
    background: radial-gradient(circle at 90% 50%, rgba(212, 130, 89, 0.12) 0%, transparent 60%),
                radial-gradient(circle at 10% 50%, rgba(108, 83, 109, 0.18) 0%, transparent 60%),
                linear-gradient(135deg, #181320 0%, #0F0D14 100%);
    border: 1px solid var(--ad-border-purple);
    border-radius: var(--ad-radius-lg);
    padding: 3.2rem 2.8rem;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.6);
    transition: border-color var(--ad-transition);
}

.ad-journal-collective-banner:hover {
    border-color: rgba(212, 130, 89, 0.4);
}

.ad-jcb-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2.5rem;
    flex-wrap: wrap;
}

.ad-jcb-content {
    max-width: 640px;
}

.ad-jcb-content h3 {
    font-family: var(--ad-font-gothic);
    font-size: clamp(1.6rem, 2.5vw, 2.1rem);
    color: var(--ad-text-bright);
    margin-top: 0.4rem;
    margin-bottom: 0.6rem;
}

.ad-jcb-content p {
    color: var(--ad-text-muted);
    font-size: 0.95rem;
    line-height: 1.6;
    margin: 0;
}

/* ==========================================================================
   NIGHT DISPATCH (Newsletter Signup)
   ========================================================================== */
.ad-dispatch-card {
    background: radial-gradient(circle at 50% 0%, rgba(108, 83, 109, 0.3) 0%, transparent 75%),
                linear-gradient(180deg, #1C1625 0%, #110E17 100%);
    border: 1px solid var(--ad-border-purple);
    border-radius: var(--ad-radius-lg);
    padding: 5rem 3rem;
    text-align: center;
    max-width: 820px;
    margin: 0 auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.7);
}

.ad-dispatch-card h3 {
    font-family: var(--ad-font-gothic);
    font-size: clamp(2.4rem, 4.5vw, 3.4rem);
    color: var(--ad-text-bright);
    margin-bottom: 0.8rem;
}

.ad-dispatch-card p {
    color: var(--ad-text-body);
    font-size: 1.05rem;
    max-width: 580px;
    margin: 0 auto 2.5rem;
    line-height: 1.7;
}

.ad-dispatch-form {
    display: flex;
    max-width: 520px;
    margin: 0 auto;
    border-radius: var(--ad-radius-pill);
    overflow: hidden;
    border: 1px solid var(--ad-border-orange);
    background: rgba(12, 10, 15, 0.85);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.5);
}

.ad-dispatch-form:focus-within {
    outline: 3px solid var(--ad-orange);
    outline-offset: -3px;
}

.ad-dispatch-form input {
    flex: 1;
    padding: 1.1rem 1.6rem;
    border: none;
    background: transparent;
    color: var(--ad-text-bright);
    font-family: var(--ad-font-sans);
    font-size: 0.95rem;
    outline: none;
}

.ad-dispatch-form input::placeholder {
    color: var(--ad-text-muted);
}

.ad-dispatch-form button {
    background: linear-gradient(135deg, #7A587B 0%, #543756 100%);
    color: #FFFFFF;
    font-family: var(--ad-font-sans);
    font-size: 0.92rem;
    font-weight: 600;
    border: none;
    padding: 1.1rem 2rem;
    cursor: pointer;
    transition: all var(--ad-transition);
    white-space: nowrap;
}

.ad-dispatch-form button:hover {
    background: linear-gradient(135deg, #8E6890 0%, #68466A 100%);
}

.ad-dispatch-note {
    font-size: 0.78rem;
    color: var(--ad-text-muted);
    margin-top: 1.2rem;
}

/* ==========================================================================
   FOOTER (AFTERDARK)
   ========================================================================== */
footer.afterdark-footer {
    background: #08060A;
    border-top: 1px solid var(--ad-border-purple);
    padding: 4.5rem 0 2rem;
    color: var(--ad-text-muted);
}

footer.afterdark-footer .footer-inner {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: clamp(3rem, 8vw, 6rem);
    padding-bottom: 2.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

footer.afterdark-footer .footer-brand {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

footer.afterdark-footer .footer-links {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

footer.afterdark-footer .footer-links > div {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

footer.afterdark-footer .footer-bottom {
    padding-top: 1.5rem;
    font-size: 0.78rem;
    color: var(--ad-text-muted);
}

footer.afterdark-footer .socials {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    margin-top: 1rem;
}

footer.afterdark-footer .social-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    text-decoration: none;
    box-sizing: border-box;
    background: rgba(108, 83, 109, 0.15);
    border: 1px solid var(--ad-border-purple);
    color: var(--ad-orange);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1), background 0.3s ease, border-color 0.3s ease;
}

footer.afterdark-footer .social-link:hover {
    transform: translateY(-3px) scale(1.08);
    border-color: var(--ad-orange);
    color: #FFFFFF;
    background: rgba(212, 130, 89, 0.25);
}

.floating-back-to-top {
    position: fixed;
    bottom: 2.25rem;
    right: 2.25rem;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(26, 21, 34, 0.88);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    border: 1px solid var(--ad-border-purple);
    box-shadow: 0 8px 24px -4px rgba(0, 0, 0, 0.4);
    color: var(--ad-orange);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 9999;
    opacity: 0;
    visibility: hidden;
    transform: translateY(16px) scale(0.92);
    transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1), transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    outline: 2px solid var(--forest, #2C4A3E);
outline-offset: 2px;
}

.floating-back-to-top.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
}

.floating-back-to-top:hover {
    background: var(--ad-bg-card-hover);
    color: var(--ad-orange-light);
    border-color: var(--ad-orange);
    box-shadow: 0 14px 32px -4px rgba(212, 130, 89, 0.3);
    transform: translateY(-4px) scale(1.05);
}

@media (max-width: 900px) {
    footer.afterdark-footer .footer-inner {
        grid-template-columns: 1fr;
        gap: 3rem;
    }
    footer.afterdark-footer .footer-links {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    footer.afterdark-footer .footer-links {
        grid-template-columns: 1fr;
    }
    .floating-back-to-top {
        bottom: 1.5rem;
        right: 1.5rem;
        width: 44px;
        height: 44px;
    }
}

.brand-lockup--afterdark-footer {
    display: inline-flex !important;
    align-items: center !important;
    gap: 1.25rem !important;
    text-decoration: none;
    cursor: pointer;
}

.brand-mark--afterdark-footer {
    flex-shrink: 0;
    filter: drop-shadow(0 0 15px rgba(212, 130, 89, 0.3));
}

.brand-lockup--afterdark-footer .footer-brand-wordmark {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    flex-shrink: 0;
}

.brand-lockup--afterdark-footer .footer-title-img {
    display: block;
    height: 44px;
    width: auto;
    margin: 0 auto;
}

.brand-lockup--afterdark-footer .brand-tagline--afterdark {
    display: block;
    width: 100%;
    text-align: center;
    font-size: 0.95rem;
    letter-spacing: 0.18em;
    text-indent: 0.18em;
    margin-top: 0.35rem;
}

.afterdark-footer-tagline {
    font-size: 0.88rem;
    color: var(--ad-purple-light);
    margin-top: 0.8rem;
    max-width: 280px;
    line-height: 1.6;
}

footer.afterdark-footer .footer-links h3 {
    font-family: var(--ad-font-gothic);
    font-size: 1.15rem;
    color: var(--ad-orange);
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 1.2rem;
}

footer.afterdark-footer .footer-links a {
    color: var(--ad-text-body);
    font-size: 0.88rem;
    text-decoration: none;
    margin-bottom: 0.7rem;
    display: inline-block;
    transition: color var(--ad-transition);
}

footer.afterdark-footer .footer-links a:hover {
    color: var(--ad-orange-light);
}

footer.afterdark-footer .social-link {
    background: rgba(108, 83, 109, 0.15);
    border: 1px solid var(--ad-border-purple);
    color: var(--ad-orange);
}

footer.afterdark-footer .social-link:hover {
    border-color: var(--ad-orange);
    color: #FFFFFF;
    background: rgba(212, 130, 89, 0.25);
}

/* ==========================================================================
   RESPONSIVE DESIGN
   ========================================================================== */
@media (max-width: 992px) {
    .ad-hero-grid {
        grid-template-columns: 1fr;
        gap: 3.5rem;
    }
    .ad-showcase-image-col {
        aspect-ratio: 16 / 9;
        min-height: unset;
    }
    .ad-showcase-details-row {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    .ad-coven-pillars {
        grid-template-columns: 1fr;
    }
    .ad-gatherings-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .ad-collective-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .ad-showcase-image-col--session-02,
    .ad-journal-teaser-img--session-02 {
        background-image: url('./assets/psychedelics-altered-mind-mobile.webp') !important;
    }
    .ad-hero {
        padding-top: calc(var(--header-height, 100px) + 2rem);
    }
    .ad-showcase-info-col {
        padding: 2.5rem 1.8rem;
    }
    .ad-coven-banner {
        padding: 3rem 1.8rem;
    }
    .ad-gatherings-grid {
        grid-template-columns: 1fr;
    }
    .ad-collective-card {
        padding: 3rem 1.8rem;
    }
    .ad-collective-action-box {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
    }
    .ad-collective-action-btns {
        justify-content: center;
    }
    .ad-journal-collective-banner {
        padding: 2.5rem 1.6rem;
    }
    .ad-jcb-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 1.8rem;
    }
    .ad-dispatch-card {
        padding: 3.5rem 1.5rem;
    }
    .ad-dispatch-form {
        flex-direction: column;
        border-radius: var(--ad-radius-md);
    }
    .ad-dispatch-form button {
        border-radius: 0 0 var(--ad-radius-md) var(--ad-radius-md);
        padding: 1rem;
    }
    .ad-dispatch-form input {
        border-radius: var(--ad-radius-md) var(--ad-radius-md) 0 0;
        text-align: center;
    }

    /* Mobile Header Persistent Actions & Nocturnal Drawer */
    .nav-mobile-actions {
        display: flex;
    }
    
    .cta-pill--mobile-header {
        display: inline-flex !important;
        padding: 0.42rem 0.95rem !important;
        font-size: 0.8rem !important;
        letter-spacing: 0.02em;
        white-space: nowrap;
    }
    
    .nav-links {
        display: none;
        position: absolute;
        top: calc(100% + 0.85rem);
        left: 5%;
        right: 5%;
        max-height: calc(100vh - var(--header-height, 104px) - 1.5rem);
        max-height: calc(100dvh - var(--header-height, 104px) - 1.5rem);
        overflow-y: auto !important;
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-y: contain;
        padding: 1rem 1rem 3rem 1rem !important;
        border-radius: 16px;
        flex-direction: column;
        gap: 0.25rem;
        z-index: 120;
        box-sizing: border-box;
    }

    .nav-burger {
        display: flex;
    }

    .nav-links.nav-links--open {
        display: flex;
    }

    nav.afterdark-nav .nav-links {
        background: rgba(20, 17, 26, 0.97) !important;
        border: 1px solid var(--ad-border-purple) !important;
        box-shadow: 0 16px 48px rgba(0, 0, 0, 0.9), var(--ad-purple-glow) !important;
        backdrop-filter: blur(20px) !important;
        -webkit-backdrop-filter: blur(20px) !important;
    }

    nav.afterdark-nav .nav-links a:hover {
        background-color: rgba(212, 130, 89, 0.12) !important;
        color: var(--ad-orange-light) !important;
    }

    /* Mobile Compact Cookie Banner */
    .cookie-banner {
        padding: 0.85rem 1.1rem !important;
    }
    
    .cookie-content {
        gap: 0.75rem !important;
    }

    .cookie-content p {
        font-size: 0.78rem !important;
        line-height: 1.45 !important;
    }

    .cookie-buttons {
        width: 100% !important;
        display: flex !important;
        flex-direction: row !important;
        gap: 0.6rem !important;
    }

    .cookie-buttons button {
        flex: 1 !important;
        text-align: center !important;
        justify-content: center !important;
        padding: 0.55rem 0.8rem !important;
        font-size: 0.8rem !important;
        white-space: nowrap !important;
    }
}

/* ==========================================================================
   COOKIE BANNER (AFTERDARK NOCTURNAL)
   ========================================================================== */
.cookie-banner--afterdark {
    background: rgba(18, 14, 24, 0.96) !important;
    border-top: 1px solid var(--ad-border-purple) !important;
    box-shadow: 0 -4px 25px rgba(0, 0, 0, 0.75), var(--ad-purple-glow) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
}

.cookie-banner--afterdark p {
    color: var(--ad-text-body) !important;
}

.cookie-banner--afterdark a {
    color: var(--ad-orange) !important;
}

.cookie-banner--afterdark .btn-ad-primary {
    padding: 0.6rem 1.4rem !important;
    font-size: 0.85rem !important;
}

.cookie-banner--afterdark .btn-ad-secondary {
    padding: 0.6rem 1.4rem !important;
    font-size: 0.85rem !important;
}

/* ==========================================================================
   AFTERDARK JOURNAL & CHRONICLES
   ========================================================================== */
.ad-journal-page {
    padding-top: calc(var(--header-height, 100px) + 3rem);
    padding-bottom: 5rem;
    min-height: 100vh;
}

.ad-journal-header {
    text-align: left;
    margin-bottom: 3.5rem;
    border-bottom: 1px solid var(--ad-border-purple);
    padding-bottom: 2.5rem;
}

.ad-journal-eyebrow {
    font-family: var(--ad-font-gothic);
    color: var(--ad-orange);
    font-size: 0.95rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 0.5rem;
    display: inline-block;
}

.ad-journal-title {
    font-family: var(--ad-font-gothic);
    font-size: clamp(2.6rem, 5.5vw, 4rem);
    color: var(--ad-purple-bright);
    line-height: 1.1;
    margin-bottom: 0.85rem;
}

.ad-journal-desc {
    color: var(--ad-text-muted);
    font-size: 1.12rem;
    max-width: 650px;
    line-height: 1.65;
    margin: 0 0 2rem 0;
}

/* Controls: Filter Pills & Search */
.ad-journal-controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1.5rem;
    flex-wrap: wrap;
    min-height: 48px;
    contain: layout;
}

#ad-filters,
.ad-filter-pills {
    min-height: 40px;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.ad-filter-pill {
    background: rgba(26, 21, 34, 0.7);
    border: 1px solid var(--ad-border-purple);
    color: var(--ad-text-muted);
    padding: 0.5rem 1.15rem;
    border-radius: var(--ad-radius-pill);
    font-size: 0.84rem;
    font-weight: 500;
    cursor: pointer;
    font-family: inherit;
    transition: all var(--ad-transition);
}

.ad-filter-pill:hover {
    border-color: var(--ad-orange);
    color: #FFFFFF;
    background: rgba(45, 36, 60, 0.8);
    transform: translateY(-2px);
}

.ad-filter-pill.active {
    background: var(--ad-orange);
    color: #0C0A0F;
    border-color: var(--ad-orange);
    font-weight: 600;
    box-shadow: 0 0 16px rgba(212, 130, 89, 0.45);
}

.ad-search-wrapper {
    position: relative;
    min-width: 260px;
    max-width: 340px;
    flex: 1;
}

.ad-search-icon {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--ad-text-muted);
    pointer-events: none;
    font-size: 0.9rem;
}

.ad-search-input {
    width: 100%;
    box-sizing: border-box;
    padding: 0.6rem 1.2rem 0.6rem 2.6rem;
    background: rgba(20, 17, 26, 0.9);
    border: 1px solid var(--ad-border-purple);
    border-radius: var(--ad-radius-pill);
    color: #FFFFFF;
    font-family: inherit;
    font-size: 0.88rem;
    outline: none;
    transition: all var(--ad-transition);
}

.ad-search-input:focus {
    border-color: var(--ad-orange);
    box-shadow: 0 0 14px rgba(212, 130, 89, 0.3);
}

.ad-search-input::placeholder {
    color: var(--ad-text-muted);
}

/* Featured Story Hero */
.ad-featured-hero {
    margin-bottom: 4rem;
    border-radius: var(--ad-radius-lg);
    overflow: hidden;
    border: 1px solid var(--ad-border-purple);
    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.75), var(--ad-purple-glow);
    transition: transform var(--ad-transition), border-color var(--ad-transition), box-shadow var(--ad-transition);
}

.ad-featured-hero:hover {
    transform: translateY(-4px);
    border-color: var(--ad-border-orange);
    box-shadow: 0 25px 70px rgba(0, 0, 0, 0.85), var(--ad-orange-glow);
}

.ad-featured-hero-inner {
    position: relative;
    width: 100%;
    min-height: 460px;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    overflow: hidden;
}

.ad-featured-hero-inner picture {
    display: contents;
}

.ad-featured-hero-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 0;
}

.ad-featured-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(12, 10, 15, 0.5) 0%, rgba(12, 10, 15, 0.88) 55%, #0C0A0F 100%);
}

.ad-featured-hero-content {
    position: relative;
    z-index: 2;
    padding: 3.5rem 2.5rem 3rem;
    max-width: 820px;
    text-align: center;
    margin: 0 auto;
}

@media (max-width: 768px) {
    .ad-featured-hero-content {
        padding: 2.5rem 1.5rem 2rem;
    }
}

.ad-featured-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: rgba(212, 130, 89, 0.18);
    border: 1px solid var(--ad-border-orange);
    color: var(--ad-orange);
    padding: 0.35rem 0.95rem;
    border-radius: var(--ad-radius-pill);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 1rem;
}

.ad-featured-title {
    font-family: 'DM Serif Display', serif;
    font-size: clamp(2rem, 4vw, 3rem);
    color: #FFFFFF;
    line-height: 1.18;
    margin-bottom: 0.9rem;
}

.ad-featured-excerpt {
    font-size: 1.05rem;
    color: var(--ad-purple-light);
    line-height: 1.65;
    margin-bottom: 1.6rem;
    max-width: 680px;
    margin-left: auto;
    margin-right: auto;
}

.ad-featured-cta {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: #FFFFFF;
    background: linear-gradient(135deg, #7A587B 0%, #543756 100%);
    padding: 0.75rem 1.6rem;
    border-radius: var(--ad-radius-pill);
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none;
    transition: transform var(--ad-transition), box-shadow var(--ad-transition);
}

.ad-featured-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(212, 130, 89, 0.4);
}

/* Article Grid */
.ad-journal-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 2.2rem;
    margin-bottom: 4rem;
}

.ad-article-card {
    background: var(--ad-bg-card);
    border: 1px solid var(--ad-border-purple);
    border-radius: var(--ad-radius-md);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    transition: transform var(--ad-transition), border-color var(--ad-transition), box-shadow var(--ad-transition);
}

.ad-article-card:hover {
    transform: translateY(-6px);
    border-color: var(--ad-border-orange);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.65), var(--ad-orange-glow);
}

.ad-article-card-img-wrapper {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background-color: #08060A;
}

.ad-article-card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.ad-article-card:hover .ad-article-card-img {
    transform: scale(1.05);
}

.ad-article-card-body {
    padding: 1.8rem 1.6rem;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.ad-article-meta {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    font-size: 0.78rem;
    color: var(--ad-text-muted);
    margin-bottom: 0.8rem;
}

.ad-article-category-badge {
    display: inline-block;
    background: rgba(108, 83, 109, 0.25);
    border: 1px solid var(--ad-border-purple);
    color: var(--ad-orange);
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.ad-article-title {
    font-family: 'DM Serif Display', serif;
    font-size: 1.38rem;
    color: #FFFFFF;
    line-height: 1.25;
    margin-bottom: 0.75rem;
}

.ad-article-excerpt {
    font-size: 0.92rem;
    color: var(--ad-text-muted);
    line-height: 1.65;
    margin-bottom: 1.4rem;
    flex: 1;
}

.ad-article-link {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--ad-orange);
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: auto;
    transition: gap var(--ad-transition), color var(--ad-transition);
}

.ad-article-card:hover .ad-article-link {
    gap: 0.7rem;
    color: var(--ad-orange-light);
}

/* Nocturnal Shimmer Loading Skeletons */
.ad-skeleton-card {
    background: var(--ad-bg-card);
    border: 1px solid var(--ad-border-purple);
    border-radius: var(--ad-radius-md);
    overflow: hidden;
    min-height: 400px;
}

.ad-skeleton-img {
    width: 100%;
    aspect-ratio: 16 / 9;
    background: linear-gradient(90deg, #181320 0%, #251D30 50%, #181320 100%);
    background-size: 200% 100%;
    animation: adShimmer 1.8s infinite;
}

.ad-skeleton-body {
    padding: 1.8rem 1.6rem;
}

.ad-skeleton-line {
    background: linear-gradient(90deg, #181320 0%, #251D30 50%, #181320 100%);
    background-size: 200% 100%;
    animation: adShimmer 1.8s infinite;
    border-radius: 4px;
    margin-bottom: 0.8rem;
}

.ad-skeleton-line.short { width: 40%; height: 14px; border-radius: 999px; }
.ad-skeleton-line.title { width: 85%; height: 24px; margin-bottom: 1rem; }
.ad-skeleton-line.text-1 { width: 100%; height: 14px; }
.ad-skeleton-line.text-2 { width: 75%; height: 14px; }

@keyframes adShimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* Empty State */
.ad-journal-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 4rem 2rem;
    background: var(--ad-bg-card);
    border: 1px dashed var(--ad-border-purple);
    border-radius: var(--ad-radius-md);
}

.ad-journal-empty h3 {
    font-family: var(--ad-font-gothic);
    font-size: 1.8rem;
    color: var(--ad-purple-bright);
    margin-bottom: 0.6rem;
}

.ad-journal-empty p {
    color: var(--ad-text-muted);
    font-size: 0.95rem;
}

/* ==========================================================================
   NOCTURNAL SINGLE ARTICLE OVERRIDES (article.html in Afterdark mode)
   ========================================================================== */
body.afterdark-body.subpage-shell,
body.afterdark-body {
    background: #0C0A0F !important;
    color: #EDEAE5 !important;
}

body.afterdark-body .subpage-main {
    background: transparent !important;
}

body.afterdark-body .subpage-backlink {
    color: var(--ad-orange) !important;
    font-family: var(--ad-font-gothic) !important;
    font-size: 1.05rem !important;
    letter-spacing: 0.04em !important;
    transition: all var(--ad-transition) !important;
}

body.afterdark-body .subpage-backlink:hover {
    color: var(--ad-orange-light) !important;
    text-shadow: 0 0 10px rgba(212, 130, 89, 0.45) !important;
    transform: translateX(-4px);
}

body.afterdark-body .article-header h1 {
    color: #FFFFFF !important;
    font-family: 'DM Serif Display', serif !important;
    font-size: clamp(2.4rem, 5vw, 3.6rem) !important;
    line-height: 1.15 !important;
}

body.afterdark-body .article-meta-line {
    color: var(--ad-text-muted) !important;
}

body.afterdark-body .article-meta-line .category-tag {
    background: rgba(212, 130, 89, 0.16) !important;
    border: 1px solid rgba(212, 130, 89, 0.4) !important;
    color: var(--ad-orange) !important;
}

body.afterdark-body .article-content {
    color: #EDEAE5 !important;
    line-height: 1.85 !important;
    font-size: 1.1rem !important;
}

body.afterdark-body .article-content p {
    color: #E0DAE2 !important;
    margin-bottom: 1.6rem !important;
}

body.afterdark-body .article-content h2,
body.afterdark-body .article-content h3 {
    color: var(--ad-purple-bright) !important;
    font-family: var(--ad-font-gothic) !important;
    letter-spacing: 0.04em !important;
    margin-top: 2.5rem !important;
    margin-bottom: 1rem !important;
}

body.afterdark-body .article-content blockquote {
    border-left: 3px solid var(--ad-orange) !important;
    background: rgba(26, 21, 34, 0.6) !important;
    color: var(--ad-purple-light) !important;
    padding: 1.2rem 1.6rem !important;
    border-radius: 0 var(--ad-radius-sm) var(--ad-radius-sm) 0 !important;
    margin: 2rem 0 !important;
}

body.afterdark-body .article-content a {
    color: var(--ad-orange) !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
    transition: color var(--ad-transition) !important;
}

body.afterdark-body .article-content a:hover {
    color: var(--ad-orange-light) !important;
}

body.afterdark-body .article-featured-image {
    border-radius: var(--ad-radius-md) !important;
    border: 1px solid var(--ad-border-purple) !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.7) !important;
}

body.afterdark-body .article-event-notice {
    background: rgba(230, 126, 34, 0.08) !important;
    border: 1px solid rgba(230, 126, 34, 0.35) !important;
    border-left: 4px solid var(--ad-orange, #E67E22) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
}

body.afterdark-body .article-event-notice-badge {
    background: rgba(230, 126, 34, 0.2) !important;
    border: 1px solid rgba(230, 126, 34, 0.4) !important;
    color: #F39C12 !important;
}

body.afterdark-body .article-event-notice-body strong {
    color: #FAF6F0 !important;
}

body.afterdark-body .article-event-notice-body p {
    color: var(--ad-muted, #A99E94) !important;
}

body.afterdark-body .article-event-notice-body a {
    color: var(--ad-orange-light, #F8C471) !important;
}

body.afterdark-body .article-author-signoff {
    background: var(--ad-bg-card) !important;
    border: 1px solid var(--ad-border-purple) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
}

body.afterdark-body .article-author-signoff h4 {
    color: #FFFFFF !important;
}

body.afterdark-body .article-author-signoff p,
body.afterdark-body .article-author-signoff p.author-bio {
    color: var(--ad-text-muted) !important;
}

body.afterdark-body .author-role-badge {
    background: rgba(229, 195, 120, 0.15) !important;
    color: var(--gold-light, #E5C378) !important;
    border: 1px solid rgba(229, 195, 120, 0.3) !important;
}

body.afterdark-body .author-profile-cta-wrap {
    border-top: 1px dashed var(--ad-border-purple) !important;
}

body.afterdark-body .author-profile-btn {
    background: rgba(229, 195, 120, 0.15) !important;
    color: var(--gold-light, #E5C378) !important;
    border-color: rgba(229, 195, 120, 0.35) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

body.afterdark-body .author-profile-btn:hover {
    background: var(--gold-light, #E5C378) !important;
    color: #0E131F !important;
    border-color: var(--gold-light, #E5C378) !important;
}

body.afterdark-body .article-share-bar {
    border-top: 1px solid var(--ad-border-purple) !important;
    border-bottom: 1px solid var(--ad-border-purple) !important;
    color: var(--ad-text-muted) !important;
}

body.afterdark-body .share-btn {
    background: rgba(26, 21, 34, 0.8) !important;
    border: 1px solid var(--ad-border-purple) !important;
    color: var(--ad-orange) !important;
}

body.afterdark-body .share-btn:hover {
    background: rgba(212, 130, 89, 0.25) !important;
    border-color: var(--ad-orange) !important;
    color: #FFFFFF !important;
}

body.afterdark-body .explore-more-section h3 {
    color: var(--ad-purple-bright) !important;
    font-family: var(--ad-font-gothic) !important;
    font-size: 1.8rem !important;
}

body.afterdark-body #reading-progress-bar {
    background: linear-gradient(90deg, #6C536D 0%, #D48259 100%) !important;
}

/* ==========================================================================
   AFTERDARK MIRROR LAYOUT STYLES (1-to-1 Mirror of Main Website Layout)
   Rich Velvet Plum / Amethyst with Muted Warm Dusk Amber Accents
   ========================================================================== */

/* Mirrored Hero Search Bar */
.ad-hero-search-form {
    display: flex;
    align-items: center;
    max-width: 580px;
    background: rgba(32, 23, 44, 0.85);
    border: 1.5px solid rgba(125, 90, 128, 0.45);
    border-radius: var(--ad-radius-pill);
    padding: 0.35rem 0.5rem 0.35rem 1.4rem;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.5), 0 0 15px rgba(125, 90, 128, 0.15);
    margin: 1.8rem 0 2rem;
    transition: all var(--ad-transition);
}

.ad-hero-search-form:focus-within {
    border-color: var(--ad-orange);
    box-shadow: 0 6px 30px rgba(0, 0, 0, 0.6), 0 0 20px rgba(212, 130, 89, 0.2);
}

.ad-hero-search-icon {
    font-size: 1.1rem;
    color: var(--ad-orange);
    margin-right: 0.75rem;
    filter: drop-shadow(0 0 6px rgba(212, 130, 89, 0.4));
}

.ad-hero-search-input {
    flex: 1;
    border: none;
    background: transparent;
    color: var(--ad-text-bright);
    font-family: var(--ad-font-sans);
    font-size: 0.95rem;
    outline: none;
}

.ad-hero-search-input::placeholder {
    color: var(--ad-text-muted);
}

.ad-hero-search-btn {
    background: linear-gradient(135deg, #7A587B 0%, #543756 100%);
    color: #FFFFFF;
    border: 1px solid rgba(212, 130, 89, 0.4);
    padding: 0.75rem 1.4rem;
    border-radius: var(--ad-radius-pill);
    font-family: var(--ad-font-sans);
    font-weight: 500;
    font-size: 0.88rem;
    cursor: pointer;
    transition: all var(--ad-transition);
}

.ad-hero-search-btn:hover {
    background: linear-gradient(135deg, #8E6890 0%, #68466A 100%);
    box-shadow: 0 4px 15px rgba(122, 88, 123, 0.4);
    transform: translateY(-1px);
}

/* Mirrored Announcement Strip (Conscious Sessions) */
.ad-strip {
    background: linear-gradient(90deg, #24152A 0%, #351F3D 50%, #24152A 100%);
    border-top: 1px solid rgba(125, 90, 128, 0.3);
    border-bottom: 1px solid rgba(125, 90, 128, 0.3);
    color: var(--ad-text-bright);
    padding: 1.4rem 0;
    position: relative;
    z-index: 10;
}

.ad-strip-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 5%;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.ad-strip-icon {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: rgba(125, 90, 128, 0.25);
    border: 1px solid rgba(212, 130, 89, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    color: var(--ad-orange);
    flex-shrink: 0;
}

.ad-strip-text {
    flex: 1;
    min-width: 220px;
}

.ad-strip-text strong {
    display: block;
    font-family: var(--ad-font-serif);
    font-size: 1.05rem;
    color: #FFFFFF;
    margin-bottom: 0.18rem;
}

.ad-strip-text span {
    font-size: 0.86rem;
    color: var(--ad-purple-light);
}

.btn-ad-strip {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    background: rgba(125, 90, 128, 0.25);
    border: 1px solid rgba(212, 130, 89, 0.45);
    color: #FFFFFF;
    padding: 0.6rem 1.3rem;
    border-radius: var(--ad-radius-pill);
    font-size: 0.86rem;
    font-weight: 500;
    text-decoration: none;
    transition: all var(--ad-transition);
    white-space: nowrap;
}

.btn-ad-strip:hover {
    background: linear-gradient(135deg, #7A587B 0%, #543756 100%);
    border-color: var(--ad-orange);
    box-shadow: 0 4px 18px rgba(122, 88, 123, 0.4);
    transform: translateY(-2px);
}

/* Mirrored Categories Grid (3x2) */
.ad-categories-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
}

.ad-cat-card {
    display: block;
    position: relative;
    border-radius: var(--ad-radius-md);
    overflow: hidden;
    text-decoration: none;
    aspect-ratio: 4 / 2.35;
    background: var(--ad-bg-card);
    border: 1px solid rgba(125, 90, 128, 0.25);
    transition: all var(--ad-transition);
}

.ad-cat-card:hover {
    transform: translateY(-4px);
    border-color: rgba(212, 130, 89, 0.45);
    box-shadow: 0 8px 30px rgba(125, 90, 128, 0.35);
}

.ad-cat-img {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transition: transform 0.6s ease;
}

.ad-cat-card:hover .ad-cat-img {
    transform: scale(1.06);
}

.ad-cat-img::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(14, 10, 20, 0.9) 0%, rgba(14, 10, 20, 0.35) 60%, transparent 100%);
}

.ad-cat-label {
    position: absolute;
    bottom: 1.1rem;
    left: 1.1rem;
    color: var(--ad-text-bright);
    font-size: 0.95rem;
    font-weight: 500;
    z-index: 1;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.8);
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.ad-cat-card--explore-all {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    aspect-ratio: 4 / 2.35;
    border-radius: var(--ad-radius-md);
    background: linear-gradient(135deg, #2D1A33 0%, #3D2244 50%, #201224 100%);
    border: 1.5px solid rgba(212, 130, 89, 0.4);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
    text-decoration: none;
    padding: 1.5rem;
    text-align: center;
    transition: all var(--ad-transition);
}

.ad-cat-card--explore-all:hover {
    transform: translateY(-4px);
    background: linear-gradient(135deg, #3A2242 0%, #4D2B57 50%, #2C1832 100%);
    border-color: var(--ad-orange-light);
    box-shadow: 0 8px 30px rgba(125, 90, 128, 0.4);
}

.ad-cat-explore-icon {
    font-size: 1.6rem;
    color: var(--ad-orange);
    margin-bottom: 0.5rem;
    filter: drop-shadow(0 0 8px rgba(212, 130, 89, 0.5));
}

.ad-cat-explore-title {
    font-family: var(--ad-font-serif);
    font-size: 1.25rem;
    color: #FFFFFF;
    margin-bottom: 0.35rem;
}

.ad-cat-explore-subtitle {
    font-size: 0.85rem;
    color: var(--ad-purple-light);
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    transition: gap var(--ad-transition);
}

.ad-cat-card--explore-all:hover .ad-cat-explore-subtitle {
    gap: 0.6rem;
    color: var(--ad-orange-light);
}

/* Mirrored How It Works (3 Steps) */
.ad-steps-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

.ad-step {
    padding: 2.5rem 2rem;
    background: var(--ad-bg-card);
    border-radius: var(--ad-radius-md);
    border: 1px solid rgba(125, 90, 128, 0.25);
    border-bottom: 3px solid rgba(125, 90, 128, 0.4);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    transition: all var(--ad-transition);
}

.ad-step:hover {
    border-bottom-color: var(--ad-orange);
    transform: translateY(-4px);
    box-shadow: 0 8px 30px rgba(125, 90, 128, 0.25);
}

.ad-step-number {
    font-family: var(--ad-font-gothic);
    font-size: 3rem;
    color: var(--ad-purple-light);
    line-height: 1;
    margin-bottom: 1rem;
}

.ad-step h3 {
    font-family: var(--ad-font-serif);
    font-size: 1.45rem;
    color: var(--ad-text-bright);
    margin-bottom: 0.6rem;
}

.ad-step p {
    color: var(--ad-text-body);
    font-size: 0.95rem;
    line-height: 1.65;
    margin: 0;
}

/* Mirrored Guides & Curators Grid (3 Guides) */
.ad-guides-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.75rem;
}

.ad-guide-card {
    border-radius: var(--ad-radius-md);
    overflow: hidden;
    background: var(--ad-bg-card);
    border: 1px solid rgba(125, 90, 128, 0.25);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    transition: all var(--ad-transition);
    display: flex;
    flex-direction: column;
    height: 100%;
}

.ad-guide-card:hover {
    transform: translateY(-5px);
    border-color: rgba(212, 130, 89, 0.45);
    box-shadow: 0 10px 32px rgba(125, 90, 128, 0.35);
}

.ad-guide-img {
    aspect-ratio: 4 / 3.5;
    background-size: cover;
    background-position: center;
    position: relative;
    width: 100%;
    overflow: hidden;
}

.ad-guide-tag {
    position: absolute;
    top: 12px;
    left: 12px;
    padding: 5px 12px;
    border-radius: var(--ad-radius-pill);
    font-size: 0.72rem;
    font-weight: 600;
    color: #FFFFFF;
    background: var(--ad-purple-brand);
    border: 1px solid rgba(255, 255, 255, 0.2);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    z-index: 2;
}

.ad-guide-info {
    padding: 1.8rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.ad-guide-info h3 {
    font-family: var(--ad-font-serif);
    font-size: 1.55rem;
    color: var(--ad-text-bright);
    margin: 0 0 0.4rem 0;
}

.ad-guide-specialty {
    color: var(--ad-orange-light);
    font-size: 0.95rem;
    font-weight: 500;
    margin-bottom: 0.6rem;
}

.ad-guide-location {
    font-size: 0.88rem;
    color: var(--ad-text-muted);
    margin-bottom: 1.2rem;
    border-bottom: 1px solid rgba(125, 90, 128, 0.2);
    padding-bottom: 1rem;
}

.ad-guide-bio {
    font-size: 0.9rem;
    color: var(--ad-text-body);
    line-height: 1.6;
    margin-bottom: 1.5rem;
    flex-grow: 1;
}

.ad-guide-link {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--ad-purple-light);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    text-decoration: none;
    transition: all var(--ad-transition);
}

.ad-guide-link:hover {
    color: var(--ad-orange-light);
    gap: 0.6rem;
}

/* Mirrored For Practitioners / Guides Section (2 Columns) */
.ad-for-guides {
    background: linear-gradient(180deg, #160F20 0%, #1D142A 100%);
    border-top: 1px solid rgba(125, 90, 128, 0.25);
    border-bottom: 1px solid rgba(125, 90, 128, 0.25);
    color: var(--ad-text-bright);
}

.ad-for-guides-inner {
    display: grid;
    grid-template-columns: 1.25fr 1fr;
    gap: 5.5rem;
    align-items: center;
}

.ad-cta-benefits {
    list-style: none;
    padding: 0;
    margin: 1.5rem 0 2.5rem;
}

.ad-cta-benefits li {
    font-size: 0.95rem;
    color: var(--ad-text-body);
    padding: 0.45rem 0 0.45rem 1.6rem;
    position: relative;
}

.ad-cta-benefits li::before {
    content: '✦';
    position: absolute;
    left: 0;
    color: var(--ad-orange);
    font-weight: 600;
}

.ad-founder-badge {
    background: rgba(36, 25, 48, 0.85);
    border: 1.5px solid rgba(212, 130, 89, 0.35);
    border-radius: var(--ad-radius-lg);
    padding: 2.5rem;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5), 0 0 20px rgba(125, 90, 128, 0.15);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.ad-founder-badge .badge-label {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--ad-orange-light);
    background: rgba(212, 130, 89, 0.15);
    border: 1px solid rgba(212, 130, 89, 0.3);
    padding: 0.35rem 0.95rem;
    border-radius: var(--ad-radius-pill);
    margin-bottom: 1.2rem;
}

.ad-founder-badge .badge-price {
    font-family: var(--ad-font-serif);
    font-size: 3.2rem;
    color: #FFFFFF;
    line-height: 1;
    margin-bottom: 1rem;
}

.ad-founder-badge .badge-price span {
    font-family: var(--ad-font-sans);
    font-size: 1.05rem;
    font-weight: 300;
    color: var(--ad-purple-light);
}

.ad-founder-badge p {
    font-size: 0.9rem;
    color: var(--ad-text-body);
    margin-bottom: 1.5rem;
    line-height: 1.6;
}

.ad-founder-badge .badge-perks {
    list-style: none;
    padding: 1.25rem 0 0;
    margin: 0 0 1.8rem;
    border-top: 1px solid rgba(125, 90, 128, 0.25);
}

.ad-founder-badge .badge-perks li {
    font-size: 0.88rem;
    color: var(--ad-text-body);
    padding: 0.35rem 0;
}

.ad-founder-badge .badge-perks li span.tick {
    color: var(--ad-orange);
    margin-right: 0.4rem;
}

/* Mirrored Venues Spotlight (3 Venues) */
.ad-venues-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.75rem;
}

.ad-venue-card {
    background: var(--ad-bg-card);
    border-radius: var(--ad-radius-md);
    border: 1px solid rgba(125, 90, 128, 0.25);
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    transition: all var(--ad-transition);
    display: flex;
    flex-direction: column;
    height: 100%;
}

.ad-venue-card:hover {
    transform: translateY(-5px);
    border-color: rgba(212, 130, 89, 0.4);
    box-shadow: 0 10px 32px rgba(125, 90, 128, 0.3);
}

.ad-venue-img {
    height: 220px;
    background-size: cover;
    background-position: center;
    position: relative;
}

.ad-venue-info {
    padding: 1.75rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.ad-venue-info h3 {
    font-family: var(--ad-font-serif);
    font-size: 1.45rem;
    color: var(--ad-text-bright);
    margin: 0 0 0.35rem 0;
}

.ad-venue-location {
    font-size: 0.86rem;
    color: var(--ad-orange-light);
    margin-bottom: 0.85rem;
}

.ad-venue-info p {
    font-size: 0.9rem;
    color: var(--ad-text-body);
    line-height: 1.6;
    margin: 0 0 1.25rem 0;
    flex-grow: 1;
}

/* ==========================================================================
   THE NIGHT JOURNAL TEASER (Homepage Dispatches)
   ========================================================================== */
#journal.ad-section-pad {
    padding: 3rem 0 3.5rem;
}

#journal .ad-section-header {
    margin: 0 auto 2rem;
    text-align: center;
}

#journal .ad-section-header h2 {
    font-size: clamp(1.8rem, 2.8vw, 2.4rem);
    margin-top: 0.2rem;
    margin-bottom: 0.4rem;
}

#journal .ad-section-header p {
    font-size: 0.95rem;
    line-height: 1.5;
    max-width: 620px;
    margin: 0 auto;
}

.ad-journal-teaser-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    max-width: 1140px;
    margin: 0 auto;
}

.ad-journal-teaser-card {
    background: var(--ad-bg-card);
    border: 1px solid var(--ad-border-purple);
    border-radius: var(--ad-radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.7), var(--ad-purple-glow);
    transition: transform var(--ad-transition), box-shadow var(--ad-transition), border-color var(--ad-transition);
}

.ad-journal-teaser-card:hover {
    transform: translateY(-4px);
    border-color: var(--ad-border-orange);
    box-shadow: 0 25px 70px rgba(0, 0, 0, 0.85), var(--ad-orange-glow);
}

.ad-journal-teaser-img {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background-size: cover;
    background-position: center center;
    background-color: #000;
}

.ad-journal-teaser-img::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 55%, rgba(12, 10, 15, 0.6) 80%, var(--ad-bg-card) 100%);
}

.ad-journal-teaser-tag {
    position: absolute;
    top: 1rem;
    left: 1rem;
    background: rgba(12, 10, 15, 0.9);
    border: 1px solid var(--ad-orange);
    color: var(--ad-orange);
    padding: 0.3rem 0.8rem;
    border-radius: var(--ad-radius-pill);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    backdrop-filter: blur(8px);
    z-index: 2;
}

.ad-journal-teaser-body {
    padding: 1.35rem 1.6rem 1.6rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex: 1;
}

.ad-journal-teaser-meta {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.78rem;
    color: var(--ad-purple-light);
    margin-bottom: 0.45rem;
}

.ad-journal-teaser-meta .ad-author {
    color: var(--ad-orange);
    font-weight: 600;
}

.ad-journal-teaser-title {
    font-family: var(--ad-font-gothic);
    font-size: clamp(1.15rem, 1.35vw, 1.34rem);
    line-height: 1.25;
    color: var(--ad-text-bright);
    margin-bottom: 0.5rem;
    min-height: 2.2rem;
    display: flex;
    align-items: center;
}

.ad-journal-teaser-title a {
    color: inherit;
    text-decoration: none;
    transition: color var(--ad-transition);
}

.ad-journal-teaser-title a:hover {
    color: var(--ad-orange);
}

.ad-journal-teaser-excerpt {
    font-size: 0.84rem;
    color: var(--ad-text-body);
    line-height: 1.5;
    margin-bottom: 1.6rem;
}

.ad-journal-teaser-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-top: auto;
    padding-top: 0.75rem;
    border-top: 1px solid rgba(108, 83, 109, 0.25);
}

.ad-journal-teaser-actions .btn-ad-primary {
    padding: 0.44rem 1.1rem;
    font-size: 0.81rem;
    white-space: nowrap;
}

.ad-journal-view-all {
    margin-top: 2.2rem;
    text-align: center;
}

.ad-journal-view-all .btn-ad-secondary {
    padding: 0.55rem 1.5rem;
    font-size: 0.86rem;
}

@media (max-width: 850px) {
    .ad-journal-teaser-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
}

/* Mirrored Daylight Return Portal Spotlight (Mirror of daytime's Afterdark teaser) */
.ad-daylight-spotlight {
    padding: 2.5rem 0 4rem;
}

.ad-daylight-card {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2.75rem 3.5rem;
    background: linear-gradient(135deg, #24162B 0%, #341D3C 50%, #1F1125 100%);
    border: 1.5px solid rgba(196, 162, 198, 0.35);
    border-radius: var(--ad-radius-lg);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45), 0 0 25px rgba(125, 90, 128, 0.2);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 3rem;
}

.ad-daylight-copy {
    max-width: 720px;
}

.ad-daylight-copy h3 {
    font-family: var(--ad-font-serif);
    font-size: clamp(1.8rem, 3vw, 2.3rem);
    color: #FFFFFF;
    margin: 0.4rem 0 0.75rem;
}

.ad-daylight-copy p {
    font-size: 0.98rem;
    color: var(--ad-text-body);
    line-height: 1.65;
    margin: 0;
}

.ad-daylight-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    background: rgba(251, 251, 249, 0.12);
    border: 1.5px solid rgba(255, 255, 255, 0.35);
    color: #FAF7F5;
    font-weight: 500;
    padding: 0.95rem 2rem;
    border-radius: var(--ad-radius-pill);
    font-size: 0.95rem;
    text-decoration: none;
    transition: all var(--ad-transition);
    white-space: nowrap;
    backdrop-filter: blur(8px);
}

.ad-daylight-btn:hover {
    background: #FAF7F5;
    color: #2D1A33;
    border-color: #FAF7F5;
    transform: translateY(-2px);
    box-shadow: 0 6px 25px rgba(255, 255, 255, 0.25);
}

/* Responsive adjustments for mirror layout */
@media (max-width: 900px) {
    .ad-categories-grid { grid-template-columns: repeat(2, 1fr); }
    .ad-steps-grid { grid-template-columns: 1fr; }
    .ad-guides-grid { grid-template-columns: 1fr; }
    .ad-for-guides-inner { grid-template-columns: 1fr; gap: 3rem; }
    .ad-venues-grid { grid-template-columns: 1fr; }
    .ad-daylight-card { flex-direction: column; align-items: flex-start; gap: 1.75rem; padding: 2.25rem; }
}

@media (max-width: 600px) {
    .ad-categories-grid { grid-template-columns: 1fr; }
    .ad-strip-inner { flex-direction: column; align-items: flex-start; gap: 1rem; }
}