/* Layout Wrapper */
.rv-faq-section {
    padding: 100px 24px;
    background-color: #fafafa; /* Soft off-white to contrast the cards */
}

/* Create the Split Grid */
.rv-faq-layout {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1.5fr; /* 1 Column Left, 1.5 Columns Right */
    gap: 60px;
    align-items: start;
}

/* Left Sticky Sidebar Content */
.rv-faq-header-left {
    position: sticky;
    top: 40px; /* Stays fixed elegantly as they scroll through questions */
}

.rv-faq-header-left h2 {
    font-size: 2.5rem;
    font-weight: 800;
    color: #0f172a;
    line-height: 1.2;
    margin-bottom: 16px;
    letter-spacing: -0.02em;
}

.rv-faq-header-left p {
    font-size: 1.1rem;
    color: #64748b;
    line-height: 1.5;
}

/* Right Stack Cards Configuration */
.rv-faq-accordion-right {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Premium Dashboard Card Styling */
.rv-faq-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 28px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.02), 0 4px 12px rgba(0,0,0,0.03);
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Interactive Hover Lift */
.rv-faq-card:hover {
    border-color: #cbd5e1;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.05), 0 8px 10px -6px rgba(0, 0, 0, 0.03);
    transform: translateY(-2px);
}

/* Question Headings */
.rv-faq-card h4 {
    font-size: 1.2rem;
    font-weight: 600;
    color: #0f172a;
    margin: 0 0 12px 0;
    line-height: 1.4;
}

/* Answer Body Text */
.rv-faq-card p {
    font-size: 0.975rem;
    color: #475569;
    line-height: 1.6;
    margin: 0;
}

/* Update the Left Sidebar Heading to use the Gradient Mask */
.rv-faq-header-left h2 {
    font-size: 2.5rem;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 16px;
    letter-spacing: -0.02em;
    
    /* Premium Emerald Tech Gradient Definition */
    background: linear-gradient(135deg, #0f172a 30%, #059669 100%); /* Fades Slate-Dark into Tech-Emerald */
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Optional Polish: Add a subtle emerald tint to card hover borders */
.rv-faq-card:hover {
    border-color: #a7f3d0; /* Soft emerald border tint on hover */
    box-shadow: 0 10px 25px -5px rgba(5, 150, 105, 0.04), 0 8px 10px -6px rgba(5, 150, 105, 0.02); /* Very faint emerald shadow halo */
    transform: translateY(-2px);
}

/* Seamless Mobile Responsiveness */
@media (max-width: 968px) {
    .rv-faq-layout {
        grid-template-columns: 1fr; /* Stacks vertically on mobile screens */
        gap: 40px;
    }
    .rv-faq-header-left {
        position: relative;
        top: 0;
    }
}


/* --- CORE OVERRIDES --- */
.site-content .ast-container {
    display: block !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}
.site-content .ast-container > .ast-row {
    display: block !important;
    max-width: 100% !important;
    width: 100% !important;
}

/* --- ELITE ROW LAYOUT (SECTION 4) --- */
.rv-perfect-storm-section {
    padding: 120px 0;
    background: #ffffff;
}

/* Dual-pane header for a high-end editorial look */
.rv-storm-header {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: end;
    margin-bottom: 80px;
}

.rv-storm-title-block h2 {
    font-size: clamp(2.5rem, 4vw, 3.5rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.03em;
    color: var(--text-heading);
    margin: 0;
}

.rv-storm-desc-block p {
    font-size: 1.2rem;
    line-height: 1.6;
    color: var(--text-body);
    margin: 0;
}

/* The Row System */
.rv-storm-rows {
    border-top: 1px solid var(--border-soft);
}

.rv-storm-row {
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 40px;
    padding: 60px 0;
    border-bottom: 1px solid var(--border-soft);
    position: relative;
    overflow: hidden;
    transition: background 0.3s ease;
}

/* Hover background fade */
.rv-storm-row:hover {
    background: #f8fafc;
}

/* The animated left-border indicator */
.rv-storm-row::before {
    content: '';
    position: absolute;
    top: 0; 
    left: 0;
    width: 4px; 
    height: 100%;
    background: transparent;
    transition: background 0.3s ease;
}

.rv-storm-row:nth-child(1):hover::before { background: var(--emerald-main); }
.rv-storm-row:nth-child(2):hover::before { background: var(--blue-main); }
.rv-storm-row:nth-child(3):hover::before { background: var(--amber-main); }

/* The Giant Numbers */
.rv-storm-number {
    font-family: monospace;
    font-size: 4rem;
    font-weight: 800;
    line-height: 0.8;
    opacity: 0.2; /* Washed out by default */
    transition: opacity 0.3s ease, transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    margin-top: 5px;
}

/* Slide in and light up on hover */
.rv-storm-row:hover .rv-storm-number {
    opacity: 1;
    transform: translateX(15px);
}

.rv-storm-content h3 {
    font-size: 2rem;
    font-weight: 800;
    color: var(--text-heading);
    margin-bottom: 16px;
    letter-spacing: -0.02em;
}

.rv-storm-content p {
    font-size: 1.15rem;
    line-height: 1.7;
    color: var(--text-body);
    max-width: 800px;
    margin: 0;
}

/* Mobile & Tablet Adjustments */
@media (max-width: 990px) {
    .rv-storm-header {
        grid-template-columns: 1fr;
        gap: 24px;
        margin-bottom: 50px;
    }
    .rv-storm-row {
        grid-template-columns: 1fr;
        gap: 16px;
        padding: 40px 0;
    }
    .rv-storm-number {
        font-size: 3rem;
        margin-bottom: 10px;
        opacity: 0.4; /* Slightly more visible on touch screens */
    }
    /* Disable the slide effect on mobile */
    .rv-storm-row:hover .rv-storm-number {
        transform: none; 
    }
}

/* --- TERMINAL / API SCHEMA SECTION --- */
.rv-api-schema-section {
    padding: 120px 0;
}

.rv-schema-terminal {
    max-width: 1000px;
    margin: 0 auto;
    background: #0f172a;
    border-radius: 16px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    overflow: hidden;
    border: 1px solid #334155;
}

.rv-terminal-header {
    background: #1e293b;
    padding: 16px 24px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #334155;
}

.rv-terminal-dots {
    display: flex;
    gap: 8px;
    margin-right: 20px;
}

.rv-terminal-dots span {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #475569;
}

.rv-terminal-dots span:nth-child(1) { background: #ef4444; } /* Red */
.rv-terminal-dots span:nth-child(2) { background: #eab308; } /* Yellow */
.rv-terminal-dots span:nth-child(3) { background: #22c55e; } /* Green */

.rv-terminal-title {
    color: #94a3b8;
    font-family: monospace;
    font-size: 0.9rem;
    letter-spacing: 0.5px;
}

.rv-terminal-body {
    padding: 40px;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.rv-schema-block {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    gap: 40px;
    align-items: center;
    padding-bottom: 40px;
    border-bottom: 1px dashed #334155;
}

.rv-schema-block:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.rv-schema-info h3 {
    color: #f8fafc;
    font-size: 1.35rem;
    font-weight: 700;
    margin-bottom: 12px;
}

.rv-schema-info p {
    color: #94a3b8;
    font-size: 0.95rem;
    line-height: 1.6;
    margin: 0;
}

.rv-schema-code {
    background: #020617; /* Even darker inner background */
    padding: 24px;
    border-radius: 12px;
    border: 1px solid #1e293b;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.rv-schema-code code {
    color: #10b981; /* Emerald green terminal text */
    font-family: 'Courier New', Courier, monospace;
    font-size: 0.95rem;
    display: block;
}

.rv-code-type {
    color: #3b82f6; /* Blue for the string type */
    margin-right: 8px;
}

/* Mobile Fallback for Terminal */
@media (max-width: 768px) {
    .rv-schema-block {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .rv-terminal-body {
        padding: 24px;
    }
}

/* --- PREMIUM EDITORIAL USE CASES (SECTION 5) --- */
.rv-use-cases-editorial {
    padding: 120px 0;
    background-color: var(--bg-alt); 
}

.rv-editorial-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0; /* Zero gap because we use structural borders instead */
    background: #ffffff;
    border: 1px solid var(--border-soft);
    border-radius: 24px;
    overflow: hidden; /* Clips the corners cleanly */
    box-shadow: 0 20px 40px -15px rgba(0,0,0,0.05);
}

.rv-editorial-block {
    position: relative;
    padding: 60px 40px;
    border-right: 1px solid var(--border-soft);
    background: #ffffff;
    transition: background 0.3s ease;
    cursor: default;
}

/* --- ELITE DARK MODE SECTION --- */
.rv-elite-dark-section {
    background-color: #0f172a; /* Deep slate background */
    padding: 120px 0;
    color: #f8fafc;
    border-top: 1px solid var(--border-soft);
    border-bottom: 1px solid var(--border-soft);
}

.rv-dark-header {
    text-align: center;
    max-width: 800px;
    margin: 0 auto 60px auto;
}

.rv-glow-text {
    color: var(--emerald-main);
    font-size: 0.85rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 2px;
    display: block;
    margin-bottom: 16px;
    /* Creates a subtle neon glow effect behind the text */
    text-shadow: 0 0 15px rgba(16, 185, 129, 0.4); 
}

.rv-dark-header h2 {
    color: #ffffff;
    font-size: clamp(2rem, 3.5vw, 3rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.02em;
    margin-bottom: 24px;
}

.rv-dark-header p {
    color: #94a3b8;
    font-size: 1.15rem;
    line-height: 1.6;
}

.rv-bento-dark-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.rv-dark-card {
    background: #1e293b;
    border: 1px solid #334155;
    border-radius: 20px;
    padding: 40px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

/* The Glowing Gradient Background Layer */
.rv-dark-card::before {
    content: '';
    position: absolute;
    top: -50px;
    left: -50px;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, var(--glow-color) 0%, transparent 70%);
    opacity: 0.08;
    transition: opacity 0.3s ease;
    border-radius: 50%;
}

.rv-glow-emerald { --glow-color: var(--emerald-main); }
.rv-glow-blue { --glow-color: var(--blue-main); }
.rv-glow-amber { --glow-color: var(--amber-main); }

.rv-dark-card:hover {
    transform: translateY(-5px);
    border-color: #475569;
    box-shadow: 0 20px 40px -10px rgba(0,0,0,0.3);
}

.rv-dark-card:hover::before {
    opacity: 0.15; /* Glow intensifies on hover */
}

/* Custom premium icons for the dark theme */
.rv-dark-icon {
    width: 48px;
    height: 48px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: #ffffff;
    margin-bottom: 24px;
    position: relative;
    z-index: 2;
}

.rv-dark-card h3 {
    color: #f8fafc;
    font-size: 1.5rem;
    font-weight: 800;
    margin-bottom: 16px;
    letter-spacing: -0.01em;
    position: relative;
    z-index: 2;
}

.rv-dark-card p {
    color: #cbd5e1;
    font-size: 1rem;
    line-height: 1.6;
    margin: 0;
    position: relative;
    z-index: 2;
}

/* Mobile Adjustments */
@media (max-width: 990px) {
    .rv-bento-dark-grid {
        grid-template-columns: 1fr;
    }
    .rv-elite-dark-section {
        padding: 80px 0;
    }
}

/* Remove the right border on the final column */
.rv-editorial-block:last-child {
    border-right: none;
}

/* Subtle hover effect to lift the column */
.rv-editorial-block:hover {
    background: #f8fafc;
}

/* The sleek top accent line (Hidden by default, expands on hover) */
.rv-accent-line {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.bg-emerald { background-color: var(--emerald-main); }
.bg-blue { background-color: var(--blue-main); }
.bg-amber { background-color: var(--amber-main); }

/* Trigger the expansion on hover */
.rv-editorial-block:hover .rv-accent-line {
    transform: scaleX(1);
}

.rv-editorial-content h3 {
    font-size: 2.25rem;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.03em;
    color: var(--text-heading);
    margin-bottom: 24px;
}

.rv-editorial-content p {
    font-size: 1.05rem;
    line-height: 1.7;
    color: var(--text-body);
    margin: 0;
}

/* Mobile & Tablet Adjustments */
@media (max-width: 990px) {
    .rv-editorial-grid {
        grid-template-columns: 1fr;
    }
    .rv-editorial-block {
        border-right: none;
        border-bottom: 1px solid var(--border-soft);
        padding: 40px 30px;
    }
    .rv-editorial-block:last-child {
        border-bottom: none;
    }
    .rv-editorial-content h3 {
        font-size: 1.75rem;
    }
    /* Lock the accent line open on mobile since hover doesn't exist on touch */
    .rv-accent-line {
        transform: scaleX(1);
    }
}

/* --- PREMIUM STICKY FEATURE SECTION --- */
.rv-premium-sticky-section {
    padding: 120px 0;
    background-color: var(--bg-main);
    border-top: 1px solid var(--border-soft);
}

.rv-sticky-layout {
    display: grid;
    grid-template-columns: 1fr 1.2fr; /* Asymmetrical split looks more premium */
    gap: 80px;
    align-items: flex-start; /* Crucial for sticky to work */
}

.rv-sticky-sidebar {
    position: sticky;
    top: 120px; /* Locks it 120px from the top of the viewport when scrolling */
}

.rv-sticky-sidebar h2 {
    font-size: clamp(2.5rem, 4vw, 3.5rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.03em;
    color: var(--text-heading);
    margin-bottom: 24px;
}

.rv-sticky-sidebar p {
    font-size: 1.2rem;
    color: var(--text-body);
    line-height: 1.6;
    max-width: 90%;
}

/* The Scrolling Blocks */
.rv-sticky-content {
    display: flex;
    flex-direction: column;
    gap: 60px; /* Massive breathing room between engines */
}

.rv-engine-block {
    display: flex;
    gap: 30px;
    background: #ffffff;
    border: 1px solid var(--border-soft);
    padding: 50px 40px;
    border-radius: 20px;
    box-shadow: 0 10px 30px -10px rgba(0,0,0,0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.rv-engine-block:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 40px -10px rgba(0,0,0,0.1);
}

.rv-engine-num {
    font-size: 3rem;
    font-weight: 800;
    line-height: 1;
    opacity: 0.2; /* Large but subtle watermark effect */
    font-family: monospace;
    margin-top: -5px; /* Aligns with the heading */
}

.rv-engine-details h4 {
    font-size: 1.75rem;
    font-weight: 800;
    color: var(--text-heading);
    margin-bottom: 16px;
    letter-spacing: -0.02em;
}

.rv-engine-details p {
    font-size: 1.1rem;
    line-height: 1.7;
    color: var(--text-body);
    margin: 0;
}

/* Mobile Adjustments */
@media (max-width: 990px) {
    .rv-sticky-layout {
        grid-template-columns: 1fr; /* Stacks on tablet/mobile */
        gap: 60px;
    }
    .rv-sticky-sidebar {
        position: relative;
        top: 0;
    }
    .rv-engine-block {
        flex-direction: column;
        gap: 20px;
        padding: 30px 24px;
    }
    .rv-engine-num {
        font-size: 2rem;
        opacity: 0.5; /* Slightly more visible when stacked */
    }
}

/* --- ALIGNED CHECKLIST GRID --- */
.rv-checklist-aligned li {
    align-items: flex-start; /* Keeps the green checkmark at the top of the row */
}

.rv-checklist-aligned li i {
    margin-top: 4px; /* Visually aligns the icon with the first line of text */
    flex-shrink: 0; /* Prevents the icon from squishing */
}

.rv-check-grid {
    display: grid;
    /* The 140px locks the bold text width. The 1fr lets the description fill the rest. */
    grid-template-columns: 140px 1fr; 
    gap: 16px;
    align-items: flex-start;
    width: 100%;
}

.rv-check-grid strong {
    color: var(--text-heading);
    line-height: 1.4;
}

.rv-check-grid span {
    line-height: 1.4;
}

/* Mobile Fallback: Stack them neatly on small screens */
@media (max-width: 600px) {
    .rv-check-grid {
        grid-template-columns: 1fr; 
        gap: 4px; /* Tightens the gap when stacked */
    }
}

/* --- VARIABLES & BASE --- */
.rv-light-redesign-v3 {
    --bg-main: #ffffff;
    --bg-alt: #f8fafc; 
    --text-heading: #0f172a;
    --text-body: #475569;
    --emerald-dark: #047857; 
    --emerald-main: #10b981; 
    --border-soft: #e2e8f0;
    --orange-main: #f59e0b;
    width: 100% !important;
    display: block !important;
    font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    -webkit-font-smoothing: antialiased;
    background-color: var(--bg-main);
    color: var(--text-body);
}

.rv-container { 
    max-width: 1280px; 
    margin: 0 auto; 
    padding: 0 24px; 
    box-sizing: border-box; 
    width: 100%;
}
.rv-text-center { text-align: center; }

/* --- SECTION 1: PERFECT VIEWPORT LOCK --- */
.rv-hero-viewport {
    /* 
       This calculates 100% of the screen height, MINUS 90px for your header.
       Change the '90px' if your header is slightly taller or shorter. 
    */
    min-height: calc(100vh - 80px); 
    display: flex;
    align-items: center; /* Perfectly centers everything vertically */
    justify-content: center; /* Perfectly centers everything horizontally */
    
    /* Removed top/bottom padding to let flexbox do the math */
    padding: 0; 
    background: radial-gradient(ellipse at center, #e6f7f0 0%, #ffffff 70%);
    border-bottom: 1px solid var(--border-soft);
    box-sizing: border-box;
}

.rv-hero-content {
    max-width: 850px;
    margin: 0 auto;
    /* Move it slightly up from dead-center visually, looks better to the human eye */
    transform: translateY(-2vh); 
}

.rv-badge-soft {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #ffffff;
    border: 1px solid #a7f3d0;
    padding: 6px 16px;
    border-radius: 100px;
    font-size: 13px;
    font-weight: 600;
    color: var(--emerald-dark);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 20px;
    box-shadow: 0 4px 6px -1px rgba(16, 185, 129, 0.05);
}
.rv-pulse-dot-green {
    width: 8px;
    height: 8px;
    background-color: var(--emerald-main);
    border-radius: 50%;
    animation: pulseLight 2s infinite;
}

.rv-display-title {
    font-size: clamp(2.25rem, 4vw, 4rem);
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: -0.03em;
    margin-bottom: 20px;
    color: var(--text-heading);
}
.rv-text-emerald-dark { color: var(--emerald-dark); }
.rv-text-emerald-main { color: var(--emerald-main); }

.rv-hero-lead {
    font-size: clamp(1.05rem, 1.5vw, 1.15rem);
    line-height: 1.6;
    color: var(--text-body);
    max-width: 720px;
    margin: 0 auto 36px auto;
}
.rv-hero-lead strong {
    color: var(--text-heading);
    font-weight: 700;
}

.rv-btn-primary-solid {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--emerald-main);
    color: #ffffff;
    padding: 16px 36px;
    border-radius: 8px;
    font-size: 18px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s ease;
    box-shadow: 0 10px 25px -5px rgba(16, 185, 129, 0.4);
}
.rv-btn-primary-solid:hover {
    background: var(--emerald-dark);
    transform: translateY(-2px);
    box-shadow: 0 15px 35px -5px rgba(16, 185, 129, 0.5);
    color: #ffffff;
}

/* --- SECTION 2: FEATURE (Unchanged, already works perfectly) --- */
.rv-feature-clean {
    padding: 100px 0;
    background-color: var(--bg-alt);
}
.rv-feature-split {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 60px;
    align-items: center;
}

.rv-section-title {
    font-size: clamp(2rem, 3vw, 2.75rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.02em;
    margin-bottom: 20px;
    color: var(--text-heading);
}
.rv-section-subtitle {
    font-size: 1.125rem;
    color: var(--text-body);
    line-height: 1.6;
    margin-bottom: 40px;
}

.rv-bento-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}
.rv-bento-card {
    background: #ffffff;
    border: 1px solid var(--border-soft);
    padding: 24px;
    border-radius: 12px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}
.rv-icon-emerald { color: var(--emerald-main); font-size: 24px; margin-bottom: 12px; display: block; }
.rv-bento-card h3 {
    font-size: 1.125rem;
    font-weight: 700;
    margin-bottom: 8px;
    color: var(--text-heading);
}
.rv-bento-card p {
    font-size: 0.95rem;
    margin: 0;
}

.rv-visual-presentation {
    position: relative;
    width: 100%;
}
.rv-image-wrapper {
    position: relative;
    cursor: zoom-in;
    border-radius: 12px;
    transition: transform 0.2s ease;
}
.rv-image-wrapper:hover {
    transform: scale(1.02);
}
.rv-dashboard-img-light {
    width: 100%;
    border-radius: 12px;
    border: 1px solid var(--border-soft);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15);
    display: block;
}

.rv-zoom-hint {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(15, 23, 42, 0.8);
    color: #fff;
    padding: 12px 24px;
    border-radius: 30px;
    font-weight: 600;
    font-size: 14px;
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 10;
    pointer-events: none;
}
.rv-image-wrapper:hover .rv-zoom-hint {
    opacity: 1;
}

.rv-floating-stat-card-light {
    position: absolute;
    bottom: -20px;
    left: -20px;
    z-index: 5;
    background: #ffffff;
    border: 1px solid var(--border-soft);
    padding: 16px 24px;
    border-radius: 12px;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
}
.rv-stat-value {
    color: var(--emerald-main);
    font-size: 28px;
    font-weight: 800;
    margin-bottom: 4px;
}
.rv-stat-label {
    color: var(--text-body);
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.5px;
}

/* --- LIGHTBOX MODAL CSS --- */
.rv-modal-overlay {
    display: none; 
    position: fixed; 
    z-index: 99999; 
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%; 
    background-color: rgba(15, 23, 42, 0.9);
    backdrop-filter: blur(5px);
    cursor: zoom-out;
    opacity: 0;
    transition: opacity 0.3s ease;
}
.rv-modal-overlay.active {
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 1;
}
.rv-modal-content {
    max-width: 90%;
    max-height: 90vh;
    border-radius: 8px;
    box-shadow: 0 25px 50px rgba(0,0,0,0.5);
    transform: scale(0.95);
    transition: transform 0.3s ease;
}
.rv-modal-overlay.active .rv-modal-content {
    transform: scale(1);
}
.rv-modal-close {
    position: absolute;
    top: 30px;
    right: 40px;
    color: #f1f5f9;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
}

/* --- SECTION HEADER STYLES --- */
.rv-section-header-center {
    text-align: center;
    max-width: 800px;
    margin: 0 auto 60px auto;
}
.rv-section-header-center h2 {
    font-size: clamp(2rem, 3.5vw, 3rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--text-heading);
    margin-bottom: 20px;
}
.rv-section-header-center p {
    font-size: 1.15rem;
    color: var(--text-body);
    line-height: 1.6;
}

/* --- THE PILLARS (SECTION 3) --- */
.rv-pillars-section {
    padding: 120px 0;
    background-color: var(--bg-main);
}
.rv-grid-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}
.rv-pillar-card {
    background: #ffffff;
    border: 1px solid var(--border-soft);
    padding: 32px 24px;
    border-radius: 16px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.rv-pillar-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 20px -5px rgba(0, 0, 0, 0.08);
}
.rv-icon-wrapper {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}
.rv-icon-wrapper i {
    font-size: 24px;
}
.rv-bg-emerald-soft {
    background-color: var(--emerald-soft);
}
.rv-pillar-card h3 {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--text-heading);
    margin-bottom: 12px;
    letter-spacing: -0.01em;
}
.rv-pillar-card p {
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--text-body);
    margin: 0;
}

/* --- SHOWCASE SECTIONS (SECTIONS 4 & 5) --- */
.rv-showcase-section {
    padding: 120px 0;
}
.rv-bg-alt {
    background-color: var(--bg-alt);
}
.rv-split-layout {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 80px;
    align-items: center;
}
.rv-split-layout:has(> .rv-showcase-visual:first-child) {
    grid-template-columns: 1.2fr 1fr;
}
.rv-eyebrow {
    display: inline-block;
    color: var(--emerald-main);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-size: 0.85rem;
    margin-bottom: 16px;
}
.rv-showcase-content h2 {
    font-size: clamp(2rem, 3.5vw, 2.75rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--text-heading);
    margin-bottom: 24px;
}
.rv-showcase-lead {
    font-size: 1.125rem;
    line-height: 1.6;
    color: var(--text-body);
    margin-bottom: 32px;
}
.rv-checklist {
    list-style: none;
    padding: 0;
    margin: 0;
}
.rv-checklist li {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 1rem;
    font-weight: 500;
    color: var(--text-heading);
    margin-bottom: 16px;
}
.rv-checklist li i {
    color: var(--emerald-main);
    background: var(--emerald-soft);
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
}
.rv-light-redesign-v3 {
    --violet-main: #8b5cf6;
    --violet-soft: #f5f3ff;
    --amber-main: #f59e0b;
    --amber-soft: #fffbeb;
    --blue-main: #3b82f6;
}

/* --- UTILITIES --- */
.rv-margin-bottom-large { margin-bottom: 100px; }
.rv-text-emerald { color: var(--emerald-main) !important; }
.rv-text-violet { color: var(--blue-main) !important; }
.rv-text-amber { color: var(--amber-main) !important; }
.rv-text-blue { color: var(--blue-main) !important; }
.rv-bg-violet-soft { background-color: var(--blue-soft); }
.rv-bg-amber-soft { background-color: var(--amber-soft); }

/* --- SECTION 6: PIPELINE MATRIX --- */
.rv-pipeline-matrix {
    padding: 100px 0;
    background-color: #ffffff;
}

.rv-obj-category {
    background: #ffffff;
    border: 1px solid var(--border-soft);
    border-radius: 16px;
    padding: 40px;
    margin-bottom: 40px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.03);
}

/* Color Coded Borders */
.rv-border-emerald { border-left: 6px solid var(--emerald-main); }
.rv-border-violet { border-left: 6px solid var(--blue-main); }
.rv-border-amber { border-left: 6px solid var(--amber-main); }

.rv-obj-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 30px;
}
.rv-icon-box {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}
.rv-obj-header h3 {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--text-heading);
    margin: 0;
    letter-spacing: -0.01em;
}

.rv-obj-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.rv-obj-card {
    background: #ffffff;
    border: 1px solid var(--border-soft);
    border-radius: 12px;
    padding: 24px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    display: flex;
    flex-direction: column;
}
.rv-obj-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 25px -5px rgba(0,0,0,0.05);
}
.rv-card-highlight-emerald {
    border: 2px solid var(--emerald-main);
    box-shadow: 0 10px 25px -5px rgba(16, 185, 129, 0.15);
}
.rv-obj-title {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--text-heading);
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.rv-obj-card p {
    font-size: 0.95rem;
    color: var(--text-body);
    line-height: 1.6;
    margin-bottom: 24px;
    flex-grow: 1; /* Pushes the badge to the bottom */
}

/* Badges */
.rv-badge {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-align: center;
}
.rv-badge-emerald { color: var(--emerald-dark); background: var(--emerald-soft); }
.rv-badge-violet { color: var(--blue-main); background: var(--blue-soft); }
.rv-badge-amber { color: #d97706; background: var(--amber-soft); }

/* --- SECTION 7: USE CASES --- */
.rv-use-cases-section {
    padding: 100px 0;
}
.rv-grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}
.rv-persona-card {
    background: #ffffff;
    border: 1px solid var(--border-soft);
    border-radius: 16px;
    padding: 40px 32px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
    position: relative;
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.rv-persona-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
}

/* Top accent bars */
.rv-persona-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 6px;
}
.rv-accent-emerald::before { background-color: var(--emerald-main); }
.rv-accent-blue::before { background-color: var(--blue-main); }
.rv-accent-amber::before { background-color: var(--amber-main); }

.rv-persona-card h4 {
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--text-heading);
    margin-bottom: 16px;
}
.rv-persona-card p {
    font-size: 1rem;
    color: var(--text-body);
    line-height: 1.6;
    margin-bottom: 24px;
}

/* Distinct from the showcase checklist, tailored for persona cards */
.rv-feature-list {
    list-style: none;
    padding: 0;
    margin: 0;
    border-top: 1px solid var(--border-soft);
    padding-top: 24px;
}
.rv-feature-list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--text-heading);
    margin-bottom: 12px;
    line-height: 1.4;
}
.rv-feature-list li i {
    margin-top: 3px;
    font-size: 14px;
}

/* --- UTILITY COLORS FOR AVATARS --- */
.rv-bg-emerald-main { background-color: var(--emerald-main) !important; color: white; }
.rv-bg-amber-main { background-color: var(--amber-main) !important; color: white; }
.rv-bg-blue-main { background-color: var(--blue-main) !important; color: white; }
.rv-bg-violet-main { background-color: var(--violet-main) !important; color: white; }

/* --- SECTION 8: TESTIMONIALS --- */
.rv-testimonials-section {
    padding: 100px 0 140px 0;
    background-color: var(--bg-main);
}
.rv-testimonial-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.rv-review-card {
    background: #ffffff;
    border: 1px solid var(--border-soft);
    border-radius: 12px;
    padding: 32px 24px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.03);
    display: flex;
    flex-direction: column;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.rv-review-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 20px -5px rgba(0,0,0,0.08);
}
.rv-stars {
    color: #fbbf24; /* Solid gold for stars */
    font-size: 14px;
    margin-bottom: 16px;
    display: flex;
    gap: 4px;
}
.rv-review-text {
    font-size: 1rem;
    color: var(--text-body);
    line-height: 1.6;
    font-style: italic;
    margin-bottom: 30px;
    flex-grow: 1; /* Pushes the user profile to the bottom cleanly */
}
.rv-reviewer {
    display: flex;
    align-items: center;
    gap: 12px;
    border-top: 1px solid var(--border-soft);
    padding-top: 20px;
}
.rv-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 16px;
    overflow: hidden; /* Keeps the image inside the circle */
    background-color: #e2e8f0; /* Fallback color */
}
.rv-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Prevents squishing */
}
.rv-reviewer-info h5 {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--text-heading);
    margin: 0 0 2px 0;
}
.rv-reviewer-info span {
    font-size: 0.85rem;
    color: var(--text-body);
}

/* --- SECTION 9: FINAL CTA --- */
.rv-cta-bottom {
    padding: 0 0 100px 0;
    background-color: var(--bg-main);
}
.rv-cta-box {
    background: var(--emerald-dark);
    /* Soft noise texture overlay makes it look ultra premium */
    background-image: radial-gradient(circle at top right, rgba(16, 185, 129, 0.4) 0%, transparent 60%);
    border-radius: 24px;
    padding: 80px 40px;
    text-align: center;
    color: #ffffff;
    box-shadow: 0 25px 50px -12px rgba(4, 120, 87, 0.5);
}
.rv-cta-box h2 {
    font-size: clamp(2.25rem, 4vw, 3.5rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    margin-bottom: 20px;
    color: #ffffff;
}
.rv-cta-box p {
    font-size: 1.25rem;
    color: #d1fae5; /* Soft mint text to contrast against dark emerald */
    max-width: 600px;
    margin: 0 auto 40px auto;
    line-height: 1.6;
}
.rv-cta-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}
.rv-btn-primary-massive {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: #ffffff;
    color: var(--emerald-dark);
    padding: 20px 48px;
    border-radius: 12px;
    font-size: 20px;
    font-weight: 800;
    text-decoration: none;
    transition: all 0.2s ease;
    box-shadow: 0 10px 25px rgba(0,0,0,0.2);
}
.rv-btn-primary-massive:hover {
    transform: translateY(-2px);
    box-shadow: 0 15px 35px rgba(0,0,0,0.3);
    background: #f8fafc;
    color: var(--emerald-dark);
}
.rv-cta-guarantee {
    font-size: 0.9rem;
    color: #a7f3d0;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* --- ASTRA HEADER GLOBAL OVERRIDES --- */
/* Add a subtle blur and border to the header to make it look premium */
.ast-main-header-wrap {
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid #e2e8f0 !important;
}

/* Crisp, dark, bold typography for all standard nav links */
.main-header-menu > .menu-item > .menu-link {
    color: #0f172a !important;
    font-weight: 600 !important;
    font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 15px !important;
    letter-spacing: -0.01em !important;
    transition: color 0.2s ease !important;
}

/* Subtle emerald hover state for standard links */
.main-header-menu > .menu-item > .menu-link:hover {
    color: #10b981 !important;
}

/* --- THE "SIGN UP" BUTTON HIJACK (FIXED) --- */
.main-header-menu > .menu-item > a[href*="/register"] {
    background-color: #10b981 !important;
    color: #ffffff !important;
    padding: 12px 24px !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 10px -2px rgba(16, 185, 129, 0.4) !important;
    transition: all 0.2s ease !important;
    
    /* THE FIX FOR ASTRA'S STRETCHING */
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important; /* Overrides Astra's massive header line-height */
    height: max-content !important; /* Stops it from stretching */
    align-self: center !important; /* Keeps it vertically centered in the nav */
    margin-left: 12px !important;
}

/* Button Hover State */
.main-header-menu > .menu-item > a[href*="/register"]:hover {
    background-color: #047857 !important;
    box-shadow: 0 6px 15px -2px rgba(16, 185, 129, 0.5) !important;
    transform: translateY(-1px) !important;
    color: #ffffff !important;
}

/* --- SECTION 7.5: HOW IT WORKS (1-2-3 FLOW) --- */
.rv-how-it-works-section {
    padding: 100px 0;
    background-color: #ffffff;
    border-top: 1px solid var(--border-soft);
}

.rv-step-wrapper {
    position: relative;
    max-width: 1000px;
    margin: 60px auto 0 auto;
}

/* The Horizontal Pipeline Line */
.rv-step-line {
    position: absolute;
    top: 24px; /* Centers it behind the step numbers */
    left: 10%;
    right: 10%;
    height: 4px;
    background: linear-gradient(90deg, #e2e8f0 0%, var(--emerald-main) 50%, #e2e8f0 100%);
    border-radius: 4px;
    z-index: 1;
}

.rv-step-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
    position: relative;
    z-index: 2;
}

.rv-step-card {
    background: #ffffff;
    border: 1px solid var(--border-soft);
    border-radius: 16px;
    padding: 32px 24px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.rv-step-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px -5px rgba(0,0,0,0.08);
}

/* Highlight the middle (Dynamic) step */
.rv-step-active {
    border: 2px solid var(--emerald-main);
    box-shadow: 0 15px 30px -5px rgba(16, 185, 129, 0.15);
    transform: scale(1.02); /* Makes it pop slightly more */
}
.rv-step-active:hover {
    transform: scale(1.02) translateY(-5px);
}

.rv-step-number {
    width: 48px;
    height: 48px;
    background: #f8fafc;
    border: 2px solid var(--border-soft);
    color: var(--text-heading);
    font-size: 20px;
    font-weight: 800;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
    /* Covers the line behind it cleanly */
    box-shadow: 0 0 0 10px #ffffff; 
}

/* The active step number gets the emerald background */
.rv-step-active .rv-step-number {
    background: var(--emerald-main);
    border-color: var(--emerald-main);
    color: #ffffff;
    box-shadow: 0 0 0 10px #ffffff, 0 0 20px rgba(16, 185, 129, 0.4);
}

.rv-step-card h3 {
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--text-heading);
    margin-bottom: 16px;
}

.rv-step-desc {
    font-size: 0.95rem;
    color: var(--text-body);
    line-height: 1.6;
    margin-bottom: 24px;
}

/* Dynamic list inside Step 2 */
.rv-step-dynamic-list {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
    text-align: left;
    background: var(--bg-alt);
    border-radius: 8px;
    padding: 16px;
    border: 1px solid var(--border-soft);
}
.rv-step-dynamic-list li {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text-heading);
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.rv-step-dynamic-list li:last-child {
    margin-bottom: 0;
}
.rv-step-dynamic-list li i {
    font-size: 14px;
    width: 16px;
    text-align: center;
}

/* Little UI hints for Step 1 and 3 */
.rv-step-meta {
    margin-top: auto; /* Pushes it to the bottom */
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--emerald-main);
    text-transform: uppercase;
    letter-spacing: 1px;
    background: var(--emerald-soft);
    padding: 6px 12px;
    border-radius: 20px;
}

/* --- SECTION 8.5: PRICING ANCHOR --- */
.rv-pricing-anchor {
    padding: 0 0 60px 0; /* Flows naturally out of the testimonials */
    background-color: var(--bg-main);
}
.rv-anchor-box {
    background: #f8fafc;
    border: 1px solid var(--border-soft);
    border-radius: 16px;
    padding: 40px 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    box-shadow: 0 10px 25px -5px rgba(0,0,0,0.02);
}
.rv-anchor-text {
    max-width: 600px;
}
.rv-anchor-text h2 {
    font-size: clamp(1.75rem, 3vw, 2.25rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--text-heading);
    margin-bottom: 12px;
}
.rv-anchor-text p {
    font-size: 1.1rem;
    color: var(--text-body);
    line-height: 1.6;
    margin-bottom: 16px;
}
.rv-anchor-text p strong {
    color: var(--text-heading);
    font-weight: 700;
}
.rv-anchor-metric {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--emerald-soft);
    color: var(--emerald-dark);
    padding: 8px 16px;
    border-radius: 8px;
    font-size: 0.95rem;
    font-weight: 600;
}
.rv-anchor-metric i {
    color: var(--emerald-main);
}
.rv-btn-outline-dark {
    display: inline-block;
    background: transparent;
    color: var(--text-heading);
    border: 2px solid #cbd5e1;
    padding: 16px 32px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.2s ease;
    white-space: nowrap;
}
.rv-btn-outline-dark:hover {
    border-color: var(--text-heading);
    background: var(--text-heading);
    color: #ffffff;
}

.rv-metric-group {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 12px;
}
.rv-metric-scale {
    background: #f1f5f9; /* Slate background to contrast the emerald one */
    color: var(--text-heading);
    border: 1px solid var(--border-soft);
}
.rv-metric-scale i {
    color: var(--text-body);
}
.rv-anchor-subtext {
    font-size: 0.85rem;
    color: #64748b;
    font-weight: 500;
    font-style: italic;
}

/* --- SECTION 3.5: THE DATA REALITY CHECK --- */
.rv-data-truth-section {
    padding: 120px 0;
    background-color: #0f172a; /* Deep slate background makes it pop */
    color: #f8fafc;
    border-top: 1px solid var(--border-soft);
    border-bottom: 1px solid var(--border-soft);
}
.rv-truth-header {
    text-align: center;
    max-width: 800px;
    margin: 0 auto 60px auto;
}
.rv-truth-header h2 {
    font-size: clamp(2rem, 3.5vw, 3rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: #ffffff;
    margin-bottom: 20px;
}
.rv-truth-header p {
    font-size: 1.15rem;
    color: #94a3b8;
    line-height: 1.6;
}
.rv-truth-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}
.rv-truth-card {
    background: #1e293b;
    border: 1px solid #334155;
    border-radius: 16px;
    padding: 40px 32px;
    position: relative;
    transition: transform 0.2s ease, border-color 0.2s ease;
    display: flex;
    flex-direction: column;
}
.rv-truth-card:hover {
    transform: translateY(-5px);
}
.rv-card-emerald:hover { border-color: var(--emerald-main); box-shadow: 0 10px 30px -10px rgba(16,185,129,0.2); }
.rv-card-blue:hover { border-color: var(--blue-main); box-shadow: 0 10px 30px -10px rgba(59,130,246,0.2); }
.rv-card-orange:hover { border-color: var(--orange-main); box-shadow: 0 10px 30px -10px rgba(245, 158, 11, 0.2); }

.rv-truth-icon {
    font-size: 28px;
    margin-bottom: 20px;
}
.rv-truth-card h4 {
    font-size: 1.35rem;
    font-weight: 800;
    color: #ffffff;
    margin-bottom: 12px;
}
.rv-cost-badge {
    display: inline-block;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    padding: 6px 12px;
    border-radius: 6px;
    margin-bottom: 20px;
    width: max-content;
}
.rv-card-emerald .rv-cost-badge { background: rgba(16, 185, 129, 0.15); color: #a7f3d0; border: 1px solid rgba(16,185,129,0.3); }
.rv-card-blue .rv-cost-badge { background: rgba(59, 130, 246, 0.15); color: #bfdbfe; border: 1px solid rgba(59,130,246,0.3); }
.rv-card-orange .rv-cost-badge { background: rgba(245, 158, 11, 0.15); color: #f59e0b; border: 1px solid rgba(245, 158, 11, 0.3); }

.rv-truth-card p {
    font-size: 0.95rem;
    line-height: 1.6;
    color: #cbd5e1;
    margin-bottom: 0;
    flex-grow: 1;
}

/* Force 4 Columns for the Bundles */
.rv-bundle-grid-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

/* Make sure the card acts as a proper flex column */
.rv-obj-card {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* The Read More Text Container */
.rv-bundle-desc {
    position: relative;
    max-height: 80px; /* Shows about 3-4 lines */
    overflow: hidden;
    transition: max-height 0.3s ease-in-out;
    font-size: 0.9rem;
    line-height: 1.5;
    color: var(--text-body);
    margin-bottom: 5px;
}
.rv-bundle-desc.expanded {
    max-height: 1000px; /* Arbitrary large height to let it unfold */
}

/* The fade-out gradient at the bottom of the text */
.rv-bundle-desc::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40px;
    background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1));
    pointer-events: none;
    transition: opacity 0.3s ease;
}
.rv-bundle-desc.expanded::after {
    opacity: 0;
}

/* The Toggle Button */
.rv-read-more-btn {
    background: none;
    border: none;
    color: var(--emerald-main);
    font-size: 0.85rem;
    font-weight: 700;
    cursor: pointer;
    padding: 0;
    margin-bottom: 20px;
    text-align: left;
    display: inline-block;
}
.rv-read-more-btn:hover {
    text-decoration: underline;
}

/* Button Centering Fix */
.rv-card-action-area {
    margin-top: auto; /* Pushes this container to the absolute bottom of the card */
    width: 100%;
    text-align: center;
}
.rv-card-action-area .rv-btn-primary-solid, 
.rv-card-action-area .rv-btn-outline-dark {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
}

/* --- POST PURCHASE FLOW SECTION --- */
.rv-flow-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    position: relative;
}

/* Optional: Creates a connecting line behind the icons on desktop */
.rv-flow-grid::before {
    content: '';
    position: absolute;
    top: 32px;
    left: 10%;
    right: 10%;
    height: 2px;
    background: var(--border-soft);
    z-index: 1;
}

.rv-flow-step {
    background: #ffffff;
    position: relative;
    z-index: 2;
    text-align: center;
    padding: 0 10px;
}

.rv-step-icon {
    width: 64px;
    height: 64px;
    background: #f8fafc;
    border: 2px solid var(--emerald-main);
    color: var(--emerald-main);
    font-size: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 24px auto;
    box-shadow: 0 0 0 10px #ffffff; /* Clears the line behind it */
    transition: transform 0.3s ease, background 0.3s ease, color 0.3s ease;
}

.rv-flow-step:hover .rv-step-icon {
    background: var(--emerald-main);
    color: #ffffff;
    transform: translateY(-5px);
    box-shadow: 0 10px 20px -5px rgba(16, 185, 129, 0.4), 0 0 0 10px #ffffff;
}

.rv-flow-step h3 {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--text-heading);
    margin-bottom: 12px;
}

.rv-flow-step p {
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--text-body);
}

/* Add to UTILITIES in homepage.css */
.rv-inline-feature {
    background: var(--blue-soft);
    color: var(--blue-main);
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 0.9em;
    font-weight: 700;
    white-space: nowrap;
}

/* --- SECTION 6.1: INFRASTRUCTURE CALLOUT --- */
.rv-infrastructure-callout {
    display: flex;
    align-items: center;
    gap: 16px;
    background: #ffffff;
    border: 1px solid var(--emerald-main);
    border-radius: 12px;
    padding: 16px 20px;
    margin-top: 28px;
    box-shadow: 0 4px 15px -5px rgba(16, 185, 129, 0.15);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.rv-infrastructure-callout:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px -5px rgba(16, 185, 129, 0.25);
}

.rv-callout-icon {
    width: 44px;
    height: 44px;
    background: var(--emerald-soft);
    color: var(--emerald-main);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    flex-shrink: 0;
}

.rv-callout-text {
    font-size: 0.95rem;
    color: var(--text-body);
    line-height: 1.5;
}

.rv-callout-text strong {
    color: var(--emerald-dark);
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: -0.01em;
}

/* --- SECTION 6.5: ACCELERATOR BANNER --- */
.rv-accelerator-section {
    padding: 0 0 100px 0; /* 0 on top because Section 6B already has bottom padding */
}

.rv-accelerator-card {
    background: linear-gradient(135deg, var(--emerald-dark) 0%, #064e3b 100%);
    border-radius: 20px;
    padding: 48px 56px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    box-shadow: 0 20px 25px -5px rgba(4, 120, 87, 0.25);
}

.rv-accelerator-content h3 {
    font-size: clamp(1.5rem, 2.5vw, 1.85rem);
    font-weight: 800;
    color: #ffffff;
    margin-bottom: 12px;
    letter-spacing: -0.01em;
}

.rv-accelerator-content p {
    font-size: 1.1rem;
    line-height: 1.6;
    color: #d1fae5;
    margin: 0;
    max-width: 650px;
}

.rv-accelerator-content p strong {
    color: #ffffff;
    font-weight: 700;
}

.rv-accelerator-action {
    flex-shrink: 0;
}

/* Inverted button for the dark background */
.rv-btn-inverted {
    background: #ffffff !important;
    color: var(--emerald-dark) !important;
    box-shadow: 0 10px 20px rgba(0,0,0,0.1) !important;
}

.rv-btn-inverted:hover {
    background: #f8fafc !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 15px 30px rgba(0,0,0,0.2) !important;
}

/* --- SECTION 8.5: FOUNDER DEALS / LIFETIME PASSES --- */
.rv-founder-deals-wrapper {
    max-width: 900px;
    margin: 0 auto;
}

.rv-founder-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.rv-founder-card {
    background: #ffffff;
    border: 1px solid var(--border-soft);
    border-radius: 16px;
    padding: 40px 32px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
    position: relative;
    display: flex;
    flex-direction: column;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.rv-founder-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px -5px rgba(0,0,0,0.1);
}

.rv-founder-premium {
    background: linear-gradient(135deg, var(--emerald-dark) 0%, #064e3b 100%);
    border-color: var(--emerald-dark);
}

.rv-founder-badge {
    position: absolute;
    top: -12px;
    right: 32px;
    background: var(--amber-main);
    color: #ffffff;
    font-size: 0.75rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 6px 16px;
    border-radius: 20px;
    box-shadow: 0 4px 10px rgba(245, 158, 11, 0.3);
}

.rv-founder-price {
    font-size: 3rem;
    font-weight: 800;
    color: var(--text-heading);
    margin-bottom: 16px;
    line-height: 1;
    letter-spacing: -0.03em;
}

.rv-price-period {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text-body);
    letter-spacing: 0;
}

.rv-founder-card h4 {
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--text-heading);
    margin-bottom: 12px;
}

.rv-founder-card p {
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--text-body);
    margin-bottom: 32px;
    flex-grow: 1;
}

.rv-btn-full {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
}

/* --- SECTION 8.5: UNIFIED CHECKOUT TERMINAL --- */
.rv-unified-checkout {
    padding: 100px 0;
    background: var(--emerald-dark);
    background-image: radial-gradient(circle at top right, rgba(16, 185, 129, 0.4) 0%, transparent 60%);
    border-radius: 24px 24px 0 0; /* Rounds the top, flat on bottom connecting to footer */
    color: #ffffff;
    box-shadow: 0 -10px 30px rgba(0,0,0,0.05);
}

.rv-checkout-header {
    text-align: center;
    max-width: 800px;
    margin: 0 auto 60px auto;
}

.rv-checkout-header h2 {
    font-size: clamp(2.25rem, 4vw, 3.5rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    margin-bottom: 20px;
    color: #ffffff;
}

.rv-checkout-lead {
    font-size: 1.25rem;
    color: #d1fae5;
    margin: 0 auto 30px auto;
    line-height: 1.6;
}

.rv-checkout-lead strong {
    color: #ffffff;
}

.rv-checkout-metrics {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 30px;
}

.rv-checkout-metric {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(255,255,255,0.1);
    color: #ffffff;
    padding: 8px 20px;
    border-radius: 30px;
    font-size: 0.95rem;
    font-weight: 600;
    border: 1px solid rgba(255,255,255,0.2);
}

.rv-checkout-metric i {
    color: var(--emerald-main);
}

.rv-margin-bottom-medium {
    margin-bottom: 40px;
}

/* Light Outline Button for Dark Background */
.rv-btn-outline-light {
    display: inline-block;
    background: transparent;
    color: #ffffff;
    border: 2px solid rgba(255,255,255,0.5);
    padding: 14px 32px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.2s ease;
}

.rv-btn-outline-light:hover {
    border-color: #ffffff;
    background: #ffffff;
    color: var(--emerald-dark);
}

/* Grid & Cards */
.rv-founder-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    max-width: 950px;
    margin: 0 auto;
}

.rv-card-light {
    background: #ffffff;
    color: var(--text-body);
}

.rv-card-light h4, .rv-card-light .rv-founder-price {
    color: var(--text-heading);
}

.rv-founder-premium {
    background: linear-gradient(135deg, #10b981 0%, #047857 100%); /* Lighter emerald to stand out from background */
    border: 1px solid #34d399;
    color: #ffffff;
}

.rv-founder-premium h4, .rv-founder-premium .rv-founder-price {
    color: #ffffff;
}

.rv-founder-premium p {
    color: #d1fae5;
}

.rv-founder-premium .rv-price-period {
    color: #a7f3d0;
}

/* Guarantee Footer */
.rv-checkout-footer {
    text-align: center;
    margin-top: 40px;
}

.rv-cta-guarantee {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
    color: #a7f3d0;
    font-weight: 500;
}

/* Ensure full width button centering */
.rv-btn-full {
    display: flex;
    justify-content: center;
    width: 100%;
}

/* --- 1. HANDLE THE ICON SWAP (Hamburger to X) --- */
.main-header-menu-toggle .ast-close-svg { 
    display: none !important; 
}
.main-header-menu-toggle.toggled .ast-menu-svg { 
    display: none !important; 
}
.main-header-menu-toggle.toggled .ast-close-svg { 
    display: block !important; 
}

/* --- 2. HANDLE THE DROPDOWN MENU --- */
.ast-mobile-header-content {
    display: none !important;
    position: absolute !important;
    top: 100% !important; /* Forces it to open directly below the header */
    left: 0 !important;
    width: 100% !important;
    background-color: #ffffff !important;
    z-index: 9999 !important; /* Forces it on top of your dark slate sidebar */
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

/* Show the menu when the JS adds our active class */
.ast-mobile-header-content.reachvortex-mobile-menu-active {
    display: block !important;
}

/* =========================================================
   REACH VORTEX - MASTER RESPONSIVE CSS
   Consolidated Breakpoints (1200px -> 600px)
   ========================================================= */

/* --- GLOBAL KEYFRAMES --- */
@keyframes pulseLight {
    0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4); }
    70% { box-shadow: 0 0 0 8px rgba(16, 185, 129, 0); }
    100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
}

/* --- 1200px: DESKTOP FALLBACKS --- */
@media (max-width: 1200px) {
    .rv-bundle-grid-4 { grid-template-columns: repeat(2, 1fr); }
}

/* --- 1024px: TABLET BREAKPOINT --- */
@media (max-width: 1024px) {
    /* Collapse 3 & 4 Column Grids to 2 Columns */
    .rv-truth-grid,
    .rv-obj-grid,
    .rv-grid-3,
    .rv-grid-4,
    .rv-testimonial-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }

    /* Flow Grid & Lines */
    .rv-flow-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 50px 30px;
    }
    .rv-flow-grid::before { display: none; }

    /* Showcase Split Layouts */
    .rv-split-layout, 
    .rv-split-layout:has(> .rv-showcase-visual:first-child) {
        grid-template-columns: 1fr;
        gap: 50px;
    }
    .rv-reverse-mobile .rv-showcase-visual { order: 2; }
    .rv-reverse-mobile .rv-showcase-content { order: 1; }
}

/* --- 990px: SMALL TABLET / LARGE MOBILE --- */
@media (max-width: 990px) {
    .rv-feature-split { grid-template-columns: 1fr; }
    .rv-floating-stat-card-light { left: 20px; bottom: -20px; }
    
    .rv-hero-viewport {
        min-height: 80vh;
        padding: 60px 0;
    }

    .rv-accelerator-card {
        flex-direction: column;
        text-align: center;
        padding: 40px 32px;
    }
    .rv-accelerator-content p { margin: 0 auto; }

    .rv-anchor-box {
        flex-direction: column;
        text-align: center;
        padding: 40px 24px;
    }
    .rv-anchor-action { width: 100%; }
    .rv-btn-outline-dark { width: 100%; text-align: center; }
}

/* --- 921px: MOBILE NAVIGATION FIXES --- */
@media (max-width: 921px) {
    .main-header-menu > .menu-item > a[href*="/register"] {
        margin-left: 0 !important;
        margin-top: 10px !important;
        margin-bottom: 10px !important;
        width: auto !important;
        display: inline-block !important;
    }
    .ast-builder-menu-mobile .main-navigation {
        background-color: #ffffff !important;
        border-top: 1px solid #e2e8f0 !important;
    }
    
    /* Step Builder Layout */
    .rv-step-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    .rv-step-active { transform: none; }
    .rv-step-active:hover { transform: translateY(-5px); }
    .rv-step-line { display: none; }
}

/* --- 768px: MASTER MOBILE BREAKPOINT --- */
@media (max-width: 768px) {
    /* 1. Master Grid Override (Forces strict 1-column on main grids) */
    .rv-truth-grid,
    .rv-obj-grid, 
    .rv-grid-3,
    .rv-grid-4 {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    /* 2. Standard 1-Column Fallbacks */
    .rv-founder-grid,
    .rv-bundle-grid-4,
    .rv-testimonial-grid {
        grid-template-columns: 1fr;
    }

    /* 3. Padding & Spacing Optimizations */
    .rv-data-truth-section { padding: 80px 0 !important; }
    .rv-truth-card, .rv-persona-card { padding: 30px 24px !important; }
    .rv-obj-category { padding: 24px !important; }
    .rv-cta-box { padding: 50px 24px; }
    .rv-truth-header { margin-bottom: 40px; }

  	/* General Section Padding Override (Shrinks massive desktop whitespace) */
    .rv-feature-clean,
    .rv-pillars-section,
    .rv-showcase-section,
    .rv-pipeline-matrix,
    .rv-use-cases-section,
    .rv-how-it-works-section,
    .rv-unified-checkout {
        padding: 60px 0 !important;
    }

    /* Asymmetrical Section Padding */
    .rv-testimonials-section {
        padding: 60px 0 80px 0 !important;
    }
    .rv-cta-bottom,
    .rv-accelerator-section {
        padding: 0 0 60px 0 !important;
    }

    /* Header Margin Overrides */
    .rv-section-header-center,
    .rv-checkout-header {
        margin-bottom: 40px !important;
    }
    /* 4. Component Fixes */
    .rv-founder-badge {
        right: auto;
        left: 50%;
        transform: translateX(-50%);
    }
    .rv-btn-primary-massive {
        width: 100%;
        justify-content: center;
        padding: 16px 24px;
        font-size: 18px;
    }
    .rv-hero-viewport {
        min-height: 60vh;
        padding: 60px 0;
    }  
}

/* --- 600px: COMPACT MOBILE --- */
@media (max-width: 600px) {
    .rv-flow-grid { grid-template-columns: 1fr; }
    
    .rv-accelerator-card { padding: 32px 24px; }
    .rv-accelerator-action { width: 100%; }
    
    .rv-btn-inverted {
        width: 100%;
        justify-content: center;
    }
    .rv-hero-viewport {
        min-height: 50vh;
        padding: 60px 0;
    }  
}