.corefit-hero,
.xersio-hero {
    background: radial-gradient(circle at 15% 20%, rgba(34, 211, 238, 0.2), transparent 34%),
                linear-gradient(130deg, #040816 0%, #0a1f3e 45%, #0a4aa2 100%);
}

.corefit-badge,
.xersio-badge {
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.35);
    color: #eff6ff;
}

.corefit-tag,
.xersio-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: #e2e8f0;
    border: 1px solid rgba(255, 255, 255, 0.3);
    background: rgba(255, 255, 255, 0.12);
    padding: 0.4rem 0.75rem;
    border-radius: 999px;
    font-size: 0.86rem;
    font-weight: 500;
}

.py-lg-6 {
    padding-top: 5rem;
    padding-bottom: 5rem;
}

.corefit-snapshot-card,
.xersio-snapshot-card {
    border-radius: 1.2rem;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.22);
    padding: 1rem;
    backdrop-filter: blur(8px);
}

.corefit-device-frame,
.xersio-device-frame {
    background: #0f172a;
    border-radius: 1.2rem;
    box-shadow: 0 30px 50px rgba(2, 6, 23, 0.3);
}

.desktop-frame {
    border: 1px solid #1e293b;
}

.mobile-frame {
    max-width: 320px;
    border: 2px solid #1e293b;
}

.corefit-feature,
.xersio-feature {
    border: 1px solid #dbeafe;
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.08);
}

.corefit-feature-icon,
.xersio-feature-icon {
    width: 2.7rem;
    height: 2.7rem;
    border-radius: 0.75rem;
    display: grid;
    place-items: center;
    margin-bottom: 0.9rem;
    color: #1d4ed8;
    background: #dbeafe;
    font-size: 1.15rem;
}

@media (max-width: 991.98px) {
    .py-lg-6 {
        padding-top: 3.5rem;
        padding-bottom: 3.5rem;
    }
}