/* ==========================================================
   ClearSkin4u — Layout
   Reusable containers, sections, soft bands, vertical rhythm.
   Load after base.css.
========================================================== */

/* ----- Container ----- */

#cs-prof .cs-wrap {
    width: min(calc(100% - 36px), 1160px);
    margin: 0 auto;
}

/* ----- Section rhythm ----- */

#cs-prof .cs-section {
    padding: 58px 0;
    scroll-margin-top: 16px;
}

#cs-prof .cs-soft {
    background: var(--cream);
}

/* ----- Responsive layout foundations ----- */

@media (min-width: 640px) {
    #cs-prof .cs-wrap {
        width: min(calc(100% - 60px), 1160px);
    }
}

@media (min-width: 920px) {
    #cs-prof .cs-section {
        padding: 84px 0;
    }
}