/* Explain: Layout utilities and decorative backgrounds for a black, orange, and white theme. - */
.section-wrap {
    width: min(100% - 2rem, 1180px);
    margin-inline: auto;
}

.section-pad {
    padding-block: clamp(4.5rem, 8vw, 7.5rem);
}

.hero-orb {
    position: absolute;
    width: 24rem;
    height: 24rem;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(243, 112, 33, 0.25), transparent 70%);
    filter: blur(8px);
    pointer-events: none;
}

.header-glass {
    background: rgba(5, 5, 5, 0.85);
    backdrop-filter: blur(18px);
}

.fine-divider {
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--border-color), transparent);
}

.hero-image-shell {
    border-radius: 2.5rem;
    background: linear-gradient(145deg, var(--champagne-soft), var(--surface-color));
    padding: clamp(0.65rem, 1.4vw, 1rem);
    box-shadow: var(--shadow-soft);
}

.before-after-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

@media (min-width: 768px) {
    .before-after-grid {
        grid-template-columns: 1.05fr 0.95fr;
    }
}
