/* Explain: App-specific layout utilities (add as needed) */
.container-x {
    width: 100%;
    max-width: 72rem;
    margin-inline: auto;
    padding-inline: 1.25rem;
}

.section-pad {
    padding-block: 4.5rem;
}

.section-pad-sm {
    padding-block: 3.5rem;
}

@media (min-width: 768px) {
    .section-pad {
        padding-block: 6rem;
    }

    .section-pad-sm {
        padding-block: 4.75rem;
    }
}

.dark-panel {
    background: var(--primary-color);
    color: #ffffff;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    * {
        transition-duration: 0.01ms !important;
    }
}