/* Compact Mobile Responsiveness Overrides */

@media (max-width: 768px) {
    /* Global Reductions */
    .section {
        padding: 2rem 0 !important; /* Was 4rem on desktop */
    }

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

    .section-title {
        font-size: var(--step-3) !important;
        margin-bottom: 1.5rem !important;
    }

    .section-header {
        margin-bottom: 2rem !important;
    }

    p {
        font-size: 0.95rem !important;
        line-height: 1.5 !important;
    }

    /* Hero Section Compact - Full viewport height on mobile */
    .hero {
        height: 100vh !important;
        height: 100svh !important;
        min-height: 550px !important;
        max-height: 100vh !important;
        max-height: 100svh !important;
        padding: 0 !important;
    }

    .hero-avatar {
        margin-bottom: 1.25rem !important;
    }

    .avatar-ring {
        width: 120px !important; /* Slightly smaller for better proportion */
        height: 120px !important;
    }

    /* Orbit rings - smaller on mobile to prevent overflow */
    .orbit-1 { width: 150px !important; height: 150px !important; opacity: 0.03 !important; }
    .orbit-2 { width: 175px !important; height: 175px !important; opacity: 0.02 !important; }
    .orbit-3 { width: 200px !important; height: 200px !important; opacity: 0.01 !important; }

    .hero-title {
        font-size: clamp(2rem, 7vw, 2.6rem) !important;
        margin-bottom: 0.5rem !important;
    }

    .hero-subtitle {
        font-size: var(--step-0) !important;
        margin-bottom: 1rem !important;
    }

    .typing-text {
        margin-bottom: 1.5rem !important;
        min-height: 24px !important;
    }

    .hero-actions {
        margin-bottom: 2rem !important;
        gap: 1rem !important;
    }

    .btn {
        padding: 0.8rem 1.5rem !important;
        font-size: 0.9rem !important;
    }

    .hero-stats {
        gap: 0.5rem !important;
        margin-bottom: 1.5rem !important;
    }

    .stat-badge {
        padding: 0.75rem 1rem !important;
        min-width: 90px !important;
    }

    .stat-number {
        font-size: 1.5rem !important;
    }

    .stat-label {
        font-size: 0.75rem !important;
    }

    /* Salary Section */
    .salary-content {
        gap: 2rem !important;
    }

    .salary-tier {
        padding: 1.5rem !important;
        margin-bottom: 1rem !important;
    }

    .salary-amount {
        font-size: 2rem !important;
    }

    /* Certification Section - Enhanced */
    .certification-showcase {
        gap: 2rem !important;
    }

    .certification-header {
        margin-bottom: 2rem !important;
    }

    .certification-tagline {
        font-size: 1rem !important;
    }

    .cert-value-card {
        padding: 1rem !important;
    }

    .cert-value-icon {
        width: 40px !important;
        height: 40px !important;
    }

    .certification-cta-row {
        margin-top: 2rem !important;
    }

    /* Course Structure */
    .course-structure {
        overflow: hidden !important;
        width: 100% !important;
    }

    .course-content {
        gap: 2rem !important;
    }

    .course-stats {
        margin: 1.5rem 0 !important;
        gap: 1rem !important;
    }

    .stat-item {
        padding: 0.75rem !important;
    }

    /* Course Layout - Mobile Optimization */
    .course-layout {
        grid-template-columns: 1fr !important;
        gap: 2rem !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }

    .course-info-column {
        gap: 1rem !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .course-visual-column {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }

    /* Course Stats Compact - Mobile */
    .course-stats-compact {
        gap: 1.0rem !important;
        flex-wrap: wrap !important;
    }

    .stat-item-compact {
        padding: 0.5rem 0.75rem !important;
        font-size: 0.8rem !important;
        gap: 0.6rem !important;
    }

    .stat-item-compact .stat-icon {
        font-size: 1rem !important;
    }

    .stat-item-compact .stat-text {
        font-size: 0.75rem !important;
    }

    /* Training Highlight Box - Mobile */
    .training-highlight-box {
        padding: 1rem !important;
    }

    .highlight-header h3 {
        font-size: 0.95rem !important;
    }

    .training-highlight-box p {
        font-size: 0.85rem !important;
    }

    /* Learning Method Box - Mobile */
    .learning-method-box {
        padding: 1rem !important;
    }

    .method-header h3 {
        font-size: 0.95rem !important;
    }

    .method-step {
        padding: 0.6rem !important;
        gap: 0.5rem !important;
    }

    .step-badge {
        min-width: 1.5rem !important;
        height: 1.5rem !important;
        font-size: 0.8rem !important;
    }

    .step-info h4 {
        font-size: 0.85rem !important;
    }

    .step-info p {
        font-size: 0.8rem !important;
    }

    /* Code Preview Card - Mobile */
    .code-preview-card {
        border-radius: 0.75rem !important;
        margin: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }

    .code-preview-header {
        padding: 0.5rem 0.75rem !important;
        overflow: hidden !important;
    }

    .code-file-name {
        font-size: 0.75rem !important;
    }

    .code-preview-content {
        padding: 0.75rem !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .code-preview-content pre {
        font-size: 0.65rem !important;
        line-height: 1.4 !important;
        white-space: pre !important;
        overflow-x: auto !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
    }

    .code-preview-content code {
        font-size: 0.65rem !important;
        display: block !important;
    }

    /* CTA Buttons - Mobile */
    .course-cta-buttons {
        gap: 0.75rem !important;
    }

    .course-cta-buttons .btn {
        width: 100% !important;
        padding: 0.75rem 1rem !important;
        font-size: 0.85rem !important;
        min-width: auto !important;
    }

    /* Community Section */
    .community-content {
        gap: 2rem !important;
    }

    .discord-card {
        padding: 1.5rem !important;
    }

    /* Bounties Section */
    .bounties-content {
        gap: 2rem !important;
    }

    .bounties-highlight {
        margin: 1.5rem 0 !important;
        padding: 1rem !important;
        font-size: 1.2rem !important;
    }

    .bounty-item {
        padding: 1rem !important;
    }

    /* ================================================
       Success Stories Mobile - Fixed Height Solution
       ================================================
       Problem: Images have different aspect ratios causing
       container height to jump when switching slides.

       Solution: Fixed-height container with object-fit: contain
       Shows full image (no cropping) with styled background
       filling empty space. Container height stays fixed.
       ================================================ */

    .success-slider-wrapper {
        position: relative !important;
        padding: 0 0.75rem !important;
    }

    .success-slides-container {
        min-height: 0 !important;
        height: auto !important;
        overflow: visible !important;
        position: relative !important;
    }

    /* Stack all slides - use opacity for smooth crossfade */
    .success-slide {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        opacity: 0 !important;
        visibility: hidden !important;
        transform: none !important;
        transition: opacity 0.5s ease-out, visibility 0.5s ease-out !important;
        pointer-events: none !important;
    }

    /* First slide sets the container height */
    .success-slide:first-child {
        position: relative !important;
        visibility: visible !important;
        opacity: 0 !important;
    }

    .success-slide.active {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        z-index: 2 !important;
    }

    .success-slide-content {
        display: flex !important;
        flex-direction: column !important;
        padding: 0 !important;
        gap: 0 !important;
        text-align: center !important;
        height: auto !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        border-radius: 0 !important;
    }

    .success-slide-content::after {
        display: none !important;
    }

    /* Hide badge, description, stats */
    .success-badge,
    .success-slide-description,
    .success-stats {
        display: none !important;
    }

    /* Text Container Below Image */
    .success-slide-text {
        order: 2 !important;
        padding: 1.25rem 0.5rem !important;
        background: transparent !important;
    }

    .success-slide-title {
        font-size: 1.15rem !important;
        margin: 0 !important;
        line-height: 1.35 !important;
        padding: 0 0.25rem !important;
    }

    /* ================================================
       Photo Card Frame - Fixed Height Image Container
       ================================================ */
    .success-slide-visual {
        order: 1 !important;
        position: relative !important;
    }

    .success-image-wrapper {
        position: relative !important;
        width: 100% !important;
        height: 380px !important; /* Fixed height prevents jumping */
        max-height: none !important;
        margin: 0 !important;
        border-radius: 16px !important;
        overflow: hidden !important;
        /* Match Discord/Twitter dark theme background color */
        background: #15171a !important;
        border: 1px solid rgba(168, 85, 247, 0.3) !important;
        box-shadow:
            0 12px 40px rgba(0, 0, 0, 0.5),
            0 0 0 1px rgba(69, 244, 255, 0.08) !important;
        /* Center the contained image */
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* Disable pseudo-elements - not needed with contain */
    .success-image-wrapper::before,
    .success-image-wrapper::after {
        display: none !important;
    }

    .success-image {
        width: 100% !important;
        height: 100% !important;
        max-height: none !important;
        object-fit: contain !important; /* Show full image, no cropping */
        object-position: center center !important;
        aspect-ratio: auto !important;
        border-radius: 0 !important; /* Image doesn't need rounded corners */
    }

    .success-image-overlay {
        display: none !important;
    }

    /* CTA Button */
    .btn-success-cta {
        width: 100% !important;
        justify-content: center !important;
        padding: 1rem !important;
        margin-top: 0 !important;
        font-size: 1rem !important;
    }

    /* ================================================
       Navigation Controls
       ================================================ */
    .success-dots {
        margin-top: 1.5rem !important;
        width: 100% !important;
        position: relative !important;
        bottom: auto !important;
    }

    .success-nav {
        top: 190px !important; /* Center vertically on fixed-height image (380px / 2) */
        bottom: auto !important;
        transform: translateY(-50%) !important;
        width: 40px !important;
        height: 40px !important;
        background: rgba(15, 15, 25, 0.85) !important;
        backdrop-filter: blur(8px) !important;
        -webkit-backdrop-filter: blur(8px) !important;
        border: 1px solid rgba(168, 85, 247, 0.4) !important;
        border-radius: 50% !important;
        z-index: 20 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        box-shadow:
            0 4px 16px rgba(0, 0, 0, 0.4),
            0 0 20px rgba(168, 85, 247, 0.15) !important;
        transition: all 0.3s ease !important;
    }

    .success-nav:active {
        transform: translateY(-50%) scale(0.95) !important;
        background: rgba(168, 85, 247, 0.3) !important;
    }

    .success-nav svg {
        width: 18px !important;
        height: 18px !important;
        color: rgba(255, 255, 255, 0.9) !important;
    }

    .success-prev {
        left: 8px !important;
    }

    .success-next {
        right: 8px !important;
    }

    /* Experts Section */
    .experts-grid {
        gap: 1rem !important;
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .expert-card {
        padding: 1.5rem 1rem !important;
    }

    .expert-avatar-img {
        width: 80px !important;
        height: 80px !important;
    }

    .expert-name {
        font-size: 1.2rem !important;
    }

    /* Mentors Section - Tablet */
    .mentors-showcase {
        margin-bottom: 3rem !important;
    }

    .mentors-grid {
        gap: 1rem !important;
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .mentor-card {
        padding: 1.5rem 1rem !important;
    }

    .mentor-avatar-img {
        width: 85px !important;
        height: 85px !important;
    }

    .mentor-name {
        font-size: 1.2rem !important;
    }

    .mentor-bio {
        font-size: 0.85rem !important;
    }

    .credential-tag {
        font-size: 0.65rem !important;
    }

    .community-content-enhanced {
        gap: 2rem !important;
    }

    .community-title {
        font-size: 1.5rem !important;
    }

    /* Pricing Section - Mobile Optimized */
    .pricing-section {
        padding: 2.5rem 0 !important;
    }

    .pricing-header-new {
        margin-bottom: 1.5rem !important;
    }

    .pricing-main-title {
        font-size: 1.6rem !important;
        line-height: 1.3 !important;
    }

    .pricing-card-wrapper {
        padding: 0 !important;
    }

    .pricing-card-premium {
        border-radius: 16px !important;
    }

    .pricing-main-content {
        padding: 1.25rem !important;
        gap: 1.5rem !important;
        flex-direction: column !important;
    }

    .countdown-banner-prominent {
        padding: 0.875rem !important;
        gap: 0.75rem !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    .countdown-label {
        font-size: 0.7rem !important;
    }

    .countdown-timer-large {
        gap: 0.25rem !important;
    }

    .time-unit {
        min-width: auto !important;
    }

    .time-value {
        font-size: 1.5rem !important;
        min-width: 42px !important;
        padding: 0.4rem 0.5rem !important;
    }

    .time-separator {
        font-size: 1.25rem !important;
        padding: 0 0.15rem !important;
    }

    .time-label {
        font-size: 0.55rem !important;
    }

    .pricing-info-column {
        text-align: center !important;
    }

    .pricing-info-column .course-title-pricing {
        font-size: 1.2rem !important;
    }

    .course-subtitle-pricing {
        font-size: 0.85rem !important;
    }

    .benefits-list-compact {
        text-align: left !important;
        padding-left: 0.5rem !important;
    }

    .pricing-cta-column {
        width: 100% !important;
    }

    .pricing-cta-box-inner {
        padding: 1.25rem !important;
    }

    .pricing-price-container {
        margin-bottom: 1rem !important;
    }

    .pricing-price-row {
        gap: 0.75rem !important;
        justify-content: center !important;
    }

    .pricing-old-price {
        font-size: 1.25rem !important;
    }

    .pricing-new-price {
        font-size: 2.25rem !important;
    }

    .pricing-save-badge {
        font-size: 0.75rem !important;
        padding: 0.4rem 0.75rem !important;
    }

    .price-current .amount {
        font-size: 2.5rem !important;
    }

    .cta-box {
        padding: 1.25rem !important;
    }

    /* Payment buttons stack */
    .payment-buttons-stack {
        gap: 0.75rem !important;
    }

    .payment-btn-large {
        padding: 0.875rem 1rem !important;
        font-size: 0.9rem !important;
    }

    .payment-icon img {
        width: 20px !important;
        height: 20px !important;
    }

    /* Lite version card */
    .lite-version-card {
        padding: 1rem !important;
        margin-top: 1rem !important;
    }

    .lite-card-description {
        font-size: 0.85rem !important;
        margin-bottom: 0.75rem !important;
    }

    .btn-lite-version {
        padding: 0.75rem 1.25rem !important;
        font-size: 0.85rem !important;
    }

    /* Testimonials */
    .testimonial-slide {
        padding: 2rem 1rem !important;
    }

    .testimonial-avatar-img {
        width: 70px !important;
        height: 70px !important;
        margin-bottom: 1rem !important;
    }

    .testimonial-quote {
        font-size: 0.9rem !important;
    }

    /* Syllabus */
    .syllabus-main-title {
        font-size: 2rem !important;
        margin-bottom: 1rem !important;
    }

    .syllabus-part {
        margin-bottom: 2rem !important;
    }

    .part-header {
        margin-bottom: 1.5rem !important;
    }

    .part-title {
        font-size: 1.8rem !important;
    }

    .syllabus-grid-modern {
        padding: 1rem !important;
        gap: 1rem !important;
    }

    .syllabus-item-modern {
        padding: 1rem !important;
        gap: 1rem !important;
    }

    .item-number {
        font-size: 1.8rem !important;
        min-width: 50px !important;
    }

    .item-title {
        font-size: 1rem !important;
    }

    .guest-lectures-section {
        margin-top: 3rem !important;
        padding-top: 2rem !important;
    }

    .guest-lectures-title {
        font-size: 1.8rem !important;
        margin-bottom: 1.5rem !important;
    }

    /* FAQ - Improved touch targets */
    .faq-question {
        padding: 1.25rem 1rem !important; /* Increased vertical padding for better touch target */
        font-size: 1rem !important;
        min-height: 56px !important; /* Ensures minimum 44px+ touch target */
        gap: 1rem !important;
    }

    .faq-icon {
        width: 28px !important;
        height: 28px !important;
        font-size: 1.25rem !important;
        flex-shrink: 0 !important;
    }

    .faq-answer > * {
        padding: 0 1rem 1rem !important;
    }

    /* Image Constraints - Slightly larger on mobile for better visibility */
    .money-image-container,
    .course-image-card,
    .community-image-card {
        max-width: 90% !important; /* Increased from 80% for better use of space */
        margin: 0 auto !important;
    }

    .certification-frame {
        max-width: 100% !important;
        margin: 0 auto !important;
    }

    /* Community section mobile layout */
    .community-content {
        flex-direction: column !important;
    }

    .community-content.reverse {
        flex-direction: column-reverse !important;
    }

    .community-text {
        text-align: center !important;
    }

    .community-description {
        font-size: 0.95rem !important;
    }

    /* Certification section mobile - Enhanced */
    .certification-showcase {
        grid-template-columns: 1fr !important;
    }

    .certification-visual-enhanced {
        order: -1 !important;
    }

    .certification-frame {
        max-width: 100% !important;
    }

    .cert-badge-verified {
        font-size: 0.7rem !important;
        padding: 0.4rem 1rem !important;
    }

    .certification-header {
        text-align: center !important;
    }

    /* Salary section mobile */
    .salary-content {
        flex-direction: column !important;
    }

    .salary-info {
        text-align: center !important;
    }

    .salary-tier {
        text-align: center !important;
    }

    .benefits-list-compact li {
        padding: 0.25rem 0 !important;
        font-size: 0.9rem !important;
    }

    /* Testimonial Social Links - Improved touch targets */
    .testimonial-social-link {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 44px !important;
        min-height: 44px !important;
        padding: 10px !important;
        margin-left: 0.5rem !important;
    }

    .testimonial-social-link svg {
        width: 20px !important;
        height: 20px !important;
    }

    /* Footer - Mobile centered layout */
    .footer-content {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        gap: 1rem !important;
    }

    .footer-links {
        flex-wrap: wrap !important;
        justify-content: center !important;
    }

    .footer-links a {
        padding: 0.5rem 0.75rem !important; /* Better touch targets for footer links */
    }

    /* Video Container - Proper aspect ratio */
    .video-container {
        position: relative !important;
        width: 100% !important;
        padding-bottom: 56.25% !important; /* 16:9 aspect ratio */
        height: 0 !important;
        overflow: hidden !important;
        border-radius: 12px !important;
    }

    .video-container iframe,
    .video-iframe {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        border-radius: 12px !important;
    }

    /* Form inputs - Prevent iOS zoom (must be 16px+) */
    input[type="text"],
    input[type="email"],
    textarea,
    .contact-form input,
    .contact-form textarea {
        font-size: 16px !important; /* Prevents iOS zoom on focus */
    }

    /* Modal scroll fix for small screens */
    .free-trial-modal-container {
        max-height: calc(100vh - 2rem) !important;
        max-height: calc(100dvh - 2rem) !important; /* Dynamic viewport height for mobile browsers */
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .free-trial-modal-content {
        max-height: none !important;
    }

    /* Contact Form - Mobile */
    .contact-form {
        max-width: 100% !important;
        padding: 0 !important;
    }

    .contact-form .form-group {
        margin-bottom: 1rem !important;
    }

    .contact-form input,
    .contact-form textarea {
        padding: 1rem !important;
        border-radius: 10px !important;
    }

    .contact-form button[type="submit"] {
        width: 100% !important;
        padding: 1rem !important;
        font-size: 0.95rem !important;
        min-height: 50px !important; /* Good touch target */
    }

    /* Section labels - better readability */
    .section-label {
        font-size: 0.7rem !important;
        padding: 0.5rem 1rem !important;
        letter-spacing: 0.05em !important;
    }

    /* Experts section - better card layout */
    .expert-card {
        padding: 1.25rem 1rem !important;
        text-align: center !important;
    }

    .expert-avatar-img img {
        width: 70px !important;
        height: 70px !important;
    }

    .expert-name {
        font-size: 1.1rem !important;
        margin-bottom: 0.5rem !important;
    }

    .expert-bio {
        font-size: 0.85rem !important;
        line-height: 1.4 !important;
    }

    /* Success stories header */
    .success-stories-header {
        text-align: center !important;
        margin-bottom: 1.5rem !important;
    }

    .success-stories-subtitle {
        font-size: 0.9rem !important;
    }

    /* Syllabus guest lectures */
    .guest-lecture-item {
        flex-wrap: wrap !important;
    }

    .lecturer-avatar {
        width: 28px !important;
        height: 28px !important;
    }

    .lecturer-attribution {
        font-size: 0.75rem !important;
    }

    /* CTA Column */
}

@media (max-width: 480px) {
    .section-title {
        font-size: 1.3rem !important;
    }

    /* Hero - Extra small screens - Full viewport */
    .hero {
        height: 100vh !important;
        height: 100svh !important;
        min-height: 500px !important;
        max-height: 100vh !important;
        max-height: 100svh !important;
        padding: 0 !important;
    }

    .hero-title {
        font-size: 1.6rem !important;
        line-height: 1.2 !important;
    }

    .hero-subtitle {
        font-size: 0.9rem !important;
    }

    .avatar-ring {
        width: 100px !important;
        height: 100px !important;
    }

    /* Hide orbit rings on very small screens for cleaner look */
    .orbit-1, .orbit-2, .orbit-3 {
        display: none !important;
    }

    .hero-stats {
        flex-wrap: nowrap;
        justify-content: center;
    }

    .stat-badge {
        flex: 1 1 40% !important;
        padding: 0.5rem !important;
        min-width: auto !important; /* Remove min-width to prevent overflow */
    }

    .stat-number {
        font-size: 1.25rem !important;
    }

    .stat-label {
        font-size: 0.65rem !important;
    }

    .experts-grid {
        grid-template-columns: 1fr !important;
    }

    /* Mentors Section - Extra small */
    .mentors-grid {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
    }

    .mentor-card {
        padding: 1.5rem 1rem !important;
    }

    .mentor-avatar-img {
        width: 80px !important;
        height: 80px !important;
    }

    .mentor-name {
        font-size: 1.15rem !important;
    }

    .mentor-role {
        font-size: 0.7rem !important;
    }

    .mentor-bio {
        font-size: 0.85rem !important;
    }

    .credential-tag {
        font-size: 0.65rem !important;
        padding: 0.3rem 0.5rem !important;
    }

    .community-title {
        font-size: 1.4rem !important;
    }

    .community-description-enhanced {
        font-size: 0.95rem !important;
    }

    .community-benefits li {
        font-size: 0.85rem !important;
    }

    .floating-stat {
        width: 75px !important;
        height: 75px !important;
    }

    .floating-stat-number {
        font-size: 0.95rem !important;
    }

    .floating-stat-label {
        font-size: 0.6rem !important;
    }

    /* Pricing - Extra small */
    .pricing-main-content {
        padding: 1rem !important;
    }

    .pricing-main-title {
        font-size: 1.4rem !important;
    }

    .time-value {
        font-size: 1.35rem !important;
        min-width: 36px !important;
        padding: 0.3rem 0.4rem !important;
    }

    .time-separator {
        font-size: 1rem !important;
    }

    .pricing-new-price {
        font-size: 2rem !important;
    }

    .price-current .amount {
        font-size: 2rem !important;
    }

    /* Modal - Extra small screens */
    .free-trial-modal {
        padding: 0.5rem !important;
    }

    .free-trial-modal-container {
        max-height: calc(100vh - 1rem) !important;
        max-height: calc(100dvh - 1rem) !important;
    }

    .trial-modal-left {
        padding: 1.25rem 1rem !important;
    }

    .trial-modal-right {
        padding: 1.25rem 1rem !important;
    }

    .trial-modal-title {
        font-size: 1rem !important;
    }

    .trial-value-item {
        padding: 0.6rem 0.75rem !important;
    }

    .trial-value-text {
        font-size: 0.8rem !important;
    }

    .trial-form-input {
        padding: 0.75rem 0.875rem !important;
        font-size: 16px !important; /* Must stay 16px to prevent iOS zoom */
    }

    .trial-submit-btn {
        padding: 0.875rem 1.25rem !important;
        font-size: 0.9rem !important;
    }

    /* Course Structure - Extra Small Screens */
    .code-preview-content pre {
        font-size: 0.6rem !important;
    }

    .stat-item-compact {
        gap: 0.1rem !important;
    }

    .stat-item-compact .stat-text {
        font-size: 0.7rem !important;
    }

    .training-highlight-box p,
    .step-info p {
        font-size: 0.8rem !important;
    }

    /* Testimonial carousel - Extra small */
    .testimonial-carousel {
        padding: 0 36px !important;
        position: relative !important;
    }

    .testimonial-nav {
        width: 32px !important;
        height: 32px !important;
        font-size: 1.25rem !important;
        min-width: 44px !important; /* Touch target */
        min-height: 44px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .testimonial-prev {
        left: 0 !important;
    }

    .testimonial-next {
        right: 0 !important;
    }

    .testimonial-quote {
        font-size: 0.85rem !important;
        line-height: 1.5 !important;
    }

    .testimonial-name {
        font-size: 0.95rem !important;
    }

    /* Syllabus - Extra small */
    .syllabus-main-title {
        font-size: 1.6rem !important;
    }

    .part-title {
        font-size: 1.4rem !important;
    }

    .syllabus-grid-modern {
        padding: 0.75rem !important;
        gap: 0.75rem !important;
    }

    .syllabus-item-modern {
        padding: 0.75rem !important;
        gap: 0.75rem !important;
    }

    .item-number {
        font-size: 1.4rem !important;
        min-width: 40px !important;
    }

    .item-title {
        font-size: 0.9rem !important;
    }

    /* FAQ - Extra small */
    .faq-question {
        padding: 1rem 0.75rem !important;
        font-size: 0.9rem !important;
    }

    .faq-question span:first-child {
        flex: 1 !important;
        padding-right: 0.5rem !important;
    }

    /* Contact section - Extra small */
    .contact-section .section-title {
        font-size: 1.2rem !important;
        line-height: 1.3 !important;
    }

    /* Footer - Extra small */
    .footer {
        padding: 1.5rem 0 !important;
    }

    .footer-content {
        gap: 0.75rem !important;
    }

    .copyright {
        font-size: 0.8rem !important;
    }

    .footer-links a {
        font-size: 0.8rem !important;
    }

    /* Salary section - Extra small */
    .salary-amount {
        font-size: 1.75rem !important;
    }

    .salary-tier h3 {
        font-size: 1rem !important;
    }

    /* SCH Lite Specific Overrides */
    .hero-lite {
        padding-top: 160px !important;
    }

    .hero-title-lite {
        font-size: 2rem !important;
    }

    .hero-subtitle-lite-primary {
        font-size: 1rem !important;
    }

    .hero-stats-lite {
        gap: 0.5rem !important;
        margin-bottom: 1.5rem !important;
    }

    .stat-box-lite {
        padding: 0.75rem !important;
        min-width: 80px !important;
    }

    .stat-number-lite {
        font-size: 1.5rem !important;
    }

    .comparison-grid-lite {
        grid-template-columns: 1fr !important;
        gap: 2rem !important;
    }

    .comparison-card-full,
    .comparison-card-lite {
        padding: 1.5rem !important;
    }

    .comparison-stats-grid {
        gap: 0.5rem !important;
    }

    .comparison-stat-row {
        font-size: 0.9rem !important;
    }

    .instructor-profile-lite {
        padding: 1.5rem !important;
    }

    .instructor-avatar-lite {
        width: 100px !important;
        height: 100px !important;
    }

    .social-links-lite {
        flex-direction: row !important;
        gap: 0.75rem !important;
        justify-content: center !important;
        flex-wrap: nowrap !important;
        padding: 0 1rem !important;
        margin-left: auto !important;
        margin-right: auto !important;
        max-width: 100% !important;
    }

    .social-btn-lite {
        width: auto !important;
        padding: 0.75rem !important;
        min-width: 50px !important;
        justify-content: center !important;
        gap: 0 !important;
        flex: 0 0 auto !important;
        flex-shrink: 0 !important;
    }

    /* Hide text labels in social buttons on mobile */
    .social-btn-lite svg {
        width: 22px !important;
        height: 22px !important;
        margin: 0 !important;
    }

    .social-btn-lite svg + * {
        display: none !important;
    }

    /* Ensure instructor section doesn't cut off buttons */
    .instructor-section-lite .container {
        overflow: visible !important;
    }
}
