:root{
    --ink:#10241F;
    --navy:#10241F;
    --navy-deep:#0E3B35;
    --teal:#1B5E56;
    --teal-deep:#0E3B35;
    --mint:#EAF4F1;
    --sand:#F8F4EE;
    --frost:#F4F7F5;
    --coral:#C94726;
    --gold:#C94726;
    --gold-soft:#FCE7DF;
    --slate:#5C6B67;
    --line:#E6E1D7;
    --paper:#FFFDF9;
    --good:#F0A93A;
    --page-bg:linear-gradient(180deg, #f9f5ef 0%, #f3f7f5 38%, #f8f5ef 100%);
  }
  *{box-sizing:border-box;}
  body{
    font-family:'Inter',sans-serif;
    color:var(--ink);
    background:var(--page-bg);
    -webkit-font-smoothing:antialiased;
    position:relative;
  }
  body::before{
    content:"";
    position:fixed;
    inset:0;
    background:radial-gradient(circle at top left, rgba(27,94,86,0.08), transparent 28%), radial-gradient(circle at bottom right, rgba(201,71,38,0.06), transparent 35%);
    pointer-events:none;
    z-index:-1;
  }
  html{scroll-behavior:smooth;}
  h1,h2,h3,h4{font-family:'Sora',sans-serif;font-weight:700;letter-spacing:-0.01em;}
  .mono{font-family:'IBM Plex Mono',monospace;}
  a{text-decoration:none;}

  /* ===== NAV ===== */
  .navbar{background:var(--paper)!important;border-bottom:1px solid var(--line);}
  .navbar-brand{font-family:'Sora',sans-serif;font-size:22px;font-weight:800;color:var(--ink)!important;padding:0;}
  .brand-logo-img{height:61px;width:auto;display:block;}
  .brand-logo-text{height:51px;width:auto;display:block;}
  .navbar-brand span{color:var(--coral);}
  .nav-link{color:var(--slate)!important;font-weight:600;font-size:14px;}
  .nav-link:hover{color:var(--teal)!important;}
  .nav-link-active{color:var(--teal)!important;position:relative;}
  .nav-link-active::after{content:'';position:absolute;bottom:-2px;left:0;right:0;height:2px;background:var(--teal);border-radius:2px;}
  /* toggler */
  .navbar-toggler{border:1.5px solid var(--line);border-radius:10px;padding:6px 10px;}
  .navbar-toggler:focus{box-shadow:none;}
  .navbar-toggler-icon{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(16,36,31,0.85)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");}
  /* mobile collapsed menu */
  @media (max-width:991px){
    #navMenu{background:var(--paper);border-top:1px solid var(--line);padding:16px 0 20px;margin-top:8px;border-radius:0 0 16px 16px;box-shadow:0 12px 32px rgba(16,36,31,0.10);}
    .navbar-nav{gap:0!important;}
    .navbar-nav .nav-item{border-bottom:1px solid var(--line);}
    .navbar-nav .nav-item:last-child{border-bottom:none;}
    .navbar-nav .nav-link{padding:13px 20px!important;font-size:15px;color:var(--ink)!important;display:block;}
    .navbar-nav .nav-link:hover{background:var(--sand);color:var(--teal)!important;}
    /* hide mega menu on mobile — show plain link instead */
    .mega-menu{display:none!important;}
    /* mobile categories accordion */
    .mobile-cat-list{display:none;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:12px;margin:0 12px 8px;overflow:hidden;}
    .mobile-cat-list.open{display:flex;}
    .mob-cat-group{border-bottom:1px solid var(--line);}
    .mob-cat-group:last-of-type{border-bottom:none;}
    .mob-cat-heading{display:flex;justify-content:space-between;align-items:center;padding:13px 18px;font-size:14px;font-weight:700;color:var(--ink);background:var(--sand);}
    .mob-cat-heading:hover{background:var(--mint);color:var(--teal);}
    .mob-cat-arrow{font-size:16px;color:var(--slate);transition:transform .2s;}
    .mob-cat-heading.open .mob-cat-arrow{transform:rotate(90deg);}
    .mob-cat-products{display:none;flex-direction:column;background:var(--paper);border-top:1px solid var(--line);}
    .mob-cat-products.open{display:flex;}
    .mob-cat-product-link{display:flex;flex-direction:column;padding:11px 24px;border-bottom:1px dashed var(--line);}
    .mob-cat-product-link:last-child{border-bottom:none;}
    .mob-cat-product-link:hover{background:var(--frost);}
    .mob-prod-name{font-size:13.5px;font-weight:700;color:var(--ink);}
    .mob-prod-sub{font-size:12px;color:var(--slate);margin-top:2px;}
    .mob-cat-actions{display:flex;gap:10px;padding:14px 16px;background:var(--sand);border-top:1px solid var(--line);}
    .mob-cat-action-link{flex:1;text-align:center;padding:10px 12px;border-radius:100px;font-size:13px;font-weight:700;border:1.5px solid var(--line);color:var(--ink);}
    .mob-cat-action-dark{background:var(--ink);color:#fff!important;border-color:var(--ink);}
    #mobileCatToggle.open{color:var(--teal)!important;}
    /* Mobile inline search between logo and toggler */
    .nav-search-mobile{
      flex:1;
      margin:0 10px;
      position:relative;
      display:flex;
      align-items:center;
    }
    .nav-search-mobile .nav-search-input{
      width:100%!important;
      border-radius:20px;
      font-size:13px;
      padding:8px 36px 8px 14px;
      border:1.5px solid var(--line);
      background:var(--sand);
      color:var(--ink);
      height:38px;
    }
    .nav-search-mobile .nav-search-input:focus{
      border-color:var(--teal);
      background:var(--paper);
      outline:none;
      box-shadow:none;
    }
    .nav-search-mobile .nav-search-input:hover{
      border-color:var(--teal);
    }
    .nav-search-mobile .nav-search-ic{
      position:absolute;
      right:12px;
      top:50%;
      transform:translateY(-50%);
      color:var(--slate);
      display:flex;
      align-items:center;
    }
    /* hide the search inside collapse on mobile */
    .navbar-collapse .nav-search{display:none;}
    .navbar-collapse .d-flex.nav-actions{flex-direction:column;align-items:stretch!important;gap:10px!important;padding:5px 20px 4px;}
    .nav-search{width:100%;}
    .nav-search-input{width:100%!important;border-radius:10px;}
    .nav-search-input:focus{width:100%!important;}
    .nav-icons{justify-content:center;padding:4px 0;}
    .nav-cart{font-size:22px;}
    .btn-teal{width:100%;text-align:center;padding:12px 22px;font-size:14px;}
  }
  .btn-line{border:1.5px solid var(--ink);border-radius:100px;font-weight:700;font-size:13px;padding:14px 18px;color:var(--ink);}
  .btn-line:hover{background:var(--ink);color:var(--paper);}
  .btn-teal{background:var(--teal);color:var(--paper);border-radius:100px;font-weight:700;font-size:13px;padding:10px 22px;border:none;}
  .btn-teal:hover{background:var(--teal-deep);color:var(--paper);}
  .btn-coral{background:var(--coral);color:var(--paper);border-radius:100px;font-weight:700;font-size:14px;padding:15px 32px;border:none;}
  .btn-coral:hover{background:#e8663f;color:var(--paper);}

  .nav-search{position:relative;display:flex;align-items:center;}
  .nav-search-input{
    border:1px solid var(--line);border-radius:100px;background:var(--sand);
    padding:9px 38px 9px 16px;font-size:13px;width:170px;transition:width .2s, background .2s;
  }
  .nav-search-input:focus{outline:none;border-color:var(--teal);background:var(--paper);width:220px;box-shadow:none;}
  .nav-search-input:hover{border-color:var(--teal);}
  .nav-search-ic{position:absolute;right:13px;top:50%;transform:translateY(-50%);font-size:13px;color:var(--slate);cursor:pointer;}
  .nav-cart{position:relative;font-size:19px;color:var(--ink);display:inline-flex;align-items:center;}
  .nav-cart:hover{color:var(--teal);}
  .nav-cart svg{display:block;}
  .cart-badge{
    position:absolute;top:-7px;right:-9px;background:var(--coral);color:#fff;font-size:10px;font-weight:700;
    border-radius:50%;width:17px;height:17px;display:flex;align-items:center;justify-content:center;line-height:1;
  }

  /* ===== HERO SLIDER ===== */
  .hero-slider{position:relative;overflow:hidden;}
  .carousel-item .slide-inner{
    min-height:560px;display:flex;align-items:center;position:relative;overflow:hidden;
  }
  .slide-1{background:url('https://picsum.photos/seed/mattress-hero-1/1600/700') center/cover;}
  .slide-2{background:url('https://picsum.photos/seed/mattress-hero-2/1600/700') center/cover;}
  .slide-3{background:url('https://picsum.photos/seed/mattress-hero-3/1600/700') center/cover;}
  .slide-inner{position:relative;}
  .slide-inner .slide-overlay{
    position:absolute;inset:0;z-index:1;
    background:linear-gradient(100deg, rgba(11,27,23,.88) 0%, rgba(11,27,23,.65) 45%, rgba(11,27,23,.15) 75%);
  }
  .slide-content{position:relative;z-index:2;color:#fff;padding:0 5vw;max-width:600px;}
  .slide-content .tag{
    font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.1em;text-transform:uppercase;
    color:#EAF4F1;background:rgba(255,255,255,.12);display:inline-block;padding:6px 14px;border-radius:100px;margin-bottom:20px;
  }
  .slide-content h2{font-size:clamp(32px,4.5vw,48px);line-height:1.1;margin-bottom:16px;}
  .slide-content p{font-size:16px;color:rgba(255,255,255,.8);margin-bottom:28px;max-width:440px;}
  .carousel-control-prev,.carousel-control-next{width:6%;opacity:1;}
  .carousel-control-prev-icon,.carousel-control-next-icon{
    background-color:rgba(255,255,255,.15);border-radius:50%;padding:22px;background-size:16px;
  }
  .carousel-indicators [data-bs-target]{
    width:8px;height:8px;border-radius:50%;background-color:rgba(255,255,255,.4);border:none;margin:0 5px;
  }
  .carousel-indicators .active{background-color:#fff;}

  /* trust strip */
  .trust-strip{background:var(--sand);border-bottom:1px solid var(--line);}
  .trust-item{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;color:var(--teal-deep);}
  .trust-item .ic{width:30px;height:30px;border-radius:50%;background:var(--paper);display:flex;align-items:center;justify-content:center;font-size:14px;border:1px solid var(--line);}

  /* section heads */
  .kicker{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--coral);margin-bottom:10px;display:block;}
  .section-head h2{font-size:clamp(26px,3.2vw,38px);}
  .section-head p{color:var(--slate);font-size:15px;line-height:1.6;}

  /* ===== CATEGORIES ===== */
  .cat-card{
    position:relative;border-radius:20px;overflow:hidden;height:220px;
    display:flex;align-items:flex-end;padding:22px;color:#fff;
    transition:transform .25s;
  }
  .cat-bg-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
  .cat-card:hover{transform:translateY(-5px);}
  .cat-card h4{font-size:18px;margin-bottom:4px;}
  .cat-card span{font-size:12.5px;color:rgba(255,255,255,.8);}
  .cat-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.55) 100%);}
  .cat1{background:linear-gradient(135deg,#1B5E56,#3E8579);}
  .cat2{background:linear-gradient(135deg,#5C4432,#8A6A4C);}
  .cat3{background:linear-gradient(135deg,#3B3552,#635A85);}
  .cat4{background:linear-gradient(135deg,#7A3B3B,#B25858);}
  .cat-content{position:relative;z-index:2;}
  .cat-arrow{
    position:absolute;top:18px;right:18px;width:34px;height:34px;border-radius:50%;
    background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;
    font-size:14px;z-index:2;
  }

  /* ===== FILTERS + PRODUCTS ===== */
  .filters-panel{background:var(--sand);border-radius:20px;padding:2px;}
  .filters-panel h5{font-size:15px;font-weight:700;margin-bottom:16px;}
  .filters-panel .reset{font-size:13px;color:var(--coral);font-weight:700;cursor:pointer;}
  .form-range::-webkit-slider-thumb{background:var(--teal);}
  .form-check-input:checked{background-color:var(--teal);border-color:var(--teal);}
  .form-check-label{font-size:13.5px;color:var(--slate);}
  .filters-divider{border-top:1px solid var(--line);margin:20px 0;}
  .price-chip{
    display:inline-block;background:var(--paper);border:1px solid var(--line);
    font-family:'IBM Plex Mono',monospace;font-size:12px;padding:4px 10px;border-radius:8px;
  }

  /* ===== SORT BY ===== */
  .sort-btn{
    background:var(--paper);border:1px solid var(--line);border-radius:12px;
    font-size:13.5px;padding:10px 16px;color:var(--ink);
  }
  .sort-btn strong{font-weight:700;}
  .sort-btn:hover{border-color:var(--teal);}
  .sort-menu{border:1px solid var(--line);border-radius:14px;box-shadow:0 20px 40px rgba(16,36,31,.12);min-width:220px;}
  .sort-menu .form-check-input:checked{background-color:var(--teal);border-color:var(--teal);}


  /* testimonials */
  .testi-card{border:1px solid var(--line);border-radius:18px;padding:26px;background:var(--paper);height:100%;}
  .testi-card p{font-size:14.5px;line-height:1.6;}
  .testi-card .who{font-size:13px;color:var(--slate);font-weight:700;}

  /* ===== RATINGS SLIDER ===== */
  .ratings-slider .carousel-inner{padding:6px 2px 30px;}
  .ratings-slider .carousel-control-prev,
  .ratings-slider .carousel-control-next{
    width:44px;height:44px;top:38%;background:var(--ink);border-radius:50%;opacity:1;
  }
  .ratings-slider .carousel-control-prev{left:-10px;}
  .ratings-slider .carousel-control-next{right:-10px;}
  .ratings-slider .carousel-control-prev-icon,
  .ratings-slider .carousel-control-next-icon{width:16px;height:16px;}
  .ratings-slider .carousel-indicators{bottom:-6px;}
  .ratings-slider .carousel-indicators [data-bs-target]{
    width:8px;height:8px;border-radius:50%;background-color:var(--line);border:none;opacity:1;
  }
  .ratings-slider .carousel-indicators .active{background-color:var(--coral);}
  @media (max-width:991px){
    .ratings-slider .carousel-control-prev{left:2px;}
    .ratings-slider .carousel-control-next{right:2px;}
  }

  /* cta */
  .cta-band{background:linear-gradient(120deg,var(--teal-deep),var(--teal));color:#fff;border-radius:24px;padding:50px 44px;}
  .cta-band h3{font-size:26px;}
  .cta-band p{color:rgba(255,255,255,.75);font-size:14px;}

  /* footer */
  footer{background:var(--ink);color:rgba(255,255,255,.6);padding:60px 0 26px;}
  footer h4{color:#fff;font-family:'Inter',sans-serif;font-weight:700;font-size:14px;margin-bottom:16px;}
  footer ul{list-style:none;padding-left:0;}
  footer ul li{margin-bottom:10px;font-size:13.5px;}
  footer ul li a{color:inherit;}
  footer ul li a:hover{color:#fff;text-decoration:underline;}
  .foot-logo{font-family:'Sora',sans-serif;color:#fff;font-size:20px;font-weight:800;margin-bottom:14px;}
  footer p{font-size:13.5px;line-height:1.6;}
  .foot-bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:22px;margin-top:36px;font-size:12.5px;}

  /* ===== MEGA MENU ===== */
  .mega-dropdown{position:relative;}
  .mega-dropdown .dropdown-toggle::after{vertical-align:2px;}
  .mega-menu{
    display:none;
    position:fixed;
    left:50%;
    transform:translateX(-50%);
    top:70px;
    width:980px;max-width:94vw;margin:0;
    background:var(--paper);
    border:1px solid var(--line);border-radius:18px;box-shadow:0 30px 60px rgba(16,36,31,.25);
    overflow:hidden;z-index:1060;
  }
  .mega-menu.show-menu{display:block;}
  .mega-sidebar{background:var(--sand);padding:18px 0;border-right:1px solid var(--line);}
  .mega-sidebar-link{
    display:flex;justify-content:space-between;align-items:center;
    padding:12px 26px;font-size:14px;font-weight:600;color:var(--ink);
  }
  .mega-sidebar-link span{color:var(--slate);}
  .mega-sidebar-link:hover{background:rgba(255,255,255,.7);}
  .mega-sidebar-link.active{background:var(--paper);color:var(--teal-deep);font-weight:700;}
  .mega-sidebar-link.active span{color:var(--teal);}
  .mega-col{padding:0 18px;border-right:1px solid var(--line);}
  .mega-col.mega-col-last{border-right:none;}
  .mega-heading{
    font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;
    color:var(--coral);display:block;margin-bottom:14px;
  }
  .mega-link{display:block;padding:10px 0;border-bottom:1px dashed var(--line);}
  .mega-link:last-child{border-bottom:none;}
  .mega-link .mega-title{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;color:var(--ink);}
  .mega-link .mega-sub{display:block;font-size:12px;color:var(--slate);margin-top:2px;}
  .mega-link:hover .mega-title{color:var(--teal);}
  .mega-badge{
    font-size:9.5px;font-weight:700;letter-spacing:.03em;padding:2px 7px;border-radius:100px;
    background:var(--mint);color:var(--teal-deep);text-transform:uppercase;
  }
  .mega-badge.hot{background:#FCE7DF;color:var(--coral);}
  .btn-pill-outline{border:1.5px solid var(--line);border-radius:100px;padding:10px 20px;font-size:13px;font-weight:700;color:var(--ink);}
  .btn-pill-outline:hover{border-color:var(--teal);color:var(--teal-deep);}
  .btn-pill-dark{background:var(--ink);color:#fff;border-radius:100px;padding:10px 22px;font-size:13px;font-weight:700;}
  .btn-pill-dark:hover{background:var(--teal-deep);color:#fff;}

  /* ===== PREMIUM SHOWCASE BLOCK ===== */
  .premium-showcase{position:relative;min-height:520px;display:flex;align-items:center;overflow:hidden;}
  .premium-showcase-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
  .premium-showcase-overlay{
    position:absolute;inset:0;z-index:1;
    background:linear-gradient(100deg, rgba(11,27,23,.92) 0%, rgba(11,27,23,.72) 40%, rgba(11,27,23,.35) 75%);
  }
  .premium-showcase-content{position:relative;z-index:2;color:#fff;padding:70px 0;}
  .premium-showcase-content h2{font-size:clamp(28px,3.6vw,44px);line-height:1.15;margin:14px 0 16px;max-width:640px;}
  .premium-showcase-content p{font-size:16px;color:rgba(255,255,255,.75);max-width:480px;margin-bottom:40px;}
  .premium-stats{display:flex;gap:48px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.18);padding-top:30px;}
  .p-stat{display:flex;flex-direction:column;gap:6px;}
  .p-num{font-size:28px;font-weight:700;color:#F0D9A3;}
  .p-label{font-size:12.5px;color:rgba(255,255,255,.65);max-width:130px;line-height:1.4;}

  /* ===== WHY CHOOSE US ===== */

  /* ===== COMFORT CORNER (blog cards) ===== */
  .blog1{background:linear-gradient(115deg,#DCE4F2 48%,#F3E9DC 52%);}
  .blog2{background:linear-gradient(115deg,#F3EFE4 48%,#E4DCC9 52%);}
  .blog3{background:linear-gradient(135deg,var(--mint),#DCEDE8);}
  .blog4{background:linear-gradient(135deg,#EFE7F5,#DCD3EC);}
  .blog-vs{background:var(--ink);color:#fff;font-weight:800;font-size:14px;width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
  .blog-cat{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--coral);display:block;margin-bottom:6px;}

  /* ===== CALLBACK MODAL ===== */
  .callback-modal{border-radius:28px;border:none;overflow:hidden;position:relative;box-shadow:0 32px 80px rgba(16,36,31,0.18);}
  .callback-art{min-height:420px;position:relative;overflow:hidden;background:linear-gradient(160deg,var(--teal-deep) 0%,#1B5E56 50%,#2D7A6E 100%);display:flex;align-items:stretch;}
  .callback-art::before{content:"";position:absolute;inset:0;background:url('https://picsum.photos/seed/sleep-expert-cb/600/800') center/cover no-repeat;opacity:0.18;}
  .callback-art::after{content:"";position:absolute;bottom:0;left:0;right:0;height:120px;background:linear-gradient(to top,rgba(11,40,35,0.7),transparent);}
  .callback-art-inner{position:relative;z-index:2;padding:40px 32px;display:flex;flex-direction:column;justify-content:flex-end;width:100%;}
  .callback-kicker{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.65);margin-bottom:14px;display:block;}
  .callback-stat{font-family:'Sora',sans-serif;font-size:52px;font-weight:800;color:#fff;line-height:1;margin-bottom:10px;}
  .callback-lead{font-size:14px;color:rgba(255,255,255,.8);line-height:1.6;margin-bottom:24px;}
  .callback-trust{display:flex;flex-direction:column;gap:8px;}
  .callback-trust-item{font-size:13px;color:rgba(255,255,255,.9);display:flex;align-items:center;gap:8px;}
  .callback-trust-ic{width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.15);display:inline-flex;align-items:center;justify-content:center;font-size:11px;color:#fff;flex-shrink:0;}
  .callback-form-panel{padding:40px 36px;background:#fff;display:flex;flex-direction:column;justify-content:center;}
  .callback-title{font-family:'Sora',sans-serif;font-size:22px;font-weight:800;color:var(--ink);margin-bottom:6px;}
  .callback-sub{font-size:13.5px;color:var(--slate);line-height:1.6;margin-bottom:0;}
  .callback-field{margin-bottom:16px;}
  .callback-label{font-size:12px;font-weight:700;color:var(--ink);letter-spacing:.04em;text-transform:uppercase;display:block;margin-bottom:6px;}
  .callback-input{width:100%;border:1.5px solid rgba(16,36,31,0.14);border-radius:12px;padding:12px 16px;font-size:14px;color:var(--ink);background:var(--sand);outline:none;transition:border-color .2s,box-shadow .2s;}
  .callback-input:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(27,94,86,.1);background:#fff;}
  .callback-input::placeholder{color:rgba(16,36,31,.35);}
  .callback-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px;}
  .callback-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:999px;border:1.5px solid rgba(16,36,31,0.14);font-size:13px;font-weight:600;color:var(--slate);cursor:pointer;transition:all .15s;background:#fff;}
  .callback-chip:has(input:checked){border-color:var(--teal);background:rgba(27,94,86,.07);color:var(--teal-deep);}
  .callback-chip input{display:none;}
  .callback-submit{width:100%;margin-top:22px;padding:14px 24px;background:var(--teal);color:#fff;border:none;border-radius:14px;font-size:14px;font-weight:700;letter-spacing:.02em;cursor:pointer;transition:background .2s;}
  .callback-submit:hover{background:var(--teal-deep);}
  .callback-privacy{font-size:11.5px;color:var(--slate);text-align:center;margin-top:14px;margin-bottom:0;}
  .btn-close-custom{position:absolute;top:14px;right:14px;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.2);border:none;font-size:18px;z-index:10;color:#fff;display:flex;align-items:center;justify-content:center;line-height:1;transition:background .2s;}
  .btn-close-custom:hover{background:#1B5E56;}
  @media(max-width:767px){
    .callback-art{min-height:200px;}
    .callback-art-inner{padding:24px 24px 28px;}
    .callback-stat{font-size:38px;}
    .callback-form-panel{padding:28px 24px;}
  }

  /* ===== PINCODE DELIVERY CHECKER ===== */
  .pincode-check-box{border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-top:14px;background:var(--sand);}
  .pc-label{font-size:12px;font-weight:700;color:var(--ink);margin-bottom:8px;display:block;}
  .pc-input-row{display:flex;gap:8px;}
  .pc-input-row .form-control{border:1px solid var(--line);border-radius:8px;padding:9px 12px;font-size:13.5px;letter-spacing:.02em;}
  .pc-input-row .form-control:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(27,94,86,.12);}
  .pc-input-row .btn{white-space:nowrap;padding:9px 18px;font-size:13px;}
  .pc-result{font-size:12.5px;margin-top:8px;font-weight:600;min-height:16px;}
  .pc-result.pc-success{color:var(--teal-deep);}
  .pc-result.pc-error{color:var(--coral);}
  .pc-result.pc-muted{color:var(--slate);font-weight:400;}

  /* ===== PRODUCT DETAIL PAGE ===== */
  /* Moved out of product-details.blade.php's inline <style> block —
     it was silently overriding the real .btn-teal/.btn-line/
 rules above with different
     hardcoded values (a leftover navy/gold palette from before this
     page adopted the real brand tokens), which is why the product
     page's buttons and section spacing didn't quite match the rest
     of the site. Those overrides are dropped here — the canonical
     rules above now apply on this page too. Everything else below is
     genuinely specific to this page's layout and wasn't duplicated
     anywhere else. */
  .product-section{padding:44px 0 80px;}
  .gallery-main{position:relative;border-radius:20px;overflow:hidden;min-height:460px;background:linear-gradient(150deg,#1B3A57,#2E5A80 60%,#5C88A8);display:flex;align-items:center;}
  .gallery-main::before{content:"";position:absolute;inset:0;background-image:radial-gradient(1.5px 1.5px at 20% 25%,rgba(255,255,255,.5) 0,transparent 50%),radial-gradient(1.5px 1.5px at 70% 15%,rgba(255,255,255,.4) 0,transparent 50%),radial-gradient(1.5px 1.5px at 85% 60%,rgba(255,255,255,.35) 0,transparent 50%);}
  .gallery-main-img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;}
  .gallery-text{position:relative;z-index:2;color:#fff;padding:0 6%;max-width:480px;}
  .gallery-text .tag{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-soft);background:rgba(255,255,255,.1);padding:5px 12px;border-radius:100px;display:inline-block;margin-bottom:16px;}
  .gallery-text h1{font-size:clamp(24px,3vw,32px);line-height:1.2;margin-bottom:10px;}
  .gallery-text p{font-size:14.5px;color:rgba(255,255,255,.8);}
  .gallery-mattress{position:absolute;right:6%;bottom:8%;width:46%;max-width:340px;height:120px;border-radius:10px 10px 4px 4px;box-shadow:0 24px 50px rgba(0,0,0,.35);overflow:hidden;}
  .gallery-mattress::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,#1B3A57 0 44%,#EEF2F7 44% 100%);}
  .gallery-thumbs{display:flex;gap:12px;margin-top:16px;overflow-x:auto;}
  .thumb{width:78px;height:64px;border-radius:10px;flex-shrink:0;border:2px solid transparent;background:linear-gradient(135deg,#DCE4F2,#EEF1F7);cursor:pointer;}
  .thumb.active{border-color:var(--gold);}
  .buy-box{background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:28px;height:100%;}
  .buy-box::-webkit-scrollbar{display:none;}
  .badge-row{background:var(--navy);border-radius:16px;padding:18px 10px;display:flex;justify-content:space-around;text-align:center;margin-bottom:22px;}
  .badge-row .b-item{flex:1;padding:0 6px;}
  .badge-row .b-ic{font-size:20px;display:block;margin-bottom:6px;}
  .badge-row .b-label{font-size:10.5px;color:rgba(255,255,255,.6);line-height:1.3;}
  .badge-row .b-val{font-size:12.5px;font-weight:700;color:#fff;}
  .badge-row .b-divider{width:1px;background:rgba(255,255,255,.15);}
  .buy-box h2{font-size:22px;line-height:1.3;margin-bottom:10px;}
  .rating-pill{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--navy);background:var(--frost);padding:5px 12px;border-radius:100px;margin-bottom:18px;}
  .rating-pill .star{color:var(--good);}
  .feat-icons{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap;}
  .feat-icons .f-item{flex:1;min-width:110px;border:1px solid var(--line);border-radius:12px;padding:12px 10px;text-align:center;}
  .feat-icons .f-ic{font-size:18px;display:block;margin-bottom:6px;}
  .feat-icons .f-txt{font-size:11.5px;color:var(--slate);line-height:1.3;}
  .config-group{margin-bottom:20px;}
  .config-label{font-size:12.5px;font-weight:700;color:var(--slate);margin-bottom:10px;display:block;text-transform:uppercase;letter-spacing:.03em;}
  .unit-toggle{display:flex;gap:8px;}
  .unit-btn{border:1px solid var(--line);border-radius:10px;padding:9px 18px;font-weight:700;font-size:13px;color:var(--navy);background:var(--paper);cursor:pointer;}
  .unit-btn.active{background:var(--gold);color:var(--navy-deep);border-color:var(--gold);}
  .size-grid{display:flex;gap:10px;flex-wrap:wrap;}
  .size-card{flex:1;min-width:70px;border:1.5px solid var(--line);border-radius:12px;padding:14px 8px;text-align:center;cursor:pointer;background:var(--paper);transition:border-color .15s;}
  .size-card .s-ic{font-size:22px;display:block;margin-bottom:6px;}
  .size-card .s-label{font-size:12.5px;font-weight:700;color:var(--navy);}
  .size-card.active{border-color:var(--gold);background:#FBF6EA;}
  .height-pills{display:flex;gap:8px;flex-wrap:wrap;}
  .h-pill{border:1px solid var(--line);border-radius:100px;padding:9px 16px;font-size:13px;font-weight:700;color:var(--navy);background:var(--paper);cursor:pointer;}
  .h-pill.active{background:var(--gold);color:var(--navy-deep);border-color:var(--gold);}
  .dim-field{display:flex;justify-content:space-between;align-items:center;border:1.5px solid var(--gold);border-radius:12px;padding:14px 16px;font-weight:700;color:var(--navy);font-size:14.5px;cursor:pointer;background:var(--paper);text-align:left;}
  .dim-field::after{margin-left:auto;}
  .dim-menu{width:100%;border:1px solid var(--line);border-radius:12px;box-shadow:0 20px 40px rgba(16,36,31,.12);padding:8px;}
  .dim-menu .dim-option{border-radius:8px;padding:10px 12px;font-size:13.5px;font-weight:600;color:var(--navy);}
  .dim-menu .dim-option em{color:var(--slate);font-weight:400;font-style:normal;font-size:12px;}
  .dim-menu .dim-option:hover,.dim-menu .dim-option.active{background:var(--frost);}
  .color-swatches{display:flex;gap:14px;align-items:center;}
  .color-dot{width:34px;height:34px;border-radius:50%;border:2px solid transparent;cursor:pointer;position:relative;box-shadow:0 0 0 1px var(--line) inset;}
  .color-dot.active{border-color:var(--gold);box-shadow:0 0 0 2px var(--paper) inset,0 0 0 1px var(--gold);}
  .color-dot.active::after{content:"✓";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;text-shadow:0 1px 2px rgba(0,0,0,.4);}
  .color-name{font-size:12.5px;color:var(--slate);margin-top:8px;}
  .price-block{margin:22px 0;}
  .price-block .label{font-size:12px;color:var(--slate);}
  .price-now{font-family:'IBM Plex Mono',monospace;font-size:30px;font-weight:700;color:var(--navy);}
  .price-was{font-family:'IBM Plex Mono',monospace;font-size:15px;color:var(--slate);text-decoration:line-through;margin-left:8px;}
  .off-pill{background:var(--gold);color:var(--navy-deep);font-size:11.5px;font-weight:800;padding:4px 10px;border-radius:100px;margin-left:10px;}
  .qty-box{display:flex;align-items:center;border:1px solid var(--line);border-radius:12px;overflow:hidden;width:120px;}
  .qty-box button{background:var(--frost);border:none;width:36px;height:44px;font-size:16px;font-weight:700;color:var(--navy);cursor:pointer;}
  .qty-box input{border:none;width:48px;text-align:center;font-weight:700;background:var(--paper);}
  .btn-navy{background:var(--navy);color:#fff;border-radius:12px;font-weight:700;font-size:14px;padding:14px 0;border:none;}
  .btn-navy:hover{background:var(--navy-deep);color:#fff;}
  .btn-gold{background:var(--gold);color:#fff;border-radius:100px;font-weight:700;font-size:13px;padding:10px 22px;border:none;}
  .btn-gold-full{background:var(--gold);color:var(--navy-deep);border-radius:12px;font-weight:700;font-size:14px;padding:14px 0;border:none;}
  .btn-gold-full:hover{background:var(--gold-soft);color:var(--navy);}
  .trust-mini{display:flex;justify-content:space-between;margin-top:22px;padding-top:20px;border-top:1px solid var(--line);}
  .trust-mini .t-item{text-align:center;font-size:11px;color:var(--slate);flex:1;}
  .trust-mini .t-ic{font-size:18px;display:block;margin-bottom:5px;}
  .info-card{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:26px;height:100%;}
  .info-card .i-ic{font-size:26px;display:block;margin-bottom:14px;}
  .info-card h4{font-size:15.5px;margin-bottom:8px;}
  .info-card p{font-size:13.5px;color:var(--slate);line-height:1.6;margin:0;}
  .layer-row{display:flex;align-items:flex-start;gap:20px;padding:18px 0;border-bottom:1px solid var(--line);}
  .layer-row:last-child{border-bottom:none;}
  .layer-num{font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:700;color:var(--gold);background:var(--frost);border-radius:50%;width:34px;height:34px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
  .layer-row h5{font-size:15px;margin-bottom:4px;}
  .layer-row p{font-size:13.5px;color:var(--slate);margin:0;}
  .spec-table{width:100%;border-collapse:collapse;}
  .spec-table td{padding:14px 0;border-bottom:1px solid var(--line);font-size:14px;}
  .spec-table td:first-child{color:var(--slate);width:40%;}
  .spec-table td:last-child{font-weight:600;color:var(--navy);}
  .rating-summary-card{background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:28px;text-align:center;}
  .rs-score{font-size:52px;font-weight:700;color:var(--navy);line-height:1;}
  .rs-score span{font-size:20px;color:var(--slate);}
  .rs-stars{font-size:24px;color:var(--gold);margin:8px 0 4px;}
  .rs-count{font-size:13px;color:var(--slate);margin-bottom:20px;}
  .rs-bars{text-align:left;}
  .rs-bar-row{display:flex;align-items:center;gap:10px;margin-bottom:8px;}
  .rs-label{font-size:12px;font-weight:700;color:var(--navy);width:24px;text-align:right;}
  .rs-bar{flex:1;height:8px;background:var(--frost);border-radius:100px;overflow:hidden;}
  .rs-fill{height:100%;background:var(--gold);border-radius:100px;}
  .rs-pct{font-size:12px;color:var(--slate);width:30px;}
  .review-form-card{background:var(--frost);border:1px solid var(--line);border-radius:18px;padding:24px;}
  .review-form-card h5{font-size:16px;margin-bottom:16px;}
  .form-label-review{font-size:12.5px;font-weight:700;color:var(--slate);margin-bottom:6px;display:block;margin-top:14px;}
  .form-control-review{width:100%;border:1px solid var(--line);border-radius:10px;padding:12px 14px;font-size:14px;color:var(--navy);background:var(--paper);}
  .form-control-review:focus{outline:none;border-color:var(--gold);}
  .star-picker{display:flex;gap:6px;font-size:26px;cursor:pointer;color:var(--line);}
  .star-picker span.active{color:var(--gold);}
  .review-form-note{font-size:13px;color:var(--slate);margin-top:10px;}
  .review-card{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:22px;margin-bottom:16px;}
  .review-header{display:flex;align-items:flex-start;gap:14px;margin-bottom:12px;}
  .reviewer-avatar{width:42px;height:42px;border-radius:50%;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex-shrink:0;}
  .reviewer-name{font-size:14px;font-weight:700;color:var(--navy);}
  .verified-badge{background:#E8F8F0;color:#22a96a;font-size:11px;font-weight:600;padding:3px 8px;border-radius:100px;margin-left:8px;}
  .review-stars{font-size:13px;color:var(--gold);margin-top:4px;}
  .review-date{color:var(--slate);font-size:12px;}
  .review-text{font-size:14px;color:var(--navy);line-height:1.7;margin:0 0 10px;}
  .review-helpful{font-size:12.5px;color:var(--slate);cursor:pointer;}
  .alert-success-review{background:#E8F8F0;color:#22a96a;border-radius:10px;padding:12px 16px;font-size:13.5px;font-weight:600;}
  .product-desc-list ol,.product-desc-list ul{padding-left:0;margin:0;list-style:none;}
  .product-desc-list li{margin-bottom:4px;padding-left:22px;position:relative;}
  .product-desc-list li::before{content:'✓';position:absolute;left:0;color:#22a96a;font-weight:700;background:#e8f8f0;}
  .layers-visual img{width:100%;border-radius:16px;}

  /* ===== HONEST EMPTY-REVIEW STATES (no fabricated ratings) ===== */
  .rating-pill-empty{background:var(--mint);color:var(--teal-deep);font-size:12.5px;}
  .rs-empty{text-align:center;padding:24px 12px;color:var(--slate);}
  .rs-empty span{display:block;margin-bottom:8px;color:var(--slate);}

  /* ===== CART DRAWER =====
     Moved out of header.blade.php's inline <style> block, verbatim —
     kept exactly as it already rendered, including its own separate
     color values, so nothing about its appearance changes as part of
     this relocation. The one exception: .cart-badge was declared
     TWICE (once here with different colors, once already above in
     this file) — that was a real, live conflict, not just harmless
     duplication, so the clashing copy here is dropped in favor of the
     token-based version already established above. Everything else
     below is untouched. */
  .cart-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:1040;animation:cd-fade-in .2s ease;}
  @keyframes cd-fade-in{from{opacity:0}to{opacity:1}}

  .cart-drawer{
    position:fixed;top:0;right:0;height:100%;width:420px;max-width:95vw;
    background:#fff;z-index:1050;
    display:flex;flex-direction:column;
    transform:translateX(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);
    box-shadow:-8px 0 40px rgba(0,0,0,.18);
  }
  .cart-drawer--open{transform:translateX(0);}

  .cd-head{
    display:flex;justify-content:space-between;align-items:center;
    padding:20px 24px 18px;border-bottom:1px solid #E8EDF2;flex-shrink:0;
  }
  .cd-title{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:700;color:#0B1B2B;}
  .cd-bag-ic{font-size:20px;}
  .cd-count-badge{
    background:#C9A24B;color:#fff;font-size:11px;font-weight:800;
    padding:2px 8px;border-radius:100px;
  }
  .cd-close{
    background:none;border:none;font-size:18px;color:#6B7A8D;cursor:pointer;
    width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;
    transition:background .15s;
  }
  .cd-close:hover{background:#F0F3F6;color:#0B1B2B;}

  .cd-body{flex:1;overflow-y:auto;padding:16px 24px;display:flex;flex-direction:column;gap:16px;}
  .cd-body::-webkit-scrollbar{width:4px;}
  .cd-body::-webkit-scrollbar-thumb{background:#D0D8E0;border-radius:4px;}

  .cd-item{
    display:flex;gap:14px;align-items:flex-start;
    padding-bottom:16px;border-bottom:1px solid #F0F3F6;
    position:relative;
  }
  .cd-item:last-child{border-bottom:none;}
  .cd-item-img{width:72px;height:72px;border-radius:12px;overflow:hidden;flex-shrink:0;background:#EEF1F7;}
  .cd-item-img img{width:100%;height:100%;object-fit:cover;}
  .cd-item-img-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:28px;}
  .cd-item-info{flex:1;min-width:0;}
  .cd-item-name{
    font-size:13.5px;font-weight:600;color:#0B1B2B;text-decoration:none;
    display:block;line-height:1.4;margin-bottom:4px;
  }
  .cd-item-name:hover{color:#C9A24B;}
  .cd-item-meta{font-size:11.5px;color:#6B7A8D;margin-bottom:8px;}
  .cd-item-price-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
  .cd-item-price{font-size:13px;color:#6B7A8D;}
  .cd-qty-ctrl{
    display:flex;align-items:center;gap:0;
    border:1px solid #DDE3EA;border-radius:8px;overflow:hidden;
  }
  .cd-qty-ctrl button{
    background:#F5F7FA;border:none;width:28px;height:28px;
    font-size:15px;font-weight:700;color:#0B1B2B;cursor:pointer;line-height:1;
  }
  .cd-qty-ctrl button:hover{background:#E8EDF2;}
  .cd-qty-ctrl span{width:30px;text-align:center;font-size:13px;font-weight:700;color:#0B1B2B;}
  .cd-item-line-total{font-size:14px;font-weight:700;color:#0B1B2B;margin-left:auto;}
  .cd-remove{
    position:absolute;top:0;right:0;background:none;border:none;
    font-size:13px;color:#B0BAC4;cursor:pointer;padding:2px 4px;
    transition:color .15s;
  }
  .cd-remove:hover{color:#E74C3C;}

  .cd-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;padding:40px 0;text-align:center;gap:12px;}
  .cd-empty-ic{font-size:52px;opacity:.3;}
  .cd-empty p{font-size:15px;color:#6B7A8D;margin:0;}
  .btn-teal-sm{background:#0B9E8E;color:#fff;border-radius:10px;font-weight:700;font-size:13px;padding:10px 22px;border:none;text-decoration:none;}
  .btn-teal-sm:hover{background:#098A7C;color:#fff;}

  .cd-foot{padding:16px 24px 24px;border-top:1px solid #E8EDF2;flex-shrink:0;background:#fff;}
  .cd-subtotal-row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px;}
  .cd-subtotal-label{font-size:13px;color:#6B7A8D;}
  .cd-subtotal-val{font-size:22px;font-weight:800;color:#0B1B2B;font-family:'IBM Plex Mono',monospace;}
  .cd-trust{display:flex;justify-content:space-between;font-size:11px;color:#6B7A8D;margin-bottom:16px;}
  .cd-btn-checkout{
    display:flex;justify-content:center;align-items:center;gap:8px;
    background:#C9A24B;color:#0B1B2B;border:none;border-radius:14px;
    font-weight:800;font-size:15px;padding:16px 0;text-decoration:none;
    transition:background .15s;
  }
  .cd-btn-checkout:hover{background:#b8913f;color:#0B1B2B;}
  .cd-btn-arrow{font-size:18px;}
  .cd-continue{
    display:block;width:100%;text-align:center;margin-top:12px;
    background:none;border:none;color:#6B7A8D;font-size:13px;cursor:pointer;
  }
  .cd-continue:hover{color:#0B1B2B;}

  .nav-cart-btn{background:none;border:none;padding:0;cursor:pointer;font-size:inherit;color:inherit;}

  /* ===== FLOATING CONTACT BUTTONS ===== */
  .floating-contact-buttons{position:fixed;bottom:24px;right:24px;z-index:998;display:flex;flex-direction:column;gap:12px;}
  .fcb-btn{
    width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;
    font-size:24px;text-decoration:none;box-shadow:0 8px 24px rgba(0,0,0,.22);transition:transform .15s;
  }
  .fcb-btn:hover{transform:scale(1.08);}
  .fcb-call{background:var(--ink);color:#fff;}
  .fcb-whatsapp{background:#25D366;color:#fff;}
  .fcb-btn svg{width:26px;height:26px;flex-shrink:0;display:block;}
  @media (max-width:576px){
    .floating-contact-buttons{bottom:16px;right:16px;}
    .fcb-btn{width:48px;height:48px;font-size:20px;}
  }

  /* ===== ACCOUNT SHELL =====
     Previously copy-pasted separately in my-account.blade.php,
     orders.blade.php, and order-detail.blade.php (formatting differed,
     content was identical) — consolidated here as the one definition.
     This is also what makes wishlist.blade.php's account-shell markup
     actually render correctly; that page had the HTML but no matching
     CSS until now. */
  .account-shell{background:var(--sand);padding:36px 0 80px;min-height:80vh;}

  .acc-layout{display:flex;gap:24px;align-items:flex-start;}
  .acc-sidebar-col{
    flex:0 0 300px;max-width:300px;
    transition:flex-basis .25s ease, max-width .25s ease;
  }
  .acc-sidebar-col.collapsed{flex:0 0 84px;max-width:84px;}
  .acc-main-col{flex:1 1 auto;min-width:0;}

  .acc-sidebar-col.collapsed .acc-sidebar{padding:20px 10px;}
  .acc-sidebar-col.collapsed .nav-text,
  .acc-sidebar-col.collapsed .acc-profile-text,
  .acc-sidebar-col.collapsed .acc-group-label{display:none;}
  .acc-sidebar-col.collapsed .acc-profile{justify-content:center;}
  .acc-sidebar-col.collapsed .acc-nav a{justify-content:center;padding:12px 0;}
  .acc-sidebar-col.collapsed .acc-nav .ic{width:auto;font-size:19px;}

  @media (max-width:800px){
    .acc-layout{flex-direction:column;}
    .acc-sidebar-col, .acc-sidebar-col.collapsed{flex:0 0 auto;max-width:100%;width:100%;}
  }

  .acc-sidebar{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:26px;}
  .acc-profile{display:flex;align-items:center;gap:14px;margin-bottom:20px;}
  .acc-avatar{
    width:52px;height:52px;border-radius:50%;background:var(--ink);color:#fff;flex-shrink:0;
    display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;font-family:'Sora',sans-serif;
  }
  .acc-name{font-weight:700;font-size:15px;color:var(--ink);}
  .acc-status{
    display:inline-block;background:var(--mint);color:var(--teal-deep);font-size:11px;font-weight:700;
    padding:3px 10px;border-radius:100px;margin-top:4px;
  }
  .acc-divider{border-top:1px solid var(--line);margin:18px 0;}
  .acc-nav{list-style:none;padding:0;margin:0;}
  .acc-nav li{margin-bottom:4px;}
  .acc-nav a{
    display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:10px;
    font-size:14px;font-weight:600;color:var(--slate);transition:background .15s, color .15s;
  }
  .acc-nav a .ic{font-size:16px;width:20px;text-align:center;}
  .acc-nav a:hover{background:var(--sand);color:var(--ink);}
  .acc-nav a.active{background:var(--ink);color:#fff;}
  .acc-nav .acc-group-label{
    font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--slate);
    padding:8px 14px 6px;display:block;
  }
  .acc-nav a.logout{color:var(--coral);}
  .acc-nav a.logout:hover{background:var(--coral-soft, #FCE7DF);color:var(--coral);}

  /* ===== DASHBOARD PANEL ===== */
  .dash-stat-card{
    display:flex;align-items:center;gap:16px;
    background:var(--paper);border:1px solid var(--line);border-radius:16px;
    padding:20px 22px;height:100%;
    transition:transform .18s,box-shadow .18s;
  }
  .dash-stat-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);}
  .dash-stat-card--accent{background:var(--ink);border-color:var(--ink);}
  .dash-stat-card--accent .dash-stat-num{color:#fff;}
  .dash-stat-card--accent .dash-stat-label{color:rgba(255,255,255,.65);}
  .dash-stat-icon{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0;}
  .dash-stat-num{font-family:'Sora',sans-serif;font-size:28px;font-weight:800;color:var(--ink);line-height:1;}
  .dash-stat-label{font-size:12px;color:var(--slate);font-weight:600;margin-top:4px;}

  .dash-quick-actions{display:flex;gap:10px;flex-wrap:wrap;}
  .dash-qa-btn{
    display:inline-flex;align-items:center;gap:8px;
    background:var(--paper);border:1px solid var(--line);border-radius:100px;
    padding:10px 18px;font-size:13px;font-weight:700;color:var(--ink);
    transition:background .15s,border-color .15s,color .15s;
    text-decoration:none;
  }
  .dash-qa-btn:hover{background:var(--ink);color:#fff;border-color:var(--ink);}
  .dash-qa-ic{font-size:15px;}

  .dash-card{
    background:var(--paper);border:1px solid var(--line);border-radius:16px;
    padding:22px;height:100%;
  }
  .dash-card-head{margin-bottom:16px;}
  .dash-card-title{font-family:'Sora',sans-serif;font-size:15px;font-weight:700;color:var(--ink);}

  .dash-activity-item{display:flex;align-items:flex-start;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);}
  .dash-activity-item:last-child{border-bottom:none;padding-bottom:0;}
  .dash-activity-dot{width:10px;height:10px;border-radius:50%;background:var(--teal);flex-shrink:0;margin-top:5px;}
  .dash-activity-dot--muted{background:var(--line);}
  .dash-activity-text{font-size:13.5px;color:var(--ink);line-height:1.5;}
  .dash-activity-time{font-size:11.5px;color:var(--slate);margin-top:3px;}

  .dash-notif-item{
    display:flex;align-items:flex-start;gap:12px;
    padding:12px 14px;border-radius:12px;margin-bottom:8px;
    background:var(--sand);border:1px solid var(--line);
  }
  .dash-notif-item:last-child{margin-bottom:0;}
  .dash-notif-item--teal{background:var(--mint);border-color:rgba(27,94,86,.18);}
  .dash-notif-item--amber{background:#FFF8EE;border-color:rgba(185,121,63,.2);}
  .dash-notif-ic{font-size:18px;flex-shrink:0;margin-top:1px;}
  .dash-notif-title{font-size:13px;font-weight:700;color:var(--ink);}
  .dash-notif-sub{font-size:12px;color:var(--slate);margin-top:2px;line-height:1.5;}

  .acc-panel{display:none;}
  .acc-panel.active{display:block;}

  .acc-titlebar{background:var(--ink);color:#fff;border-radius:16px;padding:16px 26px;margin-bottom:24px;display:flex;align-items:center;gap:16px;}
  .acc-titlebar h2{font-size:20px;margin:0;}
  .sidebar-toggle-btn{
    width:38px;height:38px;border-radius:10px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);
    font-size:16px;color:#fff;flex-shrink:0;cursor:pointer;transition:background .15s;
  }
  .sidebar-toggle-btn:hover{background:rgba(255,255,255,.18);}

  /* ===== ORDER PROGRESS TIMELINE =====
     Shared by track-order.blade.php and order-detail.blade.php —
     was byte-for-byte duplicated in both, consolidated here. */
  .od-track{border:1px solid var(--line);border-radius:16px;padding:28px 24px;background:var(--paper);margin-bottom:24px;}
  .od-track h5{font-size:15px;margin-bottom:24px;}
  .od-steps{display:flex;justify-content:space-between;position:relative;}
  .od-steps::before{content:"";position:absolute;top:14px;left:6%;right:6%;height:3px;background:var(--line);z-index:0;}
  .od-step{flex:1;text-align:center;position:relative;z-index:1;}
  .od-step .dot{width:30px;height:30px;border-radius:50%;background:var(--paper);border:3px solid var(--line);display:flex;align-items:center;justify-content:center;margin:0 auto 10px;font-size:13px;color:var(--slate);}
  .od-step.done .dot{background:var(--teal);border-color:var(--teal);color:#fff;}
  .od-step.current .dot{background:var(--ink);border-color:var(--ink);color:#fff;}
  .od-step .step-label{font-size:12px;font-weight:700;color:var(--ink);}
  .od-step .step-date{font-size:11px;color:var(--slate);margin-top:2px;}
  .track-form-card{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:36px;max-width:520px;margin:0 auto;}

  /* ===== ORDER STATUS BADGE =====
     Was byte-for-byte duplicated in order-detail.blade.php,
     orders.blade.php, and my-account.blade.php — consolidated here. */
  .order-status{font-size:11.5px;font-weight:700;padding:4px 12px;border-radius:100px;}
  .order-status.delivered{background:var(--mint);color:var(--teal-deep);}
  .order-status.transit{background:#FFF3E0;color:#B9793F;}
  .order-status.processing{background:#EAF0FA;color:#3A5589;}

  /* ===== ORDER DETAIL PAGE (page-specific) ===== */
  .od-summary{border:1px solid var(--line);border-radius:16px;padding:24px;background:var(--paper);margin-bottom:24px;}
  .od-summary .o-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:6px;}
  .od-id{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--slate);}
  .od-date{font-size:12.5px;color:var(--slate);}
  .od-item{display:flex;gap:16px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:18px;margin-bottom:14px;background:var(--paper);}
  .od-item img{width:74px;height:74px;border-radius:10px;object-fit:cover;flex-shrink:0;}
  .od-item .oi-name{font-weight:700;font-size:14.5px;color:var(--ink);}
  .od-item .oi-meta{font-size:12.5px;color:var(--slate);}
  .od-item .oi-price{font-family:'IBM Plex Mono',monospace;font-weight:700;font-size:15px;margin-left:auto;}
  .od-side-card{border:1px solid var(--line);border-radius:16px;padding:22px;background:var(--paper);margin-bottom:20px;}
  .od-side-card h6{font-size:13px;font-weight:700;color:var(--slate);text-transform:uppercase;letter-spacing:.04em;margin-bottom:14px;}
  .od-side-card p{font-size:13.5px;color:var(--ink);line-height:1.6;margin:0;}
  .od-summary-row{display:flex;justify-content:space-between;font-size:13.5px;color:var(--slate);padding:6px 0;}
  .od-summary-row.total{border-top:1px solid var(--line);margin-top:8px;padding-top:12px;font-weight:700;color:var(--ink);font-size:15px;}
  .od-actions{display:flex;flex-direction:column;gap:10px;}

  /* ===== ORDER CARD (shared by my-account's panel and the full orders page) =====
     Was declared separately in both files with one real difference:
     orders.blade.php's cards are whole-card-clickable (data-href + JS),
     my-account's aren't. Scoped the hover-lift to [data-href] so both
     pages keep their actual current behavior exactly, from one rule. */
  .order-card{border:1px solid var(--line);border-radius:14px;padding:20px;margin-bottom:14px;background:var(--paper);}
  .order-card[data-href]{cursor:pointer;transition:transform .15s, box-shadow .15s;}
  .order-card[data-href]:hover{transform:translateY(-3px);box-shadow:0 14px 28px rgba(16,36,31,.08);border-color:var(--teal);}
  .order-card .o-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:10px;}
  .order-id{font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--slate);}
  .order-body{display:flex;gap:16px;align-items:center;flex-wrap:wrap;}
  .order-body img{width:64px;height:64px;border-radius:10px;object-fit:cover;}
  .order-name{font-weight:700;font-size:14px;color:var(--ink);}
  .order-meta{font-size:12.5px;color:var(--slate);}
  .order-price{font-family:'IBM Plex Mono',monospace;font-weight:700;font-size:15px;color:var(--ink);margin-left:auto;}
  .card-link-row{display:flex;gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line);}
  .btn-sm-pill{font-size:12.5px;padding:8px 18px;border-radius:100px;}

  /* ===== REFUND CARD + EMPTY STATE (my-account panels) ===== */
  .refund-card{border:1px solid var(--line);border-radius:14px;padding:20px;margin-bottom:14px;background:var(--paper);}
  .refund-status{font-size:11.5px;font-weight:700;padding:4px 12px;border-radius:100px;}
  .refund-status.pending{background:#FFF3E0;color:#B9793F;}
  .refund-status.approved{background:var(--mint);color:var(--teal-deep);}
  .refund-status.rejected{background:#FCE7DF;color:var(--coral);}
  .empty-state{text-align:center;padding:60px 20px;color:var(--slate);}
  .empty-state .es-ic{font-size:40px;display:block;margin-bottom:14px;}

  /* ===== ABOUT US PAGE ===== */
  .about-hero{background:var(--ink);color:#fff;padding:70px 0;position:relative;overflow:hidden;}
  .about-hero .kicker{color:#F0D9A3;}
  .about-hero h1{font-size:clamp(30px,4.2vw,46px);margin-bottom:14px;max-width:680px;}
  .about-hero p{color:rgba(255,255,255,.7);font-size:16px;max-width:560px;}
  .about-stats{display:flex;gap:44px;flex-wrap:wrap;margin-top:36px;border-top:1px solid rgba(255,255,255,.18);padding-top:28px;}
  .a-stat{display:flex;flex-direction:column;gap:4px;}
  .a-num{font-family:'Sora',sans-serif;font-size:26px;font-weight:800;color:#F0D9A3;}
  .a-label{font-size:12.5px;color:rgba(255,255,255,.65);}
  .value-card{border:1px solid var(--line);border-radius:18px;padding:28px;height:100%;background:var(--paper);}
  .value-card .v-ic{font-size:26px;display:block;margin-bottom:14px;}
  .value-card h4{font-size:16px;margin-bottom:8px;}
  .value-card p{font-size:13.5px;color:var(--slate);line-height:1.6;margin:0;}
  .team-quote{background:var(--sand);border-radius:20px;padding:44px;text-align:center;max-width:720px;margin:0 auto;}
  .team-quote p{font-family:'Sora',sans-serif;font-size:clamp(19px,2.2vw,24px);font-weight:600;color:var(--ink);line-height:1.5;margin-bottom:16px;}
  .team-quote span{font-size:13.5px;color:var(--slate);}

  /* ===== GUIDE PAGE ===== */
  .guide-hero{background:var(--ink);color:#fff;padding:64px 0;}
  .guide-hero .kicker{color:#F0D9A3;}
  .guide-hero h1{font-size:clamp(30px,4vw,44px);margin-bottom:12px;}
  .guide-hero p{color:rgba(255,255,255,.7);font-size:15.5px;max-width:560px;}
  .guide-deep-row{display:flex;gap:20px;padding:26px 0;border-bottom:1px solid var(--line);}
  .guide-deep-row:last-child{border-bottom:none;}
  .guide-deep-num{font-family:'Sora',sans-serif;font-size:26px;font-weight:800;color:var(--line);flex-shrink:0;width:50px;}
  .guide-deep-row h4{font-size:17px;margin-bottom:8px;}
  .guide-deep-row p{font-size:14px;color:var(--slate);line-height:1.65;margin:0;}
  .size-table{width:100%;font-size:14px;}
  .size-table th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--slate);padding:10px 8px;border-bottom:1px solid var(--line);}
  .size-table td{padding:12px 8px;border-bottom:1px solid var(--line);}
  .size-table td:first-child{font-weight:700;color:var(--ink);}

  /* ===== MATTRESS LISTING PAGE ===== */
  .mattresses-hero{background:var(--ink);color:#fff;padding:56px 0;}
  .mattresses-hero .kicker{color:#F0D9A3;}
  .mattresses-hero h1{font-size:clamp(28px,3.6vw,40px);margin-bottom:8px;}
  .mattresses-hero p{color:rgba(255,255,255,.7);font-size:15px;max-width:520px;margin:0;}

  /* ===== CONTACT US PAGE ===== */
  .contact-hero{background:var(--ink);color:#fff;padding:64px 0;}
  .contact-hero .kicker{color:var(--gold-soft);}
  .contact-hero h1{font-size:clamp(30px,4vw,44px);margin-bottom:12px;}
  .contact-hero p{color:rgba(255,255,255,.7);font-size:15.5px;max-width:520px;}
  .info-tile{
    background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:26px;height:100%;
    text-align:left;transition:transform .2s, box-shadow .2s;
  }
  .info-tile:hover{transform:translateY(-4px);box-shadow:0 20px 36px rgba(16,36,31,.1);}
  .info-tile .it-ic{
    width:46px;height:46px;border-radius:12px;background:var(--frost);display:flex;align-items:center;justify-content:center;
    font-size:20px;margin-bottom:16px;
  }
  .info-tile h5{font-size:15.5px;margin-bottom:6px;}
  .info-tile p{font-size:13.5px;color:var(--slate);margin-bottom:4px;}
  .info-tile a{color:var(--navy);font-weight:700;font-size:13.5px;}
  .info-tile a:hover{color:var(--teal);}
  .contact-card{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:36px;}
  .contact-card h3{font-size:22px;margin-bottom:8px;}
  .contact-card .sub{color:var(--slate);font-size:14px;margin-bottom:28px;}
  .form-label-contact{font-size:12.5px;font-weight:700;color:var(--slate);margin-bottom:6px;}
  .form-control-contact{border:1px solid var(--line);border-radius:10px;padding:12px 14px;font-size:14px;}
  .form-control-contact:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(27,94,86,.12);}
  .map-panel{
    border-radius:20px;overflow:hidden;min-height:300px;position:relative;
    background:linear-gradient(150deg,var(--teal-deep),var(--teal) 65%,#3E8579);
    display:flex;align-items:flex-end;color:#fff;padding:26px;
  }
  .map-panel::before{
    content:"";position:absolute;inset:0;
    background-image:radial-gradient(1.5px 1.5px at 20% 30%, rgba(255,255,255,.4) 0, transparent 50%),
      radial-gradient(1.5px 1.5px at 70% 20%, rgba(255,255,255,.3) 0, transparent 50%),
      radial-gradient(1.5px 1.5px at 85% 65%, rgba(255,255,255,.3) 0, transparent 50%);
  }
  .map-panel .mp-content{position:relative;z-index:2;}
  .map-panel h5{font-size:16px;margin-bottom:6px;}
  .map-panel p{font-size:13px;color:rgba(255,255,255,.75);margin:0;}
  .hours-row{display:flex;justify-content:space-between;font-size:13.5px;padding:10px 0;border-bottom:1px solid var(--line);}
  .hours-row:last-child{border-bottom:none;}
  .hours-row span:first-child{color:var(--slate);}
  .hours-row span:last-child{font-weight:700;color:var(--navy);}
  .quick-faq{border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
  .quick-faq:hover{border-color:var(--teal);}
  .quick-faq span{font-size:13.5px;font-weight:600;color:var(--navy);}
  .quick-faq .arrow{color:var(--slate);}

  /* ===== CHECKOUT PAGE =====
     .checkout-page scopes the frost background to just this page's
     content wrapper — the original rule was a blanket body{} selector
     inside checkout's own inline <style>, which only worked by
     accident of being scoped to one page's render; moving it here
     verbatim would have overridden the site-wide gradient background
     on every page. This achieves the same visual result without that risk. */
  .checkout-page{background:var(--frost);}
  .checkout-title{font-size:clamp(26px,3.2vw,36px);margin-bottom:6px;font-family:'Sora',sans-serif;font-weight:700;}
  .checkout-sub{color:var(--slate);font-size:14.5px;margin-bottom:32px;}
  .checkout-card{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:28px;margin-bottom:24px;}
  .checkout-card h5{font-size:15px;margin-bottom:18px;display:flex;align-items:center;gap:10px;font-family:'Sora',sans-serif;font-weight:700;}
  .form-control-check{border:1px solid var(--line);border-radius:10px;padding:12px 14px;font-size:14px;}
  .form-control-check:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(27,94,86,.12);}
  /* form-label-check / form-control-check: also used on my-account,
     order-detail, and track-order pages, which previously had no
     matching CSS anywhere — those were rendering unstyled. */
  .form-label-check{font-size:12.5px;font-weight:700;color:var(--slate);margin-bottom:6px;}

  /* Address cards */
  .addr-card{display:flex;gap:14px;align-items:flex-start;border:1.5px solid var(--line);
    border-radius:14px;padding:16px 18px;margin-bottom:12px;cursor:pointer;
    transition:border-color .15s,background .15s;background:var(--paper);}
  .addr-card:hover{border-color:var(--teal);}
  .addr-card input[type="radio"]{margin-top:4px;accent-color:var(--teal);width:17px;height:17px;flex-shrink:0;cursor:pointer;}
  .addr-card.selected{border-color:var(--teal);background:var(--mint);}
  .addr-card-body{flex:1;}
  .addr-top{display:flex;align-items:center;gap:8px;margin-bottom:6px;flex-wrap:wrap;}
  .addr-name{font-weight:700;font-size:14.5px;color:var(--ink);}
  .addr-badge{background:var(--teal);color:#fff;font-size:10px;font-weight:700;
    padding:2px 9px;border-radius:100px;text-transform:uppercase;letter-spacing:.03em;}
  .addr-tag{background:var(--sand);color:var(--slate);font-size:11px;font-weight:600;padding:3px 10px;border-radius:100px;}
  .addr-text{font-size:13.5px;color:var(--slate);margin-bottom:4px;line-height:1.5;}
  .addr-phone{font-size:12.5px;color:var(--slate);margin-bottom:6px;}
  .addr-edit{font-size:12.5px;font-weight:700;color:var(--coral);}
  .addr-card-new{border-style:dashed;align-items:center;background:var(--paper);font-family:inherit;border:1.5px dashed var(--line);}
  .addr-new-body{display:flex;align-items:center;gap:10px;color:var(--teal);font-weight:700;font-size:14px;}
  .addr-new-ic{width:26px;height:26px;border-radius:50%;background:var(--mint);color:var(--teal);
    display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0;}
  .addr-modal-content{border-radius:18px;border:none;}
  .addr-radio-inline{display:flex;align-items:center;gap:6px;font-size:13.5px;font-weight:600;color:var(--ink);cursor:pointer;margin:0;}
  .addr-radio-inline input{accent-color:var(--teal);margin:0;width:16px;height:16px;cursor:pointer;}
  .addr-radio-row{display:flex;gap:16px;align-items:center;height:44px;}
  .addr-default-label{font-size:13.5px;color:var(--ink);font-weight:600;}

  /* Order summary (checkout) */
  .order-item{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--line);}
  .order-item:last-child{border-bottom:none;}
  .order-item img{width:66px;height:66px;border-radius:10px;object-fit:cover;flex-shrink:0;}
  .order-item h6{font-size:13.5px;margin-bottom:4px;}
  .order-item .oi-meta{font-size:12px;color:var(--slate);}
  .order-item .oi-price{font-family:'IBM Plex Mono',monospace;font-weight:700;font-size:14px;white-space:nowrap;}
  .summary-row{display:flex;justify-content:space-between;font-size:13.5px;color:var(--slate);padding:8px 0;}
  .summary-row.total{border-top:1px solid var(--line);margin-top:8px;padding-top:14px;
    font-size:16px;font-weight:700;color:var(--navy);}
  .summary-row.total .mono{font-size:20px;}
  .promo-field{display:flex;gap:8px;margin:16px 0;}
  .promo-field input{flex:1;border:1px solid var(--line);border-radius:10px;padding:10px 14px;font-size:13px;}
  .checkout-trust{display:flex;justify-content:space-between;margin-top:20px;
    padding-top:18px;border-top:1px solid var(--line);}
  .checkout-trust .ct-item{text-align:center;font-size:11px;color:var(--slate);flex:1;}
  .checkout-trust .ct-ic{font-size:18px;display:block;margin-bottom:5px;}
  #cartEmpty{display:none;}

  /* ===== MATTRESS LISTING — FILTER PANEL & SORT MENU =====
     Moved out of the mattress-page Livewire component's inline
     <style>. Four rules here use generic Bootstrap class names
     (form-check, form-check-input, form-check-label, form-range) —
     those are scoped to .filters-panel and .sort-menu specifically
     (the two places this component actually uses them) rather than
     left global, since checkout.blade.php and order-detail.blade.php
     both also use plain .form-check markup for unrelated things
     (address selection, refund checkboxes) and would otherwise get
     silently restyled by a global override that was never meant for them. */
  .collection-shell{background:rgba(255,255,255,0.4);border:1px solid rgba(16,36,31,0.06);border-radius:28px;padding:18px;box-shadow:0 16px 38px rgba(16,36,31,0.04);}
  .filters-panel{background:rgba(255,255,255,0.94);border:1px solid rgba(16,36,31,0.08);border-radius:22px;padding:22px 20px;box-shadow:0 16px 26px rgba(16,36,31,0.04);position:sticky;top:20px;}
  .panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;}
  .panel-head h5{margin:0;font-size:1.05rem;font-weight:800;letter-spacing:-0.02em;}
  .reset{color:var(--teal);font-size:12px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;cursor:pointer;transition:opacity 0.2s ease;}
  .reset:hover{opacity:0.8;}
  .filters-divider{height:1px;background:rgba(16,36,31,0.08);margin:18px 0;}
  .filter-title{margin:0 0 12px;font-size:12.5px;font-weight:800;letter-spacing:0.08em;text-transform:uppercase;color:var(--slate);}
  .price-chip{font-size:12px;font-weight:700;color:var(--ink);background:rgba(27,94,86,0.06);border-radius:999px;padding:6px 10px;}
  .filters-panel .form-range{accent-color:var(--teal);}
  .filters-panel .form-check,
  .sort-menu .form-check{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
  .filters-panel .form-check-input,
  .sort-menu .form-check-input{width:16px;height:16px;border-radius:6px;border:1.5px solid rgba(16,36,31,0.22);background-color:#fff;margin-top:0;cursor:pointer;-webkit-appearance:none;appearance:none;flex-shrink:0;}
  .filters-panel .form-check-input:checked,
  .sort-menu .form-check-input:checked{background-color:var(--teal);border-color:var(--teal);background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 5-6'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:center;background-size:12px;}
  .filters-panel .form-check-label,
  .sort-menu .form-check-label{color:var(--ink);font-size:14px;cursor:pointer;}
  .collection-results{background:transparent;}
  .results-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px;padding:0 4px;}
  .count-pill{display:inline-flex;align-items:center;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,0.7);border:1px solid rgba(16,36,31,0.08);color:var(--slate);font-size:12.5px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;}
  .sort-btn{border:1px solid rgba(16,36,31,0.08);background:rgba(255,255,255,0.9);color:var(--ink);border-radius:999px;padding:10px 16px;font-size:13px;font-weight:700;box-shadow:0 10px 18px rgba(16,36,31,0.05);}
  .sort-btn::after{margin-left:10px;}
  .sort-menu{border-radius:18px;border:1px solid rgba(16,36,31,0.08);box-shadow:0 20px 40px rgba(16,36,31,0.12);padding:16px;max-width:220px;}
  @media (max-width:991px){
    .filters-panel{position:static;margin-bottom:20px;}
    .results-toolbar{flex-direction:column;align-items:flex-start;}
  }

  /* ===== BLOG PAGES ===== */
  .blog-hero{padding:48px 0 8px;}
  .blog-post-hero{padding:40px 0 0;}
  .blog-post-visual{border-radius:var(--radius-lg);overflow:hidden;height:280px;margin-bottom:28px;}
  .blog-post-visual img{width:100%;height:100%;object-fit:cover;}
  .blog-post-body{max-width:760px;margin:0 auto;font-size:15.5px;line-height:1.8;color:var(--ink);}
  .blog-post-body h2,.blog-post-body h3{font-family:'Sora',sans-serif;font-weight:700;color:var(--navy);margin-top:28px;}
  .blog-post-body p{margin-bottom:16px;}
  .blog-post-cat{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--coral);}
  .related-post-card{display:block;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-md);padding:16px;text-decoration:none;color:inherit;height:100%;}
  .related-post-card:hover{border-color:var(--teal);}
  .related-post-card h6{font-size:14px;font-weight:700;margin:6px 0 0;}

  /* ===== SIZE GUIDE LINK + FIRMNESS SCALE ===== */
  .size-guide-link{display:inline-block;font-size:12px;font-weight:600;color:var(--teal);text-decoration:underline;margin:2px 0 10px;}
  .size-guide-link:hover{color:var(--teal-deep);}
  .firmness-scale{display:flex;gap:6px;margin:6px 0 4px;}
  .fs-dot{flex:1;height:8px;border-radius:4px;background:var(--line);}
  .fs-dot.active{background:var(--mint);}
  .fs-dot.current{background:var(--teal);}
  .firmness-labels{display:flex;justify-content:space-between;font-size:10.5px;color:var(--slate);margin-bottom:8px;}

  /* ===== LOGIN MODAL ===== */
  .login-modal{border-radius:24px;border:none;overflow:hidden;position:relative;}
  .login-art{
    min-height:260px;position:relative;overflow:hidden;
    background:linear-gradient(160deg,var(--teal-deep),var(--teal) 70%,#3E8579);
    display:flex;align-items:center;
  }
  .login-art-inner{padding:40px 32px;color:#fff;position:relative;z-index:1;}
  .login-art .login-moon{font-size:38px;display:block;margin-bottom:14px;filter:drop-shadow(0 4px 10px rgba(0,0,0,.25));}
  .login-art h4{font-family:'Sora',sans-serif;font-size:24px;font-weight:800;color:#fff;line-height:1.25;margin-bottom:12px;}
  .login-art p{font-size:13.5px;color:rgba(255,255,255,.85);line-height:1.6;margin:0;}
  .login-art::before{
    content:"";position:absolute;top:-40px;right:-40px;width:160px;height:160px;border-radius:50%;
    background:rgba(255,255,255,.06);
  }
  .login-art::after{
    content:"";position:absolute;bottom:-60px;left:-30px;width:180px;height:180px;border-radius:50%;
    background:rgba(255,255,255,.05);
  }
  .login-title{font-family:'Sora',sans-serif;font-weight:800;color:var(--ink);font-size:21px;margin-bottom:4px;}
  .login-sub{font-size:13px;color:var(--slate);margin-bottom:22px;}
  .form-label-login{font-size:12.5px;font-weight:700;color:var(--ink);margin-bottom:6px;display:block;}
  .input-group-login .input-group-text{background:var(--sand);border:1px solid var(--line);color:var(--slate);font-weight:600;}
  .input-group-login .form-control, #loginModal .form-control{
    border:1px solid var(--line);border-radius:10px;padding:11px 14px;font-size:14.5px;
  }
  .input-group-login .form-control{border-radius:0 10px 10px 0;}
  .input-group-login .input-group-text{border-radius:10px 0 0 10px;}
  #loginModal .form-control:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(27,94,86,.12);}
  #loginModal .input-otp{letter-spacing:.3em;font-weight:700;text-align:center;font-size:18px;}
  #loginModal .form-text{font-size:12px;color:var(--slate);margin-top:6px;}
  #loginModal #otpChangeNumber{color:var(--teal);font-weight:600;}
  #loginModal .btn-link{color:var(--slate);font-size:12.5px;text-decoration:none;}
  #loginModal .btn-link:hover{color:var(--teal);}
  @media (max-width:767px){
    .login-art{min-height:140px;}
    .login-art-inner{padding:24px;}
    .login-art h4{font-size:19px;}
  }

  .input-line{border:none;border-bottom:1.5px solid var(--line);border-radius:0;background:transparent;padding:12px 2px;font-size:15px;}
  .input-line:focus{box-shadow:none;border-color:var(--teal);}

  /* ===== HELP-PICKING BANNER ===== */

  /* ===== BUYING GUIDE ===== */

  /* ===== FAQ ===== */
  .faq-accordion .accordion-item{border:1px solid var(--line);border-radius:14px!important;margin-bottom:14px;overflow:hidden;}
  .faq-accordion .accordion-button{font-family:'Sora',sans-serif;font-weight:700;font-size:15px;background:var(--paper);color:var(--ink);padding:18px 22px;}
  .faq-accordion .accordion-button:not(.collapsed){color:var(--teal-deep);background:var(--mint);}
  .faq-accordion .accordion-button:focus{box-shadow:none;border-color:var(--line);}
  .faq-accordion .accordion-body{font-size:14px;color:var(--slate);line-height:1.6;padding:4px 22px 20px;}


  /* ===== HELP BANNER ===== */

  /* footer v2 */
  .foot-input{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:#fff;font-size:13px;padding:10px 14px;border-radius:8px;}
  .foot-input::placeholder{color:rgba(255,255,255,.5);}
  .foot-input:focus{background:rgba(255,255,255,.12);border-color:var(--coral);color:#fff;box-shadow:none;}

  @media (max-width:767px){
    .slide-content{padding:0 24px;max-width:100%;}
    .brand-logo-img{height:50px;}
  }

  /* ===== GLOBAL MOBILE OVERFLOW FIX ===== */
  html { overflow-x:hidden; }
  body { max-width:100%; overflow-x:clip; }

  @media (max-width:991px){
    /* Prevent any element from breaking out of viewport */
    .container { padding-left:16px; padding-right:16px; }
    .row { margin-left:0; margin-right:0; }
    .row > * { padding-left:8px; padding-right:8px; }

    /* Collection shell — the negative margins from row g-4 inside cause overflow */
    .collection-shell { padding:12px; margin:0; }
    .collection-shell > .row,
    .collection-shell.row { margin-left:0 !important; margin-right:0 !important; }

    /* Hero slider */
    .carousel-item .slide-inner { min-height:320px; }
    .slide-content { padding:0 20px; max-width:100%; }
    .slide-content h2 { font-size:clamp(22px,6vw,32px); }
    .slide-content p { font-size:14px; }
    .carousel-control-prev, .carousel-control-next { display:none; }

    /* Premium showcase */
    .premium-showcase { min-height:320px; }
    .premium-showcase-content { padding:40px 0; }
    .premium-showcase-content h2 { font-size:clamp(22px,5vw,32px); }
    .premium-stats { gap:24px; }
    .p-num { font-size:22px; }

    /* Category cards */
    .cat-card { height:180px; }

    /* Product cards */
    .card-visual { height:200px; }
    .card-actions-row { flex-direction:row; gap:8px; }
    .btn-add, .btn-buy { padding:10px 0; font-size:12px; }

    /* Order progress timeline */
    .od-steps { flex-wrap:nowrap; overflow-x:auto; gap:0; padding-bottom:8px; }
    .od-steps::before { display:none; }
    .od-step { min-width:70px; flex-shrink:0; }
    .od-step .step-label { font-size:10px; }
    .od-step .step-date { font-size:10px; }

    /* Order items */
    .od-item { flex-wrap:wrap; gap:10px; }
    .od-item img { width:56px; height:56px; }
    .od-item .oi-price { margin-left:0; }

    /* Checkout */
    .checkout-card { padding:18px; }
    .addr-card { padding:12px 14px; }
    .order-item img { width:54px; height:54px; }
    .promo-field { flex-direction:column; }
    .promo-field input { width:100%; }
    .checkout-trust { flex-wrap:wrap; gap:8px; }
    .ct-item { flex:0 0 30%; }

    /* Account layout */
    .acc-layout { flex-direction:column; }
    .acc-sidebar-col, .acc-sidebar-col.collapsed { flex:0 0 auto; max-width:100%; width:100%; }
    .acc-titlebar { padding:12px 16px; }
    .acc-titlebar h2 { font-size:17px; }

    /* CTA band */
    .cta-band { padding:30px 24px; text-align:center; }
    .cta-band h3 { font-size:20px; }

    /* Help banner */
    .help-banner .container { flex-direction:column; align-items:flex-start; }
    .help-banner h3 { font-size:20px; }

    /* Help pick card */
    .help-pick-card { padding:20px 16px; }
    .help-pick-card .col-6 { width:100%; }
    .help-pick-img { max-width:200px; height:160px; }

    /* Newsletter */
    .newsletter-art { min-height:220px; }

    /* Blog cards */
    .blog-visual { height:180px; }

    /* Footer */
    footer { padding:40px 0 20px; }
    .foot-bottom { flex-direction:column; text-align:center; gap:8px; }

    /* Floating buttons */
    .floating-contact-buttons { bottom:16px; right:16px; }
    .fcb-btn { width:46px; height:46px; }

    /* Cart drawer */
    .cart-drawer { width:100%; max-width:100%; }

    /* Mega menu mobile */
    .mobile-cat-list { margin:0 0 8px; }

    /* Swiper overflow fix */
    .swiper { overflow:hidden; }
    .prod-swiper, .cat-swiper { overflow:hidden; }

    /* Table overflow */
    .spec-table { display:block; overflow-x:auto; }
    .size-table { display:block; overflow-x:auto; }

    /* Guide page */
    .guide-deep-row { flex-direction:column; gap:10px; }
    .guide-deep-num { width:auto; }

    /* About page */
    .about-stats { gap:20px; }
    .team-quote { padding:28px 20px; }

    /* Contact page */
    .contact-card { padding:22px 18px; }
    .map-panel { min-height:200px; }

    /* Track order */
    .track-form-card { padding:24px 18px; }

    /* Breadcrumb */
    .breadcrumb-bar .crumb { font-size:12px; white-space:nowrap; overflow-x:auto; display:block; }

    /* Toast */
    .sr-toast { left:16px; right:16px; bottom:16px; max-width:100%; }

    /* Modals */
    .callback-art { min-height:160px; }
    .callback-form-panel { padding:22px 18px; }
    .login-art { min-height:120px; }
    .login-art-inner { padding:20px; }
  }

  @media (max-width:575px){
    /* Extra small screens */
    .section-pad { padding-top:36px; padding-bottom:36px; }
    .section-head h2 { font-size:clamp(22px,7vw,30px); }
    .hero-slider .slide-inner { min-height:280px; }
    .slide-content h2 { font-size:clamp(20px,7vw,28px); }
    .trust-item { font-size:12px; }
    .trust-item .ic { width:24px; height:24px; font-size:12px; }
    .premium-stats { flex-direction:column; gap:16px; }
    .badge-row { flex-wrap:wrap; gap:8px; }
    .badge-row .b-divider { display:none; }
    .feat-icons { gap:8px; }
    .feat-icons .f-item { min-width:90px; }
    .od-steps { gap:0; }
    .od-step { min-width:60px; }
    .od-step .dot { width:24px; height:24px; font-size:11px; }
    .price-now { font-size:24px; }
    .buy-box { padding:18px; }
    .size-card { min-width:60px; padding:10px 6px; }
    .acc-sidebar { padding:16px; }
    .acc-nav a { padding:9px 10px; font-size:13px; }
    .about-hero { padding:44px 0; }
    .about-hero h1 { font-size:clamp(24px,8vw,34px); }
    .guide-hero { padding:40px 0; }
    .mattresses-hero { padding:36px 0; }
    .contact-hero { padding:40px 0; }
    .contact-hero h1 { font-size:clamp(24px,8vw,34px); }
    .faq-accordion .accordion-button { font-size:14px; padding:14px 16px; }
    .faq-accordion .accordion-body { padding:4px 16px 16px; }
    .card-mattress { border-radius:12px; }
    .why-card { padding:20px 16px; }
    .guide-card { padding:18px 16px; }
    .blog-body { padding:16px 14px; }
    .blog-body h4 { font-size:16px; }
    .order-card { padding:14px; }
    .order-body img { width:52px; height:52px; }
    .checkout-title { font-size:clamp(20px,7vw,28px); }
    .summary-row.total .mono { font-size:17px; }
    .cd-head { padding:16px 18px 14px; }
    .cd-body { padding:12px 16px; }
    .cd-foot { padding:12px 16px 18px; }
    .cd-subtotal-val { font-size:18px; }
  }

  /* ===== BREADCRUMB BAR ===== */
  .breadcrumb-bar{background:var(--paper);border-bottom:1px solid var(--line);}
  .breadcrumb-bar .crumb{font-size:13px;color:var(--slate);}
  .breadcrumb-bar .crumb a{color:var(--slate);}
  .breadcrumb-bar .crumb a:hover{color:var(--navy);}
  .breadcrumb-bar .crumb .current{color:var(--navy);font-weight:600;}

  /* ===== TOAST ===== */
  .sr-toast{
    position:fixed;bottom:28px;right:28px;z-index:9999;
    background:var(--ink);color:#fff;font-size:13.5px;font-weight:600;
    padding:14px 22px;border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.22);
    opacity:0;transform:translateY(12px);transition:opacity .25s,transform .25s;
    pointer-events:none;max-width:320px;
  }
  .sr-toast.show{opacity:1;transform:translateY(0);}
  .sr-toast.success{border-left:4px solid #2ecc71;}
  .sr-toast.error{border-left:4px solid var(--coral);}

  /* ===== DESIGN TOKENS (extended) =====
     Spacing / radius / shadow scale used across newer page templates.
     Colors above are the single source of truth for the whole site —
     individual pages should never redeclare their own :root block. */
  :root{
    --space-1:4px;  --space-2:8px;  --space-3:16px; --space-4:24px;
    --space-5:32px; --space-6:48px; --space-7:64px;
    --radius-sm:8px; --radius-md:14px; --radius-lg:18px; --radius-pill:100px;
    --shadow-sm:0 2px 8px rgba(16,36,31,.06);
    --shadow-md:0 10px 24px rgba(16,36,31,.08);
    --shadow-lg:0 20px 48px rgba(16,36,31,.12);
  }

  /* ===== ACCESSIBILITY: visible focus states ===== */
  a:focus-visible, button:focus-visible, input:focus-visible,
  textarea:focus-visible, select:focus-visible, .btn:focus-visible{
    outline:2px solid var(--teal);
    outline-offset:2px;
  }

  /* ===== STOCK MESSAGES ===== */
  .stock-msg{font-size:12.5px;font-weight:700;padding:6px 0;}
  .stock-msg.out-of-stock{color:var(--coral);}
  .stock-msg.low-stock{color:#B9793F;}

  /* ===== VARIANT STOCK ALERT (product detail page) ===== */
  .variant-stock-alert{
    display:flex;align-items:center;gap:8px;
    padding:12px 16px;border-radius:10px;
    font-size:13.5px;font-weight:600;margin-bottom:16px;
  }
  .variant-stock-alert.out-of-stock{background:#FCE7DF;color:var(--coral);border:1px solid rgba(201,71,38,.2);}
  .variant-stock-alert.low-stock{background:#FFF3E0;color:#B9793F;border:1px solid rgba(185,121,63,.2);}
  .variant-stock-alert svg{flex-shrink:0;}

  /* ===== STARTING FROM LABEL (product cards) ===== */
  .starting-from{display:block;font-size:11px;font-weight:600;color:var(--slate);text-transform:uppercase;letter-spacing:.04em;margin-bottom:2px;}

  /* ===== BRANDED IMAGE PLACEHOLDER =====
     Use instead of loading random third-party stock photos when a
     product/post has no image yet — keeps missing-image states looking
     intentional and on-brand rather than like a broken/dev site. */

  /* ===== GENERIC CATEGORY / FILTER PILL ===== */
  .pill{
    display:inline-block; padding:6px 14px; border-radius:var(--radius-pill);
    font-size:12.5px; font-weight:600; border:1px solid var(--line); color:var(--ink);
  }
  .pill.active, .pill:hover{background:var(--teal); color:#fff; border-color:var(--teal);}
  /* ===== HOMEPAGE =====
     Moved out of home.blade.php's inline <style> block. Per explicit
     decision: home's design for shared product-card/button classes
     (card-mattress, price-row, rating, stars, btn-buy, btn-add,
     wishlist-ic, badge-float, img-placeholder, section-pad, etc.) is
     now the ONE standard — the older/plainer versions that used to
     live here (and were used by wishlist.blade.php, guide-us.blade.php,
     about-us.blade.php) have been removed so this is the only
     definition. This means product cards on those other pages will
     now visually match home's newer style — confirmed intentional. */
  .section-pad {
    padding-top:40px;
    padding-bottom: 40px;
  }

  .section-head {
    margin-bottom: 28px;
  }

  .section-head .kicker {
    display: inline-block;
    margin-bottom: 10px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--teal);
    font-weight: 800;
  }

  .section-head h2 {
    margin: 0;
    font-size: clamp(28px, 3vw, 42px);
    line-height: 1.08;
    letter-spacing: -0.04em;
  }

  .section-head p {
    margin: 0;
    color: var(--slate);
    font-size: 15px;
    line-height: 1.7;
  }

  .card-mattress {
    height: 100%;
    display: flex;
    flex-direction: column;
    background: rgba(255,255,255,0.9);
    border: 1px solid rgba(16,36,31,0.08);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 12px 32px rgba(16,36,31,0.06);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  }

  .card-mattress:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 40px rgba(16,36,31,0.12);
    border-color: rgba(27,94,86,0.18);
  }

  /* .card-visual {
    position: relative;
    height: 240px;
    padding: 16px;
    background: linear-gradient(135deg, rgba(31,82,74,0.08), rgba(139,104,67,0.08));
  } */

  .card-visual {
        height: 210px;
        flex-shrink: 0;
        position: relative;
        overflow: hidden;
        background: var(--mint);
    }
  .btn-close-custom{
    background: #1B5E56;
  }
  .card-photo,
  .img-placeholder {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    /* border-radius: 18px; */
  }

  .img-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #edf5f2, #f6f2e8);
    font-size: 42px;
  }

  .badge-float {
    position: absolute;
    top: 18px;
    left: 18px;
    z-index: 2;
    background: linear-gradient(135deg, var(--teal), var(--teal-deep));
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: 7px 12px;
    border-radius: 999px;
    box-shadow: 0 8px 18px rgba(27,94,86,0.25);
  }

  .wishlist-ic {
    position: absolute;
    top: 18px;
    right: 18px;
    z-index: 2;
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 50%;
    background: rgba(255,255,255,0.9);
    color: var(--ink);
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 22px rgba(16,36,31,0.12);
    transition: transform .18s ease, background .18s ease;
  }

  .wishlist-ic:hover {
    transform: scale(1.06);
    background: #fff;
  }

  .wishlist-ic.active {
    color: var(--coral);
  }

  /* .card-title {
    font-size: 18px;
    line-height: 1.35;
    margin: 0 0 12px;
    min-height: 52px;
    letter-spacing: -0.02em;
  } */

  .card-title {
      font-size: 17px;
      line-height: 1.3;
      margin-bottom: 10px;
  }
  .card-title a {
    color: var(--ink);
    text-decoration: none;
  }

  .card-title a:hover {
    color: var(--teal);
  }

  .rating {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    font-size: 12.5px;
    color: var(--slate);
  }

  .stars {
    color: #f7b955;
    letter-spacing: 1px;
    font-size: 13px;
  }
  .price-row {
    margin-bottom: 16px;
}

  .price-row .now {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 22px;
    font-weight: 700;
    color: var(--coral);
}
.price-row .was {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 13px;
    color: var(--slate);
    text-decoration: line-through;
    margin-left: 8px;
}

 .off-badge {
    font-size: 12px;
    font-weight: 700;
    color: #1B5E56;
    background: #E1F0EB;
    padding: 4px 10px;
    border-radius: 100px;
    margin-left: 8px;
}
/* 
  .features-list {
    list-style: none;
    padding: 0;
    margin: 0 0 18px;
    display: grid;
    gap: 8px;
    color: var(--slate);
    font-size: 12.5px;
  } */

  /* .features-list li {
    position: relative;
    padding-left: 18px;
    line-height: 1.5;
  } */

  /* .features-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--teal);
    font-weight: 700;
  } */

   .features-list {
    list-style: none;
    font-size: 13.5px;
    /* color: var(--ink); */
    padding-left: 0;
    margin-bottom: 20px;
}
.features-list li {
    padding-left: 26px;
    position: relative;
    margin-bottom: 12px;
    line-height: 1.4;
}

  .features-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--mint);
    color: var(--teal);
    font-size: 11px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

  .card-actions-row {
    display: flex;
    gap: 10px;
    margin-top: auto;
  }

  /* .btn-add,
  .btn-buy {
    border-radius: 999px;
    border: none;
    font-size: 12px;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-weight: 700;
    padding: 12px 14px;
    transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
  } */

  /* .btn-add {
    background: linear-gradient(135deg, var(--coral), #f18656);
    color: #fff;
    box-shadow: 0 12px 22px rgba(255,118,84,0.25);
  } */


 .btn-add {
    background: var(--coral);
    color: #fff;
    font-size: 12.5px;
    font-weight: 700;
    border-radius: 10px;
    border: none;
    padding: 13px 0;
    letter-spacing: .02em;
}
.btn-add:hover {
    background: #e8663f;
    color: #fff;
}

  .btn-buy {
    background: var(--ink);
    color: #fff;
    font-size: 12.5px;
    font-weight: 700;
    border-radius: 10px;
    border: none;
    padding: 13px 0;
    letter-spacing: .02em;
}

  .btn-buy:hover {
    background: var(--teal-deep);
    color: #fff;
}

  .why-card,
  .guide-card,
  .faq-cta-card,
  .blog-card,
  .help-pick-card,
  .newsletter-shell {
    background: rgba(255,255,255,0.9);
    border: 1px solid rgba(16,36,31,0.08);
    border-radius: 24px;
    box-shadow: 0 12px 30px rgba(16,36,31,0.06);
  }

  .why-card {
    padding: 28px 24px;
    height: 100%;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  }

  .why-card:hover,
  .guide-card:hover,
  .blog-card:hover,
  .faq-cta-card:hover,
  .help-pick-card:hover {
    transform: translateY(-5px);
    border-color: rgba(27,94,86,0.18);
    box-shadow: 0 18px 38px rgba(16,36,31,0.10);
  }

  .why-ic {
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(27,94,86,0.12), rgba(255,118,84,0.08));
    font-size: 26px;
  }

  .why-card h5,
  .guide-card h4,
  .faq-cta-card h5 {
    margin: 0 0 10px;
    color: var(--ink);
    letter-spacing: -0.02em;
  }

  .why-card p,
  .guide-card p,
  .faq-cta-card p,
  .blog-card p {
    margin: 0;
    color: var(--slate);
    line-height: 1.7;
    font-size: 14px;
  }

  .guide-card {
    padding: 26px 22px;
    height: 100%;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  }

  .guide-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: rgba(27,94,86,0.08);
    color: var(--teal);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .1em;
    margin-bottom: 18px;
  }

  .faq-accordion {
    --bs-accordion-bg: rgba(255,255,255,0.85);
    --bs-accordion-border-color: rgba(16,36,31,0.08);
    --bs-accordion-border-radius: 22px;
    --bs-accordion-inner-border-radius: 18px;
    --bs-accordion-btn-bg: rgba(255,255,255,0.85);
    --bs-accordion-btn-color: var(--ink);
    --bs-accordion-btn-padding-x: 20px;
    --bs-accordion-btn-padding-y: 18px;
    --bs-accordion-btn-focus-box-shadow: none;
    --bs-accordion-active-color: var(--ink);
    --bs-accordion-active-bg: rgba(234,244,241,0.8);
  }

  .faq-accordion .accordion-item {
    border: 1px solid rgba(16,36,31,0.08);
    border-radius: 20px !important;
    overflow: hidden;
    margin-bottom: 12px;
    box-shadow: 0 10px 24px rgba(16,36,31,0.04);
  }

  .faq-accordion .accordion-button {
    font-weight: 700;
    font-size: 15px;
    letter-spacing: -0.01em;
    border: 0;
  }

  .faq-accordion .accordion-button:not(.collapsed) {
    box-shadow: none;
    color: var(--ink);
  }

  .faq-accordion .accordion-button::after {
    background-image: none;
    content: '+';
    font-size: 22px;
    color: var(--teal);
    transform: rotate(0deg);
  }

  .faq-accordion .accordion-button:not(.collapsed)::after {
    content: '−';
    transform: none;
  }

  .faq-accordion .accordion-body {
    color: var(--slate);
    font-size: 14px;
    line-height: 1.75;
    padding-top: 0;
  }

  .faq-cta-card {
    padding: 28px 22px;
    height: 100%;
    text-align: center;
    background: linear-gradient(180deg, rgba(27,94,86,0.05), rgba(255,255,255,0.85));
  }

  .faq-cta-ic {
    display: inline-flex;
    width: 60px;
    height: 60px;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(27,94,86,0.12), rgba(201,71,38,0.08));
    font-size: 28px;
    margin-bottom: 16px;
  }

  .blog-card {
    overflow: hidden;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    height: 100%;
  }

  .blog-visual {
    height: 220px;
    overflow: hidden;
    background: linear-gradient(135deg, rgba(27,94,86,0.08), rgba(201,71,38,0.05));
  }

  .blog-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  .blog-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: 44px;
  }

  .blog-body {
    padding: 22px 20px 20px;
  }

  .blog-body h4 {
    margin: 0 0 12px;
    font-size: 20px;
    letter-spacing: -0.03em;
    color: var(--ink);
    line-height: 1.35;
  }

  .btn-read {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--teal);
    font-weight: 700;
    text-decoration: none;
    font-size: 13px;
    letter-spacing: .04em;
    text-transform: uppercase;
  }

  .newsletter-art {
    position: relative;
    min-height: 360px;
    border-radius: 30px;
    background: linear-gradient(135deg, rgba(27,94,86,0.14), rgba(255,118,84,0.10)), url('https://picsum.photos/seed/sleeproom-newsletter/900/700') center/cover no-repeat;
    border: 1px solid rgba(16,36,31,0.08);
    box-shadow: 0 18px 38px rgba(16,36,31,0.08);
  }

  .newsletter-art::before {
    content: 'Sleep better. Live brighter.';
    position: absolute;
    left: 26px;
    bottom: 26px;
    right: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 10px 18px;
    border-radius: 14px;
    background: rgba(255,255,255,0.82);
    color: var(--ink);
    font-weight: 800;
    letter-spacing: -0.02em;
    backdrop-filter: blur(10px);
  }

  .input-line,
  .lead-form .form-control {
    min-height: 52px;
    border-radius: 16px;
    border: 1px solid rgba(16,36,31,0.12);
    background: rgba(255,255,255,0.8);
    color: var(--ink);
    padding: 14px 16px;
    font-size: 14px;
  }

  .input-line:focus,
  .lead-form .form-control:focus {
    border-color: rgba(27,94,86,0.55);
    box-shadow: 0 0 0 0.2rem rgba(27,94,86,0.12);
    background: #fff;
  }

  .btn-ink-pill {
    min-height: 52px;
    border-radius: 16px;
    border: none;
    background: linear-gradient(135deg, var(--ink), var(--teal-deep));
    color: #fff;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    padding: 0 22px;
    box-shadow: 0 14px 26px rgba(16,36,31,0.18);
  }

  .pill-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 18px;
    border-radius: 999px;
    background: rgba(255,255,255,0.85);
    border: 1px solid rgba(16,36,31,0.08);
    color: var(--ink);
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    transition: all .2s ease;
  }

  .pill-link:hover {
    background: var(--teal);
    color: #fff;
    transform: translateY(-1px);
    border-color: transparent;
  }

  .help-pick-card {
    background: linear-gradient(135deg, rgba(27,94,86,0.06), rgba(255,255,84,0.04), rgba(255,255,255,0.85));
    border: 1px solid rgba(16,36,31,0.08);
    border-radius: 30px;
    padding: 26px 18px;
    box-shadow: 0 16px 34px rgba(16,36,31,0.06);
  }

  .help-pick-card h4 {
    font-size: clamp(20px, 2vw, 26px);
    letter-spacing: -0.03em;
    margin-bottom: 8px;
    color: var(--ink);
  }

  .help-pick-card p {
    color: var(--slate);
    margin: 0 0 16px;
    font-size: 14px;
  }

  .help-pick-img {
    width: 100%;
    max-width: 260px;
    height: 220px;
    object-fit: cover;
    border-radius: 20px;
    display: block;
    margin: 0 auto;
    box-shadow: 0 14px 28px rgba(16,36,31,0.08);
  }

  .help-banner {
    background: linear-gradient(135deg, rgba(27,94,86,0.06), rgba(255,118,84,0.04));
    border-top: 1px solid rgba(16,36,31,0.08);
    border-bottom: 1px solid rgba(16,36,31,0.08);
  }

  .help-banner h3 {
    margin: 0;
    font-size: clamp(26px, 2.6vw, 34px);
    letter-spacing: -0.04em;
    color: var(--ink);
  }

  .help-item {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: var(--ink);
    font-weight: 700;
    font-size: 14px;
    padding: 12px 16px;
    border-radius: 999px;
    background: rgba(255,255,255,0.8);
    border: 1px solid rgba(16,36,31,0.08);
    transition: all .2s ease;
  }

  .help-item:hover {
    background: var(--ink);
    color: #fff;
    transform: translateY(-1px);
  }

  .help-ic {
    display: inline-flex;
    width: 30px;
    height: 30px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(27,94,86,0.08);
  }

  @media (max-width: 767px) {
    .section-pad {
      padding-top: 68px;
      padding-bottom: 68px;
    }

    .card-visual {
      height: 220px;
    }

    .card-actions-row {
      flex-direction: row;
      gap: 8px;
    }

    .help-pick-card {
      text-align: center;
    }

    .help-pick-card .col-6 {
      width: 100%;
    }
  }

  /* ===== PRODUCT SLIDER (Bestsellers / New Arrivals) ===== */
  .prod-swiper{overflow:hidden;}
  .prod-swiper .swiper-slide{height:auto;display:flex;}
  .prod-swiper .swiper-slide .card-mattress{width:100%;flex:1;}
  .cat-swiper{overflow:hidden;}
  .cat-swiper .swiper-slide{height:auto;}
  .cat-swiper .swiper-slide .cat-card{width:100%;}
  .prod-slider-prev,.prod-slider-next{width:38px;height:38px;border-radius:50%;border:1.5px solid rgba(16,36,31,0.18);background:#fff;color:var(--ink);font-size:16px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,color .2s;flex-shrink:0;}
  .prod-slider-prev:hover,.prod-slider-next:hover{background:var(--teal);color:#fff;border-color:var(--teal);}
  .prod-slider-prev.swiper-button-disabled,.prod-slider-next.swiper-button-disabled{opacity:0.35;pointer-events:none;}