/*
Theme Name: Roseti Starter
Theme URI: https://example.com
Author: Local Project Setup
Description: Rossetti Caffè WordPress theme.
Version: 0.2.1
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 8.1
Text Domain: roseti-starter
*/

/* =====================================================
   DESIGN TOKENS
   ===================================================== */
:root {
  --black: #231f20;
  --gold: #85754e;
  --white: #ffffff;
  --cream: #f3f0ea;
  --cream-mid: #e9e3d3;
  --cream-light: #e1d7bb;
  --gray: #9f9e9e;
  --red: #ed1c24;
  --dark-red: #592828;

  --container: 90%;
  --gutter: 80px;

  --font: "PF Bague Sans Pro", sans-serif;
}

/* =====================================================
   RESET & BASE
   ===================================================== */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
html {
  scroll-behavior: smooth;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  /* clip (not hidden) prevents horizontal overflow WITHOUT making the page a
     scroll container — otherwise the sticky header can't stick and slides away
     on scroll, dragging any open sub-menu out from under the cursor. */
  overflow-x: clip;
}
body {
  font-family: var(--font);
  color: var(--black);
  background: var(--cream);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
body.page-template-page-company {
  background: #dcdbd9;
}
body.page-template-page-company .header-nav {
  background-color: transparent;
}

body.page-template-page-company .header-nav__menu .sub-menu {
  background: var(--cream);
}

body.page-template-page-company .site-header {
  background: transparent;
}
a {
  text-decoration: none;
  color: inherit;
}
img {
  display: block;
  max-width: 100%;
}
button {
  border: none;
  background: none;
  cursor: pointer;
  font-family: inherit;
}
ul {
  list-style: none;
}

.container {
  width: min(100%, var(--container));
  margin: auto;
}

/* =====================================================
   TYPOGRAPHY UTILITIES
   ===================================================== */
/* Fluid typography rule: clamp min is the 991px mobile value, max is the 1920px desktop value. */
.display-text {
  font-size: clamp(80px, calc(-37.341227px + 11.840689vw), 190px);
  font-weight: 700;
  line-height: 0.9;
  letter-spacing: -0.02em;
  color: var(--black);
  opacity: 0.06;
  position: absolute;
  pointer-events: none;
  user-select: none;
}

.label-tag {
  display: inline-block;
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 700;
  color: var(--gold);
  letter-spacing: 0.05em;
  margin-bottom: 12px;
}

/* =====================================================
   BUTTONS
   ===================================================== */
.btn-gold {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 16px 40px;
  background: var(--gold);
  color: var(--white);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  border-radius: 40px;
  transition:
    background 0.25s,
    transform 0.2s;
  letter-spacing: 0.03em;
}
.btn-gold:hover {
  background: #6e6040;
  transform: translateY(-1px);
}

.btn-view-more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 32px;
  background: var(--gold);
  color: var(--white);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  border-radius: 40px;
  transition: background 0.25s;
}
.btn-view-more:hover {
  background: #6e6040;
}

/* =====================================================
   HEADER
   ===================================================== */
.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: var(--white);
  box-shadow: none;
}

/* Top Bar */
.header-topbar {
  background: var(--gold);
  height: 39px;
  padding: 0;
}
.header-topbar__inner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  height: 39px;
}
.header-topbar__lang {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  color: var(--white);
  line-height: 1;
}
.header-topbar__lang a {
  color: var(--white);
  opacity: 1;
  transition: opacity 0.2s;
}
.header-topbar__lang a.active {
  color: var(--black);
  opacity: 1;
  font-weight: 400;
}
.header-topbar__lang a:hover {
  opacity: 1;
}
.header-topbar__lang span {
  color: var(--black);
  opacity: 1;
}
.header-topbar__message {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  color: var(--white);
  text-align: center;
  line-height: 1;
  white-space: nowrap;
}

/* Main Nav */
.header-nav {
  background: var(--white);
  padding: 0;
}
.header-nav__inner {
  display: grid;
  grid-template-columns: 1fr 130px 1fr;
  align-items: center;
  width: 100%;
  margin-inline: auto;
  padding-inline: 0px 0px;
  height: 145px;
  max-width: var(--container);
}

.tc-origin-slide__body {
  margin-top: 20px;
}

.header-nav__mobile-toggle {
  display: none;
}
.header-nav__mobile-panel {
  display: none;
}
.header-nav__left {
  display: flex;
  align-items: center;
}
.header-nav__menu {
  display: flex;
  align-items: center;
  gap: 40px;
}
.header-nav__menu li {
  position: relative;
}
.header-nav__menu li a {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  color: var(--black);
  letter-spacing: 0;
  transition: color 0.2s;
  display: flex;
  align-items: center;
  gap: 5px;
  line-height: 1;
}
.header-nav__menu li:not(.header-nav__eshop-item) a:hover {
  color: var(--gold);
}
.header-nav__menu li a svg {
  transition: transform 0.2s;
}
.header-nav__menu li.has-dropdown:hover a svg,
.header-nav__menu li.menu-item-has-children:hover > a::after {
  transform: rotate(180deg);
}
.header-nav__menu li.menu-item-has-children > a::after {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  transition: transform 0.2s;
}
.header-nav__menu .sub-menu {
  position: absolute;
  top: calc(100% + 16px);
  left: 0;
  min-width: 190px;
  padding: 8px;
  background: var(--white);
  border-radius: 8px;
  box-shadow: 0 18px 36px rgba(35, 31, 32, 0.14);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition:
    opacity 0.18s,
    transform 0.18s,
    visibility 0.25s;
}

/* Invisible bridge that fills the 16px gap so hover stays active
   while the mouse moves from the nav item down to the sub-menu */
.header-nav__menu .sub-menu::before {
  content: "";
  position: absolute;
  top: -16px;
  left: 0;
  right: 0;
  height: 16px;
}
.header-nav__menu .menu-item-has-children:hover > .sub-menu,
.header-nav__menu .menu-item-has-children:focus-within > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
/* No dead gap between items: contiguous rows keep hover unbroken as the
   pointer travels from one item to the next. */
.header-nav__menu .sub-menu li + li {
  margin-top: 0;
}
.header-nav__menu .sub-menu a {
  color: var(--black);
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  white-space: nowrap;
  padding: 8px 10px;
  border-radius: 6px;
}

/* Logo */
.header-nav__logo a {
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}
.header-nav__logo-img {
  display: block;
  width: 130px;
  height: 111px !important;
  object-fit: contain;
}

/* Right nav */
.header-nav__right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 40px;
}
.header-nav__menu--right {
  gap: 40px;
}
.header-nav__pro a {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  color: var(--black);
  display: flex;
  align-items: center;
  gap: 5px;
  letter-spacing: 0;
  line-height: 1;
  transition: color 0.2s;
}
.header-nav__pro a:hover {
  color: var(--gold);
}
.header-nav__eshop,
.header-nav__eshop-item > a {
  padding: 15px 25px;
  border: 1px solid var(--gold);
  color: var(--gold);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  border-radius: 10px;
  letter-spacing: 0;
  line-height: 1;
  transition:
    background 0.2s,
    color 0.2s;
}
.header-nav__eshop:hover,
.header-nav__eshop-item > a:hover {
  background: var(--gold);
  color: var(--white);
}
.header-nav__icons {
  display: flex;
  align-items: center;
  gap: 23px;
}
.icon-btn {
  width: 26px;
  height: 38px;
  padding: 0;
  color: var(--black);
  transition: color 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
}
.icon-btn svg {
  display: block;
  width: 100%;
  max-width: 36px;
  height: auto;
}
.icon-btn[aria-label="Account"],
.icon-btn[aria-label="Wishlist"],
.icon-btn[aria-label="Cart"] {
  width: 38px;
}
.icon-btn[aria-label="Account"] svg,
.icon-btn[aria-label="Wishlist"] svg,
.icon-btn[aria-label="Cart"] svg {
  max-width: 38px;
}
.icon-btn:hover {
  color: var(--gold);
}
.icon-btn svg path,
.icon-btn svg circle {
  transition: stroke 0.2s;
}
.icon-btn:hover svg path,
.icon-btn:hover svg circle {
  stroke: var(--gold);
}

/* =====================================================
   SITE BREADCRUMB (overlays first section below header)
   ===================================================== */
.site-breadcrumb {
  position: absolute;
  top: 200px;
  left: 0;
  right: 0;
  z-index: 9;
  background: transparent;
  padding: 12px 0;
  color: var(--black);
  font-family: "PF Bague Sans Pro", sans-serif;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.2;
  pointer-events: none;
}

.site-breadcrumb__inner {
  pointer-events: auto;
}

.site-breadcrumb__nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}

.site-breadcrumb__nav a,
.site-breadcrumb__nav span {
  color: inherit;
  text-decoration: none;
  font-weight: 400;
}

.site-breadcrumb__nav a:hover {
  color: var(--gold);
}

/* Hide breadcrumb on checkout — no space in the split-screen layout */
body.woocommerce-checkout .site-breadcrumb {
  display: none;
}

/* Match header text color — pages with white header nav get white breadcrumb */
.woocommerce-shop .site-breadcrumb,
.post-type-archive-product .site-breadcrumb,
body.woocommerce-cart .site-breadcrumb,
.coffee-page-template .site-breadcrumb,
.professional-page-template .site-breadcrumb,
.academy-page-template .site-breadcrumb,
.brand-page-template .site-breadcrumb,
.blog-page-template .site-breadcrumb,
.course-page-template .site-breadcrumb,
.brew-guides-template .site-breadcrumb {
  color: var(--white);
}

/* =====================================================
   HERO SECTION
   ===================================================== */
.hero-section {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.hero-slider {
  position: relative;
}
.hero-slide {
  position: relative;
  height: 100vh;
  overflow: hidden;
}
.hero-slide__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.hero-slide__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to right,
    rgba(35, 31, 32, 0.4) 0%,
    transparent 60%
  );
}
.hero-slide__content {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 0 var(--gutter) 80px;
  z-index: 2;
}
.hero-slide__title {
  font-size: clamp(60px, calc(-36.006459px + 9.687836vw), 150px);
  font-weight: 700;
  color: var(--cream-light);
  line-height: 0.9;
  text-transform: lowercase;
  letter-spacing: -0.02em;
  margin-bottom: 40px;
}
.hero-slide__cta {
  display: flex;
  align-items: center;
  gap: 24px;
}
.hero-slide__category {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  color: var(--white);
  background: rgba(35, 31, 32, 0.5);
  padding: 8px 20px;
  border-radius: 4px;
}

/* Brand slide variant */
.hero-slide__bg--contain {
  background-size: cover;
  background-position: center right;
}
.hero-slide__content--right {
  justify-content: flex-end;
  align-items: flex-end;
  padding-bottom: 80px;
}
.hero-slide__brand-info {
  max-width: 480px;
  background: rgba(35, 31, 32, 0.7);
  padding: 32px 36px;
  border-radius: 4px;
}
.hero-slide__brand-title {
  font-size: clamp(32px, calc(32px + 0vw), 32px);
  font-weight: 700;
  color: var(--white);
  margin-bottom: 12px;
}
.hero-slide__brand-desc {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.6;
  margin-bottom: 16px;
}
.hero-slide__num {
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 400;
  color: var(--gold);
}

/* Slick overrides for hero */
.hero-slider .slick-dots {
  bottom: 24px;
  right: var(--gutter);
  width: auto;
  left: auto;
  display: flex !important;
  gap: 8px;
}
.hero-slider .slick-dots li button {
  width: 8px;
  height: 8px;
  padding: 0;
}
.hero-slider .slick-dots li button::before {
  width: 8px;
  height: 8px;
  font-size: 0;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 50%;
  content: "";
  opacity: 1;
}
.hero-slider .slick-dots li.slick-active button::before {
  background: var(--white);
}

/* =====================================================
   TROPHY / USP SECTION
   ===================================================== */
.trophy-section {
  padding: 64px 0;
  background: var(--cream);
  border-bottom: 1px solid var(--cream-mid);
}
.trophy-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
}
.trophy-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 24px;
  padding: 32px 40px;
  border-right: 1px solid var(--cream-mid);
}
.trophy-item:last-child {
  border-right: none;
}
.trophy-item__icon {
  width: 66px;
  height: 66px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--cream-light);
  border-radius: 50%;
  overflow: visible;
  color: var(--gold);
}
.trophy-item__icon svg {
  width: auto;
  height: 87px;
  max-width: 90px;
  flex-shrink: 0;
}
.trophy-item__title {
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 700;
  color: var(--black);
  line-height: 1.3;
  text-align: left;
}

/* =====================================================
   THE COFFEE / CTA SECTION
   ===================================================== */
.coffee-section {
  background: var(--black);
  overflow: hidden;
}
.coffee-section__inner {
  display: grid;
  grid-template-columns: 35% 65%;
  min-height: 778px;
}
.coffee-section__image {
  position: relative;
  overflow: hidden;
}
.coffee-section__img-wrap {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.coffee-section__img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.coffee-section__video-el {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.coffee-section__content {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: start;
  padding: 80px 60px 80px 80px;
  background: var(--black);
  overflow: hidden;
}
.coffee-section__heading-bg {
  position: absolute;
  top: 40px;
  left: -20px;
  font-size: clamp(80px, calc(-37.341227px + 11.840689vw), 190px);
  font-weight: 700;
  color: var(--white);
  line-height: 0.85;
  opacity: 0.06;
  pointer-events: none;
  user-select: none;
  white-space: nowrap;
}
.coffee-section__content .label-tag {
  position: relative;
  z-index: 1;
}
.coffee-section__heading {
  font-size: clamp(60px, calc(38.665231px + 2.152853vw), 80px);
  font-weight: 900;
  color: var(--white);
  line-height: 1;
  margin-bottom: 24px;
  position: relative;
  z-index: 1;
}
.coffee-section__subheading {
  font-size: clamp(36px, calc(10.398278px + 2.583423vw), 60px);
  font-weight: 900;
  color: var(--white);
  line-height: 1.1;
  margin-bottom: 28px;
  position: relative;
  z-index: 1;
}
.coffee-section__text {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.7;
  margin-bottom: 48px;
  max-width: 520px;
  position: relative;
  z-index: 1;
}

/* =====================================================
   OUR BRANDS SECTION
   ===================================================== */
.brands-section {
  background: var(--black);
  overflow: hidden;
}
.brands-section__inner {
  display: grid;
  grid-template-columns: 29.4% 70.6%;
  min-height: 846px;
}
.brands-section__left {
  background: #000000;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 120px 60px 80px 80px;
}
.brands-section__heading {
  font-size: clamp(40px, calc(18.665231px + 2.152853vw), 60px);
  font-weight: 900;
  color: var(--white);
  line-height: 1.1;
  margin-bottom: 24px;
}
.brands-section__text {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.7;
}
.brands-right {
  display: grid;
  grid-auto-rows: 1fr;
}
.brand-row {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  min-height: 282px;
  background: var(--black);
}

/* Idle state — logo or banner centered in the band */
.brand-row__idle {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition:
    opacity 0.4s ease,
    transform 0.5s ease;
}
.brand-card__logo {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.brand-card__name {
  font-size: clamp(36px, calc(36px + 0vw), 36px);
  font-weight: 700;
  color: var(--cream);
  font-style: italic;
  letter-spacing: 0.02em;
}
.brand-card__logo-img {
  max-width: 280px;
  max-height: 60px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}

/* Hover card — slides up over the band */
.brand-row__card {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  gap: 32px;
  padding: 0 70px;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transform: translateY(24px);
  transition:
    opacity 0.45s ease,
    transform 0.45s ease,
    visibility 0s linear 0.45s;
}
.brand-row__card-body {
  position: relative;
  z-index: 2;
  flex: 0 1 460px;
  color: var(--cream);
}
.brand-row__card-title {
  font-size: clamp(24px, calc(16px + 0.7vw), 32px);
  font-weight: 900;
  line-height: 1.1;
  margin-bottom: 16px;
}
.brand-row__card-text {
  font-size: 15px;
  line-height: 1.6;
  color: rgba(243, 240, 234, 0.92);
  margin-bottom: 24px;
}
.brand-row__card-btn {
  display: inline-block;
  padding: 14px 32px;
  border-radius: 999px;
  background: var(--gold);
  color: var(--cream);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.02em;
  transition:
    background 0.25s ease,
    transform 0.25s ease;
}
.brand-row__card-btn:hover {
  background: #6f6240;
  transform: translateY(-2px);
}

@media (min-width: 992px) {
  .home .brand-row--card.brand-row--logo:hover .brand-row__card-btn,
  .home .brand-row--card.brand-row--logo.is-open .brand-row__card-btn {
    background: var(--black);
    color: var(--cream);
  }

  .home .brand-row--card.brand-row--logo:hover .brand-row__card-btn:hover,
  .home .brand-row--card.brand-row--logo.is-open .brand-row__card-btn:hover {
    background: var(--black);
  }
}

.brand-row__card-media {
  position: absolute;
  inset: 0 0 0 auto;
  width: 58%;
  z-index: 1;
  pointer-events: none;
}
.brand-row__card-media::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    90deg,
    var(--card-color, #c8102e) 0%,
    rgba(0, 0, 0, 0) 38%
  );
}
.brand-row__card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* Reveal on hover */
.brand-row--card:hover .brand-row__card {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition:
    opacity 0.45s ease,
    transform 0.45s ease,
    visibility 0s;
}
.brand-row--card:hover .brand-row__idle {
  opacity: 0;
  transform: scale(0.96);
}

.brand-card__mobile {
  display: none;
}
.brand-row__chip {
  display: none;
}
.brand-row--text {
  background: var(--black);
}
.brand-row__maison-text {
  font-size: clamp(48px, calc(22.398278px + 2.583423vw), 72px);
  font-weight: 900;
  color: var(--cream);
  letter-spacing: 0.02em;
  position: relative;
  z-index: 1;
}

/* =====================================================
   PRODUCTS SECTION
   ===================================================== */
.products-section {
  padding: 100px 0 80px;
  background: var(--cream);
}
.products-section__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 48px;
}
.products-section__heading {
  font-size: clamp(40px, calc(18.665231px + 2.152853vw), 60px);
  font-weight: 900;
  color: var(--black);
  line-height: 1;
}
.products-section__nav {
  display: flex;
  align-items: center;
  gap: 16px;
}
.products-nav-num {
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 400;
  color: var(--gold);
}

/* Product Card */
.product-card {
  padding: 0 12px;
}
.product-card__image {
  position: relative;
  background: var(--cream);
  border-radius: 12px;
  overflow: hidden;
  aspect-ratio: 3/4;
  margin-bottom: 20px;
}
.product-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s;
}
.product-card:hover .product-card__image img {
  transform: scale(1.04);
}
.product-card__wishlist {
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 2;
  width: 36px;
  height: 36px;
  background: var(--white);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.product-card__badge {
  position: absolute;
  top: 16px;
  right: 16px;
  background: var(--black);
  color: var(--white);
  font-size: clamp(12px, calc(12px + 0vw), 12px);
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 4px;
  letter-spacing: 0.05em;
}
.product-card__name {
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  font-weight: 700;
  color: var(--black);
  margin-bottom: 8px;
  line-height: 1.2;
}
.product-card__desc {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--black);
  line-height: 1.5;
  margin-bottom: 16px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.product-card__pricing {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 8px;
}
.product-card__old-price {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--gray);
  text-decoration: line-through;
}
.product-card__price {
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  font-weight: 700;
  color: var(--black);
}
.product-card__offer {
  display: flex;
  align-items: center;
  gap: 10px;
}
.product-card__discount {
  background: var(--gold);
  color: var(--white);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 4px;
}
.product-card__offer-text {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--gray);
}

.products-section__footer {
  text-align: center;
  margin-top: 56px;
}

/* Category slider wraps — only active one is visible */
.products-slider-wrap {
  display: none;
  overflow: visible;
}
.products-slider-wrap.is-active {
  display: block;
  overflow: visible;
}

/* Filter tab buttons (replaces plain <a> links) */
.products-filter-tabs button {
  cursor: pointer;
  border: none;
  font-family: var(--font);
  background: none;
  padding: 0;
}

/* Progress track — hidden on mobile, shown on desktop via @media block */
.products-progress-track {
  display: none;
}

/* =====================================================
   B2B / PROFESSIONAL SOLUTIONS SECTION
   ===================================================== */
.b2b-section {
  padding: 100px 0;
  background: transparent;
}
.b2b-section__header {
  max-width: 600px;
  margin-bottom: 60px;
}
.b2b-section__heading {
  font-size: clamp(40px, calc(18.665231px + 2.152853vw), 60px);
  font-weight: 900;
  color: var(--black);
  line-height: 1.1;
  margin-bottom: 24px;
}
.b2b-section__text {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--black);
  line-height: 1.7;
  margin-bottom: 36px;
}
.b2b-cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  height: 740px;
}
.b2b-card {
  position: relative;
  overflow: hidden;
}
.b2b-card__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform 0.5s ease;
}
.b2b-card:hover .b2b-card__bg {
  transform: scale(1.06);
}
.b2b-card__overlay {
  position: absolute;
  inset: 0;
  background: none;
  display: flex;
  align-items: flex-end;
  padding: 32px 28px;
  z-index: 3;
}
.b2b-card__overlay--light {
  background: none;
}

/* Per-card colour overlays via ::before / ::after so blend modes don't affect title text */
.b2b-cards .b2b-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

/* Card 1 – Cafe & Coffee Shops: dark solid */
.b2b-cards .b2b-card:nth-child(1)::before {
  background: rgba(35, 31, 32, 0.66);
}

/* Card 2 – Bakeries & Patisseries: cream screen blend */
.b2b-cards .b2b-card:nth-child(2)::before {
  background: #e1d7bb;
  mix-blend-mode: screen;
  opacity: 0.84;
}

/* Card 3 – Offices: dark red (exclusion + multiply) */
.b2b-cards .b2b-card:nth-child(3)::before {
  background: #592828;
  mix-blend-mode: exclusion;
}
.b2b-cards .b2b-card:nth-child(3)::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(89, 40, 40, 0.23);
  mix-blend-mode: multiply;
  z-index: 2;
  pointer-events: none;
}

/* Card 4 – Hotels: gold (color blend 36% + solid 50%) */
.b2b-cards .b2b-card:nth-child(4)::before {
  background: #85754e;
  mix-blend-mode: color;
  opacity: 0.36;
}
.b2b-cards .b2b-card:nth-child(4)::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(133, 117, 78, 0.5);
  z-index: 2;
  pointer-events: none;
}
.b2b-card__title {
  font-size: clamp(42px, calc(42px + 0vw), 42px);
  font-weight: 900;
  color: var(--white);
  line-height: 1.1;
}
.b2b-card__title--dark {
  color: var(--black);
}

.b2b-card__mobile-bg,
.b2b-card__mobile-icon,
.b2b-card__mobile-panel {
  display: none;
}

.home .b2b-section,
.home .b2b-section * {
  min-width: 0;
}

.home .b2b-section {
  overflow: hidden;
}

.home .b2b-section .container {
  display: grid;
  grid-template-columns: minmax(300px, 452px) minmax(0, 1fr);
  align-items: stretch;
}

.home .b2b-section__header,
.home .b2b-cards {
  min-width: 0;
}

.home .b2b-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  width: 100%;
}

.home .b2b-card {
  min-width: 0;
}

.home .b2b-card__title {
  max-width: calc(100% - 32px);
  overflow-wrap: anywhere;
}

/* =====================================================
   BE A PARTNER SECTION
   ===================================================== */
.partner-section {
  position: relative;
  background: var(--black);
  padding: 120px 0;
  overflow: hidden;
}
.partner-section__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0.3;
}
.partner-section .container {
  position: relative;
  z-index: 1;
}
.partner-section__content {
  max-width: 600px;
}
.partner-section__heading {
  font-size: clamp(40px, calc(18.665231px + 2.152853vw), 60px);
  font-weight: 900;
  color: var(--white);
  line-height: 1.1;
  margin-bottom: 24px;
}
.partner-section__text {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.7;
  margin-bottom: 40px;
}
.partner-section__links {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.partner-link {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--white);
  padding: 12px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  transition:
    color 0.2s,
    padding-left 0.2s;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.partner-link:hover {
  color: var(--gold);
  padding-left: 8px;
}
.partner-link--highlight {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  color: var(--gold) !important;
  border-bottom: none !important;
  margin-bottom: 16px;
  padding-left: 0 !important;
}

/* =====================================================
   PROFESSIONAL PAGE
   ===================================================== */

/* Hero */
.pf-hero {
  position: relative;
  min-height: 310px;
  background: var(--black);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.pf-hero__inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding-block: 0 50px;
}
.pf-hero__title {
  font-size: clamp(72px, calc(20.796555px + 5.166846vw), 120px);
  font-weight: 900;
  color: transparent;
  -webkit-text-stroke: 1px var(--gold);
  line-height: 0.9;
  letter-spacing: 0;
  margin: 0;
  text-align: center;
  text-transform: uppercase;
}
.pf-hero__subtitle {
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 400;
  color: rgba(255, 255, 255, 0.85);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 0;
}

.pf-hero__subtitle--center {
  text-align: center;
}

/* CTA Top Section */
.pf-cta-top {
  position: relative;
  min-height: 432px;
  overflow: hidden;
  background: var(--cream);
}
.pf-cta-top__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center center;
  z-index: 1;
}
.pf-cta-top__inner {
  position: relative;
  z-index: 2;
  padding-block: 74px 60px;
}
.pf-cta-top__heading {
  max-width: 760px;
  font-size: clamp(48px, calc(35.199139px + 1.291712vw), 60px);
  font-weight: 900;
  color: var(--black);
  line-height: 1.06;
  letter-spacing: 0;
  margin: 0 0 26px;
}
.pf-cta-top__heading span {
  color: transparent;
  -webkit-text-stroke: 1px var(--black);
}
.pf-cta-top__text {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: rgba(35, 31, 32, 0.96);
  line-height: 1.4;
  margin: 0 0 39px;
  max-width: 703px;
}
.pf-cta-top__btn {
  display: inline-block;
  min-width: 200px;
  padding: 0 34px;
  height: 60px;
  border-radius: 15px;
  background: #9f8956;
  border-color: #9f8956;
  color: var(--white);
  line-height: 60px;
  text-align: center;
}

.pf-label--light {
  color: var(--cream) !important;
  border-color: rgba(243, 240, 234, 0.4) !important;
}

/* Solutions Section */
.pf-solutions {
  --pf-solutions-gap: 42px;
  background: var(--cream);
  padding: 104px 0 108px;
}
.pf-solutions__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 60px;
  margin-bottom: 42px;
}
.pf-solutions__header-left {
  flex: 1;
  max-width: 828px;
}
.pf-solutions__title {
  font-size: clamp(42px, calc(22.798708px + 1.937567vw), 60px);
  font-weight: 900;
  color: var(--black);
  line-height: 1.1;
  letter-spacing: 0;
  margin: 0 0 26px;
}
.pf-solutions__desc {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: rgba(35, 31, 32, 0.92);
  line-height: 1.45;
  margin-top: 0;
  max-width: 828px;
}
.pf-solutions__nav {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 214px;
  padding-top: 24px;
}
.pf-solutions__counter-num {
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 400;
  color: var(--black);
  line-height: 1;
}
.pf-solutions__progress-wrap {
  display: flex;
  align-items: center;
  gap: 18px;
}
.pf-solutions__progress-track {
  position: relative;
  display: block;
  width: 214px;
  height: 1px;
  background: rgba(133, 117, 78, 0.35);
}
.pf-solutions__progress-thumb {
  position: absolute;
  left: 0;
  top: -2px;
  height: 5px;
  width: 51px;
  background: var(--black);
  border: 1px solid var(--gold);
  transition:
    width 0.35s ease,
    transform 0.35s ease;
}
.pf-solutions__slider-wrap {
  position: relative;
  padding-inline: 0px;
}
.pf-solutions__edge-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 4;
  width: 44px;
  height: 127px;
  background: var(--gold);
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  transition:
    background 0.2s ease,
    opacity 0.2s ease;
}
.pf-solutions__edge-arrow--prev {
  left: -29px;
  border-radius: 10px 0 0 10px;
}
.pf-solutions__edge-arrow--next {
  right: -30px;
  border-radius: 0px 10px 10px 0px;
}
.pf-solutions__edge-arrow:hover {
  background: #6e6040;
}
.pf-solutions__edge-arrow:disabled {
  opacity: 0.45;
}
.pf-solutions__slider {
}
.pf-solutions__slider .slick-list {
  overflow: hidden;
}
.pf-solutions__slider .slick-track {
  display: flex;
}
.pf-solutions__slider .slick-slide {
  height: inherit;
  margin: 0 15px;
  box-sizing: border-box;
}
.pf-solutions__slider .slick-slide > div,
.pf-solutions__slide {
  height: 100%;
}
.pf-card {
  position: relative;
  width: 100%;
  min-height: 505px;
  height: 505px;
  overflow: hidden;
  border-radius: 15px;
}
.pf-card__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform 0.4s ease;
}
.pf-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(35, 31, 32, 0.92) 0%,
    rgba(35, 31, 32, 0.66) 16%,
    rgba(35, 31, 32, 0.14) 42%,
    rgba(35, 31, 32, 0.12) 100%
  );
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 28px 32px 24px;
}
.pf-card__num {
  display: none;
}
.pf-card__title {
  font-size: clamp(24px, calc(15.466093px + 0.861141vw), 32px);
  font-weight: 700;
  color: var(--white);
  line-height: 1;
  margin-bottom: 12px;
  max-width: 220px;
}
.pf-card__text {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: rgba(255, 255, 255, 0.9);
  line-height: 1.08;
  max-width: 328px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.pf-card:hover .pf-card__bg {
  transform: scale(1.03);
}

/* Products section override for Professional page */
.pf-products {
  position: relative;
  background: var(--black);
  padding: 138px 0 104px;
  overflow: hidden;
}
.pf-products .container {
  position: relative;
  z-index: 2;
}
.pf-products__bg,
.pf-products__overlay {
  position: absolute;
  inset-inline: 0;
  pointer-events: none;
}
.pf-products__bg {
  inset-block: auto 0;
  height: 637px;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  opacity: 0.96;
}
.pf-products__overlay {
  inset-block: auto 0;
  height: 640px;
  background: linear-gradient(
    to bottom,
    rgba(35, 31, 32, 1) 0%,
    rgba(35, 31, 32, 0.82) 28%,
    rgba(35, 31, 32, 0.32) 70%,
    rgba(35, 31, 32, 0) 100%
  );
}
.pf-products .products-section__header {
  display: flex;
  justify-content: center;
  margin-bottom: 42px;
}
.pf-products .products-section__heading {
  font-size: clamp(46px, calc(26.798708px + 1.937567vw), 64px);
  line-height: 1.1;
  color: var(--white);
  text-align: center;
}
.pf-products .products-section__heading span {
  color: transparent;
  -webkit-text-stroke: 1px var(--white);
}
.pf-products__tabs-shell {
  display: flex;
  justify-content: center;
  margin-bottom: 64px;
}
.pf-products .products-filter-tabs {
  display: flex;
  justify-content: center;
  gap: 100px;
  flex-wrap: wrap;
}
.pf-products .products-tab-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  background: transparent;
  border: 0;
  color: var(--cream-light);
  padding: 0;
}
.pf-products__tab-icon {
  width: 110px;
  height: 110px;
  border-radius: 999px;
  background: var(--dark-red);
  display: flex;
  align-items: center;
  justify-content: center;
  transition:
    background 0.2s ease,
    transform 0.2s ease;
}
.pf-products__tab-icon svg {
  width: 42px;
  height: 42px;
  color: var(--cream-light);
  display: block;
}
.pf-products__tab-label {
  font-size: clamp(17px, calc(17px + 0vw), 17px);
  line-height: 1;
}
.pf-products .products-tab-btn.is-active .pf-products__tab-icon,
.pf-products .products-tab-btn:hover .pf-products__tab-icon {
  background: var(--gold);
}
.pf-products .products-tab-btn:hover .pf-products__tab-icon {
  transform: translateY(-1px);
}
.pf-products .products-carousel-shell {
  position: relative;
  padding-inline: 0px;
}
.pf-products .products-slider-wrap {
  display: none;
}
.pf-products .products-slider-wrap.is-active {
  display: block;
}
.pf-products .products-slider {
  margin-right: -31px;
}
.pf-products .products-slider.slick-initialized .slick-list {
  overflow: hidden;
}
.pf-products .products-slider.slick-initialized .slick-track {
  display: flex;
  align-items: stretch;
}
.pf-products .products-slider.slick-initialized .slick-slide {
  display: flex !important;
  height: auto !important;
  position: relative;
}
.pf-products .product-slide {
  padding-right: 0px;
  display: flex !important;
  align-items: stretch;
  height: auto !important;
  margin: 0 15px;
}
.pf-products .product-slide .product-card {
  flex: 1;
}
.pf-products .product-slide--has-badge .product-card {
  clip-path: url("#product-card-notch-single");
}
.pf-products .product-slide--has-badge-stack .product-card {
  clip-path: url("#product-card-notch-stack");
}
.pf-products .product-card {
  width: 100%;
  background: var(--white);
  border-radius: 12px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  filter: drop-shadow(0 2px 20px rgba(0, 0, 0, 0.14));
  min-height: 495px;
}
.pf-products .product-card__image {
  height: 288px;
  flex: 0 0 288px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 36px 28px 18px;
  position: relative;
  overflow: hidden;
  background: transparent;
  border-radius: 0;
  margin: 0;
}
.pf-products .product-card__image img {
  max-height: 228px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
  display: block;
  margin: 0 auto;
}
.pf-products .product-card__wishlist {
  position: absolute;
  top: 18px;
  left: 18px;
  width: 26px;
  height: 22px;
  background: transparent;
  border: 0;
  padding: 0;
  color: var(--black);
  z-index: 2;
}
.pf-products .product-card__wishlist svg {
  width: 100%;
  height: 100%;
}
.pf-products .product-card__badges {
  position: absolute;
  top: 0;
  right: 24px;
  z-index: 4;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-end;
  pointer-events: none;
}
.pf-products .product-card__badge {
  position: static;
  width: 70px;
  height: 60px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  border-radius: 10px;
  letter-spacing: 0;
  line-height: 1;
}
.pf-products .product-card__badge--new {
  background: var(--white);
  color: var(--black);
}
.pf-products .product-card__badge--decaf {
  background: var(--gold);
  color: var(--white);
}
.pf-products .product-card__badge--decaf svg {
  width: 35px;
  height: 35px;
}
.pf-products .product-card__body {
  flex: 1;
  padding: 22px 24px 26px;
  display: flex;
  flex-direction: column;
}
.pf-products .product-card__name {
  font-size: clamp(22px, calc(22px + 0vw), 22px);
  font-weight: 700;
  color: var(--black);
  line-height: 1.15;
  margin: 0 0 12px;
}
.pf-products .product-card__desc {
  font-size: clamp(15px, calc(15px + 0vw), 15px);
  color: rgba(35, 31, 32, 0.88);
  line-height: 1.4;
  margin: 0 0 16px;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.pf-products .product-card__pricing,
.pf-products .product-card__offer,
.pf-products .product-card__cart {
  display: none;
}
.pf-products .products-arrow {
  position: absolute;
  top: 50%;
  z-index: 8;
  width: 44px;
  height: 127px;
  border: 0;
  background: var(--gold);
  color: var(--white);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-50%);
  transition:
    background 0.2s ease,
    opacity 0.2s ease;
}
.pf-products .products-arrow:hover {
  background: #6e6040;
}
.pf-products .products-arrow:disabled {
  opacity: 0.35;
  cursor: default;
}
.pf-products .products-arrow--prev {
  left: 0;
  border-radius: 0 10px 10px 0;
}
.pf-products .products-arrow--next {
  right: 0;
  border-radius: 10px 0 0 10px;
}
.pf-products .products-arrow svg {
  width: 17px;
  height: 31px;
}
.pf-products .products-section__footer {
  display: flex;
  justify-content: center;
  margin-top: 30px;
}
.pf-products .products-nav-bottom {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.pf-products .products-nav-bottom .js-slide-current {
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  color: var(--white);
  line-height: 1;
}
.pf-products .products-progress-track {
  position: relative;
  width: 214px;
  height: 1px;
  background: rgba(255, 255, 255, 0.5);
  display: block;
}
.pf-products .products-progress-thumb {
  position: absolute;
  left: 0;
  top: -2px;
  height: 5px;
  width: 51px;
  background: var(--white);
  border: 1px solid var(--white);
  transition:
    width 0.35s ease,
    transform 0.35s ease;
  display: block;
}

/* FAQ Section */
.pf-faq {
  background: var(--cream);
  padding: 128px 0 122px;
}
.pf-faq__inner {
  display: grid;
  grid-template-columns: minmax(320px, 594px) minmax(520px, 853px);
  justify-content: space-between;
  gap: 72px;
  align-items: start;
}
.pf-faq__heading {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 0 0 52px;
  line-height: 1.1;
}
.pf-faq__heading span,
.pf-faq__heading strong {
  font-size: clamp(44px, calc(26.932185px + 1.722282vw), 60px);
  font-weight: 900;
  letter-spacing: 0;
}
.pf-faq__heading span {
  color: transparent;
  -webkit-text-stroke: 1px var(--black);
}
.pf-faq__heading strong {
  color: var(--black);
}
.pf-faq__lead {
  max-width: 594px;
  margin: 0;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--black);
  line-height: 1.25;
}
.pf-faq__items {
  display: flex;
  flex-direction: column;
}
.pf-faq__item {
  border-bottom: 1px solid rgba(133, 117, 78, 0.3);
}

.pf-faq__question {
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding: 34px 0 22px;
  background: none;
  border: none;
  cursor: pointer;
  font-family: var(--font);
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  font-weight: 700;
  color: var(--black);
  text-align: left;
}
.pf-faq__question-text {
  display: block;
  line-height: 1;
}
.pf-faq__icon {
  min-width: 25px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(35px, calc(35px + 0vw), 35px);
  font-weight: 400;
  line-height: 1;
  color: var(--gold);
  flex-shrink: 0;
}
.pf-faq__item-inner {
  padding: 0 56px 24px 0;
}
.pf-faq__answer {
  margin: 0;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--black);
  line-height: 1.25;
}

/* CTA Section */
.pf-cta {
  position: relative;
  height: 432px;
  overflow: hidden;
  background: var(--black);
}
.pf-cta__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.pf-cta__overlay {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 367px;
  background: linear-gradient(
    to bottom,
    rgba(35, 31, 32, 0) 0%,
    rgba(35, 31, 32, 1) 100%
  );
}
.pf-cta__marquee {
  position: relative;
  z-index: 1;
  height: 100%;
  display: flex;
  align-items: center;
  overflow: hidden;
}
.pf-cta__marquee-track {
  display: flex;
  align-items: center;
  width: max-content;
  gap: 48px;
  padding-bottom: 22px;
  will-change: transform;
  animation: pfCtaMarquee 28s linear infinite;
}
.pf-cta__marquee-text {
  display: inline-block;
  white-space: nowrap;
  text-transform: uppercase;
  font-size: clamp(88px, calc(11.194833px + 7.750269vw), 160px);
  font-weight: 700;
  line-height: 0.94;
  letter-spacing: 0;
  color: transparent;
  -webkit-text-stroke: 1px rgba(255, 255, 255, 0.95);
}
@keyframes pfCtaMarquee {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(calc(-25% - 12px), 0, 0);
  }
}

/* Contact Form Section */
.pf-contact {
  background: var(--black);
  padding: 0 0 114px;
}
.pf-contact__shell {
  width: 90%;
  margin: 0 auto;
  background: #a69365;
  border-radius: 30px;
}
.pf-contact__inner {
  display: grid;
  grid-template-columns: minmax(300px, 498px) minmax(620px, 856px);
  justify-content: space-between;
  gap: 94px;
  align-items: start;
  padding: 108px 71px 84px;
}
.pf-contact__heading {
  font-size: clamp(42px, calc(22.798708px + 1.937567vw), 60px);
  font-weight: 900;
  color: var(--black);
  line-height: 1.1;
  margin: 0 0 44px;
}
.pf-contact__text {
  max-width: 498px;
  margin: 0;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--black);
  line-height: 1.2;
  opacity: 0.95;
}
.pf-contact__form {
  padding-top: 4px;
}
.pf-contact__form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 46px 64px;
}
.pf-contact__field {
  position: relative;
}
.pf-contact__field::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: rgba(35, 31, 32, 0.34);
}
.pf-contact__field input,
.pf-contact__field select {
  width: 100%;
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0 0 7px;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  color: var(--black);
  font-family: var(--font);
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  line-height: 1;
}
.pf-contact__field input::placeholder,
.pf-contact__field select {
  color: var(--black);
  opacity: 1;
}
.pf-contact__field input:focus,
.pf-contact__field select:focus {
  color: var(--black);
}
.pf-contact__field:focus-within::after {
  background: rgba(35, 31, 32, 0.72);
}
.pf-contact__field select option {
  color: var(--black);
}
.pf-contact__field--email {
  grid-column: 1 / 2;
}
.pf-contact__field--select {
  padding-right: 24px;
}
.pf-contact__select-icon {
  position: absolute;
  right: 0;
  top: 2px;
  color: var(--black);
  pointer-events: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.pf-contact__submit-row {
  grid-column: 2 / 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 2px;
  gap: 24px;
}
.pf-contact__terms {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--black);
  cursor: pointer;
}
.pf-contact__terms input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.pf-contact__terms-icon {
  width: 24px;
  height: 24px;
  color: var(--black);
  flex-shrink: 0;
}
.pf-contact__terms-icon svg {
  display: block;
  width: 100%;
  height: 100%;
}
.pf-contact__terms-text {
  line-height: 1;
}
.pf-contact__send {
  background: transparent;
  border: 0;
  color: var(--white);
  font-family: var(--font);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  letter-spacing: 0;
  padding: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.pf-contact__send:hover {
  color: rgba(255, 255, 255, 0.82);
}

/* Responsive — 3-slide layout (before tablet) */
@media (max-width: 1600px) {
  .pf-solutions {
    --pf-solutions-gap: 30px;
  }
}

/* Responsive — tablet */
@media (max-width: 1024px) {
  .pf-cta-top {
    min-height: 0;
  }
  .pf-cta-top__inner {
    padding-block: 56px 52px;
  }
  .pf-cta-top__heading {
    max-width: 620px;
    font-size: clamp(38px, calc(23.065662px + 1.506997vw), 52px);
  }
  .pf-cta-top__text {
    max-width: 560px;
  }
  .pf-solutions {
    --pf-solutions-gap: 24px;
  }
  .pf-solutions__header {
    flex-direction: column;
    gap: 24px;
  }
  .pf-solutions__nav {
    width: 100%;
    justify-content: flex-start;
    padding-top: 0;
  }
  .pf-solutions__progress-track {
    width: 180px;
  }
  .pf-solutions__edge-arrow {
    width: 40px;
    height: 96px;
  }
  .pf-solutions__edge-arrow--prev {
    left: 10px;
  }
  .pf-solutions__edge-arrow--next {
    right: 10px;
  }
  .pf-card {
    min-height: 440px;
    height: 440px;
  }
  .pf-card__overlay {
    padding: 24px 26px 22px;
  }
  .pf-card__text {
    font-size: clamp(14px, calc(14px + 0vw), 14px);
    line-height: 1.2;
    -webkit-line-clamp: 4;
  }
  .pf-products {
    padding: 112px 0 80px;
  }
  .pf-products__bg {
    height: 540px;
    background-position: center 54%;
  }
  .pf-products__overlay {
    height: 420px;
  }
  .pf-products .products-filter-tabs {
    gap: 20px;
  }
  .pf-products__tab-icon {
    width: 92px;
    height: 92px;
  }
  .pf-products .products-carousel-shell {
    padding-inline: 34px;
  }
  .pf-products .products-slider {
    margin-right: -18px;
  }
  .pf-products .product-slide {
    padding-right: 18px;
  }
  .pf-products .product-card__image {
    height: 246px;
    flex-basis: 246px;
  }
  .pf-products .products-arrow {
    width: 38px;
    height: 96px;
  }
  .pf-faq__inner {
    grid-template-columns: 1fr;
    gap: 48px;
  }
  .pf-faq {
    padding: 96px 0 88px;
  }
  .pf-faq__heading {
    margin-bottom: 32px;
  }
  .pf-faq__question {
    font-size: clamp(24px, calc(24px + 0vw), 24px);
    padding: 28px 0 20px;
  }
  .pf-faq__item-inner {
    padding-right: 24px;
  }
  .pf-contact__inner {
    grid-template-columns: 1fr;
    gap: 44px;
    padding: 64px 40px 56px;
  }
  .pf-cta__inner {
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
  }
  .pf-cta {
    height: 360px;
  }
  .pf-cta__overlay {
    height: 300px;
  }
  .pf-cta__marquee-track {
    gap: 36px;
    padding-bottom: 18px;
  }
  .pf-cta__marquee-text {
    font-size: clamp(70px, calc(16.663079px + 5.382131vw), 120px);
  }
}

/* Responsive — mobile */

.professional-page-template .rs-shop-card__old,
.professional-page-template .rs-shop-card__price,
.professional-page-template .rs-shop-card__offer {
  display: none;
}

/* =====================================================
   AWARDS SECTION
   ===================================================== */
.awards-section {
  padding: 80px 0;
  background: var(--cream);
}

.container-ext{
    width: 100%;
}


.awards-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px;
}
.award-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
}
.award-item__image {
  width: 130px;
  height: 130px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.award-item__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.award-item__title {
  font-size: clamp(32px, calc(32px + 0vw), 32px);
  font-weight: 700;
  color: var(--gold);
  line-height: 1.2;
}

/* =====================================================
   BLOG / LATEST NEWS SECTION
   ===================================================== */
.blog-section {
  background: var(--cream);
  overflow: hidden;
}
.blog-section__inner {
  display: grid;
  grid-template-columns: 26% 74%;
  min-height: 700px;
}
.blog-section__left {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 100px 40px 100px 80px;
  gap: 0;
}
.blog-section__left .label-tag {
  margin-bottom: 16px;
}
.blog-section__heading {
  font-size: clamp(40px, calc(18.665231px + 2.152853vw), 60px);
  font-weight: 900;
  color: var(--black);
  line-height: 1;
  margin-bottom: 24px;
}
.blog-section__intro {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--black);
  line-height: 1.6;
  margin-bottom: 48px;
}
.blog-grid {
  display: grid;
  grid-template-columns: 505fr 393fr 393fr;
  column-gap: 35px;
  row-gap: 0;
  align-items: start;
}
.blog-card {
  position: relative;
  border-radius: 15px;
  overflow: hidden;
  background: var(--cream);
}
.blog-card:nth-child(1) {
  height: 491px;
}
.blog-card:nth-child(2) {
  height: 505px;
  margin-top: 91px;
}
.blog-card:nth-child(3) {
  height: 382px;
}

.blog-card__inner {
  position: absolute;
  inset: 0;
  /* Default notch — fits 60×60 button with ~8px inner breathing room.
     Envelope ~78×78 px. 15 points for smooth transition to hover state. */
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - 78px),
    calc(100% - 1px) calc(100% - 73px),
    calc(100% - 5px) calc(100% - 69px),
    calc(100% - 10px) calc(100% - 68px),
    calc(100% - 58px) calc(100% - 68px),
    calc(100% - 63px) calc(100% - 67px),
    calc(100% - 67px) calc(100% - 63px),
    calc(100% - 68px) calc(100% - 58px),
    calc(100% - 68px) calc(100% - 10px),
    calc(100% - 69px) calc(100% - 5px),
    calc(100% - 73px) calc(100% - 1px),
    calc(100% - 78px) 100%,
    0 100%
  );
  border-radius: inherit;
  transition:
    transform 0.35s ease,
    clip-path 0.35s ease;
}
.blog-card:hover .blog-card__inner {
  /* Expanded notch on hover — fits 150×60 button with same 8px gap.
     Envelope ~168×78 px. Same 15 points for smooth transition. */
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - 78px),
    calc(100% - 1px) calc(100% - 73px),
    calc(100% - 5px) calc(100% - 69px),
    calc(100% - 10px) calc(100% - 68px),
    calc(100% - 148px) calc(100% - 68px),
    calc(100% - 153px) calc(100% - 67px),
    calc(100% - 157px) calc(100% - 63px),
    calc(100% - 158px) calc(100% - 58px),
    calc(100% - 158px) calc(100% - 10px),
    calc(100% - 159px) calc(100% - 5px),
    calc(100% - 163px) calc(100% - 1px),
    calc(100% - 168px) 100%,
    0 100%
  );
}
.blog-card__image {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform 0.5s;
}
.blog-card:hover .blog-card__image {
  transform: scale(1.05);
}
.blog-card__body {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.75) 0%,
    rgba(0, 0, 0, 0.45) 35%,
    rgba(0, 0, 0, 0.1) 60%,
    transparent 100%
  );
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 28px;
}
.blog-card__title {
  font-size: clamp(20px, calc(7.199139px + 1.291712vw), 32px);
  font-weight: 700;
  color: var(--white);
  line-height: 1.2;
  margin-bottom: 16px;
}
.blog-card__btn {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  width: 60px;
  height: 60px;
  padding: 0 14px;
  background: var(--gold);
  border-radius: 10px;
  overflow: hidden;
  transition:
    width 0.35s ease,
    background 0.2s ease;
  color: var(--white);
}
.blog-card:hover .blog-card__btn {
  width: 150px;
}
.blog-card__btn-text {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  color: var(--white);
  white-space: nowrap;
  opacity: 0;
  max-width: 0;
  overflow: hidden;
  transition:
    opacity 0.35s ease,
    max-width 0.35s ease;
}
.blog-card:hover .blog-card__btn-text {
  opacity: 1;
  max-width: 120px;
}
.blog-card__btn svg {
  flex-shrink: 0;
  width: 32px;
  height: 22px;
}

/* =====================================================
   UPPER FOOTER — YOUR EVERYDAY RITUAL
   ===================================================== */
.upper-footer {
  position: relative;
  background: var(--black);
  overflow: hidden;
  padding: 120px 0;
  min-height: 440px;
  display: flex;
  align-items: center;
}
.upper-footer__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0.25;
}
.upper-footer__inner {
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.upper-footer__marquee {
  display: flex;
  width: max-content;
  margin: 0;
  animation: upper-footer-marquee 18s linear infinite;
}
.upper-footer__text {
  display: inline-block;
  flex: 0 0 auto;
  padding-right: clamp(48px, 6vw, 120px);
  font-size: clamp(14px, calc(-141.743811px + 15.715823vw), 160px);
  font-weight: 700;
  color: var(--white);
  line-height: 0.9;
  text-transform: uppercase;
  letter-spacing: -0.02em;
  white-space: nowrap;
}

@keyframes upper-footer-marquee {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-50%, 0, 0);
  }
}

/* =====================================================
   FOOTER
   ===================================================== */
.site-footer {
  background: #231f20;
  color: var(--white);
}

.footer-main {
  min-height: 324px;
  padding: 60px 0px 31px 0px;
  width: 90%;
  margin: auto;
}

.footer-shell {
  width: 100%;
  max-width: 1791px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 76px;
}

.footer-top,
.footer-middle,
.footer-bottom {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

.footer-logo {
  display: block;
  flex-shrink: 0;
}

.footer-logo img {
  width: 129.89px;
  height: 110.785px;
  display: block;
}

.footer-social {
  display: flex;
  align-items: center;
  gap: 29px;
}

.footer-social__link {
  width: 22px;
  height: 22px;
  display: block;
  transition: opacity 0.2s;
}

.footer-social__link img {
  width: 22px;
  height: 22px;
  display: block;
}

.footer-social__link:hover {
  opacity: 0.7;
}

.footer-copy {
  font-size: clamp(12px, calc(12px + 0vw), 12px);
  font-weight: 400;
  line-height: 1;
  color: var(--white);
  margin: 0;
}

.footer-newsletter {
  display: flex;
  align-items: flex-start;
  gap: 68px;
}

.footer-newsletter__title {
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  font-weight: 700;
  color: var(--white);
  line-height: 1;
  margin: 0;
}

.footer-newsletter__form {
  display: flex;
  align-items: flex-start;
  gap: 24px;
}

.footer-newsletter__fields {
  width: 450px;
  display: flex;
  flex-direction: column;
  gap: 11px;
}

.footer-newsletter__input-wrap {
  min-height: 31px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.55);
  display: flex;
  align-items: flex-start;
}

.footer-newsletter__input-wrap label {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1;
  color: var(--white);
  margin: 0;
}

.footer-newsletter__input-wrap input {
  width: 100%;
  background: none;
  border: none;
  outline: none;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-family: var(--font);
  color: var(--white);
  line-height: 1;
  padding: 0;
}

.footer-newsletter__input-wrap input::placeholder {
  color: rgba(255, 255, 255, 0.8);
  opacity: 1;
}

.footer-newsletter__message {
  margin: 0;
  font-size: clamp(13px, calc(13px + 0vw), 13px);
  line-height: 1.3;
  color: rgba(255, 255, 255, 0.85);
}

.footer-newsletter__message:empty {
  display: none;
}

.footer-newsletter__message.is-error {
  color: #f2a58f;
}

.footer-newsletter__message.is-success {
  color: #9be6a0;
}

.footer-newsletter__submit {
  width: 51.875px;
  height: 51.875px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  margin-top: -4px;
}

.footer-newsletter__submit img {
  width: 44px;
  height: 44px;
  display: block;
  transform: rotate(11.48deg);
}

.footer-newsletter__checkbox {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  font-weight: 400;
  line-height: 1;
  color: var(--white);
  cursor: pointer;
}

.footer-newsletter__checkbox img {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.footer-nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 76px;
  padding: 25px 0 0;
}

.footer-nav a {
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 700;
  color: var(--white);
  line-height: 1;
  letter-spacing: 0;
  white-space: nowrap;
  transition: color 0.2s;
}

.footer-nav a:hover {
  color: var(--gold);
}

.footer-bottom {
  align-items: center;
  margin-top: -38px;
}

.footer-bottom__links {
  display: flex;
  align-items: center;
  gap: 87px;
}

.footer-bottom__links a {
  font-size: clamp(12px, calc(12px + 0vw), 12px);
  font-weight: 400;
  line-height: 1;
  color: var(--white);
  white-space: nowrap;
  transition: color 0.2s;
}

.footer-bottom__links a:hover {
  color: var(--white);
}

@media (max-width: 1550px) {
  .footer-nav {
    gap: 42px;
  }
  .footer-nav a {
    font-size: clamp(15px, calc(15px + 0vw), 15px);
  }
  .footer-bottom__links {
    gap: 42px;
  }
}

/* =====================================================
   RESPONSIVE
   ===================================================== */
@media (max-width: 1200px) {
  :root {
    --gutter: 48px;
  }
  .header-nav__menu {
    gap: 24px;
  }
  .b2b-cards {
    grid-template-columns: repeat(2, 1fr);
    height: auto;
  }
  .b2b-card {
    height: 370px;
  }
  .brands-section__inner {
    grid-template-columns: 35% 65%;
  }
  .blog-section__inner {
    grid-template-columns: 30% 70%;
  }
  .footer-main {
    padding-inline: 48px;
  }
  .footer-newsletter {
    gap: 44px;
  }
  .footer-newsletter__fields {
    width: 390px;
  }
  .footer-nav {
    gap: 28px;
  }
  .footer-bottom__links {
    gap: 28px;
  }
}

/* =====================================================
   THE COFFEE PAGE TEMPLATE
   ===================================================== */
.tc-page {
  background: var(--cream);
  color: var(--black);
  overflow: hidden;
}

.tc-container {
  width: min(100%, var(--container));
  margin-inline: auto;
}

.tc-kicker {
  display: block;
  color: var(--gold);
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 700;
  margin-bottom: 16px;
  text-transform: none;
}

.tc-quality .tc-kicker {
  color: var(--gold);
}

.tc-copy h2,
.tc-quality h2,
.tc-training h2,
.tc-sustainability h2,
.tc-awards h2 {
  font-size: clamp(42px, calc(22.798708px + 1.937567vw), 60px);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin-bottom: 28px;
}

.tc-copy h2 span,
.tc-quality h2 span,
.tc-training h2 span,
.tc-sustainability h2 span {
  color: transparent;
  -webkit-text-stroke: 1px black;
}

.tc-awards h2 span {
  color: transparent;
  -webkit-text-stroke: 1px white;
}

.tc-quality h2 {
  color: var(--white);
}

.tc-quality h2 span {
  -webkit-text-stroke: 2px var(--white);
}

.tc-page p {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.62;
}

.tc-hero {
  position: relative;
  min-height: 245px;
  background: var(--black);
}

.tc-breadcrumb {
  color: var(--white);
  margin-bottom: 44px;
}

.tc-breadcrumb a,
.tc-breadcrumb span {
  color: inherit;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.6;
}

.tc-breadcrumb a:hover {
  color: var(--gold);
}

.tc-hero__title {
  color: transparent;
  -webkit-text-stroke: 2.5px var(--gold);
  font-size: clamp(64px, calc(14.930032px + 4.951561vw), 110px);
  font-weight: 700;
  line-height: 0.94;
  text-align: center;
  text-transform: uppercase;
  padding-top: 65px;
}

.tc-section-nav {
  position: sticky;
  top: 184px;
  z-index: 800;
  display: flex;
  justify-content: center;
  gap: clamp(34px, 4.05vw, 78px);
  height: 60px;
  margin-inline: auto;
  padding: 0 34px;
  background: var(--black);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.tc-section-nav a {
  position: relative;
  display: inline-flex;
  align-items: center;
  color: var(--white);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  text-transform: uppercase;
  white-space: nowrap;
  transition: color 0.2s;
}

.tc-section-nav a:not(:last-child)::after {
  content: "";
  position: absolute;
  right: calc(clamp(34px, 4.05vw, 78px) * -0.5);
  top: 50%;
  width: 1px;
  height: 24px;
  background: rgba(255, 255, 255, 0.72);
  transform: translateY(-50%);
}

.tc-section-nav a:hover {
  color: var(--gold);
}

.tc-sourcing {
  padding: 0 0 120px;
}

.tc-sourcing__grid {
  display: grid;
  grid-template-columns: minmax(0, 589px) minmax(0, 895px);
  column-gap: clamp(120px, 15.78vw, 303px);
  align-items: start;
  max-width: none;
  margin-inline: auto;
  padding-inline: 0;
}

.tc-sourcing .tc-copy {
  padding-top: 162px;
}

.tc-sourcing .tc-kicker {
  margin-bottom: 29px;
}

.tc-sourcing .tc-copy h2 {
  margin-bottom: 43px;
}

.tc-sourcing .tc-copy p {
  max-width: 589px;
}

.tc-copy p + p {
  margin-top: 18px;
}

.tc-hero-card {
  width: 100%;
  height: 551px;
  min-height: 0;
  border-radius: 0px 0px 15px 15px;
  overflow: hidden;
}

.tc-hero-card img,
.tc-quality__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.tc-hero-card img {
  object-position: center;
}

/* Mobile sliders — hidden on desktop */
.tc-origin-slider {
  display: none;
}
.tc-roast-counter {
  display: none;
}

.tc-origin-map {
  position: relative;
  width: 85%;
  aspect-ratio: 1678 / 779;
  margin: 72px auto 0;
  min-height: auto;
}

.tc-map {
  position: absolute;
  left: 18.24%;
  top: 1.45%;
  width: 56.34%;
  height: 90.42%;
  object-fit: contain;
  opacity: 1;
  pointer-events: none;
}

.tc-origin-line {
  position: absolute;
  z-index: 1;
  pointer-events: none;
  object-fit: fill;
}

.tc-origin-line--colombia {
  left: 18.24%;
  top: 7.06%;
  width: 14.66%;
  height: 39.02%;
}

.tc-origin-line--brazil {
  left: 17.1%;
  top: 67.65%;
  width: 16.39%;
  height: 5.91%;
}

.tc-origin-line--ethiopia {
  left: 56.65%;
  top: 44.1%;
  width: 17.75%;
  height: 15.5%;
  transform: scaleX(-1);
  transform-origin: center;
}

.tc-origin-line--indonesia {
  left: 49.8%;
  top: 75.6%;
  width: 15.1%;
  height: 17.5%;
}

.tc-origin-card {
  position: absolute;
  z-index: 2;
  width: 29.8%;
  min-height: 25.3%;
  pointer-events: none;
}

.tc-origin-card--colombia {
  left: 0;
  top: 0;
}

.tc-origin-card--brazil {
  left: 1.91%;
  top: 60.46%;
  width: 23.9%;
  min-height: 26.1%;
}

.tc-origin-card--ethiopia {
  left: 74.26%;
  top: 25.67%;
  width: 25.75%;
  min-height: 25.29%;
}

.tc-origin-card--indonesia {
  left: 64.9%;
  top: 74.71%;
}

.tc-origin-card__image {
  position: absolute;
  left: 0;
  top: 0;
  width: 39.6%;
  aspect-ratio: 1;
  border-radius: 15px;
  overflow: hidden;
  box-shadow: -25px 25px 36.9px -3px rgba(0, 0, 0, 0.17);
}

.tc-origin-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.tc-origin-card__label {
  position: absolute;
  left: 25.6%;
  top: 17.1%;
  min-width: 32.8%;
  height: 21.8%;
  padding: 0 11px;
  background: #e1d7bb;
  color: var(--gold);
  display: flex;
  align-items: center;
  justify-content: center;
}

.tc-origin-card h3 {
  font-size: clamp(14px, calc(2.265877px + 1.184069vw), 25px);
  color: inherit;
  margin: 0;
  line-height: 1;
  font-weight: 700;
  text-transform: capitalize;
  white-space: nowrap;
}

.tc-origin-card p {
  position: absolute;
  left: 42.2%;
  top: 61.4%;
  width: 39.6%;
  margin: 0;
  font-size: clamp(11px, calc(8.866523px + 0.215285vw), 13px);
  line-height: 1.45;
  color: var(--gold);
}

.tc-origin-card--brazil .tc-origin-card__image {
  width: 49.1%;
  height: 97.5%;
}

.tc-origin-card--brazil .tc-origin-card__label {
  left: 31.7%;
  top: 15.8%;
  min-width: 29.4%;
}

.tc-origin-card--brazil p {
  left: 53.9%;
  top: 64%;
  width: 46.1%;
}

.tc-origin-card--ethiopia .tc-origin-card__image {
  left: 5.3%;
  width: 45.8%;
  height: 100%;
}

.tc-origin-card--ethiopia .tc-origin-card__image img {
  position: absolute;
  left: -79.95%;
  top: 0.12%;
  width: 221.35%;
  height: 124.51%;
  max-width: none;
  object-fit: fill;
}

.tc-origin-card--ethiopia .tc-origin-card__label {
  left: 0;
  top: 60.9%;
  min-width: 36.6%;
}

.tc-origin-card--ethiopia p {
  left: 55.1%;
  top: 63.1%;
  width: 44.9%;
}

.tc-origin-card--indonesia .tc-origin-card__image {
  left: 6.4%;
  width: 39.6%;
  height: 100%;
}

.tc-origin-card--indonesia .tc-origin-card__image img {
  position: absolute;
  left: -79.95%;
  top: 0.12%;
  width: 221.35%;
  height: 124.51%;
  max-width: none;
  object-fit: fill;
}

.tc-origin-card--indonesia .tc-origin-card__label {
  left: 0;
  top: 60.4%;
  min-width: 32%;
}

.tc-origin-card--indonesia p {
  left: 49.4%;
  top: 62.9%;
  width: 50.6%;
}

.tc-roasting {
  padding: 0 0 110px;
}

.tc-roast-panel {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 513px;
  padding: 88px 64px;
  background: var(--black);
  color: var(--white);
  border-radius: 15px;
  overflow: hidden;
}

.tc-roast-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      90deg,
      rgba(20, 18, 16, 0.92) 0%,
      rgba(20, 18, 16, 0.85) 31%,
      rgba(20, 18, 16, 0.48) 55%,
      rgba(20, 18, 16, 0.14) 100%
    ),
    radial-gradient(
      circle at 14% 42%,
      rgba(255, 255, 255, 0.1),
      transparent 30%
    );
  z-index: 1;
}

.tc-roast-panel__media {
  position: absolute;
  inset: 0;
}

.tc-roast-panel__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scaleY(-1) rotate(180deg);
}

.tc-roast-panel__copy {
  position: relative;
  z-index: 2;
  width: min(100%, 505px);
}

.tc-roast-panel .tc-kicker {
  margin-bottom: 22px;
  text-transform: none;
  letter-spacing: 0;
}

.tc-roast-panel h2 {
  font-size: clamp(42px, calc(22.798708px + 1.937567vw), 60px);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: 0;
  margin-bottom: 28px;
}

.tc-roast-panel h2 span {
  color: transparent;
  -webkit-text-stroke: 1px rgba(255, 255, 255, 0.72);
}

.tc-roast-panel p {
  max-width: 501px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.94);
}

.tc-roast-panel p + p {
  margin-top: 18px;
}

.tc-roast-levels {
  display: grid;
  grid-template-columns: repeat(4, 318px);
  justify-content: space-between;
  gap: clamp(36px, 4.85vw, 94px);
  width: min(100%, 1552px);
  min-height: 660px;
  margin: 70px auto 0;
}

.tc-roast-card {
  position: relative;
  width: min(318px, 100%);
  height: auto;
  aspect-ratio: 318 / 660;
  text-align: center;
}

.tc-roast-card::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 35.15%;
  z-index: 0;
  width: 104.4%;
  height: 64.85%;
  background: var(--cream-light);
  border-radius: 15px;
  opacity: 0;
  transform: translateX(-50%);
  transition: opacity 0.2s ease;
}

.tc-roast-card__beans {
  position: absolute;
  left: 50%;
  top: 0;
  z-index: 2;
  width: 100%;
  height: 70.91%;
  max-width: none;
  object-fit: contain;
  mix-blend-mode: darken;
  transform: translateX(-50%);
  transition: transform 0.2s ease;
}

.tc-roast-swatch {
  position: absolute;
  left: 50%;
  top: 71.82%;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18.24%;
  aspect-ratio: 1;
  height: auto;
  border-radius: 10px;
  transform: translateX(-50%);
  transition: top 0.2s ease;
}

.tc-roast-swatch img {
  width: 52%;
  height: 59%;
  object-fit: contain;
}

.tc-roast-card h3 {
  position: absolute;
  left: 50%;
  top: 84.24%;
  z-index: 3;
  width: max-content;
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  line-height: 1;
  margin: 0;
  transform: translateX(-50%);
  transition: top 0.2s ease;
}

.tc-roast-card__note {
  position: absolute;
  left: 50%;
  top: 90%;
  z-index: 3;
  width: max-content;
  max-width: 97%;
  margin: 0;
  color: var(--gold);
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 700;
  line-height: 1;
  transform: translateX(-50%);
  transition: top 0.2s ease;
}

.tc-roast-card__detail {
  position: absolute;
  left: 50%;
  top: 82.42%;
  z-index: 3;
  width: 91.51%;
  margin: 0;
  color: var(--black);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.16;
  opacity: 0;
  transform: translateX(-50%);
  transition: opacity 0.18s ease;
}

.tc-roast-card:hover::before {
  opacity: 1;
}

.tc-roast-card:hover .tc-roast-swatch {
  top: 31.06%;
}

.tc-roast-card:hover h3 {
  top: 70.91%;
}

.tc-roast-card:hover .tc-roast-card__note {
  top: 76.67%;
}

.tc-roast-card:hover .tc-roast-card__detail {
  opacity: 1;
}

@media (min-width: 1451px) and (max-width: 1700px) {
  .coffee-page-template .tc-roast-levels {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(24px, 2.35vw, 40px);
    width: 100%;
  }

  .coffee-page-template .tc-roast-card {
    width: min(318px, 100%);
    justify-self: center;
  }
}

.tc-quality {
  padding: 58px 0 0;
  background: var(--cream);
  padding-bottom: 157px;
}

.tc-quality__stage {
  position: relative;
  width: 90%;
  min-height: 884px;
  margin: 0 auto;
}

.tc-quality__panel {
  position: absolute;
  top: 0;
  right: 0;
  width: 1669px;
  max-width: 93.24%;
  height: 543px;
  background: var(--black);
  color: var(--white);
  border-radius: 30px;
  overflow: hidden;
}

.tc-quality__copy {
  position: absolute;
  left: 52.4%;
  top: 110px;
  z-index: 2;
  width: 485px;
  max-width: 31%;
}

.tc-quality__copy .tc-kicker {
  margin-bottom: 24px;
}

.tc-quality__copy p {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.18;
  color: var(--white);
  margin: 0;
}

.tc-quality__copy p + p {
  margin-top: 20px;
}

.tc-quality__beans {
  position: absolute;
  top: 0;
  right: 0;
  width: 365px;
  height: 543px;
  border-radius: 30px;
  overflow: hidden;
  mix-blend-mode: lighten;
}

.tc-quality__beans img {
  position: absolute;
  left: 0;
  top: -37.94%;
  width: 144.86%;
  height: 146.04%;
  max-width: none;
  object-fit: fill;
}

.tc-quality__image {
  position: absolute;
  left: 0;
  top: 115px;
  z-index: 3;
  width: 864px;
  height: 769px;
  max-width: 48.27%;
  border-radius: 30px;
  box-shadow: 24px -22px 37.1px rgba(0, 0, 0, 0.22);
  object-fit: cover;
}

.tc-quality-steps {
  position: absolute;
  left: 52.4%;
  right: 0;
  top: 611px;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 92px;
  row-gap: 64px;
  margin: 0;
  padding: 0;
  background: transparent;
  border-radius: 0;
}

.tc-quality-steps article {
  position: relative;
  display: grid;
  grid-template-columns: 47px minmax(0, 1fr);
  gap: 28px;
  align-items: start;
  min-width: 0;
  padding: 0;
}

.tc-quality-steps span {
  display: flex;
  align-items: center;
  justify-content: center;
  place-items: center;
  width: 47px;
  height: 47px;
  background: var(--cream-light);
  border-radius: 10px;
}

.tc-quality-steps span img {
  width: 31px;
  height: 35px;
  object-fit: contain;
}

.tc-quality-steps h3 {
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  font-weight: 700;
  line-height: 1;
  margin: 0 0 17px;
  color: var(--black);
}

.tc-quality-steps p {
  width: min(100%, 288px);
  margin: 0;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.15;
  color: var(--black);
}

.tc-training {
  padding: 0;
  background: var(--cream-light);
}

.tc-training__stage {
  position: relative;
  width: 90%;
  min-height: min(1028px, 53.51vw);
  margin: 0 auto;
  background: var(--cream-light);
  overflow: hidden;
}

.tc-training__intro {
  position: absolute;
  left: 3.38%;
  top: 12.94%;
  width: 33.16%;
  max-width: 40%;
  margin: 0;
}

.tc-training__intro {
  position: absolute;
  left: 0;
  top: 12.94%;
  width: 36.16%;
  max-width: 40%;
  margin: 0;
}

.tc-training__intro .tc-kicker {
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 700;
  line-height: 1;
  margin-bottom: 18px;
  text-transform: none;
}

.tc-training__intro h2 {
  font-size: clamp(48px, calc(35.199139px + 1.291712vw), 60px);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: 0;
  margin-bottom: 35px;
}

.tc-training__intro p {
  width: 100%;
  max-width: 100%;
  margin: 0;
  color: var(--black);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1.18;
}

.tc-training__intro p + p {
  margin-top: 20px;
}

.tc-training__pour {
  position: absolute;
  left: 0;
  top: 46.11%;
  width: 45.32%;
  height: 39.98%;
  border-radius: 30px;
  overflow: hidden;
}

.tc-training__pour img {
  position: absolute;
  left: -0.18%;
  top: -12.9%;
  width: 103.12%;
  height: 136.01%;
  max-width: none;
  object-fit: fill;
}

.tc-training__baristas {
  position: absolute;
  left: 49.95%;
  top: 12.94%;
  width: 49.64%;
  height: 73.15%;
  max-width: none;
  object-fit: fill;
}

.tc-training__card-copy {
  position: absolute;
  left: 72.31%;
  top: 66.15%;
  width: 27%;
  color: var(--black);
}

.tc-training__card-copy h3 {
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  font-weight: 700;
  line-height: 1;
  margin: 0 0 clamp(18px, 1.77vw, 34px);
}

.tc-training__card-copy p {
  margin: 0;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1.18;
}

.tc-training__card-copy p + p {
  margin-top: 20px;
}

.tc-sustainability {
  padding: 0 0 95px;
  background: var(--cream);
}

.tc-sustainability > img {
  width: 100%;
  height: 188px;
  object-fit: cover;
  margin-bottom: 86px;
}

.tc-sustainability__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.12fr);
  gap: 90px;
}

.tc-sustainability__grid p + p {
  margin-top: 18px;
}

.tc-awards {
  position: relative;
  min-height: 516px;
  display: flex;
  align-items: center;
  color: var(--white);
}

.tc-awards__bg {
  position: absolute;
  inset: 0;
  background: var(--black);
}

.tc-awards__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.72;
}

.tc-awards__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(35, 31, 32, 0.04), var(--black));
}

.tc-awards__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1.2fr repeat(4, minmax(0, 0.65fr));
  gap: 44px;
  align-items: center;
}

.tc-awards h2 {
  margin: 0;
  color: var(--white);
}

.tc-award {
  display: grid;
  grid-template-columns: 134px 1fr;
  gap: 18px;
  align-items: center;
}

.tc-award img {
  width: 134px;
  height: 134px;
  object-fit: contain;
  opacity: 0.62;
}

.tc-award h3 {
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  line-height: 1.05;
}

@media (min-width: 1201px) and (max-width: 1700px) {
  .coffee-page-template .tc-awards__grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1.2fr repeat(4, minmax(0, 0.65fr));
    gap: 20px;
    align-items: center;
  }

  .coffee-page-template .tc-award {
    display: grid;
    grid-template-columns: 100px 1fr;
    gap: 18px;
    align-items: center;
  }

  .coffee-page-template .tc-award img {
    width: 100px;
    height: 100px;
    object-fit: contain;
    opacity: 0.62;
  }
}

@media (max-width: 1550px) {
  .tc-training__stage {
    min-height: 900px;
    padding: 72px 44px;
    display: block;
  }

  .tc-training__intro,
  .tc-training__pour,
  .tc-training__baristas {
    position: absolute;
    inset: auto;
    max-width: none;
  }

  .tc-training__intro {
    left: 44px;
    top: 72px;
    width: 42%;
    max-width: 620px;
    margin: 0;
  }

  .tc-training__pour {
    left: 44px;
    top: 420px;
    width: 42%;
    height: 300px;
    aspect-ratio: auto;
  }

  .tc-training__baristas {
    right: 44px;
    top: 72px;
    width: 47%;
    height: auto;
    object-fit: contain;
  }

  .tc-training__card-copy {
    right: 44px;
    top: 470px;
  }
}

@media (max-width: 1450px) {
  .tc-roast-levels {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-items: center;
  }
}

@media (max-width: 1200px) {
  .tc-section-nav {
    width: 100%;
    height: 56px;
    top: 119px;
    overflow-x: auto;
    justify-content: flex-start;
    gap: 34px;
    padding-inline: 24px;
  }

  .tc-section-nav a:not(:last-child)::after {
    right: -17px;
    height: 20px;
  }

  .tc-sourcing__grid,
  .tc-sustainability__grid {
    grid-template-columns: 1fr;
  }

  .tc-sourcing__grid {
    width: min(100% - 48px, 895px);
  }

  .tc-sourcing .tc-copy {
    padding-top: 64px;
  }

  .tc-hero-card {
    min-height: auto;
    height: 520px;
  }

  .tc-roast-levels {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-items: center;
  }

  .tc-awards__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tc-quality__stage {
    width: calc(100% - 48px);
    min-height: 0;
    display: grid;
    grid-template-columns: 1fr;
  }

  .tc-quality__panel,
  .tc-quality__image,
  .tc-quality-steps {
    position: relative;
    inset: auto;
    width: 100%;
    max-width: none;
  }

  .tc-quality__panel {
    min-height: 520px;
    height: auto;
  }

  .tc-quality__copy {
    position: relative;
    left: auto;
    top: auto;
    width: min(100% - 80px, 520px);
    max-width: none;
    padding: 80px 0 70px;
    margin-left: 48px;
  }

  .tc-quality__image {
    order: -1;
    height: 520px;
    margin-bottom: -84px;
    border-radius: 30px;
  }

  .tc-quality-steps {
    grid-template-columns: 1fr;
    gap: 24px;
    margin-top: 44px;
  }

  .tc-training__stage {
    min-height: 0;
    padding: 72px 24px;
    display: grid;
    grid-template-columns: minmax(0, 0.94fr) minmax(0, 1.06fr);
    grid-template-areas:
      "intro baristas"
      "pour baristas"
      "pour card";
    column-gap: 30px;
    row-gap: 28px;
    align-items: start;
  }

  .tc-training__intro,
  .tc-training__pour,
  .tc-training__baristas,
  .tc-training__card-copy {
    position: static;
    inset: auto;
    left: auto;
    top: auto;
    width: 100%;
    max-width: none;
  }

  .tc-training__intro {
    grid-area: intro;
    max-width: 680px;
    margin-bottom: 10px;
  }

  .tc-training__intro h2 {
    font-size: clamp(48px, calc(48px + 0vw), 48px);
  }

  .tc-training__intro p,
  .tc-training__card-copy p {
    font-size: clamp(16px, calc(16px + 0vw), 16px);
  }

  .tc-training__card-copy h3 {
    font-size: clamp(28px, calc(28px + 0vw), 28px);
  }

  .tc-training__pour {
    grid-area: pour;
    width: 100%;
    height: auto;
    aspect-ratio: 813 / 411;
  }

  .tc-training__baristas {
    grid-area: baristas;
    width: 100%;
    height: auto;
    max-width: 896px;
  }

  .tc-training__card-copy {
    grid-area: card;
    max-width: 560px;
    justify-self: end;
    margin: -190px 0 0;
    padding: 0 24px 30px;
  }
}

/* =====================================================
   HOME FIGMA ALIGNMENT PASS
   ===================================================== */
.home .site-header {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  background: transparent;
}

.home .hero-slide {
  height: 100vh;
}

.home nav.header-nav {
  background-color: transparent;
}

.hero-slider.slick-initialized.slick-slider.slick-dotted {
  margin-bottom: 0;
}

.home .hero-slide__bg {
  top: 39px;
  background-position: center top;
}

.home .hero-slide__bg::after {
  background:
    linear-gradient(
        to right,
        rgba(242, 240, 234, 0.9) 0%,
        rgba(242, 240, 234, 0) 100%
      )
      no-repeat 0 0 / 44.5% 100%,
    linear-gradient(
        to bottom,
        rgba(242, 240, 234, 0.9) 0%,
        rgba(242, 240, 234, 0) 100%
      )
      no-repeat 0 0 / 100% 29%;
}

.home .hero-slide__content {
  justify-content: flex-start;
  padding: 243px 0 0;
  width: 95%;
  margin-left: auto;
}

.home .hero-slide__title {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin: 0 0 29px;
  color: var(--black);
  font-size: clamp(150px, calc(150px + 0vw), 150px);
  font-weight: 700;
  line-height: 0.85;
  letter-spacing: 3px;
  text-transform: uppercase;
}

.home .hero-slide__title span {
  color: transparent;
  -webkit-text-stroke: 2px var(--black);
}

.home .hero-slide__title strong {
  display: block;
  font: inherit;
  color: var(--black);
}

.home .hero-slide__desc {
  max-width: 633px;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  color: var(--black);
  line-height: 1.55;
  margin-bottom: 39px;
}

.home .hero-slide__cta {
  margin-left: 0;
}

.home .btn-view-more,
.home .btn-gold {
  min-width: 134px;
  height: 60px;
  padding: 0 30px;
  border-radius: 15px;
  letter-spacing: 0;
  line-height: 1;
}

.home .trophy-section {
  height: 327px;
  padding: 0;
  display: flex;
  align-items: center;
  border: 0;
}

.home .b2b-section .container {
  position: relative;
  width: 100%;
  max-width: none;
  padding-inline: 0;
}
.home .awards-section .container {
  position: relative;
  width: 80%;
  max-width: none;
  padding-inline: 0;
}
.home .partner-section .container {
  position: relative;
  width: 100%;
  max-width: none;
  padding-inline: 0;
}

.home .products-section .container {
  position: relative;
}

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

.home .trophy-item {
  justify-content: center;
  padding: 0;
  border: 0;
}

.home .trophy-item__icon {
  width: 66px;
  height: 66px;
  background: transparent;
}

.home .coffee-section {
  height: 778px;
  margin-top: -42px;
}

.home .coffee-section__inner {
  min-height: 778px;
  grid-template-columns: 37.8% 62.2%;
}

.home .coffee-section__content {
  margin-left: 66px;
  width: 660px;
  padding: 135px 73px 90px;
  border-radius: 15px;
  overflow: visible;
}

.home .coffee-section__heading {
  display: none;
}

.home .coffee-section__heading-bg {
  left: 710px;
  top: 79px;
  z-index: 2;
  opacity: 1;
  color: transparent;
  -webkit-text-stroke: 2.5px var(--white);
  font-size: clamp(87px, calc(9.4595vw - 6.622px), 175px);
  line-height: 0.94;
  white-space: nowrap;
  overflow: visible;
}

.home .brands-section__heading,
.home .b2b-section__heading,
.home .partner-section__heading,
.home .blog-section__heading {
  font-size: clamp(36px, calc(10.398278px + 2.583423vw), 60px);
  line-height: 1.1;
}

.home .coffee-section__text {
  max-width: 501px;
  color: var(--white);
}

.home .brands-section {
  height: 846px;
  margin-top: 164px;
}

.home .brands-section__inner {
  min-height: 846px;
  grid-template-columns: 564px 1fr;
}

.home .brands-section__left {
  padding: 117px 70px 70px 95px;
}

.home .brand-row {
  min-height: 282px;
}

.home .brand-row--banner .brand-card__logo-img {
  width: auto;
  max-width: 100%;
  max-height: 100%;
  filter: none;
}

/* ============================================================
   PRODUCTS SECTION (HOME) — clean layout, no overflow
   ============================================================ */

.home .products-section {
  padding: 100px 0 80px;
  background: var(--cream);
  position: relative;
  margin-top: 0;
  height: auto;
}

.home .products-section__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
  margin-bottom: 48px;
  height: auto;
  padding-top: 0;
}

.home .products-section__heading {
  font-size: clamp(60px, calc(60px + 0vw), 60px);
  line-height: 1.1;
  padding-left: 0;
}

.home .products-section__heading span {
  color: transparent;
  -webkit-text-stroke: 1px var(--black);
}

.home .products-section__nav {
  display: flex;
  align-items: center;
  gap: 16px;
  position: static;
}

.home .products-nav-num {
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  color: var(--gold);
  position: relative;
  white-space: nowrap;
}

/* Slider — no forced dimensions, let slick clip normally */
.home .products-slider {
  overflow: hidden;
  padding-left: 0;
}

.home .products-slider.slick-initialized {
  display: block;
  overflow: hidden;
  padding-left: 0;
}

.home .products-slider.slick-initialized .slick-list {
  overflow: hidden;
  margin-top: 0;
  padding-top: 0;
}

.home .products-slider.slick-initialized .slick-track {
  display: flex;
  align-items: stretch;
}

.home .products-carousel-shell {
  position: relative;
}

.home .products-slider.slick-initialized .slick-slide {
  display: flex !important;
  height: auto !important;
}

.home .product-slide {
  padding: 0 12px;
  height: auto !important;
  display: flex !important;
  align-items: stretch;
  position: relative;
  overflow: visible;
}

.home .product-slide .product-card {
  flex: 1;
}

/* ── Product Card — clean default state ───────────────────── */

.home .product-card {
  width: 100%;
  background: var(--white);
  border-radius: 10px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  position: relative;
  isolation: auto;
}

.home .product-slide .product-card {
  filter: drop-shadow(0 2px 20px rgba(0, 0, 0, 0.07));
}

.home .product-slide--has-badge .product-card {
  clip-path: url("#product-card-notch-single");
}

.home .product-slide--has-badge-stack .product-card {
  clip-path: url("#product-card-notch-stack");
}

/* Image area */
.home .product-card__image {
  height: 300px;
  flex: 0 0 300px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 30px 20px;
  position: relative;
  overflow: hidden;
  background: transparent;
  width: 100%;
  aspect-ratio: auto;
  margin: 0;
  border-radius: 0;
}

.home .product-card__image img {
  max-height: 240px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
  display: block;
  margin: 0 auto;
  transform: none;
  transition: transform 0.3s ease;
  position: static;
  height: auto;
}

/* Wishlist button */
.home .product-card__wishlist {
  position: absolute;
  top: 18px;
  left: 18px;
  width: 26px;
  height: 22px;
  background: transparent;
  border: none;
  padding: 0;
  color: var(--black);
  cursor: pointer;
  z-index: 2;
  transition: transform 0.2s ease;
}

.home .product-card__wishlist svg {
  width: 100%;
  height: 100%;
}

.home .product-card__badges {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-end;
  pointer-events: none;
}

/* Badges sit inside the top-right cutout from the Figma card. */
.home .product-card__badge {
  position: static;
  width: 70px;
  height: 70px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  border-radius: 10px;
  letter-spacing: 0;
  line-height: 1;
}

.home .product-card__badge--new {
  background: var(--white);
  color: var(--black);
}

.home .product-card__badge--decaf {
  background: var(--gold);
  color: var(--white);
}

.home .product-card__badge--decaf svg {
  width: 35.405px;
  height: 35.405px;
  display: block;
}

/* Card body */
.home .product-card__body {
  flex: 1;
  padding: 20px 28px 24px;
  display: flex;
  flex-direction: column;
  position: static;
  inset: auto;
  z-index: auto;
  pointer-events: auto;
}

.home .product-card__name {
  font-size: clamp(20px, calc(20px + 0vw), 20px);
  font-weight: 700;
  color: var(--black);
  line-height: 1.2;
  margin: 0 0 10px;
  position: static;
  width: auto;
  top: auto;
  left: auto;
  transition: none;
}

.home .product-card__desc {
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  color: var(--gray);
  line-height: 1.45;
  margin: 0 0 18px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  height: auto;
  position: static;
  top: auto;
  left: auto;
  width: auto;
  transition: none;
}

.home .product-card__pricing {
  display: block;
  margin: 0 0 14px;
  position: static;
  top: auto;
  left: auto;
  transition: none;
}

.home .product-card__old-price {
  display: block;
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  color: var(--gray);
  text-decoration: line-through;
  line-height: 1;
  margin: 0 0 6px;
  transition: none;
}

.home .product-card__price {
  display: block;
  font-size: clamp(22px, calc(22px + 0vw), 22px);
  font-weight: 700;
  color: var(--black);
  line-height: 1;
  margin: 0;
  transition: none;
}

.home .product-card__offer {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: auto;
  padding-top: 14px;
  position: static;
  top: auto;
  left: auto;
  color: var(--gray);
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  transition: none;
}

.home .product-card__discount {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 5px 10px;
  border-radius: 8px;
  background: var(--gold);
  color: var(--white);
  font-size: clamp(13px, calc(13px + 0vw), 13px);
  font-weight: 700;
  width: auto;
  height: auto;
  transition: none;
}

.home .product-card__offer-text {
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  color: var(--gray);
}

/* Cart button — hidden in default, shown on hover */
.home .product-card__cart {
  display: none;
}

.home .products-arrow {
  position: absolute;
  top: 50%;
  z-index: 8;
  width: 44px;
  height: 127px;
  border: 0;
  background: var(--gold);
  color: var(--white);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transform: translateY(-50%);
  transition:
    background 0.2s ease,
    opacity 0.2s ease;
}

.home .products-arrow:hover {
  background: #6e6040;
}

.home .products-arrow:disabled {
  opacity: 0.35;
  cursor: default;
}

.home .products-arrow--prev {
  left: -30px;
  border-radius: 8px 0px 0px 8px;
}

.home .products-arrow--next {
  right: -5px;
  border-radius: 0px 8px 8px 0px;
}

.home .products-arrow svg {
  display: block;
  width: 17px;
  height: 31px;
}

.home .products-section__footer {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  margin-top: 48px;
  position: relative;
  min-height: 60px;
}

.home .products-section__footer .btn-gold {
  margin-inline: auto;
}

.home .products-nav-bottom {
  position: absolute;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
}

.home .products-nav-bottom .js-slide-current {
  font-size: clamp(20px, calc(20px + 0vw), 20px);
  font-weight: 400;
  color: var(--gold);
  line-height: 1;
}

.home .products-progress-track {
  position: relative;
  width: 214px;
  height: 1px;
  background: var(--gold);
  display: block;
}

.home .products-progress-thumb {
  position: absolute;
  left: 0;
  top: -2px;
  height: 5px;
  width: 0%;
  background: var(--black);
  border: 1px solid var(--gold);
  transition: width 0.4s ease;
  display: block;
}

@media (max-width: 1200px) {
  .home .products-section__heading {
    font-size: clamp(40px, calc(40px + 0vw), 40px);
  }

  .home .product-slide {
    padding-inline: 8px;
  }

  .home .products-section__header {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }

  .home .products-filter-tabs {
    order: 3;
    width: 100%;
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 4px;
    scrollbar-width: none;
  }

  .home .products-filter-tabs::-webkit-scrollbar {
    display: none;
  }

  .home .products-arrow {
    width: 48px;
    height: 72px;
  }

  .home .products-arrow--prev {
    left: -6px;
  }

  .home .products-arrow--next {
    right: -6px;
  }
}

.home .b2b-section {
  height: 740px;
  margin-top: 100px;
  padding: 0;
}

.home .b2b-section__header {
  position: absolute;
  width: 500px;
  margin: 0;
  padding-top: 2px;
  z-index: 2;
}

.home .b2b-cards {
  height: 740px;
  padding-left: 452px;
  grid-template-columns: repeat(4, 351px);
}

.home .partner-section {
  height: 492px;
  margin-top: -46px;
}

.home .partner-section__bg {
  display: none;
}

.home .partner-section__links {
  display: none;
}

.home .awards-section {
  height: 343px;
  padding: 0;
  display: flex;
  align-items: center;
}

.home .blog-section {
  position: relative;
  z-index: 2;
  height: 422px;
  overflow: visible;
}

.home .upper-footer {
  height: 881px;
  min-height: 881px;
  padding: 0;
}

.home .upper-footer__text {
  color: transparent;
  -webkit-text-stroke: 1px var(--white);
}

/* =====================================================
   HOME FIGMA ALIGNMENT PASS 2
   ===================================================== */
.home-eshop-tab {
  position: fixed;
  z-index: 999;
  right: -51px;
  top: 40%;
  width: 152px;
  height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 30px;
  color: var(--white);
  background: #592828;
  border-radius: 15px 15px 0 0;
  transform: rotate(-90deg);
  transform-origin: center;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  line-height: 1;
}

.home-eshop-tab svg {
  width: 24px;
  height: 25.097px;
  flex: 0 0 auto;
}

@media (min-width: 992px) {
  .home .hero-slider .slick-dots {
    display: none !important;
  }

  .home .coffee-section {
    position: relative;
    overflow: visible;
    background: var(--cream);
  }

  .home .coffee-section__inner {
    display: block;
    position: relative;
    height: 778px;
    min-height: 0;
  }

  .home .coffee-section__image {
    position: absolute;
    inset: 42px 0 auto;
    width: 100%;
    height: 688px;
  }

  .home .coffee-section__img-wrap {
    position: relative;
    width: 100%;
    height: 100%;
  }

  .home .coffee-section__img-wrap img,
  .home .coffee-section__video-el {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
  }

  .coffee-play-btn {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 116px;
    height: 116px;
    border: 2px solid rgba(255, 255, 255, 0.7);
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    transition:
      background 0.2s,
      border-color 0.2s,
      opacity 0.3s;
  }

  .coffee-play-btn:hover {
    background: rgba(255, 255, 255, 0.25);
    border-color: white;
  }

  .coffee-play-btn.hidden {
    opacity: 0;
    pointer-events: none;
  }

  .home .coffee-section__content {
    position: absolute;
    left: 66px;
    top: 0;
    width: 660px;
    height: 778px;
    margin: 0;
    padding: 95px 73px 90px;
    z-index: 3;
    background: var(--black);
    overflow: visible;
  }

  .home .coffee-section__subheading {
    display: block;
    position: relative;
    font-size: clamp(50px, calc(50px + 0vw), 50px);
    line-height: 1.15;
    margin: 16px 0 34px;
  }

  .home .brands-section__heading span,
  .home .b2b-section__heading span,
  .home .partner-section__heading span,
  .home .blog-section__heading span {
    color: transparent;
  }

  .home .brands-section__heading span,
  .home .partner-section__heading span {
    -webkit-text-stroke: 1px var(--white);
  }

  .home .b2b-section__heading span,
  .home .blog-section__heading span {
    -webkit-text-stroke: 1px var(--black);
  }

  .home .b2b-section__heading::after {
    content: "";
    position: absolute;
    left: 0;
    width: 55px;
    height: 3px;
    background: var(--gold);
  }

  .home .coffee-divider {
    width: 55px;
    height: 3px;
    background: var(--gold);
    display: block;
    margin: 0 0 52px;
    flex-shrink: 0;
  }

  .home .coffee-section__text {
    max-width: 501px;
    margin: 0 0 16px;
    font-size: clamp(16px, calc(16px + 0vw), 16px);
    line-height: 1.33;
  }

  .home .coffee-section__text:last-of-type {
    margin-bottom: 0;
  }

  .home .coffee-section__content .btn-gold {
    position: absolute;
    left: 75px;
    bottom: clamp(62px, 4.7vw, 90px);
  }

  /* Idle logo fallback (when no logo image is uploaded) */
  .home .brand-row--logo .brand-card__logo {
    width: 224px;
    height: 191px;
    background: url("assets/images/logo-rossetti-footer.svg") center / contain
      no-repeat;
  }

  .home .brand-row--logo .brand-card__logo > * {
    display: none;
  }

  .home .brands-section__text {
    font-size: clamp(16px, calc(16px + 0vw), 16px);
    line-height: 1.35;
    margin-top: 60px;
  }

  .home .products-section .container {
    position: relative;
  }

  /* Tabs sit at the end of the flex header row */
  .home .products-filter-tabs {
    position: static;
    display: flex;
    gap: 11px;
    align-items: center;
    flex-wrap: wrap;
  }

  .home .products-filter-tabs a,
  .home .products-filter-tabs button {
    height: 60px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 24px;
    border-radius: 15px;
    background: var(--cream-light);
    color: var(--white);
    font-size: clamp(15px, calc(15px + 0vw), 15px);
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    transition: background 0.2s ease;
  }

  .home .products-filter-tabs a.is-active,
  .home .products-filter-tabs button.is-active {
    background: var(--black);
  }

  .home .b2b-section {
    position: relative;
  }

  .home .b2b-section .container {
    position: relative;
    height: 740px;
    padding: 0;
    width: 95%;
    margin-left: auto;
    margin-right: unset;
  }

  .home .b2b-section__header {
    top: 0;
    width: 376px;
    padding: 0;
  }

  .home .b2b-section__header .label-tag {
    margin: 2px 0 0;
  }

  .home .b2b-section__heading {
    position: relative;
    margin: 29px 0 0;
    font-size: clamp(44px, calc(26.932185px + 1.722282vw), 60px);
  }

  .home .b2b-section__heading::after {
    top: 153px;
  }

  .home .b2b-section__text {
    position: absolute;
    left: 0;
    top: 246px;
    width: 376px;
    margin: 0;
    line-height: 1.42;
  }

  .home .b2b-section__header .btn-gold {
    position: absolute;
    left: 0;
    top: 445px;
  }

  .home .b2b-card::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
  }

  .home .b2b-card:nth-child(1)::after,
  .home .b2b-card:nth-child(4)::after {
    background: rgba(35, 31, 32, 0.28);
  }

  .home .b2b-card:nth-child(2)::after {
    background: rgba(225, 215, 187, 0.56);
  }

  .home .b2b-card:nth-child(3)::after {
    background: rgba(89, 40, 40, 0.45);
    mix-blend-mode: multiply;
  }

  .home .b2b-card__overlay,
  .home .b2b-card__overlay--light {
    z-index: 2;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: transparent;
  }

  .home .b2b-card__overlay::before {
    content: "";
    position: absolute;
    width: 106px;
    height: 108px;
    border-radius: 10px;
    background: var(--black);
  }

  .home .b2b-card__overlay--light::before {
    background: var(--cream);
  }

  .home .b2b-card:nth-child(3) .b2b-card__overlay::before {
    background: var(--dark-red);
  }

  .home .b2b-card__title {
    position: relative;
    z-index: 1;
    font-size: clamp(42px, calc(42px + 0vw), 42px);
    line-height: 0.8476;
    text-align: center;
    white-space: nowrap;
  }

  .home .b2b-section {
    height: auto;
    min-height: 740px;
    overflow: hidden;
    z-index: 0;
  }

  .home .b2b-section .container {
    display: grid;
    grid-template-columns: clamp(324px, 26.98vw, 518px) minmax(0, 1fr);
    height: auto;
    min-height: 740px;
    padding: 0;
  }

  .home .b2b-section__header {
    position: relative;

    top: auto;
    width: min(376px, calc(100% - 80px));
    align-self: start;
  }

  .home .b2b-section__text {
    width: 100%;
    max-width: 376px;
  }

  .home .b2b-cards {
    grid-column: 2;
    height: auto;
    min-height: 740px;
    padding-left: 0;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .home .b2b-card {
    min-width: 0;
    min-height: 740px;
  }

  .home .b2b-card__title {
    width: auto;
    max-width: calc(100% - 24px);
    font-size: clamp(28px, calc(13.065662px + 1.506997vw), 42px);
    line-height: 0.95;
    white-space: nowrap;
    overflow-wrap: normal;
  }

  .home .partner-section {
    padding: 0;
  }

  .home .partner-section__bg {
    display: none;
  }

  .home .partner-section .container {
    position: relative;
    height: 492px;
    padding: 0;
  }

  .home .partner-section__content {
    position: absolute;
    left: 166px;
    top: 141px;
    width: 498px;
    max-width: none;
  }

  .home .partner-section__content .label-tag {
    margin: 0 0 26px;
  }

  .home .partner-section__heading {
    margin: 0 0 22px;
    line-height: 1.1;
    white-space: nowrap;
  }

  .home .partner-section__text {
    width: 498px;
    margin: 0;
    line-height: 1.19;
    color: var(--white);
  }

  .home .partner-section__links {
    display: none;
  }

  .home .partner-form {
    position: absolute;
    left: 900px;
    top: 189px;
    width: 857px;
    color: var(--white);
  }

  .home .partner-form__grid {
    display: grid;
    grid-template-columns: 399px 399px;
    gap: 30px 59px;
  }

  .home .partner-form label {
    display: block;
    color: inherit;
  }

  .home .partner-form label > span {
    display: block;
    margin-bottom: 7px;
    font-size: clamp(16px, calc(16px + 0vw), 16px);
    line-height: 1;
  }

  .home .partner-form input[type="text"],
  .home .partner-form input[type="tel"],
  .home .partner-form input[type="email"] {
    width: 100%;
    height: 17px;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 0;
    background: transparent;
    color: var(--white);
    outline: none;
    font-size: clamp(16px, calc(16px + 0vw), 16px);
  }

  .home .partner-form__submit-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 40px;
  }

  .home .partner-form__terms {
    display: flex !important;
    align-items: center;
    gap: 10px;
    font-size: clamp(16px, calc(16px + 0vw), 16px);
    color: var(--white);
  }

  .home .partner-form__terms input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    width: 20px;
    height: 20px;
    border: 1px solid rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    background: transparent;
    cursor: pointer;
    flex-shrink: 0;
    position: relative;
  }

  .home .partner-form__terms input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    inset: 3px;
    border-radius: 50%;
    background: var(--gold);
  }

  .home .partner-form__terms span {
    margin: 0 !important;
  }

  .home .partner-form button {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--gold);
    font-size: clamp(16px, calc(16px + 0vw), 16px);
    font-weight: 700;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
  }

  .home .partner-form button svg {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
  }

  .home .awards-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 7%;
    padding: 0 3%;
  }

  .home .award-item {
    flex-direction: row;
    justify-content: center;
    gap: 20px;
    position: relative;
  }

        .award-item:not(:last-child)::after {
            content: "";
            position: absolute;
            top: 50%;
            right: -17.72%;
            transform: translateY(-50%);
            width: 1px;
            height: 57px;
            background: #85754E;
        }


  .home .award-item__image {
width: 34%;
    height: 131px;
  }

  .home .award-item__title {
        font-size: clamp(18px, 1.4583vw, 28px);
            text-align: left;
            line-height: 0.95;
            width: 66%;
            max-width: 297px;
  }

  .home .blog-section__inner {
    display: block;
    position: relative;
    height: 38.5vw;
    min-height: 0;
  }

  .home .blog-section__left {
    position: absolute;
    left: 5%;
    top: 6.98vw;
    width: 16.35vw;
    padding: 0;
    display: block;
    z-index: 4;
  }

  .home .blog-section__left .label-tag {
    margin: 0 0 31px;
  }

  .home .blog-section__heading {
    margin: 0 0 42px;
    line-height: 1.1;
  }

  .home .blog-section__intro {
    width: 100%;
    margin: 0;
    line-height: 1.33;
  }

  .home .blog-section__left .btn-gold {
    position: absolute;
    left: 0;
    top: 17.4vw;
  }

  .home .blog-grid {
    position: absolute;
    inset: 0;
    display: block;
  }

  .home .blog-card {
    position: absolute;
    background: TRANSPARENT;
    border-radius: 10px;
    overflow: hidden;
    --blog-card-btn-width: 60px;
    --blog-card-btn-height: 60px;
  }

  .home .blog-card:nth-child(1) {
    left: 25.73vw;
    top: 6.35vw;
    width: 26.3vw;
    height: 25.57vw;
  }

  .home .blog-card:nth-child(2) {
    left: 53.8vw;
    top: 11.09vw;
    width: 20.47vw;
    height: 26.3vw;
    margin-top: 0;
  }

  .home .blog-card:nth-child(3) {
    left: 76.15vw;
    top: 6.35vw;
    width: 20.47vw;
    height: 19.9vw;
  }

  .home .blog-card__body {
    justify-content: flex-start;
    padding: 39px 35px 28px;
    background: linear-gradient(
      to bottom,
      rgba(0, 0, 0, 0.75) 0%,
      rgba(0, 0, 0, 0.3) 45%,
      rgba(0, 0, 0, 0.1) 70%,
      transparent 100%
    );
  }

  .home .blog-card__title {
    max-width: 100%;
    font-size: clamp(16px, calc(-1.067815px + 1.722282vw), 32px);
    line-height: 1;
    margin: 0;
  }

  .home .blog-card__btn {
    width: var(--blog-card-btn-width);
    height: var(--blog-card-btn-height);
    justify-content: flex-end;
    gap: 10px;
    padding: 0 14px;
    border-radius: 8px 8px 8px 8px;
    background: var(--gold);
  }

  .home .upper-footer {
    overflow: hidden;
  }

  .home .upper-footer::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(
      180deg,
      rgba(35, 31, 32, 0) 0%,
      var(--black) 100%
    );
    pointer-events: none;
  }

  .home .upper-footer__bg {
    z-index: 0;
    opacity: 0.74;
    background-position: center;
  }

  .home .upper-footer__inner {
    position: absolute;
    left: 0px;
    top: 468px;
    width: 1920px;
    max-width: none;
    margin: 0;
    padding: 0;
    z-index: 2;
  }

  .home .upper-footer__marquee {
    animation-duration: 20s;
  }

  .home .upper-footer__text {
    width: auto;
    padding-right: 120px;
    font-size: clamp(150px, calc(150px + 0vw), 150px);
    line-height: 1;
    letter-spacing: 0;
  }
}

/* =====================================================
   COMPANY PAGE  (page-company.php)
   Figma node 68:3513 — frame 1920×4075
   ===================================================== */

/* Breadcrumb */
.cp-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: rgba(255, 255, 255, 0.75);
}
.cp-breadcrumb a {
  color: rgba(255, 255, 255, 0.6);
  transition: color 0.2s;
}
.cp-breadcrumb a:hover {
  color: var(--white);
}
.cp-breadcrumb__sep {
  opacity: 0.45;
}

/* Shared: 55px gold divider line (same as homepage sections) */
.cp-divider {
  display: block;
  width: 55px;
  height: 3px;
  background: var(--gold);
  margin: 16px 0 32px;
}

/* Gold label colour override for dark sections */
.cp-label--light {
  color: var(--gold);
}

/* Shared story image across philosophy / history / team */
.cp-story-stack {
  position: relative;
  overflow: visible;
  isolation: isolate;
}
.cp-story-stack__visual {
  position: absolute;
  top: -235px;
  left: 50%;
  right: auto;
  width: max(100%, 1920px);
  transform: translateX(-50%);
  z-index: 4;
  pointer-events: none;
}
.cp-story-stack__visual img {
  display: block;
  width: 100%;
  height: auto;
  max-width: none;
}
/* ---- HERO ----------------------------------------- */
.cp-hero {
  position: relative;
  min-height: 380px;
  background: var(--black);
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}
.cp-hero__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center top;
  opacity: 0.65;
}
.cp-hero__inner {
  position: relative;
  z-index: 1;
  width: min(100%, var(--container));
  margin-inline: auto;
  padding: 0 var(--gutter) 56px;
}

/* ---- OUR PHILOSOPHY  (yr 250-848, h=598) ---------- */
.cp-philosophy {
  position: relative;
  z-index: 2;
  width: 95%;
  margin: 70px 0 -86px 5%;
  background: var(--cream);
  border-radius: 30px 0 0 30px;
  overflow: hidden;
  min-height: 598px;
}
.cp-philosophy__left {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: min(100%, 786px);
  padding: 92px 80px 88px 77px;
}
.cp-philosophy__heading {
  font-size: clamp(40px, calc(18.665231px + 2.152853vw), 60px);
  font-weight: 900;
  color: var(--black);
  line-height: 1.1;
  letter-spacing: 0;
  margin-bottom: 33px;
}
.cp-philosophy__heading span {
  color: transparent;
  -webkit-text-stroke: 1px var(--black);
}
.cp-philosophy .label-tag {
  margin-bottom: 10px;
}
.cp-philosophy .cp-divider {
  display: none;
}
.cp-philosophy__text {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--black);
  line-height: 1.5;
  max-width: 628px;
}
.cp-philosophy__right {
  display: none;
}
.cp-philosophy__right img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* ---- HISTORY  (yr 848-1890, h=1042) --------------- */
.cp-history {
  position: relative;
  z-index: 2;
  padding-top: 200px;
  padding-bottom: 184px;
  overflow: hidden;
  min-height: 741px;
}
.cp-history__bg {
  display: none;
}
.cp-history__overlay {
  display: none;
}
.cp-history__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 55% 45%;
  min-height: 741px;
  align-items: start;
}

/* Left column */
.cp-history__left {
  display: flex;
  flex-direction: column;
  min-height: 741px;
}
.cp-history__left-content {
  padding: 0 60px 48px 165px;
}
.cp-history__heading {
  font-size: clamp(40px, calc(18.665231px + 2.152853vw), 60px);
  font-weight: 900;
  color: var(--black);
  line-height: 1.1;
  letter-spacing: 0;
  margin-bottom: 52px;
}
.cp-history__heading span {
  color: transparent;
  -webkit-text-stroke: 1px var(--black);
}
.cp-history .label-tag {
  margin-bottom: 22px;
}
.cp-history .cp-divider {
  display: none;
}
.cp-history__body {
  max-width: 618px;
}
.cp-history__body p {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--black);
  line-height: 1.5;
}
.cp-history__body p + p {
  margin-top: 22px;
}
/* Dark quote panel — xr=-2 yr=1432 w=853 h=271 */
.cp-history__quote {
  background: var(--black);
  padding: 40px 52px 40px 165px;
  display: flex;
  align-items: flex-start;
  gap: 22px;
  width: min(853px, 100%);
  margin-top: auto;
  border-radius: 0 15px 15px 0;
}
.cp-history__quote-mark {
  flex-shrink: 0;
  line-height: 0;
  color: var(--gold);
}
.cp-history__quote-mark svg {
  display: block;
  width: 48px;
  height: auto;
}
.cp-history__quote-text {
  font-size: clamp(32px, calc(32px + 0vw), 32px);
  font-weight: 700;
  color: var(--cream-light);
  line-height: 1.35;
  max-width: 525px;
}

/* Right: vertical timeline (Group 473) */
.cp-history__timeline {
  padding: 44px 80px 0 37px;
}
.cp-timeline {
  position: relative;
  display: flex;
  flex-direction: column;
}
/* The vertical gold/grey line */
.cp-timeline__line {
  position: absolute;
  left: 7px; /* center of 16px dot */
  top: 24px;
  bottom: 24px;
  width: 1px;
  background: rgba(133, 117, 78, 0.65);
}
.cp-timeline__line::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 1px;
  height: 150px;
  background: var(--black);
}
.cp-timeline__line::after {
  content: "";
  position: absolute;
  left: -1px;
  top: 0;
  width: 3px;
  height: calc(var(--timeline-progress, 0) * 100%);
  background: var(--black);
  box-shadow: 0 0 10px rgba(35, 31, 32, 0.18);
  border-radius: 999px;
  transition: height 0.14s linear;
}
.cp-timeline__item {
  display: flex;
  align-items: flex-start;
  gap: 54px;
  padding-bottom: 96px;
  opacity: 0.3;
  transform: translateY(28px);
  transition:
    opacity 0.45s ease,
    transform 0.45s ease;
}
.cp-timeline__item:last-child {
  padding-bottom: 0;
}
.cp-timeline__item.is-visible {
  opacity: 1;
  transform: translateY(0);
}
/* Small gold dot (16×16) */
.cp-timeline__dot {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--gold);
  flex-shrink: 0;
  margin-top: 0;
  position: relative;
  z-index: 1;
  transform: scale(0.72);
  transition:
    transform 0.45s ease,
    background-color 0.45s ease,
    border-color 0.45s ease;
}
.cp-timeline__dot::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 48px;
  height: 48px;
  border: 1.5px solid var(--black);
  border-radius: 50%;
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.4);
  transition:
    opacity 0.35s ease,
    transform 0.35s ease;
}
.cp-timeline__item.is-visible .cp-timeline__dot {
  transform: scale(1);
}
.cp-timeline__item.is-visible .cp-timeline__dot::before {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}
/* First item: large ring dot (48×48) */
.cp-timeline__item--active .cp-timeline__dot {
  width: 16px;
  height: 16px;
  margin-left: 0;
  border: 0;
}
.cp-timeline__item--active.is-visible .cp-timeline__dot {
  transform: scale(1);
}
.cp-timeline__item--active .cp-timeline__dot::after {
  content: none;
}
.cp-timeline__item.is-current .cp-timeline__dot {
  background: var(--black);
}
.cp-timeline__item.is-current .cp-timeline__dot::before {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}
.cp-timeline__date {
  display: block;
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  font-weight: 700;
  color: var(--gold);
  margin-bottom: 14px;
  line-height: 1;
}
.cp-timeline__title {
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  font-weight: 700;
  color: var(--black);
  line-height: 1.25;
  margin-bottom: 16px;
}
.cp-timeline__text {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--gold);
  line-height: 1.6;
  max-width: 451px;
}

@media (prefers-reduced-motion: reduce) {
  .cp-timeline__line::after,
  .cp-timeline__item,
  .cp-timeline__dot {
    transition: none;
  }
}

/* ---- OUR TEAM  (yr 1890-2618, h=728, dark #231F20) */
.cp-team {
  position: relative;
  background: #231f20;
  overflow: hidden;
  min-height: 728px;
}
.cp-team__inner {
  display: grid;
  grid-template-columns: 56% 44%;
  min-height: 728px;
  align-items: center;
  width: 90%;
  margin: auto;
}
/* Image: xr=165 yr=2004 w=842 h=495 — starts 114px into section */
.cp-team__image {
  position: relative;
  z-index: 6;
  padding: 116px 0 116px 50px;
}
.cp-team__image img {
  display: block;
  width: 100%;
  max-width: 842px;
  height: 495px;
  object-fit: cover;
  border-radius: 30px;
  box-shadow: 30px 30px 48.3px 0 rgba(0, 0, 0, 0.48);
  filter: grayscale(100%);
}
/* Text: xr=1137 — 1137-1056=81px from left col right edge */
.cp-team__content {
  position: relative;
  z-index: 5;
  padding: 80px 0px 80px 50px;
}
.cp-team .label-tag {
  margin-bottom: 28px;
}
.cp-team .cp-divider {
  display: none;
}
.cp-team__heading {
  font-size: clamp(40px, calc(18.665231px + 2.152853vw), 60px);
  font-weight: 900;
  color: var(--white);
  line-height: 1.1;
  letter-spacing: 0;
  margin-bottom: 48px;
}
.cp-team__heading span {
  color: transparent;
  -webkit-text-stroke: 1px rgba(255, 255, 255, 0.72);
}
.cp-team__body {
  max-width: 636px;
  margin-bottom: 42px;
}
.cp-team__body p {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.5;
}
.cp-team__body p + p {
  margin-top: 24px;
}
/* 2×2 grid of team members */
.cp-team__members {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 38px 56px;
  max-width: 650px;
}
.cp-team__member {
  display: flex;
  align-items: center;
  gap: 18px;
}
.cp-team__member-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--gold);
  flex-shrink: 0;
}
.cp-team__member-name {
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  font-weight: 700;
  color: var(--white);
  line-height: 1;
}

/* ---- OUR FACTORY  (yr 2618-2999, h=381) ----------- */
/* All text centered: label center xr=960, heading center xr=960 */
.cp-factory {
  background: var(--cream);
  padding: 141px 0 46px;
}
.cp-factory__content {
  text-align: center;
  max-width: 814px;
  margin-inline: auto;
}
.cp-factory .label-tag {
  margin-bottom: 18px;
}
.cp-factory__content .cp-divider {
  display: none;
}
.cp-factory__heading {
  font-size: clamp(40px, calc(18.665231px + 2.152853vw), 60px);
  font-weight: 900;
  color: var(--black);
  line-height: 1.1;
  letter-spacing: 0;
  margin-bottom: 30px;
}
.cp-factory__heading span {
  color: transparent;
  -webkit-text-stroke: 1px var(--black);
}
.cp-factory__text {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--black);
  line-height: 1.45;
  max-width: 814px;
  margin-inline: auto;
}

/* ---- GALLERY  (yr 2999-3578, h=579) --------------- */
/*
  3 images (each 421×421px) at absolute x positions:
    img-1: xr=83      img-2: xr=988     img-3: xr=1441
  Floating card (Group 325): xr=455, yr=2999(top), w=579, h=579
  → card starts 79px ABOVE the images (images at yr=3078)
*/
.cp-gallery {
  background: var(--cream);
  padding: 0px 0 100px;
  --cp-gallery-gap: 12px;
  --cp-gallery-card-size: clamp(250px, 22vw, 415px);
  --cp-gallery-featured-size: clamp(360px, 30vw, 579px);
}
.cp-gallery__grid {
  position: relative;
  width: 90%;
  margin-inline: auto;
  overflow: visible;
}
.cp-gallery__slider .slick-list {
  overflow: visible;
  clip-path: inset(-140px 0 -140px 0);
}
.cp-gallery__slider .slick-track {
  overflow: visible;
}
.cp-gallery__slider .slick-slide {
  overflow: visible;
}
/* The 3 background image divs — positioned absolutely */
.cp-gallery__slider {
  width: 100%;
}
.cp-gallery__slide {
  position: relative;
  height: var(--cp-gallery-featured-size);
  margin: 0;
  padding: 0 var(--cp-gallery-gap);
  box-sizing: border-box;
  overflow: visible;
  z-index: 1;
  transition: z-index 0.2s ease;
}
.cp-gallery__card {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(100%, var(--cp-gallery-card-size));
  height: var(--cp-gallery-card-size);
  border-radius: 15px;
  overflow: hidden;
  cursor: pointer;
  will-change: width, height, transform, box-shadow;
  transform: translate(-50%, -50%);
  transform-origin: center center;
  transition:
    width 0.35s ease,
    height 0.35s ease,
    transform 0.35s ease,
    box-shadow 0.35s ease;
}
.cp-gallery__media {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform 0.5s ease;
}
.cp-gallery__wash {
  position: absolute;
  inset: 0;
  background: rgba(225, 215, 187, 0.72);
  mix-blend-mode: screen;
  transition: opacity 0.35s ease;
}
.cp-gallery__featured-gradient {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(35, 31, 32, 1) 0%,
    rgba(35, 31, 32, 0.1) 58%,
    rgba(35, 31, 32, 0) 74%
  );
  opacity: 0;
  transition: opacity 0.35s ease;
}
.cp-gallery__featured-content {
  position: absolute;
  bottom: 28px;
  left: 0;
  right: 0;
  padding: 0 34px 0;
  z-index: 1;
  text-align: center;
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity 0.35s ease,
    transform 0.35s ease;
}
.cp-gallery__featured-title {
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  font-weight: 700;
  color: var(--white);
  margin-bottom: 12px;
  line-height: 1.2;
}
.cp-gallery__featured-text {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.45;
  max-width: 288px;
  margin-inline: auto;
}
.cp-gallery__slide.is-hovered {
  z-index: 3;
}
.cp-gallery__slide.is-hovered .cp-gallery__card {
  width: min(calc(100% + 158px), var(--cp-gallery-featured-size));
  height: var(--cp-gallery-featured-size);
  box-shadow: 55px 62px 77.3px 0 rgba(0, 0, 0, 0.49);
}
.cp-gallery__slide.is-hovered .cp-gallery__media {
  transform: scale(1.03);
}
.cp-gallery__slide.is-hovered .cp-gallery__wash {
  opacity: 0;
}
.cp-gallery__slide.is-hovered .cp-gallery__featured-gradient {
  opacity: 1;
}
.cp-gallery__slide.is-hovered .cp-gallery__featured-content {
  opacity: 1;
  transform: translateY(0);
}
.cp-gallery__footer {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  gap: 18px;
  margin-top: 34px;
}
.cp-gallery__count {
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  color: var(--gold);
  line-height: 1;
}
.cp-gallery__progress {
  position: relative;
  display: block;
  width: 214px;
  height: 2px;
  background: rgba(133, 117, 78, 0.38);
}
.cp-gallery__progress-thumb {
  position: absolute;
  left: 0;
  top: -1px;
  width: 51px;
  height: 4px;
  border: 1px solid var(--gold);
  background: var(--black);
  border-radius: 999px;
  transform: translateX(0);
  transition:
    width 0.35s ease,
    transform 0.35s ease;
}

/* ---- COMPANY PAGE RESPONSIVE ---------------------- */
@media (max-width: 1550px) {
  .cp-story-stack__visual {
    position: absolute;
    top: -235px;
    left: 50%;
    right: auto;
    width: max(100%, 2000px);
    transform: translateX(-50%);
    z-index: 4;
    pointer-events: none;
  }
}

@media (max-width: 1200px) {
  .cp-philosophy {
    width: calc(100% - 32px);
  }
  .cp-philosophy__left {
    width: min(100%, 720px);
    padding: 72px 56px 72px 56px;
  }
  .cp-history__left-content {
    padding: 80px 40px 48px 80px;
  }
  .cp-history__quote {
    padding: 40px 40px 40px 80px;
  }
  .cp-history__timeline {
    padding: 80px 40px 80px 40px;
  }
  .cp-team__image {
    padding: 80px 0 80px 80px;
  }
  .cp-team__content {
    padding: 80px 40px 80px 60px;
  }
  .cp-factory {
    padding: 100px 0 60px;
  }
  .cp-gallery__grid {
    width: calc(100% - 64px);
  }
}

@media (max-width: 991px) {
  /* Story stack visual – behind sections on mobile so pour image doesn't cover text */
  .cp-story-stack__visual {
    top: -100px;
    left: 0;
    right: 0;
    width: 100%;
    transform: none;
    z-index: 1;
  }
  .cp-story-stack__visual img {
    display: block;
    width: 1182px;
    height: auto;
    max-width: none;
    left: -425px;
    position: absolute;
    top: -419px;
  }
  .cp-story-stack__visual::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 50%;
    background: linear-gradient(to bottom, transparent 0%, #fff 100%);
    pointer-events: none;
  }

  /* ---- Philosophy ---- */
  .cp-philosophy {
    width: calc(100% - 24px);
    margin: 100px 0 0 24px;
    border-radius: 30px 0 0 30px;
    min-height: auto;
  }
  .cp-philosophy__left {
    width: 100%;
    padding: 80px 24px 48px 24px;
  }
  .cp-philosophy__heading {
    font-size: 32px;
    margin-bottom: 18px;
  }
  .cp-philosophy__text {
    font-size: 12px;
  }

  /* ---- History ---- */
  .cp-history {
    padding-top: 365px;
    padding-bottom: 60px;
  }
  .cp-history__inner {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .cp-history__left {
    min-height: auto;
  }
  .cp-history__left-content {
    padding: 0 24px 36px 39px;
  }
  .cp-history__heading {
    font-size: 32px;
    margin-bottom: 28px;
  }
  .cp-history__body {
  }
  .cp-history__body p {
    font-size: 12px;
  }
  .cp-history__quote {
    padding: 36px 24px 36px 15px;
    width: calc(100% - 24px);
    margin-left: 24px;
    margin-top: 40px;
    border-radius: 15px;
    gap: 5px;
  }
  .cp-history__quote-mark svg {
    width: 34px;
  }
  .cp-history__quote-text {
    font-size: 18px;
    max-width: none;
  }
  .cp-history__timeline {
    padding: 48px 24px 0 45px;
  }
  .cp-timeline__item {
    gap: 32px;
    padding-bottom: 60px;
  }
  .cp-timeline__date {
    font-size: 18px;
  }
  .cp-timeline__title {
    font-size: 24px;
  }
  .cp-timeline__text {
    font-size: 12px;
    max-width: 258px;
  }

  /* ---- Team ---- */
  .cp-team {
    min-height: auto;
  }
  .cp-team__inner {
    grid-template-columns: 1fr;
    min-height: auto;
    width: 100%;
    align-items: start;
  }
  .cp-team__content {
    order: -1;
    padding: 60px 24px 40px 26px;
  }
  .cp-team__heading {
    font-size: 32px;
    margin-bottom: 28px;
  }
  .cp-team__body {
    margin-bottom: 30px;
  }
  .cp-team__body p {
    font-size: 12px;
  }
  .cp-team__members {
    grid-template-columns: 1fr;
    gap: 20px;
    max-width: none;
  }
  .cp-team__member-name {
    font-size: 18px;
  }
  .cp-team__image {
    order: 1;
    padding: 0 0 0px;
    overflow: hidden;
  }
  .cp-team__image img {
    width: calc(100% + 40px);
    max-width: none;
    margin-left: -20px;
    height: 495px;
    border-radius: 30px;
    box-shadow: none;
  }

  /* ---- Factory ---- */
  .cp-factory {
    padding: 60px 0 50px;
  }
  .cp-factory__content {
    text-align: left;
    max-width: none;
    padding: 0 24px 0 35px;
    margin-inline: 0;
  }
  .cp-factory .label-tag {
    text-align: left;
  }
  .cp-factory__heading {
    font-size: 32px;
    margin-bottom: 24px;
  }
  .cp-factory__text {
    font-size: 12px;

    margin-inline: 0;
  }

  /* ---- Gallery ---- */
  .cp-gallery {
    /* Figma node 842:8191 exact values at 375px */
    --cp-gallery-card-size: 176px;
    --cp-gallery-featured-size: 242px;
    padding: 10px 0 105px;
    overflow: visible;
    box-sizing: border-box;
  }
  .cp-gallery__grid {
    width: calc(100% - 48px);
    height: var(--cp-gallery-featured-size);
    margin-inline: auto;
  }
  .cp-gallery__footer {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    margin-top: 20px;
    padding-inline: 0;
    gap: 8px;
    width: 100%;
  }
  .cp-gallery__count {
    font-size: 18px;
    font-weight: 400;
    line-height: 1;
  }
  .cp-gallery__progress {
    position: relative;
    display: block;
    width: 100%;
    height: 1px;
    background: rgba(133, 117, 78, 0.3);
  }
  .cp-gallery__progress-thumb {
    position: absolute;
    left: 0;
    top: -1.5px;
    width: 0%;
    height: 4px;
    background: var(--gold);
    border: none;
    border-radius: 0;
    transform: none;
    transition: width 0.3s ease;
  }

  /* Gallery mobile: center card featured, side cards peek with cream wash */
  .cp-gallery__slider,
  .cp-gallery__slider .slick-list,
  .cp-gallery__slider .slick-track,
  .cp-gallery__slide {
    height: var(--cp-gallery-featured-size);
  }

  .cp-gallery__slider .slick-list {
    /* allow ~67px overflow on each side so side cards are visible */
    overflow: visible;
    clip-path: inset(-100px -90px 0 -90px);
  }

  .cp-gallery__slide {
    padding: 0;
  }

  .cp-gallery__card {
    width: var(--cp-gallery-card-size);
    height: var(--cp-gallery-card-size);
    border-radius: 6.264px;
    transition: none;
  }

  .cp-gallery__media,
  .cp-gallery__wash,
  .cp-gallery__featured-gradient {
    border-radius: inherit;
  }

  .cp-gallery__wash {
    opacity: 0.7;
  }

  .cp-gallery__featured-gradient {
    inset: auto 0 0;
    height: 144px;
    background: linear-gradient(180deg, rgba(35, 31, 32, 0) 0%, #231f20 100%);
    border-radius: 0 0 12.529px 12.529px;
  }

  .cp-gallery__featured-content {
    bottom: 27px;
    padding: 0 14px;
  }

  /* Side card: align to the near edge of the slide so it fills the peek zone */
  .company-page-template .cp-gallery__slide.is-prev-slide .cp-gallery__card,
  .page-template-page-company
    .cp-gallery__slide.is-prev-slide
    .cp-gallery__card {
    left: auto;
    right: -21px;
    transform: translateY(-50%);
    width: var(--cp-gallery-card-size);
    height: var(--cp-gallery-card-size);
  }
  .company-page-template .cp-gallery__slide.is-next-slide .cp-gallery__card,
  .page-template-page-company
    .cp-gallery__slide.is-next-slide
    .cp-gallery__card {
    left: -24px;
    transform: translateY(-50%);
    width: var(--cp-gallery-card-size);
    height: var(--cp-gallery-card-size);
  }
  /* Center card: featured size, no wash, gradient + content shown, on top */
  .company-page-template .cp-gallery__slide.slick-center,
  .company-page-template .cp-gallery__slide.slick-current,
  .page-template-page-company .cp-gallery__slide.slick-center,
  .page-template-page-company .cp-gallery__slide.slick-current {
    z-index: 3 !important;
  }
  .company-page-template .cp-gallery__slider .slick-center .cp-gallery__card,
  .company-page-template .cp-gallery__slider .slick-current .cp-gallery__card,
  .page-template-page-company
    .cp-gallery__slider
    .slick-center
    .cp-gallery__card,
  .page-template-page-company
    .cp-gallery__slider
    .slick-current
    .cp-gallery__card {
    width: var(--cp-gallery-featured-size);
    height: var(--cp-gallery-featured-size);
    border-radius: 6.264px;
    box-shadow: 22.969px 25.892px 32.282px 0 rgba(0, 0, 0, 0.49);
  }
  .company-page-template .cp-gallery__slider .slick-center .cp-gallery__wash,
  .company-page-template .cp-gallery__slider .slick-current .cp-gallery__wash,
  .page-template-page-company
    .cp-gallery__slider
    .slick-center
    .cp-gallery__wash,
  .page-template-page-company
    .cp-gallery__slider
    .slick-current
    .cp-gallery__wash {
    opacity: 0;
  }
  .company-page-template
    .cp-gallery__slider
    .slick-center
    .cp-gallery__featured-gradient,
  .company-page-template
    .cp-gallery__slider
    .slick-current
    .cp-gallery__featured-gradient,
  .page-template-page-company
    .cp-gallery__slider
    .slick-center
    .cp-gallery__featured-gradient,
  .page-template-page-company
    .cp-gallery__slider
    .slick-current
    .cp-gallery__featured-gradient {
    opacity: 1;
  }
  .company-page-template
    .cp-gallery__slider
    .slick-center
    .cp-gallery__featured-content,
  .company-page-template
    .cp-gallery__slider
    .slick-current
    .cp-gallery__featured-content,
  .page-template-page-company
    .cp-gallery__slider
    .slick-center
    .cp-gallery__featured-content,
  .page-template-page-company
    .cp-gallery__slider
    .slick-current
    .cp-gallery__featured-content {
    opacity: 1;
    transform: translateY(0);
  }

  /* Font sizes per Figma */
  .company-page-template .label-tag {
    font-size: 14px;
  }
  .cp-gallery__featured-title {
    margin: 0 0 7px;
    font-size: 24px;
    line-height: 1;
    white-space: nowrap;
  }
  .cp-gallery__featured-text {
    width: 214px;
    max-width: 100%;
    font-size: 12px;
    line-height: 1;
    color: var(--white);
  }
}

/* =====================================================
   E-SHOP / WOOCOMMERCE ARCHIVE
   Figma node 68:2976
   ===================================================== */
body.woocommerce-shop,
body.post-type-archive-product {
  background: var(--cream);
}

.woocommerce-shop .site-header,
.post-type-archive-product .site-header {
  position: relative;
  background: var(--black);
}

.woocommerce-shop .header-nav,
.post-type-archive-product .header-nav {
  background: var(--black);
}

.woocommerce-shop .header-nav__menu li a,
.woocommerce-shop .header-nav__icons,
.woocommerce-shop .icon-btn,
.post-type-archive-product .header-nav__menu li a,
.post-type-archive-product .header-nav__icons,
.post-type-archive-product .icon-btn {
  color: var(--white);
}

.woocommerce-shop .header-nav__menu .sub-menu,
.post-type-archive-product .header-nav__menu .sub-menu {
  background: var(--black);
}

.woocommerce-shop .header-nav__menu .sub-menu a,
.post-type-archive-product .header-nav__menu .sub-menu a {
  color: var(--white);
}

.woocommerce-shop .header-nav__eshop-item > a,
.post-type-archive-product .header-nav__eshop-item > a {
  color: var(--gold);
  border-color: var(--gold);
}

.woocommerce-shop .header-nav__eshop-item > a:hover,
.post-type-archive-product .header-nav__eshop-item > a:hover {
  background: var(--gold);
  color: var(--white);
}

.woocommerce-shop .header-nav__logo-img,
.post-type-archive-product .header-nav__logo-img {
  filter: none;
}

.rs-shop {
  background: var(--cream);
  color: var(--black);
  min-height: 100vh;
}

.rs-shop__mast {
  position: relative;
  height: 144px;
  background: var(--black);
}

.rs-shop__breadcrumb {
  position: absolute;
  left: 66px;
  top: -31px;
  color: var(--white);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1;
  z-index: 2;
}

.rs-shop__breadcrumb a {
  color: var(--white);
}

.rs-shop__breadcrumb span {
  margin-left: 4px;
}

.rs-shop__catalog {
  position: relative;
  max-width: none;
  margin-inline: auto;
  width: var(--container);
}

.rs-shop__categories {
  display: flex;
  justify-content: center;
  gap: 89px;
  margin-top: -66px;
  margin-bottom: 82px;
  position: relative;
  z-index: 3;
}

.rs-shop-cat {
  display: grid;
  justify-items: center;
  gap: 17px;
  color: var(--gold);
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  line-height: 1;
}

.rs-shop-cat__icon {
  width: 132px;
  height: 132px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #ece8df;
  color: var(--black);
}

.rs-shop-cat.is-active .rs-shop-cat__icon {
  background: var(--gold);
  color: var(--white);
}

.rs-shop-cat__icon svg {
  width: 54px;
  height: 54px;
}

.rs-shop__filters {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 40px;
}

.rs-shop__filter-group,
.rs-shop__sort {
  display: flex;
  align-items: center;
  gap: 20px;
}

.rs-shop__sort {
  gap: 23px;
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  line-height: 1;
}

.rs-shop-filter {
  min-width: 98px;
  height: 60px;
  padding: 0 55px 0px 20px;
  border: 1px solid var(--black);
  border-radius: 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: var(--black);
  background: transparent;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1;
}

.rs-shop-filter--control {
  position: relative;
  cursor: pointer;
}

.rs-shop-filter__input {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  line-height: 1;
  padding: 0 28px 0 0;
  margin: 0;
  width: 100%;
  height: 100%;
  min-width: 0;
  cursor: pointer;
  outline: none;
}

.rs-shop-filter__input::-ms-expand {
  display: none;
}

.rs-shop-filter__input--gold {
  color: var(--white);
}

.rs-shop-filter--gold {
  min-width: 126px;
  border-color: var(--gold);
  background: var(--gold);
  color: var(--white);
}

.rs-shop-filter__chevron {
  position: absolute;
  right: 15px;
  top: 50%;
  width: 8px;
  height: 8px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-50%) rotate(45deg);
  pointer-events: none;
  transition: transform 0.2s ease;
}

.rs-shop-filter--control.is-open .rs-shop-filter__chevron {
  transform: translateY(-50%) rotate(225deg);
}

.rs-shop-filter--control[data-custom-select] .rs-shop-filter__input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}

.rs-custom-select__value {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
  color: inherit;
  font: inherit;
  line-height: 1;
}

.rs-custom-select__menu {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  min-width: 100%;
  background: #faf6ef;
  border: 1px solid var(--black);
  border-radius: 15px;
  padding: 6px 0;
  list-style: none;
  margin: 0;
  z-index: 200;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}

.rs-shop-filter--control.is-open .rs-custom-select__menu {
  display: block;
}

.rs-custom-select__option {
  padding: 11px 24px;
  cursor: pointer;
  font-size: clamp(15px, calc(15px + 0vw), 15px);
  font-family: inherit;
  font-weight: 400;
  line-height: 1;
  white-space: nowrap;
  color: var(--black);
}

.rs-custom-select__option:hover {
  background: rgba(133, 117, 78, 0.1);
}

.rs-custom-select__option--selected {
  font-weight: 700;
}

.rs-custom-select__option--placeholder {
  opacity: 0.5;
}

.rs-shop__sort-arrow {
  display: none;
}

/* ── Mobile filter trigger button (hidden on desktop) ─────────── */
.rs-shop__filter-btn {
  display: none;
  align-items: center;
  gap: 10px;
  height: 35px;
  padding: 0 12px;
  border: 1px solid var(--black);
  border-radius: 9px;
  background: transparent;
  color: var(--black);
  font-size: 14px;
  font-family: inherit;
  font-weight: 400;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
}

/* ── Filter drawer ─────────────────────────────────────────────── */
.rs-shop__filter-drawer {
  position: fixed;
  inset: 0;
  z-index: 600;
  pointer-events: none;
  visibility: hidden;
}

.rs-shop__filter-drawer.is-open {
  pointer-events: auto;
  visibility: visible;
}

.rs-shop__filter-drawer__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(35, 31, 32, 0.5);
  opacity: 0;
  transition: opacity 0.3s ease;
  cursor: pointer;
}

.rs-shop__filter-drawer.is-open .rs-shop__filter-drawer__backdrop {
  opacity: 1;
}

.rs-shop__filter-drawer__panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: var(--cream, #f3f0ea);
  border-radius: 20px 20px 0 0;
  padding-bottom: max(env(safe-area-inset-bottom), 24px);
  transform: translateY(100%);
  transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1);
  max-height: 90vh;
  overflow-y: auto;
}

.rs-shop__filter-drawer.is-open .rs-shop__filter-drawer__panel {
  transform: translateY(0);
}

.rs-shop__filter-drawer__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 22px 24px 18px;
  border-bottom: 1px solid rgba(35, 31, 32, 0.1);
}

.rs-shop__filter-drawer__title {
  font-size: 18px;
  font-weight: 700;
  color: var(--black);
}

.rs-shop__filter-drawer__close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: transparent;
  border: none;
  cursor: pointer;
  color: var(--black);
  padding: 0;
}

.rs-shop__filter-drawer__form {
  padding: 0 24px;
}

.rs-shop__filter-drawer__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 0;
  border-bottom: 1px solid rgba(35, 31, 32, 0.08);
}

.rs-shop__filter-drawer__label {
  font-size: 16px;
  font-weight: 700;
  color: var(--black);
}

.rs-shop__filter-drawer__select {
  appearance: none;
  -webkit-appearance: none;
  background-color: transparent;
  background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23231f20' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 10px;
  border: 1px solid var(--black);
  border-radius: 8px;
  padding: 8px 28px 8px 12px;
  font-size: 14px;
  font-family: inherit;
  color: var(--black);
  cursor: pointer;
  min-width: 110px;
}

.rs-shop__filter-drawer__foot {
  padding: 24px 0 4px;
}

.rs-shop__filter-drawer__apply {
  display: block;
  width: 100%;
  height: 52px;
  background: var(--gold, #85754e);
  color: var(--white, #fff);
  border: none;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
}

.rs-shop-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  justify-content: stretch;
  gap: clamp(24px, 1.8vw, 36px) clamp(18px, 1.7vw, 32px);
  width: 100%;
}

.rs-shop-card {
  position: relative;
  width: 100%;
  max-width: 380px;
  background: transparent;
  overflow: visible;
  list-style: none;
  isolation: isolate;
  container-type: inline-size;
}

.rs-shop .rs-shop-grid > .rs-shop-card {
  max-width: none;
  justify-self: stretch;
  min-width: 0;
}

.rs-shop-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--white);
  box-shadow: 0 0 4.8px rgba(0, 0, 0, 0.04);
  border-radius: 10px;
  /* 2-badge notch: 69×137 px with 10px-radius rounded corners (3 mid points per corner). */
  clip-path: polygon(
    0 0,
    calc(100% - 79px) 0,
    calc(100% - 75px) 1px,
    calc(100% - 72px) 3px,
    calc(100% - 70px) 6px,
    calc(100% - 69px) 10px,
    calc(100% - 69px) 127px,
    calc(100% - 68px) 131px,
    calc(100% - 66px) 134px,
    calc(100% - 63px) 136px,
    calc(100% - 59px) 137px,
    calc(100% - 10px) 137px,
    calc(100% - 6px) 138px,
    calc(100% - 3px) 140px,
    calc(100% - 1px) 143px,
    100% 147px,
    100% 100%,
    0 100%
  );
  transition:
    box-shadow 0.22s ease,
    opacity 0.22s ease;
  z-index: 0;
}

.rs-shop-card--badges-0::before {
  clip-path: none;
}

.rs-shop-card--badges-1::before {
  /* 1-badge notch: 69×71 px with 10px-radius rounded corners. */
  clip-path: polygon(
    0 0,
    calc(100% - 79px) 0,
    calc(100% - 75px) 1px,
    calc(100% - 72px) 3px,
    calc(100% - 70px) 6px,
    calc(100% - 69px) 10px,
    calc(100% - 69px) 61px,
    calc(100% - 68px) 65px,
    calc(100% - 66px) 68px,
    calc(100% - 63px) 70px,
    calc(100% - 59px) 71px,
    calc(100% - 10px) 71px,
    calc(100% - 6px) 72px,
    calc(100% - 3px) 74px,
    calc(100% - 1px) 77px,
    100% 81px,
    100% 100%,
    0 100%
  );
}

.rs-shop-card:hover::before {
  opacity: 0;
}

.rs-shop-card::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 0;
  background: var(--card-brand, var(--gold));
  border-radius: 8px;
  /* Bottom-right cart notch: 67×69 px with 8px-radius rounded corners. */
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - 77px),
    calc(100% - 1px) calc(100% - 74px),
    calc(100% - 2px) calc(100% - 71px),
    calc(100% - 5px) calc(100% - 70px),
    calc(100% - 8px) calc(100% - 69px),
    calc(100% - 59px) calc(100% - 69px),
    calc(100% - 62px) calc(100% - 68px),
    calc(100% - 65px) calc(100% - 67px),
    calc(100% - 66px) calc(100% - 64px),
    calc(100% - 67px) calc(100% - 61px),
    calc(100% - 67px) calc(100% - 8px),
    calc(100% - 68px) calc(100% - 5px),
    calc(100% - 69px) calc(100% - 2px),
    calc(100% - 72px) calc(100% - 1px),
    calc(100% - 75px) 100%,
    0 100%
  );
  transition: height 0.22s ease;
  z-index: 0;
}

.rs-shop-card:hover::after {
  height: 64.22%; /* matches Figma — fill section from mid-card down */
}

/* Hover fill + cart button colour by brand.
   Each product_brand term sets its own colour via the ACF "Card Colour" field,
   applied as the --card-brand custom property on the card (see shop-card.php).
   Falls back to gold when a brand has no colour set. */

.rs-shop-card__link {
  display: flex;
  flex-direction: column;
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 100%;
  color: inherit;
  padding: 0;
  z-index: 1;
}

.rs-shop-card__heart-btn {
  position: absolute;
  top: 19px;
  left: 19px;
  z-index: 2;
  width: 30px;
  height: 30px;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  color: var(--black);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.2s ease;
}

.rs-shop-card__heart-btn svg {
  width: 26px;
  height: 26px;
}

.rs-shop-card__heart-btn.is-wishlisted {
  color: #e03;
}

.rs-shop-card__heart-btn.is-wishlisted svg path {
  fill: #e03;
  stroke: #e03;
}

.icon-btn--wishlist {
  position: relative;
}

a.icon-btn.icon-btn--wishlist {
  width: 36px;
}

.brand-page-template .brand-intro::before {
  content: "";
  position: absolute;
  right: 0;
  top: -140px;
  z-index: 0;
  width: 651px;
  height: 993px;
  background: url(assets/images/the-coffee/quality-beans-strip.png) center /
    cover no-repeat;
  opacity: 1;
  mix-blend-mode: lighten;
  pointer-events: none;
  transform: translateX(38%);
}

.wishlist-count {
  position: absolute;
  top: -5px;
  right: -5px;
  min-width: 16px;
  height: 16px;
  background: var(--gold);
  color: var(--white);
  font-size: clamp(10px, calc(10px + 0vw), 10px);
  font-weight: 700;
  border-radius: 8px;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 0 3px;
  line-height: 1;
}

.wishlist-count.has-items {
  display: flex;
}

.wishlist-page {
  padding: 80px 0;
  min-height: 60vh;
}

.wishlist-page__title {
  font-size: clamp(32px, calc(6.398278px + 2.583423vw), 56px);
  font-weight: 900;
  color: var(--black);
  margin-bottom: 48px;
}

.wishlist-page__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 24px;
}

.wishlist-page__empty {
  color: var(--black);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  grid-column: 1 / -1;
}

@media (max-width: 991px) {
  /* Header: light on mobile (Figma shows cream nav) */
  .page-template-page-wishlist .site-header {
    background: var(--cream);
  }

  .page-template-page-wishlist .header-nav,
  .page-template-page-wishlist .main-header {
    background: var(--cream);
  }

  .page-template-page-wishlist .header-nav__menu li a,
  .page-template-page-wishlist .header-nav__pro a,
  .page-template-page-wishlist .header-nav .icon-btn,
  .page-template-page-wishlist .header-nav__eshop-item > a {
    color: var(--black);
  }

  .page-template-page-wishlist .header-nav__logo-img {
    content: url("assets/images/logo-rossetti-nav.svg");
    filter: none;
  }

  /* Page: reduce padding */
  .wishlist-page {
    padding: 40px 0 60px;
    min-height: 0;
  }

  /* Title: 32px at 991px, centered */
  .wishlist-page__title {
    font-size: clamp(32px, calc(6.398278px + 2.583423vw), 56px);
    text-align: center;
    margin-bottom: 32px;
  }

  /* Grid: 1 column, cards centered */
  .wishlist-page__grid {
    grid-template-columns: minmax(min(340px, 100%), 340px);
    justify-content: center;
    gap: 24px;
    padding-inline: var(--gutter);
  }

  .wishlist-page__empty {
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    text-align: center;
    grid-column: 1 / -1;
  }
}

/* Wishlist page: dark header */
.page-template-page-wishlist .site-header {
  position: sticky;
  inset: auto;
  top: 0;
  z-index: 1000;
  background: var(--black);
  padding-bottom: 0;
}

.page-template-page-wishlist .header-nav,
.page-template-page-wishlist .main-header {
  background: var(--black);
}

.page-template-page-wishlist .site-breadcrumb,
.page-template-page-wishlist .header-topbar__lang,
.page-template-page-wishlist .header-topbar__lang a,
.page-template-page-wishlist .header-topbar__lang a.active,
.page-template-page-wishlist .header-topbar__lang span,
.page-template-page-wishlist .header-topbar__message,
.page-template-page-wishlist .header-nav__menu li a,
.page-template-page-wishlist .header-nav__pro a,
.page-template-page-wishlist .header-nav .icon-btn,
.page-template-page-wishlist .header-nav__eshop-item > a {
  color: var(--white);
}

.page-template-page-wishlist .header-nav__eshop-item > a {
  border-color: var(--white);
}

.page-template-page-wishlist .header-nav__menu .sub-menu {
  background: var(--black);
}

.page-template-page-wishlist .header-nav__menu .sub-menu a {
  color: var(--white);
}

.page-template-page-wishlist .header-nav__logo-img {
  content: url("assets/images/logo-rossetti-footer.svg");
  filter: none;
}

/* ── Image zone: always 395:362 aspect ratio ─────────── */
.rs-shop-card__image-zone {
  position: relative;
  flex: 0 0 auto;
  width: 100%;
  aspect-ratio: 395 / 362;
  overflow: visible;
}

.rs-shop-card__badge {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  width: 61px; /* 60/395 */
  aspect-ratio: 1;
  background: var(--white);
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--black);
  font-size: clamp(11px, calc(5.666308px + 0.538213vw), 16px);
  font-weight: 700;
  line-height: 1;
  height: 63px;
}

.rs-shop-card__badge--decaf {
  top: 68px; /* 67/362 — under the New badge */
  background: var(--gold);
  color: var(--white);
}

.rs-shop-card__badge--decaf svg {
  width: 60%;
  height: 60%;
}

.rs-shop-card__cart {
  position: absolute;
  right: 0cqi; /* ~10px from right at 395 card width */
  bottom: 0cqi; /* ~10px from bottom */
  z-index: 4;
  width: 61px;
  height: 63px;
  box-sizing: border-box;
  border-radius: 10px;
  border: 0;
  background: var(--card-brand, var(--gold));
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.22s ease;
}

.rs-shop-card:hover .rs-shop-card__cart {
  opacity: 1;
  pointer-events: auto;
}

.rs-shop-card__cart svg {
  width: 55%;
  height: 55%;
}

.rs-shop-card__image {
  position: absolute;
  left: 50%;
  top: 5.52%; /* 20/362 */
  width: 70.75%; /* 315/395 */
  height: 79.29%; /* 315/362 */
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateX(-50%) rotate(-0.32deg);
  transform-origin: center;
  transition:
    top 0.25s ease,
    width 0.25s ease,
    height 0.25s ease,
    transform 0.25s ease,
    filter 0.25s ease;
  z-index: 1;
}

.rs-shop-card__image img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: contain;
}

.rs-shop-card:hover .rs-shop-card__image {
  top: 0%; /* -41/362 */
  height: 100%; /* 433/362 */
  width: 80%;
  transform: translateX(-50%) rotate(-14.73deg);
}

/* ── Body: flex column text content ─────────────────── */
.rs-shop-card__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 0 9.37% 0px; /* 37px sides, 36px bottom breathing room */
  position: relative;
  z-index: 2;
  pointer-events: none;
  transition: transform 0.22s ease;
  margin-top: -30px;
  margin-bottom: 30px;
}

.rs-shop-card:hover .rs-shop-card__body {
  transform: translateY(5%);
  color: var(--white);
}

.rs-shop-card__title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  color: var(--black);
  font-size: clamp(16px, calc(7.466093px + 0.861141vw), 24px);
  font-weight: 700;
  line-height: 1.2;
  margin: 0;
  transition: color 0.18s ease;
}

.rs-shop-card__desc {
  display: -webkit-box;
  height: 65px;
  min-height: 65px;
  margin: 15px 0 0;
  overflow: hidden;
  color: var(--black);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  transition: color 0.18s ease;
}

.rs-shop-card__old {
  display: block;
  margin: 27px 0 0;
  color: var(--gray);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1;
  text-decoration: none;
  transition: color 0.18s ease;
}

.rs-shop-card__price {
  display: block;
  margin: 14px 0 0;
  color: var(--black);
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  font-weight: 700;
  line-height: 1;
  transition: color 0.18s ease;
}

.rs-shop-card__price del,
.rs-shop-card__price ins {
  text-decoration: none;
}

.rs-shop-card__price del {
  display: none;
}

.rs-shop-card__offer {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 22px 0 0;
  color: var(--gray);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1;
  transition: color 0.18s ease;
}

.rs-shop-card__discount {
  width: 69px;
  height: 30px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--gold);
  color: var(--white);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  transition:
    background 0.18s ease,
    color 0.18s ease;
}

.rs-shop-card:hover .rs-shop-card__title,
.rs-shop-card:hover .rs-shop-card__desc,
.rs-shop-card:hover .rs-shop-card__old,
.rs-shop-card:hover .rs-shop-card__price,
.rs-shop-card:hover .rs-shop-card__offer {
  color: var(--white);
}

.rs-shop-card:hover .rs-shop-card__desc {
  max-width: 88%;
}

.rs-shop-card:hover .rs-shop-card__discount {
  background: var(--white);
  color: var(--black);
}

.rs-shop__more {
  display: grid;
  justify-items: center;
  gap: 24px;
  margin-top: 64px;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1;
}

.rs-shop__more-btn {
  height: 60px;
  min-width: 134px;
  padding: 0 26px;
  border-radius: 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--gold);
  color: var(--white);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
}

.rs-shop__empty {
  padding: 80px 0 160px;
  text-align: center;
  font-size: clamp(20px, calc(20px + 0vw), 20px);
}

@media (max-width: 1550px) {
  .rs-shop__catalog {
    padding-inline: 48px;
  }

  .rs-shop__categories {
    gap: 54px;
  }

  .rs-shop-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 32px 22px;
  }
}

@media (max-width: 1180px) {
  .rs-shop__categories {
    gap: 26px;
  }

  .rs-shop-cat__icon {
    width: 104px;
    height: 104px;
  }

  .rs-shop__filters {
    align-items: flex-start;
    gap: 28px;
  }

  .rs-shop__filter-group {
    flex-wrap: wrap;
  }

  .rs-shop-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 26px 16px;
  }
}

@media (max-width: 991px) {
  /* — Mast — */
  .rs-shop__mast {
    height: 110px;
  }

  /* — Catalog: full width, sections add their own padding — */
  .rs-shop__catalog {
    width: 100%;
    padding: 0 0 80px;
  }

  /* — Categories: horizontal scroll — */
  .rs-shop__categories {
    display: flex;
    justify-content: flex-start;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
    gap: 20px;
    margin-top: -40px;
    margin-bottom: 40px;
    margin-left: var(--gutter);
    box-sizing: border-box;
  }

  .rs-shop__categories::-webkit-scrollbar {
    display: none;
  }

  .rs-shop-cat {
    flex: 0 0 auto;
    scroll-snap-align: start;
    font-size: 20px;
    gap: 10px;
  }

  .rs-shop-cat__icon {
    width: 77px;
    height: 77px;
  }

  .rs-shop-cat__icon svg {
    width: 34px;
    height: 34px;
  }

  /* — Filters: sort left, filter chips right — */
  .rs-shop__filters {
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 24px;
    padding-inline: var(--gutter);
  }

  .rs-shop__filter-group {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 8px;
    scrollbar-width: none;
    -ms-overflow-style: none;
    flex: 1;
    justify-content: flex-end;
  }

  .rs-shop__filter-group::-webkit-scrollbar {
    display: none;
  }

  .rs-shop-filter {
    height: 34px;
    padding: 0 28px 0 12px;
    border-radius: 8px;
    font-size: clamp(12px, calc(9.866523px + 0.215285vw), 14px);
    white-space: nowrap;
    flex-shrink: 0;
    min-width: unset;
  }

  .rs-shop-filter--gold {
    min-width: unset;
  }

  .rs-shop__sort {
    font-size: clamp(14px, calc(9.733046px + 0.430571vw), 18px);
    gap: 8px;
    flex-shrink: 0;
    white-space: nowrap;
  }

  /* — Mobile grid: cards fill the available row width — */
  .rs-shop-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-content: stretch;
    gap: 20px 14px;
    padding-inline: 18px;
  }

  .single-roseti_brew_guide .rs-shop-grid {
    padding-inline: 0;
  }

  .rs-shop-card {
    max-width: 100%;
  }

  /* — Card font sizes — */
  .rs-shop-card__title {
    font-size: clamp(20px, calc(15.733046px + 0.430571vw), 24px);
  }

  .rs-shop-card__desc {
    font-size: clamp(13px, calc(9.799785px + 0.322928vw), 16px);
    height: auto;
    min-height: 0;
  }

  .rs-shop-card__old {
    font-size: clamp(13px, calc(9.799785px + 0.322928vw), 16px);
    margin-top: 16px;
  }

  .rs-shop-card__price {
    font-size: clamp(23px, calc(17.666308px + 0.538213vw), 28px);
    margin-top: 12px;
  }

  .rs-shop-card__offer {
    font-size: clamp(13px, calc(9.799785px + 0.322928vw), 16px);
    margin-top: 16px;
  }

  .rs-shop-card__discount {
    font-size: clamp(13px, calc(9.799785px + 0.322928vw), 16px);
    width: 57px;
    height: 25px;
  }

  /* — Badges + notch: scale down to 36×36 badges in a 40px-wide notch — */
  .rs-shop-card__badge {
    width: 36px;
    height: 36px;
    border-radius: 6px;
  }

  .rs-shop-card__badge--decaf {
    top: 40px; /* 36px New badge + 4px gap */
  }

  /* Heart sits closer to the top to line up with the smaller badges */
  .rs-shop-card__heart-btn {
    top: 6px;
  }

  /* 2-badge top-right notch (40×80) + bottom-right cart notch (40×40) */
  .rs-shop-card--badges-2::before {
    clip-path: polygon(
      0 0,
      calc(100% - 48px) 0,
      calc(100% - 44px) 1px,
      calc(100% - 42px) 3px,
      calc(100% - 41px) 5px,
      calc(100% - 40px) 8px,
      calc(100% - 40px) 72px,
      calc(100% - 39px) 76px,
      calc(100% - 37px) 79px,
      calc(100% - 32px) 80px,
      calc(100% - 8px) 80px,
      calc(100% - 4px) 81px,
      calc(100% - 2px) 83px,
      calc(100% - 1px) 85px,
      100% 88px,
      100% calc(100% - 47px),
      calc(100% - 1px) calc(100% - 44px),
      calc(100% - 4px) calc(100% - 41px),
      calc(100% - 7px) calc(100% - 40px),
      calc(100% - 33px) calc(100% - 40px),
      calc(100% - 36px) calc(100% - 39px),
      calc(100% - 39px) calc(100% - 36px),
      calc(100% - 40px) calc(100% - 33px),
      calc(100% - 40px) calc(100% - 7px),
      calc(100% - 41px) calc(100% - 4px),
      calc(100% - 44px) calc(100% - 1px),
      calc(100% - 47px) 100%,
      0 100%
    );
  }

  /* 1-badge top-right notch (40×40) + bottom-right cart notch (40×40) */
  .rs-shop-card--badges-1::before {
    clip-path: polygon(
      0 0,
      calc(100% - 48px) 0,
      calc(100% - 44px) 1px,
      calc(100% - 42px) 3px,
      calc(100% - 41px) 5px,
      calc(100% - 40px) 8px,
      calc(100% - 40px) 32px,
      calc(100% - 39px) 36px,
      calc(100% - 37px) 39px,
      calc(100% - 32px) 40px,
      calc(100% - 8px) 40px,
      calc(100% - 4px) 41px,
      calc(100% - 2px) 43px,
      calc(100% - 1px) 45px,
      100% 48px,
      100% calc(100% - 47px),
      calc(100% - 1px) calc(100% - 44px),
      calc(100% - 4px) calc(100% - 41px),
      calc(100% - 7px) calc(100% - 40px),
      calc(100% - 33px) calc(100% - 40px),
      calc(100% - 36px) calc(100% - 39px),
      calc(100% - 39px) calc(100% - 36px),
      calc(100% - 40px) calc(100% - 33px),
      calc(100% - 40px) calc(100% - 7px),
      calc(100% - 41px) calc(100% - 4px),
      calc(100% - 44px) calc(100% - 1px),
      calc(100% - 47px) 100%,
      0 100%
    );
  }

  /* 0-badge: just the bottom-right cart notch (40×40) */
  .rs-shop-card--badges-0::before {
    clip-path: polygon(
      0 0,
      100% 0,
      100% calc(100% - 47px),
      calc(100% - 1px) calc(100% - 44px),
      calc(100% - 4px) calc(100% - 41px),
      calc(100% - 7px) calc(100% - 40px),
      calc(100% - 33px) calc(100% - 40px),
      calc(100% - 36px) calc(100% - 39px),
      calc(100% - 39px) calc(100% - 36px),
      calc(100% - 40px) calc(100% - 33px),
      calc(100% - 40px) calc(100% - 7px),
      calc(100% - 41px) calc(100% - 4px),
      calc(100% - 44px) calc(100% - 1px),
      calc(100% - 47px) 100%,
      0 100%
    );
  }

  /* Add-to-cart: permanently visible on mobile (not hover), 36×36 in the notch */
  .rs-shop-card__cart {
    width: 36px;
    height: 36px;
    border-radius: 5px;
    right: 0;
    bottom: 0;
    opacity: 1;
    pointer-events: auto;
  }

  /* No hover transformation on mobile — neutralize the desktop hover state
     (avoids sticky :hover after a tap on touch devices) */
  .rs-shop-card:hover::before {
    opacity: 1;
  }

  .rs-shop-card:hover::after {
    height: 0;
  }

  .rs-shop-card:hover .rs-shop-card__image {
    top: 5.52%;
    width: 79.75%;
    height: 87.29%;
    transform: translateX(-50%) rotate(-0.32deg);
  }

  .rs-shop-card:hover .rs-shop-card__body {
    transform: none;
    color: var(--black);
  }

  .rs-shop-card:hover .rs-shop-card__title,
  .rs-shop-card:hover .rs-shop-card__desc,
  .rs-shop-card:hover .rs-shop-card__price {
    color: var(--black);
  }

  .rs-shop-card:hover .rs-shop-card__old,
  .rs-shop-card:hover .rs-shop-card__offer {
    color: var(--gray);
  }

  .rs-shop-card:hover .rs-shop-card__discount {
    background: var(--gold);
    color: var(--white);
  }

  /* — Hide desktop filter chips, show mobile filter button — */
  .rs-shop__filter-group {
    display: none;
  }

  .rs-shop__filter-btn {
    display: flex;
  }

  /* — Sort by: strip gold pill, show as plain text + arrow — */
  .rs-shop__sort {
    position: relative;
  }

  .rs-shop__sort-arrow {
    display: block;
    pointer-events: none;
    flex-shrink: 0;
    color: var(--black);
  }

  .rs-shop__sort .rs-shop-filter--gold {
    position: absolute;
    inset: 0;
    background: transparent;
    border-color: transparent;
    color: transparent;
    min-width: 0;
    padding: 0;
    height: auto;
    z-index: 1;
  }

  .rs-shop__sort .rs-custom-select__value,
  .rs-shop__sort .rs-shop-filter__chevron {
    display: none;
  }

  /* — Load more — */
  .rs-shop__more {
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    margin-top: 40px;
    padding-inline: var(--gutter);
  }

  .rs-shop__more-btn {
    height: 50px;
    border-radius: 12px;
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    min-width: 120px;
    padding: 0 20px;
  }
}

@media (max-width: 560px) {
  .rs-shop-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* =====================================================
   SINGLE PRODUCT — sp- namespace
   ===================================================== */

/* ---- Page wrapper ---------------------------------- */
.sp-page {
  background: var(--white);
}

/* ---- Hero section ---------------------------------- */
.sp-hero {
  padding: 60px 0 80px;
  background: var(--cream);
}

.sp-wrap {
  display: grid;
  grid-template-columns: 750px 1fr 164px;
  gap: 0 32px;
  align-items: start;
}

/* ---- Gallery -------------------------------------- */
.sp-gallery {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.sp-gallery__thumbs {
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 0 0 103px;
}

.sp-thumb {
  width: 103px;
  height: 103px;
  border: 2px solid transparent;
  border-radius: 4px;
  overflow: hidden;
  padding: 0;
  cursor: pointer;
  background: var(--white);
  transition: border-color 0.2s;
}

.sp-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sp-thumb.is-active,
.sp-thumb:hover {
  border-color: var(--gold);
}

.sp-gallery__main {
  position: relative;
  flex: 1;
  max-width: 652px;
  background: var(--white);
  border-radius: 4px;
  overflow: hidden;
}

.sp-gallery__img {
  width: 100%;
  height: 700px;
  object-fit: cover;
  display: block;
}

/* New badge */
.sp-badge {
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 2;
  background: var(--gold);
  color: var(--white);
  font-family: var(--font);
  font-size: clamp(12px, calc(12px + 0vw), 12px);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 2px;
}

/* Wishlist icon over main image */
.sp-wishlist-img {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 2;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.85);
  color: var(--black);
  cursor: pointer;
  transition:
    background 0.2s,
    color 0.2s;
}

.sp-wishlist-img:hover {
  background: var(--gold);
  color: var(--white);
}

/* ---- Product info ---------------------------------- */
.sp-info {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding-top: 8px;
}

.sp-title {
  font-family: var(--font);
  font-size: clamp(32px, calc(32px + 0vw), 32px);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--black);
  line-height: 1.15;
  margin: 0;
}

.sp-short-desc {
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  color: var(--gray);
  line-height: 1.65;
  max-width: 480px;
}

/* Intensity bars */
.sp-intensity {
  display: flex;
  align-items: center;
  gap: 14px;
}

.sp-intensity__label {
  font-size: clamp(13px, calc(13px + 0vw), 13px);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--black);
  min-width: 72px;
}

.sp-intensity__bars {
  display: flex;
  gap: 6px;
}

.sp-intensity__bar {
  display: block;
  width: 28px;
  height: 10px;
  border-radius: 2px;
  background: var(--cream-mid);
  transition: background 0.2s;
}

.sp-intensity__bar.is-filled {
  background: var(--gold);
}

/* Flavor notes */
.sp-notes {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.sp-notes__label {
  font-size: clamp(13px, calc(13px + 0vw), 13px);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--black);
  min-width: 72px;
  padding-top: 3px;
}

.sp-notes__list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.sp-notes__item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  color: var(--black);
}

.sp-notes__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gold);
  flex-shrink: 0;
}

/* Option selectors (weight / grind) */
.sp-options {
  display: flex;
  align-items: center;
  gap: 14px;
}

.sp-options__label {
  font-size: clamp(13px, calc(13px + 0vw), 13px);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--black);
  min-width: 72px;
}

.sp-options__btns {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.sp-opt-btn {
  height: 40px;
  padding: 0 18px;
  border: 1.5px solid var(--cream-mid);
  border-radius: 4px;
  background: var(--white);
  font-family: var(--font);
  font-size: clamp(13px, calc(13px + 0vw), 13px);
  font-weight: 400;
  color: var(--black);
  cursor: pointer;
  transition:
    border-color 0.2s,
    background 0.2s,
    color 0.2s;
}

.sp-opt-btn.is-active,
.sp-opt-btn:hover {
  border-color: var(--gold);
  background: var(--gold);
  color: var(--white);
}

/* Promo row */
.sp-promo {
  display: flex;
  align-items: center;
  gap: 10px;
}

.sp-promo__pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 28px;
  padding: 0 12px;
  border-radius: 14px;
  background: var(--red);
  color: var(--white);
  font-size: clamp(12px, calc(12px + 0vw), 12px);
  font-weight: 700;
  letter-spacing: 0.04em;
}

.sp-promo__text {
  font-size: clamp(13px, calc(13px + 0vw), 13px);
  color: var(--gray);
}

/* Prices */
.sp-purchase {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}

.sp-prices {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.sp-price--regular {
  font-size: clamp(15px, calc(15px + 0vw), 15px);
  color: var(--gray);
  text-decoration: line-through;
}

.sp-price--sale {
  font-size: clamp(26px, calc(26px + 0vw), 26px);
  font-weight: 700;
  color: var(--black);
  line-height: 1;
}

.sp-price--sale .woocommerce-Price-amount {
  font-size: inherit;
  font-weight: inherit;
  color: inherit;
}

/* Actions row */
.sp-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* WooCommerce add-to-cart button overrides for single product */
.sp-page .single_add_to_cart_button,
.sp-actions .button {
  height: 52px;
  padding: 0 32px;
  background: var(--black);
  color: var(--white);
  font-family: var(--font);
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  transition: background 0.2s;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.sp-page .single_add_to_cart_button:hover,
.sp-actions .button:hover {
  background: var(--gold);
}

.sp-page .cart {
  display: flex;
  align-items: center;
  gap: 12px;
}

.sp-page .qty {
  height: 52px;
  width: 70px;
  border: 1.5px solid var(--cream-mid);
  border-radius: 4px;
  text-align: center;
  font-family: var(--font);
  font-size: clamp(15px, calc(15px + 0vw), 15px);
  color: var(--black);
  background: var(--white);
  padding: 0 8px;
}

.sp-wishlist-btn {
  width: 52px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid var(--cream-mid);
  border-radius: 4px;
  background: var(--white);
  color: var(--black);
  cursor: pointer;
  transition:
    border-color 0.2s,
    color 0.2s;
}

.sp-wishlist-btn:hover {
  border-color: var(--gold);
  color: var(--gold);
}

/* ---- Specs column --------------------------------- */
.sp-specs {
  display: flex;
  flex-direction: column;
  gap: 0;
  border-left: 1px solid var(--cream-mid);
  padding-left: 28px;
  padding-top: 8px;
}

.sp-spec {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 14px 0;
}

.sp-spec__label {
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--gray);
}

.sp-spec__value {
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  font-weight: 400;
  color: var(--black);
}

.sp-spec__divider {
  border: none;
  border-top: 1px solid var(--cream-mid);
  margin: 0;
}

/* ---- Awards banner --------------------------------- */
.sp-awards {
  background: var(--black) center center / cover no-repeat;
  padding: 80px 0;
  position: relative;
}

.sp-awards::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(35, 31, 32, 0.78);
}

.sp-awards__inner {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px;
  text-align: center;
}

.sp-award img {
  width: 80px;
  height: 80px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}

.sp-award__text {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--white);
  line-height: 1.3;
}

/* ---- Product details ------------------------------- */
.sp-details {
  padding: 100px 0;
  background: var(--white);
}

.sp-details__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: start;
}

.sp-details__tab-header {
  margin-bottom: 32px;
}

.sp-details__tab-label {
  font-size: clamp(22px, calc(22px + 0vw), 22px);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--black);
  display: inline-block;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--gold);
}

.sp-details__text {
  font-size: clamp(15px, calc(15px + 0vw), 15px);
  color: var(--black);
  line-height: 1.75;
  margin-bottom: 40px;
}

/* Origin info block */
.sp-origin {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-top: 40px;
}

.sp-origin__img {
  width: 176px;
  height: 176px;
  object-fit: cover;
  border-radius: 4px;
  flex-shrink: 0;
}

.sp-origin__label {
  display: block;
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--black);
  margin-bottom: 6px;
}

.sp-origin__sub {
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  color: var(--gray);
}

/* Right details image */
.sp-details__right {
  position: relative;
}

.sp-details__img {
  width: 100%;
  height: 625px;
  object-fit: cover;
  border-radius: 4px;
  display: block;
}

/* ---- About the Brand ------------------------------ */
.sp-brand {
  background: var(--black);
  padding: 80px 0;
}

.sp-brand__inner {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.sp-brand__text {
  max-width: 680px;
}

.sp-brand__heading {
  font-size: clamp(40px, calc(40px + 0vw), 40px);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--white);
  margin-bottom: 20px;
  line-height: 1.15;
}

.sp-brand__desc {
  font-size: clamp(15px, calc(15px + 0vw), 15px);
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.75;
  margin-bottom: 36px;
}

.sp-brand__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 50px;
  padding: 0 36px;
  border: 1.5px solid var(--white);
  border-radius: 4px;
  font-family: var(--font);
  font-size: clamp(13px, calc(13px + 0vw), 13px);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--white);
  text-decoration: none;
  transition:
    background 0.2s,
    color 0.2s,
    border-color 0.2s;
}

.sp-brand__cta:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--white);
}

/* ---- Similar / related products ------------------- */
.sp-related {
  padding: 80px 0 100px;
  background: var(--cream);
}

.sp-related__heading {
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--black);
  margin-bottom: 40px;
}

.sp-related__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

.sp-related__card {
  background: var(--white);
}

/* =====================================================
   SINGLE PRODUCT — RESPONSIVE
   ===================================================== */

@media (max-width: 1400px) {
  .sp-wrap {
    grid-template-columns: 640px 1fr 140px;
    gap: 0 24px;
  }

  .sp-gallery__img {
    height: 580px;
  }
}

@media (max-width: 1200px) {
  .sp-wrap {
    grid-template-columns: 1fr;
    gap: 40px 0;
  }

  .sp-gallery {
    max-width: 700px;
  }

  .sp-gallery__img {
    height: 480px;
  }

  .sp-specs {
    border-left: none;
    border-top: 1px solid var(--cream-mid);
    padding-left: 0;
    padding-top: 24px;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0 40px;
  }

  .sp-spec {
    min-width: 120px;
  }

  .sp-spec__divider {
    display: none;
  }

  .sp-awards__inner {
    grid-template-columns: repeat(2, 1fr);
    gap: 48px;
  }

  .sp-related__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 1024px) {
  .sp-hero {
    padding: 40px 0 60px;
  }

  .sp-wrap {
    padding-inline: 40px;
  }

  .sp-gallery__thumbs {
    flex-direction: row;
    flex: unset;
    width: 100%;
    overflow-x: auto;
  }

  .sp-thumb {
    flex-shrink: 0;
  }

  .sp-gallery {
    flex-direction: column;
  }

  .sp-gallery__img {
    height: 380px;
  }

  .sp-details__inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .sp-details__img {
    height: 320px;
  }

  .sp-brand__heading {
    font-size: clamp(30px, calc(30px + 0vw), 30px);
  }
}

/* WooCommerce short-description global reset */
.woocommerce-product-details__short-description,
.woocommerce-product-details__short-description p,
.short-description,
.short-description p {
  color: var(--black) !important;
  font-style: normal !important;
}

/* ============================================================
   ACADEMY PAGE  (ac-)
   ============================================================ */

/* ── Hero ────────────────────────────────────────────────── */
/* ── Academy Hero ────────────────────────────────────────── */
.ac-hero {
  position: relative;
  min-height: 300px;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--black);
}

.ac-hero__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0.35;
}

.ac-hero__overlay {
  display: none;
}

.ac-hero__inner {
  position: relative;
  z-index: 2;
  width: 100%;
  padding-bottom: 44px;
}

.ac-hero__breadcrumb {
  font-family: "PF Bague Sans Pro", sans-serif;
  font-weight: 400;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: #fff;
  margin: 0 0 60px;
}

.ac-hero__title {
  font-family: "PF Bague Sans Pro", sans-serif;
  font-weight: 900;
  font-size: clamp(48px, calc(-18.137783px + 6.673843vw), 110px);
  color: transparent;
  -webkit-text-stroke: 2px var(--gold);
  text-align: center;
  margin: 0;
  line-height: 0.94;
  letter-spacing: 0.04em;
}

/* ── Academy headings mixed color ───────────────────────── */
.ac-heading-outline {
  color: transparent;
  -webkit-text-stroke: 1.5px var(--black);
}

/* ── Courses ─────────────────────────────────────────────── */
.ac-courses {
  background: var(--cream);
  padding: 80px 0 100px;
}

.ac-courses__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 60px;
}

.ac-courses__label {
  display: block;
  font-family: "PF Bague Sans Pro", sans-serif;
  font-weight: 700;
  font-size: clamp(14px, calc(9.733046px + 0.430571vw), 18px);
  color: var(--gold);
  margin-bottom: 14px;
}

.ac-courses__heading {
  font-family: "PF Bague Sans Pro", sans-serif;
  font-weight: 900;
  font-size: clamp(32px, calc(2.131324px + 3.013994vw), 60px);
  color: var(--black);
  margin: 0 0 18px;
  line-height: 1.1;
  letter-spacing: 0;
}

.ac-courses__desc {
  font-family: "PF Bague Sans Pro", sans-serif;
  font-weight: 400;
  font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
  line-height: 1.5;
  color: var(--black);
  max-width: 667px;
  margin: 0;
}

.ac-courses__filter-group {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-shrink: 0;
}

.ac-courses__sort-label {
  font-family: "PF Bague Sans Pro", sans-serif;
  font-weight: 700;
  font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
  color: var(--black);
}

.ac-courses__filter {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 30px;
  border: 1px solid var(--black);
  border-radius: 15px;
  cursor: pointer;
  height: 60px;
  justify-content: space-between;
}

.ac-courses__filter-label {
  font-family: "PF Bague Sans Pro", sans-serif;
  font-weight: 700;
  font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
  color: var(--black);
}

.ac-courses__slider-outer {
  position: relative;
}

.ac-courses__track-wrap {
  overflow: hidden;
}

.ac-courses__track {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 80px 3.85%;
}

.ac-courses__counter {
  display: none;
}

.ac-courses__counter-num {
  display: block;
  font-family: "PF Bague Sans Pro", sans-serif;
  font-weight: 400;
  font-size: 18px;
  color: var(--gold);
  margin-bottom: 8px;
}

.ac-courses__counter-line {
  position: relative;
  width: 100%;
  height: 1px;
  background: rgba(35, 31, 32, 0.2);
}

.ac-courses__counter-bar {
  position: absolute;
  left: 0;
  top: -1.5px;
  width: 0%;
  height: 4px;
  background: var(--gold);
  transition: width 0.3s ease;
}

/* Course card */
.ac-course-card {
  display: flex;
  flex-direction: column;
}

.ac-course-card__img-wrap {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
}

.ac-course-card__img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 10px;
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - 78px),
    calc(100% - 1px) calc(100% - 73px),
    calc(100% - 5px) calc(100% - 69px),
    calc(100% - 10px) calc(100% - 68px),
    calc(100% - 58px) calc(100% - 68px),
    calc(100% - 63px) calc(100% - 67px),
    calc(100% - 67px) calc(100% - 63px),
    calc(100% - 68px) calc(100% - 58px),
    calc(100% - 68px) calc(100% - 10px),
    calc(100% - 69px) calc(100% - 5px),
    calc(100% - 73px) calc(100% - 1px),
    calc(100% - 78px) 100%,
    0 100%
  );
  transition: clip-path 0.35s ease;
  aspect-ratio: 549 / 533;
  object-fit: cover;
}

.ac-course-card:hover .ac-course-card__img {
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(64% - 18px),
    calc(100% - 1px) calc(64% - 13px),
    calc(100% - 5px) calc(64% - 9px),
    calc(100% - 10px) calc(64% - 8px),
    calc(17% + 2px) calc(64% - 8px),
    calc(17% - 3px) calc(64% - 7px),
    calc(17% - 7px) calc(64% - 3px),
    calc(17% - 8px) calc(64% + 2px),
    calc(17% - 8px) calc(100% - 10px),
    calc(17% - 9px) calc(100% - 5px),
    calc(17% - 13px) calc(100% - 1px),
    calc(17% - 18px) 100%,
    0 100%
  );
}

/* Expanding "View More" panel at bottom-right */
.ac-course-card__btn {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-end;
  gap: 14px;
  width: 60px;
  height: 60px;
  padding: 14px;
  background: var(--gold);
  border: none;
  border-radius: 10px;
  overflow: hidden;
  cursor: pointer;
  color: var(--white);
  text-decoration: none;
  transition:
    width 0.35s ease,
    height 0.35s ease,
    padding 0.35s ease,
    background 0.2s ease;
  padding-bottom: 17px;
  padding-right: 16px;
}

.ac-course-card:hover .ac-course-card__btn {
  width: 83%;
  height: 36%;
  padding: 24px 30px;
  align-items: flex-start;
}

.ac-course-card__btn-desc {
  width: 100%;
  margin: 0;
  font-family: "PF Bague Sans Pro", sans-serif;
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  line-height: 1.45;
  color: var(--white);
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  display: block;
  transition:
    opacity 0.3s ease,
    max-height 0.35s ease;
}

.ac-course-card:hover .ac-course-card__btn-desc {
  opacity: 1;
  max-height: 230px;
}

.ac-course-card__btn-cta {
  display: flex;
  align-items: center;
  gap: 10px;
}

.ac-course-card__btn-text {
  font-family: "PF Bague Sans Pro", sans-serif;
  font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
  font-weight: 700;
  color: var(--white);
  white-space: nowrap;
  opacity: 0;
  max-width: 0;
  overflow: hidden;
  transition:
    opacity 0.35s ease,
    max-width 0.35s ease;
}

.ac-course-card:hover .ac-course-card__btn-text {
  opacity: 1;
  max-width: 120px;
}

.ac-course-card__btn svg {
  flex-shrink: 0;
  width: 26px;
  height: 18px;
}

.ac-course-card__title {
  font-family: "PF Bague Sans Pro", sans-serif;
  font-weight: 700;
  font-size: clamp(14px, calc(-5.201292px + 1.937567vw), 32px);
  color: var(--black);
  margin: 24px 0 0;
  line-height: 1.1;
}

.ac-course-card__duration {
  font-family: "PF Bague Sans Pro", sans-serif;
  font-weight: 400;
  font-size: clamp(12px, calc(5.599569px + 0.645856vw), 18px);
  color: var(--black);
  margin: 10px 0 0;
}

/* ── Brew Guides ──────────────────────────────────────────── */
.ac-brew {
  background: var(--cream);
  padding: 80px 0 0;
  position: relative;
}

.ac-brew__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 56px;
}

.ac-brew__label {
  display: block;
  font-family: "PF Bague Sans Pro", sans-serif;
  font-weight: 700;
  font-size: clamp(14px, calc(9.733046px + 0.430571vw), 18px);
  color: var(--gold);
  margin-bottom: 14px;
}

.ac-brew__heading {
  font-family: "PF Bague Sans Pro", sans-serif;
  font-weight: 900;
  font-size: clamp(32px, calc(2.131324px + 3.013994vw), 60px);
  color: var(--black);
  margin: 0 0 18px;
  line-height: 1.1;
  letter-spacing: 0;
}

.ac-brew__desc {
  font-family: "PF Bague Sans Pro", sans-serif;
  font-weight: 400;
  font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
  line-height: 1.5;
  color: var(--black);
  max-width: 667px;
  margin: 0;
}

/* Counter */
.ac-brew__counter {
  text-align: right;
  flex-shrink: 0;
}

.ac-brew__counter-num {
  display: block;
  font-family: "PF Bague Sans Pro", sans-serif;
  font-weight: 400;
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  color: var(--gold);
  margin-bottom: 8px;
}

.ac-brew__counter-line {
  position: relative;
  width: 214px;
  height: 1px;
  background: rgba(35, 31, 32, 0.2);
}

.ac-brew__counter-bar {
  position: absolute;
  left: 0;
  top: -1.5px;
  width: 0%;
  height: 4px;
  background: var(--gold);
  transition: width 0.3s ease;
}

/* Mobile-only progress bar (rendered below the slider); desktop uses the header counter */
.ac-brew__counter--mobile {
  display: none;
}

/* Slider outer (holds arrows + clipping wrap) */
.ac-brew__slider-outer {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0;
  z-index: 2;
  margin-bottom: -250px;
}

.ac-brew__track-wrap {
  flex: 1;
  overflow: hidden;
}

.ac-brew__track {
  display: flex;
  gap: 24px;
  transition: transform 0.4s ease;
}

.ac-brew__arrow {
  position: relative;
  z-index: 10;
  width: 44px;
  height: 127px;
  padding: 0;
  background: var(--gold);
  border: none;
  border-radius: 4px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: opacity 0.2s;
}

.ac-brew__arrow svg {
  display: block;
}

.ac-brew__arrow svg path {
  stroke: var(--white);
}

.ac-brew__arrow--prev {
  border-radius: 8px 0 0 8px;
}

.ac-brew__arrow--next {
  border-radius: 0 8px 8px 0;
}

.ac-brew__arrow:disabled {
  opacity: 0.25;
  pointer-events: none;
}

/* Brew card */
.ac-brew-card {
  flex: 0 0 calc(25% - 18px);
  min-width: 0;
}

.ac-brew-card__img-wrap {
  display: block;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  aspect-ratio: 393 / 505;
}

.ac-brew-card__img-wrap::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(35, 31, 32, 0.75) 0%,
    rgba(35, 31, 32, 0) 55%
  );
  z-index: 1;
  border-radius: 15px;
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - 78px),
    calc(100% - 1px) calc(100% - 73px),
    calc(100% - 5px) calc(100% - 69px),
    calc(100% - 10px) calc(100% - 68px),
    calc(100% - 58px) calc(100% - 68px),
    calc(100% - 63px) calc(100% - 67px),
    calc(100% - 67px) calc(100% - 63px),
    calc(100% - 68px) calc(100% - 58px),
    calc(100% - 68px) calc(100% - 10px),
    calc(100% - 69px) calc(100% - 5px),
    calc(100% - 73px) calc(100% - 1px),
    calc(100% - 78px) 100%,
    0 100%
  );
  transition: clip-path 0.35s ease;
}

.ac-brew-card:hover .ac-brew-card__img-wrap::before {
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - 78px),
    calc(100% - 1px) calc(100% - 73px),
    calc(100% - 5px) calc(100% - 69px),
    calc(100% - 10px) calc(100% - 68px),
    calc(100% - 148px) calc(100% - 68px),
    calc(100% - 153px) calc(100% - 67px),
    calc(100% - 157px) calc(100% - 63px),
    calc(100% - 158px) calc(100% - 58px),
    calc(100% - 158px) calc(100% - 10px),
    calc(100% - 159px) calc(100% - 5px),
    calc(100% - 163px) calc(100% - 1px),
    calc(100% - 168px) 100%,
    0 100%
  );
}

.ac-brew-card__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - 78px),
    calc(100% - 1px) calc(100% - 73px),
    calc(100% - 5px) calc(100% - 69px),
    calc(100% - 10px) calc(100% - 68px),
    calc(100% - 58px) calc(100% - 68px),
    calc(100% - 63px) calc(100% - 67px),
    calc(100% - 67px) calc(100% - 63px),
    calc(100% - 68px) calc(100% - 58px),
    calc(100% - 68px) calc(100% - 10px),
    calc(100% - 69px) calc(100% - 5px),
    calc(100% - 73px) calc(100% - 1px),
    calc(100% - 78px) 100%,
    0 100%
  );
  transition: clip-path 0.35s ease;
}

.ac-brew-card:hover .ac-brew-card__img {
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - 78px),
    calc(100% - 1px) calc(100% - 73px),
    calc(100% - 5px) calc(100% - 69px),
    calc(100% - 10px) calc(100% - 68px),
    calc(100% - 148px) calc(100% - 68px),
    calc(100% - 153px) calc(100% - 67px),
    calc(100% - 157px) calc(100% - 63px),
    calc(100% - 158px) calc(100% - 58px),
    calc(100% - 158px) calc(100% - 10px),
    calc(100% - 159px) calc(100% - 5px),
    calc(100% - 163px) calc(100% - 1px),
    calc(100% - 168px) 100%,
    0 100%
  );
}

.ac-brew-card__inner {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 24px 20px 20px;
  pointer-events: none;
}

.ac-brew-card__inner a {
  pointer-events: auto;
}

.ac-brew-card__title {
  font-family: "PF Bague Sans Pro", sans-serif;
  font-weight: 700;
  font-size: clamp(20px, calc(7.199139px + 1.291712vw), 32px);
  color: #fff;
  margin: 0;
  line-height: 1.1;
}

/* Expanding "View More" button at bottom-right */
.ac-brew-card__btn {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  width: 60px;
  height: 60px;
  padding: 0 14px;
  background: var(--gold);
  border: none;
  border-radius: 10px;
  overflow: hidden;
  cursor: pointer;
  color: var(--white);
  text-decoration: none;
  transition:
    width 0.35s ease,
    background 0.2s ease;
  padding-right: 17px;
}

.ac-brew-card:hover .ac-brew-card__btn {
  width: 150px;
}

.ac-brew-card__btn-text {
  font-family: "PF Bague Sans Pro", sans-serif;
  font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
  font-weight: 700;
  color: var(--white);
  white-space: nowrap;
  opacity: 0;
  max-width: 0;
  overflow: hidden;
  transition:
    opacity 0.35s ease,
    max-width 0.35s ease;
}

.ac-brew-card:hover .ac-brew-card__btn-text {
  opacity: 1;
  max-width: 120px;
}

.ac-brew-card__btn svg {
  flex-shrink: 0;
  width: 26px;
  height: 18px;
}

/* ── Dark divider ─────────────────────────────────────────── */
.ac-dark-divider {
  position: relative;
  z-index: 1;
  background: var(--black);
  height: 417px;
}

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width: 991px) {
  /* — Hero — */
  .ac-hero {
    min-height: 280px;
  }

  .ac-hero__inner {
    padding-bottom: 20px;
  }

  /* — Courses — */
  .ac-courses {
    padding: 60px 0 56px;
  }

  .ac-courses__header {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 24px;
    padding-right: var(--gutter);
  }

  .ac-courses__header-right {
    width: 100%;
  }

  /* — Sort by: strip the "Featured" pill, show plain label + arrow — */
  .ac-courses__filter-group {
    gap: 8px;
  }

  .ac-courses__filter {
    border: none;
    border-radius: 0;
    height: auto;
    padding: 0;
    gap: 8px;
  }

  .ac-courses__filter-label {
    display: none;
  }

  /* Courses → full-bleed horizontal scroll carousel (same as home slider) */
  .ac-courses__inner {
    width: 100%;
    max-width: none;
    margin: 0;
    padding-left: var(--gutter);
    padding-right: 0;
    overflow: visible;
  }

  .ac-courses__track-wrap {
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .ac-courses__track-wrap::-webkit-scrollbar {
    display: none;
  }

  .ac-courses__track {
    display: flex;
    flex-wrap: nowrap;
    gap: 16px;
    padding-right: var(--gutter);
  }

  /* Course card: 73vw matches Figma (273px / 375px = 72.8%) */
  .ac-course-card {
    flex: 0 0 73vw;
    scroll-snap-align: start;
    min-width: 0;
  }

  .ac-course-card__img-wrap {
    border-radius: 7px;
  }

  .ac-course-card__img {
    aspect-ratio: 4 / 3.5;
    /* Notch matched to the 36px button: 40px distance, 7px corner radius (outer = 47) */
    clip-path: polygon(
      0 0,
      100% 0,
      100% calc(100% - 47px),
      calc(100% - 1px) calc(100% - 44px),
      calc(100% - 4px) calc(100% - 41px),
      calc(100% - 7px) calc(100% - 40px),
      calc(100% - 33px) calc(100% - 40px),
      calc(100% - 36px) calc(100% - 39px),
      calc(100% - 39px) calc(100% - 36px),
      calc(100% - 40px) calc(100% - 33px),
      calc(100% - 40px) calc(100% - 7px),
      calc(100% - 41px) calc(100% - 4px),
      calc(100% - 44px) calc(100% - 1px),
      calc(100% - 47px) 100%,
      0 100%
    );
  }

  /* Shrink the gold "View More" button to 36×36 on mobile */
  .ac-course-card__btn {
    width: 36px;
    height: 36px;
    padding: 0;
    gap: 0;
    border-radius: 7px;
    align-items: center;
    justify-content: center;
  }

  .ac-course-card__btn-cta {
    gap: 0;
  }

  .ac-course-card__btn svg {
    width: 18px;
    height: 12px;
  }

  .ac-courses__counter {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    margin-top: 16px;
    padding-right: var(--gutter);
  }

  /* — Brew guides — */
  .ac-brew {
    padding: 40px 0 0;
  }

  .ac-brew__header {
    width: 100%;
    max-width: none;
    margin-inline: 0;
    padding-left: var(--gutter);
    padding-right: var(--gutter);
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 24px;
  }

  /* Header counter hidden on mobile — the progress bar moves below the slider */
  .ac-brew__header .ac-brew__counter {
    display: none;
  }

  /* Mobile progress bar: stacked below the cards inside the slider wrapper */
  .ac-brew__counter--mobile {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    order: 3;
    box-sizing: border-box;
    width: 100%;
    margin-top: 16px;
    padding-right: var(--gutter);
    text-align: right;
  }

  .ac-brew__counter-line {
    width: 100%;
  }

  /* The mobile bar sits over the dark divider — lighten the track so it reads */
  .ac-brew__counter--mobile .ac-brew__counter-line {
    background: rgba(255, 255, 255, 0.25);
  }

  .ac-brew__counter--mobile .ac-brew__counter-num {
    display: block;
    color: var(--cream);
    font-size: 18px;
    line-height: 1.2;
    margin-bottom: 8px;
    position: relative;
    z-index: 3;
  }

  /* Brew slider → full-bleed horizontal scroll (same pattern as courses) */
  .ac-brew__slider-outer {
    width: 100%;
    max-width: none;
    margin-inline: 0;
    padding-inline: 0;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 0;
    margin-bottom: -195px;
    padding-left: var(--gutter);
  }

  .ac-brew__track-wrap {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
    order: 2;
    padding-left: var(--gutter);
    padding-right: 0;
    box-sizing: border-box;
  }

  .ac-brew__track-wrap::-webkit-scrollbar {
    display: none;
  }

  /* Override JS-applied transform so native scroll works */
  .ac-brew__track {
    flex-wrap: nowrap;
    gap: 16px;
    transform: none !important;
    padding-right: var(--gutter);
  }

  .ac-brew__arrow {
    display: none;
  }

  /* Brew card: 65vw matches Figma (243px / 375px = 64.8%) */
  .ac-brew-card {
    flex: 0 0 clamp(200px, 65vw, 380px);
    scroll-snap-align: start;
    min-width: 0;
  }

  .ac-brew-card__img-wrap {
    border-radius: 7px;
  }

  /* Notch matched to the 36px button: 40px distance, 7px corner radius (outer = 47) */
  .ac-brew-card__img,
  .ac-brew-card__img-wrap::before {
    clip-path: polygon(
      0 0,
      100% 0,
      100% calc(100% - 47px),
      calc(100% - 1px) calc(100% - 44px),
      calc(100% - 4px) calc(100% - 41px),
      calc(100% - 7px) calc(100% - 40px),
      calc(100% - 33px) calc(100% - 40px),
      calc(100% - 36px) calc(100% - 39px),
      calc(100% - 39px) calc(100% - 36px),
      calc(100% - 40px) calc(100% - 33px),
      calc(100% - 40px) calc(100% - 7px),
      calc(100% - 41px) calc(100% - 4px),
      calc(100% - 44px) calc(100% - 1px),
      calc(100% - 47px) 100%,
      0 100%
    );
  }

  /* Shrink the gold "View More" button to 36×36 on mobile */
  .ac-brew-card__btn {
    width: 36px;
    height: 36px;
    padding: 0;
    gap: 0;
    border-radius: 7px;
    justify-content: center;
  }

  .ac-brew-card__btn svg {
    width: 18px;
    height: 12px;
  }

  /* — Dark divider — */
  .ac-dark-divider {
    height: 255px;
  }
}

@media (max-width: 991px) {
  .home .b2b-section {
    height: auto;
    min-height: 0;
    margin-top: clamp(72px, 10vw, 120px);
    padding: 0 0 clamp(72px, 9vw, 100px);
    overflow: hidden;
  }

  .home .b2b-section .container {
    display: block;
    height: auto;
    padding-inline: var(--gutter);
  }

  .home .b2b-section__header {
    position: relative;
    left: auto;
    top: auto;
    width: min(100%, 600px);
    max-width: 600px;
    margin: 0 0 42px;
    padding: 0;
  }

  .home .b2b-section__heading {
    margin-top: 24px;
  }

  .home .b2b-section__heading::after {
    top: auto;
    bottom: -18px;
  }

  .home .b2b-section__text {
    position: static;
    width: 100%;
    max-width: 560px;
    margin: 36px 0 28px;
    line-height: 1.5;
  }

  .home .b2b-section__header .btn-gold {
    position: static;
  }

  .home .b2b-cards {
    height: auto;
    min-height: 0;
    padding-left: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  .home .b2b-card {
    height: auto;
    min-height: clamp(320px, 42vw, 420px);
    min-width: 0;
  }

  .home .b2b-card__title {
    width: min-content;
    max-width: calc(100% - 32px);
    font-size: clamp(30px, calc(17.199139px + 1.291712vw), 42px);
    line-height: 0.98;
    white-space: normal;
    overflow-wrap: anywhere;
  }
}

@media (min-width: 992px) {
  .home .b2b-card__overlay,
  .home .b2b-card__overlay--light {
    padding: 0 18px;
  }

  .home .b2b-card__title {
    width: auto !important;
    max-width: none !important;
    min-width: max-content;
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    writing-mode: horizontal-tb;
  }
}

@media (min-width: 992px) {
  .home .coffee-section {
    height: clamp(620px, 40.52vw, 778px);
    margin-top: -42px;
    overflow: visible;
  }

  .home .coffee-section__inner {
    height: 100%;
  }

  .home .coffee-section__image {
    inset: 42px 0 auto;
    height: calc(100% - 90px);
  }

  .home .coffee-section__content {
    left: 5%;
    width: clamp(520px, 34.38vw, 660px);
    height: 100%;
    padding: clamp(74px, 4.95vw, 95px) clamp(48px, 3.8vw, 73px) 90px;
    border-radius: 30px;
  }

  .home .coffee-section__heading-bg {
    left: clamp(560px, 36.98vw, 710px);
    top: clamp(62px, 4.11vw, 79px);
    font-size: clamp(87px, calc(9.4595vw - 6.622px), 175px);
    line-height: 0.94;
    color: transparent;
    -webkit-text-stroke: 2.5px var(--white);
    opacity: 1;
    z-index: 4;
  }

  .home .coffee-section__subheading {
    display: flex;
    flex-direction: column;
    gap: 0;
    font-size: clamp(44px, calc(26.932185px + 1.722282vw), 60px);
    line-height: 1.1;
    margin: 14px 0 44px;
  }

  .home .coffee-section__subheading span + span {
    color: transparent;
    -webkit-text-stroke: 1px var(--white);
  }

  .home .coffee-divider {
    margin-bottom: 52px;
  }

  .home .coffee-section__text {
    max-width: 501px;
    line-height: 1.36;
    margin-bottom: 16px;
  }

  .home .coffee-section__content .btn-gold {
    left: clamp(48px, 3.9vw, 75px);
    bottom: clamp(62px, 4.7vw, 90px);
  }

  .coffee-play-btn {
    left: 66.8%;
    top: 48%;
    width: clamp(74px, 6.04vw, 116px);
    height: clamp(74px, 6.04vw, 116px);
    background: rgba(255, 255, 255, 0.32);
    border: 0px solid rgba(255, 255, 255, 0.72);
    border-radius: 8px;
  }

  .coffee-play-btn svg {
    width: 38%;
    height: 43%;
  }
}

@media (max-width: 991px) {
  .home .coffee-section {
    height: auto;
    margin-top: 0;
    overflow: hidden;
    background: var(--cream);
  }

  .home .coffee-section__inner {
    display: grid;
    grid-template-columns: 1fr;
    min-height: 0;
    height: auto;
  }

  .home .coffee-section__image {
    position: relative;
    inset: auto;
    order: 2;
    width: 100%;
    height: clamp(360px, 58vw, 620px);
  }

  .home .coffee-section__content {
    position: relative;
    left: auto;
    top: auto;
    order: 1;
    width: min(660px, calc(100% - 48px));
    height: auto;
    min-height: 0;
    margin: 0 auto -56px;
    padding: clamp(56px, 8vw, 82px) clamp(28px, 6vw, 64px);
    border-radius: 24px;
  }

  .home .coffee-section__heading-bg {
    left: clamp(28px, 7vw, 80px);
    top: auto;
    bottom: clamp(235px, 34vw, 400px);
    font-size: clamp(64px, calc(-17.072121px + 8.18084vw), 140px);
    line-height: 0.94;
    color: transparent;
    -webkit-text-stroke: 1.5px var(--white);
    opacity: 1;
    z-index: 5;
  }

  .home .coffee-section__subheading {
    display: flex;
    flex-direction: column;
    font-size: clamp(38px, calc(18.798708px + 1.937567vw), 56px);
    line-height: 1.08;
    margin: 16px 0 36px;
  }

  .home .coffee-section__subheading span + span {
    color: transparent;
    -webkit-text-stroke: 1px var(--white);
  }

  .home .coffee-divider {
    margin-bottom: 36px;
  }

  .home .coffee-section__text {
    max-width: 100%;
    line-height: 1.45;
  }

  .home .coffee-section__content .btn-gold {
    position: static;
    margin-top: 42px;
  }

  .coffee-play-btn {
    left: 50%;
    top: 52%;
    width: clamp(72px, 13vw, 104px);
    height: clamp(72px, 13vw, 104px);
    border-radius: 2px;
  }
}

/* =====================================================
   BRAND PAGE TEMPLATE
   ===================================================== */
.brand-page-template .site-header {
  position: absolute;
  inset: 0 0 auto;
  width: 100%;
  background: transparent;
}

.brand-page-template .header-nav {
  background: transparent;
}

.brand-page-template .header-nav__menu li a,
.brand-page-template .icon-btn {
  color: var(--white);
}

.brand-page-template .header-nav__menu .sub-menu a {
  color: var(--black);
}

.brand-page-template .header-nav__eshop-item > a {
  color: var(--gold);
}

.brand-page-template .header-nav__eshop-item > a:hover {
  color: var(--white);
}

.brand-page-template .header-nav__logo-img {
  content: url("assets/images/logo-rossetti-footer.svg");
}

.brand-page {
  background: var(--black);
  color: var(--white);
  overflow: hidden;
}

.brand-kicker {
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 700;
  line-height: 1.2;
  color: var(--white);
}

.brand-intro {
  position: relative;
  min-height: 1375px;
  padding: 90px 0px 120px;
  background: linear-gradient(
    to bottom,
    var(--black) 0,
    var(--black) 61.92%,
    var(--red) 61.92%,
    var(--red) 100%
  );
}

.brand-breadcrumb {
  position: absolute;
  left: 5%;
  top: 0px;
  z-index: 3;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.2;
}

.brand-watermark {
  position: absolute;
  left: 50%;
  top: 190px;
  width: 760px;
  height: 760px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 12px solid rgba(0, 0, 0, 0.24);
  border-radius: 999px;
  color: rgba(0, 0, 0, 0.2);
  font-size: clamp(360px, calc(360px + 0vw), 360px);
  font-weight: 900;
  line-height: 1;
  transform: translateX(-50%) rotate(-12deg);
  pointer-events: none;
  user-select: none;
}

.brand-page-template .brand-watermark {
  width: 783px;
  height: 823px;
  top: 0px;
  border: none;
  border-radius: 0;
  font-size: 0;
  opacity: 0.13;
  transform: translateX(-50%);
  display: block;
}
.brand-page-template .brand-watermark img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.brand-hero-copy {
  position: relative;
  z-index: 2;
  width: min(100%, 760px);
  margin-inline: auto;
  text-align: center;
}

.brand-hero-copy h1 {
  margin: 14px 0 26px;
  font-size: clamp(48px, calc(35.199139px + 1.291712vw), 60px);
  font-weight: 900;
  line-height: 1.1;
}

.brand-hero-copy h1 span {
  color: transparent;
  -webkit-text-stroke: 1px var(--white);
}

.brand-hero-copy p:last-child {
  max-width: 676px;
  margin-inline: auto;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.35;
}

.brand-pack-card {
  position: absolute;
  left: 5%;
  top: 418px;
  z-index: 4;
  width: min(895px, 46.7vw);
  height: 841px;
  overflow: hidden;
  border-radius: 30px;
  box-shadow: 0 28px 44px rgba(0, 0, 0, 0.2);
}

.brand-pack-slider,
.brand-pack-slider .slick-list,
.brand-pack-slider .slick-track,
.brand-pack-slide {
  width: 100%;
  height: 100%;
}

.brand-pack-slide img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
}

.brand-pack-card__arrows span {
  cursor: pointer;
}

.brand-pack-card__arrows {
  position: absolute;
  right: 36px;
  top: 64px;
  display: flex;
  z-index: 2;
}

.brand-pack-card__arrows span {
  width: 58px;
  height: 58px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
  background: rgba(35, 31, 32, 0.86);
}

.brand-pack-card__arrows span + span {
  background: var(--red);
}

.brand-pack-card__arrows svg {
  width: 18px;
  height: 32px;
}

.brand-pack-card__dots {
  position: absolute;
  left: 50%;
  bottom: 28px;
  display: flex;
  gap: 13px;
  transform: translateX(-50%);
}

.brand-pack-card__dots span {
  width: 13px;
  height: 13px;
  border-radius: 999px;
  background: var(--white);
}

.brand-pack-card__dots .is-active {
  background: var(--red);
}

.brand-quote {
  position: absolute;
  left: calc(50% + 94px);
  top: 655px;
  z-index: 3;
  display: grid;
  grid-template-columns: 38px minmax(0, 488px);
  gap: 18px;
  align-items: start;
}

.brand-quote > span,
.brand-red-cta__text > span {
  color: var(--red);
  font-size: clamp(76px, calc(76px + 0vw), 76px);
  font-weight: 900;
  line-height: 0.8;
}

.brand-quote p,
.brand-red-cta__text p {
  font-size: clamp(24px, calc(15.466093px + 0.861141vw), 32px);
  font-weight: 700;
  line-height: 1.42;
}

.brand-quote strong {
  color: var(--red);
}

.brand-quality-grid {
  position: absolute;
  left: calc(50% + 96px);
  right: auto;
  top: 950px;
  z-index: 3;
  width: min(800px, calc(50vw - 160px));
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(42px, 4vw, 88px);
  row-gap: 72px;
}

.brand-quality-item {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.brand-quality-item__icon {
  width: 47px;
  height: 47px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.brand-quality-item__icon img {
  width: 49px;
  height: 62px;
  object-fit: contain;
}

.brand-quality-item h2 {
  margin: 0 0 12px;
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  font-weight: 700;
  line-height: 1.1;
}

.brand-quality-item p {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.35;
}

.brand-origins {
  position: relative;
  min-height: 965px;
  padding: 114px 0px 96px;
  background: var(--black);
  width: 90%;
  margin: auto;
}

.brand-origins__head {
  position: relative;
  z-index: 3;
}

.brand-origins__head h2 {
  margin-top: 18px;
  font-size: clamp(44px, calc(26.932185px + 1.722282vw), 60px);
  font-weight: 900;
  line-height: 1.1;
}

.brand-origins__head h2 span {
  color: transparent;
  -webkit-text-stroke: 1px var(--white);
}

.brand-origins__copy {
  position: absolute;
  right: 70px;
  top: 155px;
  z-index: 3;
  width: min(477px, 30vw);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.35;
}

.brand-map {
  position: absolute;
  left: 26.6%;
  top: 104px;
  width: min(1015px, 60vw);
  aspect-ratio: 1015.2 / 783.532;
  z-index: 1;
}

.brand-map__art {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: fill;
  transform-origin: center center;
  transition:
    transform 0.7s ease,
    transform-origin 0.7s ease;
}

.brand-map__marker {
  position: absolute;
  z-index: 4;
  width: 25px;
  height: 32px;
  padding: 0;
  border: 0;
  background: transparent;
  transform: translate(-50%, -50%);
  cursor: pointer;
  transition:
    filter 0.2s ease,
    opacity 0.2s ease,
    transform 0.2s ease;
}

.brand-map__marker img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
  pointer-events: none;
}

.brand-map__marker:hover,
.brand-map__marker.is-active {
  filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.52));
  opacity: 1;
  transform: translate(-50%, -50%) scale(1.08);
}

.brand-map__marker--south-america {
  left: 26.7%;
  top: 67.7%;
  width: 54px;
  height: 59px;
}

.brand-map__marker--brazil {
  left: 31.9%;
  top: 75.9%;
}

.brand-map__marker--africa {
  left: 58.2%;
  top: 65.6%;
}

.brand-map__marker--asia {
  left: 79.7%;
  top: 70.5%;
}

.brand-map__line {
  position: absolute;
  left: -70px;
  top: 45%;
  z-index: 2;
  width: 301px;
  height: 46px;
  max-width: 30%;
  object-fit: fill;
  transform: translateY(-50%);
  transition: opacity 0.2s ease;
  pointer-events: none;
  display: none;
}

.brand-map__cursor {
  position: absolute;
  left: 28.2%;
  top: 69.1%;
  z-index: 5;
  width: 25px;
  height: 32px;
  max-width: none;
  pointer-events: none;
  transform: translate(-10%, -8%);
  transition:
    left 0.25s ease,
    top 0.25s ease,
    opacity 0.2s ease;
}

.brand-map:not([data-active-origin="south-america"]) .brand-map__line {
  opacity: 0;
}

.brand-map[data-active-origin="brazil"] .brand-map__cursor {
  left: 33.4%;
  top: 77.3%;
}

.brand-map[data-active-origin="africa"] .brand-map__cursor {
  left: 59.7%;
  top: 67%;
}

.brand-map[data-active-origin="asia"] .brand-map__cursor {
  left: 81.2%;
  top: 71.9%;
}

.brand-origin-card-stack {
  position: absolute;
  left: 211px;
  top: 435px;
  z-index: 4;
  width: 324px;
  height: 309px;
}

.brand-origin-slider__counter {
  display: none;
}

.brand-origin-card {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 0.2s ease,
    visibility 0.2s ease;
}

.brand-origin-card.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.brand-origin-card__shape {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  display: block;
}

.brand-origin-card__product {
  position: absolute;
  left: 50%;
  top: -150px;
  z-index: 2;
  width: 250px;
  max-width: none;
  filter: drop-shadow(25px 14px 26px rgba(0, 0, 0, 0.68));
  transform: translateX(-50%) rotate(-14.73deg);
}

.brand-origin-card__body {
  position: absolute;
  left: 38px;
  top: 143px;
  z-index: 3;
  width: 198px;
}

.brand-origin-card__body h3 {
  margin-bottom: 15px;
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  font-weight: 700;
  line-height: 1.1;
}

.brand-origin-card__body p {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.35;
}

[data-origin-card="south-america"] {
  --fill-0: #2b2d82;
}
[data-origin-card="brazil"] {
  --fill-0: #61b02d;
}
[data-origin-card="africa"] {
  --fill-0: #75570e;
}
[data-origin-card="asia"] {
  --fill-0: #ff9500;
}

.brand-origin-card__eye {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 4;
  width: 59px;
  height: 59px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: var(--white);
  color: #2e3192;
}

.brand-origin-card__eye img {
  width: 34px;
  height: 23px;
  max-width: none;
}

.brand-products {
  position: relative;
  z-index: 2;
  padding: 0 0 80px;
  background: var(--black);
}

.brand-products__inner {
  position: relative;
}

.brand-products__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  margin-bottom: 45px;
  padding-inline: 41px 31px;
}

.brand-products__head h2 {
  font-size: clamp(44px, calc(26.932185px + 1.722282vw), 60px);
  font-weight: 900;
  line-height: 1.1;
  color: var(--white);
}

.brand-products__head h2 span {
  color: transparent;
  -webkit-text-stroke: 1px var(--white);
}

.brand-products .products-section__footer {
  margin: 0;
  text-align: right;
}

.brand-products .products-nav-bottom {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 15px;
}

.brand-products .products-nav-bottom .js-slide-current {
  color: var(--white);
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  line-height: 1;
}

.brand-products .products-progress-track {
  position: relative;
  display: block;
  width: 214px;
  height: 1px;
  background: rgba(255, 255, 255, 0.64);
}

.brand-products .products-progress-thumb {
  position: absolute;
  left: 0;
  top: -2px;
  display: block;
  width: 51px;
  height: 5px;
  border: 1px solid var(--white);
  background: var(--white);
  transition:
    width 0.35s ease,
    transform 0.35s ease;
}

.brand-products .products-carousel-shell {
  position: relative;
  padding-inline: 12px;
}

.brand-products .products-slider {
  margin-right: -44px;
}

.brand-products .products-slider.slick-initialized .slick-list {
  overflow: hidden;
  padding-top: 70px;
}

.brand-products .products-slider.slick-initialized .slick-track {
  display: flex;
  align-items: stretch;
}

.brand-products .products-slider.slick-initialized .slick-slide {
  display: flex !important;
  height: auto !important;
}

.brand-products .product-slide {
  position: relative;
  display: flex !important;
  height: auto !important;
  padding-right: 24px;
}

.brand-products .product-slide--has-badge .product-card {
  clip-path: url("#brand-product-card-notch-single");
}

.brand-products .product-slide--has-badge-stack .product-card {
  clip-path: url("#brand-product-card-notch-stack");
}

.brand-products .product-slide:hover.product-slide--has-badge .product-card,
.brand-products
  .product-slide:hover.product-slide--has-badge-stack
  .product-card {
  clip-path: none;
}

.brand-products .product-card {
  position: relative;
  width: 100%;
  min-height: 626px;
  padding: 0;
  border-radius: 12px;
  background: var(--white);
  color: var(--black);
  display: flex;
  flex-direction: column;
  filter: drop-shadow(0 2px 24px rgba(0, 0, 0, 0.18));
  overflow: hidden;
  transition:
    background 0.25s ease,
    color 0.25s ease;
}

.brand-products .product-slide:hover .product-card {
  background: var(--red);
  color: var(--white);
  overflow: visible;
  -webkit-mask-image: radial-gradient(
    circle 72px at 100% 100%,
    transparent 71px,
    black 72px
  );
  mask-image: radial-gradient(
    circle 72px at 100% 100%,
    transparent 71px,
    black 72px
  );
}

.brand-products .product-card__image {
  position: relative;
  height: 322px;
  flex: 0 0 322px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 43px 28px 16px;
  margin: 0;
  border-radius: 0;
  background: transparent;
  overflow: visible;
}

.brand-products .product-card__image img {
  width: auto;
  max-width: 100%;
  max-height: 265px;
  height: auto;
  object-fit: contain;
  transform: none;
  transition:
    max-height 0.25s ease,
    transform 0.25s ease;
}

.brand-products .product-slide:hover .product-card__image img {
  max-height: 432px;
  transform: translate(-20px, -64px) rotate(-14deg);
  filter: drop-shadow(40px 29px 44px rgba(0, 0, 0, 0.18));
}

.brand-products .product-card__wishlist {
  position: absolute;
  left: 36px;
  top: 38px;
  z-index: 3;
  width: 28px;
  height: 28px;
  color: var(--black);
  background: transparent;
  border: 0;
  padding: 0;
}

.brand-products .product-card__wishlist svg {
  width: 100%;
  height: 100%;
}

.brand-products .product-card__badges {
  position: absolute;
  top: 70px;
  right: 24px;
  z-index: 5;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-end;
  pointer-events: none;
}

.brand-products .product-card__badge {
  position: static;
  width: 60px;
  height: 60px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
}

.brand-products .product-card__badge--new {
  background: var(--white);
  color: var(--black);
}

.brand-products .product-card__badge--decaf {
  background: var(--gold);
  color: var(--white);
}

.brand-products .product-card__badge--decaf svg {
  width: 35px;
  height: 35px;
}

.brand-products .product-card__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 28px 36px 34px;
}

.brand-products .product-card__name {
  margin: 0 0 14px;
  color: currentColor;
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  font-weight: 700;
  line-height: 1.18;
}

.brand-products .product-card__desc {
  margin: 0 0 24px;
  color: currentColor;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.brand-products .product-card__pricing {
  display: block;
  margin: auto 0 13px;
}

.brand-products .product-card__old-price {
  display: block;
  margin-bottom: 9px;
  color: currentColor;
  opacity: 0.48;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1;
  text-decoration: none;
}

.brand-products .product-card__price {
  display: block;
  color: currentColor;
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  font-weight: 700;
  line-height: 1;
}

.brand-products .product-card__offer {
  display: flex;
  align-items: center;
  gap: 13px;
  color: currentColor;
}

.brand-products .product-card__discount {
  min-width: 69px;
  height: 30px;
  padding: 0 12px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--red);
  color: var(--white);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
}

.brand-products .product-card__offer-text {
  color: var(--gray);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
}

.brand-products .product-slide:hover .product-card__wishlist {
  color: var(--white);
}

.brand-products .product-slide:hover .product-card__discount {
  background: var(--white);
  color: var(--black);
}

.brand-products .product-slide:hover .product-card__offer-text {
  color: var(--white);
}

.brand-products .product-card__cart {
  display: none;
}

.brand-products .product-slide:hover .product-card__cart {
  display: inline-flex;
  position: absolute;
  right: 24px;
  bottom: 0;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--red);
  color: var(--white);
  align-items: center;
  justify-content: center;
  z-index: 2;
}

.brand-products .products-arrow {
  position: absolute;
  top: calc(50% + 35px);
  z-index: 8;
  width: 44px;
  height: 127px;
  border: 0;
  background: var(--gold);
  color: var(--white);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-50%);
  transition:
    background 0.2s ease,
    opacity 0.2s ease;
}

.brand-products .products-arrow:hover {
  background: #6e6040;
}

.brand-products .products-arrow:disabled {
  opacity: 0.35;
  cursor: default;
}

.brand-products .products-arrow--prev {
  left: 0;
  border-radius: 0 10px 10px 0;
}

.brand-products .products-arrow--next {
  right: 0;
  border-radius: 10px 0 0 10px;
}

.brand-products__more {
  display: flex;
  justify-content: center;
  margin-top: 60px;
}

.brand-products__more .btn-gold {
  min-width: 134px;
  height: 60px;
  padding: 0 30px;
  border-radius: 15px;
  letter-spacing: 0;
}

.brand-red-cta {
  position: relative;
  min-height: 358px;
  display: flex;
  align-items: center;
  padding: 80px 0px;
  overflow: hidden;
}

.brand-red-cta__text {
  position: relative;
  z-index: 2;
  width: min(546px, 42vw);
  display: flex;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  margin-left: 5%;
}

.brand-red-cta__text > span {
  color: var(--black);
}

.brand-red-cta__text strong {
  color: var(--black);
}

.brand-red-cta > img {
  position: absolute;
  right: 0px;
  top: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
}

@media (max-width: 1400px) {
  .brand-intro {
    min-height: 1460px;
  }

  .brand-quality-grid {
    left: calc(50% + 84px);
    right: auto;
    width: calc(50vw - 130px);
    column-gap: 36px;
  }

  .brand-products .product-card {
    min-height: 590px;
  }

  .brand-products .product-card__name {
    font-size: clamp(21px, calc(21px + 0vw), 21px);
  }
}

@media (max-width: 1200px) {
  .brand-intro {
    min-height: 0;
    padding: 230px 32px 80px;
    background: linear-gradient(
      to bottom,
      var(--black) 0,
      var(--black) 56%,
      var(--red) 56%,
      var(--red) 100%
    );
  }

  .brand-breadcrumb {
    left: 32px;
  }

  .brand-watermark {
    width: 560px;
    height: 560px;
    font-size: clamp(260px, calc(260px + 0vw), 260px);
  }
  .brand-page-template .brand-watermark {
    width: 560px;
    height: 589px;
    font-size: 0;
  }

  .brand-pack-card,
  .brand-quote,
  .brand-quality-grid {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
  }

  .brand-pack-card {
    width: min(100%, 760px);
    height: auto;
    aspect-ratio: 895 / 841;
    margin: 92px auto 56px;
  }

  .brand-quote {
    width: min(100%, 650px);
    margin: 0 auto 72px;
  }

  .brand-quality-grid {
    width: 100%;
    max-width: 820px;
    margin-inline: auto;
  }

  .brand-origins {
    min-height: 0;
    padding: 96px 32px 80px;
  }

  .brand-origins__copy,
  .brand-map,
  .brand-origin-card-stack {
    position: relative;
    inset: auto;
  }

  .brand-origins__copy {
    width: min(100%, 640px);
    margin: 28px 0 48px;
  }

  .brand-map {
    left: auto;
    top: auto;
    max-width: none;
    width: 100%;
    margin: 0 auto;
  }

  .brand-map__line,
  .brand-map__cursor {
    display: none;
  }

  .brand-origin-card-stack {
    width: min(100%, 324px);
    height: 309px;
    margin: 190px 0 0;
  }

  .brand-products__head {
    padding-inline: 0;
  }

  .brand-products .products-carousel-shell {
    padding-inline: 12px;
  }

  .brand-red-cta {
    padding-inline: 32px;
  }
}

/* =====================================================
   SINGLE PRODUCT FIGMA REFRESH
   ===================================================== */
body.single-product,
body.single-product.woocommerce {
  background: var(--cream);
}

body.single-product .site-header,
body.single-product .header-nav,
body.single-product .main-header {
  background: var(--cream);
}

body.single-product .header-nav__menu .sub-menu {
  background: var(--cream);
}

body.single-product .header-nav__menu a,
body.single-product .header-nav__menu li a,
body.single-product .header-nav .icon-btn,
body.single-product .header-nav__actions a,
body.single-product .header-nav__actions button {
  color: var(--black);
}

body.single-product .header-nav__eshop-item > a,
body.single-product .header-nav__eshop-item > button,
body.single-product .eshop-btn {
  color: var(--gold);
  border-color: var(--gold);
}

.sp-page--figma {
  overflow: hidden;
  background: var(--cream);
  color: var(--black);
}

.sp-page--figma .sp-hero {
  background: var(--cream);
  padding: 80px 0px 107px;
}

.sp-hero__inner,
.sp-awards__inner,
.sp-details__inner,
.sp-related__inner {
  width: 85%;
  margin-inline: auto;
}

.sp-page--figma .sp-breadcrumb {
  display: flex;
  gap: 8px;
  align-items: center;
  margin: 0 0 76px;
  padding-top: 0;
  color: var(--black);
  font-size: clamp(15px, calc(15px + 0vw), 15px);
  font-weight: 700;
  line-height: 1;
  opacity: 0.82;
}

.sp-wrap {
  display: grid;
  grid-template-columns: minmax(620px, 810px) minmax(420px, 1fr) minmax(
      145px,
      206px
    );
  gap: clamp(30px, 3vw, 66px);
  align-items: start;
}

.sp-gallery {
  display: grid;
  grid-template-columns: 103px minmax(0, 652px);
  gap: 55px;
  align-items: start;
}

.sp-gallery__rail {
  display: flex;
  flex-direction: column;
  width: 103px;
}

.sp-gallery__controls {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  width: 103px;
  height: 52px;
  overflow: hidden;
  border: 1px solid var(--gold);
  border-radius: 8px;
  background: transparent;
}

.sp-gallery__arrow {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  color: var(--gold);
  transition:
    background 0.2s ease,
    color 0.2s ease,
    opacity 0.2s ease;
}

.sp-gallery__arrow + .sp-gallery__arrow {
  border-left: 1px solid var(--gold);
}

.sp-gallery__arrow:hover:not(:disabled) {
  background: var(--gold);
  color: var(--white);
}

.sp-gallery__arrow:disabled {
  opacity: 0.35;
  cursor: default;
}

.sp-gallery__arrow svg {
  width: 12px;
  height: 22px;
}

.sp-gallery__thumbs {
  display: grid;
  gap: 26px;
  margin-top: 28px;
}

.sp-thumb {
  display: grid;
  place-items: center;
  width: 103px;
  height: 103px;
  overflow: hidden;
  border: 2px solid transparent;
  border-radius: 10px;
  background: var(--white);
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}

.sp-thumb.is-active {
  border-color: var(--red);
  box-shadow: 0 7px 18px rgba(35, 31, 32, 0.08);
}

.sp-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 8px;
}

.sp-gallery__main {
  position: relative;
  width: min(100%, 652px);
  height: 700px;
  overflow: hidden;
  border-radius: 16px;
  background: var(--white);
}

.sp-gallery__stage,
.sp-gallery__stage .slick-list,
.sp-gallery__stage .slick-track,
.sp-gallery__stage .slick-slide,
.sp-gallery__stage .slick-slide > div,
.sp-gallery__slide {
  height: 100%;
}

.sp-gallery__stage .slick-slide {
  overflow: hidden;
}

.sp-gallery__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sp-gallery__slide--contain img {
  object-fit: contain;
  padding: 58px;
  background: var(--white);
}

.sp-badge {
  position: absolute;
  top: 17px;
  left: 25px;
  z-index: 6;
  display: inline-grid;
  place-items: center;
  width: 60px;
  height: 60px;
  border-radius: 10px;
  background: var(--white);
  color: var(--black);
  font-size: clamp(13px, calc(13px + 0vw), 13px);
  font-weight: 900;
  line-height: 1;
}

/* Hero badge stack: New on top, Decaf below it (or Decaf alone at the top). */
.sp-badges {
  position: absolute;
  top: 17px;
  left: 25px;
  z-index: 6;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
}

.sp-badges .sp-badge {
  position: static;
  top: auto;
  left: auto;
  right: auto;
  border: 1px solid var(--gold);
}

/* Decaf badge: gold box + white icon, matching the product card. */
.sp-badge--decaf {
  background: var(--gold);
  color: var(--white);
}

.sp-badge--decaf svg {
  width: 80%;
  height: 80%;
}

.sp-wishlist-img {
  position: absolute;
  top: 17px;
  right: 25px;
  z-index: 6;
  display: grid;
  place-items: center;
  width: 60px;
  height: 60px;
  border-radius: 14px;
  background: var(--cream-light);
  color: var(--white);
}

.sp-info {
  min-width: 0;
  padding-top: 0;
}

.sp-title {
  margin: 0 0 27px;
  color: var(--black);
  font-size: clamp(34px, calc(25.466093px + 0.861141vw), 42px);
  font-weight: 900;
  line-height: 0.98;
  letter-spacing: 0;
}

.sp-short-desc {
  max-width: 565px;
  margin: 0 0 30px;
  color: var(--black);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 500;
  line-height: 1.28;
}

.sp-meta-row {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-bottom: 25px;
}

.sp-meta-label,
.sp-options__label {
  min-width: 68px;
  color: var(--gold);
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 900;
  line-height: 1;
}

.sp-intensity__beans {
  display: flex;
  align-items: center;
  gap: 10px;
}

.sp-intensity__bean {
  display: block;
  width: 21px;
  height: 23px;
  background: #e1d7bb;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='21' height='23' viewBox='0 0 21 23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.76621 18.4072C3.68461 18.9447 2.53063 19.2868 1.34913 19.4202C1.27111 19.4291 1.19243 19.4129 1.12267 19.3736C1.05292 19.3343 0.995119 19.2736 0.956323 19.199C0.080848 17.5092 -0.206938 15.4068 0.148503 13.0999C0.601892 10.1228 2.07616 7.14236 4.3007 4.70604C6.52523 2.26972 9.2486 0.655088 11.9649 0.158534C14.2662 -0.260606 16.3443 0.158534 17.9519 1.3308C18.0176 1.37812 18.0694 1.44545 18.1007 1.52453C18.132 1.6036 18.1415 1.69098 18.1281 1.77591C18.1147 1.86085 18.079 1.93964 18.0252 2.00262C17.9715 2.06559 17.9021 2.10999 17.8256 2.13037C17.0689 2.32793 16.3311 2.60418 15.6223 2.95538C13.424 4.05023 10.6138 6.39034 9.7131 11.3271C9.09612 14.6758 7.43302 17.0579 4.76621 18.4072ZM20.0431 3.79919C20.0044 3.72472 19.9467 3.66417 19.8772 3.62491C19.8076 3.58564 19.7292 3.56935 19.6513 3.57801C18.4693 3.71046 17.3149 4.0526 16.2332 4.59102C13.5664 5.94023 11.9033 8.32236 11.2914 11.6688C10.3896 16.6056 7.58045 18.9457 5.38217 20.0406C4.67338 20.3918 3.93559 20.668 3.17884 20.8656C3.10065 20.8849 3.02948 20.9293 2.97438 20.993C2.91928 21.0568 2.88275 21.137 2.86943 21.2236C2.85611 21.3102 2.86661 21.3991 2.89959 21.4791C2.93257 21.5591 2.98654 21.6266 3.05464 21.6729C4.25324 22.5488 5.71237 23 7.33104 23C7.90357 22.9982 8.47499 22.9449 9.03958 22.8407C11.7569 22.3442 14.4792 20.7296 16.7038 18.2932C18.9283 15.8569 20.4026 12.8743 20.856 9.89939C21.2033 7.59246 20.9186 5.48902 20.0431 3.79919Z' fill='%23000'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg width='21' height='23' viewBox='0 0 21 23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.76621 18.4072C3.68461 18.9447 2.53063 19.2868 1.34913 19.4202C1.27111 19.4291 1.19243 19.4129 1.12267 19.3736C1.05292 19.3343 0.995119 19.2736 0.956323 19.199C0.080848 17.5092 -0.206938 15.4068 0.148503 13.0999C0.601892 10.1228 2.07616 7.14236 4.3007 4.70604C6.52523 2.26972 9.2486 0.655088 11.9649 0.158534C14.2662 -0.260606 16.3443 0.158534 17.9519 1.3308C18.0176 1.37812 18.0694 1.44545 18.1007 1.52453C18.132 1.6036 18.1415 1.69098 18.1281 1.77591C18.1147 1.86085 18.079 1.93964 18.0252 2.00262C17.9715 2.06559 17.9021 2.10999 17.8256 2.13037C17.0689 2.32793 16.3311 2.60418 15.6223 2.95538C13.424 4.05023 10.6138 6.39034 9.7131 11.3271C9.09612 14.6758 7.43302 17.0579 4.76621 18.4072ZM20.0431 3.79919C20.0044 3.72472 19.9467 3.66417 19.8772 3.62491C19.8076 3.58564 19.7292 3.56935 19.6513 3.57801C18.4693 3.71046 17.3149 4.0526 16.2332 4.59102C13.5664 5.94023 11.9033 8.32236 11.2914 11.6688C10.3896 16.6056 7.58045 18.9457 5.38217 20.0406C4.67338 20.3918 3.93559 20.668 3.17884 20.8656C3.10065 20.8849 3.02948 20.9293 2.97438 20.993C2.91928 21.0568 2.88275 21.137 2.86943 21.2236C2.85611 21.3102 2.86661 21.3991 2.89959 21.4791C2.93257 21.5591 2.98654 21.6266 3.05464 21.6729C4.25324 22.5488 5.71237 23 7.33104 23C7.90357 22.9982 8.47499 22.9449 9.03958 22.8407C11.7569 22.3442 14.4792 20.7296 16.7038 18.2932C18.9283 15.8569 20.4026 12.8743 20.856 9.89939C21.2033 7.59246 20.9186 5.48902 20.0431 3.79919Z' fill='%23000'/%3E%3C/svg%3E");
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.sp-intensity__bean.is-filled {
  background: #85754e;
}

.sp-notes__list {
  display: flex;
  flex-wrap: wrap;
  gap: 25px;
}

.sp-notes__list li {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--gold);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  line-height: 1;
}

.sp-notes__dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--dark-red);
}

.sp-notes__dot--2,
.sp-notes__dot--4 {
  background: var(--red);
}

.sp-rule {
  width: 100%;
  height: 1px;
  margin: 0px 0 14px;
  border: 0;
  background: var(--cream-light);
}

.sp-options {
  display: flex;
  align-items: center;
  gap: 23px;
  margin-bottom: 16px;
}

.sp-options__btns {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.sp-opt-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 102px;
  height: 52px;
  padding-inline: 24px;
  border: 1px solid var(--cream-light);
  border-radius: 12px;
  color: var(--gold);
  background: transparent;
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  font-weight: 700;
  line-height: 1;
  transition:
    background 0.2s ease,
    border-color 0.2s ease;
}

.sp-opt-btn.is-active {
  border-color: transparent;
  background: var(--cream-light);
  color: var(--gold);
}

.sp-promo {
  display: flex;
  align-items: center;
  gap: 11px;
  margin: 0 0 28px;
}

.sp-promo__pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 64px;
  height: 32px;
  border-radius: 10px;
  background: var(--gold);
  color: var(--white);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 900;
  line-height: 1;
}

.sp-promo__text {
  color: var(--gold);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
}

.sp-purchase {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
}

.sp-prices {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.sp-price--regular {
  display: block;
  color: #b5afa2;
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 700;
  line-height: 1;
  text-decoration: line-through;
}

.sp-price--sale {
  display: block;
  color: var(--black);
  font-size: clamp(42px, calc(42px + 0vw), 42px);
  font-weight: 900;
  line-height: 1;
}

.sp-cart-form {
  display: flex;
  align-items: center;
  gap: 11px;
  margin: 0;
}

.sp-qty {
  display: grid;
  grid-template-columns: 42px 46px 60px;
  align-items: center;
  width: 145px;
  height: 60px;
  overflow: hidden;
  border-radius: 15px;
  background: var(--gold);
  color: var(--white);
}

.sp-qty__btn {
  display: grid;
  place-items: center;
  height: 100%;
  color: var(--white);
  font-size: clamp(32px, calc(32px + 0vw), 32px);
  font-weight: 500;
  line-height: 1;
}

.sp-qty__input,
.sp-qty input.qty {
  width: 100%;
  min-width: 0;
  height: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--white);
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  font-weight: 500;
  line-height: 1;
  text-align: center;
  -moz-appearance: textfield;
}

.woocommerce .quantity .qty {
  width: 2.631em;
  text-align: center;
}

.sp-qty__input::-webkit-inner-spin-button,
.sp-qty__input::-webkit-outer-spin-button {
  margin: 0;
  -webkit-appearance: none;
}

.sp-cart-button,
.woocommerce div.product .sp-cart-button.button {
  display: grid;
  place-items: center;
  width: 60px;
  min-width: 60px;
  height: 60px;
  padding: 0;
  border: 0;
  border-radius: 12px;
  background: var(--gold);
  color: var(--white);
  line-height: 1;
}

button.single_add_to_cart_button.button.alt.sp-cart-button {
  height: 60px;
  border-radius: 15px;
  padding-left: 14px;
}

.sp-cart-button:hover,
.woocommerce div.product .sp-cart-button.button:hover {
  background: #6e6040;
  color: var(--white);
}

.sp-page--figma .sp-cart-button.button,
.sp-page--figma .sp-cart-button.button.alt,
body.single-product.woocommerce
  .sp-page--figma
  button.sp-cart-button.button.alt {
  background: var(--gold);
  color: var(--white);
}

.sp-page--figma .sp-cart-button.button:hover,
.sp-page--figma .sp-cart-button.button.alt:hover,
body.single-product.woocommerce
  .sp-page--figma
  button.sp-cart-button.button.alt:hover {
  background: #6e6040;
  color: var(--white);
}

.sp-native-cart form.cart {
  margin: 0;
}

.sp-specs {
  min-height: 700px;
  padding: 70px 0 0 60px;
  border-left: 1px solid var(--cream-light);
}

.sp-spec {
  width: 100%;
  padding-bottom: 28px;
  margin-bottom: 25px;
  border-bottom: 1px solid var(--cream-light);
}

.sp-spec:last-child {
  margin-bottom: 0;
}

.sp-spec__label,
.sp-spec__value {
  display: block;
}

.sp-spec__label {
  margin-bottom: 8px;
  color: var(--gold);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 500;
  line-height: 1;
}

.sp-spec__value {
  color: var(--gold);
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 900;
  line-height: 1.15;
}

.sp-awards {
  background: var(--cream-mid);
  background-image: none;
  padding: 82px 0px 78px;
}

.sp-awards::before {
  content: none;
}

.sp-awards__inner {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 48px;
  align-items: center;
  padding: 0 5%;
}

.sp-award {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  min-width: 0;
}

.sp-award img {
  width: 66px;
  height: 66px;
  object-fit: contain;
  filter: grayscale(1);
}

.sp-award strong {
  color: var(--black);
  font-size: clamp(17px, calc(17px + 0vw), 17px);
  font-weight: 900;
  line-height: 1.15;
}

.sp-details {
  background: var(--cream);
  padding: 127px 0;
}

.sp-details__inner {
  display: grid;
  grid-template-columns: minmax(0, 774fr) minmax(0, 823fr);
  gap: clamp(32px, 2.74vw, 45px);
  align-items: start;
  max-width: 1642px;
  margin-inline: auto;
}

.sp-details__copy {
  min-width: 0;
}

.sp-details h2,
.sp-brand-cta h2 {
  margin: 0;
  color: var(--black);
  font-size: clamp(38px, calc(25.199139px + 1.291712vw), 50px);
  font-weight: 900;
  line-height: 1;
}

.sp-details h2 {
  font-size: clamp(42px, calc(42px + 0vw), 42px);
  line-height: 0.85;
}

.sp-details__line,
.sp-brand-cta__line {
  display: block;
  width: 55px;
  height: 3px;
  margin: 25px 0 32px;
  background: var(--gold);
}

.sp-details__line {
  margin: 25px 0 29px;
}

.sp-details__text {
  max-width: 577px;
  color: var(--black);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1.15;
}

.sp-details__text p + p {
  margin-top: 18px;
}

.sp-origin-mini {
  position: relative;
  width: min(100%, 774px);
  height: 548px;
  margin-top: 18px;
}

.sp-origin-mini::before,
.sp-origin-mini::after {
  content: "";
  position: absolute;
  z-index: 1;
}

.sp-origin-mini::before {
  left: 192px;
  top: 129px;
  width: 144px;
  height: 110px;
  background: url("assets/images/product-details-connector-figma.svg") center /
    100% 100% no-repeat;
}

.sp-origin-mini::after {
  content: none;
}

.sp-origin-mini__map {
  position: absolute;
  left: 2px;
  top: 0;
  z-index: 0;
  display: block;
  width: 735px;
  height: 548px;
  max-width: 100%;
  overflow: visible;
  opacity: 1;
  mix-blend-mode: normal;
}

.sp-origin-mini__pin {
  position: absolute;
  left: 174px;
  top: 250px;
  z-index: 2;
  width: 32px;
  height: 38px;
  background: url("assets/images/product-details-bean-figma.svg") center / 100%
    100% no-repeat;
}

.sp-origin-mini__pin::after {
  content: none;
}

.sp-origin-mini__card {
  position: absolute;
  left: 342px;
  top: 43px;
  z-index: 3;
  display: grid;
  grid-template-columns: 176px minmax(0, 258px);
  align-items: stretch;
  width: 434px;
  overflow: hidden;
  border-radius: 15px;
  background: var(--white);
  box-shadow: none;
}

.sp-origin-mini__card img {
  width: 176px;
  height: 176px;
  object-fit: cover;
}

.sp-origin-mini__card div {
  padding: 34px 22px 20px;
}

.sp-origin-mini__card h3 {
  margin: 0 0 16px;
  color: var(--gold);
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  font-weight: 700;
  line-height: 1;
  text-align: center;
}

.sp-origin-mini__card p {
  color: var(--gold);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1.08;
}

.sp-details__media {
  width: 100%;
  aspect-ratio: 823 / 625;
  overflow: hidden;
  border-radius: 30px;
  background: var(--red);
}

.sp-details__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sp-brand-cta {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 390px;
  margin-top: 0;
  overflow: hidden;
  margin-top: -75px;
}

.sp-brand-cta__text {
  position: relative;
  z-index: 2;
  width: min(520px, 42vw);
  margin-left: max(65px, calc((100vw - 1790px) / 2));
  color: var(--white);
  margin-left: 7.5%;
}

.sp-brand-cta h2 {
  color: var(--white);
}

.sp-brand-cta__line {
  background: var(--white);
}

.sp-brand-cta p {
  max-width: 490px;
  margin: 0 0 30px;
  color: var(--white);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 500;
  line-height: 1.25;
}

.sp-brand-cta__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 134px;
  height: 60px;
  padding-inline: 28px;
  border-radius: 10px;
  background: var(--gold);
  color: var(--white);
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  font-weight: 900;
  line-height: 1;
}

.sp-brand-cta > img {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left center;
}

.sp-related {
  position: relative;
  background: var(--cream);
  padding: 132px 0px 160px;
}

.sp-related__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  margin-bottom: 47px;
}

.sp-related__title {
  margin: 0;
  font-size: clamp(42px, calc(22.798708px + 1.937567vw), 60px);
  line-height: 1;
  letter-spacing: 0;
}

.sp-related__title span {
  color: transparent;
  -webkit-text-stroke: 1px var(--black);
}

.sp-related .products-section__footer {
  display: flex;
  justify-content: flex-end;
  margin: 0;
  text-align: right;
}

.sp-related .products-nav-bottom {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 15px;
}

.sp-related .products-count {
  color: var(--gold);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  line-height: 1;
}

.sp-related .products-progress-track {
  position: relative;
  display: block;
  width: 214px;
  height: 1px;
  background: rgba(133, 117, 78, 0.45);
}

.sp-related .products-progress-thumb {
  position: absolute;
  left: 0;
  top: -2px;
  display: block;
  width: 52px;
  height: 5px;
  background: var(--gold);
  transition:
    transform 0.25s ease,
    width 0.25s ease;
}

.sp-related__carousel {
  position: relative;
  padding: 0 12px;
}

.sp-related .products-slider {
  margin: 0 -15px;
}

.sp-related .product-slide {
  padding: 0 15px;
}

.sp-related .rs-shop-card {
  width: 100%;
  max-width: 395px;
  margin-inline: auto;
}

.sp-related .products-arrow {
  position: absolute;
  top: calc(50% + 16px);
  z-index: 8;
  display: grid;
  place-items: center;
  width: 44px;
  height: 124px;
  background: var(--gold);
  color: var(--white);
  transition:
    background 0.2s ease,
    opacity 0.2s ease;
}

.sp-related .products-arrow:hover:not(:disabled) {
  background: #6e6040;
}

.sp-related .products-arrow:disabled {
  opacity: 0.35;
  cursor: default;
}

.sp-related .products-arrow--prev {
  left: 0;
  border-radius: 0 10px 10px 0;
}

.sp-related .products-arrow--next {
  right: 0;
  border-radius: 10px 0 0 10px;
}

.sp-related .products-arrow svg {
  width: 17px;
  height: 31px;
}

@media (max-width: 1550px) {
  .sp-wrap {
    grid-template-columns: minmax(520px, 700px) minmax(390px, 1fr) 140px;
    gap: 34px;
  }

  .sp-gallery {
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 32px;
  }

  .sp-gallery__rail,
  .sp-gallery__controls,
  .sp-thumb {
    width: 92px;
  }

  .sp-thumb {
    height: 92px;
  }

  .sp-gallery__main {
    height: 620px;
  }

  .sp-specs {
    padding-left: 34px;
  }

  .sp-related .products-slider {
    margin: 0 -14px;
  }

  .sp-related .product-slide {
    padding: 0 14px;
  }
}

@media (max-width: 1220px) {
  .sp-page--figma .sp-hero,
  .sp-awards,
  .sp-details,
  .sp-related {
    padding-inline: 32px;
  }

  .sp-wrap {
    grid-template-columns: minmax(0, 1fr);
  }

  .sp-gallery {
    grid-template-columns: 103px minmax(0, 652px);
    justify-content: center;
  }

  .sp-info {
    max-width: 720px;
    margin-inline: auto;
  }

  .sp-specs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    min-height: 0;
    max-width: 900px;
    margin-inline: auto;
    padding: 0;
    border-left: 0;
  }

  .sp-spec {
    margin: 0;
    padding: 20px;
    border: 1px solid var(--cream-light);
    border-radius: 10px;
  }

  .sp-awards__inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sp-details__inner {
    grid-template-columns: minmax(0, 1fr);
  }

  .sp-details__media {
    max-width: 822px;
    margin-inline: auto;
  }
}

@media (max-width: 991px) {
  /* — Hero — */
  .sp-page--figma .sp-hero {
    padding: 84px 0 64px;
  }

  .sp-hero__inner,
  .sp-awards__inner,
  .sp-details__inner {
    width: 100%;
    padding-inline: var(--gutter);
    box-sizing: border-box;
  }

  .sp-related__inner {
    width: 100%;
    box-sizing: border-box;
  }

  .sp-related__head {
    padding-inline: var(--gutter);
  }

  /* — Wrap: single column — */
  .sp-wrap {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding-inline: 0;
  }

  .sp-info {
    display: contents;
  }

  .sp-info > * {
    width: 100%;
    order: 5;
  }

  .sp-title {
    order: 1;
    width: 100%;
    margin: 0 0 72px;
  }

  /* — Gallery: after title, thumbs below — */
  .sp-gallery {
    display: flex;
    flex-direction: column;
    order: 2;
    gap: 31px;
    width: 100%;
    max-width: 100%;
    justify-content: unset;
  }

  .sp-gallery__main {
    order: 1;
    flex: 0 0 363px;
    width: 100%;
    max-width: none;
    height: 363px;
    border-radius: 12px;
    /* Figma: dark roasted-beans backdrop behind the (transparent) product image */
    background: #1a1411
      url("/wp-content/uploads/2026/05/roasting-beans-scaled.jpg") center /
      cover no-repeat;
  }

  /* Let the beans backdrop show through the transparent product PNG */
  .sp-gallery__slide--contain img {
    background: transparent;
    padding: 40px;
  }

  /* Hero badges (Figma mobile): heart top-left, New top-right, ~40px */
  .sp-wishlist-img {
    top: 20px;
    left: 20px;
    right: auto;
    width: 40px;
    height: 40px;
  }

  .sp-badge {
    top: 20px;
    right: 20px;
    left: auto;
    width: 40px;
    height: 40px;
    font-size: 12px;
    padding: 5px;
    text-transform: none;
  }

  .sp-badges {
    top: 20px;
    right: 20px;
    left: auto;
    gap: 8px;
    align-items: flex-end;
  }

  .sp-gallery__rail {
    order: 2;
    display: flex;
    flex-direction: row;
    width: 100%;
    gap: 12px;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .sp-gallery__rail::-webkit-scrollbar {
    display: none;
  }

  .sp-gallery__controls {
    display: none;
  }

  .sp-gallery__thumbs {
    display: flex;
    flex-direction: row;
    flex: 1;
    gap: 10px;
    margin-top: 0;
  }

  /* Thumbs fill the row when there are several, but stay small (capped) when
     there are only one or two — so a single extra photo shows as a small thumb */
  .sp-thumb {
    flex: 1 1 0;
    min-width: 0;
    max-width: 104px;
    width: auto;
    height: auto;
    aspect-ratio: 1;
  }

  /* — Info panel — */
  .sp-info {
    max-width: 100%;
    width: 100%;
    margin-inline: 0;
  }

  .sp-title {
    font-size: clamp(32px, calc(21.332616px + 1.076426vw), 42px);
  }

  .sp-short-desc {
    order: 3;
    max-width: 100%;
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
    margin: 37px 0 18px;
  }

  /* Figma order: specs (Origins/Variety/Process/Attitude) sit right after the description */
  .sp-specs {
    order: 4;
    width: 100%;
  }

  .sp-meta-row {
    order: 5;
    width: 100%;
  }

  .sp-rule {
    order: 6;
    width: 100%;
    display: none;
  }

  .sp-options {
    order: 7;
    width: 100%;
  }

  .sp-promo {
    order: 8;
    width: 100%;
  }

  .sp-purchase {
    order: 9;
    width: 100%;
  }

  .sp-meta-label,
  .sp-options__label {
    font-size: clamp(14px, calc(9.733046px + 0.430571vw), 18px);
    min-width: 56px;
  }

  .sp-notes__list li {
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
  }

  .sp-opt-btn {
    min-width: 76px;
    height: 40px;
    padding-inline: 14px;
    font-size: clamp(12px, calc(9.866523px + 0.215285vw), 14px);
    border-radius: 10px;
  }

  .sp-promo__pill {
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
    min-width: 54px;
    height: 26px;
  }

  .sp-promo__text {
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
  }

  .sp-price--regular {
    font-size: clamp(14px, calc(9.733046px + 0.430571vw), 18px);
  }

  .sp-price--sale {
    font-size: clamp(32px, calc(21.332616px + 1.076426vw), 42px);
  }

  /* Cart: qty + cart button fill full row */
  .sp-cart-form {
    width: 100%;
    gap: 10px;
  }

  .sp-qty {
    grid-template-columns: 40px 44px 54px;
    width: 132px;
    height: 52px;
    border-radius: 12px;
    flex-shrink: 0;
  }

  .sp-cart-button,
  .woocommerce div.product .sp-cart-button.button,
  .sp-page--figma .sp-cart-button.button,
  .sp-page--figma .sp-cart-button.button.alt,
  body.single-product.woocommerce
    .sp-page--figma
    button.sp-cart-button.button.alt {
    flex: 1;
    width: auto;
    min-width: 0;
    height: 52px;
    border-radius: 12px;
  }

  /* — Specs: 4-column row (Figma: Origins | Variety | Process | Altitude) — */
  .sp-specs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    max-width: 100%;
    gap: 0;
    border: none;
    padding: 0;
    min-height: 0;
    margin-bottom: 30px;
  }

  .sp-spec {
    padding: 12px 6px;
    margin: 0;
    border: none;
    border-right: 1px solid var(--cream-light);
    border-radius: 0;
    min-width: 80px;
  }

  .sp-spec:last-child {
    border-right: none;
  }

  .sp-spec__label {
    font-size: 14px;
    margin-bottom: 5px;
  }

  .sp-spec__value {
    font-size: 16px;
    line-height: 1.2;
  }

  /* — Awards: single column, icon-left + text-right (Figma mobile) — */
  .sp-awards {
    padding: 52px 0;
  }

  .sp-awards__inner {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 0;
  }

  .sp-award {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    text-align: left;
    gap: 20px;
  }

  .sp-award img {
    width: 56px;
    height: 56px;
  }

  .sp-award strong {
    font-size: 16px;
  }

  /* — Details — */
  .sp-details {
    padding: 56px 0;
  }

  .sp-details h2,
  .sp-brand-cta h2 {
    font-size: clamp(32px, calc(21.332616px + 1.076426vw), 42px);
  }

  .sp-details__text {
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
  }

  .sp-origin-mini {
    display: none;
  }

  /* — Brand CTA: simplified to Figma mobile (light, no image/button) — */
  .sp-brand-cta {
    flex-direction: column;
    align-items: flex-start;
    min-height: 0;
    margin-top: 0;
    overflow: visible;
  }

  .sp-brand-cta__text {
    position: relative;
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    padding: 8px var(--gutter) 0;
    background: transparent;
    color: var(--black);
  }

  .sp-brand-cta h2 {
    color: var(--black);
  }

  .sp-brand-cta__line {
    background: var(--gold);
  }

  .sp-brand-cta p {
    color: var(--black);
    margin-bottom: 0;
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
  }

  .sp-brand-cta__button,
  .sp-brand-cta > img {
    display: none;
  }

  /* — Similar Products — */
  .sp-related {
    padding: 56px 0 72px;
  }

  .sp-related__title {
    font-size: clamp(32px, calc(2.131324px + 3.013994vw), 60px);
  }

  /* Progress bar moved below the slider (matches the home products slider) */
  .sp-related__inner {
    display: flex;
    flex-direction: column;
  }

  .sp-related__head {
    display: contents;
  }

  .sp-related__title {
    order: 1;
    margin-bottom: 28px;
    padding: 0 var(--gutter);
  }

  .sp-related__carousel {
    order: 2;
  }

  .sp-related__progress {
    order: 3;
    width: 100%;
    box-sizing: border-box;
    margin-top: 28px;
    padding-inline: var(--gutter);
  }

  .sp-related .products-nav-bottom {
    width: 100%;
  }

  .sp-related .products-progress-track {
    width: 100%;
  }

  .sp-related .rs-shop-card {
    max-width: 100%;
  }

  .sp-related__carousel {
    padding: 0;
    padding-left: var(--gutter);
    overflow: hidden;
  }

  .sp-related .products-slider,
  .sp-related .products-slider.slick-initialized,
  .sp-related .products-slider.slick-initialized .slick-list {
    overflow: visible;
    margin: 0;
  }

  .sp-related .product-slide {
    width: 79.47vw !important;
    padding: 0 20px 0 0;
    box-sizing: border-box;
  }

  .sp-related .products-arrow--prev,
  .sp-related .products-arrow--next {
    display: none;
  }
}

/* =====================================================
   BLOG LISTING PAGE
   ===================================================== */
.blog-page-template,
.blog-page-template body {
  background: var(--cream);
}

.blog-page-template .site-header {
  position: relative;
  background: var(--black);
}

.blog-page-template .header-nav {
  background: var(--black);
}

.blog-page-template .header-nav__menu li a,
.blog-page-template .icon-btn {
  color: var(--white);
}

.blog-page-template .header-nav__menu .sub-menu {
  background: var(--black);
}

.blog-page-template .header-nav__menu .sub-menu a {
  color: var(--white);
}

.blog-page-template .header-nav__eshop-item > a {
  color: var(--gold);
  border-color: var(--gold);
}

.blog-page-template .header-nav__eshop-item > a:hover {
  color: var(--white);
}

.blog-page-template .header-nav__logo-img {
  content: url("assets/images/logo-rossetti-footer.svg");
}

.blog-index-page {
  overflow: hidden;
  background: var(--cream);
  color: var(--black);
}

.blog-index-hero {
  position: relative;
  display: flex;
  justify-content: center;
  min-height: 449px;
  background-color: var(--black);
  background-position: center center;
  background-size: cover;
  color: var(--white);
}

.blog-index-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(35, 31, 32, 1) 2%,
    rgba(35, 31, 32, 0.25) 42%,
    rgba(35, 31, 32, 0.72) 100%
  );
}

.blog-index-hero__breadcrumb {
  position: absolute;
  left: 66px;
  top: -72px;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--white);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1;
}

.blog-index-hero__content {
  position: relative;
  z-index: 1;
  width: min(828px, calc(100% - 40px));
  padding-top: 111px;
  text-align: center;
}

.blog-index-hero h1 {
  margin: 0 0 24px;
  color: var(--white);
  font-size: clamp(60px, calc(60px + 0vw), 60px);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: 0;
}

.blog-index-hero p {
  margin: 0;
  color: var(--white);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1.15;
}

.blog-index-listing {
  background: var(--cream);
  padding: 200px 65px 160px;
}

.blog-index-grid {
  display: grid;
  grid-template-columns: repeat(3, 420px);
  gap: 74px 70px;
  justify-content: center;
  width: min(100%, 1400px);
  margin-inline: auto;
}

.blog-index-card {
  width: 420px;
  min-height: 660px;
  overflow: hidden;
  border-radius: 20px;
  background: var(--white);
  box-shadow: none;
}

.blog-index-card.is-hidden {
  display: none;
}

.blog-index-card__image {
  display: block;
  width: 100%;
  height: 310px;
  overflow: hidden;
  background: var(--cream-mid);
}

.blog-index-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.blog-index-card__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-height: 350px;
  padding: 41px 37px 40px;
}

.blog-index-card__date {
  margin-bottom: 31px;
  color: var(--gray);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1;
}

.blog-index-card__title {
  width: 318px;
  max-width: 100%;
  margin: 0 0 24px;
  color: var(--black);
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  font-weight: 700;
  line-height: 1.04;
  letter-spacing: 0;
}

.blog-index-card__title a {
  color: inherit;
}

.blog-index-card__excerpt {
  width: 318px;
  max-width: 100%;
  margin: 0;
  color: var(--black);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1.05;
}

.blog-index-card__button,
.blog-index-load-more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 60px;
  padding: 16px 30px;
  border-radius: 15px;
  background: var(--gold);
  color: var(--white);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  line-height: 1;
  transition: background 0.2s ease;
}

.blog-index-card__button {
  margin-top: auto;
  min-width: 132px;
}

.blog-index-card__button:hover,
.blog-index-load-more:hover {
  background: #6e6040;
  color: var(--white);
}

.blog-index-load-more {
  min-width: 132px;
  margin: 160px auto 0;
}

.blog-index-listing .blog-index-load-more {
  display: flex;
}

@media (max-width: 1520px) {
  .blog-index-grid {
    grid-template-columns: repeat(3, minmax(0, 360px));
    gap: 64px 52px;
  }

  .blog-index-card {
    width: 100%;
  }
}

@media (max-width: 1120px) {
  .blog-index-listing {
    padding: 120px 32px 120px;
  }

  .blog-index-grid {
    grid-template-columns: repeat(2, minmax(0, 420px));
  }

  .blog-index-hero__breadcrumb {
    left: 32px;
  }
}

@media (max-width: 991px) {
  /* — Hero — */
  .blog-index-hero {
    min-height: 543px;
  }

  .blog-index-hero__breadcrumb {
    display: none;
  }

  .blog-index-hero__content {
    width: min(327px, calc(100% - 48px));
    padding-top: 118px;
  }

  .blog-index-hero h1 {
    font-size: clamp(32px, calc(2.131324px + 3.013994vw), 60px);
    margin-bottom: 16px;
  }

  .blog-index-hero p {
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
  }

  /* — Listing — */
  .blog-index-listing {
    padding: 110px 0 72px;
  }

  .blog-index-grid {
    grid-template-columns: 1fr;
    gap: 56px;
    padding-inline: var(--gutter);
    width: 100%;
    max-width: 100%;
  }

  .blog-index-card {
    width: 100%;
    min-height: 0;
    border-radius: 20px;
  }

  .blog-index-card__image {
    height: 220px;
  }

  .blog-index-card__body {
    min-height: 0;
    padding: 24px 24px 28px;
  }

  .blog-index-card__date {
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
    margin-bottom: 16px;
  }

  .blog-index-card__title {
    font-size: clamp(18px, calc(11.599569px + 0.645856vw), 24px);
    margin-bottom: 14px;
    width: 100%;
  }

  .blog-index-card__excerpt {
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
    width: 100%;
  }

  .blog-index-card__button,
  .blog-index-load-more {
    height: 46px;
    padding: 12px 24px;
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
    border-radius: 12px;
    margin-top: 20px;
  }

  .blog-index-load-more {
    margin-top: 48px;
  }
}

/* =====================================================
   SINGLE BLOG POST
   ===================================================== */
.blog-single-template,
.blog-single-template body {
  background: var(--cream);
}

.blog-single-template .site-header {
  position: relative;
  background: var(--cream);
}

.blog-single-template .header-nav {
  background: var(--cream);
}

.blog-single-template .header-nav__menu li a,
.blog-single-template .icon-btn {
  color: var(--black);
}

.blog-single-template .header-nav__menu .sub-menu {
  background: var(--cream);
}

.blog-single-template .header-nav__menu .sub-menu a {
  color: var(--black);
}

.blog-single-template .header-nav__eshop-item > a {
  color: var(--gold);
  border-color: var(--gold);
}

.blog-single-template .header-nav__eshop-item > a:hover {
  color: var(--white);
}

.blog-single {
  overflow: hidden;
  background: var(--cream);
  color: var(--black);
  padding: 121px 65px 204px;
}

.blog-single__article {
  margin: 0;
}

.blog-single__header {
  width: min(100%, 1791px);
  margin-inline: auto;
}

.blog-single__title {
  width: min(100%, 1110px);
  margin: 0 auto 100px;
  color: var(--black);
  font-size: clamp(60px, calc(60px + 0vw), 60px);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: 0;
  text-align: center;
}

.blog-single__meta-line {
  display: flex;
  justify-content: flex-end;
  width: 100%;
  padding-bottom: 26px;
  border-bottom: 1px solid rgba(35, 31, 32, 0.16);
}

.blog-single__meta-line time {
  color: var(--black);
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  font-weight: 400;
  line-height: 1;
}

.blog-single__featured {
  width: min(100%, 1200px);
  height: 542px;
  margin: 164px auto 0;
  overflow: hidden;
  border-radius: 20px;
  background: var(--cream-mid);
}

.blog-single__featured img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.blog-single__content {
  width: min(100%, 1055px);
  margin: 147px auto 0;
  color: var(--black);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1.05;
}

.blog-single__content p {
  margin: 0 0 18px;
}

.blog-single__content p:last-child {
  margin-bottom: 0;
}

.blog-single-related {
  width: min(100%, 1791px);
  margin: 162px auto 0;
  padding-top: 130px;
  border-top: 1px solid rgba(35, 31, 32, 0.16);
}

.blog-single-related h2 {
  margin: 0 0 92px;
  color: var(--black);
  font-size: clamp(60px, calc(60px + 0vw), 60px);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: 0;
  text-align: center;
}

.blog-single-related__grid {
  display: grid;
  grid-template-columns: repeat(3, 420px);
  gap: 70px;
  justify-content: center;
}

.blog-single-card {
  min-height: 610px;
}

.blog-single-card .blog-index-card__body {
  min-height: 350px;
}

@media (max-width: 1520px) {
  .blog-single-related__grid {
    grid-template-columns: repeat(3, minmax(0, 360px));
    gap: 52px;
  }
}

@media (max-width: 1120px) {
  .blog-single {
    padding: 90px 32px 140px;
  }

  .blog-single__title {
    font-size: clamp(48px, calc(48px + 0vw), 48px);
    margin-bottom: 72px;
  }

  .blog-single__featured {
    margin-top: 92px;
    height: auto;
    aspect-ratio: 1200 / 542;
  }

  .blog-single__content {
    margin-top: 90px;
  }

  .blog-single-related {
    margin-top: 110px;
    padding-top: 90px;
  }

  .blog-single-related h2 {
    margin-bottom: 64px;
    font-size: clamp(48px, calc(48px + 0vw), 48px);
  }

  .blog-single-related__grid {
    grid-template-columns: repeat(2, minmax(0, 420px));
  }
}

@media (max-width: 991px) {
  /* — Single post — */
  .blog-single {
    padding: 118px var(--gutter) 80px;
  }

  .blog-single__title {
    font-size: clamp(32px, calc(2.131324px + 3.013994vw), 60px);
    margin-bottom: 87px;
  }

  .blog-single__meta-line {
    padding-bottom: 11px;
    justify-content: center;
  }

  .blog-single__meta-line time {
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
  }

  .blog-single__featured {
    width: 685px;
    max-width: none;
    height: 456px;
    aspect-ratio: auto;
    margin-top: 70px;
    margin-left: 50%;
    border-radius: 0;
    transform: translateX(-50%);
  }

  .blog-single__content {
    margin-top: 70px;
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    line-height: 1.5;
  }

  .blog-single-related {
    margin-top: 132px;
    padding-top: 98px;
  }

  .blog-single-related h2 {
    font-size: clamp(32px, calc(2.131324px + 3.013994vw), 60px);
    margin-bottom: 70px;
  }

  .blog-single-related__grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .blog-single-card {
    min-height: 0;
  }

  .blog-single-card .blog-index-card__body {
    min-height: 0;
  }
}

/* =====================================================
   CONTACT PAGE
   ===================================================== */
.contact-page-template,
.contact-page-template body {
  background: var(--cream);
}

.contact-page-template .site-header {
  position: relative;
  background: var(--cream);
}

.contact-page-template .header-nav {
  background: var(--cream);
}

.contact-page-template .header-nav__menu li a,
.contact-page-template .icon-btn {
  color: var(--black);
}

.contact-page-template .header-nav__menu .sub-menu {
  background: var(--cream);
}

.contact-page-template .header-nav__menu .sub-menu a {
  color: var(--black);
}

.contact-page-template .header-nav__eshop-item > a {
  color: var(--gold);
  border-color: var(--gold);
}

.contact-page-template .header-nav__eshop-item > a:hover {
  color: var(--white);
}

.contact-page {
  overflow: hidden;
  background: var(--cream);
  color: var(--black);
}

.contact-hero {
  position: relative;
  min-height: 448px;
  background: var(--cream);
  padding-inline: 65px;
}

.contact-hero__breadcrumb {
  position: absolute;
  left: 66px;
  top: -32px;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--black);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1;
}

.contact-hero__content {
  position: relative;
  z-index: 2;
  width: min(828px, 100%);
  margin-inline: auto;
  padding-top: 116px;
  text-align: center;
}

.contact-hero h1 {
  margin: 0 0 24px;
  color: var(--black);
  font-size: clamp(60px, calc(60px + 0vw), 60px);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: 0;
}

.contact-hero p {
  margin: 0;
  color: var(--black);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1.15;
}

.contact-hero__beans {
  position: absolute;
  z-index: 1;
  top: 315px;
  right: -70px;
  width: 539px;
  max-width: none;
  height: auto;
  pointer-events: none;
}

.contact-main {
  position: relative;
  min-height: 1033px;
  background: var(--white);
  padding: 224px 65px 232px;
}

.contact-main__inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 491px 399px;
  gap: 80px;
  justify-content: center;
  align-items: start;
}

.contact-main__visual {
  width: 491px;
  height: 577px;
  margin: 0;
  overflow: hidden;
  border-radius: 20px;
  background: var(--cream-mid);
}

.contact-main__visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 52% center;
}

.contact-form {
  width: 399px;
  margin-top: 100px;
}

.contact-form__field {
  position: relative;
  padding-bottom: 9px;
  border-bottom: 1px solid rgba(35, 31, 32, 0.55);
}

.contact-form__field + .contact-form__field {
  margin-top: 37px;
}

.contact-form__field > label:not(.sr-only) {
  display: block;
  margin: 0;
  color: var(--black);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1;
}

.contact-form__field input,
.contact-form__field select {
  width: 100%;
  height: 24px;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--black);
  font: inherit;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1;
}

.contact-form__field input::placeholder,
.contact-form__field select {
  color: var(--black);
  opacity: 1;
}

.contact-form__field input:focus,
.contact-form__field select:focus {
  outline: 0;
}

.contact-form__field:focus-within {
  border-bottom-color: var(--black);
}

.contact-form__field--select select {
  appearance: none;
  padding-right: 28px;
  cursor: pointer;
}

.contact-form__field select option {
  color: var(--black);
}

.contact-form__select-icon {
  position: absolute;
  right: 0;
  top: 8px;
  display: inline-flex;
  color: var(--black);
  pointer-events: none;
}

.contact-form__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  margin-top: 48px;
}

.contact-form__terms {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 13px;
  min-width: 0;
  color: var(--black);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1;
  cursor: pointer;
}

.contact-form__terms input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.contact-form__terms-icon {
  position: relative;
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  border: 1.5px solid var(--black);
  border-radius: 50%;
}

.contact-form__terms-icon::after {
  content: "";
  position: absolute;
  inset: 5px;
  border-radius: 50%;
  background: var(--black);
  opacity: 0;
}

.contact-form__terms input:checked + .contact-form__terms-icon::after {
  opacity: 1;
}

.contact-form__submit {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex: 0 0 auto;
  color: var(--black);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 900;
  line-height: 1;
  transition: color 0.18s ease;
}

.contact-form__submit img {
  width: 17px;
  height: 13px;
  max-width: none;
  transform: rotate(14deg) skewX(-13deg);
  transform-origin: center;
}

.contact-form__submit:hover {
  color: var(--gold);
}

@media (max-width: 1180px) {
  .contact-main {
    padding: 160px 40px 180px;
  }

  .contact-main__inner {
    grid-template-columns: minmax(0, 491px) minmax(320px, 399px);
    gap: 56px;
  }

  .contact-main__visual {
    width: 100%;
  }

  .contact-form {
    width: 100%;
  }

  .contact-hero__beans {
    right: -260px;
  }
}

@media (max-width: 991px) {
  /* — Hero — */
  .contact-hero {
    min-height: 368px;
    padding: 118px var(--gutter) 0;
    box-sizing: border-box;
  }

  .contact-hero__content {
    padding-top: 0;
    width: min(279px, 100%);
    max-width: 100%;
  }

  .contact-hero h1 {
    font-size: clamp(32px, calc(2.131324px + 3.013994vw), 60px);
    margin-bottom: 16px;
  }

  .contact-hero p {
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    max-width: 100%;
  }

  .contact-hero__beans {
    display: none;
  }

  /* — Main: single column — */
  .contact-main {
    min-height: 0;
    padding: 0 0 56px;
  }

  .contact-main__inner {
    grid-template-columns: 1fr;
    gap: 0;
    justify-content: stretch;
    width: 100%;
  }

  /* Visual: full-width photo strip */
  .contact-main__visual {
    width: 100%;
    height: 657px;
    border-radius: 0;
  }

  /* Form: full width, padded */
  .contact-form {
    width: 100%;
    margin-top: 0;
    padding: 40px 40px 0;
    box-sizing: border-box;
  }

  .contact-form__field input,
  .contact-form__field select {
    font-size: clamp(13px, calc(9.799785px + 0.322928vw), 16px);
  }

  .contact-form__field input::placeholder {
    font-size: clamp(13px, calc(9.799785px + 0.322928vw), 16px);
  }

  .contact-form__field + .contact-form__field {
    margin-top: 28px;
  }

  .contact-form__terms {
    font-size: clamp(12px, calc(9.866523px + 0.215285vw), 14px);
    gap: 10px;
  }

  .contact-form__submit {
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
  }

  .contact-form__actions {
    margin-top: 36px;
    gap: 16px;
  }
}

/* =============================================================================
   Cart Page (rc-cart)
   ============================================================================= */

.rc-cart {
  background: var(--cream);
  min-height: 60vh;
  padding: 60px 0 100px;
}

.rc-cart__heading {
  font-size: clamp(22px, calc(11.332616px + 1.076426vw), 32px);
  font-weight: 700;
  color: var(--black);
  margin-bottom: 40px;
}

/* ── Empty cart ── */
.rc-cart__empty {
  text-align: center;
  padding: 60px 0;
}

.rc-cart__continue-btn {
  display: inline-block;
  margin-top: 20px;
  padding: 14px 32px;
  background: var(--black);
  color: var(--white);
  border-radius: 8px;
  font-weight: 700;
  text-decoration: none;
}

/* ── 2-column body ── */
.rc-cart__body {
  display: grid;
  grid-template-columns: 1fr 400px;
  gap: 48px;
  align-items: start;
}

/* ── Cart items ── */
.rc-cart-item {
  display: grid;
  grid-template-columns: 90px 1fr auto;
  gap: 20px;
  align-items: center;
  padding: 28px 0;
  border-bottom: 1px solid rgba(35, 31, 32, 0.1);
}

.rc-cart-item:first-child {
  border-top: 1px solid rgba(35, 31, 32, 0.1);
}

.rc-cart-item__thumb {
  display: block;
  width: 90px;
  height: 90px;
  flex-shrink: 0;
}

.rc-cart-item__thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.rc-cart-item__info {
  min-width: 0;
}

.rc-cart-item__name {
  display: block;
  font-weight: 700;
  font-size: clamp(15px, calc(15px + 0vw), 15px);
  color: var(--black);
  text-decoration: none;
  line-height: 1.3;
}

.rc-cart-item__name:hover {
  text-decoration: underline;
}

.rc-cart-item__desc {
  font-size: clamp(13px, calc(13px + 0vw), 13px);
  color: var(--gray);
  margin: 4px 0 0;
  line-height: 1.4;
}

/* Qty controls */
.rc-cart-item__qty-wrap {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 14px;
}

.rc-qty-btn {
  background: none;
  border: none;
  cursor: pointer;
  font-size: clamp(20px, calc(20px + 0vw), 20px);
  line-height: 1;
  color: var(--black);
  padding: 0;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.15s;
}

.rc-qty-btn:hover {
  opacity: 0.5;
}

.rc-qty-input {
  width: 32px;
  border: none;
  background: none;
  font-family: var(--font);
  font-size: clamp(15px, calc(15px + 0vw), 15px);
  font-weight: 700;
  color: var(--black);
  text-align: center;
  -moz-appearance: textfield;
  appearance: textfield;
  padding: 0;
}

.rc-qty-input::-webkit-outer-spin-button,
.rc-qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Right column of item (trash + price) */
.rc-cart-item__right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
}

.rc-cart-item__remove {
  color: var(--gray);
  text-decoration: none;
  display: flex;
  align-items: center;
  transition: color 0.15s;
}

.rc-cart-item__remove:hover {
  color: var(--black);
}

.rc-cart-item__price {
  font-weight: 700;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--black);
  white-space: nowrap;
}

.rc-cart-item__price .woocommerce-Price-amount {
  font-weight: 700;
}

/* ── Order summary panel ── */
.rc-summary {
  background: var(--cream-mid);
  border-radius: 16px;
  padding: 36px 32px;
  position: sticky;
  top: 100px;
}

.rc-summary__rows {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.rc-summary__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0;
  font-size: clamp(15px, calc(15px + 0vw), 15px);
  color: var(--black);
}

.rc-summary__row span:last-child {
  font-weight: 500;
}

.rc-summary__row--discount span:last-child {
  color: var(--red);
}

.rc-summary__divider {
  border: none;
  border-top: 1px solid rgba(35, 31, 32, 0.15);
  margin: 16px 0;
}

.rc-summary__total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: clamp(17px, calc(17px + 0vw), 17px);
  font-weight: 700;
  color: var(--black);
  padding-bottom: 8px;
}

.rc-summary__total .woocommerce-Price-amount {
  font-weight: 700;
}

/* WooCommerce shipping calc inside summary */
.rc-summary__shipping-calc .shipping-calculator-button {
  font-size: clamp(13px, calc(13px + 0vw), 13px);
  color: var(--gold);
  text-decoration: underline;
  cursor: pointer;
}

/* Override WC proceed-to-checkout button */
.rc-summary .wc-proceed-to-checkout {
  margin-top: 24px;
}

.rc-summary .wc-proceed-to-checkout .checkout-button,
.rc-summary .wc-proceed-to-checkout a.checkout-button {
  display: block;
  width: 100%;
  padding: 16px 20px;
  background: var(--black);
  color: var(--white);
  border: none;
  border-radius: 10px;
  font-family: var(--font);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: opacity 0.2s;
}

.rc-summary .wc-proceed-to-checkout .checkout-button:hover {
  opacity: 0.8;
}

/* ── Recommended Products (cross-sells) ── */
.rc-cart__cross-sells {
  margin-top: 80px;
}

.rc-cross-sells__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 32px;
}

.rc-cross-sells__head h2 {
  font-size: clamp(20px, calc(11.466093px + 0.861141vw), 28px);
  font-weight: 700;
  color: var(--black);
  margin: 0;
}

/* nav counter + progress bar */
.rc-cart__cross-sells .products-nav-bottom {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
}

.rc-cart__cross-sells .products-nav-bottom .js-slide-current {
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 400;
  color: var(--gold);
  line-height: 1;
}

.rc-cart__cross-sells .products-progress-track {
  position: relative;
  display: block;
  width: 120px;
  height: 2px;
  background: rgba(35, 31, 32, 0.15);
  border-radius: 2px;
}

.rc-cart__cross-sells .products-progress-thumb {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background: var(--gold);
  border-radius: 2px;
  transition: width 0.35s ease;
}

/* carousel shell + arrows */
.rc-cart__cross-sells .products-carousel-shell {
  position: relative;
  padding-inline: 52px;
}

.rc-cart__cross-sells .products-arrow {
  position: absolute;
  top: 50%;
  z-index: 8;
  width: 44px;
  height: 92px;
  border: 0;
  border-radius: 8px;
  background: var(--gold);
  color: var(--white);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transform: translateY(-50%);
  transition:
    background 0.2s ease,
    opacity 0.2s ease;
}

.rc-cart__cross-sells .products-arrow:hover {
  background: #6e6040;
}

.rc-cart__cross-sells .products-arrow:disabled {
  opacity: 0.35;
  cursor: default;
}

.rc-cart__cross-sells .products-arrow--prev {
  left: 0;
  border-radius: 0 8px 8px 0;
}

.rc-cart__cross-sells .products-arrow--next {
  right: 0;
  border-radius: 8px 0 0 8px;
}

.rc-cart__cross-sells .products-arrow svg {
  display: block;
}

/* slides */
.rc-cart__cross-sells .products-slider {
  margin: 0 -10px;
}

.rc-cart__cross-sells .product-slide {
  padding: 0 10px;
}

/* Cross-sell card */
.rc-cs-card {
  display: flex;
  gap: 16px;
  align-items: center;
  padding: 20px;
  background: var(--white);
  border-radius: 12px;
  height: 100%;
}

.rc-cs-card__image {
  display: block;
  width: 90px;
  height: 90px;
  flex-shrink: 0;
}

.rc-cs-card__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.rc-cs-card__body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.rc-cs-card__name {
  font-weight: 700;
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  color: var(--black);
  text-decoration: none;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.rc-cs-card__name:hover {
  text-decoration: underline;
}

.rc-cs-card__desc {
  font-size: clamp(12px, calc(12px + 0vw), 12px);
  color: var(--gray);
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.rc-cs-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 4px;
}

.rc-cs-card__price {
  font-weight: 700;
  font-size: clamp(15px, calc(15px + 0vw), 15px);
  color: var(--black);
}

.rc-cs-card__price .woocommerce-Price-amount {
  font-weight: 700;
}

.rc-cs-card__cart {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  background: var(--gold);
  color: var(--white);
  border-radius: 8px;
  text-decoration: none;
  flex-shrink: 0;
  transition: opacity 0.2s;
}

.rc-cs-card__cart:hover {
  opacity: 0.8;
}

/* ── Responsive ── */
@media (max-width: 1024px) {
  .rc-cart__body {
    grid-template-columns: 1fr 340px;
    gap: 32px;
  }

  .rc-cart__cross-sells .products-carousel-shell {
    padding-inline: 36px;
  }

  .rc-cart__cross-sells .products-arrow {
    width: 36px;
    height: 72px;
  }
}

@media (max-width: 991px) {
  /* — Container — */
  .rc-cart .container {
    width: 100%;
    max-width: 100%;
    padding-inline: var(--gutter);
    box-sizing: border-box;
  }

  /* — Heading — */
  .rc-cart__heading {
    font-size: clamp(18px, calc(11.599569px + 0.645856vw), 24px);
    margin: 0 0 20px;
  }

  /* — Body: single column — */
  .rc-cart__body {
    grid-template-columns: 1fr;
    gap: 0;
  }

  /* — Cart items: 90px thumb — */
  .rc-cart-item {
    min-height: 0;
    grid-template-columns: 90px 1fr auto;
    gap: 14px;
    align-items: flex-start;
    padding: 20px 0;
  }

  .rc-cart-item__thumb {
    width: 90px;
    height: 90px;
    border-radius: 14px;
    overflow: hidden;
  }

  .rc-cart-item__thumb img {
    padding: 6px;
  }

  .rc-cart-item__name {
    font-size: clamp(14px, calc(3.332616px + 1.076426vw), 24px);
  }

  .rc-cart-item__desc {
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
  }

  .rc-cart-item__qty-wrap {
    width: auto;
    height: auto;
    gap: 12px;
    margin-top: 10px;
    border-bottom: 1px solid rgba(35, 31, 32, 0.4);
    padding: 4px 6px;
  }

  .rc-qty-btn {
    font-size: clamp(14px, calc(3.332616px + 1.076426vw), 24px);
    width: 20px;
    height: 20px;
  }

  .rc-qty-input {
    font-size: clamp(14px, calc(3.332616px + 1.076426vw), 24px);
    width: 24px;
    height: 20px;
  }

  .rc-cart-item__right {
    min-height: 0;
    align-items: flex-end;
    justify-content: flex-start;
    gap: 8px;
  }

  .rc-cart-item__price {
    font-size: clamp(16px, calc(3.199139px + 1.291712vw), 28px);
  }

  /* — Summary: full-bleed — */
  .rc-cart__summary {
    align-items: stretch;
  }

  .rc-summary {
    position: static;
    border-radius: 0;
    padding: 28px var(--gutter) 32px;
    margin-inline: calc(-1 * var(--gutter));
    width: calc(100% + 2 * var(--gutter));
    box-sizing: border-box;
  }

  .rc-summary__row {
    font-size: clamp(14px, calc(9.733046px + 0.430571vw), 18px);
    padding: 8px 0;
  }

  .rc-summary__divider {
    margin: 14px 0;
  }

  .rc-summary__total {
    font-size: clamp(16px, calc(11.733046px + 0.430571vw), 20px);
    padding-right: 0;
    padding-bottom: 0;
  }

  .rc-summary__total span:last-child {
    font-size: clamp(18px, calc(7.332616px + 1.076426vw), 28px);
  }

  /* Checkout button — full width */
  .rc-cart__summary .wc-proceed-to-checkout,
  .rc-summary .wc-proceed-to-checkout {
    width: 100%;
    margin-top: 20px;
  }

  .rc-cart__summary .wc-proceed-to-checkout .checkout-button,
  .rc-cart__summary .wc-proceed-to-checkout a.checkout-button,
  .rc-summary .wc-proceed-to-checkout .checkout-button,
  .rc-summary .wc-proceed-to-checkout a.checkout-button {
    width: 100%;
    height: 50px;
    padding: 0 20px;
    border-radius: 12px;
    font-size: clamp(13px, calc(11.933262px + 0.107643vw), 14px);
  }

  /* — Cross-sells (recommended products) — */
  .rc-cart__cross-sells {
    margin-top: 32px;
  }

  .rc-cross-sells__head {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 16px;
  }

  .rc-cross-sells__head h2 {
    font-size: clamp(14px, calc(14px + 0vw), 14px);
  }

  .rc-cart__cross-sells .products-carousel-shell {
    padding-inline: 0;
  }

  .rc-cart__cross-sells .products-arrow {
    display: none;
  }

  .rc-cs-card {
    padding: 14px;
    gap: 12px;
    border-radius: 10px;
  }

  .rc-cs-card__image {
    width: 80px;
    height: 80px;
    border-radius: 12px;
  }

  .rc-cs-card__name {
    font-size: clamp(14px, calc(14px + 0vw), 14px);
  }

  .rc-cs-card__desc {
    font-size: clamp(12px, calc(12px + 0vw), 12px);
  }

  .rc-cs-card__price {
    font-size: clamp(15px, calc(15px + 0vw), 15px);
  }

  .rc-cs-card__cart {
    width: 36px;
    height: 36px;
    border-radius: 7px;
  }

  .rc-cs-card__cart svg {
    width: 18px;
    height: 18px;
  }
}

/* Cart page Figma alignment */
body.woocommerce-cart .site-header {
  position: relative;
  background: var(--black);
  padding-bottom: 45px;
}

body.woocommerce-cart .header-nav,
body.woocommerce-cart .main-header {
  background: var(--black);
}

body.woocommerce-cart .header-nav__menu a,
body.woocommerce-cart .header-nav__menu li a,
body.woocommerce-cart .header-nav .icon-btn {
  color: var(--white);
}

body.woocommerce-cart .header-nav__eshop-item > a {
  border-color: var(--gold);
  color: var(--gold);
}

body.woocommerce-cart .header-nav__eshop-item > a:hover {
  background: var(--gold);
  color: var(--white);
}

body.woocommerce-cart .header-nav__logo-img {
  filter: brightness(0) invert(1);
}

.rc-cart .container {
  width: calc(100% - 130px);
  max-width: 1790px;
  padding-inline: 0;
}

.rc-cart__heading {
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  line-height: 1;
  margin: 0 0 54px;
}

.rc-cart__body {
  grid-template-columns: minmax(0, 960px) minmax(0, 774px);
  gap: 58px;
  align-items: start;
}

.rc-cart__items {
  width: 100%;
}

.rc-cart-item {
  min-height: 161px;
  grid-template-columns: 126px minmax(0, 1fr) 126px;
  gap: 15px;
  align-items: start;
  padding: 0 0 35px;
  margin: 0 0 32px;
  border-bottom-color: rgba(35, 31, 32, 0.45);
}

.rc-cart-item:first-child {
  border-top: 0;
}

.rc-cart-item__thumb {
  width: 126px;
  height: 126px;
  border-radius: 20px;
  background: var(--white);
  overflow: hidden;
}

.rc-cart-item__thumb img {
  width: 100%;
  height: 100%;
  padding: 10px;
  border-radius: 20px;
  object-fit: contain;
}

.rc-cart-item__name {
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  line-height: 1;
  font-weight: 700;
  margin: 3px 0 0;
}

.rc-cart-item__name:hover {
  text-decoration: none;
  color: var(--gold);
}

.rc-cart-item__desc {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1;
  color: var(--black);
  margin: 7px 0 0;
}

.rc-cart-item__qty-wrap {
  width: 82px;
  height: 29px;
  gap: 17px;
  margin-top: 46px;
  border-bottom: 1px solid rgba(35, 31, 32, 0.45);
}

.rc-qty-btn {
  width: 12px;
  height: 28px;
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  font-weight: 400;
}

.rc-qty-input {
  width: 18px;
  height: 28px;
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  line-height: 1;
  font-weight: 400;
}

.rc-cart-item__right {
  min-height: 126px;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0;
  padding-top: 1px;
}

.rc-cart-item__remove {
  color: var(--black);
}

.rc-cart-item__price {
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  line-height: 1;
  font-weight: 700;
  margin-bottom: 8px;
}

.rc-cart-item__price .woocommerce-Price-amount {
  font-weight: 700;
}

.rc-cart__summary {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.rc-summary {
  width: 100%;
  min-height: 293px;
  position: static;
  border-radius: 20px;
  background: var(--cream-light);
  padding: 62px 39px 48px 51px;
}

.rc-summary__rows {
  gap: 15px;
}

.rc-summary__row {
  padding: 0;
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  line-height: 1;
  color: var(--black);
}

.rc-summary__row span:last-child {
  font-weight: 400;
}

.rc-summary__row ul,
.rc-summary__row li,
.rc-summary__row p {
  margin: 0;
  padding: 0;
  list-style: none;
}

.rc-summary__divider {
  border-top-color: rgba(35, 31, 32, 0.52);
  margin: 37px 0 38px;
}

.rc-summary__total {
  padding: 0 34px 0 0;
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  line-height: 1;
  font-weight: 700;
}

.rc-summary__total span:last-child {
  font-size: clamp(28px, calc(28px + 0vw), 28px);
}

.rc-summary__total .woocommerce-Price-amount {
  font-weight: 700;
}

.rc-cart__summary .wc-proceed-to-checkout {
  width: 286px;
  margin: 49px 0 0;
}

.rc-cart__summary .wc-proceed-to-checkout .checkout-button,
.rc-cart__summary .wc-proceed-to-checkout a.checkout-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 286px;
  height: 60px;
  padding: 0 30px;
  border-radius: 15px;
  background: var(--black);
  color: var(--white);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1;
  font-weight: 700;
}

.rc-cart__cross-sells {
  width: 960px;
  max-width: 100%;
  margin-top: 72px;
}

.rc-cross-sells__head {
  margin-bottom: 48px;
}

.rc-cross-sells__head h2 {
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  line-height: 1;
  font-weight: 700;
}

.rc-cart__cross-sells .products-carousel-shell {
  width: 960px;
  max-width: 100%;
  padding: 0;
}

.rc-cart__cross-sells .products-arrow {
  display: none !important;
}

.rc-cart__cross-sells .products-slider {
  margin: 0 -20px;
}

.rc-cart__cross-sells .product-slide {
  padding: 0 20px;
}

.rc-cs-card {
  min-height: 126px;
  display: grid;
  grid-template-columns: 126px minmax(0, 1fr) 43px;
  align-items: start;
  gap: 15px;
  padding: 0;
  background: transparent;
  border-radius: 0;
}

.rc-cs-card__image {
  width: 126px;
  height: 126px;
  border-radius: 20px;
  background: var(--white);
  overflow: hidden;
}

.rc-cs-card__image img {
  width: 100%;
  height: 100%;
  padding: 10px;
  border-radius: 20px;
  object-fit: contain;
}

.rc-cs-card__body {
  min-height: 126px;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.rc-cs-card__name {
  display: block;
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  line-height: 1;
  font-weight: 700;
  margin: 0;
  -webkit-line-clamp: unset;
  line-clamp: unset;
}

.rc-cs-card__name:hover {
  text-decoration: none;
  color: var(--gold);
}

.rc-cs-card__desc {
  display: block;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1;
  color: var(--black);
  margin: 8px 0 0;
  -webkit-line-clamp: unset;
  line-clamp: unset;
}

.rc-cs-card__footer {
  display: contents;
}

.rc-cs-card__price {
  align-self: end;
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  line-height: 1;
  font-weight: 700;
  margin-bottom: 8px;
}

.rc-cs-card__price del {
  font-size: clamp(22px, calc(22px + 0vw), 22px);
  opacity: 1;
  margin-right: 8px;
}

.rc-cs-card__price ins {
  text-decoration: none;
}

.rc-cs-card__cart {
  grid-column: 3;
  grid-row: 1;
  align-self: end;
  width: 43px;
  height: 43px;
  border-radius: 10px;
  box-shadow: 0 0 4.8px rgba(0, 0, 0, 0.1);
}

.rc-cs-card__cart svg {
  width: 22px;
  height: 22px;
}

.rc-cart__cross-sells .products-nav-bottom {
  width: 296px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 19px;
  margin: 18px 0 0 664px;
}

.rc-cart__cross-sells .products-nav-bottom .js-slide-current {
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  line-height: 1;
  color: var(--gold);
}

.rc-cart__cross-sells .products-progress-track {
  width: 296px;
  height: 3px;
  border-radius: 0;
  background: var(--cream-light);
}

.rc-cart__cross-sells .products-progress-thumb {
  height: 3px;
  border: 1px solid var(--gold);
  border-radius: 0;
  background: var(--black);
}

@media (max-width: 1280px) {
  .rc-cart .container {
    width: calc(100% - 48px);
    padding-inline: 0;
  }

  .rc-cart__body {
    grid-template-columns: minmax(0, 1fr) minmax(330px, 42%);
    gap: 36px;
  }

  .rc-cart__cross-sells .products-nav-bottom {
    margin-left: auto;
  }
}

/* =====================================================
   Brand Rossetti Template
   ===================================================== */
.brand-rossetti-template {
  background: var(--cream);
}

.brand-rossetti-template .site-header {
  position: relative;
  background: var(--cream);
}

.brand-rossetti-template .header-nav,
.brand-rossetti-template .main-header {
  background: var(--cream);
}

.brand-rossetti-template .header-nav__menu a,
.brand-rossetti-template .header-nav__menu li a,
.brand-rossetti-template .header-nav .icon-btn {
  color: var(--black);
}

.brand-rossetti-template .header-nav__eshop-item > a {
  border-color: var(--gold);
  color: var(--gold);
}

body.brand-rossetti-template .header-nav__logo-img {
  content: url("assets/images/logo-rossetti-nav.svg");
}

.br2-page {
  --br2-cream: #f3f0ea;
  --br2-gold: #85754e;
  --br2-black: #231f20;
  --br2-red-brown: #592828;
  background: var(--br2-cream);
  color: var(--br2-black);
  overflow: hidden;
}

.br2-page a {
  color: inherit;
}

.brand-rossetti-template .brand-intro {
  /* The cream hero fills the first screen (100vh) on load; the gold quality
     band sits below the fold and is revealed on scroll. max() keeps the
     section tall enough for the pack card on short (landscape) viewports. */
  min-height: 1375px;
  padding: 120px 65px 120px;
  color: var(--br2-black);
  background: linear-gradient(
    to bottom,
    var(--br2-cream) 0,
    var(--br2-cream) 100vh,
    var(--br2-gold) 100vh,
    var(--br2-gold) 100%
  );
}

/* Push the gold quality steps just below the first-screen fold. */
.brand-rossetti-template .brand-quality-grid {
  top: calc(100vh + 100px);
}

.brand-rossetti-template .brand-kicker,
.brand-rossetti-template .brand-breadcrumb,
.brand-rossetti-template .brand-hero-copy,
.brand-rossetti-template .brand-hero-copy p:last-child {
  color: var(--br2-black);
}

.brand-rossetti-template .brand-hero-copy h1 span {
  -webkit-text-stroke: 1px var(--br2-black);
}

.brand-rossetti-template .brand-hero-copy p:last-child {
  font-weight: 700;
}

.brand-rossetti-template .brand-watermark {
  color: rgba(133, 117, 78, 0.08);
  border-color: rgba(133, 117, 78, 0.08);
  opacity: 0;
}

.brand-rossetti-template .brand-pack-card {
  box-shadow: 0 28px 44px rgba(35, 31, 32, 0.16);
}

.brand-rossetti-template .brand-pack-card__arrows span + span,
.brand-rossetti-template .brand-pack-card__dots .is-active {
  background: var(--br2-gold);
}

.brand-rossetti-template .brand-quote {
  color: var(--br2-black);
}

.brand-rossetti-template .brand-quote > span,
.brand-rossetti-template .brand-quote strong {
  color: var(--br2-gold);
}

.brand-rossetti-template .brand-quality-grid,
.brand-rossetti-template .brand-quality-item,
.brand-rossetti-template .brand-quality-item h2,
.brand-rossetti-template .brand-quality-item p {
  color: var(--white);
}

.brand-rossetti-template .brand-quality-item__icon img {
  width: 47px;
  height: 47px;
}

.br2-breadcrumb {
  position: absolute;
  top: 72px;
  left: clamp(24px, 4vw, 68px);
  display: flex;
  gap: 4px;
  align-items: center;
  font-size: clamp(13px, calc(13px + 0vw), 13px);
  font-weight: 700;
  color: var(--br2-black);
  z-index: 3;
}

.br2-breadcrumb a {
  text-decoration: none;
}

.br2-hero {
  position: relative;
  min-height: 1424px;
  padding: 1px clamp(24px, 3.6vw, 68px) 112px;
  background: linear-gradient(
    to bottom,
    var(--br2-cream) 0,
    var(--br2-cream) 56.2%,
    var(--br2-gold) 56.2%,
    var(--br2-gold) 100%
  );
}

.br2-hero__intro {
  width: min(770px, 92vw);
  margin: 165px auto 134px;
  text-align: center;
}

.br2-hero__intro h1 {
  margin: 0 0 30px;
  font-size: clamp(44px, calc(18.398278px + 2.583423vw), 68px);
  font-weight: 900;
  line-height: 0.98;
  letter-spacing: 0;
  color: var(--br2-black);
}

.br2-hero__intro h1 span {
  color: transparent;
  -webkit-text-stroke: 1px var(--br2-black);
}

.br2-hero__intro p {
  margin: 0 auto;
  max-width: 720px;
  font-size: clamp(15px, calc(15px + 0vw), 15px);
  line-height: 1.25;
  font-weight: 700;
  color: var(--br2-black);
}

.br2-hero__content {
  width: min(1784px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(520px, 895px) minmax(470px, 700px);
  gap: clamp(60px, 8vw, 170px);
  align-items: start;
}

.br2-pack-card {
  position: relative;
  width: 100%;
  max-width: 895px;
  border-radius: 28px;
  overflow: hidden;
  background: var(--br2-black);
  box-shadow: 0 22px 40px rgba(35, 31, 32, 0.18);
}

.br2-pack-slider,
.br2-pack-slide,
.br2-pack-slider .slick-list,
.br2-pack-slider .slick-track {
  height: 100%;
}

.br2-pack-slider {
  aspect-ratio: 895 / 841;
}

.br2-pack-slide img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.br2-pack-card__arrows {
  position: absolute;
  top: 34px;
  right: 38px;
  z-index: 3;
  display: flex;
  border-radius: 8px;
  overflow: hidden;
}

.br2-pack-card__arrow {
  width: 52px;
  height: 60px;
  border: 0;
  background: var(--br2-black);
  color: var(--white);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.2s ease;
}

.br2-pack-card__arrow--next {
  background: var(--br2-gold);
}

.br2-pack-card__arrow:hover {
  background: #6e6040;
}

.br2-pack-card__arrow svg {
  width: 16px;
  height: 28px;
}

.br2-pack-card__dots {
  position: absolute;
  left: 50%;
  bottom: 38px;
  z-index: 3;
  display: flex;
  gap: 13px;
  transform: translateX(-50%);
}

.br2-pack-card__dots span {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--white);
  opacity: 0.9;
  cursor: pointer;
}

.br2-pack-card__dots span.is-active {
  background: var(--br2-gold);
}

.br2-hero-quote {
  margin: 222px 0 0;
  max-width: 574px;
  display: grid;
  grid-template-columns: 45px 1fr;
  gap: 18px;
  align-items: start;
  color: var(--br2-black);
}

.br2-hero-quote img,
.br2-products__quote img {
  width: 43px;
  height: 31px;
  display: block;
}

.br2-hero-quote p,
.br2-products__quote p {
  margin: 0;
  font-size: clamp(27px, calc(21.666308px + 0.538213vw), 32px);
  font-weight: 900;
  line-height: 1.37;
  letter-spacing: 0;
}

.br2-hero-quote strong,
.br2-products__quote strong {
  color: var(--br2-gold);
}

.br2-quality-grid {
  margin-top: 184px;
  display: grid;
  grid-template-columns: repeat(2, minmax(230px, 1fr));
  gap: 70px 78px;
}

.br2-quality-item {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 20px;
  align-items: start;
  color: var(--white);
}

.br2-quality-item__icon {
  width: 56px;
  height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.br2-quality-item__icon img {
  width: 100%;
  height: 100%;
  display: block;
}

.br2-quality-item h2 {
  margin: 0 0 14px;
  font-size: clamp(27px, calc(27px + 0vw), 27px);
  line-height: 1;
  font-weight: 900;
  color: var(--white);
}

.br2-quality-item p {
  margin: 0;
  max-width: 282px;
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  line-height: 1.18;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.9);
}

.br2-origins {
  background: var(--br2-cream);
  padding: 125px 0 0px;
}

.br2-origins__inner {
  position: relative;
}

.br2-kicker {
  margin: 0 0 18px 19px;
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 700;
  line-height: 1;
}

.br2-origins h2 {
  margin: 0 0 0 19px;
  font-size: clamp(46px, calc(31.065662px + 1.506997vw), 60px);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: 0;
}

.br2-origins h2 span {
  color: transparent;
  -webkit-text-stroke: 1px var(--br2-black);
}

.br2-origin-map {
  position: relative;
  width: 100%;
  max-width: 100%;
  height: 780px;
  margin: 57px 0;
}

.br2-origin-map__art {
  position: absolute;
  z-index: 1;
  left: 306px;
  top: 11px;
  width: 946px;
  height: 704px;
  aspect-ratio: 948.326 / 705.916;
  display: block;
  --fill-0: #e1d7bb;
  --stroke-2: #f3f0ea;
}

.br2-origin-map__art svg {
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
}

.br2-origin-map__art svg #Vector,
.br2-origin-map__art svg #Vector_2,
.br2-origin-map__art svg #Vector_3,
.br2-origin-map__art svg #Vector_4 {
  fill: #85754e;
  stroke: none;
}

.br2-origin-line {
  position: absolute;
  z-index: 2;
  display: block;
  pointer-events: none;
  --stroke-0: #85754e;
}

.br2-origin-line svg {
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
}

.br2-origin-line--colombia {
  left: 306px;
  top: 55px;
  width: 246px;
  height: 304px;
}

.br2-origin-line--ethiopia {
  left: 955px;
  top: 343px;
  width: 264px;
  height: 100px;
  transform: scaleX(-1);
}

.br2-origin-line--brazil {
  left: 287px;
  top: 527px;
  width: 275px;
  height: 46px;
}

.br2-origin-line--indonesia {
  left: 837px;
  top: 591px;
  width: 239px;
  height: 132px;
  transform: rotate(180deg);
}

.br2-origin-card {
  position: absolute;
  z-index: 4;
  display: block;
  height: 198px;
  text-decoration: none;
  color: var(--br2-black);
}

.br2-origin-card__photo {
  position: absolute;
  left: 0;
  top: 0;
  width: 198px;
  height: 198px;
  border-radius: 15px;
  overflow: hidden;
  display: block;
  box-shadow: -25px 25px 36.9px -3px rgba(0, 0, 0, 0.17);
}

.br2-origin-card__photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.br2-origin-card__label {
  position: absolute;
  min-width: 118px;
  height: 43px;
  padding: 5px 13px 0;
  background: #e1d7bb;
  color: var(--br2-gold);
  font-size: clamp(32px, calc(32px + 0vw), 32px);
  line-height: 1;
  font-weight: 700;
  text-align: center;
  text-transform: none;
  white-space: nowrap;
}

.br2-origin-card__text {
  position: absolute;
  display: block;
  margin: 0;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1;
  color: var(--br2-gold);
}

.br2-origin-card--colombia {
  left: 0;
  top: 0;
  width: 409px;
}

.br2-origin-card--colombia .br2-origin-card__label {
  left: 128px;
  top: 34px;
}

.br2-origin-card--colombia .br2-origin-card__text {
  left: 211px;
  top: 121px;
  width: 198px;
}

.br2-origin-card--brazil {
  left: 32px;
  top: 471px;
  width: 433px;
}

.br2-origin-card--brazil .br2-origin-card__label {
  left: 127px;
  top: 32px;
}

.br2-origin-card--brazil .br2-origin-card__text {
  left: 216px;
  top: 130px;
  width: 185px;
}

.br2-origin-card--ethiopia {
  left: 1246px;
  top: 200px;
  width: 432px;
}

.br2-origin-card--ethiopia .br2-origin-card__photo {
  left: 23px;
}

.br2-origin-card--ethiopia .br2-origin-card__label {
  left: 0;
  top: 120px;
}

.br2-origin-card--ethiopia .br2-origin-card__text {
  left: 239px;
  top: 125px;
  width: 194px;
}

.br2-origin-card--indonesia {
  left: 1089px;
  top: 582px;
  width: 589px;
}

.br2-origin-card--indonesia .br2-origin-card__photo {
  left: 32px;
}

.br2-origin-card--indonesia .br2-origin-card__label {
  left: 0;
  top: 119px;
}

.br2-origin-card--indonesia .br2-origin-card__text {
  left: 247px;
  top: 124px;
  width: 253px;
}

/* Mobile origin slider — hidden on desktop */
.br2-origin-slider {
  display: none;
}

/* ===== Origins map — fluid desktop scaling (>=1181px) =====
   Keeps the exact desktop proportions but scales the whole map with the
   container width instead of fixed pixels, so nothing overflows and the
   design stays identical as the window narrows. .br2-origins__inner becomes
   a query container, so 1cqw = 1% of its width; every value below is the
   original px / 17.28 (container width at the 1920 design: 90% x 1920 =
   1728px -> 100cqw). cqw is used instead of plain % so fonts, radii and
   shadows scale too — plain % can only scale width/left. */
@media (min-width: 1181px) {
  .br2-origins__inner {
    container-type: inline-size;
  }

  .br2-origin-map {
    width: 100%;
    height: 45.139cqw;
  }

  .br2-origin-map__art {
    left: 17.708cqw;
    top: 0.637cqw;
    width: 54.745cqw;
    height: 40.741cqw;
  }

  .br2-origin-line--colombia {
    left: 17.708cqw;
    top: 3.183cqw;
    width: 14.236cqw;
    height: 17.593cqw;
  }

  .br2-origin-line--ethiopia {
    left: 55.266cqw;
    top: 19.85cqw;
    width: 15.278cqw;
    height: 5.787cqw;
  }

  .br2-origin-line--brazil {
    left: 16.609cqw;
    top: 30.498cqw;
    width: 15.914cqw;
    height: 2.662cqw;
  }

  .br2-origin-line--indonesia {
    left: 48.438cqw;
    top: 34.201cqw;
    width: 13.831cqw;
    height: 7.639cqw;
  }

  .br2-origin-card {
    height: 11.458cqw;
  }

  .br2-origin-card__photo {
    width: 11.458cqw;
    height: 11.458cqw;
    border-radius: 0.868cqw;
    box-shadow: -1.447cqw 1.447cqw 2.135cqw -0.174cqw rgba(0, 0, 0, 0.17);
  }

  .br2-origin-card__label {
    min-width: 6.829cqw;
    height: 2.488cqw;
    padding: 0.289cqw 0.752cqw 0;
    font-size: 1.852cqw;
  }

  .br2-origin-card__text {
    font-size: 0.926cqw;
  }

  .br2-origin-card--colombia {
    width: 23.669cqw;
  }
  .br2-origin-card--colombia .br2-origin-card__label {
    left: 7.407cqw;
    top: 1.968cqw;
  }
  .br2-origin-card--colombia .br2-origin-card__text {
    left: 12.211cqw;
    top: 7.002cqw;
    width: 11.458cqw;
  }

  .br2-origin-card--brazil {
    left: 1.852cqw;
    top: 27.257cqw;
    width: 25.058cqw;
  }
  .br2-origin-card--brazil .br2-origin-card__label {
    left: 7.35cqw;
    top: 1.852cqw;
  }
  .br2-origin-card--brazil .br2-origin-card__text {
    left: 12.5cqw;
    top: 7.523cqw;
    width: 10.706cqw;
  }

  .br2-origin-card--ethiopia {
    left: 72.106cqw;
    top: 11.574cqw;
    width: 25cqw;
  }
  .br2-origin-card--ethiopia .br2-origin-card__photo {
    left: 1.331cqw;
  }
  .br2-origin-card--ethiopia .br2-origin-card__label {
    top: 6.944cqw;
  }
  .br2-origin-card--ethiopia .br2-origin-card__text {
    left: 13.831cqw;
    top: 7.234cqw;
    width: 11.227cqw;
  }

  .br2-origin-card--indonesia {
    left: 63.021cqw;
    top: 33.681cqw;
    width: 34.086cqw;
  }
  .br2-origin-card--indonesia .br2-origin-card__photo {
    left: 1.852cqw;
  }
  .br2-origin-card--indonesia .br2-origin-card__label {
    top: 6.887cqw;
  }
  .br2-origin-card--indonesia .br2-origin-card__text {
    left: 14.294cqw;
    top: 7.176cqw;
    width: 14.641cqw;
  }
}

.br2-products {
  position: relative;
  min-height: 1522px;
  padding: 65px 0 0;
  background: var(--br2-black);
  overflow: hidden;
}

body.brand-rossetti-template .br2-products__more {
  display: none;
}

.br2-products__bg,
.br2-products__shade {
  position: absolute;
  inset-inline: 0;
  pointer-events: none;
}

.br2-products__bg {
  bottom: 0;
  height: 780px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center bottom;
  opacity: 0.96;
}

.br2-products__shade {
  top: 0;
  bottom: 0;
  background: linear-gradient(
    to bottom,
    rgba(35, 31, 32, 1) 0,
    rgba(35, 31, 32, 1) 48%,
    rgba(35, 31, 32, 0.88) 61%,
    rgba(35, 31, 32, 0.3) 82%,
    rgba(35, 31, 32, 1) 100%
  );
}

.br2-products__inner {
  position: relative;
  z-index: 2;
}

.br2-products .products-section__header {
  display: flex;
  justify-content: center;
  margin: 0 0 56px;
}

.br2-products .products-section__heading {
  text-align: center;
  font-size: clamp(48px, calc(20.264801px + 2.798708vw), 74px);
  line-height: 1;
  font-weight: 900;
  color: var(--white);
}

.br2-products .products-section__heading span {
  color: transparent;
  -webkit-text-stroke: 1px var(--white);
}

.br2-products__tabs-shell {
  display: flex;
  justify-content: center;
  margin-bottom: 72px;
}

.br2-products .products-filter-tabs {
  display: flex;
  justify-content: center;
  gap: 62px;
  flex-wrap: wrap;
}

.br2-products .products-tab-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #d8d0bc;
  cursor: pointer;
}

.br2-products__tab-icon {
  width: 106px;
  height: 106px;
  border-radius: 999px;
  background: var(--br2-red-brown);
  color: #ded6c2;
  display: flex;
  align-items: center;
  justify-content: center;
  transition:
    background 0.2s ease,
    transform 0.2s ease;
}

.br2-products__tab-icon svg {
  width: 44px;
  height: 44px;
  display: block;
}

.br2-products__tab-label {
  font-size: clamp(15px, calc(15px + 0vw), 15px);
  font-weight: 700;
  line-height: 1;
}

.br2-products .products-tab-btn.is-active .br2-products__tab-icon,
.br2-products .products-tab-btn:hover .br2-products__tab-icon {
  background: var(--br2-gold);
  transform: translateY(-1px);
}

.br2-products .products-carousel-shell {
  position: relative;
  padding-inline: 12px;
}

.br2-products .products-slider-wrap {
  display: none;
}

.br2-products .products-slider-wrap.is-active {
  display: block;
}

.br2-products .products-slider {
  margin-right: -38px;
}

.br2-products .products-slider.slick-initialized .slick-list {
  overflow: hidden;
}

.br2-products .products-slider.slick-initialized .slick-track {
  display: flex;
  align-items: stretch;
}

.br2-products .products-slider.slick-initialized .slick-slide {
  display: flex !important;
  height: auto !important;
  position: relative;
}

.br2-products .product-slide {
  position: relative;
  padding-right: 38px;
  display: flex !important;
  align-items: stretch;
  height: auto !important;
}

.br2-products .product-slide .product-card {
  flex: 1;
}

.br2-products .product-slide .rs-shop-card {
  flex: 1;
  width: 100%;
  max-width: none;
}

.br2-products .product-slide--has-badge .product-card {
  clip-path: url("#br2-card-notch-single");
}

.br2-products .product-card {
  width: 100%;
  min-height: 493px;
  padding: 0;
  display: flex;
  flex-direction: column;
  background: var(--white);
  border-radius: 10px;
  overflow: hidden;
  text-decoration: none;
  filter: drop-shadow(0 18px 35px rgba(0, 0, 0, 0.18));
}

.br2-products .product-card__image {
  position: relative;
  height: 312px;
  flex: 0 0 312px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 44px 28px 18px;
  background: transparent;
  border-radius: 0;
  margin: 0;
}

.br2-products .product-card__image img {
  width: auto;
  max-width: 96%;
  max-height: 258px;
  object-fit: contain;
  display: block;
  transition: transform 0.3s ease;
}

.br2-products .product-card:hover .product-card__image img {
  transform: translateY(-4px) scale(1.02);
}

.br2-products .product-card__wishlist {
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 2;
  width: 27px;
  height: 24px;
  color: var(--br2-black);
  background: transparent;
  border: 0;
  padding: 0;
}

.br2-products .product-card__wishlist svg {
  width: 100%;
  height: 100%;
}

.br2-products .product-card__badges {
  position: absolute;
  top: 0;
  right: 38px;
  z-index: 5;
  pointer-events: none;
}

.br2-products .product-card__badge {
  position: static;
  width: 70px;
  height: 60px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: var(--white);
  color: var(--br2-black);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 900;
  line-height: 1;
}

.br2-products .product-card__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 24px 32px 32px;
}

.br2-products .product-card__name {
  margin: 0 0 16px;
  color: var(--br2-black);
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  line-height: 1.1;
  font-weight: 900;
}

.br2-products .product-card__desc {
  margin: 0;
  color: rgba(35, 31, 32, 0.88);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.33;
  font-weight: 500;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.br2-products .products-arrow {
  position: absolute;
  top: 50%;
  z-index: 8;
  width: 44px;
  height: 127px;
  border: 0;
  background: var(--br2-gold);
  color: var(--white);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-50%);
  cursor: pointer;
  transition:
    background 0.2s ease,
    opacity 0.2s ease;
}

.br2-products .products-arrow:hover {
  background: #6e6040;
}

.br2-products .products-arrow:disabled {
  opacity: 0.35;
  cursor: default;
}

.br2-products .products-arrow--prev {
  left: 0;
  border-radius: 0 10px 10px 0;
}

.br2-products .products-arrow--next {
  right: 0;
  border-radius: 10px 0 0 10px;
}

.br2-products .products-section__footer {
  display: flex;
  justify-content: center;
  margin-top: 52px;
}

.br2-products .products-nav-bottom {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

.br2-products .products-nav-bottom .js-slide-current {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  line-height: 1;
  color: var(--white);
}

.br2-products .products-progress-track {
  position: relative;
  width: 214px;
  height: 1px;
  background: rgba(255, 255, 255, 0.58);
  display: block;
}

.br2-products .products-progress-thumb {
  position: absolute;
  left: 0;
  top: -2px;
  height: 5px;
  width: 51px;
  border: 1px solid var(--white);
  background: var(--white);
  display: block;
  transition:
    width 0.35s ease,
    transform 0.35s ease;
}

.br2-products__quote {
  width: min(560px, 90%);
  margin: 258px auto 0;
  display: grid;
  grid-template-columns: 45px 1fr;
  gap: 18px;
  align-items: start;
  color: var(--white);
}

@media (max-width: 1400px) {
  .br2-hero {
    min-height: 1300px;
  }

  .br2-hero__intro {
    margin-top: 130px;
    margin-bottom: 110px;
  }

  .br2-hero__content {
    gap: 70px;
  }

  .br2-hero-quote {
    margin-top: 160px;
  }

  .br2-quality-grid {
    margin-top: 135px;
    gap: 48px 40px;
  }

  .br2-origin-card--indonesia {
    right: 20px;
  }

  .br2-products .products-slider {
    margin-right: -24px;
  }

  .br2-products .product-slide {
    padding-right: 24px;
  }

  .br2-products .product-card__badges {
    right: 24px;
  }
}

@media (max-width: 1180px) {
  .brand-rossetti-template .brand-intro {
    min-height: 0;
    padding: 210px 32px 90px;
    background: linear-gradient(
      to bottom,
      var(--br2-cream) 0,
      var(--br2-cream) 46%,
      var(--br2-gold) 46%,
      var(--br2-gold) 100%
    );
  }

  .brand-rossetti-template .brand-pack-card {
    position: relative;
    left: auto;
    top: auto;
    width: min(895px, 100%);
    height: auto;
    aspect-ratio: 895 / 841;
    margin: 72px auto 0;
  }

  .brand-rossetti-template .brand-quote {
    position: relative;
    left: auto;
    top: auto;
    margin: 52px auto 0;
    max-width: 680px;
    color: var(--white);
  }

  .brand-rossetti-template .brand-quality-grid {
    position: relative;
    left: auto;
    top: auto;
    right: auto;
    width: min(850px, 100%);
    margin: 64px auto 0;
  }

  .br2-hero {
    min-height: 0;
    padding-bottom: 90px;
    background: linear-gradient(
      to bottom,
      var(--br2-cream) 0,
      var(--br2-cream) 45%,
      var(--br2-gold) 45%,
      var(--br2-gold) 100%
    );
  }

  .br2-hero__content {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .br2-pack-card {
    margin: 0 auto;
  }

  .br2-hero-quote {
    margin: 0 auto;
    color: var(--white);
  }

  .br2-quality-grid {
    margin-top: 24px;
  }

  .br2-origin-map {
    width: 100%;
    height: auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(260px, 1fr));
    gap: 30px;
    padding-top: 36px;
  }

  .br2-origin-map__art {
    position: relative;
    grid-column: 1 / -1;
    top: auto;
    left: auto;
    width: min(900px, 100%);
    height: auto;
    aspect-ratio: 948.326 / 705.916;
    margin: 0 auto 18px;
    transform: none;
  }

  .br2-origin-line {
    display: none;
  }

  .br2-origin-card,
  .br2-origin-card--colombia,
  .br2-origin-card--brazil,
  .br2-origin-card--ethiopia,
  .br2-origin-card--indonesia {
    position: relative;
    inset: auto;
    width: 100%;
    height: auto;
    min-height: 198px;
    display: grid;
    grid-template-columns: 198px minmax(0, 1fr);
    grid-template-rows: auto 1fr;
    column-gap: 22px;
    align-items: center;
  }

  .br2-origin-card .br2-origin-card__photo {
    position: relative;
    left: auto;
    top: auto;
    grid-row: 1 / span 2;
  }

  .br2-origin-card .br2-origin-card__label,
  .br2-origin-card .br2-origin-card__text {
    position: relative;
    left: auto;
    top: auto;
  }

  .br2-origin-card .br2-origin-card__text {
    width: auto;
  }

  .br2-products__quote {
    transform: none;
  }
}

@media (max-width: 991px) {
  /* ── Brand Rossetti intro section ── */
  .brand-rossetti-template .brand-intro {
    padding: 60px 24px 56px;
    background: linear-gradient(
      to bottom,
      var(--br2-cream) 0,
      var(--br2-cream) 52%,
      var(--br2-gold) 52%,
      var(--br2-gold) 100%
    );
  }

  .brand-rossetti-template .brand-kicker {
    font-size: 14px;
  }

  .brand-rossetti-template .brand-hero-copy {
    width: 100%;
  }

  .brand-rossetti-template .brand-hero-copy h1 {
    font-size: 32px;
    line-height: 1.1;
    margin: 10px 0 18px;
  }

  .brand-rossetti-template .brand-hero-copy p:last-child {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
  }

  .brand-rossetti-template .brand-pack-card {
    margin-top: 32px;
  }

  .brand-rossetti-template .brand-quote {
    margin-top: 28px;
    max-width: 100%;
  }

  .brand-rossetti-template .brand-quote p {
    font-size: 18px;
    line-height: 1.3;
  }

  .brand-rossetti-template .brand-quality-grid {
    grid-template-columns: 1fr;
    row-gap: 28px;
    column-gap: 0;
    margin-top: 36px;
    width: 100%;
    max-width: 100%;
  }

  .brand-rossetti-template .brand-quality-item h2 {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 6px;
  }

  .brand-rossetti-template .brand-quality-item p {
    font-size: 12px;
    font-weight: 400;
    line-height: 1.3;
  }

  /* ── Origins section ── */
  .br2-origins {
    padding-top: 60px;
    padding-bottom: 40px;
  }

  .br2-origins__inner {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
  }

  .br2-kicker {
    font-size: 14px;
    margin: 0 0 12px 0;
    padding-inline: var(--gutter);
  }

  .br2-origins h2 {
    font-size: 32px;
    line-height: 1.1;
    padding-inline: var(--gutter);
    margin-left: 0;
  }

  /* Map: fixed-height clipping window with zoom/pan */
  .br2-origin-map {
    display: block;
    position: relative;
    width: 100%;
    height: 260px;
    overflow: hidden;
    margin: 24px 0 0;
    padding: 0;
  }

  /* Hide desktop lines and absolutely-positioned cards */
  .br2-origin-line,
  .br2-origin-card {
    display: none !important;
  }

  /* Map SVG art: animates on data-origin change */
  .br2-origin-map__art {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: auto;
    transform-origin: center center;
    transition: transform 0.7s ease;
  }

  /* Cream fade top/bottom (matches the-coffee origin map) */
  .br2-origin-map::before,
  .br2-origin-map::after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    z-index: 2;
    height: 72px;
    pointer-events: none;
  }

  .br2-origin-map::before {
    top: 0;
    background: linear-gradient(to bottom, var(--cream) 0%, transparent 100%);
  }

  .br2-origin-map::after {
    bottom: 0;
    background: linear-gradient(to top, var(--cream) 0%, transparent 100%);
  }

  /* Per-origin zoom/pan transforms (tuned to centre each region in the window) */
  .br2-origin-map[data-origin="colombia"] .br2-origin-map__art {
    transform: scale(2.2) translate(24%, -18%);
  }

  .br2-origin-map[data-origin="brazil"] .br2-origin-map__art {
    transform: scale(2.2) translate(22%, -24%);
  }

  .br2-origin-map[data-origin="ethiopia"] .br2-origin-map__art {
    transform: scale(2.2) translate(-5%, -11%);
  }

  .br2-origin-map[data-origin="indonesia"] .br2-origin-map__art {
    transform: scale(2.2) translate(-28%, -18%);
  }

  /* Mobile origin slider */
  .br2-origin-slider {
    display: block;
    padding-top: 24px;
  }

  .br2-origin-slider__track-wrap {
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding-left: var(--gutter);
    padding-right: 0;
  }

  .br2-origin-slider__track-wrap::-webkit-scrollbar {
    display: none;
  }

  .br2-origin-slider__track {
    display: flex;
    flex-wrap: nowrap;
    gap: 16px;
    padding-right: var(--gutter);
  }

  .br2-origin-slide {
    flex: 0 0 79vw;
    scroll-snap-align: start;
    display: grid;
    grid-template-columns: 149px 1fr;
    gap: 16px;
    align-items: start;
    text-decoration: none;
    color: var(--br2-black);
    min-width: 0;
  }

  .br2-origin-slide__photo {
    width: 149px;
    height: 149px;
    border-radius: 8px;
    overflow: hidden;
    display: block;
    flex-shrink: 0;
  }

  .br2-origin-slide__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  .br2-origin-slide__body {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }

  .br2-origin-slide__label {
    display: inline-block;
    align-self: flex-start;
    margin-left: -35px;
    background: var(--cream-light);
    padding: 7px 12px;
    font-size: 18px;
    font-weight: 700;
    color: var(--br2-gold);
    line-height: 1;
  }

  .br2-origin-slide__text {
    display: block;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--br2-black);
  }

  /* Counter */
  .br2-origin-slider__counter {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    margin-top: 20px;
    padding-right: var(--gutter);
    gap: 8px;
  }

  .br2-origin-slider__num {
    display: block;
    font-size: 18px;
    font-weight: 400;
    color: var(--br2-gold);
    line-height: 1;
  }

  .br2-origin-slider__line {
    position: relative;
    width: 100%;
    height: 1px;
    background: rgba(133, 117, 78, 0.3);
  }

  .br2-origin-slider__bar {
    position: absolute;
    left: 0;
    top: -1.5px;
    width: 0%;
    height: 4px;
    background: var(--br2-gold);
    transition: width 0.3s ease;
  }

  /* ── Products section ── */
  .br2-products {
    min-height: 0;
    padding-top: 48px;
    padding-bottom: 56px;
  }

  /* Full-width inner container — same pattern as home slider */
  .br2-products__inner {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
  }

  .br2-products .products-section__header {
    margin-bottom: 36px;
    padding-inline: var(--gutter);
  }

  .br2-products .products-section__heading {
    font-size: 32px;
  }

  .br2-products__tabs-shell {
    margin-bottom: 40px;
    padding-inline: var(--gutter);
  }

  .br2-products .products-filter-tabs {
    gap: 24px;
  }

  .br2-products__tab-icon {
    width: 68px;
    height: 68px;
  }

  .br2-products__tab-icon svg {
    width: 28px;
    height: 28px;
  }

  .br2-products__tab-label {
    font-size: 12px;
  }

  .br2-products .product-card__name {
    font-size: 18px;
    font-weight: 700;
  }

  .br2-products .product-card__desc {
    font-size: 14px;
    font-weight: 400;
  }

  .br2-products__quote {
    margin-top: 56px;
    width: 100%;
    padding-inline: var(--gutter);
    box-sizing: border-box;
  }

  .br2-products__quote p {
    font-size: 18px;
    line-height: 1.3;
  }

  .br2-products .products-carousel-shell {
    overflow: hidden;
    padding-left: var(--gutter);
    padding-right: 0;
  }

  .br2-products .products-slider,
  .br2-products .products-slider.slick-initialized,
  .br2-products .products-slider.slick-initialized .slick-list {
    overflow: visible;
    margin: 0;
  }

  .br2-products .product-slide {
    width: 79.47vw !important;
    padding-right: 20px;
    box-sizing: border-box;
  }

  .br2-products .product-card {
    width: 100%;
  }
}

/* =============================================================================
   Checkout Page (rc-checkout)
   ============================================================================= */

/* ── Dark header for checkout page ── */
body.woocommerce-checkout .site-header {
  position: relative;
  background: var(--black);
}

body.woocommerce-checkout .header-nav,
body.woocommerce-checkout .main-header {
  background: var(--black);
}

body.woocommerce-checkout .header-nav__menu li a,
body.woocommerce-checkout .header-nav__icons,
body.woocommerce-checkout .icon-btn {
  color: var(--white);
}

body.woocommerce-checkout .header-nav__eshop-item > a {
  color: var(--gold);
  border-color: var(--gold);
}

body.woocommerce-checkout .header-nav__logo-img {
  filter: none;
  content: url("assets/images/logo-rossetti-footer.svg");
}

/* ── Layout: 2-column split-screen ── */
.rc-checkout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 100vh;
  margin: 0;
  padding: 0;
  border: 0;
}

.rc-checkout__left {
  background: #e1d7bb;
  padding: 52px 8% 80px max(8%, calc(50vw - 560px));
  display: flex;
  flex-direction: column;
  gap: 36px;
  border-right: 1px solid rgba(35, 31, 32, 0.12);
}

.woocommerce-error::before,
.woocommerce-info::before,
.woocommerce-message::before {
  font-family: WooCommerce;
  content: "\e028";
  content: "\e028" / "";
  display: inline-block;
  position: absolute;
  top: 1em;
  left: 0em;
}

.rc-checkout__left .form-row label.screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.rc-checkout__left .form-row .input-text::placeholder,
.rc-checkout__left .form-row textarea::placeholder {
  color: rgba(35, 31, 32, 0.7);
  opacity: 1;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
}

.rc-checkout__left .form-row .input-text:focus::placeholder,
.rc-checkout__left .form-row textarea:focus::placeholder {
  color: rgba(35, 31, 32, 0.45);
}

.rc-checkout__right {
  background: var(--cream);
  padding: 52px 8% 80px min(8%, calc(50vw - 560px));
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
}

/* ── Logo ── */
.rc-checkout__logo {
  display: block;
  margin-bottom: 20px;
}

.rc-checkout__logo img {
  height: 111px;
  width: auto;
  display: block;
}

/* ── Section title ── */
.rc-co-section__title {
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  font-weight: 700;
  color: var(--black);
  margin: 0 0 20px;
}

/* ── Receipt / Invoice toggle ── */
.rc-co-invoice__label {
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  font-weight: 700;
  color: var(--black);
  margin: 0 0 14px;
}

.rc-co-invoice__radios {
  display: flex;
  gap: 32px;
}

/* ── Generic radio label ── */
.rc-co-radio,
.rc-co-ship-opt {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  color: var(--black);
  position: relative;
}

.rc-co-radio input[type="radio"],
.rc-co-ship-opt input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.rc-co-radio__dot {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1.5px solid rgba(35, 31, 32, 0.35);
  background: var(--white);
  flex-shrink: 0;
  position: relative;
  transition: border-color 0.15s;
}

.rc-co-radio__dot::after {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 50%;
  background: var(--black);
  opacity: 0;
  transition: opacity 0.15s;
}

.rc-co-radio input[type="radio"]:checked ~ .rc-co-radio__dot,
.rc-co-ship-opt input[type="radio"]:checked ~ .rc-co-radio__dot {
  border-color: var(--black);
}

.rc-co-radio input[type="radio"]:checked ~ .rc-co-radio__dot::after,
.rc-co-ship-opt input[type="radio"]:checked ~ .rc-co-radio__dot::after {
  opacity: 1;
}

/* ── Shipping options ── */
.rc-co-section {
  display: flex;
  flex-direction: column;
}

.rc-co-ship-opt {
  padding: 14px 0;
  border-bottom: 1px solid rgba(35, 31, 32, 0.08);
}

.rc-co-ship-opt:first-of-type {
  border-top: 1px solid rgba(35, 31, 32, 0.08);
}

.rc-co-ship-opt__name {
  flex: 1;
}

.rc-co-ship-opt__cost {
  font-weight: 700;
  margin-left: auto;
}

/* ── Billing / Shipping form fields (WooCommerce) ── */
.rc-checkout__left .woocommerce-billing-fields h3,
.rc-checkout__left .woocommerce-shipping-fields h3,
.rc-checkout__left .woocommerce-additional-fields h3 {
  display: none;
}

.rc-checkout__left .form-row {
  position: relative;
  padding: 0;
  margin: 0 0 24px;
}

.rc-checkout__left .form-row > label,
.rc-checkout__left .form-row label.screen-reader-text {
  position: absolute !important;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  margin: 0;
  padding: 0;
}

.rc-checkout__left .form-row .woocommerce-input-wrapper {
  display: block;
  width: 100%;
}

form.rc-checkout .rc-checkout__left .form-row .input-text,
form.rc-checkout .rc-checkout__left .form-row select,
form.rc-checkout .rc-checkout__left .form-row textarea {
  width: 100%;
  background: none;
  border: none;
  border-bottom: 1px solid rgba(35, 31, 32, 0.45);
  border-radius: 0;
  padding: 10px 0 16px;
  font-family: var(--font);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--black);
  outline: none;
  transition: border-color 0.15s;
  -webkit-appearance: none;
  appearance: none;
  box-shadow: none;
}

form.rc-checkout .rc-checkout__left .form-row .input-text:focus,
form.rc-checkout .rc-checkout__left .form-row select:focus,
form.rc-checkout .rc-checkout__left .form-row textarea:focus {
  border-bottom-color: var(--black);
}

/* Make form-rows full-width and override select2 to look like text inputs */
form.rc-checkout .rc-checkout__left .form-row,
form.rc-checkout .rc-checkout__left .form-row .woocommerce-input-wrapper,
form.rc-checkout .rc-checkout__left .form-row .select2,
form.rc-checkout .rc-checkout__left .form-row .select2-container {
  width: 100% !important;
  max-width: 100%;
}

form.rc-checkout .rc-checkout__left .form-row .select2-selection {
  width: 100%;
  height: auto;
  min-height: 0;
  background: none;
  border: none;
  border-bottom: 1px solid rgba(35, 31, 32, 0.45);
  border-radius: 0;
  padding: 10px 0 16px;
  box-shadow: none;
  outline: none;
  font-family: var(--font);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--black);
  transition: border-color 0.15s;
}

form.rc-checkout .rc-checkout__left .form-row .select2-selection__rendered {
  padding: 0;
  line-height: normal;
  color: var(--black);
}

form.rc-checkout .rc-checkout__left .form-row .select2-selection__arrow {
  height: 100%;
  top: 0;
  right: 0;
}

form.rc-checkout
  .rc-checkout__left
  .form-row
  .select2-container--default.select2-container--focus
  .select2-selection {
  border-bottom-color: var(--black);
}

.rc-checkout__left .form-row textarea {
  resize: vertical;
  min-height: 64px;
}

.rc-checkout__left .woocommerce-billing-fields__field-wrapper,
.rc-checkout__left .woocommerce-address-fields__field-wrapper {
  display: flex;
  flex-direction: column;
}

.rc-checkout__left .form-row-first,
.rc-checkout__left .form-row-last,
.rc-checkout__left .form-row-wide {
  width: 100%;
}

.rc-checkout__left .form-row-wide {
  width: 100%;
}

.rc-checkout__left .woocommerce-input-wrapper::after {
  display: none !important;
}

.rc-checkout__left .woocommerce-invalid .input-text {
  border-bottom-color: #c0392b;
}

/* ── Payment section (WooCommerce overrides) ── */
#payment .payment_methods {
  list-style: none;
  margin: 0 0 8px;
  padding: 0;
  display: flex;
  flex-direction: column;
  background: none;
  border: none;
}

#payment .wc_payment_method {
  border-bottom: 1px solid rgba(35, 31, 32, 0.08);
  background: none;
}

#payment .wc_payment_method:first-child {
  border-top: 1px solid rgba(35, 31, 32, 0.08);
}

#payment .wc_payment_method > label {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 0;
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  font-weight: 500;
  color: var(--black);
  cursor: pointer;
  background: none;
}

#payment .wc_payment_method input[type="radio"] {
  width: 18px;
  height: 18px;
  min-width: 18px;
  border-radius: 50%;
  border: 1.5px solid rgba(35, 31, 32, 0.35);
  -webkit-appearance: none;
  appearance: none;
  flex-shrink: 0;
  position: relative;
  cursor: pointer;
  transition: border-color 0.15s;
  background: var(--white);
  margin: 0;
}

#payment .wc_payment_method input[type="radio"]::after {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 50%;
  background: var(--black);
  opacity: 0;
  transition: opacity 0.15s;
}

#payment .wc_payment_method input[type="radio"]:checked {
  border-color: var(--black);
}

#payment .wc_payment_method input[type="radio"]:checked::after {
  opacity: 1;
}

#payment .payment_box {
  font-size: clamp(13px, calc(13px + 0vw), 13px);
  color: rgba(35, 31, 32, 0.65);
  padding: 0 0 12px 28px;
  margin: 0;
  background: none !important;
  border: none !important;
}

#payment .payment_box::before {
  display: none !important;
}

#payment .wc_payment_method > label img {
  height: 20px;
  width: auto;
}

#payment .form-row.place-order {
  margin: 24px 0 0;
  padding: 0;
  background: none;
}

#payment #place_order,
#payment .button.alt {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 60px;
  padding: 0 30px;
  background: var(--black);
  color: var(--white);
  border: none;
  border-radius: 15px;
  font-family: var(--font);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  text-align: center;
  cursor: pointer;
  transition: opacity 0.2s;
  letter-spacing: 0.02em;
}

#payment #place_order:hover {
  opacity: 0.8;
}

#payment .woocommerce-privacy-policy-text {
  font-size: clamp(12px, calc(12px + 0vw), 12px);
  color: rgba(35, 31, 32, 0.55);
  line-height: 1.5;
  margin-top: 16px;
  text-align: center;
}

#payment .woocommerce-privacy-policy-text a {
  color: var(--black);
  text-decoration: underline;
}

/* ── Right column: order items ── */
.rc-co-review-title {
  display: none; /* visible only on mobile via 991px block */
}

.rc-co-review {
  display: flex;
  flex-direction: column;
}

.rc-co-item {
  display: grid;
  grid-template-columns: 126px 1fr auto;
  gap: 16px;
  align-items: center;
  padding: 20px 0;
  border-bottom: 1px solid rgba(35, 31, 32, 0.1);
}

.rc-co-item:first-child {
  border-top: 1px solid rgba(35, 31, 32, 0.1);
}

.rc-co-item__img-wrap {
  display: block;
  width: 126px;
  height: 126px;
  border-radius: 20px;
  overflow: hidden;
}

.rc-co-item__img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rc-co-item__info {
  min-width: 0;
}

.rc-co-item__name {
  display: block;
  font-weight: 700;
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  color: var(--black);
  text-decoration: none;
  line-height: 1.2;
}

.rc-co-item__name:hover {
  text-decoration: underline;
}

.rc-co-item__desc {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--black);
  margin: 4px 0 0;
  line-height: 1.4;
}

.rc-co-item__qty-wrap {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 10px;
}

.rc-co-qty-btn {
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  color: var(--black);
  opacity: 0.4;
  line-height: 1;
}

.rc-co-qty {
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  font-weight: 400;
  color: var(--black);
  min-width: 20px;
  text-align: center;
}

.rc-co-item__right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}

.rc-co-item__remove {
  color: rgba(35, 31, 32, 0.4);
  display: flex;
  text-decoration: none;
  transition: color 0.15s;
}

.rc-co-item__remove:hover {
  color: var(--black);
}

.rc-co-item__price {
  font-weight: 700;
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  color: var(--black);
  white-space: nowrap;
}

.rc-co-item__price .woocommerce-Price-amount {
  font-weight: 700;
  font-size: clamp(28px, calc(28px + 0vw), 28px);
}

/* ── Order totals ── */
.rc-co-totals {
  margin-top: 24px;
  display: flex;
  flex-direction: column;
}

.rc-co-totals__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 0;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--black);
  border-bottom: 1px solid rgba(35, 31, 32, 0.08);
}

.rc-co-totals__row--total {
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  font-weight: 700;
  padding: 16px 0 0;
  border-bottom: none;
}

.rc-co-totals__row--discount .rc-co-totals__val {
  color: #c0392b;
}

.rc-co-totals__val .woocommerce-Price-amount {
  font-weight: 700;
}

.rc-co-totals__row--total .rc-co-totals__val .woocommerce-Price-amount {
  font-size: clamp(28px, calc(28px + 0vw), 28px);
}

/* ── Responsive ── */
@media (max-width: 1200px) {
  .rc-checkout__left,
  .rc-checkout__right {
    padding: 40px 48px 60px;
  }
}

@media (max-width: 991px) {
  /* Header: sticky on mobile */
  body.woocommerce-checkout .site-header {
    position: sticky;
    top: 0;
  }

  /* Layout: single column */
  .rc-checkout {
    display: flex;
    flex-direction: column;
    min-height: 0;
  }

  .rc-checkout__left {
    padding: 28px var(--gutter) 40px;
    border-right: none;
    gap: 24px;
  }

  .rc-checkout__logo {
    display: none;
  }

  .rc-checkout__right {
    padding: 28px var(--gutter) 40px;
    position: static;
    height: auto;
    overflow-y: visible;
    background: var(--cream);
  }

  /* Section headings → 18px */
  .rc-co-section__title {
    font-size: clamp(16px, calc(13.866523px + 0.215285vw), 18px);
    margin-bottom: 14px;
  }

  .rc-co-invoice__label {
    font-size: clamp(16px, calc(13.866523px + 0.215285vw), 18px);
    margin-bottom: 10px;
  }

  .rc-co-invoice__radios {
    gap: 20px;
    flex-wrap: wrap;
  }

  /* Form fields */
  form.rc-checkout .rc-checkout__left .form-row .input-text,
  form.rc-checkout .rc-checkout__left .form-row select,
  form.rc-checkout .rc-checkout__left .form-row textarea {
    font-size: clamp(13px, calc(9.799785px + 0.322928vw), 16px);
    padding: 8px 0 12px;
  }

  form.rc-checkout .rc-checkout__left .form-row .select2-selection {
    font-size: clamp(13px, calc(9.799785px + 0.322928vw), 16px);
    padding: 8px 0 12px;
  }

  .rc-checkout__left .form-row .input-text::placeholder,
  .rc-checkout__left .form-row textarea::placeholder {
    font-size: clamp(13px, calc(9.799785px + 0.322928vw), 16px);
  }

  .rc-checkout__left .form-row {
    margin-bottom: 18px;
  }

  /* Cart items: compact */
  .rc-co-item {
    grid-template-columns: 90px 1fr auto;
    gap: 12px;
    align-items: flex-start;
    padding: 16px 0;
  }

  .rc-co-item__img-wrap {
    width: 90px;
    height: 90px;
    border-radius: 14px;
  }

  .rc-co-item__name {
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
  }

  .rc-co-item__desc {
    font-size: clamp(12px, calc(12px + 0vw), 12px);
  }

  .rc-co-item__qty-wrap {
    gap: 8px;
    margin-top: 8px;
  }

  .rc-co-qty-btn {
    font-size: clamp(14px, calc(14px + 0vw), 14px);
  }

  .rc-co-qty {
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    min-width: 16px;
  }

  .rc-co-item__price,
  .rc-co-item__price .woocommerce-Price-amount {
    font-size: clamp(16px, calc(13.866523px + 0.215285vw), 18px);
  }

  /* Totals */
  .rc-co-totals {
    margin-top: 16px;
  }

  .rc-co-totals__row {
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    padding: 10px 0;
  }

  .rc-co-totals__row--total {
    font-size: clamp(16px, calc(13.866523px + 0.215285vw), 18px);
  }

  .rc-co-totals__row--total .rc-co-totals__val .woocommerce-Price-amount {
    font-size: clamp(18px, calc(11.599569px + 0.645856vw), 24px);
  }

  /* Shipping options */
  .rc-co-ship-opt {
    font-size: clamp(13px, calc(9.799785px + 0.322928vw), 16px);
    padding: 12px 0;
  }

  /* Payment */
  #payment .wc_payment_method > label {
    font-size: clamp(13px, calc(9.799785px + 0.322928vw), 16px);
    padding: 12px 0;
  }

  #payment .payment_box {
    font-size: clamp(12px, calc(12px + 0vw), 12px);
    padding: 0 0 10px 26px;
  }

  #payment .form-row.place-order {
    margin-top: 16px;
  }

  /* Place order button */
  #payment #place_order,
  #payment .button.alt {
    height: 50px;
    border-radius: 12px;
    font-size: clamp(13px, calc(11.933262px + 0.107643vw), 14px);
    padding: 0 20px;
  }

  #payment .woocommerce-privacy-policy-text {
    font-size: clamp(11px, calc(11px + 0vw), 11px);
    margin-top: 12px;
  }

  /* "Το καλάθι σου" heading — shown only on mobile */
  .rc-co-review-title {
    display: block;
    font-size: clamp(16px, calc(13.866523px + 0.215285vw), 18px);
    font-weight: 700;
    color: var(--black);
    margin: 0 0 16px;
  }
}

/* ── Checkout: notes field inside payment section ── */
.rc-co-notes {
  margin-bottom: 20px;
}

.rc-co-notes .form-row {
  margin-bottom: 0;
}

/* ── Checkout: ship-to-different-address toggle ── */
.rc-co-ship-toggle {
  margin: 0 0 16px;
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  font-weight: 400;
}

.woocommerce-shipping-fields .shipping_address {
  display: none;
}

#ship-to-different-address-checkbox:checked ~ * .shipping_address,
.woocommerce-shipping-fields.open .shipping_address {
  display: block;
}

/* ── Checkout: hide WC notices wrapper & coupon toggle ── */
.woocommerce-checkout .woocommerce-notices-wrapper,
.woocommerce-checkout .woocommerce-form-coupon-toggle,
.woocommerce-checkout .woocommerce-info.woocommerce-coupon-toggle {
  display: none;
}

/* WooCommerce: info notices */
.woocommerce-info,
.wc-block-components-notice-banner.is-info {
  background: var(--cream);
  color: var(--black);
  border-color: var(--black);
  border-top-color: var(--black);
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  margin-top: -3px;
  padding-left: 25px;
  margin-bottom: 0px;
}

.woocommerce-info::before,
.wc-block-components-notice-banner.is-info::before,
.wc-block-components-notice-banner.is-info > svg,
.wc-block-components-notice-banner.is-info > svg *,
.wc-block-components-notice-banner.is-info
  .wc-block-components-notice-banner__content::before {
  color: var(--black);
  fill: var(--black);
  stroke: var(--black);
}

/* ── Checkout: validation error messages ── */
.rc-checkout__left .woocommerce-error,
.rc-checkout__left .woocommerce-message {
  font-size: clamp(13px, calc(13px + 0vw), 13px);
  padding: 10px 12px;
  border-radius: 6px;
  margin-bottom: 16px;
}

/* ── Checkout: WooCommerce notices as a fixed top-left popup ──
   WC's AJAX checkout prepends its validation errors as a
   .woocommerce-NoticeGroup-checkout directly inside <form.checkout>,
   which is a 2-column grid — so the notice became a grid cell and
   broke the layout. position:fixed pulls it out of the grid flow so
   it floats as a toast at the top-left instead. */
.woocommerce-checkout .woocommerce-NoticeGroup-checkout,
.woocommerce-checkout .rc-checkout > .woocommerce-error,
.woocommerce-checkout .rc-checkout > .woocommerce-message,
.woocommerce-checkout .rc-checkout > .woocommerce-info {
  position: fixed;
  top: 100px;
  left: 24px;
  z-index: 2000;
  width: min(360px, calc(100vw - 48px));
  max-height: calc(100vh - 140px);
  overflow-y: auto;
  margin: 0;
  padding: 18px 20px;
  list-style: none;
  background: var(--white);
  border: 0;
  border-left: 4px solid var(--red);
  border-radius: 12px;
  box-shadow: 0 18px 44px rgba(35, 31, 32, 0.22);
  color: var(--black);
  font-size: clamp(13px, calc(13px + 0vw), 14px);
  font-weight: 500;
  line-height: 1.45;
  animation: rc-co-notice-in 0.3s ease;
}

.woocommerce-checkout .rc-checkout > .woocommerce-message {
  border-left-color: #4f8a3d;
}

.woocommerce-checkout .rc-checkout > .woocommerce-info {
  border-left-color: var(--gold);
}

/* Inner notice inside the group: transparent so we don't get a double card */
.woocommerce-checkout .woocommerce-NoticeGroup-checkout .woocommerce-error,
.woocommerce-checkout .woocommerce-NoticeGroup-checkout .woocommerce-message,
.woocommerce-checkout .woocommerce-NoticeGroup-checkout .woocommerce-info {
  width: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  list-style: none;
}

/* Drop the WooCommerce icon-font ::before inside the checkout toasts */
.woocommerce-checkout
  .woocommerce-NoticeGroup-checkout
  .woocommerce-error::before,
.woocommerce-checkout
  .woocommerce-NoticeGroup-checkout
  .woocommerce-message::before,
.woocommerce-checkout
  .woocommerce-NoticeGroup-checkout
  .woocommerce-info::before,
.woocommerce-checkout .rc-checkout > .woocommerce-error::before,
.woocommerce-checkout .rc-checkout > .woocommerce-message::before,
.woocommerce-checkout .rc-checkout > .woocommerce-info::before {
  content: none;
}

/* Notice text rows */
.woocommerce-checkout .woocommerce-NoticeGroup-checkout li,
.woocommerce-checkout .rc-checkout > .woocommerce-error li,
.woocommerce-checkout .rc-checkout > .woocommerce-message li,
.woocommerce-checkout .rc-checkout > .woocommerce-info li {
  margin: 0;
  padding: 0;
  list-style: none;
  color: var(--black);
}

.woocommerce-checkout .woocommerce-NoticeGroup-checkout li + li,
.woocommerce-checkout .rc-checkout > .woocommerce-error li + li {
  margin-top: 8px;
}

@keyframes rc-co-notice-in {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 991px) {
  .woocommerce-checkout .woocommerce-NoticeGroup-checkout,
  .woocommerce-checkout .rc-checkout > .woocommerce-error,
  .woocommerce-checkout .rc-checkout > .woocommerce-message,
  .woocommerce-checkout .rc-checkout > .woocommerce-info {
    top: 90px;
    left: 16px;
    width: calc(100vw - 32px);
    padding: 14px 16px;
  }
}

/* =====================================================
   COURSE TEMPLATE
   ===================================================== */
.course-page-template .site-header {
  position: absolute;
  inset: 0 0 auto;
  z-index: 1000;
  background: transparent;
}

.course-page-template .header-nav {
  background: transparent;
}

.course-page-template .header-nav__menu li a,
.course-page-template .header-nav .icon-btn {
  color: var(--white);
}

.course-page-template .header-nav__menu .sub-menu a {
  color: var(--black);
}

.course-page-template .header-nav__eshop-item > a {
  color: var(--gold);
  border-color: var(--gold);
}

.course-page-template .header-nav__eshop-item > a:hover {
  color: var(--white);
}

.course-page-template .header-nav__logo-img {
  content: url("assets/images/logo-rossetti-footer.svg");
}

.course-page {
  overflow: hidden;
  background: var(--cream);
  color: var(--black);
}

.course-hero {
  min-height: 340px;
  padding: 75px 32px 78px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--black);
  text-align: center;
}

.course-hero__copy h1 {
  margin: 0;
  color: var(--white);
  font-size: clamp(60px, calc(60px + 0vw), 60px);
  line-height: 0.98;
  font-weight: 900;
  letter-spacing: 0;
}

.course-hero__copy p {
  margin: 10px 0 0;
  color: var(--white);
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  line-height: 1.15;
  font-weight: 400;
  letter-spacing: 0;
}

.course-hero-image {
  height: 540px;
  overflow: hidden;
  background: var(--black);
  position: relative;
  z-index: 2;
}

.course-hero-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 52%;
}

.course-overview {
  position: relative;
  min-height: 1100px;
  padding: 128px 65px 92px;
  background: var(--cream);
}

.course-overview__inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 820px) 521px;
  gap: 92px;
  align-items: start;
}

.course-overview__splash {
  position: absolute;
  z-index: 1;
  right: -453px;
  top: -826px;
  width: 1920px;
  opacity: 0.92;
  pointer-events: none;
  max-width: 1920px;
}

.course-copy {
  max-width: 820px;
}

.course-copy h2 {
  max-width: 780px;
  margin: 0 0 44px;
  font-size: clamp(42px, calc(42px + 0vw), 42px);
  line-height: 0.98;
  font-weight: 900;
  letter-spacing: 0;
}

.course-copy p,
.course-copy li {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.13;
  font-weight: 400;
  letter-spacing: 0;
}

.course-copy p {
  margin: 0 0 18px;
}

.course-copy ul {
  margin: 0 0 22px 20px;
  padding: 0;
  list-style: disc;
}

.course-copy li + li {
  margin-top: 2px;
}

.course-details {
  width: 521px;
  min-height: 846px;
  padding: 78px 84px 80px;
  border-radius: 30px;
  background: var(--black);
  color: var(--white);
}

.course-details dl {
  margin: 0;
}

.course-details__item + .course-details__item {
  margin-top: 52px;
}

.course-details dt {
  display: inline-block;
  margin: 0 0 15px;
  padding-bottom: 4px;
  border-bottom: 3px solid var(--gold);
  color: var(--gold);
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  line-height: 1;
  font-weight: 900;
  letter-spacing: 0;
}

.course-details dd {
  margin: 0;
  color: var(--white);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.14;
  font-weight: 400;
  letter-spacing: 0;
}

.course-details__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 209px;
  height: 66px;
  margin-top: 88px;
  padding: 0 30px;
  border-radius: 12px;
  background: #a69365;
  color: var(--white);
  font-size: clamp(15px, calc(15px + 0vw), 15px);
  line-height: 1;
  font-weight: 900;
  letter-spacing: 0;
}

.course-details__button:hover {
  background: var(--gold);
  color: var(--white);
}

.course-gallery-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  height: 614px;
  background: var(--cream);
  position: relative;
  z-index: 2;
}

.course-gallery-strip__item {
  margin: 0;
  overflow: hidden;
}

.course-gallery-strip__item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.course-gallery-strip__item--foam img {
  object-position: center center;
}

.course-gallery-strip__item--latte img {
  object-position: center center;
}

.course-contact {
  position: relative;
  padding: 122px 0px;
  background: var(--cream);
  width: 90%;
  margin: auto;
}

.course-contact__splash {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: -292px;
  width: 560px;
  max-width: 38vw;
  transform: translateX(-50%);
  mix-blend-mode: screen;
  opacity: 0.9;
  pointer-events: none;
  display: none;
}

.course-contact__card {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(320px, 610px) minmax(520px, 860px);
  gap: 90px;
  width: min(1791px, 100%);
  min-height: 490px;
  margin: 0 auto;
  padding: 58px 70px 64px;
  border: 0;
  border-radius: 30px;
  background: #a69365;
}

.course-contact__intro h2 {
  margin: 0 0 38px;
  font-size: clamp(60px, calc(60px + 0vw), 60px);
  line-height: 0.98;
  font-weight: 900;
  letter-spacing: 0;
}

.course-contact__intro p {
  max-width: 540px;
  margin: 0;
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  line-height: 1.12;
  font-weight: 400;
  letter-spacing: 0;
}

.course-contact__fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 60px;
  width: 100%;
  padding-top: 8px;
  align-items: end;
}

.course-contact__attendees {
  display: flex;
  flex-direction: column;
}

.course-contact__select-field,
.course-field,
.course-total {
  border-bottom: 1px solid rgba(35, 31, 32, 0.55);
}

.course-contact__select-field {
  position: relative;
  width: 398px;
  max-width: 100%;
  margin: 0 0 43px;
}

.course-contact__select-field select {
  width: 100%;
  height: 42px;
  padding: 0 30px 0 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--black);
  font-family: var(--font);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  letter-spacing: 0;
  appearance: none;
  cursor: pointer;
}

.course-contact__select-field span {
  position: absolute;
  right: 0;
  top: 50%;
  width: 13px;
  height: 8px;
  transform: translateY(-50%);
  color: var(--black);
  pointer-events: none;
}

.course-contact__select-field svg {
  display: block;
  width: 100%;
  height: 100%;
}

.course-attendee {
  min-width: 0;
  margin: 0 0 0px;
  padding: 0;
  border: 0;
}

.course-attendee:first-of-type {
  min-width: 0;
  margin: 0 0 40px;
  padding: 0;
  border: 0;
}

.is-single-attendee .course-attendee:first-of-type {
  margin: 0 0 0px;
}

.course-attendee[hidden] {
  display: none !important;
}

.course-attendee legend {
  margin: 0 0 50px;
  padding: 0;
  color: var(--black);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0;
}

.course-field {
  width: 398px;
  max-width: 100%;
}

.course-field + .course-field {
  margin-top: 46px;
}

.course-field input {
  width: 100%;
  height: 38px;
  padding: 0 0 11px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--black);
  font-family: var(--font);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  letter-spacing: 0;
}

.course-field input::placeholder {
  color: var(--black);
  opacity: 1;
}

.course-contact__footer {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 62px;
  align-self: stretch;
  margin-top: 0;
}

.course-total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 36px;
  padding-bottom: 12px;
  color: var(--black);
}

.course-total span {
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1;
  font-weight: 400;
}

.course-total strong {
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  line-height: 1;
  font-weight: 500;
}

.course-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 3px;
}

.course-terms {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  gap: 12px;
  cursor: pointer;
}

.course-terms input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.course-terms__icon {
  position: relative;
  width: 21px;
  height: 21px;
  flex: 0 0 21px;
  border: 1px solid var(--black);
  border-radius: 50%;
}

.course-terms input:checked + .course-terms__icon::after {
  content: "";
  position: absolute;
  inset: 5px;
  border-radius: 50%;
  background: var(--black);
}

.course-terms span:last-child {
  color: var(--black);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.1;
  font-weight: 400;
  letter-spacing: 0;
}

.course-send {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--white);
  font-family: var(--font);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0;
  cursor: pointer;
}

.course-send img {
  display: block;
  width: 16px;
  height: 9px;
  flex: 0 0 16px;
}

@media (max-width: 1320px) {
  .course-overview__inner {
    grid-template-columns: minmax(0, 1fr) 460px;
    gap: 58px;
  }

  .course-details {
    width: 460px;
    padding-inline: 60px;
  }

  .course-contact__card {
    grid-template-columns: minmax(240px, 380px) minmax(560px, 1fr);
    gap: 58px;
    padding-inline: 48px;
  }
}

@media (max-width: 1100px) {
  .course-overview {
    min-height: 0;
    padding: 86px 32px;
  }

  .course-overview__inner {
    grid-template-columns: 1fr;
  }

  .course-details {
    width: 100%;
    min-height: 0;
  }

  .course-contact {
    padding: 76px 32px;
  }

  .course-contact__card {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .course-contact__fields {
    grid-template-columns: 1fr;
  }

  .course-contact__footer {
    gap: 28px;
    justify-content: flex-start;
  }
}

/* =====================================================
   BREW GUIDES TEMPLATE
   ===================================================== */
.brew-guides-template .site-header {
  background: var(--black);
}

.brew-guides-template .header-nav {
  background: var(--black);
}

.brew-guides-template .header-nav__menu li a,
.brew-guides-template .header-nav .icon-btn {
  color: var(--white);
}

.brew-guides-template .header-nav__menu .sub-menu {
  background: var(--black);
}

.brew-guides-template .header-nav__menu .sub-menu a {
  color: var(--white);
}

.brew-guides-template .header-nav__eshop-item > a {
  color: var(--gold);
}

.brew-guides-template .header-nav__eshop-item > a:hover {
  color: var(--white);
}

.brew-guides-template .header-nav__logo-img {
  filter: brightness(0) invert(1);
}

.brew-guides-page {
  background: var(--cream);
  color: var(--black);
  overflow: hidden;
}

.brew-hero {
  height: 356px;
  background: var(--black);
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.brew-hero__copy {
  width: min(760px, calc(100% - 40px));
  margin-top: -8px;
}

.brew-hero h1,
.brew-steps__header h2,
.brew-needs__title h2,
.brew-gear h2 {
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: 0;
}

.brew-hero h1 {
  font-size: clamp(60px, calc(60px + 0vw), 60px);
  margin: 0 0 16px;
}

.brew-hero p {
  max-width: 667px;
  margin: 0 auto;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1.22;
}

.brew-photo-strip,
.brew-video {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.brew-photo-strip {
  height: 540px;
}

.brew-photo-strip img,
.brew-video__media {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.brew-needs {
  position: relative;
  min-height: 520px;
  background: var(--cream);
}

.brew-needs__inner {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  align-items: center;
  gap: 40px;
  min-height: 520px;
}

.brew-needs__title span {
  display: block;
  color: transparent;
  -webkit-text-stroke: 1.4px var(--black);
  text-stroke: 1.4px var(--black);
  font-size: clamp(60px, calc(60px + 0vw), 60px);
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0;
  margin-bottom: 8px;
}

.brew-needs__title h2 {
  font-size: clamp(60px, calc(60px + 0vw), 60px);
  margin: 0;
}

.brew-needs__list {
  list-style: disc;
  justify-self: center;
  width: 264px;
  padding-left: 26px;
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 700;
  line-height: 1.08;
}

.brew-needs__list li + li {
  margin-top: 4px;
}

.brew-needs__beans {
  position: absolute;
  right: 0;
  top: 0;
  width: 500px;
  height: 500px;
  object-fit: cover;
  pointer-events: none;
}

.brew-video {
  height: 688px;
  background: var(--black);
}

.brew-video__play {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 2;
  width: 116px;
  height: 116px;
  transform: translate(-50%, -50%);
  border-radius: 10px;
  background: rgba(243, 240, 234, 0.72);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition:
    opacity 0.25s ease,
    background 0.2s ease;
}

.brew-video__play:hover {
  background: rgba(243, 240, 234, 0.86);
}

.brew-video__play.hidden {
  opacity: 0;
  pointer-events: none;
}

.brew-video__play.is-unavailable {
  cursor: default;
  opacity: 0.72;
}

.brew-video__play span {
  width: 0;
  height: 0;
  margin-left: 8px;
  border-top: 25px solid transparent;
  border-bottom: 25px solid transparent;
  border-left: 35px solid var(--gold);
}

.brew-steps {
  position: relative;
  background: var(--cream);
  padding-bottom: 130px;
}

.brew-steps__dark {
  height: 561px;
  background: var(--black);
  color: var(--cream-light);
}

.brew-steps__header {
  position: relative;
  width: min(100%, 1920px);
  height: 100%;
  margin-inline: auto;
  padding: 120px 132px 0;
}

.brew-steps__header h2 {
  font-size: clamp(60px, calc(60px + 0vw), 60px);
  margin: 0;
}

.brew-steps__counter {
  position: absolute;
  right: 132px;
  top: 154px;
  width: 214px;
  color: var(--white);
  text-align: right;
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  line-height: 1;
}

.brew-steps__progress-track {
  display: block;
  position: relative;
  height: 1px;
  margin-top: 15px;
  background: rgba(255, 255, 255, 0.55);
}

.brew-steps__progress-thumb {
  position: absolute;
  left: 0;
  top: -2px;
  width: 51px;
  height: 4px;
  background: var(--cream-light);
  transition:
    transform 0.35s ease,
    width 0.35s ease;
}

.brew-steps__slider {
  position: relative;
  width: min(100%, 1920px);
  margin: -260px auto 0;
  padding-inline: 132px;
}

.brew-steps__cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
}

.brew-steps__cards.slick-initialized {
  display: block;
  overflow: hidden;
}

.brew-steps__cards.slick-initialized .slick-list {
  overflow: hidden;
  margin-inline: -12px;
}

.brew-steps__cards.slick-initialized .slick-track {
  display: flex;
  align-items: stretch;
}

.brew-steps__cards.slick-initialized .slick-slide {
  height: auto;
  padding-inline: 0px;
  margin: 0 12px;
}

.brew-steps__cards.slick-initialized .slick-slide > div {
  height: 100%;
}

.brew-step-slide {
  width: 100%;
  height: 100%;
}

.brew-step-card {
  position: relative;
  height: 513px;
  border-radius: 20px;
  overflow: hidden;
  background: var(--black);
  margin: 0;
  transition: background 0.35s ease;
}

.brew-step-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: opacity 0.35s ease;
}

.brew-step-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(35, 31, 32, 0.34) 0%,
    rgba(35, 31, 32, 0) 58%
  );
  pointer-events: none;
  z-index: 1;
  transition: opacity 0.35s ease;
}

.brew-step-card__number {
  position: absolute;
  left: 33px;
  top: 40px;
  z-index: 2;
  color: var(--white);
  font-size: clamp(60px, calc(60px + 0vw), 60px);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: 0;
}

.brew-step-card__desc {
  position: absolute;
  left: 33px;
  right: 33px;
  top: 130px;
  z-index: 2;
  margin: 0;
  color: var(--white);
  font-family: "PF Bague Sans Pro", sans-serif;
  font-size: 16px;
  line-height: 1.45;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

/* Desktop hover: photo fades out, olive panel + description fade in */
@media (min-width: 992px) {
  .brew-step-card:hover {
    background: var(--gold);
  }

  .brew-step-card:hover img,
  .brew-step-card:hover::after {
    opacity: 0;
  }

  .brew-step-card:hover .brew-step-card__desc {
    opacity: 1;
  }
}

.brew-steps__arrow {
  position: absolute;
  top: 193px;
  z-index: 5;
  width: 44px;
  height: 127px;

  background: var(--gold);
  color: var(--white);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.brew-steps__arrow--prev {
  left: 88px;
  border-radius: 10px 0px 0px 10px;
}

.brew-steps__arrow--next {
  right: 88px;
  border-radius: 0 10px 10px 0;
}

.brew-copy {
  background: var(--cream);
  padding: 0 0 130px;
}

.brew-copy__inner {
  max-width: 758px;
  margin-inline: auto;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1.22;
}

.brew-copy__inner p + p {
  margin-top: 44px;
}

.brew-gear {
  background: var(--cream);
  padding: 0 132px 130px;
}

.brew-gear h2 {
  margin: 0 0 75px;
  text-align: center;
  font-size: clamp(60px, calc(60px + 0vw), 60px);
}

.brew-gear__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
  width: min(100%, 1656px);
  margin-inline: auto;
}

.brew-gear__grid.rs-shop-grid {
  grid-template-columns: repeat(4, minmax(0, 395px));
  justify-content: center;
  gap: 24px;
}

.brew-gear__grid .rs-shop-card {
  justify-self: center;
}

/* Desktop: .product-slide is transparent to the grid so cards stay grid items.
   On mobile it becomes the Slick slide (see @media max-width: 991px). */
.brew-gear .product-slide {
  display: contents;
}

/* Slider counter — mobile only (see @media max-width: 991px) */
.brew-gear__counter {
  display: none;
}

.brew-product-card {
  position: relative;
  min-height: 626px;
  padding: 25px 37px 23px;
  border-radius: 10px;
  background: var(--white);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.brew-product-card--notched {
  clip-path: url("#product-card-notch-single");
}

.brew-product-card--stacked {
  clip-path: url("#product-card-notch-stack");
}

.brew-product-card__heart {
  position: absolute;
  left: 37px;
  top: 25px;
  z-index: 3;
  width: 26px;
  height: 22px;
  color: var(--black);
}

.brew-product-card__badges {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.brew-product-card__badges span {
  width: 60px;
  height: 60px;
  border-radius: 10px;
  background: var(--white);
  color: var(--black);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
}

.brew-product-card__badges .brew-product-card__decaf {
  background: var(--gold);
  color: var(--white);
}

.brew-product-card__image {
  height: 314px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 28px;
  padding-top: 24px;
}

.brew-product-card__image img {
  width: auto;
  max-width: 210px;
  max-height: 314px;
  object-fit: contain;
}

.brew-product-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
}

.brew-product-card h3 {
  margin: 0 0 23px;
  font-size: clamp(24px, calc(24px + 0vw), 24px);
  font-weight: 700;
  line-height: 1.05;
}

.brew-product-card__body p {
  margin: 0 0 39px;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  line-height: 1.16;
}

.brew-product-card__price {
  display: flex;
  flex-direction: column;
  gap: 13px;
  margin-top: auto;
  margin-bottom: 32px;
}

.brew-product-card__price span {
  color: var(--gray);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1;
  text-decoration: line-through;
}

.brew-product-card__price strong {
  color: var(--black);
  font-size: clamp(28px, calc(28px + 0vw), 28px);
  line-height: 1;
  font-weight: 700;
}

.brew-product-card__offer {
  display: flex;
  align-items: center;
  gap: 9px;
  color: var(--gray);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1;
}

.brew-product-card__offer b {
  min-width: 69px;
  height: 30px;
  border-radius: 10px;
  background: var(--gold);
  color: var(--white);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
}

@media (max-width: 1550px) {
  .brew-needs__inner,
  .brew-steps__header,
  .brew-steps__slider,
  .brew-gear {
    padding-inline: 7vw;
  }

  .brew-steps__counter {
    right: 7vw;
  }

  .brew-steps__arrow--prev {
    left: 4.5vw;
  }

  .brew-steps__arrow--next {
    right: 4.5vw;
  }

  .brew-product-card {
    padding-inline: 28px;
  }
}

@media (max-width: 1550px) {
  .brew-gear__grid.rs-shop-grid {
    grid-template-columns: repeat(3, minmax(0, 395px));
  }
}

@media (max-width: 1180px) {
  .brew-needs__inner {
    grid-template-columns: 1fr 1fr;
    min-height: auto;
    padding-block: 72px;
  }

  .brew-needs__beans {
    width: 360px;
    height: 360px;
    opacity: 0.75;
  }

  .brew-steps__cards,
  .brew-gear__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .brew-gear__grid.rs-shop-grid {
    grid-template-columns: repeat(2, minmax(0, 395px));
  }

  .brew-steps {
    padding-bottom: 120px;
  }

  .brew-steps__slider {
    margin-top: -300px;
  }
}

@media (max-width: 991px) {
  /* ── Hero ── */
  .brew-hero {
    min-height: 340px;
    align-items: flex-start;
    padding: 0 24px;
  }

  .brew-hero__copy {
    width: min(280px, 100%);
    margin-top: 116px;
  }

  .brew-hero h1 {
    font-size: 32px;
    margin-bottom: 12px;
  }

  .brew-hero p {
    font-size: 16px;
    max-width: 280px;
  }

  /* ── Photo strip ── */
  .brew-photo-strip {
    height: 638px;
  }

  /* ── What You Need ── */
  .brew-needs__inner {
    grid-template-columns: 1fr;
    width: 100%;
    min-height: 719px;
    padding: 39px var(--gutter) 0;
    gap: 0;
    align-content: start;
    box-sizing: border-box;
  }

  .brew-needs__title span {
    font-size: 42px;
  }

  .brew-needs__title h2 {
    font-size: 42px;
  }

  .brew-needs__list {
    width: min(280px, 100%);
    margin: 49px 0 0;
    font-size: 16px;
    font-weight: 700;
    justify-self: start;
  }

  .brew-needs__beans {
    display: block;
    right: -99px;
    top: 216px;
    width: 616px;
    height: 584px;
    object-fit: none;
    opacity: 1;
  }

  /* ── Video ── */
  .brew-video {
    height: 552px;
  }

  /* ── Steps ── */
  .brew-steps {
    display: flex;
    flex-direction: column;
    background: var(--black);
    padding-bottom: 40px;
  }

  /* Cards on top */
  .brew-steps__slider {
    order: 1;
    margin-top: 0;
    padding: 40px 0 0 var(--gutter);
  }

  /* Title + progress bar below the cards */
  .brew-steps__dark {
    order: 2;
    height: auto;
    min-height: 0;
    background: transparent;
  }

  .brew-steps__header {
    height: auto;
    padding: 32px var(--gutter) 0;
  }

  .brew-steps__header h2 {
    display: none;
  }

  .brew-steps__counter {
    position: static;
    width: 100%;
    margin-top: 28px;
    text-align: right;
    font-size: 14px;
  }

  .brew-steps__cards,
  .brew-steps__cards.slick-initialized,
  .brew-steps__cards.slick-initialized .slick-list {
    overflow: visible;
  }

  .brew-steps__cards.slick-initialized .slick-slide {
    width: 79.47vw !important;
    padding-right: 16px;
    box-sizing: border-box;
  }

  /* Arrows not needed on mobile */
  .brew-steps__arrow {
    display: none;
  }

  .brew-step-card {
    height: 422px;
    border-radius: 10px;
    background: var(--gold);
  }

  .brew-steps__cards.slick-initialized .brew-step-card.slick-slide {
    height: 422px;
  }

  /* Mobile: olive panel (number + text) on top, photo fills the bottom half */
  .brew-step-card::after {
    display: none;
  }

  .brew-step-card img {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 50%;
  }

  .brew-step-card__number {
    font-size: 42px;
    left: 24px;
    top: 24px;
  }

  .brew-step-card__desc {
    top: 88px;
    left: 24px;
    right: 24px;
    font-size: 16px;
    opacity: 1;
  }

  /* ── Copy ── */
  .brew-copy {
    padding: 0 var(--gutter) 100px;
    padding-top: 100px;
  }

  .brew-copy__inner {
    font-size: 12px;
    line-height: 1.4;
  }

  .brew-copy__inner p + p {
    margin-top: 24px;
  }

  /* ── Gear ── */
  .brew-gear {
    padding: 0 24px 70px;
  }

  .brew-gear h2 {
    font-size: 32px;
    margin-bottom: 56px;
  }

  .brew-gear__grid.rs-shop-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }

  /* Brew gear → identical to the homepage products-carousel-shell slider */
  .brew-gear__grid.slick-initialized,
  .brew-gear__grid.slick-initialized .slick-list {
    overflow: visible;
  }

  .brew-gear__grid.slick-initialized {
    display: block;
  }

  .brew-gear__grid.slick-initialized .slick-track {
    display: flex;
    align-items: stretch;
  }

  .brew-gear__grid.slick-initialized .slick-slide {
    display: flex !important;
    height: auto !important;
  }

  .brew-gear .product-slide {
    width: 79.47vw !important;
    max-width: 300px;
    padding: 0 20px 0 0;
    box-sizing: border-box;
    display: flex !important;
    align-items: stretch;
    position: relative;
    overflow: visible;
  }

  .brew-gear .product-slide .rs-shop-card {
    width: 300px;
    max-width: 300px;
  }

  /* Counter + progress bar below the gear slider (only when slider is active) */
  .brew-gear__grid.slick-initialized ~ .brew-gear__counter {
    display: block;
    width: 100%;
    margin-top: 32px;
    text-align: right;
    font-size: 16px;
    line-height: 1;
  }

  .brew-gear__counter-num {
    color: var(--gold);
    font-weight: 400;
  }

  .brew-gear__progress-track {
    display: block;
    position: relative;
    height: 1px;
    margin-top: 15px;
    background: rgba(35, 31, 32, 0.25);
  }

  .brew-gear__progress-thumb {
    position: absolute;
    left: 0;
    top: -2px;
    width: 51px;
    height: 4px;
    background: var(--black);
    transition:
      transform 0.35s ease,
      width 0.35s ease;
  }
}

/* =====================================================
   Mini Cart — Side Panel
   ===================================================== */

.mini-cart {
  position: fixed;
  inset: 0;
  z-index: 1200;
  pointer-events: none;
}

.mini-cart.is-open {
  pointer-events: all;
}

/* Overlay */
.mini-cart__overlay {
  position: absolute;
  inset: 0;
  background: rgba(35, 31, 32, 0.45);
  opacity: 0;
  transition: opacity 0.35s ease;
}

.mini-cart.is-open .mini-cart__overlay {
  opacity: 1;
}

/* Drawer */
.mini-cart__drawer {
  position: absolute;
  top: 0;
  right: 0;
  width: 420px;
  max-width: 100vw;
  height: 100%;
  background: var(--white);
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: -4px 0 28px rgba(35, 31, 32, 0.1);
}

.mini-cart.is-open .mini-cart__drawer {
  transform: translateX(0);
}

/* Close button */
.mini-cart__close {
  position: absolute;
  top: 22px;
  right: 24px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  color: var(--black);
  line-height: 1;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.mini-cart__close:hover {
  color: var(--gold);
}

/* Scrollable body */
.mini-cart__body {
  flex: 1;
  overflow-y: auto;
  padding: 56px 24px 0;
  overscroll-behavior: contain;
  display: flex;
  flex-direction: column;
}

/* Items list */
.mini-cart__items {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding-bottom: 0;
}

.mini-cart__empty {
  font-family: var(--font);
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  color: var(--gray);
  text-align: center;
  padding: 32px 0;
  margin: 0;
}

/* Single cart item */
.mini-cart__item {
  display: flex;
  gap: 14px;
}

.mini-cart__item-thumb {
  width: 88px;
  flex-shrink: 0;
  background: var(--cream);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
}

.mini-cart__item-thumb img {
  width: 100%;
  height: 108px;
  object-fit: contain;
  display: block;
}

.mini-cart__item-body {
  flex: 1;
  min-width: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.mini-cart__item-del {
  position: absolute;
  top: 0;
  right: 0;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  color: var(--gray);
  line-height: 1;
  display: flex;
}

.mini-cart__item-del:hover {
  color: var(--black);
}

.mini-cart__item-name {
  font-family: var(--font);
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  font-weight: 700;
  color: var(--black);
  padding-right: 22px;
  line-height: 1.35;
}

.mini-cart__item-desc {
  font-family: var(--font);
  font-size: clamp(12px, calc(12px + 0vw), 12px);
  color: var(--gray);
  line-height: 1.45;
}

.mini-cart__item-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: auto;
  padding-top: 10px;
}

/* Qty control */
.mini-cart__item-qty {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--cream-mid);
  padding: 5px 10px;
}

.mini-cart__qty-btn {
  background: none;
  border: none;
  cursor: pointer;
  font-family: var(--font);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  color: var(--black);
  line-height: 1;
  padding: 0;
  width: 16px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.mini-cart__qty-btn:disabled {
  color: var(--gray);
  cursor: default;
}

.mini-cart__qty-val {
  font-family: var(--font);
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  color: var(--black);
  min-width: 18px;
  text-align: center;
}

/* Item price */
.mini-cart__item-price {
  font-family: var(--font);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  color: var(--black);
}

.mini-cart__item-price .woocommerce-Price-amount {
  font-weight: 700;
}

/* Divider */
.mini-cart__sep {
  height: 1px;
  background: var(--cream-mid);
  margin: 22px 0;
  flex-shrink: 0;
}

/* Recommended section */
.mini-cart__rec-section {
  flex-shrink: 0;
  padding-bottom: 8px;
}

.mini-cart__rec-title {
  font-family: var(--font);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  color: var(--black);
  margin: 0 0 18px;
  letter-spacing: 0;
  text-transform: none;
}

/* Recommended slider slides */
.mini-cart__rec-slide {
  display: flex !important;
  gap: 14px;
  outline: none;
}

.mini-cart__rec-thumb {
  width: 88px;
  flex-shrink: 0;
  background: var(--cream);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
}

.mini-cart__rec-thumb img {
  width: 100%;
  height: 108px;
  object-fit: contain;
  display: block;
}

.mini-cart__rec-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.mini-cart__rec-name {
  font-family: var(--font);
  font-size: clamp(14px, calc(14px + 0vw), 14px);
  font-weight: 700;
  color: var(--black);
  line-height: 1.35;
}

.mini-cart__rec-desc {
  font-family: var(--font);
  font-size: clamp(12px, calc(12px + 0vw), 12px);
  color: var(--gray);
  line-height: 1.45;
}

.mini-cart__rec-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: auto;
  padding-top: 10px;
}

.mini-cart__rec-price {
  font-family: var(--font);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 700;
  color: var(--black);
}

.mini-cart__rec-price .woocommerce-Price-amount {
  font-weight: 700;
}

/* Add-to-cart gold button */
.mini-cart__rec-add {
  width: 40px;
  height: 40px;
  background: var(--gold);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
  flex-shrink: 0;
  transition: background 0.2s ease;
}

.mini-cart__rec-add:hover {
  background: var(--black);
}

/* Slide counter */
.mini-cart__rec-counter {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 0 20px;
}

.mini-cart__rec-num {
  font-family: var(--font);
  font-size: clamp(12px, calc(12px + 0vw), 12px);
  font-weight: 700;
  color: var(--black);
  flex-shrink: 0;
  letter-spacing: 0.05em;
}

.mini-cart__rec-progress {
  flex: 1;
  height: 1px;
  background: var(--cream-mid);
  position: relative;
  overflow: hidden;
}

.mini-cart__rec-progress-thumb {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: var(--black);
  transition: width 0.35s ease;
}

/* Totals section (dark cream background — matches Figma #e1d7bb) */
.mini-cart__totals {
  background: var(--cream-light);
  flex-shrink: 0;
  padding: 20px 24px 0;
}

.mini-cart__totals-rows {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.mini-cart__totals-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  font-weight: 400;
  color: var(--black);
  line-height: 1;
}

.mini-cart__totals-row--total {
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 700;
  padding: 10px 0;
}

.mini-cart__totals-val {
  font-weight: inherit;
}

.mini-cart__totals-sep {
  border: none;
  border-top: 1px solid rgba(35, 31, 32, 0.15);
  margin: 6px 0;
}

/* CTA button */
.mini-cart__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 56px;
  background: var(--black);
  color: var(--white);
  font-family: var(--font);
  font-size: clamp(13px, calc(13px + 0vw), 13px);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-decoration: none;
  text-transform: uppercase;
  flex-shrink: 0;
  margin: 16px 0 0;
  transition: background 0.2s ease;
}

.mini-cart__cta:hover {
  background: var(--gold);
  color: var(--white);
}

/* Loading spinner */
.mini-cart__loader {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 80px;
}

.mini-cart__loader::after {
  content: "";
  width: 24px;
  height: 24px;
  border: 2px solid var(--cream-mid);
  border-top-color: var(--gold);
  border-radius: 50%;
  animation: mc-spin 0.7s linear infinite;
}

@keyframes mc-spin {
  to {
    transform: rotate(360deg);
  }
}

/* Lock scroll when open */
body.mini-cart-open {
  overflow: hidden;
}

/* Header (title + close) */
.mini-cart__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 22px 24px 18px;
  flex-shrink: 0;
}

.mini-cart__title {
  font-family: var(--font);
  font-size: clamp(18px, calc(18px + 0vw), 18px);
  font-weight: 700;
  color: var(--black);
  margin: 0;
  line-height: 1;
}

/* Close button moved into header row — remove absolute positioning */
.mini-cart__close {
  position: static;
}

/* Body top padding reduced now that header handles the spacing */
.mini-cart__body {
  padding-top: 20px;
}

/* ── Mobile: full-screen drawer ────────────────────────── */
@media (max-width: 991px) {
  .mini-cart__drawer {
    width: 100%;
    max-width: 100%;
    background: var(--cream);
    box-shadow: none;
  }

  .mini-cart__header {
    padding: 18px 24px 16px;
    border-bottom: 1px solid var(--cream-light);
  }

  .mini-cart__title {
    font-size: clamp(16px, calc(13.866523px + 0.215285vw), 18px);
  }

  .mini-cart__body {
    padding: 20px 24px 0;
  }

  .mini-cart__item-thumb {
    width: 90px;
    height: 90px;
    border-radius: 14px;
    padding: 8px;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    display: flex;
  }

  .mini-cart__item-thumb img {
    height: 74px;
    border-radius: 8px;
  }

  .mini-cart__item-name {
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
  }

  .mini-cart__item-desc {
    font-size: clamp(12px, calc(12px + 0vw), 12px);
  }

  .mini-cart__item-qty {
    border: none;
    border-bottom: 1px solid var(--black);
    padding: 4px 8px;
    gap: 12px;
  }

  .mini-cart__item-price {
    font-size: clamp(16px, calc(13.866523px + 0.215285vw), 18px);
  }

  .mini-cart__rec-title {
    font-size: clamp(12px, calc(9.866523px + 0.215285vw), 14px);
    margin-bottom: 14px;
  }

  .mini-cart__rec-thumb {
    width: 90px;
    height: 90px;
    border-radius: 14px;
    padding: 8px;
  }

  .mini-cart__rec-thumb img {
    height: 74px;
  }

  .mini-cart__rec-name {
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
  }

  .mini-cart__rec-price {
    font-size: clamp(16px, calc(13.866523px + 0.215285vw), 18px);
  }

  /* CTA button: full width, rounded, black bg */
  .mini-cart__totals {
    padding: 16px 24px 0;
  }

  .mini-cart__totals-row {
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
  }

  .mini-cart__totals-row--total {
    font-size: clamp(16px, calc(13.866523px + 0.215285vw), 18px);
  }

  .mini-cart__cta {
    height: 50px;
    border-radius: 12px;
    font-size: clamp(14px, calc(14px + 0vw), 14px);
    letter-spacing: 0;
    text-transform: none;
    background: var(--black);
    margin: 14px 0 24px;
  }
}

/* =====================================================
   Account Modal - WooCommerce auth
   ===================================================== */

.icon-btn {
  text-decoration: none;
}

.account-modal {
  position: fixed;
  inset: 0;
  z-index: 1400;
  overflow-y: auto;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.28s ease;
}

.account-modal.is-open {
  pointer-events: auto;
  opacity: 1;
}

.account-modal__backdrop {
  position: fixed;
  inset: 0;
  background:
    linear-gradient(
      180deg,
      rgba(35, 31, 32, 0.97) 0%,
      rgba(35, 31, 32, 0.95) 24%,
      rgba(35, 31, 32, 0.65) 68%,
      rgba(35, 31, 32, 0.98) 100%
    ),
    var(--account-modal-bg) center bottom / cover no-repeat;
}

.account-modal__dialog {
  position: relative;
  width: min(1181px, calc(100% - 48px));
  min-height: 100vh;
  margin: 0 auto;
  padding: min(18vh, 280px) 0 96px;
}

.account-modal__close {
  position: absolute;
  top: clamp(42px, 8vh, 96px);
  right: 0;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.28);
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition:
    background 0.2s ease,
    border-color 0.2s ease,
    color 0.2s ease;
}

.account-modal__close:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--white);
}

.account-modal__panel[hidden] {
  display: none;
}

.account-modal__title {
  font-family: var(--font);
  font-size: clamp(60px, calc(60px + 0vw), 60px);
  line-height: 1;
  font-weight: 900;
  color: var(--white);
  margin: 0 0 58px 50px;
  letter-spacing: 0;
}

.account-card {
  width: 100%;
  height: 624px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-radius: 20px;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.58);
  box-shadow: 0 32px 90px rgba(0, 0, 0, 0.28);
}

.account-card__form {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 118px 50px 42px;
  background: rgba(0, 0, 0, 0.58);
  color: var(--white);
  backdrop-filter: blur(50px);
  -webkit-backdrop-filter: blur(50px);
}

.account-field {
  position: relative;
  width: 399px;
  max-width: 100%;
  height: 26px;
  display: block;
  margin: 0 0 57px;
}

.account-field span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.account-field input {
  width: 100%;
  height: 26px;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 0;
  background: transparent;
  color: var(--white);
  font-family: var(--font);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.2;
  padding: 0 34px 6px 0;
  outline: none;
}

.account-field input::placeholder {
  color: var(--white);
  opacity: 1;
}

.account-field input:focus {
  border-bottom-color: var(--white);
}

.account-field input:-webkit-autofill,
.account-field input:-webkit-autofill:hover,
.account-field input:-webkit-autofill:focus {
  box-shadow: 0 0 0 1000px #050505 inset;
  -webkit-text-fill-color: var(--white);
  caret-color: var(--white);
  transition: background-color 9999s ease-in-out 0s;
}

.account-password-toggle {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 26px;
  height: 26px;
  border: 0;
  background: transparent;
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  cursor: pointer;
}

.account-card__terms,
.account-card__forgot,
.account-switch {
  font-family: var(--font);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1.4;
  font-weight: 400;
  color: var(--white);
  letter-spacing: 0;
}

.account-card__terms {
  width: 399px;
  max-width: 100%;
  margin: 14px 0 0;
}

.account-card__terms a,
.account-card__forgot {
  color: var(--white);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.account-card__forgot {
  display: inline-flex;
  text-decoration: none;
  margin-top: 13px;
}

.account-card__forgot:hover,
.account-card__terms a:hover,
.account-switch button:hover {
  color: var(--gold);
}

.account-form-message {
  min-height: 18px;
  margin-top: 18px;
  font-family: var(--font);
  font-size: clamp(13px, calc(13px + 0vw), 13px);
  line-height: 1.35;
  color: var(--white);
}

.account-form-message:empty {
  min-height: 18px;
}

.account-form-message.is-error {
  color: #ffdad2;
}

.account-form-message.is-success {
  color: #d8f0cf;
}

.account-submit {
  min-width: 108px;
  height: 60px;
  border: 0;
  border-radius: 15px;
  background: var(--gold);
  color: var(--white);
  font-family: var(--font);
  font-size: clamp(16px, calc(16px + 0vw), 16px);
  line-height: 1;
  font-weight: 700;
  padding: 0 29px;
  margin-top: 46px;
  cursor: pointer;
  transition:
    background 0.2s ease,
    transform 0.2s ease,
    opacity 0.2s ease;
}

.account-submit:hover {
  background: #9a895f;
}

.account-submit:disabled,
.account-card__form.is-loading .account-submit {
  cursor: wait;
  opacity: 0.72;
}

.account-switch {
  margin: 68px 0 0;
}

.account-modal__panel--signup .account-switch {
  display: none;
}

.account-switch button {
  border: 0;
  background: transparent;
  color: var(--gold);
  font: inherit;
  padding: 0;
  cursor: pointer;
}

.account-card__media {
  min-width: 0;
  background: var(--black);
}

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

body.account-modal-open {
  overflow: hidden;
}

@media (max-width: 1100px) {
  .account-modal__dialog {
    width: min(900px, calc(100% - 36px));
    padding-top: 120px;
  }

  .account-card {
    height: auto;
    min-height: 600px;
  }

  .account-modal__title {
    margin-left: 34px;
  }

  .account-card__form {
    padding-left: 34px;
    padding-right: 34px;
  }
}

@media (max-width: 991px) {
  body.account-modal-open .site-header {
    z-index: 10050;
    background: var(--black);
  }

  body.account-modal-open .header-nav,
  body.account-modal-open .header-nav__mobile-panel {
    background: var(--black);
  }

  body.account-modal-open .header-nav__mobile-toggle,
  body.account-modal-open .header-nav .icon-btn,
  body.account-modal-open .header-nav__mobile-menu a {
    color: var(--white);
  }

  body.account-modal-open .header-nav__logo-img {
    content: url("assets/images/logo-rossetti-mark-light.svg");
    filter: none;
  }

  .account-modal {
    top: 81px;
    bottom: 0;
    height: auto;
    z-index: 10040;
  }

  .account-modal__backdrop {
    top: 81px;
    bottom: 0;
    height: auto;
    background: rgba(0, 0, 0, 0.88);
    backdrop-filter: blur(50px);
    -webkit-backdrop-filter: blur(50px);
  }

  /* Dialog: starts exactly below the 29px topbar + 52px mobile nav */
  .account-modal__dialog {
    width: min(391px, calc(100vw + 16px));
    min-height: max(808px, calc(100dvh - 81px));
    padding: 118px 52px 80px;
    box-sizing: border-box;
    background: #050505;
    backdrop-filter: blur(50px);
    -webkit-backdrop-filter: blur(50px);
  }

  .account-modal__close {
    right: 32px;
    top: 32px;
  }

  .account-modal__title {
    font-size: clamp(32px, calc(2.131324px + 3.013994vw), 60px);
    margin: 0 0 44px;
  }

  .account-card {
    display: block;
    height: auto;
    min-height: 0;
    border-radius: 0;
    overflow: visible;
    background: transparent;
    box-shadow: none;
  }

  .account-card__media {
    display: none;
  }

  .account-card__form {
    padding: 0;
    width: 100%;
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .account-field {
    width: 100%;
    margin-bottom: 42px;
  }

  .account-field input {
    font-size: clamp(13px, calc(9.799785px + 0.322928vw), 16px);
  }

  .account-field input::placeholder {
    font-size: clamp(13px, calc(9.799785px + 0.322928vw), 16px);
  }

  /* Text elements */
  .account-card__terms,
  .account-card__forgot,
  .account-switch {
    font-size: clamp(13px, calc(9.799785px + 0.322928vw), 16px);
  }

  .account-card__terms {
    width: 100%;
    margin-top: 10px;
  }

  .account-card__forgot {
    margin-top: 10px;
  }

  /* Submit: Figma style */
  .account-submit {
    height: 47px;
    border-radius: 12px;
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
    padding: 0 24px;
    min-width: 100px;
    margin-top: 32px;
  }

  .account-switch {
    margin-top: 40px;
  }

  .account-form-message {
    font-size: clamp(12px, calc(9.866523px + 0.215285vw), 14px);
  }
}

/* Shared product carousel arrows - match home styling everywhere */
.home .products-arrow,
.pf-products .products-arrow,
.brand-products .products-arrow,
.sp-related .products-arrow,
.rc-cart__cross-sells .products-arrow,
.br2-products .products-arrow {
  position: absolute;
  top: 50%;
  z-index: 8;
  width: 44px;
  height: 127px;
  border: 0;
  background: var(--gold);
  color: var(--white);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transform: translateY(-50%);
  transition:
    background 0.2s ease,
    opacity 0.2s ease;
}

.home .products-arrow:hover,
.pf-products .products-arrow:hover,
.brand-products .products-arrow:hover,
.sp-related .products-arrow:hover,
.rc-cart__cross-sells .products-arrow:hover,
.br2-products .products-arrow:hover {
  background: #6e6040;
}

.home .products-arrow:disabled,
.pf-products .products-arrow:disabled,
.brand-products .products-arrow:disabled,
.sp-related .products-arrow:disabled,
.rc-cart__cross-sells .products-arrow:disabled,
.br2-products .products-arrow:disabled {
  opacity: 0.35;
  cursor: default;
}

.home .products-arrow--prev,
.pf-products .products-arrow--prev,
.brand-products .products-arrow--prev,
.sp-related .products-arrow--prev,
.rc-cart__cross-sells .products-arrow--prev,
.br2-products .products-arrow--prev {
  left: -32px;
  border-radius: 8px 0px 0px 8px;
}

.home .products-arrow--next,
.pf-products .products-arrow--next,
.brand-products .products-arrow--next,
.sp-related .products-arrow--next,
.rc-cart__cross-sells .products-arrow--next,
.br2-products .products-arrow--next {
  right: -35px;
  border-radius: 0px 8px 8px 0px;
}

.home .products-arrow svg,
.pf-products .products-arrow svg,
.brand-products .products-arrow svg,
.sp-related .products-arrow svg,
.rc-cart__cross-sells .products-arrow svg,
.br2-products .products-arrow svg {
  display: block;
  width: 17px;
  height: 31px;
}

@media (max-width: 1024px) {
  .home .products-arrow,
  .pf-products .products-arrow,
  .brand-products .products-arrow,
  .sp-related .products-arrow,
  .rc-cart__cross-sells .products-arrow,
  .br2-products .products-arrow {
    width: 48px;
    height: 72px;
  }

  .home .products-arrow--prev,
  .pf-products .products-arrow--prev,
  .brand-products .products-arrow--prev,
  .sp-related .products-arrow--prev,
  .rc-cart__cross-sells .products-arrow--prev,
  .br2-products .products-arrow--prev {
    left: -6px;
  }

  .home .products-arrow--next,
  .pf-products .products-arrow--next,
  .brand-products .products-arrow--next,
  .sp-related .products-arrow--next,
  .rc-cart__cross-sells .products-arrow--next,
  .br2-products .products-arrow--next {
    right: -6px;
  }
}

/* Similar-products slider is swipe/scroll on mobile — hide the overlapping arrows */
@media (max-width: 991px) {
  .sp-related .products-arrow {
    display: none;
  }
}

/* Responsive partner section */
@media (min-width: 992px) {
  .home .partner-section {
    height: clamp(492px, 27vw, 560px);
  }

  .home .partner-section .container {
    height: 100%;
    padding-inline: 0;
  }

  .home .partner-section__content {
    left: clamp(24px, 8.65vw, 166px);
    top: clamp(96px, 7.34vw, 141px);
    width: clamp(380px, 25.94vw, 498px);
  }

  .home .partner-section__heading {
    font-size: clamp(42px, calc(22.798708px + 1.937567vw), 60px);
    white-space: normal;
  }

  .home .partner-section__text {
    width: 100%;
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
  }

  .home .partner-form {
    left: calc(50% + clamp(16px, 2.2vw, 42px));
    right: 0;
    top: clamp(156px, 9.84vw, 189px);
    width: auto;
  }

  .home .partner-form__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(24px, 1.56vw, 30px) clamp(28px, 3.07vw, 59px);
  }
}

@media (max-width: 991px) {
  .home .partner-section {
    height: auto;
    min-height: 0;
    margin-top: 0;
    padding: clamp(72px, 9vw, 108px) 0;
  }

  .home .partner-section .container {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(42px, 6vw, 72px);
    height: auto;
    padding-inline: 0;
  }

  .home .partner-section__content {
    position: static;
    width: min(100%, 620px);
    max-width: none;
    padding-inline: clamp(22px, 5vw, 64px);
  }

  .home .partner-section__content .label-tag {
    margin: 0 0 20px;
  }

  .home .partner-section__heading {
    margin: 0 0 18px;
    font-size: clamp(38px, calc(14.531755px + 2.368138vw), 60px);
    line-height: 1.05;
    white-space: normal;
  }

  .home .partner-section__text {
    width: min(100%, 620px);
    margin: 0;
    font-size: clamp(15px, calc(13.933262px + 0.107643vw), 16px);
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.78);
  }

  .home .partner-form {
    position: static;
    width: 100%;
    max-width: 920px;
    color: var(--white);
    padding-inline: clamp(22px, 5vw, 64px);
  }

  .home .partner-form__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px clamp(28px, 5vw, 56px);
  }

  .home .partner-form label {
    display: block;
    min-width: 0;
    color: inherit;
  }

  .home .partner-form input[type="text"],
  .home .partner-form input[type="tel"],
  .home .partner-form input[type="email"] {
    width: 100%;
    height: 34px;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 0;
    background: transparent;
    color: var(--white);
    outline: none;
    font-size: clamp(16px, calc(16px + 0vw), 16px);
  }

  .home .partner-form input::placeholder {
    color: rgba(255, 255, 255, 0.8);
  }

  .home .partner-form__submit-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
  }

  .home .partner-form__terms {
    display: flex !important;
    align-items: center;
    gap: 10px;
    min-width: 0;
    font-size: clamp(15px, calc(15px + 0vw), 15px);
    color: var(--white);
  }

  .home .partner-form__terms input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    width: 20px;
    height: 20px;
    border: 1px solid rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    background: transparent;
    cursor: pointer;
    flex: 0 0 auto;
    position: relative;
  }

  .home .partner-form__terms input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    inset: 3px;
    border-radius: 50%;
    background: var(--gold);
  }

  .home .partner-form__terms span {
    margin: 0 !important;
  }

  .home .partner-form button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
    border: 0;
    background: none;
    color: var(--gold);
    font-size: clamp(16px, calc(16px + 0vw), 16px);
    font-weight: 700;
    cursor: pointer;
    padding: 0;
  }

  .home .partner-form button svg {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
  }
}

/* Shared dark header for interior pages */
:is(
    .coffee-page-template,
    .professional-page-template,
    .academy-page-template,
    .brand-page-template,
    .course-page-template,
    .brew-guides-template,
    .blog-page-template,
    .woocommerce-cart,
    .woocommerce-checkout
  )
  .site-header {
  position: sticky;
  inset: auto;
  top: 0;
  z-index: 1000;
  background: var(--black);
  padding-bottom: 0;
}

:is(
    .coffee-page-template,
    .professional-page-template,
    .academy-page-template,
    .brand-page-template,
    .course-page-template,
    .brew-guides-template,
    .blog-page-template,
    .woocommerce-cart,
    .woocommerce-checkout
  )
  .header-nav,
:is(
    .coffee-page-template,
    .professional-page-template,
    .academy-page-template,
    .brand-page-template,
    .course-page-template,
    .brew-guides-template,
    .blog-page-template,
    .woocommerce-cart,
    .woocommerce-checkout
  )
  .main-header {
  background: var(--black);
}

:is(
    .coffee-page-template,
    .professional-page-template,
    .academy-page-template,
    .brand-page-template,
    .course-page-template,
    .brew-guides-template,
    .blog-page-template,
    .woocommerce-cart,
    .woocommerce-checkout
  )
  .header-topbar__lang,
:is(
    .coffee-page-template,
    .professional-page-template,
    .academy-page-template,
    .brand-page-template,
    .course-page-template,
    .brew-guides-template,
    .blog-page-template,
    .woocommerce-cart,
    .woocommerce-checkout
  )
  .header-topbar__lang
  a,
:is(
    .coffee-page-template,
    .professional-page-template,
    .academy-page-template,
    .brand-page-template,
    .course-page-template,
    .brew-guides-template,
    .blog-page-template,
    .woocommerce-cart,
    .woocommerce-checkout
  )
  .header-topbar__lang
  a.active,
:is(
    .coffee-page-template,
    .professional-page-template,
    .academy-page-template,
    .brand-page-template,
    .course-page-template,
    .brew-guides-template,
    .blog-page-template,
    .woocommerce-cart,
    .woocommerce-checkout
  )
  .header-topbar__lang
  span,
:is(
    .coffee-page-template,
    .professional-page-template,
    .academy-page-template,
    .brand-page-template,
    .course-page-template,
    .brew-guides-template,
    .blog-page-template,
    .woocommerce-cart,
    .woocommerce-checkout
  )
  .header-topbar__message,
:is(
    .coffee-page-template,
    .professional-page-template,
    .academy-page-template,
    .brand-page-template,
    .course-page-template,
    .brew-guides-template,
    .blog-page-template,
    .woocommerce-cart,
    .woocommerce-checkout
  )
  .header-nav__menu
  li
  a,
:is(
    .coffee-page-template,
    .professional-page-template,
    .academy-page-template,
    .brand-page-template,
    .course-page-template,
    .brew-guides-template,
    .blog-page-template,
    .woocommerce-cart,
    .woocommerce-checkout
  )
  .header-nav__pro
  a,
:is(
    .coffee-page-template,
    .professional-page-template,
    .academy-page-template,
    .brand-page-template,
    .course-page-template,
    .brew-guides-template,
    .blog-page-template,
    .woocommerce-cart,
    .woocommerce-checkout
  )
  .header-nav
  .icon-btn,
:is(
    .coffee-page-template,
    .professional-page-template,
    .academy-page-template,
    .brand-page-template,
    .course-page-template,
    .brew-guides-template,
    .blog-page-template,
    .woocommerce-cart,
    .woocommerce-checkout
  )
  .header-nav__eshop-item
  > a {
  color: var(--white);
}

:is(
    .coffee-page-template,
    .professional-page-template,
    .academy-page-template,
    .brand-page-template,
    .course-page-template,
    .brew-guides-template,
    .blog-page-template,
    .woocommerce-cart,
    .woocommerce-checkout
  )
  .header-nav__eshop-item
  > a {
  border-color: var(--white);
}

:is(
    .coffee-page-template,
    .professional-page-template,
    .academy-page-template,
    .brand-page-template,
    .course-page-template,
    .brew-guides-template,
    .blog-page-template,
    .woocommerce-cart,
    .woocommerce-checkout
  )
  .header-nav__menu
  .sub-menu
  a {
  color: var(--black);
}

:is(
    .coffee-page-template,
    .professional-page-template,
    .academy-page-template,
    .brand-page-template,
    .course-page-template,
    .brew-guides-template,
    .blog-page-template,
    .woocommerce-cart,
    .woocommerce-checkout
  )
  .header-nav__logo-img {
  content: url("assets/images/logo-rossetti-footer.svg");
  filter: none;
}

/* Center the home partner section content */
@media (min-width: 992px) {
  .home .partner-section .container {
    display: grid;
    grid-template-columns: minmax(380px, 560px) minmax(560px, 857px);
    justify-content: center;
    align-items: start;
    column-gap: clamp(56px, 6vw, 140px);
    width: min(100%, 1790px);
    max-width: 1790px;
    height: 100%;
    margin-inline: auto;
    padding-inline: 0;
  }

  .home .partner-section__content {
    position: static;
    width: auto;
    max-width: 498px;
    margin-top: clamp(104px, 7.34vw, 141px);
  }

  .home .partner-form {
    position: static;
    width: auto;
    max-width: 857px;
    margin-top: clamp(148px, 9.84vw, 189px);
    padding-inline: 0;
  }
}

@media (min-width: 992px) and (max-width: 1550px) {
  .home .header-nav__menu,
  .home .header-nav__menu--right {
    gap: clamp(20px, 1.8vw, 28px);
  }

  .home .header-nav__right {
    gap: clamp(20px, 1.8vw, 28px);
  }

  .home .header-nav__menu li a,
  .home .header-nav__pro a,
  .home .header-nav__eshop-item > a {
    font-size: clamp(14px, 0.97vw, 15px);
  }

  .home .header-nav__eshop-item > a {
    padding: 12px clamp(14px, 1.1vw, 18px);
    white-space: nowrap;
  }

  .home .header-nav__icons {
    gap: 18px;
  }

  .header-nav__menu,
  .header-nav__menu--right {
    gap: clamp(20px, 1.8vw, 28px);
  }

  .header-nav__right {
    gap: clamp(20px, 1.8vw, 28px);
  }

  .header-nav__icons {
    gap: 18px;
  }

  .header-nav__inner {
    grid-template-columns: 1fr 120px 1fr;
  }

  .header-nav__logo-img {
    width: 120px;
    height: 102px !important;
  }

  .header-nav__eshop-item > a {
    padding: 12px clamp(14px, 1.1vw, 18px);
    white-space: nowrap;
  }

  .header-nav__menu li a,
  .header-nav__pro a,
  .header-nav__eshop-item > a,
  :is(
      .coffee-page-template,
      .professional-page-template,
      .academy-page-template,
      .brand-page-template,
      .brand-rossetti-template,
      .blog-page-template,
      .blog-single-template,
      .contact-page-template,
      .course-page-template,
      .brew-guides-template,
      .page-template-page-company,
      .page-template-page-wishlist,
      .woocommerce-shop,
      .post-type-archive-product,
      body.single-product,
      body.woocommerce-cart,
      body.woocommerce-checkout
    )
    .header-nav__menu
    li
    a,
  :is(
      .coffee-page-template,
      .professional-page-template,
      .academy-page-template,
      .brand-page-template,
      .brand-rossetti-template,
      .blog-page-template,
      .blog-single-template,
      .contact-page-template,
      .course-page-template,
      .brew-guides-template,
      .page-template-page-company,
      .page-template-page-wishlist,
      .woocommerce-shop,
      .post-type-archive-product,
      body.single-product,
      body.woocommerce-cart,
      body.woocommerce-checkout
    )
    .header-nav__pro
    a,
  :is(
      .coffee-page-template,
      .professional-page-template,
      .academy-page-template,
      .brand-page-template,
      .brand-rossetti-template,
      .blog-page-template,
      .blog-single-template,
      .contact-page-template,
      .course-page-template,
      .brew-guides-template,
      .page-template-page-company,
      .page-template-page-wishlist,
      .woocommerce-shop,
      .post-type-archive-product,
      body.single-product,
      body.woocommerce-cart,
      body.woocommerce-checkout
    )
    .header-nav__eshop-item
    > a {
    font-size: clamp(14px, 0.97vw, 15px);
  }

  .home .hero-slide__content {
    padding-top: clamp(204px, 14.2vw, 220px);
  }

  .home .hero-slide__title {
    margin-bottom: 24px;
    font-size: clamp(112px, 8.05vw, 124px);
    line-height: 0.86;
    letter-spacing: 1.6px;
  }

  .home .hero-slide__desc {
    max-width: 600px;
    margin-bottom: 30px;
  }

  .home .partner-section .container {
    grid-template-columns: minmax(360px, 498px) minmax(0, 857px);
    column-gap: clamp(48px, 5vw, 112px);
    width: min(90%, 1790px);
  }

  .home .blog-section__left .btn-gold {
    position: static;
    margin-top: 30px;
  }

  .tc-hero__title,
  .ac-hero__title,
  .pf-hero__title {
    font-size: clamp(82px, 6.7vw, 104px);
  }

  .tc-section-nav {
    gap: clamp(24px, 3vw, 48px);
  }

  .tc-section-nav a:not(:last-child)::after {
    right: calc(clamp(24px, 3vw, 48px) * -0.5);
  }

  .tc-sourcing__grid {
    width: 90%;
    grid-template-columns: minmax(0, 520px) minmax(0, 760px);
    column-gap: clamp(40px, 3vw, 108px);
  }
  .tc-sourcing .tc-copy {
    padding-top: 100px;
  }

  .tc-hero-card {
    height: clamp(460px, 32vw, 500px);
  }

  .pf-card {
    height: 460px;
    min-height: 460px;
  }

  .pf-products .products-filter-tabs,
  .br2-products .products-filter-tabs {
    gap: clamp(48px, 5vw, 80px);
  }

  .pf-products__tab-icon,
  .br2-products__tab-icon {
    width: 100px;
    height: 100px;
  }

  .pf-products .product-card,
  .br2-products .product-card {
    min-height: 460px;
  }

  .pf-products .product-card__image,
  .br2-products .product-card__image {
    height: 250px;
    flex-basis: 250px;
  }

  .ac-course-card:hover .ac-course-card__btn {
    width: 83% !important;
    height: 36% !important;
    padding: clamp(20px, 1.8vw, 26px) clamp(22px, 2.1vw, 30px) !important;
    align-items: flex-start !important;
  }

  .ac-course-card__btn-desc {
    font-size: clamp(13px, 0.9vw, 14px);
    line-height: 1.32;
    display: block;
    -webkit-line-clamp: unset;
    line-clamp: unset;
    -webkit-box-orient: unset;
  }

  .ac-course-card:hover .ac-course-card__btn-desc {
    max-height: 230px !important;
  }

  .ac-course-card:hover .ac-course-card__btn-text {
    max-width: 150px;
  }

  .rs-shop__categories {
    gap: clamp(36px, 4vw, 62px);
  }

  .rs-shop-cat__icon {
    width: 112px;
    height: 112px;
  }

  .rs-shop__filters {
    gap: 24px;
  }

  .rs-shop__catalog {
    padding-inline: 0;
  }

  .rs-shop__filter-group {
    flex-wrap: wrap;
    gap: 14px;
  }

  .rs-shop-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 34px 32px;
  }

  .rs-shop .rs-shop-grid > .rs-shop-card {
    max-width: none;
    justify-self: stretch;
  }

  .blog-index-listing,
  .contact-hero,
  .contact-main,
  .course-overview {
    padding-inline: 5%;
  }

  .blog-index-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(32px, 4vw, 56px);
  }

  .blog-index-card {
    width: 100%;
    min-height: clamp(560px, 41vw, 620px);
  }

  .blog-index-card__image {
    height: clamp(240px, 19vw, 290px);
  }

  .blog-index-card__body {
    padding: 34px 30px 36px;
  }

  .blog-index-card__title,
  .blog-index-card__excerpt {
    width: 100%;
  }

  .contact-main__inner {
    grid-template-columns: minmax(360px, 491px) minmax(360px, 399px);
    gap: clamp(56px, 5vw, 80px);
  }

  .contact-main__visual,
  .contact-form {
    width: 100%;
  }

  .course-overview__inner {
    grid-template-columns: minmax(0, 1fr) minmax(360px, 460px);
    gap: clamp(48px, 5vw, 76px);
  }

  .course-details {
    width: auto;
    padding: 64px 56px 72px;
  }

  .course-contact__card {
    grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
    gap: clamp(32px, 3.4vw, 48px);
    padding: 56px 58px 62px;
  }

  .course-contact__intro {
    max-width: 320px;
  }

  .course-contact__intro h2 {
    font-size: clamp(42px, 3.35vw, 52px);
    margin-bottom: 28px;
  }

  .course-contact__intro p {
    max-width: 320px;
    font-size: clamp(16px, 1.1vw, 17px);
    line-height: 1.18;
  }

  .course-contact__fields {
    grid-template-columns: minmax(300px, 1fr) minmax(220px, 0.78fr);
    column-gap: clamp(28px, 3vw, 42px);
  }

  .course-contact__select-field,
  .course-field,
  .course-total {
    width: 100%;
  }

  .brew-needs__inner,
  .brew-steps__header,
  .brew-steps__slider,
  .brew-gear {
    padding-inline: 5%;
  }

  .brew-steps__counter {
    right: 5%;
  }

  .brew-steps__arrow--prev {
    left: 3%;
  }

  .brew-steps__arrow--next {
    right: 3%;
  }

  .brand-pack-card {
    width: min(820px, 44vw);
    height: auto;
    aspect-ratio: 895 / 841;
  }

  .brand-quote {
    left: calc(50% + 54px);
    grid-template-columns: 34px minmax(0, 420px);
    top: 585px;
  }

  .brand-quote p,
  .brand-red-cta__text p {
    font-size: clamp(24px, 1.8vw, 28px);
  }

  .brand-quality-grid {
    left: calc(50% + 62px);
    width: min(720px, calc(50vw - 110px));
    column-gap: clamp(34px, 3vw, 56px);
    row-gap: 52px;
  }

  .br2-hero__content {
    grid-template-columns: minmax(440px, 1fr) minmax(380px, 560px);
    gap: clamp(44px, 5vw, 80px);
  }

  .br2-hero__intro {
    margin-bottom: 108px;
  }

  .br2-hero-quote {
    margin-top: 160px;
  }

  .br2-quality-grid {
    gap: 54px 48px;
    margin-top: 132px;
  }

  .rc-cart .container {
    width: 90%;
    padding-inline: 0;
  }

  .rc-cart__body {
    grid-template-columns: minmax(0, 1fr) minmax(330px, 42%);
    gap: 36px;
  }

  .rc-cart__cross-sells .products-nav-bottom {
    margin-left: auto;
  }

  .rc-checkout__left,
  .rc-checkout__right {
    padding: 44px 5% 64px;
  }
}

@media (min-width: 1201px) and (max-width: 1220px) {
  .sp-wrap {
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
    gap: 32px;
    align-items: start;
  }

  .sp-gallery {
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 24px;
    justify-content: stretch;
  }

  .sp-gallery__rail,
  .sp-gallery__controls,
  .sp-thumb {
    width: 78px;
  }

  .sp-thumb {
    height: 78px;
  }

  .sp-gallery__main {
    height: 520px;
  }

  .sp-info {
    max-width: none;
    margin-inline: 0;
  }

  .sp-specs {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    min-height: 0;
    max-width: none;
    margin-inline: 0;
    padding: 0;
    border-left: 0;
  }

  .sp-spec {
    margin: 0;
    padding: 20px;
    border: 1px solid var(--cream-light);
    border-radius: 10px;
  }
}

@media (min-width: 992px) {
  .home .b2b-section {
    position: relative;
    z-index: 3;
  }

  .home .b2b-cards {
    position: relative;
    z-index: 4;
  }

  .home .partner-section {
    position: relative;
    z-index: 1;
  }

  .home .b2b-card {
    container-type: inline-size;
    isolation: isolate;
  }

  .home .b2b-card:nth-child(4) .b2b-card__overlay::before {
    background: var(--gold);
  }

  .home .b2b-card__bg,
  .home .b2b-card__overlay,
  .home .b2b-card::before,
  .home .b2b-card::after {
    transition:
      opacity 0.3s ease,
      transform 0.3s ease;
  }

  .home .b2b-card:hover .b2b-card__bg {
    transform: none;
  }

  .home .b2b-card:hover .b2b-card__overlay,
  .home .b2b-card:hover::before,
  .home .b2b-card:hover::after {
    opacity: 0;
  }

  .home .b2b-card__mobile-icon,
  .home .b2b-card__mobile-panel {
    visibility: hidden;
    opacity: 0;
    transition:
      opacity 0.3s ease,
      transform 0.3s ease,
      visibility 0s linear 0.3s;
  }

  .home .b2b-card__mobile-icon {
    display: block;
    position: absolute;
    z-index: 5;
    max-width: none;
    object-fit: contain;
    pointer-events: none;
  }

  .home .b2b-card:nth-child(1) .b2b-card__mobile-icon {
    top: 305px;
    left: 50%;
    width: 97px;
    height: 97px;
    --stroke-0: var(--white);
    --fill-0: var(--white);
    transform: translateX(-50%) translateY(10px);
  }

  .home .b2b-card:nth-child(2) .b2b-card__mobile-icon {
    top: 277px;
    left: calc(50% - 49px);
    width: 98px;
    height: 124px;
    --stroke-0: var(--white);
    --fill-0: var(--white);
    transform: translateY(10px);
  }

  .home .b2b-card:nth-child(3) .b2b-card__mobile-icon {
    top: 316px;
    left: calc(50% - 72px);
    width: 123px;
    height: 115px;
    --stroke-0: var(--white);
    --fill-0: var(--white);
    transform: translateY(10px);
  }

  .home .b2b-card:nth-child(4) .b2b-card__mobile-icon {
    top: 300px;
    left: calc(50% - 30px);
    width: 57px;
    height: 141px;
    --stroke-0: var(--white);
    --fill-0: var(--white);
    transform: translateY(10px);
  }

  .home .b2b-card__mobile-panel {
    display: block;
    position: absolute;
    top: 382px;
    left: 50%;
    z-index: 4;
    width: min(321px, calc(100% - 32px));
    height: 293px;
    border-radius: 20px;
    box-shadow: 32px 26px 104.1px rgba(0, 0, 0, 0.55);
    pointer-events: none;
    transform: translateX(-50%) translateY(10px);
  }

  .home .b2b-card:nth-child(2) .b2b-card__mobile-panel {
    top: 380px;
  }

  .home .b2b-card--mobile-dark .b2b-card__mobile-panel {
    background: var(--black);
    color: var(--white);
  }

  .home .b2b-card--mobile-light .b2b-card__mobile-panel {
    background: var(--cream);
    color: var(--black);
  }

  .home .b2b-card--mobile-red .b2b-card__mobile-panel {
    background: var(--dark-red, #592828);
    color: var(--white);
  }

  .home .b2b-card--mobile-gold .b2b-card__mobile-panel {
    background: var(--gold);
    color: var(--white);
  }

  .home .b2b-card__mobile-title {
    position: absolute;
    top: 48px;
    left: 50%;
    width: max-content;
    max-width: calc(100% - 32px);
    margin: 0;
    color: currentColor;
    font-family: var(--font);
    font-size: clamp(18px, calc(16.7cqw - 17px), 42px);
    font-weight: 900;
    line-height: 0.8476;
    letter-spacing: 0;
    text-align: center;
    transform: translateX(-50%);
    white-space: nowrap;
  }

  .home .b2b-card:nth-child(3) .b2b-card__mobile-title,
  .home .b2b-card:nth-child(4) .b2b-card__mobile-title {
    top: 65px;
  }

  .home .b2b-card__mobile-text {
    position: absolute;
    top: 149px;
    left: 50%;
    width: min(271px, calc(100% - 40px));
    height: 100px;
    margin: 0;
    color: currentColor;
    font-family: var(--font);
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
    text-align: center;
    transform: translateX(-50%);
    overflow: hidden;
  }

  .home .b2b-card__mobile-btn {
    position: absolute;
    top: 263px;
    left: 50%;
    width: 134px;
    height: 60px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    color: var(--white);
    background: var(--gold);
    font-family: var(--font);
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    transform: translateX(-50%);
  }

  .home .b2b-card--mobile-light .b2b-card__mobile-btn {
    background: var(--black);
    color: var(--cream);
  }

  .home .b2b-card--mobile-red .b2b-card__mobile-btn {
    background: var(--white);
    color: #592828;
  }

  .home .b2b-card--mobile-gold .b2b-card__mobile-btn {
    background: var(--white);
    color: var(--gold);
  }

  .home .b2b-card:hover .b2b-card__mobile-icon,
  .home .b2b-card:hover .b2b-card__mobile-panel {
    visibility: visible;
    opacity: 1;
    transition-delay: 0s;
  }

  .home .b2b-card:hover .b2b-card__mobile-icon {
    transform: translateY(0);
  }

  .home .b2b-card:nth-child(1):hover .b2b-card__mobile-icon {
    transform: translateX(-50%) translateY(0);
  }

  .home .b2b-card:hover .b2b-card__mobile-panel {
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
  }
}

/* =====================================================
   HOME RESPONSIVE - 991PX BREAKPOINT
   ===================================================== */
/*
  Project responsive rule:
  - 991px is the only max-width breakpoint. Do not add narrower max-width queries.
  - Responsive font sizes use clamp(): max is the current larger/desktop value,
    and the 991px target comes from the Figma mockup.
*/
@media (max-width: 991px) {
  :root {
    --gutter: clamp(24px, 4vw, 40px);
  }

  .home {
    --home-mobile-canvas-x: clamp(0px, calc(-286.966px + 59.784735vw), 277.5px);
  }

  .site-header,
  .home .site-header {
    position: sticky;
    top: 0;
    background: var(--cream);
  }

  .header-topbar {
    height: 29px;
  }

  .header-topbar__inner,
  .home .header-topbar__inner {
    width: 100%;
    height: 29px;
    max-width: none;
    justify-content: center;
    padding-inline: 0;
  }

  .header-topbar__lang {
    display: none;
  }

  .header-topbar__message,
  .home .header-topbar__message {
    position: static;
    max-width: calc(100% - 28px);
    transform: none;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    line-height: 1;
  }

  .header-nav,
  .home nav.header-nav {
    position: relative;
    background-color: var(--cream);
  }

  .header-nav__inner,
  .home .header-nav__inner {
    grid-template-columns: 1fr 82px 1fr;
    height: 52px;
    max-width: none;
    padding-inline: 18px;
  }

  .header-nav__mobile-toggle {
    grid-column: 1;
    justify-self: start;
    display: inline-flex;
    width: 48px;
    height: 46px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--black);
  }

  .header-nav__mobile-toggle span {
    display: block;
    width: 28px;
    height: 1.5px;
    border-radius: 999px;
    background: currentColor;
  }

  .header-nav__left,
  .header-nav__menu--right,
  .home .header-nav__left,
  .home .header-nav__menu--right {
    display: none;
  }

  .header-nav__logo {
    grid-column: 2;
    justify-self: center;
  }

  .header-nav__logo a {
    width: 33px;
    height: 34px;
  }

  /* Mobile logo: only the feather/leaf mark (no text) */
  .header-nav__logo-img,
  .home .header-nav__logo-img {
    content: url("assets/images/logo-rossetti-mark.svg");
    width: 33px;
    height: 34px !important;
    object-fit: contain;
    filter: none;
  }

  /* Light-header pages: keep the dark mark on mobile */
  .woocommerce-shop .header-nav__logo-img,
  .post-type-archive-product .header-nav__logo-img,
  body.woocommerce-cart .header-nav__logo-img,
  body.woocommerce-checkout .header-nav__logo-img,
  .page-template-page-wishlist .header-nav__logo-img {
    content: url("assets/images/logo-rossetti-mark.svg");
    filter: none;
  }

  /* Dark-header pages: use the light mark so it's visible on black background */
  .coffee-page-template .header-nav__logo-img,
  .professional-page-template .header-nav__logo-img,
  .academy-page-template .header-nav__logo-img,
  .brand-page-template .header-nav__logo-img,
  .blog-page-template .header-nav__logo-img,
  .course-page-template .header-nav__logo-img,
  .brew-guides-template .header-nav__logo-img,
  body.brand-rossetti-template .header-nav__logo-img {
    content: url("assets/images/logo-rossetti-mark-light.svg");
    filter: none;
  }

  /* Dark-header pages: white hamburger toggle */
  .coffee-page-template .header-nav__mobile-toggle,
  .professional-page-template .header-nav__mobile-toggle,
  .academy-page-template .header-nav__mobile-toggle,
  .brand-page-template .header-nav__mobile-toggle,
  .blog-page-template .header-nav__mobile-toggle,
  .course-page-template .header-nav__mobile-toggle,
  .brew-guides-template .header-nav__mobile-toggle,
  body.brand-rossetti-template .header-nav__mobile-toggle {
    color: var(--white);
  }

  .header-nav__right,
  .home .header-nav__right {
    grid-column: 3;
    justify-self: end;
    gap: 0;
  }

  .header-nav__icons,
  .home .header-nav__icons {
    gap: 7px;
  }

  .icon-btn,
  .home .icon-btn,
  .icon-btn[aria-label="Account"],
  .icon-btn[aria-label="Wishlist"],
  .icon-btn[aria-label="Cart"] {
    width: 24px;
    height: 24px;
  }

  .icon-btn[aria-label="Search"] {
    width: 16.368px;
    height: 16.368px;
  }

  .icon-btn svg,
  .home .icon-btn svg,
  .icon-btn[aria-label="Account"] svg,
  .icon-btn[aria-label="Wishlist"] svg,
  .icon-btn[aria-label="Cart"] svg {
    width: 100%;
    max-width: 100%;
    height: 100%;
  }

  .header-nav__mobile-panel {
    position: absolute;
    left: 0;
    right: 0;
    top: 52px;
    z-index: 1001;
    display: none;
    padding: 24px 20px 30px;
    background: var(--cream);
    border-top: 1px solid rgba(35, 31, 32, 0.12);
    box-shadow: 0 18px 28px rgba(35, 31, 32, 0.12);
  }

  .mobile-nav-open .header-nav__mobile-panel:not([hidden]) {
    display: block;
  }

  .header-nav__mobile-menu {
    display: flex;
    flex-direction: column;
    gap: 18px;
  }

  .header-nav__mobile-menu--secondary {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid rgba(35, 31, 32, 0.12);
  }

  .header-nav__mobile-menu a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--black);
    font-size: clamp(16px, calc(13.866523px + 0.215285vw), 18px);
    font-weight: 700;
    line-height: 1;
  }

  .header-nav__mobile-menu .sub-menu {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 14px;
    padding-left: 16px;
  }

  .header-nav__mobile-menu .sub-menu a {
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 400;
  }

  .site-footer {
    background: var(--black);
  }

  .footer-main {
    width: 100%;
    min-height: 1174px;
    padding: 0 0 36px;
    margin: 0;
  }

  .footer-shell {
    width: calc(100% - 12.8vw);
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  .footer-top,
  .footer-middle,
  .footer-bottom {
    display: contents;
  }

  .footer-logo {
    order: 1;
    width: 100%;
    height: 226px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
  }

  .footer-logo img {
    width: 129.891px;
    height: 110.785px;
  }

  .footer-nav {
    order: 2;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 35px;
    margin: 70px 0 0;
    padding: 0;
  }

  .footer-nav a {
    font-size: clamp(18px, calc(18px + 0vw), 18px);
    line-height: 1;
  }

  .footer-newsletter {
    order: 3;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 68px;
    margin: 70px 0 0;
  }

  .footer-newsletter__title {
    font-size: clamp(24px, calc(24px + 0vw), 24px);
    line-height: 1;
  }

  .footer-newsletter__form {
    position: relative;
    width: 100%;
    display: block;
  }

  .footer-newsletter__fields {
    width: 100%;
    gap: 11px;
  }

  .footer-newsletter__input-wrap {
    width: 235px;
    min-height: 31px;
    display: block;
    border-bottom-color: rgba(255, 255, 255, 0.55);
  }

  .footer-newsletter__input-wrap label,
  .footer-newsletter__input-wrap input {
    font-size: clamp(16px, calc(16px + 0vw), 16px);
    line-height: 1;
  }

  .footer-newsletter__input-wrap input {
    height: 15px;
  }

  .footer-newsletter__submit {
    position: absolute;
    top: 10px;
    right: 25.5px;
    width: 37.902px;
    height: 37.902px;
    margin: 0;
  }

  .footer-newsletter__submit img {
    width: 32.148px;
    height: 32.148px;
  }

  .footer-newsletter__checkbox {
    gap: 10px;
    font-size: clamp(14px, calc(14px + 0vw), 14px);
    line-height: 1;
  }

  .footer-newsletter__checkbox img {
    width: 24px;
    height: 24px;
  }

  .footer-social {
    order: 4;
    width: 291px;
    gap: 29px;
    margin: 70px 0 0;
  }

  .footer-social__link,
  .footer-social__link img {
    width: 22px;
    height: 22px;
  }

  .footer-bottom__links {
    order: 5;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 19px;
    margin: 38px 0 0;
  }

  .footer-bottom__links a,
  .footer-copy {
    font-size: clamp(12px, calc(12px + 0vw), 12px);
    line-height: 1;
  }

  .footer-copy {
    order: 6;
    margin: 38px 0 0;
  }

  .home-eshop-tab {
    top: 387px;
    right: -42px;
    width: 122px;
    height: 38px;
    display: inline-flex;
    gap: 7.561px;
    padding: 0 22.683px;
    border-radius: 11.341px 11.341px 0 0;
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
  }

  .home-eshop-tab svg {
    width: 19.146px;
    height: 19.976px;
  }

  .home .hero-section,
  .home .hero-slider,
  .home .hero-slider .slick-list,
  .home .hero-slider .slick-track {
    background: var(--cream);
  }

  .home .hero-slide {
    height: 733px;
    background: var(--cream);
    isolation: isolate;
  }

  .home .hero-slide__bg {
    top: 198px;
    right: auto;
    bottom: auto;
    left: unset;
    width: 1095px;
    height: 625px;
    background-size: cover;
    background-position: center;
    z-index: 0;
    right: 0;
  }

  .home .hero-slide__bg::after {
    background: linear-gradient(
      to bottom,
      rgba(243, 240, 234, 0.98) 0%,
      rgba(243, 240, 234, 0.78) 22%,
      rgba(243, 240, 234, 0) 56%
    );
  }

  .home .hero-slide::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 198px;
    background: var(--cream);
    pointer-events: none;
    z-index: 1;
  }

  .home .hero-slide__content {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    z-index: 2;
  }

  .home .hero-slide__content--right {
    display: none;
  }

  .home .hero-slide__title {
    position: absolute;
    top: 32px;
    left: var(--gutter);
    margin: 0;
    font-size: clamp(55px, calc(-46.340151px + 10.22605vw), 150px);
    line-height: 0.89;
    letter-spacing: clamp(1.1px, calc(-0.926803px + 0.204521vw), 3px);
    white-space: nowrap;
  }

  .home .hero-slide__title span {
    -webkit-text-stroke-width: 1px;
  }

  .home .hero-slide__title strong {
    font-weight: 900;
  }

  .home .hero-slide__desc {
    position: absolute;
    top: 206px;
    left: 24px;
    width: 275px;
    max-width: 275px;
    margin: 0;
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    line-height: 1.15;
  }

  .home .hero-slide__cta {
    position: absolute;
    top: 630px;
    left: 50%;
    margin: 0;
    transform: translateX(-50%);
  }

  .home .hero-slide__cta .btn-view-more {
    min-width: 116px;
    height: 50.597px;
    padding: 0 25.299px;
    border-radius: 12.649px;
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    line-height: 1;
  }

  .home .hero-slide__brand-info {
    display: none;
  }

  .home .hero-slider .slick-dots {
    display: none !important;
  }

  .home .btn-view-more,
  .home .btn-gold {
    min-width: 124px;
    height: 54px;
    padding: 0 24px;
    border-radius: 12px;
  }

  .home .trophy-section {
    height: auto;
    padding: 13.6vw 0;
    display: block;
    border-bottom: 0;
  }

  .home .trophy-section .container {
    width: 100%;
    margin: 0 auto;
    padding: 0;
  }

  .home .trophy-grid {
    grid-template-columns: 46.667vw 35.467vw;
    gap: 7.467vw 0;
    padding-left: 9.067vw;
  }

  .home .trophy-item {
    display: grid;
    grid-template-columns: 19.467vw 1fr;
    align-items: center;
    justify-content: flex-start;
    gap: 0.533vw;
    min-width: 0;
    padding: 0;
    border: 0;
  }

  .home .trophy-item__icon {
    width: 19.467vw;
    height: 19.467vw;
    overflow: hidden;
    background: transparent;
    border-radius: 0;
  }

  .home .trophy-item__icon svg {
    width: auto;
    height: 19.467vw;
    max-width: 19.467vw;
  }

  .home .trophy-item__title {
    margin: 0;
    font-size: clamp(14px, calc(9.733046px + 0.430571vw), 18px);
    line-height: 1;
  }

  .home .trophy-item:nth-child(1) .trophy-item__title {
    width: 29.6vw;
  }

  .home .trophy-item:nth-child(2) .trophy-item__title {
    width: 15.467vw;
  }

  .home .trophy-item:nth-child(3) .trophy-item__title {
    width: 22.667vw;
  }

  .home .trophy-item:nth-child(4) .trophy-item__title {
    width: 14.667vw;
  }

  .home .coffee-section {
    position: relative;
    height: 991px;
    margin-top: 0;
    background: var(--cream);
    overflow: hidden;
  }

  .home .coffee-section__inner {
    display: block;
    position: relative;
    height: 991px;
    min-height: 0;
  }

  .home .coffee-section__content {
    position: absolute;
    left: 50%;
    top: 43px;
    width: 87.2vw;
    height: 515px;
    margin: 0;
    padding: min(50px, 13.333vw) min(24px, 6.4vw);
    border-radius: 15.386px;
    background: var(--black);
    overflow: visible;
    transform: translateX(-50%);
    z-index: 3;
  }

  .home .coffee-section__heading {
    display: none;
  }

  .home .coffee-section__heading-bg {
    left: 50%;
    top: 848px;
    bottom: auto;
    font-size: clamp(60px, calc(-78.675996px + 13.993541vw), 190px);
    line-height: 0.94;
    color: transparent;
    -webkit-text-stroke: 1px var(--white);
    opacity: 1;
    transform: translateX(-50%);
    z-index: 5;
  }

  .home .coffee-section__content .label-tag {
    display: block;
    margin: 0 0 7px;
    font-size: clamp(14px, calc(9.733046px + 0.430571vw), 18px);
    line-height: 1;
    letter-spacing: 0;
  }

  .home .coffee-section__subheading {
    display: flex;
    flex-direction: column;
    margin: 0 0 17px;
    font-size: clamp(32px, calc(2.131324px + 3.013994vw), 60px);
    line-height: 1.1;
  }

  .home .coffee-section__subheading span + span {
    color: transparent;
    -webkit-text-stroke: 1px var(--white);
  }

  .home .coffee-divider {
    width: 28.207px;
    height: 2px;
    margin: 0 0 28px;
    background: var(--gold);
  }

  .home .coffee-section__text {
    width: min(257px, calc(100% - min(48px, 12.8vw)));
    max-width: min(257px, calc(100% - min(48px, 12.8vw)));
    margin: 0 0 14px;
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
    line-height: 1;
    color: var(--white);
  }

  .home .coffee-section__content .btn-gold {
    position: absolute;
    left: min(22px, 5.867vw);
    top: 436px;
    min-width: 116px;
    height: 50.597px;
    margin: 0;
    padding: 0 25.299px;
    border-radius: 12.649px;
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    line-height: 1;
  }

  .home .coffee-section__image {
    position: absolute;
    left: 50%;
    top: 299px;
    width: 100vw;
    height: min(692px, 184.533vw);
    overflow: hidden;
    transform: translateX(-50%);
    z-index: 1;
  }

  .home .coffee-section__img-wrap {
    position: absolute;
    inset: 0;
  }

  .home .coffee-section__img-wrap img,
  .home .coffee-section__video-el {
    position: absolute;
    left: -102.1%;
    top: 0.02%;
    width: 346.41%;
    height: 99.98%;
    max-width: none;
    object-fit: cover;
  }

  .home .coffee-play-btn {
    position: absolute;
    left: 50%;
    top: min(389px, 103.733vw);
    width: 30.933vw;
    height: min(116px, 30.933vw);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.62);
    backdrop-filter: blur(2px);
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, -50%);
    z-index: 6;
  }

  .home .coffee-play-btn svg {
    width: 11.733vw;
    height: min(50px, 13.333vw);
  }

  .home .coffee-play-btn svg path {
    fill: var(--dark-red);
    stroke: var(--dark-red);
  }

  .home .brands-section {
    height: 2457px;
    margin-top: 70px;
    background: #000000;
    overflow: hidden;
  }

  .home .brands-section__inner {
    position: relative;
    display: block;
    width: 100%;
    height: 2457px;
    margin: 0;
    min-height: 0;
  }

  .home .brands-section__left {
    position: absolute;
    left: min(49px, 13.067vw);
    top: 62px;
    width: 74.4vw;
    padding: 0;
    background: transparent;
  }

  .home .brands-section__left .label-tag {
    display: block;
    margin: 0 0 7px;
    font-size: clamp(12px, calc(9.866523px + 0.215285vw), 14px);
    line-height: 1;
    letter-spacing: 0;
  }

  .home .brands-section__heading {
    margin: 0 0 38px;
    font-size: clamp(28px, calc(23.733046px + 0.430571vw), 32px);
    line-height: 1.1;
    color: var(--white);
  }

  .home .brands-section__heading span {
    color: transparent;
    -webkit-text-stroke: 1px var(--white);
  }

  .home .b2b-section__heading,
  .home .partner-section__heading,
  .home .blog-section__heading {
    font-size: clamp(38px, calc(14.531755px + 2.368138vw), 60px);
  }

  .home .brands-section__text {
    width: 74.4vw;
    max-width: 74.4vw;
    margin-top: 0;
    font-size: clamp(11px, calc(9.933262px + 0.107643vw), 12px);
    line-height: 1;
    color: var(--white);
  }

  .home .brands-right {
    position: absolute;
    left: 50%;
    top: 453px;
    width: 87.2vw;
    display: flex;
    flex-direction: column;
    gap: 24px;
    transform: translateX(-50%);
  }

  /* Desktop idle + hover card are not used on mobile */
  .home .brand-row__idle,
  .home .brand-row__card {
    display: none;
  }

  /* On mobile, each brand row IS the tall colored card */
  .home .brand-row {
    position: relative;
    display: block;
    width: 100%;
    min-height: 0;
    border-radius: 20px;
    overflow: hidden;
    background: transparent;
  }

  /* Plain text band (legacy, no card content) */
  .home .brand-row--text:not([data-brand-row]) {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    border-radius: 20px;
    background: var(--card-color, var(--gray));
  }

  /* ---- The card (default = centered name; tap to reveal details) ----
     Flow layout: height grows with content, never fixed. */
  .home .brand-card__mobile {
    display: flex;
    flex-direction: column;
    position: relative;
    width: 100%;
    min-height: 644px;
    border-radius: 20px;
    overflow: hidden;
    background: var(--card-color, #cf1721);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  /* When open, the card sizes to its content */
  .home .brand-row.is-open .brand-card__mobile {
    min-height: 0;
  }

  /* Default face: brand name centered, fills the card */
  .home .brand-card__mobile-name {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 24px;
    text-align: center;
    font-size: clamp(32px, calc(28.73578px + 0.329386vw), 35.06px);
    font-weight: 900;
    line-height: 1.1;
    color: var(--cream);
  }
  .home .brand-row.is-open .brand-card__mobile-name {
    display: none;
  }

  /* Detail face: stacked flow, hidden until open */
  .home .brand-card__mobile-detail {
    display: none;
    flex-direction: column;
  }
  .home .brand-row.is-open .brand-card__mobile-detail {
    display: flex;
  }

  .home .brand-card__mobile-title {
    margin: 0;
    padding: 40px 24px 0;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.1;
    color: var(--white);
  }

  .home .brand-card__mobile-text {
    margin: 16px 0 0;
    padding: 0 24px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--white);
  }

  .home .brand-card__mobile-btn {
    margin: 24px 24px 40px;
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 89px;
    height: 50.597px;
    padding: 0 25.299px;
    border-radius: 12.649px;
    background: var(--black);
    color: var(--cream);
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
  }

  .home .brand-card__mobile-image {
    margin-top: auto;
    width: 100%;
    aspect-ratio: 327 / 318;
    overflow: hidden;
  }

  .home .brand-card__mobile-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    pointer-events: none;
  }

  .home .products-section {
    padding: 72px 0 64px;
    overflow: hidden;
    position: relative;
    z-index: 901;
  }

  .home .products-section .container {
    width: 100%;
    max-width: none;
    padding-left: var(--gutter);
    padding-right: 0;
    overflow: visible;
  }

  .home .products-section__header {
    gap: 18px;
    margin-bottom: 32px;
    padding-right: var(--gutter);
  }

  .home .products-section__heading {
    font-size: clamp(32px, calc(2.131324px + 3.013994vw), 60px);
  }

  .home .products-filter-tabs {
    display: flex;
    gap: 8px;
    width: calc(100% + var(--gutter));
    overflow-x: auto;
    overflow-y: hidden;
    flex-wrap: nowrap;
    padding: 0 var(--gutter) 4px 0;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .home .products-filter-tabs::-webkit-scrollbar {
    display: none;
  }

  .home .products-filter-tabs a,
  .home .products-filter-tabs button {
    width: 155px;
    height: 45px;
    display: inline-flex;
    flex: 0 0 155px;
    align-items: center;
    justify-content: center;
    padding: 0 14px;
    border-radius: 15px;
    background: var(--cream-light);
    color: var(--white);
    font-size: clamp(14px, calc(12.933262px + 0.107643vw), 15px);
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
  }

  .home .products-filter-tabs a.is-active,
  .home .products-filter-tabs button.is-active {
    background: var(--black);
  }

  .home .products-carousel-shell {
    overflow: visible;
  }

  .home .products-slider,
  .home .products-slider.slick-initialized,
  .home .products-slider.slick-initialized .slick-list {
    overflow: visible;
  }

  .home .product-slide {
    width: 79.47vw !important;
    max-width: 300px;
    padding: 0 20px 0 0;
    box-sizing: border-box;
  }

  .home .product-slide .rs-shop-card {
    width: 300px;
    max-width: 300px;
  }

  .home .products-arrow {
    width: 46px;
    height: 70px;
  }

  .home .products-arrow--prev {
    left: -6px;
    display: none;
  }

  .home .products-arrow--next {
    right: -6px;
    display: none;
  }

  .home .products-section__footer {
    display: block;
    position: relative;
    height: 158px;
    margin-top: 46px;
    padding-right: var(--gutter);
    text-align: left;
  }

  .home .products-nav-bottom {
    position: absolute;
    top: 0;
    left: 0;
    right: var(--gutter);
    bottom: auto;
    width: auto;
    display: block;
  }

  .home .products-nav-bottom .js-slide-current {
    position: absolute;
    top: 0;
    right: 0;
    color: var(--gold);
    font-size: clamp(18px, calc(15.866523px + 0.215285vw), 20px);
    line-height: 1;
  }

  .home .products-progress-track {
    display: block;
    position: absolute;
    top: 36px;
    left: 0;
    width: 100%;
    height: 1px;
    background: var(--gold);
  }

  .home .products-progress-thumb {
    top: -2px;
    height: 5px;
    background: var(--black);
    border: 1px solid var(--gold);
  }

  .home .products-section__footer .btn-gold {
    position: absolute;
    top: 107px;
    left: calc(50% - (var(--gutter) / 2));
    transform: translateX(-50%);
    margin: 0;
  }

  .home .b2b-section {
    height: auto;
    min-height: 0;
    margin-top: 0;
    padding: 57px 0 0;
    background: var(--cream);
    overflow: hidden;
  }

  .home .b2b-section .container {
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
    padding-inline: 0;
  }

  .home .b2b-section__header {
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
    margin: 0 0 45px;
    padding: 0 24px;
  }

  .home .b2b-section__header .label-tag {
    display: block;
    margin: 0 0 8px;
    color: var(--gold);
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 700;
    line-height: 1;
  }

  .home .b2b-section__heading {
    position: relative;
    margin: 0 0 45px;
    color: var(--black);
    font-size: clamp(32px, calc(2.131324px + 3.013994vw), 60px);
    font-weight: 900;
    line-height: 1.1;
    white-space: nowrap;
  }

  .home .b2b-section__heading span {
    color: transparent;
    -webkit-text-stroke: 1px var(--black);
  }

  .home .b2b-section__heading::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -17px;
    width: 55px;
    height: 3px;
    background: var(--gold);
  }

  .home .b2b-section__text {
    position: static;
    width: min(327px, calc(100vw - 48px));
    max-width: none;
    margin: 0;
    color: var(--black);
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
    font-weight: 400;
    line-height: 1;
  }

  .home .b2b-section__header .btn-gold {
    display: none;
  }

  .home .b2b-cards {
    width: 100%;
    height: auto;
    min-height: 0;
    padding-left: 0;
    display: block;
  }

  .home .b2b-card {
    position: relative;
    width: 100%;
    height: 590px;
    min-height: 0;
    overflow: hidden;
    display: block;
  }

  .home .b2b-card:nth-child(1) {
    height: 589px;
  }

  .home .b2b-card:nth-child(2) {
    height: 599px;
  }

  .home .b2b-card:nth-child(4) {
    height: 591px;
  }

  .home .b2b-card__bg,
  .home .b2b-card__overlay,
  .home .b2b-card__overlay--light {
    display: none;
  }

  .home .b2b-card__mobile-bg {
    display: block;
    position: absolute;
    inset: 0;
    overflow: hidden;
    z-index: 0;
  }

  .home .b2b-card__mobile-bg img {
    position: absolute;
    display: block;
    max-width: none;
    object-fit: fill;
  }

  .home .b2b-card:nth-child(1) .b2b-card__mobile-bg img {
    left: -37.33%;
    top: -100.49%;
    width: 473.5%;
    height: 201.12%;
  }

  .home .b2b-card:nth-child(2) .b2b-card__mobile-bg img {
    left: -53.1%;
    top: -3.06%;
    width: 318.4%;
    height: 122.91%;
  }

  .home .b2b-card:nth-child(3) .b2b-card__mobile-bg img {
    left: -45.91%;
    top: -13.41%;
    width: 268.84%;
    height: 114.21%;
  }

  .home .b2b-card:nth-child(4) .b2b-card__mobile-bg img {
    left: -54.11%;
    top: -15.28%;
    width: 279.11%;
    height: 118.97%;
  }

  .home .b2b-card::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
  }

  .home .b2b-card--mobile-dark::after {
    background: rgba(35, 31, 32, 0.51);
  }

  .home .b2b-card--mobile-light::after {
    background: rgba(225, 215, 187, 0.54);
  }

  .home .b2b-card--mobile-red::after {
    background: rgba(89, 40, 40, 0.62);
  }

  .home .b2b-card--mobile-gold::after {
    background: rgba(133, 117, 78, 0.68);
  }

  .home .b2b-card__mobile-icon {
    display: block;
    position: absolute;
    z-index: 2;
    max-width: none;
    overflow: visible;
    object-fit: contain;
  }

  .home .b2b-card:nth-child(1) .b2b-card__mobile-icon {
    top: 97px;
    left: 50%;
    width: 97px;
    height: 97px;
    --stroke-0: var(--white);
    --fill-0: var(--white);
    transform: translateX(-50%);
    z-index: 4;
  }

  .home .b2b-card:nth-child(2) .b2b-card__mobile-icon {
    top: 69px;
    left: calc(50% - 48.5px);
    width: 98.333px;
    height: 123.895px;
    --stroke-0: var(--white);
    --fill-0: var(--white);
    z-index: 4;
  }

  .home .b2b-card:nth-child(3) .b2b-card__mobile-icon {
    top: 115px;
    left: calc(50% - 72.5px);
    width: 123px;
    height: 115px;
    --stroke-0: var(--white);
    --fill-0: var(--white);
    z-index: 4;
  }

  .home .b2b-card:nth-child(4) .b2b-card__mobile-icon {
    top: 92px;
    left: calc(50% - 30.5px);
    width: 57px;
    height: 141px;
    --stroke-0: var(--white);
    --fill-0: var(--white);
    z-index: 4;
  }

  .home .b2b-card__mobile-panel {
    display: block;
    position: absolute;
    top: 174px;
    left: 50%;
    z-index: 3;
    width: min(321px, calc(100vw - 54px));
    height: 293px;
    border-radius: 20px;
    box-shadow: 32px 26px 104.1px rgba(0, 0, 0, 0.55);
    transform: translateX(-50%);
  }

  .home .b2b-card:nth-child(2) .b2b-card__mobile-panel {
    top: 172px;
  }

  .home .b2b-card--mobile-dark .b2b-card__mobile-panel {
    background: var(--black);
    color: var(--white);
  }

  .home .b2b-card--mobile-light .b2b-card__mobile-panel {
    background: var(--cream);
    color: var(--black);
  }

  .home .b2b-card--mobile-red .b2b-card__mobile-panel {
    background: var(--dark-red, #592828);
    color: var(--white);
  }

  .home .b2b-card--mobile-gold .b2b-card__mobile-panel {
    background: var(--gold);
    color: var(--white);
  }

  .home .b2b-card__mobile-title {
    position: absolute;
    top: 48px;
    left: 50%;
    width: max-content;
    max-width: calc(100% - 32px);
    margin: 0;
    color: currentColor;
    font-size: clamp(42px, calc(22.798708px + 1.937567vw), 60px);
    font-weight: 900;
    line-height: 0.8476;
    text-align: center;
    transform: translateX(-50%);
    white-space: nowrap;
  }

  .home .b2b-card:nth-child(3) .b2b-card__mobile-title,
  .home .b2b-card:nth-child(4) .b2b-card__mobile-title {
    top: 94px;
  }

  .home .b2b-card__mobile-text {
    position: absolute;
    top: 149px;
    left: 50%;
    width: min(271px, calc(100% - 50px));
    height: 76px;
    margin: 0;
    color: currentColor;
    font-size: clamp(16px, calc(11.733046px + 0.430571vw), 20px);
    font-weight: 400;
    line-height: 1;
    text-align: center;
    transform: translateX(-50%);
    overflow: hidden;
  }

  .home .b2b-card__mobile-btn {
    position: absolute;
    top: 263px;
    left: 50%;
    width: 134px;
    height: 60px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    color: var(--white);
    background: var(--gold);
    font-size: clamp(16px, calc(11.733046px + 0.430571vw), 20px);
    font-weight: 700;
    line-height: 1;
    transform: translateX(-50%);
  }

  .home .b2b-card--mobile-light .b2b-card__mobile-btn {
    background: var(--black);
    color: var(--cream);
  }

  .home .b2b-card--mobile-red .b2b-card__mobile-btn {
    background: var(--white);
    color: #592828;
  }

  .home .b2b-card--mobile-gold .b2b-card__mobile-btn {
    background: var(--white);
    color: var(--gold);
  }

  .home .b2b-card__title {
    display: none;
  }

  .home .partner-section {
    height: auto;
    min-height: 0;
    margin-top: 0;
    padding: 72px 0;
  }

  .home .partner-section .container {
    display: grid;
    grid-template-columns: 1fr;
    gap: 42px;
    height: auto;
    padding-inline: 0;
  }

  .home .partner-section__content {
    position: static;
    width: min(100%, 620px);
    max-width: none;
    padding-inline: var(--gutter);
  }

  .home .partner-section__heading {
    margin-bottom: 18px;
    line-height: 1.05;
    white-space: normal;
  }

  .home .partner-section__text {
    width: 100%;
    max-width: 620px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.78);
  }

  .home .partner-form {
    position: static;
    width: 100%;
    max-width: 920px;
    padding-inline: var(--gutter);
    color: var(--white);
  }

  .home .partner-form__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px clamp(28px, 5vw, 56px);
  }

  .home .partner-form input[type="text"],
  .home .partner-form input[type="tel"],
  .home .partner-form input[type="email"] {
    width: 100%;
    height: 34px;
  }

  .home .partner-form__submit-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
  }

  .home .awards-section {
    height: auto;
    padding: 54px 0;
  }

  .home .awards-section .container {
    width: calc(100% - (var(--gutter) * 2));
  }

  .home .awards-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px 24px;
  }

  .home .award-item {
    flex-direction: row;
    justify-content: flex-start;
    gap: 18px;
  }

  .home .award-item__image {
    width: 110px;
    height: 108px;
  }

  .home .award-item__title {
    width: auto;
    font-size: clamp(22px, calc(13.466093px + 0.861141vw), 30px);
    line-height: 1;
    text-align: left;
  }

  .home .blog-section {
    height: auto;
    overflow: hidden;
  }

  .home .blog-section__inner {
    display: grid;
    grid-template-columns: 1fr;
    gap: 34px;
    height: auto;
    padding: 64px var(--gutter);
  }

  .home .blog-section__left {
    position: static;
    width: min(100%, 620px);
    padding: 0;
  }

  .home .blog-section__heading {
    margin-bottom: 24px;
  }

  .home .blog-section__intro {
    max-width: 590px;
    line-height: 1.45;
  }

  .home .blog-section__left .btn-gold {
    position: static;
    margin-top: 30px;
  }

  .home .blog-grid {
    position: static;
    display: grid;
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .home .blog-card,
  .home .blog-card:nth-child(1),
  .home .blog-card:nth-child(2),
  .home .blog-card:nth-child(3) {
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
    height: clamp(260px, 44vw, 360px);
    margin-top: 0;
  }

  .home .blog-card__body {
    padding: 30px 28px;
  }

  .home .blog-card__title {
    font-size: clamp(22px, calc(9.199139px + 1.291712vw), 34px);
  }

  .home .upper-footer {
    height: clamp(520px, 82vw, 720px);
    min-height: 0;
    padding: 0;
  }

  .home .upper-footer__bg {
    background-position: center;
  }

  .home .upper-footer__inner {
    position: absolute;
    left: 0;
    top: 54%;
    width: 100%;
    max-width: none;
    padding: 0;
    transform: translateY(-50%);
  }

  .home .upper-footer__text {
    padding-right: 72px;
    font-size: clamp(72px, calc(7.995694px + 6.458558vw), 132px);
    line-height: 1;
  }

  /*
   * Mobile typography endpoints:
   * 991px = Figma mobile value, 1920px = existing desktop value.
   */
  .header-topbar__message,
  .home .header-topbar__message {
    font-family: var(--font);
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
  }

  .header-nav__mobile-menu a {
    font-family: var(--font);
    font-size: clamp(16px, calc(16px + 0vw), 16px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .header-nav__mobile-menu .sub-menu a {
    font-family: var(--font);
    font-size: clamp(14px, calc(14px + 0vw), 14px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
  }

  .footer-nav a {
    font-family: var(--font);
    font-size: clamp(18px, calc(18px + 0vw), 18px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .footer-newsletter__title {
    font-family: var(--font);
    font-size: clamp(24px, calc(24px + 0vw), 24px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .footer-newsletter__input-wrap label,
  .footer-newsletter__input-wrap input {
    font-family: var(--font);
    font-size: clamp(16px, calc(16px + 0vw), 16px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
  }

  .footer-newsletter__checkbox {
    font-family: var(--font);
    font-size: clamp(14px, calc(14px + 0vw), 14px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
  }

  .footer-bottom__links a,
  .footer-copy {
    font-family: var(--font);
    font-size: clamp(12px, calc(12px + 0vw), 12px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .btn-view-more,
  .home .btn-gold {
    font-family: var(--font);
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .home-eshop-tab {
    font-family: var(--font);
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .hero-slide__title {
    font-family: var(--font);
    font-size: clamp(55px, calc(-46.340151px + 10.22605vw), 150px);
    font-weight: 900;
    line-height: 0.89;
    letter-spacing: clamp(1.1px, calc(-0.926803px + 0.204521vw), 3px);
  }

  .home .hero-slide__desc {
    font-family: var(--font);
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: 0;
  }

  .home .hero-slide__cta .btn-view-more {
    font-family: var(--font);
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .trophy-item__title {
    font-family: var(--font);
    font-size: clamp(14px, calc(9.733046px + 0.430571vw), 18px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .coffee-section__heading-bg {
    font-family: var(--font);
    font-size: clamp(60px, calc(-78.675996px + 13.993541vw), 190px);
    font-weight: 900;
    line-height: 0.94;
    letter-spacing: 0;
  }

  .home .coffee-section__content .label-tag {
    font-family: var(--font);
    font-size: clamp(14px, calc(9.733046px + 0.430571vw), 18px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .coffee-section__subheading {
    font-family: var(--font);
    font-size: clamp(32px, calc(2.131324px + 3.013994vw), 60px);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: 0;
  }

  .home .coffee-section__text {
    font-family: var(--font);
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .coffee-section__content .btn-gold {
    font-family: var(--font);
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .brands-section__left .label-tag {
    font-family: var(--font);
    font-size: clamp(14px, calc(9.733046px + 0.430571vw), 18px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .brands-section__heading {
    font-family: var(--font);
    font-size: clamp(32px, calc(2.131324px + 3.013994vw), 60px);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: 0;
  }

  .home .brands-section__text {
    font-family: var(--font);
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .brand-row__maison-text {
    font-family: var(--font);
    font-size: clamp(32px, calc(28.73578px + 0.329386vw), 35.06px);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: 0;
  }

  .home .brand-card__mobile-title {
    font-family: var(--font);
    font-size: clamp(28px, calc(23.733046px + 0.430571vw), 32px);
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .brand-card__mobile-text {
    font-family: var(--font);
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .brand-card__mobile-btn {
    font-family: var(--font);
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .products-section__heading {
    font-family: var(--font);
    font-size: clamp(32px, calc(2.131324px + 3.013994vw), 60px);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: 0;
  }

  .home .products-filter-tabs a,
  .home .products-filter-tabs button {
    font-family: var(--font);
    font-size: clamp(14px, calc(12.933262px + 0.107643vw), 15px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .products-nav-bottom .js-slide-current {
    font-family: var(--font);
    font-size: clamp(18px, calc(15.866523px + 0.215285vw), 20px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .products-section .rs-shop-card__badge {
    font-family: var(--font);
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .products-section .rs-shop-card__title {
    font-family: var(--font);
    font-size: clamp(18px, calc(11.599569px + 0.645856vw), 24px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0;
  }

  .home .products-section .rs-shop-card__desc,
  .home .products-section .rs-shop-card__old {
    font-family: var(--font);
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 400;
    letter-spacing: 0;
  }

  .home .products-section .rs-shop-card__desc {
    line-height: 1.35;
  }

  .home .products-section .rs-shop-card__old {
    line-height: 1;
  }

  .home .products-section .rs-shop-card__price {
    font-family: var(--font);
    font-size: clamp(24px, calc(19.733046px + 0.430571vw), 28px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .products-section .rs-shop-card__discount {
    font-family: var(--font);
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .products-section .rs-shop-card__offer,
  .home .products-section .rs-shop-card__offer-text {
    font-family: var(--font);
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .b2b-section__header .label-tag {
    font-family: var(--font);
    font-size: clamp(14px, calc(9.733046px + 0.430571vw), 18px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .b2b-section__heading {
    font-family: var(--font);
    font-size: clamp(32px, calc(2.131324px + 3.013994vw), 60px);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: 0;
  }

  .home .b2b-section__text {
    font-family: var(--font);
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .b2b-card__mobile-title {
    font-family: var(--font);
    font-size: clamp(42px, calc(42px + 0vw), 42px);
    font-weight: 900;
    line-height: 0.8476;
    letter-spacing: 0;
  }

  .home .b2b-card__mobile-text {
    font-family: var(--font);
    font-size: clamp(16px, calc(16px + 0vw), 16px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .b2b-card__mobile-btn {
    font-family: var(--font);
    font-size: clamp(16px, calc(16px + 0vw), 16px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .partner-section {
    position: relative;
    height: 765px;
    min-height: 765px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: var(--black);
  }

  .home .partner-section__bg,
  .home .partner-section__links {
    display: none;
  }

  .home .partner-section .container {
    position: relative;
    display: block;
    width: 100%;
    max-width: none;
    height: 765px;
    margin: 0;
    padding: 0;
  }

  .home .partner-section__content {
    position: absolute;
    left: calc(var(--home-mobile-canvas-x, 0px) + 24px);
    top: 93px;
    width: min(311px, calc(100vw - 48px));
    max-width: none;
    margin: 0;
    padding: 0;
  }

  .home .partner-section__content .label-tag {
    display: block;
    margin: 0 0 25px;
    color: var(--gold);
    font-family: var(--font);
    font-size: clamp(14px, calc(9.733046px + 0.430571vw), 18px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    text-transform: none;
  }

  .home .partner-section__heading {
    margin: 0 0 16px;
    color: var(--white);
    font-family: var(--font);
    font-size: clamp(32px, calc(2.131324px + 3.013994vw), 60px);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: 0;
    white-space: nowrap;
  }

  .home .partner-section__heading span {
    color: transparent;
    -webkit-text-stroke: 1px var(--white);
    text-shadow: none;
  }

  .home .partner-section__text {
    width: min(311px, calc(100vw - 48px));
    max-width: none;
    height: 74px;
    margin: 0;
    color: var(--white);
    font-family: var(--font);
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
    overflow: hidden;
  }

  .home .partner-form {
    position: absolute;
    left: calc(var(--home-mobile-canvas-x, 0px) + 24px);
    top: 327px;
    width: min(327px, calc(100vw - 48px));
    max-width: none;
    margin: 0;
    padding: 0;
    color: var(--white);
  }

  .home .partner-form__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    width: 100%;
  }

  .home .partner-form__field {
    display: block;
    width: 100%;
    height: 70px;
    min-width: 0;
    margin: 0;
    padding: 0;
    color: var(--white);
  }

  .home .partner-form__field--name {
    order: 1;
  }

  .home .partner-form__field--company-type {
    order: 2;
  }

  .home .partner-form__field--email {
    order: 3;
  }

  .home .partner-form__field--company-name {
    order: 4;
  }

  .home .partner-form__field--phone {
    order: 5;
  }

  .home .partner-form input[type="text"],
  .home .partner-form input[type="tel"],
  .home .partner-form input[type="email"] {
    display: block;
    width: 100%;
    height: 22px;
    margin: 0;
    padding: 0 0 7px;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: var(--white);
    font-family: var(--font);
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
    outline: none;
  }

  .home .partner-form input::placeholder {
    color: var(--white);
    opacity: 1;
  }

  .home .partner-form__submit-row {
    order: 6;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    height: 24px;
    margin-top: 3px;
  }

  .home .partner-form__terms {
    display: inline-flex !important;
    align-items: center;
    gap: 10px;
    width: auto;
    min-width: 0;
    height: 24px;
    margin: 0;
    padding: 0;
    color: var(--white);
  }

  .home .partner-form__terms input[type="checkbox"] {
    position: relative;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    margin: 0;
    border: 1.3px solid var(--white);
    border-radius: 50%;
    background: transparent;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
  }

  .home .partner-form__terms input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    inset: 5px;
    border-radius: 50%;
    background: var(--gold);
  }

  .home .partner-form__terms span {
    margin: 0 !important;
    color: var(--white);
    font-family: var(--font);
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
    white-space: nowrap;
  }

  .home .partner-form button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    height: 24px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--gold);
    font-family: var(--font);
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    cursor: pointer;
  }

  .home .partner-form button svg {
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    transform: rotate(20.1deg);
    transform-origin: center;
  }

  .home .awards-section {
    height: 691px;
    min-height: 691px;
    padding: 0;
    overflow: hidden;
    background: var(--cream);
  }

  .home .awards-section .container {
    position: relative;
    width: 100%;
    max-width: none;
    height: 100%;
    margin: 0;
    padding: 0;
  }

  .home .awards-grid {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
  }

  .home .award-item {
    position: absolute;
    left: calc(var(--home-mobile-canvas-x, 0px) + 12px);
width: 489.909px;
    height: 115.421px;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 15.264px;
    margin: 0;
    text-align: left;
  }

  .home .award-item:nth-child(1) {
    top: -290px;
  }

  .home .award-item:nth-child(2) {
        top: -120.47px;
  }

  .home .award-item:nth-child(3) {
    top: 62.05px;
  }

  .home .award-item:nth-child(4) {
            top: 238.58px;
  }

  .home .award-item__image {
    flex: 0 0 105.546px;
    width: 105.546px;
    height: auto;
    margin: 0;
  }

  .home .award-item__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 1;
  }

  .home .award-item__title {
width: 225.099px;
            margin: 15.63px 0 0;
    color: var(--gold);
    font-family: var(--font);
    font-size: clamp(20px, calc(23.733046px + 0.430571vw), 26px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    text-align: left;
    overflow-wrap: normal;
  }

  .home .home-blog-ritual {
    position: relative;
    width: 100%;
    max-width: none;
    height: 1736px;
    min-height: 1736px;
    margin: 0;
    overflow: hidden;
    background: var(--cream);
  }

  .home .home-blog-ritual::before {
    content: "";
    position: absolute;
    left: 0;
    top: 376px;
    width: 100%;
    height: 1359px;
    background-image: url("/wp-content/uploads/rossetti/blog-ritual-mobile-bg.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top;
    z-index: 0;
  }

  .home .home-blog-ritual::after {
    content: "";
    position: absolute;
    left: 0;
    top: 376px;
    width: 100%;
    height: 1360px;
    background: linear-gradient(
      180deg,
      rgba(35, 31, 32, 0) 0%,
      var(--black) 100%
    );
    z-index: 0;
    pointer-events: none;
  }

  .home .blog-section {
    position: relative;
    height: 1402px;
    min-height: 1402px;
    padding: 0;
    overflow: visible;
    background: transparent;
  }

  .home .blog-section::before,
  .home .blog-section::after {
    content: none;
    display: none;
  }

  .home .blog-section__inner {
    position: relative;
    display: block;
    width: 100%;
    max-width: none;
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    z-index: 1;
    margin-top: 50px;
  }

  .home .blog-section__left {
    display: block;
    position: static;
    width: auto;
    max-width: none;
    padding: 0;
  }

  .home .blog-section__left .label-tag {
    position: absolute;
    left: var(--gutter);
    top: 0;
    margin: 0;
    color: var(--gold);
    font-family: var(--font);
    font-size: clamp(14px, calc(9.733046px + 0.430571vw), 18px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    text-transform: none;
  }

  .home .blog-section__heading {
    position: absolute;
    left: var(--gutter);
    top: 21px;
    width: 87.2vw;
    margin: 0;
    color: var(--black);
    font-family: var(--font);
    font-size: clamp(32px, calc(2.131324px + 3.013994vw), 60px);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: 0;
    white-space: nowrap;
  }

  .home .blog-section__heading::after {
    content: "";
    position: absolute;
    left: 0;
    top: 86px;
    width: 55px;
    height: 3px;
    background: var(--gold);
  }

  .home .blog-section__heading span {
    color: transparent;
    -webkit-text-stroke: 1px var(--black);
    text-shadow: none;
  }

  .home .blog-section__intro {
    position: absolute;
    left: var(--gutter);
    top: 137px;
    width: 76.3vw;
    max-width: none;
    margin: 0;
    color: var(--black);
    font-family: var(--font);
    font-size: clamp(12px, calc(7.733046px + 0.430571vw), 16px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .blog-section__left .btn-gold {
    position: absolute;
    left: 50%;
    top: 1347px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 89px;
    height: 50.597px;
    margin: 0;
    padding: 0 25.299px;
    border-radius: 12.649px;
    background: var(--gold);
    color: var(--white);
    font-family: var(--font);
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    transform: translateX(-50%);
    z-index: 3;
  }

  .home .blog-grid {
    position: absolute;
    left: var(--gutter);
    top: 223px;
    display: block;
    width: 87.2vw;
    height: 1054px;
    margin: 0;
    z-index: 2;
  }

  .home .blog-card,
  .home .blog-card:nth-child(1),
  .home .blog-card:nth-child(2),
  .home .blog-card:nth-child(3) {
    position: absolute;
    left: 0;
    width: 326.854px;
    height: 317.752px;
    margin: 0;
    overflow: visible;
    border-radius: 9.713px;
    background: transparent;
  }

  .home .blog-card:nth-child(1) {
    top: 0;
  }

  .home .blog-card:nth-child(2) {
    top: 368px;
  }

  .home .blog-card:nth-child(3) {
    top: 736px;
  }

  .home .blog-card__inner {
    position: absolute;
    inset: 0;
    overflow: visible;
    border-radius: 9.713px;
    clip-path: none;
    transition: none;
  }

  .home .blog-card:hover .blog-card__inner {
    clip-path: none;
    transform: none;
  }

  .home .blog-card__inner::before {
    content: "";
    position: absolute;
    left: -18.34px;
    top: -7.97px;
    width: 380.339px;
    height: 371.237px;
    background-image: url("/wp-content/uploads/rossetti/blog-mobile-card-figma.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    z-index: 0;
    pointer-events: none;
  }

  .home .blog-card__image {
    display: none;
  }

  .home .blog-card__body {
    position: absolute;
    left: 0;
    top: 0;
    width: 327px;
    height: 259.01px;
    padding: 25.25px 22.66px;
    border-radius: 9.713px;
    background: transparent;
    z-index: 1;
  }

  .home .blog-card__body::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 9.713px;
    background: linear-gradient(
      180deg,
      var(--black) 0%,
      rgba(35, 31, 32, 0.58) 43%,
      rgba(35, 31, 32, 0) 100%
    );
    mix-blend-mode: multiply;
    pointer-events: none;
    z-index: 0;
  }

  .home .blog-card__title {
    position: relative;
    width: 213.036px;
    max-width: 213.036px;
    margin: 0;
    color: var(--white);
    font-family: var(--font);
    font-size: 0;
    font-weight: 700;
    line-height: 0;
    letter-spacing: 0;
    z-index: 1;
  }

  .home .blog-card__title::before {
    content: "Lorem ipsum dolor sit amepsum dolo";
    display: block;
    color: var(--white);
    font-family: var(--font);
    font-size: clamp(20.721px, calc(8.689257px + 1.214101vw), 32px);
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0;
  }

  .home .blog-card__btn {
    right: 0;
    bottom: 0;
    width: 113px;
    height: 39px;
    justify-content: center;
    gap: 8px;
    padding: 0 9px;
    border-radius: 6.475px;
    background: var(--gold);
    color: var(--white);
    transition: none;
  }

  .home .blog-card:hover .blog-card__btn {
    width: 113px;
  }

  .home .blog-card__btn-text,
  .home .blog-card:hover .blog-card__btn-text {
    max-width: none;
    opacity: 1;
    overflow: visible;
    color: var(--white);
    font-family: var(--font);
    font-size: clamp(14px, calc(11.866523px + 0.215285vw), 16px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    white-space: nowrap;
  }

  .home .blog-card__btn svg {
    width: 20.6px;
    height: 14.466px;
  }

  .home .upper-footer {
    position: relative;
    height: 334px;
    min-height: 334px;
    margin: 0;
    padding: 0;
    overflow: visible;
    background: transparent;
  }

  .home .upper-footer__bg {
    display: none;
  }

  .home .upper-footer::after {
    content: none;
    display: none;
  }

  .home .upper-footer__inner {
    position: absolute;
    left: var(--gutter);
    top: 68px;
    width: calc(100% - var(--gutter));
    max-width: none;
    height: auto;
    margin: 0;
    padding: 0;
    overflow: visible;
    transform: none;
    z-index: 1;
  }

  .home .upper-footer__marquee {
    display: block;
    width: 100%;
    margin: 0;
    animation: none;
  }

  .home .upper-footer__text {
    display: block;
    width: 100%;
    padding: 0;
    color: transparent;
    -webkit-text-stroke: 1px var(--white);
    font-family: var(--font);
    font-size: clamp(70px, calc(-26.006459px + 9.687836vw), 160px);
    font-weight: 700;
    line-height: 0.94;
    letter-spacing: 0;
    text-transform: uppercase;
    white-space: normal;
  }

  .home .upper-footer__text + .upper-footer__text {
    display: none;
  }

  .site-breadcrumb {
    display: none;
  }

  .tc-awards__grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
    margin-top: 80px;
  }

  .tc-award {
    display: grid;
    grid-template-columns: 98px 98px;
    gap: 18px;
    align-items: center;
    justify-content: center;
  }

  /* The Coffee mobile frame */
  .coffee-page-template .site-header,
  .coffee-page-template .header-nav,
  .coffee-page-template .header-nav__mobile-panel {
    background: var(--black);
  }

  .coffee-page-template .header-nav__mobile-toggle,
  .coffee-page-template .header-nav .icon-btn {
    color: var(--white);
  }

  .coffee-page-template .header-nav__mobile-toggle span {
    background: currentColor;
  }

  .coffee-page-template .tc-page {
    background: var(--cream);
  }

  .coffee-page-template .tc-kicker {
    font-size: 14px;
    line-height: 1;
    margin-bottom: 14px;
  }

  .coffee-page-template .tc-copy h2,
  .coffee-page-template .tc-quality h2,
  .coffee-page-template .tc-training h2,
  .coffee-page-template .tc-sustainability h2 {
    font-size: 32px;
    line-height: 1.1;
    letter-spacing: 0;
    margin-bottom: 20px;
  }

  .coffee-page-template .tc-page p {
    font-size: 12px;
    line-height: 1.42;
  }

  .coffee-page-template .tc-hero {
    min-height: 212px;
  }

  .coffee-page-template .tc-hero__title {
    padding-top: 87px;
    font-size: 48px;
    line-height: 0.94;
    letter-spacing: 0;
    -webkit-text-stroke: 2.5px var(--gold);
  }

  .coffee-page-template .tc-section-nav {
    top: 81px;
    height: 41px;
    gap: 19px;
    justify-content: flex-start;
    overflow-x: auto;
    overflow-y: hidden;
    padding-inline: 24px;
    scrollbar-width: none;
  }

  .coffee-page-template .tc-section-nav::-webkit-scrollbar {
    display: none;
  }

  .coffee-page-template .tc-section-nav a {
    font-size: 14px;
    line-height: 1;
  }

  .coffee-page-template .tc-section-nav a:not(:last-child)::after {
    right: -10px;
    height: 25px;
  }

  .coffee-page-template .tc-sourcing {
    padding: 0 0 64px;
  }

  .coffee-page-template .tc-sourcing__grid {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: none;
    padding: 0;
  }

  .coffee-page-template .tc-hero-card {
    order: 1;
    /* width: 780px; */
    max-width: none;
    height: 480px;
    /* margin-left: -260px; */
    border-radius: 0px;
  }

  .coffee-page-template .tc-hero-card img {
    object-position: center;
  }

  .coffee-page-template .tc-sourcing .tc-copy {
    order: 2;
    width: 90%;
    margin: 40px auto 0;
    padding-top: 0;
  }

  .coffee-page-template .tc-sourcing .tc-kicker {
    margin-bottom: 14px;
  }

  .coffee-page-template .tc-sourcing .tc-copy h2 {
    margin-bottom: 20px;
  }

  .coffee-page-template .tc-sourcing .tc-copy p {
  }

  .coffee-page-template .tc-copy p + p {
    margin-top: 13px;
  }

  /* tc-origin-map: fixed zoom window on mobile */
  .coffee-page-template .tc-origin-map {
    width: 100%;
    height: 260px;
    margin: 24px 0 0;
    aspect-ratio: auto;
    overflow: hidden;
  }

  .coffee-page-template .tc-origin-map::before,
  .coffee-page-template .tc-origin-map::after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    z-index: 2;
    pointer-events: none;
  }
  .coffee-page-template .tc-origin-map::before {
    top: 0;
    height: 72px;
    background: linear-gradient(to bottom, var(--cream) 0%, transparent 100%);
  }
  .coffee-page-template .tc-origin-map::after {
    bottom: 0;
    height: 72px;
    background: linear-gradient(to top, var(--cream) 0%, transparent 100%);
  }

  .coffee-page-template .tc-map {
    position: absolute;
    left: calc(50% - 175px);
    top: 0;
    width: auto;
    height: 100%;
    max-width: none;
    opacity: 1;
    transform-origin: center center;
    transition: transform 0.7s ease;
  }

  .coffee-page-template .tc-origin-line {
    display: none;
  }
  .coffee-page-template .tc-origin-card {
    display: none !important;
  }

  /* Per-origin zoom/pan */
  .coffee-page-template .tc-origin-map[data-origin="colombia"] .tc-map {
    transform: scale(3.5) translate(17%, 4%);
  }
  .coffee-page-template .tc-origin-map[data-origin="brazil"] .tc-map {
    transform: scale(3.5) translate(17%, -24%);
  }
  .coffee-page-template .tc-origin-map[data-origin="ethiopia"] .tc-map {
    transform: scale(3.5) translate(-7%, -10%);
  }
  .coffee-page-template .tc-origin-map[data-origin="indonesia"] .tc-map {
    transform: scale(3.5) translate(0%, -26%);
  }

  /* Mobile origin slider */
  .coffee-page-template .tc-origin-slider {
    display: block;
    padding-top: 24px;
  }
  .coffee-page-template .tc-origin-slider__wrap {
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    margin-left: var(--gutter);
    width: 100vw;
  }
  .coffee-page-template .tc-origin-slider__wrap::-webkit-scrollbar {
    display: none;
  }
  .coffee-page-template .tc-origin-slider__track {
    display: flex;
    flex-wrap: nowrap;
    gap: 16px;
    padding-right: var(--gutter);
  }
  .coffee-page-template .tc-origin-slide {
    flex: 0 0 79vw;
    scroll-snap-align: start;
    display: grid;
    grid-template-columns: 149px 1fr;
    gap: 16px;
    align-items: start;
  }
  .coffee-page-template .tc-origin-slide__photo {
    width: 149px;
    height: 149px;
    border-radius: 8px;
    overflow: hidden;
  }
  .coffee-page-template .tc-origin-slide__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .coffee-page-template .tc-origin-slide__label {
    display: inline-block;
    background: var(--cream-light);
    padding: 7px 12px;
    font-size: 18px;
    font-weight: 700;
    color: var(--gold);
    line-height: 1;
    margin-bottom: 8px;
    margin-left: -35px;
  }
  .coffee-page-template .tc-origin-slide__text {
    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--gold);
    margin: 0;
  }
  .coffee-page-template .tc-origin-slider__counter {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    margin-top: 20px;
    padding-inline: var(--gutter);
    gap: 8px;
    width: 100vw;
    margin-left: calc((100% - 100vw) / 2);
  }
  .coffee-page-template .tc-origin-slider__num {
    font-size: 18px;
    font-weight: 400;
    color: var(--gold);
    line-height: 1;
  }
  .coffee-page-template .tc-origin-slider__line {
    position: relative;
    width: 100%;
    height: 1px;
    background: rgba(133, 117, 78, 0.3);
  }
  .coffee-page-template .tc-origin-slider__bar {
    position: absolute;
    left: 0;
    top: -1.5px;
    width: 0%;
    height: 4px;
    background: var(--gold);
    transition: width 0.3s ease;
  }

  .coffee-page-template .tc-roasting {
    padding: 0 0 60px;
  }

  .coffee-page-template .tc-roast-panel {
    min-height: 412px;
    margin-inline: auto;
    padding: 34px 20px;
    border-radius: 15px;
  }

  .coffee-page-template .tc-roast-panel::before {
    background: linear-gradient(
      90deg,
      rgba(20, 18, 16, 0.96),
      rgba(20, 18, 16, 0.76) 56%,
      rgba(20, 18, 16, 0.22)
    );
  }

  .coffee-page-template .tc-roast-panel__media img {
    object-position: 70% center;
  }

  .coffee-page-template .tc-roast-panel__copy {
    width: 100%;
  }

  .coffee-page-template .tc-roast-panel h2 {
    font-size: 32px;
    line-height: 1.1;
    margin-bottom: 22px;
  }

  .coffee-page-template .tc-roast-panel p {
    max-width: 269px;
    font-size: 12px;
    line-height: 1.42;
  }

  .coffee-page-template .tc-roast-panel p + p {
    margin-top: 13px;
  }

  .coffee-page-template .tc-roast-levels {
    display: flex;
    justify-content: flex-start;
    gap: 25px;
    width: 100vw;
    min-height: 582px;
    margin: 54px 0 0;
    padding: 0 0 16px var(--gutter);
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    scroll-snap-type: x mandatory;
  }

  .coffee-page-template .tc-roast-levels::after {
    content: "";
    flex: 0 0 var(--gutter);
  }

  .coffee-page-template .tc-roast-levels::-webkit-scrollbar {
    display: none;
  }

  .coffee-page-template .tc-roast-card {
    flex: 0 0 256px;
    width: 256px;
    aspect-ratio: 256 / 582;
  }

  .coffee-page-template .tc-roast-card::before {
    top: 30.75%;
    width: 100%;
    height: 56.75%;
    border-radius: 11.5px;
    opacity: 1;
    background: var(--cream-light);
  }

  .coffee-page-template .tc-roast-card__beans {
    height: 62.6%;
  }

  .coffee-page-template .tc-roast-swatch {
    top: 27.2%;
    width: 44px;
    border-radius: 7.7px;
  }

  .coffee-page-template .tc-roast-card h3,
  .coffee-page-template .tc-roast-card:hover h3 {
    top: 61.85%;
    font-size: 21.6px;
  }

  .coffee-page-template .tc-roast-card__note,
  .coffee-page-template .tc-roast-card:hover .tc-roast-card__note {
    top: 67.25%;
    font-size: 13.9px;
  }

  .coffee-page-template .tc-roast-card__detail,
  .coffee-page-template .tc-roast-card:hover .tc-roast-card__detail {
    top: 72.7%;
    width: 224px;
    color: var(--black);
    font-size: 12.3px;
    line-height: 1.22;
    opacity: 1;
  }

  .coffee-page-template .tc-roast-card {
    scroll-snap-align: start;
  }

  /* Mobile roast counter */
  .coffee-page-template .tc-roast-counter {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    margin-top: 20px;
    padding-inline: var(--gutter);
    gap: 8px;
    width: 100vw;
    margin-left: calc((100% - 100vw) / 2);
  }
  .coffee-page-template .tc-roast-counter__num {
    font-size: 18px;
    font-weight: 400;
    color: var(--gold);
    line-height: 1;
  }
  .coffee-page-template .tc-roast-counter__line {
    position: relative;
    width: 100%;
    height: 1px;
    background: rgba(133, 117, 78, 0.3);
  }
  .coffee-page-template .tc-roast-counter__bar {
    position: absolute;
    left: 0;
    top: -1.5px;
    width: 0%;
    height: 4px;
    background: var(--gold);
    transition: width 0.3s ease;
  }

  .coffee-page-template .tc-quality {
    padding: 0 0 71px;
  }

  .coffee-page-template .tc-quality__stage {
    width: 100%;
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 0 24px;
  }

  .coffee-page-template .tc-quality__panel,
  .coffee-page-template .tc-quality__image,
  .coffee-page-template .tc-quality-steps {
    position: relative;
    inset: auto;
    width: 100%;
    max-width: none;
  }

  .coffee-page-template .tc-quality__panel {
    order: 1;
    height: 429px;
    min-height: 429px;
    border-radius: 15px 15px 0 0;
  }

  .coffee-page-template .tc-quality__copy {
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 132px 20px 24px;
  }

  .coffee-page-template .tc-quality__copy .tc-kicker {
    margin-bottom: 14px;
  }

  .coffee-page-template .tc-quality__copy p {
    max-width: 274px;
    font-size: 12px;
    line-height: 1.42;
  }

  .coffee-page-template .tc-quality__copy p + p {
    margin-top: 13px;
  }

  .coffee-page-template .tc-quality__beans {
    right: -155px;
    width: 390px;
    height: 579px;
  }

  .coffee-page-template .tc-quality__image {
    order: 2;
    height: 295px;
    margin: 0;
    border-radius: 0 0 30px 30px;
    box-shadow: 24px -22px 37.1px rgba(0, 0, 0, 0.22);
  }

  .coffee-page-template .tc-quality-steps {
    order: 3;
    display: grid;
    grid-template-columns: 1fr;
    gap: 22px;
    margin-top: 70px;
  }

  .coffee-page-template .tc-quality-steps article {
    grid-template-columns: 50px minmax(0, 1fr);
    gap: 16px;
  }

  .coffee-page-template .tc-quality-steps span {
    width: 50px;
    height: 50px;
    border-radius: 6.5px;
  }

  .coffee-page-template .tc-quality-steps h3 {
    font-size: 21px;
    line-height: 1.1;
    margin-bottom: 8px;
  }

  .coffee-page-template .tc-quality-steps p {
    width: 245px;
    font-size: 12px;
    line-height: 1.18;
  }

  .coffee-page-template .tc-training {
    background: linear-gradient(
      to bottom,
      transparent 153px,
      var(--cream-light) 153px
    );
    margin-top: 156px;
    position: relative;
    z-index: 1;
  }

  .coffee-page-template .tc-training__stage {
    width: 100%;
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 0 24px 70px;
    overflow: visible;
  }

  .coffee-page-template .tc-training__intro,
  .coffee-page-template .tc-training__pour,
  .coffee-page-template .tc-training__baristas,
  .coffee-page-template .tc-training__card-copy {
    position: relative;
    inset: auto;
    width: 100%;
    max-width: none;
  }

  .coffee-page-template .tc-training__pour {
    order: 1;
    height: 305px;
    margin: 0;
    border-radius: 30px;
    margin-top: -156px;
  }

  .coffee-page-template .tc-training__pour img {
    left: -24%;
    top: -3.3%;
    width: 148%;
    height: 106%;
    object-fit: cover;
  }

  .coffee-page-template .tc-training__intro {
    order: 2;
    margin-top: 55px;
  }

  .coffee-page-template .tc-training__intro .tc-kicker {
    font-size: 14px;
    margin-bottom: 14px;
  }

  .coffee-page-template .tc-training__intro h2 {
    font-size: 32px;
    line-height: 1.1;
    margin-bottom: 20px;
  }

  .coffee-page-template .tc-training__intro p,
  .coffee-page-template .tc-training__card-copy p {
    font-size: 12px;
    line-height: 1.42;
  }

  .coffee-page-template .tc-training__baristas {
    order: 3;
    width: 322px;
    height: 283px;
    margin: 34px 0 0;
    object-fit: contain;
  }

  .coffee-page-template .tc-training__card-copy {
    order: 4;
    margin-top: -110px;
    padding-left: 160px;
  }

  .coffee-page-template .tc-training__card-copy h3 {
    width: 176px;
    font-size: 24px;
    line-height: 1.08;
    margin: 0 0 42px;
  }

  .coffee-page-template .tc-training__card-copy p {
    margin-left: -160px;
  }

  .coffee-page-template .tc-training__card-copy p + p {
    margin-top: 13px;
  }

  .coffee-page-template .tc-sustainability {
    padding: 0 0 76px;
  }

  .coffee-page-template .tc-sustainability > img {
    height: 131px;
    margin-bottom: 70px;
  }

  .coffee-page-template .tc-sustainability__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    margin-inline: auto;
  }

  .coffee-page-template .tc-sustainability h2 {
    margin-bottom: 0;
  }

  .coffee-page-template .tc-sustainability__grid p + p {
    margin-top: 13px;
  }

  .coffee-page-template .tc-awards {
    min-height: 953px;
    align-items: flex-start;
  }

  .coffee-page-template .tc-awards__bg img,
  .coffee-page-template .tc-awards__bg::after {
    height: 100%;
  }

  .coffee-page-template .tc-awards__grid {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 55px;
    margin: 0;
    padding: 92px 24px 70px;
  }

  .coffee-page-template .tc-awards h2 {
    width: 100%;
    font-size: 60px;
    line-height: 1.1;
    text-align: center;
  }

  .coffee-page-template .tc-award {
    width: 218px;
    display: grid;
    grid-template-columns: 106px 96px;
    gap: 15px;
    justify-content: start;
  }

  .coffee-page-template .tc-award img {
    width: 106px;
    height: 104px;
    opacity: 0.5;
  }

  .coffee-page-template .tc-award h3 {
    font-size: 28px;
    line-height: 1.05;
  }
}

@media (max-width: 991px) {
  /* Professional mobile frame */
  .professional-page-template .site-header,
  .professional-page-template .header-nav,
  .professional-page-template .header-nav__mobile-panel {
    background: var(--black);
  }

  body.page-template-page-company .header-nav {
    background-color: var(--cream);
  }

  .professional-page-template .header-nav__mobile-toggle,
  .professional-page-template .header-nav .icon-btn {
    color: var(--white);
  }

  .professional-page-template .header-nav__mobile-toggle span {
    background: currentColor;
  }

  .professional-page-template .site-breadcrumb {
    display: none;
  }

  .professional-page-template .pf-hero {
    min-height: 253px;
    align-items: flex-start;
  }

  .professional-page-template .pf-hero__inner {
    gap: 11px;
    width: 100%;
    padding: 0px 0 0;
  }

  .professional-page-template .pf-hero__title {
    font-size: 48px;
    font-weight: 700;
    line-height: 0.94;
    letter-spacing: 0;
    -webkit-text-stroke: 1px var(--gold);
  }

  .professional-page-template .pf-hero__subtitle {
    width: 178px;
    color: var(--white);
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    text-transform: none;
  }

  .professional-page-template .pf-cta-top {
    margin-top: 0;
    overflow: hidden;
  }

  .professional-page-template .pf-cta-top__bg {
    left: -15px;
    top: 0;
    right: auto;
    bottom: auto;
    width: 592px;
    height: 599px;
    background-size: cover;
    background-position: 71% 42%;
  }

  .professional-page-template .pf-cta-top::before,
  .professional-page-template .pf-cta-top::after {
    content: "";
    position: absolute;
    inset: -598px 0 0;
    z-index: 2;
    height: 1197px;
    pointer-events: none;
    background: linear-gradient(
      to top,
      var(--cream) 0%,
      rgba(243, 240, 234, 0) 100%
    );
  }

  .professional-page-template .pf-cta-top::after {
    opacity: 0.83;
  }

  .professional-page-template .pf-cta-top__inner {
    z-index: 3;

    height: auto;
    margin: 0 auto;
    padding: 89px 0 40px;
  }

  .professional-page-template .pf-cta-top__heading {
    width: 241px;
    max-width: 241px;
    margin: 0 0 20px;
    font-size: 32px;
    line-height: 1;
    font-weight: 700;
  }

  .professional-page-template .pf-cta-top__heading span {
    -webkit-text-stroke: 1px var(--black);
  }

  .professional-page-template .pf-cta-top__text {
    margin: 0 0 28px;
    color: var(--black);
    font-size: 16px;
    line-height: 1.12;
  }

  .professional-page-template .pf-cta-top__btn {
    min-width: 0;
    height: 51px;
    padding: 0 25px;
    border-radius: 12.6px;
    font-size: 14px;
    line-height: 51px;
  }

  .professional-page-template .pf-solutions {
    position: relative;
    padding: 24px 0 75px;
  }

  .professional-page-template .pf-solutions__header {
    display: block;
    margin: 0 auto 40px;
  }

  .professional-page-template .pf-solutions__title {
    margin: 0 0 14px;
    font-size: 24px;
    line-height: 1;
  }

  .professional-page-template .pf-solutions__desc {
    font-size: 12px;
    line-height: 1.16;
  }

  .professional-page-template .pf-solutions__nav {
    position: absolute;
    left: 24px;
    bottom: 24px;
    z-index: 5;
    width: 87.2vw;
    min-width: 0;
    display: flex;
    padding: 0;
  }

  .professional-page-template .pf-solutions__progress-wrap {
    width: 327px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 18px;
  }

  .professional-page-template .pf-solutions__counter-num {
    align-self: flex-end;
    color: var(--gold);
    font-size: 18px;
    line-height: 1;
  }

  .professional-page-template .pf-solutions__counter-num::after {
    content: none;
  }

  .professional-page-template .pf-solutions__progress-track {
    width: 100%;
    height: 1px;
    background: rgba(133, 117, 78, 0.3);
  }

  .professional-page-template .pf-solutions__progress-thumb {
    left: 0;
    right: auto;
    top: -1.5px;
    height: 4px;
    width: 0%;
    background: var(--gold);
    border: none;
    transform: none;
    transition: width 0.3s ease;
  }

  .professional-page-template .pf-solutions__slider-wrap {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 0 88px var(--gutter);
    overflow: hidden;
  }

  .professional-page-template .pf-solutions__slider {
    overflow: visible;
  }

  .professional-page-template .pf-solutions__slider .slick-list {
    overflow: visible;
  }

  .professional-page-template .pf-solutions__slider .slick-slide {
    margin-right: 26px;
  }

  .professional-page-template .pf-solutions__slide {
    width: 64.8vw;
  }

  .professional-page-template .pf-card {
    width: 100%;
    min-height: 312px;
    height: 312px;
    border-radius: 9.3px;
  }

  .professional-page-template .pf-card__overlay {
    padding: 18px 20px;
    background: linear-gradient(
      to bottom,
      rgba(35, 31, 32, 0.98),
      rgba(35, 31, 32, 0.62) 23%,
      rgba(35, 31, 32, 0) 84%
    );
  }

  .professional-page-template .pf-card__title {
    margin-bottom: 14px;
    font-size: 18px;
  }

  .professional-page-template .pf-card__text {
    font-size: 12px;
    line-height: 1.12;
    -webkit-line-clamp: 3;
  }

  .professional-page-template .pf-solutions__edge-arrow {
    display: none;
  }

  .professional-page-template .pf-products {
    min-height: 755px;
    padding: 76px 0 74px;
  }

  .professional-page-template .pf-products__bg {
    height: 420px;
    background-size: 680px auto;
    background-position: 48% 100%;
  }

  .professional-page-template .pf-products__overlay {
    height: 420px;
    background: linear-gradient(
      to bottom,
      var(--black) 0%,
      rgba(35, 31, 32, 0.88) 30%,
      rgba(35, 31, 32, 0.18) 100%
    );
  }

  .professional-page-template .pf-products .container {
    width: 100%;
  }

  .professional-page-template .pf-products .products-section__header {
    justify-content: center;
    width: 87.2vw;
    margin: 0 auto 28px;
  }

  .professional-page-template .pf-products .products-section__heading {
    font-size: 24px;
    line-height: 1;
    text-align: left;
  }

  .professional-page-template .pf-products__tabs-shell {
    width: 100%;
    margin: 0 0 30px;
    justify-content: flex-start;
    overflow: hidden;
  }

  .professional-page-template .pf-products .products-filter-tabs {
    justify-content: flex-start;
    flex-wrap: nowrap;
    gap: 24px;
    width: 100%;
    padding: 0 var(--gutter);
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
  }

  .professional-page-template
    .pf-products
    .products-filter-tabs::-webkit-scrollbar {
    display: none;
  }

  .professional-page-template .pf-products .products-tab-btn {
    flex: 0 0 auto;
    gap: 11px;
  }

  .professional-page-template .pf-products__tab-icon {
    width: 77px;
    height: 77px;
  }

  .professional-page-template .pf-products__tab-icon svg {
    width: 34px;
    height: 34px;
  }

  .professional-page-template .pf-products__tab-label {
    font-size: 14px;
  }

  .professional-page-template .pf-products .products-carousel-shell {
    width: 100%;
    max-width: none;
    padding: 0 0 0 var(--gutter);
    overflow: visible;
  }

  .professional-page-template .pf-products .products-slider-wrap {
    width: 100%;
  }

  .professional-page-template .pf-products .products-slider,
  .professional-page-template .pf-products .products-slider.slick-initialized,
  .professional-page-template
    .pf-products
    .products-slider.slick-initialized
    .slick-list {
    overflow: visible;
  }

  .professional-page-template .pf-products .product-slide {
    width: 68vw;
    padding: 0 0px 0 0;
    box-sizing: border-box;
  }

  .professional-page-template .pf-products .product-card {
    width: 100%;
    min-height: 359px;
    border-radius: 6.5px;
  }

  .professional-page-template .pf-products .product-card__image {
    height: 212px;
    flex-basis: 212px;
    padding: 34px 24px 10px;
  }

  .professional-page-template .pf-products .product-card__image img {
    max-height: 168px;
  }

  .professional-page-template .pf-products .product-card__wishlist {
    top: 14px;
    left: 14px;
    width: 17px;
    height: 15px;
  }

  .professional-page-template .pf-products .product-card__badges {
    right: 15px;
    gap: 7px;
  }

  .professional-page-template .pf-products .product-card__badge {
    width: 39px;
    height: 39px;
    border-radius: 6.5px;
    font-size: 14px;
  }

  .professional-page-template .pf-products .product-card__body {
    padding: 18px 24px 22px;
  }

  .professional-page-template .pf-products .product-card__name {
    font-size: 18px;
    line-height: 1.1;
    margin-bottom: 15px;
  }

  .professional-page-template .pf-products .product-card__desc {
    font-size: 14px;
    line-height: 1.08;
    -webkit-line-clamp: 4;
  }

  .professional-page-template .pf-products .products-arrow {
    display: none;
  }

  .professional-page-template .pf-products .products-section__footer {
    width: 327px;
    margin: 25px auto 0;
    justify-content: flex-end;
  }

  .professional-page-template .pf-products .products-nav-bottom {
    width: 327px;
    gap: 18px;
    align-items: stretch;
  }

  .professional-page-template
    .pf-products
    .products-nav-bottom
    .js-slide-current {
    align-self: flex-end;
    color: var(--cream-light);
  }

  .professional-page-template .pf-products .products-progress-track {
    width: 327px;
    height: 1px;
    background: rgba(225, 215, 187, 0.3);
  }

  .professional-page-template .pf-products .products-progress-thumb {
    left: 0;
    right: auto;
    top: -1.5px;
    height: 4px;
    width: 0%;
    background: var(--cream-light);
    border: none;
    transform: none;
    transition: width 0.3s ease;
  }

  .professional-page-template .pf-faq {
    padding: 64px 0 64px;
  }

  .professional-page-template .pf-faq__inner {
    display: block;
    margin: 0 auto;
  }

  .professional-page-template .pf-faq__heading {
    gap: 0;
    margin: 0 0 23px;
    line-height: 1;
  }

  .professional-page-template .pf-faq__heading span,
  .professional-page-template .pf-faq__heading strong {
    font-size: 32px;
    line-height: 1;
    font-weight: 700;
  }

  .professional-page-template .pf-faq__lead {
    margin-bottom: 31px;
    font-size: 12px;
    line-height: 1.16;
  }

  .professional-page-template .pf-faq__question {
    min-height: 94px;
    padding: 0;
    align-items: flex-start;
    font-size: 18px;
    line-height: 1.15;
  }

  .professional-page-template .pf-faq__question-text {
    padding-top: 28px;
    line-height: 1.15;
  }

  .professional-page-template .pf-faq__icon {
    width: 18px;
    min-width: 18px;
    padding-top: 28px;
    color: var(--gold);
    font-size: 24px;
    line-height: 1;
  }

  .professional-page-template .pf-faq__item-inner {
    padding: 0 54px 28px 0;
    margin-top: -15px;
  }

  .professional-page-template .pf-faq__answer {
    font-size: 12px;
    line-height: 1.16;
  }

  .professional-page-template .pf-cta {
    height: 432px;
  }

  .professional-page-template .pf-cta__bg {
    background-size: 1145px auto;
    background-position: 51% 45%;
  }

  .professional-page-template .pf-cta__overlay {
    height: 432px;
    background: linear-gradient(
      to bottom,
      rgba(35, 31, 32, 0) 0%,
      var(--black) 100%
    );
  }

  .professional-page-template .pf-cta__marquee {
    align-items: flex-end;
    padding: 0 0 49px 24px;
  }

  .professional-page-template .pf-cta__marquee-track {
    display: block;
    width: 369px;
    padding: 0;
    animation: none;
  }

  .professional-page-template .pf-cta__marquee-text {
    display: none;
    width: 369px;
    white-space: normal;
    font-size: 45px;
    line-height: 0.94;
  }

  .professional-page-template .pf-cta__marquee-text:first-child {
    display: block;
  }

  .professional-page-template .pf-contact {
    padding: 0 0 0;
    background: var(--black);
  }

  .professional-page-template .pf-contact__shell {
    min-height: 593px;
    margin: 0 auto;
    border-radius: 30px;
  }

  .professional-page-template .pf-contact__inner {
    display: block;
    padding: 76px 24px 49px;
  }

  .professional-page-template .pf-contact__heading {
    margin: 0 0 23px;
    font-size: 32px;
    line-height: 1;
    font-weight: 700;
  }

  .professional-page-template .pf-contact__text {
    margin: 0 0 47px;
    font-size: 12px;
    line-height: 1.16;
  }

  .professional-page-template .pf-contact__form {
    padding: 0;
  }

  .professional-page-template .pf-contact__form-grid {
    display: flex;
    flex-direction: column;
    gap: 30px;
  }

  .professional-page-template .pf-contact__field {
  }

  .professional-page-template .pf-contact__field:nth-child(1) {
    order: 1;
  }

  .professional-page-template .pf-contact__field:nth-child(3) {
    order: 2;
  }

  .professional-page-template .pf-contact__field:nth-child(5) {
    order: 3;
  }

  .professional-page-template .pf-contact__field:nth-child(2) {
    order: 4;
  }

  .professional-page-template .pf-contact__field:nth-child(4) {
    order: 5;
  }

  .professional-page-template .pf-contact__field input,
  .professional-page-template .pf-contact__field select {
    padding-bottom: 8px;
    font-size: 12px;
    line-height: 1;
  }

  .professional-page-template .pf-contact__select-icon {
    top: -2px;
  }

  .professional-page-template .pf-contact__submit-row {
    order: 6;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding-top: 0;
  }

  .professional-page-template .pf-contact__terms {
    gap: 5px;
    font-size: 12px;
  }

  .professional-page-template .pf-contact__terms-icon {
    width: 19px;
    height: 19px;
  }

  .professional-page-template .pf-contact__send {
    gap: 7px;
    color: var(--white);
    font-size: 14px;
  }

  .professional-page-template .pf-contact__send svg {
    width: 18px;
    height: 13px;
  }

  .professional-page-template .site-footer {
    margin-top: 0;
  }
}

@media (max-width: 991px) {
  /* Brand mobile frame */
  .brand-page-template .site-header,
  .brand-page-template .header-nav,
  .brand-page-template .header-nav__mobile-panel {
    background: var(--black);
  }

  .brand-page-template .header-nav__menu li a,
  .brand-page-template .header-nav .icon-btn,
  .brand-page-template .header-nav__mobile-toggle {
    color: var(--white);
  }

  .brand-page-template .brand-page {
    background: var(--black);
    overflow: hidden;
  }

  .brand-page-template .brand-intro {
    position: relative;
    height: 1418px;
    min-height: 0;
    padding: 0;
    background: linear-gradient(
      to bottom,
      var(--black) 0,
      var(--black) 584px,
      var(--red) 584px,
      var(--red) 100%
    );
  }

  .brand-page-template .brand-intro::before {
    content: "";
    position: absolute;
    left: 43px;
    top: -140px;
    z-index: 0;
    width: 651px;
    height: 993px;
    background: url("assets/images/the-coffee/quality-beans-strip.png") center /
      cover no-repeat;
    opacity: 1;
    mix-blend-mode: lighten;
    pointer-events: none;
  }

  .brand-page-template .brand-watermark {
    display: none;
  }

  .brand-page-template .brand-hero-copy {
    position: absolute;
    left: 40px;
    top: 70px;
    z-index: 2;
    width: 78.667vw;
    margin: 0;
    text-align: center;
  }

  .brand-page-template .brand-hero-copy .brand-kicker {
    margin: 0;
    font-size: 0;
    line-height: 1.16;
  }

  .brand-page-template .brand-hero-copy .brand-kicker::before {
    content: "Professional Solutions";
    font-size: 12px;
  }

  .brand-page-template .brand-hero-copy h1 {
    margin: 6px 0 21px;
    font-size: 32px;
    line-height: 0.98;
    font-weight: 900;
  }

  .brand-page-template .brand-hero-copy h1 span {
    display: block;
    -webkit-text-stroke: 1px var(--white);
  }

  .brand-page-template .brand-hero-copy p:last-child {
    width: 295px;
    max-width: 295px;
    margin: 0 auto;
    font-size: 12px;
    line-height: 1.16;
  }

  .brand-page-template .brand-pack-card {
    position: absolute;
    left: 24px;
    top: 398px;
    z-index: 3;
    width: 87.2vw;
    height: 370px;
    margin: 0;
    aspect-ratio: auto;
    border-radius: 4px;
    box-shadow: none;
  }

  .brand-page-template .brand-pack-card__arrows {
    right: 20px;
    top: 14px;
  }

  .brand-page-template .brand-pack-card__arrows span {
    width: 28px;
    height: 28px;
    border-radius: 5px 0 0 5px !important;
  }

  .brand-page-template .brand-pack-card__arrows span + span {
    border-radius: 0 5px 5px 0 !important;
  }

  .brand-page-template .brand-pack-card__arrows svg {
    width: 10px;
    height: 21px;
  }

  .brand-page-template .brand-pack-card__dots {
    bottom: 14px;
    gap: 7px;
  }

  .brand-page-template .brand-pack-card__dots span {
    width: 7px;
    height: 7px;
  }

  .brand-page-template .brand-quote {
    position: absolute;
    left: 24px;
    top: 829px;
    z-index: 2;
    width: 87.2vw;
    display: grid;
    grid-template-columns: 21px minmax(0, 256px);
    gap: 8px;
    margin: 0;
  }

  .brand-page-template .brand-quote > span,
  .brand-page-template .brand-red-cta__text > span {
    color: var(--black);
    font-size: 45px;
    line-height: 0.8;
  }

  .brand-page-template .brand-quote p,
  .brand-page-template .brand-red-cta__text p {
    margin: 0;
    font-size: 18px;
    line-height: 1.18;
    font-weight: 700;
  }

  .brand-page-template .brand-quote strong,
  .brand-page-template .brand-red-cta__text strong {
    color: var(--black);
  }

  .brand-page-template .brand-quality-grid {
    position: absolute;
    left: 24px;
    top: 956px;
    z-index: 2;
    width: 87.2vw;
    display: flex;
    flex-direction: column;
    gap: 50px;
    margin: 0;
  }

  .brand-page-template .brand-quality-item {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 13px;
    align-items: start;
  }

  .brand-page-template .brand-quality-item:nth-child(1) {
    order: 1;
  }

  .brand-page-template .brand-quality-item:nth-child(2) {
    order: 3;
  }

  .brand-page-template .brand-quality-item:nth-child(3) {
    order: 2;
  }

  .brand-page-template .brand-quality-item:nth-child(4) {
    order: 4;
  }

  .brand-page-template .brand-quality-item__icon {
    width: 39px;
    height: 50px;
  }

  .brand-page-template .brand-quality-item__icon img {
    width: 39px;
    height: 50px;
  }

  .brand-page-template .brand-quality-item h2 {
    margin: 0 0 8px;
    font-size: 24px;
    line-height: 1.08;
  }

  .brand-page-template .brand-quality-item p {
    width: 229px;
    max-width: 229px;
    font-size: 12px;
    line-height: 1.16;
  }

  .brand-page-template .brand-origins {
    position: relative;
    width: 100%;
    height: 1264px;
    min-height: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: var(--black);
  }

  .brand-page-template .brand-origins__head {
    position: absolute;
    left: 49px;
    top: 100px;
    z-index: 3;
    width: 74.133vw;
  }

  .brand-page-template .brand-origins__head .brand-kicker {
    margin: 0;
    font-size: 12px;
    line-height: 1.16;
  }

  .brand-page-template .brand-origins__head h2 {
    margin: 7px 0 0;
    font-size: 32px;
    line-height: 0.98;
    font-weight: 900;
  }

  .brand-page-template .brand-origins__head h2 span {
    display: block;
    -webkit-text-stroke: 1px var(--white);
  }

  .brand-page-template .brand-origins__copy {
    position: absolute;
    left: 49px;
    top: 237px;
    z-index: 3;
    width: 74.4vw;
    margin: 0;
    font-size: 12px;
    line-height: 1.16;
  }

  .brand-page-template .brand-map {
    position: absolute;
    left: -104px;
    top: 404px;
    z-index: 1;
    width: 582px;
    max-width: none;
    margin: 0;
  }

  .brand-page-template .brand-map__art {
    transform: scale(3.2);
  }

  .brand-page-template
    .brand-map[data-active-origin="south-america"]
    .brand-map__art {
    transform-origin: 26.7% 67.7%;
  }

  .brand-page-template .brand-map[data-active-origin="brazil"] .brand-map__art {
    transform-origin: 31.9% 75.9%;
  }

  .brand-page-template .brand-map[data-active-origin="africa"] .brand-map__art {
    transform-origin: 58.2% 65.6%;
  }

  .brand-page-template .brand-map[data-active-origin="asia"] .brand-map__art {
    transform-origin: 79.7% 70.5%;
  }

  .brand-page-template .brand-map__marker {
    opacity: 0;
    pointer-events: none;
  }

  .brand-page-template .brand-map__marker.is-active {
    opacity: 1;
    pointer-events: auto;
  }

  .brand-page-template .brand-map__line,
  .brand-page-template .brand-map__cursor {
    display: none;
  }

  .brand-page-template .brand-origin-card-stack {
    position: absolute;
    left: 53.43px;
    top: 866.6px;
    z-index: 4;
    width: 266.821px;
    height: 254.858px;
    margin: 0;
  }

  .brand-page-template .brand-origin-card-stack.slick-initialized .slick-list {
    height: 100%;
    overflow: visible;
  }

  .brand-page-template .brand-origin-card-stack.slick-initialized .slick-track,
  .brand-page-template .brand-origin-card-stack.slick-initialized .slick-slide,
  .brand-page-template
    .brand-origin-card-stack.slick-initialized
    .slick-slide
    > div {
    height: 100%;
  }

  .brand-page-template .brand-origin-card-stack.slick-initialized .slick-slide {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease;
  }

  .brand-page-template
    .brand-origin-card-stack.slick-initialized
    .slick-current {
    opacity: 1;
    pointer-events: auto;
  }

  .brand-page-template
    .brand-origin-card-stack.slick-initialized
    .brand-origin-card {
    position: relative;
    inset: auto;
    display: block !important;
    width: 100%;
    height: 100%;
    visibility: visible;
    pointer-events: auto;
  }

  .brand-page-template
    .brand-origin-card-stack.slick-initialized
    .brand-origin-card.slick-slide {
    opacity: 0;
  }

  .brand-page-template
    .brand-origin-card-stack.slick-initialized
    .brand-origin-card.slick-current {
    opacity: 1;
  }

  .brand-page-template .brand-origin-slider__counter {
    position: absolute;
    left: 23px;
    top: 1156px;
    z-index: 5;
    display: block;
    width: calc(100% - 46px);
    color: var(--white);
  }

  .brand-page-template .brand-origin-slider__num {
    display: block;
    text-align: right;
    font-size: 18px;
    font-weight: 400;
    line-height: 1;
  }

  .brand-page-template .brand-origin-slider__line {
    position: relative;
    width: 100%;
    height: 1px;
    margin-top: 24px;
    background: rgba(255, 255, 255, 0.45);
  }

  .brand-page-template .brand-origin-slider__bar {
    position: absolute;
    left: 0;
    top: -1.5px;
    width: 51px;
    height: 4px;
    background: var(--white);
    transition:
      width 0.25s ease,
      transform 0.25s ease;
  }

  .brand-page-template .brand-origin-card__product {
    top: -214.6px;
    width: 286.116px;
    filter: drop-shadow(20.635px 11.555px 21.213px rgba(0, 0, 0, 0.68));
  }

  .brand-page-template .brand-origin-card__body {
    left: 29.71px;
    top: 115.55px;
    width: 163.428px;
  }

  .brand-page-template .brand-origin-card__body h3 {
    width: 155.174px;
    margin: 0 0 9.9px;
    font-size: 23.111px;
    line-height: 1;
    text-align: center;
  }

  .brand-page-template .brand-origin-card__body p {
    margin: 0;
    font-size: 13.206px;
    line-height: 1.18;
  }

  .brand-page-template .brand-origin-card__eye {
    width: 48.698px;
    height: 48.698px;
    border-radius: 8.254px;
  }

  .brand-page-template .brand-origin-card__eye img {
    width: 25.9px;
    height: 17.257px;
    object-fit: contain;
  }

  .brand-page-template .brand-products {
    position: relative;
    height: 795px;
    padding: 0;
    overflow: hidden;
    background: var(--black);
  }

  .brand-page-template .brand-products__inner {
    width: 100%;
    height: 100%;
    padding: 0;
  }

  .brand-page-template .brand-products__head {
    display: block;
    margin: 0;
    padding: 0 24px;
  }

  .brand-page-template .brand-products__head h2 {
    width: 270px;
    margin: 0;
    font-size: 0;
    line-height: 0;
    font-weight: 900;
  }

  .brand-page-template .brand-products__head h2::before,
  .brand-page-template .brand-products__head h2::after {
    display: block;
    font-size: 32px;
    line-height: 0.98;
    font-weight: 900;
  }

  .brand-page-template .brand-products__head h2::before {
    content: "Rooted in";
    color: var(--white);
  }

  .brand-page-template .brand-products__head h2::after {
    content: "Coffee Origins";
    color: transparent;
    -webkit-text-stroke: 1px var(--white);
  }

  .brand-page-template .brand-products__head h2 span {
    display: none;
  }

  .brand-page-template .brand-products .products-nav-bottom .js-slide-current {
    color: var(--white);
    font-size: 18px;
    line-height: 1;
  }

  .brand-page-template .brand-products .products-section__footer {
    position: absolute;
    right: 24px;
    top: 570px;
    z-index: 4;
    width: 87.2vw;
    margin: 0;
  }

  .brand-page-template .brand-products .products-nav-bottom {
    width: 87.2vw;
    align-items: flex-end;
    gap: 16px;
  }

  .brand-page-template .brand-products .products-progress-track {
    width: 100%;
  }

  .brand-page-template .brand-products .products-carousel-shell {
    position: absolute;
    left: 0;
    top: 131px;
    width: 100%;
    padding: 0 0 0 var(--gutter);
    overflow: hidden;
  }

  .brand-page-template .brand-products .products-slider,
  .brand-page-template .brand-products .products-slider.slick-initialized,
  .brand-page-template
    .brand-products
    .products-slider.slick-initialized
    .slick-list {
    overflow: visible;
  }

  .brand-page-template
    .brand-products
    .products-slider.slick-initialized
    .slick-list {
    padding-top: 0;
  }

  .brand-page-template
    .brand-products
    .products-slider.slick-initialized
    .slick-slide,
  .brand-page-template .brand-products .product-slide {
    width: 70vw !important;
    padding-right: 20px;
  }

  .brand-page-template .brand-products .product-card {
    width: 100%;
    min-height: 438px;
    border-radius: 4px;
    filter: none;
  }

  .brand-page-template .brand-products .product-card__image {
    height: 196px;
    flex-basis: 196px;
    padding: 34px 22px 12px;
  }

  .brand-page-template .brand-products .product-card__image img {
    max-height: 152px;
  }

  .brand-page-template .brand-products .product-card__wishlist {
    left: 14px;
    top: 14px;
    width: 15px;
    height: 15px;
  }

  .brand-page-template .brand-products .product-card__badges {
    top: 0;
    right: 0;
  }

  .brand-page-template .brand-products .product-card__badge {
    width: 45px;
    height: 45px;
    border-radius: 0 4px 0 4px;
    font-size: 10px;
  }

  .brand-page-template .brand-products .product-card__body {
    padding: 18px 17px 20px;
  }

  .brand-page-template .brand-products .product-card__name {
    margin-bottom: 12px;
    font-size: 12px;
    line-height: 1.12;
  }

  .brand-page-template .brand-products .product-card__desc,
  .brand-page-template .brand-products .product-card__old-price,
  .brand-page-template .brand-products .product-card__offer-text {
    font-size: 12px;
    line-height: 1.16;
  }

  .brand-page-template .brand-products .product-card__desc {
    margin-bottom: 17px;
    -webkit-line-clamp: 4;
  }

  .brand-page-template .brand-products .product-card__price {
    font-size: 18px;
  }

  .brand-page-template .brand-products .product-card__discount {
    min-width: 41px;
    height: 19px;
    padding: 0 6px;
    border-radius: 3px;
    font-size: 10px;
  }

  .brand-page-template .brand-products .product-card__cart {
    display: inline-flex;
    right: 0;
    bottom: 0;
    width: 35px;
    height: 35px;
    border-radius: 3px 0 4px 0;
    background: var(--red);
    color: var(--white);
    align-items: center;
    justify-content: center;
  }

  .brand-page-template .brand-products .products-arrow {
    display: none;
  }

  .brand-page-template .brand-products__more {
    position: absolute;
    left: 0;
    top: 677px;
    width: 100%;
    margin: 0;
  }

  .brand-page-template .brand-products__more .btn-gold {
    min-width: 92px;
    height: 38px;
    padding: 0 18px;
    border-radius: 7px;
    font-size: 12px;
  }

  .brand-page-template .brand-red-cta {
    height: 389px;
    min-height: 389px;
    padding: 0;
    align-items: flex-start;
  }

  .brand-page-template .brand-red-cta__text {
    position: absolute;
    left: 25px;
    top: 71px;
    z-index: 2;
    width: 78.4vw;
    display: grid;
    grid-template-columns: 21px minmax(0, 255px);
    gap: 8px;
    margin: 0;
  }

  .brand-page-template .brand-red-cta > img {
    inset: 0;
    width: 100%;
    height: 100%;
    object-position: center bottom;
  }

  .brand-page-template .site-footer {
    margin-top: 0;
  }

  .brand-page-template .footer-main {
    min-height: 1121px;
    padding-bottom: 0;
  }

  .brand-page-template .footer-logo {
    height: 205px;
  }

  .brand-page-template .footer-nav {
    gap: 29px;
    margin-top: 55px;
  }

  .brand-page-template .footer-newsletter {
    gap: 49px;
    margin-top: 55px;
  }

  .brand-page-template .footer-social {
    margin-top: 55px;
  }

  .brand-page-template .footer-bottom__links {
    gap: 16px;
    margin-top: 31px;
  }

  .brand-page-template .footer-copy {
    margin-top: 31px;
  }
}

@media (max-width: 991px) {
  /* Single course mobile frame */
  .course-page-template .site-header,
  .course-page-template .header-nav,
  .course-page-template .header-nav__mobile-panel {
    background: var(--black);
  }

  .course-page-template .header-nav__menu li a,
  .course-page-template .header-nav .icon-btn,
  .course-page-template .header-nav__mobile-toggle {
    color: var(--white);
  }

  .course-page-template .course-page {
    background: var(--cream);
    overflow: hidden;
  }

  .course-page-template .course-hero {
    position: relative;
    min-height: 340px;
    padding: 0;
    background: var(--black);
  }

  .course-page-template .course-hero__copy {
    position: absolute;
    left: 50%;
    top: 116px;
    width: 87.2vw;
    transform: translateX(-50%);
  }

  .course-page-template .course-hero__copy h1 {
    width: 251px;
    margin: 0 auto;
    font-size: 32px;
    line-height: 1.1;
    font-weight: 900;
  }

  .course-page-template .course-hero__copy p {
    margin: 10px 0 0;
    font-size: 16px;
    line-height: 1;
  }

  .course-page-template .course-hero-image {
    height: 654px;
    background: var(--black);
  }

  .course-page-template .course-hero-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 52% center;
  }

  .course-page-template .course-overview {
    position: relative;
    height: 1865px;
    min-height: 0;
    padding: 0;
    overflow: hidden;
    background: var(--cream);
  }

  .course-page-template .course-overview__splash {
    display: none;
  }

  .course-page-template .course-overview__inner {
    position: static;
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
  }

  .course-page-template .course-copy {
    position: absolute;
    left: 49px;
    top: 72px;
    z-index: 2;
    width: 75.2vw;
    min-height: 1045px;
  }

  .course-page-template .course-copy h2 {
    width: 277px;
    max-width: 277px;
    margin: 0 0 51px;
    font-size: 32px;
    line-height: 1.1;
    font-weight: 900;
  }

  .course-page-template .course-copy p,
  .course-page-template .course-copy li {
    font-size: 12px;
    line-height: 1;
  }

  .course-page-template .course-copy p {
    margin: 0 0 13px;
  }

  .course-page-template .course-copy ul {
    margin: 0 0 13px 17px;
    padding: 0;
  }

  .course-page-template .course-copy li + li {
    margin-top: 0;
  }

  .course-page-template .course-details {
    position: absolute;
    left: 24px;
    top: 1185px;
    z-index: 3;
    width: 87.2vw;
    min-height: 610px;
    height: 610px;
    padding: 40px 60px 35px;
    border-radius: 30px;
    overflow: hidden;
  }

  .course-page-template .course-details__item + .course-details__item {
    margin-top: 35px;
  }

  .course-page-template .course-details dt {
    margin: 0 0 12px;
    padding-bottom: 6px;
    border-bottom-width: 3px;
    font-size: 14px;
    line-height: 1;
    font-weight: 700;
  }

  .course-page-template .course-details dd {
    font-size: 12px;
    line-height: 1;
  }

  .course-page-template .course-details__button {
    min-width: 206px;
    height: 51px;
    margin-top: 48px;
    padding: 0 25px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
  }

  .course-page-template .course-gallery-strip {
    display: block;
    position: relative;
    height: 523px;
    overflow: hidden;
    background: var(--cream);
  }

  .course-page-template .course-gallery-strip__item {
    position: absolute;
    inset: 0;
    margin: 0;
  }

  .course-page-template .course-gallery-strip__item--foam {
    display: none;
  }

  .course-page-template .course-gallery-strip__item--latte img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 46%;
  }

  .course-page-template .course-contact {
    position: relative;
    width: 100%;
    height: 1097px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: var(--cream);
    margin-top: 100px;
  }

  .course-page-template .course-contact__splash {
    display: none;
  }

  .course-page-template .course-contact__card {
    position: absolute;
    left: 24px;
    top: 0;
    display: block;
    width: 87.2vw;
    min-height: 1027px;
    height: 1027px;
    margin: 0;
    padding: 47px 24px 41px;
    border-radius: 30px;
    overflow: hidden;
  }

  .course-page-template .course-contact__intro h2 {
    margin: 0 0 34px;
    color: var(--black);
    font-size: 0;
    line-height: 0;
  }

  .course-page-template .course-contact__intro h2::before {
    content: "Contact Form";
    display: block;
    font-size: 32px;
    line-height: 1.1;
    font-weight: 900;
  }

  .course-page-template .course-contact__intro p {
    margin: 0;
    font-size: 16px;
    line-height: 1;
  }

  .course-page-template .course-contact__fields {
    display: block;
    width: 100%;
    padding-top: 58px;
  }

  .course-page-template .course-contact__attendees {
    display: block;
  }

  .course-page-template .course-contact__select-field,
  .course-page-template .course-field,
  .course-page-template .course-total {
    width: 100%;
  }

  .course-page-template .course-contact__select-field {
    margin: 0 0 42px;
  }

  .course-page-template .course-contact__select-field select {
    height: 24px;
    font-size: 16px;
    line-height: 1;
  }

  .course-page-template .course-attendee {
    margin: 0;
  }

  .course-page-template .course-attendee:first-of-type {
    margin: 0 0 45px;
  }

  .course-page-template .course-attendee legend {
    margin: 0 0 42px;
    font-size: 16px;
    line-height: 1;
  }

  .course-page-template .course-field input {
    height: 28px;
    padding: 0 0 8px;
    font-size: 16px;
    line-height: 1;
  }

  .course-page-template .course-field + .course-field {
    margin-top: 41px;
  }

  .course-page-template .course-contact__footer {
    gap: 48px;
    margin-top: 28px;
  }

  .course-page-template .course-total {
    min-height: 37px;
    padding-bottom: 10px;
  }

  .course-page-template .course-total span {
    font-size: 16px;
  }

  .course-page-template .course-total strong {
    font-size: 24px;
    font-weight: 500;
  }

  .course-page-template .course-actions {
    align-items: center;
    gap: 12px;
    padding-bottom: 0;
  }

  .course-page-template .course-terms {
    gap: 10px;
  }

  .course-page-template .course-terms__icon {
    width: 24px;
    height: 24px;
    flex-basis: 24px;
  }

  .course-page-template .course-terms span:last-child {
    font-size: 16px;
    line-height: 1;
    white-space: nowrap;
  }

  .course-page-template .course-send {
    gap: 8px;
    font-size: 16px;
  }

  .course-page-template .course-send img {
    width: 16px;
    height: 9px;
  }

  .course-page-template .site-footer {
    margin-top: 0;
  }

  .course-page-template .footer-main {
    min-height: 1115px;
    padding-bottom: 0;
  }

  .course-page-template .footer-social {
    margin-top: 30px;
  }

  .course-page-template .footer-bottom__links {
    margin-top: 20px;
  }

  .course-page-template .footer-copy {
    margin-top: 14px;
  }
}

@media (max-width: 991px) {
  /* Home mobile Figma typography corrections */
  .home .brand-card__mobile-title {
    font-size: 32px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: 0;
  }

  .home .brand-card__mobile-text {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: 0;
  }

  .home .brand-card__mobile-btn,
  .home .btn-view-more,
  .home .btn-gold,
  .home .products-filter-tabs a,
  .home .products-filter-tabs button,
  .home .products-section .rs-shop-card__badge,
  .home .products-section .rs-shop-card__discount,
  .home .blog-card__btn-text,
  .home .blog-card:hover .blog-card__btn-text {
    font-size: 14px;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .products-section .rs-shop-card__title {
    font-size: 18px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0;
  }

  .home .products-section .rs-shop-card__desc,
  .home .products-section .rs-shop-card__old {
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0;
  }

  .home .products-section .rs-shop-card__desc {
    line-height: 1;
  }

  .home .products-section .rs-shop-card__price {
    font-size: 24px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0;
  }

  .home .products-section .rs-shop-card__offer,
  .home .products-section .rs-shop-card__offer-text {
    font-size: 12px;
    line-height: 1;
    letter-spacing: 0;
  }

  .home .brand-row__maison-text {
    font-size: 35px;
  }
}

@media (max-width: 991px) {
  /* Dark mobile navigation */
  .coffee-page-template .site-header,
  .coffee-page-template .header-nav,
  .coffee-page-template .header-nav__mobile-panel,
  .professional-page-template .site-header,
  .professional-page-template .header-nav,
  .professional-page-template .header-nav__mobile-panel,
  .brand-page-template .site-header,
  .brand-page-template .header-nav,
  .brand-page-template .header-nav__mobile-panel,
  .blog-page-template .site-header,
  .blog-page-template .header-nav,
  .blog-page-template .header-nav__mobile-panel,
  .blog-single-template .site-header,
  .blog-single-template .header-nav,
  .blog-single-template .header-nav__mobile-panel,
  .contact-page-template .site-header,
  .contact-page-template .header-nav,
  .contact-page-template .header-nav__mobile-panel,
  .course-page-template .site-header,
  .course-page-template .header-nav,
  .course-page-template .header-nav__mobile-panel,
  .brew-guides-template .site-header,
  .brew-guides-template .header-nav,
  .brew-guides-template .header-nav__mobile-panel,
  body.brand-rossetti-template .site-header,
  body.brand-rossetti-template .header-nav,
  body.brand-rossetti-template .header-nav__mobile-panel,
  body.woocommerce-cart .site-header,
  body.woocommerce-cart .header-nav,
  body.woocommerce-cart .header-nav__mobile-panel,
  body.woocommerce-checkout .site-header,
  body.woocommerce-checkout .header-nav,
  body.woocommerce-checkout .header-nav__mobile-panel,
  .woocommerce-shop .site-header,
  .woocommerce-shop .header-nav,
  .woocommerce-shop .header-nav__mobile-panel,
  .post-type-archive-product .site-header,
  .post-type-archive-product .header-nav,
  .post-type-archive-product .header-nav__mobile-panel {
    background: var(--black);
  }

  .coffee-page-template .header-nav__mobile-panel,
  .professional-page-template .header-nav__mobile-panel,
  .brand-page-template .header-nav__mobile-panel,
  .blog-page-template .header-nav__mobile-panel,
  .blog-single-template .header-nav__mobile-panel,
  .contact-page-template .header-nav__mobile-panel,
  .course-page-template .header-nav__mobile-panel,
  .brew-guides-template .header-nav__mobile-panel,
  body.brand-rossetti-template .header-nav__mobile-panel,
  body.woocommerce-cart .header-nav__mobile-panel,
  body.woocommerce-checkout .header-nav__mobile-panel,
  .woocommerce-shop .header-nav__mobile-panel,
  .post-type-archive-product .header-nav__mobile-panel {
    border-top-color: rgba(255, 255, 255, 0.18);
    box-shadow: 0 18px 28px rgba(0, 0, 0, 0.28);
  }

  .coffee-page-template .header-nav__logo-img,
  .professional-page-template .header-nav__logo-img,
  .brand-page-template .header-nav__logo-img,
  .blog-page-template .header-nav__logo-img,
  .blog-single-template .header-nav__logo-img,
  .contact-page-template .header-nav__logo-img,
  .course-page-template .header-nav__logo-img,
  .brew-guides-template .header-nav__logo-img,
  body.brand-rossetti-template .header-nav__logo-img,
  body.woocommerce-cart .header-nav__logo-img,
  body.woocommerce-checkout .header-nav__logo-img,
  .woocommerce-shop .header-nav__logo-img,
  .post-type-archive-product .header-nav__logo-img {
    content: url("assets/images/logo-rossetti-mark-light.svg");
    filter: none;
  }

  .coffee-page-template .header-nav__mobile-toggle,
  .coffee-page-template .header-nav .icon-btn,
  .coffee-page-template .header-nav__mobile-menu a,
  .professional-page-template .header-nav__mobile-toggle,
  .professional-page-template .header-nav .icon-btn,
  .professional-page-template .header-nav__mobile-menu a,
  .brand-page-template .header-nav__mobile-toggle,
  .brand-page-template .header-nav .icon-btn,
  .brand-page-template .header-nav__mobile-menu a,
  .blog-page-template .header-nav__mobile-toggle,
  .blog-page-template .header-nav .icon-btn,
  .blog-page-template .header-nav__mobile-menu a,
  .blog-single-template .header-nav__mobile-toggle,
  .blog-single-template .header-nav .icon-btn,
  .blog-single-template .header-nav__mobile-menu a,
  .contact-page-template .header-nav__mobile-toggle,
  .contact-page-template .header-nav .icon-btn,
  .contact-page-template .header-nav__mobile-menu a,
  .course-page-template .header-nav__mobile-toggle,
  .course-page-template .header-nav .icon-btn,
  .course-page-template .header-nav__mobile-menu a,
  .brew-guides-template .header-nav__mobile-toggle,
  .brew-guides-template .header-nav .icon-btn,
  .brew-guides-template .header-nav__mobile-menu a,
  body.brand-rossetti-template .header-nav__mobile-toggle,
  body.brand-rossetti-template .header-nav .icon-btn,
  body.brand-rossetti-template .header-nav__mobile-menu a,
  body.woocommerce-cart .header-nav__mobile-toggle,
  body.woocommerce-cart .header-nav .icon-btn,
  body.woocommerce-cart .header-nav__mobile-menu a,
  body.woocommerce-checkout .header-nav__mobile-toggle,
  body.woocommerce-checkout .header-nav .icon-btn,
  body.woocommerce-checkout .header-nav__mobile-menu a,
  .woocommerce-shop .header-nav__mobile-toggle,
  .woocommerce-shop .header-nav .icon-btn,
  .woocommerce-shop .header-nav__mobile-menu a,
  .post-type-archive-product .header-nav__mobile-toggle,
  .post-type-archive-product .header-nav .icon-btn,
  .post-type-archive-product .header-nav__mobile-menu a {
    color: var(--white);
  }

  .coffee-page-template .header-nav__mobile-menu--secondary,
  .professional-page-template .header-nav__mobile-menu--secondary,
  .brand-page-template .header-nav__mobile-menu--secondary,
  .blog-page-template .header-nav__mobile-menu--secondary,
  .blog-single-template .header-nav__mobile-menu--secondary,
  .contact-page-template .header-nav__mobile-menu--secondary,
  .course-page-template .header-nav__mobile-menu--secondary,
  .brew-guides-template .header-nav__mobile-menu--secondary,
  body.brand-rossetti-template .header-nav__mobile-menu--secondary,
  body.woocommerce-cart .header-nav__mobile-menu--secondary,
  body.woocommerce-checkout .header-nav__mobile-menu--secondary {
    border-top-color: rgba(255, 255, 255, 0.18);
  }

  .coffee-page-template .header-nav__mobile-menu .sub-menu a,
  .professional-page-template .header-nav__mobile-menu .sub-menu a,
  .brand-page-template .header-nav__mobile-menu .sub-menu a,
  .blog-page-template .header-nav__mobile-menu .sub-menu a,
  .blog-single-template .header-nav__mobile-menu .sub-menu a,
  .contact-page-template .header-nav__mobile-menu .sub-menu a,
  .course-page-template .header-nav__mobile-menu .sub-menu a,
  .brew-guides-template .header-nav__mobile-menu .sub-menu a,
  body.brand-rossetti-template .header-nav__mobile-menu .sub-menu a,
  body.woocommerce-cart .header-nav__mobile-menu .sub-menu a,
  body.woocommerce-checkout .header-nav__mobile-menu .sub-menu a {
    color: rgba(255, 255, 255, 0.82);
  }

  .page-template-page-wishlist .header-nav,
  .page-template-page-wishlist .main-header {
    background: var(--cream);
  }
  .page-template-page-wishlist .header-nav .icon-btn {
    color: var(--black);
  }
}

@media (max-width: 991px) {
  body.account-modal-open .site-header,
  body.account-modal-open .header-nav,
  body.account-modal-open .header-nav__mobile-panel {
    background: var(--black);
  }

  /* Pin the header to the top while the modal is open, regardless of the page's
     own position (relative/absolute) or scroll position */
  body.account-modal-open .site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10050;
  }

  body.account-modal-open .header-nav__logo-img {
    content: url("assets/images/logo-rossetti-mark-light.svg");
    filter: none;
  }

  body.account-modal-open .header-nav__mobile-toggle,
  body.account-modal-open .header-nav .icon-btn,
  body.account-modal-open .header-nav__mobile-menu a {
    color: var(--white);
  }

  body.account-modal-open .header-nav__mobile-menu--secondary {
    border-top-color: rgba(255, 255, 255, 0.18);
  }

  body.account-modal-open .header-nav__mobile-menu .sub-menu a {
    color: rgba(255, 255, 255, 0.82);
  }
}

@media (max-width: 991px) {
  /* Brand Rossetti mobile Figma alignment */
  body.brand-rossetti-template {
    --br2-mobile-gutter: clamp(24px, 6.4vw, 40px);
    --br2-mobile-content: min(
      calc(100vw - var(--br2-mobile-gutter) - var(--br2-mobile-gutter)),
      430px
    );
    --br2-mobile-card: min(var(--br2-mobile-content), 420px);
    --br2-mobile-origin-card: clamp(250px, 66.667vw, 320px);
    --br2-mobile-origin-photo: clamp(113px, 30.133vw, 145px);
    --br2-mobile-product-slide: clamp(274px, 73.067vw, 350px);
    --br2-mobile-product-card: clamp(255px, 68vw, 326px);
    --br2-mobile-product-height: clamp(404px, 107.733vw, 517px);
    --br2-mobile-track: min(calc(100vw - 46px), 420px);
    --br2-mobile-thumb: clamp(51.296px, 13.679vw, 66px);
    --br2-origin-gutter: clamp(42px, 11.2vw, 54px);
  }

  body.brand-rossetti-template:not(.account-modal-open) .site-header,
  body.brand-rossetti-template:not(.account-modal-open) .header-nav,
  body.brand-rossetti-template:not(.account-modal-open)
    .header-nav__mobile-panel {
    background: var(--cream);
  }

  body.brand-rossetti-template:not(.account-modal-open)
    .header-nav__mobile-panel {
    border-top-color: rgba(35, 31, 32, 0.12);
    box-shadow: 0 18px 28px rgba(35, 31, 32, 0.12);
  }

  body.brand-rossetti-template:not(.account-modal-open) .header-nav__logo-img {
    content: url("assets/images/logo-rossetti-mark.svg");
    filter: none;
  }

  body.brand-rossetti-template:not(.account-modal-open)
    .header-nav__mobile-toggle,
  body.brand-rossetti-template:not(.account-modal-open) .header-nav .icon-btn,
  body.brand-rossetti-template:not(.account-modal-open)
    .header-nav__mobile-menu
    a {
    color: var(--black);
  }

  body.brand-rossetti-template:not(.account-modal-open)
    .header-nav__mobile-menu--secondary {
    border-top-color: rgba(35, 31, 32, 0.12);
  }

  body.brand-rossetti-template:not(.account-modal-open)
    .header-nav__mobile-menu
    .sub-menu
    a {
    color: rgba(35, 31, 32, 0.78);
  }

  body.brand-rossetti-template .brand-intro {
    position: relative;
    height: clamp(1618px, 431.467vw, 2071px);
    min-height: 0;
    padding: 0;
    overflow: hidden;
    background: linear-gradient(
      to bottom,
      var(--br2-cream) 0,
      var(--br2-cream) clamp(585px, 156vw, 749px),
      var(--br2-gold) clamp(585px, 156vw, 749px),
      var(--br2-gold) 100%
    );
  }

  body.brand-rossetti-template .brand-watermark,
  body.brand-rossetti-template .brand-kicker {
    display: none;
  }

  body.brand-rossetti-template .brand-hero-copy {
    position: absolute;
    left: 50%;
    top: clamp(118px, 31.467vw, 151px);
    z-index: 2;
    width: var(--br2-mobile-content);
    margin: 0;
    text-align: center;
    transform: translateX(-50%);
  }

  body.brand-rossetti-template .brand-hero-copy h1 {
    width: min(100%, clamp(222px, 59.2vw, 285px));
    margin: 0 auto clamp(24px, 6.4vw, 31px);
    color: var(--br2-black);
    font-size: clamp(32px, 8.533vw, 41px);
    line-height: 0.98;
    font-weight: 900;
  }

  body.brand-rossetti-template .brand-hero-copy h1 span {
    display: block;
    color: transparent;
    -webkit-text-stroke: 1px var(--br2-black);
  }

  body.brand-rossetti-template .brand-hero-copy p:last-child {
    width: 100%;
    max-width: 430px;
    margin: 0;
    color: var(--br2-black);
    font-size: clamp(12px, 3.2vw, 14px);
    line-height: 1.16;
    font-weight: 700;
  }

  body.brand-rossetti-template .brand-pack-card {
    position: absolute;
    left: 50%;
    top: clamp(398px, 106.133vw, 509px);
    z-index: 3;
    width: var(--br2-mobile-card);
    height: clamp(370px, 98.667vw, 474px);
    margin: 0;
    aspect-ratio: auto;
    border-radius: 10px;
    box-shadow: none;
    transform: translateX(-50%);
  }

  body.brand-rossetti-template .brand-pack-card__arrows {
    top: clamp(24px, 6.4vw, 31px);
    right: clamp(24px, 6.4vw, 31px);
  }

  body.brand-rossetti-template .brand-pack-card__arrows span {
    width: clamp(28px, 7.467vw, 36px);
    height: clamp(29px, 7.733vw, 37px);
    border-radius: 5px 0 0 5px !important;
  }

  body.brand-rossetti-template .brand-pack-card__arrows span + span {
    border-radius: 0 5px 5px 0 !important;
    background: var(--br2-gold);
  }

  body.brand-rossetti-template .brand-pack-card__arrows svg {
    width: 10px;
    height: 21px;
  }

  body.brand-rossetti-template .brand-pack-card__dots {
    bottom: clamp(24px, 6.4vw, 31px);
    gap: clamp(7px, 1.867vw, 9px);
  }

  body.brand-rossetti-template .brand-pack-card__dots span {
    width: clamp(7px, 1.867vw, 9px);
    height: clamp(7px, 1.867vw, 9px);
  }

  body.brand-rossetti-template .brand-quote {
    position: absolute;
    left: 50%;
    top: clamp(838px, 223.467vw, 1073px);
    z-index: 2;
    width: min(var(--br2-mobile-content), 360px);
    display: grid;
    grid-template-columns: clamp(21px, 5.6vw, 27px) minmax(0, 1fr);
    gap: clamp(8px, 2.133vw, 10px);
    margin: 0;
    color: var(--white);
    transform: translateX(-50%);
  }

  body.brand-rossetti-template .brand-quote > span {
    color: var(--br2-black);
    font-size: clamp(45px, 12vw, 58px);
    line-height: 0.8;
  }

  body.brand-rossetti-template .brand-quote p {
    margin: 0;
    color: var(--white);
    font-size: clamp(18px, 4.8vw, 23px);
    line-height: 1.38;
    font-weight: 900;
  }

  body.brand-rossetti-template .brand-quote strong {
    color: var(--br2-black);
  }

  body.brand-rossetti-template .brand-quality-grid {
    position: absolute;
    left: 50%;
    top: clamp(974px, 259.733vw, 1247px);
    z-index: 2;
    width: var(--br2-mobile-content);
    display: flex;
    flex-direction: column;
    gap: clamp(72px, 19.2vw, 92px);
    margin: 0;
    transform: translateX(-50%);
  }

  body.brand-rossetti-template .brand-quality-item {
    display: grid;
    grid-template-columns: clamp(50px, 19.467vw, 93px) minmax(0, 1fr);
    gap: clamp(13px, 3.467vw, 17px);
    min-height: clamp(73px, 19.467vw, 93px);
    align-items: start;
    color: var(--white);
  }

  body.brand-rossetti-template .brand-quality-item:nth-child(1) {
    order: 1;
  }

  body.brand-rossetti-template .brand-quality-item:nth-child(2) {
    order: 3;
  }

  body.brand-rossetti-template .brand-quality-item:nth-child(3) {
    order: 2;
  }

  body.brand-rossetti-template .brand-quality-item:nth-child(4) {
    order: 4;
  }

  body.brand-rossetti-template .brand-quality-item__icon,
  body.brand-rossetti-template .brand-quality-item__icon img {
    width: 50px;
    height: 50px;
  }

  body.brand-rossetti-template .brand-quality-item h2 {
    margin: clamp(8px, 2.133vw, 10px) 0 clamp(16px, 4.267vw, 20px);
    color: var(--white);
    font-size: clamp(24px, 6.4vw, 31px);
    line-height: 1;
    font-weight: 700;
  }

  body.brand-rossetti-template .brand-quality-item p {
    width: auto;
    max-width: 100%;
    margin: 0;
    color: var(--white);
    font-size: clamp(12px, 3.2vw, 14px);
    line-height: 1.16;
    font-weight: 400;
  }

  body.brand-rossetti-template .br2-origins {
    position: relative;
    height: clamp(664px, 177.067vw, 850px);
    min-height: 0;
    padding: 0;
    overflow: hidden;
    background: var(--br2-cream);
    margin-top: 74px;
  }

  body.brand-rossetti-template .br2-origins__inner {
    position: relative;
    width: 100%;
    height: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
  }

  /* gradient from cream to transparent so titles remain readable over the map */
  body.brand-rossetti-template .br2-origins__inner::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: clamp(140px, 37.333vw, 179px);
    background: linear-gradient(to bottom, var(--br2-cream) 50%, transparent);
    z-index: 2;
    pointer-events: none;
  }

  body.brand-rossetti-template .br2-kicker {
    position: absolute;
    left: max(var(--br2-mobile-gutter), calc(50vw - 215px));
    top: 0;
    margin: 0;
    padding: 0;
    color: var(--br2-black);
    font-size: clamp(12px, 3.2vw, 14px);
    line-height: 1.16;
    font-weight: 700;
    z-index: 3;
  }

  body.brand-rossetti-template .br2-origins h2 {
    position: absolute;
    left: max(var(--br2-mobile-gutter), calc(50vw - 215px));
    top: clamp(21px, 5.6vw, 27px);
    width: min(var(--br2-mobile-content), 300px);
    margin: 0;
    padding: 0;
    color: var(--br2-black);
    font-size: clamp(32px, 8.533vw, 41px);
    line-height: 0.98;
    font-weight: 900;
    z-index: 3;
  }

  body.brand-rossetti-template .br2-origins h2 span {
    display: block;
    color: transparent;
    -webkit-text-stroke: 1px var(--br2-black);
  }

  body.brand-rossetti-template .br2-origin-map {
    position: absolute;
    left: 0;
    top: clamp(43px, 11.467vw, 55px);
    width: 100%;
    height: clamp(332px, 88.533vw, 425px);
    margin: 0;
    overflow: hidden;
    z-index: 1;
  }

  /* hide the embedded SVG beans — they drift off-center when the map transforms */
  body.brand-rossetti-template .br2-origin-map__art svg #Vector,
  body.brand-rossetti-template .br2-origin-map__art svg #Vector_2,
  body.brand-rossetti-template .br2-origin-map__art svg #Vector_3,
  body.brand-rossetti-template .br2-origin-map__art svg #Vector_4 {
    display: none;
  }

  /* centered coffee bean — always at the visual center of the map */
  body.brand-rossetti-template .br2-origin-map::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: clamp(35px, 9.333vw, 45px);
    height: clamp(38px, 10.133vw, 49px);
    background: url("assets/images/the-coffee/origin-bean.svg") center / contain
      no-repeat;
    z-index: 2;
    pointer-events: none;
  }

  body.brand-rossetti-template .br2-origin-line,
  body.brand-rossetti-template .br2-origin-card {
    display: none !important;
  }

  body.brand-rossetti-template .br2-origin-map__art {
    position: absolute;
    left: clamp(-366px, -76.267vw, -286px);
    top: clamp(-241px, -50.133vw, -188px);
    width: clamp(948px, 252.8vw, 1213px);
    height: clamp(706px, 188.267vw, 904px);
    max-width: none;
    transform-origin: center center;
    transition: transform 0.7s ease;
  }

  body.brand-rossetti-template
    .br2-origin-map[data-origin="colombia"]
    .br2-origin-map__art {
    transform: scale(1.65) translate(20%, -14%);
  }

  body.brand-rossetti-template
    .br2-origin-map[data-origin="brazil"]
    .br2-origin-map__art {
    transform: scale(2.18) translate(22%, -26%);
  }

  body.brand-rossetti-template
    .br2-origin-map[data-origin="ethiopia"]
    .br2-origin-map__art {
    transform: scale(2.18) translate(-5%, -13%);
  }

  body.brand-rossetti-template
    .br2-origin-map[data-origin="indonesia"]
    .br2-origin-map__art {
    transform: scale(2.18) translate(-28%, -20%);
  }

  body.brand-rossetti-template .br2-origin-slider {
    position: absolute;
    left: 0;
    top: clamp(407px, 108.533vw, 521px);
    display: block;
    width: 100%;
    padding: 0;
  }

  body.brand-rossetti-template .br2-origin-slider__track-wrap {
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-padding-left: var(--br2-origin-gutter);
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding: 0;
  }

  body.brand-rossetti-template
    .br2-origin-slider__track-wrap::-webkit-scrollbar {
    display: none;
  }

  body.brand-rossetti-template .br2-origin-slider__track {
    display: flex;
    flex-wrap: nowrap;
    gap: clamp(19px, 5.067vw, 24px);
    padding-left: var(--br2-origin-gutter);
    padding-right: var(--br2-origin-gutter);
  }

  body.brand-rossetti-template .br2-origin-slide {
    position: relative;
    flex: 0 0 var(--br2-mobile-origin-card);
    width: var(--br2-mobile-origin-card);
    min-height: clamp(115px, 30.667vw, 147px);
    height: auto;
    display: block;
    min-width: 0;
    color: var(--br2-gold);
    text-decoration: none;
    scroll-snap-align: start;
    padding-left: clamp(86px, 22.933vw, 110px);
    padding-top: clamp(19px, 5.067vw, 24px);
    padding-bottom: clamp(10px, 2.667vw, 13px);
    box-sizing: border-box;
  }

  body.brand-rossetti-template .br2-origin-slide__photo {
    position: absolute;
    left: 0;
    top: 0;
    width: var(--br2-mobile-origin-photo);
    height: var(--br2-mobile-origin-photo);
    border-radius: clamp(8.5px, 2.267vw, 11px);
    overflow: hidden;
    box-shadow: -14px 14px 21px -2px rgba(0, 0, 0, 0.17);
  }

  body.brand-rossetti-template .br2-origin-slide__photo img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
  }

  body.brand-rossetti-template .br2-origin-slide__body {
    position: static;
    display: block;
    width: auto;
  }

  body.brand-rossetti-template .br2-origin-slide__label {
    display: inline-flex;
    min-width: clamp(67px, 17.867vw, 86px);
    height: clamp(24px, 6.4vw, 31px);
    padding: 0 clamp(9px, 2.4vw, 12px);
    align-items: center;
    justify-content: center;
    background: #e1d7bb;
    color: var(--br2-gold);
    font-size: clamp(18px, 4.8vw, 23px);
    line-height: 1;
    font-weight: 700;
    white-space: nowrap;
    margin-left: -5px;
    z-index: 39;
    position: relative;
  }

  body.brand-rossetti-template .br2-origin-slide__text {
    display: block;
    width: auto;
    margin: clamp(14px, 3.733vw, 18px) 0 0 clamp(34px, 9.067vw, 44px);
    color: var(--br2-gold);
    font-size: clamp(12px, 3.2vw, 14px);
    line-height: 1.08;
    font-weight: 400;
  }

  body.brand-rossetti-template .br2-origin-slider__counter {
    position: absolute;
    left: 50%;
    top: clamp(149px, 39.733vw, 191px);
    display: flex;
    width: var(--br2-mobile-track);
    flex-direction: column;
    align-items: flex-end;
    gap: 24px;
    margin: 0;
    padding: 0;
    transform: translateX(-50%);
  }

  body.brand-rossetti-template .br2-origin-slider__num {
    color: var(--br2-gold);
    font-size: clamp(18px, 4.8vw, 23px);
    line-height: 1;
    font-weight: 400;
  }

  body.brand-rossetti-template .br2-origin-slider__line {
    position: relative;
    width: var(--br2-mobile-track);
    height: 1px;
    background: rgba(133, 117, 78, 0.35);
  }

  body.brand-rossetti-template .br2-origin-slider__bar {
    position: absolute;
    left: 0;
    top: -1.5px;
    width: var(--br2-mobile-thumb);
    height: 4px;
    background: var(--br2-gold);
    transition: transform 0.25s ease;
  }

  body.brand-rossetti-template .br2-products {
    position: relative;
    height: clamp(1114px, 297.067vw, 1426px);
    min-height: 0;
    padding: 0;
    overflow: hidden;
    background: var(--br2-black);
  }

  body.brand-rossetti-template .br2-products__bg {
    top: 0;
    bottom: auto;
    height: 100%;
    background-size: cover;
    background-position: center bottom;
    opacity: 0.75;
  }

  body.brand-rossetti-template .br2-products__shade {
    inset: 0;
    background: rgba(35, 31, 32, 0.94);
  }

  body.brand-rossetti-template .br2-products__inner {
    position: relative;
    width: 100%;
    height: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
  }

  body.brand-rossetti-template .br2-products .products-section__header {
    position: absolute;
    left: max(var(--br2-mobile-gutter), calc(50vw - 215px));
    top: clamp(54px, 14.4vw, 69px);
    display: block;
    margin: 0;
    padding: 0;
  }

  body.brand-rossetti-template .br2-products .products-section__heading {
    margin: 0;
    color: var(--white);
    text-align: left;
    font-size: clamp(32px, 8.533vw, 41px);
    line-height: 0.98;
    font-weight: 900;
  }

  body.brand-rossetti-template .br2-products .products-section__heading span {
    color: transparent;
    -webkit-text-stroke: 1px var(--white);
  }

  body.brand-rossetti-template .br2-products__tabs-shell {
    position: absolute;
    left: 50%;
    top: clamp(141px, 37.6vw, 181px);
    width: min(var(--br2-mobile-content), 360px);
    display: block;
    margin: 0;
    padding: 0;
    transform: translateX(-50%);
  }

  body.brand-rossetti-template .br2-products .products-filter-tabs {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: clamp(38px, 14.133vw, 68px);
  }

  body.brand-rossetti-template .br2-products .products-tab-btn {
    gap: clamp(11px, 2.933vw, 14px);
    flex: 0 0 auto;
  }

  body.brand-rossetti-template .br2-products__tab-icon {
    width: clamp(68.35px, 18.227vw, 87px);
    height: clamp(68.35px, 18.227vw, 87px);
  }

  body.brand-rossetti-template .br2-products__tab-icon svg {
    width: clamp(28px, 7.467vw, 36px);
    height: clamp(28px, 7.467vw, 36px);
  }

  body.brand-rossetti-template .br2-products__tab-label {
    font-size: clamp(12px, 3.2vw, 14px);
    line-height: 1;
    font-weight: 700;
  }

  body.brand-rossetti-template .br2-products .products-carousel-shell {
    position: absolute;
    left: 0;
    top: clamp(308px, 82.133vw, 394px);
    width: 100%;
    height: var(--br2-mobile-product-height);
    margin: 0;
    padding: 0 0 0 var(--br2-mobile-gutter);
    overflow: hidden;
  }

  body.brand-rossetti-template .br2-products .products-slider-wrap.is-active {
    display: block;
  }

  body.brand-rossetti-template
    .br2-products
    .products-slider:not(.slick-initialized) {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    height: var(--br2-mobile-product-height);
    margin: 0;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  body.brand-rossetti-template
    .br2-products
    .products-slider:not(.slick-initialized)::-webkit-scrollbar {
    display: none;
  }

  body.brand-rossetti-template .br2-products .products-slider.slick-initialized,
  body.brand-rossetti-template
    .br2-products
    .products-slider.slick-initialized
    .slick-list {
    height: var(--br2-mobile-product-height);
    margin: 0;
    overflow: visible;
  }

  body.brand-rossetti-template
    .br2-products
    .products-slider.slick-initialized
    .slick-track {
    display: flex;
    align-items: stretch;
  }

  body.brand-rossetti-template
    .br2-products
    .products-slider.slick-initialized
    .slick-slide,
  body.brand-rossetti-template .br2-products .product-slide {
    flex: 0 0 var(--br2-mobile-product-slide);
    width: var(--br2-mobile-product-slide) !important;
    height: var(--br2-mobile-product-height) !important;
    padding: 0 clamp(19px, 5.067vw, 24px) 0 0;
    display: flex !important;
    align-items: stretch;
    box-sizing: border-box;
    scroll-snap-align: start;
  }

  body.brand-rossetti-template .br2-products .product-card {
    position: relative;
    width: var(--br2-mobile-product-card);
    min-height: var(--br2-mobile-product-height);
    height: var(--br2-mobile-product-height);
    flex: 0 0 var(--br2-mobile-product-card);
    border-radius: 4px;
    filter: none;
    overflow: hidden;
  }

  body.brand-rossetti-template .br2-products .product-card__image {
    height: clamp(200px, 53.333vw, 256px);
    flex: 0 0 clamp(200px, 53.333vw, 256px);
    padding: clamp(19px, 5.067vw, 24px) clamp(24px, 6.4vw, 31px) 0;
  }

  body.brand-rossetti-template .br2-products .product-card__image img {
    max-width: clamp(130px, 34.667vw, 166px);
    max-height: clamp(179px, 47.733vw, 229px);
  }

  body.brand-rossetti-template .br2-products .product-card__wishlist {
    top: clamp(7px, 1.867vw, 9px);
    left: clamp(8px, 2.133vw, 10px);
    width: clamp(25px, 6.667vw, 32px);
    height: clamp(25px, 6.667vw, 32px);
  }

  body.brand-rossetti-template .br2-products .product-card__badges {
    top: 0;
    right: clamp(19px, 5.067vw, 24px);
  }

  body.brand-rossetti-template .br2-products .product-card__badge {
    width: clamp(45px, 12vw, 58px);
    height: clamp(44px, 11.733vw, 56px);
    border-radius: 0 4px 0 4px;
    color: var(--br2-black);
    font-size: clamp(12px, 3.2vw, 14px);
    line-height: 1;
    font-weight: 900;
  }

  body.brand-rossetti-template .br2-products .product-card__body {
    flex: 1;
    padding: 0 clamp(24px, 6.4vw, 31px) clamp(15px, 4vw, 19px);
  }

  body.brand-rossetti-template .br2-products .product-card__name {
    margin: 0 0 clamp(15px, 4vw, 19px);
    color: var(--br2-black);
    font-size: clamp(12px, 3.2vw, 14px);
    line-height: 1.12;
    font-weight: 900;
  }

  body.brand-rossetti-template .br2-products .product-card__desc {
    margin: 0;
    color: rgba(35, 31, 32, 0.88);
    font-size: clamp(12px, 3.2vw, 14px);
    line-height: 1.18;
    font-weight: 400;
    -webkit-line-clamp: 4;
  }

  body.brand-rossetti-template .br2-products .product-card__pricing {
    display: block;
    margin: clamp(28px, 7.467vw, 36px) 0 0;
  }

  body.brand-rossetti-template .br2-products .product-card__old-price {
    display: block;
    color: rgba(35, 31, 32, 0.55);
    font-size: clamp(12px, 3.2vw, 14px);
    line-height: 1;
  }

  body.brand-rossetti-template .br2-products .product-card__price {
    display: block;
    margin-top: clamp(5px, 1.333vw, 6px);
    color: var(--br2-black);
    font-size: clamp(24px, 6.4vw, 31px);
    line-height: 1;
    font-weight: 900;
  }

  body.brand-rossetti-template .br2-products .product-card__offer {
    display: flex;
    align-items: center;
    gap: clamp(6px, 1.6vw, 8px);
    margin-top: clamp(17px, 4.533vw, 22px);
  }

  body.brand-rossetti-template .br2-products .product-card__discount {
    min-width: clamp(45px, 12vw, 58px);
    height: clamp(19px, 5.067vw, 24px);
    padding: 0 clamp(6px, 1.6vw, 8px);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
    background: #e1d7bb;
    color: var(--br2-gold);
    font-size: clamp(10px, 2.667vw, 12px);
    line-height: 1;
    font-weight: 900;
  }

  body.brand-rossetti-template .br2-products .product-card__offer-text {
    color: rgba(35, 31, 32, 0.65);
    font-size: clamp(12px, 3.2vw, 14px);
    line-height: 1;
  }

  body.brand-rossetti-template .br2-products .product-card__cart {
    position: absolute;
    right: 0;
    bottom: 0;
    width: clamp(39px, 10.4vw, 50px);
    height: clamp(39px, 10.4vw, 50px);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 3px 0 4px 0;
    background: var(--br2-red-brown);
    color: var(--white);
  }

  body.brand-rossetti-template .br2-products .product-card__cart svg {
    width: clamp(20px, 5.333vw, 26px);
    height: clamp(20px, 5.333vw, 26px);
    display: block;
  }

  body.brand-rossetti-template .br2-products .products-arrow {
    display: none;
  }

  body.brand-rossetti-template .br2-products .products-carousel-shell {
    width: 100%;
    height: auto;
    padding: 0 0 0 var(--gutter);
    overflow: hidden;
  }

  body.brand-rossetti-template
    .br2-products
    .products-slider:not(.slick-initialized) {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    height: auto;
    margin: 0;
    overflow-x: auto;
    overflow-y: visible;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  body.brand-rossetti-template .br2-products .products-slider,
  body.brand-rossetti-template .br2-products .products-slider.slick-initialized,
  body.brand-rossetti-template
    .br2-products
    .products-slider.slick-initialized
    .slick-list {
    height: auto;
    margin: 0;
    overflow: visible;
  }

  body.brand-rossetti-template
    .br2-products
    .products-slider.slick-initialized
    .slick-list {
    padding-top: 0;
  }

  body.brand-rossetti-template
    .br2-products
    .products-slider.slick-initialized
    .slick-slide,
  body.brand-rossetti-template .br2-products .product-slide {
    flex: 0 0 70vw;
    width: 70vw !important;
    height: auto !important;
    padding: 0 25px 0 0;
    display: flex !important;
    align-items: stretch;
    box-sizing: border-box;
    scroll-snap-align: start;
  }

  /* brand-rossetti rs-shop-card overrides removed — the card uses the same
     standard styling as every other product card */

  body.brand-rossetti-template .br2-products .product-card {
    width: 100%;
    min-height: 438px;
    height: auto;
    flex: 1;
    border-radius: 4px;
    filter: none;
  }

  body.brand-rossetti-template .br2-products .product-card__image {
    height: 196px;
    flex-basis: 196px;
    padding: 34px 22px 12px;
  }

  body.brand-rossetti-template .br2-products .product-card__image img {
    max-width: 100%;
    max-height: 152px;
  }

  body.brand-rossetti-template .br2-products .product-card__wishlist {
    left: 14px;
    top: 14px;
    width: 15px;
    height: 15px;
  }

  body.brand-rossetti-template .br2-products .product-card__badges {
    top: 0;
    right: 20px;
  }

  body.brand-rossetti-template .br2-products .product-card__badge {
    width: 45px;
    height: 45px;
    border-radius: 0 4px 0 4px;
    font-size: 10px;
  }

  body.brand-rossetti-template .br2-products .product-card__body {
    padding: 18px 17px 20px;
  }

  body.brand-rossetti-template .br2-products .product-card__name {
    margin-bottom: 12px;
    font-size: 12px;
    line-height: 1.12;
  }

  body.brand-rossetti-template .br2-products .product-card__desc,
  body.brand-rossetti-template .br2-products .product-card__old-price,
  body.brand-rossetti-template .br2-products .product-card__offer-text {
    font-size: 12px;
    line-height: 1.16;
  }

  body.brand-rossetti-template .br2-products .product-card__desc {
    margin-bottom: 17px;
    -webkit-line-clamp: 4;
  }

  body.brand-rossetti-template .br2-products .product-card__pricing {
    margin-top: 0;
  }

  body.brand-rossetti-template .br2-products .product-card__price {
    font-size: 18px;
  }

  body.brand-rossetti-template .br2-products .product-card__discount {
    min-width: 41px;
    height: 19px;
    padding: 0 6px;
    border-radius: 3px;
    font-size: 10px;
  }

  body.brand-rossetti-template .br2-products .product-card__cart {
    width: 35px;
    height: 35px;
    border-radius: 3px 0 4px 0;
  }

  body.brand-rossetti-template .br2-products .product-card__cart svg {
    width: 18px;
    height: 18px;
  }

  body.brand-rossetti-template .br2-products .products-section__footer {
    position: absolute;
    left: 50%;
    top: clamp(747px, 206.2vw, 956px);
    z-index: 3;
    width: var(--br2-mobile-track);
    display: block;
    margin: 0;
    transform: translateX(-50%);
  }

  body.brand-rossetti-template .br2-products .products-nav-bottom {
    width: var(--br2-mobile-track);
    align-items: flex-end;
    gap: clamp(16px, 4.267vw, 20px);
  }

  body.brand-rossetti-template
    .br2-products
    .products-nav-bottom
    .js-slide-current {
    color: var(--white);
    font-size: clamp(18px, 4.8vw, 23px);
    line-height: 1;
    font-weight: 400;
  }

  body.brand-rossetti-template .br2-products .products-progress-track {
    width: var(--br2-mobile-track);
    background: rgba(255, 255, 255, 0.55);
  }

  body.brand-rossetti-template .br2-products .products-progress-thumb {
    width: var(--br2-mobile-thumb);
    height: 4px;
    top: -1.5px;
    border: 0;
    background: var(--white);
  }

  body.brand-rossetti-template .br2-products__more {
    position: absolute;
    left: 0;
    top: clamp(854px, 227.733vw, 1093px);
    z-index: 3;
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 0;
  }

  body.brand-rossetti-template .br2-products__more .btn-gold {
    width: clamp(116px, 30.933vw, 148px);
    height: clamp(51px, 13.6vw, 65px);
    min-width: 0;
    padding: 0;
    border-radius: clamp(13px, 3.467vw, 17px);
    font-size: clamp(14px, 3.733vw, 16px);
    line-height: 1;
  }

  body.brand-rossetti-template .br2-products__quote {
    position: absolute;
    left: 50%;
    top: clamp(965px, 257.333vw, 1235px);
    z-index: 3;
    width: 80%;
    display: grid;
    grid-template-columns: clamp(21px, 5.6vw, 27px) minmax(0, 1fr);
    gap: clamp(8px, 2.133vw, 10px);
    margin: 0;
    padding: 0;
    color: var(--white);
    transform: translateX(-50%);
  }

  body.brand-rossetti-template .br2-products__quote img {
    width: clamp(21px, 5.6vw, 27px);
    height: 18px;
  }

  body.brand-rossetti-template .br2-products__quote p {
    margin: 0;
    font-size: clamp(18px, 4.8vw, 23px);
    line-height: 1.18;
    font-weight: 900;
  }

  body.brand-rossetti-template .site-footer {
    margin-top: 0;
  }

  a.icon-btn.icon-btn--wishlist {
    width: 23px;
  }
}

/* =====================================================
   HEADER SEARCH OVERLAY
   ===================================================== */

/* theme colour overrides for plugin CSS variables */
.header-search-overlay {
  --smart-text-color: var(--black);
  --smart-secondary-color: var(--gold);
  --smart-title-color: var(--black);
}

/* overlay bar */
.header-search-overlay {
  position: relative;
  width: 100%;
  background: var(--white);
  border-top: 1px solid var(--cream-mid);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.08);
  padding: 20px 0;
}

/* row: input + close button */
.header-search-overlay__inner {
  display: flex;
  align-items: center;
  gap: 20px;
}

/* plugin #site-search wrapper */
.header-search-overlay #site-search {
  flex: 1;
  margin: 0;
  padding: 0;
}

/* plugin search-bar-container */
.header-search-overlay .search-bar-container {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  border-bottom: 1.5px solid var(--black);
}

/* magnifier icon inside the bar */
.header-search-overlay .search-bar-container::after {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  background: url("assets/images/icon-search.svg") center / contain no-repeat;
  opacity: 0.35;
}

/* the actual input */
.header-search-overlay #smart-search-input {
  flex: 1;
  border: none;
  border-radius: 0;
  padding: 10px 12px 10px 0;
  font-family: var(--font);
  font-size: clamp(18px, 2vw, 24px);
  font-weight: 400;
  letter-spacing: -0.01em;
  background: transparent;
  outline: none;
  color: var(--black);
  width: 100%;
}

.header-search-overlay #smart-search-input::placeholder {
  color: var(--gray);
  opacity: 1;
}

/* speech-to-text button — not needed in header */
.header-search-overlay #speech-to-text-button {
  display: none;
}

/* close button */
.header-search-overlay__close {
  flex-shrink: 0;
  color: var(--black);
  opacity: 0.45;
  transition: opacity 0.2s;
}
.header-search-overlay__close:hover {
  opacity: 1;
}

/* ── Results panel ──────────────────────────────────────── */
/* override plugin's position:fixed so panel drops below the overlay bar */
.header-search-overlay .smart-search-results {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  width: 100%;
  background: var(--white);
  border-top: 1px solid var(--cream-mid);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.1);
  max-height: calc(100vh - 180px);
  overflow-y: auto;
  z-index: 999;
  padding: 32px 0 40px;
}

/* inner flex row for columns */
.header-search-overlay .smart-search-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 40px;
  display: flex;
  gap: 40px;
  align-items: flex-start;
}

/* column headings */
.header-search-overlay .smart-search-results h3,
.header-search-overlay .template1 h3 {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gray);
  border-bottom: 1px solid var(--cream-mid);
  padding-bottom: 8px;
  margin-bottom: 14px;
}

/* result links */
.header-search-overlay .smart-search-results a {
  font-family: var(--font);
  font-size: 14px;
  font-weight: 500;
  color: var(--black) !important;
  transition: color 0.15s;
  text-decoration: none;
}
.header-search-overlay .smart-search-results a:hover {
  color: var(--gold) !important;
}

/* product image thumbnails */
.header-search-overlay .smart-search-results img {
  width: 56px;
  height: 68px;
  object-fit: cover;
  margin-right: 12px;
  border-radius: 2px;
  flex-shrink: 0;
}

/* highlighted match text */
.header-search-overlay .highlighted {
  color: var(--gold);
  font-weight: 700;
}

/* "see all results" link */
.header-search-overlay .see-all-results-btn {
  font-family: var(--font);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--gold) !important;
  padding: 0;
  background: none;
  border: none;
  cursor: pointer;
}

/* hide plugin's own close button — we have our own */
.header-search-overlay .close-btn,
.header-search-overlay .closeResults,
.header-search-overlay .template1-close-results {
  display: none !important;
}

/* ── Mobile ─────────────────────────────────────────────── */
@media (max-width: 991px) {
  .header-search-overlay {
    padding: 14px 0;
  }

  .header-search-overlay #smart-search-input {
    font-size: 18px;
  }

  .header-search-overlay .smart-search-results {
    padding: 20px 0 28px;
    max-height: calc(100vh - 130px);
  }

  .header-search-overlay .smart-search-inner {
    flex-direction: column;
    gap: 24px;
    padding: 0 20px;
  }
}

li.header-nav__eshop-item.menu-item a {
  color: var(--gold);
  border: 1px solid var(--gold);
}

li.header-nav__eshop-item.menu-item a:hover {
  color: white;
}

/* Coffee play button — the full Figma SVG (translucent square + play-triangle
   cutout) is the whole visual, so the CSS square/blur/red-icon are cleared and
   the SVG fills the button at every breakpoint. */
.home .coffee-play-btn {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.home .coffee-play-btn svg {
  width: 100%;
  height: 100%;
}

.home .coffee-play-btn svg path {
  fill: #fff;
  stroke: none;
}

/* =====================================================
   MY ACCOUNT  (WooCommerce — logged-in dashboard)
   Default [woocommerce_my_account] markup, themed to match
   the cart/checkout pages. Scoped to .woocommerce-account.
   ===================================================== */

/* Page shell + title row (page.php outputs the raw shortcode
   with no wrapper, so the .woocommerce div is the container). */
.woocommerce-account .woocommerce {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  align-items: start;
  column-gap: 48px;
  row-gap: 32px;
  width: min(100% - 96px, 1500px);
  margin: 60px auto 120px;
}

.woocommerce-account .woocommerce::before {
  content: "Ο Λογαριασμός μου";
  grid-column: 1 / -1;
  font-size: clamp(28px, calc(11.332616px + 1.076426vw), 40px);
  font-weight: 900;
  line-height: 1;
  color: var(--black);
}

/* ── Sidebar navigation ── */
.woocommerce-account .woocommerce-MyAccount-navigation {
  /* override WooCommerce defaults (float:left; width:30%) */
  float: none;
  width: 100%;
  position: sticky;
  top: 100px;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 12px;
  background: var(--cream-light);
  border-radius: 16px;
}

.woocommerce-account .woocommerce-MyAccount-navigation-link {
  margin: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation-link a {
  display: flex;
  align-items: center;
  padding: 15px 20px;
  border-radius: 10px;
  color: var(--black);
  font-size: clamp(15px, calc(15px + 0vw), 16px);
  font-weight: 700;
  line-height: 1;
  transition:
    background 0.2s ease,
    color 0.2s ease;
}

.woocommerce-account .woocommerce-MyAccount-navigation-link a:hover {
  color: var(--gold);
}

.woocommerce-account .woocommerce-MyAccount-navigation-link.is-active a {
  background: var(--gold);
  color: var(--white);
}

.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a {
  color: var(--dark-red);
}

/* ── Content panel ── */
.woocommerce-account .woocommerce-MyAccount-content {
  /* override WooCommerce defaults (float:right; width:68%) */
  float: none;
  width: 100%;
  min-width: 0;
  padding: 44px 48px;
  background: var(--white);
  border-radius: 16px;
  box-shadow: 0 0 4.8px rgba(0, 0, 0, 0.04);
  color: var(--black);
  font-size: clamp(15px, calc(15px + 0vw), 16px);
  line-height: 1.6;
}

.woocommerce-account .woocommerce-MyAccount-content p {
  margin: 0 0 18px;
}

.woocommerce-account .woocommerce-MyAccount-content p:last-child {
  margin-bottom: 0;
}

.woocommerce-account .woocommerce-MyAccount-content a:not(.button) {
  color: var(--gold);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.woocommerce-account .woocommerce-MyAccount-content mark {
  background: transparent;
  color: var(--black);
  font-weight: 700;
}

.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3 {
  margin: 0 0 20px;
  font-size: clamp(20px, calc(11.466093px + 0.861141vw), 28px);
  font-weight: 700;
  line-height: 1.1;
  color: var(--black);
}

/* ── Tables (orders / downloads) ── */
.woocommerce-account .woocommerce-MyAccount-content table.shop_table {
  width: 100%;
  margin: 0;
  border: 0;
  border-collapse: collapse;
  font-size: clamp(14px, calc(14px + 0vw), 15px);
}

.woocommerce-account .woocommerce-MyAccount-content table.shop_table thead th {
  padding: 0 16px 14px;
  border-bottom: 1px solid rgba(35, 31, 32, 0.14);
  color: var(--gold);
  font-weight: 700;
  text-align: left;
  white-space: nowrap;
}

.woocommerce-account .woocommerce-MyAccount-content table.shop_table tbody td {
  padding: 20px 16px;
  border-bottom: 1px solid rgba(35, 31, 32, 0.08);
  color: var(--black);
  vertical-align: middle;
}

.woocommerce-account
  .woocommerce-MyAccount-content
  table.shop_table
  td.woocommerce-orders-table__cell-order-actions {
  text-align: right;
  white-space: nowrap;
}

.woocommerce-account
  .woocommerce-MyAccount-content
  table.shop_table
  .woocommerce-orders-table__cell-order-actions
  .button
  + .button {
  margin-left: 8px;
}

/* ── Addresses ── */
.woocommerce-account .woocommerce-Addresses {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
  margin: 0;
}

.woocommerce-account .woocommerce-Address {
  padding: 28px 30px;
  background: var(--cream);
  border-radius: 14px;
}

.woocommerce-account .woocommerce-Address-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}

.woocommerce-account .woocommerce-Address-title h2,
.woocommerce-account .woocommerce-Address-title h3 {
  margin: 0;
}

.woocommerce-account .woocommerce-Address address {
  font-style: normal;
  line-height: 1.6;
  color: var(--black);
}

/* ── Forms (edit account / edit address) ── */
.woocommerce-account .woocommerce-MyAccount-content form {
  max-width: 720px;
}

.woocommerce-account .woocommerce-MyAccount-content form .form-row {
  display: flex;
  flex-direction: column;
  margin: 0 0 22px;
}

.woocommerce-account .woocommerce-MyAccount-content form .form-row-first,
.woocommerce-account .woocommerce-MyAccount-content form .form-row-last {
  display: inline-flex;
  width: calc(50% - 11px);
  vertical-align: top;
}

.woocommerce-account .woocommerce-MyAccount-content form .form-row-first {
  margin-right: 22px;
}

.woocommerce-account .woocommerce-MyAccount-content form label {
  margin: 0 0 8px;
  color: var(--black);
  font-size: clamp(14px, calc(14px + 0vw), 15px);
  font-weight: 700;
  line-height: 1.2;
}

.woocommerce-account .woocommerce-MyAccount-content form .required {
  color: var(--gold);
  text-decoration: none;
  border: 0;
}

.woocommerce-account .woocommerce-MyAccount-content form .input-text,
.woocommerce-account .woocommerce-MyAccount-content form input[type="text"],
.woocommerce-account .woocommerce-MyAccount-content form input[type="email"],
.woocommerce-account .woocommerce-MyAccount-content form input[type="tel"],
.woocommerce-account .woocommerce-MyAccount-content form input[type="password"],
.woocommerce-account .woocommerce-MyAccount-content form select,
.woocommerce-account .woocommerce-MyAccount-content form .select2-selection {
  width: 100%;
  height: 52px;
  padding: 0 18px;
  border: 1px solid rgba(35, 31, 32, 0.28);
  border-radius: 10px;
  background: var(--white);
  color: var(--black);
  font-family: var(--font);
  font-size: clamp(15px, calc(15px + 0vw), 16px);
  line-height: 52px;
  outline: none;
  transition: border-color 0.15s ease;
  -webkit-appearance: none;
  appearance: none;
  box-shadow: none;
}

.woocommerce-account .woocommerce-MyAccount-content form .input-text:focus,
.woocommerce-account .woocommerce-MyAccount-content form select:focus {
  border-color: var(--gold);
}

.woocommerce-account .woocommerce-MyAccount-content form fieldset {
  margin: 34px 0 0;
  padding: 28px 0 0;
  border: 0;
  border-top: 1px solid rgba(35, 31, 32, 0.14);
}

.woocommerce-account .woocommerce-MyAccount-content form fieldset legend {
  padding: 0;
  margin: 0 0 20px;
  font-size: clamp(18px, calc(18px + 0vw), 22px);
  font-weight: 700;
  color: var(--black);
}

.woocommerce-account .woocommerce-MyAccount-content form span em {
  display: block;
  margin-top: 6px;
  color: var(--gray);
  font-size: clamp(13px, calc(13px + 0vw), 13px);
  font-style: normal;
}

/* ── Buttons ── */
.woocommerce-account .woocommerce-MyAccount-content .button,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Button,
.woocommerce-account .woocommerce-MyAccount-content button[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 54px;
  min-width: 134px;
  padding: 0 30px;
  border: 0;
  border-radius: 15px;
  background: var(--gold);
  color: var(--white);
  font-family: var(--font);
  font-size: clamp(15px, calc(15px + 0vw), 16px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.2s ease;
}

.woocommerce-account .woocommerce-MyAccount-content .button:hover,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Button:hover,
.woocommerce-account
  .woocommerce-MyAccount-content
  button[type="submit"]:hover {
  background: #6e6040;
  color: var(--white);
}

/* Small "View" button in the orders table */
.woocommerce-account .woocommerce-MyAccount-content table.shop_table .button {
  height: 42px;
  min-width: 0;
  padding: 0 22px;
  border-radius: 10px;
}

/* ── Pagination ── */
.woocommerce-account .woocommerce-pagination {
  margin-top: 28px;
}

.woocommerce-account .woocommerce-pagination ul {
  display: inline-flex;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
  border: 0;
}

.woocommerce-account .woocommerce-pagination ul li a,
.woocommerce-account .woocommerce-pagination ul li span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  padding: 0 12px;
  border-radius: 10px;
  background: var(--cream-light);
  color: var(--black);
  font-weight: 700;
}

.woocommerce-account .woocommerce-pagination ul li span.current {
  background: var(--gold);
  color: var(--white);
}

/* ── Notices (scoped so the global cream notice doesn't apply here) ── */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-error {
  width: 100%;
  margin: 0 0 24px;
  padding: 16px 20px;
  border-radius: 10px;
  background: var(--cream);
  border-left: 3px solid var(--gold);
  color: var(--black);
  list-style: none;
}

.woocommerce-account .woocommerce-MyAccount-content .woocommerce-error {
  border-left-color: var(--dark-red);
}

/* ── Responsive (991px — the project's single breakpoint) ── */
@media (max-width: 991px) {
  .woocommerce-account .woocommerce {
    grid-template-columns: 1fr;
    width: 100%;
    margin: 40px 0 72px;
    padding-inline: var(--gutter);
    box-sizing: border-box;
  }

  .woocommerce-account .woocommerce-MyAccount-navigation {
    position: static;
  }

  .woocommerce-account .woocommerce-MyAccount-navigation ul {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 8px;
    scrollbar-width: none;
  }

  .woocommerce-account .woocommerce-MyAccount-navigation ul::-webkit-scrollbar {
    display: none;
  }

  .woocommerce-account .woocommerce-MyAccount-navigation-link a {
    white-space: nowrap;
    padding: 12px 16px;
  }

  .woocommerce-account .woocommerce-MyAccount-content {
    padding: 28px 24px;
  }

  .woocommerce-account .woocommerce-Addresses {
    grid-template-columns: 1fr;
  }

  .woocommerce-account .woocommerce-MyAccount-content form .form-row-first,
  .woocommerce-account .woocommerce-MyAccount-content form .form-row-last {
    width: 100%;
  }

  .woocommerce-account .woocommerce-MyAccount-content form .form-row-first {
    margin-right: 0;
  }

  /* Orders table → stacked cards on mobile */
  .woocommerce-account .woocommerce-MyAccount-content table.shop_table thead {
    display: none;
  }

  .woocommerce-account
    .woocommerce-MyAccount-content
    table.shop_table
    tbody
    tr {
    display: block;
    margin-bottom: 16px;
    padding: 8px 0;
    border: 1px solid rgba(35, 31, 32, 0.12);
    border-radius: 12px;
  }

  .woocommerce-account
    .woocommerce-MyAccount-content
    table.shop_table
    tbody
    td {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 10px 18px;
    border: 0;
    text-align: right;
  }

  .woocommerce-account
    .woocommerce-MyAccount-content
    table.shop_table
    tbody
    td::before {
    content: attr(data-title);
    color: var(--gold);
    font-weight: 700;
    text-align: left;
  }

  .woocommerce-account
    .woocommerce-MyAccount-content
    table.shop_table
    td.woocommerce-orders-table__cell-order-actions {
    justify-content: flex-end;
  }
}