@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root{
  --bg:#ffffff;
  --soft:#faf7f2;
  --cream:#f6f0e8;
  --coffee:#2a1a14;
  --coffee-soft:#6b5448;
  --line:rgba(42,26,20,.08);

  --green:#7f9a7e;
  --gold:#d2a76d;
  --sun:#d88b63;
  --rose:#d7a0a4;

  --shadow:0 18px 50px rgba(42,26,20,.07);
}

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  font-family:'Inter',sans-serif;
  background:var(--bg);
  color:var(--coffee);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

a{
  text-decoration:none;
  color:inherit;
}

/* NAV */

.nav{
  position:fixed;
  top:0;
  left:0;
  right:0;
  height:76px;

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

  padding:0 6vw;

  background:rgba(255,255,255,.82);
  backdrop-filter:blur(18px);

  border-bottom:1px solid var(--line);

  z-index:50;
}

.brand{
  font-size:1.2rem;
  font-weight:800;
  letter-spacing:-0.03em;
}

.nav-links{
  display:flex;
  align-items:center;
  gap:22px;
}

.nav-links a{
  font-size:.95rem;
  font-weight:600;
  color:rgba(42,26,20,.78);
  transition:.2s ease;
}

.nav-links a:hover{
  color:var(--coffee);
}

.cart-btn{
  border:0;
  background:var(--coffee);
  color:white;

  padding:10px 16px;

  border-radius:999px;

  font-weight:700;
  cursor:pointer;
}

.cart-btn span{
  background:white;
  color:var(--coffee);

  margin-left:6px;

  padding:2px 7px;

  border-radius:999px;
}

/* HERO */

.hero{
  width:100%;

min-height:550px;

margin:76px 0 0;

display:flex;
align-items:center;

position:relative;

overflow:hidden;

border-radius:0;

  background:
    linear-gradient(rgba(0,0,0,.24), rgba(0,0,0,.24)),
    url("../images/hero-memory.png");

  background-size:100% auto;

background-position:center 80%;

  background-repeat:no-repeat;
}

.hero-content{
  max-width:520px;

  padding-left:58px;
  padding-right:24px;

  position:relative;

  z-index:2;

  color:white;
}

.hero .eyebrow{
  text-transform:uppercase;

  letter-spacing:.16em;

  font-size:.68rem;

  font-weight:800;

  color:rgba(255,255,255,.82);

  margin-bottom:18px;
}

.hero h1{
  color:white;

  font-size:clamp(2rem,4vw,3.6rem);

  line-height:1.04;

  letter-spacing:-0.04em;

  max-width:520px;

  font-weight:800;
}

.hero-text{
  max-width:470px;

  margin:18px 0 30px;

  font-size:.98rem;

  line-height:1.75;

  color:rgba(255,255,255,.88);
}

.hero-actions{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}

.hero .btn.secondary{
  background:rgba(255,255,255,.14);

  color:white;

  border:1px solid rgba(255,255,255,.32);

  backdrop-filter:blur(8px);
}
/* BUTTONS */

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  border-radius:999px;

  padding:14px 24px;

  font-weight:700;

  transition:.2s ease;

  border:0;

  cursor:pointer;
}

.btn:hover{
  transform:translateY(-2px);
}

.btn.primary,
.btn.dark{
  background:var(--coffee);
  color:white;
}

.btn.secondary{
  background:white;
  border:1px solid var(--line);
  color:var(--coffee);
}

.btn.light{
  background:white;
  color:var(--coffee);
}

.hero-actions{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}

/* LAYOUT */

.section{
  padding:110px 6vw;
}

.page{
  min-height:100vh;
}
.page:not(.shop-page):not(.story-page):not(.faq-page){
  padding-top:120px;
}
.story-page{
  padding-top:0;
}
.faq-page{
  padding-top:0;
}
.narrow{
  max-width:980px;
  margin:0 auto;
}

.page-hero{
  padding:70px 6vw 30px;
  text-align:center;
}

.page-hero p{
  max-width:680px;
  margin:18px auto 0;
}

.intro{
  background:var(--soft);

  border-radius:32px;

  padding:clamp(2rem,5vw,4rem);

  border:1px solid var(--line);

  box-shadow:var(--shadow);

  text-align:center;
}

.intro p:last-child{
  max-width:700px;
  margin:0 auto;
}

/* PRODUCTS */

.product-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:26px;
}

.shop-grid{
  grid-template-columns:repeat(4,1fr);
}

.product-card{
  background:white;

  border-radius:28px;

  overflow:hidden;

  border:1px solid var(--line);

  box-shadow:var(--shadow);

  padding:20px;

  transition:.25s ease;
}

.product-card:hover{
  transform:translateY(-5px);
}

.product-img{
  height:250px;

  border-radius:22px;

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

  font-weight:800;

  font-size:2rem;

  letter-spacing:-0.04em;
}

.placeholder.pink{
  background:linear-gradient(135deg,#ffe1e4,#d99aa2);
}

.placeholder.green{
  background:linear-gradient(135deg,#edf4e7,#89a285);
}

.placeholder.brown{
  background:linear-gradient(135deg,#ead9cb,#9c6c4f);
}

.placeholder.gold{
  background:linear-gradient(135deg,#fff1c8,#d9aa58);
}

.price{
  margin:14px 0;
  font-size:1.15rem;
  font-weight:800;
}

/* STORY */

.story-block{
  width:100%;
  margin:0;
  border-radius:0;
  box-shadow:none;
  border:0;
  padding:70px 6vw;
  position:relative;
  overflow:hidden;
  background:white;
  color:var(--coffee);
}

.story-block h2,
.story-block p,
.story-block .eyebrow{
  color:var(--coffee);
}

.split-section{
  display:grid;
  grid-template-columns:420px 1fr;

  gap:60px;

  align-items:center;

  padding:70px 6vw;

  background:white;
}

.split-image{
  width:220px;
  height:220px;

  border-radius:28px;

  overflow:hidden;
}

.island-img{
  width:100%;
  height:100%;

  background:
    linear-gradient(rgba(0,0,0,.10), rgba(0,0,0,.10)),
    url("../images/island-memory.png");

  background-size:cover;

  background-position:center;

  background-repeat:no-repeat;
}

.split-copy{
  width:100%;

  margin:0;

  border-radius:0;

  box-shadow:none;

  border:0;

  padding:120px 6vw;

  position:relative;

  overflow:hidden;

  display:flex;
  flex-direction:column;
  justify-content:center;

 background:white;

  background-size:cover;
  background-position:center;
}

/* FAQ */

.faq-list{
  padding:0 6vw 100px;
}

details{
  background:white;

  border-radius:24px;

  padding:24px;

  margin-bottom:16px;

  border:1px solid var(--line);

  box-shadow:0 10px 30px rgba(42,26,20,.04);
}

summary{
  cursor:pointer;
  font-weight:700;
  font-size:1.02rem;
}

/* CONTACT */

.contact-form{
  display:grid;
  gap:18px;

  padding:0 6vw 100px;
}

.contact-form label{
  display:grid;
  gap:8px;

  font-weight:700;
}

input,
textarea{
  width:100%;

  border:1px solid var(--line);

  background:white;

  padding:16px;

  border-radius:18px;

  font:inherit;
}

/* BANNER */

/* FULL WIDTH JOIN LIST BANNER */

.banner{
  width:100%;

  margin:0;

  border-radius:0;

  box-shadow:none;

  border:0;

  padding:42px 6vw;

  position:relative;

  overflow:hidden;

  text-align:center;

  color:white;

  min-height:260px;

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

  background:
    linear-gradient(
      rgba(42,26,20,.52),
      rgba(42,26,20,.52)
    ),
    url("../images/join-list-banner.png");

  background-size:cover;

  background-position:center;

  background-repeat:no-repeat;
}

.banner .eyebrow,
.banner h2,
.banner p{
  color:white;
}

.banner p{
  max-width:720px;
  margin:0 auto 28px;
}

@media(max-width:980px){

 .banner{
  padding:36px 7vw;
  min-height:220px;
}
}
/* PAGE SPECIFIC BANNERS */

.home-banner{
  background-image:
    linear-gradient(
      rgba(42,26,20,.52),
      rgba(42,26,20,.52)
    ),
    url("../images/home-banner.png") !important;
}

.shop-banner{
  background-image:
    linear-gradient(
      rgba(42,26,20,.52),
      rgba(42,26,20,.52)
    ),
    url("../images/shop-banner.png") !important;
}

.story-banner{
  background-image:
    linear-gradient(
      rgba(42,26,20,.52),
      rgba(42,26,20,.52)
    ),
    url("../images/story-banner.png") !important;
}

.faq-banner{
  background-image:
    linear-gradient(
      rgba(42,26,20,.52),
      rgba(42,26,20,.52)
    ),
    url("../images/faq-banner.png") !important;
}

.contact-banner{
  background-image:
    linear-gradient(
      rgba(42,26,20,.52),
      rgba(42,26,20,.52)
    ),
    url("../images/contact-banner.png") !important;
}
/* CART */

.cart-drawer{
  position:fixed;

  right:-420px;
  top:0;

  width:min(420px,92vw);
  height:100vh;

  background:white;

  padding:30px;

  z-index:100;

  box-shadow:-20px 0 60px rgba(0,0,0,.12);

  transition:.3s ease;

  overflow-y:auto;
}

.cart-drawer.open{
  right:0;
}

.cart-close{
  border:0;

  width:38px;
  height:38px;

  border-radius:50%;

  background:var(--soft);

  cursor:pointer;

  font-size:1.2rem;

  float:right;
}

.cart-item{
  display:flex;
  justify-content:space-between;

  gap:16px;

  padding:16px 0;

  border-bottom:1px solid var(--line);
}

.cart-total{
  margin:24px 0;
  font-size:1.2rem;
  font-weight:800;
}

/* FOOTER */

.footer{
  background:var(--coffee);

  color:white;

  padding:40px 6vw;

  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;

  gap:20px;
}

.footer p{
  font-weight:800;
}

.footer div{
  display:flex;
  gap:18px;
  flex-wrap:wrap;
}

/* ANIMATION */

.fade-up{
  animation:fadeUp .7s ease both;
}

@keyframes fadeUp{
  from{
    opacity:0;
    transform:translateY(18px);
  }

  to{
    opacity:1;
    transform:translateY(0);
  }
}

/* MOBILE */

@media(max-width:980px){

  .product-grid,
  .shop-grid,
  .split-section{
    grid-template-columns:1fr;
  }

  .hero{
    min-height:88vh;
    background-position:center right;
  }

  .hero-content{
  max-width:560px;
  padding:0 7vw;
  position:relative;
  z-index:2;
  color:white;
}

  .section{
    padding:80px 5vw;
  }

  .story-block{
  margin:0;
  padding:60px 7vw;
}
  .nav{
    height:auto;
    padding:16px 5vw;
    flex-wrap:wrap;
    gap:14px;
  }

  .nav-links{
    flex-wrap:wrap;
    gap:14px;
  }

  h1{
    font-size:clamp(2.5rem,12vw,4rem);
    letter-spacing:-0.045em;
  }

  h2{
    font-size:clamp(1.8rem,9vw,2.7rem);
  }
}
/* SHOP TWO-COFFEE FEATURE LAYOUT */

.coffee-feature{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:48px;
  align-items:center;
  padding:70px 6vw;
}

.coffee-feature.reverse{
  grid-template-columns:.9fr 1.1fr;
}

.coffee-feature.reverse .coffee-image{
  order:2;
}

.coffee-feature.reverse .coffee-copy{
  order:1;
}

.coffee-image{
  min-height:340px;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}

.house-scene{
  background-image:url("../images/house-roast-scene.png");
}

.caribeno-scene{
  background-image:url("../images/caribeno-scene.png");
}

.coffee-copy{
  max-width:560px;
}

.coffee-notes{
  list-style:none;
  margin:24px 0;
  padding:0;
}

.coffee-notes li{
  padding:10px 0;
  border-bottom:1px solid var(--line);
  color:rgba(42,26,20,.75);
}

@media(max-width:900px){
  .coffee-feature,
  .coffee-feature.reverse{
    grid-template-columns:1fr;
    padding:50px 5vw;
  }

  .coffee-feature.reverse .coffee-image,
  .coffee-feature.reverse .coffee-copy{
    order:initial;
  }

  .coffee-image{
    min-height:260px;
  }
}
/* SHOP HERO */

.shop-hero{
  width:100%;

  min-height:550px;

  margin:76px 0 0;

  display:flex;
  align-items:center;

  position:relative;

  overflow:hidden;

  border-radius:0;

  background:
    linear-gradient(rgba(0,0,0,.24), rgba(0,0,0,.24)),
    url("../images/shop-hero.png");

  background-size:100% auto;

  background-position:center 50%;

  background-repeat:no-repeat;
}

.shop-hero .hero-content{
  max-width:520px;

  padding-left:58px;
  padding-right:24px;

  position:relative;

  z-index:2;

  color:white;
}

.shop-hero .eyebrow{
  color:rgba(255,255,255,.82);
}

.shop-hero h1{
  color:white;

  font-size:clamp(2rem,4vw,3.6rem);

  line-height:1.04;

  letter-spacing:-0.04em;

  max-width:520px;

  font-weight:800;
}

.shop-hero .hero-text{
  max-width:470px;

  margin:18px 0 30px;

  font-size:.98rem;

  line-height:1.75;

  color:rgba(255,255,255,.88);
}
.story-hero{
  width:100%;

  min-height:550px;

  margin:76px 0 0;

  display:flex;
  align-items:center;

  position:relative;

  overflow:hidden;

  border-radius:0;

  background:
    linear-gradient(rgba(0,0,0,.24), rgba(0,0,0,.24)),
    url("../images/story-hero.png");

  background-size:100% auto;

  background-position:center 50%;

  background-repeat:no-repeat;
}
/* FAQ HERO */

.faq-hero{
  width:100%;

  min-height:550px;

  margin:76px 0 0;

  display:flex;
  align-items:center;

  position:relative;

  overflow:hidden;

  border-radius:0;

  background:
    linear-gradient(rgba(0,0,0,.24), rgba(0,0,0,.24)),
    url("../images/faq-farmers.png");

  background-size:100% auto;

  background-position:center 50%;

  background-repeat:no-repeat;
}

.faq-hero .hero-content{
  max-width:620px;

  padding-left:58px;
  padding-right:24px;

  position:relative;

  z-index:2;

  color:white;
}

.faq-hero .eyebrow{
  color:rgba(255,255,255,.82);
}

.faq-hero h1{
  color:white;

  font-size:clamp(2rem,4vw,3.5rem);

  line-height:1.06;

  letter-spacing:-0.04em;

  max-width:620px;

  font-weight:800;
}

.faq-hero .hero-text{
  max-width:520px;

  margin:18px 0 30px;

  font-size:1rem;

  line-height:1.8;

  color:rgba(255,255,255,.9);
}
/* HOME PRODUCT IMAGE SIZE FIX */

.home-coffee-image{
  padding:34px;
  min-height:360px;
}

.home-coffee-image img{
  width:auto;
  max-width:190px;
  max-height:330px;
  object-fit:contain;
}
/* HOME FLOATING BAG STYLE */

.floating-bag{
  width:100%;
  max-width:240px;
  height:auto;
  display:block;
  margin:auto;

  filter:
    drop-shadow(0 25px 45px rgba(0,0,0,.18));
}
/* HOME FLOATING BAG STYLE ONLY */

.home-page .floating-bag{
  width:100%;
  max-width:240px;
  height:auto;
  display:block;
  margin:auto;

  filter:drop-shadow(0 25px 45px rgba(0,0,0,.18));
}

.home-page .coffee-feature .coffee-image{
  display:flex;
  align-items:center;
  justify-content:center;

  background:#f7f3ed;

  border-radius:34px;

  padding:34px;
}
.qty-controls{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:10px;
}

.qty-controls button{
  width:32px;
  height:32px;
  border-radius:50%;
  border:1px solid var(--line);
  background:white;
  color:var(--coffee);
  cursor:pointer;
  font-weight:800;
  font-size:1rem;
}

.qty-controls span{
  min-width:20px;
  text-align:center;
  font-weight:700;
}
.free-ship-box{
  background:#f6f0e8;
  border:1px solid var(--line);
  padding:14px 16px;
  border-radius:18px;
  margin:18px 0;
}

#freeShippingMessage{
  font-size:.95rem;
  font-weight:700;
  color:var(--coffee);
}
/* MOBILE HERO IMAGE FIX */

@media(max-width:980px){

  .hero,
  .shop-hero,
  .story-hero,
  .faq-hero{
    min-height:560px;
    margin-top:0;
    background-size:cover;
    background-position:center center;
  }

  .hero-content,
  .shop-hero .hero-content,
  .story-hero .hero-content,
  .faq-hero .hero-content{
    padding:0 7vw;
    max-width:100%;
  }

  .hero h1,
  .shop-hero h1,
  .story-hero h1,
  .faq-hero h1{
    font-size:clamp(2.3rem,10vw,3.8rem);
    line-height:1.05;
  }
}
.cart-drawer{
  padding-bottom:120px;
}

.cart-drawer .btn.full{
  width:100%;
  position:sticky;
  bottom:20px;
  z-index:5;
}

@media(max-width:600px){
  .cart-drawer{
    width:100vw;
    padding-bottom:150px;
  }
}
/* CONTACT HERO */

.contact-hero{
  width:100%;

  min-height:550px;

  margin:0;

  display:flex;
  align-items:center;

  position:relative;

  overflow:hidden;

  border-radius:0;

  background:
    linear-gradient(
      rgba(0,0,0,.28),
      rgba(0,0,0,.28)
    ),
    url("../images/contact-hero.png");

  background-size:cover;

  background-position:center center;

  background-repeat:no-repeat;
}

.contact-hero .hero-content{
  max-width:620px;

  padding-left:58px;
  padding-right:24px;

  position:relative;

  z-index:2;

  color:white;
}

.contact-hero .eyebrow{
  color:rgba(255,255,255,.82);
}

.contact-hero h1{
  color:white;

  font-size:clamp(2rem,4vw,3.5rem);

  line-height:1.06;

  letter-spacing:-0.04em;

  max-width:620px;

  font-weight:800;
}

.contact-hero .hero-text{
  max-width:520px;

  margin:18px 0 30px;

  font-size:1rem;

  line-height:1.8;

  color:rgba(255,255,255,.9);
}
/* FINAL MOBILE HORIZONTAL NAV FIX */

@media(max-width:980px){

  .nav{
  position:fixed !important;

  top:0;
  left:0;
  right:0;

  z-index:999;

  height:auto !important;

  padding:22px 5vw !important;

  flex-direction:column;

  align-items:flex-start;

  background:rgba(255,255,255,.92);

  backdrop-filter:blur(18px);
}

  .nav-links{
    width:100%;
    display:flex;
    flex-wrap:wrap;
    gap:16px;
  }

  .hero,
  .shop-hero,
  .story-hero,
  .faq-hero{
    margin-top:0 !important;
    min-height:620px;
    background-size:cover !important;
    background-position:center center !important;
  }

  .hero-content,
  .shop-hero .hero-content,
  .story-hero .hero-content,
  .faq-hero .hero-content{
    padding:90px 7vw 60px !important;
  }
}
/* CONTACT PAGE MOBILE HERO FIX */

.contact-page{
  max-width:none;
  margin:0;
  padding-top:0 !important;
}

.contact-hero{
  width:100%;
  min-height:550px;
  margin:76px 0 0;
  display:flex;
  align-items:center;
  position:relative;
  overflow:hidden;
  border-radius:0;

  background:
    linear-gradient(rgba(0,0,0,.28), rgba(0,0,0,.28)),
    url("../images/contact-hero.png");

  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
}

@media(max-width:980px){
  .contact-hero{
    margin-top:0 !important;
    min-height:620px;
    background-size:cover !important;
    background-position:center center !important;
  }

  .contact-hero .hero-content{
    padding:90px 7vw 60px !important;
    max-width:100%;
  }
}
/* FINAL HERO BANNER SIZE REDUCTION */

.hero,
.shop-hero,
.story-hero,
.faq-hero,
.contact-hero{
  min-height:380px !important;
  background-size:cover !important;
  background-position:center center !important;
}

.hero-content,
.shop-hero .hero-content,
.story-hero .hero-content,
.faq-hero .hero-content,
.contact-hero .hero-content{
  padding-top:70px !important;
  padding-bottom:70px !important;
}

@media(max-width:980px){

  .hero,
  .shop-hero,
  .story-hero,
  .faq-hero,
  .contact-hero{
    min-height:420px !important;
  }

  .hero-content,
  .shop-hero .hero-content,
  .story-hero .hero-content,
  .faq-hero .hero-content,
  .contact-hero .hero-content{
    padding:90px 7vw 50px !important;
  }
}
/* FINAL GLOBAL TEXT + HERO CLEANUP */

/* shrink all hero images to about 3/4 size */
.hero,
.shop-hero,
.story-hero,
.faq-hero,
.contact-hero{
  min-height:285px !important;
  background-size:cover !important;
  background-position:center center !important;
}

/* stop oversized hero text spacing */
.hero-content,
.shop-hero .hero-content,
.story-hero .hero-content,
.faq-hero .hero-content,
.contact-hero .hero-content{
  padding-top:55px !important;
  padding-bottom:55px !important;
}

/* clean headline spacing */
h1,
h2{
  line-height:1.12 !important;
  letter-spacing:-0.035em !important;
  margin-bottom:18px;
}

/* clean paragraph structure */
p{
  line-height:1.65 !important;
  margin-bottom:18px;
}

/* make text blocks readable, not scattered */
.hero-content,
.coffee-copy,
.split-copy,
.story-block,
.intro,
.banner,
.page-hero{
  text-align:left;
}

/* center only footer/banner CTA sections */
.banner{
  text-align:center;
}

/* keep paragraph width controlled */
.hero-text,
.coffee-copy p,
.split-copy p,
.story-block p,
.intro p,
.page-hero p{
  max-width:680px;
}

/* mobile grammar/readability structure */
@media(max-width:980px){

  .hero,
  .shop-hero,
  .story-hero,
  .faq-hero,
  .contact-hero{
    min-height:315px !important;
  }

  .hero-content,
  .shop-hero .hero-content,
  .story-hero .hero-content,
  .faq-hero .hero-content,
  .contact-hero .hero-content{
    padding:110px 7vw 45px !important;
  }

  h1{
    font-size:clamp(2rem,9vw,3rem) !important;
    line-height:1.12 !important;
  }

  h2{
    font-size:clamp(1.7rem,7vw,2.4rem) !important;
    line-height:1.15 !important;
  }

  p,
  .hero-text{
    font-size:1rem !important;
    line-height:1.65 !important;
  }

  .intro,
  .story-block,
  .split-copy,
  .coffee-copy,
  .page-hero{
    text-align:left !important;
  }

  .banner{
    text-align:center !important;
  }
}
/* FINAL MOBILE HERO NAV CLEARANCE FIX */

@media(max-width:980px){

  .hero-content,
  .shop-hero .hero-content,
  .story-hero .hero-content,
  .faq-hero .hero-content,
  .contact-hero .hero-content{
    padding-top:155px !important;
    padding-bottom:45px !important;
  }

  .hero,
  .shop-hero,
  .story-hero,
  .faq-hero,
  .contact-hero{
    min-height:390px !important;
  }
}
/* FINAL PURE WHITE SITE CLEANUP */

body,
.page,
.section,
.intro,
.story-block,
.split-copy,
.split-section,
.coffee-feature,
.product-card,
.contact-form,
.page-hero,
details,
.cart-drawer{
  background:white !important;
}

/* remove tinted image containers */
.home-page .coffee-feature .coffee-image{
  background:white !important;
}

/* white pills/buttons */
.btn.secondary,
.btn.light{
  background:white !important;
  border:1px solid rgba(42,26,20,.10) !important;
  color:var(--coffee) !important;
}

/* white free shipping box */
.free-ship-box{
  background:white !important;
}

/* white quantity buttons */
.qty-controls button{
  background:white !important;
}

/* white nav */
.nav{
  background:rgba(255,255,255,.96) !important;
}

/* remove cream vars influence */
:root{
  --soft:#ffffff;
  --cream:#ffffff;
}

/* keep footer dark */
.footer{
  background:var(--coffee) !important;
}
/* FIX CART BUTTON CLICKS */

.qty-controls,
.qty-controls button,
.cart-item button{
  pointer-events:auto !important;
  position:relative;
  z-index:20;
}

.cart-drawer{
  overflow-y:auto;
}