/* ===================================================================
 * Modern Spacing & Border Radius - Soft Rounded (Option 1)
 * Apple-inspired premium spacing with comfortable margins
 * ================================================================ */

/* ===================================================================
 * STAT COUNTER CARDS - With Gradient Shine Background
 * ================================================================ */

#stats-counter .stat-item {
    border-radius: 24px !important;
    padding: 3.5rem 2.5rem !important;
    margin-bottom: 0 !important;
    
    /* Gradient shine background - dark to light */
    background: linear-gradient(135deg,
        #050505 0%,
        #1a1a1a 100%
    ) !important;
}

#stats-counter .stat-item:hover {
    /* Brighter gradient on hover */
    background: linear-gradient(135deg,
        #0a0a0a 0%,
        #242424 100%
    ) !important;
}

/* ===================================================================
 * CHALLENGE SECTION CARD
 * ================================================================ */

#problem .prose {
    border-radius: 20px !important;
    padding: 3rem 2.5rem !important;
}

/* ===================================================================
 * GENERAL CARDS - With Gradient Shine Background
 * ================================================================ */

.card,
.industry-card,
.pillar-item,
.guide-card,
.pitfall-card,
.location-card,
.expert-card,
.testimonial-card,
.faq-item {
    border-radius: 20px !important;
    padding: 3rem 2.5rem !important;
    margin-bottom: 2.5rem !important;
    
    /* Gradient shine background - dark to light */
    background: linear-gradient(135deg,
        #050505 0%,
        #1a1a1a 100%
    ) !important;
}

/* Process step is just a container - no background */
.process-step {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

.card:hover,
.industry-card:hover,
.pillar-item:hover,
.guide-card:hover,
.pitfall-card:hover,
.location-card:hover,
.expert-card:hover,
.testimonial-card:hover,
.faq-item:hover {
    /* Brighter gradient on hover */
    background: linear-gradient(135deg,
        #0a0a0a 0%,
        #242424 100%
    ) !important;
}

/* ===================================================================
 * BENEFITS CARDS - With Gradient Shine Background
 * ================================================================ */

#benefits .card {
    border-radius: 20px !important;
    padding: 3rem 2.5rem !important;
    
    /* Gradient shine background - dark to light */
    background: linear-gradient(135deg,
        #050505 0%,
        #1a1a1a 100%
    ) !important;
}

#benefits .card:hover {
    /* Brighter gradient on hover */
    background: linear-gradient(135deg,
        #0a0a0a 0%,
        #242424 100%
    ) !important;
}

/* ===================================================================
 * GEN AI SPOTLIGHT FEATURE ITEMS - With Gradient Shine Background
 * ================================================================ */

#gen-ai-spotlight .feature-item {
    border-radius: 16px !important;
    padding: 2rem 1.5rem !important;
    margin-bottom: 2rem !important;
    
    /* Gradient shine background - dark to light */
    background: linear-gradient(135deg,
        #050505 0%,
        #1a1a1a 100%
    ) !important;
}

#gen-ai-spotlight .feature-item:hover {
    /* Brighter gradient on hover */
    background: linear-gradient(135deg,
        #0a0a0a 0%,
        #242424 100%
    ) !important;
}

/* ===================================================================
 * VISUAL CONTAINERS - With Gradient Shine Background
 * ================================================================ */

#gen-ai-spotlight .visual-container {
    border-radius: 20px !important;
    padding: 3rem !important;
    
    /* Gradient shine background - dark to light */
    background: linear-gradient(135deg,
        #050505 0%,
        #1a1a1a 100%
    ) !important;
}

#gen-ai-spotlight .code-window {
    border-radius: 16px !important;
    padding: 2.5rem !important;
    
    /* Gradient shine background - dark to light */
    background: linear-gradient(135deg,
        #050505 0%,
        #1a1a1a 100%
    ) !important;
}

/* ===================================================================
 * ICON BOXES
 * ================================================================ */

.icon-box,
.pillar-icon,
.industry-icon,
.feature-icon {
    border-radius: 16px !important;
    /* Padding removed - let original CSS handle icon sizing */
}

/* ===================================================================
 * SECTION BADGES
 * ================================================================ */

.section-badge,
.challenge-badge,
.solution-badge {
    border-radius: 12px !important;
    padding: 0.5rem 1rem !important;
}

/* ===================================================================
 * BUTTONS
 * ================================================================ */

.btn,
.hero-btn-primary-large,
.hero-btn-secondary-large {
    border-radius: 16px !important;
    padding: 1.25rem 2.5rem !important;
}

.btn-small {
    border-radius: 12px !important;
    padding: 0.875rem 1.75rem !important;
}

/* ===================================================================
 * FORM ELEMENTS
 * ================================================================ */

input[type="text"],
input[type="email"],
input[type="tel"],
textarea,
select {
    border-radius: 12px !important;
    padding: 1rem 1.5rem !important;
}

/* ===================================================================
 * HERO METRIC CARDS
 * ================================================================ */

.hero-metric-card {
    border-radius: 16px !important;
    padding: 2rem 1.75rem !important;
}

/* ===================================================================
 * CAPABILITY TAGS
 * ================================================================ */

#coverage .capability-tag {
    border-radius: 12px !important;
    padding: 0.75rem 1.25rem !important;
}

/* ===================================================================
 * EXPERTISE TAGS
 * ================================================================ */

.expertise-tag {
    border-radius: 12px !important;
    padding: 0.625rem 1rem !important;
}

/* ===================================================================
 * SECTION CONTAINERS
 * ================================================================ */

.section {
    padding: 5rem 0 !important;
}

.container {
    padding: 0 2rem !important;
}

/* ===================================================================
 * GRID GAPS
 * ================================================================ */

.grid-2,
.grid-3,
.grid-4 {
    gap: 2.5rem !important;
}

/* ===================================================================
 * PILLAR CONTAINER
 * ================================================================ */

#coverage .pillars-container {
    gap: 3rem !important;
}

/* ===================================================================
 * STATS COUNTER GRID
 * ================================================================ */

#stats-counter .stats-grid {
    gap: 2.5rem !important;
}

/* ===================================================================
 * MOBILE RESPONSIVE - Adjust Spacing
 * ================================================================ */

@media (max-width: 768px) {
    .card,
    .industry-card,
    .pillar-item,
    #problem .prose {
        border-radius: 18px !important;
        padding: 2.5rem 2rem !important;
        margin-bottom: 2rem !important;
    }
    
    #stats-counter .stat-item {
        border-radius: 20px !important;
        padding: 3rem 2rem !important;
    }
    
    .icon-box,
    .pillar-icon,
    .industry-icon {
        border-radius: 14px !important;
        /* Padding removed - preserve original icon sizing */
    }
    
    .btn,
    .hero-btn-primary-large,
    .hero-btn-secondary-large {
        border-radius: 14px !important;
        padding: 1.125rem 2rem !important;
    }
    
    .section {
        padding: 4rem 0 !important;
    }
    
    .container {
        padding: 0 1.5rem !important;
    }
    
    .grid-2,
    .grid-3,
    .grid-4 {
        gap: 2rem !important;
    }
}

@media (max-width: 480px) {
    .card,
    .industry-card,
    .pillar-item,
    #problem .prose {
        border-radius: 16px !important;
        padding: 2rem 1.5rem !important;
        margin-bottom: 1.5rem !important;
    }
    
    #stats-counter .stat-item {
        border-radius: 18px !important;
        padding: 2.5rem 1.75rem !important;
    }
    
    .icon-box,
    .pillar-icon,
    .industry-icon {
        border-radius: 12px !important;
        /* Padding removed - preserve original icon sizing */
    }
    
    .btn,
    .hero-btn-primary-large,
    .hero-btn-secondary-large {
        border-radius: 12px !important;
        padding: 1rem 1.75rem !important;
    }
    
    .section {
        padding: 3rem 0 !important;
    }
    
    .container {
        padding: 0 1rem !important;
    }
    
    .grid-2,
    .grid-3,
    .grid-4 {
        gap: 1.5rem !important;
    }
    
    #gen-ai-spotlight .feature-item {
        border-radius: 14px !important;
        padding: 1.5rem 1.25rem !important;
        margin-bottom: 1.5rem !important;
    }
}

/* ===================================================================
 * SPECIFIC ELEMENT ADJUSTMENTS
 * ================================================================ */

/* Hero Section */
.hero-trust-item {
    border-radius: 12px !important;
    padding: 1rem 1.5rem !important;
}

/* FAQ Items */
.faq-item {
    border-radius: 18px !important;
    padding: 2.5rem 2rem !important;
    margin-bottom: 2rem !important;
}

/* Testimonial Cards */
.testimonial-card {
    border-radius: 20px !important;
    padding: 3rem 2.5rem !important;
    margin-bottom: 2.5rem !important;
}

/* Process Steps - container only, no styling */

/* Location Cards */
.location-card {
    border-radius: 20px !important;
    padding: 2.5rem 2rem !important;
}

/* Expert Cards */
.expert-card {
    border-radius: 20px !important;
    padding: 3rem 2.5rem !important;
}

/* Guide Cards */
.guide-card {
    border-radius: 20px !important;
    padding: 3rem 2.5rem !important;
}

/* Pitfall Cards */
.pitfall-card {
    border-radius: 20px !important;
    padding: 3rem 2.5rem !important;
}