:root {
    --slm-bg-page: #040404;
    --slm-bg-panel: #0d0f12;
    --slm-bg-card: #14181d;
    --slm-border-color: #2a2f37;
    --slm-text-muted-2: #9ba4b2;
    --slm-text-primary: #f6f3ea;
    --slm-gold: #d4a84f;
    --slm-gold-glow: rgba(240, 188, 86, 0.35);
    --slm-emerald: #2ecf9c;
    --slm-blue: #39a5ff;
    --slm-success-2: #36d394;
    --slm-warning-2: #f4b665;
    --slm-danger-2: #ff6f7b;
    --slm-btn-gradient: linear-gradient(120deg, #e6bc62, #c38b38 48%, #9f6f2c 100%);
    --slm-btn-gradient-dark: linear-gradient(120deg, #1e252d, #151a1f);
    --slm-overlay-soft: rgba(6, 8, 10, 0.72);
    --slm-overlay-strong: rgba(4, 5, 6, 0.9);

    --slm-display-font: clamp(2rem, 1.1rem + 2.8vw, 3.4rem);
    --slm-title-font: clamp(1.5rem, 1.1rem + 1.4vw, 2.25rem);
    --slm-section-font: clamp(1.1rem, 1rem + 0.8vw, 1.6rem);
    --slm-card-font: 1.05rem;
    --slm-stat-font: clamp(1.6rem, 1.1rem + 1.9vw, 2.55rem);
    --slm-compact-font: 0.82rem;
}

body {
    background: radial-gradient(circle at 20% -10%, rgba(212, 168, 79, 0.13), transparent 36%),
        radial-gradient(circle at 85% -15%, rgba(57, 165, 255, 0.1), transparent 40%),
        linear-gradient(180deg, #040404 0%, #080a0d 42%, #0b0d10 100%);
    color: var(--slm-text-primary);
}

.slm-display-heading { font-size: var(--slm-display-font); line-height: 1.08; letter-spacing: -0.03em; font-weight: 900; }
.slm-page-title { font-size: var(--slm-title-font); }
.slm-section-title { font-size: var(--slm-section-font); font-weight: 800; }
.slm-card-title { font-size: var(--slm-card-font); font-weight: 700; }
.slm-stat-number { font-size: var(--slm-stat-font); font-weight: 900; letter-spacing: -0.02em; }
.slm-muted-paragraph { color: var(--slm-text-muted-2); max-width: 62ch; }
.slm-compact-text { font-size: var(--slm-compact-font); color: var(--slm-text-muted-2); }

.slm-glow-gold { box-shadow: 0 0 0 1px rgba(212, 168, 79, 0.35), 0 0 24px var(--slm-gold-glow), 0 20px 40px rgba(0, 0, 0, 0.42); }
.slm-panel-premium {
    background: linear-gradient(180deg, rgba(20, 24, 29, 0.94), rgba(14, 16, 20, 0.96));
    border: 1px solid color-mix(in srgb, var(--slm-gold) 25%, var(--slm-border-color));
    border-radius: 1rem;
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.5);
}

.slm-gradient-edge {
    position: relative;
    overflow: hidden;
}

.slm-gradient-edge::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(120deg, rgba(212, 168, 79, 0.5), rgba(57, 165, 255, 0.25), rgba(46, 207, 156, 0.25));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

.slm-visual-section {
    position: relative;
    isolation: isolate;
}

.slm-visual-section::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 80% 15%, rgba(212, 168, 79, 0.12), transparent 40%),
        radial-gradient(circle at 15% 85%, rgba(57, 165, 255, 0.08), transparent 36%);
    z-index: -1;
}

.slm-hero-system {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(212, 168, 79, 0.33);
    border-radius: 1.35rem;
    padding: clamp(1.2rem, 3vw, 2.4rem);
    background: linear-gradient(135deg, rgba(7, 9, 12, 0.96), rgba(10, 11, 13, 0.9));
}

/* Generated launch visual: /assets/images/backgrounds/campaign-visibility-loop-hero.webp
   Dark premium SaaS hero with a glowing campaign visibility loop and email nodes; no embedded text. */
.slm-hero-system::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(var(--slm-overlay-strong), var(--slm-overlay-soft)), url('/assets/images/backgrounds/campaign-visibility-loop-hero.webp') center/cover no-repeat;
    opacity: 0.62;
    filter: blur(0.4px);
    z-index: -2;
}

/* Generated launch visual: /assets/images/backgrounds/network-grid-dark.webp
   Futuristic network node grid with subtle gold, blue, and emerald points; no embedded text. */
.slm-node-grid-bg::after {
    background-image: linear-gradient(rgba(7, 9, 11, 0.86), rgba(7, 9, 11, 0.86)), url('/assets/images/backgrounds/network-grid-dark.webp');
    background-size: cover;
    opacity: 0.48;
}

.slm-feature-card { height: 100%; padding: 1rem; }
.slm-feature-card__icon {
    width: 2.8rem;
    height: 2.8rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.8rem;
    background: linear-gradient(135deg, rgba(212, 168, 79, 0.2), rgba(57, 165, 255, 0.14));
    border: 1px solid rgba(212, 168, 79, 0.28);
    color: #f6cf82;
}

.slm-cta-bar {
    border: 1px solid rgba(212, 168, 79, 0.35);
    border-radius: 1rem;
    padding: 1.1rem;
    background: linear-gradient(110deg, rgba(16, 18, 22, 0.92), rgba(21, 16, 10, 0.92));
}

.slm-btn-shimmer { position: relative; overflow: hidden; }
.slm-btn-shimmer::after {
    content: "";
    position: absolute;
    inset: -150% auto -150% -35%;
    width: 32%;
    transform: rotate(18deg);
    background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.25), transparent);
    animation: slm-shimmer 3.6s linear infinite;
}

.slm-leaderboard-widget {
    border: 1px solid rgba(212, 168, 79, 0.3);
    border-radius: 1rem;
    background: linear-gradient(180deg, rgba(14, 16, 20, 0.95), rgba(9, 10, 12, 0.96));
    padding: 1rem;
}

.slm-leaderboard-widget__rank {
    font-size: clamp(1.8rem, 1.2rem + 1.8vw, 2.6rem);
    font-weight: 900;
    color: #f4cd84;
}

.slm-progress-glow .progress-bar {
    background: linear-gradient(90deg, var(--slm-gold), #f5ce85 45%, #42b2ff 100%);
    box-shadow: 0 0 20px rgba(212, 168, 79, 0.45);
}

@keyframes slm-shimmer {
    0% { left: -45%; }
    100% { left: 115%; }
}
