@media screen and (max-width: 767px) {
    /* Target the home pane container to enable ordering */
    #pane-home .pane-padded-content {
        display: flex;
        flex-direction: column;
    }

    .hero-container {
        display: flex;
        flex-direction: column;
        min-height: auto;
        padding: 0; /* Let parent .neo-tabs-container handle side padding */
        margin: 1rem 0 0; /* Reduced top to tighten layout */
        text-align: center;
        order: 1; /* Text and card info stay on top */
    }

    .hero {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
    }

    /* Restore the internal hero title/pill on mobile to ensure the core message is visible */
    .hero .badge,
    .hero h1,
    .hero p {
        display: block !important;
        width: 100%;
        text-align: center;
    }

    .hero .badge {
        display: inline-flex !important;
        width: fit-content;
        order: 1;
        margin-bottom: 1rem !important;
    }

    .hero h1 {
        order: 2;
        font-size: 1.8rem !important;
        line-height: 1.2;
        margin-bottom: 1rem; /* Matched to education page gap */
        color: #fff !important;
        font-weight: 800;
    }

    .hero h1 span {
        color: var(--gold) !important;
    }

    .hero-text-wrapper {
        display: contents !important;
    }

    .hero p.hero-intro {
        order: 3;
        font-size: 1rem;
        line-height: 1.6;
        color: var(--text-dim);
        margin-bottom: 2.5rem; /* Gap between intro and card */
    }

    /* Glass Card (Transparent Borrowing) - Placed BETWEEN descriptions */
    .hero .glass-card {
        order: 4;
        margin-top: 0 !important; 
        margin-bottom: 2.5rem !important; /* Gap between card and reminder (Identical to top gap) */
        padding: 0.8rem 1.25rem !important; 
        width: 100% !important; 
        max-width: 100% !important; 
        background: linear-gradient(135deg, 
            rgba(10, 14, 23, 0.8) 0%, 
            rgba(15, 20, 31, 0.7) 100%) !important;
        border-radius: 20px !important;
        position: relative;
        overflow: visible; 
        box-shadow: 
            inset 0 1.5px 0.5px rgba(255, 255, 255, 0.4),
            inset 0 -1.5px 0.5px rgba(0, 0, 0, 0.6),
            0 10px 30px rgba(0, 0, 0, 0.5) !important;
        box-sizing: border-box;
    }

    .hero p.hero-reminder {
        order: 6; /* Pushed down after features */
        font-size: 1rem;
        line-height: 1.6;
        color: var(--text-dim);
        padding: 0 !important;
        text-align: center;
        margin-top: 0 !important;
    }

    /* Home Features Grid (New) */
    .home-features-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 1.5rem !important;
        margin-top: 0 !important;
        margin-bottom: 2.5rem !important;
        order: 5 !important;
        width: 100% !important;
    }

    .home-features-grid .saved-input-card {
        text-align: left !important;
        padding: 1.25rem !important;
        background: rgba(255, 255, 255, 0.03) !important;
        border: 1px solid rgba(255, 255, 255, 0.08) !important;
        border-radius: 16px !important;
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2) !important;
    }

    .home-features-grid .saved-input-card h4 {
        margin: 0 !important;
        color: #fff !important;
        font-size: 1rem !important;
        font-weight: 900 !important;
    }

    .home-features-grid .saved-input-card p {
        text-align: left !important;
        font-size: 0.85rem !important;
        line-height: 1.5 !important;
        margin-top: 0 !important;
        color: var(--text-dim) !important;
    }

    /* Enable Lightning Border effect for mobile - ONLY on press */
    .hero .glass-card-static::before {
        content: '';
        position: absolute;
        inset: -3.5px;
        background: conic-gradient(from var(--border-angle), 
            transparent 70%, 
            rgba(255, 204, 51, 0.4) 85%, 
            rgba(255, 255, 255, 0.9) 95%, 
            rgba(255, 204, 51, 0.4) 100%) !important;
        border-radius: 22px;
        z-index: -1;
        animation: rotate-border 6s linear infinite !important; 
        opacity: 0 !important; /* Hidden by default */
        transition: opacity 0.2s ease;
    }

    .hero .glass-card-static:active::before {
        opacity: 1 !important; /* Show on press */
    }

    .hero .glass-card-static::after {
        content: '';
        position: absolute;
        inset: 1px;
        background: #11081e !important;
        border-radius: 19px;
        z-index: -1;
    }

    /* Hero Glass Card Heading & Text Scaling */
    .hero .glass-card h2 {
        font-size: 1.15rem !important;
        font-weight: 850 !important;
        margin: 0 !important;
        color: #fff !important; 
    }

    .hero .glass-card p {
        color: var(--text-dim) !important;
        margin-top: 0.2rem !important; 
        margin-bottom: 0 !important; 
        font-size: 0.85rem !important; 
        line-height: 1.4 !important; 
        padding: 0 0.2rem !important; 
    }

    .spline-wrapper {
        position: relative;
        width: 100%;
        height: 480px; 
        margin-top: -60px; /* Reduced negative margin to increase gap from description */
        overflow: hidden;
        order: 5; 
        display: flex;
        justify-content: center;
        align-items: center;
        pointer-events: auto;
        padding-bottom: 0; 
    }

    spline-viewer {
        width: 100%;
        height: 100%;
        /* Raised sikittt more using translateY */
        transform: scale(1.4) translateY(-4%) translateX(15%); 
        clip-path: inset(0 0 50px 0); 
    }
}