/* =====================================================================
   SaniBed — additions: Google reviews section + exit-intent popup
   Brand: navy #1B2A4A, gold #C8952E, fonts Playfair Display / Inter
   ===================================================================== */

/* ---------- In-app browser notice (Apple Pay / Google Pay reliability) ---------- */
.inapp-notice{
    background:#1B2A4A;color:#fff;text-align:center;
    font-size:.85rem;line-height:1.5;padding:10px 20px;
}
.inapp-notice strong{color:#C8952E;}

/* ---------- Mattress dimensions under each size name ---------- */
/* Sits inside the existing .col-size grid cell, so the 5-column table grid
   (defined at 3 breakpoints in style.css) stays untouched. */
.size-dims{
    display:block;font-size:11px;font-weight:500;color:#8a8f99;
    line-height:1.3;margin-top:2px;letter-spacing:.2px;
}

/* ---------- "Which depth should I order?" helper ---------- */
.depth-help{
    border:1px solid #e2e4ea;border-radius:8px;background:#fff;
    margin:0 0 16px;overflow:hidden;
}
.depth-help summary{
    cursor:pointer;list-style:none;padding:12px 16px;
    font-size:14px;font-weight:700;color:#1B2A4A;
    display:flex;align-items:center;justify-content:space-between;gap:10px;
}
.depth-help summary::-webkit-details-marker{display:none;}
.depth-help summary::after{
    content:"+";color:#C8952E;font-size:18px;font-weight:700;line-height:1;
}
.depth-help[open] summary::after{content:"\2212";}
.depth-help summary:hover{background:#faf8f4;}
.depth-help p{
    margin:0;padding:0 16px 14px;font-size:13.5px;
    line-height:1.7;color:#4a5568;
}

/* ---------- California King mis-order warning ---------- */
.calking-note{
    background:#fdf7ec;border:1px solid #e8d4a8;border-left:3px solid #C8952E;
    border-radius:6px;padding:12px 16px;margin:0 0 14px;
    font-size:13px;line-height:1.65;color:#4a5568;
}
.calking-note strong{color:#1B2A4A;}

/* ---------- Size table: narrow-screen column balance ----------
   The grids in style.css gave the PRICE column far more room than "$56" needs while
   starving the qty stepper, so the stepper overlapped the TOTAL column on every row
   (pre-existing, at every width below ~768px). These rules re-proportion the same
   five columns — widest label is now "California King" — and must stay ordered
   768 -> 480 -> 360, since equal-specificity rules are resolved by source order. */
@media (max-width:768px){
    .table-header,
    .table-row{
        grid-template-columns:32px 1.2fr 0.7fr 1fr 0.9fr;
    }
}
@media (max-width:480px){
    .table-header,
    .table-row{
        grid-template-columns:26px 1.5fr 0.7fr 1fr 0.9fr;
    }
    .qty-btn{width:22px;height:22px;font-size:12px;}
    .qty-val{width:20px;font-size:12px;line-height:22px;}
    .size-dims{font-size:10px;}
}
/* Narrowest phones (iPhone SE and friends): buy the stepper more room out of the
   price/total columns rather than shrinking the +/- buttons into untappable targets. */
@media (max-width:360px){
    .table-header,
    .table-row{
        grid-template-columns:24px 1.5fr 0.65fr 1.2fr 1fr;
        padding:8px 8px;
    }
}
/* Sub-320px (folded Galaxy Fold and similar): below this the stepper simply cannot
   keep 24px targets without colliding with TOTAL, so shrink it as a last resort. */
@media (max-width:330px){
    .qty-btn{width:20px;height:20px;}
    .qty-val{width:16px;line-height:20px;}
}

/* ---------- Google Reviews / social proof ---------- */
.reviews-section{
    padding:70px 0;
    background:#f7f8fa;
}
.reviews-section .section-label,
.reviews-section .section-title{
    text-align:center;
    display:block;
}
.rv-badge-row{
    display:flex;align-items:center;justify-content:center;gap:10px;
    margin:8px 0 36px;text-decoration:none;
}
.rv-badge-row:hover .rv-badge-text{color:#C8952E;}
.rv-stars-lg{color:#C8952E;font-size:1.35rem;letter-spacing:2px;}
.rv-badge-text{color:#1B2A4A;font-weight:600;font-size:.95rem;transition:color .15s ease;}

.rv-grid{
    display:flex;flex-wrap:wrap;justify-content:center;
    gap:22px;max-width:860px;margin:0 auto;
}
.rv-card{
    background:#fff;border:1px solid #ececf0;border-radius:14px;
    padding:26px 24px;box-shadow:0 4px 20px rgba(27,42,74,.05);
    display:flex;flex-direction:column;
    flex:1 1 240px;max-width:270px;
}
.rv-stars{color:#C8952E;letter-spacing:2px;font-size:1rem;margin-bottom:12px;}
.rv-text{color:#3a4353;line-height:1.6;font-size:.98rem;margin:0 0 18px;flex-grow:1;}
.rv-author{
    display:flex;flex-direction:column;gap:6px;
    border-top:1px solid #f0f0f3;padding-top:14px;
}
.rv-name{font-weight:700;color:#1B2A4A;font-size:.95rem;}
.rv-src{
    display:inline-flex;align-items:center;gap:5px;
    font-size:.8rem;color:#9099a8;text-decoration:none;width:fit-content;
}
.rv-src:hover{color:#1B2A4A;text-decoration:underline;}
.rv-check{flex-shrink:0;}

.rv-more-link{
    display:block;text-align:center;margin-top:32px;
    color:#1B2A4A;font-weight:700;text-decoration:none;font-size:.95rem;
}
.rv-more-link:hover{color:#C8952E;text-decoration:underline;}

/* ---------- Exit-intent popup ---------- */
.exit-overlay{
    position:fixed;inset:0;background:rgba(15,22,40,.6);
    display:none;align-items:center;justify-content:center;
    z-index:1000;padding:20px;opacity:0;transition:opacity .25s ease;
}
.exit-overlay.open{display:flex;opacity:1;}
.exit-modal{
    position:relative;background:#fff;border-radius:18px;
    max-width:420px;width:100%;padding:42px 34px 36px;text-align:center;
    box-shadow:0 20px 60px rgba(0,0,0,.3);
    transform:translateY(12px);transition:transform .25s ease;
}
.exit-overlay.open .exit-modal{transform:translateY(0);}
.exit-close{
    position:absolute;top:14px;right:16px;background:none;border:none;
    font-size:1.7rem;line-height:1;color:#b3b9c4;cursor:pointer;
}
.exit-close:hover{color:#1B2A4A;}
.exit-eyebrow{
    display:block;color:#C8952E;font-weight:700;
    font-size:.78rem;letter-spacing:.14em;margin-bottom:10px;
}
.exit-modal h3{
    font-family:'Playfair Display',serif;color:#1B2A4A;
    font-size:1.7rem;margin:0 0 10px;
}
.exit-sub{color:#586074;font-size:.95rem;margin:0 0 18px;line-height:1.5;}
.exit-code{
    display:inline-block;background:#1B2A4A;color:#fff;font-weight:700;
    letter-spacing:.12em;font-size:1.15rem;padding:12px 26px;border-radius:10px;
    cursor:pointer;
}
.exit-hint{font-size:.8rem;color:#9099a8;margin:12px 0 22px;}
.exit-cta{
    display:inline-block;background:#C8952E;color:#1B2A4A;font-weight:700;
    text-decoration:none;padding:13px 40px;border-radius:9px;letter-spacing:.03em;
}
.exit-cta:hover{background:#d5a43f;}

@media (max-width:520px){
    .exit-modal{padding:36px 22px 30px;}
    .exit-modal h3{font-size:1.45rem;}
}