.hero-carousel .carousel-item {
    height: 64vh;
    min-height: 480px;
    position: relative
}

.carousel-item {
    opacity: 0;
    transition-property: opacity;
    transform: none;
    height: 480px !important
}

.hero-carousel .bgimg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    filter: saturate(1.05) contrast(1.02)
}

.bgimg-1 {
    background-image: url("../images/bannernew1.webp")
}

.bgimg-2 {
    background-image: url("../images/bannernew2.webp")
}

.bgimg-3 {
    background-image: url("../images/bannernew4.webp")
}

.hero-overlay {
    position: absolute;
    inset: 0
}

.glass {
    background: rgba(255, 247, 231, .88);
    backdrop-filter: saturate(1.2) blur(2px);
    border: 1px solid rgba(210, 157, 36, .35);
    border-radius: 18px;
    box-shadow: 0 18px 46px rgba(50, 34, 10, .18)
}

.hero-caption {
    position: relative;
    z-index: 2;
    max-width: 900px
}

.type-wrap {
    font-weight: 900;
    letter-spacing: -.3px;
    font-size: clamp(28px, 4vw, 44px)
}

.type-cursor {
    display: inline-block;
    width: 2px;
    height: 1em;
    background: #6E4B1F;
    animation: blink 1s infinite
}

@keyframes blink {
    50% {
        opacity: 0
    }
}

.uae-ribbon {
    background: #fff2d5;
    border-top: 1px solid rgba(110, 75, 31, .15);
    border-bottom: 1px solid rgba(110, 75, 31, .15)
}

.chipx {
    display: inline-block;
    padding: .4rem .8rem;
    margin: 0 .35rem;
    border-radius: 999px;
    background: #fff7e7;
    border: 1px dashed rgba(110, 75, 31, .35);
    color: #8b682f;
    font-weight: 700;
    word-spacing: 3px;
    letter-spacing: 1px
}

.logo-ticker img {
    height: 34px;
    opacity: .85;
    filter: grayscale(55%);
    margin: 0 22px
}

.service-card {
    transition: transform .25s ease
}

.service-card:hover {
    transform: translateY(-6px)
}

.table-compare th,
.table-compare td {
    vertical-align: middle
}

.timeline {
    border-left: 3px dashed #e6cc96;
    padding-left: 18px
}

.timeline .t {
    position: relative;
    margin-bottom: 18px
}

.timeline .t:before {
    content: "";
    position: absolute;
    left: -25px;
    top: 4px;
    width: 12px;
    height: 12px;
    background: #D29D24;
    border-radius: 50%
}

.bb {
    color: #6E4B1F
}

.p {
    color: #552a00 !important
}

.form-select {
    color: #552a00 !important
}

.table-compare th,
.table-compare td {
    color: #552a00 !important
}

.accordion-item {
    color: #552a00 !important
}

.accordion-button {
    color: #552a00 !important
}

.hero-lead {
    color: #6b5434
}

.hero-copy {
    color: #6b5434;
    font-weight: 600
}

.btn-outline-gold {
    border-color: #b88d3a !important
}

.ribbon-btn {
    font-size: 16px !important;
    padding: 3px 8px !important
}

.chip-auto {
    width: auto
}

.highlight-box {
    background: #fff7e7;
    border: 1px dashed rgba(110, 75, 31, .25);
    color: #6b5434;
    font-weight: 650
}

.est-out {
    background: #fff7e7;
    color: #6b5434;
    display: none
}

.est-out.is-visible {
    display: block
}

.mosaic-img {
    border-radius: 16px;
    box-shadow: 0 18px 46px rgba(50, 34, 10, .15)
}

.bg-sand {
    background: #fff2d5
}