﻿/*==============================================================
    SPACING
    Sanskritigram Cultural Centre
==============================================================*/


/*==============================================================
    SECTION SPACING
==============================================================*/

.site-section {
    position: relative;
    padding-block: var(--section-space-large);
}

.site-section--medium {
    padding-block: var(--section-space-medium);
}

.site-section--compact {
    padding-block: var(--section-space-small);
}

.site-section--flush {
    padding-block: 0;
}



/*==============================================================
    MARGIN UTILITIES
==============================================================*/

.mb-0 {
    margin-bottom: 0;
}

.mb-sm {
    margin-bottom: var(--space-sm);
}

.mb-md {
    margin-bottom: var(--space-md);
}

.mb-lg {
    margin-bottom: var(--space-lg);
}

.mb-xl {
    margin-bottom: var(--space-xl);
}



.mt-0 {
    margin-top: 0;
}

.mt-sm {
    margin-top: var(--space-sm);
}

.mt-md {
    margin-top: var(--space-md);
}

.mt-lg {
    margin-top: var(--space-lg);
}

.mt-xl {
    margin-top: var(--space-xl);
}



/*==============================================================
    PADDING UTILITIES
==============================================================*/

.pt-sm {
    padding-top: var(--space-sm);
}

.pt-md {
    padding-top: var(--space-md);
}

.pt-lg {
    padding-top: var(--space-lg);
}

.pt-xl {
    padding-top: var(--space-xl);
}



.pb-sm {
    padding-bottom: var(--space-sm);
}

.pb-md {
    padding-bottom: var(--space-md);
}

.pb-lg {
    padding-bottom: var(--space-lg);
}

.pb-xl {
    padding-bottom: var(--space-xl);
}



/*==============================================================
    GAP UTILITIES
==============================================================*/

.gap-sm {
    gap: var(--grid-gap-small);
}

.gap-md {
    gap: var(--grid-gap-medium);
}

.gap-lg {
    gap: var(--grid-gap-large);
}
