.dropdown-icon {
    font-size: 13px;
}

.text-justify {
    text-align: justify;
}

.featured-bg {
    height: 850px !important;
}

.featured-bg img {
    height: 100% !important;
    object-fit: cover !important;
}

.team-grid {
    height: 300px !important;
    object-fit: cover !important;
}

.cart-image {
    height: 90px !important;
    object-fit: cover;
}

.product-image {
    height: 400px !important;
    object-fit: cover;
}

.detail-product-image {
    height: 600px !important;
    object-fit: cover;
}

.hero-h {
    height: 600px !important;
}

.hero-slider-img img {
    height: 180px !important;
    object-fit: cover;
}

.accordion-wrapper .card-header button.collapsed:before {
    display: none !important;
}

.accordion-wrapper .card-header button.collapsed:after {
    display: none !important;
}

.accordion-wrapper .card-header button:before {
    display: none !important;
}

.btn-gradient.gradient-theme {
    background: #36b9d8;
    background: -moz-linear-gradient(left, #343F52 0%, #4bffa2 100%);
    background: -webkit-linear-gradient(left, #343F52 0%, #4bffa2 100%);
    background: linear-gradient(to right, #343F52 0%, #4bffa2 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#343F52', endColorstr='#4bffa2', GradientType=1);
}

.text-gradient-theme{
    background: linear-gradient(to right, #343F52,
    #4bffa2, #343F52, #4bffa2);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
}

/* exact image requirement */
.product-image { height: 250px !important; object-fit: cover; display: block; }

/* subtle hover */
.swiper-slide figure { transition: transform .18s ease, box-shadow .18s ease; }
.swiper-slide:hover figure { transform: translateY(-3px); box-shadow: 0 .75rem 1.25rem rgba(0,0,0,.08); }

/* overlay CTA (keeps your layout) */
.thumb-overlay {
    position: absolute; inset: 0;
    background: rgba(0, 23, 52, 0.35);
    opacity: 0; transition: opacity .2s ease;
}
figure:hover .thumb-overlay { opacity: 1; }

.category-card { transition: transform .16s ease, box-shadow .16s ease; }
.category-card:hover { transform: translateY(-3px); box-shadow: 0 .75rem 1.25rem rgba(0,0,0,.08); }
.icon-wrap {
    width: 56px; height: 56px; border-radius: 50%;
    display: grid; place-items: center;
    background: rgba(13,110,253,.08); /* soft primary */
    border: 1px solid rgba(13,110,253,.15);
}

#industry-solutions .card-title { letter-spacing: .2px; }
#industry-solutions .card { transition: transform .18s ease, box-shadow .18s ease; }
#industry-solutions .card:hover { transform: translateY(-3px); box-shadow: 0 .75rem 1.25rem rgba(0,0,0,.08); }


#why-okaytech .icon-wrap {
    width: 70px; height: 70px; border-radius: 50%;
    display: grid; place-items: center;
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.2);
}
#why-okaytech .card:hover .icon-wrap {
    background: rgba(255,255,255,0.15);
    transform: scale(1.05);
    transition: .2s ease;
}
#why-okaytech .card-body { transition: transform .2s ease; }
#why-okaytech .card:hover .card-body { transform: translateY(-4px); }

#trust-stats .display-5 { line-height: 1; }
#trust-stats .p-3 { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: .75rem; }
#trust-stats .p-3:hover { background: rgba(255,255,255,0.09); }

#projects .card { transition: transform .18s ease, box-shadow .18s ease; }
#projects .card:hover { transform: translateY(-3px); box-shadow: 0 .75rem 1.25rem rgba(0,0,0,.08); }

#partners .partner-tile { transition: transform .15s ease, box-shadow .15s ease; }
#partners .partner-tile:hover { transform: translateY(-3px); box-shadow: 0 .75rem 1.25rem rgba(0,0,0,.12); }
#partners .partner-logo { max-height: 56px; }
#partners .partner-tile:hover .partner-logo { filter: none; opacity: 1; }

.partner-logo { filter: grayscale(100%) opacity(.85); transition: filter .18s ease, opacity .18s ease; }
.partner-tile:hover .partner-logo { filter: none; opacity: 1; }
.bg-soft-navy { background-color: #0a203f; }

#branches .card { transition: transform .18s ease, box-shadow .18s ease; }
#branches .card:hover { transform: translateY(-3px); box-shadow: 0 .75rem 1.25rem rgba(0,0,0,.08); }
#branches .badge { white-space: normal; }

#resources .card { transition: transform .18s ease, box-shadow .18s ease; }
#resources .card:hover { transform: translateY(-3px); box-shadow: 0 .75rem 1.25rem rgba(0,0,0,.08); }
#resources .uil-search { pointer-events:none; color:#6c757d; }

#support .icon-wrap{
    width: 44px; height: 44px; border-radius: 50%;
    display: grid; place-items: center;
    background: rgba(13,110,253,.08);
    border: 1px solid rgba(13,110,253,.15);
}
#support .card { transition: transform .18s ease, box-shadow .18s ease; }
#support .card:hover { transform: translateY(-3px); box-shadow: 0 .75rem 1.25rem rgba(0,0,0,.08); }

#request-pricing .card { transition: transform .18s ease, box-shadow .18s ease; }
#request-pricing .card:hover { transform: translateY(-2px); box-shadow: 0 .75rem 1.25rem rgba(0,0,0,.08); }

#site-survey .border { border-color: rgba(0,0,0,.08) !important; }
#site-survey .card { transition: transform .18s ease, box-shadow .18s ease; }
#site-survey .card:hover { transform: translateY(-2px); box-shadow: 0 .75rem 1.25rem rgba(0,0,0,.08); }

.product-card{transition:transform .18s ease,box-shadow .18s ease}
.product-card:hover{transform:translateY(-3px);box-shadow:0 .75rem 1.25rem rgba(0,0,0,.08)}
.product-image{height:200px !important;object-fit:cover;display:block}
.thumb-overlay{position:absolute;inset:0;background:rgba(0,23,52,.35);opacity:0;transition:opacity .2s ease}
.thumb:hover .thumb-overlay{opacity:1}

.image-list { list-style: none; padding-left: 0; margin: 0; }
.image-list li { gap: .5rem !important; }
.image-list figure { margin: 5px !important; }
.image-list .post-content { margin: 0 !important; }

.store-card .badge { font-size: .8rem; padding: .45rem .55rem; }
/* List view adjustments */
#storesContainer.list-view .card { display:flex; gap:1rem; align-items:center; }
#storesContainer.list-view .card .ratio { width:220px; flex: 0 0 220px; height:140px; }
#storesContainer.list-view .card .card-body { padding: 1rem; }
/* Responsive */
@media (max-width: 767.98px){
    #storesContainer.list-view .card .ratio { width:100%; flex: 0 0 auto; height:160px; }
}

#storesMap { border-radius: .5rem; border:1px solid rgba(0,0,0,.06); }
.leaflet-popup-content .btn { font-size: .85rem; display:inline-flex; align-items:center; gap:.35rem; }
.leaflet-container a.btn { color: inherit; }

.blog-card{transition:transform .18s ease, box-shadow .18s ease}
.blog-card:hover{transform:translateY(-3px); box-shadow:0 .75rem 1.25rem rgba(0,0,0,.08)}
.bg-soft-primary{background:rgba(13,110,253,.08); border:1px solid rgba(13,110,253,.12)}
.bg-soft-navy{background-color:#0a203f}

.toast-success { background: #198754 !important; }
.toast-error   { background: #dc3545 !important; }

.back-to-top {
    position: fixed;
    right: 18px;
    bottom: 18px;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    z-index: 1040;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px);
    transition: opacity .2s ease, transform .2s ease;
    background: transparent;          /* let SVG be the visual circle */
    border: none;
}

/* visible state */
.back-to-top.visible {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.back-to-top i {
    position: absolute;
    font-size: 1.2rem;
    color: grey;
}

/* svg ring */
.back-to-top .progress-ring {
    position: absolute;
    inset: 0;
}

/* smaller background circle */
.progress-ring__bg {
    fill: transparent;
    stroke: rgba(255,255,255,.22);
    stroke-width: 3;
}

/* larger foreground circle */
.progress-ring__value {
    fill: transparent;
    stroke: #0d6efd;             /* or your primary */
    stroke-width: 4.5;
    transform: rotate(-90deg);
    transform-origin: 50% 50%;
    stroke-linecap: round;
    transition: stroke-dashoffset .15s linear;
}

.back-to-top.visible:hover {
    transform: translateY(-2px);
}

@media (max-width: 576px) {
    .card .btn.btn-sm {
        padding: .25rem .55rem;
        font-size: .78rem;
    }
}