/* Main Theme Styles - Consolidated from Elementor Sections (LIGHT THEME) */
/**
 * Header Restoration PRO
 */
.site-custom-header {
    background-color: #ffffff !important; /* Clear Theme - White */
    background: #ffffff !important;
    backdrop-filter: blur(10px) !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.8rem 5.5%;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 99999;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08); /* Sophisticated subtle border */
    transition: all 0.3s ease;
    box-sizing: border-box;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05) !important;
}

.site-custom-header .logo {
    display: block !important;
    z-index: 100000;
}

.site-custom-header .logo img {
    height: 42px;
    width: auto;
    display: block !important;
    filter: brightness(0) !important; /* Force logo to be black for Clear Theme */
}

.site-custom-header .header-nav {
    display: flex;
    gap: 2.5rem;
    align-items: center;
}

.site-custom-header .header-nav a {
    color: #0f172a !important; /* Dark text for White header */
    text-decoration: none;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s;
}

.site-custom-header .header-nav a:hover {
    color: #6a4cff;
}

.site-custom-header .mobile-menu-toggle {
    display: none;
    flex-direction: column;
    gap: 6px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 5px;
    z-index: 10001;
}

.site-custom-header .mobile-menu-toggle span {
    width: 25px;
    height: 2px;
    background: #0f172a !important; /* Dark burger for White header */
    transition: 0.3s;
}



@media (max-width: 991px) {
    .site-custom-header {
        padding: 0.8rem 15px; /* Fixed small padding for mobile */
        position: relative;
        justify-content: flex-start;
    }
    
    .site-custom-header .logo {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        margin: 0;
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: auto;
        max-width: clamp(140px, 45vw, 200px); /* Never overlap burger */
    }

    .site-custom-header .logo img {
        height: clamp(32px, 4vh, 42px); /* Scaling logo */
        max-width: 100%;
    }

    .site-custom-header .header-nav {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: #ffffff; /* White background for mobile nav */
        flex-direction: column;
        padding: 2.5rem 2rem;
        gap: 1.8rem;
        border-top: 1px solid rgba(0, 0, 0, 0.08);
        text-align: center;
        box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    }

    .site-custom-header.nav-open .header-nav {
        display: flex;
    }

    .site-custom-header .mobile-menu-toggle {
        display: flex;
        position: relative;
        z-index: 10002;
    }
    
    .site-custom-header .header-action {
        display: none;
    }
}

:root {
    --primary-color: #4a90e2;
    --secondary-color: #8a2be2;
    --accent-color: #f59e0b;
    /* Slightly warmer accent */
    --success-color: #059669;
    --error-color: #e11d48;
    --bg-light: #ffffff;
    --bg-alt: #f8fafc;
    --bg-card: #ffffff;
    --text-dark: #0f172a;
    --text-slate: #334155;
    --text-muted: #64748b;
    --text-white: #ffffff;
    --font-main: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

/* Base Styles */
/* Universal Compatibility Global Reset */
*, *::before, *::after {
    box-sizing: border-box !important;
}

html, body {
    width: 100% !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
    margin: 0;
    padding: 0;
    -webkit-text-size-adjust: 100%; /* Prevent font scaling on orientation change */
    position: relative;
}

body {
    overflow-x: hidden; /* Prevent horizontal scroll */
    width: 100%;
    margin: 0;
    padding: 0;
    font-family: var(--font-main);
    background-color: var(--bg-light);
    color: var(--text-dark);
    line-height: 1.6;
    position: relative;
}

html {
    overflow-x: hidden;
    width: 100%;
}

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

h1 { font-size: clamp(2rem, 8vw, 3.8rem); line-height: 1.1; margin-bottom: 20px; }
h2 { font-size: clamp(1.6rem, 7vw, 3rem); line-height: 1.2; margin-bottom: 15px; }
h3 { font-size: clamp(1.4rem, 6vw, 2.2rem); line-height: 1.2; margin-bottom: 12px; }
h4 { font-size: clamp(1.2rem, 5vw, 1.8rem); line-height: 1.3; }
h5 { font-size: clamp(1.1rem, 4vw, 1.5rem); }
h6 { font-size: clamp(1rem, 3vw, 1.25rem); }

h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    font-weight: 900;
    color: var(--text-dark);
    word-break: normal !important;
    overflow-wrap: anywhere;
}

a {
    text-decoration: none;
    color: inherit;
    transition: var(--transition);
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 clamp(16px, 4vw, 24px); /* Fluid internal padding for all screens */
    width: 100%;
}

.btn {
    display: inline-block;
    padding: 12px 30px;
    border-radius: 50px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    cursor: pointer;
    transition: var(--transition);
}

/* Animations */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes pulseGlow {
    0% {
        box-shadow: 0 0 15px rgba(138, 43, 226, 0.2);
    }

    50% {
        box-shadow: 0 0 30px rgba(138, 43, 226, 0.3);
    }

    100% {
        box-shadow: 0 0 15px rgba(138, 43, 226, 0.2);
    }
}

/* Header */
.site-header {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    padding: 15px 0;
    transition: var(--transition);
}

.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo img {
    height: 45px;
}

.main-navigation ul {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 30px;
}

.main-navigation a {
    color: var(--text-dark);
    font-weight: 600;
    font-size: 0.95rem;
}

.main-navigation a:hover {
    color: var(--primary-color);
}

.header-cta .btn {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
    color: var(--text-white);
    font-size: 0.85rem;
    box-shadow: 0 4px 15px rgba(138, 43, 226, 0.2);
}


/* Fix white gap between header and hero on mobile/all views */
#headerSpacer {
    background: transparent;
}
body.home .site-main {
    margin-top: 0;
}
body.home #headerSpacer {
    display: none;
}
/* Hero Section */
/* Hero Section 2.0 - Advanced Pro Style */
.custom-hero-v2 {
    background: url('https://smarterspro-officiel.net/wp-content/uploads/2026/03/best-iptv-services.webp') center/cover no-repeat;
    position: relative;
    padding: clamp(160px, 18vh, 220px) 24px clamp(80px, 10vh, 120px); /* Increased top padding */
    text-align: center;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 80vh;
}

.custom-hero-v2-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Darker overlay to make white text pop */
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.6) 100%);
    backdrop-filter: blur(2px);
    z-index: 1;
}

.hero-v2-title-advanced {
    font-size: clamp(1.6rem, 8vw, 3.8rem); /* Adjusted min for better visibility */
    line-height: 1.1;
    margin-bottom: clamp(15px, 4vh, 40px);
    color: #ffffff;
    font-weight: 900;
    letter-spacing: -1px;
    z-index: 3;
    position: relative;
    text-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
    word-break: normal !important;
    overflow-wrap: normal; /* Avoid mid-word breaks */
}

@media (max-width: 480px) {
    .hero-v2-title-advanced { 
        font-size: clamp(1.3rem, 7.5vw, 1.8rem) !important;
        white-space: nowrap; /* Force one line as requested */
        letter-spacing: -0.5px;
    }
}

.subtitle-advanced {
    display: block;
    font-size: clamp(1.2rem, 5vw, 1.8rem);
    font-weight: 600;
    color: var(--primary-color);
    margin-top: 15px;
    letter-spacing: 0px;
}

.anim-letter-wave {
    display: inline-block !important;
    animation: bounceWave 2s ease-in-out var(--delay) infinite !important;
    will-change: transform;
}

@keyframes bounceWave {

    0%,
    100% {
        transform: translateY(0) scale(1);
    }

    50% {
        transform: translateY(-8px) scale(1.05);
        /* Increased motion */
    }
}

.custom-hero-v2-content {
    position: relative;
    z-index: 3;
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 10px;
}

.hero-v2-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 20px;
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 50px;
    font-size: 0.85rem;
    font-weight: 800;
    color: var(--primary-color);
    margin-bottom: 40px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    animation: fadeInUpStagger 0.8s ease-out forwards;
}

.hero-v2-btn {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
    color: var(--text-white) !important;
    padding: clamp(12px, 2vh, 18px) clamp(20px, 4vw, 45px); /* Tighter fluid padding */
    font-size: clamp(0.85rem, 3.5vw, 1.2rem); 
    font-weight: 800;
    border-radius: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: normal;
    text-align: center;
    box-shadow: 0 15px 35px rgba(138, 43, 226, 0.3);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    text-transform: uppercase;
    letter-spacing: 1px;
    max-width: 90%; /* Prevent hitting screen edges */
    min-height: 54px; /* Maintain touch target size */
}
@media (max-width: 380px) {
    .hero-v2-btn { width: 100%; padding: 14px 20px; } /* Block on tiny screens */
}

.hero-v2-btn:hover {
    transform: translateY(-5px) scale(1.02);
    box-shadow: 0 20px 45px rgba(138, 43, 226, 0.4);
}

.pulse-button {
    animation: buttonPulse 2s infinite;
}

@keyframes buttonPulse {
    0% {
        box-shadow: 0 0 0 0 rgba(138, 43, 226, 0.4);
    }

    70% {
        box-shadow: 0 0 0 15px rgba(138, 43, 226, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(138, 43, 226, 0);
    }
}

.hero-v2-trust {
    display: none;
    /* removed from template */
}

/* Section Components */
.btn-outline {
    display: inline-block;
    padding: 12px 30px;
    border: 2px solid var(--primary-color);
    color: var(--primary-color);
    background: transparent;
    border-radius: 8px;
    font-weight: 700;
    margin-top: 20px;
}

.btn-outline:hover {
    background: var(--primary-color);
    color: #fff;
}

/* Features Section V2 - Pro Design */
.features-section-v2 {
    padding: 40px 20px; /* Highly compressed */
    text-align: center;
    background: #ffffff;
    overflow: hidden;
}

.section-badge-pro {
    display: inline-block;
    padding: 6px 16px;
    background: rgba(138, 43, 226, 0.08);
    color: var(--primary-color);
    border-radius: 50px;
    font-size: 0.8rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 25px;
}

.section-title-pro {
    font-size: clamp(1.6rem, 7vw, 3.5rem);
    color: var(--text-dark);
    font-weight: 900;
    letter-spacing: -1px;
    margin-bottom: 20px;
    line-height: 1.1;
    word-break: normal !important;
}

.section-subtitle-pro {
    color: var(--text-slate);
    font-size: 1.15rem;
    max-width: 600px;
    margin: 0 auto 40px; /* Reduced from 80px */
    line-height: 1.6;
}

.features-grid-v2 {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 40px;
    max-width: 1200px;
    margin: 0 auto;
    overflow: hidden; /* Contain glows */
}

@media (max-width: 768px) {
    .features-grid-v2 { gap: 20px; }
}

.feat-card-pro {
    flex: 1 1 350px;
    max-width: 380px;
    opacity: 0;
    animation: fadeInUpStagger 1s ease-out var(--delay) forwards;
}

.feat-card-inner {
    background: linear-gradient(135deg, #ffffff 0%, #fcfdfe 100%);
    border: 1px solid #f1f5f9;
    border-radius: 30px;
    padding: 60px 45px;
    text-align: left;
    position: relative;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.03);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    height: 100%;
    overflow: hidden;
}

.feat-card-pro:nth-child(1) .feat-card-inner { background: linear-gradient(135deg, #ffffff 0%, #f5f3ff 100%); border-color: rgba(139, 92, 246, 0.2); }
.feat-card-pro:nth-child(2) .feat-card-inner { background: linear-gradient(135deg, #ffffff 0%, #ecfeff 100%); border-color: rgba(6, 182, 212, 0.2); }
.feat-card-pro:nth-child(3) .feat-card-inner { background: linear-gradient(135deg, #ffffff 0%, #fff7ed 100%); border-color: rgba(245, 158, 11, 0.2); }
.feat-card-pro:nth-child(4) .feat-card-inner { background: linear-gradient(135deg, #ffffff 0%, #fdf2f8 100%); border-color: rgba(236, 72, 153, 0.2); }

.feat-badge-top {
    position: absolute;
    top: 30px;
    right: 35px;
    font-size: 0.65rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--text-muted);
    opacity: 0.5;
}

.feat-icon-pro {
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    margin-bottom: 35px;
    box-shadow: 0 10px 20px rgba(138, 43, 226, 0.2);
    transition: transform 0.4s ease;
}

.feat-icon-pro svg {
    width: 30px;
    height: 30px;
}

.feat-card-pro h3 {
    font-size: 1.6rem;
    color: var(--text-dark);
    margin-bottom: 20px;
    font-weight: 800;
    letter-spacing: -0.5px;
}

.feat-card-pro p {
    color: var(--text-slate);
    font-size: 1.05rem;
    line-height: 1.7;
}

.feat-card-inner:hover {
    transform: translateY(-15px) scale(1.02);
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.08);
    border-color: rgba(138, 43, 226, 0.2);
}

.feat-card-inner:hover .feat-icon-pro {
    transform: rotate(10deg) scale(1.1);
}

.feat-card-glow {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at center, rgba(138, 43, 226, 0.05), transparent 70%);
    transform: translate(-50%, -50%) scale(0);
    transition: transform 0.6s ease;
    z-index: 0;
    pointer-events: none;
}

.feat-card-inner:hover .feat-card-glow {
    transform: translate(-50%, -50%) scale(1.5);
}

.pricing-section-v3, .features-section-v2, .channels-section-v3, .cross-platform-v3 {
    overflow: hidden !important; /* Contain all decorative glows */
}

.pricing-grid-v3 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    max-width: 1400px;
    margin: 0 auto;
    padding: 40px 10px;
}

@media (max-width: 1024px) {
    .pricing-grid-v3 { grid-template-columns: repeat(2, 1fr) !important; padding: 20px 10px; }
}

@media (max-width: 600px) {
    .pricing-grid-v3 { 
        display: flex !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory;
        gap: 20px;
        padding: 20px 20px 40px !important;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    .pricing-grid-v3::-webkit-scrollbar { display: none; }
    .price-card-pro { 
        flex: 0 0 280px !important; /* Fixed width for slider items */
        scroll-snap-align: center;
        margin: 0 !important;
    }
}

.pricing-nav-pro {
    display: grid;
    grid-template-columns: repeat(4, auto);
    justify-content: center;
    gap: 12px;
    margin-bottom: 30px; /* Reduced from 60px */
    padding: 10px 10px;
    scrollbar-width: none;
}

@media (max-width: 768px) {
    .pricing-nav-pro {
        grid-template-columns: repeat(2, 1fr);
        max-width: 400px;
        margin-left: auto;
        margin-right: auto;
    }
}

.pricing-nav-pro::-webkit-scrollbar {
    display: none;
}

.nav-btn-pro {
    padding: 10px 20px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 50px;
    color: var(--text-slate);
    font-size: 0.85rem;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
    white-space: nowrap;
    text-align: center;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
}

/* Colorful Tints for Navigation Buttons */
.nav-btn-pro[href*="plan-12"] { background: #f5f3ff; border-color: #c4b5fd; color: #7c3aed; }
.nav-btn-pro[href*="plan-6"] { background: #f0fdf4; border-color: #86efac; color: #16a34a; }
.nav-btn-pro[href*="plan-3"] { background: #fff7ed; border-color: #fdba74; color: #ea580c; }
.nav-btn-pro[href*="plan-1"] { background: #eff6ff; border-color: #93c5fd; color: #2563eb; }

.nav-btn-pro:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
    filter: brightness(0.95);
}

.price-card-pro {
    background: linear-gradient(165deg, #ffffff 0%, #f8fafc 100%);
    border: 1px solid #e2e8f0;
    border-radius: 24px;
    padding: 30px 20px; /* Reduced vertical padding from 40px */
    position: relative;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}

.price-card-pro:nth-child(1) {
    background: linear-gradient(165deg, #ffffff 0%, #eef2ff 100%);
    border-color: rgba(74, 144, 226, 0.2);
}
.price-card-pro:nth-child(2) {
    background: linear-gradient(165deg, #ffffff 0%, #f0fdf4 100%);
    border-color: rgba(16, 185, 129, 0.2);
}
.price-card-pro:nth-child(3) {
    background: linear-gradient(165deg, #ffffff 0%, #fff7ed 100%);
    border-color: rgba(245, 158, 11, 0.2);
}
.price-card-pro:nth-child(4) {
    background: linear-gradient(165deg, #ffffff 0%, #f8fafc 100%);
    border-color: rgba(148, 163, 184, 0.2);
}

.price-card-pro.best-value {
    background: linear-gradient(165deg, #ffffff 0%, #f5f3ff 100%); /* Subtle lavender tint */
    border: 2px solid var(--primary-color);
    box-shadow: 0 20px 50px rgba(138, 43, 226, 0.12);
    transform: scale(1.03);
    z-index: 2;
}

.plan-popular-ribbon {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    background: var(--primary-color);
    color: #fff;
    padding: 5px 20px;
    border-radius: 50px;
    font-size: 0.7rem; /* Smaller font */
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.plan-tag-small {
    color: var(--primary-color);
    font-size: 0.7rem; /* Smaller font */
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 2px; /* Reduced margin */
    display: block;
}

.plan-duration {
    font-size: 1.6rem; /* Smaller font from 1.8rem */
    font-weight: 900;
    color: var(--text-dark);
    margin-bottom: 2px;
}

.plan-sub-text {
    font-size: 0.8rem; /* Smaller font */
    color: var(--text-muted);
    margin-bottom: 20px; /* Reduced margin from 30px */
}

.price-value-box {
    margin-bottom: 25px; /* Reduced margin from 40px */
    color: var(--text-dark);
}

.price-value-box .currency {
    font-size: 1.2rem;
    font-weight: 800;
    vertical-align: top;
    margin-top: 5px;
    display: inline-block;
}

.price-value-box .amount {
    font-size: clamp(2.5rem, 8vw, 3rem); /* Fluid price */
    font-weight: 900;
    letter-spacing: -1.5px;
}

.plan-features-v3 {
    list-style: none;
    padding: 0;
    margin: 0 0 30px; /* Reduced margin from 50px */
    text-align: left;
}

.plan-features-v3 li {
    padding: 8px 0; /* Reduced padding from 12px */
    border-bottom: 1px solid rgba(0,0,0,0.03);
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text-slate);
    display: flex;
    align-items: center;
    gap: 10px;
}

.plan-features-v3 li .check {
    color: #10b981;
    font-weight: 900;
}

.price-card-footer {
    margin-top: auto;
}

.btn-price-pro {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: rgba(138, 43, 226, 0.05);
    /* Soft brand tint */
    color: var(--primary-color);
    padding: 16px 20px;
    border-radius: 12px;
    font-weight: 800;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 1px solid rgba(138, 43, 226, 0.15);
}

.price-card-pro.best-value .btn-price-pro {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
    color: #fff;
    border: none;
    box-shadow: 0 10px 20px rgba(138, 43, 226, 0.2);
}

.btn-price-pro:hover {
    transform: translateY(-3px);
    background: var(--primary-color);
    color: #fff;
}

.btn-price-pro svg {
    width: 18px;
    height: 18px;
}

.secure-info {
    font-size: 0.7rem;
    color: var(--text-muted);
    margin-top: 15px;
    opacity: 0.6;
}

.price-card-pro:hover {
    transform: translateY(-10px);
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.06);
}

/* Channels Section V3 - Pro Content Showcase */
.channels-section-v3 {
    padding: 70px 20px; /* Reduced from 120px */
    text-align: center;
    background: #ffffff;
}

.stats-bar-pro {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 60px;
    background: #f8fafc;
    padding: 40px;
    border-radius: 30px;
    margin-bottom: 80px;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    border: 1px solid #e2e8f0;
}

.stat-item {
    flex: 1;
}

.stat-num {
    display: block;
    font-size: 2.8rem;
    font-weight: 900;
    color: var(--text-dark);
    letter-spacing: -2px;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.stat-label {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.stat-divider {
    width: 1px;
    height: 50px;
    background: #e2e8f0;
}

@media (max-width: 768px) {
    .stats-bar-pro {
        display: flex !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory;
        gap: 15px;
        padding: 25px 15px !important;
        margin-bottom: 40px;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        justify-content: flex-start; /* Ensure scroll start */
    }
    .stats-bar-pro::-webkit-scrollbar { display: none; }
    .stat-item {
        flex: 0 0 240px !important;
        scroll-snap-align: center;
        background: #ffffff;
        padding: 20px;
        border-radius: 20px;
        border: 1px solid #e2e8f0;
    }
    .stat-divider { display: none; }
}

.channels-grid-v3 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    max-width: 1200px;
    margin: 0 auto;
}

.cat-card-pro {
    background: linear-gradient(145deg, #ffffff 0%, #f1f7ff 100%); /* Subtle blue-tinted gradient */
    border: 1px solid rgba(138, 43, 226, 0.1);
    border-radius: 24px;
    padding: 50px 30px;
    text-align: left;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    opacity: 0;
    animation: fadeInUpStagger 1s ease-out var(--delay) forwards;
    box-shadow: 0 10px 30px rgba(74, 144, 226, 0.05);
    position: relative;
    overflow: hidden;
}

/* Unique tints for each channel card */
.cat-card-pro:nth-child(1) { background: linear-gradient(145deg, #ffffff 0%, #eef2ff 100%); border-color: rgba(74, 144, 226, 0.2); }
.cat-card-pro:nth-child(2) { background: linear-gradient(145deg, #ffffff 0%, #fff7ed 100%); border-color: rgba(245, 158, 11, 0.2); }
.cat-card-pro:nth-child(3) { background: linear-gradient(145deg, #ffffff 0%, #f0fdf4 100%); border-color: rgba(16, 185, 129, 0.2); }
.cat-card-pro:nth-child(4) { background: linear-gradient(145deg, #ffffff 0%, #fdf2f8 100%); border-color: rgba(236, 72, 153, 0.2); }

.cat-icon-box {
    width: 60px;
    height: 60px;
    background: rgba(138, 43, 226, 0.08);
    color: var(--primary-color);
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 30px;
    transition: transform 0.4s ease;
}

.cat-icon-box svg {
    width: 30px;
    height: 30px;
}

.cat-card-pro h3 {
    font-size: 1.4rem;
    font-weight: 800;
    color: var(--text-dark);
    margin-bottom: 15px;
}

.cat-card-pro p {
    font-size: 0.95rem;
    color: var(--text-slate);
    line-height: 1.6;
    margin-bottom: 25px;
}

.cat-features-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.cat-features-list li {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--text-muted);
    padding: 8px 0;
    border-top: 1px solid #f8fafc;
    display: flex;
    align-items: center;
    gap: 8px;
}

.cat-features-list li::before {
    content: "•";
    color: var(--primary-color);
    font-weight: 900;
}

.cat-card-pro:hover {
    transform: translateY(-12px);
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.06);
    border-color: rgba(138, 43, 226, 0.2);
}

.cat-card-pro:hover .cat-icon-box {
    transform: scale(1.1) rotate(5deg);
    background: var(--primary-color);
    color: #fff;
}

.channel-lookup-cta-v2 {
    margin-top: 60px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.9) 0%, rgba(245, 247, 255, 0.9) 100%);
    border: 1px solid rgba(138, 43, 226, 0.15);
    border-radius: 30px;
    padding: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    text-align: left;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.04);
    position: relative;
    overflow: hidden;
}

.channel-lookup-cta-v2::before {
    content: "";
    position: absolute;
    top: -50%; right: -20%;
    width: 300px; height: 300px;
    background: radial-gradient(circle, rgba(138, 43, 226, 0.05), transparent 70%);
    z-index: 0;
}

.lookup-body {
    display: flex;
    align-items: center;
    gap: 30px;
    position: relative;
    z-index: 1;
}

.lookup-icon {
    width: 70px;
    height: 70px;
    background: #ffffff;
    color: var(--primary-color);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.06);
    flex-shrink: 0;
}

.lookup-icon svg { width: 32px; height: 32px; }

.lookup-text h3 {
    font-size: 1.8rem;
    font-weight: 900;
    color: var(--text-dark);
    margin-bottom: 10px;
    letter-spacing: -0.5px;
}

.lookup-text p {
    color: var(--text-slate);
    font-size: 1.1rem;
    margin: 0;
    max-width: 500px;
}

.lookup-action {
    position: relative;
    z-index: 1;
}

.btn-lookup-pro {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
    color: #fff !important;
    padding: 20px 40px;
    border-radius: 16px;
    font-weight: 800;
    font-size: 1.1rem;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    box-shadow: 0 15px 35px rgba(138, 43, 226, 0.3);
}

.btn-lookup-pro:hover {
    transform: translateY(-5px) scale(1.02);
    box-shadow: 0 20px 45px rgba(138, 43, 226, 0.4);
}

.btn-lookup-pro svg {
    width: 22px;
    height: 22px;
    transition: transform 0.4s ease;
}

.btn-lookup-pro:hover svg {
    transform: translateX(8px);
}

@media (max-width: 992px) {
    .channel-lookup-cta-v2 {
        flex-direction: column;
        text-align: center;
        padding: 40px 30px;
        gap: 30px;
    }
    .lookup-body {
        flex-direction: column;
        gap: 20px;
    }
    .btn-lookup-pro {
        width: 100%;
        justify-content: center;
    }
}

/* Setup Section */
.setup-section {
    padding: 60px 20px;
    text-align: center;
    background: var(--bg-alt);
    color: var(--text-dark);
}

/* Reviews Section */
.reviews-section {
    padding: 60px 20px;
    text-align: center;
    background: var(--bg-light);
}

.review-card {
    background: var(--bg-alt);
    border-radius: 15px;
    width: 350px;
    padding: 40px 30px;
    text-align: left;
    color: var(--text-dark);
    box-shadow: var(--shadow-md);
}

.author-initials {
    background: #fff;
    border: 1px solid #e2e8f0;
}

/* Advanced FAQ Section PRO */
.faq-section-pro {
    padding: 80px 20px;
    background: #ffffff;
    text-align: center;
}

.faq-input-pro {
    display: none;
}

.faq-card-pro {
    background: linear-gradient(165deg, #ffffff 0%, var(--faq-bg, #f8fafc) 100%);
    border: 1px solid rgba(0, 0, 0, 0.05); /* Soft base border */
    border-left: 4px solid var(--faq-color, #e2e8f0); /* Color indicator */
    border-radius: 20px;
    text-align: left;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    overflow: hidden;
}

/* Unique Theme Colors for 12 FAQs */
.faq-card-pro:nth-child(1) { --faq-color: #3b82f6; --faq-bg: #eff6ff; }
.faq-card-pro:nth-child(2) { --faq-color: #f59e0b; --faq-bg: #fffbeb; }
.faq-card-pro:nth-child(3) { --faq-color: #10b981; --faq-bg: #ecfdf5; }
.faq-card-pro:nth-child(4) { --faq-color: #f43f5e; --faq-bg: #fff1f2; }
.faq-card-pro:nth-child(5) { --faq-color: #6366f1; --faq-bg: #eef2ff; }
.faq-card-pro:nth-child(6) { --faq-color: #14b8a6; --faq-bg: #f0fdfa; }
.faq-card-pro:nth-child(7) { --faq-color: #8b5cf6; --faq-bg: #f5f3ff; }
.faq-card-pro:nth-child(8) { --faq-color: #f97316; --faq-bg: #fff7ed; }
.faq-card-pro:nth-child(9) { --faq-color: #22c55e; --faq-bg: #f0fdf4; }
.faq-card-pro:nth-child(10) { --faq-color: #ec4899; --faq-bg: #fdf2f8; }
.faq-card-pro:nth-child(11) { --faq-color: #06b6d4; --faq-bg: #ecfeff; }
.faq-card-pro:nth-child(12) { --faq-color: #a855f7; --faq-bg: #faf5ff; }

.faq-header-pro {
    padding: 25px 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    cursor: pointer;
    user-select: none;
}

.faq-header-pro h3 {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--text-dark);
    margin: 0;
    line-height: 1.4;
    transition: color 0.3s ease;
}

.faq-toggle-pro {
    width: 36px;
    height: 36px;
    background: white;
    color: var(--faq-color);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    font-size: 1.3rem;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    flex-shrink: 0;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
}

.faq-body-pro {
    max-height: 0;
    overflow: hidden;
    padding: 0 30px;
    opacity: 0;
    transition: all 0.5s cubic-bezier(0, 1, 0, 1);
    color: var(--text-slate);
    font-size: 1.05rem;
    line-height: 1.7;
}

/* Accordion Logic */
.faq-input-pro:checked ~ .faq-body-pro {
    max-height: 1000px;
    padding: 0 30px 30px;
    opacity: 1;
    transition: all 0.5s cubic-bezier(1, 0, 1, 0);
}

.faq-input-pro:checked ~ .faq-header-pro .faq-toggle-pro {
    transform: rotate(45deg);
    background: var(--faq-color);
    color: #fff;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.faq-input-pro:checked ~ .faq-header-pro h3 {
    color: var(--faq-color);
}

.faq-body-pro strong {
    color: var(--text-dark);
}

.faq-list-pro {
    list-style: none;
    padding: 0;
    margin: 20px 0 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.faq-list-pro li {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--text-slate);
}

.faq-list-pro li::before {
    content: "→";
    color: var(--faq-color);
    font-weight: 900;
}

/* FAQ Hovers */
.faq-card-pro:hover {
    border-color: var(--faq-color);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.06);
    transform: translateY(-4px);
    background: white;
}

.faq-card-pro:hover .faq-toggle-pro {
    transform: scale(1.1);
    background: var(--faq-bg);
}

.faq-card-pro:hover .faq-toggle-pro {
    background: var(--primary-color);
    color: #fff;
    transform: rotate(90deg);
}

@media (max-width: 768px) {
    .faq-header-pro { padding: 20px; }
    .faq-body-pro { padding: 0 20px 20px; }
    .faq-header-pro h3 { font-size: 1rem; }
}

/* Blog Section PRO */
.blog-section-pro {
    padding: 100px 20px;
    background: #f8fafc;
    text-align: center;
}

.section-badge-pro {
    display: inline-block;
    padding: 8px 20px;
    background: rgba(138, 43, 226, 0.1);
    color: #8a2be2;
    border-radius: 100px;
    font-size: 0.85rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 20px;
}

.section-title-pro {
    font-size: 2.8rem;
    font-weight: 900;
    color: #0f172a;
    margin-bottom: 15px;
    letter-spacing: -1px;
}

.section-subtitle-pro {
    font-size: 1.2rem;
    color: #64748b;
    max-width: 700px;
    margin: 0 auto 60px;
    line-height: 1.6;
}

.blog-grid-pro {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
    max-width: 1300px;
    margin: 0 auto;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important; /* Narrower gap */
    width: 100%;
}

.blog-card-pro {
    background: #fff;
    border-radius: 16px; /* Slightly tighter corners */
    overflow: hidden;
    border: 1px solid #e2e8f0;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
    position: relative;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
}

.blog-card-pro:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.08);
    border-color: #6a4cff;
}

.blog-card-img-wrap-pro {
    position: relative;
    width: 100%;
    aspect-ratio: 16/9; /* Consistent ratio */
    overflow: hidden;
}

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

.blog-card-category-pro {
    position: absolute;
    top: 12px;
    right: 12px;
    background: rgba(255,255,255,0.9);
    color: #475569;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    z-index: 2;
}

.blog-card-body-pro {
    padding: 20px; /* Tighter padding */
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.blog-card-date-pro {
    font-size: 0.7rem;
    font-weight: 600;
    color: #94a3b8;
    margin-bottom: 8px;
    display: block;
}

.blog-card-title-pro {
    font-size: 1.1rem;
    font-weight: 800;
    line-height: 1.3;
    color: #0f172a;
    margin-bottom: 12px;
    text-decoration: none;
    transition: color 0.2s;
    display: block; /* Removed line-clamp */
}

.blog-card-pro:hover .blog-card-title-pro {
    color: #6a4cff;
}

.blog-card-excerpt-pro {
    font-size: 0.8rem;
    color: #64748b;
    line-height: 1.5;
    margin-bottom: 20px;
    font-weight: 300;
    display: block; /* Removed line-clamp */
}

/* ================================================================
   BLOG PAGINATION — Modern Horizontal Bar
   ================================================================ */

.blog-pagination-pro {
    display: flex;
    justify-content: center;
    padding: 60px 0;
}

.blog-pagination-pro .nav-links {
    display: flex !important;
    gap: 10px;
    align-items: center;
    list-style: none;
    padding: 0;
    margin: 0;
    flex-wrap: wrap;
    justify-content: center;
}

/* Clean up WordPress default screen-reader-text if present */
.blog-pagination-pro .screen-reader-text {
    display: none !important;
}

.blog-pagination-pro a, 
.blog-pagination-pro span.current {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 10px;
    border-radius: 10px;
    font-size: 0.88rem;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.2s;
    background: #fff;
    border: 1px solid #e2e8f0;
    color: #475569;
}

.blog-pagination-pro a:hover {
    background: #f8fafc;
    border-color: #6a4cff;
    color: #6a4cff;
}

.blog-pagination-pro span.current {
    background: #6a4cff;
    border-color: #6a4cff;
    color: #fff;
}

.blog-pagination-pro .prev, 
.blog-pagination-pro .next {
    font-size: 0.8rem;
    padding: 0 16px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.blog-card-footer-pro {
    margin-top: auto;
}

.blog-card-btn-pro {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #6a4cff;
    font-size: 0.82rem;
    font-weight: 800;
    text-decoration: none;
    transition: color 0.2s;
}

.blog-card-btn-pro:hover { color: #5236e5; }

@media (max-width: 1100px) {
    .blog-grid-pro {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 768px) {
    .blog-grid-pro {
        display: flex !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory;
        gap: 20px;
        padding: 20px 20px 40px !important;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    .blog-grid-pro::-webkit-scrollbar { display: none; }
    .blog-card-link-pro { 
        flex: 0 0 280px !important; 
        scroll-snap-align: center;
        text-decoration: none;
    }
    .blog-card-body-pro { padding: 16px; }
    .blog-card-title-pro { font-size: 1rem; }
    .blog-card-excerpt-pro { font-size: 0.78rem; }
}

.blog-card-content-pro {
    padding: 25px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.blog-category-pro {
    font-size: 0.75rem;
    font-weight: 800;
    color: #8a2be2;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 12px;
    display: block;
}

.blog-card-pro h3 {
    font-size: 1.25rem;
    font-weight: 800;
    color: #0f172a;
    line-height: 1.4;
    margin-bottom: 12px;
    transition: color 0.3s ease;
}

.blog-card-pro p {
    font-size: 0.95rem;
    color: #64748b;
    line-height: 1.6;
    margin-bottom: 20px;
}

.blog-footer-pro {
    margin-top: auto;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #8a2be2;
    font-weight: 800;
    font-size: 0.9rem;
}

.blog-footer-pro svg {
    width: 18px;
    height: 18px;
    transition: transform 0.3s ease;
}

.blog-card-pro:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.08);
    border-color: rgba(138, 43, 226, 0.2);
}

.blog-card-pro:hover .blog-card-image-pro img {
    transform: scale(1.1);
}

.blog-card-pro:hover h3 {
    color: #8a2be2;
}

.blog-card-pro:hover .blog-footer-pro svg {
    transform: translateX(5px);
}

/* Responsive Blog Grid */
@media (max-width: 992px) {
    .blog-grid-pro {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .blog-section-pro {
        padding: 60px 15px;
    }
    
    .blog-grid-pro {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 15px !important;
    }
    
    .blog-card-image-pro {
        height: 140px;
    }
    
    .blog-card-content-pro {
        padding: 15px;
    }
    
    .blog-card-pro h3 {
        font-size: 0.95rem;
        margin-bottom: 8px;
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }
    
    .blog-card-pro p {
        font-size: 0.8rem;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        margin-bottom: 10px;
    }
    
    .blog-category-pro {
        font-size: 0.65rem;
        margin-bottom: 6px;
    }
    
    .blog-footer-pro {
        font-size: 0.75rem;
    }

    .blog-date-badge {
        font-size: 0.65rem;
        padding: 4px 8px;
        top: 10px;
        left: 10px;
    }
}

/* Footer */
/* Advanced Setup Section V2 */
.setup-section-pro {
    padding: 80px 20px;
    background: #ffffff;
    text-align: center;
}

.setup-timeline-pro {
    max-width: 900px;
    margin: 60px auto 0;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

/* Timeline Vertical Line */
.setup-timeline-pro::before {
    content: "";
    position: absolute;
    left: 45px;
    top: 0; bottom: 0;
    width: 2px;
    background: linear-gradient(to bottom, transparent, var(--primary-color), var(--secondary-color), transparent);
    opacity: 0.2;
}

.setup-step-pro {
    display: flex;
    align-items: flex-start;
    gap: 40px;
    text-align: left;
    position: relative;
}

.step-meta-pro {
    flex-shrink: 0;
    width: 90px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.step-num-pro {
    font-size: 1.2rem;
    font-weight: 900;
    color: var(--primary-color);
    background: #fff;
    width: 50px;
    height: 50px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 5px 15px rgba(138, 43, 226, 0.1);
    border: 1px solid rgba(138, 43, 226, 0.1);
    margin-bottom: 10px;
    transition: all 0.3s ease;
}

.step-dot-pro {
    width: 10px;
    height: 10px;
    background: var(--primary-color);
    border-radius: 50%;
    box-shadow: 0 0 10px var(--primary-color);
    margin-top: 5px;
}

.step-card-pro {
    background: linear-gradient(165deg, #ffffff 0%, #f8fafc 100%);
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    padding: 30px;
    flex-grow: 1;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
}

.step-card-pro h4 {
    font-size: 1.4rem;
    font-weight: 800;
    color: var(--text-dark);
    margin-bottom: 15px;
}

.step-card-pro p {
    color: var(--text-slate);
    line-height: 1.6;
    margin: 0;
    font-size: 1rem;
}

/* Step Card Hovers */
.setup-step-pro:hover .step-card-pro {
    transform: translateX(10px);
    border-color: rgba(138, 43, 226, 0.2);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.06);
    background: white;
}

.setup-step-pro:hover .step-num-pro {
    background: var(--primary-color);
    color: #fff;
    transform: scale(1.1);
}

@media (max-width: 768px) {
    .setup-timeline-pro::before { left: 25px; }
    .step-meta-pro { width: 50px; }
    .step-num-pro { width: 40px; height: 40px; font-size: 1rem; }
    .setup-step-pro { gap: 20px; }
    .step-card-pro { padding: 20px; }
    .step-card-pro h4 { font-size: 1.2rem; }
}

/* Advanced Reviews Section PRO */
.reviews-section-pro {
    padding: 80px 20px;
    background: #ffffff;
    text-align: center;
}

.reviews-grid-pro {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 60px;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

.review-card-pro {
    background: linear-gradient(165deg, #ffffff 0%, #f8fafc 100%);
    border: 1px solid #e2e8f0;
    border-radius: 24px;
    padding: 40px;
    text-align: left;
    position: relative;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
    overflow: hidden;
}

.quote-icon-pro {
    position: absolute;
    top: 20px;
    right: 20px;
    color: rgba(138, 43, 226, 0.05);
    width: 60px;
    height: 60px;
    z-index: 0;
}

.stars-pro {
    color: #fbbf24;
    font-size: 1.1rem;
    margin-bottom: 20px;
    position: relative;
    z-index: 1;
}

.review-text-pro {
    font-size: 1.1rem;
    font-style: italic;
    color: var(--text-dark);
    line-height: 1.6;
    margin-bottom: 30px;
    position: relative;
    z-index: 1;
}

.review-author-pro {
    display: flex;
    align-items: center;
    gap: 15px;
    position: relative;
    z-index: 1;
}

.author-avatar-pro {
    width: 45px;
    height: 45px;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 0.85rem;
    flex-shrink: 0; /* Prevent squashing */
}

.author-name-pro {
    font-weight: 800;
    color: var(--text-dark);
    font-size: 1rem;
    margin-bottom: 2px;
}

.author-label-pro {
    font-size: 0.75rem;
    color: #16a34a;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.review-card-pro:hover {
    transform: translateY(-10px);
    border-color: rgba(138, 43, 226, 0.2);
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.07);
    background: white;
}

@media (max-width: 992px) {
    .reviews-grid-pro {
        grid-template-columns: 1fr;
        max-width: 450px;
    }
}

/* Hide Review Slider Nav on Desktop */
.slider-nav-pro {
    display: none;
}

@media (max-width: 768px) {
    /* Reviews Mobile Slider */
    .reviews-section-pro .container {
        max-width: none !important;
        padding: 0 !important;
        width: 100% !important;
    }

    .reviews-grid-pro {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory !important;
        padding: 20px !important;
        gap: 15px !important;
        justify-content: flex-start !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        max-width: none !important;
    }

    .reviews-grid-pro::-webkit-scrollbar {
        display: none;
    }

    .review-card-pro {
        flex: 0 0 88% !important; /* Significant width for presence */
        scroll-snap-align: center !important;
        max-width: none !important;
        padding: 30px 25px !important;
    }

    /* Swipe Navigation Hint */
    .slider-nav-pro {
        display: flex;
        justify-content: center;
        margin-top: -10px;
        margin-bottom: 30px;
    }

    .swipe-hint {
        display: flex;
        align-items: center;
        gap: 12px;
        background: rgba(138, 43, 226, 0.05);
        padding: 8px 20px;
        border-radius: 100px;
        color: var(--primary-color);
        font-size: 0.85rem;
        font-weight: 700;
        border: 1px solid rgba(138, 43, 226, 0.1);
    }

    .swipe-hint svg {
        width: 16px;
        height: 16px;
        animation: pulseArrows 1.5s infinite ease-in-out;
    }

    @keyframes pulseArrows {
        0%, 100% { transform: translateX(0); opacity: 0.5; }
        50% { transform: translateX(3px); opacity: 1; }
    }

    /* Pricing Mobile Slider */
    .pricing-grid-v3 {
        grid-template-columns: repeat(4, 1fr) !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory !important;
        padding-bottom: 30px !important;
        scrollbar-width: none;
    }

    .pricing-grid-v3::-webkit-scrollbar {
        display: none;
    }

    .price-card-pro {
        flex: 0 0 85% !important;
        scroll-snap-align: center !important;
    }

    /* Channels Mobile Slider */
    .channels-grid-v3 {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory !important;
        padding-bottom: 30px !important;
        scrollbar-width: none;
    }

    .channels-grid-v3::-webkit-scrollbar {
        display: none;
    }

    .cat-card-pro {
        flex: 0 0 85% !important;
        scroll-snap-align: center !important;
    }
}

@keyframes fadeInUpStagger {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Footer PRO Redesign */
.footer-pro {
    background: #090a0f;
    color: #e2e8f0;
    padding-top: 80px;
    font-family: var(--font-main);
}

.footer-top-pro {
    padding-bottom: 60px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.footer-grid-pro {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    gap: 40px;
}

.footer-col-pro {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.footer-logo-pro {
    height: 50px;
    width: auto;
    margin-bottom: 10px;
}

.footer-description-pro {
    font-size: 0.95rem;
    line-height: 1.7;
    color: #94a3b8;
    margin-bottom: 10px;
}

.footer-description-pro.small {
    font-size: 0.85rem;
    margin-bottom: 15px;
}

.footer-social-pro {
    display: flex;
    gap: 15px;
}

.footer-social-pro a {
    width: 40px;
    height: 40px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    transition: all 0.3s ease;
}

.footer-social-pro a:hover {
    background: var(--secondary-color);
    transform: translateY(-5px);
    border-color: var(--secondary-color);
}

.footer-social-pro svg {
    width: 20px;
    height: 20px;
}

.footer-title-pro {
    font-size: 1.2rem;
    font-weight: 800;
    color: #fff;
    margin-bottom: 10px;
    position: relative;
    padding-bottom: 12px;
}

.footer-title-pro::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 30px;
    height: 3px;
    background: var(--secondary-color);
    border-radius: 10px;
}

.footer-links-pro {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.footer-links-pro li a {
    color: #94a3b8 !important;
    font-size: 0.95rem;
    font-weight: 500;
    transition: all 0.3s ease;
}

.footer-links-pro li a:hover {
    color: #fff !important;
    padding-left: 8px;
}

/* Newsletter Form */
.footer-news-form-pro {
    position: relative;
    display: flex;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 16px;
    padding: 6px;
    transition: all 0.3s ease;
}

.footer-news-form-pro:focus-within {
    border-color: var(--secondary-color);
    background: rgba(255, 255, 255, 0.05);
    box-shadow: 0 0 20px rgba(138, 43, 226, 0.2);
}

.footer-news-form-pro input {
    flex-grow: 1;
    background: transparent;
    border: none;
    color: #fff;
    padding: 10px 15px;
    font-family: inherit;
    font-size: 0.9rem;
    outline: none;
}

.footer-news-form-pro button {
    width: 45px;
    height: 45px;
    background: var(--secondary-color);
    border: none;
    border-radius: 12px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.footer-news-form-pro button:hover {
    background: var(--primary-color);
    transform: scale(1.05);
}

.footer-news-form-pro button svg {
    width: 20px;
    height: 20px;
}

/* Support Box */
.footer-support-box-pro {
    margin-top: 20px;
}

.support-btn-pro {
    display: flex;
    align-items: center;
    gap: 15px;
    background: rgba(37, 211, 102, 0.1);
    border: 1px solid rgba(37, 211, 102, 0.2);
    padding: 15px 20px;
    border-radius: 20px;
    transition: all 0.3s ease;
}

.support-btn-pro:hover {
    border-color: #25D366;
    background: rgba(37, 211, 102, 0.15);
}

.support-icon-pro {
    font-size: 1.5rem;
}

.support-label-pro strong {
    display: block;
    font-size: 0.95rem;
    color: #fff;
}

.support-label-pro span {
    font-size: 0.8rem;
    color: #25D366;
    font-weight: 700;
}

/* Footer Bottom */
.footer-bottom-pro {
    padding: 40px 0;
    background: #05060b;
}

.bottom-content-pro {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 30px;
}

.bottom-left-pro p {
    font-size: 0.9rem;
    color: #64748b;
    margin-bottom: 12px;
}

.bottom-nav-pro .bottom-links-pro {
    display: flex;
    gap: 20px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.bottom-nav-pro .bottom-links-pro a, 
.bottom-nav-pro .bottom-links-pro li a {
    font-size: 0.85rem;
    color: #94a3b8 !important;
    transition: color 0.3s ease;
}

.bottom-nav-pro .bottom-links-pro a:hover,
.bottom-nav-pro .bottom-links-pro li a:hover {
    color: #fff !important;
}

.payment-badges-pro {
    display: flex;
    gap: 15px;
    align-items: center;
}

.pm-icon {
    height: 35px;
    width: auto;
    filter: grayscale(1) opacity(0.5);
    transition: all 0.3s ease;
}

.pm-icon:hover {
    filter: grayscale(0) opacity(1);
    transform: scale(1.1);
}

/* Responsive Footer */
@media (max-width: 992px) {
    .footer-grid-pro {
        grid-template-columns: repeat(2, 1fr);
        gap: 50px;
    }
}

@media (max-width: 600px) {
    .footer-grid-pro {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .footer-col-pro {
        text-align: center;
        align-items: center;
    }
    
    .footer-title-pro::after {
        left: 50%;
        transform: translateX(-50%);
    }
    
    .footer-links-pro li a:hover {
        padding-left: 0;
        transform: scale(1.1);
    }
    
    .bottom-content-pro {
        flex-direction: column;
        text-align: center;
    }
    
    .bottom-left-pro, .bottom-right-pro {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
}

/* =============================================
   SINGLE PLAN PAGE - PREMIUM REDESIGN
   ============================================= */

/* Wrapper */
.plan-page-wrapper {
    background: #0a0a0f;
    min-height: 100vh;
    padding-top: 80px; /* offset for fixed header */
    font-family: 'Inter', sans-serif;
    color: #e0e0f0;
}

/* ---- Hero ---- */
.plan-hero {
    position: relative;
    min-height: 480px;
    display: flex;
    align-items: flex-end;
    padding-bottom: 60px;
    overflow: hidden;
}

.plan-hero__bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transform: scale(1.03);
    transition: transform 6s ease;
}
.plan-hero:hover .plan-hero__bg { transform: scale(1); }

.plan-hero__bg--gradient {
    background: linear-gradient(135deg, #1a0533 0%, #0e0e2e 60%, #0a0a0f 100%);
}

.plan-hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, #0a0a0f 20%, rgba(10,10,15,0.6) 70%, rgba(10,10,15,0.2) 100%);
}

.plan-hero__content {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    padding: 0 24px;
}

.plan-hero__breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.82rem;
    color: rgba(255,255,255,0.5);
    margin-bottom: 20px;
}
.plan-hero__breadcrumb a {
    color: rgba(255,255,255,0.5);
    text-decoration: none;
    transition: color 0.2s;
}
.plan-hero__breadcrumb a:hover { color: #6a4cff; }

.plan-badge {
    display: inline-block;
    background: linear-gradient(90deg, #6a4cff, #9d6aff);
    color: #fff;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    padding: 4px 14px;
    border-radius: 20px;
    margin-bottom: 16px;
    text-transform: uppercase;
}

.plan-hero__title {
    font-size: clamp(2rem, 4vw, 3.4rem);
    font-weight: 800;
    color: #fff;
    line-height: 1.15;
    margin: 0 0 14px;
    text-shadow: 0 2px 20px rgba(0,0,0,0.4);
}

.plan-hero__subtitle {
    font-size: 1.05rem;
    color: rgba(255,255,255,0.75);
    max-width: 580px;
    margin: 0 0 28px;
    line-height: 1.6;
}

.plan-hero__price-row {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}

.plan-hero__price {
    font-size: 2.4rem;
    font-weight: 800;
    color: #fff;
    display: flex;
    align-items: baseline;
    gap: 6px;
}
.plan-hero__price .woocommerce-Price-amount { font-size: inherit; color: inherit; }
.plan-hero__duration {
    font-size: 0.95rem;
    font-weight: 400;
    color: rgba(255,255,255,0.55);
}

.plan-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: linear-gradient(135deg, #6a4cff, #9d6aff);
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    padding: 14px 30px;
    border-radius: 8px;
    text-decoration: none;
    transition: all 0.3s;
    box-shadow: 0 6px 24px rgba(106,76,255,0.35);
    white-space: nowrap;
}
.plan-cta-btn:hover {
    background: linear-gradient(135deg, #5236e5, #8651ff);
    box-shadow: 0 8px 32px rgba(106,76,255,0.55);
    transform: translateY(-2px);
    color: #fff;
}

.plan-purchased-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(74,222,128,0.12);
    border: 1px solid rgba(74,222,128,0.3);
    color: #4ade80;
    font-size: 0.95rem;
    font-weight: 600;
    padding: 10px 20px;
    border-radius: 8px;
}

/* ---- Main Content Grid ---- */
.plan-main {
    max-width: 1200px;
    padding: 60px 24px;
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 40px;
    align-items: start;
}

/* ---- Plan Card ---- */
.plan-card {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 16px;
    padding: 32px;
    margin-bottom: 24px;
    transition: border-color 0.3s;
}
.plan-card:hover { border-color: rgba(106,76,255,0.3); }

.plan-card__title {
    font-size: 1.15rem;
    font-weight: 700;
    color: #fff;
    margin: 0 0 24px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.plan-card__title svg { color: #6a4cff; flex-shrink: 0; }

/* ---- Features ---- */
.plan-features {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}
.plan-features li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.92rem;
    color: rgba(255,255,255,0.85);
    background: rgba(106,76,255,0.06);
    border: 1px solid rgba(106,76,255,0.12);
    border-radius: 8px;
    padding: 10px 14px;
}
.plan-features li svg { flex-shrink: 0; }

/* ---- Description ---- */
.plan-description {
    font-size: 0.95rem;
    line-height: 1.8;
    color: rgba(255,255,255,0.75);
}
.plan-description p { margin-bottom: 14px; }
.plan-description h2, .plan-description h3 {
    color: #fff;
    font-weight: 700;
    margin: 20px 0 10px;
}

/* ---- Devices ---- */
.plan-devices {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.plan-device-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 30px;
    padding: 8px 18px;
    font-size: 0.875rem;
    color: rgba(255,255,255,0.85);
    transition: all 0.25s;
}
.plan-device-chip:hover {
    background: rgba(106,76,255,0.15);
    border-color: rgba(106,76,255,0.4);
    color: #fff;
}

/* ---- Sticky Order Box ---- */
.plan-order-box {
    background: #12121e;
    border: 1px solid rgba(106,76,255,0.25);
    border-radius: 20px;
    padding: 32px;
    position: sticky;
    top: 100px;
    box-shadow: 0 12px 60px rgba(0,0,0,0.5);
}

.plan-order-box__header {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255,255,255,0.07);
}
.plan-order-box__label {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255,255,255,0.4);
}
.plan-order-box__header h3 {
    font-size: 1.1rem;
    font-weight: 700;
    color: #fff;
    margin: 6px 0 0;
    line-height: 1.3;
}

.plan-order-box__price {
    font-size: 2rem;
    font-weight: 800;
    color: #fff;
    margin-bottom: 20px;
    display: flex;
    align-items: baseline;
    gap: 6px;
}
.plan-order-box__price .woocommerce-Price-amount { font-size: inherit; color: inherit; }
.plan-order-box__duration {
    font-size: 0.85rem;
    font-weight: 400;
    color: rgba(255,255,255,0.45);
}

.plan-order-box__features {
    list-style: none;
    padding: 0;
    margin: 0 0 24px;
}
.plan-order-box__features li {
    font-size: 0.875rem;
    color: rgba(255,255,255,0.75);
    padding: 8px 0;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    display: flex;
    align-items: center;
    gap: 8px;
}
.plan-order-box__features li:last-child { border: none; }

.plan-order-box__cta {
    display: block;
    text-align: center;
    background: linear-gradient(135deg, #6a4cff, #9d6aff);
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    padding: 15px;
    border-radius: 10px;
    text-decoration: none;
    transition: all 0.3s;
    margin-bottom: 12px;
    box-shadow: 0 4px 20px rgba(106,76,255,0.35);
}
.plan-order-box__cta:hover {
    background: linear-gradient(135deg, #5236e5, #8651ff);
    transform: translateY(-2px);
    box-shadow: 0 8px 32px rgba(106,76,255,0.55);
    color: #fff;
}

.plan-order-box__note {
    text-align: center;
    font-size: 0.78rem;
    color: rgba(255,255,255,0.4);
    margin: 0 0 20px;
}

.plan-order-box__stats {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 10px;
    padding: 20px 0;
    border-top: 1px solid rgba(255,255,255,0.07);
    border-bottom: 1px solid rgba(255,255,255,0.07);
    margin-bottom: 20px;
    text-align: center;
}
.plan-order-box__stats strong {
    display: block;
    font-size: 1.05rem;
    font-weight: 800;
    color: #6a4cff;
}
.plan-order-box__stats span {
    display: block;
    font-size: 0.7rem;
    color: rgba(255,255,255,0.45);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 2px;
}

.plan-order-box__whatsapp {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: rgba(37,211,102,0.1);
    border: 1px solid rgba(37,211,102,0.25);
    color: #25d366;
    font-size: 0.85rem;
    font-weight: 600;
    padding: 11px;
    border-radius: 8px;
    text-decoration: none;
    transition: all 0.25s;
}
.plan-order-box__whatsapp:hover {
    background: rgba(37,211,102,0.2);
    color: #25d366;
}

.plan-order-box__purchased {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 1rem;
    font-weight: 600;
    color: #4ade80;
    padding: 14px;
    background: rgba(74,222,128,0.08);
    border: 1px solid rgba(74,222,128,0.2);
    border-radius: 10px;
    margin-bottom: 20px;
}

/* ---- Trust Bar ---- */
.plan-trust {
    background: rgba(255,255,255,0.02);
    border-top: 1px solid rgba(255,255,255,0.05);
    border-bottom: 1px solid rgba(255,255,255,0.05);
    padding: 50px 0;
}
.plan-trust__grid {
    max-width: 1200px;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 30px;
    text-align: center;
    padding: 0 24px;
}
.plan-trust__item svg {
    color: #6a4cff;
    margin-bottom: 12px;
}
.plan-trust__item strong {
    display: block;
    font-size: 0.95rem;
    font-weight: 700;
    color: #fff;
    margin-bottom: 4px;
}
.plan-trust__item span {
    font-size: 0.82rem;
    color: rgba(255,255,255,0.45);
}

/* ---- Section Title ---- */
.plan-section-title {
    font-size: 1.8rem;
    font-weight: 800;
    color: #fff;
    margin-bottom: 32px;
    text-align: center;
}

/* ---- Related Plans ---- */
.plan-related {
    padding: 70px 0;
}
.plan-related .container { max-width: 1200px; padding: 0 24px; }

.plan-related__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 20px;
}
.plan-related__card {
    position: relative;
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 14px;
    padding: 20px;
    text-decoration: none;
    transition: all 0.3s;
    overflow: hidden;
}
.plan-related__card:hover {
    border-color: rgba(106,76,255,0.4);
    background: rgba(106,76,255,0.07);
    transform: translateY(-3px);
    box-shadow: 0 10px 40px rgba(0,0,0,0.3);
}
.plan-related__card--featured {
    border-color: rgba(106,76,255,0.3);
}
.plan-related__badge {
    position: absolute;
    top: 12px;
    right: 12px;
    background: linear-gradient(90deg, #6a4cff, #9d6aff);
    color: #fff;
    font-size: 0.68rem;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 20px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.plan-related__img {
    width: 60px;
    height: 60px;
    object-fit: cover;
    border-radius: 8px;
    flex-shrink: 0;
}
.plan-related__info h4 {
    font-size: 0.92rem;
    font-weight: 700;
    color: #fff;
    margin: 0 0 4px;
    line-height: 1.3;
}
.plan-related__info span { font-size: 0.88rem; color: #6a4cff; font-weight: 600; }
.plan-related__arrow {
    margin-left: auto;
    font-size: 1.1rem;
    color: rgba(255,255,255,0.25);
    transition: all 0.25s;
}
.plan-related__card:hover .plan-related__arrow {
    color: #6a4cff;
    transform: translateX(4px);
}

/* ---- Responsive ---- */
@media (max-width: 991px) {
    .plan-main {
        grid-template-columns: 1fr;
        padding: 40px 16px;
    }
    .plan-order-box {
        position: static;
        order: -1;
    }
    .plan-trust__grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .plan-features {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .plan-hero {
        min-height: 350px;
        padding-bottom: 40px;
    }
    .plan-hero__title { font-size: 1.8rem; }
    .plan-hero__price-row { flex-direction: column; align-items: flex-start; gap: 14px; }
    .plan-trust__grid { grid-template-columns: 1fr 1fr; gap: 20px; }
    .plan-related__grid { grid-template-columns: 1fr; }
    .plan-card { padding: 20px; }
    .plan-order-box { padding: 22px; }
}

/* ---- Plan Hero: Product Showcase Style ---- */
.plan-hero-showcase {
    background: linear-gradient(180deg, #0d0d1a 0%, #0a0a0f 100%);
    padding: 120px 0 60px; /* top offset for fixed header */
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

.plan-hero-showcase__inner {
    max-width: 1200px;
    display: grid;
    grid-template-columns: 1fr 420px;
    gap: 60px;
    align-items: center;
    padding: 0 24px;
}

.plan-hero-showcase__info {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.plan-hero-showcase__price-block {
    margin: 20px 0 28px;
}

.plan-hero-showcase__price {
    display: flex;
    align-items: baseline;
    gap: 4px;
}

.plan-hero-showcase__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    margin-bottom: 24px;
}

.plan-hero-showcase__wa {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #25d366;
    font-size: 0.88rem;
    font-weight: 600;
    text-decoration: none;
    padding: 12px 18px;
    border: 1px solid rgba(37,211,102,0.25);
    background: rgba(37,211,102,0.07);
    border-radius: 8px;
    transition: all 0.25s;
}
.plan-hero-showcase__wa:hover {
    background: rgba(37,211,102,0.15);
    color: #25d366;
}

/* Image column */
.plan-hero-showcase__image-wrap {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.plan-hero-showcase__img-glow {
    position: absolute;
    inset: -20px;
    background: radial-gradient(ellipse at center, rgba(106,76,255,0.25) 0%, transparent 70%);
    pointer-events: none;
    border-radius: 24px;
    filter: blur(20px);
}

.plan-hero-showcase__img {
    width: 100%;
    max-width: 420px;
    border-radius: 20px;
    box-shadow: 0 20px 80px rgba(0,0,0,0.6), 0 0 0 1px rgba(106,76,255,0.15);
    position: relative;
    z-index: 1;
    transition: transform 0.5s ease, box-shadow 0.5s ease;
    animation: plan-float 5s ease-in-out infinite;
}
.plan-hero-showcase__img:hover {
    transform: translateY(-6px) scale(1.01);
    box-shadow: 0 30px 100px rgba(0,0,0,0.7), 0 0 0 1px rgba(106,76,255,0.3);
}

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

.plan-hero-showcase__img-placeholder {
    width: 420px;
    height: 300px;
    background: rgba(106,76,255,0.06);
    border: 2px dashed rgba(106,76,255,0.2);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.plan-hero-showcase__img-badge {
    position: absolute;
    top: -14px;
    right: 20px;
    background: linear-gradient(90deg, #f59e0b, #fbbf24);
    color: #1a1a1a;
    font-size: 0.75rem;
    font-weight: 800;
    padding: 5px 14px;
    border-radius: 20px;
    z-index: 2;
    box-shadow: 0 4px 14px rgba(245,158,11,0.4);
    letter-spacing: 0.3px;
}

/* Responsive override for showcase hero */
@media (max-width: 991px) {
    .plan-hero-showcase__inner {
        grid-template-columns: 1fr;
    }
    .plan-hero-showcase__image-wrap {
        order: -1;
    }
    .plan-hero-showcase__img {
        max-width: 320px;
        animation: none;
    }
    .plan-hero-showcase {
        padding: 100px 0 40px;
    }
}

@media (max-width: 600px) {
    .plan-hero-showcase__img { max-width: 260px; }
    .plan-hero-showcase__actions { flex-direction: column; align-items: flex-start; }
    .plan-cta-btn { width: 100%; justify-content: center; }
}

/* ============================================================
   SINGLE PLAN PAGE — Professional Product Layout
   All classes prefixed with "plp-" — isolated from header/footer/home
   ============================================================ */

/* Base */
.plp-wrap {
    background: #f8fafc;
    min-height: 100vh;
}

.plp-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}

/* ---- Breadcrumb ---- */
.plp-breadcrumb-bar {
    background: #fff;
    border-bottom: 1px solid #e2e8f0;
    padding: 12px 0;
    margin-top: 70px; /* clear fixed header */
}

.plp-breadcrumb {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.82rem;
    color: #94a3b8;
}

.plp-breadcrumb a {
    color: #64748b;
    text-decoration: none;
    transition: color 0.2s;
}

.plp-breadcrumb a:hover { color: #4f46e5; }
.plp-breadcrumb span:last-child { color: #1e293b; font-weight: 600; }

/* ---- Product Top Section ---- */
.plp-product-top {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 52px;
    align-items: start;
    padding: 40px 0 48px;
    background: #fff;
    margin: 0 -24px;
    padding-left: 24px;
    padding-right: 24px;
    border-bottom: 1px solid #e2e8f0;
}

/* ---- Photo Column ---- */
.plp-photo-col { display: flex; flex-direction: column; gap: 16px; }

.plp-photo-card {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 8px 40px rgba(0,0,0,0.1);
    background: #f1f5f9;
    line-height: 0;
}

.plp-photo-card--empty {
    height: 320px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px dashed #c7d2fe;
    background: #eef2ff;
}

.plp-photo {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.4s ease;
}

.plp-photo-card:hover .plp-photo { transform: scale(1.02); }

.plp-photo-badge {
    position: absolute;
    top: 14px;
    left: 14px;
    background: linear-gradient(135deg, #4f46e5, #7c3aed);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 20px;
    letter-spacing: 0.3px;
    z-index: 2;
    box-shadow: 0 4px 14px rgba(79,70,229,0.35);
}

.plp-trust-mini {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.plp-trust-mini span {
    flex: 1 1 auto;
    text-align: center;
    font-size: 0.75rem;
    font-weight: 600;
    color: #475569;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 7px 10px;
}

/* ---- Info Column ---- */
.plp-info-col { padding-top: 4px; }

.plp-info-badge {
    display: inline-block;
    background: #fef3c7;
    color: #92400e;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 20px;
    margin-bottom: 12px;
    letter-spacing: 0.3px;
}

.plp-title {
    font-size: clamp(1.4rem, 3vw, 2rem);
    font-weight: 800;
    color: #0f172a;
    line-height: 1.25;
    margin: 0 0 12px;
    letter-spacing: -0.5px;
}

.plp-excerpt {
    color: #64748b;
    font-size: 1rem;
    line-height: 1.65;
    margin: 0 0 20px;
}

.plp-divider {
    border: none;
    border-top: 1px solid #e2e8f0;
    margin: 20px 0;
}

/* Price */
.plp-price-block {
    display: flex;
    align-items: baseline;
    gap: 4px;
    margin-bottom: 22px;
}

.plp-price-currency {
    font-size: 1.4rem;
    font-weight: 700;
    color: #4f46e5;
}

.plp-price-amount {
    font-size: 3rem;
    font-weight: 900;
    color: #0f172a;
    line-height: 1;
}

.plp-price-dur {
    font-size: 0.95rem;
    color: #94a3b8;
    font-weight: 400;
    margin-left: 4px;
}

/* Quick features */
.plp-quick-features {
    list-style: none;
    margin: 0 0 24px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.plp-quick-features li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.9rem;
    color: #1e293b;
    font-weight: 500;
}

/* ---- TWO BUTTONS ---- */
.plp-ctas {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 16px;
}

.plp-btn-buy {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 28px;
    background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
    color: #fff !important;
    font-size: 1rem;
    font-weight: 700;
    border-radius: 12px;
    text-decoration: none;
    box-shadow: 0 6px 24px rgba(79,70,229,0.35);
    transition: all 0.3s ease;
    letter-spacing: 0.2px;
}

.plp-btn-buy:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 32px rgba(79,70,229,0.45);
    color: #fff !important;
}

.plp-btn-wa {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 15px 28px;
    background: #fff;
    color: #128c7e !important;
    font-size: 1rem;
    font-weight: 700;
    border: 2px solid #25d366;
    border-radius: 12px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.plp-btn-wa:hover {
    background: #dcfce7;
    color: #128c7e !important;
    transform: translateY(-2px);
}

.plp-secure-note {
    font-size: 0.75rem;
    color: #94a3b8;
    display: flex;
    align-items: center;
    gap: 5px;
    margin: 0 0 16px;
}

.plp-duration-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #eef2ff;
    color: #4f46e5;
    font-size: 0.82rem;
    font-weight: 600;
    padding: 7px 14px;
    border-radius: 8px;
}

/* ---- BODY (Full Width) ---- */
.plp-body {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 32px;
    padding: 32px 20px;
    align-items: start;
    max-width: 100% !important;
}

/* ---- Cards ---- */
.plp-main { display: flex; flex-direction: column; gap: 24px; }

.plp-card {
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 24px 0; /* Reduced padding since no frame */
    box-shadow: none;
}

.plp-card-title {
    font-size: 1.05rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.plp-card-title__icon {
    width: 34px;
    height: 34px;
    background: #eef2ff;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #4f46e5;
    flex-shrink: 0;
}

/* Features full list */
.plp-features-full {
    list-style: none;
    margin: 0; padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.plp-features-full li {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 0.88rem;
    color: #334155;
    font-weight: 500;
}

/* Description */
.plp-description {
    font-size: 0.95rem;
    color: #475569;
    line-height: 1.8;
}

/* Description — Opening paragraph (lead) */
.plp-description > p:first-child {
    font-size: 1.05rem;
    color: #334155;
    font-weight: 500;
    line-height: 1.7;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #f1f5f9;
}

/* Description — Headings */
.plp-description h2 {
    color: #0f172a;
    font-size: 1.25rem;
    font-weight: 700;
    margin: 32px 0 14px;
    padding-bottom: 10px;
    border-bottom: 2px solid #eef2ff;
    line-height: 1.3;
}

.plp-description h3 {
    color: #1e293b;
    font-size: 1.02rem;
    font-weight: 600;
    margin: 22px 0 8px;
    line-height: 1.4;
}

.plp-description h3::before {
    content: '';
    display: inline-block;
    width: 4px;
    height: 16px;
    background: #4f46e5;
    border-radius: 2px;
    margin-right: 8px;
    vertical-align: -2px;
}

/* Description — Paragraphs */
.plp-description p { margin: 0 0 14px; }

.plp-description p strong {
    color: #1e293b;
    font-weight: 600;
}

/* Description — Tables */
.plp-description table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin: 20px 0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
    border: 1px solid #e2e8f0;
}

.plp-description thead {
    background: linear-gradient(135deg, #4f46e5 0%, #6366f1 100%);
}

.plp-description thead th {
    color: #fff;
    font-weight: 600;
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 12px 16px;
    text-align: left;
    white-space: nowrap;
}

.plp-description thead th:first-child {
    padding-left: 20px;
}

.plp-description tbody tr {
    background: #fff;
    transition: background 0.15s;
    border-bottom: 1px solid #f1f5f9;
}

.plp-description tbody tr:nth-child(even) {
    background: #fafbff;
}

.plp-description tbody tr:hover {
    background: #f0f5ff;
}

.plp-description tbody tr:last-child {
    border-bottom: none;
}

.plp-description tbody td {
    padding: 11px 16px;
    font-size: 0.86rem;
    color: #475569;
    line-height: 1.5;
    vertical-align: middle;
}

.plp-description tbody td:first-child {
    padding-left: 20px;
    font-weight: 600;
    color: #334155;
}

.plp-description tbody td strong {
    color: #4f46e5;
    font-weight: 700;
}

/* Description — Unordered Lists */
.plp-description ul {
    list-style: none;
    margin: 14px 0;
    padding: 0;
    display: grid;
    gap: 8px;
}

.plp-description ul li {
    position: relative;
    padding-left: 24px;
    font-size: 0.9rem;
    color: #475569;
    line-height: 1.6;
}

.plp-description ul li::before {
    content: '';
    position: absolute;
    left: 6px;
    top: 8px;
    width: 6px;
    height: 6px;
    background: #4f46e5;
    border-radius: 50%;
    flex-shrink: 0;
}

.plp-description ul li strong {
    color: #1e293b;
    font-weight: 600;
}

/* Description — Ordered Lists */
.plp-description ol {
    list-style: none;
    counter-reset: step-counter;
    margin: 14px 0;
    padding: 0;
    display: grid;
    gap: 10px;
}

.plp-description ol li {
    counter-increment: step-counter;
    position: relative;
    padding-left: 44px;
    font-size: 0.9rem;
    color: #475569;
    line-height: 1.6;
    min-height: 32px;
    display: flex;
    align-items: flex-start;
    padding-top: 4px;
}

.plp-description ol li::before {
    content: counter(step-counter);
    position: absolute;
    left: 0;
    top: 0;
    width: 30px;
    height: 30px;
    background: linear-gradient(135deg, #4f46e5, #6366f1);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.78rem;
    font-weight: 700;
    flex-shrink: 0;
}

/* Description — Details/Summary (inline FAQs in content) */
.plp-description details {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    margin-bottom: 8px;
    overflow: hidden;
    transition: all 0.2s;
    background: #fff;
}

.plp-description details[open] {
    border-color: #c7d2fe;
    box-shadow: 0 2px 8px rgba(79,70,229,0.08);
}

.plp-description details summary {
    padding: 14px 18px;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.9rem;
    color: #1e293b;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    user-select: none;
    transition: background 0.15s;
}

.plp-description details summary::-webkit-details-marker { display: none; }

.plp-description details summary::after {
    content: '+';
    font-size: 1.2rem;
    color: #4f46e5;
    font-weight: 300;
    transition: transform 0.2s;
}

.plp-description details[open] summary::after {
    content: '−';
}

.plp-description details[open] summary {
    background: #f8faff;
    border-bottom: 1px solid #eef2ff;
}

.plp-description details summary:hover {
    background: #f5f7ff;
}

.plp-description details p {
    padding: 14px 18px;
    margin: 0;
    font-size: 0.86rem;
    color: #64748b;
    line-height: 1.65;
}

/* Description — Links */
.plp-description a {
    color: #4f46e5;
    text-decoration: none;
    font-weight: 500;
    border-bottom: 1px solid transparent;
    transition: border-color 0.15s;
}

.plp-description a:hover {
    border-bottom-color: #4f46e5;
}

/* Description — Strong emphasis in tables */
.plp-description table strong {
    color: #4f46e5;
}

/* Devices */
.plp-devices {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.plp-device {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 14px 8px;
    transition: all 0.2s;
    text-align: center;
}

.plp-device:hover {
    border-color: #c7d2fe;
    background: #eef2ff;
}

.plp-device__icon { font-size: 1.5rem; }

.plp-device__name {
    font-size: 0.72rem;
    color: #475569;
    font-weight: 600;
}

/* FAQ */
.plp-faq {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    margin-bottom: 8px;
    overflow: hidden;
    transition: border-color 0.2s;
}

.plp-faq[open] { border-color: #c7d2fe; }

.plp-faq__q {
    padding: 15px 18px;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.9rem;
    color: #1e293b;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    user-select: none;
}

.plp-faq__q::after { content: '+'; font-size: 1.1rem; color: #4f46e5; font-weight: 400; }
.plp-faq[open] .plp-faq__q::after { content: '−'; }

.plp-faq__a {
    padding: 0 18px 15px;
    margin: 0;
    font-size: 0.86rem;
    color: #64748b;
    line-height: 1.65;
}

/* ---- SIDEBAR ---- */
.plp-sidebar { display: flex; flex-direction: column; gap: 0; }

.plp-sidebar-title {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #94a3b8;
    margin: 0 0 16px;
}

/* Related plan cards */
.plp-rel-card {
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 14px;
    text-decoration: none;
    margin-bottom: 10px;
    transition: all 0.25s ease;
    overflow: hidden;
}

.plp-rel-card:hover {
    border-color: #c7d2fe;
    box-shadow: 0 4px 20px rgba(79,70,229,0.1);
    transform: translateY(-2px);
}

.plp-rel-card--top {
    border-color: #c7d2fe;
    background: linear-gradient(135deg, #fafafe 0%, #eef2ff 100%);
}

.plp-rel-card__ribbon {
    position: absolute;
    top: 8px;
    right: 10px;
    background: #4f46e5;
    color: #fff;
    font-size: 0.62rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 20px;
    letter-spacing: 0.3px;
}

.plp-rel-card__photo {
    width: 56px;
    height: 56px;
    border-radius: 10px;
    overflow: hidden;
    background: #f1f5f9;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
}

.plp-rel-card__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.plp-rel-card__info { flex: 1; min-width: 0; }

.plp-rel-card__name {
    font-size: 0.82rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0 0 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 160px;
}

.plp-rel-card__price {
    font-size: 0.95rem;
    font-weight: 800;
    color: #4f46e5;
    margin: 0;
}

.plp-rel-card__price span {
    font-size: 0.72rem;
    color: #94a3b8;
    font-weight: 400;
}

.plp-rel-card__arr {
    color: #c7d2fe;
    flex-shrink: 0;
    transition: color 0.2s;
}

.plp-rel-card:hover .plp-rel-card__arr { color: #4f46e5; }

/* Sidebar WhatsApp card */
.plp-sidebar-wa {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 22px 20px;
    text-align: center;
    margin-top: 8px;
}

.plp-sidebar-wa p {
    font-size: 0.88rem;
    font-weight: 600;
    color: #334155;
    margin: 10px 0 6px;
}

.plp-sidebar-wa a {
    display: inline-block;
    background: #25d366;
    color: #fff !important;
    font-size: 0.85rem;
    font-weight: 700;
    padding: 10px 20px;
    border-radius: 8px;
    text-decoration: none;
    transition: background 0.2s;
}

.plp-sidebar-wa a:hover { background: #20b957; }

/* ---- RESPONSIVE ---- */
@media (max-width: 1024px) {
    .plp-product-top {
        grid-template-columns: 220px 1fr;
        gap: 36px;
    }
    .plp-body { grid-template-columns: 1fr 280px; }
}

@media (max-width: 768px) {
    .plp-product-top {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .plp-photo-card { max-width: 220px; margin: 0 auto; }
    .plp-body {
        grid-template-columns: 1fr;
    }
    .plp-sidebar { order: -1; }
    .plp-sidebar-title { display: none; }
    /* Horizontal scroll for related plans on mobile */
    .plp-sidebar > a.plp-rel-card {
        display: none;
    }
    .plp-sidebar { flex-direction: column; }
    .plp-features-full { grid-template-columns: 1fr; }
    .plp-devices { grid-template-columns: repeat(3, 1fr); }
    .plp-ctas { flex-direction: column; }

    /* Description mobile — tables scroll horizontally */
    .plp-description { font-size: 0.9rem; }
    .plp-description > p:first-child { font-size: 0.98rem; }
    .plp-description h2 { font-size: 1.12rem; margin-top: 24px; }
    .plp-description h3 { font-size: 0.96rem; margin-top: 18px; }
    .plp-description table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
        border-radius: 8px;
    }
    .plp-description thead th { font-size: 0.74rem; padding: 10px 12px; }
    .plp-description tbody td { font-size: 0.8rem; padding: 9px 12px; }
    .plp-description ul { gap: 6px; }
    .plp-description ul li { font-size: 0.86rem; }
    .plp-description ol li { font-size: 0.86rem; }
    .plp-description details summary { font-size: 0.86rem; padding: 12px 14px; }
    .plp-description details p { font-size: 0.82rem; padding: 12px 14px; }
}

@media (max-width: 480px) {
    .plp-description { font-size: 0.86rem; line-height: 1.7; }
    .plp-description > p:first-child { font-size: 0.92rem; }
    .plp-description h2 { font-size: 1.05rem; margin-top: 20px; padding-bottom: 8px; }
    .plp-description h3 { font-size: 0.92rem; }
    .plp-description h3::before { height: 14px; width: 3px; }
    .plp-description table { margin: 14px 0; }
    .plp-description thead th { font-size: 0.7rem; padding: 8px 10px; }
    .plp-description tbody td { font-size: 0.76rem; padding: 8px 10px; }
    .plp-description tbody td:first-child { padding-left: 12px; }
    .plp-description ul li { font-size: 0.82rem; padding-left: 20px; }
    .plp-description ol li { font-size: 0.82rem; padding-left: 38px; }
    .plp-description ol li::before { width: 26px; height: 26px; font-size: 0.72rem; }
    .plp-description details summary { font-size: 0.82rem; padding: 11px 12px; }
    .plp-description details p { font-size: 0.78rem; padding: 10px 12px; line-height: 1.6; }
    .plp-devices { grid-template-columns: repeat(2, 1fr); }
}

/* Plan Page Final Polish — No-Frame Full-Width */

.plan-card, .plp-card, 
.plan-page-wrapper .elementor-section,
.plan-page-wrapper .elementor-column,
.plan-page-wrapper .elementor-widget-wrap {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
}

.plan-card { padding: 24px 0 !important; }

.plan-description, .plp-description {
    background: transparent !important;
    padding: 0 !important;
}

/* Force everything in Plan Page to be edge-to-edge */
.plan-page-wrapper, .plan-page-wrapper .container, .plan-main, .plan-hero {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
}

.plan-hero { padding: 40px 24px !important; }
.plan-hero .container { padding: 0 !important; }

@media (max-width: 768px) {
    .plan-page-wrapper, .plan-page-wrapper .container { padding-left: 16px !important; padding-right: 16px !important; }
    .plan-body { grid-template-columns: 1fr; padding: 20px 16px; }
}


/* ================================================================
   SINGLE POST — Redesigned Clean Layout (spost-*)
   ================================================================ */
.spost-wrap { background: #ffffff; min-height: 100vh; }

.spost-container {
    max-width: 820px;
    margin: 0 auto;
    padding: 0 24px;
}

/* ---- Article Header ---- */
.spost-header {
    padding: 60px 0 40px;
}

.spost-cats { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.spost-cat {
    display: inline-block;
    background: #f0f4ff;
    color: #3b5bdb;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 5px 14px;
    border-radius: 20px;
    text-decoration: none;
    letter-spacing: 0.02em;
    transition: all 0.2s;
}
.spost-cat:hover { background: #dbe4ff; }

/* H1 Title */
.spost-title {
    font-size: clamp(1.75rem, 4.5vw, 2.5rem);
    font-weight: 800;
    line-height: 1.2;
    color: #0f172a;
    letter-spacing: -0.02em;
    margin-bottom: 20px;
    max-width: 760px;
}

/* Last updated badge */
.post-meta-updated {
    font-size: 0.85rem;
    color: #64748b;
    margin-bottom: 24px;
    padding: 8px 16px;
    background: #f8fafc;
    border-radius: 8px;
    display: inline-block;
    border: 1px solid #e2e8f0;
}
.post-meta-updated a {
    color: #3b5bdb;
    text-decoration: none;
    font-weight: 600;
}
.post-meta-updated a:hover { text-decoration: underline; }

/* Meta row */
.spost-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 16px 0;
    border-top: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
    margin-bottom: 0;
}
.spost-author {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
}
.spost-author__img {
    width: 36px; height: 36px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #e2e8f0;
}
.spost-author__name { font-weight: 600; color: #1e293b; font-size: 0.95rem; }
.spost-meta__sep { color: #cbd5e1; font-size: 0.9rem; }
.spost-meta__date { color: #64748b; font-size: 0.9rem; }
.spost-meta__read { display: flex; align-items: center; gap: 5px; color: #64748b; font-size: 0.9rem; }

/* ---- Featured Image ---- */
.spost-featured-img-wrap { padding: 32px 0 40px; }
.spost-featured-img-card {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
}
.spost-featured-img {
    width: 100%;
    height: auto;
    display: block;
}

/* ---- Body Layout ---- */
.spost-body { padding: 0 0 60px; }
.spost-article { max-width: 760px; margin: 0 auto; }

/* ---- Content Typography ---- */
.spost-content {
    font-size: 1.08rem;
    line-height: 1.75;
    color: #334155;
    background: transparent;
    border: none;
    padding: 0;
    box-shadow: none;
}

.spost-content > *:first-child { margin-top: 0; }

.spost-content h2 {
    font-size: 1.6rem;
    font-weight: 800;
    color: #0f172a;
    margin: 48px 0 16px;
    padding-bottom: 12px;
    border-bottom: 2px solid #e2e8f0;
    letter-spacing: -0.01em;
}
.spost-content h3 {
    font-size: 1.3rem;
    font-weight: 700;
    color: #1e293b;
    margin: 36px 0 12px;
    letter-spacing: -0.01em;
}
.spost-content h4 {
    font-size: 1.1rem;
    font-weight: 700;
    color: #334155;
    margin: 28px 0 10px;
}

.spost-content p { margin-bottom: 20px; }

.spost-content a {
    color: #3b5bdb;
    text-decoration: underline;
    text-decoration-color: #c7d2fe;
    text-underline-offset: 2px;
    transition: text-decoration-color 0.2s;
}
.spost-content a:hover { text-decoration-color: #3b5bdb; }

.spost-content ul, .spost-content ol { margin: 16px 0 20px; padding-left: 24px; }
.spost-content li { margin-bottom: 8px; line-height: 1.7; }

.spost-content blockquote {
    border-left: 4px solid #3b5bdb;
    padding: 16px 24px;
    margin: 24px 0;
    background: #f8fafc;
    border-radius: 0 8px 8px 0;
    font-style: italic;
    color: #475569;
}

.spost-content pre {
    background: #1e293b;
    color: #e2e8f0;
    padding: 20px;
    border-radius: 10px;
    overflow-x: auto;
    margin: 20px 0;
    font-size: 0.9rem;
}
.spost-content code {
    background: #f1f5f9;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 0.9em;
    color: #e11d48;
}
.spost-content pre code { background: none; color: inherit; padding: 0; }

.spost-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 24px 0;
    font-size: 0.95rem;
}
.spost-content th {
    background: #0f172a;
    color: #fff;
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
}
.spost-content td { padding: 12px 16px; border-bottom: 1px solid #e2e8f0; }
.spost-content tr:nth-child(even) td { background: #f8fafc; }

.spost-content img {
    max-width: 100%;
    height: auto;
    border-radius: 12px;
    margin: 20px 0;
}

/* AEO Answer block */
.aeo-answer {
    font-size: 1.1rem;
    line-height: 1.7;
    padding: 20px 24px;
    margin: 20px 0 28px;
    border-left: 4px solid #3b5bdb;
    background: linear-gradient(135deg, #f8fafc 0%, #eef2ff 100%);
    border-radius: 0 12px 12px 0;
}
.aeo-answer strong { color: #0f172a; }

/* Related Guides cards */
.spost-content h2 + ul {
    list-style: none;
    padding: 0;
}
.spost-content h2 + ul li {
    padding: 12px 16px;
    margin-bottom: 8px;
    background: #f8fafc;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    transition: all 0.2s;
}
.spost-content h2 + ul li:hover { background: #eef2ff; border-color: #c7d2fe; }
.spost-content h2 + ul li a {
    color: #1e293b;
    text-decoration: none;
    font-weight: 500;
    display: block;
}
.spost-content h2 + ul li a:hover { color: #3b5bdb; }

/* ---- Tags ---- */
.spost-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 40px 0 24px;
    padding-top: 24px;
    border-top: 1px solid #e2e8f0;
}
.spost-tag {
    display: inline-block;
    background: #f1f5f9;
    color: #475569;
    font-size: 0.85rem;
    font-weight: 500;
    padding: 6px 14px;
    border-radius: 20px;
    text-decoration: none;
    transition: all 0.2s;
}
.spost-tag:hover { background: #e2e8f0; color: #1e293b; }

/* ---- Share Bar ---- */
.spost-share-bar {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 24px 0;
    border-top: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
    margin-bottom: 32px;
    background: transparent;
}
.spost-share-bar__label { font-size: 0.9rem; color: #64748b; font-weight: 500; }
.spost-share-bar__icons { display: flex; gap: 10px; }
.spost-share-btn {
    width: 40px; height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all 0.2s;
}
.spost-share-btn--fb { background: #1877f2; color: #fff; }
.spost-share-btn--tw { background: #000; color: #fff; }
.spost-share-btn--wa { background: #25d366; color: #fff; }
.spost-share-btn:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.15); }

/* ---- Author Card ---- */
.spost-author-card {
    display: flex;
    gap: 20px;
    padding: 28px;
    background: linear-gradient(135deg, #f8fafc 0%, #eef2ff 100%);
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    margin-bottom: 32px;
}
.spost-author-card__img {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    border: 3px solid #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    flex-shrink: 0;
    object-fit: cover;
}
.spost-author-card__info { flex: 1; }
.spost-author-card__label {
    font-size: 0.8rem;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
}
.spost-author-card__name {
    display: block;
    font-size: 1.1rem;
    font-weight: 700;
    color: #0f172a;
    text-decoration: none;
    margin: 4px 0 8px;
}
.spost-author-card__name:hover { color: #3b5bdb; }
.spost-author-card__bio {
    font-size: 0.9rem;
    color: #475569;
    line-height: 1.6;
}

/* ---- Responsive ---- */
@media (max-width: 768px) {
    .spost-container { padding: 0 16px; }
    .spost-header { padding: 40px 0 28px; }
    .spost-title { font-size: 1.5rem; line-height: 1.25; }
    .spost-meta { gap: 8px; font-size: 0.85rem; }
    .spost-content { font-size: 1rem; }
    .spost-content h2 { font-size: 1.35rem; margin: 36px 0 14px; }
    .spost-content h3 { font-size: 1.15rem; }
    .spost-share-bar { flex-wrap: wrap; gap: 12px; }
    .spost-author-card { padding: 20px; gap: 14px; }
}
@media (max-width: 480px) {
    .spost-title { font-size: 1.3rem; }
    .spost-meta__sep { display: none; }
    .spost-meta { flex-direction: column; align-items: flex-start; gap: 6px; }
}
/* ================================================================
   SINGLE PAGE — No-Frame Clean Design (spage-*)
   ================================================================ */

.spage-wrap { background: transparent; min-height: 100vh; padding-bottom: 20px; }

.spage-container {
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Page header */
.spage-header {
    background: #fff;
    padding: 30px 20px 20px;
    margin-top: 60px;
}

.spage-title {
    font-size: clamp(1.4rem, 4vw, 2.2rem);
    font-weight: 900;
    color: #0f172a;
    letter-spacing: -0.6px;
    margin: 0;
    line-height: 1.2;
}

.spage-hero-img-wrap { padding: 0; background: #fff; }

.spage-hero-img-card {
    border-radius: 0;
    overflow: hidden;
}

.spage-hero-img {
    width: 100%;
    height: auto;
    max-height: 500px;
    object-fit: cover;
    display: block;
}

/* Content — NO FRAME, NO MARGINS */
.spage-body { padding-top: 0; }

.spage-content {
    background: transparent;
    border: none;
    padding: 0 !important;
    font-size: 1.05rem;
    line-height: 1.7;
    color: #334155;
    box-shadow: none;
}

@media (max-width: 768px) {
    .spage-title { font-size: 1.4rem; padding: 0 16px; }
}

/* --- REDESIGN 2026: FRAMED HEADINGS --- */
.section-title-pro.framed-heading {
    display: inline-block;
    background: #ffffff;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 20px;
    padding: 16px 40px;
    box-shadow: 
        0 15px 40px rgba(15, 23, 42, 0.04),
        0 1px 3px rgba(15, 23, 42, 0.02);
    margin-bottom: 35px;
    position: relative;
    max-width: 95%; /* Avoid hitting edges on mobile */
    z-index: 5;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    text-transform: capitalize;
}

.section-title-pro.framed-heading:hover {
    transform: translateY(-3px);
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.08);
}

/* Mobile Optimization for Framed Headings */
@media (max-width: 768px) {
    .section-title-pro.framed-heading {
        padding: 12px 24px;
        font-size: 1.5rem !important; /* Proper fit for mobile */
        border-radius: 16px;
        margin-bottom: 25px;
        width: auto;
        min-width: unset;
    }
    
    .section-subtitle-pro {
        font-size: 0.95rem !important;
        padding: 0 10px;
        margin-bottom: 40px;
    }
}

/* Cleanup previous framing styles if any */
.framed-section { padding: 80px 0; }
.framed-container { display: contents; } /* Effectively neutralize if accidentally used */
/* --- PRO CLEAN DESIGN: GLOBAL CONTRAST & TRANSPARENCY FIX (2026) --- */
.pro-clean-design .spage-wrap {
    background: transparent !important;
}

.pro-clean-design .elementor-section,
.pro-clean-design .elementor-column,
.pro-clean-design .elementor-column-wrap,
.pro-clean-design .elementor-widget-wrap {
    background-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

/* Force Text Readability (Dark on Light Site) */
.pro-clean-design p, 
.pro-clean-design span:not(.elementor-button-text), 
.pro-clean-design h1, 
.pro-clean-design h2, 
.pro-clean-design h3, 
.pro-clean-design h4, 
.pro-clean-design h5, 
.pro-clean-design h6,
.pro-clean-design .elementor-heading-title,
.pro-clean-design .elementor-text-editor,
.pro-clean-design .elementor-widget-container {
    color: #1a1a1a !important;
}

/* Exception: Keep buttons looking like buttons */
.pro-clean-design .elementor-button {
    background-color: #6a4cff !important;
    border-radius: 50px !important;
}

.pro-clean-design .elementor-button .elementor-button-text,
.pro-clean-design .elementor-button i {
    color: #ffffff !important;
}

/* Ensure links are visible */
.pro-clean-design a:not(.elementor-button) {
    color: #4f46e5 !important;
    text-decoration: underline !important;
}


/* ================================================================
   ABOUT US PAGE � Advanced Pro Design (about-page-pro)
   ================================================================ */

.about-page-pro {
    background: var(--bg-light);
    color: var(--text-dark);
    line-height: 1.7;
    font-family: var(--font-main);
    padding-top: 80px; /* Offset for fixed header */
}

.about-container {
    max-width: 1100px;
    margin: 0 auto;
    padding: 60px 24px;
}

/* Hero Section */
.about-hero {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
    color: #ffffff;
    padding: 100px 24px;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.about-hero::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(99, 102, 241, 0.1) 0%, transparent 70%);
    animation: rotateBg 20s linear infinite;
}

@keyframes rotateBg {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.about-hero-title {
    font-size: clamp(2.5rem, 8vw, 4rem);
    font-weight: 900;
    margin-bottom: 10px;
    position: relative;
    z-index: 1;
}

.about-hero-subtitle {
    font-size: 1.2rem;
    opacity: 0.9;
    letter-spacing: 2px;
    text-transform: uppercase;
    position: relative;
    z-index: 1;
}

/* Sections */
.about-section-title {
    font-size: clamp(1.8rem, 5vw, 2.5rem);
    margin-bottom: 30px;
    position: relative;
    display: inline-block;
}

.about-section-title::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 0;
    width: 60px;
    height: 4px;
    background: var(--primary-color);
    border-radius: 2px;
}

.about-section-title.centered::after {
    left: 50%;
    transform: translateX(-50%);
}

.centered { text-align: center; display: block; }
.centered-text { text-align: center; max-width: 800px; margin: 20px auto; }

/* Intro Card */
.intro-card {
    background: #ffffff;
    padding: 50px;
    border-radius: 24px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.05);
    margin-top: -80px;
    position: relative;
    z-index: 10;
    border: 1px solid rgba(0,0,0,0.05);
}

.about-lead {
    font-size: 1.25rem;
    margin-bottom: 20px;
}

/* Stats */
.about-stats-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.about-stat-item {
    background: #f8fafc;
    padding: 30px;
    border-radius: 20px;
    text-align: center;
    border: 1px solid rgba(0,0,0,0.03);
    transition: transform 0.3s ease;
}

.about-stat-item:hover {
    transform: translateY(-5px);
}

.about-stat-num {
    display: block;
    font-size: 2rem;
    font-weight: 900;
    color: var(--primary-color);
}

.about-stat-label {
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--text-muted);
}

/* Offer Grid */
.about-offer-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    margin-top: 50px;
}

.about-offer-item {
    background: #ffffff;
    padding: 40px;
    border-radius: 24px;
    border: 1px solid rgba(0,0,0,0.05);
    transition: all 0.3s ease;
}

.about-offer-item:hover {
    box-shadow: 0 15px 30px rgba(0,0,0,0.08);
    border-color: var(--primary-color);
}

.about-offer-icon {
    font-size: 3rem;
    margin-bottom: 20px;
}

.about-offer-item h3 {
    margin-bottom: 15px;
}

/* Tech Section */
.about-tech {
    background: #0f172a;
    padding: 100px 0;
}

.tech-box {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.white { color: #ffffff !important; }
.white-faded { color: rgba(255,255,255,0.7) !important; margin-bottom: 30px; }

.tech-list {
    list-style: none;
    padding: 0;
    margin: 40px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
}

.tech-list li {
    background: rgba(255,255,255,0.05);
    padding: 15px 25px;
    border-radius: 50px;
    color: #ffffff;
    font-weight: 600;
}

.tech-list li span {
    color: #10b981;
    margin-right: 10px;
}

/* Mission cards */
.mission-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}

.mission-card {
    background: #ffffff;
    padding: 50px;
    border-radius: 30px;
    border: 1px solid rgba(0,0,0,0.05);
}

.vision-accent {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
    color: #ffffff;
}

.vision-accent h3 { color: #ffffff; }

/* Why grid */
.why-list {
    list-style: none;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
}

.why-list li {
    background: #f1f5f9;
    padding: 15px 25px;
    border-radius: 12px;
    font-weight: 600;
}

.notice-box {
    margin-top: 50px;
    padding: 30px;
    background: #fffbeb;
    border-left: 5px solid #f59e0b;
    border-radius: 0 15px 15px 0;
    font-size: 0.95rem;
}

/* CTA */
.about-cta {
    background: linear-gradient(135deg, #1e1b4b 0%, #312e81 100%);
    color: #ffffff;
    text-align: center;
    padding: 100px 24px;
    margin: 60px 24px;
    border-radius: 40px;
}

.about-cta h2 { color: #ffffff; font-size: 2.5rem; margin-bottom: 20px; }

.about-btn {
    background: #ffffff !important;
    color: #1e1b4b !important;
    padding: 18px 45px !important;
    font-size: 1.1rem !important;
    margin-top: 40px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.2) !important;
}

/* Device list */
.device-list {
    display: flex;
    justify-content: center;
    gap: 30px;
    flex-wrap: wrap;
    margin-bottom: 40px;
}

.device-item {
    font-size: 1.2rem;
    font-weight: 700;
    padding: 15px 30px;
    background: #ffffff;
    border: 1px solid rgba(0,0,0,0.1);
    border-radius: 15px;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .about-row { flex-direction: column; }
    .mission-grid { grid-template-columns: 1fr; }
    .why-list { grid-template-columns: 1fr; }
    .intro-card { padding: 30px 20px; }
    .about-who .about-col { margin-bottom: 40px; }
}



/* ================================================================
   ABOUT US PAGE — Advanced Pro Design (about-page-pro)
   ================================================================ */

.about-page-pro {
    background: transparent;
    color: #0f172a;
    line-height: 1.7;
    font-family: 'Inter', sans-serif;
    margin-top: 0;
    padding-top: 0;
    overflow-x: hidden;
}

.about-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 24px;
}

.about-hero {
    background: #090a0f;
    color: #ffffff !important;
    padding: clamp(100px, 12vh, 140px) 24px clamp(40px, 6vh, 60px);
    text-align: center;
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

.hero-container {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.about-hero-title {
    font-size: clamp(2rem, 6vw, 3.5rem);
    font-weight: 900;
    margin: 0 0 10px;
    color: #ffffff !important;
    text-transform: uppercase;
    letter-spacing: -1px;
}

.about-hero-subtitle {
    font-size: clamp(0.85rem, 2.5vw, 1rem);
    opacity: 0.7;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #ffffff !important;
}

.about-section-title {
    font-size: clamp(1.8rem, 5vw, 2.5rem);
    margin: 0 0 30px;
    font-weight: 800;
}

.centered { text-align: center; }

.intro-card {
    background: #ffffff;
    padding: clamp(30px, 5vw, 60px);
    border-radius: 30px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.1);
    margin-top: -40px;
    position: relative;
    z-index: 10;
    border: 1px solid #f1f5f9;
}

.about-lead {
    font-size: clamp(1.1rem, 4vw, 1.35rem);
    color: #1e293b;
    margin-bottom: 25px;
}

.about-row {
    display: flex;
    gap: 60px;
    align-items: center;
}

.about-col {
    flex: 1;
}

.about-stats-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.about-stat-item {
    background: #f8fafc;
    padding: 30px 20px;
    border-radius: 20px;
    text-align: center;
    border: 1px solid #f1f5f9;
}

.about-stat-num {
    display: block;
    font-size: 2.2rem;
    font-weight: 900;
    color: #4f46e5;
}

.about-stat-label {
    font-size: 0.85rem;
    text-transform: uppercase;
    font-weight: 700;
    color: #64748b;
}

.about-offer-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 30px;
    margin-top: 40px;
}

.about-offer-item {
    background: #ffffff;
    padding: 40px;
    border-radius: 24px;
    border: 1px solid #f1f5f9;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
    transition: transform 0.3s ease;
}

.about-offer-item:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
}

.about-offer-icon {
    font-size: 2.8rem;
    margin-bottom: 20px;
}

.about-tech {
    background: #090a0f;
    padding: 100px 24px;
    color: #ffffff;
    margin: 40px 0;
}

.tech-box {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
}

.white-faded { color: #94a3b8; margin-bottom: 30px; }

.tech-list {
    list-style: none;
    padding: 0;
    margin: 40px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
}

.tech-list li {
    background: rgba(255,255,255,0.08);
    padding: 12px 24px;
    border-radius: 50px;
    font-weight: 600;
}

.mission-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}

.mission-card {
    background: #f8fafc;
    padding: 40px;
    border-radius: 30px;
    border: 1px solid #f1f5f9;
}

.vision-accent {
    background: #4f46e5;
    color: #ffffff;
}

.vision-accent h3 { color: #ffffff; }

.why-list {
    list-style: none;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 15px;
}

.why-list li {
    background: #f1f5f9;
    padding: 12px 20px;
    border-radius: 12px;
    font-weight: 600;
}

.notice-box {
    margin-top: 40px;
    padding: 25px;
    background: #fffbeb;
    border-left: 4px solid #f59e0b;
    border-radius: 0 15px 15px 0;
    font-size: 0.9rem;
}

.about-cta {
    background: #4f46e5;
    color: #ffffff;
    text-align: center;
    padding: 80px 24px;
    border-radius: 40px;
    margin-top: 60px;
}

.about-btn {
    background: #ffffff !important;
    color: #4f46e5 !important;
    padding: 16px 40px !important;
    font-weight: 800;
    border-radius: 50px;
    display: inline-block;
    margin-top: 30px;
    box-shadow: 0 10px 15px rgba(0,0,0,0.1);
}

.device-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    margin-bottom: 40px;
}

.device-item {
    background: #f1f5f9;
    padding: 12px 24px;
    border-radius: 15px;
    font-weight: 700;
}

@media (max-width: 991px) {
    .about-row { flex-direction: column; text-align: center; gap: 40px; }
    .about-stats-grid { gap: 15px; }
}

@media (max-width: 640px) {
    .about-container { padding: 40px 20px; }
    .intro-card { margin-top: -40px; }
    .about-hero { padding: 100px 20px 40px; }
    .about-stats-grid { grid-template-columns: 1fr; }
    .about-stat-item { padding: 20px; }
}

/* ================================================================
   DOWNLOAD PAGE — Advanced Pro Design (download-page-pro)
   ================================================================ */

.download-page-pro {
    background: #ffffff;
    color: #0f172a;
    line-height: 1.7;
    font-family: 'Inter', sans-serif;
}

.download-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 24px;
}

/* Hero Section */
.download-hero {
    background: #090a0f;
    color: #ffffff !important;
    padding: clamp(100px, 12vh, 140px) 24px clamp(40px, 6vh, 60px);
    text-align: center;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

.download-hero-title {
    font-size: clamp(2.2rem, 8vw, 4rem);
    font-weight: 900;
    margin: 0 0 10px;
    color: #ffffff !important;
    text-transform: uppercase;
}

.download-hero-subtitle {
    font-size: clamp(0.9rem, 2.5vw, 1.2rem);
    opacity: 0.7;
    letter-spacing: 2px;
}

/* Download Grid */
.download-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 30px;
    margin-top: -40px;
    position: relative;
    z-index: 10;
}

.download-card {
    background: #ffffff;
    padding: 40px;
    border-radius: 30px;
    border: 1px solid #f1f5f9;
    box-shadow: 0 20px 40px rgba(0,0,0,0.05);
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.card-icon {
    font-size: 3.5rem;
    margin-bottom: 20px;
}

.download-card h3 {
    font-size: 1.5rem;
    margin-bottom: 15px;
    color: #1e293b;
}

.download-card p {
    color: #64748b;
    margin-bottom: 25px;
}

.card-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.download-btn {
    padding: 14px 24px !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    font-size: 0.95rem !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    display: block !important;
}

/* Brand Button Colors */
.apk-btn { background: #34d399 !important; color: #ffffff !important; }
.play-btn { background: #000000 !important; color: #ffffff !important; }
.app-store-btn { background: #007aff !important; color: #ffffff !important; }
.win-btn { background: #00a4ef !important; color: #ffffff !important; }
.mac-btn { background: #333333 !important; color: #ffffff !important; }
.fire-btn { background: #ff9900 !important; color: #ffffff !important; }

.download-btn:hover {
    filter: brightness(1.1);
    transform: translateY(-3px);
    box-shadow: 0 10px 15px rgba(0,0,0,0.1);
}

/* Features Section */
.download-features {
    background: #f8fafc;
    padding: 80px 0;
    margin-top: 60px;
}

.features-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 40px;
    text-align: center;
    margin-top: 40px;
}

.feature-item h4 {
    font-size: 1.25rem;
    margin-bottom: 15px;
    color: #0f172a;
}

/* Compatibility */
.download-compat {
    padding: 60px 0;
}

.pro-tag {
    text-transform: uppercase;
    font-weight: 800;
    color: #4f46e5;
    letter-spacing: 2px;
    margin-bottom: 20px;
}

.compat-icons {
    font-weight: 600;
    color: #94a3b8;
}

.small-info {
    font-size: 0.85rem;
    color: #94a3b8;
    margin-bottom: 15px;
}

/* Responsive */
@media (max-width: 640px) {
    .download-grid { margin-top: 20px; }
    .download-card { padding: 30px 20px; }
}


/* ================================================================
   INSTALLATION PAGE — Advanced Pro Design (install-page-pro)
   ================================================================ */

.install-page-pro {
    background: #f8fafc;
    color: #0f172a;
    line-height: 1.6;
    font-family: 'Inter', sans-serif;
}

.install-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 24px;
}

/* Hero Section */
.install-hero {
    background: #090a0f;
    color: #ffffff !important;
    padding: clamp(100px, 12vh, 140px) 24px clamp(40px, 6vh, 60px);
    text-align: center;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

.install-hero-title {
    font-size: clamp(2.2rem, 8vw, 4rem);
    font-weight: 900;
    margin: 0 0 10px;
    color: #ffffff !important;
    text-transform: uppercase;
}

.install-hero-subtitle {
    font-size: clamp(0.95rem, 2.5vw, 1.25rem);
    opacity: 0.7;
    margin-bottom: 30px;
}

.support-pill {
    background: #25d366;
    color: #ffffff !important;
    padding: 12px 24px;
    border-radius: 50px;
    font-weight: 700;
    text-decoration: none;
    display: inline-block;
    box-shadow: 0 10px 15px rgba(37, 211, 102, 0.2);
    transition: all 0.3s ease;
}

/* Intro Card */
.intro-card-pro {
    background: #ffffff;
    padding: 40px;
    border-radius: 30px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.05);
    margin-top: -60px;
    position: relative;
    z-index: 10;
    border: 1px solid #f1f5f9;
}

.onboarding-steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin-top: 25px;
}

.step-item {
    background: #f8fafc;
    padding: 20px;
    border-radius: 15px;
    border: 1px solid #f1f5f9;
    display: flex;
    align-items: center;
    gap: 15px;
}

.step-item span {
    background: #4f46e5;
    color: #ffffff;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
}

/* Grid & Cards */
.install-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 30px;
    margin-top: 40px;
}

.install-card {
    background: #ffffff;
    border-radius: 24px;
    border: 1px solid #f1f5f9;
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.card-header-pro {
    padding: 30px;
    background: #f8fafc;
    border-bottom: 1px solid #f1f5f9;
}

.app-tag {
    font-size: 0.75rem;
    font-weight: 800;
    text-transform: uppercase;
    padding: 4px 12px;
    border-radius: 50px;
    background: #4f46e5;
    color: #ffffff;
    margin-bottom: 10px;
    display: inline-block;
}

.app-tag.secondary { background: #64748b; }
.app-tag.advanced { background: #0f172a; }
.app-tag.tv { background: #333333; }
.app-tag.pc { background: #00a4ef; }
.app-tag.ios { background: #007aff; }

.card-body-pro {
    padding: 30px;
}

.setup-group {
    margin-bottom: 25px;
}

.setup-group h5 {
    color: #1e293b;
    font-weight: 800;
    margin-bottom: 10px;
}

.card-body-pro ol {
    padding-left: 20px;
    color: #475569;
}

.card-body-pro ol li {
    margin-bottom: 8px;
}

/* CTA */
.install-cta {
    background: #ffffff;
    padding: 80px 0;
    border-top: 1px solid #f1f5f9;
}

.install-btn {
    background: #4f46e5 !important;
    color: #ffffff !important;
    padding: 16px 40px !important;
    border-radius: 50px !important;
    font-weight: 800 !important;
    margin-top: 30px !important;
    text-decoration: none !important;
}

@media (max-width: 768px) {
    .install-grid { grid-template-columns: 1fr; }
    .intro-card-pro { padding: 30px 20px; }
    .install-hero { padding: 100px 20px 40px; }
}


/* ================================================================
   SUPPORT PAGE — Advanced Pro Design (support-page-pro)
   ================================================================ */

.support-page-pro {
    background: #f8fafc;
    color: #0f172a;
    line-height: 1.6;
    font-family: 'Inter', sans-serif;
}

.support-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 24px;
}

/* Hero Section */
.support-hero {
    background: #090a0f;
    color: #ffffff !important;
    padding: clamp(100px, 12vh, 140px) 24px clamp(40px, 6vh, 60px);
    text-align: center;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

.support-hero-title {
    font-size: clamp(2.2rem, 8vw, 4rem);
    font-weight: 900;
    margin: 0 0 10px;
    color: #ffffff !important;
    text-transform: uppercase;
}

.support-hero-subtitle {
    font-size: clamp(1rem, 2.5vw, 1.4rem);
    opacity: 0.8;
    margin-bottom: 25px;
}

.status-indicator {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(255,255,255,0.05);
    padding: 8px 20px;
    border-radius: 50px;
    border: 1px solid rgba(255,255,255,0.1);
}

.status-dot {
    width: 10px;
    height: 10px;
    background: #25d366;
    border-radius: 50%;
    box-shadow: 0 0 0 rgba(37, 211, 102, 0.4);
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7); }
    70% { box-shadow: 0 0 0 10px rgba(37, 211, 102, 0); }
    100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
}

.status-text {
    font-size: 0.85rem;
    font-weight: 700;
    color: #e2e8f0;
}

/* Support Grid */
.support-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 30px;
    margin-top: -60px;
    position: relative;
    z-index: 10;
}

.support-card {
    background: #ffffff;
    padding: 40px;
    border-radius: 30px;
    border: 1px solid #f1f5f9;
    box-shadow: 0 20px 40px rgba(0,0,0,0.05);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.support-card.primary {
    border: 2px solid #25D366;
}

.card-icon-pro {
    font-size: 3.5rem;
    margin-bottom: 20px;
}

.support-card h3 {
    font-size: 1.5rem;
    color: #1e293b;
    margin-bottom: 15px;
    font-weight: 800;
}

.support-card p {
    color: #64748b;
    margin-bottom: 25px;
}

.card-list {
    list-style: none;
    padding: 0;
    margin-bottom: 30px;
}

.card-list li {
    padding: 6px 0;
    color: #475569;
    font-size: 0.95rem;
    border-bottom: 1px solid #f1f5f9;
}

.support-btn {
    padding: 16px 24px !important;
    border-radius: 12px !important;
    font-weight: 800 !important;
    text-align: center !important;
    text-decoration: none !important;
}

.whatsapp-btn { background: #25D366 !important; color: #ffffff !important; }
.secondary-btn { background: #f1f5f9 !important; color: #1e293b !important; }

/* Checklist & Common Issues */
.support-info-section {
    padding: 80px 0;
}

.info-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 40px;
}

.checklist-box {
    background: #f8fafc;
    padding: 40px;
    border-radius: 24px;
    border: 1px solid #f1f5f9;
}

.checklist-box h4 { font-weight: 800; margin-bottom: 20px; font-size: 1.35rem; }

.check-list {
    list-style: none;
    padding: 0;
}

.check-list li {
    padding: 12px 0;
    color: #1e293b;
    border-bottom: 1px solid #e2e8f0;
    display: flex;
    gap: 15px;
}

.check-list li::before {
    content: '✅';
}

.issue-item {
    margin-bottom: 25px;
}

.issue-item strong {
    display: block;
    font-size: 1.1rem;
    color: #0f172a;
    margin-bottom: 5px;
}

.common-issues h4 { font-weight: 800; margin-bottom: 30px; font-size: 1.35rem; }

/* Support Footer */
.support-footer-info {
    padding: 60px 0;
    border-top: 1px solid #f1f5f9;
}

.hours-box {
    margin-bottom: 20px;
}

.small-text {
    font-size: 0.85rem;
    color: #94a3b8;
}

@media (max-width: 768px) {
    .support-grid { margin-top: 20px; grid-template-columns: 1fr; }
    .support-card { padding: 30px 20px; }
    .support-hero { padding: 100px 20px 40px; }
}




/* ================================================================
   FAQ HUB PAGE — Advanced Pro LIGHT Design (faq-page-pro)
   ================================================================ */

.faq-page-pro {
    background: #f8fafc;
    color: #0f172a;
    line-height: 1.6;
    font-family: 'Inter', sans-serif;
}

.faq-container {
    max-width: 900px;
    margin: 0 auto;
    padding: 60px 24px;
}

/* Hero Section */
.faq-hero {
    background: #ffffff;
    color: #0f172a !important;
    padding: clamp(100px, 12vh, 140px) 24px clamp(40px, 6vh, 60px);
    text-align: center;
    border-bottom: 1px solid #e2e8f0;
}

.faq-hero-title {
    font-size: clamp(2.2rem, 8vw, 4rem);
    font-weight: 900;
    margin: 0 0 10px;
    color: #0f172a !important;
    text-transform: uppercase;
}

.faq-hero-subtitle {
    font-size: clamp(1rem, 2.5vw, 1.4rem);
    color: #64748b;
    margin-bottom: 25px;
}

/* FAQ Hub Section */
.faq-hub-section {
    padding-bottom: 100px;
}

.faq-category-group {
    margin-bottom: 60px;
}

.category-title {
    font-size: 1.35rem;
    font-weight: 800;
    margin-bottom: 25px;
    color: #4f46e5;
    text-transform: uppercase;
    letter-spacing: 1px;
    border-bottom: 2px solid #e2e8f0;
    padding-bottom: 10px;
}

/* Zero-JS Accordion Logic */
.faq-accordion {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.faq-item {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}

.faq-item:hover {
    border-color: #cbd5e1;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.08);
}

.faq-toggle {
    display: none;
}

.faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 22px 30px;
    cursor: pointer;
    font-weight: 700;
    font-size: 1.1rem;
    color: #1e293b !important;
    user-select: none;
    transition: background 0.3s ease;
}

.faq-icon {
    position: relative;
    width: 20px;
    height: 20px;
}

.faq-icon::before,
.faq-icon::after {
    content: '';
    position: absolute;
    background: #4f46e5;
    transition: transform 0.3s ease;
}

.faq-icon::before {
    width: 2px;
    height: 20px;
    left: 9px;
    top: 0;
}

.faq-icon::after {
    width: 20px;
    height: 2px;
    left: 0;
    top: 9px;
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s cubic-bezier(0, 1, 0, 1);
    background: #fdfdfd;
}

.faq-answer p {
    padding: 0 30px 25px;
    color: #475569;
    line-height: 1.7;
    margin: 0;
}

/* Logic for opening the accordion */
.faq-toggle:checked ~ .faq-question .faq-icon::before {
    transform: rotate(90deg);
}

.faq-toggle:checked ~ .faq-question .faq-icon::after {
    transform: rotate(180deg);
}

.faq-toggle:checked ~ .faq-answer {
    max-height: 1000px;
    transition: max-height 0.4s ease-in;
}

/* Call to Action */
.faq-cta {
    background: #ffffff;
    padding: 100px 0;
    text-align: center;
    border-top: 1px solid #e2e8f0;
}

.faq-btn {
    background: #4f46e5 !important;
    color: #ffffff !important;
    padding: 16px 40px !important;
    border-radius: 50px !important;
    font-weight: 800 !important;
    margin-top: 30px !important;
    text-decoration: none !important;
    display: inline-block !important;
    box-shadow: 0 10px 20px rgba(79, 70, 229, 0.2);
}

@media (max-width: 768px) {
    .faq-container { padding: 40px 15px; }
    .faq-hero { padding: 100px 15px 40px; }
    .faq-question { padding: 18px 20px; font-size: 1rem; }
    .faq-answer p { padding: 0 20px 20px; }
}


/* ================================================================
   CONTACT US PAGE — Advanced Pro LIGHT Design (contact-page-pro)
   ================================================================ */

.contact-page-pro {
    background: #f8fafc;
    color: #0f172a;
    line-height: 1.6;
    font-family: 'Inter', sans-serif;
}

.contact-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 60px 24px;
}

/* Hero Section */
.contact-hero {
    background: #ffffff;
    color: #0f172a !important;
    padding: clamp(100px, 12vh, 140px) 24px clamp(40px, 6vh, 60px);
    text-align: center;
    border-bottom: 1px solid #e2e8f0;
}

.contact-hero-title {
    font-size: clamp(2.2rem, 8vw, 4rem);
    font-weight: 900;
    margin: 0 0 10px;
    color: #0f172a !important;
    text-transform: uppercase;
}

.contact-hero-subtitle {
    font-size: clamp(1rem, 2.5vw, 1.4rem);
    color: #64748b;
}

/* Intro Text */
.contact-intro {
    text-align: center;
    max-width: 800px;
    margin: 40px auto;
    font-size: 1.15rem;
    color: #475569;
}

/* WhatsApp Card */
.contact-whatsapp-card {
    background: #ffffff;
    border-radius: 30px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 20px 40px rgba(0,0,0,0.05);
    padding: 40px;
    max-width: 600px;
    margin: 0 auto 60px;
    text-align: center;
}

.card-header {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
}

.pulse-status {
    width: 12px;
    height: 12px;
    background: #25d366;
    border-radius: 50%;
    animation: statusPulse 2s infinite;
}

@keyframes statusPulse {
    0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7); }
    70% { box-shadow: 0 0 0 10px rgba(37, 211, 102, 0); }
    100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
}

.contact-whatsapp-btn {
    background: #25D366 !important;
    color: #ffffff !important;
    padding: 18px 40px !important;
    border-radius: 50px !important;
    font-weight: 800 !important;
    font-size: 1.25rem !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 20px 0 !important;
    box-shadow: 0 10px 20px rgba(37, 211, 102, 0.2) !important;
}

/* Info Grid */
.contact-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    margin-bottom: 60px;
}

.info-card {
    background: #ffffff;
    padding: 30px;
    border-radius: 24px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05);
}

.info-card h4 {
    font-weight: 800;
    margin-bottom: 15px;
    color: #1e293b;
    border-bottom: 2px solid #e2e8f0;
    padding-bottom: 10px;
}

.info-list {
    list-style: none;
    padding: 0;
}

.info-list li {
    padding: 10px 0;
    color: #475569;
    border-bottom: 1px solid #f1f5f9;
}

/* Notice Box */
.contact-notice-box {
    background: #f1f5f9;
    padding: 30px;
    border-radius: 20px;
    border-left: 6px solid #4f46e5;
    margin-bottom: 80px;
}

.contact-notice-box h4 {
    color: #1e293b;
    margin-bottom: 10px;
}

/* Footer CTA */
.contact-footer-cta {
    padding: 100px 0;
    border-top: 1px solid #e2e8f0;
}

.support-pill-btn {
    background: #4f46e5 !important;
    color: #ffffff !important;
    padding: 14px 30px !important;
    border-radius: 50px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    display: inline-block !important;
    margin-top: 25px !important;
}

@media (max-width: 768px) {
    .contact-container { padding: 40px 15px; }
    .contact-hero { padding: 100px 15px 40px; }
    .contact-whatsapp-card { padding: 30px 20px; }
}



   ================================================================ */

.policy-page-pro {
    background: #ffffff;
    color: #1e293b;
    line-height: 1.8;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    padding-bottom: 100px;
}

.policy-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 24px;
}

/* Hero Section */
.policy-hero {
    background: #f8fafc;
    padding: clamp(100px, 12vh, 140px) 24px clamp(40px, 6vh, 60px);
    text-align: center;
    border-bottom: 1px solid #e2e8f0;
    margin-bottom: 60px;
}

.policy-hero-title {
    font-size: clamp(2.5rem, 8vw, 4.5rem);
    font-weight: 900;
    margin: 0 0 15px;
    color: #0f172a !important;
    text-transform: uppercase;
}

.last-updated-badge {
    display: inline-block;
    padding: 6px 16px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 50px;
    font-size: 0.9rem;
    font-weight: 700;
    color: #64748b;
}

/* Policy Content */
.policy-intro {
    font-size: 1.25rem;
    color: #334155;
    margin-bottom: 50px;
    border-bottom: 1px solid #f1f5f9;
    padding-bottom: 30px;
}

.policy-block {
    margin-bottom: 45px;
}

.policy-block h2 {
    font-size: 1.75rem;
    font-weight: 900;
    color: #0f172a !important;
    margin: 0 0 20px;
    padding-bottom: 10px;
    border-bottom: 3px solid #4f46e5;
    display: inline-block;
}

.policy-block h3 {
    font-size: 1.25rem;
    font-weight: 800;
    color: #1e293b !important;
    margin: 30px 0 15px;
}

.policy-list {
    margin: 20px 0;
    padding-left: 20px;
}

.policy-list li {
    margin-bottom: 12px;
    position: relative;
    padding-left: 10px;
}

.policy-list li::marker {
    color: #4f46e5;
    font-weight: 800;
}

.highlight-block {
    background: #f8fafc;
    padding: 30px;
    border-radius: 20px;
    border: 1px solid #e2e8f0;
}

@media (max-width: 768px) {
    .policy-container { padding: 0 20px; }
    .policy-hero { padding: 100px 20px 40px; }
    .policy-block h2 { font-size: 1.5rem; }
}


/* ================================================================
   PRIVACY POLICY PAGE — Premium Pro Design (pp-page-pro)
   ================================================================ */

.pp-page-pro {
    background: #f8fafc;
    color: #1e293b;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    padding-bottom: 120px;
}

.pp-container {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 24px;
}

/* Hero */
.pp-hero {
    background: #ffffff;
    padding: clamp(100px, 12vh, 140px) 24px clamp(50px, 6vh, 70px);
    text-align: center;
    border-bottom: 1px solid #e2e8f0;
}

.pp-hero-badge {
    display: inline-block;
    padding: 6px 18px;
    background: #ede9fe;
    color: #4f46e5;
    border-radius: 50px;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 20px;
}

.pp-hero-title {
    font-size: clamp(2.5rem, 8vw, 5rem);
    font-weight: 900;
    color: #0f172a !important;
    text-transform: uppercase;
    margin: 0 0 15px;
}

.pp-hero-subtitle {
    font-size: 1rem;
    color: #94a3b8;
    font-weight: 500;
}

/* Intro Card */
.pp-intro-section {
    padding: 50px 24px 0;
}

.pp-intro-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    padding: 30px 40px;
    font-size: 1.1rem;
    color: #475569;
    line-height: 1.8;
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.04);
}

/* Grid */
.pp-sections {
    padding: 50px 24px 0;
}

.pp-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

/* Cards */
.pp-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 24px;
    padding: 35px;
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.04);
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.pp-card:hover {
    box-shadow: 0 10px 25px rgba(0,0,0,0.07);
    border-color: #c7d2fe;
}

.pp-card--wide {
    grid-column: 1 / -1;
}

.pp-card--highlight {
    background: #4f46e5;
    border-color: #4f46e5;
    color: #ffffff;
}

.pp-card--highlight .pp-card__title,
.pp-card--highlight .pp-card__text {
    color: #ffffff !important;
}

.pp-card--highlight .pp-card__num {
    background: rgba(255,255,255,0.15);
    color: #ffffff;
}

.pp-card__num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: #f1f5f9;
    color: #4f46e5;
    border-radius: 12px;
    font-size: 0.85rem;
    font-weight: 900;
    margin-bottom: 18px;
}

.pp-card__title {
    font-size: 1.3rem;
    font-weight: 800;
    color: #0f172a !important;
    margin: 0 0 15px;
}

.pp-card__text {
    color: #475569;
    line-height: 1.75;
    margin-bottom: 15px;
}

/* Lists */
.pp-list {
    list-style: none;
    padding: 0;
    margin: 15px 0 0;
}

.pp-list li {
    padding: 10px 0 10px 20px;
    position: relative;
    color: #475569;
    border-bottom: 1px solid #f1f5f9;
    line-height: 1.6;
}

.pp-list li::before {
    content: '→';
    position: absolute;
    left: 0;
    color: #4f46e5;
    font-weight: 800;
}

.pp-list--tags li::before { content: ''; }
.pp-list--tags li { padding-left: 0; }

/* Sub Grid (for Section 3) */
.pp-sub-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin-top: 20px;
}

.pp-sub-block h3 {
    font-size: 1rem;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 12px;
}

/* Rights Grid */
.pp-rights-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
    margin-top: 20px;
}

.pp-right-item {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 14px 18px;
    font-size: 0.95rem;
    color: #334155;
    font-weight: 600;
}

/* Contact Button */
.pp-contact-btn {
    display: inline-block;
    margin-top: 20px;
    padding: 14px 30px;
    background: rgba(255,255,255,0.2);
    color: #ffffff !important;
    border: 2px solid rgba(255,255,255,0.4);
    border-radius: 50px;
    font-weight: 800;
    text-decoration: none !important;
}

.pp-contact-btn:hover {
    background: rgba(255,255,255,0.3);
}

@media (max-width: 768px) {
    .pp-grid { grid-template-columns: 1fr; }
    .pp-card--wide { grid-column: 1; }
    .pp-sub-grid { grid-template-columns: 1fr; }
    .pp-rights-grid { grid-template-columns: 1fr; }
    .pp-container { padding: 0 16px; }
    .pp-intro-card { padding: 24px 20px; }
    .pp-card { padding: 25px 20px; }
    .pp-hero { padding: 100px 20px 40px; }
}


/* Payment icon fix — Font Awesome brand icons in footer */
.payment-badges-pro .pm-icon {
    font-size: 2rem;
    color: rgba(255,255,255,0.7);
    transition: color 0.2s ease, transform 0.2s ease;
    display: inline-block;
    line-height: 1;
}
.payment-badges-pro .pm-icon:hover {
    color: #ffffff;
    transform: scale(1.1);
}
.fab.fa-cc-visa.pm-icon         { color: #1a1f71; background:#fff; border-radius:6px; padding:3px 6px; font-size:1.6rem; }
.fab.fa-cc-mastercard.pm-icon   { color: #eb001b; font-size:1.9rem; }
.fab.fa-cc-paypal.pm-icon       { color: #003087; font-size:1.9rem; }
.fab.fa-bitcoin.pm-icon         { color: #f7931a; font-size:1.9rem; }


/* Premium Header — Centered Logo Scroll Animation */
.site-custom-header {
    transition: padding 0.4s cubic-bezier(0.16, 1, 0.3, 1), background 0.4s ease, box-shadow 0.4s ease !important;
}

.site-custom-header .logo img {
    transition: height 0.4s cubic-bezier(0.16, 1, 0.3, 1), transform 0.4s ease !important;
}

.site-custom-header .header-nav,
.site-custom-header .header-action,
.site-custom-header .mobile-menu-toggle {
    transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s !important;
}

.site-custom-header.scrolled {
    padding: 0.5rem 5.5% !important;
    justify-content: center !important;
    background-color: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(12px) !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.08) !important;
}

/* Hide side elements on scroll */
.site-custom-header.scrolled .header-nav,
.site-custom-header.scrolled .header-action,
.site-custom-header.scrolled .mobile-menu-toggle {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(-10px);
    width: 0; /* Help collapse the space */
    margin: 0;
    padding: 0;
    overflow: hidden;
}

/* Shrink logo on scroll */
.site-custom-header.scrolled .logo img {
    height: 30px !important;
}

/* Ensure centering is perfect even with width:0 side elements */
.site-custom-header.scrolled .logo {
    margin: 0 auto !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

@media (max-width: 991px) {
    /* On mobile, keep the burger menu accessible but maybe still shrink slightly */
    .site-custom-header.scrolled .mobile-menu-toggle {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        width: auto;
        transform: none;
    }
    
    .site-custom-header.scrolled {
        justify-content: space-between !important;
    }
}








/* ---- Integrated Mobile Menu V4 (Header-Synced Slide Down) ---- */
@media (max-width: 991px) {
    .site-custom-header {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        padding: 10px 15px !important;
        height: 70px !important;
    }

    .site-custom-header .mobile-menu-toggle {
        display: flex !important;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 40px;
        height: 40px;
        background: #f1f5f9 !important; /* Extremely subtle gray */
        border-radius: 8px;
        border: none;
        cursor: pointer;
        position: relative !important; /* Part of header flow */
        z-index: 100005 !important;
        transition: all 0.3s ease;
    }

    .site-custom-header.nav-open .mobile-menu-toggle {
        background: #0f172a !important; /* Switch to dark when open */
    }

    .site-custom-header .mobile-menu-toggle span {
        display: block;
        width: 18px;
        height: 2px;
        background: #0f172a !important;
        margin: 2px 0;
        transition: all 0.4s cubic-bezier(0.19, 1, 0.22, 1);
        border-radius: 1px;
    }
    
    .site-custom-header.nav-open .mobile-menu-toggle span {
        background: #ffffff !important; /* White lines on dark bg when open */
    }

    /* Burger to X */
    .site-custom-header.nav-open .mobile-menu-toggle span:nth-child(1) { transform: translateY(4px) rotate(45deg); }
    .site-custom-header.nav-open .mobile-menu-toggle span:nth-child(2) { opacity: 0; transform: translateX(-10px); }
    .site-custom-header.nav-open .mobile-menu-toggle span:nth-child(3) { transform: translateY(-4px) rotate(-45deg); }

    .site-custom-header .header-nav {
        display: flex !important;
        position: fixed !important;
        top: 70px !important; /* Exactly below header */
        left: 0;
        width: 100%;
        background: #ffffff;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 0 !important;
        padding: 0 !important;
        z-index: 9999;
        box-shadow: 0 15px 30px rgba(0,0,0,0.08);
        border-top: 1px solid #f1f5f9;
        
        /* Modern Slide Down */
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
        visibility: hidden;
    }

    .site-custom-header.nav-open .header-nav {
        max-height: 400px; /* Adjust based on content */
        opacity: 1;
        visibility: visible;
        padding: 20px 0 !important;
    }

    .site-custom-header .header-nav a {
        width: 100%;
        padding: 15px 25px !important;
        font-size: 1.1rem !important;
        font-weight: 600 !important;
        color: #334155 !important;
        border-bottom: 1px solid #f8fafc;
        opacity: 0;
        transform: translateX(-10px);
        transition: all 0.4s ease;
    }

    .site-custom-header.nav-open .header-nav a {
        opacity: 1;
        transform: translateX(0);
    }

    /* Staggered transition */
    .site-custom-header.nav-open .header-nav a:nth-child(1) { transition-delay: 0.1s; }
    .site-custom-header.nav-open .header-nav a:nth-child(2) { transition-delay: 0.15s; }
    .site-custom-header.nav-open .header-nav a:nth-child(3) { transition-delay: 0.2s; }
    .site-custom-header.nav-open .header-nav a:nth-child(4) { transition-delay: 0.25s; }
}

/* ── Plan Content Advanced Design ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  background:#f1f5f9;
  color:#475569;
  line-height:1.8;
  -webkit-font-smoothing:antialiased;
}

.plan-content{
  max-width:880px;
  margin:0 auto;
  padding:40px 24px;
}

/* ── LEAD BANNER ── */
.lead-banner{
  position:relative;
  background:linear-gradient(135deg,#4f46e5 0%,#7c3aed 50%,#6366f1 100%);
  border-radius:24px;
  padding:36px 36px 36px 36px;
  margin-bottom:40px;
  overflow:hidden;
  box-shadow:0 20px 50px rgba(79,70,229,0.3);
}
.lead-banner::before{
  content:'';
  position:absolute;
  top:-50%;right:-20%;
  width:400px;height:400px;
  background:radial-gradient(circle,rgba(255,255,255,0.1) 0%,transparent 70%);
  border-radius:50%;
}
.lead-banner__badge{
  display:inline-block;
  background:rgba(255,255,255,0.2);
  backdrop-filter:blur(10px);
  color:#fff;
  font-size:0.72rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:1.5px;
  padding:6px 14px;
  border-radius:20px;
  margin-bottom:16px;
}
.lead-banner__text{
  font-size:1.18rem;
  color:#fff;
  font-weight:500;
  line-height:1.6;
  position:relative;
  z-index:1;
}
.lead-banner__stats{
  display:flex;
  gap:32px;
  margin-top:24px;
  position:relative;
  z-index:1;
  flex-wrap:wrap;
}
.lead-stat{text-align:center}
.lead-stat__num{
  font-size:1.8rem;
  font-weight:900;
  color:#fff;
  line-height:1;
}
.lead-stat__label{
  font-size:0.72rem;
  color:rgba(255,255,255,0.8);
  text-transform:uppercase;
  letter-spacing:1px;
  margin-top:4px;
}

/* ── SECTION HEADINGS ── */
.plan-content h2{
  font-size:1.35rem;
  font-weight:800;
  color:#0f172a;
  margin:48px 0 20px;
  display:flex;
  align-items:center;
  gap:12px;
}
.plan-content h2::before{
  content:'';
  width:6px;
  height:32px;
  background:linear-gradient(180deg,#4f46e5,#7c3aed);
  border-radius:4px;
  flex-shrink:0;
}

/* ── SUB-HEADINGS ── */
.plan-content h3{
  font-size:1.05rem;
  font-weight:700;
  color:#1e293b;
  margin:26px 0 10px;
}

/* ── PARAGRAPHS ── */
.plan-content p{margin:0 0 16px;font-size:0.95rem;color:#475569}
.plan-content p strong{color:#1e293b;font-weight:600}

/* ── TABLES ── */
.plan-content table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  margin:22px 0;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 4px 24px rgba(0,0,0,0.07);
  border:1px solid #e2e8f0;
}
.plan-content thead{background:linear-gradient(135deg,#4f46e5 0%,#6366f1 50%,#7c3aed 100%)}
.plan-content thead th{
  color:#fff;font-weight:600;font-size:0.8rem;
  text-transform:uppercase;letter-spacing:0.6px;
  padding:14px 18px;text-align:left;
}
.plan-content thead th:first-child{padding-left:22px}
.plan-content tbody tr{background:#fff;transition:background 0.15s;border-bottom:1px solid #f1f5f9}
.plan-content tbody tr:nth-child(even){background:#fafbff}
.plan-content tbody tr:hover{background:#f0f4ff}
.plan-content tbody tr:last-child{border-bottom:none}
.plan-content tbody td{padding:12px 18px;font-size:0.88rem;color:#475569;vertical-align:middle}
.plan-content tbody td:first-child{padding-left:22px;font-weight:600;color:#334155}
.plan-content tbody td strong{color:#4f46e5;font-weight:700}
.plan-content tbody td.highlight{background:#eef2ff!important;color:#4f46e5;font-weight:700}

/* ── LISTS ── */
.plan-content ul{list-style:none;margin:16px 0;padding:0;display:grid;gap:10px}
.plan-content ul li{position:relative;padding-left:28px;font-size:0.92rem;color:#475569;line-height:1.65}
.plan-content ul li::before{
  content:'';position:absolute;left:6px;top:9px;
  width:8px;height:8px;
  background:linear-gradient(135deg,#4f46e5,#7c3aed);
  border-radius:50%;
  box-shadow:0 0 0 3px rgba(79,70,229,0.12);
}
.plan-content ul li strong{color:#1e293b;font-weight:600}

/* ── ORDERED LIST ── */
.plan-content ol{list-style:none;counter-reset:step;margin:16px 0;padding:0;display:grid;gap:12px}
.plan-content ol li{
  counter-increment:step;position:relative;
  padding:16px 16px 16px 60px;
  font-size:0.92rem;color:#475569;
  background:#fff;border:1px solid #e2e8f0;
  border-radius:14px;line-height:1.6;transition:all 0.2s;
}
.plan-content ol li:hover{border-color:#c7d2fe;box-shadow:0 4px 16px rgba(79,70,229,0.1);transform:translateX(4px)}
.plan-content ol li::before{
  content:counter(step);position:absolute;
  left:16px;top:50%;transform:translateY(-50%);
  width:32px;height:32px;
  background:linear-gradient(135deg,#4f46e5,#7c3aed);
  color:#fff;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:0.82rem;font-weight:700;
  box-shadow:0 3px 10px rgba(79,70,229,0.35);
}

/* ── DETAILS / FAQ ── */
.plan-content details{
  border:1px solid #e2e8f0;border-radius:14px;
  margin-bottom:10px;overflow:hidden;
  transition:all 0.25s;background:#fff;
}
.plan-content details[open]{border-color:#c7d2fe;box-shadow:0 4px 20px rgba(79,70,229,0.1)}
.plan-content details summary{
  padding:16px 20px;cursor:pointer;
  font-weight:600;font-size:0.92rem;color:#1e293b;
  list-style:none;display:flex;justify-content:space-between;
  align-items:center;user-select:none;transition:background 0.15s;
}
.plan-content details summary::-webkit-details-marker{display:none}
.plan-content details summary::after{
  content:'+';font-size:1.3rem;color:#4f46e5;font-weight:300;
  width:30px;height:30px;background:#eef2ff;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  transition:all 0.2s;flex-shrink:0;
}
.plan-content details[open] summary::after{
  content:'−';background:#4f46e5;color:#fff;transform:rotate(180deg);
}
.plan-content details[open] summary{background:linear-gradient(135deg,#f8faff,#f0f4ff);border-bottom:1px solid #eef2ff}
.plan-content details summary:hover{background:#f5f7ff}
.plan-content details p{padding:16px 20px;margin:0;font-size:0.88rem;color:#64748b;line-height:1.7}

/* ── IMAGE BANNERS ── */
.img-banner{
  border-radius:20px;
  overflow:hidden;
  margin:24px 0;
  box-shadow:0 8px 30px rgba(0,0,0,0.1);
  position:relative;
}
.img-banner img{width:100%;display:block;aspect-ratio:16/5;object-fit:cover}
.img-banner__overlay{
  position:absolute;bottom:0;left:0;right:0;
  background:linear-gradient(transparent,rgba(0,0,0,0.7));
  padding:20px 24px;
}
.img-banner__caption{
  color:#fff;font-size:0.88rem;font-weight:500;
  text-shadow:0 1px 4px rgba(0,0,0,0.5);
}

/* ── USE CASE CARDS ── */
.use-case-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin:20px 0;
}
.use-case{
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:18px;
  overflow:hidden;
  transition:all 0.3s;
}
.use-case:hover{
  border-color:#c7d2fe;
  box-shadow:0 12px 32px rgba(79,70,229,0.12);
  transform:translateY(-4px);
}
.use-case__img{
  width:100%;
  height:140px;
  object-fit:cover;
  display:block;
}
.use-case__body{padding:18px 20px}
.use-case__icon{font-size:1.5rem;margin-bottom:8px}
.use-case__title{font-size:0.98rem;font-weight:700;color:#1e293b;margin-bottom:6px}
.use-case__text{font-size:0.84rem;color:#64748b;line-height:1.6}

/* ── DEVICE GRID ── */
.device-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(130px,1fr));
  gap:12px;margin:18px 0;
}
.device-card{
  background:#fff;border:1px solid #e2e8f0;
  border-radius:14px;padding:16px 10px;text-align:center;
  transition:all 0.2s;
}
.device-card:hover{border-color:#c7d2fe;background:linear-gradient(135deg,#f8faff,#f0f4ff);transform:translateY(-2px)}
.device-card__icon{font-size:1.8rem;margin-bottom:8px}
.device-card__name{font-size:0.8rem;color:#334155;font-weight:600}
.device-card__apps{font-size:0.7rem;color:#94a3b8;margin-top:4px}

/* ── CALLOUT ── */
.callout{
  background:linear-gradient(135deg,#fef3c7 0%,#fde68a 100%);
  border:1px solid #fcd34d;border-radius:16px;
  padding:18px 24px;margin:22px 0;
  font-size:0.92rem;color:#78350f;font-weight:500;
  display:flex;align-items:center;gap:12px;
}
.callout::before{content:'💡';font-size:1.4rem;flex-shrink:0}

/* ── COMPARISON HERO ── */
.comparison-hero{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:12px;
  margin:20px 0;
}
.comparison-card{
  border-radius:16px;
  padding:20px 16px;
  text-align:center;
}
.comparison-card--us{
  background:linear-gradient(135deg,#4f46e5,#7c3aed);
  color:#fff;
  box-shadow:0 8px 24px rgba(79,70,229,0.3);
  transform:scale(1.05);
}
.comparison-card--them{
  background:#fff;
  border:1px solid #e2e8f0;
  color:#64748b;
}
.comparison-card__price{font-size:1.6rem;font-weight:900;margin:8px 0}
.comparison-card__label{font-size:0.75rem;text-transform:uppercase;letter-spacing:1px;opacity:0.8}
.comparison-card__channels{font-size:0.85rem;margin-top:8px;font-weight:600}

/* ── TRUST BAR ── */
.trust-bar{
  display:flex;
  justify-content:center;
  gap:24px;
  flex-wrap:wrap;
  padding:20px;
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:16px;
  margin:24px 0;
}
.trust-item{
  display:flex;align-items:center;gap:8px;
  font-size:0.82rem;font-weight:600;color:#475569;
}
.trust-item__icon{
  width:32px;height:32px;
  background:#eef2ff;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  font-size:1rem;
}

/* ── RESPONSIVE ── */
@media(max-width:768px){
  .plan-content{padding:24px 16px}
  .lead-banner{padding:24px 20px;border-radius:16px}
  .lead-banner__text{font-size:1rem}
  .lead-banner__stats{gap:20px}
  .lead-stat__num{font-size:1.4rem}
  .plan-content h2{font-size:1.15rem}
  .plan-content table{display:block;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch}
  .use-case-grid{grid-template-columns:1fr}
  .comparison-hero{grid-template-columns:1fr}
  .comparison-card--us{transform:none}
  .device-grid{grid-template-columns:repeat(2,1fr)}
  .trust-bar{gap:14px}
}
@media(max-width:480px){
  .plan-content{padding:20px 12px}
  .lead-banner{padding:18px 16px}
  .lead-banner__text{font-size:0.92rem}
  .plan-content h2{font-size:1.05rem}
  .device-grid{grid-template-columns:1fr}
  .plan-content ol li{padding:12px 12px 12px 50px}
}
/* AEO Direct Answer Block */
.aeo-answer {
    font-size: 1.05em;
    line-height: 1.6;
    padding: 15px 20px;
    margin: 15px 0 25px;
    border-left: 4px solid #0066cc;
    background: #f8faff;
    border-radius: 0 6px 6px 0;
}
.aeo-answer strong {
    color: #1a1a2e;
}
@media (max-width: 768px) {
    .aeo-answer { font-size: 0.95em; padding: 12px 15px; }
}

/* ═══════════════════════════════════════

/* ═══════════════════════════════════════

/* ═══════════════════════════════════════
   SINGLE POST — Responsive Container
   ═══════════════════════════════════════ */
body.single #headerSpacer { height: 0 !important; }
body.single .site-main { margin-top: 0 !important; padding-top: 0 !important; }
body.single .spost-wrap { padding-top: 0; }

/* Container — fluid max-width */
body.single .spost-container { 
    max-width: min(960px, 92vw) !important;
    margin: 0 auto !important;
    padding: 0 clamp(16px, 3vw, 32px) !important;
}
body.single .spost-featured-img-wrap .spost-container {
    max-width: min(960px, 92vw) !important;
}

/* Header clearance — clears floating nav */
body.single .spost-header { padding-top: clamp(60px, 10vh, 90px); }

/* Article content — slightly narrower than container */
body.single .spost-article {
    max-width: min(860px, 88vw);
    margin: 0 auto;
}

/* H1 responsive sizing */
body.single .spost-title {
    font-size: clamp(1.4rem, 4vw, 2.5rem);
    line-height: 1.2;
}

/* Featured image responsive */
body.single .spost-featured-img {
    width: 100%;
    height: auto;
    max-height: none;
    object-fit: cover;
    aspect-ratio: 16/9;
    border-radius: clamp(8px, 1.5vw, 16px);
}

/* Content responsive */
body.single .spost-content {
    font-size: clamp(0.95rem, 1.8vw, 1.08rem);
    line-height: 1.75;
}

/* H2 responsive */
body.single .spost-content h2 {
    font-size: clamp(1.2rem, 2.5vw, 1.6rem);
    margin: clamp(24px, 5vh, 48px) 0 clamp(10px, 2vh, 16px);
}

/* H3 responsive */
body.single .spost-content h3 {
    font-size: clamp(1.05rem, 2vw, 1.3rem);
}

/* Meta row — wrap on small screens */
body.single .spost-meta {
    flex-wrap: wrap;
    gap: clamp(6px, 1.5vw, 12px);
}

/* ========================================== */
/* TABLET — 960px-768px */
/* ========================================== */
@media (max-width: 960px) {
    body.single .spost-container {
        max-width: 94vw !important;
        padding: 0 clamp(12px, 2.5vw, 24px) !important;
    }
    body.single .spost-article {
        max-width: 90vw;
    }
    body.single .spost-header {
        padding-top: clamp(50px, 8vh, 70px);
    }
}

/* ========================================== */
/* MOBILE — 768px-480px */
/* ========================================== */
@media (max-width: 768px) {
    body.single .spost-container {
        max-width: 96vw !important;
        padding: 0 16px !important;
    }
    body.single .spost-article {
        max-width: 100%;
    }
    body.single .spost-header {
        padding-top: 60px;
    }
    body.single .spost-title {
        font-size: clamp(1.2rem, 5.5vw, 1.6rem);
    }
    body.single .spost-content {
        font-size: 0.95rem;
    }
    body.single .spost-content h2 {
        font-size: 1.2rem;
        margin: 28px 0 12px;
    }
    body.single .spost-meta {
        gap: 8px;
        font-size: 0.85rem;
    }
    body.single .spost-meta__sep {
        display: inline;
    }
    body.single .spost-share-bar {
        flex-wrap: wrap;
        gap: 12px;
    }
    body.single .spost-author-card {
        padding: 20px;
        gap: 14px;
    }
    body.single .spost-featured-img {
        border-radius: 8px;
        aspect-ratio: 16/10;
    }
}

/* ========================================== */
/* SMALL MOBILE — <480px */
/* ========================================== */
@media (max-width: 480px) {
    body.single .spost-container {
        max-width: 100% !important;
        padding: 0 12px !important;
    }
    body.single .spost-header {
        padding-top: 50px;
    }
    body.single .spost-title {
        font-size: 1.2rem;
    }
    body.single .spost-meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
    body.single .spost-meta__sep {
        display: none;
    }
    body.single .spost-content {
        font-size: 0.9rem;
        line-height: 1.65;
    }
    body.single .spost-content h2 {
        font-size: 1.1rem;
        margin: 20px 0 8px;
        padding-bottom: 8px;
    }
    body.single .spost-content h3 {
        font-size: 1rem;
    }
    body.single .spost-featured-img {
        border-radius: 4px;
        aspect-ratio: 16/10;
    }
    body.single .spost-author-card {
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 16px;
    }
    body.single .spost-share-bar {
        justify-content: center;
        flex-direction: column;
        gap: 8px;
    }
    body.single .spost-share-bar__label {
        text-align: center;
    }
}

/* ═══════════════════════════════════════
   CATEGORY ARCHIVE — Clean Grid
   ═══════════════════════════════════════ */
.cat-archive-wrap { background: #ffffff; min-height: 100vh; }
.cat-container {
    max-width: min(960px, 92vw);
    margin: 0 auto;
    padding: 0 clamp(16px, 3vw, 32px);
}

/* Category Header */
.cat-header {
    padding: clamp(60px, 10vh, 100px) 0 clamp(30px, 4vh, 50px);
    text-align: center;
    background: linear-gradient(135deg, #f8fafc 0%, #eef2ff 100%);
}
.cat-badge {
    display: inline-block;
    background: #3b5bdb;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 5px 16px;
    border-radius: 20px;
    margin-bottom: 16px;
}
.cat-title {
    font-size: clamp(1.8rem, 4.5vw, 2.8rem);
    font-weight: 900;
    color: #0f172a;
    letter-spacing: -0.02em;
    margin: 0 0 12px;
}
.cat-description {
    font-size: 1.05rem;
    color: #475569;
    max-width: 600px;
    margin: 0 auto 16px;
    line-height: 1.6;
}
.cat-count {
    font-size: 0.85rem;
    color: #94a3b8;
    font-weight: 500;
}

/* Grid */
.cat-body { padding: 40px 0 60px; }
.cat-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

/* Card */
.cat-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.25s;
}
.cat-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 40px rgba(0,0,0,0.1);
    border-color: #c7d2fe;
}
.cat-card-link { text-decoration: none; color: inherit; display: flex; flex-direction: column; height: 100%; }

/* Card Thumbnail */
.cat-card-thumb {
    aspect-ratio: 16/10;
    overflow: hidden;
    background: #f1f5f9;
}
.cat-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s;
}
.cat-card:hover .cat-card-thumb img { transform: scale(1.05); }
.cat-card-thumb--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
}

/* Card Body */
.cat-card-body { padding: 20px; flex: 1; display: flex; flex-direction: column; }
.cat-card-category {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 600;
    color: #3b5bdb;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 8px;
    width: fit-content;
}
.cat-card-title {
    font-size: 1.08rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.35;
    margin: 0 0 8px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.cat-card-excerpt {
    font-size: 0.88rem;
    color: #64748b;
    line-height: 1.55;
    margin: 0 0 12px;
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.cat-card-meta {
    display: flex;
    justify-content: space-between;
    font-size: 0.8rem;
    color: #94a3b8;
    padding-top: 12px;
    border-top: 1px solid #f1f5f9;
}

/* Pagination */
.cat-pagination {
    padding: 30px 0;
    text-align: center;
}
.cat-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 12px;
    margin: 0 4px;
    border-radius: 8px;
    font-size: 0.9rem;
    font-weight: 500;
    color: #475569;
    text-decoration: none;
    border: 1px solid #e2e8f0;
    transition: all 0.2s;
}
.cat-pagination .page-numbers.current {
    background: #3b5bdb;
    color: #fff;
    border-color: #3b5bdb;
}
.cat-pagination .page-numbers:hover:not(.current) {
    background: #f1f5f9;
    border-color: #cbd5e1;
}

/* ========================================== */
/* CATEGORY — Tablet 768-960px */
/* ========================================== */
@media (max-width: 960px) {
    .cat-container {
        max-width: 94vw;
        padding: 0 clamp(12px, 2.5vw, 24px);
    }
    .cat-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}

/* ========================================== */
/* CATEGORY — Mobile <768px */
/* ========================================== */
@media (max-width: 768px) {
    .cat-container {
        max-width: 96vw;
        padding: 0 16px;
    }
    .cat-grid { grid-template-columns: 1fr; gap: 16px; }
    .cat-header { padding: 60px 0 30px; }
    .cat-card-title { font-size: 1rem; }
    .cat-description { font-size: 0.95rem; }
}

/* ========================================== */
/* CATEGORY — Small <480px */
/* ========================================== */
@media (max-width: 480px) {
    .cat-container {
        max-width: 100%;
        padding: 0 12px;
    }
    .cat-header { padding: 50px 0 24px; }
    .cat-title { font-size: 1.5rem; }
}