/*
 Theme Name:   ATHOD B-ONE
 Theme URI:    https://bricksbuilder.io/
 Description:  B-ONE is a custom child theme to extend the Bricks Builder functionality.
 Author:       ATHOD TECH
 Author URI:   https://athodtech.com/
 Template:     bricks
 Version:      1.13
 Text Domain:  bricks
*/

/* Basic Root CSS variables  
 * */

:root {
        --lh: clamp(1.5rem, 0.208vw + 1.458rem, 1.625rem);
        
		/* https://www.fluid-type-scale.com/calculate?minFontSize=16&minWidth=320&minRatio=1.125&maxFontSize=18&maxWidth=1280&maxRatio=1.2&steps=xs%2Cs%2Cm%2Cl%2Cxl&baseStep=m&prefix=text&decimals=2&useRems=on&remValue=16&previewFont=Inter&previewText=Almost+before+we+knew+it%2C+we+had+left+the+ground&previewWidth=1280 */
        --text-xs: clamp(0.79rem, -0.01vw + 0.79rem, 0.78rem);
        --text-s: clamp(0.89rem, 0.08vw + 0.87rem, 0.94rem);
        --text-m: clamp(1rem, 0.21vw + 0.96rem, 1.13rem);
        --text-l: clamp(1.13rem, 0.37vw + 1.05rem, 1.35rem);
        --text-xl: clamp(1.27rem, 0.59vw + 1.15rem, 1.62rem);
		
		/* https://www.fluid-type-scale.com/calculate?minFontSize=20&minWidth=320&minRatio=1.25&maxFontSize=22&maxWidth=1280&maxRatio=1.333&steps=6%2C5%2C4%2C3%2C2%2C1%2Ctitle&baseStep=4&prefix=h&decimals=2&useRems=on&remValue=16&previewFont=Inter&previewText=Almost+before+we+knew+it%2C+we+had+left+the+ground&previewWidth=1280 */
        --h6: clamp(0.8rem, -0.04vw + 0.81rem, 0.77rem);
        --h5: clamp(1rem, 0.05vw + 0.99rem, 1.03rem);
        --h4: clamp(1.25rem, 0.21vw + 1.21rem, 1.38rem);
        --h3: clamp(1.56rem, 0.45vw + 1.47rem, 1.83rem);
        --h2: clamp(1.95rem, 0.82vw + 1.79rem, 2.44rem);
        --h1: clamp(2.44rem, 1.36vw + 2.17rem, 3.26rem);
        --h-title: clamp(3.05rem, 2.15vw + 2.62rem, 3.85rem);
       
        --font-body: 'Be Vietnam Pro', Arial, Helvetica, Roboto, Open Sans, Noto Sans, sans-serif;
        --font-heading: 'PT Serif', Georgia, Merriweather, 'Times New Roman', Libre Baskerville, Bitter, serif;
	}

.font-body {
    font-family: var(--font-body); 
}
.font-heading {
    font-family: var(--font-heading); 
}

H1, .h1 {
    font-size: var(--h1);
    line-height: 1.28;
    letter-spacing: -0.125rem;
}
H2, .h2 {
    font-size: var(--h2);
    line-height: 1.29;
    letter-spacing: -0.075rem;
}
H3, .h3 {
    font-size: var(--h3);
    line-height: 1.3;
}
H4 {
    font-size: var(--h4);
    line-height: 1.3;
}
H5 {
    font-size: var(--h5);
    line-height: 1.3;
}
H6 {
    font-size: var(--h6);
    line-height: 1.4;
}
.text-xs {
    font-size: var(--text-xs);
}
.text-s {
    font-size: var(--text-s);
}
.text-m {
    font-size: var(--text-m);
}
.text-l {
    font-size: var(--text-l);
}
.text-xl {
    font-size: var(--text-xl);
}

.ht-box-shadow {
    box-shadow: 0 0 0 1px rgba(51, 62, 79, 0.15);
    transform: translateY(0);
    transition: all 0.75s cubic-bezier(0, 1, 0.5, 1);
}
.ht-box-shadow:hover {
    transform: translateY(-0.5rem);
    box-shadow: 0 0 0 1px rgba(51, 62, 79, 0.15), 0 2rem 2rem -1rem rgba(51, 62, 79, 0.15);
}

.link-body a, a.link-body {
    color: inherit;
}
.link-muted a, a.link-muted {
    color: var(--text-muted);
}

.link-underline a, a.link-underline {
    background-image: linear-gradient(transparent calc(100% - 1px), var(--text-body) 2px);
    background-size: 0% 100%;
    position: relative;
    text-decoration: none;
    background-repeat: no-repeat;
    transition: all 0.5s;
}

.link-underline a:hover, a.link-underline:hover {
    background-size: 100% 100%; 
}

@keyframes animLinkHover {
    0% {
        background-size: 0 1px;
    }
    100% {
        background-size: 100% 1px;
    }
}

.radius-top-left-0 {
    border-top-left-radius: 0 !important;
}

.radius-top-right-0 {
    border-top-right-radius: 0 !important;
}

.radius-bottom-left-0 {
    border-bottom-left-radius: 0 !important;
}

.radius-bottom-right-0 {
    border-bottom-right-radius: 0 !important;
}
.ht-border {
    border: 1px solid var(--text-muted);
}
.ht-button {
    border-radius: var(--radius-xs);
}
.ht-button-border {
    border-radius: var(--radius-xs);
    border-width: 1px;
    border-style: solid;
}

.ht-link-card-l {
    border-radius: var(--radius-l);
    border-bottom-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
    border-width: 1px;
    border-style: solid;
    overflow: hidden;
    box-shadow: var(--shadow-s);
    transform: translateY(0);
    transition: all 500ms ease-in-out;
    -webkit-transition: all 500ms ease-in-out;      
}

.ht-link-card-l:hover {
    box-shadow: var(--shadow-l);
    transform: translateY(-0.5rem);   
    transition: all 500ms ease-in-out;
    -webkit-transition: all 500ms ease-in-out;   
}

.ht-link-card-l a:after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
}

.ht-link-card-xl {
    border-radius: var(--radius-xl);
    border-bottom-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
    border-width: 1px;
    border-style: solid;
    overflow: hidden;
    box-shadow: var(--shadow-m);
}

.ht-link-card-xl:hover {
    box-shadow: var(--shadow-l);
    transform: translateY(-0.5rem);   
    transition: all 500ms ease-in-out;
    -webkit-transition: all 500ms ease-in-out;   
}

.ht-card-l {
    border-radius: var(--radius-l);
    border-bottom-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
    border-width: 1px;
    border-style: solid;
    overflow: hidden;
    box-shadow: var(--shadow-s);
}

.ht-card-xl {
    border-radius: var(--radius-xl);
    border-bottom-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
    border-width: 1px;
    border-style: solid;
    overflow: hidden;
    box-shadow: var(--shadow-m);
}
.brxe-post-content :where(h1,h2,h3,h4,h5,h6) {
    margin-bottom: 1rem !important;
    margin-top: 1.5rem !important;
}

/* Custom CSS Framework for HT  
 * */
:root {
    --primary: #9F141B;
    --secondary: #E4252F;
    --accent: #A82A30;
    --bg-body: #F3F2F0;
    --bg-light: #FAFAF9;
    --bg-dark: #323C46;
    --bg-white: #FFFFFF;
    --text-body: #333333;
    --text-title: #3A0E12;
    --text-muted: #999999;
    --text-white: #FFFFFF;
    --text-sub: #757575;
    --border-muted: #E7E7E6;
    --shadow-muted: rgba(153, 153, 153, 0.2);
    --shadow-primary: rgba(228, 37, 47, 0.2);
    --shadow-accent: rgba(29, 166, 154, 0.2);
    --success: #24F95D;
    --warning: #FFD900;
    --danger: #F92444;
    --info: #24B9F9;
    --space-4xs: clamp(0.33rem, calc(-0.03vw + 0.33rem), 0.31rem);
    --space-3xs: clamp(0.41rem, calc(0.05vw + 0.4rem), 0.44rem);
    --space-2xs: clamp(0.51rem, calc(0.18vw + 0.48rem), 0.62rem);
    --space-xs: clamp(0.64rem, calc(0.39vw + 0.56rem), 0.88rem);
    --space-s: clamp(0.8rem, calc(0.73vw + 0.65rem), 1.24rem);
    --space-m: clamp(1rem, calc(1.25vw + 0.75rem), 1.75rem);
    --space-l: clamp(1.25rem, calc(2.04vw + 0.84rem), 2.47rem);
    --space-xl: clamp(1.56rem, calc(3.23vw + 0.92rem), 3.5rem);
    --space-2xl: clamp(1.95rem, calc(4.99vw + 0.95rem), 4.95rem);
    --space-3xl: clamp(2.44rem, calc(7.59vw + 0.92rem), 7rem);
    --space-4xl: clamp(3.05rem, calc(11.4vw + 0.77rem), 9.89rem);
    --header-space: var(--space-s);
    --btn-space: var(--space-xs) var(--space-s);
    --card-space: var(--space-s);
    --footer-space: var(--space-s) var(--space-m);
    --radius-xs: 0.5rem;
    --radius-s: 0.75rem;
    --radius-m: 1rem;
    --radius-l: 1.75rem;
    --radius-xl: 3rem;
    --radius-full: 999rem;
    --shadow-xs: 0 1px 2px var(--shadow-muted);
    --shadow-s: 0 1.5px 3px var(--shadow-muted);
    --shadow-m: 0 2px 6px var(--shadow-muted);
    --shadow-l: 0 3px 12px var(--shadow-muted);
    --shadow-xl: 0 6px 48px var(--shadow-muted);
}
.bg-primary {
    background-color: var(--primary);
}
.text-primary {
    color: var(--primary);
}
.border-primary {
    border-color: var(--primary);
}
.bg-secondary {
    background-color: var(--secondary);
}
.text-secondary {
    color: var(--secondary);
}
.border-secondary {
    border-color: var(--secondary);
}
.bg-accent {
    background-color: var(--accent);
}
.text-accent {
    color: var(--accent);
}
.border-accent {
    border-color: var(--accent);
}
.bg-body {
    background-color: var(--bg-body);
}
.bg-light {
    background-color: var(--bg-light);
}
.bg-dark {
    background-color: var(--bg-dark);
}
.bg-white {
    background-color: var(--bg-white);
}
.bg-text-body {
    background-color: var(--text-body);
}
.text-body {
    color: var(--text-body);
}
.bg-text-title {
    background-color: var(--text-title);
}
.text-title {
    color: var(--text-title);
}
.bg-text-muted {
    background-color: var(--text-muted);
}
.text-muted {
    color: var(--text-muted);
}
.bg-text-white {
    background-color: var(--text-white);
}
.text-white {
    color: var(--text-white);
}
.bg-text-sub {
    background-color: var(--text-sub);
}
.text-sub {
    color: var(--text-sub);
}
.border-muted {
    border-color: var(--border-muted);
}
.bg-success {
    background-color: var(--success);
}
.text-success {
    color: var(--success);
}
.bg-warning {
    background-color: var(--warning);
}
.text-warning {
    color: var(--warning);
}
.bg-danger {
    background-color: var(--danger);
}
.text-danger {
    color: var(--danger);
}
.bg-info {
    background-color: var(--info);
}
.text-info {
    color: var(--info);
}
.padding-4xs {
    padding: 0.33rem;
    padding: var(--space-4xs);
}
.padding-3xs {
    padding: 0.41rem;
    padding: var(--space-3xs);
}
.padding-2xs {
    padding: 0.51rem;
    padding: var(--space-2xs);
}
.padding-xs {
    padding: 0.64rem;
    padding: var(--space-xs);
}
.padding-s {
    padding: 0.8rem;
    padding: var(--space-s);
}
.padding-m {
    padding: 1rem;
    padding: var(--space-m);
}
.padding-l {
    padding: 1.25rem;
    padding: var(--space-l);
}
.padding-xl {
    padding: 1.56rem;
    padding: var(--space-xl);
}
.padding-2xl {
    padding: 1.95rem;
    padding: var(--space-2xl);
}
.padding-3xl {
    padding: 2.44rem;
    padding: var(--space-3xl);
}
.padding-4xl {
    padding: 3.05rem;
    padding: var(--space-4xl);
}
.padding-horizontal-4xs {
    padding-left: 0.33rem;
    padding-left: var(--space-4xs);
    padding-right: 0.33rem;
    padding-right: var(--space-4xs);
}
.padding-horizontal-3xs {
    padding-left: 0.41rem;
    padding-left: var(--space-3xs);
    padding-right: 0.41rem;
    padding-right: var(--space-3xs);
}
.padding-horizontal-2xs {
    padding-left: 0.51rem;
    padding-left: var(--space-2xs);
    padding-right: 0.51rem;
    padding-right: var(--space-2xs);
}
.padding-horizontal-xs {
    padding-left: 0.64rem;
    padding-left: var(--space-xs);
    padding-right: 0.64rem;
    padding-right: var(--space-xs);
}
.padding-horizontal-s {
    padding-left: 0.8rem;
    padding-left: var(--space-s);
    padding-right: 0.8rem;
    padding-right: var(--space-s);
}
.padding-horizontal-m {
    padding-left: 1rem;
    padding-left: var(--space-m);
    padding-right: 1rem;
    padding-right: var(--space-m);
}
.padding-horizontal-l {
    padding-left: 1.25rem;
    padding-left: var(--space-l);
    padding-right: 1.25rem;
    padding-right: var(--space-l);
}
.padding-horizontal-xl {
    padding-left: 1.56rem;
    padding-left: var(--space-xl);
    padding-right: 1.56rem;
    padding-right: var(--space-xl);
}
.padding-horizontal-2xl {
    padding-left: 1.95rem;
    padding-left: var(--space-2xl);
    padding-right: 1.95rem;
    padding-right: var(--space-2xl);
}
.padding-horizontal-3xl {
    padding-left: 2.44rem;
    padding-left: var(--space-3xl);
    padding-right: 2.44rem;
    padding-right: var(--space-3xl);
}
.padding-horizontal-4xl {
    padding-left: 3.05rem;
    padding-left: var(--space-4xl);
    padding-right: 3.05rem;
    padding-right: var(--space-4xl);
}
.padding-vertical-4xs {
    padding-top: 0.33rem;
    padding-top: var(--space-4xs);
    padding-bottom: 0.33rem;
    padding-bottom: var(--space-4xs);
}
.padding-vertical-3xs {
    padding-top: 0.41rem;
    padding-top: var(--space-3xs);
    padding-bottom: 0.41rem;
    padding-bottom: var(--space-3xs);
}
.padding-vertical-2xs {
    padding-top: 0.51rem;
    padding-top: var(--space-2xs);
    padding-bottom: 0.51rem;
    padding-bottom: var(--space-2xs);
}
.padding-vertical-xs {
    padding-top: 0.64rem;
    padding-top: var(--space-xs);
    padding-bottom: 0.64rem;
    padding-bottom: var(--space-xs);
}
.padding-vertical-s {
    padding-top: 0.8rem;
    padding-top: var(--space-s);
    padding-bottom: 0.8rem;
    padding-bottom: var(--space-s);
}
.padding-vertical-m {
    padding-top: 1rem;
    padding-top: var(--space-m);
    padding-bottom: 1rem;
    padding-bottom: var(--space-m);
}
.padding-vertical-l {
    padding-top: 1.25rem;
    padding-top: var(--space-l);
    padding-bottom: 1.25rem;
    padding-bottom: var(--space-l);
}
.padding-vertical-xl {
    padding-top: 1.56rem;
    padding-top: var(--space-xl);
    padding-bottom: 1.56rem;
    padding-bottom: var(--space-xl);
}
.padding-vertical-2xl {
    padding-top: 1.95rem;
    padding-top: var(--space-2xl);
    padding-bottom: 1.95rem;
    padding-bottom: var(--space-2xl);
}
.padding-vertical-3xl {
    padding-top: 2.44rem;
    padding-top: var(--space-3xl);
    padding-bottom: 2.44rem;
    padding-bottom: var(--space-3xl);
}
.padding-vertical-4xl {
    padding-top: 3.05rem;
    padding-top: var(--space-4xl);
    padding-bottom: 3.05rem;
    padding-bottom: var(--space-4xl);
}
.padding-top-4xs {
    padding-top: 0.33rem;
    padding-top: var(--space-4xs);
}
.padding-top-3xs {
    padding-top: 0.41rem;
    padding-top: var(--space-3xs);
}
.padding-top-2xs {
    padding-top: 0.51rem;
    padding-top: var(--space-2xs);
}
.padding-top-xs {
    padding-top: 0.64rem;
    padding-top: var(--space-xs);
}
.padding-top-s {
    padding-top: 0.8rem;
    padding-top: var(--space-s);
}
.padding-top-m {
    padding-top: 1rem;
    padding-top: var(--space-m);
}
.padding-top-l {
    padding-top: 1.25rem;
    padding-top: var(--space-l);
}
.padding-top-xl {
    padding-top: 1.56rem;
    padding-top: var(--space-xl);
}
.padding-top-2xl {
    padding-top: 1.95rem;
    padding-top: var(--space-2xl);
}
.padding-top-3xl {
    padding-top: 2.44rem;
    padding-top: var(--space-3xl);
}
.padding-top-4xl {
    padding-top: 3.05rem;
    padding-top: var(--space-4xl);
}
.padding-right-4xs {
    padding-right: 0.33rem;
    padding-right: var(--space-4xs);
}
.padding-right-3xs {
    padding-right: 0.41rem;
    padding-right: var(--space-3xs);
}
.padding-right-2xs {
    padding-right: 0.51rem;
    padding-right: var(--space-2xs);
}
.padding-right-xs {
    padding-right: 0.64rem;
    padding-right: var(--space-xs);
}
.padding-right-s {
    padding-right: 0.8rem;
    padding-right: var(--space-s);
}
.padding-right-m {
    padding-right: 1rem;
    padding-right: var(--space-m);
}
.padding-right-l {
    padding-right: 1.25rem;
    padding-right: var(--space-l);
}
.padding-right-xl {
    padding-right: 1.56rem;
    padding-right: var(--space-xl);
}
.padding-right-2xl {
    padding-right: 1.95rem;
    padding-right: var(--space-2xl);
}
.padding-right-3xl {
    padding-right: 2.44rem;
    padding-right: var(--space-3xl);
}
.padding-right-4xl {
    padding-right: 3.05rem;
    padding-right: var(--space-4xl);
}
.padding-bottom-4xs {
    padding-bottom: 0.33rem;
    padding-bottom: var(--space-4xs);
}
.padding-bottom-3xs {
    padding-bottom: 0.41rem;
    padding-bottom: var(--space-3xs);
}
.padding-bottom-2xs {
    padding-bottom: 0.51rem;
    padding-bottom: var(--space-2xs);
}
.padding-bottom-xs {
    padding-bottom: 0.64rem;
    padding-bottom: var(--space-xs);
}
.padding-bottom-s {
    padding-bottom: 0.8rem;
    padding-bottom: var(--space-s);
}
.padding-bottom-m {
    padding-bottom: 1rem;
    padding-bottom: var(--space-m);
}
.padding-bottom-l {
    padding-bottom: 1.25rem;
    padding-bottom: var(--space-l);
}
.padding-bottom-xl {
    padding-bottom: 1.56rem;
    padding-bottom: var(--space-xl);
}
.padding-bottom-2xl {
    padding-bottom: 1.95rem;
    padding-bottom: var(--space-2xl);
}
.padding-bottom-3xl {
    padding-bottom: 2.44rem;
    padding-bottom: var(--space-3xl);
}
.padding-bottom-4xl {
    padding-bottom: 3.05rem;
    padding-bottom: var(--space-4xl);
}
.padding-left-4xs {
    padding-left: 0.33rem;
    padding-left: var(--space-4xs);
}
.padding-left-3xs {
    padding-left: 0.41rem;
    padding-left: var(--space-3xs);
}
.padding-left-2xs {
    padding-left: 0.51rem;
    padding-left: var(--space-2xs);
}
.padding-left-xs {
    padding-left: 0.64rem;
    padding-left: var(--space-xs);
}
.padding-left-s {
    padding-left: 0.8rem;
    padding-left: var(--space-s);
}
.padding-left-m {
    padding-left: 1rem;
    padding-left: var(--space-m);
}
.padding-left-l {
    padding-left: 1.25rem;
    padding-left: var(--space-l);
}
.padding-left-xl {
    padding-left: 1.56rem;
    padding-left: var(--space-xl);
}
.padding-left-2xl {
    padding-left: 1.95rem;
    padding-left: var(--space-2xl);
}
.padding-left-3xl {
    padding-left: 2.44rem;
    padding-left: var(--space-3xl);
}
.padding-left-4xl {
    padding-left: 3.05rem;
    padding-left: var(--space-4xl);
}
.margin-4xs {
    margin: 0.33rem;
    margin: var(--space-4xs);
}
.margin-3xs {
    margin: 0.41rem;
    margin: var(--space-3xs);
}
.margin-2xs {
    margin: 0.51rem;
    margin: var(--space-2xs);
}
.margin-xs {
    margin: 0.64rem;
    margin: var(--space-xs);
}
.margin-s {
    margin: 0.8rem;
    margin: var(--space-s);
}
.margin-m {
    margin: 1rem;
    margin: var(--space-m);
}
.margin-l {
    margin: 1.25rem;
    margin: var(--space-l);
}
.margin-xl {
    margin: 1.56rem;
    margin: var(--space-xl);
}
.margin-2xl {
    margin: 1.95rem;
    margin: var(--space-2xl);
}
.margin-3xl {
    margin: 2.44rem;
    margin: var(--space-3xl);
}
.margin-4xl {
    margin: 3.05rem;
    margin: var(--space-4xl);
}
.margin-horizontal-4xs {
    margin-left: 0.33rem;
    margin-left: var(--space-4xs);
    margin-right: 0.33rem;
    margin-right: var(--space-4xs);
}
.margin-horizontal-3xs {
    margin-left: 0.41rem;
    margin-left: var(--space-3xs);
    margin-right: 0.41rem;
    margin-right: var(--space-3xs);
}
.margin-horizontal-2xs {
    margin-left: 0.51rem;
    margin-left: var(--space-2xs);
    margin-right: 0.51rem;
    margin-right: var(--space-2xs);
}
.margin-horizontal-xs {
    margin-left: 0.64rem;
    margin-left: var(--space-xs);
    margin-right: 0.64rem;
    margin-right: var(--space-xs);
}
.margin-horizontal-s {
    margin-left: 0.8rem;
    margin-left: var(--space-s);
    margin-right: 0.8rem;
    margin-right: var(--space-s);
}
.margin-horizontal-m {
    margin-left: 1rem;
    margin-left: var(--space-m);
    margin-right: 1rem;
    margin-right: var(--space-m);
}
.margin-horizontal-l {
    margin-left: 1.25rem;
    margin-left: var(--space-l);
    margin-right: 1.25rem;
    margin-right: var(--space-l);
}
.margin-horizontal-xl {
    margin-left: 1.56rem;
    margin-left: var(--space-xl);
    margin-right: 1.56rem;
    margin-right: var(--space-xl);
}
.margin-horizontal-2xl {
    margin-left: 1.95rem;
    margin-left: var(--space-2xl);
    margin-right: 1.95rem;
    margin-right: var(--space-2xl);
}
.margin-horizontal-3xl {
    margin-left: 2.44rem;
    margin-left: var(--space-3xl);
    margin-right: 2.44rem;
    margin-right: var(--space-3xl);
}
.margin-horizontal-4xl {
    margin-left: 3.05rem;
    margin-left: var(--space-4xl);
    margin-right: 3.05rem;
    margin-right: var(--space-4xl);
}
.margin-vertical-4xs {
    margin-top: 0.33rem;
    margin-top: var(--space-4xs);
    margin-bottom: 0.33rem;
    margin-bottom: var(--space-4xs);
}
.margin-vertical-3xs {
    margin-top: 0.41rem;
    margin-top: var(--space-3xs);
    margin-bottom: 0.41rem;
    margin-bottom: var(--space-3xs);
}
.margin-vertical-2xs {
    margin-top: 0.51rem;
    margin-top: var(--space-2xs);
    margin-bottom: 0.51rem;
    margin-bottom: var(--space-2xs);
}
.margin-vertical-xs {
    margin-top: 0.64rem;
    margin-top: var(--space-xs);
    margin-bottom: 0.64rem;
    margin-bottom: var(--space-xs);
}
.margin-vertical-s {
    margin-top: 0.8rem;
    margin-top: var(--space-s);
    margin-bottom: 0.8rem;
    margin-bottom: var(--space-s);
}
.margin-vertical-m {
    margin-top: 1rem;
    margin-top: var(--space-m);
    margin-bottom: 1rem;
    margin-bottom: var(--space-m);
}
.margin-vertical-l {
    margin-top: 1.25rem;
    margin-top: var(--space-l);
    margin-bottom: 1.25rem;
    margin-bottom: var(--space-l);
}
.margin-vertical-xl {
    margin-top: 1.56rem;
    margin-top: var(--space-xl);
    margin-bottom: 1.56rem;
    margin-bottom: var(--space-xl);
}
.margin-vertical-2xl {
    margin-top: 1.95rem;
    margin-top: var(--space-2xl);
    margin-bottom: 1.95rem;
    margin-bottom: var(--space-2xl);
}
.margin-vertical-3xl {
    margin-top: 2.44rem;
    margin-top: var(--space-3xl);
    margin-bottom: 2.44rem;
    margin-bottom: var(--space-3xl);
}
.margin-vertical-4xl {
    margin-top: 3.05rem;
    margin-top: var(--space-4xl);
    margin-bottom: 3.05rem;
    margin-bottom: var(--space-4xl);
}
.margin-top-4xs {
    margin-top: 0.33rem;
    margin-top: var(--space-4xs);
}
.margin-top-3xs {
    margin-top: 0.41rem;
    margin-top: var(--space-3xs);
}
.margin-top-2xs {
    margin-top: 0.51rem;
    margin-top: var(--space-2xs);
}
.margin-top-xs {
    margin-top: 0.64rem;
    margin-top: var(--space-xs);
}
.margin-top-s {
    margin-top: 0.8rem;
    margin-top: var(--space-s);
}
.margin-top-m {
    margin-top: 1rem;
    margin-top: var(--space-m);
}
.margin-top-l {
    margin-top: 1.25rem;
    margin-top: var(--space-l);
}
.margin-top-xl {
    margin-top: 1.56rem;
    margin-top: var(--space-xl);
}
.margin-top-2xl {
    margin-top: 1.95rem;
    margin-top: var(--space-2xl);
}
.margin-top-3xl {
    margin-top: 2.44rem;
    margin-top: var(--space-3xl);
}
.margin-top-4xl {
    margin-top: 3.05rem;
    margin-top: var(--space-4xl);
}
.margin-right-4xs {
    margin-right: 0.33rem;
    margin-right: var(--space-4xs);
}
.margin-right-3xs {
    margin-right: 0.41rem;
    margin-right: var(--space-3xs);
}
.margin-right-2xs {
    margin-right: 0.51rem;
    margin-right: var(--space-2xs);
}
.margin-right-xs {
    margin-right: 0.64rem;
    margin-right: var(--space-xs);
}
.margin-right-s {
    margin-right: 0.8rem;
    margin-right: var(--space-s);
}
.margin-right-m {
    margin-right: 1rem;
    margin-right: var(--space-m);
}
.margin-right-l {
    margin-right: 1.25rem;
    margin-right: var(--space-l);
}
.margin-right-xl {
    margin-right: 1.56rem;
    margin-right: var(--space-xl);
}
.margin-right-2xl {
    margin-right: 1.95rem;
    margin-right: var(--space-2xl);
}
.margin-right-3xl {
    margin-right: 2.44rem;
    margin-right: var(--space-3xl);
}
.margin-right-4xl {
    margin-right: 3.05rem;
    margin-right: var(--space-4xl);
}
.margin-bottom-4xs {
    margin-bottom: 0.33rem;
    margin-bottom: var(--space-4xs);
}
.margin-bottom-3xs {
    margin-bottom: 0.41rem;
    margin-bottom: var(--space-3xs);
}
.margin-bottom-2xs {
    margin-bottom: 0.51rem;
    margin-bottom: var(--space-2xs);
}
.margin-bottom-xs {
    margin-bottom: 0.64rem;
    margin-bottom: var(--space-xs);
}
.margin-bottom-s {
    margin-bottom: 0.8rem;
    margin-bottom: var(--space-s);
}
.margin-bottom-m {
    margin-bottom: 1rem;
    margin-bottom: var(--space-m);
}
.margin-bottom-l {
    margin-bottom: 1.25rem;
    margin-bottom: var(--space-l);
}
.margin-bottom-xl {
    margin-bottom: 1.56rem;
    margin-bottom: var(--space-xl);
}
.margin-bottom-2xl {
    margin-bottom: 1.95rem;
    margin-bottom: var(--space-2xl);
}
.margin-bottom-3xl {
    margin-bottom: 2.44rem;
    margin-bottom: var(--space-3xl);
}
.margin-bottom-4xl {
    margin-bottom: 3.05rem;
    margin-bottom: var(--space-4xl);
}
.margin-left-4xs {
    margin-left: 0.33rem;
    margin-left: var(--space-4xs);
}
.margin-left-3xs {
    margin-left: 0.41rem;
    margin-left: var(--space-3xs);
}
.margin-left-2xs {
    margin-left: 0.51rem;
    margin-left: var(--space-2xs);
}
.margin-left-xs {
    margin-left: 0.64rem;
    margin-left: var(--space-xs);
}
.margin-left-s {
    margin-left: 0.8rem;
    margin-left: var(--space-s);
}
.margin-left-m {
    margin-left: 1rem;
    margin-left: var(--space-m);
}
.margin-left-l {
    margin-left: 1.25rem;
    margin-left: var(--space-l);
}
.margin-left-xl {
    margin-left: 1.56rem;
    margin-left: var(--space-xl);
}
.margin-left-2xl {
    margin-left: 1.95rem;
    margin-left: var(--space-2xl);
}
.margin-left-3xl {
    margin-left: 2.44rem;
    margin-left: var(--space-3xl);
}
.margin-left-4xl {
    margin-left: 3.05rem;
    margin-left: var(--space-4xl);
}
.gap-4xs {
    gap: 0.33rem;
    gap: var(--space-4xs);
}
.gap-3xs {
    gap: 0.41rem;
    gap: var(--space-3xs);
}
.gap-2xs {
    gap: 0.51rem;
    gap: var(--space-2xs);
}
.gap-xs {
    gap: 0.64rem;
    gap: var(--space-xs);
}
.gap-s {
    gap: 0.8rem;
    gap: var(--space-s);
}
.gap-m {
    gap: 1rem;
    gap: var(--space-m);
}
.gap-l {
    gap: 1.25rem;
    gap: var(--space-l);
}
.gap-xl {
    gap: 1.56rem;
    gap: var(--space-xl);
}
.gap-2xl {
    gap: 1.95rem;
    gap: var(--space-2xl);
}
.gap-3xl {
    gap: 2.44rem;
    gap: var(--space-3xl);
}
.gap-4xl {
    gap: 3.05rem;
    gap: var(--space-4xl);
}
.gap-horizontal-4xs {
    column-gap: 0.33rem;
    column-gap: var(--space-4xs);
}
.gap-horizontal-3xs {
    column-gap: 0.41rem;
    column-gap: var(--space-3xs);
}
.gap-horizontal-2xs {
    column-gap: 0.51rem;
    column-gap: var(--space-2xs);
}
.gap-horizontal-xs {
    column-gap: 0.64rem;
    column-gap: var(--space-xs);
}
.gap-horizontal-s {
    column-gap: 0.8rem;
    column-gap: var(--space-s);
}
.gap-horizontal-m {
    column-gap: 1rem;
    column-gap: var(--space-m);
}
.gap-horizontal-l {
    column-gap: 1.25rem;
    column-gap: var(--space-l);
}
.gap-horizontal-xl {
    column-gap: 1.56rem;
    column-gap: var(--space-xl);
}
.gap-horizontal-2xl {
    column-gap: 1.95rem;
    column-gap: var(--space-2xl);
}
.gap-horizontal-3xl {
    column-gap: 2.44rem;
    column-gap: var(--space-3xl);
}
.gap-horizontal-4xl {
    column-gap: 3.05rem;
    column-gap: var(--space-4xl);
}
.gap-vertical-4xs {
    row-gap: 0.33rem;
    row-gap: var(--space-4xs);
}
.gap-vertical-3xs {
    row-gap: 0.41rem;
    row-gap: var(--space-3xs);
}
.gap-vertical-2xs {
    row-gap: 0.51rem;
    row-gap: var(--space-2xs);
}
.gap-vertical-xs {
    row-gap: 0.64rem;
    row-gap: var(--space-xs);
}
.gap-vertical-s {
    row-gap: 0.8rem;
    row-gap: var(--space-s);
}
.gap-vertical-m {
    row-gap: 1rem;
    row-gap: var(--space-m);
}
.gap-vertical-l {
    row-gap: 1.25rem;
    row-gap: var(--space-l);
}
.gap-vertical-xl {
    row-gap: 1.56rem;
    row-gap: var(--space-xl);
}
.gap-vertical-2xl {
    row-gap: 1.95rem;
    row-gap: var(--space-2xl);
}
.gap-vertical-3xl {
    row-gap: 2.44rem;
    row-gap: var(--space-3xl);
}
.gap-vertical-4xl {
    row-gap: 3.05rem;
    row-gap: var(--space-4xl);
}
.margin-top-auto {
    margin-top: auto;
}
.margin-right-auto {
    margin-right: auto;
}
.margin-bottom-auto {
    margin-bottom: auto;
}
.margin-left-auto {
    margin-left: auto;
}
.margin-auto {
    margin: auto;
}
.padding-vertical-auto {
    padding-top: auto;
    padding-bottom: auto;
}
.padding-horizontal-auto {
    padding-left: auto;
    padding-right: auto;
}
.line-height-xs {
    line-height: 1;
}
.line-height-s {
    line-height: 1.2;
}
.line-height-m {
    line-height: 1.3;
}
.line-height-l {
    line-height: 1.4;
}
.line-height-xl {
    line-height: 1.5;
}
.italic {
    font-style: italic;
}
.bold {
    font-weight: bold;
}
.lowercase {
    text-transform: lowercase;
}
.uppercase {
    text-transform: uppercase;
}
.underline {
    -webkit-text-decoration: underline;
    text-decoration: underline;
}
.font-100 {
    font-weight: 100;
}
.font-200 {
    font-weight: 200;
}
.font-300 {
    font-weight: 300;
}
.font-400 {
    font-weight: 400;
}
.font-500 {
    font-weight: 500;
}
.font-600 {
    font-weight: 600;
}
.font-700 {
    font-weight: 700;
}
.font-800 {
    font-weight: 800;
}
.font-900 {
    font-weight: 900;
}
.text-left {
    text-align: left;
}
.text-center {
    text-align: center;
}
.text-right {
    text-align: right;
}
.text-balance {
    text-wrap: balance;
}
.text-nowrap {
    text-wrap: nowrap;
}
.radius-xs {
    border-radius: var(--radius-xs);
}
.radius-s {
    border-radius: var(--radius-s);
}
.radius-m {
    border-radius: var(--radius-m);
}
.radius-l {
    border-radius: var(--radius-l);
}
.radius-xl {
    border-radius: var(--radius-xl);
}
.radius-full {
    border-radius: var(--radius-full);
}
.border {
    border-width: 1px;
    border-style: solid;
}
.border-left {
    border-left-width: 1px;
    border-left-style: solid;
}
.border-right {
    border-right-width: 1px;
    border-right-style: solid;
}
.border-top {
    border-top-width: 1px;
    border-top-style: solid;
}
.border-bottom {
    border-bottom-width: 1px;
    border-bottom-style: solid;
}
.shadow-xs {
    box-shadow: var(--shadow-xs);
}
.shadow-s {
    box-shadow: var(--shadow-s);
}
.shadow-m {
    box-shadow: var(--shadow-m);
}
.shadow-l {
    box-shadow: var(--shadow-l);
}
.shadow-xl {
    box-shadow: var(--shadow-xl);
}
.bg-blur-xs {
    -webkit-backdrop-filter: blur(2px);
            backdrop-filter: blur(2px);
}
.bg-blur-s {
    -webkit-backdrop-filter: blur(4px);
            backdrop-filter: blur(4px);
}
.bg-blur-m {
    -webkit-backdrop-filter: blur(8px);
            backdrop-filter: blur(8px);
}
.bg-blur-l {
    -webkit-backdrop-filter: blur(16px);
            backdrop-filter: blur(16px);
}
.bg-blur-xl {
    -webkit-backdrop-filter: blur(32px);
            backdrop-filter: blur(32px);
}
.display-none {
    display: none;
}
.visible {
    visibility: visible;
}
.hidden {
    visibility: hidden;
}
.overflow-hidden {
    overflow: hidden;
}
.overflow-auto {
    overflow: auto;
}
.overflow-x-hidden {
    overflow-x: hidden;
}
.overflow-x-auto {
    overflow-x: auto;
}
.overflow-y-hidden {
    overflow-y: hidden;
}
.overflow-y-auto {
    overflow-y: auto;
}
.list-none {
    list-style-type: none;
}
.white-space-nowrap {
    white-space: nowrap;
}
.transition-global {
    transition: all 0.3s;
}
.relative {
    position: relative;
}
.absolute {
    position: absolute;
}
.sticky {
    position: sticky;
}
.fixed {
    position: fixed;
}
.inset-0 {
    inset: 0;
}
.bottom-0 {
    bottom: 0;
}
.top-0 {
    top: 0;
}
.left-0 {
    left: 0;
}
.right-0 {
    right: 0;
}
.z--1 {
    z-index: -1;
}
.z-0 {
    z-index: 0;
}
.z-1 {
    z-index: 1;
}
.z-10 {
    z-index: 10;
}
.z-100 {
    z-index: 100;
}
.z-1000 {
    z-index: 1000;
}
.z-10000 {
    z-index: 10000;
}