/*
 Theme Name:   Script1 Child Theme
 Theme URI:    https://script1.com
 Description:  AI-native dark theme for Script1 marketplace. Complete edition with global styling + homepage components.
 Author:       Script1
 Author URI:   https://script1.com
 Template:     Divi
 Version:      2.1.0
 License:      GPL v2 or later
 Text Domain:  script1-child
*/


/* ============================================================================
   CSS VARIABLES - Used throughout the theme
   ============================================================================ */

:root {
    --s1-void: #0a0a0f;
    --s1-deep: #12121a;
    --s1-surface: #1a1a24;
    --s1-elevated: #242430;
    --s1-border: #2a2a38;
    --s1-text: #e8e8f0;
    --s1-muted: #8888a0;
    --s1-accent: #00d4aa;
    --s1-purple: #a855f7;
    --s1-pink: #ec4899;
    --s1-blue: #3b82f6;
    --s1-warning: #ffaa00;
    --s1-red: #ef4444;
    --s1-green: #22c55e;
}


/* ============================================================================
   PART 1: GLOBAL DARK BACKGROUND - Applies to ENTIRE site automatically
   ============================================================================ */

html,
body,
#page-container,
#et-main-area,
#main-content,
.et_builder_inner_content,
.page-template-default,
.page-template-blank {
    background-color: var(--s1-void) !important;
}

/* Divi sections default to transparent so dark shows through */
.et_pb_section {
    background-color: transparent;
}

/* Default text color */
body,
#page-container {
    color: var(--s1-text);
}


/* ============================================================================
   PART 2: GLOBAL GRID OVERLAY (via body pseudo-element)
   ============================================================================ */

body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: 
        linear-gradient(rgba(0, 212, 170, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 212, 170, 0.03) 1px, transparent 1px);
    background-size: 60px 60px;
    pointer-events: none;
    z-index: 0;
}

#page-container {
    position: relative;
    z-index: 1;
}

/* Alternative grid overlay for Code Module */
.s1-grid-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: 
        linear-gradient(rgba(0, 212, 170, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 212, 170, 0.03) 1px, transparent 1px);
    background-size: 60px 60px;
    pointer-events: none;
    z-index: 1 !important;
}


/* ============================================================================
   PART 3: SCRIPT1 CUSTOM NAVIGATION
   ============================================================================ */

/* Nav Section Container */
.s1-nav-section {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    z-index: 999999 !important;
    height: auto !important;
}

.s1-nav-section .et_pb_row {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    background: transparent !important;
}

.s1-nav-section .et_pb_column {
    padding: 0 !important;
    background: transparent !important;
}

.s1-nav-section .et_pb_code_inner {
    background: transparent !important;
}

.s1-nav-section .et_pb_row,
.s1-nav-section .et_pb_column,
.s1-nav-section .et_pb_module {
    padding: 0 !important;
    margin: 0 !important;
}

/* Nav Bar Styles */
.s1-nav {
    position: relative;
    width: 100%;
    padding: 1rem 2rem;
    background: rgba(10, 10, 15, 0.9);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--s1-border);
}

.s1-nav-inner {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.s1-nav-logo {
    font-family: 'Fraunces', serif;
    font-size: 1.5rem;
    font-weight: 900;
    color: var(--s1-text);
}

.s1-nav-logo span {
    background: linear-gradient(135deg, var(--s1-accent) 0%, var(--s1-purple) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.s1-nav-links {
    display: flex;
    list-style: none;
    gap: 2rem;
    margin: 0;
    padding: 0;
}

.s1-nav-links li {
    margin: 0;
    padding: 0;
}

.s1-nav-links a {
    color: var(--s1-muted) !important;
    text-decoration: none !important;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 0.9rem;
    font-weight: 500;
    transition: color 0.3s ease;
}

.s1-nav-links a:hover {
    color: var(--s1-accent) !important;
}

.s1-nav-cta {
    padding: 0.6rem 1.5rem;
    background: var(--s1-accent);
    color: var(--s1-void) !important;
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 600;
    font-size: 0.9rem;
    text-decoration: none !important;
    transition: all 0.3s ease;
    border: none;
}

.s1-nav-cta:hover {
    background: var(--s1-text);
    transform: translateY(-2px);
    box-shadow: 0 10px 30px rgba(0, 212, 170, 0.4);
}

/* Hamburger Button */
.s1-nav-toggle {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 30px;
    height: 30px;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
}

.s1-nav-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    background: var(--s1-text);
    transition: all 0.3s ease;
}

/* Hide Divi default header on homepage (if using custom nav) */
.s1-hide-header #main-header {
    display: none !important;
}

/* Admin bar adjustment */
.admin-bar .s1-nav-section {
    top: 32px !important;
}

@media (max-width: 782px) {
    .admin-bar .s1-nav-section {
        top: 46px !important;
    }
}


/* ============================================================================
   PART 4: TYPOGRAPHY
   ============================================================================ */

body,
p,
.et_pb_text,
.et_pb_blurb_description {
    font-family: 'Space Grotesk', sans-serif;
    color: var(--s1-text);
    line-height: 1.7;
}

h1, h2, h3, h4, h5, h6,
.et_pb_module_header,
.et_pb_text h1,
.et_pb_text h2,
.et_pb_text h3,
.et_pb_text h4 {
    font-family: 'Fraunces', serif !important;
    color: var(--s1-text) !important;
    line-height: 1.2;
}

.s1-heading-display {
    font-family: 'Fraunces', serif !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
    color: var(--s1-text) !important;
}

.s1-heading-section {
    font-family: 'Fraunces', serif !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    color: var(--s1-text) !important;
}

.s1-text-mono {
    font-family: 'IBM Plex Mono', monospace !important;
}

/* Gradient text utility class */
.s1-gradient,
.s1-gradient-text {
    background: linear-gradient(135deg, var(--s1-accent) 0%, var(--s1-purple) 50%, var(--s1-pink) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.s1-accent-text {
    color: var(--s1-accent) !important;
}

.s1-muted-text {
    color: var(--s1-muted) !important;
}

/* Monospace text */
code,
pre,
.s1-mono {
    font-family: 'IBM Plex Mono', monospace !important;
}

.s1-section-label {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: var(--s1-accent);
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.s1-section-label::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--s1-border);
}


/* ============================================================================
   PART 5: HERO SECTION
   ============================================================================ */

.s1-hero-section {
    min-height: 100vh;
    background: 
        radial-gradient(ellipse at 50% 30%, rgba(0, 212, 170, 0.15) 0%, transparent 60%),
        radial-gradient(ellipse at 80% 80%, rgba(168, 85, 247, 0.1) 0%, transparent 50%),
        var(--s1-void) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: relative;
    padding: 140px 20px 80px !important;
}

.s1-hero-section .et_pb_row {
    padding-top: 0 !important;
}

.s1-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1.25rem;
    background: var(--s1-surface);
    border: 1px solid var(--s1-border);
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: var(--s1-accent);
    margin-bottom: 2rem;
}

.s1-hero-badge::before {
    content: '';
    width: 8px;
    height: 8px;
    background: var(--s1-accent);
    border-radius: 50%;
    animation: s1-blink 2s ease-in-out infinite;
}

@keyframes s1-blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}

.s1-hero-title {
    font-size: clamp(3rem, 8vw, 5.5rem) !important;
    margin-bottom: 0.5rem !important;
}

.s1-hero-slogan {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 1.1rem;
    color: var(--s1-accent);
    letter-spacing: 0.05em;
    margin-bottom: 1.5rem;
}

.s1-hero-subtitle {
    font-size: 1.35rem;
    color: var(--s1-muted);
    max-width: 650px;
    margin: 0 auto 3rem;
}

.s1-stats-row {
    display: flex;
    justify-content: center;
    gap: 3rem;
    flex-wrap: wrap;
}

.s1-stat {
    text-align: center;
}

.s1-stat-value {
    font-family: 'Fraunces', serif;
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--s1-accent);
    line-height: 1;
}

.s1-stat-label {
    font-size: 0.85rem;
    color: var(--s1-muted);
    margin-top: 0.5rem;
}


/* ============================================================================
   PART 6: PROBLEM SECTION
   ============================================================================ */

.s1-problem-section {
    background: var(--s1-deep) !important;
    border-top: 1px solid var(--s1-border);
    border-bottom: 1px solid var(--s1-border);
    padding: 100px 0 !important;
}

.s1-problem-card {
    background: var(--s1-surface);
    border: 1px solid var(--s1-border);
    padding: 2rem;
    position: relative;
    transition: all 0.3s ease;
    height: 100%;
}

.s1-problem-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, var(--s1-red), var(--s1-warning));
    opacity: 0;
    transition: opacity 0.3s ease;
}

.s1-problem-card:hover {
    transform: translateY(-4px);
    border-color: var(--s1-red);
}

.s1-problem-card:hover::before {
    opacity: 1;
}

.s1-problem-icon {
    width: 50px;
    height: 50px;
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    margin-bottom: 1.5rem;
}

.s1-problem-card h3 {
    font-size: 1.15rem;
    font-weight: 600;
    margin-bottom: 0.75rem;
    color: var(--s1-text);
}

.s1-problem-card p {
    color: var(--s1-muted);
    font-size: 0.95rem;
}

.s1-problem-fee {
    display: inline-block;
    margin-top: 1rem;
    padding: 0.4rem 0.8rem;
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.3);
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.8rem;
    color: var(--s1-red);
}


/* ============================================================================
   PART 7: SOLUTION SECTION
   ============================================================================ */

.s1-solution-section {
    background: var(--s1-void) !important;
    padding: 100px 0 !important;
}

.s1-solution-box {
    background: linear-gradient(135deg, rgba(0, 212, 170, 0.1) 0%, rgba(168, 85, 247, 0.1) 100%);
    border: 2px solid var(--s1-accent);
    padding: 4rem;
    text-align: center;
    position: relative;
}

.s1-solution-quote {
    font-family: 'Fraunces', serif;
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    font-weight: 700;
    margin-bottom: 1.5rem;
    line-height: 1.3;
    color: var(--s1-text);
}

.s1-solution-description {
    color: var(--s1-muted);
    max-width: 700px;
    margin: 0 auto;
    font-size: 1.1rem;
}


/* ============================================================================
   PART 8: BENEFITS SECTION
   ============================================================================ */

.s1-benefits-section {
    background: var(--s1-void) !important;
    padding: 100px 0 !important;
}

.s1-benefit-card {
    background: var(--s1-surface);
    border: 1px solid var(--s1-border);
    padding: 2rem;
    position: relative;
    transition: all 0.3s ease;
    height: 100%;
}

.s1-benefit-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, var(--s1-accent), var(--s1-purple));
    opacity: 0;
    transition: opacity 0.3s ease;
}

.s1-benefit-card:hover {
    transform: translateY(-4px);
    border-color: var(--s1-accent);
}

.s1-benefit-card:hover::before {
    opacity: 1;
}

.s1-benefit-icon {
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, var(--s1-accent), var(--s1-purple));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    margin-bottom: 1.5rem;
}

.s1-benefit-card h3 {
    font-size: 1.15rem;
    font-weight: 600;
    margin-bottom: 0.75rem;
    color: var(--s1-text);
}

.s1-benefit-card p {
    color: var(--s1-muted);
    font-size: 0.95rem;
}


/* ============================================================================
   PART 9: AI TOOLS SECTION
   ============================================================================ */

.s1-ai-section {
    background: var(--s1-deep) !important;
    border-top: 1px solid var(--s1-border);
    border-bottom: 1px solid var(--s1-border);
    padding: 100px 0 !important;
}

.s1-ai-tool {
    background: var(--s1-surface);
    border: 1px solid var(--s1-border);
    padding: 1.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    transition: all 0.3s ease;
    height: 100%;
}

.s1-ai-tool:hover {
    border-color: var(--s1-accent);
    transform: translateY(-2px);
}

.s1-ai-tool-icon {
    width: 45px;
    height: 45px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    flex-shrink: 0;
}

.s1-ai-tool-icon.claude {
    background: linear-gradient(135deg, #d97706, #ea580c);
}

.s1-ai-tool-icon.cursor {
    background: linear-gradient(135deg, #3b82f6, #8b5cf6);
}

.s1-ai-tool-icon.copilot {
    background: linear-gradient(135deg, #333333, #555555);
}

.s1-ai-tool-icon.windsurf {
    background: linear-gradient(135deg, #06b6d4, #0891b2);
}

.s1-ai-tool h4 {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--s1-text);
    margin-bottom: 0.25rem;
}

.s1-ai-tool p {
    font-size: 0.8rem;
    color: var(--s1-muted);
}

.s1-code-block {
    background: var(--s1-void);
    border: 1px solid var(--s1-border);
    padding: 1.5rem;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.85rem;
    overflow-x: auto;
    text-align: left;
}

.s1-code-block .comment {
    color: var(--s1-muted);
}

.s1-code-block .keyword {
    color: var(--s1-purple);
}

.s1-code-block .string {
    color: var(--s1-accent);
}

.s1-code-block .function {
    color: var(--s1-blue);
}


/* ============================================================================
   PART 10: PRICING SECTION
   ============================================================================ */

.s1-pricing-section {
    background: var(--s1-void) !important;
    padding: 100px 0 !important;
}

.s1-pricing-card {
    background: var(--s1-surface);
    border: 1px solid var(--s1-border);
    padding: 2rem;
    text-align: center;
    transition: all 0.3s ease;
    height: 100%;
}

.s1-pricing-card.featured {
    border-color: var(--s1-accent);
    background: linear-gradient(180deg, rgba(0, 212, 170, 0.05) 0%, var(--s1-surface) 100%);
    position: relative;
}

.s1-pricing-card.featured::before {
    content: 'POPULAR';
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    padding: 0.25rem 1rem;
    background: var(--s1-accent);
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    color: var(--s1-void);
}

.s1-pricing-card:hover {
    transform: translateY(-4px);
}

.s1-pricing-tier {
    font-size: 0.85rem;
    color: var(--s1-muted);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 0.5rem;
}

.s1-pricing-price {
    font-family: 'Fraunces', serif;
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--s1-text);
    margin-bottom: 0.25rem;
}

.s1-pricing-fee {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.85rem;
    color: var(--s1-accent);
}


/* ============================================================================
   PART 11: SIGNUP SECTION
   ============================================================================ */

.s1-signup-section {
    background: 
        radial-gradient(ellipse at 30% 50%, rgba(0, 212, 170, 0.1) 0%, transparent 50%),
        radial-gradient(ellipse at 70% 50%, rgba(168, 85, 247, 0.1) 0%, transparent 50%),
        var(--s1-void) !important;
    padding: 100px 0 !important;
}

.s1-signup-box {
    background: var(--s1-surface);
    border: 2px solid var(--s1-accent);
    padding: 3rem;
    position: relative;
    max-width: 700px;
    margin: 0 auto;
}

.s1-signup-box::before {
    content: '';
    position: absolute;
    inset: -2px;
    background: linear-gradient(135deg, var(--s1-accent), var(--s1-purple));
    z-index: -1;
    filter: blur(20px);
    opacity: 0.3;
}

.s1-signup-title {
    font-family: 'Fraunces', serif;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 1rem;
    color: var(--s1-text);
    text-align: center;
}

.s1-signup-subtitle {
    color: var(--s1-muted);
    margin-bottom: 2rem;
    text-align: center;
}

/* Gravity Forms Styling */
.s1-signup-box .gform_wrapper input[type="text"],
.s1-signup-box .gform_wrapper input[type="email"] {
    width: 100%;
    padding: 1rem 1.25rem;
    background: var(--s1-deep) !important;
    border: 1px solid var(--s1-border) !important;
    color: var(--s1-text) !important;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 1rem;
    margin-bottom: 1rem;
    border-radius: 0 !important;
}

.s1-signup-box .gform_wrapper input:focus {
    outline: none;
    border-color: var(--s1-accent) !important;
}

.s1-signup-box .gform_wrapper .gform_button,
.s1-signup-box .gform_wrapper input[type="submit"] {
    width: 100%;
    padding: 1rem 2rem;
    background: var(--s1-accent) !important;
    border: none !important;
    color: var(--s1-void) !important;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    border-radius: 0 !important;
}

.s1-signup-box .gform_wrapper .gform_button:hover,
.s1-signup-box .gform_wrapper input[type="submit"]:hover {
    background: var(--s1-text) !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 30px rgba(0, 212, 170, 0.4);
}

.s1-signup-box .gform_wrapper .gfield_label {
    display: none;
}

.s1-signup-perks {
    display: flex;
    justify-content: center;
    gap: 2rem;
    margin-top: 2rem;
    flex-wrap: wrap;
}

.s1-perk {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
    color: var(--s1-muted);
}

.s1-perk-icon {
    color: var(--s1-accent);
}

.s1-feature-compact {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 1rem;
    background: var(--s1-deep);
    border-left: 3px solid var(--s1-border);
    transition: all 0.3s ease;
    height: 100%;
}

.s1-feature-compact:hover {
    border-left-color: var(--s1-accent);
}

.s1-feature-compact-icon {
    color: var(--s1-accent);
    font-size: 1.25rem;
    flex-shrink: 0;
}

.s1-feature-compact h4 {
    font-size: 0.95rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
    color: var(--s1-text);
}

.s1-feature-compact p {
    font-size: 0.85rem;
    color: var(--s1-muted);
}


/* ============================================================================
   PART 12: SCRIPT1 FOOTER
   ============================================================================ */

.s1-footer {
    background: var(--s1-deep) !important;
    border-top: 1px solid var(--s1-border);
    padding: 60px 0 !important;
    text-align: center;
}

.s1-footer-logo {
    font-family: 'Fraunces', serif;
    font-size: 1.5rem;
    font-weight: 900;
    margin-bottom: 0.5rem;
    color: var(--s1-text);
}

.s1-footer-logo span {
    background: linear-gradient(135deg, var(--s1-accent) 0%, var(--s1-purple) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.s1-footer-tagline {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.85rem;
    color: var(--s1-accent);
    margin-bottom: 1rem;
}

.s1-footer-text {
    color: var(--s1-muted);
    font-size: 0.85rem;
}


/* ============================================================================
   PART 13: EQUAL HEIGHT CARDS
   ============================================================================ */

/* Problem Section Cards */
.s1-problem-section .et_pb_row {
    display: flex !important;
    flex-wrap: wrap !important;
}

.s1-problem-section .et_pb_column {
    display: flex !important;
}

.s1-problem-section .et_pb_module,
.s1-problem-section .et_pb_code_inner {
    width: 100% !important;
    height: 100% !important;
}

.s1-problem-card {
    min-height: 280px !important;
    display: flex !important;
    flex-direction: column !important;
}

.s1-problem-card p {
    flex-grow: 1 !important;
}

/* Benefits Section Cards */
.s1-benefits-section .et_pb_row {
    display: flex !important;
    flex-wrap: wrap !important;
}

.s1-benefits-section .et_pb_column {
    display: flex !important;
}

.s1-benefits-section .et_pb_module,
.s1-benefits-section .et_pb_code_inner {
    width: 100% !important;
    height: 100% !important;
}

.s1-benefit-card {
    min-height: 250px !important;
    display: flex !important;
    flex-direction: column !important;
}

.s1-benefit-card p {
    flex-grow: 1 !important;
}

/* AI Tools Section Cards */
.s1-ai-section .et_pb_row {
    display: flex !important;
    flex-wrap: wrap !important;
}

.s1-ai-section .et_pb_column {
    display: flex !important;
}

.s1-ai-section .et_pb_module,
.s1-ai-section .et_pb_code_inner {
    width: 100% !important;
    height: 100% !important;
}

.s1-ai-tool {
    min-height: 100px !important;
}

/* Pricing Section Cards */
.s1-pricing-section .et_pb_row {
    display: flex !important;
    flex-wrap: wrap !important;
}

.s1-pricing-section .et_pb_column {
    display: flex !important;
}

.s1-pricing-section .et_pb_module,
.s1-pricing-section .et_pb_code_inner {
    width: 100% !important;
    height: 100% !important;
}

.s1-pricing-card {
    min-height: 180px !important;
}

/* Signup Section Feature Cards */
.s1-signup-section .et_pb_row {
    display: flex !important;
    flex-wrap: wrap !important;
}

.s1-signup-section .et_pb_column {
    display: flex !important;
}

.s1-signup-section .et_pb_module,
.s1-signup-section .et_pb_code_inner {
    width: 100% !important;
    height: 100% !important;
}

.s1-feature-compact {
    min-height: 100px !important;
}


/* ============================================================================
   PART 14: DIVI NATIVE HEADER (for non-homepage)
   ============================================================================ */

#main-header,
#top-header,
.et-fixed-header #main-header {
    background: rgba(10, 10, 15, 0.95) !important;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--s1-border) !important;
    box-shadow: none !important;
}

/* Logo */
#logo {
    max-height: 45px;
}

/* Main menu links */
#et-top-navigation .et-menu > li > a,
.et_header_style_centered #et-top-navigation .et-menu > li > a,
#top-menu li a {
    color: var(--s1-muted) !important;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 0.9rem;
    font-weight: 500;
    transition: color 0.3s ease;
}

#et-top-navigation .et-menu > li > a:hover,
#et-top-navigation .et-menu > li.current-menu-item > a,
#top-menu li a:hover,
#top-menu li.current-menu-item a {
    color: var(--s1-accent) !important;
    opacity: 1;
}

/* Dropdown menus */
.nav li ul,
#top-menu li ul,
.et_mobile_menu {
    background: rgba(18, 18, 26, 0.98) !important;
    border: 1px solid var(--s1-border) !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4) !important;
}

.nav li ul li a,
#top-menu li ul li a {
    color: var(--s1-muted) !important;
    border-bottom: 1px solid var(--s1-border) !important;
}

.nav li ul li a:hover,
#top-menu li ul li a:hover {
    background: var(--s1-surface) !important;
    color: var(--s1-accent) !important;
}

/* Mobile menu */
.mobile_menu_bar::before,
.mobile_nav .mobile_menu_bar::before {
    color: var(--s1-text) !important;
}

.et_mobile_menu {
    background: rgba(10, 10, 15, 0.98) !important;
    border-top: 1px solid var(--s1-border) !important;
}

.et_mobile_menu li a {
    color: var(--s1-muted) !important;
    border-bottom: 1px solid var(--s1-border) !important;
    font-family: 'Space Grotesk', sans-serif;
}

.et_mobile_menu li a:hover {
    color: var(--s1-accent) !important;
    background: var(--s1-surface) !important;
}

/* CTA Button in menu - add class 'menu-cta' to menu item */
.et-menu .menu-cta > a,
#top-menu .menu-cta > a {
    padding: 0.6rem 1.5rem !important;
    background: var(--s1-accent) !important;
    color: var(--s1-void) !important;
    font-weight: 600 !important;
    margin-left: 1rem;
}

.et-menu .menu-cta > a:hover,
#top-menu .menu-cta > a:hover {
    background: var(--s1-text) !important;
    color: var(--s1-void) !important;
}

/* Search icon */
#et_search_icon::before {
    color: var(--s1-muted) !important;
}

#et_search_icon:hover::before {
    color: var(--s1-accent) !important;
}


/* ============================================================================
   PART 15: DIVI NATIVE FOOTER
   ============================================================================ */

#footer-widgets,
#main-footer,
#footer-bottom {
    background: var(--s1-deep) !important;
}

#footer-widgets {
    border-top: 1px solid var(--s1-border);
    padding: 60px 0 !important;
}

#footer-widgets .footer-widget {
    color: var(--s1-muted) !important;
}

#footer-widgets .footer-widget h4,
#footer-widgets .footer-widget .title {
    color: var(--s1-text) !important;
    font-family: 'Fraunces', serif;
}

#footer-widgets .footer-widget a {
    color: var(--s1-muted) !important;
}

#footer-widgets .footer-widget a:hover {
    color: var(--s1-accent) !important;
}

#footer-widgets .footer-widget li {
    border-bottom: 1px solid var(--s1-border);
}

#footer-bottom {
    background: var(--s1-void) !important;
    border-top: 1px solid var(--s1-border) !important;
}

#footer-info,
#footer-bottom .et-social-icons a {
    color: var(--s1-muted) !important;
}


/* ============================================================================
   PART 16: DIVI MODULES - All styled dark automatically
   ============================================================================ */

/* --- Text Module --- */
.et_pb_text {
    color: var(--s1-text);
}

.et_pb_text a {
    color: var(--s1-accent);
}

.et_pb_text a:hover {
    color: var(--s1-purple);
}

/* --- Blurb Module --- */
.et_pb_blurb {
    background: transparent;
}

.et_pb_blurb_content {
    color: var(--s1-muted);
}

.et_pb_blurb h4,
.et_pb_blurb h4 a {
    color: var(--s1-text) !important;
}

.et_pb_blurb_container .et_pb_main_blurb_image .et-pb-icon {
    color: var(--s1-accent) !important;
}

/* --- Button Module --- */
.et_pb_button,
.et_pb_button_module_wrapper .et_pb_button {
    background: var(--s1-accent) !important;
    color: var(--s1-void) !important;
    border: none !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-weight: 600 !important;
    padding: 0.8rem 2rem !important;
    transition: all 0.3s ease !important;
    border-radius: 0 !important;
}

.et_pb_button:hover,
.et_pb_button_module_wrapper .et_pb_button:hover {
    background: var(--s1-text) !important;
    color: var(--s1-void) !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 30px rgba(0, 212, 170, 0.3);
}

/* Secondary button style */
.et_pb_button.s1-secondary {
    background: transparent !important;
    border: 2px solid var(--s1-accent) !important;
    color: var(--s1-accent) !important;
}

.et_pb_button.s1-secondary:hover {
    background: var(--s1-accent) !important;
    color: var(--s1-void) !important;
}

/* --- Divider Module --- */
.et_pb_divider::before,
.et_pb_divider_internal {
    border-color: var(--s1-border) !important;
}

/* --- Accordion Module --- */
.et_pb_accordion .et_pb_toggle {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
    margin-bottom: 10px;
}

.et_pb_accordion .et_pb_toggle_open {
    border-color: var(--s1-accent) !important;
}

.et_pb_accordion .et_pb_toggle_title {
    color: var(--s1-text) !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-weight: 600;
}

.et_pb_accordion .et_pb_toggle_title::before {
    color: var(--s1-accent) !important;
}

.et_pb_accordion .et_pb_toggle_content {
    color: var(--s1-muted) !important;
    background: var(--s1-surface) !important;
}

/* --- Tabs Module --- */
.et_pb_tabs {
    background: transparent !important;
    border: none !important;
}

.et_pb_tabs_controls {
    background: var(--s1-deep) !important;
}

.et_pb_tabs_controls li {
    background: var(--s1-deep) !important;
    border: 1px solid var(--s1-border) !important;
}

.et_pb_tabs_controls li.et_pb_tab_active {
    background: var(--s1-surface) !important;
    border-bottom-color: var(--s1-surface) !important;
}

.et_pb_tabs_controls li a {
    color: var(--s1-muted) !important;
    font-family: 'Space Grotesk', sans-serif !important;
}

.et_pb_tabs_controls li.et_pb_tab_active a {
    color: var(--s1-accent) !important;
}

.et_pb_all_tabs {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
    border-top: none !important;
}

.et_pb_tab {
    color: var(--s1-muted) !important;
}

/* --- Pricing Table Module --- */
.et_pb_pricing_table {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
}

.et_pb_pricing_heading {
    background: var(--s1-deep) !important;
    border-bottom: 1px solid var(--s1-border) !important;
}

.et_pb_pricing_title {
    color: var(--s1-text) !important;
}

.et_pb_best_value {
    color: var(--s1-accent) !important;
}

.et_pb_pricing_content_top {
    border-bottom: 1px solid var(--s1-border) !important;
}

.et_pb_et_price .et_pb_sum {
    color: var(--s1-accent) !important;
    font-family: 'Fraunces', serif !important;
}

.et_pb_pricing li {
    color: var(--s1-muted) !important;
    border-bottom: 1px solid var(--s1-border) !important;
}

.et_pb_pricing li::before {
    color: var(--s1-accent) !important;
}

/* Featured pricing table */
.et_pb_featured_table {
    border-color: var(--s1-accent) !important;
}

.et_pb_featured_table .et_pb_pricing_heading {
    background: linear-gradient(180deg, rgba(0, 212, 170, 0.1) 0%, var(--s1-deep) 100%) !important;
}

/* --- Contact Form Module --- */
.et_pb_contact_form input,
.et_pb_contact_form textarea,
.et_pb_contact_form select {
    background: var(--s1-deep) !important;
    border: 1px solid var(--s1-border) !important;
    color: var(--s1-text) !important;
    font-family: 'Space Grotesk', sans-serif !important;
    padding: 12px 16px !important;
}

.et_pb_contact_form input:focus,
.et_pb_contact_form textarea:focus {
    border-color: var(--s1-accent) !important;
    outline: none !important;
}

.et_pb_contact_form label {
    color: var(--s1-muted) !important;
}

.et_pb_contact_form input::placeholder,
.et_pb_contact_form textarea::placeholder {
    color: var(--s1-muted) !important;
}

/* --- Blog Module --- */
.et_pb_blog_grid .et_pb_post,
.et_pb_posts .et_pb_post {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
}

.et_pb_post .entry-title,
.et_pb_post .entry-title a {
    color: var(--s1-text) !important;
}

.et_pb_post .entry-title a:hover {
    color: var(--s1-accent) !important;
}

.et_pb_post .post-meta,
.et_pb_post .post-meta a {
    color: var(--s1-muted) !important;
}

.et_pb_post .post-content {
    color: var(--s1-muted) !important;
}

/* --- Testimonial Module --- */
.et_pb_testimonial {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
}

.et_pb_testimonial_description {
    color: var(--s1-muted) !important;
}

.et_pb_testimonial_author {
    color: var(--s1-text) !important;
}

.et_pb_testimonial_meta {
    color: var(--s1-muted) !important;
}

/* --- Counter Module --- */
.et_pb_number_counter {
    color: var(--s1-accent) !important;
}

.et_pb_counter_title {
    color: var(--s1-text) !important;
}

/* --- Bar Counter Module --- */
.et_pb_counter_container {
    background: var(--s1-deep) !important;
}

.et_pb_counter_amount {
    background: linear-gradient(90deg, var(--s1-accent), var(--s1-purple)) !important;
}

/* --- Social Follow Module --- */
.et_pb_social_media_follow li a {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
}

.et_pb_social_media_follow li a:hover {
    background: var(--s1-accent) !important;
    border-color: var(--s1-accent) !important;
}

.et_pb_social_media_follow li a .et_pb_social_icon {
    color: var(--s1-text) !important;
}


/* ============================================================================
   PART 17: EASY DIGITAL DOWNLOADS
   ============================================================================ */

/* Product Grid */
.edd_downloads_list .edd_download {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
    padding: 20px;
    transition: all 0.3s ease;
}

.edd_downloads_list .edd_download:hover {
    border-color: var(--s1-accent) !important;
    transform: translateY(-4px);
}

.edd_download_title,
.edd_download_title a {
    color: var(--s1-text) !important;
    font-family: 'Fraunces', serif !important;
}

.edd_download_title a:hover {
    color: var(--s1-accent) !important;
}

.edd_download_excerpt {
    color: var(--s1-muted) !important;
}

.edd_price {
    color: var(--s1-accent) !important;
    font-family: 'Fraunces', serif !important;
    font-weight: 700;
}

/* Purchase Button */
.edd-submit.button,
.edd-add-to-cart,
.edd_go_to_checkout {
    background: var(--s1-accent) !important;
    color: var(--s1-void) !important;
    border: none !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-weight: 600 !important;
    padding: 12px 24px !important;
    transition: all 0.3s ease !important;
}

.edd-submit.button:hover,
.edd-add-to-cart:hover,
.edd_go_to_checkout:hover {
    background: var(--s1-text) !important;
    transform: translateY(-2px);
}

/* Cart */
.edd-cart {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
}

.edd-cart-item {
    border-bottom: 1px solid var(--s1-border) !important;
    color: var(--s1-text) !important;
}

.edd-cart-item-title {
    color: var(--s1-text) !important;
}

/* Checkout */
#edd_checkout_form_wrap {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
    padding: 30px;
}

#edd_checkout_form_wrap legend {
    color: var(--s1-text) !important;
    font-family: 'Fraunces', serif !important;
}

#edd_checkout_form_wrap input,
#edd_checkout_form_wrap select,
#edd_checkout_form_wrap textarea {
    background: var(--s1-deep) !important;
    border: 1px solid var(--s1-border) !important;
    color: var(--s1-text) !important;
    padding: 12px !important;
}

#edd_checkout_form_wrap input:focus,
#edd_checkout_form_wrap select:focus {
    border-color: var(--s1-accent) !important;
}

#edd_checkout_form_wrap label {
    color: var(--s1-muted) !important;
}

/* Purchase Receipt */
#edd_purchase_receipt,
.edd_receipt {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
}

#edd_purchase_receipt th,
.edd_receipt th {
    background: var(--s1-deep) !important;
    color: var(--s1-accent) !important;
}

#edd_purchase_receipt td,
.edd_receipt td {
    border-bottom: 1px solid var(--s1-border) !important;
    color: var(--s1-muted) !important;
}

/* License Keys */
.edd_sl_license_key {
    background: var(--s1-deep) !important;
    border: 1px solid var(--s1-border) !important;
    color: var(--s1-accent) !important;
    font-family: 'IBM Plex Mono', monospace !important;
    padding: 10px 15px;
}

/* Vendor Dashboard (FES) */
.fes-dashboard,
.fes-form {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
}

.fes-dashboard h3,
.fes-form h3 {
    color: var(--s1-text) !important;
    border-bottom: 1px solid var(--s1-border) !important;
}

.fes-table th {
    background: var(--s1-deep) !important;
    color: var(--s1-accent) !important;
}

.fes-table td {
    border-bottom: 1px solid var(--s1-border) !important;
    color: var(--s1-muted) !important;
}


/* ============================================================================
   PART 18: BBPRESS
   ============================================================================ */

#bbpress-forums {
    color: var(--s1-text);
}

/* Forum List */
#bbpress-forums li.bbp-body ul.forum,
#bbpress-forums li.bbp-body ul.topic {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
    margin-bottom: 10px;
    padding: 15px;
}

#bbpress-forums li.bbp-header,
#bbpress-forums li.bbp-footer {
    background: var(--s1-deep) !important;
    border: 1px solid var(--s1-border) !important;
    color: var(--s1-accent) !important;
}

/* Forum/Topic Titles */
#bbpress-forums .bbp-forum-title,
#bbpress-forums .bbp-topic-title {
    color: var(--s1-text) !important;
    font-family: 'Fraunces', serif !important;
}

#bbpress-forums .bbp-forum-title:hover,
#bbpress-forums .bbp-topic-title:hover {
    color: var(--s1-accent) !important;
}

/* Forum Content */
#bbpress-forums .bbp-forum-content,
#bbpress-forums .bbp-topic-content {
    color: var(--s1-muted) !important;
}

/* Topic Meta */
#bbpress-forums p.bbp-topic-meta {
    color: var(--s1-muted) !important;
}

#bbpress-forums p.bbp-topic-meta a {
    color: var(--s1-accent) !important;
}

/* Replies */
#bbpress-forums div.bbp-reply-author {
    background: var(--s1-deep) !important;
    border-right: 1px solid var(--s1-border) !important;
}

#bbpress-forums div.bbp-reply-content {
    background: var(--s1-surface) !important;
    color: var(--s1-muted) !important;
}

#bbpress-forums .bbp-reply-header {
    background: var(--s1-elevated) !important;
    border-bottom: 1px solid var(--s1-border) !important;
}

/* Author Name */
#bbpress-forums .bbp-author-name {
    color: var(--s1-text) !important;
}

/* Forms */
#bbpress-forums input,
#bbpress-forums select,
#bbpress-forums textarea {
    background: var(--s1-deep) !important;
    border: 1px solid var(--s1-border) !important;
    color: var(--s1-text) !important;
}

#bbpress-forums input:focus,
#bbpress-forums textarea:focus {
    border-color: var(--s1-accent) !important;
}

#bbpress-forums label {
    color: var(--s1-muted) !important;
}

/* Submit Buttons */
#bbpress-forums button,
#bbpress-forums .button,
#bbpress-forums input[type="submit"] {
    background: var(--s1-accent) !important;
    color: var(--s1-void) !important;
    border: none !important;
    font-weight: 600 !important;
}

#bbpress-forums button:hover,
#bbpress-forums input[type="submit"]:hover {
    background: var(--s1-text) !important;
}

/* Pagination */
#bbpress-forums .bbp-pagination-links a,
#bbpress-forums .bbp-pagination-links span.current {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
    color: var(--s1-muted) !important;
}

#bbpress-forums .bbp-pagination-links a:hover,
#bbpress-forums .bbp-pagination-links span.current {
    background: var(--s1-accent) !important;
    color: var(--s1-void) !important;
    border-color: var(--s1-accent) !important;
}

/* Breadcrumbs */
#bbpress-forums .bbp-breadcrumb {
    color: var(--s1-muted) !important;
}

#bbpress-forums .bbp-breadcrumb a {
    color: var(--s1-accent) !important;
}


/* ============================================================================
   PART 19: BUDDYPRESS
   ============================================================================ */

/* General */
#buddypress {
    color: var(--s1-text);
}

/* Navigation */
#buddypress .item-list-tabs ul li,
#buddypress div.item-list-tabs ul li {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
}

#buddypress .item-list-tabs ul li a,
#buddypress div.item-list-tabs ul li a {
    color: var(--s1-muted) !important;
}

#buddypress .item-list-tabs ul li.selected,
#buddypress .item-list-tabs ul li.current {
    background: var(--s1-accent) !important;
    border-color: var(--s1-accent) !important;
}

#buddypress .item-list-tabs ul li.selected a,
#buddypress .item-list-tabs ul li.current a {
    color: var(--s1-void) !important;
}

/* Member List */
#buddypress ul.item-list li {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
    margin-bottom: 10px;
    padding: 15px;
}

#buddypress ul.item-list li .item-title a {
    color: var(--s1-text) !important;
    font-family: 'Fraunces', serif !important;
}

#buddypress ul.item-list li .item-title a:hover {
    color: var(--s1-accent) !important;
}

#buddypress ul.item-list li .item-meta,
#buddypress ul.item-list li .activity {
    color: var(--s1-muted) !important;
}

/* Activity Stream */
#buddypress ul.activity-list li {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
    margin-bottom: 15px;
}

#buddypress .activity-header {
    color: var(--s1-muted) !important;
}

#buddypress .activity-header a {
    color: var(--s1-accent) !important;
}

#buddypress .activity-content {
    color: var(--s1-text) !important;
}

/* Profile */
#buddypress #item-header {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
    padding: 20px;
}

#buddypress #item-header-content {
    color: var(--s1-muted) !important;
}

#buddypress h2.user-nicename {
    color: var(--s1-text) !important;
    font-family: 'Fraunces', serif !important;
}

/* Forms */
#buddypress input,
#buddypress select,
#buddypress textarea {
    background: var(--s1-deep) !important;
    border: 1px solid var(--s1-border) !important;
    color: var(--s1-text) !important;
}

#buddypress input:focus,
#buddypress textarea:focus {
    border-color: var(--s1-accent) !important;
}

#buddypress label {
    color: var(--s1-muted) !important;
}

/* Buttons */
#buddypress button,
#buddypress a.button,
#buddypress input[type="submit"],
#buddypress input[type="button"] {
    background: var(--s1-accent) !important;
    color: var(--s1-void) !important;
    border: none !important;
    font-weight: 600 !important;
}

#buddypress button:hover,
#buddypress a.button:hover,
#buddypress input[type="submit"]:hover {
    background: var(--s1-text) !important;
}

/* Messages */
#buddypress #message-threads tr {
    background: var(--s1-surface) !important;
    border-bottom: 1px solid var(--s1-border) !important;
}

#buddypress .thread-content .thread-subject {
    color: var(--s1-text) !important;
}

#buddypress .thread-content .thread-excerpt {
    color: var(--s1-muted) !important;
}


/* ============================================================================
   PART 20: WORDPRESS WIDGETS
   ============================================================================ */

.widget {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
    padding: 20px;
    margin-bottom: 20px;
}

.widget-title,
.widget h4 {
    color: var(--s1-text) !important;
    font-family: 'Fraunces', serif !important;
    border-bottom: 1px solid var(--s1-border);
    padding-bottom: 10px;
    margin-bottom: 15px;
}

.widget ul li {
    border-bottom: 1px solid var(--s1-border);
    padding: 8px 0;
}

.widget ul li:last-child {
    border-bottom: none;
}

.widget a {
    color: var(--s1-muted) !important;
}

.widget a:hover {
    color: var(--s1-accent) !important;
}

/* Search Widget */
.widget input[type="search"],
.widget input[type="text"] {
    background: var(--s1-deep) !important;
    border: 1px solid var(--s1-border) !important;
    color: var(--s1-text) !important;
    padding: 10px 15px;
    width: 100%;
}

.widget input[type="submit"] {
    background: var(--s1-accent) !important;
    color: var(--s1-void) !important;
    border: none !important;
}


/* ============================================================================
   PART 21: GRAVITY FORMS
   ============================================================================ */

.gform_wrapper input:not([type="submit"]),
.gform_wrapper select,
.gform_wrapper textarea {
    background: var(--s1-deep) !important;
    border: 1px solid var(--s1-border) !important;
    color: var(--s1-text) !important;
    font-family: 'Space Grotesk', sans-serif !important;
    padding: 12px 16px !important;
}

.gform_wrapper input:focus,
.gform_wrapper textarea:focus {
    border-color: var(--s1-accent) !important;
    outline: none !important;
}

.gform_wrapper .gfield_label {
    color: var(--s1-muted) !important;
    font-family: 'Space Grotesk', sans-serif !important;
}

.gform_wrapper .gfield_description {
    color: var(--s1-muted) !important;
}

.gform_wrapper .gform_button,
.gform_wrapper input[type="submit"] {
    background: var(--s1-accent) !important;
    color: var(--s1-void) !important;
    border: none !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-weight: 600 !important;
    padding: 14px 28px !important;
    transition: all 0.3s ease !important;
}

.gform_wrapper .gform_button:hover,
.gform_wrapper input[type="submit"]:hover {
    background: var(--s1-text) !important;
    transform: translateY(-2px);
}

.gform_wrapper .validation_error,
.gform_wrapper .validation_message {
    background: rgba(239, 68, 68, 0.1) !important;
    border-color: var(--s1-red) !important;
    color: var(--s1-red) !important;
}

.gform_wrapper .gform_confirmation_message {
    background: rgba(0, 212, 170, 0.1) !important;
    border: 1px solid var(--s1-accent) !important;
    color: var(--s1-accent) !important;
}


/* ============================================================================
   PART 22: UTILITY CLASSES
   ============================================================================ */

/* Text colors */
.s1-text-accent { color: var(--s1-accent) !important; }
.s1-text-muted { color: var(--s1-muted) !important; }
.s1-text-white { color: var(--s1-text) !important; }

/* Background colors */
.s1-bg-void { background-color: var(--s1-void) !important; }
.s1-bg-deep { background-color: var(--s1-deep) !important; }
.s1-bg-surface { background-color: var(--s1-surface) !important; }

/* Borders */
.s1-border { border: 1px solid var(--s1-border) !important; }
.s1-border-accent { border: 1px solid var(--s1-accent) !important; }

/* Alternate background sections */
.s1-section-deep {
    background: var(--s1-deep) !important;
    border-top: 1px solid var(--s1-border);
    border-bottom: 1px solid var(--s1-border);
}

/* Hero section with gradient glow */
.s1-section-hero {
    background: 
        radial-gradient(ellipse at 50% 30%, rgba(0, 212, 170, 0.15) 0%, transparent 60%),
        radial-gradient(ellipse at 80% 80%, rgba(168, 85, 247, 0.1) 0%, transparent 50%),
        var(--s1-void) !important;
}

/* CTA section with dual gradients */
.s1-section-cta {
    background: 
        radial-gradient(ellipse at 30% 50%, rgba(0, 212, 170, 0.1) 0%, transparent 50%),
        radial-gradient(ellipse at 70% 50%, rgba(168, 85, 247, 0.1) 0%, transparent 50%),
        var(--s1-void) !important;
}

/* Highlighted box */
.s1-highlight-box {
    background: linear-gradient(135deg, rgba(0, 212, 170, 0.1) 0%, rgba(168, 85, 247, 0.1) 100%) !important;
    border: 2px solid var(--s1-accent) !important;
    padding: 40px !important;
}

/* Labels/Badges */
.s1-label {
    display: inline-block;
    padding: 4px 12px;
    background: var(--s1-accent);
    color: var(--s1-void);
    font-family: 'IBM Plex Mono', monospace;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.s1-label-purple {
    background: var(--s1-purple);
}

.s1-label-outline {
    background: transparent;
    border: 1px solid var(--s1-accent);
    color: var(--s1-accent);
}

/* Basic card */
.s1-card {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
    padding: 30px !important;
    transition: all 0.3s ease !important;
}

.s1-card:hover {
    border-color: var(--s1-accent) !important;
    transform: translateY(-4px);
}

/* Card with top gradient bar */
.s1-card-accent {
    background: var(--s1-surface) !important;
    border: 1px solid var(--s1-border) !important;
    padding: 30px !important;
    position: relative;
}

.s1-card-accent::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--s1-accent), var(--s1-purple));
}

/* Featured card */
.s1-card-featured {
    background: var(--s1-surface) !important;
    border: 2px solid var(--s1-accent) !important;
    padding: 30px !important;
}


/* ============================================================================
   PART 23: RESPONSIVE / MOBILE STYLES
   ============================================================================ */

@media (max-width: 980px) {
    /* Nav Mobile */
    .s1-nav-toggle {
        display: flex;
        order: 3;
    }
    
    .s1-nav-links {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: rgba(10, 10, 15, 0.98);
        flex-direction: column;
        padding: 1rem 2rem 2rem;
        gap: 0;
        border-bottom: 1px solid var(--s1-border);
    }
    
    .s1-nav-links li {
        padding: 0.75rem 0;
        border-bottom: 1px solid var(--s1-border);
    }
    
    .s1-nav-links li:last-child {
        border-bottom: none;
    }
    
    .s1-nav.menu-open .s1-nav-links {
        display: flex;
    }
    
    .s1-nav-cta {
        display: none;
    }
    
    .s1-nav-inner {
        padding: 0 1rem;
    }
    
    /* Hamburger animation when open */
    .s1-nav.menu-open .s1-nav-toggle span:nth-child(1) {
        transform: rotate(45deg) translate(5px, 5px);
    }
    
    .s1-nav.menu-open .s1-nav-toggle span:nth-child(2) {
        opacity: 0;
    }
    
    .s1-nav.menu-open .s1-nav-toggle span:nth-child(3) {
        transform: rotate(-45deg) translate(5px, -5px);
    }
    
    /* Hero */
    .s1-hero-section {
        padding: 120px 20px 60px !important;
    }
    
    .s1-stats-row {
        gap: 2rem;
    }
    
    .s1-solution-box {
        padding: 2.5rem 1.5rem;
    }
    
    .s1-signup-box {
        padding: 2rem 1.5rem;
    }
    
    .s1-card,
    .s1-card-accent,
    .s1-card-featured {
        padding: 20px !important;
    }
    
    .s1-highlight-box {
        padding: 25px !important;
    }
}

@media (max-width: 768px) {
    /* Grid overlay */
    body::before {
        background-size: 40px 40px;
    }
    
    /* Navigation */
    .s1-nav {
        padding: 0.75rem 1rem !important;
    }
    
    .s1-nav-logo {
        font-size: 1.25rem;
    }
    
    /* Hero */
    .s1-hero-section {
        padding: 100px 15px 50px !important;
        min-height: auto;
    }
    
    .s1-hero-section .et_pb_row {
        padding-top: 20px !important;
    }
    
    .s1-hero-title {
        font-size: 2.5rem !important;
    }
    
    .s1-hero-slogan {
        font-size: 0.9rem;
    }
    
    .s1-hero-subtitle {
        font-size: 1.1rem;
    }
    
    .s1-stats-row {
        flex-direction: column;
        gap: 1.5rem;
    }
    
    .s1-stat-value {
        font-size: 2rem;
    }
    
    /* Sections */
    .s1-problem-section,
    .s1-solution-section,
    .s1-benefits-section,
    .s1-ai-section,
    .s1-pricing-section,
    .s1-signup-section {
        padding: 60px 0 !important;
    }
    
    /* Cards - Remove min-height on mobile */
    .s1-problem-card,
    .s1-benefit-card {
        min-height: auto !important;
    }
    
    /* Signup */
    .s1-signup-perks {
        flex-direction: column;
        gap: 1rem;
    }
    
    .s1-signup-title {
        font-size: 1.5rem;
    }
    
    /* Footer */
    .s1-footer {
        padding: 40px 0 !important;
    }
    
    #footer-widgets {
        padding: 40px 0 !important;
    }
}

@media (max-width: 480px) {
    .s1-hero-title {
        font-size: 2rem !important;
    }
    
    .s1-hero-badge {
        font-size: 0.65rem;
        padding: 0.4rem 1rem;
    }
    
    .s1-solution-box {
        padding: 1.5rem 1rem;
    }
    
    .s1-solution-quote {
        font-size: 1.25rem;
    }
}


/* ============================================================================
   PART 24: PRINT STYLES
   ============================================================================ */

@media print {
    body::before {
        display: none;
    }
    
    body,
    #page-container {
        background: white !important;
        color: black !important;
    }
}