/* Ramki Cards | King of Cards-inspired storefront footer | 2026-10-21 v16
   Footer only: no header / page / product / carousel rules.
   The Shop hover/tap dropdown is fed from the same active categories and budget ranges
   as the storefront header; touch/keyboard accessible through <details>.
*/
html body footer.rcf-footer {
  --rcf-ink: #17191d;
  --rcf-muted: #65666a;
  --rcf-outline: #d7d9dc;
  --rcf-wine: #7f1420;
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 76px 0 20px !important;
  background: #fff !important;
  color: var(--rcf-ink) !important;
  border-top: 1px solid #dce0e3 !important;
  box-shadow: none !important;
  font-family: 'Josefin Sans', 'Assistant', sans-serif !important;
}
html body footer.rcf-footer *,
html body footer.rcf-footer *::before,
html body footer.rcf-footer *::after { box-sizing: border-box; }
html body footer.rcf-footer .rcf-inner {
  display: block !important;
  width: calc(100% - 88px) !important;
  max-width: 1270px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: transparent !important;
}
html body footer.rcf-footer .rcf-main {
  display: grid !important;
  grid-template-columns: minmax(135px, .85fr) minmax(170px, 1fr) minmax(160px, .85fr) minmax(190px, 1.16fr) minmax(185px, 1fr) !important;
  align-items: start !important;
  gap: clamp(17px, 2.3vw, 45px) !important;
  min-height: 328px;
  padding-bottom: 42px !important;
}
html body footer.rcf-footer .rcf-brand {
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
}
html body footer.rcf-footer .rcf-brand a {
  display: inline-flex !important;
  width: 148px !important;
  max-width: 100% !important;
  height: 70px !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  background: transparent !important;
  color: inherit !important;
}
html body footer.rcf-footer .rcf-brand img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: left top !important;
  /* Match the header: render the original golden-yellow PNG without tinting. */
  filter: none !important;
  opacity: 1 !important;
  mix-blend-mode: normal !important;
  max-height: none !important;
}
html body footer.rcf-footer .rcf-col {
  min-width: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
}
html body footer.rcf-footer .rcf-col h2 {
  margin: 0 0 27px !important;
  padding: 4px 0 0 !important;
  color: #64697a !important;
  font-family: 'Josefin Sans', 'Assistant', sans-serif !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
  letter-spacing: .18em !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  text-align: left !important;
  text-shadow: none !important;
}
html body footer.rcf-footer .rcf-links {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  list-style: none !important;
  gap: 14px !important;
  margin: 0 !important;
  padding: 0 !important;
}
html body footer.rcf-footer .rcf-links li { padding: 0 !important; margin: 0 !important; list-style: none !important; }
html body footer.rcf-footer .rcf-links a,
html body footer.rcf-footer .rcf-shop-group > summary,
html body footer.rcf-footer .rcf-shop-all {
  color: var(--rcf-ink) !important;
  font-family: 'Josefin Sans', 'Assistant', sans-serif !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.3 !important;
  letter-spacing: .005em !important;
  text-transform: none !important;
  text-decoration: none !important;
  box-shadow: none !important;
  border: 0 !important;
}
html body footer.rcf-footer .rcf-links a:hover,
html body footer.rcf-footer .rcf-links a:focus-visible,
html body footer.rcf-footer .rcf-shop-all:hover,
html body footer.rcf-footer .rcf-shop-group > summary:hover { color: var(--rcf-wine) !important; }
html body footer.rcf-footer .rcf-shop-nav {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 14px !important;
  padding: 0 !important;
  margin: 0 !important;
}
html body footer.rcf-footer .rcf-shop-group {
  width: max-content;
  max-width: 100%;
  position: relative;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}
html body footer.rcf-footer .rcf-shop-group > summary {
  display: flex !important;
  width: fit-content !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
  cursor: pointer !important;
  -webkit-tap-highlight-color: transparent;
}
html body footer.rcf-footer .rcf-shop-group > summary::-webkit-details-marker { display: none; }
html body footer.rcf-footer .rcf-shop-group > summary::marker { content: ''; }
html body footer.rcf-footer .rcf-chevron {
  display: inline-block !important;
  width: 7px !important;
  height: 7px !important;
  border-right: 1px solid currentColor !important;
  border-bottom: 1px solid currentColor !important;
  transform: translateY(-2px) rotate(45deg) !important;
  transform-origin: center;
  transition: transform .18s ease;
  flex: 0 0 auto;
}
html body footer.rcf-footer .rcf-shop-group[open] > summary .rcf-chevron {
  transform: translateY(2px) rotate(225deg) !important;
}
html body footer.rcf-footer .rcf-shop-group > ul {
  position: absolute !important;
  z-index: 35 !important;
  left: -12px !important;
  top: calc(100% + 9px) !important;
  display: block !important;
  width: min(278px, calc(100vw - 36px)) !important;
  max-height: 310px !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  margin: 0 !important;
  padding: 8px 0 !important;
  background: #fff !important;
  color: var(--rcf-ink) !important;
  list-style: none !important;
  border: 1px solid #e6e1df !important;
  border-radius: 7px !important;
  box-shadow: 0 12px 35px rgba(23, 17, 13, .12) !important;
}
html body footer.rcf-footer .rcf-shop-group li {
  display: block !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
html body footer.rcf-footer .rcf-shop-group li a {
  display: block !important;
  color: #222 !important;
  padding: 10px 14px !important;
  text-decoration: none !important;
  font: 400 13px/1.35 'Josefin Sans','Assistant', sans-serif !important;
  overflow-wrap: anywhere;
}
html body footer.rcf-footer .rcf-shop-group li a:hover,
html body footer.rcf-footer .rcf-shop-group li a:focus-visible {
  background: #fff5f2 !important;
  color: var(--rcf-wine) !important;
}
html body footer.rcf-footer .rcf-social {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  padding: 0 !important;
  margin: 0 !important;
}
html body footer.rcf-footer .rcf-social a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 27px !important;
  width: 25px !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  color: #3f454c !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  text-decoration: none !important;
}
html body footer.rcf-footer .rcf-social a:hover { color: var(--rcf-wine) !important; }
html body footer.rcf-footer .rcf-social svg { display: block !important; width: 19px !important; height: 19px !important; }
html body footer.rcf-footer .rcf-google-banner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  padding: 19px 23px !important;
  margin: 0 0 22px !important;
  width: 100% !important;
  background: #fff !important;
  color: var(--rcf-ink) !important;
  border: 1px solid var(--rcf-outline) !important;
  border-radius: 16px !important;
}
html body footer.rcf-footer .rcf-google-banner strong {
  display: block !important;
  margin: 0 0 5px !important;
  font: 600 15px/1.3 'Josefin Sans','Assistant',sans-serif !important;
  color: var(--rcf-ink) !important;
}
html body footer.rcf-footer .rcf-google-banner p {
  margin: 0 !important;
  font: 400 13px/1.45 'Josefin Sans','Assistant',sans-serif !important;
  color: var(--rcf-muted) !important;
}
html body footer.rcf-footer .rcf-google-action {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 11px !important;
  flex: 0 0 auto !important;
  min-height: 43px !important;
  padding: 8px 19px !important;
  border: 1px solid var(--rcf-outline) !important;
  border-radius: 25px !important;
  background: #fff !important;
  color: #252b32 !important;
  font: 600 13px/1.2 'Josefin Sans','Assistant',sans-serif !important;
  box-shadow: 0 2px 5px #00000010 !important;
  text-decoration: none !important;
}
html body footer.rcf-footer .rcf-google-action:hover { background: #f9f9f9 !important; }
html body footer.rcf-footer .rcf-google-g { font: 700 23px/1 Arial,sans-serif !important; color:#4285f4 !important; }
html body footer.rcf-footer .rcf-bottom {
  display: flex !important;
  gap: 16px !important;
  align-items: center !important;
  justify-content: space-between !important;
  border-top: 1px solid #f0eeec !important;
  padding: 18px 0 0 !important;
  background: #fff !important;
  color: #777 !important;
}
html body footer.rcf-footer .rcf-bottom small,
html body footer.rcf-footer .rcf-bottom a {
  color: #777 !important;
  font: 400 12px/1.5 'Josefin Sans','Assistant',sans-serif !important;
  text-decoration: none !important;
}
html body footer.rcf-footer .rcf-bottom > div { display:flex; flex-wrap:wrap; justify-content:flex-end; gap: 12px 18px; }
html body footer.rcf-footer .rcf-bottom a:hover {color:var(--rcf-wine)!important;}
html body footer.rcf-footer :focus-visible { outline: 2px solid #8a1626 !important; outline-offset: 3px !important; }

@media (max-width: 1050px) {
  html body footer.rcf-footer .rcf-inner {width:calc(100% - 48px)!important;}
  html body footer.rcf-footer .rcf-main {grid-template-columns: 1.05fr 1fr 1fr 1.1fr !important; min-height: 0; gap: 32px 24px !important;}
  html body footer.rcf-footer .rcf-social {grid-column: 1 / -1;justify-content: flex-start !important;}
}
@media (max-width: 740px) {
  html body footer.rcf-footer {padding:45px 0 20px!important;}
  html body footer.rcf-footer .rcf-inner {width:calc(100% - 36px)!important;}
  html body footer.rcf-footer .rcf-main {grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 29px 18px !important; padding-bottom: 35px!important;}
  html body footer.rcf-footer .rcf-brand {grid-column: 1 / -1 !important;}
  html body footer.rcf-footer .rcf-brand a {width:130px!important;height:60px!important;}
  html body footer.rcf-footer .rcf-col h2 {margin-bottom:19px!important;}
  html body footer.rcf-footer .rcf-shop-nav,
  html body footer.rcf-footer .rcf-links {gap: 15px!important;}
  html body footer.rcf-footer .rcf-shop-group {width:100%;}
  html body footer.rcf-footer .rcf-shop-group > ul {
    position:static!important;
    width:100%!important;
    max-height: 220px !important;
    margin: 6px 0 10px!important;
    border-radius: 3px!important;
    box-shadow:none!important;
  }
  html body footer.rcf-footer .rcf-google-banner {align-items:flex-start!important; flex-direction:column!important;padding:17px!important;}
  html body footer.rcf-footer .rcf-google-action {align-self:flex-start!important;}
  html body footer.rcf-footer .rcf-bottom {align-items:flex-start!important;flex-direction:column!important;}
  html body footer.rcf-footer .rcf-bottom > div {justify-content:flex-start!important;}
}
@media (max-width: 390px) {
  html body footer.rcf-footer .rcf-main {gap: 24px 14px !important;}
  html body footer.rcf-footer .rcf-col h2 {font-size:10px!important;}
  html body footer.rcf-footer .rcf-links a,
  html body footer.rcf-footer .rcf-shop-group > summary,
  html body footer.rcf-footer .rcf-shop-all {font-size:13px!important;}
}

/* V16: match reference desktop hover popup; restore closed-state semantics.
   Desktop hover is controlled by the scoped JS; native <details> still supports
   mouse clicks, touch taps and keyboard Enter/Space. */
html body footer.rcf-footer,
html body footer.rcf-footer .rcf-inner,
html body footer.rcf-footer .rcf-main,
html body footer.rcf-footer .rcf-shop,
html body footer.rcf-footer .rcf-shop-nav {
  overflow: visible !important;
}
html body footer.rcf-footer .rcf-shop { position: relative !important; z-index: 30 !important; }
html body footer.rcf-footer .rcf-shop-group { z-index: 1 !important; }
html body footer.rcf-footer .rcf-shop-group[open] { z-index: 100 !important; }
html body footer.rcf-footer .rcf-shop-group:not([open]) > ul {
  display: none !important;
  visibility: hidden !important;
}
html body footer.rcf-footer .rcf-shop-group[open] > ul {
  display: block !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
@media (min-width: 741px) {
  html body footer.rcf-footer .rcf-shop-group > ul {
    left: 0 !important;
    top: calc(100% + 4px) !important;
    width: min(224px, calc(100vw - 36px)) !important;
    max-height: min(340px, 55vh) !important;
    overflow-y: auto !important;
    border-radius: 2px !important;
    background: #fff !important;
    box-shadow: 0 7px 18px rgba(23, 17, 13, .09) !important;
    z-index: 1000 !important;
  }
  html body footer.rcf-footer .rcf-shop-group > ul li a {
    padding: 9px 11px !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
  }
}
@media (max-width: 740px) {
  html body footer.rcf-footer .rcf-shop-group[open] > ul {
    position: static !important;
    width: 100% !important;
    margin-top: 8px !important;
    border-radius: 3px !important;
  }
}


/* v23: Footer uses the EXACT SAME unchanged yellow-gold image and contrast plate
   as the header, rather than applying an inconsistent CSS color filter. */
html body footer.rcf-footer .rcf-brand a {
  box-sizing: border-box !important;
  display: inline-flex !important;
  width: 160px !important;
  height: 64px !important;
  max-width: 100% !important;
  padding: 8px 11px !important;
  border: 1px solid #3f0c1e !important;
  border-radius: 4px !important;
  background: #3f0c1e !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 2px 5px rgba(26, 4, 12, .10) !important;
  isolation: isolate !important;
  filter: none !important;
}
html body footer.rcf-footer .rcf-brand img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}
@media (max-width: 740px) {
  html body footer.rcf-footer .rcf-brand a {
    width: 144px !important;
    height: 60px !important;
    padding: 7px 10px !important;
  }
}


/* v36 | Footer Shop dropdown: remove gold underline animation.
   Cause: assets/css/storefront.css declares `nav a::after` and
   `nav a:hover::after` globally, including the footer navigation.
   Keep the existing dropdown hover background, text color and keyboard focus outline. */
html body footer.rcf-footer nav.rcf-shop-nav .rcf-shop-group > ul li > a,
html body footer.rcf-footer nav.rcf-shop-nav .rcf-shop-group > ul li > a:hover,
html body footer.rcf-footer nav.rcf-shop-nav .rcf-shop-group > ul li > a:focus-visible {
  text-decoration: none !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}
html body footer.rcf-footer nav.rcf-shop-nav .rcf-shop-group > ul li > a::before,
html body footer.rcf-footer nav.rcf-shop-nav .rcf-shop-group > ul li > a::after,
html body footer.rcf-footer nav.rcf-shop-nav .rcf-shop-group > ul li > a:hover::after,
html body footer.rcf-footer nav.rcf-shop-nav .rcf-shop-group > ul li > a:focus-visible::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}