/* =========================================================
   CUREWELL HOME BANNER
   Desktop = landscape artwork + left white fade
   Mobile  = portrait artwork + translucent content panel
   ========================================================= */

.cw-home-banner{
    position:relative;
    overflow:hidden;
    border-bottom:1px solid #d9eaf6;
    background:#eef8ff;
}

.cw-banner-stage{
    position:relative;
    min-height:460px;
}

.cw-banner-slide{
    position:absolute;
    inset:0;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .5s ease, visibility .5s ease;
    background-color:#eaf6ff;
    background-repeat:no-repeat;
    background-size:cover;
    background-position:center center;
}

.cw-banner-slide.slide-home{
    --cw-banner-desktop:url('../Images/Banner1_Desktop.png?v=20261003f');
    --cw-banner-mobile:url('../Images/Banner1_Mobile.jpg?v=20261003f');
}
.cw-banner-slide.slide-tech{
    --cw-banner-desktop:url('../Images/Banner2_Desktop.png?v=20261003f');
    --cw-banner-mobile:url('../Images/Banner2_Mobile.jpg?v=20261003f');
}
.cw-banner-slide.slide-offer{
    --cw-banner-desktop:url('../Images/Banner3_Desktop.png?v=20261003f');
    --cw-banner-mobile:url('../Images/Banner3_Mobile.jpg?v=20261003f');
}
/* =========================================================
   SLIDE 2 - MEDICINE DOORSTEP DELIVERY
   ========================================================= */

.cw-banner-slide.slide-medicine {
    background-image: url('../Images/Banner4_Dekstop.png');
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

/* Keep content on clean left side of artwork */
.slide-medicine .cw-banner-copy {
    max-width: 560px;
}


/* -------------------------
   COMING SOON CARD
   ------------------------- */

.slide-medicine .cw-medicine-card {
    margin-top: 14px;
    max-width: 510px;

    display: flex;
    align-items: center;
    gap: 15px;

    padding: 12px 16px;

    background: rgba(255, 248, 235, .94);
    border: 1px solid rgba(255, 139, 35, .30);
    border-radius: 14px;

    box-shadow: 0 8px 24px rgba(5, 62, 119, .08);
}


/* icon */

.slide-medicine .cw-medicine-icon {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 12px;

    background: linear-gradient(135deg, #ff8a00, #ff5a00);
    color: #fff;

    font-size: 22px;
    font-weight: 900;

    box-shadow: 0 5px 13px rgba(255, 102, 0, .22);
}


/* text */

.slide-medicine .cw-medicine-card-copy {
    display: flex;
    flex-direction: column;
    line-height: 1.05;
}

.slide-medicine .cw-medicine-card-copy strong {
    color: #e65400;
    font-size: 20px;
    font-weight: 900;
    letter-spacing: .3px;
}

.slide-medicine .cw-medicine-card-copy span {
    margin-top: 4px;

    color: #355675;
    font-size: 11px;
    font-weight: 700;
}


/* -------------------------
   SMALL TRUST POINTS
   ------------------------- */

.slide-medicine .cw-medicine-features {
    display: flex;
    align-items: center;
    gap: 18px;

    margin-top: 12px;

    color: #244d72;
    font-size: 11px;
    font-weight: 700;
}

.slide-medicine .cw-medicine-features span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.slide-medicine .cw-medicine-features b {
    color: #0d8ed8;
    font-size: 13px;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width:767px) {

    /* =========================================================
       MEDICINE SLIDE - MOBILE ONLY
       ========================================================= */

    .cw-banner-slide.slide-medicine {
        background-image: url('../Images/Banner4_Mobile.png') !important;
        background-repeat: no-repeat !important;
        background-size: cover !important;
        /* Keep people + Curewell box visible in lower area */
        background-position: center 72% !important;
        background-color: #eaf7ff;
    }


    .slide-medicine .cw-banner-inner {
        position: relative;
        z-index: 2;
        display: block;
        align-items: initial;
        padding: 10px 12px 12px;
        box-sizing: border-box;
    }


    /* Main content card */
    .slide-medicine .cw-banner-copy {
        width: 100%;
        max-width: none;
        min-height: 0;
        margin: 0;
        padding: 12px 14px 11px;
        box-sizing: border-box;
        display: block;
        background: linear-gradient( 135deg, rgba(255,255,255,.86) 0%, rgba(255,255,255,.80) 58%, rgba(246,252,255,.73) 100% );
        border: 1px solid rgba(255,255,255,.94);
        border-radius: 15px;
        box-shadow: 0 9px 24px rgba(9,63,108,.10), inset 0 1px 0 rgba(255,255,255,.75);
        backdrop-filter: blur(2px);
        -webkit-backdrop-filter: blur(2px);
    }


    /* Eyebrow */
    .slide-medicine .cw-banner-eyebrow {
        margin: 0 0 6px;
        font-size: 9px;
        line-height: 1;
        font-weight: 850;
        letter-spacing: 1px;
    }


    /* Main title */
    .slide-medicine .cw-banner-title {
        margin: 0;
        max-width: 100%;
        font-size: clamp(25px, 6vw, 31px);
        line-height: 1.02;
        letter-spacing: -.7px;
        white-space: normal;
    }


        .slide-medicine .cw-banner-title span {
            display: block;
        }


    /* Subtitle */
    .slide-medicine .cw-banner-subtitle {
        margin: 7px 0 8px;
        max-width: 100%;
        font-size: 11px;
        line-height: 1.35;
    }


    /* =========================================================
       COMING SOON CARD
       ========================================================= */

    .slide-medicine .cw-medicine-card {
        width: 100%;
        max-width: none;
        margin: 8px 0 0;
        padding: 8px 10px;
        display: flex;
        align-items: center;
        gap: 10px;
        box-sizing: border-box;
        background: linear-gradient( 135deg, rgba(255,248,235,.97), rgba(255,241,218,.94) );
        border: 1px solid rgba(255,126,24,.42);
        border-radius: 12px;
        box-shadow: 0 5px 14px rgba(220,91,0,.10), inset 0 1px 0 rgba(255,255,255,.90);
    }


    .slide-medicine .cw-medicine-icon {
        width: 42px;
        height: 42px;
        flex: 0 0 42px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 11px;
        background: linear-gradient(145deg,#ff8a00,#ff5a00);
        color: #fff;
        font-size: 20px;
        font-weight: 900;
        box-shadow: 0 5px 11px rgba(255,91,0,.20);
    }


    .slide-medicine .cw-medicine-card-copy {
        min-width: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        line-height: 1;
    }


        .slide-medicine .cw-medicine-card-copy strong {
            margin: 0;
            color: #d94e00;
            font-size: 18px;
            line-height: 1;
            font-weight: 900;
            letter-spacing: .2px;
            white-space: nowrap;
        }


        .slide-medicine .cw-medicine-card-copy span {
            margin-top: 3px;
            color: #70441f;
            font-size: 9px;
            line-height: 1.15;
            font-weight: 700;
        }


    /* Hide extra feature row on mobile */
    .slide-medicine .cw-medicine-features {
        display: none;
    }
}
/* Desktop artwork: strong white reading zone on left, image fully visible on right */
.cw-banner-slide{
    background-image:
        linear-gradient(90deg,
            rgba(255,255,255,.995) 0%,
            rgba(255,255,255,.985) 27%,
            rgba(255,255,255,.93) 39%,
            rgba(255,255,255,.62) 51%,
            rgba(255,255,255,.16) 65%,
            rgba(255,255,255,0) 77%),
        var(--cw-banner-desktop);
}

.cw-banner-slide.active{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    z-index:2;
}

.cw-banner-inner{
    position:relative;
    z-index:2;
    min-height:430px;
    display:flex;
    align-items:center;
    padding:32px 0;
}

.cw-banner-copy{
    width:min(610px,48%);
    padding:18px 8px 18px 6px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-width:0;
}

.cw-banner-eyebrow{
    display:flex;
    align-items:center;
    gap:11px;
    margin-bottom:9px;
    color:#167bb8;
    font-size:12px;
    font-weight:800;
    letter-spacing:1.2px;
    text-transform:uppercase;
}
.cw-banner-eyebrow:after{
    content:"";
    width:70px;
    height:2px;
    background:#238fc9;
    border-radius:20px;
}

.cw-banner-title{
    margin:0;
    color:#083c77;
    font-size:47px;
    line-height:1.02;
    font-weight:850;
    letter-spacing:-1.7px;
    text-shadow:0 1px 0 rgba(255,255,255,.55);
    white-space:nowrap;
}
.cw-banner-title span{
    display:block;
    color:#1688c7;
}

.cw-banner-subtitle{
    margin:10px 0 17px;
    color:#365f82;
    font-size:16px;
    line-height:1.52;
    font-weight:650;
    max-width:560px;
}

.cw-banner-actions{
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
    margin-bottom:17px;
}

.cw-banner-btn{
    min-height:48px;
    padding:0 21px;
    border-radius:10px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    text-decoration:none;
    font-size:14px;
    font-weight:800;
    transition:.18s ease;
}
.cw-banner-btn.primary{
    background:#083b78;
    color:#fff;
    box-shadow:0 8px 18px rgba(8,59,120,.15);
}
.cw-banner-btn.primary:hover{background:#062f63;transform:translateY(-1px)}
.cw-banner-btn.secondary{
    background:rgba(255,255,255,.96);
    color:#0b3d77;
    border:1px solid #b9d8eb;
    box-shadow:0 6px 16px rgba(18,77,120,.06);
}
.cw-banner-btn.secondary:hover{background:#fff;border-color:#8dc4e3}

.cw-banner-points{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:2px;
}
.cw-banner-point{
    display:flex;
    align-items:center;
    gap:9px;
    min-width:0;
    color:#123f6b;
    font-size:11px;
    font-weight:700;
    line-height:1.2;
}
.cw-banner-point-icon{
    width:34px;
    height:34px;
    flex:0 0 34px;
    border-radius:50%;
    background:rgba(223,243,255,.96);
    color:#138aca;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 3px 10px rgba(23,113,170,.08);
}
.cw-banner-point-icon svg{width:18px;height:18px}

/* Promo row: always one controlled row */
.cw-banner-offer{
    display:grid;
    grid-template-columns:auto auto auto;
    align-items:center;
    gap:10px;
    margin:0 0 12px;
    padding:8px 12px;
    align-self:flex-start;
    border-radius:12px;
    background:#fff4dc;
    border:1px solid #f4d490;
    color:#a34a00;
    font-size:12px;
    font-weight:800;
    box-shadow:0 6px 16px rgba(164,83,0,.06);
    white-space:nowrap;
}
.cw-banner-offer strong{
    color:#d45100;
    font-size:18px;
    line-height:1;
    white-space:nowrap;
}
.cw-banner-offer>span:not(.cw-banner-code){white-space:nowrap}
.cw-banner-code{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:7px 11px;
    border-radius:9px;
    background:#073d79;
    color:#fff;
    letter-spacing:.6px;
    font-size:12px;
    line-height:1;
    white-space:nowrap;
}

.cw-banner-nav{
    position:absolute;
    top:50%;
    z-index:8;
    width:44px;
    height:44px;
    transform:translateY(-50%);
    border-radius:50%;
    border:1px solid rgba(255,255,255,.75);
    background:rgba(5,57,117,.90);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    font-size:25px;
    line-height:1;
    box-shadow:0 6px 18px rgba(4,44,90,.18);
}
.cw-banner-nav:hover{background:#062f63}
.cw-banner-prev{left:18px}
.cw-banner-next{right:18px}

.cw-banner-dots{
    position:absolute;
    left:50%;
    bottom:12px;
    transform:translateX(-50%);
    z-index:9;
    display:flex;
    align-items:center;
    gap:7px;
}
.cw-banner-dot{
    width:9px;
    height:9px;
    padding:0;
    border:0;
    border-radius:20px;
    background:rgba(8,59,120,.28);
    cursor:pointer;
}
.cw-banner-dot.active{
    width:28px;
    background:#0a5ca8;
}

/* Additional credibility row for Home Collection + Trusted Diagnostics. */
.cw-banner-value{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px 18px;
    margin-top:10px;
    padding-top:9px;
    border-top:1px solid rgba(17,112,175,.15);
    color:#164c77;
    font-size:11px;
    line-height:1.2;
    font-weight:700;
}
.cw-banner-value span{white-space:nowrap;}

/* =========================================================
   TABLET - keep landscape artwork, slightly tighter copy
   ========================================================= */
@media (min-width:768px) and (max-width:1100px){
    .cw-banner-stage,.cw-banner-inner{min-height:410px}
    .cw-banner-copy{width:min(570px,56%)}
    .cw-banner-title{font-size:41px}
    .cw-banner-subtitle{font-size:14px}
    .cw-banner-slide{background-position:center center}
}

/* =========================================================
   MOBILE - PURPOSE-BUILT LAYOUT
   Desktop/tablet remain unchanged.
   Content leads; portrait artwork decorates the lower area.
   ========================================================= */
/* =========================================================
   MOBILE BANNER ONLY
   ========================================================= */
@media (max-width:767px){
    .cw-home-banner{background:#eaf7ff;}

    .cw-banner-stage,
    .cw-banner-inner{
        min-height:350px;
        height:350px;
    }

    .cw-banner-slide{
        background-image:var(--cw-banner-mobile) !important;
        background-repeat:no-repeat !important;
        background-size:cover !important;
        background-color:#eaf7ff;
    }
    .cw-banner-slide.slide-home{background-position:center 58% !important;}
    .cw-banner-slide.slide-tech{background-position:center 58% !important;}
    .cw-banner-slide.slide-offer{background-position:center 60% !important;}

    .cw-banner-slide:before{
        content:"";
        position:absolute;
        inset:0;
        z-index:1;
        pointer-events:none;
        background:linear-gradient(180deg,
            rgba(238,249,255,.17) 0%,
            rgba(238,249,255,.08) 48%,
            rgba(230,246,255,.03) 100%);
    }

    .cw-banner-inner{
        position:relative;
        z-index:2;
        display:block;
        padding:10px 12px 12px;
        box-sizing:border-box;
    }

    .cw-banner-copy{
        width:100%;
        max-width:none;
        min-height:0;
        margin:0;
        padding:12px 14px 11px;
        box-sizing:border-box;
        display:block;
        border-radius:15px;
        background:linear-gradient(135deg,
            rgba(255,255,255,.84) 0%,
            rgba(255,255,255,.78) 58%,
            rgba(246,252,255,.70) 100%);
        border:1px solid rgba(255,255,255,.92);
        box-shadow:0 9px 24px rgba(9,63,108,.10);
        -webkit-backdrop-filter:blur(2px);
        backdrop-filter:blur(2px);
    }

    .cw-banner-eyebrow{
        display:flex;
        align-items:center;
        gap:7px;
        margin:0 0 6px;
        color:#1178b9;
        font-size:9px;
        line-height:1;
        font-weight:850;
        letter-spacing:1px;
    }
    .cw-banner-eyebrow:after{width:42px;height:2px;flex:0 0 42px;}

    .cw-banner-title{
        margin:0;
        max-width:100%;
        color:#073c78;
        font-size:clamp(25px,6vw,31px);
        line-height:1.02;
        font-weight:900;
        letter-spacing:-.7px;
        text-shadow:none;
    }
    .cw-banner-title span{display:block;color:#1688c7;}

    .cw-banner-subtitle{
        margin:7px 0 9px;
        max-width:100%;
        color:#294f70;
        font-size:11px;
        line-height:1.35;
        font-weight:650;
    }

    .cw-banner-actions{
        display:grid;
        grid-template-columns:minmax(0,1fr) minmax(0,1fr);
        gap:7px;
        width:100%;
        margin:0 0 8px;
    }
    .cw-banner-btn{
        width:100%;
        min-width:0;
        min-height:38px;
        padding:0 8px;
        box-sizing:border-box;
        border-radius:9px;
        gap:5px;
        font-size:10px;
        line-height:1.1;
        white-space:nowrap;
        text-align:center;
    }

    .cw-banner-points{
        display:grid;
        grid-template-columns:repeat(3,minmax(0,1fr));
        gap:5px;
        margin:0;
    }
    .cw-banner-point,
    .cw-banner-point:nth-child(3){
        grid-column:auto;
        min-width:0;
        padding:5px;
        display:flex;
        align-items:center;
        gap:5px;
        border-radius:8px;
        background:rgba(255,255,255,.48);
        border:1px solid rgba(190,220,239,.52);
        color:#123f6b;
        font-size:8px;
        line-height:1.1;
        font-weight:750;
    }
    .cw-banner-point-icon{width:24px;height:24px;flex:0 0 24px;background:rgba(222,244,255,.92);}
    .cw-banner-point-icon svg{width:13px;height:13px;}

    /* Extra value row for Home Collection + Trusted Diagnostics only. */
    .cw-banner-value {
        display: grid;
        grid-template-columns: repeat(3,minmax(0,1fr));
        gap: 5px;
        margin-top: 7px;
        padding-top: 7px;
        border-top: 1px solid rgba(17,112,175,.15);
        color: #164c77;
        font-size: 8px;
        line-height: 1.1;
        font-weight: 750;
    }
    .cw-banner-value span{
        white-space:normal;
        text-align:center;
        padding:5px 3px;
        border-radius:7px;
        background:rgba(255,255,255,.44);
    }

    /* FINALIZED OFFER / COUPON - KEEP THIS DESIGN */
    .cw-banner-offer{
        position:relative;
        width:100%;
        box-sizing:border-box;
        display:grid;
        grid-template-columns:52px minmax(0,1fr);
        grid-template-rows:auto auto auto;
        column-gap:9px;
        row-gap:2px;
        align-items:center;
        margin:8px 0 9px;
        padding:8px 10px;
        border-radius:12px;
        background:linear-gradient(135deg,
            rgba(236,249,255,.96) 0%,
            rgba(226,246,255,.94) 55%,
            rgba(239,252,247,.94) 100%);
        border:1px solid rgba(72,174,222,.32);
        box-shadow:0 5px 14px rgba(20,91,137,.08), inset 0 1px 0 rgba(255,255,255,.80);
        overflow:hidden;
        white-space:normal;
    }
    .cw-banner-offer:before{
        content:"%";
        grid-column:1;
        grid-row:1 / 4;
        width:42px;
        height:42px;
        display:flex;
        align-items:center;
        justify-content:center;
        align-self:center;
        border-radius:11px;
        background:linear-gradient(145deg,#54d86a,#19aa48);
        color:#fff;
        font-size:19px;
        line-height:1;
        font-weight:900;
        box-shadow:0 5px 11px rgba(23,158,67,.18);
    }
    .cw-banner-offer strong{
        grid-column:2;
        grid-row:1;
        display:block;
        margin:0;
        color:#d45100;
        font-size:17px;
        line-height:1;
        font-weight:900;
        text-align:left;
        white-space:nowrap;
    }
    .cw-banner-offer > span:not(.cw-banner-code){
        grid-column:2;
        grid-row:2;
        display:block;
        min-width:0;
        margin:0;
        color:#76502c;
        font-size:9px;
        line-height:1.05;
        font-weight:700;
        text-align:left;
        white-space:nowrap;
    }
    .cw-banner-code{
        grid-column:2;
        grid-row:3;
        display:inline-block;
        width:max-content;
        min-width:0;
        box-sizing:border-box;
        margin-top:2px;
        padding:6px 10px;
        border-radius:7px;
        background:#084789;
        color:#fff;
        font-size:10px;
        line-height:1;
        font-weight:850;
        letter-spacing:.45px;
        white-space:nowrap;
        overflow:visible;
        text-overflow:clip;
    }

    .slide-offer .cw-banner-title{font-size:clamp(24px,5.8vw,30px);}
    .slide-offer .cw-banner-subtitle{margin-top:7px;margin-bottom:8px;}

    .cw-banner-nav{
        top:auto;
        bottom:82px;
        width:34px;
        height:34px;
        transform:none;
        font-size:18px;
        z-index:8;
    }
    .cw-banner-prev{left:6px;}
    .cw-banner-next{right:6px;}
    .cw-banner-dots{bottom:8px;z-index:9;}

    /* Mobile only: hide duplicate top 4.8 / 106 Google reviews score panel. */
    .google-score{display:none !important;}
}


/* =========================================================
   GOOGLE REVIEW STAR ENCODING / APPEARANCE
   ========================================================= */
.google-stars,
.google-brand-stars,
.google-review-top span{
    font-family:Arial,sans-serif;
    letter-spacing:1px;
    color:#f2a600!important;
}
.google-brand-card .google-g{
    font-family:Arial,sans-serif;
    font-weight:900;
}


/* =========================================================
   MEDICINE DOORSTEP DELIVERY - COMING SOON
   ========================================================= */
.cw-medicine-coming { padding: 18px 0 8px; }
.cw-medicine-coming-card { display:flex; align-items:center; gap:16px; padding:18px 22px; border:1px solid #dbe9f5; border-radius:18px; background:linear-gradient(135deg,#f7fbff 0%,#f3faf7 100%); box-shadow:0 8px 24px rgba(9,43,96,.06); }
.cw-medicine-coming-icon { flex:0 0 46px; width:46px; height:46px; display:grid; place-items:center; border-radius:14px; background:#eaf7f0; color:#15834a; font-size:24px; font-weight:800; }
.cw-medicine-coming-copy { min-width:0; flex:1 1 auto; }
.cw-medicine-coming-kicker { display:block; margin-bottom:3px; color:#15834a; font-size:11px; font-weight:800; letter-spacing:.1em; }
.cw-medicine-coming-copy h2 { margin:0; color:#092b60; font-size:clamp(20px,2vw,27px); line-height:1.2; }
.cw-medicine-coming-copy p { margin:5px 0 0; color:#60748a; font-size:14px; line-height:1.5; }
.cw-medicine-coming-badge { flex:0 0 auto; padding:7px 11px; border-radius:999px; background:#092b60; color:#fff; font-size:10px; font-weight:800; letter-spacing:.08em; }
@media (max-width:600px) {
    .cw-medicine-coming { padding-top:12px; }
    .cw-medicine-coming-card { gap:11px; padding:14px; border-radius:14px; }
    .cw-medicine-coming-icon { flex-basis:40px; width:40px; height:40px; border-radius:12px; font-size:21px; }
    .cw-medicine-coming-copy h2 { font-size:18px; }
    .cw-medicine-coming-copy p { font-size:12px; }
    .cw-medicine-coming-badge { display:none; }
}