/** Shopify CDN: Minification failed

Line 458:0 Unexpected "}"

**/
.hero__content-wrapper{
    .text-block{
         @media (max-width: 768px) {
                margin-bottom:0;
            }
        h1{
            line-height: 1.02;
            font-size: clamp(1.75rem, 5.5vw, 4.8rem);
            font-weight: 400;
            margin-bottom: 1.25rem;
            font-family: var(--serif);
            max-width: 680px;
            em{
                font-style: italic;
                font-family: "Bodoni Moda", serif;
            }
            @media (max-width: 768px) {
                margin-bottom:1rem;
             }
        }
        
        p{
            font-size: 1rem;
            color: rgba(255, 255, 255, 0.78);
            max-width: 23.75rem;
            margin-bottom:2.5rem;
            line-height: 1.8;
             @media (max-width: 768px) {
                margin-bottom:1rem;
                /* letter-spacing: 4.48px; */
             }
        }
        p strong {
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 4.48px;
        }
        
    }
    .button-secondary{
        @media (max-width: 600px) {
            width: 100%;
        }
    }
    &.mobile-column{
        @media (max-width: 768px){
            justify-content: var(--horizontal-alignment-mobile);
            align-items: var(--vertical-alignment-mobile);  
        }
    }
}

.hero__container {
    .overlay {
        background: linear-gradient(to bottom, rgba(30, 27, 24, 0.45) 0%, rgba(30, 27, 24, 0.72) 100%) !important;
    }
}

@media (max-width: 768px) {
    [style*="--vertical-alignment-mobile: flex-start;"] >.text-block{
        --text-align-default: left;
    }
    [style*="--vertical-alignment-mobile: center;"] >.text-block{
        --text-align-default: center;
    }
    [style*="--vertical-alignment-mobile: flex-end;"] >.text-block{
        --text-align-default: right;
    }
}


.template-starter-kit{
    .hero{
        @media (max-width: 768px){
            --hero-min-height: 70svh !important;
        }
    }
    .hero__media-grid picture{
        position: relative;
        &:after{
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            background: linear-gradient(to bottom, rgba(0, 0, 0, .0) 0%, rgba(0, 0, 0, .42) 100%);
            height: 100%;
            width: 100%;
        }
    }
    .hero__content-wrapper{
        .text-block{            
            h1{
                font-size: clamp(26px, 3.6vw, 52px);
                font-weight: 400;
                line-height: 1.2;
                color: var(--white);
                max-width: 820px;
            }
            
            p{
                font-size: 10px;
                font-weight: 700;
                letter-spacing: .26em;
                text-transform: uppercase;
                color: var(--sand);
                margin-bottom: 20px;
            }   
            
        }       
    }
}


/* Serena Essentials Page */
.page-serena-essentials {
    .hero__media-grid:before{
        position: absolute;    
        z-index: 1;
        pointer-events: none;    
        content: "";        
        background: linear-gradient(to top, #2d2926b8 50%, #2d292614 95%, transparent 100%);
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
    }
    .hero__content-wrapper{
    .text-block{
         @media (max-width: 768px) {
                margin-bottom:0;
            }
        &.ess-heading{
            margin-bottom:0;
            h1{
                font-size: clamp(2.6rem, 6vw, 4.4rem);
                line-height: 1.04;
                margin-bottom: 32px;
                font-weight: bold;
                color: var(--white);
                em{
                    color: var(--pink) !important;
                }
                @media (max-width: 768px) {
                    margin-bottom:1.5rem;

                }
            }
        }
        &.pre-head{
            p{
                font-size: 0.68rem;
                font-weight: 500;
                letter-spacing: 0.22em;
                text-transform: uppercase;
                color: var(--pink);
                margin-bottom: 18px;
                @media (max-width: 768px) {
                    margin-bottom:0.75rem;                    
                }
            }            
        }
    }
    .button{
        display: inline-block;
        background: var(--pink);
        color: var(--dark);
        padding: 15px 36px;
        border-radius: 3px;
        font-size: 0.78rem;
        font-weight: 600;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        transition: opacity 0.18s;
        line-height: 1.2;
        &:hover{
            opacity: 0.88;
        }
        @media (max-width: 600px) {
            width: 100%;
            padding: 16px 24px;
        }
    }
    &.mobile-column{
        @media (max-width: 768px){
            justify-content: var(--horizontal-alignment-mobile);
            align-items: var(--vertical-alignment-mobile);  
        }
    }
}
}

/* Bethenny Landing Page — hero banner (desktop + mobile art direction) */
.page-bethenny-landing {
    .hero {
        --hero-min-height: max(380px, 56svh) !important;

        @media screen and (max-width: 768px) {
            --hero-min-height: max(440px, 70svh) !important;
        }
    }

    .hero__media {
        object-position: center 20%;

        @media screen and (max-width: 768px) {
            object-position: center top;
        }
    }

    .hero__media-grid::before {
        position: absolute;
        z-index: 1;
        pointer-events: none;
        content: "";
        inset: 0;
        background: linear-gradient(
            to left,
            rgba(14, 14, 14, 0.72) 30%,
            rgba(14, 14, 14, 0.15) 70%,
            transparent 100%
        );
    }

    @media screen and (max-width: 768px) {
        .hero__media-grid::before {
            background: linear-gradient(
                to bottom,
                 rgba(14, 14, 14, 0.80) 20%,
            rgba(14, 14, 14, 0.15) 40%,
            transparent 70%
            );            
        }
    }

    .hero__content-wrapper {
        position: absolute;
        inset: 0;
        width: 100%;
        max-width: none;
        height: 100%;
        min-height: inherit;
        padding: 50px 72px;

        @media screen and (max-width: 768px) {
            justify-content: space-between !important;
            align-items: center !important;
            text-align: center;
            padding: 0;
        }

        &.mobile-column {
            @media screen and (max-width: 768px) {
                justify-content: space-between !important;
                align-items: center !important;
            }
        }
        .button-secondary{
            @media (max-width: 600px){
                width: auto;
            }
        }
    }

    .bethenny-hero-text {
        width: fit-content;
        max-width: 100%;
        align-items: flex-end;

        @media screen and (max-width: 768px) {
            width: 100%;
            backdrop-filter: blur(0);
            padding: 20px;
            align-items: center !important;
        }
    }

    .hero-foot{
        @media screen and (max-width: 768px) {
            width: 100%;
            /* backdrop-filter: blur(4px); */
            padding: 20px;                        
        }
    }

    .hero-label{
        p{
            margin-bottom: 0px;
            color: var(--white);
            font-size: 10px;
            text-transform: uppercase;
            letter-spacing: 0.16em;
        }
    }

    .bethenny-hero-title {
        margin-bottom: 0;

        h1 {            
            font-size: clamp(26px, 6.5vw, 76px);
            font-weight: 400;
            font-style: italic;
            line-height: 1.05;
            letter-spacing: 0.01em;
            color: var(--white);
            margin-bottom: 14px;
            text-align: right;

            @media screen and (max-width: 768px) {
                line-height: 1.08;
                margin-bottom: 12px;
                text-align: center;
            }
        }
    }

    .bethenny-hero-sub {
        margin-bottom: 28px;        
        @media (max-width: 768px){
            margin-bottom: 10px;
        }
        p {            
            font-size: 11px;
            font-weight: 600;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: rgba(255, 255, 255, 0.65);
            margin-bottom: 0;
            line-height: 1.4;
            text-align: right;
            max-width: 100%;

            @media screen and (max-width: 768px) {
                font-size: 10px;
                letter-spacing: 0.14em;
                text-align: center;
                margin-bottom: 0px;
            }
        }
    }
    .ic_wrappers{
        margin-bottom: 15px;
        @media (max-width: 768px){
            margin-bottom: 10px;
            justify-content:space-between;
        }
        .ic_box {
            background: transparent;     
            border: 1px solid rgba(255, 255, 255, 0.4);
            padding: 6px 12px;
            border-radius: 20px;
            backdrop-filter: blur(6px);
            @media screen and (max-width: 768px) {
                padding: 4px 8px;
            }
            svg{
                fill:none;
                stroke: var(--white);
                stroke-width: 1.5px;
                width: 16px;
                height: auto;
                @media screen and (max-width: 768px) {
                    width: 14px;
                }
            }

            .text-block > p{
                margin-bottom: 0px;
                font-size: 11px;
                 @media screen and (max-width: 768px) {
                    font-size: 9px;
                 }
            }    
            
                &.layout-panel-flex--row:not(.mobile-column)>.text-block {
                    @media (max-width: 749px){
                        flex: 0 0 auto;
                    }
                }
            }
        }
    }    
    .btn_wrapper{
        .hero_outline{
            background-color: transparent;
            border: 1px solid var(--white);
            color: var(--white);
            &:hover{
                background-color: var(--white);
                color: var(--black);
            }
        }
        &.layout-panel-flex--row:not(.mobile-column){
            @media (max-width: 768px){
                flex-wrap: nowrap;
                .btn {    
                    padding: 14px 16px;
                }
            }
            @media (max-width: 749px){
                flex-wrap: nowrap;
            }
        }
    }
    .bethenny-hero-btn {
        display: inline-block;
        padding: 13px 38px;
        background: var(--white);
        color: #0e0e0e;
        border: none;
        border-radius: 0;
        font-size: 10px;
        font-weight: 600;
        letter-spacing: 0.22em;
        text-transform: uppercase;
        line-height: 1.2;
        transition: background 0.22s, color 0.22s;

        &:hover {
            background: #0e0e0e;
            color: var(--white);
            opacity: 1;
        }

        @media screen and (max-width: 768px) {
            padding: 13px 36px;
            width: auto;
        }
    }
    .hero-social-proof {
        margin-top: 5px;
        display: flex;
        align-items: center;    
        gap: 10px;
        font-size: 14px;     
        @media screen and (max-width: 768px) {
            margin-top: 0px;
        }   
    }

    .stars {
        color: #FFD700;
        font-size: 14px;
        letter-spacing: 2px;
    }

    .rating-text {
        margin: 0;
        font-size: 12px;
        color: #fff;
    }
}