.site-header {
    transition: padding .25s, box-shadow .25s, background .25s !important;
}

.site-header .logo img {
    transition: width .25s !important;
}

.logo img, img[alt*="logo" i], img.logo {
    width: var(--w, 100%) !important;
   /* <— variable carries the % */
    height: auto !important;
    display: block;
    max-width: none !important;
}
/* scrolled (small) */
.scrolled .site-header {
    padding: 15px 0px !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.08) !important;
}

.scrolled .site-header .logo img {
    --w: 66% !important;
}

.weddings-banner {
    transition: padding .25s !important;
 /* smooth animation */
}

.scrolled .weddings-banner {
    padding: 0 !important;
 /* completely remove padding */
}

.outer-box {
    width: 53.8% !important;
}

.carousel__slide .profile-name span {
    font-style: italic !important;
    font-weight: 400 !important;
}

.icon {
    display: block !important;
    right: 0 !important;
    left: initial !important;
    top: 50% !important;
    bottom: initial !important;
    transform: translateY(-50%) !important;
    position: fixed !important;
    z-index: 102 !important;
}

.mobile-icon {
    display: block !important;
    right: 0 !important;
    left: initial !important;
    top: 85% !important;
    bottom: initial !important;
    position: fixed !important;
    z-index: 102 !important;
}

.cart {
    fill: black !important;
}

#button-QAreSxQGrV {
    background-color: #fdf2f0 !important;
 /* default grayish background */
    color: #ffffff !important;
           /* white text */
    border: none !important;
             /* optional, cleaner look */
    cursor: pointer !important;
          /* makes it feel clickable */
    transition: background-color 0.3s ease !important;
 /* smooth hover effect */
}

#button-QAreSxQGrV:hover {
    background-color: #807b73 !important;
/* pale pink background on hover */
    color: #ffffff !important;
            /* keep text white */
}