```css
/*=========================================================
  SINHOI 2026
  UTILITIES.CSS
==========================================================*/

/*=========================================================
DISPLAY
==========================================================*/

.d-none{display:none!important;}
.d-block{display:block!important;}
.d-inline{display:inline!important;}
.d-inline-block{display:inline-block!important;}
.d-flex{display:flex!important;}
.d-inline-flex{display:inline-flex!important;}
.d-grid{display:grid!important;}


/*=========================================================
FLEX
==========================================================*/

.flex-row{flex-direction:row!important;}
.flex-column{flex-direction:column!important;}
.flex-wrap{flex-wrap:wrap!important;}
.flex-nowrap{flex-wrap:nowrap!important;}

.justify-start{justify-content:flex-start!important;}
.justify-center{justify-content:center!important;}
.justify-end{justify-content:flex-end!important;}
.justify-between{justify-content:space-between!important;}
.justify-around{justify-content:space-around!important;}
.justify-evenly{justify-content:space-evenly!important;}

.items-start{align-items:flex-start!important;}
.items-center{align-items:center!important;}
.items-end{align-items:flex-end!important;}
.items-stretch{align-items:stretch!important;}

.self-start{align-self:flex-start!important;}
.self-center{align-self:center!important;}
.self-end{align-self:flex-end!important;}


/*=========================================================
GRID
==========================================================*/

.grid-1{grid-template-columns:1fr;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
.grid-auto{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));}


/*=========================================================
GAPS
==========================================================*/

.gap-0{gap:0;}
.gap-xs{gap:8px;}
.gap-sm{gap:16px;}
.gap-md{gap:24px;}
.gap-lg{gap:40px;}
.gap-xl{gap:64px;}
.gap-2xl{gap:96px;}


/*=========================================================
WIDTH
==========================================================*/

.w-auto{width:auto!important;}
.w-25{width:25%!important;}
.w-33{width:33.333%!important;}
.w-50{width:50%!important;}
.w-75{width:75%!important;}
.w-100{width:100%!important;}
.max-content{width:max-content;}


/*=========================================================
HEIGHT
==========================================================*/

.h-auto{height:auto!important;}
.h-100{height:100%!important;}
.min-vh-100{min-height:100vh;}


/*=========================================================
MARGIN
==========================================================*/

.m-0{margin:0!important;}
.mt-0{margin-top:0!important;}
.mb-0{margin-bottom:0!important;}

.mt-xs{margin-top:8px;}
.mt-sm{margin-top:16px;}
.mt-md{margin-top:24px;}
.mt-lg{margin-top:40px;}
.mt-xl{margin-top:64px;}
.mt-2xl{margin-top:96px;}

.mb-xs{margin-bottom:8px;}
.mb-sm{margin-bottom:16px;}
.mb-md{margin-bottom:24px;}
.mb-lg{margin-bottom:40px;}
.mb-xl{margin-bottom:64px;}
.mb-2xl{margin-bottom:96px;}

.ml-auto{margin-left:auto;}
.mr-auto{margin-right:auto;}
.mx-auto{
    margin-left:auto;
    margin-right:auto;
}


/*=========================================================
PADDING
==========================================================*/

.p-0{padding:0!important;}

.p-xs{padding:8px;}
.p-sm{padding:16px;}
.p-md{padding:24px;}
.p-lg{padding:40px;}
.p-xl{padding:64px;}

.pt-sm{padding-top:16px;}
.pt-md{padding-top:24px;}
.pt-lg{padding-top:40px;}
.pt-xl{padding-top:64px;}

.pb-sm{padding-bottom:16px;}
.pb-md{padding-bottom:24px;}
.pb-lg{padding-bottom:40px;}
.pb-xl{padding-bottom:64px;}


/*=========================================================
TEXT
==========================================================*/

.text-left{text-align:left!important;}
.text-center{text-align:center!important;}
.text-right{text-align:right!important;}

.uppercase{text-transform:uppercase;}
.lowercase{text-transform:lowercase;}
.capitalize{text-transform:capitalize;}

.fw-300{font-weight:300;}
.fw-400{font-weight:400;}
.fw-500{font-weight:500;}
.fw-600{font-weight:600;}
.fw-700{font-weight:700;}
.fw-800{font-weight:800;}


/*=========================================================
TEXT COLORS
==========================================================*/

.text-primary{color:var(--primary)!important;}
.text-secondary{color:var(--secondary)!important;}
.text-dark{color:var(--dark)!important;}
.text-light{color:var(--text-light)!important;}
.text-muted{color:var(--text-muted)!important;}
.text-white{color:#fff!important;}


/*=========================================================
BACKGROUND
==========================================================*/

.bg-primary{background:var(--primary)!important;}
.bg-secondary{background:var(--secondary)!important;}
.bg-dark{background:var(--dark)!important;}
.bg-light{background:var(--light)!important;}
.bg-paper{background:var(--paper)!important;}
.bg-white{background:#fff!important;}
.bg-transparent{background:transparent!important;}


/*=========================================================
BORDER
==========================================================*/

.border{border:1px solid var(--border);}
.border-0{border:none!important;}
.border-top{border-top:1px solid var(--border);}
.border-bottom{border-bottom:1px solid var(--border);}

.rounded{border-radius:var(--radius);}
.rounded-lg{border-radius:var(--radius-lg);}
.rounded-full{border-radius:999px;}


/*=========================================================
SHADOW
==========================================================*/

.shadow-none{box-shadow:none!important;}
.shadow-sm{box-shadow:var(--shadow-sm);}
.shadow-md{box-shadow:var(--shadow-md);}
.shadow-lg{box-shadow:var(--shadow-lg);}


/*=========================================================
POSITION
==========================================================*/

.relative{position:relative;}
.absolute{position:absolute;}
.fixed{position:fixed;}
.sticky{position:sticky;top:120px;}

.top-0{top:0;}
.right-0{right:0;}
.bottom-0{bottom:0;}
.left-0{left:0;}

.z-1{z-index:1;}
.z-10{z-index:10;}
.z-50{z-index:50;}
.z-100{z-index:100;}
.z-999{z-index:999;}


/*=========================================================
OVERFLOW
==========================================================*/

.overflow-hidden{overflow:hidden;}
.overflow-auto{overflow:auto;}
.overflow-visible{overflow:visible;}


/*=========================================================
OBJECT FIT
==========================================================*/

.object-cover img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.object-contain img{
    object-fit:contain;
}


/*=========================================================
CURSOR
==========================================================*/

.cursor-pointer{cursor:pointer;}
.cursor-default{cursor:default;}


/*=========================================================
OPACITY
==========================================================*/

.opacity-0{opacity:0;}
.opacity-25{opacity:.25;}
.opacity-50{opacity:.5;}
.opacity-75{opacity:.75;}
.opacity-100{opacity:1;}


/*=========================================================
VISIBILITY
==========================================================*/

.visible{visibility:visible;}
.invisible{visibility:hidden;}


/*=========================================================
TRANSFORMS
==========================================================*/

.scale-100{transform:scale(1);}
.scale-105{transform:scale(1.05);}
.rotate-3{transform:rotate(3deg);}
.rotate-n3{transform:rotate(-3deg);}


/*=========================================================
ELEMENTOR HELPERS
==========================================================*/

.no-margin .elementor-widget{
    margin-bottom:0!important;
}

.no-padding{
    padding:0!important;
}

.full-width{
    width:100%!important;
}

.hide-desktop{
    display:none;
}

@media(max-width:1024px){
.hide-desktop{
    display:block;
}
.hide-tablet{
    display:none!important;
}
}

@media(max-width:767px){
.hide-mobile{
    display:none!important;
}
.text-mobile-center{
    text-align:center!important;
}
.stack-mobile{
    flex-direction:column!important;
}
}
```