/* ── Extra Theme CSS ──────────────────────────────────────────────────────── */

/* Header scroll state */
#site-header.scrolled {
    box-shadow: 0 4px 30px rgba(0,0,0,.4);
}

/* Smooth section transitions */
.section, .section-sm { transition: background .3s; }

/* Feature card base state for JS animation */
.feature-card, .step-card {
    will-change: transform, opacity;
}

/* Commission section improvements */
.commission-section .commission-table tbody tr { transition: background .15s; }

/* Levels track on mobile */
@media (max-width: 700px) {
    .levels-track { border-radius: var(--radius); }
    .level-band { padding: 24px 16px; }
    .level-band-num { font-size: 28px; }
}

/* Hero phone mockup shimmer */
.hero-phone-mockup::after {
    content: '';
    position: absolute;
    top: 0; left: -100%;
    width: 60%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.04), transparent);
    animation: shimmer 3s infinite 1s;
}
@keyframes shimmer {
    0%   { left: -100%; }
    100% { left: 200%; }
}

/* Coin badge pulse */
.header-coin-badge {
    animation: coin-pulse 3s ease-in-out infinite;
}
@keyframes coin-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(245,166,35,0); }
    50%       { box-shadow: 0 0 0 6px rgba(245,166,35,.15); }
}

/* Nav active underline */
#site-nav a.active {
    background: rgba(245,166,35,.15);
    color: var(--gold-light);
}

/* CTA banner decoration */
.cta-banner::after {
    content: '🚀';
    position: absolute;
    font-size: 120px;
    opacity: .07;
    left: -10px;
    bottom: -20px;
}

/* Stat block hover */
.stat-block {
    transition: transform .2s;
    cursor: default;
}
.stat-block:hover { transform: scale(1.05); }

/* Steps grid connector line */
@media (max-width: 900px) {
    .steps-grid { row-gap: 16px; }
}

/* WordPress alignment classes */
.aligncenter { display: block; margin: 0 auto; }
.alignleft   { float: left; margin: 0 20px 20px 0; }
.alignright  { float: right; margin: 0 0 20px 20px; }
.wp-caption  { max-width: 100%; }

/* Focus styles for accessibility */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible {
    outline: 3px solid var(--gold);
    outline-offset: 3px;
    border-radius: 4px;
}

/* Print */
@media print {
    #site-header, #site-footer, #scroll-top { display: none; }
    .hero { background: none; color: var(--navy); padding: 20px 0; }
    .hero h1, .hero p { color: var(--navy); }
}

/* ── UBAP Plugin integration overrides ──────────────────────────────────── */
/* Make plugin's .ubap-wrap inherit the theme font */
.ubap-wrap {
    font-family: var(--font-body) !important;
}
/* Plugin buttons pick up theme radius */
.ubap-btn {
    font-family: var(--font-display);
    border-radius: var(--radius-pill) !important;
}
/* Fix plugin form inside theme container */
.content-area .ubap-auth-box {
    box-shadow: var(--shadow-lg);
    border: 1.5px solid var(--border);
}
/* Page hero text for portal pages */
.page-hero h1 { font-size: clamp(1.4rem,2.5vw,2.2rem); }

/* Dashboard top bar spacing fix */
.ubap-topbar {
    padding: 0 0 8px;
    border-bottom: 2px solid var(--border);
    margin-bottom: 28px;
}