/** Shopify CDN: Minification failed

Line 2676:2 Unexpected "{"
Line 2676:3 Expected identifier but found "%"
Line 2676:63 Unexpected "{"
Line 2676:64 Expected identifier but found "%"

**/
/* SHOPIFY_STYLESHEETS_VERSION: 1.0 */


/* CSS from section stylesheet tags */
/* START_SECTION:footer (INDEX:13) */
.ff-footer {
  --ff-footer-text: var(--ff-ink);
  --ff-footer-accent: var(--ff-terracotta);
  --ff-footer-heading: var(--ff-ink);
  --ff-footer-link: var(--ff-ink);
  --ff-footer-btn-bg: var(--ff-brown);
  --ff-footer-btn-hover: var(--ff-brown-2);
  --ff-footer-btn-fg: #fff;
  --ff-footer-panel-bg: #faf7f2;
  padding-block: clamp(3rem, 2rem + 4vw, 5rem);
  color: var(--ff-footer-text);
}

.ff-footer__inner {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 1.5rem + 2vw, 3rem);
}

/* Newsletter */
.ff-footer__news {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem 2rem;
}
.ff-footer__news-h {
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: clamp(1.75rem, 1.2rem + 2.5vw, 2.75rem);
  line-height: 1.2;
  color: var(--ff-footer-text);
  margin: 0;
}
.ff-footer__news-h .ff-accent { color: var(--ff-footer-accent); }
.ff-footer__news-form { max-width: 36rem; margin-left: auto; }
.ff-footer__news-row {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: stretch;
}
.ff-footer__news-input {
    min-width: 0;
    font: inherit;
    font-size: 1.125rem;
    font-weight: 500;
    color: var(--ff-brown);
    background: #fff6;
    border: 1px solid var(--ff-brown);
    border-radius: 40px;
    padding: .85rem 1.5rem;
    -webkit-backdrop-filter: blur(7.5px);
    backdrop-filter: blur(7.5px);
    max-width: 370px;
}
.ff-footer__news-input::placeholder { color:var(--ff-brown); }
.ff-footer__news-input:focus {
  outline: 2px solid var(--ff-footer-accent);
  outline-offset: 1px;
}
.ff-footer__news-btn {
  --bg: var(--ff-footer-btn-bg);
  --fg: var(--ff-footer-btn-fg);
  flex: 0 0 auto;
  white-space: nowrap;
  padding: 0.85rem 1.5rem;
  font-size: 1rem;
}
.ff-footer__news-btn:hover { --bg: var(--ff-footer-btn-hover); }
.ff-footer__news-success { font-weight: 500; color: var(--ff-teal); margin: 0; }

/* Panel */
.ff-footer__panel {
  background: var(--ff-footer-panel-bg);
  padding: clamp(2rem, 1.5rem + 2vw, 3rem);
  overflow: visible;
  border-radius: 15px;
border: 0 solid rgba(94, 68, 46, 0.30);
background: rgba(255, 255, 255, 0.20);
box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
}
.ff-footer__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr));
  gap: clamp(1.5rem, 1rem + 2vw, 2.5rem);
  align-items: start;
}
@media (min-width: 1025px) {
  .ff-footer__grid {
    grid-template-columns: minmax(220px, 1.4fr) repeat(auto-fit, minmax(140px, 1fr));
  }
}
.ff-footer__block--divider { grid-column: 1 / -1; }
.ff-footer__divider {
  border: 0;
  border-top: 1px solid rgba(94, 68, 46, 0.15);
  margin: 0;
}

/* Brand */
.ff-footer__logo { display: inline-block; text-decoration: none; margin-bottom: 1rem; }
.ff-footer__logo-img { display: block; height: auto; width: auto; max-width: 100%; aspect-ratio:unset !important; }
.ff-footer__logo-text {
  font-family: var(--ff-display);
  font-weight: 700;
  font-size: 1.5rem;
  letter-spacing: 0.06em;
  color: var(--ff-footer-accent);
  text-transform: uppercase;
}
.ff-footer__brand-text, .ff-footer__brand-text p {
  font-family: var(--ff-body);
  font-size: 1rem;
  line-height: 1.5;
  font-weight:400;
  color: var(--ff-footer-text);
  /* max-width: 36ch; */
}
.ff-footer__brand-text p { margin: 0; }
.ff-footer__social { margin-top: 1.25rem; }
.ff-footer__social .social-sharing { margin: 0; }

/* Columns */
body .ff-footer__col-title {
  font-family: var(--ff-display);
  font-weight: 600;
  line-height: 1.2;
  color: var(--ff-footer-heading) !important;
  margin: 0 0 1.1rem;
font-size: 25px !important;
font-style: normal;
font-weight: 700 !important;
line-height: normal;
}
.ff-footer__links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}
.ff-footer__link {
  font-family: var(--ff-body);
  font-size: 1rem;
  font-weight: 400;
  color: var(--ff-footer-link);
  text-decoration: none;
  transition: opacity 0.2s ease;
}
.ff-footer__link:hover { opacity: 0.7; }

/* Country / language selector — theme popout + cream styling */
.ff-footer__localization {
  --bg: var(--ff-footer-panel-bg);
  --text: var(--ff-footer-link);
  --border: rgba(94, 68, 46, 0.25);
  --input-bg: #fff;
  position: relative;
  margin-bottom: 1rem;
}
.ff-footer__localization--bottom {
  --bg: var(--ff-footer-panel-bg);
  margin-bottom: 0.75rem;
}
.ff-footer__localization .localization-form {
  justify-content: flex-start;
  margin-bottom: 0;
}
.ff-footer__localization .select-popout {
  position: relative;
  width: 100%;
  max-width: 100%;
}
.ff-footer__localization .select-popout__toggle {
  font-family: var(--ff-body);
  font-size: 1rem;
  font-weight: 400;
  color: var(--ff-footer-link);
  background: transparent;
  border: 0;
  padding: 0;
  padding-right: 1.5rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  text-align: left;
}
.ff-footer__localization .select-popout__toggle svg,
.ff-footer__localization .icon-select { width: 12px; height: auto; }
.ff-footer__localization .select-popout__list {
  left: 0;
  right: auto;
  transform: none;
  min-width: min(280px, 90vw);
  background: #fff;
  border-color: rgba(94, 68, 46, 0.2);
  color: var(--ff-footer-text);
}
.ff-footer__localization .select-popout__option {
  color: var(--ff-footer-text);
}
.ff-footer__localization .select-popout__option:hover {
  background: rgba(212, 135, 103, 0.12);
}
.ff-footer__copy {
  font-family: var(--ff-body);
  font-size: 1rem;
  color: var(--ff-footer-text);
  margin: 0;

}
.ff-footer__copy--bottom { text-align: inherit; }

/* Bottom bar */
.ff-footer__bottom {
  padding-top: 0.5rem;
  color: var(--ff-footer-text);
}
.ff-footer__bottom .localization-form {
  --bg: var(--ff-footer-panel-bg);
  --text: var(--ff-footer-link);
  --border: rgba(94, 68, 46, 0.25);
  --input-bg: #fff;
}

@media (max-width: 1024px) {
  .ff-footer__grid {
    grid-template-columns: 1fr 1fr;
  }
  .ff-footer__block--logo { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .ff-footer__link {
    font-size: 1rem;
    line-height: 1;
}
  .ff-footer__panel {
  padding: clamp(1rem,0.5rem + 2vw,2rem);
}
  .ff-footer__brand-text, .ff-footer__brand-text p {
  font-size: 1rem;
}
  body .ff-footer__col-title {
font-size: 24px !important;
}
  .ff-footer__news { flex-direction: column; align-items: stretch; }
  .ff-footer__news-form { max-width: none; margin-left: 0; }
  .ff-footer__news-row { flex-direction: column; }
  .ff-footer__news-btn { justify-content: center; width: 100%; }
  .ff-footer__grid { grid-template-columns: 1fr; }
  .ff-footer__news-input {
    max-width: 100%;
}
}
/* END_SECTION:footer */

/* START_SECTION:forge-benefit-tiles (INDEX:14) */
.ff-benefit {
  overflow: clip;
  position: relative;
}

/* ---- Tile row ---- */
.ff-benefit__row {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 20px;
  align-items: stretch;
}
.ff-benefit__cell { display: flex; }

.ff-benefit__tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 100%;
  min-height: 0;
  padding: 20px 16px 24px;
  background: var(--ff-card-bg);
  border: var(--ff-card-border);
  border-radius: var(--ff-card-radius);
  box-shadow: var(--ff-card-shadow);
  text-decoration: none;
  color: var(--ff-ink);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
              box-shadow 0.35s ease, background 0.35s ease;
}
.ff-benefit__tile:hover,
.ff-benefit__tile:focus-visible {
  transform: translateY(-4px);
  background: rgba(255, 255, 255, 0.45);
  box-shadow: 4px 8px 22px 0 rgba(94, 68, 46, 0.18);
}
.ff-benefit__tile:focus-visible {
  outline: 2px solid var(--ff-terracotta);
  outline-offset: 3px;
}

.ff-benefit__icon {
  display: block;
  width: 100px;
  height: 100px;
  filter: drop-shadow(4px 4px 10px rgba(0, 0, 0, 0.2));
}
.ff-benefit__icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ff-benefit__divider {
  display: block;
  width: min(288px, 88%);
  height: 1px;
  margin: 18px 0 0;
  background: var(--ff-line-2);
}

.ff-benefit__label {
  display: block;
  margin-top: 18px;
  font-family: var(--ff-display);
  font-weight: 500;
  /* font-size: clamp(1.35rem, 1.05rem + 1vw, 1.875rem); */
  font-size: clamp(1.35rem, 1.05rem + 1vw, 1.5625rem);
  line-height: 1.1;
  color: var(--ff-ink);
}
.ff-benefit__support {
  display: block;
  margin-top: 12px;
  max-width: 17rem;
  font-family: var(--ff-body);
  font-weight: 500;
  font-size: clamp(0.95rem, 0.9rem + 0.2vw, 1.125rem);
  line-height: 1.22;
  color: var(--ff-ink);
}

/* ---- Tablet: 3 columns ---- */
@media (max-width: 1100px) {
  .ff-benefit__row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ---- Mobile: 2 per row grid ---- */
@media (max-width: 720px) {
  .ff-benefit__row {
    grid-auto-flow: row;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-columns: auto;
    gap: 14px;
    overflow: visible;
    scroll-snap-type: none;
    margin-inline: 0;
    padding-inline: 0;
  }
  .ff-benefit__tile { padding: 16px 12px 18px; border-radius: 13px; }
  .ff-benefit__icon { width: 76px; height: 76px; }
  .ff-benefit__divider { margin-top: 12px; }
  .ff-benefit__label { margin-top: 12px; }
  .ff-benefit__support { margin-top: 8px; }
}
/* END_SECTION:forge-benefit-tiles */

/* START_SECTION:forge-differentiator (INDEX:15) */
.ff-diff {
  color: var(--ff-ink);
  position: relative;
  overflow: clip;
}
/* hairlines top + bottom (Figma Line33 / Line34) */
/* .ff-diff::before,
.ff-diff::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--ff-line);
  pointer-events: none;
}
.ff-diff::before { top: 0; }
.ff-diff::after  { bottom: 0; } */

/* ---- Heading cluster ---- */
.ff-diff__title { line-height: 1.43; }
.ff-diff__sub {
  /* margin-top: 1.1rem; */
}
.ff-diff__sub p {
  font-family: var(--ff-body);
  font-weight: 300;
  font-size: clamp(1rem, 0.95rem + 0.4vw, 1.25rem);
  line-height: 1.55;
  color: var(--ff-ink);
  max-width: 36ch;
  margin-inline: auto;
  text-align: center;
}

/* ---- 3-column grid ---- */
.ff-diff__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.ff-diff__col {
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.2);
  overflow: hidden;
  border-radius: 15px;
border: 1px solid rgba(94, 68, 46, 0.30);
background: rgba(255, 255, 255, 0.20);
box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
}

/* photo + label chip */
.ff-diff__media {
  position: relative;
  aspect-ratio: 560 / 367;
  overflow: hidden;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
}
.ff-diff__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ff-diff__chip {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  display: inline-flex; 
  align-items: center;
  font-family: var(--ff-body);
  font-size: 1rem;
  font-weight: 400;
  color: var(--ff-brown);
  background: rgba(255, 255, 255, 0.8);
  border: 0.5px solid #bbb5b1;
  border-top-left-radius: 15px;
  border-bottom-right-radius: 15px;
  padding: 0.3rem 0.95rem;
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
}

/* text */
.ff-diff__copy {
  padding: 1.5rem 1.5rem 1.75rem;
}
body .ff-diff__h {
  font-family: var(--ff-display);
  font-weight: 500;
  /* font-size: clamp(1.35rem, 1.1rem + 0.8vw, 1.75rem); */
  font-size: clamp(1.2rem, 1.1rem + 0.8vw, 1.375rem);
  line-height: 1.15;
  color: var(--ff-ink);
      text-transform: none;
  margin-bottom: 0.6rem;
}
.ff-diff__b {
  font-family: var(--ff-body);
  font-weight: 300;
  font-size: 1.075rem;
  line-height: 1.55;
  color: var(--ff-ink);
}

/* ---- Watch CTA (brown glass pill) ---- */
.ff-diff__cta {
  text-align: center;
  margin-top: clamp(2rem, 1rem + 2.5vw, 3rem);
}
.ff-diff__watch {
  --bg: var(--ff-brown);
  --fg: #fff;
  gap: 0.75rem;
  font-size: 1rem;
  font-weight: 500;
  padding: 0.95rem 1.6rem;
  border-color: rgba(255, 255, 255, 0.3);
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
}
.ff-diff__watch:hover { background: var(--ff-brown-2); }
.ff-diff__play { flex: none; transition: transform 0.4s var(--ff-ease); }
.ff-diff__watch:hover .ff-diff__play { transform: translateX(3px); }

/* ---- Quote band (taupe strip) ---- */
.ff-diff__quote {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(1rem, 2vw, 2.5rem);
  margin-top: clamp(2rem, 1rem + 2.5vw, 3rem);
  min-height: 70px;
  padding: 1rem clamp(1.25rem, 3vw, 3rem);
  background: var(--ff-taupe);
  border: 1px solid rgba(211, 119, 102, 0.3);
  border-radius: 15px;
  box-shadow: 2px 2px 10px 0 rgba(150, 150, 150, 0.15);
}
.ff-diff__quote-text {
  font-family: var(--ff-display);
  font-weight: 600;
  /* font-size: clamp(1.5rem, 1rem + 2.2vw, 2.5rem); */
  font-size: clamp(1.5rem, 1rem + 2.2vw, 1.555rem);
  line-height: 1.1;
  color: #fff;
  text-align: center;
  text-wrap: balance;
}
.ff-diff__qmark {
  flex: none;
  font-family: var(--ff-display);
  font-weight: 700;
  font-size: clamp(2rem, 1rem + 3vw, 2.25rem);
  line-height: 1;
  color: rgba(255, 255, 255, 0.85);
}
.ff-diff__qmark--open  { align-self: flex-start; }
.ff-diff__qmark--close { align-self: flex-end; }

/* ---- onDark variant (kept for the dark-brown reuse described in tokens) ---- */
.ff-eyebrow--onDark {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.18);
  color: var(--ff-cream);
}

/* ---- Responsive: 3-col → 1-col ---- */
@media (max-width: 900px) {
  .ff-diff__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .ff-diff__grid { grid-template-columns: 1fr; }
  .ff-diff__qmark { display: none; }
}
/* END_SECTION:forge-differentiator */

/* START_SECTION:forge-email-capture (INDEX:16) */
.ff-capture__wrap { /* container only — padding from .forge-section */ }

.ff-capture__card {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.25rem, 2vw, 50px);
  align-items: center;
}

/* ---- Product photo (left) ---- */
.ff-capture__media {
  border: 1px solid rgba(94, 68, 46, 0.3);
  border-radius: 15px;
  overflow: hidden;
  box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
  aspect-ratio: 781 / 450;
  background: var(--ff-cream-2);
}
.ff-capture__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ---- Copy + form (right) — spacing via gap only (see forge-spacing) ---- */
.ff-capture__body {
  text-align: left;
}
.ff-capture__eyebrow {
  background: rgba(255, 255, 255, 0.4);
  border-color: #d2d2d2;
  color: var(--ff-ink);
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0;
  padding: 0.65rem 1.25rem;
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
}
.ff-capture__h2 {
  font-size: clamp(2rem, 1.2rem + 3.4vw, 3.5rem);
  line-height: 1.43;
}
.ff-capture__lead {
  font-size: 1.125rem;
  line-height: 2.04;
  color: var(--ff-ink);
  margin: 0;
}
.ff-capture__lead p { margin: 0; }

/* ---- Form ---- */
.ff-capture__form { width: 100%; margin: 0; }
.ff-capture__row {
  display: flex;
  gap: 1.25rem;
  flex-wrap: wrap;
  align-items: stretch;
}
.ff-capture__input {
  /* flex: 1 1 240px; */
  min-width: 0;
  font: inherit;
  font-size: 1.125rem;
  font-weight: 500;
  color: var(--ff-brown);
  background: rgba(255, 255, 255, 0.4);
  border: 1px solid var(--ff-brown);
  border-radius: 40px;
  padding: 0.85rem 1.5rem;
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
  max-width:370px;
}
.ff-capture__input::placeholder { color: var(--ff-brown); opacity: 1; }
.ff-capture__input:focus {
  outline: 2px solid var(--ff-terracotta);
  outline-offset: 1px;
}
.ff-capture__submit {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  flex: 0 0 auto;
  font: inherit;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1;
  color: var(--ff-btn-fg);
  background: var(--ff-btn-bg);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 40px;
  padding: 0.85rem 1.5rem;
  cursor: pointer;
  white-space: nowrap;
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
  transition: transform 0.35s var(--ff-ease), background 0.3s var(--ff-ease), box-shadow 0.35s var(--ff-ease);
}
.ff-capture__submit:hover {
  transform: translateY(-2px);
  background: var(--ff-btn-bg-hover);
  box-shadow: var(--ff-shadow-soft);
}
.ff-capture__arrow { transition: transform 0.4s var(--ff-ease); }
.ff-capture__submit:hover .ff-capture__arrow { transform: translateX(4px); }
.ff-capture__success { color: var(--ff-teal); font-weight: 500; font-size: 1.05rem; }
.ff-capture__embed { width: 100%; }

/* ---- Responsive: stack, image on top ---- */
@media (max-width: 860px) {
  .ff-capture__card { grid-template-columns: 1fr; }
  .ff-capture__media { order: -1; }
}
@media (max-width: 640px) {
  .ff-capture__input {
    max-width:100% !important;
  }
  .ff-capture__row { flex-direction: column; }
  .ff-capture__submit { justify-content: center; }
}
/* END_SECTION:forge-email-capture */

/* START_SECTION:forge-format-alts (INDEX:17) */
.ff-formats__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(1.25rem, 0.5rem + 2vw, 2rem);
}

/* Card — white-glass panel, 15px radius, hairline brown border, soft shadow (Figma) */
.ff-format {
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(94, 68, 46, 0.3);
  border-radius: 15px;
  box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
  overflow: hidden;
  transition: transform 0.4s var(--ff-ease), box-shadow 0.4s var(--ff-ease);
}
.ff-format:hover { transform: translateY(-4px); box-shadow: var(--ff-shadow); }

.ff-format__media {
  aspect-ratio: 835 / 520; /* Figma image footprint */
  overflow: hidden;
  background: var(--ff-cream-2);
  border-bottom: 1px solid rgba(94, 68, 46, 0.3);
}
.ff-format__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s var(--ff-ease);
}
.ff-format:hover .ff-format__media img { transform: scale(1.04); }

/* Footer row: text left, button right, vertically centered (Figma) */
.ff-format__body {
  padding: 1.5rem 1.75rem 1.6rem;
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem 1.5rem;
  flex-wrap: wrap;
  flex: 1;
}
.ff-format__text {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  min-width: 0;
  flex: 1 1 52%;
}
.ff-format__title {
  font-family: var(--ff-display);
  font-weight: 600;
  /* font-size: clamp(1.5rem, 1.15rem + 1.1vw, 2rem); */
  font-size: clamp(1.5rem, 1.15rem + 1.1vw, 1.875rem);
  line-height: 1.1;
  letter-spacing: -0.01em;
  color: var(--ff-ink);
}
.ff-format__line {
  font-family: var(--ff-body);
  font-weight: 500;
  font-size: 1.0625rem;
  line-height: 1.45;
  color: var(--ff-ink);
}

/* Button — solid brown pill, white text + white arrow, 0.3 white border (Figma) */
.ff-format__btn {
  --bg: var(--ff-brown);
  --fg: #fff;
  margin-top: 0;
  /* align-self: center; */
  flex: none;
  gap: 0.75rem;
  padding: 0.85rem 1.45rem;
  font-size: 1rem;
  font-weight: 500;
  white-space: nowrap;
  border-color: rgba(255, 255, 255, 0.3);
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
}
.ff-format__btn:hover { --bg: var(--ff-brown-2); }
.ff-format__arrow {
  display: inline-flex;
  align-items: center;
  width: 21px;
  height: 20px;
  flex: none;
  color: #fff;
  transition: transform 0.4s var(--ff-ease);
}
.ff-format__arrow svg { width: 100%; height: auto; }
.ff-format__btn:hover .ff-format__arrow { transform: translateX(4px); }

@media (max-width: 860px) {
  .ff-formats__grid { grid-template-columns: 1fr; }
}
/* END_SECTION:forge-format-alts */

/* START_SECTION:forge-founder (INDEX:18) */
.ff-founder__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.25rem, 2vw, 50px);
  align-items: center;
}

/* image_right: copy left, image right */
.ff-founder--reverse .ff-founder__media { order: 2; }
.ff-founder--reverse .ff-founder__copy { order: 1; }

/* ---- Media: Figma image 34 — 835x558 (≈3/2), 15px radius ---- */
.ff-founder__media {
  position: relative;
  aspect-ratio: 835 / 558;
  border-radius: 15px;
  overflow: hidden;
  border: 1px solid rgba(94, 68, 46, 0.3);
  box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
  background: linear-gradient(135deg, #b9583f, #7c3a28);
}
.ff-founder--full .ff-founder__media {
  border: 0;
  box-shadow: none;
  background: transparent;
}
.ff-founder__media img,
.ff-founder__media video,
.ff-founder__media .ff-founder__ph {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}

/* ---- Copy ---- */
.ff-founder__copy { text-align: left; }
.ff-founder__copy .ff-eyebrow {
  font-size: 1.0625rem;            /* Figma 18px pill */
  font-weight: 400;
  color: var(--ff-ink);
  background: rgba(255, 255, 255, 0.4);
  border-color: #d2d2d2;
  letter-spacing: 0;
  margin-bottom: 1.5rem;
}
.ff-founder__h {
  font-size: clamp(2.25rem, 1.4rem + 3.3vw, 3.5rem);  /* → ~56px */
  line-height: 1.18;
  letter-spacing: -0.01em;
  margin-bottom: 1.4rem;
}
.ff-founder__body {
  font-family: var(--ff-body);
  font-weight: 300;               /* Inter Light, Figma */
  font-size: 1.125rem;            /* 18px */
  line-height: 2.04;             /* ≈36.72px / 18px */
  color: var(--ff-ink);
  /* max-width: 52ch; */
  margin-bottom: 2rem;
}
.ff-founder__cta {                /* brown pill, Figma #5e442e */
  --bg: var(--ff-brown);
  --fg: #fff;
  border-color: rgba(255, 255, 255, 0.3);
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
  font-size: 1rem;
}

/* ---- Condensed strip (PDP reuse) ---- */
.ff-founder--strip .ff-founder__inner {
  grid-template-columns: 0.85fr 1.15fr;
  gap: clamp(1.25rem, 2vw, 50px);
}
.ff-founder--strip .ff-founder__h { font-size: var(--ff-h3); }
.ff-founder--strip .ff-founder__body { line-height: 1.7; margin-bottom: 1.5rem; }

@media (max-width: 860px) {
  .ff-founder__inner,
  .ff-founder--strip .ff-founder__inner { grid-template-columns: 1fr; }
  .ff-founder--reverse .ff-founder__media { order: -1; }   /* image first on mobile */
  .ff-founder--reverse .ff-founder__copy { order: 0; }
  .ff-founder__copy { max-width: none; }
}
/* END_SECTION:forge-founder */

/* START_SECTION:forge-pdp-crosssell (INDEX:20) */
.ff-crosssell {
  position: relative;
  background: var(--ff-bg-b);
  overflow: clip;
  padding-block: var(--ff-section-y);
}

/* Background mushroom texture — pinned to the bottom, soft */
.ff-crosssell .ff-crosssell__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}
.ff-crosssell .ff-crosssell__bg img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: bottom;
  opacity: 0.3;
}

.ff-crosssell .ff-crosssell__inner { position: relative; z-index: 1; }

/* ---- Top region: heading (left) + featured bundle (right) — 50px gap ---- */
.ff-crosssell .ff-crosssell__top {
  display: grid;
  grid-template-columns:1fr 1fr; 
  /* grid-template-columns:1fr 1.5fr;  */
  align-items: center;
  gap: 50px;
  margin-bottom: clamp(2rem, 1.25rem + 3vw, 3.5rem);
}

/* Heading cluster — fills left column, no empty middle */
.ff-crosssell .ff-crosssell__head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.25rem;
  min-width: 0;
}
.ff-crosssell .ff-crosssell__eyebrow {
  font-size: 1.125rem;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: #000;
  background: rgba(255, 255, 255, 0.4);
  border: 1px solid #d2d2d2;
  border-radius: 40px;
  padding: 15px 25px;
}
.ff-crosssell .ff-crosssell__h2 {
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: clamp(2.25rem, 1.3rem + 3.4vw, 3.5rem);
  line-height: 1.18;
  color: #000;
}

/* ---- Featured bundle card ---- */
.ff-crosssell .ff-crosssell__feature {
  display: grid;
  grid-template-columns: minmax(0, 318fr) minmax(0, 478fr);
  align-items: stretch;
  min-width: 0;
  width: 100%;
  min-height: 324px;
  border-radius: 15px;
  background: rgba(238, 236, 231, 0.3);
  border: 1px solid rgba(94, 68, 46, 0.3);
  box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
  overflow: hidden;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  transition: transform 0.4s var(--ff-ease), box-shadow 0.4s var(--ff-ease);
}
.ff-crosssell .ff-crosssell__feature:hover { 
  transform: translateY(-4px); 
  box-shadow: var(--ff-shadow); 
}

.ff-crosssell .ff-crosssell__feature-media {
  position: relative;
  border-radius: 15px 0 0 15px;
  overflow: hidden;
  background: var(--ff-cream-2);
}
.ff-crosssell .ff-crosssell__feature-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s var(--ff-ease);
}
.ff-crosssell .ff-crosssell__feature:hover .ff-crosssell__feature-media img { transform: scale(1.04); }

.ff-crosssell .ff-crosssell__feature-body {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 20px 25px;
  min-width: 0;
  height: 100%;
}
.ff-crosssell .ff-crosssell__feature-body .ff-crosssell__add {
  margin-top: 1rem;
}

.ff-crosssell .ff-crosssell__feature-title {
  font-family: var(--ff-display);
  font-weight: 500;
  font-size: clamp(1.5rem, 1.2rem + 0.9vw, 1.5625rem);
  line-height: 1.15;
  color: #000;
  margin-top: 14px;
}
.ff-crosssell .ff-crosssell__feature-line {
  font-family: var(--ff-body);
  font-weight: 300;
  font-size: 1.125rem;
  line-height: 1.4;
  color: #000;
  margin-top: 0.5rem;
}

/* ---- Shared "Best seller" / benefit badge ---- */
.ff-crosssell .ff-crosssell__badge {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  font-family: var(--ff-body);
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  line-height:normal;
  color: var(--ff-brown);
  background: rgba(255, 255, 255, 0.4);
  border: 0.5px solid #d2d2d2;
  border-radius: 15px;
  padding: 5px 10px;
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
}

/* ---- Price ---- */
.ff-crosssell .ff-crosssell__price {
  display: flex;
  align-items: baseline;
  gap: 0.6rem;
  margin-top: auto;
}
.ff-crosssell .ff-crosssell__price-now {
  font-family: var(--ff-display);
  font-weight: 500;
  font-size: 1.5rem;
  line-height: 1;
  color: #000;
}
.ff-crosssell .ff-crosssell__price-now--sm { font-size: 1.3rem; }
.ff-crosssell .ff-crosssell__price-was {
  font-family: var(--ff-display);
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1;
  color: #000;
  opacity: 0.4;
  text-decoration: line-through;
}

/* ---- Add buttons (brown pill) ---- */
.ff-crosssell .ff-crosssell__add {
  --bg: var(--ff-brown);
  --fg: #fff;
  width: 100%;
  justify-content: center;
  gap: 0.9rem;
  padding: 15px 25px;
  font-size: 1rem;
  font-weight: 500;
  border-color: rgba(255, 255, 255, 0.3);
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
}
.ff-crosssell .ff-crosssell__add .ff-crosssell__arrow { display: inline-flex; transition: transform 0.4s var(--ff-ease); }
.ff-crosssell .ff-crosssell__add:hover .ff-crosssell__arrow { transform: translateX(4px); }
.ff-crosssell .ff-crosssell__add.is-loading { opacity: 0.6; pointer-events: none; }
.ff-crosssell .ff-crosssell__add.is-done { background: var(--ff-sage); color: #fff; border-color: var(--ff-sage); }

/* ---- Row of 3 small product cards — 20px gap, equal height, aligned buttons ---- */
.ff-crosssell .ff-crosssell__cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  align-items: stretch;
}

.ff-crosssell .ff-crosssell__card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: stretch;
  height: 100%;
  min-height: 350px;
  border-radius: 15px;
  background: rgba(238, 236, 231, 0.3);
  border: 1px solid rgba(94, 68, 46, 0.3);
  box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
  overflow: hidden;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  transition: transform 0.4s var(--ff-ease), box-shadow 0.4s var(--ff-ease);
}
.ff-crosssell .ff-crosssell__card:hover { transform: translateY(-4px); box-shadow: var(--ff-shadow); }

.ff-crosssell .ff-crosssell__card-media {
  position: relative;
  display: block;
  min-height: 100%;
  border-radius: 15px 0 0 15px;
  overflow: hidden;
  background: var(--ff-cream-2);
}
.ff-crosssell .ff-crosssell__card-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s var(--ff-ease);
}
.ff-crosssell .ff-crosssell__card:hover .ff-crosssell__card-media img { transform: scale(1.04); }
.ff-crosssell .ff-crosssell__ph { position: absolute; inset: 0; background: linear-gradient(135deg, #cbb89f, #8a7152); }

.ff-crosssell .ff-crosssell__card-body {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 30px 15px 20px;
  min-width: 0;
  height: 100%;
}
.ff-crosssell .ff-crosssell__card-title {
  font-family: var(--ff-display);
  font-weight: 500;
  font-size: 20px;
  line-height: 1.12;
  color: #000;
  margin-top: 14px;
  overflow-wrap: anywhere;
}
.ff-crosssell .ff-crosssell__card-title a { color: inherit; text-decoration: none; }
.ff-crosssell .ff-crosssell__card-line {
  font-family: var(--ff-body);
  font-weight: 300;
  font-size: 1.125rem;
  line-height: 1.35;
  color: #000;
  margin-top: 0.45rem;
  margin-bottom: 0;
  flex: 1 1 auto; /* equal card heights → Add buttons align */
}
.ff-crosssell .ff-crosssell__card-price {
  margin-top: 20px;
  width: 100%;
}
.ff-crosssell .ff-crosssell__card-price + svg {
  width: 100%;
  margin-block: 20px;
  flex: none;
}
.ff-crosssell .ff-crosssell__card-body .ff-crosssell__add {
  flex: none;
  margin-top: 0;
}

/* ---- Responsive ---- */
@media (max-width: 1100px) {
  .ff-crosssell .ff-crosssell__top {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .ff-crosssell .ff-crosssell__cards {
    grid-template-columns: 1fr;
    max-width: 36rem;
    margin-inline: auto;
  }
}
@media (max-width: 680px) {
  .ff-crosssell .ff-crosssell__feature,
  .ff-crosssell .ff-crosssell__card { grid-template-columns: 1fr; min-height: 0; height: auto; }
  .ff-crosssell .ff-crosssell__feature-media,
  .ff-crosssell .ff-crosssell__card-media { aspect-ratio: 4/3; min-height: 0; }
  .ff-crosssell .ff-crosssell__feature-media img,
  .ff-crosssell .ff-crosssell__card-media img { position: absolute; }
  .ff-crosssell .ff-crosssell__feature-media,
  .ff-crosssell .ff-crosssell__card-media { position: relative; border-radius: 15px 15px 0 0; }
  .ff-crosssell .ff-crosssell__card-line { flex: none; }
}
/* END_SECTION:forge-pdp-crosssell */

/* START_SECTION:forge-pdp-disclaimer (INDEX:21) */
.ff-disclaimer { background: var(--ff-bg-a); padding-block: clamp(1.5rem, 1rem + 2vw, 2.5rem); }
.ff-disclaimer__inner { max-width: 70ch; margin-inline: auto; padding-inline: var(--ff-gutter); text-align: center; }
.ff-disclaimer__inner p { font-family: var(--ff-body); font-size: 0.8rem; line-height: 1.6; color: var(--ff-ink-soft); }
/* END_SECTION:forge-pdp-disclaimer */

/* START_SECTION:forge-pdp-faq (INDEX:22) */
.ff-faq {
  background: var(--ff-bg-b);
  padding-block: clamp(3rem, 2rem + 5vw, 5.5rem);
  position: relative;
  overflow: clip;
}
.ff-faq__inner {
  width: 100%;
  max-width: 1660px;
  margin-inline: auto;
  padding-inline: var(--ff-gutter);
}

/* ---- Heading ---- */
.ff-faq__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
  text-align: center;
  margin-bottom: clamp(2rem, 1.5rem + 2.5vw, 3.25rem);
}
.ff-faq__h2 {
  font-weight: 600;
  font-size: clamp(2rem, 1.2rem + 3.4vw, 3.5rem);
  line-height: 1.07;
  text-wrap: balance;
}

/* ---- Brown panel holding the rows (Figma image 35) ---- */
.ff-faq__panel {
  background: #AD9786;
  border-radius: var(--ff-radius-lg);
  padding: clamp(1.25rem, 0.8rem + 2vw, 2.5rem);
  box-shadow: var(--ff-shadow);
}
.ff-faq__list {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

/* ---- Accordion row ---- */
.ff-faq__item {
  background: rgba(0, 0, 0, 0);
  border: 1px solid rgba(253, 253, 253, 0.3);
  border-radius: 15px;
  box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
  overflow: hidden;
}

.ff-faq__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  width: 100%;
  min-height: 60px;
  margin: 0;
  padding: 15px clamp(1rem, 0.6rem + 1vw, 1.5rem);
  background: transparent;
  border: 0;
  cursor: pointer;
  text-align: left;
  font-family: var(--ff-display);
  color: #fff;
  -webkit-tap-highlight-color: transparent;
}
.ff-faq__trigger:focus-visible {
  outline: 2px solid var(--ff-terracotta);
  outline-offset: -2px;
}

.ff-faq__q {
  /* Figma: Josefin Sans SemiBold 24px / 30px line, white */
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: clamp(1.3rem, 1.2rem + .9vw, 1.25rem);
  line-height: 1.25;
  color: #fff;
}

/* ---- +/− toggle (CSS-drawn, no asset needed) ---- */
.ff-faq__icon {
  position: relative;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
}
.ff-faq__icon::before,
.ff-faq__icon::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  background: #fff;
  border-radius: 2px;
  transition: opacity 0.3s var(--ff-ease), transform 0.3s var(--ff-ease);
}
.ff-faq__icon::before {
  width: 18px;
  height: 2.5px;
  transform: translate(-50%, -50%);
}
.ff-faq__icon::after {
  width: 2.5px;
  height: 18px;
  transform: translate(-50%, -50%);
}
/* open state → minus (hide vertical bar) */
.ff-faq__item.is-open .ff-faq__icon::after {
  opacity: 0;
  transform: translate(-50%, -50%) rotate(90deg);
}

/* ---- Answer panel (animated via forge.js inline max-height) ---- */
.ff-faq__panel-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s var(--ff-ease);
}
.ff-faq__a {
  /* Figma: Inter Regular 18px, white */
  font-family: var(--ff-body);
  font-weight: 400;
  font-size: clamp(0.95rem, 0.9rem + 0.3vw, 1.125rem);
  line-height: 1.55;
  color: #fff;
  padding: 0 clamp(1.25rem, 0.8rem + 1.2vw, 1.875rem) 22px;
  max-width: 1355px;
}
.ff-faq__a p { margin: 0 0 0.75em; }
.ff-faq__a p:last-child { margin-bottom: 0; }
.ff-faq__a a { color: #fff; text-decoration: underline; }

/* No-JS fallback: keep first answer visible, others collapsed but expandable
   would require JS; ensure open item shows its answer even before JS sets px. */
.ff-faq__item.is-open .ff-faq__panel-body { max-height: 600px; }

@media (max-width: 640px) {
  .ff-faq__panel { border-radius: 20px; }
  .ff-faq__trigger { gap: 1rem; padding: 13px 16px; }
  .ff-faq__icon { width: 18px; height: 18px; }
  .ff-faq__icon::before { width: 16px; }
  .ff-faq__icon::after { height: 16px; }
}
/* END_SECTION:forge-pdp-faq */

/* START_SECTION:forge-pdp-hero (INDEX:23) */
/* Light Figma PDP hero — cream page, gallery left, buy box right (image 1) */
.ff-pdp-hero { background: var(--ff-bg-a, #f5ede4); }
.ff-pdp-hero--dark-box { background: #fff; }

/* Recharge auto-injects its own widget into the product form; our buy box
   posts native Shopify selling plans, so hide the duplicate. */
.ff-pdp-form .rc-container-wrapper,
.ff-pdp-form .rc_container_wrapper,
.ff-pdp-form [data-rc-widget] { display: none !important; }
/* A cross-sell app injects a widget into the product form; our PDP has its own
   "stack with…" section, so hide the duplicate here. */
.ff-pdp-hero lb-product-page-cross-sell-ew,
.ff-pdp-hero [class*="cross-sell"]:not([class^="ff-"]) { display: none !important; }
.ff-pdp-hero__inner {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: clamp(1.25rem, 2vw, 50px);
  width: 100%;
  padding: clamp(2rem, 1rem + 3vw, 3.5rem) var(--ff-gutter);
  align-items: start;
  max-width: 1440px;
  margin: 0 auto;
}

/* Gallery — theme product slider inside forge layout */
.ff-pdp-hero__gallery { width: 100%; min-width: 0; }
.ff-pdp-hero__gallery .product-single__wrapper { display: block; width: 100%; }
.ff-pdp-hero__gallery .product-single__gallery { width: 100%; }
.ff-pdp-hero__gallery .product-single__media-slider {
  border-radius: var(--ff-radius, 12px);
  /* overflow: hidden; */
  background: var(--ff-cream-2, #ebe3d8);
}
.ff-pdp-hero__gallery .product-single__thumbnails { margin-top: 0.75rem; }
.ff-pdp-hero__gallery .product-single__thumbnail {  border-radius: 12px; overflow: hidden; }
.ff-pdp-hero__gallery .flickity-prev-next-button { background: rgba(255, 255, 255, 0.92); }
.ff-pdp-hero__gallery .product-single__thumbnail .product-single__thumbnail-link{
  border-radius: 15px;
}
/* Buy box — light (default Figma) */
.ff-pdp-hero__box { width: 100%; }
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__eyebrow {
  margin-bottom: 1rem;
  background: rgba(255, 255, 255, 0.55);
  border-color: #d2d2d2;
  color: var(--ff-ink);
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__title {
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: clamp(2.25rem, 1.5rem + 2.2vw, 3rem);
  line-height: 1.05;
  color: var(--ff-ink);
  margin-bottom: 0.65rem;
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__title .ff-accent { color: var(--ff-terracotta); }
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__title .ff-pdp-hero__latin {
  font-weight: 400;
  font-style: italic;
  color: var(--ff-ink-soft);
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__rating {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
  font-family: var(--ff-body);
  font-size: clamp(0.9rem, 0.85rem + 0.2vw, 1rem);
  color: var(--ff-ink-soft);
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__latin { font-style: italic; color: var(--ff-ink-soft); }
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__benefit {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: clamp(1.05rem, 1rem + 0.3vw, 1.2rem);
  color: var(--ff-ink);
  margin-bottom: 0.45rem;
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__check { color: var(--ff-terracotta); font-weight: 700; }
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__ttr {
  font-size: clamp(0.9rem, 0.85rem + 0.2vw, 1rem);
  color: var(--ff-ink-soft);
  line-height: 1.5;
  margin-bottom: 1.5rem;
  max-width: 44ch;
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__field {
  border: 1px solid rgba(94, 68, 46, 0.14);
  border-radius: 15px;
  padding: clamp(1.15rem, 0.85rem + 0.7vw, 1.45rem);
  margin: 0 0 1.1rem;
  box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.22);
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__label {
  display: block;
  width: 100%;
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: clamp(1.05rem, 1rem + 0.25vw, 1.2rem);
  color: var(--ff-ink);
  padding: 0 0 0.75rem;
  margin-bottom: 1.85rem;
  border-bottom: 1px solid rgba(94, 68, 46, 0.16);
}

/* Size rows — white default, tan + white text when selected */
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-size {
  border: 1px solid rgba(94, 68, 46, 0.16);
  border-radius: 14px;
  padding: 0.95rem 1.15rem;
  color: var(--ff-ink);
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-size__badge {
    top: -10px;
    left: 14px;
    color: #fff;
    background: #5e442e;
    border: 1.5px solid #5e442e;
    box-shadow: none;
    font-size: .65rem;
    padding: .12rem .55rem;
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-size:has(input:checked),
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-size.is-selected {
  background: #b09987;
  border-color: #9a846e;
  color: #fff;
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-size:has(input:checked) .ff-size__name,
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-size:has(input:checked) .ff-size__price,
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-size.is-selected .ff-size__name,
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-size.is-selected .ff-size__price {
  color: #fff;
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-size:has(input:checked) .ff-size__serv,
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-size.is-selected .ff-size__serv {
  color: rgba(255, 255, 255, 0.88);
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-size:has(input:checked) .ff-size__radio,
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-size.is-selected .ff-size__radio {
  border-color: #fff;
  background: #0000;
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-size:has(input:checked) .ff-size__radio::after,
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-size.is-selected .ff-size__radio::after {
  background: #fff;
}

/* Purchase type — tan selected, white unselected */
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-buy__opt {
  border: 1.5px solid rgba(94, 68, 46, 0.16);
  border-radius: 14px;
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-buy__opt:has(input:checked),
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-buy__opt.is-selected {
  background: #b09987;
  border-color: #9a846e;
  color: #fff;
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-buy__opt:has(input:checked) .ff-buy__main,
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-buy__opt.is-selected .ff-buy__main {
  color: #fff;
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-buy__opt:has(input:checked) .ff-buy__sub,
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-buy__opt.is-selected .ff-buy__sub {
  color: rgba(255, 255, 255, 0.88);
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-buy__opt:has(input:checked) .ff-buy__radio,
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-buy__opt.is-selected .ff-buy__radio {
  border-color: #fff;
  background: #0000;
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-buy__opt:has(input:checked) .ff-buy__radio::after,
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-buy__opt.is-selected .ff-buy__radio::after {
  background: #fff
}

.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-size:not(:has(input:checked)):not(.is-selected) .ff-size__badge {
  /* color: var(--ff-terracotta);
  border-color: var(--ff-terracotta);
  background: #fff; */
}

/* Buy box — dark (optional, image 2) */
.ff-pdp-hero--dark-box .ff-pdp-hero__box {
  background: #000;
  border-radius: var(--ff-radius);
  padding: clamp(1.5rem, 1rem + 2vw, 2.75rem);
  color: #fff;
}
.ff-pdp-hero--dark-box .ff-pdp-hero__title { color: #fff; }
.ff-pdp-hero--dark-box .ff-pdp-hero__benefit { color: #fff; }
.ff-pdp-hero--dark-box .ff-pdp-hero__ttr { color: rgba(255, 255, 255, 0.78); }
.ff-pdp-hero--dark-box .ff-pdp-hero__rating { color: rgba(255, 255, 255, 0.85); }
.ff-pdp-hero--dark-box .ff-pdp-hero__trust-label { color: rgba(255, 255, 255, 0.78); }
.ff-pdp-hero--dark-box .ff-pdp-hero__trust-ico {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.28);
  color: #fff;
}
.ff-pdp-hero--dark-box .ff-pdp-hero__field {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.22);
}
.ff-pdp-hero--dark-box .ff-pdp-hero__label { color: #fff; border-bottom-color: rgba(255, 255, 255, 0.22); }
.ff-pdp-hero--dark-box .ff-size,
.ff-pdp-hero--dark-box .ff-buy__opt { background: rgba(255, 255, 255, 0.94); }
.ff-pdp-hero__eyebrow { margin-bottom: 1rem; }

/* Shared buy-box typography (dark mode fallbacks) */
.ff-pdp-hero__title { font-family: var(--ff-display); font-weight: 600; font-size: clamp(2rem, 1.4rem + 2vw, 2.75rem); line-height: 1.05; color: var(--ff-ink); margin-bottom: 0.6rem; }
.ff-pdp-hero__rating { display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap; margin-bottom: 1rem; font-size: 0.95rem; color: var(--ff-ink-soft); }
.ff-pdp-hero__latin { font-style: italic; }
.ff-pdp-hero__benefit { display: flex; align-items: flex-start; gap: 0.5rem; font-family: var(--ff-display); font-weight: 600; font-size: 1.1rem; color: var(--ff-ink); margin-bottom: 0.5rem; }
.ff-pdp-hero__check { color: var(--ff-terracotta); font-weight: 700; }
.ff-pdp-hero__ttr { font-size: 0.95rem; color: var(--ff-ink-soft); line-height: 1.5; margin-bottom: 1.6rem; max-width: 44ch; }

/* Shared field + option shells (dark mode / base grid) */
.ff-pdp-hero__field {
  border: 1px solid var(--ff-line-2);
  border-radius: 16px;
  padding: clamp(1.1rem, 0.8rem + 0.8vw, 1.5rem);
  margin: 0 0 1.25rem;
  background: rgba(255, 255, 255, 0.28);
}
.ff-pdp-hero__label {
  display: block;
  width: 100%;
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: 1.15rem;
  color: var(--ff-ink);
  padding: 0 0 0.7rem;
  margin-bottom: 0.9rem;
  border-bottom: 1px solid var(--ff-line-2);
}

/* Size rows */
.ff-sizes { display: flex; flex-direction: column; gap: 0.6rem; }
.ff-sizes--hidden,
.ff-sizes[hidden] {
  display: none !important;
}
.ff-size {
  position: relative; display: grid;
  grid-template-columns: auto auto 1fr; grid-auto-rows: auto;
  align-items: center; column-gap: 0.85rem; row-gap: 0.1rem;
  border: 1px solid var(--ff-line-2); border-radius: 14px; padding: 0.95rem 1.2rem;
  cursor: pointer; background: var(--ff-paper); transition: border-color 0.2s, background 0.2s, color 0.2s;
}
.ff-size input { position: absolute; opacity: 0; pointer-events: none; }
.ff-size__radio { width: 20px; height: 20px; border-radius: 50%; border: 1.5px solid var(--ff-line-2); display: inline-block; position: relative; }
.ff-size__name, .ff-size__price { font-family: var(--ff-display); font-weight: 600; font-size: 1.13sssssrem; }
.ff-size__price { justify-self: end; font-weight: 600; }
.ff-size__serv { grid-column: 2 / 4;  color: var(--ff-ink-soft); }
/* "Most popular" tag on a configured size row */
.ff-size__badge {
  position: absolute; top: -9px; left: 16px;
  font-family: var(--ff-body); font-size: 0.68rem; font-weight: 600; letter-spacing: 0.02em;
  color: #fff; background: var(--ff-terracotta);
  padding: 0.14rem 0.6rem; border-radius: 999px;
  box-shadow: 0 2px 6px rgba(48, 33, 20, 0.18);
}
/* Selected state — dark buy box only (light uses rules above) */
.ff-pdp-hero--dark-box .ff-size:has(input:checked),
.ff-pdp-hero--dark-box .ff-size.is-selected { background: rgba(168, 146, 125, 0.22); border-color: var(--ff-brown); color: var(--ff-ink); }
.ff-pdp-hero--dark-box .ff-size:has(input:checked) .ff-size__serv,
.ff-pdp-hero--dark-box .ff-size.is-selected .ff-size__serv { color: var(--ff-ink-soft); }
.ff-pdp-hero--dark-box .ff-size:has(input:checked) .ff-size__radio,
.ff-pdp-hero--dark-box .ff-size.is-selected .ff-size__radio { border-color: var(--ff-brown); }
.ff-pdp-hero--dark-box .ff-size:has(input:checked) .ff-size__radio::after,
.ff-pdp-hero--dark-box .ff-size.is-selected .ff-size__radio::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--ff-brown); }
.ff-size:has(input:checked), .ff-size.is-selected { border-color: var(--ff-brown); }
.ff-size:has(input:checked) .ff-size__radio, .ff-size.is-selected .ff-size__radio { border-color: var(--ff-brown); }
.ff-size:has(input:checked) .ff-size__radio::after, .ff-size.is-selected .ff-size__radio::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--ff-brown); }
.ff-size.is-soldout { opacity: 0.5; cursor: not-allowed; }
/* .ff-size:focus-within { outline: 2px solid var(--ff-terracotta); outline-offset: 2px; } */

/* Purchase type */
.ff-buy { display: grid; grid-template-columns: 1fr 1fr; gap: 0.7rem; }
.ff-buy__opt {
  position: relative; display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: 0.6rem; row-gap: 0.15rem;
  border: 1.5px solid var(--ff-line-2); border-radius: 14px; padding: 0.95rem 1.1rem; cursor: pointer; background: var(--ff-paper); transition: border-color 0.2s, background 0.2s;
}
.ff-buy__opt input { position: absolute; opacity: 0; pointer-events: none; }
.ff-buy__radio { width: 20px; height: 20px; border-radius: 50%; border: 1.5px solid var(--ff-line-2); position: relative; }
.ff-buy__main { font-family: var(--ff-display); font-weight: 600; font-size: 1.125rem; }
.ff-buy__sub { grid-column: 2; color: var(--ff-ink-soft); }
.ff-buy__opt:has(input:checked), .ff-buy__opt.is-selected { border-color: var(--ff-brown); }
.ff-pdp-hero--dark-box .ff-buy__opt:has(input:checked),
.ff-pdp-hero--dark-box .ff-buy__opt.is-selected { background: rgba(94,68,46,0.06); }
.ff-buy__opt:has(input:checked) .ff-buy__radio, .ff-buy__opt.is-selected .ff-buy__radio { border-color: var(--ff-brown); }
.ff-buy__opt:has(input:checked) .ff-buy__radio::after, .ff-buy__opt.is-selected .ff-buy__radio::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--ff-brown); }

/* Delivery frequency — Recharge-style dropdown (native Shopify selling plans) */
.ff-buy__plan-wrap {
  margin-top: 0.85rem;
}
.ff-buy__plan-wrap[hidden] { display: none !important; }
.ff-buy__plan-label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.ff-buy__plan-select {
  width: 100%;
  appearance: none;
  -webkit-appearance: none;
  font-family: var(--ff-body);
  font-size: clamp(0.95rem, 0.9rem + 0.2vw, 1.05rem);
  font-weight: 400;
  color: var(--ff-ink-soft);
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%235e442e' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 1rem center;
  border: 1px solid rgba(94, 68, 46, 0.22);
  border-radius: 12px;
  padding: 0.85rem 2.5rem 0.85rem 1rem;
  cursor: pointer;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.ff-buy__plan-select:hover,
.ff-buy__plan-select:focus {
  border-color: var(--ff-brown);
  outline: none;
  box-shadow: 0 0 0 2px rgba(94, 68, 46, 0.12);
}
.ff-buy__plan-select:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
.ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-buy__plan-select {
  background-color: #FAFAF8;
}

/* Add to cart */
.ff-pdp-atc {
  width: 100%; margin-top: 1.4rem; display: inline-flex; align-items: center; justify-content: center; gap: 0.6rem;
  font-family: var(--ff-body);  font-weight: 500; color: #fff; background: var(--ff-brown);
  font-size:1rem;
  line-height:1.3;
  border: 1px solid rgba(255,255,255,0.25); border-radius: var(--ff-radius-pill); padding: 1rem 1.6rem; cursor: pointer;
  transition: transform 0.3s var(--ff-ease), background 0.3s var(--ff-ease), box-shadow 0.3s var(--ff-ease);
}
.ff-pdp-atc:hover { transform: translateY(-2px); background: var(--ff-brown-2); box-shadow: var(--ff-shadow-soft); }
.ff-pdp-atc[disabled] { opacity: 0.55; pointer-events: none; }
.ff-pdp-atc.is-loading { opacity: 0.7; pointer-events: none; }
.ff-pdp-atc .ff-btn__arrow { display:flex;  transition: transform 0.4s var(--ff-ease); display:flex; }
.ff-pdp-atc:hover .ff-btn__arrow { display:flex;  transform: translateX(4px); }
/* Subscribe: struck one-time price, then sale price (inherits button font-size) */
.ff-pdp-atc [data-ff-atc-price] {
  display: inline-flex;
  align-items: baseline;
  gap: 0.4em;
  flex-wrap: wrap;
  justify-content: center;
}
.ff-pdp-atc__was {
  text-decoration: line-through;
  opacity: 0.7;
  font-weight: 400;
}
.ff-pdp-atc__now {
  font-weight: 500;
}

/* Sold out — theme “Notify me when available” (matches existing theme popup) */
.ff-pdp-atc--notify,
.ff-pdp-atc--notify:hover {
  background: #c4b5a5;
  color: #5e442e;
  border-color: rgba(94, 68, 46, 0.12);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-size: 0.95rem;
  font-weight: 500;
  transform: none;
  box-shadow: none;
  cursor: pointer;
  pointer-events: auto;
}
.ff-pdp-atc--notify .ff-btn__arrow { display:flex;  display: none; }
.ff-pdp-hero.variant--soldout .ff-pdp-atc--notify,
.ff-pdp-form.variant--soldout .ff-pdp-atc--notify { pointer-events: auto; }

/* Trust badges — 3-up row of circular icons + labels (Figma) */
.ff-pdp-hero__trust {
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: 0.65rem 1.5rem;
  margin: 1.1rem 0 0; padding: 0; list-style: none;
}
.ff-pdp-hero__trust-item {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-family: var(--ff-body); font-size: 0.85rem; color: var(--ff-ink-soft);
}
.ff-pdp-hero__trust-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; flex: none; color: var(--ff-brown);
  background: rgba(255, 255, 255, 0.55); border: 1px solid var(--ff-line-2); border-radius: 50%;
}
.ff-pdp-hero__trust-ico svg { width: 17px; height: 17px; }

@media (max-width: 900px) {
  .ff-pdp-hero__inner {
    grid-template-columns: 1fr;
    gap: 1rem;
    padding: 1rem var(--ff-gutter) 1.25rem;
  }
  .ff-buy { grid-template-columns: 1fr; }

  /* Compact buy-box spacing only (no font-size changes) */
  .ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__eyebrow { margin-bottom: 0.55rem; }
  .ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__title { margin-bottom: 0.35rem; }
  .ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__rating { margin-bottom: 0.5rem; gap: 0.35rem; }
  .ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__benefit { margin-bottom: 0.3rem; }
  .ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__ttr { margin-bottom: 0.85rem; }
  .ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__field {
    padding: 0.85rem 0.9rem;
    margin: 0 0 0.7rem;
  }
  .ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__label {
    padding: 0 0 0.45rem;
    margin-bottom: 0.75rem;
  }
  .ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-size {
    padding: 0.7rem 0.85rem;
  }
  .ff-sizes { gap: 0.45rem; }
  .ff-buy { gap: 0.5rem; }
  .ff-buy__opt { padding: 0.75rem 0.85rem; }
  .ff-buy__plan-wrap { margin-top: 0.55rem; }
  .ff-buy__plan-select { padding: 0.7rem 2.25rem 0.7rem 0.85rem; }
  .ff-pdp-atc {
    margin-top: 0.85rem;
    font-size: 16px;
    padding: 0.95rem 1.25rem;
  }
  .ff-pdp-hero__gallery .product-single__thumbnails { margin-top: 0.5rem; }
  .ff-pdp-hero__trust {
    margin-top: 0.75rem;
    gap: 0.45rem 0.85rem;
  }
}

@media (max-width:767px){
  .ff-pdp-hero:not(.ff-pdp-hero--dark-box) .ff-pdp-hero__title{
    margin-top:15px;
  }
}
/* END_SECTION:forge-pdp-hero */

/* START_SECTION:forge-pdp-howto (INDEX:24) */
.ff-howto {
    color: var(--ff-ink);
    position: relative;
    overflow: clip;
  }
  .ff-howto--dark { 
    color: #fff; 
  }
  .ff-howto--dark .ff-howto__title { 
    color: #fff; 
  }
  .ff-howto--dark .ff-howto__head .ff-eyebrow {
    color: var(--ff-ink);
    background: rgba(255, 255, 255, 0.92);
  }
  .ff-howto--dark .ff-howto__card {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.28);
  }
  .ff-howto--dark .ff-howto__step-title,
  .ff-howto--dark .ff-howto__step-body { 
    color: #fff; 
  }
  .ff-howto--dark .ff-howto__band {
    background: var(--ff-howto-band-bg, rgba(168, 146, 125, 0.55));
    border-color: rgba(255, 255, 255, 0.35);
  }
  .ff-howto--dark .ff-howto__band-text,
  .ff-howto--dark .ff-howto__band-quote { 
    color: #fff; 
  }
  .ff-howto--tight-bottom { 
    padding-bottom: clamp(0.75rem, 0.4rem + 1.5vw, 1.5rem); 
  }

  /* ---- Two-column shell (steps left, video right) ---- */
  .ff-howto__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.88fr);
    align-items: stretch;
    gap: clamp(1.25rem, 2vw, 50px);
  }
  /* ---- No-video variant: steps take full width ---- */
  .ff-howto__grid--full {
    grid-template-columns: 1fr;
  }

  /* ---- Heading cluster (left-aligned, Figma) ---- */
  .ff-howto__head {
    margin-bottom: clamp(1.75rem, 1.1rem + 2.2vw, 2.75rem);
  }
  .ff-howto__head .ff-eyebrow {
    margin-bottom: 1.25rem;
    background: rgba(255, 255, 255, 0.55);
    border-color: #d2d2d2;
    color: var(--ff-ink);
  }
  .ff-howto__title {
    color: var(--ff-ink);
    font-family: var(--ff-display);
    font-weight: 600;
    font-size: clamp(2.25rem, 1.3rem + 3.4vw, 3.5rem);
    line-height: 1.12;
    letter-spacing: -0.01em;
  }

  /* ---- Step cards — spacing via forge-spacing (gap only, no margin stack) ---- */
  .ff-howto__steps {
    display: flex;
    flex-direction: column;
    gap: 30px;
  }
  .ff-howto__head.ff-head {
    margin-bottom: 10px;
  }
  .ff-howto__card {
    display: grid;
    grid-template-columns: 60px auto minmax(0, 1fr);
    align-items: center;
    gap: clamp(1.1rem, 0.55rem + 1.6vw, 2rem);
    min-height: 148px;
    padding: clamp(1.15rem, 0.75rem + 1vw, 1.35rem) clamp(1.35rem, 0.9rem + 1.4vw, 2rem);
    border: 1px solid rgba(94, 68, 46, 0.14);
    border-radius: 15px;
    box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.22);
  }

  .ff-howto__icon {
    width: 60px;
    height: 60px;
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ff-ink);
  }
  .ff-howto__icon-img {
    width: 60px;
    height: 60px;
    object-fit: contain;
  aspect-ratio: 1/1 !important;
  }

  .ff-howto__divider {
    width: 1px;
    height: min(118px, 72%);
    align-self: center;
    background: linear-gradient(
      180deg,
      rgba(94, 68, 46, 0.15) 0%,
      rgba(94, 68, 46, 0.85) 50%,
      rgba(94, 68, 46, 0.15) 100%
    );
  }

  .ff-howto__copy {
    display: flex;
    flex-direction: column;
    gap: clamp(0.45rem, 0.28rem + 0.5vw, 0.85rem);
    min-width: 0;
  }
  .ff-howto__num {
    font-family: var(--ff-body);
    font-weight: 700;
    font-size: 1.25rem;
    line-height: 1;
    color: var(--ff-terracotta);
  }
  .ff-howto__step-title {
    font-family: var(--ff-display);
    font-weight: 600;
    font-size: clamp(1.35rem, 1.1rem + 0.9vw, 1.40rem);
    line-height: 1.12;
    color: var(--ff-ink);
  }
  .ff-howto__step-body {
    font-family: var(--ff-body);
    font-weight: 400;
    font-size: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
    line-height: 1.5;
    color: var(--ff-ink);
  }

  /* ---- Right media: 9:16 video in bordered frame ---- */
  .ff-howto__media {
    position: relative;
    height: 100%;
    min-height: 320px;
  }
  .ff-howto__media--videos {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 0;
  }
  .ff-howto__vid-frame {
    position: relative;
    width: min(100%, 28rem);
    height: auto;
    min-height: 0;
    aspect-ratio: 9 / 16;
    margin-inline: auto;
    border-radius: 15px;
    overflow: hidden;
    border: 0;
    box-shadow: none;
    background: transparent;
  }
  .ff-howto__vid {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  /* ---- Dosing band — solid taupe bar + white quote copy (Figma) ---- */
  .ff-howto__band {
    --ff-howto-band-bg: #a8917f;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(0.75rem, 0.4rem + 1.2vw, 1.5rem);
    margin-top: clamp(1.5rem, 0.85rem + 2.2vw, 2.25rem);
    padding: clamp(1rem, 1rem + 1.5vw, 1.3rem) clamp(1.5rem, 1rem + 3vw, 3.5rem);
    background: var(--ff-howto-band-bg);
    border: none;
    border-radius: 15px;
    box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.2);
  }
  .ff-howto__band-quote {
    flex: none;
    font-family: var(--ff-display);
    font-weight: 600;
    font-size: clamp(1.5rem, 1.4rem + 2vw, 1.875rem);
    line-height: 1;
    color: #fff;
    opacity: 0.95;
    user-select: none;
  }
  .ff-howto__band-quote--close { display:flex; align-self: flex-end; margin-bottom:- 0.15em; }
  .ff-howto__band-quote--open { display:flex; align-self: flex-start; margin-top: -0.15em; }
  .ff-howto__band-text {
    /* flex: 1 1 auto; */
    font-family: var(--ff-display);
    font-weight: 500;
    font-size: clamp(1.15rem, .92rem + 1.1vw, 1.375rem);
    line-height: 1.3;
    color: #fff;
    text-align: center;
    text-wrap: balance;
    margin: 0;
  }

  /* ---- Responsive ---- */
  @media (max-width: 900px) {
    .ff-howto__grid { 
      grid-template-columns: 1fr; 
    }
    .ff-howto__title { 
      max-width: none; 
    }
    .ff-howto__media--videos { 
      order: 2; 
    }
    .ff-howto__steps { 
      order: 1; 
    }
    .ff-howto__vid-frame {
      max-width: 22rem;
    }
    .ff-howto__media { 
      min-height: 0; 
    }
  }
  @media (max-width: 560px) {
    .ff-howto__card {
      grid-template-columns: 48px minmax(0, 1fr);
      gap: 0.85rem 1rem;
      min-height: 0;
      padding: 1.1rem 1.15rem;
    }
    .ff-howto__icon,
    .ff-howto__icon-img { 
      width: 48px; 
      height: 48px; 
    }
    .ff-howto__divider { 
      display: none; 
    }
    .ff-howto__band {
      flex-direction: column;
      gap: 0.35rem;
      padding-inline: 1.25rem;
    }
    .ff-howto__band-quote--open { align-self: flex-start; }
    .ff-howto__band-quote--close { align-self: flex-end; }
  }
/* END_SECTION:forge-pdp-howto */

/* START_SECTION:forge-pdp-ingredients (INDEX:25) */
h2.ff-h2.ff-ingredients__title{
  text-align:left;
}
  .ff-ingredients {
    background: var(--ff-bg-b);
    color: var(--ff-ink);
    position: relative;
    overflow: clip;
  }

  /* ---- Heading cluster ---- */
  .ff-ingredients__head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.25rem;
    margin-bottom: clamp(1.75rem, 1rem + 3vw, 2.75rem);
  }
  .ff-ingredients__head .ff-eyebrow {
    background: rgba(255, 255, 255, 0.4);
    border-color: #d2d2d2;
    color: #000;
    font-size: 18px;
    font-weight: 400;
    padding: 15px 25px;
    border-radius: 40px;
  }
  .ff-ingredients__title {
    color: #000;
    font-family: var(--ff-display);
    font-weight: 600;
    font-size: clamp(2.25rem, 1.2rem + 3.6vw, 3.5rem);
    line-height: 1.12;
    letter-spacing: -0.01em;
  }

  /* ---- Two-column grid (cards left, photo right) ---- */
  .ff-ingredients__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    gap: clamp(1.25rem, 2vw, 50px);
  }

  /* ---- Left: brown panel ---- */
  .ff-ingredients__panel {
    background: var(--ff-taupe);
    border: 1px solid rgba(94, 68, 46, 0.3);
    border-radius: 15px;
    box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
    padding: clamp(1.25rem, 0.75rem + 1.5vw, 1.875rem);
  }
  .ff-ingredients__list {
    display: flex;
    flex-direction: column;
    gap: clamp(0.75rem, 0.5rem + 0.6vw, 0.9375rem);
  }

  /* ---- Accordion card ---- */
  .ff-ingredients__card {
    background: rgba(0, 0, 0, 0);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 15px;
    box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
    overflow: hidden;
  }
  .ff-ingredients__card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
    min-height: 50px;
    padding: 15px 25px;
    background: transparent;
    border: 0;
    text-align: left;
    cursor: pointer;
    color: #fff;
    font-family: var(--ff-display);
    font-weight: 600;
  }
  .ff-ingredients__card-head[disabled] { cursor: default; }
  .ff-ingredients__card-name {
    font-family: var(--ff-display);
    font-weight: 600;
    font-size: clamp(1.125rem, 1rem + .5vw, 1.25rem);
    line-height: 1.25;
    color: #fff;
  }
  .ff-ingredients__card-icon {
    flex: none;
    position: relative;
    width: 22px;
    height: 22px;
  }
  .ff-ingredients__card-icon::before,
  .ff-ingredients__card-icon::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    background: #fff;
    border-radius: 2px;
    transform: translate(-50%, -50%);
  }
  .ff-ingredients__card-icon::before { width: 18px; height: 2.5px; }   /* horizontal bar */
  .ff-ingredients__card-icon::after  { width: 2.5px; height: 18px; transition: opacity 0.3s var(--ff-ease, ease); } /* vertical bar (the "+") */
  .ff-ingredients__card.is-open .ff-ingredients__card-icon::after { opacity: 0; } /* becomes "−" when open */

  /* expandable panel */
  .ff-ingredients__card-panel {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.45s var(--ff-ease, cubic-bezier(0.22, 1, 0.36, 1));
    max-height:auto !important;
  }
  .ff-ingredients__card-body {
    padding: 0 25px 22px;
    font-family: var(--ff-body);
    font-weight: 400;
    font-size: clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
    line-height: 1.55;
    color: #fff;
  }
  /* Asterisk bullets — matches live MAIN INGREDIENTS style */
  ul.ff-ingredients__bullets {
    list-style: none;
    margin: 0;
    padding: 0 25px 22px;
  }
  ul.ff-ingredients__bullets li {
    position: relative;
    padding-left: 1.15em;
    margin: 0 0 0.35em;
    color: #fff;
    font-family: var(--ff-body);
    font-weight: 400;
    font-size: clamp(1rem, .96rem + .2vw, 1rem);
    line-height: 1.55;
  }
  ul.ff-ingredients__bullets li:last-child { margin-bottom: 0; }
  ul.ff-ingredients__bullets li::before {
    content: "*";
    position: absolute;
    left: 0;
    top: 0;
    color: #fff;
  }

  /* static (non-expanding) row — no description */
  .ff-ingredients__card.is-static .ff-ingredients__card-head { cursor: default; }

  /* ---- Right: product photo ---- */
  .ff-ingredients__media {
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 15px;
    box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
    overflow: hidden;
    height:100%;
  }
  .ff-ingredients__media img{
    height:100%;
  }
  .ff-ingredients__photo {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 835 / 539;
    object-fit: cover;
    transition: opacity 0.35s var(--ff-ease, ease);
  }
  .ff-ingredients__photo.is-swapping { opacity: 0.35; }

  /* ---- Responsive: stack ---- */
  @media (max-width: 900px) {
    .ff-ingredients__grid {
      grid-template-columns: 1fr;
      align-items: stretch;
    }
    .ff-ingredients__media { order: -1; }
  }
/* END_SECTION:forge-pdp-ingredients */

/* START_SECTION:forge-pdp-reviews (INDEX:26) */
/* =====================================================================
   SECTION: Forge · PDP Reviews
   Self-contained, scoped to .ff-pdpreviews / #ForgePdpReviews--*.
   Reproduces Figma node 245:1115. Card styling matches forge-testimonials.
   ===================================================================== */
.ff-pdpreviews {
  background: var(--ff-bg-a);
  padding-block: clamp(3rem, 2rem + 5vw, 6rem);
}

/* ── Heading cluster ── */
.ff-pdpreviews .ff-pdpreviews__head { margin-bottom: clamp(2rem, 1.4rem + 2.4vw, 3.25rem); }
.ff-pdpreviews .ff-pdpreviews__eyebrow {
  font-weight: 700;
  color: var(--ff-ink);
  background: rgba(255, 255, 255, 0.4);
  border-color: #d2d2d2;
  font-size: 1rem;
  padding: 0.6rem 1.25rem;
  margin-bottom: 1.25rem;
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
}
.ff-pdpreviews .ff-pdpreviews__title {
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: clamp(2.25rem, 1.4rem + 3.4vw, 3.5rem);
  line-height: 1.1;
}
.ff-pdpreviews .ff-pdpreviews__sub { margin-top: 1.1rem; }
.ff-pdpreviews .ff-pdpreviews__sub p {
  font-family: var(--ff-body);
  font-weight: 300;
  font-size: clamp(1rem, 0.95rem + 0.3vw, 1.25rem);
  line-height: 1.6;
  color: var(--ff-ink);
  max-width: 60ch;
  margin-inline: auto;
}

/* ── Review cards ── */
.ff-pdpreviews .ff-pdpreviews__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  max-width: 70rem;
  margin-inline: auto;
}
.ff-pdpreviews .ff-pdpreviews__item {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
  background: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(94, 68, 46, 0.3);
  border-radius: 15px;
  box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
  padding: clamp(1.35rem, 1rem + 1vw, 1.6rem);
}
.ff-pdpreviews .ff-pdpreviews__bubble { position: relative; }
.ff-pdpreviews .ff-pdpreviews__bubble-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}
.ff-pdpreviews .ff-pdpreviews__stars { font-size: 1rem; letter-spacing: 0.08em; }
.ff-pdpreviews .ff-pdpreviews__qmark { display: block; width: 32px; height: 24px; flex: none; }
.ff-pdpreviews .ff-pdpreviews__quote {
  font-family: var(--ff-display);
  font-weight: 500;
  font-style: italic;
  font-size: clamp(1rem, 0.92rem + 0.35vw, 1.125rem);
  line-height: 1.5;
  color: var(--ff-ink);
  margin: 0;
  padding: 0;
  border: 0;
}
.ff-pdpreviews .ff-pdpreviews__divider {
  width: 100%;
  height: 0;
  border: 0;
  border-top: 1px solid rgba(94, 68, 46, 0.3);
  margin: clamp(1.1rem, 0.9rem + 0.8vw, 1.5rem) 0 0;
}
.ff-pdpreviews .ff-pdpreviews__person {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding-top: 1.1rem;
}
.ff-pdpreviews .ff-pdpreviews__avatar {
  flex: none;
  width: 55px;
  height: 55px;
  border-radius: 80px;
  overflow: hidden;
  background: var(--ff-cream-2);
}
.ff-pdpreviews .ff-pdpreviews__avatar img { width: 100%; height: 100%; object-fit: cover; }
.ff-pdpreviews .ff-pdpreviews__meta { display: flex; flex-direction: column; gap: 0.2rem; line-height: 1.2; }
.ff-pdpreviews .ff-pdpreviews__meta strong {
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: 1.375rem;
  color: var(--ff-ink);
}
.ff-pdpreviews .ff-pdpreviews__meta em {
  font-style: normal;
  font-family: var(--ff-body);
  font-size: 0.875rem;
  color: var(--ff-ink);
}

/* ── CTA ── */
.ff-pdpreviews .ff-pdpreviews__cta { text-align: center; margin-top: clamp(1.75rem, 1.2rem + 2vw, 3rem); }
.ff-pdpreviews .ff-pdpreviews__cta-btn {
  --bg: var(--ff-brown);
  --fg: #ffffff;
  border-color: rgba(255, 255, 255, 0.3);
  font-size: 1.125rem;
  font-weight: 500;
  padding: 0.85rem 1.55rem;
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
}
.ff-pdpreviews .ff-pdpreviews__cta-btn:hover { --bg: var(--ff-brown-2); }

/* ── Live Judge.me widget ── */
.ff-pdpreviews .ff-pdpreviews__widget {
  margin-top: clamp(2.5rem, 1.8rem + 3vw, 4.5rem);
  scroll-margin-top: 90px;
}
.ff-pdpreviews .ff-pdpreviews__widget:empty,
.ff-pdpreviews .ff-pdpreviews__widget .jdgm-widget:empty { min-height: 0; }

/* ── Responsive: 3 → 1 col ── */
@media (max-width: 980px) {
  .ff-pdpreviews .ff-pdpreviews__grid {
    grid-template-columns: 1fr;
    max-width: 34rem;
    margin-inline: auto;
  }
}
/* END_SECTION:forge-pdp-reviews */

/* START_SECTION:forge-pdp-sticky (INDEX:27) */
.ff-sticky-atc {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
  background: var(--ff-brown); color: var(--ff-cream);
  transform: translateY(110%); transition: transform 0.4s var(--ff-ease);
  box-shadow: 0 -8px 24px -16px rgba(0,0,0,0.5);
}
.ff-sticky-atc.is-visible { transform: translateY(0); }
.ff-sticky-atc__inner {
  width: 100%;
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 0.7rem var(--ff-gutter);
}
.ff-sticky-atc__info { display: flex; flex-direction: column; min-width: 0; }
.ff-sticky-atc__name { font-family: var(--ff-display); font-weight: 600; font-size: 1.05rem; line-height: 1.1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ff-sticky-atc__meta { display: flex; gap: 0.6rem; font-size: 0.85rem; color: rgba(244,237,229,0.8); }
.ff-sticky-atc__price { font-weight: 600; color: var(--ff-cream); }
.ff-sticky-atc__btn {
  flex: none; display: inline-flex; align-items: center; gap: 0.5rem;
  font-family: var(--ff-body); font-weight: 500; font-size: 0.95rem; color: var(--ff-brown);
  background: var(--ff-cream); border: 0; border-radius: var(--ff-radius-pill);
  padding: 0.8rem 1.5rem; cursor: pointer; transition: transform 0.3s var(--ff-ease);
}
.ff-sticky-atc__btn:hover { transform: translateY(-1px); }
.ff-sticky-atc__btn .ff-btn__arrow { display:flex;  transition: transform 0.4s var(--ff-ease); }
.ff-sticky-atc__btn:hover .ff-btn__arrow { display:flex;  transform: translateX(3px); }
.ff-sticky-atc__btn--notify,
.ff-sticky-atc__btn--notify:hover {
  background: #c4b5a5;
  color: #5e442e;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-size: 0.8rem;
  transform: none;
}
.ff-sticky-atc__btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  transform: none;
}
@media (max-width: 600px) {
  .ff-sticky-atc__name { font-size: 0.95rem; max-width: 40vw; }
  .ff-sticky-atc__btn { padding: 0.75rem 1.1rem; }
}
@media (prefers-reduced-motion: reduce) { .ff-sticky-atc { transition: none; } }
/* END_SECTION:forge-pdp-sticky */

/* START_SECTION:forge-pdp-stirit (INDEX:28) */
.ff-stirit--dark { color: #fff; }
.ff-stirit--dark .ff-stirit__h { color: #fff; }
.ff-stirit--dark .ff-stirit__body,
.ff-stirit--dark .ff-stirit__body p { 
color: rgba(255, 255, 255, 0.92); 
}
.ff-stirit--dark .ff-stirit__copy .ff-eyebrow {
  color: var(--ff-ink);
  background: rgba(255, 255, 255, 0.92);
}
.ff-stirit--tight-top {
  padding-top: clamp(1.25rem, 0.75rem + 2vw, 2.5rem);
}
.ff-stirit__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(1.25rem, 2vw, 50px);
  align-items: center;
}

/* image_right: copy left, image right */
.ff-stirit--reverse .ff-stirit__media { order: 2; }
.ff-stirit--reverse .ff-stirit__copy { order: 1; }

/* ---- Media: Figma image 34 — 835 x 526 (≈1.587), 15px radius ---- */
.ff-stirit__media {
  position: relative;
  aspect-ratio: 835 / 526;
  border-radius: 15px;
  overflow: hidden;
  border: 1px solid rgba(94, 68, 46, 0.3);
  box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
  background: linear-gradient(135deg, #b9583f, #7c3a28);
}
/* Video on Stir It In: keep the media proportion clean, without card chrome */
.ff-stirit__media--video {
  aspect-ratio: 9 / 16;
  width: min(100%, 32rem);
  justify-self: start;
  border: 0;
  box-shadow: none;
  background: transparent;
}
.ff-stirit__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}
.ff-stirit__vid {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: inherit;
  display: block;
}

/* ---- Copy ---- */
.ff-stirit__copy .ff-eyebrow {
  background: rgba(255, 255, 255, 0.55);
  border-color: #d2d2d2;
  color: var(--ff-ink);
  margin-bottom: 1.5rem;
}
.ff-stirit__h {
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: clamp(2.25rem, 1.4rem + 3.3vw, 3.5rem);
  line-height: 1.12;
  letter-spacing: -0.01em;
  color: var(--ff-ink);
  margin-bottom: 1.35rem;
}
.ff-stirit__body {
  font-family: var(--ff-body);
  font-weight: 400;
  font-size: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  line-height: 1.7;
  color: var(--ff-ink);
  margin-bottom: 1.75rem;
}
.ff-stirit__cta {
  --bg: var(--ff-brown);
  --fg: #fff;
  border-color: rgba(255, 255, 255, 0.3);
  font-size: 1.0625rem;
  font-weight: 500;
  padding: 0.95rem 1.5rem;
}

@media (max-width: 860px) {
  .ff-stirit__inner { grid-template-columns: 1fr; }
  .ff-stirit--reverse .ff-stirit__media { order: -1; }   /* image first on mobile */
  .ff-stirit--reverse .ff-stirit__copy { order: 0; }
  .ff-stirit__copy { max-width: none; }
  .ff-stirit__media--video {
    aspect-ratio: 9 / 16;
    width: min(100%, 28rem);
    justify-self: center;
  }
}
/* END_SECTION:forge-pdp-stirit */

/* START_SECTION:forge-pdp-tradition (INDEX:29) */
.ff-tradition { background: var(--ff-bg-b); }
.ff-tradition__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.25rem, 2vw, 50px);
  align-items: center;
}

/* image_right: copy left, image right */
.ff-tradition--reverse .ff-tradition__media { order: 2; }
.ff-tradition--reverse .ff-tradition__copy { order: 1; }

/* ---- Media: Figma "image 34" — 835×548, 15px radius ---- */
.ff-tradition__media {
  position: relative;
  aspect-ratio: 835 / 548;
  border-radius: 15px;
  overflow: hidden;
  border: 1px solid rgba(94, 68, 46, 0.3);
  box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
  background: linear-gradient(135deg, #4a5d3a, #243018);
}
.ff-tradition__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}
.ff-tradition__vid,
.ff-tradition__media video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
  display: block;
}

/* ---- Copy ---- */
.ff-tradition__copy { max-width: none; }

/* Eyebrow — Figma 50px pill, Inter 18px black, white glass, #d2d2d2 border */
.ff-tradition__eyebrow {
  font-size: 1.125rem;             /* 18px */
  font-weight: 400;
  color: #000;
  background: rgba(255, 255, 255, 0.4);
  border-color: #d2d2d2;
  letter-spacing: 0;
  padding: 0.9375rem 1.5625rem;    /* 15px 25px */
  border-radius: 40px;
  margin-bottom: 1.75rem;
}

/* Heading — Josefin SemiBold 56px / 80px line-height */
body .ff-tradition__h {
  font-size: clamp(2.25rem, 1.4rem + 3.3vw, 3.5rem);  /* → ~56px */
  line-height: 1.3;               /* 80px / 56px */
  letter-spacing: -0.01em;
  color: #000;
  margin-bottom: 1.5rem;
}

/* Body — Inter Light 18px / 36.72px */
.ff-tradition__body {
  font-family: var(--ff-body);
  font-weight: 300;
  font-size: 1.125rem;             /* 18px */
  line-height: 2.04;               /* ≈36.72px / 18px */
  color: #000;
  max-width: none;
}
.ff-tradition__body :where(p) + p { margin-top: 1em; }

/* ---- Planetary-correspondence chip — Figma "image 37" ---- */
.ff-tradition__chip {
  display: flex;
  align-items: center;
  gap: 0.9375rem;                  /* 15px */
  min-height: 62px;
  padding: 0.75rem 1.25rem;
  border: 1px solid rgba(211, 119, 102, 0.3);
  border-radius: 15px;
  box-shadow: 2px 2px 10px 0 rgba(150, 150, 150, 0.15);
  background-color: var(--ff-paper);
  background-image: url("forge-tradition-2.png");
  background-size: cover;
  background-position: center;
}
.ff-tradition__chip-text {
  flex: 1 1 auto;
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: 1.125rem;             /* 22px */
  line-height: 1.25;
  color: #000;
}
.ff-tradition__quote { flex: 0 0 auto; display: inline-flex; }
.ff-tradition__quote img { width: 27px; height: 20px; display: block; }
.ff-tradition__quote--open img { transform: rotate(180deg) scaleY(-1); }

@media (max-width: 860px) {
  .ff-tradition__inner { grid-template-columns: 1fr; }
  .ff-tradition--reverse .ff-tradition__media { order: -1; }  /* image first on mobile */
  .ff-tradition--reverse .ff-tradition__copy { order: 0; }
  .ff-tradition__copy { max-width: none; }
  .ff-tradition__chip { align-items: flex-start; }
  {% comment %} .ff-tradition__quote--close { display: none; } {% endcomment %}
}
/* END_SECTION:forge-pdp-tradition */

/* START_SECTION:forge-product-grid (INDEX:30) */
/* Grid — 3-up desktop, 2-up tablet, 1-up mobile */
.ff-grid .ff-grid__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

/* Card — horizontal: image panel left, content right */
.ff-grid .ff-prod {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  align-items: stretch;
  min-height: 280px;
  border-radius: var(--ff-card-radius);
  background: rgba(255, 255, 255, 0.2);
  border: var(--ff-card-border);
  box-shadow: var(--ff-card-shadow);
  overflow: hidden;
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  transition: transform 0.4s var(--ff-ease), box-shadow 0.4s var(--ff-ease);
}
.ff-grid .ff-prod:hover { transform: translateY(-4px); box-shadow: var(--ff-shadow); }

.ff-grid .ff-prod__media {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  border-radius: 15px 0 0 15px;
  overflow: hidden;
  background: var(--ff-cream-2);
}
.ff-grid .ff-prod__media img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 0.6s var(--ff-ease);
}
.ff-grid .ff-prod:hover .ff-prod__media img { transform: scale(1.04); }
.ff-grid .ff-prod__ph { position: absolute; inset: 0; background: linear-gradient(135deg, #cbb89f, #8a7152); }

/* Content side — cream panel so text stays legible over any product photo */
.ff-grid .ff-prod__body {
position: relative;
    z-index: 1;
    min-width: 0;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 0;
    border-radius: 15px;
    background: rgba(238, 236, 231, 0.30);
    box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
}

/* Corner "Best seller" badge — top-left of content panel */
.ff-grid .ff-prod__badge {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  font-family: var(--ff-body);
  font-size: 0.875rem;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ff-brown);
  background: rgba(255, 255, 255, 0.4);
  border: 0.5px solid #d2d2d2;
  border-radius: 15px;
  padding: 5px 10px;
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
  margin-bottom: 18px;
}

.ff-grid .ff-prod__title {
  font-family: var(--ff-display);
  font-weight: 500;
  /* font-size: clamp(1.25rem, 1.05rem + 0.5vw, 2.4rem); */
  font-size: clamp(1rem, 0.95rem + 0.3vw, 1.25rem);
  line-height: 1.12;
  color: var(--ff-ink);
  margin-bottom: 0.4rem;
  overflow-wrap: anywhere;
}
.ff-grid .ff-prod__title a { color: inherit; text-decoration: none; }

.ff-grid .ff-prod__tag {
  font-family: var(--ff-body);
  font-weight: 300;
  font-size: 1.0625rem;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ff-ink);
  margin-bottom: 40px;
}

/* Price row — "From $X" + Sub & save pill, above a hairline divider */
.ff-grid .ff-prod__price-row {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  flex-wrap: wrap;
  /* border-bottom: 1px solid var(--ff-line); */
}
.ff-grid .ff-prod__price-row + svg{
  width:100%;
  margin-block: 30px;
}
.ff-grid .ff-prod__price {
  font-family: var(--ff-display);
  font-weight: 500;
  font-size: 1.25rem;
  line-height: 1;
  color: var(--ff-ink);
}
.ff-grid .ff-prod__sub {
  display: inline-flex;
  align-items: center;
  font-family: var(--ff-body);
  font-weight: 500;
  font-size: 0.75rem;
  line-height: 1;
  color: var(--ff-terracotta);
  border: 1px solid var(--ff-terracotta);
  border-radius: var(--ff-radius-pill);
  padding: 5px 15px;
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
  white-space: nowrap;
}

/* Quick buy — full-width brown pill */
.ff-grid .ff-prod__add {
  --bg: var(--ff-brown);
  --fg: #fff;
  width: 100%;
  justify-content: center;
  gap: 0.5rem;
  padding: 15px 12px;
  /* font-size: 1.0625rem; */
  font-size: 1rem;
  font-weight: 500;
  border-color: rgba(255, 255, 255, 0.3);
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
}
.ff-grid .ff-prod__add .ff-prod__arrow { display: inline-flex; transition: transform 0.4s var(--ff-ease); }
.ff-grid .ff-prod__add:hover .ff-prod__arrow { transform: translateX(4px); }
.ff-grid .ff-prod__add.is-loading { opacity: 0.6; pointer-events: none; }
.ff-grid .ff-prod__add.is-done { background: var(--ff-sage); color: #fff; border-color: var(--ff-sage); }
.ff-grid .ff-prod__add--soldout { background: var(--ff-brown); }

/* Footer CTA — centered brown pill */
.ff-grid .ff-grid__cta { text-align: center; margin-top: clamp(2.25rem, 1.5rem + 3vw, 4rem); }
.ff-grid .ff-grid__cta-btn {
  --bg: var(--ff-brown);
  --fg: #fff;
  gap: 0.85rem;
  padding: 15px 25px;
  font-size: 1.0625rem;
  border-color: rgba(255, 255, 255, 0.3);
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
}
.ff-grid .ff-grid__cta-btn .ff-prod__arrow { display: inline-flex; transition: transform 0.4s var(--ff-ease); }
.ff-grid .ff-grid__cta-btn:hover .ff-prod__arrow { transform: translateX(4px); }

/* Responsive: 3-up → 2-up tablet → 1-up mobile */
@media (max-width: 1180px) {
  .ff-grid .ff-grid__cards { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width:991px){
  .ff-grid .ff-prod__add{
    font-size:14px;
  }
}

@media (max-width: 680px) {
  .ff-grid .ff-grid__cards { grid-template-columns: 1fr; }
  .ff-grid .ff-prod { grid-template-columns: 1fr; min-height: 0; }
  .ff-grid .ff-prod__media { aspect-ratio: 4/3; height: auto; border-radius: 15px 15px 0 0; }
}
/* END_SECTION:forge-product-grid */

/* START_SECTION:forge-quiz-new (INDEX:31) */
.ff-quiz { background: var(--ff-bg-a); }
.ff-quiz .ff-quiz__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.25rem, 2vw, 50px);
  align-items: center;
}

/* ---------- Copy column ---------- */
.ff-quiz .ff-quiz__eyebrow {
  font-size: 1rem;
  padding: 0.7rem 1.3rem;
  background: rgba(255, 255, 255, 0.4);
  border-color: #d2d2d2;
  color: var(--ff-ink);
  margin-bottom: clamp(1.75rem, 1rem + 2vw, 1rem);
}
.ff-quiz .ff-quiz__h {
  font-weight: 600;
  line-height: 1.18;
  letter-spacing: -0.005em;
  text-wrap: balance;
  margin-bottom: clamp(1rem, 1rem + 2vw, 1rem);
  max-width: 22ch;
}
.ff-quiz .ff-quiz__lead {
  font-family: var(--ff-body);
  font-weight: 500;
  font-size: 1.125rem;
  line-height: 1.85;
  color: var(--ff-ink);
  max-width: 44ch;
  margin-bottom: 2rem;
}
.ff-quiz .ff-quiz__lead p { margin: 0; }
.ff-quiz .ff-quiz__cta-btn {
  --bg: var(--ff-brown);
  --fg: #fff;
  font-size: 1.125rem;
  font-weight: 500;
  padding: 0.95rem 1.6rem;
  border-color: rgba(255, 255, 255, 0.3);
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
}
.ff-quiz .ff-quiz__cta-arrow {
  display: inline-flex;
  width: 21px;
  height: 10px;
}
.ff-quiz .ff-quiz__cta-arrow svg { width: 100%; height: 100%; display: block; }

/* ---------- Quiz card (shared shell) ---------- */
.ff-quiz .ff-quiz__card {
  position: relative;
  display: block;
  text-decoration: none;
  color: #fff;
  overflow: hidden;
  border-radius: 15px;
  border: 1px solid rgba(94, 68, 46, 0.3);
  box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
  background: var(--ff-taupe);
  isolation: isolate;
  transition: transform 0.4s var(--ff-ease), box-shadow 0.4s var(--ff-ease);
}
a.ff-quiz__card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px -22px rgba(48, 33, 20, 0.45);
}
.ff-quiz .ff-quiz__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -2;
}
.ff-quiz .ff-quiz__overlay {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(120, 99, 76, 0.55) 0%, rgba(94, 68, 46, 0.62) 100%);
}
.ff-quiz .ff-quiz__card-inner {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: clamp(1.5rem, 1rem + 2.5vw, 2.5rem);
  min-height: clamp(330px, 30vw, 400px);
}

/* Stepper Q1–Q4 */
.ff-quiz .ff-quiz__steps {
  display: flex;
  align-items: center;
  gap: clamp(0.5rem, 0.25rem + 1vw, 1rem);
  margin-bottom: clamp(1.25rem, 1rem + 1.5vw, 2rem);
}
.ff-quiz .ff-quiz__step {
  flex: none;
  width: clamp(44px, 3.6vw, 60px);
  height: clamp(44px, 3.6vw, 60px);
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-family: var(--ff-display);
  font-weight: 500;
  font-size: clamp(1.05rem, 0.8rem + 0.6vw, 1.625rem);
  color: #fff;
  background: rgba(221, 221, 221, 0.2);
  border: 1px solid rgba(173, 151, 134, 0.4);
  transition: background 0.3s ease;
}
.ff-quiz .ff-quiz__step.is-active {
  background: var(--ff-brown);
  border-color: rgba(173, 151, 134, 0.4);
}
.ff-quiz .ff-quiz__step.is-done {
  background: rgba(255, 255, 255, 0.4);
}
.ff-quiz .ff-quiz__line {
  flex: 1;
  height: 1px;
  background: rgba(255, 255, 255, 0.5);
}

.ff-quiz .ff-quiz__divider {
  display: block;
  height: 1px;
  background: rgba(255, 255, 255, 0.45);
  margin: 0 0 auto;
}

.ff-quiz .ff-quiz__q {
  font-family: var(--ff-display);
  font-weight: 700;
  font-size: clamp(1.25rem, 0.9rem + 1.4vw, 1.575rem);
  line-height: 1.2;
  color: #fff;
  margin: clamp(1.5rem, 1rem + 2vw, 2.5rem) 0 clamp(1rem, 0.75rem + 1vw, 1.5rem);
}

/* Answer chips */
.ff-quiz .ff-quiz__chips {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(0.5rem, 0.35rem + 0.5vw, 0.75rem);
}
.ff-quiz .ff-quiz__chip {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  background: #fff;
  border: 1px solid #d2d2d2;
  border-radius: var(--ff-radius-pill);
  padding: 0.6rem 1.1rem;
  font-family: var(--ff-body);
  font-weight: 500;
  font-size: clamp(0.95rem, 0.85rem + 0.3vw, 1.25rem);
  color: var(--ff-brown);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  white-space: nowrap;
}
.ff-quiz .ff-quiz__chip-ic {
  display: inline-flex;
  width: 1.1em;
  height: 1.1em;
  color: var(--ff-brown);
}
.ff-quiz .ff-quiz__chip-ic svg { width: 100%; height: 100%; display: block; }

/* ---------- Live Quiz Kit embed + stepper ---------- */
.ff-quiz .ff-quiz__card--live { display: block; }
.ff-quiz .ff-quiz__card-inner--live {
  padding: clamp(1rem, 0.5rem + 1.5vw, 1.75rem);
  min-height: clamp(380px, 32vw, 460px);
}

/* stepper show/hide (toggled by the script) */
.ff-quiz .ff-quiz__steps.is-hidden,
.ff-quiz .ff-quiz__divider.is-hidden { display: none; }
.ff-quiz .ff-quiz__divider--live { margin: 0 0 clamp(1rem, 0.75rem + 1vw, 1.5rem); }

/* live stepper: circle size adapts to the number of steps (set by the script) */
.ff-quiz .ff-quiz__steps--live { gap: var(--ff-step-gap, 0.75rem); }
.ff-quiz .ff-quiz__steps--live .ff-quiz__step {
  width: var(--ff-step-size, 44px);
  height: var(--ff-step-size, 44px);
  font-size: var(--ff-step-font, 1rem);
}

/* hide Quiz Kit's own thin progress bar (we draw the circles instead);
   collapse it but keep it rendered so the script can still read step state */
.ff-quiz .ff-quiz__embed #quiz-kit-progress-bar-container {
  height: 0 !important;
  margin: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

/* let the embedded quiz show through the card's brown overlay */
.ff-quiz .ff-quiz__embed .lq-box,
.ff-quiz .ff-quiz__embed .lq-wrapper {
  background: transparent !important;
  border: 0 !important;
  min-height: 0 !important;
}

/* OPTIONAL — match question + answers to the card design.
   If the live Quiz Kit layout needs its own background/colours,
   comment this block out and the quiz keeps its native look. */
.ff-quiz .ff-quiz__embed .lq-slide-title {
  color: #fff !important;
  font-family: var(--ff-display) !important;
}
.ff-quiz .ff-quiz__embed .lq-choices.lq-multiple-choice {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.6rem !important;
}
.ff-quiz .ff-quiz__embed .lq-choice {
  width: auto !important;
  flex: 0 0 auto !important;
  background: #fff !important;
  border: 1px solid #d2d2d2 !important;
  border-radius: var(--ff-radius-pill) !important;
  padding: 0.6rem 1.1rem !important;
  font-family: var(--ff-body) !important;
  font-weight: 500 !important;
}
.ff-quiz .ff-quiz__embed .lq-choice,
.ff-quiz .ff-quiz__embed .lq-choice * { color: var(--ff-brown) !important; }
.ff-quiz .ff-quiz__embed .lq-letter { display: none !important; }

/* ---------- Responsive ---------- */
@media (max-width: 860px) {
  .ff-quiz .ff-quiz__inner { grid-template-columns: 1fr; }
  .ff-quiz .ff-quiz__h { max-width: none; }
  .ff-quiz .ff-quiz__lead { max-width: none; }
}
@media (max-width: 480px) {
  .ff-quiz .ff-quiz__chips { gap: 0.45rem; }
  .ff-quiz .ff-quiz__chip { padding: 0.5rem 0.85rem; font-size: 0.9rem; }
}
/* END_SECTION:forge-quiz-new */

/* START_SECTION:forge-quiz (INDEX:32) */
.ff-quiz .ff-quiz__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.25rem, 2vw, 50px);
  align-items: center;
}

/* ---------- Copy column ---------- */
.ff-quiz .ff-quiz__copy {
  text-align: left;
}
.ff-quiz .ff-quiz__eyebrow {
  font-size: 1rem;
  padding: 0.7rem 1.3rem;
  background: rgba(255, 255, 255, 0.4);
  border-color: #d2d2d2;
  color: var(--ff-ink);
  margin-bottom: clamp(1.75rem, 1rem + 2vw, 2rem);
}
.ff-quiz .ff-quiz__h {
  font-size: clamp(2rem, 1.2rem + 3.4vw, 3.5rem);
  line-height: 1.33;
  letter-spacing: -0.005em;
  text-wrap: balance;
  margin-bottom: clamp(1rem, 1rem + 2vw, 2rem);
  max-width: 22ch;
}
.ff-quiz .ff-quiz__lead {
  font-family: var(--ff-body);
  font-weight: 500;
  font-size: 1.125rem;
  line-height: 1.85;
  color: var(--ff-ink);
  max-width: 44ch;
  margin-bottom: 2rem;
}
.ff-quiz .ff-quiz__lead p { margin: 0; }
.ff-quiz .ff-quiz__cta-btn {
  --bg: var(--ff-brown);
  --fg: #fff;
  font-size: 1.125rem;
  font-weight: 500;
  padding: 0.95rem 1.6rem;
  border-color: rgba(255, 255, 255, 0.3);
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
}
.ff-quiz .ff-quiz__cta-arrow {
  display: inline-flex;
  width: 21px;
  height: 10px;
}
.ff-quiz .ff-quiz__cta-arrow svg { width: 100%; height: 100%; display: block; }

/* ---------- Quiz preview card ---------- */
.ff-quiz .ff-quiz__card {
  position: relative;
  display: block;
  text-decoration: none;
  color: #fff;
  overflow: hidden;
  border-radius: 15px;
  border: 1px solid rgba(94, 68, 46, 0.3);
  box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
  background: var(--ff-taupe);
  isolation: isolate;
  transition: transform 0.4s var(--ff-ease), box-shadow 0.4s var(--ff-ease);
}
.ff-quiz .ff-quiz__card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px -22px rgba(48, 33, 20, 0.45);
}
.ff-quiz .ff-quiz__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -2;
}
.ff-quiz .ff-quiz__overlay {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(120, 99, 76, 0.55) 0%, rgba(94, 68, 46, 0.62) 100%);
}
.ff-quiz .ff-quiz__card-inner {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: clamp(1.5rem, 1rem + 2.5vw, 2.5rem);
  min-height: clamp(330px, 30vw, 400px);
}

/* Stepper Q1–Q4 */
.ff-quiz .ff-quiz__steps {
  display: flex;
  align-items: center;
  gap: clamp(0.5rem, 0.25rem + 1vw, 1rem);
  margin-bottom: clamp(1.25rem, 1rem + 1.5vw, 2rem);
}
.ff-quiz .ff-quiz__step {
  flex: none;
  width: clamp(44px, 3.6vw, 60px);
  height: clamp(44px, 3.6vw, 60px);
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-family: var(--ff-display);
  font-weight: 500;
  font-size: clamp(1.05rem, 0.8rem + 0.6vw, 1.625rem);
  color: #fff;
  background: rgba(221, 221, 221, 0.2);
  border: 1px solid rgba(173, 151, 134, 0.4);
}
.ff-quiz .ff-quiz__step.is-active {
  background: var(--ff-brown);
  border-color: rgba(173, 151, 134, 0.4);
}
.ff-quiz .ff-quiz__line {
  flex: 1;
  height: 1px;
  background: rgba(255, 255, 255, 0.5);
}

.ff-quiz .ff-quiz__divider {
  display: block;
  height: 1px;
  background: rgba(255, 255, 255, 0.45);
  margin: 0 0 auto;
}

.ff-quiz .ff-quiz__q {
  font-family: var(--ff-display);
  font-weight: 700;
  font-size: clamp(1.25rem, 0.9rem + 1.4vw, 1rem);
  line-height: 1.2;
  color: #fff;
  margin: clamp(1.5rem, 1rem + 2vw, 2.5rem) 0 clamp(1rem, 0.75rem + 1vw, 1.5rem);
}

/* Answer chips */
.ff-quiz .ff-quiz__chips {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(0.5rem, 0.35rem + 0.5vw, 0.75rem);
}
.ff-quiz .ff-quiz__chip {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  background: #fff;
  border: 1px solid #d2d2d2;
  border-radius: var(--ff-radius-pill);
  padding: 0.6rem 1.1rem;
  font-family: var(--ff-body);
  font-weight: 500;
  font-size: clamp(0.95rem, 0.85rem + 0.3vw, 1rem);
  color: var(--ff-brown);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  white-space: nowrap;
}
.ff-quiz .ff-quiz__chip-ic {
  display: inline-flex;
  width: 1.1em;
  height: 1.1em;
  color: var(--ff-brown);
}
.ff-quiz .ff-quiz__chip-ic svg { width: 100%; height: 100%; display: block; }

/* ---------- Responsive ---------- */
@media (max-width: 860px) {
  .ff-quiz .ff-quiz__inner { grid-template-columns: 1fr; }
  .ff-quiz .ff-quiz__h { max-width: none; }
  .ff-quiz .ff-quiz__lead { max-width: none; }
}
@media (max-width: 480px) {
  .ff-quiz .ff-quiz__chips { gap: 0.45rem; }
  .ff-quiz .ff-quiz__chip { padding: 0.5rem 0.85rem; font-size: 0.9rem; }
}
/* END_SECTION:forge-quiz */

/* START_SECTION:forge-subscribe-value (INDEX:33) */
.ff-subval__inner {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1fr);
  gap: clamp(1.25rem, 2vw, 50px);
  align-items: center;
}

/* ---- Copy (left) ---- */
.ff-subval__copy { text-align: left; }
.ff-subval__copy .ff-eyebrow { margin-bottom: 1.4rem; }
.forge-container .ff-subval__h2 { margin-bottom: 1.25rem;}
.ff-subval__lead { font-weight:400; margin-bottom: 2rem; line-height: 1.7; }
.ff-subval__cta {
  --bg: var(--ff-brown);
  --fg: #fff;
  margin-top: 0.25rem;
  border-color: rgba(255, 255, 255, 0.3);
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
}
.ff-subval__h2 {
  font-size: clamp(2rem, 1.2rem + 3.4vw, 3.5rem);
  line-height: 1.43;
}

/* ---- Timeline panel (right, taupe) ---- */
.ff-subval__panel {
  background: var(--ff-taupe);
  border-radius: var(--ff-radius-lg);
  padding: clamp(1rem, 1rem + 1.6vw, 2.25rem);
  display: flex;
  flex-direction: column;
  gap: clamp(1.1rem, 0.6rem + 1vw, 1.5rem);
  box-shadow: var(--ff-shadow);
}

.ff-subval__step {
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr);
  gap: clamp(1rem, 0.5rem + 1.2vw, 1.75rem);
  align-items: stretch;
}

/* circular Day/Week/Month badge + dashed connector */
.ff-subval__rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}
.ff-subval__badge:before {
    content: "";
    padding: 1px;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: absolute;
    width: 88px;
    height: 88px;
    top: 50%;
    border-radius: 100px;
    background:var(--ff-taupe);
    left: 50%;
    transform: translate(-50%, -50%);
}
.ff-subval__badge {
  position:relative;
  width: 90px;
  height: 90px;
  border-radius: 60px;
  /* border: 1px solid rgba(173, 151, 134, 0.4); */
  /* background: rgba(255, 255, 255, 0.06); */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #fff;
  flex-shrink: 0;
  background:linear-gradient(127deg, #fff 4%, #ffffff47 46%, #fff 97%)
}
.ff-subval__unit {
  font-family: var(--ff-body);
  font-size: 1.125rem;
  font-weight: 400;
  line-height: 1;
  z-index:2;
}
.ff-subval__num {
  font-family: var(--ff-display);
  font-weight: 500;
  font-size: 1.75rem;
  line-height: 1;
    z-index:2;
  margin-top: 0.35rem;
}
.ff-subval__connector {
  flex: 1 1 auto;
  width: 0;
  min-height: 1.25rem;
  margin: 0.4rem 0;
  border-left: 1.5px dashed rgba(255, 255, 255, 0.45);
}

/* bordered text card with right-edge thumbnail */
.ff-subval__card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(110px, 30%, 200px);
  align-items: stretch;
  min-height: 130px;
  /* max-height: 150px; */
  border: 1px solid rgb(226 219 212);
  border-radius: 15px;
  background: rgba(255, 255, 255, 0.04);
  box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
  overflow: hidden;
}
.ff-subval__text {
  align-self: center;
      padding: 1.5rem clamp(1rem, .5rem + 1vw, 1.6rem);
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.ff-subval__title {
  font-family: var(--ff-display);
  font-weight: 700;
  color: #fff !important;
  font-size: 1.325rem;
  line-height: 1.15;
  margin: 0 0 0.7rem;
}
.ff-subval__body {
  font-family: var(--ff-body);
  font-weight: 500;
  color: #fff;
  font-size: 1.125rem;
  line-height: 1.3;
  margin: 0;
}
.ff-subval__thumb {
  overflow: hidden;
  border-top-right-radius: 15px;
  border-bottom-right-radius: 15px;
}
.ff-subval__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  aspect-ratio: 4 / 3;
}

/* ---- Responsive ---- */
@media (max-width: 1080px) {
  .ff-subval__inner {
    display: grid;
    grid-template-columns: auto;
    gap: clamp(1.25rem, 2vw, 50px);
    align-items: center;
}
  .ff-subval__title { font-size: 1.4rem; }
  .ff-subval__body { font-size: 1rem; }
  .ff-subval__card { grid-template-columns: minmax(0, 1fr) 150px; }
}
@media (max-width: 860px) {
   .ff-subval__card { grid-template-columns: auto; }
  .ff-subval__thumb{
    border-radius:0px;
  }
  .ff-subval__inner { grid-template-columns: 1fr; gap: clamp(1.25rem, 2vw, 50px); }
  .ff-subval__h2, .ff-subval__lead { max-width: none; }
  .ff-subval__step { grid-template-columns: 72px minmax(0, 1fr); gap: 1rem; }
  .ff-subval__badge { width: 72px; height: 72px; }
  .ff-subval__num { font-size: 1.85rem; }
  .ff-subval__unit { font-size: 1rem; }
}
@media (max-width: 560px) {
  .ff-subval__card { grid-template-columns: 1fr; min-height: 0; }
  .ff-subval__thumb { height: 140px; border-radius: 0 0 14px 14px; }
}
/* END_SECTION:forge-subscribe-value */

/* START_SECTION:forge-testimonials (INDEX:34) */
/* =====================================================================
   SECTION: Forge · Testimonials — "What people are saying"
   Figma node 372:968 — centered header, 50/50 featured card, speech-bubble reviews.
   ===================================================================== */
.ff-tms .ff-tms__head .ff-eyebrow {
    font-weight: 400;
    color: var(--ff-ink);
    background: #fff6;
    border-color: #d2d2d2;
    font-size: 1rem;
    padding: 15px;
    line-height: 1.2;
    margin-bottom: 1.25rem;
}
.ff-tms .ff-tms__title { line-height: 1.35; }
.ff-tms .ff-tms__sub p {
  font-family: var(--ff-body);
  font-weight: 300;
  font-size: clamp(1rem, 0.95rem + 0.3vw, 1.25rem);
  line-height: 1.6;
  color: var(--ff-ink);
  max-width: 60ch;
  margin-inline: auto;
  text-align: center;
}

/* ── Featured practitioner card — 50/50 split ── */
.ff-tms .ff-tms__featured {
  display: grid;
  grid-template-columns: 1fr 1.3fr;
  align-items: stretch;
  gap: 0;
  overflow: hidden;
  background: #faf6f1;
  border: 1px solid rgba(94, 68, 46, 0.3);
  border-radius: 15px;
  box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
  margin-bottom: clamp(1.75rem, 1.2rem + 2vw, 2.75rem);
  margin-inline:auto !important;
}
.ff-tms .ff-tms__featured-media {
  position: relative;
  min-height: 100%;
  overflow: hidden;
  border-radius: 15px 0 0 15px;
}
.ff-tms .ff-tms__featured-media img {
  width: 100%;
  height: 100%;
  min-height: 360px;
  object-fit: cover;
  border-radius: inherit;
}
.ff-tms .ff-tms__featured-body {
  position: relative;
  padding: clamp(1.75rem, 1.2rem + 2.4vw, 3.5rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: #faf6f1;
}
.ff-tms .ff-tms__qmark { display: block; width: 32px; height: 24px; }
.ff-tms .ff-tms__qmark--featured {
  position: absolute;
  top: clamp(1.5rem, 1rem + 1.6vw, 2.5rem);
  right: clamp(1.5rem, 1rem + 1.6vw, 2.5rem);
}
.ff-tms .ff-tms__rating {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  align-self: flex-start;
  background: rgba(255, 255, 255, 0.4);
  border: 1px solid #d2d2d2;
  border-radius: 40px;
  padding: 0.55rem 1.1rem;
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
}
.ff-tms .ff-tms__rating .ff-stars { font-size: 0.9rem; letter-spacing: 0.06em; }
.ff-tms .ff-tms__rating-text {
  font-family: var(--ff-body);
  font-size: 1rem;
  color: var(--ff-ink);
}
.ff-tms .ff-tms__featured-quote {
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: clamp(1.5rem, 1.1rem + 1.4vw, 1.555rem);
  line-height: 1.32;
  color: var(--ff-ink);
  margin: clamp(1.25rem, 1rem + 1.4vw, 2rem) 0;
  max-width: 50ch;
  padding: 0;
  border: 0;
      font-style: normal;
}
.ff-tms .ff-tms__divider {
  width: 100%;
  max-width: 904px;
  height: 0;
  border: 0;
  border-top: 1px solid rgba(94, 68, 46, 0.3);
  margin: 0 0 clamp(1.25rem, 1rem + 1vw, 1.85rem);
}
.ff-tms .ff-tms__featured-cap { display: flex; flex-direction: column; gap: 0.35rem; }
.ff-tms .ff-tms__featured-cap strong {
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: 1.275rem;
  color: var(--ff-ink);
}
.ff-tms .ff-tms__featured-cap span {
  font-family: var(--ff-body);
  font-size: 0.875rem;
  color: var(--ff-ink);
}

/* ── Customer review cards — speech bubble + avatar below ── */
.ff-tms .ff-tms__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  align-items: start;
}
.ff-tms .ff-tms__item {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}
.ff-tms .ff-tms__bubble {
  position: relative;
  background: #faf6f1;
  border: 1px solid rgba(94, 68, 46, 0.3);
  border-radius: 15px;
  box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
  padding: clamp(1.35rem, 1rem + 1vw, 1.6rem);
  margin-bottom: 1.35rem;
}
/* Speech-bubble tail (bottom-left) */
.ff-tms .ff-tms__bubble::after {
    content: "";
    position: absolute;
    left: 28px;
    bottom: -15px;
    width: 30px;
    height: 30px;
  background: #faf6f1;
  border-right: 1px solid rgba(94, 68, 46, 0.3);
  border-bottom: 1px solid rgba(94, 68, 46, 0.3);
  transform: rotate(45deg);
  border-bottom-right-radius: 4px;
}
.ff-tms .ff-tms__bubble-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}
.ff-tms .ff-tms__bubble-top .ff-stars { font-size: 1rem; letter-spacing: 0.08em; }
.ff-tms .ff-tms__quote {
  font-family: var(--ff-display);
  font-weight: 500;
  font-style: normal;
  font-size: 16px;
  line-height: 1.4;
  color: var(--ff-ink);
  margin: 0;
  padding: 0;
  border: 0;
}
.ff-tms .ff-tms__person {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding-top: 0;
  padding-left: 4rem;

}
.ff-tms .ff-tms__avatar {
  flex: none;
  width: 55px;
  height: 55px;
  border-radius: 80px;
  overflow: hidden;
  background: var(--ff-cream-2);
}
.ff-tms .ff-tms__avatar img { width: 100%; height: 100%; object-fit: cover; }
.ff-tms .ff-tms__meta { display: flex; flex-direction: column; gap: 0.2rem; line-height: 1.2; }
.ff-tms .ff-tms__meta strong {
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: 1.125rem;
  color: var(--ff-ink);
}
.ff-tms .ff-tms__meta em {
  font-style: normal;
  font-family: var(--ff-body);
  font-size: 0.875rem;
  color: var(--ff-ink);
}

/* ── CTA ── */
.ff-tms .ff-tms__cta { text-align: center; margin-top: clamp(1.75rem, 1.2rem + 2vw, 3rem); }
.ff-tms .ff-tms__cta-btn {
  --bg: #5e442e;
  --fg: #ffffff;
  border-color: rgba(255, 255, 255, 0.3);
  font-size: 1rem;
  font-weight: 500;
  padding: 0.85rem 1.55rem;
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
}
.ff-tms .ff-tms__cta-btn:hover { --bg: #4a3826; }

/* ── Responsive ── */
@media (max-width: 1140px) {
 .ff-tms .ff-tms__quote {
    font-size: 16px;
    line-height: 1.4;
}
}
@media (max-width: 980px) {
  .ff-tms .ff-tms__grid {
    grid-template-columns: 1fr 1fr;
    margin-inline: auto;
  }
}
@media (max-width: 860px) {
  .ff-tms .ff-tms__quote {
  font-size: 16px;
  line-height: 1.4;
}
  .ff-tms .ff-tms__featured { grid-template-columns: 1fr; }
  .ff-tms .ff-tms__featured-media {
    border-radius: 15px 15px 0 0;
  }
  .ff-tms .ff-tms__featured-media img { min-height: 260px; }
  .ff-tms .ff-tms__qmark--featured { top: 1.25rem; right: 1.25rem; }
}
@media (max-width: 767px) {
  .ff-tms .ff-tms__grid {
    grid-template-columns: 1fr;
    margin-inline: auto;
  }
}
/* END_SECTION:forge-testimonials */

/* START_SECTION:forge-trust-strip (INDEX:35) */
.ff-trust {
  position: relative;
  overflow: clip;
}

/* Faint sourcing band behind the cards (Figma: ~212px, opacity ~0.2) */
.ff-trust__band {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}
.ff-trust__band-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: bottom;
  opacity: 0.2;
}

.ff-trust__inner {
  position: relative;
  z-index: 1;
}

.ff-trust__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(0.75rem, 0.4rem + 1.2vw, 1.25rem);
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Card — Figma: 415×132, radius 15px, glassy white, brown hairline, soft shadow */
.ff-trust__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
  min-height: 132px;
  padding: 1.25rem 1rem;
  text-align: center;
  border: 1px solid rgba(94, 68, 46, 0.3);
  border-radius: 15px;
background: #F8F3EE;
box-shadow: 2px 2px 9px 0 rgba(150, 150, 150, 0.25);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}

/* Icon — Figma: ~50px terracotta. Pin the image to the box so its aspect
   ratio is always preserved (theme img rules can override height:100%). */
.ff-trust__icon {
  position: relative;
  width: 56px;
  height: 50px;
  flex: none;
}
.ff-trust__icon img,
.ff-trust__icon svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Label — Figma: Josefin Sans Medium 22px, black */
.ff-trust__label {
  font-family: var(--ff-display);
  font-weight: 500;
  /* font-size: clamp(1.05rem, 0.95rem + 0.45vw, 1.375rem); */
  font-size: clamp(1.05rem, 0.95rem + 0.45vw, 1.25rem);
  line-height: 1.2;
  letter-spacing: -0.005em;
  color: var(--ff-ink);
  margin: 0;
  text-wrap: balance;
}

/* Responsive: 2-up on tablet, single column on phone */
@media (max-width: 860px) {
  .ff-trust__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
  .ff-trust__grid { grid-template-columns: 1fr; }
  .ff-trust__item {
    flex-direction: row;
    gap: 0.85rem;
    justify-content: flex-start;
    text-align: left;
    min-height: 0;
  }
}
/* END_SECTION:forge-trust-strip */