/** Shopify CDN: Minification failed

Line 214:0 Unexpected "}"

**/
/* ========= Guncha base tokens ========= */
:root{
  --guncha-font: "Lexend", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Helvetica Neue", "Noto Sans", sans-serif!important;
  --guncha-bg: #FFF;
  --guncha-text: #000000;
}

/* Global base */
html, body {
  background: var(--guncha-bg)!important;
  color: var(--guncha-text)!important;
  font-family: var(--guncha-font)!important;
}

/* If the theme sets CSS variables for fonts, make them Lexend too */
:root{
  --font-body-family: var(--guncha-font);
  --font-heading-family: var(--guncha-font);
}

/* ========= Header layout to match your mock ========= */

/* Remove default header borders/shadows so it sits on the warm background */
.header, header.header {
  background: transparent;
  border: 0;
  box-shadow: none;
}

/* Typical Taste markup: center the logo, keep icons on the right, menu on a row below */
@media (min-width: 750px){
  .header__content, header.header .header__wrapper, .shopify-section-header .header__content {
    display: grid;
    grid-template-columns: 1fr auto 1fr; /* left space | logo | right icons */
    align-items: center;
    row-gap: 0.25rem;
  }
  .header__heading, .header__heading a, .header__heading-logo {
    justify-self: center;
  }
  .header__icons {
    justify-self: end;
    gap: .75rem;
  }
  /* Put the inline menu on its own row, centered */
  .header__inline-menu {
    grid-column: 1 / -1;
    justify-self: center;
    margin-top: .5rem;
  }
}

/* ========= Menu pills (Home / Shop / Estates / Our Story / Recipes / Contact Us) ========= */
.header__inline-menu .list-menu--inline,
.header__inline-menu ul {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
}

.header__inline-menu .list-menu--inline li,
.header__inline-menu ul li {
  margin: 0;
}

.header__inline-menu a,
.header__inline-menu .list-menu__item {
  display: inline-block;
  padding: 12px 18px;
  /* background: #FFFFFF; */
  border: 1.5px solid var(--guncha-text);
  color: var(--guncha-text);
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  font-size: 1.3em!important;
    font-weight: 400!important;
}

/* Icons sizing (search/cart) to feel balanced with the pills) */
.header__icon, .header__icons .header__icon {
  height: 40px;
  width: 40px;
  display: grid;
  place-items: center;
  border-radius: 999px;
}

/* Make sure SVGs inherit the black */
.header__icon svg, .header__icons svg {
  stroke: var(--guncha-text);
  fill: none;
}

/* Mobile: give a little breathing room */
@media (max-width: 749px){
  .header { padding: 8px 0; }
  .header__inline-menu { margin-top: 6px; }
}

/* ========= Force Lexend on all typography layers ========= */
*, *::before, *::after {
  font-family: var(--guncha-font) !important;
}

/* Shopify’s type classes */
.heading,
.h1, .h2, .h3, .h4, .h5, .h6,
.rte,
.caption,
.button, .button-label,
.navbar__item, .list-menu__item, .menu-drawer__menu-item {
  font-family: var(--guncha-font) !important;
}

/* fix buttons + links weight + letter spacing */
.button, .list-menu__item a {
  font-weight: 500;
  letter-spacing: 0;
}

/* Adjust header menu sizing slightly to match your mock */
.header__inline-menu a,
.header__inline-menu .list-menu__item {
  font-size: 15px;
  font-weight: 600;
  text-transform: none;
}

/* ===== Remove underline/highlight on current/hovered menu items ===== */
.header__inline-menu a,
.header__inline-menu .list-menu__item a {
  text-decoration: none !important;
  box-shadow: none !important; /* Taste sometimes uses underline via box-shadow */
}
.header__inline-menu .list-menu__item--active > a,
.header__inline-menu .is-active > a,
.header__inline-menu a[aria-current] {
  text-decoration: none !important;
  box-shadow: none !important;
}

/* ===== "Brick" menu: items touch with single borders (no gaps) ===== */
@media (min-width: 750px){
  .header__inline-menu .list-menu--inline,
  .header__inline-menu ul{
    display: inline-flex;
    gap: 0;                 /* remove spaces */
  }

  /* square tiles, same padding as before */
  .header__inline-menu a,
  .header__inline-menu .list-menu__item{
    /* background: #fff; */
    border: 1.5px solid #000;
    border-radius: 0;       /* brick edges */
    padding: 12px 18px;
    line-height: 1;
  }

  /* collapse shared borders so they don't look double-thick */
  .header__inline-menu li + li a,
  .header__inline-menu li + li .list-menu__item{
    margin-left: -1.5px;    /* overlaps the adjacent border */
  }
}


/* ===================== 1) Nuke Taste underline/animation in header menu ===================== */
/* Taste uses a pseudo-element + sometimes a gradient underline on links. Disable both. */
.header__inline-menu a,
.header__inline-menu .list-menu__item a {
  text-decoration: none !important;
  background-image: none !important;      /* kills gradient underline trick */
  -webkit-text-decoration: none !important;
}

/* kill the animated underline pseudo-element specifically */
.header__inline-menu a::after,
.header__inline-menu .list-menu__item a::after {
  content: none !important;
  display: none !important;
}

/* ensure hover/active/current states don't resurrect it */
.header__inline-menu a:hover,
.header__inline-menu a:focus,
.header__inline-menu a:active,
.header__inline-menu a[aria-current="page"],
.header__inline-menu .list-menu__item--active > a {
  text-decoration: none !important;
  background-image: none !important;
}

/* ===================== 2) Force background + text color everywhere ===================== */
/* Background */
html, body,
.color-background-1, .color-background-2, .gradient,
.shopify-section, .section {
  background: #FFF !important;
  background-color: #FFF !important;
}

/* Text color (keeps your borders/icons black too) */
/* body, body * {
  color: #000 !important;
  -webkit-text-fill-color: #000 !important; /* iOS/Safari */
} */

/* Make SVG strokes/fills black (Taste sometimes overrides) */
/* svg, svg * {
  stroke: #000 !important;
  fill: #000 !important;
} */

/* ====== Kill Taste underline animation on .header__menu-item span ====== */
.header__menu-item span {
  text-decoration: none !important;
  transition: none !important;
}

/* Prevent underline on hover/active */
.header__menu-item:hover span,
.header__menu-item:focus span,
.header__menu-item:active span {
  text-decoration: none !important;
}

/* rollback the 100vw hack */
.header__inline-menu{
  width: auto;
  margin-left: 0;
  transform: none;
}

/* ===== Edge-to-edge menu inside the header container (desktop) ===== */
@media (min-width: 990px){
  /* Let the header container stretch; keep small side padding */
  .shopify-section-header .page-width{
    max-width: none;
    padding-left: 20px;
    padding-right: 20px;
  }

  /* Keep menu as its own row under logo/icons */
  .header__inline-menu{
    grid-column: 1 / -1;
    margin-top: 8px;
  }

  /* Build a single bordered bar that fills the row */
  .header__inline-menu .list-menu--inline,
  .header__inline-menu ul{
    display: flex;
    width: 100%;
    gap: 0;                          /* no gaps */
    padding: 0;
    background: transparent;         /* use #FFF5EA */
    border: 1.5px solid #000;        /* outer border */
  }

  /* Make each item share equal width */
  .header__inline-menu li{ flex: 1 1 0; }

  /* Links as clean segments; no white background */
  .header__inline-menu a,
  .header__inline-menu .list-menu__item{
    display: block;
    text-align: center;
    padding: 14px 0;
    background: transparent;         /* not white */
    border: 0;                       /* inner borders handled below */
    color: #000;
  }

  /* Inner dividers between items only */
  .header__inline-menu li + li a,
  .header__inline-menu li + li .list-menu__item{
    border-left: 1.5px solid #000;
  }
}

/* ===== Make header inline menu span full row (desktop) ===== */
@media (min-width: 990px){
  /* keep the header grid sane */
  .shopify-section-header .header__content{
    display: grid;
    grid-template-columns: 1fr auto 1fr;  /* left gap | logo | right icons */
    align-items: center;
  }

  /* put menu on its own row and STRETCH it */
  .header__inline-menu{
    grid-column: 1 / -1;
    justify-self: stretch;     /* was center → now stretches */
    width: 100%;
    margin-top: 10px;
  }

  /* some Taste builds wrap the UL in a <nav> */
  .header__inline-menu > nav{ width: 100%; }

  /* full-width segmented bar */
  .header__inline-menu .list-menu--inline,
  .header__inline-menu ul{
    display: flex;
    width: 100%;
    gap: 0;
    padding: 0;
    background: transparent;    /* use #FFF5EA */
    border: 1.5px solid #000;   /* outer frame */
  }

  .header__inline-menu li{ flex: 1 1 0; }   /* equal widths */

  .header__inline-menu a,
  .header__inline-menu .list-menu__item{
    display: block;
    text-align: center;
    padding: 14px 0;
    background: transparent;     /* no white tiles */
    border: 0;                   /* inner borders defined below */
    color: #000;
  }

  .header__inline-menu li + li a,
  .header__inline-menu li + li .list-menu__item{
    border-left: 1.5px solid #000;   /* dividers only between items */
  }
}

/* --- Restore color scheme on the Announcement bar --- */
/* Taste wraps this section with .shopify-section-announcement-bar
   and sets CSS vars ( --color-background / --color-foreground ) from the chosen scheme. */

.shopify-section-announcement-bar,
.shopify-section-announcement-bar .announcement-bar {
  background: var(--color-background) !important;
  background-color: var(--color-background) !important;
}

/* Use the scheme’s text colors (instead of our global black) */
.shopify-section-announcement-bar,
.shopify-section-announcement-bar * {
  color: var(--color-foreground) !important;
  -webkit-text-fill-color: var(--color-foreground) !important;
}

/* Icons follow the text color */
.shopify-section-announcement-bar svg,
.shopify-section-announcement-bar svg * {
  stroke: var(--color-foreground) !important;
  fill: var(--color-foreground) !important;
}

/* If you enabled the separator line and want it to follow the scheme too */
.shopify-section-announcement-bar .announcement-bar__line {
  background-color: var(--color-foreground) !important;
}

/* Optional: keep our warm background *everywhere else* */
.shopify-section:not(.shopify-section-announcement-bar),
.section:not(.shopify-section-announcement-bar) {
  background: #FFF !important;
  background-color: #FFF !important;
}

/* ===== Announcement bar message typography override ===== */
.announcement-bar__message.h5,
.announcement-bar__message {
  font-family: var(--guncha-font) !important;
  font-weight: 200 !important;
  font-size: 16px !important;      /* adjust this as you like */
  line-height: 1.4 !important;
  letter-spacing: 0 !important;
  text-transform: none !important; /* removes uppercase if theme enforces it */
}

/* ========= Slow marquee effect for the announcement bar ========= */
.announcement-bar__message {
  overflow: hidden;
  position: relative;
  white-space: nowrap;
}

/* Move the inner text smoothly */
.announcement-bar__message h5 {
  display: inline-block;
  position: relative;
  white-space: nowrap;
  animation: guncha-marquee 25s linear infinite;
  font-weight: 200 !important;          /* keep your typography */
  font-family: var(--guncha-font) !important;
}

/* The keyframes define the scroll from right to left */
@keyframes guncha-marquee {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-100%);
  }
}

/* Optional: slow it down or speed it up */

/* ===== Marquee for announcement bar (slow, smooth, CSS-only) ===== */

/* the viewport */
.announcement-bar__message{
  position: relative;
  overflow: hidden;
  white-space: nowrap;
}

/* animate the immediate child (h5/p/a/span/etc.) */
.announcement-bar__message > *{
  display: inline-block;
  white-space: nowrap;
  padding-left: 100%;               /* start fully off-screen to the right */
  animation: guncha-marquee 35s linear infinite;
  will-change: transform;
  font-weight: 200 !important;      /* your requested weight */
  font-family: var(--guncha-font) !important;
}

/* pause on hover (optional, nice for readability) */
.announcement-bar__message:hover > *{
  animation-play-state: paused;
}

/* keyframes: slide text from right → left once per cycle */
@keyframes guncha-marquee{
  0%   { transform: translateX(0); }
  100% { transform: translateX(-100%); }
}

/* Safari/WebKit fallback */
@-webkit-keyframes guncha-marquee{
  0%   { -webkit-transform: translateX(0); }
  100% { -webkit-transform: translateX(-100%); }
}

/* ===== Full-width marquee announcement bar ===== */

/* remove page-width constraint just for utility/announcement bar */
.shopify-section-announcement-bar .page-width,
.section-announcement-bar .page-width,
.utility-bar__grid.page-width {
  max-width: none !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* center content vertically */
.utility-bar__grid {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* container behaves as marquee viewport */
.utility-bar__grid .announcement-bar__message {
  position: relative;
  overflow: hidden;
  white-space: nowrap;
  width: 100%;
}

/* animate whatever element lives inside (h5/p/span/a) */
.utility-bar__grid .announcement-bar__message > * {
  display: inline-block;
  white-space: nowrap;
  padding-left: 100%;
  animation: guncha-marquee 35s linear infinite;
  will-change: transform;
  font-weight: 200 !important;
  font-family: var(--guncha-font) !important;
}

/* pause on hover */
.utility-bar__grid .announcement-bar__message:hover > * {
  animation-play-state: paused;
}

/* keyframes for continuous scroll */
@keyframes guncha-marquee {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-100%); }
}

/* ===== Rich text: keep formatting & restore visual hierarchy ===== */

/* general container still full width */
.rich-text__wrapper.page-width,
.rich-text__wrapper {
  max-width: none !important;
  /* width: 100vw !important; */
  margin: 0 auto !important;
  padding: 0 !important;
}

.rich-text__blocks {
  max-width: none !important;
  width: 100%;
  padding: 0 6em;
  box-sizing: border-box;
}

/* base text */
.rich-text__blocks p {
  font-family: var(--guncha-font) !important;
  font-weight: 300 !important;
  color: #000 !important;
  line-height: 1.6 !important;
  margin-bottom: 1rem;
}

/* restore bold/italic look */
.rich-text__blocks strong,
.rich-text__blocks b {
  font-weight: 600 !important;
}

.rich-text__blocks em,
.rich-text__blocks i {
  font-style: italic !important;
}

/* heading hierarchy */
.rich-text__blocks h2,
.rich-text__blocks h3,
.rich-text__blocks h4 {
  font-family: var(--guncha-font) !important;
  font-weight: 500 !important;
  margin-bottom: 0.75rem;
}

/* optional: emphasize "Guncha" style words */
.rich-text__blocks strong em,
.rich-text__blocks em strong {
  font-weight: 600 !important;
  font-style: italic !important;
}

.content-container {
    border: 0px!important;
}

/* ===== Guncha Footer Background Image ===== */
footer.footer,
.shopify-section-footer,
#shopify-section-footer {
  background: url("/cdn/shop/files/v1010-79a_79699e4d-ab50-4ac8-85fd-3d77740a7c45.jpg?v=1760960496")
              center center / cover no-repeat !important;
  background-color: #FFF !important; /* fallback */
  /* color: #000 !important; */
}

/* ensure footer text/icon colors stay readable on the image */
footer.footer *,
.shopify-section-footer * {
  /* color: #000 !important; */
  /* -webkit-text-fill-color: #000 !important; */
}

/* optional: adjust padding for better visual spacing */
footer.footer .footer__content,
.shopify-section-footer .footer__content {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}

/* ===== Guncha footer email input style ===== */
.field__input,
.select__select,
.customer .field input,
.customer select {
  background: transparent !important;
  border: none !important;
  border-bottom: 1.5px solid #fff !important;
  border-radius: 0 !important;
  color: #fff !important;
  font-family: var(--guncha-font) !important;
  font-weight: 300 !important;
  padding: 8px 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

/* placeholder text */
.field__input::placeholder,
.select__select::placeholder,
.customer .field input::placeholder {
  color: rgba(255,255,255,0.7) !important;
}

/* caret & text color */
.field__input,
.customer .field input {
  caret-color: #fff !important;
  color: #fff !important;
}

/* arrow / select dropdown icon */
.select__select {
  color: #fff !important;
  background-image: none !important; /* remove default arrow */
  appearance: none;
  -webkit-appearance: none;
  position: relative;
}

/* custom white arrow using pseudo-element */
.select__select::after {
  content: "▾";
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: #fff;
  pointer-events: none;
}

/* focus state */
.field__input:focus,
.select__select:focus,
.customer .field input:focus {
  border-bottom: 2px solid #fff !important;
}

/* ===== Guncha Footer Newsletter Form Styling ===== */

/* input field */
.newsletter-form__field-wrapper .field__input,
.footer__newsletter .field__input {
  background: transparent !important;
  border: none !important;
  border-bottom: 1.5px solid #fff !important;
  border-radius: 0 !important;
  color: #fff !important;
  font-family: var(--guncha-font) !important;
  font-weight: 300 !important;
  padding: 10px 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

/* placeholder text */
.newsletter-form__field-wrapper .field__input::placeholder {
  color: rgba(255,255,255,0.7) !important;
}

/* remove any thin wrapper border Taste adds */
.newsletter-form__field-wrapper,
.footer__newsletter,
.footer__newsletter .field {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* submit arrow/button */
.newsletter-form__field-wrapper .field__button,
.footer__newsletter .field__button {
  background: transparent !important;
  border: none !important;
  color: #fff !important;
  padding: 0 10px !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* the arrow icon itself */
.newsletter-form__field-wrapper .field__button svg,
.footer__newsletter .field__button svg {
  stroke: #fff !important;
  fill: #fff !important;
  width: 18px;
  height: 18px;
}

/* focus state underline */
.newsletter-form__field-wrapper .field__input:focus {
  border-bottom: 2px solid #fff !important;
}

/* ===== Guncha 8|4 hero grid — final refined layout ===== */
.guncha-hero-8-4 {
  position: relative;
  background: url("/cdn/shop/files/footer_bg.png?v=1759911481")
              center/cover no-repeat;
  padding: 2%; /* creates the 2% “border frame” effect showing bg image */
}

/* full-bleed layout */
.guncha-hero-8-4 .page-width {
  max-width: none;
  padding: 0;
}

/* grid: 8 | 4 with NO gaps between cells */
.guncha-hero-8-4__grid {
  display: grid;
  grid-template-columns: 8fr 4fr;
  gap: 0;
  padding-top: 8px!important;
}

/* remove rounding */
.guncha-hero-8-4__left,
.guncha-hero-8-4__right,
.guncha-hero-8-4__media,
.guncha-hero-8-4__card,
.guncha-hero-8-4__img,
.guncha-hero-8-4__copy {
  border-radius: 0 !important;
}

/* left image (non-clickable) */
.guncha-hero-8-4__media {
  border: 0;
  overflow: hidden;
}

.guncha-hero-8-4__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* right image (clickable card) */
.guncha-hero-8-4__right {
  display: grid;
  grid-template-rows: auto auto;
}

/* clickable image box */
.guncha-hero-8-4__card {
  display: block;
  border: none;
  overflow: hidden;
}

.guncha-hero-8-4__card img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* text box immediately below image */
.guncha-hero-8-4__copy {
  background: #FFF;
  border-top: 1.5px solid #000; /* optional divider line */
  border-left: 1.5px solid #000;
  border-right: 1.5px solid #000;
  border-bottom: 1.5px solid #000;
  padding: 16px 20px;
  color: #000;
}

.guncha-hero-8-4__title {
  font-weight: 600;
  font-size: 18px;
  margin: 0;
}

.guncha-hero-8-4__text {
  font-weight: 300;
  font-size: 14px;
  margin: 6px 0 0 0;
}

/* responsive: stack on mobile */
@media (max-width: 989px) {
  .guncha-hero-8-4__grid {
    grid-template-columns: 1fr;
  }
  .guncha-hero-8-4 {
    padding: 4%;
  }
}

/* ===== Guncha 8|4 hero grid — alignment + frame + no internal gaps ===== */

/* 1) Align with site container (same gutters as header) */
.guncha-hero-8-4 .page-width{
  max-width: var(--page-width, 1200px); /* let theme cap it */
  padding-left: 20px;                   /* match your header gutters */
  padding-right: 20px;
  margin: 0 auto;
}

/* 2) Background image as a visible frame (~2%) */
.guncha-hero-8-4{
  background: url("/cdn/shop/files/footer_bg.png?v=1759911481")
              center/cover no-repeat;
              padding: 0em 0.3em;
}
.guncha-hero-8-4__grid{
  padding: 2%;          /* creates the visible background border */
  background: transparent;
  box-sizing: border-box;
}

/* 3) Tight 8|4 grid with ZERO gaps inside */
.guncha-hero-8-4__grid{
  display: grid;
  grid-template-columns: 8fr 4fr;
  gap: 0;               /* no spaces anywhere */
}
.guncha-hero-8-4__right{
  display: grid;
  grid-template-rows: auto auto;
  row-gap: 0;           /* kill the space between image & text */
}

/* kill any accidental margins */
.guncha-hero-8-4__card { margin: 0 !important; }

/* no radii, full bleed of media */
.guncha-hero-8-4__media,
.guncha-hero-8-4__card,
.guncha-hero-8-4__img,
.guncha-hero-8-4__copy{
  border-radius: 0 !important;
}
.guncha-hero-8-4__media,
.guncha-hero-8-4__card{ overflow: hidden; }

.guncha-hero-8-4__img{
  display: block; width: 100%; height: 100%; object-fit: cover;
}

/* text card styling (keeps black border but no gap from the image) */
.guncha-hero-8-4__copy{
  background: #FFF;
  border: 1.5px solid #000;
  padding: 16px 20px;
  margin: 3px!important;
  color: #000;
}

/* responsive stack */
@media (max-width: 989px){
  .guncha-hero-8-4 .page-width{ padding-left: 16px; padding-right: 16px; }
  .guncha-hero-8-4__grid{ grid-template-columns: 1fr; padding: 3.5%; }
}

/* ===== Guncha 8|4 hero — make right side a single bordered card ===== */

/* right column becomes the card */
.guncha-hero-8-4__right{
  display: grid;
  grid-template-rows: auto auto;      /* image on top, text below */
  border: 1.5px solid #000;           /* one outer border for whole block */
  background: #FFF;                   /* card background */
  overflow: hidden;                    /* hide any image overflow */
}

/* remove borders/gaps on inner pieces so they read as one entity */
.guncha-hero-8-4__card{ 
  border: 0 !important; 
  margin: 0 !important; 
}
.guncha-hero-8-4__copy{ 
  border: 0 !important;               /* no inner border */
  padding: 16px 20px;                  /* spacing inside caption */
  background: #FFF; 
}

/* image should fully span card width without creating gaps */
.guncha-hero-8-4__card img{
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* ensure there is absolutely no row-gap between image & text */
.guncha-hero-8-4__right{ row-gap: 0 !important; }

/* keep left image flush (no border) */
.guncha-hero-8-4__left .guncha-hero-8-4__media{ border: 0 !important; }

/* ===== Guncha Featured Collections Grid ===== */
.guncha-featured-collections{
  background: #FFF;
  /* padding: 40px 0px 0px 0; */
  color: #000;
  font-family: var(--guncha-font);
}

.guncha-featured-collections__group{
  /* margin-bottom: 80px; */
}

.guncha-featured-collections__header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
  position: relative;
}

.guncha-featured-collections__title{
  font-weight: 700;
  font-size: 22px;
  border: 1.5px solid #000;
  border-radius: 50px;
  padding: 14px 40px;
  background: #FFF;
}

.guncha-featured-collections__icon{
  position: absolute;
  right: 60px;
  top: -10px;
  width: 70px;
  height: auto;
}

.guncha-featured-collections__grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0; /* flush edges */
}

.guncha-featured-collections__item{
  border: 1.5px solid #000;
  background: #FFF;
}

.guncha-featured-collections__image img{
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

.guncha-featured-collections__meta{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 18px;
}

.guncha-featured-collections__product-title{
  font-weight: 700;
  font-size: 16px;
  margin: 0;
}

.guncha-featured-collections__price{
  font-size: 16px;
  font-weight: 400;
}

/* responsive stack */
@media (max-width: 989px){
  .guncha-featured-collections__grid{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 749px){
  .guncha-featured-collections__grid{ grid-template-columns: 1fr; }
}

/* Place the icon on top of the grid (not the header) */
.guncha-featured-collections__group { position: relative; }
.guncha-featured-collections__grid-wrap { position: relative; }

/* icon sits at the top-right edge of the grid, slightly overlapping */
.guncha-featured-collections__icon{
  position: absolute;
  right: 16px;
  top: -36px;            /* tweak -28/-40 to taste */
  width: 72px;
  height: auto;
  pointer-events: none;  /* purely decorative */
}

/* Remove blue color & underline from links in this section only */
.guncha-featured-collections a,
.guncha-featured-collections a:visited {
  color: #000 !important;
  text-decoration: none !important;
}
.guncha-featured-collections a:hover,
.guncha-featured-collections a:focus {
  text-decoration: none !important;
  color: #000 !important;
}

/* Keep the product title & price layout clean */
.guncha-featured-collections__product-title { margin: 0; }
.guncha-featured-collections__price { margin-left: 12px; }


.footer__content-bottom,
.footer__content-bottom .footer__copyright,
.footer__content-bottom .footer__policy-list {
  text-align: center !important;
  justify-content: center !important;
  display: flex !important;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.footer__policy-list li {
  display: inline-block!important;
}

.title-pill{
  background: #fed734!important;
}

/* ---------- MOBILE BASELINE ---------- */
@media screen and (max-width: 749px) {
  /* 1) Rich text padding */
  .rich-text__blocks,
  .section--rich-text .rich-text { 
    
            
  }

  /* 2) Hide landscape / keep horizontal hero only (see also #2 in Liquid) */
  .hero--landscape,
  .banner--landscape,
  .image--landscape { display:none !important; }

  /* 3) Bestsellers width + 4) remove/fix icons */
  .bestsellers,
  .section-bestsellers,
  .collection-list--bestsellers { max-width: 100%; padding: 0 1.2rem; }
  .bestsellers .icon,
  .section-bestsellers .icon,
  .collection-list--bestsellers .icon { display:none !important; }

  /* spacing for product cards in bestsellers */
  .bestsellers .grid,
  .collection-list--bestsellers .grid { gap: 14px; }

  /* 5) Menu is fine – no CSS needed unless you see overflow */
  .header__inline-menu { flex-wrap: wrap; }

  /* 6) Banner text sizing guard */
  .banner__heading,
  .hero__title { font-size: clamp(20px, 6vw, 28px); line-height: 1.15; }

  /* 7 + 12) Global text/image sizing */
  body { font-size: 16px; }
  h1 { font-size: clamp(22px, 6.2vw, 28px); }
  h2 { font-size: clamp(18px, 5.5vw, 24px)!important; }
  p, li { font-size: clamp(14px, 4.2vw, 16px)!important; }
  img { max-width: 100%; height: auto; }

  /* 8) Product/collection grids: ensure they wrap into multiple rows */
  .grid,
  .grid--2-col,
  .product-grid,
  .collection__grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }
  /* If cards look cramped on very small screens, drop to single column */
  @media (max-width: 380px) {
    .grid,
    .product-grid,
    .collection__grid { grid-template-columns: 1fr; }
  }

  /* 9) Help banner image improvement (contain + rounded) */
  .help-banner img { object-fit: cover; width: 100%; border-radius: 12px; }

  /* 10) Product page: remove image/details gap */
  .product .product__media,
  .product .product__info-wrapper { margin: 0; }
  .product .product__info-wrapper { padding: 12px 14px; }
  .product .product__title { margin-bottom: 8px; }

  /* 11) Coffee details table overflow */
  .coffee-details,
  .product__specs,
  .product .table-wrapper { 
    overflow-x: auto; 
    -webkit-overflow-scrolling: touch; 
  }
  .coffee-details table { width: 100%; border-collapse: collapse; }
  .coffee-details th,
  .coffee-details td { 
    font-size: 14px; 
    padding: 8px 10px; 
    white-space: nowrap; 
  }
  .coffee-details th { text-align: left; opacity: 0.85; }
}



/* ===============================
   1) Announcement bar overflow
   =============================== */
@media (max-width: 749px) {
  /* Keep everything boxed inside the viewport */
  .announcement-bar,
  .announcement-bar__inner,
  .announcement-bar__message {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Long text should wrap instead of widening the bar */
  .announcement-bar__message h5 {
    margin: 0;
    padding: 8px 12px;            /* light, symmetric padding */
    white-space: normal !important;
    overflow-wrap: anywhere; 
    font-weight: 400;     /* prevents single long words from causing overflow */
  }

  /* In case your theme set 100vw on the bar (common) */
  .announcement-bar[style*="100vw"],
  .announcement-bar__inner[style*="100vw"] {
    width: 100% !important;
  }
}

/* ===============================
   2) Rich-text block overflow
   (screenshot shows padding-right: 3em !important)
   =============================== */
@media (max-width: 749px) {
  /* Make the rich text respect page padding; remove the extra 3em */
  .rich-text__blocks {
    padding-left: 1em !important;
    padding-right: 1em !important;   /* was 3em — this caused the “poke out” */
    box-sizing: border-box !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  /* If wrapper has its own padding, keep it symmetric */
  .rich-text__wrapper.page-width {
    /* padding-left: 16px !important;
    padding-right: 16px !important; */
  }
}

/* Optional safety: prevent any straggler from creating horizontal scroll */
html, body { overflow-x: hidden; }

.product-form__input--pill input[type=radio]+label {
  font-size: 1.2rem!important;
}