/** Shopify CDN: Minification failed

Line 3857:24 Unexpected "{"
Line 3857:33 Expected ":"
Line 3858:20 Unexpected "{"
Line 3858:29 Expected ":"
Line 3859:20 Unexpected "{"
Line 3859:29 Expected ":"
Line 3860:20 Unexpected "{"
Line 3860:29 Expected ":"

**/
/* SHOPIFY_STYLESHEETS_VERSION: 1.0 */


/* CSS from section stylesheet tags */
/* START_SECTION:asset1 (INDEX:1) */
/* ============================================================
     HBTO Product Buy Box — scoped styles
     ============================================================ */

  .hbto-section *,
  .hbto-section *::before,
  .hbto-section *::after {
    box-sizing: border-box;
  }
  .hbto-section {
    font-family: var(--hbto-sans);
    color: var(--hbto-ink);
    background: var(--hbto-bg-cream);
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    position: relative;
  }
  .hbto-section a { color: inherit; text-decoration: none; }
  .hbto-section img { max-width: 100%; display: block; }
  .hbto-section button { font-family: inherit; cursor: pointer; border: none; background: none; }

  .hbto-wrap {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
    position: relative;
  }

  /* ----- Product Grid ----- */
  .hbto-product { padding: 48px 0 80px; }
  .hbto-product-grid {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 64px;
    align-items: start;
  }
  @media (max-width: 980px) {
    .hbto-product-grid { grid-template-columns: 1fr; gap: 32px; }
  }

  /* ----- Gallery (JS-driven sticky on desktop) ----- */
  .hbto-gallery {
    align-self: start;
    will-change: transform;
  }
  .hbto-gallery-main {
    background: var(--hbto-paper);
    border-radius: var(--hbto-radius-lg);
    aspect-ratio: 1 / 1;
    width: 100%;
    overflow: hidden;
    position: relative;
    border: 1px solid var(--hbto-line);
  }
  .hbto-gallery-main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity 0.3s;
  }
  .hbto-img-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--hbto-paper);
    color: var(--hbto-line);
  }
  .hbto-img-placeholder svg { width: 70%; height: 70%; opacity: 0.4; }
  .hbto-gallery-badge {
    position: absolute;
    top: 20px;
    left: 20px;
    background: var(--hbto-coral);
    color: var(--hbto-paper);
    padding: 8px 14px;
    border-radius: 100px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    z-index: 2;
  }
  .hbto-gallery-badge::before { content: '★ '; }
  .hbto-gallery-thumbs {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 10px;
    margin-top: 12px;
  }
  .hbto-thumb {
    aspect-ratio: 1;
    border-radius: var(--hbto-radius);
    overflow: hidden;
    border: 2px solid transparent;
    background: var(--hbto-paper);
    cursor: pointer;
    padding: 0;
    transition: border-color 0.2s, transform 0.2s;
  }
  .hbto-thumb img { width: 100%; height: 100%; object-fit: cover; }
  .hbto-thumb:hover { transform: translateY(-2px); }
  .hbto-thumb.hbto-active { border-color: var(--hbto-bg-deep); }
  @media (max-width: 980px) {
    .hbto-gallery {
      transform: none !important;
    }
  }

  /* ----- Buy Box ----- */
  .hbto-buy-box { padding-top: 8px; }
  .hbto-eyebrow {
    font-size: 11px;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--hbto-coral);
    font-weight: 600;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .hbto-eyebrow::before {
    content: '';
    width: 24px;
    height: 1px;
    background: var(--hbto-coral);
  }
  .hbto-product-title {
    font-family: var(--hbto-display);
    font-weight: 500;
    font-size: clamp(36px, 5vw, 52px);
    line-height: 0.98;
    letter-spacing: -0.02em;
    color: var(--hbto-bg-deep);
    margin: 0 0 18px;
  }
  .hbto-product-title em,
  .hbto-product-title i {
    font-style: italic;
    font-weight: 400;
    color: var(--hbto-coral);
  }
  .hbto-rating-row {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 22px;
    flex-wrap: wrap;
  }
  .hbto-stars { color: var(--hbto-gold); letter-spacing: 2px; font-size: 16px; }
  .hbto-review-count {
    font-size: 14px;
    color: var(--hbto-ink-soft);
    border-left: 1px solid var(--hbto-line);
    padding-left: 14px;
  }
  .hbto-review-count b { color: var(--hbto-bg-deep); font-weight: 600; }

  .hbto-lede {
    font-family: var(--hbto-display);
    font-weight: 300;
    font-size: 19px;
    line-height: 1.45;
    color: var(--hbto-ink-soft);
    margin-bottom: 26px;
    max-width: 90%;
  }
  .hbto-lede p { margin: 0; }
  .hbto-lede em,
  .hbto-lede i { font-style: italic; color: var(--hbto-bg-deep); }

  .hbto-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 32px;
  }
  .hbto-chip {
    background: var(--hbto-paper);
    border: 1px solid var(--hbto-line);
    color: var(--hbto-bg-deep);
    padding: 7px 13px;
    border-radius: 100px;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.02em;
  }
  .hbto-chip::before {
    content: '✓ ';
    color: var(--hbto-coral);
    font-weight: 700;
  }

  /* ----- Bundles ----- */
  .hbto-bundle-label {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 14px;
  }
  .hbto-bundle-label .hbto-l {
    font-size: 13px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--hbto-bg-deep);
    font-weight: 600;
  }
  .hbto-bundle-label .hbto-r {
    font-size: 12px;
    color: var(--hbto-ink-mute);
    font-style: italic;
    font-family: var(--hbto-display);
  }
  .hbto-bundles {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
    margin-bottom: 18px;
  }
  .hbto-bundle {
    border: 1.5px solid var(--hbto-line);
    background: var(--hbto-paper);
    border-radius: var(--hbto-radius);
    padding: 16px 14px 14px;
    position: relative;
    cursor: pointer;
    transition: all 0.2s;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .hbto-bundle:hover {
    border-color: var(--hbto-bg-deep);
    transform: translateY(-2px);
  }
  .hbto-bundle.hbto-active {
    border-color: var(--hbto-coral);
    background: var(--hbto-coral-soft);
    box-shadow: 0 0 0 4px rgba(219, 90, 60, 0.12);
  }
  .hbto-qty-display {
    font-family: var(--hbto-display);
    font-weight: 500;
    font-size: 22px;
    color: var(--hbto-bg-deep);
    line-height: 1;
  }
  .hbto-qty-display span {
    font-size: 13px;
    color: var(--hbto-ink-soft);
    font-family: var(--hbto-sans);
    margin-left: 4px;
    font-weight: 400;
  }
  .hbto-bundle .hbto-price-row {
    margin-top: auto;
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding-top: 8px;
  }
  .hbto-bundle .hbto-price {
    font-size: 16px;
    font-weight: 700;
    color: var(--hbto-bg-deep);
  }
  .hbto-bundle .hbto-price-was {
    font-size: 12px;
    color: var(--hbto-ink-mute);
    text-decoration: line-through;
  }
  .hbto-bundle .hbto-save {
    font-size: 11px;
    color: var(--hbto-coral);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    margin-top: 2px;
    min-height: 14px;
  }
  .hbto-bundle .hbto-ribbon {
    position: absolute;
    top: -10px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--hbto-bg-deep);
    color: var(--hbto-paper);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 100px;
    white-space: nowrap;
  }
  .hbto-bundle.hbto-active .hbto-ribbon { background: var(--hbto-coral); }

  /* ----- Subscribe & Save ----- */
  .hbto-sub-toggle {
    background: var(--hbto-paper);
    border: 1px solid var(--hbto-line);
    border-radius: var(--hbto-radius);
    overflow: hidden;
    margin-bottom: 22px;
  }
  .hbto-sub-opt {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    cursor: pointer;
    border-bottom: 1px solid var(--hbto-line-soft);
    transition: background 0.15s;
  }
  .hbto-sub-opt:last-child { border-bottom: none; }
  .hbto-sub-opt:hover { background: rgba(200, 214, 203, 0.2); }
  .hbto-sub-opt input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    border: 1.5px solid var(--hbto-line);
    border-radius: 50%;
    margin: 2px 0 0;
    position: relative;
    flex-shrink: 0;
    cursor: pointer;
  }
  .hbto-sub-opt input[type="radio"]:checked {
    border-color: var(--hbto-coral);
    background: var(--hbto-coral);
    box-shadow: inset 0 0 0 3px var(--hbto-paper);
  }
  /* Static (non-interactive) variant — used when this card displays
     "why buy from us" info instead of subscribe/onetime radios. */
  .hbto-info-card .hbto-sub-opt.hbto-static,
  .hbto-sub-opt.hbto-static {
    cursor: default !important;
    pointer-events: none;
  }
  .hbto-info-card .hbto-sub-opt.hbto-static:hover {
    background: transparent !important;
  }
  .hbto-static-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    margin: 0;
    flex-shrink: 0;
    background: var(--hbto-sage, #C8D6CB);
    color: var(--hbto-bg-deep, #0D2A3A);
    border-radius: 50%;
  }
  .hbto-sub-opt .hbto-body { flex: 1; }
  .hbto-sub-opt .hbto-t1 {
    font-size: 14px;
    font-weight: 600;
    color: var(--hbto-bg-deep);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
  }
  .hbto-sub-opt .hbto-pill {
    background: var(--hbto-sage);
    color: var(--hbto-bg-deep);
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 100px;
    font-weight: 700;
  }
  .hbto-sub-opt .hbto-t2 {
    font-size: 12px;
    color: var(--hbto-ink-soft);
    margin-top: 2px;
  }

  /* ----- ATC ----- */
  .hbto-product-form { margin: 0; }
  .hbto-atc-row {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
    /* Android Chrome fix: prevent vertical misalignment */
    align-items: stretch;
    width: 100%;
  }
  .hbto-qty-stepper {
    display: flex;
    align-items: center;
    border: 1.5px solid var(--hbto-bg-deep);
    border-radius: var(--hbto-radius);
    overflow: hidden;
    background: var(--hbto-paper);
    /* Android Chrome fix: prevent shrinking weirdly */
    flex-shrink: 0;
    box-sizing: border-box;
  }
  .hbto-qty-stepper button {
    width: 44px;
    height: 56px;
    font-size: 18px;
    color: var(--hbto-bg-deep);
    transition: background 0.15s;
    /* Android Chrome button reset */
    -webkit-appearance: none;
    appearance: none;
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    font-family: inherit;
  }
  .hbto-qty-stepper button:hover { background: var(--hbto-sage); }
  .hbto-q-val {
    min-width: 36px;
    text-align: center;
    font-weight: 600;
    color: var(--hbto-bg-deep);
    font-size: 15px;
    /* Vertical center on Android */
    display: flex;
    align-items: center;
    justify-content: center;
    height: 56px;
  }
  .hbto-atc {
    flex: 1 1 auto;
    background: var(--hbto-coral);
    color: var(--hbto-paper);
    height: 56px;
    min-height: 56px;
    border-radius: var(--hbto-radius);
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    box-shadow: var(--hbto-shadow-btn);
    transition: all 0.18s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    /* Android Chrome defensive resets */
    -webkit-appearance: none;
    appearance: none;
    border: none;
    padding: 0 16px;
    margin: 0;
    cursor: pointer;
    line-height: 1;
    font-family: inherit;
    box-sizing: border-box;
    width: auto;
    min-width: 0;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
  }
  .hbto-atc:hover {
    background: var(--hbto-coral-deep);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px -6px rgba(219,90,60,0.7);
  }
  .hbto-atc:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
  }
  .hbto-atc .hbto-total {
    background: rgba(0,0,0,0.18);
    padding: 6px 10px;
    border-radius: 6px;
    font-size: 13px;
    flex-shrink: 0;
    line-height: 1;
    display: inline-flex;
    align-items: center;
  }
  .hbto-atc.hbto-added {
    background: #2BAA5E;
  }

  /* Native Shopify Shop Pay + custom Checkout button row */
  .hbto-express-wrap {
    margin-top: 12px;
    margin-bottom: 18px;
    width: 100%;
  }
  .hbto-express-row {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    width: 100%;
    flex-wrap: wrap;
  }
  .hbto-express-row .shopify-payment-button {
    flex: 0 0 auto;
  }
  .hbto-express-row .shopify-payment-button__button {
    height: 54px;
    min-width: 200px;
    border-radius: var(--hbto-radius);
  }
  .hbto-express-row .shopify-payment-button__more-options {
    display: block;
    margin-top: 6px;
    text-align: left;
    font-size: 11px;
    color: var(--hbto-ink-soft);
    text-decoration: underline;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
  }
  .hbto-checkout-btn {
    flex: 1;
    min-height: 54px;
    height: 54px;
    background: var(--hbto-express-bg, #0D2A3A);
    color: var(--hbto-express-text, #FBF7EE);
    border: none;
    border-radius: var(--hbto-radius);
    font-family: var(--hbto-sans);
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    cursor: pointer;
    transition: opacity 0.15s ease, transform 0.15s ease;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
  }
  .hbto-checkout-btn:hover {
    opacity: 0.92;
    transform: translateY(-1px);
  }
  .hbto-checkout-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
  }
  @media (max-width: 480px) {
    .hbto-express-row .shopify-payment-button,
    .hbto-checkout-btn {
      flex: 1 1 100%;
      min-width: 0;
    }
    /* Ribbon fix: keep pill inside card width on small screens */
    .hbto-bundle .hbto-ribbon {
      max-width: calc(100% - 12px);
      font-size: 7px;
      letter-spacing: 0.06em;
      padding: 3px 7px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    /* Stack price + was-price so they don't overlap */
    .hbto-bundle .hbto-price-row {
      flex-direction: column;
      align-items: flex-start;
      gap: 2px;
    }
    .hbto-bundle .hbto-price {
      font-size: 17px;
      line-height: 1.1;
    }
    .hbto-bundle .hbto-price-was {
      font-size: 11px;
      line-height: 1;
    }
    /* ATC row: tighten on narrow phones (esp. Android Chrome) */
    .hbto-atc-row {
      gap: 6px;
    }
    .hbto-qty-stepper {
      flex-shrink: 0;
      max-width: 130px;
    }
    .hbto-qty-stepper button {
      width: 34px;
      height: 50px;
      font-size: 16px;
    }
    .hbto-q-val {
      min-width: 24px;
      height: 50px;
      font-size: 14px;
    }
    .hbto-atc {
      flex: 1 1 0;
      min-width: 0;
      height: 50px;
      min-height: 50px;
      font-size: 11px;
      letter-spacing: 0.08em;
      gap: 6px;
      padding: 0 10px;
      white-space: nowrap;
    }
    .hbto-atc .hbto-total {
      font-size: 11px;
      padding: 4px 6px;
      letter-spacing: 0.02em;
    }
  }

  /* Extra-narrow phones (under 360px wide) */
  @media (max-width: 360px) {
    .hbto-atc-row { gap: 5px; }
    .hbto-qty-stepper { max-width: 110px; }
    .hbto-qty-stepper button { width: 30px; height: 48px; }
    .hbto-q-val { min-width: 20px; height: 48px; font-size: 13px; }
    .hbto-atc {
      height: 48px;
      min-height: 48px;
      font-size: 10px;
      letter-spacing: 0.06em;
      padding: 0 8px;
      gap: 5px;
    }
    .hbto-atc .hbto-total { font-size: 10px; padding: 3px 5px; }
  }

  /* Tablet/mid breakpoint ribbon tighten */
  @media (max-width: 760px) {
    .hbto-bundle .hbto-ribbon {
      max-width: calc(100% - 12px);
      font-size: 8px;
      letter-spacing: 0.08em;
      padding: 4px 9px;
    }
  }

  /* ----- Trust badges ----- */
  .hbto-trust-mini {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-bottom: 18px;
  }
  .hbto-trust-mini > div {
    background: var(--hbto-paper);
    border: 1px solid var(--hbto-line);
    padding: 12px 10px;
    border-radius: var(--hbto-radius);
    text-align: center;
    font-size: 11px;
    line-height: 1.3;
    color: var(--hbto-bg-deep);
    font-weight: 500;
  }
  .hbto-trust-mini .hbto-ic {
    font-size: 20px;
    display: block;
    margin-bottom: 4px;
  }

  /* ----- Ship row ----- */
  .hbto-ship-row {
    display: flex;
    flex-direction: column;
    gap: 8px;
    background: var(--hbto-paper);
    border: 1px solid var(--hbto-line);
    border-radius: var(--hbto-radius);
    padding: 14px 16px;
  }
  .hbto-ship-row .hbto-line {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: var(--hbto-bg-deep);
  }
  .hbto-ship-row .hbto-ic {
    width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--hbto-coral);
    font-size: 14px;
    flex-shrink: 0;
  }
  .hbto-stock-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    background: #2BAA5E;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(43, 170, 94, 0.18);
    animation: hbto-pulse 2s infinite;
  }
  @keyframes hbto-pulse {
    0%, 100% { box-shadow: 0 0 0 4px rgba(43, 170, 94, 0.18); }
    50%      { box-shadow: 0 0 0 7px rgba(43, 170, 94, 0.08); }
  }

  /* ============================================================
     Defensive overrides - fights theme CSS that wants to
     squish, color, or reposition our buttons and layout.
     ============================================================ */
  .hbto-section .hbto-buy-box {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    float: none !important;
    clear: both !important;
    position: relative !important;
  }
  .hbto-section .hbto-buy-box > * {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .hbto-section .hbto-atc-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    gap: 10px !important;
    margin-bottom: 14px !important;
  }
  .hbto-section .hbto-bundles {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr !important;
    gap: 10px !important;
  }
  .hbto-section .hbto-trust-mini {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
    width: 100% !important;
    float: none !important;
    clear: both !important;
    position: relative !important;
    margin-bottom: 18px !important;
  }
  .hbto-section .hbto-ship-row {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    float: none !important;
    clear: both !important;
    position: relative !important;
  }
  .hbto-section .hbto-atc,
  .hbto-section button.hbto-atc {
    background: var(--hbto-atc-bg) !important;
    background-color: var(--hbto-atc-bg) !important;
    background-image: none !important;
    color: var(--hbto-atc-text) !important;
    opacity: 1 !important;
    border: none !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-transform: uppercase !important;
    box-shadow: 0 6px 16px -6px rgba(0,0,0,0.3) !important;
    font-weight: 700 !important;
    text-shadow: none !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
  .hbto-section .hbto-atc:hover {
    filter: brightness(0.92) !important;
    transform: translateY(-2px) !important;
  }
  .hbto-section .hbto-atc.hbto-added,
  .hbto-section button.hbto-atc.hbto-added {
    background: #2BAA5E !important;
    background-color: #2BAA5E !important;
  }
  .hbto-section .hbto-express,
  .hbto-section button.hbto-express {
    background: var(--hbto-express-bg) !important;
    background-color: var(--hbto-express-bg) !important;
    background-image: none !important;
    color: var(--hbto-express-text) !important;
    opacity: 1 !important;
    border: none !important;
    cursor: pointer !important;
    display: block !important;
    width: 100% !important;
    text-transform: uppercase !important;
    box-shadow: none !important;
    text-shadow: none !important;
    font-weight: 600 !important;
  }
  .hbto-section .hbto-express:hover {
    filter: brightness(1.15) !important;
  }
  .hbto-section .hbto-qty-stepper {
    flex: 0 0 auto !important;
  }
/* END_SECTION:asset1 */

/* START_SECTION:asset2 (INDEX:6) */
.hbto-social *,
  .hbto-social *::before,
  .hbto-social *::after { box-sizing: border-box; }
  .hbto-social {
    font-family: var(--hbto-sans);
    color: var(--hbto-ink);
    -webkit-font-smoothing: antialiased;
  }

  .hbto-wrap {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
  }

  /* ====== Marquee ====== */
  .hbto-strip {
    background: var(--hbto-marquee-bg);
    color: var(--hbto-marquee-text);
    padding: 22px 0;
    overflow: hidden;
    position: relative;
  }
  .hbto-strip-track {
    display: flex;
    gap: 60px;
    width: max-content;
    animation: hbto-marquee var(--hbto-marquee-speed) linear infinite;
    white-space: nowrap;
  }
  .hbto-strip-track:hover { animation-play-state: paused; }
  .hbto-strip .hbto-quote {
    font-family: var(--hbto-display);
    font-style: italic;
    font-weight: 300;
    font-size: 17px;
    letter-spacing: 0.02em;
    display: inline-flex;
    align-items: center;
    gap: 60px;
    flex-shrink: 0;
  }
  .hbto-strip .hbto-quote::after {
    content: '✺';
    color: var(--hbto-marquee-accent);
    font-style: normal;
    font-size: 16px;
  }
  @keyframes hbto-marquee {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
  }

  /* ====== Seen On ====== */
  .hbto-seen {
    padding: 48px 0;
    background: var(--hbto-bg-cream);
    border-top: 1px solid var(--hbto-line-soft);
    border-bottom: 1px solid var(--hbto-line-soft);
  }
  .hbto-seen-grid {
    display: grid;
    grid-template-columns: auto repeat(var(--hbto-seen-cols, 5), 1fr);
    align-items: center;
    gap: 32px;
  }
  .hbto-seen-label {
    font-family: var(--hbto-display);
    font-style: italic;
    font-size: 18px;
    color: var(--hbto-bg-deep);
    line-height: 1.2;
    padding-right: 12px;
    border-right: 1px solid var(--hbto-line);
  }
  .hbto-seen-label b {
    display: block;
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--hbto-ink-mute);
    margin-bottom: 8px;
    font-family: var(--hbto-sans);
  }
  .hbto-seen-item {
    text-align: center;
    font-family: var(--hbto-display);
    font-weight: 500;
    font-size: 17px;
    letter-spacing: -0.01em;
    color: var(--hbto-bg-deep);
    opacity: 0.7;
    transition: opacity 0.2s;
  }
  .hbto-seen-item:hover { opacity: 1; }
  .hbto-seen-item em {
    font-style: italic;
    font-weight: 300;
    margin-left: 4px;
  }

  @media (max-width: 880px) {
    .hbto-seen-grid {
      grid-template-columns: 1fr 1fr;
      gap: 18px;
    }
    .hbto-seen-label {
      grid-column: 1 / -1;
      border-right: none;
      border-bottom: 1px solid var(--hbto-line);
      padding-bottom: 14px;
      padding-right: 0;
      text-align: center;
    }
    .hbto-strip .hbto-quote {
      font-size: 15px;
      gap: 40px;
    }
    .hbto-strip-track { gap: 40px; }
  }

  /* Respect reduced motion preferences */
  @media (prefers-reduced-motion: reduce) {
    .hbto-strip-track {
      animation: none;
    }
  }
/* END_SECTION:asset2 */

/* START_SECTION:asset3 (INDEX:7) */
.hbto-why *,
  .hbto-why *::before,
  .hbto-why *::after { box-sizing: border-box; }

  .hbto-why {
    font-family: var(--hbto-display);
    color: var(--hbto-ink);
    background: var(--hbto-bg-cream);
    padding: var(--hbto-pad-y) 0;
    -webkit-font-smoothing: antialiased;
  }

  .hbto-why .hbto-wrap {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
  }

  /* ----- Eyebrow ----- */
  .hbto-why .hbto-eyebrow {
    text-align: center;
    font-family: var(--hbto-sans);
    font-size: 13px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--hbto-coral);
    font-weight: 700;
    margin: 0 0 18px;
  }
  .hbto-why .hbto-eyebrow::before,
  .hbto-why .hbto-eyebrow::after {
    content: '—';
    color: var(--hbto-coral);
    margin: 0 12px;
    font-weight: 400;
  }

  /* ----- Title ----- */
  .hbto-why .hbto-title {
    font-family: var(--hbto-display);
    font-weight: 500;
    font-size: clamp(34px, 5.2vw, 60px);
    line-height: 1.05;
    text-align: center;
    color: var(--hbto-bg-deep);
    letter-spacing: -0.015em;
    margin: 0 0 16px;
  }
  .hbto-why .hbto-title em,
  .hbto-why .hbto-title i {
    font-style: italic;
    color: var(--hbto-coral);
    font-weight: 400;
  }
  .hbto-why .hbto-title p { margin: 0; }

  /* ----- Subtitle ----- */
  .hbto-why .hbto-subtitle {
    text-align: center;
    max-width: 620px;
    margin: 0 auto 56px;
    font-size: 16px;
    color: var(--hbto-ink-soft);
    line-height: 1.65;
  }
  .hbto-why .hbto-subtitle p { margin: 0; }
  .hbto-why .hbto-subtitle em,
  .hbto-why .hbto-subtitle i {
    font-style: italic;
    color: var(--hbto-bg-deep);
  }

  /* ----- Cards Grid ----- */
  .hbto-why .hbto-cards {
    display: grid;
    grid-template-columns: repeat(var(--hbto-card-cols, 4), 1fr);
    gap: 16px;
  }

  /* ----- Card ----- */
  .hbto-why .hbto-card {
    background: var(--hbto-paper);
    border: 1px solid var(--hbto-line);
    border-radius: var(--hbto-radius-lg);
    padding: 32px 26px;
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s;
    position: relative;
  }
  .hbto-why .hbto-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--hbto-shadow-card);
  }

  .hbto-why .hbto-num {
    font-family: var(--hbto-display);
    font-weight: 400;
    font-style: italic;
    font-size: 44px;
    color: var(--hbto-coral);
    line-height: 1;
    margin-bottom: 24px;
  }

  .hbto-why .hbto-card-title {
    font-family: var(--hbto-display);
    font-weight: 600;
    font-size: 22px;
    color: var(--hbto-bg-deep);
    line-height: 1.2;
    margin: 0 0 10px;
    letter-spacing: -0.005em;
  }

  .hbto-why .hbto-card-body {
    font-family: var(--hbto-display);
    font-weight: 400;
    font-size: 15px;
    color: var(--hbto-ink-soft);
    line-height: 1.6;
  }
  .hbto-why .hbto-card-body p { margin: 0 0 0.6em; }
  .hbto-why .hbto-card-body p:last-child { margin-bottom: 0; }

  /* ----- Responsive ----- */
  @media (max-width: 980px) {
    .hbto-why .hbto-cards {
      grid-template-columns: repeat(2, 1fr) !important;
    }
  }
  @media (max-width: 540px) {
    .hbto-why .hbto-cards {
      grid-template-columns: 1fr !important;
    }
    .hbto-why { padding: 70px 0; }
    .hbto-why .hbto-card { padding: 28px 22px; }
    .hbto-why .hbto-num { font-size: 36px; margin-bottom: 18px; }
  }
/* END_SECTION:asset3 */

/* START_SECTION:asset4 (INDEX:8) */
.hbto-ing *,
  .hbto-ing *::before,
  .hbto-ing *::after { box-sizing: border-box; }

  .hbto-ing {
    font-family: var(--hbto-display);
    color: var(--hbto-paper);
    background: var(--hbto-bg-deep);
    padding: var(--hbto-pad-y) 0;
    position: relative;
    overflow: hidden;
    -webkit-font-smoothing: antialiased;
  }

  /* Atmospheric radial gradient layer */
  .hbto-ing .hbto-ing-atmosphere {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image:
      radial-gradient(circle at 15% 20%, rgba(200, 214, 203, 0.08), transparent 40%),
      radial-gradient(circle at 85% 75%, rgba(219, 90, 60, 0.07), transparent 45%);
    z-index: 0;
  }

  .hbto-ing .hbto-wrap {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
    position: relative;
    z-index: 1;
  }

  /* ----- Eyebrow ----- */
  .hbto-ing .hbto-eyebrow {
    text-align: center;
    font-family: var(--hbto-sans);
    font-size: 13px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--hbto-sage);
    font-weight: 700;
    margin: 0 0 18px;
  }
  .hbto-ing .hbto-eyebrow::before,
  .hbto-ing .hbto-eyebrow::after {
    content: '—';
    color: var(--hbto-sage);
    margin: 0 12px;
    font-weight: 400;
  }

  /* ----- Title ----- */
  .hbto-ing .hbto-title {
    font-family: var(--hbto-display);
    font-weight: 500;
    font-size: clamp(34px, 5.2vw, 60px);
    line-height: 1.05;
    text-align: center;
    color: var(--hbto-paper);
    letter-spacing: -0.015em;
    margin: 0 0 16px;
  }
  .hbto-ing .hbto-title em,
  .hbto-ing .hbto-title i {
    font-style: italic;
    color: var(--hbto-coral);
    font-weight: 400;
  }
  .hbto-ing .hbto-title p { margin: 0; }

  /* ----- Subtitle ----- */
  .hbto-ing .hbto-subtitle {
    text-align: center;
    max-width: 620px;
    margin: 0 auto 56px;
    font-size: 16px;
    color: rgba(251, 247, 238, 0.7);
    line-height: 1.65;
  }
  .hbto-ing .hbto-subtitle p { margin: 0; }

  /* ----- Grid ----- */
  .hbto-ing .hbto-ing-grid {
    display: grid;
    grid-template-columns: repeat(var(--hbto-ing-cols, 2), 1fr);
    gap: 22px;
    margin-top: 0;
  }

  /* ----- Card ----- */
  .hbto-ing .hbto-ing-card {
    background: rgba(251, 247, 238, 0.04);
    border: 1px solid rgba(251, 247, 238, 0.1);
    border-radius: var(--hbto-radius-lg);
    padding: 36px;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 26px;
    align-items: start;
    transition: background 0.28s, transform 0.28s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .hbto-ing .hbto-ing-card:hover {
    background: rgba(251, 247, 238, 0.07);
    transform: translateY(-3px);
  }

  /* ----- Circle Mark ----- */
  .hbto-ing .hbto-mark {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--hbto-display);
    font-style: italic;
    font-size: 30px;
    font-weight: 500;
    flex-shrink: 0;
    line-height: 1;
  }

  /* ----- Content ----- */
  .hbto-ing .hbto-name {
    font-family: var(--hbto-display);
    font-weight: 600;
    font-size: 24px;
    margin: 0 0 4px;
    letter-spacing: -0.005em;
    color: var(--hbto-paper);
    line-height: 1.2;
  }
  .hbto-ing .hbto-latin {
    font-style: italic;
    font-family: var(--hbto-display);
    font-weight: 400;
    font-size: 14px;
    color: var(--hbto-sage);
    margin: 0 0 14px;
  }
  .hbto-ing .hbto-desc {
    font-family: var(--hbto-display);
    font-size: 15px;
    color: rgba(251, 247, 238, 0.75);
    line-height: 1.65;
  }
  .hbto-ing .hbto-desc p { margin: 0 0 0.6em; }
  .hbto-ing .hbto-desc p:last-child { margin-bottom: 0; }

  /* ----- Responsive ----- */
  @media (max-width: 880px) {
    .hbto-ing .hbto-ing-grid {
      grid-template-columns: 1fr !important;
    }
    .hbto-ing { padding: 70px 0; }
    .hbto-ing .hbto-ing-card { padding: 28px; gap: 20px; }
    .hbto-ing .hbto-mark { width: 60px; height: 60px; font-size: 26px; }
  }
  @media (max-width: 500px) {
    .hbto-ing .hbto-ing-card {
      grid-template-columns: 1fr;
      text-align: center;
      gap: 16px;
      padding: 26px 22px;
    }
    .hbto-ing .hbto-mark {
      margin: 0 auto;
    }
  }
/* END_SECTION:asset4 */

/* START_SECTION:asset5 (INDEX:9) */
.hbto-ba *,
  .hbto-ba *::before,
  .hbto-ba *::after { box-sizing: border-box; }

  .hbto-ba {
    font-family: var(--hbto-display);
    color: var(--hbto-ink);
    background: var(--hbto-bg-cream);
    padding: var(--hbto-pad-y) 0;
    -webkit-font-smoothing: antialiased;
  }

  .hbto-ba .hbto-wrap {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
  }

  /* ----- Eyebrow ----- */
  .hbto-ba .hbto-eyebrow {
    text-align: center;
    font-family: var(--hbto-sans);
    font-size: 13px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--hbto-coral);
    font-weight: 700;
    margin: 0 0 18px;
  }
  .hbto-ba .hbto-eyebrow::before,
  .hbto-ba .hbto-eyebrow::after {
    content: '—';
    color: var(--hbto-coral);
    margin: 0 12px;
    font-weight: 400;
  }

  /* ----- Title ----- */
  .hbto-ba .hbto-title {
    font-family: var(--hbto-display);
    font-weight: 500;
    font-size: clamp(34px, 5.2vw, 60px);
    line-height: 1.05;
    text-align: center;
    color: var(--hbto-bg-deep);
    letter-spacing: -0.015em;
    margin: 0 0 16px;
  }
  .hbto-ba .hbto-title em,
  .hbto-ba .hbto-title i {
    font-style: italic;
    color: var(--hbto-coral);
    font-weight: 400;
  }
  .hbto-ba .hbto-title p { margin: 0; }

  /* ----- Subtitle ----- */
  .hbto-ba .hbto-subtitle {
    text-align: center;
    max-width: 620px;
    margin: 0 auto 48px;
    font-size: 16px;
    color: var(--hbto-ink-soft);
    line-height: 1.65;
  }
  .hbto-ba .hbto-subtitle p { margin: 0; }

  /* ----- Grid ----- */
  .hbto-ba .hbto-ba-grid {
    display: grid;
    grid-template-columns: repeat(var(--hbto-ba-cols, 2), 1fr);
    gap: 18px;
  }

  /* ----- Card ----- */
  .hbto-ba .hbto-ba-card {
    background: var(--hbto-paper);
    border-radius: var(--hbto-radius-lg);
    overflow: hidden;
    border: 1px solid var(--hbto-line);
    position: relative;
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s;
  }
  .hbto-ba .hbto-ba-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px -14px rgba(13, 42, 58, 0.22);
  }

  /* ----- Media ----- */
  .hbto-ba .hbto-ba-media {
    position: relative;
    overflow: hidden;
    aspect-ratio: var(--hbto-aspect, 5 / 3);
    background: var(--hbto-bg-cream);
  }
  .hbto-ba .hbto-ba-media img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .hbto-ba .hbto-ba-card:hover .hbto-ba-media img {
    transform: scale(1.03);
  }
  .hbto-ba .hbto-ba-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--hbto-bg-cream);
    opacity: 0.35;
  }
  .hbto-ba .hbto-ba-placeholder svg {
    width: 60%;
    height: 60%;
  }

  /* ----- Tag ----- */
  .hbto-ba .hbto-ba-tag {
    position: absolute;
    top: 16px;
    left: 16px;
    background: rgba(13, 42, 58, 0.92);
    color: var(--hbto-paper);
    padding: 7px 14px;
    border-radius: 100px;
    font-family: var(--hbto-sans);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 2;
  }

  /* ----- Caption ----- */
  .hbto-ba .hbto-ba-caption {
    padding: 22px 26px 26px;
    font-family: var(--hbto-display);
    font-style: italic;
    font-weight: 400;
    font-size: 16px;
    color: var(--hbto-ink-soft);
    line-height: 1.5;
  }
  .hbto-ba .hbto-ba-caption b {
    font-style: normal;
    font-weight: 700;
    color: var(--hbto-bg-deep);
    display: block;
    font-size: 13px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 6px;
    font-family: var(--hbto-sans);
  }
  .hbto-ba .hbto-ba-caption p { margin: 0; display: inline; }

  /* ----- Responsive ----- */
  @media (max-width: 880px) {
    .hbto-ba .hbto-ba-grid {
      grid-template-columns: 1fr !important;
    }
    .hbto-ba { padding: 70px 0; }
    .hbto-ba .hbto-ba-caption { padding: 20px 22px 22px; font-size: 15px; }
  }
/* END_SECTION:asset5 */

/* START_SECTION:asset6 (INDEX:10) */
.hbto-how *,
  .hbto-how *::before,
  .hbto-how *::after { box-sizing: border-box; }

  .hbto-how {
    font-family: var(--hbto-display);
    color: var(--hbto-ink);
    background: var(--hbto-bg-sage);
    padding: var(--hbto-pad-y) 0;
    position: relative;
    -webkit-font-smoothing: antialiased;
  }

  .hbto-how .hbto-wrap {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
    position: relative;
  }

  /* ----- Eyebrow ----- */
  .hbto-how .hbto-eyebrow {
    text-align: center;
    font-family: var(--hbto-sans);
    font-size: 13px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--hbto-coral);
    font-weight: 700;
    margin: 0 0 18px;
  }

  /* ----- Title ----- */
  .hbto-how .hbto-title {
    font-family: var(--hbto-display);
    font-weight: 500;
    font-size: clamp(34px, 5.2vw, 60px);
    line-height: 1.05;
    text-align: center;
    color: var(--hbto-bg-deep);
    letter-spacing: -0.015em;
    margin: 0 0 16px;
  }
  .hbto-how .hbto-title em,
  .hbto-how .hbto-title i {
    font-style: italic;
    color: var(--hbto-coral);
    font-weight: 400;
  }
  .hbto-how .hbto-title p { margin: 0; }

  /* ----- Subtitle ----- */
  .hbto-how .hbto-subtitle {
    text-align: center;
    max-width: 620px;
    margin: 0 auto 76px;
    font-size: 16px;
    color: var(--hbto-ink-soft);
    line-height: 1.65;
  }
  .hbto-how .hbto-subtitle p { margin: 0; }

  /* ----- Steps Grid ----- */
  .hbto-how .hbto-steps {
    display: grid;
    grid-template-columns: repeat(var(--hbto-step-cols, 3), 1fr);
    gap: 22px;
    position: relative;
  }

  /* Decorative dashed connector behind the circles */
  .hbto-how .hbto-has-connector::before {
    content: '';
    position: absolute;
    top: 0;
    left: 12%;
    right: 12%;
    height: 1.5px;
    background: repeating-linear-gradient(
      to right,
      var(--hbto-bg-deep) 0,
      var(--hbto-bg-deep) 5px,
      transparent 5px,
      transparent 12px
    );
    opacity: 0.3;
    z-index: 0;
    pointer-events: none;
  }

  /* ----- Step Card ----- */
  .hbto-how .hbto-step {
    background: var(--hbto-card-bg);
    border-radius: var(--hbto-radius-lg);
    padding: 36px 28px 32px;
    text-align: center;
    position: relative;
    z-index: 1;
    overflow: visible;
  }

  /* ----- Step Number Circle ----- */
  .hbto-how .hbto-step-num {
    width: 56px;
    height: 56px;
    background: var(--hbto-circle-bg);
    color: var(--hbto-circle-text);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--hbto-display);
    font-size: 22px;
    font-weight: 500;
    margin: -64px auto 24px;
    box-shadow: 0 4px 14px -2px rgba(13, 42, 58, 0.3);
    line-height: 1;
    position: relative;
    z-index: 2;
  }

  /* ----- Step Title ----- */
  .hbto-how .hbto-step-title {
    font-family: var(--hbto-display);
    font-weight: 600;
    font-size: 22px;
    color: var(--hbto-bg-deep);
    line-height: 1.2;
    margin: 0 0 10px;
    letter-spacing: -0.005em;
  }

  /* ----- Step Description ----- */
  .hbto-how .hbto-step-desc {
    font-family: var(--hbto-display);
    font-weight: 400;
    font-size: 15px;
    color: var(--hbto-ink-soft);
    line-height: 1.6;
  }
  .hbto-how .hbto-step-desc p { margin: 0 0 0.6em; }
  .hbto-how .hbto-step-desc p:last-child { margin-bottom: 0; }

  /* ----- Responsive ----- */
  @media (max-width: 880px) {
    .hbto-how .hbto-steps {
      grid-template-columns: 1fr !important;
      gap: 64px;
    }
    .hbto-how .hbto-has-connector::before {
      display: none;
    }
    .hbto-how { padding: 70px 0; }
    .hbto-how .hbto-subtitle { margin-bottom: 56px; }
    .hbto-how .hbto-step { padding: 30px 24px 26px; }
  }
/* END_SECTION:asset6 */

/* START_SECTION:asset7 (INDEX:11) */
.hbto-rev *,
  .hbto-rev *::before,
  .hbto-rev *::after { box-sizing: border-box; }

  .hbto-rev {
    font-family: var(--hbto-display);
    color: var(--hbto-ink);
    background: var(--hbto-bg-cream);
    padding: var(--hbto-pad-y) 0;
    -webkit-font-smoothing: antialiased;
  }

  .hbto-rev .hbto-wrap {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
  }

  /* ----- Eyebrow ----- */
  .hbto-rev .hbto-eyebrow {
    text-align: center;
    font-family: var(--hbto-sans);
    font-size: 13px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--hbto-coral);
    font-weight: 700;
    margin: 0 0 18px;
  }

  /* ----- Title ----- */
  .hbto-rev .hbto-title {
    font-family: var(--hbto-display);
    font-weight: 500;
    font-size: clamp(34px, 5.2vw, 60px);
    line-height: 1.05;
    text-align: center;
    color: var(--hbto-bg-deep);
    letter-spacing: -0.015em;
    margin: 0 0 40px;
  }
  .hbto-rev .hbto-title em,
  .hbto-rev .hbto-title i {
    font-style: italic;
    color: var(--hbto-coral);
    font-weight: 400;
  }
  .hbto-rev .hbto-title p { margin: 0; }

  /* ----- Intro row (text + stat box) ----- */
  .hbto-rev .hbto-rev-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 44px;
    flex-wrap: wrap;
    gap: 24px;
  }
  .hbto-rev .hbto-rev-intro {
    max-width: 520px;
    font-size: 16px;
    color: var(--hbto-ink-soft);
    line-height: 1.6;
  }
  .hbto-rev .hbto-rev-intro p { margin: 0; }

  /* ----- Stat box ----- */
  .hbto-rev .hbto-rev-stat {
    display: flex;
    align-items: center;
    gap: 18px;
    background: var(--hbto-paper);
    padding: 16px 24px;
    border-radius: var(--hbto-radius);
    border: 1px solid var(--hbto-line);
  }
  .hbto-rev .hbto-stat-big {
    font-family: var(--hbto-display);
    font-size: 42px;
    line-height: 1;
    font-weight: 500;
    color: var(--hbto-bg-deep);
    letter-spacing: -0.02em;
  }
  .hbto-rev .hbto-stat-small {
    font-size: 13px;
    color: var(--hbto-ink-soft);
    line-height: 1.3;
  }
  .hbto-rev .hbto-stat-small .hbto-stars {
    display: block;
    color: var(--hbto-gold);
    font-size: 15px;
    letter-spacing: 1px;
    margin-bottom: 4px;
  }
  .hbto-rev .hbto-stat-sub {
    display: block;
  }

  /* ----- Cards Grid ----- */
  .hbto-rev .hbto-rev-grid {
    display: grid;
    grid-template-columns: repeat(var(--hbto-rev-cols, 3), 1fr);
    gap: 18px;
  }

  /* ----- Review Card ----- */
  .hbto-rev .hbto-rev-card {
    background: var(--hbto-paper);
    border: 1px solid var(--hbto-line);
    border-radius: var(--hbto-radius-lg);
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s;
  }
  .hbto-rev .hbto-rev-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px -14px rgba(13, 42, 58, 0.18);
  }

  /* ----- Top row: stars + verified ----- */
  .hbto-rev .hbto-rev-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }
  .hbto-rev .hbto-rev-top .hbto-stars {
    color: var(--hbto-gold);
    font-size: 15px;
    letter-spacing: 1px;
    line-height: 1;
  }
  .hbto-rev .hbto-verified {
    font-family: var(--hbto-sans);
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--hbto-verified);
    font-weight: 700;
    white-space: nowrap;
  }
  .hbto-rev .hbto-verified::before {
    content: '✓ ';
  }

  /* ----- Card title ----- */
  .hbto-rev .hbto-rev-title {
    font-family: var(--hbto-display);
    font-weight: 600;
    font-size: 19px;
    color: var(--hbto-bg-deep);
    line-height: 1.25;
    letter-spacing: -0.005em;
    margin: 0;
  }

  /* ----- Card body ----- */
  .hbto-rev .hbto-rev-body {
    font-family: var(--hbto-display);
    font-weight: 400;
    font-size: 14px;
    color: var(--hbto-ink-soft);
    line-height: 1.6;
    flex: 1;
  }
  .hbto-rev .hbto-rev-body p { margin: 0 0 0.6em; }
  .hbto-rev .hbto-rev-body p:last-child { margin-bottom: 0; }

  /* ----- Reviewer footer ----- */
  .hbto-rev .hbto-rev-who {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    color: var(--hbto-bg-deep);
    border-top: 1px solid var(--hbto-line);
    padding-top: 14px;
    margin-top: auto;
  }
  .hbto-rev .hbto-avatar {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--hbto-display);
    font-weight: 600;
    font-size: 15px;
    line-height: 1;
    flex-shrink: 0;
    text-transform: uppercase;
  }
  .hbto-rev .hbto-who-text b {
    font-weight: 600;
  }
  .hbto-rev .hbto-when {
    color: var(--hbto-ink-mute);
    font-size: 12px;
  }

  /* ----- Responsive ----- */
  @media (max-width: 980px) {
    .hbto-rev .hbto-rev-grid {
      grid-template-columns: repeat(2, 1fr) !important;
    }
  }
  @media (max-width: 680px) {
    .hbto-rev .hbto-rev-grid {
      grid-template-columns: 1fr !important;
    }
    .hbto-rev .hbto-rev-head {
      flex-direction: column;
      align-items: flex-start;
    }
    .hbto-rev .hbto-rev-stat {
      width: 100%;
    }
    .hbto-rev { padding: 70px 0; }
  }
/* END_SECTION:asset7 */

/* START_SECTION:asset8 (INDEX:12) */
.hbto-founder *,
  .hbto-founder *::before,
  .hbto-founder *::after { box-sizing: border-box; }

  .hbto-founder {
    font-family: var(--hbto-display);
    color: var(--hbto-paper);
    background: var(--hbto-bg-deep);
    padding: var(--hbto-pad-y) 0;
    position: relative;
    overflow: hidden;
    -webkit-font-smoothing: antialiased;
  }

  .hbto-founder .hbto-wrap {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
    position: relative;
    z-index: 1;
  }

  /* ----- Decorative quote mark (subtle background) ----- */
  .hbto-founder .hbto-founder-decoration {
    position: absolute;
    font-family: var(--hbto-display);
    font-weight: 400;
    font-size: clamp(280px, 35vw, 600px);
    line-height: 1;
    color: var(--hbto-paper);
    opacity: 0.05;
    top: -8%;
    left: -2%;
    pointer-events: none;
    z-index: 0;
    user-select: none;
  }

  /* ----- Inner container ----- */
  .hbto-founder .hbto-founder-inner {
    max-width: var(--hbto-max-w, 880px);
    margin: 0 auto;
    text-align: center;
    position: relative;
    z-index: 1;
  }

  /* ----- The big quote ----- */
  .hbto-founder .hbto-founder-q {
    font-family: var(--hbto-display);
    font-weight: 400;
    font-size: clamp(24px, 3.4vw, 38px);
    line-height: 1.35;
    letter-spacing: -0.005em;
    margin: 0 0 40px;
    color: var(--hbto-paper);
  }
  .hbto-founder .hbto-founder-q em,
  .hbto-founder .hbto-founder-q i {
    font-style: italic;
    color: var(--hbto-sage);
    font-weight: 400;
  }
  .hbto-founder .hbto-founder-q p {
    margin: 0 0 0.6em;
  }
  .hbto-founder .hbto-founder-q p:last-child {
    margin-bottom: 0;
  }

  /* ----- Signature row ----- */
  .hbto-founder .hbto-founder-sig {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
  }

  /* ----- Photo avatar ----- */
  .hbto-founder .hbto-founder-photo {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    border: 2px solid rgba(251, 247, 238, 0.15);
  }
  .hbto-founder .hbto-founder-photo img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block;
  }

  /* ----- Letter avatar (fallback) ----- */
  .hbto-founder .hbto-founder-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    font-family: var(--hbto-display);
    font-style: italic;
    font-weight: 500;
    font-size: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    line-height: 1;
  }

  /* ----- Name + title ----- */
  .hbto-founder .hbto-founder-meta {
    text-align: left;
    line-height: 1.3;
  }
  .hbto-founder .hbto-founder-meta b {
    font-family: var(--hbto-display);
    font-weight: 600;
    font-size: 18px;
    display: block;
    color: var(--hbto-paper);
    letter-spacing: -0.005em;
  }
  .hbto-founder .hbto-founder-meta span {
    font-family: var(--hbto-sans);
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--hbto-sage);
    font-weight: 600;
    display: block;
    margin-top: 4px;
  }

  /* ----- Responsive ----- */
  @media (max-width: 680px) {
    .hbto-founder { padding: 70px 0; }
    .hbto-founder .hbto-founder-q { margin-bottom: 32px; }
    .hbto-founder .hbto-founder-decoration { top: -4%; font-size: clamp(220px, 60vw, 360px); }
    .hbto-founder .hbto-founder-photo,
    .hbto-founder .hbto-founder-avatar { width: 48px; height: 48px; font-size: 20px; }
    .hbto-founder .hbto-founder-meta b { font-size: 16px; }
  }
/* END_SECTION:asset8 */

/* START_SECTION:asset9homebewareofscammeralert (INDEX:13) */
.hbto-hero *,
  .hbto-hero *::before,
  .hbto-hero *::after { box-sizing: border-box; }

  .hbto-hero {
    font-family: var(--hbto-display);
    color: var(--hbto-text);
    background-color: var(--hbto-bg-cream);
    padding: var(--hbto-pad-y) 0;
    min-height: var(--hbto-min-h);
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
    -webkit-font-smoothing: antialiased;
  }

  /* ----- Background media ----- */
  .hbto-hero .hbto-hero-media {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
  }
  .hbto-hero .hbto-hero-video,
  .hbto-hero .hbto-hero-poster {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block;
  }
  /* Poster background layer (under the video, prevents flash of nothing during load) */
  .hbto-hero .hbto-hero-poster-bg {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block;
    z-index: 0;
  }
  .hbto-hero .hbto-hero-video {
    z-index: 1;
    background: transparent;
  }
  /* Hide ALL video controls / overlays — this is background, not a player */
  .hbto-hero .hbto-hero-video {
    pointer-events: none;
    -webkit-user-select: none;
    user-select: none;
  }
  .hbto-hero .hbto-hero-video::-webkit-media-controls,
  .hbto-hero .hbto-hero-video::-webkit-media-controls-panel,
  .hbto-hero .hbto-hero-video::-webkit-media-controls-play-button,
  .hbto-hero .hbto-hero-video::-webkit-media-controls-start-playback-button,
  .hbto-hero .hbto-hero-video::-webkit-media-controls-overlay-play-button,
  .hbto-hero .hbto-hero-video::-webkit-media-controls-enclosure,
  .hbto-hero .hbto-hero-video::-internal-media-controls-overlay-cast-button {
    display: none !important;
    -webkit-appearance: none !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
  /* iOS Safari: hide native poster play button during load */
  .hbto-hero .hbto-hero-video::-webkit-media-controls-fullscreen-button,
  .hbto-hero .hbto-hero-video::-webkit-media-controls-mute-button,
  .hbto-hero .hbto-hero-video::-webkit-media-controls-timeline,
  .hbto-hero .hbto-hero-video::-webkit-media-controls-current-time-display,
  .hbto-hero .hbto-hero-video::-webkit-media-controls-time-remaining-display {
    display: none !important;
    visibility: hidden !important;
  }

  /* ----- Scrim overlay ----- */
  .hbto-hero .hbto-hero-scrim {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
  }

  /* ----- Content wrap ----- */
  .hbto-hero .hbto-wrap {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 32px;
    position: relative;
    z-index: 2;
    width: 100%;
  }

  .hbto-hero .hbto-hero-inner {
    max-width: 560px;
  }

  /* ----- Top trust pill ----- */
  .hbto-hero .hbto-hero-pill {
    margin: 0 0 28px;
    display: flex;
  }
  .hbto-hero .hbto-pill-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 9px 18px;
    background: rgba(251, 247, 238, 0.95);
    border: 1.5px solid var(--hbto-coral);
    border-radius: 100px;
    font-family: var(--hbto-sans);
    font-size: 11px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--hbto-coral);
    font-weight: 700;
    line-height: 1;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    box-shadow: 0 4px 14px -4px rgba(0, 0, 0, 0.25);
  }
  .hbto-hero .hbto-pill-ic {
    font-size: 13px;
    line-height: 1;
    display: inline-block;
  }

  /* ----- Eyebrow ----- */
  .hbto-hero .hbto-hero-eyebrow {
    font-family: var(--hbto-sans);
    font-size: 13px;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--hbto-text);
    font-weight: 700;
    margin: 0 0 22px;
    opacity: 0.95;
  }

  /* ----- Title ----- */
  .hbto-hero .hbto-hero-title {
    font-family: var(--hbto-display);
    font-weight: 500;
    font-size: clamp(38px, 5.5vw, 68px);
    line-height: 1.02;
    color: var(--hbto-text);
    letter-spacing: -0.02em;
    margin: 0 0 22px;
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.18);
  }
  .hbto-hero .hbto-hero-title em,
  .hbto-hero .hbto-hero-title i {
    font-style: italic;
    color: var(--hbto-coral);
    font-weight: 400;
  }
  .hbto-hero .hbto-hero-title p { margin: 0; }

  /* ----- Tagline ----- */
  .hbto-hero .hbto-hero-tagline {
    font-family: var(--hbto-display);
    font-style: italic;
    font-weight: 300;
    font-size: clamp(17px, 1.8vw, 21px);
    line-height: 1.45;
    color: var(--hbto-text);
    margin: 0 0 36px;
    opacity: 0.92;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
  }
  .hbto-hero .hbto-hero-tagline p { margin: 0; }

  /* ----- CTAs ----- */
  .hbto-hero .hbto-hero-ctas {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 40px;
  }
  .hbto-hero .hbto-cta-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 18px 36px;
    border-radius: 100px;
    font-family: var(--hbto-sans);
    font-size: 13px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 8px 22px -6px rgba(0, 0, 0, 0.35);
    transition: transform 0.2s ease, filter 0.2s ease, box-shadow 0.2s ease;
  }
  .hbto-hero .hbto-cta-primary:hover {
    transform: translateY(-2px);
    filter: brightness(0.92);
    box-shadow: 0 12px 28px -6px rgba(0, 0, 0, 0.4);
  }
  .hbto-hero .hbto-cta-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 16px 24px;
    font-family: var(--hbto-sans);
    font-size: 12px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--hbto-text);
    text-decoration: none;
    border-bottom: 1.5px solid var(--hbto-text);
    transition: opacity 0.2s ease;
  }
  .hbto-hero .hbto-cta-secondary:hover {
    opacity: 0.7;
  }

  /* ----- Authenticity note ----- */
  .hbto-hero .hbto-hero-auth {
    font-family: var(--hbto-sans);
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--hbto-text);
    font-weight: 600;
    line-height: 1.7;
    opacity: 0.9;
    max-width: 560px;
  }
  .hbto-hero .hbto-hero-auth strong,
  .hbto-hero .hbto-hero-auth b {
    color: var(--hbto-text);
    font-weight: 800;
    opacity: 1;
  }
  .hbto-hero .hbto-hero-auth em,
  .hbto-hero .hbto-hero-auth i {
    font-style: normal;
    color: var(--hbto-coral);
    opacity: 1;
  }
  .hbto-hero .hbto-hero-auth p { margin: 0; }
  .hbto-hero .hbto-hero-auth a {
    color: var(--hbto-text);
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  /* ----- Anti-counterfeit warning badge ----- */
  .hbto-hero .hbto-scam-badge {
    position: absolute;
    left: clamp(20px, 4vw, 60px);
    width: var(--hbto-badge-size, 220px);
    height: var(--hbto-badge-size, 220px);
    z-index: 3;
    transform: rotate(var(--hbto-badge-rotate, -8deg));
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    filter: drop-shadow(0 10px 24px rgba(0, 0, 0, 0.35));
    pointer-events: none;
  }
  .hbto-hero .hbto-scam-badge:hover {
    transform: rotate(0deg) scale(1.05);
  }
  .hbto-hero .hbto-scam-pos-top {
    top: clamp(80px, 12vh, 140px);
  }
  .hbto-hero .hbto-scam-pos-middle {
    top: 50%;
    transform: translateY(-50%) rotate(var(--hbto-badge-rotate, -8deg));
  }
  .hbto-hero .hbto-scam-pos-middle:hover {
    transform: translateY(-50%) rotate(0deg) scale(1.05);
  }
  .hbto-hero .hbto-scam-pos-bottom {
    bottom: clamp(60px, 10vh, 120px);
  }
  .hbto-hero .hbto-badge-svg {
    width: 100%;
    height: 100%;
    display: block;
    overflow: visible;
  }
  .hbto-hero .hbto-badge-center {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 22%;
    color: var(--hbto-badge-text, #FBF7EE);
    line-height: 1;
  }
  .hbto-hero .hbto-badge-top {
    font-family: var(--hbto-sans);
    font-size: calc(var(--hbto-badge-size, 220px) * 0.055);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 6px;
    opacity: 0.9;
  }
  .hbto-hero .hbto-badge-big {
    font-family: var(--hbto-sans);
    font-size: calc(var(--hbto-badge-size, 220px) * 0.13);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    font-weight: 800;
    line-height: 0.95;
  }
  .hbto-hero .hbto-badge-bottom {
    font-family: var(--hbto-display);
    font-style: italic;
    font-size: calc(var(--hbto-badge-size, 220px) * 0.052);
    letter-spacing: 0.02em;
    margin-top: 8px;
    opacity: 0.9;
  }

  /* ----- Reduced motion: pause autoplay videos ----- */
  @media (prefers-reduced-motion: reduce) {
    .hbto-hero .hbto-hero-video {
      display: none;
    }
  }

  /* ----- Responsive ----- */
  @media (max-width: 880px) {
    .hbto-hero { padding: 60px 0; min-height: 70vh; }
    .hbto-hero .hbto-wrap { padding: 0 22px; }
    .hbto-hero .hbto-hero-inner { max-width: 100%; }
    /* Hide the scam badge on mobile - it would crowd the content */
    .hbto-hero .hbto-scam-badge {
      display: none !important;
    }
    /* On mobile, force left alignment for legibility */
    .hbto-hero[data-align="right"] .hbto-hero-inner,
    .hbto-hero[data-align="left"] .hbto-hero-inner {
      margin-left: 0 !important;
      margin-right: 0 !important;
      text-align: left !important;
    }
    /* Pill: tighten so it doesn't stretch to the edge */
    .hbto-hero .hbto-hero-pill { margin-bottom: 20px; }
    .hbto-hero .hbto-pill-badge {
      font-size: 9px;
      letter-spacing: 0.16em;
      padding: 7px 14px;
      gap: 8px;
    }
    .hbto-hero .hbto-pill-ic { font-size: 10px; }
    .hbto-hero .hbto-hero-eyebrow {
      font-size: 10px;
      letter-spacing: 0.22em;
      margin-bottom: 14px;
    }
    .hbto-hero .hbto-hero-title { margin-bottom: 18px; }
    .hbto-hero .hbto-hero-tagline {
      font-size: 16px;
      margin-bottom: 26px;
    }
    /* CTAs: balanced, both visually equal weight */
    .hbto-hero .hbto-hero-ctas {
      gap: 8px;
      margin-bottom: 26px;
      align-items: center;
    }
    .hbto-hero .hbto-cta-primary {
      padding: 14px 26px;
      font-size: 11px;
      letter-spacing: 0.16em;
      border-radius: 100px;
    }
    .hbto-hero .hbto-cta-secondary {
      padding: 14px 16px;
      font-size: 11px;
      letter-spacing: 0.16em;
    }
    /* Auth note: smaller and tighter on mobile */
    .hbto-hero .hbto-hero-auth {
      font-size: 9px;
      letter-spacing: 0.1em;
      line-height: 1.6;
    }
  }

  /* Smaller phones: tighten even more */
  @media (max-width: 480px) {
    .hbto-hero { padding: 50px 0 60px; min-height: 600px; }
    .hbto-hero .hbto-wrap { padding: 0 20px; }
    /* Pill: shrink-to-fit, never edge-to-edge */
    .hbto-hero .hbto-pill-badge {
      font-size: 8px;
      letter-spacing: 0.14em;
      padding: 6px 12px;
      gap: 6px;
    }
    .hbto-hero .hbto-pill-ic { font-size: 8px; }
    .hbto-hero .hbto-hero-title {
      font-size: 38px;
      line-height: 1.05;
    }
    .hbto-hero .hbto-hero-tagline { font-size: 15px; margin-bottom: 22px; }
    /* CTAs: shrink primary so it doesn't dwarf secondary */
    .hbto-hero .hbto-hero-ctas { gap: 6px; }
    .hbto-hero .hbto-cta-primary {
      padding: 13px 22px;
      font-size: 10px;
      letter-spacing: 0.14em;
    }
    .hbto-hero .hbto-cta-secondary {
      padding: 13px 12px;
      font-size: 10px;
      letter-spacing: 0.14em;
    }
    /* Auth note: even tighter, cleaner */
    .hbto-hero .hbto-hero-auth {
      font-size: 8.5px;
      letter-spacing: 0.08em;
      line-height: 1.55;
    }
  }
/* END_SECTION:asset9homebewareofscammeralert */

/* START_SECTION:custom-asset1 (INDEX:16) */
/* ============================================================
     HBTO Product Buy Box — scoped styles
     ============================================================ */
  /* ============================================================
     HBTO Product Buy Box — scoped styles
     ============================================================ */

  /* ----- Add to Cart Toast ----- */
  .hbto-toast {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 99999;
    background: #0D2A3A;
    color: #FBF7EE;
    font-family: Inter;
    font-weight: 600;
    font-size: 14px;
    padding: 14px 18px;
    border-radius: 10px;
    box-shadow: 0 10px 30px -8px rgba(0,0,0,0.35);
    display: flex;
    align-items: center;
    gap: 10px;
    opacity: 0;
    transform: translateX(30px);
    transition: opacity 0.25s ease, transform 0.25s ease;
    pointer-events: none;
    max-width: 320px;
  }
  .hbto-toast.hbto-toast-show {
    opacity: 1;
    transform: translateX(0);
  }
  .hbto-toast .hbto-toast-check {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #2BAA5E;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
  }
  @media (max-width: 480px) {
    .hbto-toast {
      top: 12px;
      right: 12px;
      left: 12px;
      max-width: none;
    }
  }

section.custom-main-prod.hbto-product {
    padding: 70px 0 110px 0;
        background: #FBF7EE;
}
.custom-main-prod.hbto-wrap {
    width: 100%;
    max-width: 1272px;
    padding: 0 20px;
    
}



.custom-main-prod.hbto-product-grid {
    display: flex;
    gap: 60px;
    justify-content: space-between;
}
.custom-main-prod.hbto-gallery {
    width: 100%;
    max-width: 552px;
}

.custom-asset1-accordion .accordion-a summary:before{
    color: #172D3A !important;
}
.custom-main-prod.hbto-gallery-main {
    width: 100%;
    max-width: 552px;
    height: 552px;
    border: none;
    border-radius: 12px;
        overflow: visible;
}

.custom-main-prod.hbto-gallery-thumbs {
    gap: 12px;
    margin-top: 16px;
}
.custom-main-prod.hbto-gallery-main img {
    width: 100%;
    height: 100% !important;
    display: block;
    object-fit: contain;
        margin: 0;
            border-radius: 12px;
}
button.custom-main-prod.hbto-gallery-arrow.hbto-gallery-arrow--prev {
    width: 100%;
    max-width: 50px;
    height: 50px;
    left: -25px;
}
button.custom-main-prod.hbto-gallery-arrow.hbto-gallery-arrow--prev:before, button.custom-main-prod.hbto-gallery-arrow.hbto-gallery-arrow--next:before{
  display:none;
}
button.custom-main-prod.hbto-gallery-arrow.hbto-gallery-arrow--next{

 width: 100%;
    max-width: 50px;
    height: 50px;
    right: -23px;
}
  .hbto-section *,
  .hbto-section *::before,
  .hbto-section *::after {
    box-sizing: border-box;
  }
  .hbto-section {
    font-family: var(--hbto-sans);
    color: var(--hbto-ink);
    background: var(--hbto-bg-cream);
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    position: relative;
  }
  .hbto-section a { color: inherit; text-decoration: none; }
  .hbto-section img { max-width: 100%; display: block; }
  .hbto-section button { font-family: inherit; cursor: pointer; border: none; background: none; }
main#content.custom-main-prod {
    width: 100%;
    max-width: 100%;
}

.custom-main-prod.hbto-rating-row span {
    display: none !important;
}

.custom-main-prod.hbto-rating-row {
    display: none !important;
}

.custom-main-prod.hbto-lede p {
    font-family: 'Inter';
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0;
    color: #172D3A;
}


  /* ----- Product Grid ----- */
  .hbto-product { padding: 48px 0 80px; }

  button.custom-main-prod.hbto-bundle.custom-main-prod.hbto-bundle:hover:before {
    display: none;
}

span.hbto-stock-processing-inline {
    font-weight: 400;
}

  /* ----- Gallery (JS-driven sticky on desktop) ----- */
  .hbto-gallery {
    align-self: start;
    will-change: transform;
  }
  .hbto-gallery-main {

    position: relative;
  
  }
  .hbto-gallery-main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity 0.3s;
  }
  .hbto-img-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--hbto-paper);
    color: var(--hbto-line);
  }
  .hbto-img-placeholder svg { width: 70%; height: 70%; opacity: 0.4; }
  .hbto-gallery-badge {
    position: absolute;
    top: 20px;
    left: 20px;
    background: var(--hbto-coral);
    color: var(--hbto-paper);
    padding: 8px 14px;
    border-radius: 100px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    z-index: 2;
  }
  .hbto-gallery-badge::before { content: '★ '; }
  .hbto-gallery-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(251, 247, 238, 0.9);
    border: 1px solid var(--hbto-line);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 3;
    transition: background 0.2s, transform 0.2s;
  }
  .hbto-gallery-arrow:hover {
    background: var(--hbto-paper);
    transform: translateY(-50%) scale(1.06);
  }
  .hbto-gallery-arrow img { width: 16px; height: 16px; display: block; }
  .hbto-gallery-arrow--prev { left: 14px; }
  .hbto-gallery-arrow--next { right: 14px; }
  .hbto-gallery-arrow:disabled {
    opacity: 0.35;
    cursor: default;
    pointer-events: none;
  }

  .hbto-thumbs-wrap {
    display: flex;
    align-items: center;
   
  }
.hbto-thumb-arrow {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--hbto-paper);
    border: 1px solid var(--hbto-line);
    display: none;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.2s;
  }
  /* Arrows only appear when the thumbnail strip actually overflows */
  .hbto-thumbs-wrap.hbto-has-scroll .hbto-thumb-arrow {
    display: flex;
  }
  .hbto-thumb-arrow:hover { background: var(--hbto-sage); }
  .hbto-thumb-arrow:disabled {
    opacity: 0.35;
    cursor: default;
    pointer-events: none;
  }
  .hbto-thumb-arrow img { width: 12px; height: 12px; display: block; }
  .hbto-gallery-thumbs {
    display: flex;
   
    overflow-x: auto;
    scroll-behavior: smooth;
    cursor: grab;
    flex: 1;
    min-width: 0;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  .hbto-gallery-thumbs::-webkit-scrollbar { display: none; }
  .hbto-gallery-thumbs.hbto-thumbs-dragging { cursor: grabbing; scroll-behavior: auto; }
  .hbto-gallery-thumbs .hbto-thumb { flex: 0 0 auto; width: 82px; height:82px; }
.hbto-thumb {
    aspect-ratio: 1;
    border-radius: var(--hbto-radius);
    overflow: hidden;
    border: 2px solid transparent;
    background: var(--hbto-paper);
    cursor: pointer;
    padding: 0;
    transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s;
  }
  .hbto-thumb img {     width: 100%;
    height: 100% !important;
    object-fit: cover;
    margin: 0; }
  .hbto-thumb:hover { transform: none !important; }
  .hbto-thumb.hbto-active {
    border: 2px solid #6B9C9F;
  }
  @media (max-width: 980px) {
    .hbto-gallery {
      transform: none !important;
    }
  }

  /* ----- Buy Box ----- */
  .hbto-buy-box { padding-top: 8px; }
  .hbto-eyebrow {
    font-size: 11px;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--hbto-coral);
    font-weight: 600;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .hbto-eyebrow::before {
    content: '';
    width: 24px;
    height: 1px;
    background: var(--hbto-coral);
  }
  .hbto-product-title {
    font-family: Inter;
    font-weight: 700;
    font-style: normal;
    font-size: 38px;
    line-height: 1.1;
    letter-spacing: -0.76px;
    text-transform: capitalize;
    color: #172D3A;
    margin: 0 0 16px;
  }
  .hbto-product-title__main {
    display: block;
  }
  .hbto-product-title em,
  .hbto-product-title i,
  .hbto-product-title u,
  .hbto-product-title .hbto-product-title__highlight {
    display: block;
    font-family: Lora;
    font-weight: 600;
    font-style: italic;
    font-size: 38px;
    line-height: 1.1;
    letter-spacing: -0.76px;
    text-transform: capitalize;
    color: #DB5A3C !important;
    text-decoration: none;
  }
  .hbto-product-price {
    font-family: Inter;
    font-weight: 700;
    font-style: normal;
    font-size: 25px;
    line-height: 1.6;
    letter-spacing: -0.5px;
    vertical-align: middle;
    color: #6B9C9F;
    margin: 0;
        margin-bottom: 24px;
  }
  .hbto-product-description,
  .hbto-product-description p {
    font-family: Inter;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0;
    color: #172D3A;
  }
  .hbto-product-description {
    margin: 0;
  }
  .hbto-product-description p {
    margin: 0;
  }
  .hbto-rating-row {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 22px;
    flex-wrap: wrap;
  }
  .hbto-stars { color: var(--hbto-gold); letter-spacing: 2px; font-size: 16px; }
  .hbto-review-count {
    font-size: 14px;
    color: var(--hbto-ink-soft);
    border-left: 1px solid var(--hbto-line);
    padding-left: 14px;
  }
  .hbto-review-count b { color: var(--hbto-bg-deep); font-weight: 600; }

  .hbto-lede {
    font-family: var(--hbto-display);
    font-weight: 300;
    font-size: 19px;
    line-height: 1.45;
    color: var(--hbto-ink-soft);
    margin-bottom: 26px;
    max-width: 90%;
  }
  .hbto-lede p { margin: 0; }
  .hbto-lede em,
  .hbto-lede i { font-style: italic; color: var(--hbto-bg-deep); }

  .hbto-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 32px;
  }
  .hbto-chip {
    background: var(--hbto-paper);
    border: 1px solid var(--hbto-line);
    color: var(--hbto-bg-deep);
    padding: 7px 13px;
    border-radius: 100px;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.02em;
  }
  .hbto-chip::before {
    content: '✓ ';
    color: var(--hbto-coral);
    font-weight: 700;
  }

  /* ----- Bundles ----- */
  .hbto-bundle-label {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 20px;
     margin-top: 30px;
  }

  .hbto-bundle-label .hbto-r {
    font-size: 12px;
    color: var(--hbto-ink-mute);
    font-style: italic;
    font-family: var(--hbto-display);
  }
  .hbto-bundles {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
    margin-bottom: 30px;
  }
button.custom-main-prod.hbto-bundle {
    border: 1px solid #172D3A33 !important;
    background: #fff !important;
    padding: 20px 10px 16px 10px;
    border-radius: 10px;
    gap:0;
    width: 100%;
    max-width: 188px;
}

  /* Selected-state border follows this bundle's badge color (--hbto-bundle-border),
     set inline from the "Badge background color" setting. Falls back to coral
     when a bundle has no badge color configured. */
  .hbto-bundle.hbto-active {
    background: var(--hbto-coral-soft);
  }

  /* Static per-card colors — edit hex values as needed */
  .hbto-bundles .hbto-bundle:nth-child(1).hbto-active {
     border: 2px solid #87ceeb !important;
    box-shadow: none !important;
    background: #87ceeb36 !important;
  }
.hbto-bundles .hbto-bundle:nth-child(2).hbto-active {
    border: 2px solid #DB5A3C !important;
    box-shadow: none !important;
    background: #F2EBDB !important;
}
  .hbto-bundles .hbto-bundle:nth-child(3).hbto-active {
     border: 2px solid #6B9C9F !important;
    box-shadow: none !important;
    background: #6b9c9f29 !important;
  }

span.custom-main-prod.hbto-qty-display, span.custom-main-prod.hbto-qty-display span {
    font-family: Inter;
    font-weight: 600;
    font-size: 16px;
    line-height: 1.6;
    letter-spacing: -0.32px;
    text-align: center;
    vertical-align: middle;
    margin: 0;
    padding: 0;
    text-transform: capitalize;
    color: var(--hbto-bg-deep);
        margin-top: 16px;
}


  .hbto-qty-display span {
    font-size: 13px;
    color: var(--hbto-ink-soft);
    font-family: var(--hbto-sans);
    margin-left: 4px;
    font-weight: 400;
  }

  .custom-main-prod.hbto-price-row {
    gap: 6px;
    margin: 0 auto;
    padding: 0;
    display: flex;
    flex-direction: row-reverse;
}

  span.custom-main-prod.hbto-price {
    font-family: Inter;
    font-weight: 700;
    font-size: 16px;
    line-height: 1.6;
    letter-spacing: -0.32px;
    text-align: center;
    vertical-align: middle;
    margin: 0;
    padding: 0;
    color: var(--hbto-bg-deep);
}

span.custom-main-prod.hbto-price-was {
    font-family: Inter;
    font-weight: 300;
    font-size: 14px;
    line-height: 1.6;
    letter-spacing: -0.32px;
    text-align: center;
    vertical-align: middle;
    margin: 0;
    padding: 0;
    color: var(--hbto-ink-mute);
    text-decoration: line-through;
}

span.custom-main-prod.hbto-save-badge {
    background: #6B9C9F;
    height: 19px;
    border-radius: 5px;
    padding: 0 6px;
    color: #fff;
    font-family: Inter;
    font-weight: 500;
    font-size: 12px;
    line-height: 22px;
    letter-spacing: -0.24px;
    text-align: center;
    vertical-align: middle;
	    margin: 10px auto 10px auto;
       display: inline-flex;
    align-self: flex-start;
    align-items: center;
    justify-content: center;
}
.hbto-bundles .hbto-bundle:nth-child(2) .custom-main-prod.hbto-price-row, .hbto-bundles .hbto-bundle:nth-child(3) .custom-main-prod.hbto-price-row {
    margin-top: 10px;
}
.hbto-bundles .hbto-bundle:nth-child(1) .custom-main-prod.hbto-price-row {
    margin: 13px auto 13px auto;
}
span.custom-main-prod.hbto-note {
    font-family: Inter;
    font-weight: 700;
    font-size: 10px;
    line-height: 22px;
    letter-spacing: 0.7px;
    text-align: center;
    vertical-align: middle;
    text-transform: uppercase;
        display: block;
    color: var(--hbto-coral);
}



span.custom-main-prod.hbto-ribbon {
    height: 21px;
    border-radius: 5px;
    padding: 0 8px;
    font-family: Inter;
    font-weight: 700;
    font-size: 13px;
    line-height: 22px;
    letter-spacing: -0.26px;
    text-align: center;
    vertical-align: middle;
    text-transform: uppercase;
}
span.custom-main-prod.hbto-l {
    font-family: Inter;
    font-weight: 700;
    font-size: 18px;
    line-height: 1.1;
    letter-spacing: -0.36px;
    vertical-align: middle;
    text-transform: capitalize;
    color: #172D3A;
}
  .hbto-bundle .hbto-ribbon {
    position: absolute;
    top: -10px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--hbto-bg-deep);
    color: var(--hbto-paper);

    white-space: nowrap;
  }
  /* Only falls back to the active-state coral when no custom badge color was set inline */
  .hbto-bundle.hbto-active .hbto-ribbon:not([style*="background"]) { background: var(--hbto-coral); }


.hbto-bundles .hbto-bundle:nth-child(1) span.custom-main-prod.hbto-bundle-img {
    width: 100%;
    max-width: 82px;
    height: 90px;
    margin: 0 auto;
}
button.custom-main-prod.hbto-bundle:before {
    display: none;
}
span.custom-main-prod.hbto-bundle-img img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
	    margin: 0;
}
.hbto-bundles .hbto-bundle:nth-child(1) span.custom-main-prod.hbto-bundle-img img {
    box-shadow: 0px 0px 14px 0px #0000002B;
}
.hbto-bundles .hbto-bundle:nth-child(2) span.custom-main-prod.hbto-bundle-img {
    width: 100%;
    max-width: 127px;
    height: 90px;
    margin: 0 auto;
}
.hbto-bundles .hbto-bundle:nth-child(3) span.custom-main-prod.hbto-bundle-img {
    width: 100%;
    max-width: 148px;
    height: 90px;
    margin: 0 auto;
}

  /* ----- Subscribe & Save ----- */
  .hbto-sub-toggle {
    background: var(--hbto-paper);
    border: 1px solid var(--hbto-line);
    border-radius: var(--hbto-radius);
    overflow: hidden;
    margin-bottom: 22px;
  }
  .hbto-sub-opt {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    cursor: pointer;
    border-bottom: 1px solid var(--hbto-line-soft);
    transition: background 0.15s;
  }
  .hbto-sub-opt:last-child { border-bottom: none; }
  .hbto-sub-opt:hover { background: rgba(200, 214, 203, 0.2); }
  .hbto-sub-opt input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    border: 1.5px solid var(--hbto-line);
    border-radius: 50%;
    margin: 2px 0 0;
    position: relative;
    flex-shrink: 0;
    cursor: pointer;
  }
  .hbto-sub-opt input[type="radio"]:checked {
    border-color: var(--hbto-coral);
    background: var(--hbto-coral);
    box-shadow: inset 0 0 0 3px var(--hbto-paper);
  }
  /* Static (non-interactive) variant — used when this card displays
     "why buy from us" info instead of subscribe/onetime radios. */
  .hbto-info-card .hbto-sub-opt.hbto-static,
  .hbto-sub-opt.hbto-static {
    cursor: default !important;
    pointer-events: none;
  }
  .hbto-info-card .hbto-sub-opt.hbto-static:hover {
    background: transparent !important;
  }
  .hbto-static-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    margin: 0;
    flex-shrink: 0;
    background: var(--hbto-sage, #C8D6CB);
    color: var(--hbto-bg-deep, #0D2A3A);
    border-radius: 50%;
  }
  .hbto-sub-opt .hbto-body { flex: 1; }
  .hbto-sub-opt .hbto-t1 {
    font-size: 14px;
    font-weight: 600;
    color: var(--hbto-bg-deep);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
  }
  .hbto-sub-opt .hbto-pill {
    background: var(--hbto-sage);
    color: var(--hbto-bg-deep);
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 100px;
    font-weight: 700;
  }
  .hbto-sub-opt .hbto-t2 {
    font-size: 12px;
    color: var(--hbto-ink-soft);
    margin-top: 2px;
  }

  /* ----- ATC ----- */
  .hbto-product-form { margin: 0; }
  .hbto-atc-row {
    display: flex;
    gap: 16px;
    margin-bottom: 14px;
    /* Android Chrome fix: prevent vertical misalignment */
    align-items: center;
    width: 100%;
  }
  .hbto-qty-stepper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    width: 150px;
    height: 62px;
    padding: 20px 24px;
    border: 1px solid #D6DDE2;
    border-radius: 10000px;
    overflow: hidden;
    background: #FFFFFF;
    /* Android Chrome fix: prevent shrinking weirdly */
    flex-shrink: 0;
  }
  .hbto-qty-stepper button {
    width: 24px;
    height: 24px;
    font-size: 18px;
    color: #172D3A;
    transition: opacity 0.15s;
    /* Android Chrome button reset */
    -webkit-appearance: none;
    appearance: none;
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    font-family: inherit;
    flex-shrink: 0;
  }
  a.hbto-cap-title{
        DISPLAY: flex;
    flex-direction: column;
  }
  .hbto-qty-stepper button:hover { background: transparent; opacity: 0.75; }
  .hbto-q-icon {
    display: block;
    object-fit: contain;
  }
  .hbto-q-icon--minus {
    width: 12px;
    height: 2px;
  }
  .hbto-q-icon--plus {
    width: 14px;
    height: 14px;
  }
  .hbto-q-val {
    min-width: 0;
    flex: 1 1 auto;
    text-align: center;
    font-family: Soleil;
    font-weight: 700;
    font-style: normal;
    font-size: 20px;
    line-height: 1.2;
    letter-spacing: 0;
    color: #172D3A;
    /* Vertical center on Android */
    display: flex;
    align-items: center;
    justify-content: center;
    height: auto;
  }
  .hbto-atc {
    flex: 0 0 auto;
    background: #6B9C9F;
    color: #FFFFFF;
    width: 424px;
    max-width: calc(100% - 166px);
    height: 62px;
    min-height: 62px;
    border-radius: 10000px;
    font-weight: 700;
    font-size: 16px;
    letter-spacing: 0;
    text-transform: capitalize;
    box-shadow: none;
    transition: all 0.18s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 73px;
    /* Android Chrome defensive resets */
    -webkit-appearance: none;
    appearance: none;
    border: none;
    padding: 0 24px;
    margin: 0;
    cursor: pointer;
    line-height: 18px;
    font-family: Inter;
    box-sizing: border-box;
    min-width: 0;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
  }
  .hbto-atc-text {
    font-family: Inter;
    font-weight: 700;
    font-style: normal;
    font-size: 16px;
    line-height: 18px;
    letter-spacing: 0;
    text-align: center;
    vertical-align: middle;
    text-transform: capitalize;
    color: #FFFFFF;
  }
  .hbto-atc-arrow {
    display: block;
    width: 21px;
    height: 21px;
    object-fit: contain;
    flex-shrink: 0;
  }
  .hbto-atc .hbto-total[hidden],
  .hbto-atc .hbto-total {
    display: none !important;
  }
  .hbto-cap-heading{
font-family: Inter;
    font-weight: 700;
    font-size: 18px;
    line-height: 1.1;
    letter-spacing: -0.36px;
    vertical-align: middle;
    text-transform: capitalize;
    color: #172D3A;
	    margin-bottom: 20px;
      margin-top: 30px;
	}
.hbto-cap-wrap {
    border-radius: 10px;
    padding: 12px 16px;
    margin-bottom: 30px;
    border: 1px solid #172D3A33;
    background: #fff;
}
.hbto-cap-img {
    width: 100%;
    max-width: 76px;
    height: 76px;
    border: 1px solid #172D3A33;
    border-radius: 8px;
    overflow: hidden;
}
.hbto-cap-price {
    font-family: Inter;
    font-weight: 700;
    font-size: 16px;
    line-height: 160%;
    letter-spacing: -0.32px;
    vertical-align: middle;
    color: #6B9C9F;
    margin: 11px auto 0 0;
}
.hbto-cap-add img {
    width: 100%;
    height: 48px !important;
    display: block;
    max-width: 48px !important;
    margin: 0;
}
.hbto-cap-item {
    display: flex;
    align-items: center;
    gap: 16px;
}

  .hbto-atc:hover {
    background: #5d8a8d;
    transform: translateY(-2px);
    box-shadow: none;
  }
  .hbto-atc:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
  }
  .hbto-atc.hbto-added {
    background: #2BAA5E;
  }
  .hbto-express-row {
 display:none;
  }
  /* Native Shopify Shop Pay + custom Checkout button row */
  /* .hbto-express-wrap {
    margin-top: 12px;
    margin-bottom: 18px;
    width: 100%;
  }

  .hbto-express-row .shopify-payment-button {
    flex: 0 0 auto;
  }
  .hbto-express-row .shopify-payment-button__button {
    height: 54px;
    min-width: 200px;
    border-radius: var(--hbto-radius);
  }
  .hbto-express-row .shopify-payment-button__more-options {
    display: block;
    margin-top: 6px;
    text-align: left;
    font-size: 11px;
    color: var(--hbto-ink-soft);
    text-decoration: underline;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
  }
  .hbto-checkout-btn {
    flex: 1;
    min-height: 54px;
    height: 54px;
    background: var(--hbto-express-bg, #0D2A3A);
    color: var(--hbto-express-text, #FBF7EE);
    border: none;
    border-radius: var(--hbto-radius);
    font-family: var(--hbto-sans);
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    cursor: pointer;
    transition: opacity 0.15s ease, transform 0.15s ease;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
  }
  .hbto-checkout-btn:hover {
    opacity: 0.92;
    transform: translateY(-1px);
  }
  .hbto-checkout-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
  } */
  @media (max-width: 480px) {
    .hbto-express-row .shopify-payment-button,
    .hbto-checkout-btn {
      flex: 1 1 100%;
      min-width: 0;
    }
    /* Ribbon fix: keep pill inside card width on small screens */
    .hbto-bundle .hbto-ribbon {
      max-width: calc(100% - 12px);
      font-size: 7px;
      letter-spacing: 0.06em;
      padding: 3px 7px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    
    /* Stack price + was-price so they don't overlap */
    .hbto-bundle .hbto-price-row {
      align-items: flex-start;
      gap: 2px;
    }
    .hbto-bundle .hbto-price {
      font-size: 17px;
      line-height: 1.1;
    }
    .hbto-bundle .hbto-price-was {
      font-size: 11px;
      line-height: 1;
    }
    /* ATC row: tighten on narrow phones (esp. Android Chrome) */
    .hbto-atc-row {
      gap: 6px;
    }
    .hbto-qty-stepper {
      flex-shrink: 0;
      max-width: 130px;
    }
    .hbto-qty-stepper button {
      width: 34px;
      height: 50px;
      font-size: 16px;
    }
    .hbto-q-val {
      min-width: 24px;
      height: 50px;
      font-size: 14px;
    }
    .hbto-atc {
      flex: 1 1 0;
      min-width: 0;
      height: 50px;
      min-height: 50px;
      font-size: 11px;
      letter-spacing: 0.08em;
      gap: 6px;
      padding: 0 10px;
      white-space: nowrap;
    }
    .hbto-atc .hbto-total {
      font-size: 11px;
      padding: 4px 6px;
      letter-spacing: 0.02em;
    }
  }

  /* Extra-narrow phones (under 360px wide) */
  @media (max-width: 360px) {
    .hbto-atc-row { gap: 5px; }
    .hbto-qty-stepper { max-width: 110px; }
    .hbto-qty-stepper button { width: 30px; height: 48px; }
    .hbto-q-val { min-width: 20px; height: 48px; font-size: 13px; }
    .hbto-atc {
      height: 48px;
      min-height: 48px;
      font-size: 10px;
      letter-spacing: 0.06em;
      padding: 0 8px;
      gap: 5px;
    }
    .hbto-atc .hbto-total { font-size: 10px; padding: 3px 5px; }
  }



  /* ----- Customers Also Purchased ----- */


  .hbto-cap-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }


  .hbto-cap-img img {
    width: 100%;
    height: 100% !important;
    object-fit: cover;
  }
  .hbto-cap-body { flex: 1; min-width: 0; }

  .hbto-cap-subtitle {
    display: block;
    font-family: Lora, serif;
    font-style: italic;
    font-weight: 600;
    color: var(--hbto-coral);
    font-size: 14px;
  }

  .hbto-cap-add {
    flex-shrink: 0;
    width: 32px !important;
    height: 32px;
    border-radius: 50%;
    background: var(--hbto-bg-deep);
    color: #fff;
    font-size: 18px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.15s, transform 0.15s;
  }
  .hbto-cap-add:hover { background: var(--hbto-coral); transform: scale(1.06); }
  .hbto-cap-add.hbto-cap-added { background: #2BAA5E; }
  .hbto-cap-add:disabled { opacity: 0.6; cursor: default;     width: 100%;
    max-width: 48px;
    height: 48px;}

  .hbto-cap-soldout {
    flex-shrink: 0;
    font-size: 11px;
    font-weight: 600;
    color: var(--hbto-ink-mute);
    text-transform: uppercase;
    letter-spacing: 0.04em;
  }
  .hbto-cap-img--empty {
    background: var(--hbto-line-soft);
  }
  .hbto-cap-placeholder { opacity: 0.55; }
  .hbto-cap-skeleton { pointer-events: none; }
  .hbto-cap-title-skel,
  .hbto-cap-price-skel {
    display: block;
    background: var(--hbto-line-soft);
    border-radius: 4px;
    animation: hbto-cap-pulse 1.4s ease-in-out infinite;
  }
  .hbto-cap-title-skel { width: 70%; height: 14px; margin-bottom: 6px; }
  .hbto-cap-price-skel { width: 40%; height: 12px; }
  @keyframes hbto-cap-pulse {
    0%, 100% { opacity: 0.4; }
    50%      { opacity: 0.8; }
  }
  .hbto-cap-empty {
    font-family: Inter;
    font-size: 13px;
    color: var(--hbto-ink-mute);
    margin: 0;
  }
  /* ----- Trust badges ----- */
  .hbto-trust-mini {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-bottom: 18px;
  }
  .hbto-trust-mini > div {
    background: var(--hbto-paper);
    border: 1px solid var(--hbto-line);
    padding: 12px 10px;
    border-radius: var(--hbto-radius);
    text-align: center;
    font-size: 11px;
    line-height: 1.3;
    color: var(--hbto-bg-deep);
    font-weight: 500;
  }
  .hbto-trust-mini .hbto-ic {
    font-size: 20px;
    display: block;
    margin-bottom: 4px;
  }

  /* ----- Ship row ----- */
  .hbto-ship-row {
    display: flex;
    flex-direction: column;
    gap: 8px;
    background: transparent;
    border: unset !important;
    border-radius: unset !important;
    padding: 0 !important ;
  }
  .hbto-ship-row .hbto-line {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: var(--hbto-bg-deep);
  }
  .hbto-ship-row .hbto-ic {
    width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--hbto-coral);
    font-size: 14px;
    flex-shrink: 0;
  }
  .hbto-line--stock {
    display: flex;
    flex-direction: row !important;
    align-items: flex-start;
    gap: 4px;
    width: 100%;
  }
  .hbto-stock-status {
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .hbto-stock-indicator {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    background: #2DAA004D;
    border-radius: 100px;
    opacity: 1;
    flex-shrink: 0;
  }
  .hbto-stock-indicator__inner {
    display: block;
    width: 8px;
    height: 8px;
    background: #2DAA00;
    border-radius: 10000px;
  }
  .hbto-stock-label {
    font-family: Inter;
    font-weight: 700;
    font-style: normal;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0;
    color: #172D3A;
  }
  .hbto-stock-processing {
    margin: 0;
    padding: 0 0 0 28px;
    font-family: Inter;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0;
    color: #172D3A;
  }

  /* ============================================================
     Defensive overrides - fights theme CSS that wants to
     squish, color, or reposition our buttons and layout.
     ============================================================ */
.custom-main-prod.hbto-buy-box {
    width: 100%;
    max-width: 590px;
    padding: 0;
}
  .hbto-section .hbto-buy-box > * {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .hbto-section .hbto-atc-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 16px !important;
    margin-bottom: 14px !important;
  }
.custom-main-prod.hbto-bundles {
    display: flex !important;
    gap: 13px !important;
    align-items: flex-end;
    justify-content: space-between;
}
  .hbto-section .hbto-trust-mini {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
    width: 100% !important;
    float: none !important;
    clear: both !important;
    position: relative !important;
    margin-bottom: 18px !important;
  }
  .hbto-section .hbto-ship-row {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    float: none !important;
    clear: both !important;
    position: relative !important;
  }
  .hbto-section .hbto-atc,
  .hbto-section button.hbto-atc {
    background: var(--hbto-atc-bg) !important;
    background-color: var(--hbto-atc-bg) !important;
    background-image: none !important;
    color: var(--hbto-atc-text) !important;
    opacity: 1 !important;
    border: none !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 73px !important;
    text-transform: capitalize !important;
    box-shadow: none !important;
    font-weight: 700 !important;
    text-shadow: none !important;
    flex: 0 0 auto !important;
    width: 424px !important;
    max-width: calc(100% - 166px) !important;
    height: 62px !important;
    min-height: 62px !important;
    border-radius: 10000px !important;
    min-width: 0 !important;
  }
  .hbto-section .hbto-atc:hover {
    filter: brightness(0.92) !important;
    transform: translateY(-2px) !important;
  }
  .hbto-section .hbto-atc.hbto-added,
  .hbto-section button.hbto-atc.hbto-added {
    background: #2BAA5E !important;
    background-color: #2BAA5E !important;
  }
  .hbto-section .hbto-express,
  .hbto-section button.hbto-express {
    background: var(--hbto-express-bg) !important;
    background-color: var(--hbto-express-bg) !important;
    background-image: none !important;
    color: var(--hbto-express-text) !important;
    opacity: 1 !important;
    border: none !important;
    cursor: pointer !important;
    display: block !important;
    width: 100% !important;
    text-transform: uppercase !important;
    box-shadow: none !important;
    text-shadow: none !important;
    font-weight: 600 !important;
  }
  .hbto-section .hbto-express:hover {
    filter: brightness(1.15) !important;
  }
  .hbto-section .hbto-qty-stepper {
    flex: 0 0 auto !important;
    width: 150px !important;
    height: 62px !important;
    padding: 20px 24px !important;
    border: 1px solid #D6DDE2 !important;
    border-radius: 10000px !important;
    background: #FFFFFF !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    box-sizing: border-box !important;
  }
      @media (max-width: 1024px) {
        .custom-main-prod.hbto-gallery {
    width: 100%;
    max-width: 480px;
}
    button.custom-main-prod.hbto-gallery-arrow.hbto-gallery-arrow--prev {
    max-width: 40px;
    height: 40px;
    left: -13px;
}
button.custom-main-prod.hbto-gallery-arrow.hbto-gallery-arrow--next {
    max-width: 40px;
    height: 40px;
    right: -12px;
}

      }

    @media (max-width: 980px) {
      .hbto-bundle-label{

        margin-top:24px;
      }
    .hbto-product-grid { grid-template-columns: 1fr; gap: 32px; }

    .custom-main-prod.hbto-product-grid {
    flex-direction: column;
    gap:30px;
}
.hbto-lede{

  margin-bottom: 24px;
}
.custom-main-prod.hbto-gallery {
    margin: auto;
}
    .custom-main-prod.hbto-buy-box {
  
    max-width: 100%;
   
}
.custom-main-prod.hbto-bundles {
    max-width: 590px !important;
}
  }
    /* Tablet/mid breakpoint ribbon tighten */
  @media (max-width: 768px) {

.hbto-cap-item {
    gap: 12px;
}
.hbto-cap-wrap { 
    padding: 10px;
}
      .custom-main-prod.hbto-bundle-img img {
      width: 52px;
      height: 52px;
    }
.hbto-section .hbto-atc,
  .hbto-section button.hbto-atc {
    gap:51px !important;
  }
    .hbto-product-title{
      font-size:30px;
    }
      #shopify-section-{{ section.id }} .hbto-product-title em,
  #shopify-section-{{ section.id }} .hbto-product-title i,
  #shopify-section-{{ section.id }} .hbto-product-title u,
  #shopify-section-{{ section.id }} .hbto-product-title .hbto-product-title__highlight {
    
    font-size: 30px !important;
   
  }
    
    .hbto-product-price{
      font-size:20px;
    }

    .hbto-lede{
      font-size:15px;
    }

    .hbto-bundle .hbto-ribbon {
      max-width: calc(100% - 12px);
      font-size: 8px;
      letter-spacing: 0.08em;
      padding: 4px 9px;
    }
    

 .custom-asset1-accordion .metafield-rich_text_field p {
  font-size: 15px !important;
  }

  .custom-main-prod.hbto-gallery-thumbs {
      gap: 10px;
      margin-top: 16px;
  }
  .hbto-gallery-thumbs .hbto-thumb {
      width: 50px;
      height: 50px;
  }

  .custom-asset1-accordion .accordion-a.compact summary {
    padding: 30px 0 20px 0;
  }

  button.custom-main-prod.hbto-thumb-arrow.hbto-thumb-arrow--prev {
      left: -14em !important;
      top: 2em !important ;
  }
  button.custom-main-prod.hbto-thumb-arrow.hbto-thumb-arrow--next {
      right: -14em !important;
      top: 2em !important;
  }
  section.custom-main-prod.hbto-product {
      padding: 20px 0 60px;
  }

  button.custom-main-prod.hbto-thumb-arrow img {
      max-width: 20px !important;
      height: 20px;
  }
  }

  @media (max-width: 551px) {
    
button.custom-main-prod.hbto-bundle {
    padding: 12px 10px !important;
    text-align:center !important;
}
span.custom-main-prod.hbto-ribbon {
    height: 15px;
    border-radius: 4px;
    padding: 0 5px;
    font-size: 10px;
    letter-spacing: -0.2px;
    display: flex;
    align-items: center;
}
span.custom-main-prod.hbto-qty-display, span.custom-main-prod.hbto-qty-display span {
    margin-top: 12px;
	font-size: 13px;
}
span.custom-main-prod.hbto-price {
    font-size: 13px;
	}
	span.custom-main-prod.hbto-price-was {

    font-size: 12px;
	}
	.custom-main-prod.hbto-bundles {
   
    gap: 7px !important;
   
}

.hbto-bundles .hbto-bundle:nth-child(1) span.custom-main-prod.hbto-bundle-img {
    max-width: 53px;
    height: 58px;
}
.hbto-bundles .hbto-bundle:nth-child(2) span.custom-main-prod.hbto-bundle-img {
    max-width: 74.7px;
    height: 58px;
}
.hbto-bundles .hbto-bundle:nth-child(3) span.custom-main-prod.hbto-bundle-img {
   
    max-width: 89px;
    height: 58px;
   
}
  .hbto-bundles .hbto-bundle {
    display: flex !important;
    align-items: center !important;
    text-align: center !important;
  }
  .hbto-bundles .hbto-bundle .hbto-qty-display {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
  }
  .hbto-bundles .hbto-bundle .hbto-qty-display span {
    display: inline !important;
  }

  }
  @media (max-width: 425px) {
    .custom-main-prod.hbto-gallery-main {
        height: 350px;
    }
}
  @media (max-width: 390px) {
  .hbto-section .hbto-atc-row {
    display: flex !important;
    flex-direction: column !important;
  }
  }
/* END_SECTION:custom-asset1 */