/* ==========================================================================
   UTILITY CLASSES - Helper classes, font sizes, line heights, icons
   ========================================================================== */

/* Background Gradients */
.bg-lightan {
    background: linear-gradient(to bottom, #ffffff 50%, rgba(30, 87, 199, 0.08) 100%);
}

/* Overlays */
.bg-overlay-black {
    background-color: #242527;
    opacity: 0.8;
    background-position: center;
    position: absolute;
    height: 100%;
    width: 100%;
    right: 0;
    bottom: 0;
    left: 0;
    top: 0;
}

/* Font Sizes */
.f-10 { font-size: 10px; }
.f-12 { font-size: 12px; }
.f-13 { font-size: 13px; }
.f-14 { font-size: 14px; }
.f-15 { font-size: 15px; }
.f-16 { font-size: 16px; }
.f-18 { font-size: 18px; }
.f-19 { font-size: 19px; }
.f-20 { font-size: 20px; }

/* Line Heights */
.line-height_1_4 { line-height: 1.4; }
.line-height_1_6 { line-height: 1.6; }
.line-height_1_8 { line-height: 1.8; }

/* Font Weights */
.fw-normal { font-weight: 500 !important; }
.fw-bold { font-weight: 600 !important; }

/* Icon Sizes */
.icon-size-15 { height: 15px; width: 15px; }
.icon-size-15 svg { height: 15px !important; width: 15px !important; }

.icon-sm { height: 18px; width: 18px; }
.icon-sm svg { height: 18px !important; width: 18px !important; }

.icon-xs { height: 20px; width: 20px; }
.icon-xs svg { height: 20px !important; width: 20px !important; }

.icon-md { height: 25px; width: 25px; }
.icon-md svg { height: 25px !important; width: 25px !important; }

.icon-lg { height: 30px; width: 30px; }
.icon-lg svg { height: 30px !important; width: 30px !important; }

.icon-xl { height: 35px; width: 35px; }
.icon-xl svg { height: 35px !important; width: 35px !important; }

.icon-xxl { height: 40px; width: 40px; }
.icon-xxl svg { height: 40px !important; width: 40px !important; }

.icon-xxxl { height: 60px; width: 60px; }
.icon-xxxl svg { height: 60px !important; width: 60px !important; }

.icon { position: relative; top: -2px; }

/* Icon Colors and Fills */
.uim-icon-primary .uim-svg { fill: #1e57c7 !important; }
.icon-fill-primary { fill: rgba(30, 87, 199, 0.15); }

.uim-icon-success .uim-svg { fill: #0fdf89 !important; }
.icon-fill-success { fill: rgba(15, 223, 137, 0.15); }

.uim-icon-info .uim-svg { fill: #229bee !important; }
.icon-fill-info { fill: rgba(34, 155, 238, 0.15); }

.uim-icon-warning .uim-svg { fill: #f6cb42 !important; }
.icon-fill-warning { fill: rgba(246, 203, 66, 0.15); }

.uim-icon-danger .uim-svg { fill: #fb3e3e !important; }
.icon-fill-danger { fill: rgba(251, 62, 62, 0.15); }

.uim-icon-orange .uim-svg { fill: #f09105 !important; }
.icon-fill-orange { fill: rgba(240, 145, 5, 0.15); }

.uim-icon-dark .uim-svg { fill: #404b67 !important; }
.icon-fill-dark { fill: rgba(64, 75, 103, 0.15); }

.uim-icon-cyan .uim-svg { fill: #00e6e6 !important; }
.icon-fill-cyan { fill: rgba(0, 230, 230, 0.15); }

.uim-icon-blue .uim-svg { fill: #2762da !important; }
.icon-fill-blue { fill: rgba(39, 98, 218, 0.15); }

.uim-icon-muted .uim-svg { fill: #808eb1 !important; }
.icon-fill-muted { fill: rgba(128, 142, 177, 0.15); }

.uim-icon-purple .uim-svg { fill: #704fff !important; }
.icon-fill-purple { fill: rgba(112, 79, 255, 0.15); }

.uim-icon-pink .uim-svg { fill: #f85f89 !important; }
.icon-fill-pink { fill: rgba(248, 95, 137, 0.15); }

.uim-icon-white .uim-svg { fill: #ffffff !important; }
.icon-fill-white { fill: rgba(255, 255, 255, 0.15); }

.uim-icon-light .uim-svg { fill: #f8fafd !important; }
.icon-fill-light { fill: rgba(248, 250, 253, 0.15); }

/* Background & Text Utilities */
.shadow { box-shadow: 0px 30px 30px 0px rgba(64, 75, 103, 0.06) !important; }
.box-shadow { box-shadow: 0px 30px 30px 0px rgba(64, 75, 103, 0.06); }
.btn-rounded { border-radius: 30px; }

.hero-description { color: rgba(255, 255, 255, 0.9) !important; }
.text-primary-icon { color: #528fcf; }
.text-primary-heading { color: var(--bs-primary); }

/* Image Utilities */
.img-fade {
    mask-image: radial-gradient(ellipse 90% 85% at center, black 60%, transparent 100%);
    -webkit-mask-image: radial-gradient(ellipse 90% 85% at center, black 60%, transparent 100%);
}

.img-fade-bottom {
    mask-image: linear-gradient(to bottom, black 70%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, black 70%, transparent 100%);
}

.img-fade-soft {
    mask-image: radial-gradient(ellipse 85% 80% at center, black 50%, transparent 95%);
    -webkit-mask-image: radial-gradient(ellipse 85% 80% at center, black 50%, transparent 95%);
}

.img-landing { border-radius: 20px; }

/* Content Display Utilities */
.content { display: none; }

#mobileContent-b1.active,
#desktopContent-b1.active { display: block; }

#mobileContent-f1.active,
#desktopContent-f1.active,
#mobileContent-f2.active,
#desktopContent-f2.active,
#mobileContent-f3.active,
#desktopContent-f3.active { display: flex; }