/* Overrides when original Magic Linen / Dawn theme CSS is loaded */
body.store-theme-active .shopify-payment-button,
body.store-theme-active [data-shopify-buttoncontainer],
body.store-theme-active form[action*="checkout"],
body.store-theme-active a[href*="checkout"] {
    display: none !important;
}

body.store-theme-active a[data-removed="1"] {
    pointer-events: none;
    opacity: 0.35;
}

#siteHeader,
#siteFooter {
    display: block;
    width: 100%;
}

body.store-theme-active #siteHeader,
body.store-theme-active #siteFooter,
body.tks-unified-layout #siteHeader,
body.tks-unified-layout #siteFooter {
    display: block;
}

body.store-theme-active {
    margin: 0;
    font-family: var(--font-body-family, Manrope, sans-serif);
    font-size: 1.5rem;
    line-height: calc(1 + 0.8 / var(--font-body-scale, 1.4));
    background-color: rgb(var(--color-background, 255 255 255));
    color: rgba(var(--color-foreground, 29 29 29), 0.75);
}

body.store-theme-active #homeMain,
body.store-theme-active #collectionMain {
    display: block;
    max-width: none;
    padding: 0;
    margin: 0;
}

/* ==========================================================================
   1. Header & Navigation Layout
   ========================================================================== */
body.store-theme-active #siteHeader .announcement-bar {
    background-color: #1d1d1d !important;
    color: #fff !important;
    padding: 6px 0 !important;
    font-size: 12px !important;
    letter-spacing: 0.5px !important;
}

body.store-theme-active #siteHeader .announcement-bar .content-positioning {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
}

body.store-theme-active #siteHeader .header {
    display: grid !important;
    grid-template-areas: "heading navigation icons" !important;
    grid-template-columns: auto 1fr auto !important;
    align-items: center !important;
    column-gap: 24px !important;
    padding: 12px 24px !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
}

body.store-theme-active #siteHeader .header__heading,
body.store-theme-active #siteHeader .header__heading-link {
    grid-area: heading !important;
    justify-self: start !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
}

body.store-theme-active #siteHeader .header__heading-logo,
body.store-theme-active #siteHeader .logo-img {
    height: 36px !important;
    width: auto !important;
    max-width: 160px !important;
    object-fit: contain !important;
}

body.store-theme-active #siteHeader .header__inline-menu {
    grid-area: navigation !important;
    display: block !important;
    margin: 0 !important;
}

body.store-theme-active #siteHeader .list-menu--inline {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 0 clamp(10px, 1.4vw, 22px) !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

body.store-theme-active #siteHeader .header__menu-item {
    white-space: nowrap !important;
    text-decoration: none !important;
    font-family: Manrope, sans-serif !important;
    font-size: clamp(12px, 1.05vw, 14px) !important;
    font-weight: 500 !important;
    color: #1d1d1d !important;
    padding: 8px 4px !important;
    letter-spacing: 0.5px !important;
    transition: color 0.2s ease !important;
}

body.store-theme-active #siteHeader .header__menu-item:hover {
    color: #a58b6c !important;
}

body.store-theme-active #siteHeader .menu-items_icons {
    grid-area: icons !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
}

body.store-theme-active #siteHeader .header-icon-btn,
body.store-theme-active #siteHeader .search_icon_container,
body.store-theme-active #siteHeader .header__icon--cart,
body.store-theme-active #siteHeader .header__icon--search {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    color: #1d1d1d !important;
    text-decoration: none !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

body.store-theme-active #siteHeader .header-icon-btn:hover,
body.store-theme-active #siteHeader .search_icon_container:hover,
body.store-theme-active #siteHeader .header__icon--cart:hover,
body.store-theme-active #siteHeader .header__icon--search:hover {
    background: rgba(0, 0, 0, 0.05) !important;
    color: #a58b6c !important;
}

body.store-theme-active #siteHeader .header-icon-btn svg,
body.store-theme-active #siteHeader .search_icon_container svg,
body.store-theme-active #siteHeader .header__icon--cart svg,
body.store-theme-active #siteHeader .header__icon--search svg {
    width: 19px !important;
    height: 19px !important;
    display: block !important;
    margin: 0 !important;
}

body.store-theme-active #siteHeader .icon_container--text,
body.store-theme-active #siteHeader .icon-cart-text {
    display: none !important;
}

body.store-theme-active #siteHeader .cart-count-bubble {
    position: absolute !important;
    top: 2px !important;
    right: 2px !important;
    min-width: 16px !important;
    height: 16px !important;
    padding: 0 4px !important;
    border-radius: 10px !important;
    background-color: #1d1d1d !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    line-height: 16px !important;
    text-align: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
}

body.store-theme-active #siteHeader header-drawer {
    display: none !important;
}

@media (max-width: 989px) {
    body.store-theme-active #siteHeader .header {
        grid-template-areas: "left-icon heading icons" !important;
        grid-template-columns: 1fr auto 1fr !important;
        padding: 10px 16px !important;
    }

    body.store-theme-active #siteHeader header-drawer {
        display: block !important;
        grid-area: left-icon !important;
    }

    body.store-theme-active #siteHeader .header__inline-menu {
        display: none !important;
    }
}

body.store-theme-active #siteHeader details,
body.store-theme-active #siteHeader details-modal,
body.store-theme-active #siteHeader .search-popular,
body.store-theme-active #siteHeader .search-popular__featured-product,
body.store-theme-active #siteHeader .search-modal,
body.store-theme-active #siteHeader .search-modal__wrapper,
body.store-theme-active #siteHeader .search-modal__wrapper-inner,
body.store-theme-active #siteHeader .search-modal__content {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
}

/* ==========================================================================
   2. Hero Banner
   ========================================================================== */
body.store-theme-active .banner {
    display: flex !important;
    flex-direction: row !important;
    position: relative !important;
    min-height: clamp(420px, 50vw, 620px) !important;
}

body.store-theme-active .banner__media {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

body.store-theme-active .banner__media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

body.store-theme-active .banner__content {
    display: flex !important;
    position: relative !important;
    z-index: 2 !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-height: inherit !important;
    padding: 3rem clamp(1.5rem, 5vw, 5rem) !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
}

body.store-theme-active .banner__box {
    visibility: visible !important;
    opacity: 1 !important;
    text-align: left !important;
    max-width: min(44rem, 90vw) !important;
    background: transparent !important;
}

body.store-theme-active .banner__heading {
    text-transform: uppercase !important;
    font-size: clamp(2rem, 3.5vw, 3.2rem) !important;
    line-height: 1.15 !important;
    font-weight: 700 !important;
    color: #1d1d1d !important;
    margin-bottom: 12px !important;
}

body.store-theme-active .banner__text {
    font-size: clamp(14px, 1.2vw, 16px) !important;
    color: #333 !important;
    margin-bottom: 24px !important;
}

body.store-theme-active .banner__buttons {
    display: inline-flex !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
}

body.store-theme-active .banner__buttons .button {
    padding: 12px 28px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    border-radius: 2px !important;
    text-decoration: none !important;
}

body.store-theme-active .banner__buttons .button--primary {
    background: #e53827 !important;
    color: #fff !important;
    border: none !important;
}

body.store-theme-active .banner__buttons .button--secondary {
    background: #1d1d1d !important;
    color: #fff !important;
    border: none !important;
}

body.store-theme-active .banner__media-image--mobile {
    display: none !important;
}

@media (max-width: 749px) {
    body.store-theme-active .banner__media-image--desktop {
        display: none !important;
    }

    body.store-theme-active .banner__media-image--mobile {
        display: block !important;
    }
}

@media (min-width: 750px) {
    body.store-theme-active .banner__media-image--desktop {
        display: block !important;
    }
}

/* ==========================================================================
   3. Best Sellers Section & Product Slider Grid
   ========================================================================== */
#homeMain .usps-badges-section {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 20px !important;
    padding: 24px 16px !important;
    background: #fdfcfa !important;
    border-bottom: 1px solid #ede8e3 !important;
}

#homeMain .usps-badges img {
    max-height: 48px !important;
    width: auto !important;
    display: block !important;
}

#homeMain .collection.page-width {
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: 40px 24px 60px !important;
}

#homeMain .collection__title {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-bottom: 28px !important;
}

#homeMain .collection__title h2 {
    font-size: clamp(20px, 2.5vw, 32px) !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    margin: 0 !important;
}

#homeMain .featured-collection__discount-badge {
    display: inline-block !important;
    background: #b08d6c !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 3px 10px !important;
    border-radius: 20px !important;
    margin-left: 10px !important;
    vertical-align: middle !important;
    text-transform: none !important;
}

#homeMain .slider-buttons {
    display: inline-flex !important;
    gap: 10px !important;
    position: static !important;
}

#homeMain .slider-button {
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    border: 1px solid #d0c8be !important;
    background: #fff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    padding: 0 !important;
}

#homeMain .slider-button:hover {
    border-color: #1d1d1d !important;
    background: #f7f6f4 !important;
}

#homeMain .slider-button svg {
    width: 16px !important;
    height: 16px !important;
}

#homeMain slider-component {
    display: block !important;
    position: relative !important;
    width: 100% !important;
}

#homeMain ul.slider.product-grid {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    scroll-behavior: smooth !important;
    scroll-snap-type: x mandatory !important;
    gap: 24px !important;
    padding: 8px 0 24px !important;
    margin: 0 !important;
    list-style: none !important;
    scrollbar-width: thin !important;
    -webkit-overflow-scrolling: touch !important;
}

#homeMain ul.slider.product-grid::-webkit-scrollbar {
    height: 6px;
}

#homeMain ul.slider.product-grid::-webkit-scrollbar-thumb {
    background: #d0c8be;
    border-radius: 3px;
}

#homeMain .slider__slide {
    flex: 0 0 calc((100% - 72px) / 4) !important;
    min-width: 250px !important;
    max-width: 320px !important;
    scroll-snap-align: start !important;
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
    box-sizing: border-box !important;
}

@media (max-width: 1100px) {
    #homeMain .slider__slide {
        flex: 0 0 calc((100% - 48px) / 3) !important;
        min-width: 220px !important;
    }
}

@media (max-width: 749px) {
    #homeMain .slider__slide {
        flex: 0 0 calc((100% - 16px) / 2) !important;
        min-width: 160px !important;
    }
}

#homeMain .product-card {
    position: relative !important;
    width: 100% !important;
    border-radius: 4px !important;
    overflow: hidden !important;
    background: #f7f6f4 !important;
}

#homeMain .product-card a {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    text-decoration: none !important;
}

#homeMain .collection_thumbnail {
    width: 100% !important;
    position: relative !important;
    padding-top: 125% !important;
    overflow: hidden !important;
    display: block !important;
    background: #f4f2ee !important;
}

#homeMain .collection_thumbnail img {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: opacity 0.35s ease !important;
}

#homeMain .secondary.collection_thumbnail {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    padding-top: 0 !important;
    opacity: 0 !important;
}

#homeMain .product-card:hover .secondary.collection_thumbnail {
    opacity: 1 !important;
}

#homeMain .new-label {
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    z-index: 3 !important;
    background-color: #1d1d1d !important;
    color: #fff !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    padding: 3px 8px !important;
    border-radius: 2px !important;
    letter-spacing: 1px !important;
}

#homeMain .product-card--content {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    padding: 12px 2px 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

#homeMain .product-card--content ~ .product-card--content {
    display: none !important;
}

#homeMain .slider__slide .grid__item {
    width: 100% !important;
    padding: 0 !important;
}

#homeMain .product-title {
    font-family: Manrope, sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #1d1d1d !important;
    line-height: 1.35 !important;
    text-decoration: none !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    min-height: 40px !important;
}

#homeMain .product-price {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
    margin-top: 4px !important;
}

#homeMain .ml_price_sale {
    display: flex !important;
    align-items: baseline !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
}

#homeMain .ml_price_sale[style*="display: none"],
#homeMain .ml_price_sale[style*="display:none"],
#homeMain .ml_price_sale ~ .ml_price_sale {
    display: none !important;
}

#homeMain .ml_price_sale p {
    margin: 0 !important;
    font-size: 13px !important;
    color: #888 !important;
}

#homeMain .ml_price_sale .ml_price_curr {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #1d1d1d !important;
}

#homeMain .ml_price_badge {
    color: #e53827 !important;
    font-weight: 600 !important;
    font-size: 12px !important;
}

#homeMain .variant-count {
    font-size: 12px !important;
    color: #777 !important;
    margin-top: 2px !important;
}

#homeMain .ml_price_sale p {
    margin: 0 !important;
    font-size: 13px !important;
    color: #888 !important;
}

#homeMain .ml_price_sale .ml_price_curr {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #1d1d1d !important;
}

#homeMain .ml_price_badge {
    color: #e53827 !important;
    font-weight: 600 !important;
    font-size: 12px !important;
}

#homeMain .variant-count {
    font-size: 12px !important;
    color: #777 !important;
    margin-top: 2px !important;
}

/* Collection page product grid (mirrored ML shell + dynamic items) */
#collectionMain .collection.page-width {
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: 0 24px 60px !important;
}

#collectionMain .product-card {
    position: relative !important;
    width: 100% !important;
    border-radius: 4px !important;
    overflow: hidden !important;
    background: #f7f6f4 !important;
}

#collectionMain .product-card a {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    text-decoration: none !important;
}

#collectionMain .collection_thumbnail,
#collectionMain .product-card img.primary {
    width: 100% !important;
    position: relative !important;
    aspect-ratio: 4 / 5 !important;
    object-fit: cover !important;
    display: block !important;
    background: #f4f2ee !important;
}

#collectionMain .secondary.collection_thumbnail {
    position: absolute !important;
    inset: 0 !important;
    opacity: 0 !important;
    transition: opacity 0.35s ease !important;
}

#collectionMain .product-card.has-secondary:hover .secondary.collection_thumbnail {
    opacity: 1 !important;
}

#collectionMain .product-card--content {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    padding: 12px 2px 0 !important;
}

#collectionMain .product-title {
    font-family: Manrope, sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #1d1d1d !important;
    line-height: 1.35 !important;
}

#collectionMain .product-price .ml_price_curr {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #1d1d1d !important;
}

#collectionMain .ml_price_sale p {
    margin: 0 !important;
    font-size: 13px !important;
    color: #888 !important;
}

/* ==========================================================================
   4. Featured Promotions (California Greens & SS26)
   ========================================================================== */
.featured-promotions {
    margin: 40px auto 60px !important;
    max-width: 1400px !important;
    padding: 0 24px !important;
}

.featured-promotions .grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 28px !important;
}

@media (max-width: 749px) {
    .featured-promotions .grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
}

.featured-promotions .promotion-block {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 4 / 5 !important;
    border-radius: 4px !important;
    overflow: hidden !important;
    background: #111 !important;
}

.featured-promotions .promotion-block img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform 0.4s ease !important;
}

.featured-promotions .promotion-block:hover img {
    transform: scale(1.03) !important;
}

.featured-promotions .overlay {
    position: absolute !important;
    left: 28px !important;
    bottom: 28px !important;
    right: 28px !important;
    z-index: 5 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
}

.featured-promotions .overlay h2 {
    font-size: clamp(22px, 2.5vw, 32px) !important;
    font-weight: 700 !important;
    color: #fff !important;
    margin: 6px 0 16px !important;
    line-height: 1.2 !important;
}

.featured-promotions .overlay .pre_heading {
    font-size: 16px !important;
    color: #fff !important;
    font-style: italic !important;
}

.featured-promotions .overlay .button {
    background: rgba(255, 255, 255, 0.2) !important;
    backdrop-filter: blur(4px) !important;
    border: 1px solid #fff !important;
    color: #fff !important;
    padding: 10px 24px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    border-radius: 2px !important;
    text-decoration: none !important;
    transition: background 0.2s ease !important;
}

.featured-promotions .overlay .button:hover {
    background: #fff !important;
    color: #1d1d1d !important;
}

/* ==========================================================================
   5. Featured Reviews Section
   ========================================================================== */
.featured-reviews {
    background-color: #f7f4ef !important;
    padding: 60px 0 !important;
    margin: 40px 0 !important;
}

.featured-reviews .page-width {
    max-width: 1300px !important;
    margin: 0 auto !important;
    padding: 0 24px !important;
}

.featured-reviews .grid {
    display: grid !important;
    grid-template-columns: 1fr 1.2fr !important;
    gap: 48px !important;
    align-items: center !important;
}

@media (max-width: 989px) {
    .featured-reviews .grid {
        grid-template-columns: 1fr !important;
        gap: 28px !important;
    }
}

.featured-reviews .grid__item.image {
    width: 100% !important;
    border-radius: 6px !important;
    overflow: hidden !important;
}

.featured-reviews .grid__item.image img {
    width: 100% !important;
    height: auto !important;
    max-height: 520px !important;
    object-fit: cover !important;
    display: block !important;
}

.featured-reviews .content-wrap {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
}

.featured-reviews .review-title {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    margin-bottom: 20px !important;
}

.featured-reviews .review-title h2 {
    font-size: clamp(28px, 3vw, 40px) !important;
    font-family: Manrope, sans-serif !important;
    line-height: 1.15 !important;
    margin: 0 !important;
    color: #1d1d1d !important;
}

.featured-reviews .review-title .amithen_font {
    font-style: italic !important;
    font-weight: 400 !important;
}

.featured-reviews a.review-link {
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    color: #1d1d1d !important;
    text-decoration: underline !important;
    text-underline-offset: 4px !important;
}

.featured-reviews .content {
    font-size: 18px !important;
    line-height: 1.65 !important;
    color: #333 !important;
    margin-bottom: 24px !important;
    padding: 0 !important;
}

.featured-reviews .content strong {
    display: block !important;
    font-size: 20px !important;
    margin-bottom: 8px !important;
    color: #1d1d1d !important;
}

.featured-reviews .author {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #1d1d1d !important;
    margin-top: 0 !important;
}

.featured-reviews .yopto-logo {
    margin-left: auto !important;
}

/* ==========================================================================
   6. Video / About MagicLinen Brand Story
   ========================================================================== */
.brand-story-section {
    padding: 30px 0 50px !important;
}

.brand-story-section .page-width {
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: 0 24px !important;
}

.brand-story-section .video-section {
    position: relative !important;
    min-height: 480px !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    background-image: url('../assets/vendor/magiclinen/shop/files/about-video-desktop-gradient-optimized.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    margin: 40px 0 !important;
}

@media (max-width: 749px) {
    .brand-story-section .video-section {
        min-height: 440px !important;
        background-image: url('../assets/vendor/magiclinen/shop/files/about-video-mobile-gradient-optimized_ce94b6bd-384a-4a0c-9215-95f48b4e843e.jpg') !important;
    }
}

.brand-story-backdrop {
    position: relative !important;
    width: 100% !important;
    min-height: 480px !important;
    display: flex !important;
    align-items: center !important;
    padding: clamp(32px, 5vw, 64px) !important;
    background: linear-gradient(90deg, rgba(20, 20, 20, 0.78) 0%, rgba(20, 20, 20, 0.55) 45%, rgba(20, 20, 20, 0.15) 100%) !important;
    box-sizing: border-box !important;
}

@media (max-width: 749px) {
    .brand-story-backdrop {
        background: linear-gradient(180deg, rgba(20, 20, 20, 0.4) 0%, rgba(20, 20, 20, 0.82) 100%) !important;
        align-items: flex-end !important;
        padding: 24px 20px !important;
    }
}

.brand-story-card {
    max-width: 580px !important;
    color: #fff !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
}

.brand-story-card .story-tag {
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    color: #df9857 !important;
    margin-bottom: 12px !important;
    display: inline-block !important;
}

.brand-story-card .story-title {
    margin: 0 0 16px !important;
    line-height: 1.15 !important;
}

.brand-story-card .story-title-sub {
    font-size: clamp(28px, 3.2vw, 38px) !important;
    font-weight: 400 !important;
    font-style: italic !important;
    color: rgba(255, 255, 255, 0.95) !important;
    display: block !important;
}

.brand-story-card .story-title-main {
    font-size: clamp(32px, 4.2vw, 48px) !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    color: #ffffff !important;
    display: block !important;
    margin-top: 2px !important;
}

.brand-story-card .story-description {
    font-size: clamp(14px, 1.15vw, 16px) !important;
    line-height: 1.65 !important;
    color: rgba(255, 255, 255, 0.88) !important;
    margin: 0 0 24px !important;
    font-weight: 400 !important;
}

.brand-story-card .story-actions {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    flex-wrap: wrap !important;
}

.brand-story-card .story-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 24px !important;
    border-radius: 4px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: all 0.25s ease !important;
}

.brand-story-card .story-btn--primary {
    background: #ffffff !important;
    color: #1d1d1d !important;
    border: 1px solid #ffffff !important;
}

.brand-story-card .story-btn--primary:hover {
    background: #f0ede8 !important;
    transform: translateY(-1px) !important;
}

.brand-story-card .story-btn--secondary {
    background: rgba(255, 255, 255, 0.15) !important;
    backdrop-filter: blur(8px) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.6) !important;
}

.brand-story-card .story-btn--secondary:hover {
    background: rgba(255, 255, 255, 0.3) !important;
    border-color: #ffffff !important;
}

.video-player-container {
    position: relative !important;
    width: 100% !important;
    background: #000 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
}

.video-player-container .video-close-btn {
    position: absolute !important;
    top: 16px !important;
    right: 16px !important;
    width: 36px !important;
    height: 36px !important;
    background: rgba(0, 0, 0, 0.6) !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
    border-radius: 50% !important;
    font-size: 20px !important;
    line-height: 1 !important;
    cursor: pointer !important;
    z-index: 10 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ==========================================================================
   7. Why MagicLinen & Instagram Section
   ========================================================================== */
.why-magic-section {
    padding: 50px 0 !important;
    max-width: 1300px !important;
    margin: 0 auto !important;
}

.why-magic-section .grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 48px !important;
    align-items: center !important;
}

@media (max-width: 749px) {
    .why-magic-section .grid {
        grid-template-columns: 1fr !important;
    }
}

.why-magic-section .grid__item.image img {
    width: 100% !important;
    height: auto !important;
    border-radius: 6px !important;
    display: block !important;
}

.why-magic-section h2 {
    font-size: clamp(28px, 3vw, 38px) !important;
    line-height: 1.15 !important;
    margin-bottom: 24px !important;
}

ul.icons-with-text {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

ul.icons-with-text li {
    display: flex !important;
    align-items: center !important;
    padding: 14px 0 !important;
    font-size: 17px !important;
    color: #1d1d1d !important;
}

ul.icons-with-text li img {
    margin-right: 18px !important;
    width: 32px !important;
    height: 32px !important;
}

ul.icons-with-text li span {
    border-bottom: 1px solid #1d1d1d !important;
    padding-bottom: 2px !important;
}

.custom-title h2 {
    text-align: center !important;
    font-size: clamp(24px, 2.5vw, 36px) !important;
    margin: 40px 0 20px !important;
}

/* ==========================================================================
   8. Footer Layout & Styles
   ========================================================================== */
#siteFooter {
    background: #1d1d1d !important;
    color: #fff !important;
    padding: 60px 0 30px !important;
    margin-top: 60px !important;
}

#siteFooter .footer__content-top {
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: 0 24px !important;
}

#siteFooter .footer__blocks-wrapper {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 40px !important;
    margin-bottom: 40px !important;
}

@media (max-width: 989px) {
    #siteFooter .footer__blocks-wrapper {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 24px !important;
    }
}

@media (max-width: 600px) {
    #siteFooter .footer__blocks-wrapper {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
}

#siteFooter .footer-block__heading {
    font-size: 15px !important;
    font-weight: 700 !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    color: #fff !important;
    margin-bottom: 18px !important;
}

#siteFooter .footer-block__details-content {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

#siteFooter .footer-block__details-content li {
    margin-bottom: 10px !important;
}

#siteFooter .footer-block__details-content a {
    color: #ccc !important;
    text-decoration: none !important;
    font-size: 14px !important;
    transition: color 0.2s ease !important;
}

#siteFooter .footer-block__details-content a:hover {
    color: #fff !important;
    text-decoration: underline !important;
}

.payment-logos,
[class*="payment-logos"],
.payment-icons,
[class*="payment-icon"],
#siteFooter .payment-logos {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* ==========================================================================
   9. Unified Inner Pages (PDP, Collection, Cart)
   ========================================================================== */
body.tks-unified-layout .site-header,
body.store-theme-active .site-header {
    border-bottom: 1px solid #ede8e3 !important;
}

body.tks-unified-layout .site-footer {
    background: #1d1d1d !important;
    color: #fff !important;
    padding: 50px 0 24px !important;
    margin-top: 60px !important;
}

body.tks-unified-layout .site-footer a {
    color: #ccc !important;
}

body.tks-unified-layout .site-footer a:hover {
    color: #fff !important;
}

/* Cart Drawer */
#cartDrawer {
    position: fixed;
    inset: 0;
    z-index: 3000;
    pointer-events: none;
    visibility: hidden;
}

#cartDrawer.open {
    pointer-events: auto;
    visibility: visible;
}

#cartDrawer .cart-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    opacity: 0;
    transition: opacity 0.2s ease;
}

#cartDrawer.open .cart-backdrop {
    opacity: 1;
}

#cartDrawer .cart-panel {
    position: fixed;
    top: 0;
    right: 0;
    width: min(420px, 100%);
    height: 100%;
    background: #fff;
    z-index: 3001;
    padding: 24px;
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.12);
    overflow-y: auto;
    transform: translateX(100%);
    transition: transform 0.25s ease;
    display: flex;
    flex-direction: column;
}

#cartDrawer.open .cart-panel {
    transform: translateX(0);
}

/* Policy Pages & CMS Content Styling */
.policy-page {
    padding: 40px 24px 80px !important;
    max-width: 860px !important;
    margin: 0 auto !important;
}

.policy-page .breadcrumb {
    font-size: 13px !important;
    color: #888 !important;
    margin-bottom: 28px !important;
    letter-spacing: 0.02em !important;
}

.policy-page .breadcrumb a {
    color: #1d1d1d !important;
    text-decoration: none !important;
    font-weight: 500 !important;
}

.policy-page .breadcrumb a:hover {
    text-decoration: underline !important;
}

.policy-content {
    color: #2c2c2c !important;
    font-size: 15px !important;
    line-height: 1.8 !important;
}

.policy-content h1 {
    font-size: clamp(26px, 3.5vw, 36px) !important;
    font-weight: 500 !important;
    color: #1d1d1d !important;
    margin: 0 0 20px !important;
    line-height: 1.25 !important;
    letter-spacing: -0.02em !important;
}

.policy-content h2 {
    font-size: clamp(17px, 2.2vw, 20px) !important;
    font-weight: 600 !important;
    color: #1d1d1d !important;
    margin: 32px 0 14px !important;
    padding-bottom: 6px !important;
    border-bottom: 1px solid rgba(0,0,0,0.07) !important;
}

.policy-content h3 {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #1d1d1d !important;
    margin: 20px 0 10px !important;
}

.policy-content p {
    margin: 0 0 16px !important;
    color: #4a4a4a !important;
}

.policy-content ul,
.policy-content ol {
    margin: 0 0 20px !important;
    padding-left: 24px !important;
}

.policy-content li {
    margin-bottom: 8px !important;
    color: #4a4a4a !important;
}

.policy-content a {
    color: #1d1d1d !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
    transition: opacity 0.2s ease !important;
}

.policy-content a:hover {
    opacity: 0.7 !important;
}

.policy-content table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 24px 0 !important;
    font-size: 14px !important;
    background: #faf9f7 !important;
    border-radius: 6px !important;
    overflow: hidden !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}

.policy-content th {
    background: #f0eee9 !important;
    font-weight: 600 !important;
    color: #1d1d1d !important;
    text-align: left !important;
    padding: 12px 16px !important;
    border-bottom: 1px solid #e2ded7 !important;
}

.policy-content td {
    padding: 12px 16px !important;
    border-bottom: 1px solid #ebe8e2 !important;
    color: #444 !important;
}

.policy-content tr:last-child td {
    border-bottom: none !important;
}

.policy-contact-list {
    list-style: none !important;
    padding: 20px 24px !important;
    margin: 20px 0 28px !important;
    background: #f8f7f4 !important;
    border-radius: 8px !important;
    border: 1px solid #e8e5dc !important;
}

.policy-contact-list li {
    margin-bottom: 12px !important;
    color: #333 !important;
    line-height: 1.6 !important;
}

.policy-contact-list li:last-child {
    margin-bottom: 0 !important;
}

.policy-contact-list strong {
    color: #1d1d1d !important;
    min-width: 120px !important;
    display: inline-block !important;
}

.footer__list-menu.footer-links {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 12px 20px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.footer__list-menu.footer-links li {
    font-size: 13px !important;
    color: #767676 !important;
}

.footer__list-menu.footer-links a {
    color: #767676 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.footer__list-menu.footer-links a:hover {
    color: #1d1d1d !important;
    text-decoration: underline !important;
}