0 10px 15px rgba(0, 0, 0, 0.1),
    0 4px 6px rgba(0, 0, 0, 0.1);
  position: relative;
  cursor: pointer;
  transition:
    box-shadow 0.15s ease,
    transform 0.15s ease;
}

/* ── Outer wrapper ── */
.hb-sub-wrap {
  position: relative;
  z-index: 1;
  max-width: 1536px;
  margin-left: auto;
  margin-right: auto;
  padding: 180px 32px 48px;
  font-family: "Plus Jakarta Sans", sans-serif;
  color: #3d2b1f;
}

/* ── Page heading ── */
.hb-page-title {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: clamp(24px, 3.5vw, 48px);
  font-weight: 600;
  color: #fff;
  text-align: center;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  margin: 0 0 14px;
  line-height: 1.2;
}
.hb-page-subtitle {
  font-size: 16px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.6);
  text-align: center;
  margin: 0 0 32px;
}

/* ── Selector box ── */
.hb-selector-box {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 32px;
  background: linear-gradient(148.72deg, #fff5f0 0%, #ffe8db 100%);
  border-radius: 24px;
  padding: 48px;
  box-shadow:
    0 20px 25px rgba(0, 0, 0, 0.1),
    0 8px 10px rgba(0, 0, 0, 0.1);
  margin-bottom: 32px;
}
.hb-col-left,
.hb-col-right {
  display: flex;
  flex-direction: column;
  align-self: stretch;
}
.hb-col-left {
  gap: 24px;
}
.hb-col-right {
  gap: 24px;
}

/* ── Step headers ── */
.hb-step-hdr {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex-shrink: 0;
}
.hb-step-num {
  font-size: 11px;
  font-weight: 700;
  color: rgba(61, 43, 31, 0.5);
}
.hb-step-title {
  font-size: 18px;
  font-weight: 700;
  color: #3d2b1f;
  margin: 0;
}

/* ── Size buttons ── */
.hb-size-btns {
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex: 1; /* stretch to fill available height, matching plan cards */
  min-height: 0; /* allow flexbox to shrink */
}
body.single-product .hb-sz-btn,
body.single-product .hb-sz-btn:hover,
body.single-product .hb-sz-btn:focus,
body.single-product .hb-sz-btn:active {
  color: #3d2b1f !important;
  background-color: rgba(255, 220, 190, 0.55) !important;
}
body.single-product .hb-sz-btn--active,
body.single-product .hb-sz-btn--active:hover,
body.single-product .hb-sz-btn--active:focus {
  color: #fff !important;
  background: linear-gradient(160deg, #f3b255 0%, #d48a28 100%) !important;
  background-color: #d48a28 !important;
}
.hb-sz-btn {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  padding: 11px 80px 11px 20px;
  position: relative;
  overflow: hidden;
  background: rgba(255, 220, 190, 0.55);
  border: none;
  border-radius: 9999px;
  cursor: pointer;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: #3d2b1f !important;
  -webkit-appearance: none;
  appearance: none;
  transition:
    transform 0.15s ease,
    box-shadow 0.15s ease,
    background 0.15s ease;
}
.hb-sz-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
  outline: none;
}
.hb-sz-btn--active,
.hb-sz-btn--active:hover,
.hb-sz-btn--active:focus {
  background: linear-gradient(160deg, #f3b255 0%, #d48a28 100%) !important;
  color: #fff !important;
  box-shadow: 0 4px 10px rgba(212, 138, 40, 0.25);
}
.hb-sz-btn--active:hover {
  transform: translateY(-2px);
}

/* ── Your Selection bar ── */
.hb-selection-bar {
  grid-column: 1 / -1;
  grid-row: 2;
  border-top: 2px solid rgba(61, 43, 31, 0.1);
  padding-top: 34px;
  margin-top: 32px;
}
.hb-sel-box {
  display: flex;
  align-items: center;
  gap: 24px;
  border: 4px solid #d48a28;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.6);
  padding: 32px 32px 32px 0;
  min-height: 144px;
}
.hb-sel-buddha {
  flex: 0 0 auto;
  width: 80px;
  height: calc(100% + 64px);
  min-height: 144px;
  object-fit: contain;
  object-position: center;
  opacity: 0.6;
  margin-top: -32px;
  margin-bottom: -32px;
}
.hb-sel-left {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
.hb-sel-heading {
  font-size: 14px;
  font-weight: 700;
  color: rgba(61, 43, 31, 0.5);
  text-transform: uppercase;
  letter-spacing: 0.7px;
}
.hb-sel-summary {
  display: flex;
  align-items: center;
  gap: 16px;
}
.hb-sel-icon {
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hb-sel-desc {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.hb-sel-size-text {
  font-size: 24px;
  font-weight: 700;
  color: #3d2b1f;
  line-height: 1.2;
}
.hb-sel-plan-text {
  font-size: 14px;
  font-weight: 400;
  color: rgba(61, 43, 31, 0.6);
}
.hb-sel-price-wrap {
  display: flex;
  align-items: baseline;
  gap: 4px;
}
.hb-sel-price {
  font-size: 32px;
  font-weight: 700;
  color: #3d2b1f;
  line-height: 1;
}
.hb-sel-per {
  font-size: 16px;
  font-weight: 400;
  color: rgba(61, 43, 31, 0.6);
}
.hb-sel-cta {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: linear-gradient(to bottom, #f3b255, #d48a28);
  color: #fff;
  border-radius: 9999px;
  padding: 16px 36px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  box-shadow:
    0 10px 15px rgba(0, 0, 0, 0.1),
    0 4px 6px rgba(0, 0, 0, 0.08);
  transition:
    opacity 0.15s ease,
    transform 0.15s ease;
}
.hb-sel-cta:hover {
  opacity: 0.9;
  transform: scale(1.02);
  color: #fff;
  text-decoration: none;
}

/* Disabled / coming-soon state */
.hb-sel-cta--disabled,
.hb-sel-cta[disabled] {
  background: rgba(61, 43, 31, 0.15);
  color: rgba(61, 43, 31, 0.4);
  box-shadow: none;
  cursor: not-allowed;
  border: none;
  pointer-events: none; /* button is non-interactive; wrapper shows tooltip */
}
.hb-sel-cta--disabled:hover,
.hb-sel-cta[disabled]:hover {
  opacity: 1;
  transform: none;
}

/* Tooltip wrapper — intercepts hover since button has pointer-events:none */
.hb-sel-cta-wrap {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
}
.hb-sel-cta-wrap::after {
  content: attr(data-tooltip);
  position: absolute;
  bottom: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  background: rgba(61, 43, 31, 0.9);
  color: #fff;
  font-size: 12px;
  font-weight: 500;
  padding: 6px 12px;
  border-radius: 8px;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s ease;
}
.hb-sel-cta-wrap::before {
  content: "";
  position: absolute;
  bottom: calc(100% + 4px);
  left: 50%;
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-top-color: rgba(61, 43, 31, 0.9);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s ease;
}
.hb-sel-cta-wrap:hover::after,
.hb-sel-cta-wrap:hover::before {
  opacity: 1;
}

/* ── Plan columns (3-column grid) ── */
.hb-plans {
  display: flex;
  gap: 16px;
  flex: 1; /* stretch to fill available height, matching size buttons */
  align-items: stretch;
  min-height: 0; /* allow flexbox to control height */
}
.hb-plan {
  display: flex;
  flex-direction: column;
  padding: 32px 24px;
  flex: 1; /* each card takes equal share of available space */
  background: rgba(255, 255, 255, 0.8);
  border: 2px solid rgba(61, 43, 31, 0.1);
  border-radius: 16px;
  overflow: visible;
  cursor: pointer;
  position: relative;
  min-width: 0; /* allow flexbox to shrink below content size */
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}
.hb-plan:hover {
  transform: translateY(-5px) scale(1.02);
  box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.2);
}
.hb-plan--featured {
  background: #fff;
  border-color: #d48a28;
  box-shadow:
    0 10px 15px rgba(0, 0, 0, 0.1),
    0 4px 6px rgba(0, 0, 0, 0.06);
}
/* Selected plan gets amber border + checkmark badge (same as featured) */
.hb-plan--selected {
  background: #fff;
  border-color: #d48a28;
  border-width: 4px;
  box-shadow:
    0 10px 15px rgba(0, 0, 0, 0.1),
    0 4px 6px rgba(0, 0, 0, 0.06);
}
.hb-plan--selected .hb-plan__check-badge {
  display: flex;
}

/* Best Value pill + check badge */
.hb-plan__best-pill {
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
  background: #d48a28;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  padding: 8px 16px;
  border-radius: 9999px;
  box-shadow:
    0 4px 6px rgba(0, 0, 0, 0.1),
    0 2px 4px rgba(0, 0, 0, 0.1);
  white-space: nowrap;
  pointer-events: none;
  z-index: 2;
}
.hb-plan__check-badge {
  display: none; /* hidden by default, shown when selected */
  position: absolute;
  top: -10px;
  right: -10px;
  width: 32px;
  height: 32px;
  background: #d48a28;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  padding: 6px;
  box-shadow:
    0 10px 15px rgba(0, 0, 0, 0.1),
    0 4px 6px rgba(0, 0, 0, 0.1);
  pointer-events: none;
  z-index: 2;
}

/* Badge header */
.hb-plan__badge {
  padding: 16px 12px;
  text-align: center;
  border-radius: 14px;
  line-height: 1.3;
  margin-bottom: 16px;
}
.hb-plan__badge--plain {
  background: rgba(61, 43, 31, 0.05);
  border-radius: 14px;
}
.hb-plan__badge--gold {
  background: linear-gradient(171.72deg, #f3b255 0%, #d48a28 100%);
}
.hb-plan__badge--tall {
  padding: 10px 12px 12px;
}
.hb-plan__label {
  display: block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  color: #3d2b1f;
}
.hb-plan__badge--gold .hb-plan__label {
  color: #fff;
}
.hb-plan__sublabel {
  display: block;
  font-size: 10px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.8);
  margin-top: 3px;
}

/* Price blocks */
.hb-plan__prices {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 14px 8px 0;
}
.hb-plan__prices--sm {
  padding-top: 8px;
}
.hb-plan__price-lg {
  font-size: 28px;
  font-weight: 700;
  color: #3d2b1f;
  line-height: 1;
}
.hb-plan__price-md {
  font-size: 16px;
  font-weight: 700;
  color: #3d2b1f;
  line-height: 1;
}
.hb-plan__per {
  font-size: 10px;
  font-weight: 500;
  color: rgba(61, 43, 31, 0.5);
  text-transform: uppercase;
  margin-top: 3px;
}

/* Delivery info */
.hb-plan__info {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 14px;
  margin: 10px 8px;
  border-top: 1px solid rgba(61, 43, 31, 0.05);
  border-bottom: 1px solid rgba(61, 43, 31, 0.05);
}
.hb-plan__info-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 500;
  color: rgba(61, 43, 31, 0.6);
}
.hb-plan__info-row svg {
  flex-shrink: 0;
}
.hb-plan__info-row--muted {
  color: rgba(61, 43, 31, 0.6);
}
.hb-plan__info-row--green {
  color: #4b6b44;
}

/* CTA */
.hb-plan__cta {
  padding: 10px 14px 14px;
  margin-top: auto;
}
.hb-cta {
  display: block;
  width: 100%;
  padding: 14px 4px;
  border-radius: 9999px;
  border: none;
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition:
    opacity 0.15s ease,
    transform 0.15s ease;
}
.hb-cta--plain {
  background: rgba(61, 43, 31, 0.05);
  color: #3d2b1f;
}
.hb-cta--plain:hover {
  background: rgba(61, 43, 31, 0.1);
  color: #3d2b1f;
  text-decoration: none;
}
.hb-cta--gold {
  background: linear-gradient(to bottom, #f3b255, #d48a28);
  color: #fff;
  box-shadow:
    0 4px 6px rgba(0, 0, 0, 0.1),
    0 2px 4px rgba(0, 0, 0, 0.08);
}
.hb-cta--gold:hover {
  opacity: 0.9;
  transform: scale(1.02);
  color: #fff;
  text-decoration: none;
}
.hb-cta--muted {
  opacity: 0.7;
}
.hb-price-ph {
  opacity: 0.6;
}

/* ── Compare Plans toggle ── */
.hb-compare-wrap {
  display: flex;
  justify-content: center;
  margin-top: 32px;
}
.hb-compare-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #3d2b1f !important;
  background-color: #3d2b1f !important;
  color: #fff;
  border: none;
  border-radius: 9999px;
  padding: 12px 28px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  box-shadow:
    0 4px 6px rgba(0, 0, 0, 0.12),
    0 2px 4px rgba(0, 0, 0, 0.08);
  transition: background 0.15s ease;
}
.hb-compare-btn:hover,
.hb-compare-btn:focus,
.hb-compare-btn:active {
  background: #2a1e15 !important;
  background-color: #2a1e15 !important;
  color: #fff;
}
.hb-chevron {
  transition: transform 0.35s ease;
}
.hb-compare-btn--open .hb-chevron {
  transform: rotate(180deg);
}

/* ── Comparison table (collapsible) ── */
.hb-compare-panel {
  max-height: 900px;
  overflow: hidden;
  transition: max-height 0.45s ease;
}
.hb-compare-panel--closed {
  max-height: 0;
}
.hb-compare-inner {
  background: linear-gradient(146.58deg, #fff 0%, #fff5f0 100%);
  border: 1px solid rgba(212, 138, 40, 0.2);
  border-radius: 24px;
  padding: 49px;
  margin-top: 32px;
  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.25);
}
.hb-compare-header {
  text-align: center;
  margin-bottom: 32px;
}
.hb-compare-title {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 32px;
  font-weight: 500;
  color: #3d2b1f;
  text-align: center;
  margin: 0 0 8px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
}
.hb-compare-subtitle {
  font-size: 14px;
  color: rgba(61, 43, 31, 0.6);
  margin: 0;
}
.hb-compare-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.hb-compare-table {
  width: 100%;
  min-width: 700px;
  border-collapse: collapse;
  border: none;
  border-spacing: 0;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
}
.hb-compare-table thead,
.hb-compare-table tbody,
.hb-compare-table tr,
.hb-compare-table th,
.hb-compare-table td {
  border: none;
  border-top: none;
  border-bottom: none;
  border-left: none;
  border-right: none;
}

/* Table header */
.hb-compare-table thead {
  border: none;
}
.hb-compare-table thead th {
  padding: 0 12px 16px;
  text-align: center;
  font-weight: 400;
  vertical-align: top;
  border: none !important;
}

.hb-th-feat-pill {
  display: inline-block;
  background: rgba(61, 43, 31, 0.05);
  padding: 12px 16px;
  border-radius: 14px;
  font-weight: 600;
  color: #3d2b1f;
}
.hb-th-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 16px;
  border-radius: 16px;
  min-height: 72px;
  justify-content: center;
}
.hb-th-cell--plain {
  background: rgba(61, 43, 31, 0.05);
}
.hb-th-cell--gold {
  background: linear-gradient(162.59deg, #f3b255 0%, #d48a28 100%);
  box-shadow:
    0 10px 15px rgba(0, 0, 0, 0.1),
    0 4px 6px rgba(0, 0, 0, 0.1);
  position: relative;
  min-height: 80px;
}
.hb-th-cell--goldm {
  background: linear-gradient(
    162.69deg,
    rgba(243, 178, 85, 0.7) 0%,
    rgba(212, 138, 40, 0.7) 100%
  );
}
.hb-th-cell--best {
  padding-top: 24px;
}
.hb-th-best-pill {
  position: absolute;
  top: -8px;
  left: 50%;
  transform: translateX(-50%);
  background: #bd0916;
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  padding: 8px 16px;
  border-radius: 9999px;
  text-transform: uppercase;
  letter-spacing: 0.45px;
  box-shadow:
    0 4px 6px rgba(0, 0, 0, 0.1),
    0 2px 4px rgba(0, 0, 0, 0.1);
  white-space: nowrap;
}
.hb-th-title {
  font-size: 14px;
  font-weight: 700;
  color: #3d2b1f;
}
.hb-th-cell--gold .hb-th-title,
.hb-th-cell--goldm .hb-th-title {
  color: #fff;
}
.hb-th-sub {
  font-size: 12px;
  font-weight: 700;
  color: rgba(61, 43, 31, 0.6);
}
.hb-th-cell--gold .hb-th-sub,
.hb-th-cell--goldm .hb-th-sub {
  color: rgba(255, 255, 255, 0.9);
}

/* Table body */
.hb-compare-table__row-header {
  padding: 12px;
}
.hb-compare-table__label {
  padding-left: 24px;
}
.hb-td-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: rgba(75, 107, 68, 0.1);
  border-radius: 10px;
  flex-shrink: 0;
  margin-right: 8px;
}
.hb-td-icon svg {
  width: 16px;
  height: 16px;
}
.hb-compare-table tbody td {
  padding: 20px 12px;
  text-align: center;
  color: rgba(61, 43, 31, 0.7);
  vertical-align: middle;
  border: none;
  border-top: none;
  border-bottom: none;
}
.hb-compare-table tbody td:first-child {
  padding-left: 24px;
  text-align: left;
  gap: 12px;
}
.hb-compare-table tbody tr {
  height: 65px;
}
.hb-compare-table tbody tr:nth-child(4) {
  height: 77px;
}
.hb-compare-table tbody tr:last-child {
  height: 72px;
}
.hb-tr--alt {
  background: rgba(75, 107, 68, 0.02);
}
.hb-tr--alt td,
.hb-tr--alt th {
  background: rgba(75, 107, 68, 0.02);
}
.hb-td-muted {
  color: rgba(61, 43, 31, 0.5) !important;
}
.hb-td-faded {
  color: rgba(61, 43, 31, 0.3) !important;
}

/* Pill values */
.hb-td-pill {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 10px;
  font-size: 14px;
}
.hb-td-pill--amber {
  background: rgba(212, 138, 40, 0.1);
  color: #3d2b1f;
}
.hb-td-pill--white {
  background: rgba(255, 255, 255, 0.5);
  color: #3d2b1f;
}
.hb-td-pill--gray {
  background: rgba(61, 43, 31, 0.05);
  color: rgba(61, 43, 31, 0.7);
}
.hb-td-pill--amberlt {
  background: linear-gradient(
    171deg,
    rgba(243, 178, 85, 0.2) 0%,
    rgba(212, 138, 40, 0.2) 100%
  );
  color: #3d2b1f;
}

/* Check and X icons */
.hb-td-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: #4b6b44;
  border-radius: 50%;
  box-shadow:
    0 4px 6px rgba(0, 0, 0, 0.1),
    0 2px 4px rgba(0, 0, 0, 0.1);
}
.hb-td-check svg {
  width: 12px;
  height: 9px;
}
.hb-td-no-x {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: rgba(61, 43, 31, 0.05);
  border-radius: 50%;
  font-size: 16px;
  font-weight: 700;
  color: rgba(61, 43, 31, 0.3);
}

/* Discount badges */
.hb-td-discount {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  padding: 6px 12px;
  border-radius: 10px;
  background: linear-gradient(
    148deg,
    rgba(243, 178, 85, 0.2) 0%,
    rgba(212, 138, 40, 0.2) 100%
  );
  font-size: 12px;
  color: rgba(61, 43, 31, 0.6);
}
.hb-td-discount strong {
  font-size: 18px;
  font-weight: 700;
  color: #d48a28;
}

/* Footer */
.hb-compare-footer {
  margin-top: 25px;
  padding-top: 25px;
  border-top: 1px solid rgba(61, 43, 31, 0.1);
  text-align: center;
}
.hb-compare-footer p {
  font-size: 14px;
  color: rgba(61, 43, 31, 0.7);
  margin: 0;
}
.hb-compare-link {
  color: #4b6b44;
  font-weight: 600;
  text-decoration: none;
}
.hb-compare-link:hover {
  text-decoration: underline;
}

/* ── Features bar ── */
.hb-feats {
  background: linear-gradient(
    169.29deg,
    rgba(255, 255, 255, 0.9) 0%,
    rgba(255, 255, 255, 0.6) 100%
  );
  border-radius: 16px;
  padding: 32px;
  margin-top: 32px;
  box-shadow:
    0 10px 15px rgba(0, 0, 0, 0.08),
    0 4px 6px rgba(0, 0, 0, 0.05);
}
.hb-feats__title {
  font-size: clamp(16px, 2vw, 24px);
  font-weight: 600;
  color: #3d2b1f;
  text-align: center;
  margin: 0 0 28px;
}
.hb-feats__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.hb-feat {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 8px;
}
.hb-feat__icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: linear-gradient(135deg, #4b6b44 0%, #3d5a38 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.hb-feat__name {
  font-size: 16px;
  font-weight: 600;
  color: #3d2b1f;
}
.hb-feat__sub {
  font-size: 14px;
  color: rgba(61, 43, 31, 0.6);
}

/* ── Responsive ── */
@media (max-width: 1100px) {
  .hb-selector-box {
    grid-template-columns: 240px 1fr;
    padding: 32px;
    gap: 24px;
  }
  .hb-sel-left {
    padding-left: 8%;
  }
}
@media (max-width: 860px) {
  .hb-selector-box {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .hb-col-left,
  .hb-col-right,
  .hb-selection-bar {
    grid-row: auto;
  }
  /* Reset flex heights on mobile - let content define height */
  .hb-size-btns,
  .hb-plans {
    flex: none;
  }
  .hb-sz-btn {
    flex: none;
    min-height: 140px;
  }
  .hb-plan {
    flex: none;
  }
  .hb-sel-buddha {
    display: none; /* hide on tablet/mobile */
  }
  .hb-sel-left {
    padding-left: 0;
  }
  .hb-feats__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 600px) {
  .hb-plans {
    flex-direction: column;
    gap: 28px;
  }
  .hb-selector-box {
    padding: 24px;
  }
  .hb-sel-box {
    flex-direction: column;
    align-items: stretch;
    gap: 20px;
    text-align: center;
  }
  .hb-sel-left {
    align-items: center;
  }
  .hb-sel-summary {
    justify-content: center;
  }
  .hb-sel-cta-wrap {
    width: 100%;
  }
  .hb-sel-cta {
    width: 100%;
    justify-content: center;
  }
}
@media (max-width: 480px) {
  .hb-sub-wrap {
    padding: 80px 16px 32px;
  }
  .hb-feats__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .hb-sz-btn {
    padding-right: 70px;
  }
}

/* ============================================================
   Happy Buddha — Cart Page Styles
   ============================================================ */

/* ── Empty Cart ── */
.hb-cart-empty {
  position: relative;
  z-index: 1;
  max-width: 848px;
  padding: 48px;
  background: linear-gradient(157deg, #fff5f0 0%, #ffe8db 100%);
  border-radius: 24px;
  box-shadow:
    0 20px 25px rgba(0, 0, 0, 0.1),
    0 8px 10px rgba(0, 0, 0, 0.1);
  text-align: center;
  align-self: center;
}
.hb-cart-empty__icon {
  width: 80px;
  height: 80px;
  margin: 0 auto 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hb-cart-empty__icon .fa-solid {
  font-size: 48px;
  color: rgba(61, 43, 31, 0.4);
}
.hb-cart-empty__title {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 28.8px;
  font-weight: 500;
  color: #3d2b1f;
  text-transform: uppercase;
  letter-spacing: 0.72px;
  margin: 0 0 16px;
}
.hb-cart-empty__text {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 16px;
  color: rgba(61, 43, 31, 0.6);
  margin: 0 0 32px;
}
.hb-cart-empty__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%);
  color: #fff;
  padding: 14px 32px;
  border-radius: 9999px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.7px;
  text-decoration: none;
  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
  transition: transform 0.15s ease;
}
.hb-cart-empty__cta:hover {
  color: #fff;
  text-decoration: none;
  transform: scale(1.02);
}

/* ── Cart Layout ──
   Wrapper CSS unified in layout.css */
.hb-cart-grid {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 32px;
  flex: 1;
}
.hb-cart-title {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 38.4px;
  font-weight: 500;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.96px;
  margin: 0 0 32px;
}

/* ── Cart Item Card ── */
.hb-cart-items {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.hb-cart-item {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 24px;
  background: linear-gradient(166deg, #fff5f0 0%, #ffe8db 100%);
  border-radius: 16px;
  box-shadow:
    0 10px 15px rgba(0, 0, 0, 0.1),
    0 4px 6px rgba(0, 0, 0, 0.1);
  margin-bottom: 16px;
}
.hb-cart-item:last-of-type {
  margin-bottom: 0;
}
.hb-cart-item__img {
  width: 80px;
  height: auto;
  flex-shrink: 0;
}
.hb-cart-item__img img {
  max-width: 100%;
  height: auto;
}
.hb-cart-item__info {
  flex: 1;
}
.hb-cart-item__name {
  font-size: 18px;
  font-weight: 700;
  color: #3d2b1f;
  margin: 0 0 4px;
}
.hb-cart-item__name a {
  color: #3d2b1f;
  text-decoration: none;
}
.hb-cart-item__name a:hover {
  text-decoration: underline;
}
.hb-cart-item__plan {
  font-size: 14px;
  color: rgba(61, 43, 31, 0.6);
  margin: 0 0 4px;
}
.hb-cart-item__plan span {
  color: #d48a28;
  font-weight: 600;
}
.hb-cart-item__meta {
  font-size: 14px;
  color: rgba(61, 43, 31, 0.6);
  margin: 0 0 4px;
}
.hb-cart-item__meta .variation {
  display: inline;
}
.hb-cart-item__price {
  font-size: 20px;
  font-weight: 700;
  color: #3d2b1f;
  margin: 0;
}
.hb-cart-item__qty {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* ── Quantity Controls ── */
.hb-qty {
  display: flex;
  align-items: center;
  background: #fff;
  border: 1px solid rgba(61, 43, 31, 0.1);
  border-radius: 9999px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
.hb-qty__btn {
  width: 28px;
  height: 32px;
  border: none;
  background: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  flex-shrink: 0;
}
.hb-qty__btn:hover {
  background: rgba(61, 43, 31, 0.05);
}
.hb-qty__input {
  width: 24px;
  height: 32px;
  text-align: center;
  border: none !important;
  font-weight: 700;
  font-size: 16px;
  color: #3d2b1f;
  background: transparent;
  padding: 0 !important;
  -moz-appearance: textfield;
  outline: none;
  box-shadow: none;
}
.hb-qty__input::-webkit-outer-spin-button,
.hb-qty__input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.hb-cart-item__remove {
  width: 36px;
  height: 36px;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: background 0.15s ease;
}
.hb-cart-item__remove:hover {
  background: rgba(61, 43, 31, 0.05);
}

/* ── Cart Actions ── */
.hb-cart-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 16px;
}
.hb-cart-continue {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  transition: opacity 0.15s ease;
}
.hb-cart-continue:hover {
  color: #fff;
  opacity: 0.9;
}
.hb-cart-clear {
  color: rgba(255, 255, 255, 0.8);
  background: none;
  border: none;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  padding: 0;
  transition: color 0.15s ease;
}
.hb-cart-clear:hover {
  color: #fff;
}

/* ── Order Summary ── */
.hb-cart-summary {
  background: linear-gradient(139deg, #fff 0%, #fff5f0 100%);
  border: 1px solid rgba(212, 138, 40, 0.2);
  border-radius: 16px;
  padding: 24px;
  box-shadow:
    0 20px 25px rgba(0, 0, 0, 0.1),
    0 8px 10px rgba(0, 0, 0, 0.1);
  height: fit-content;
}
.hb-cart-summary__title {
  font-size: 18px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.9px;
  color: #3d2b1f;
  margin: 0 0 24px;
}
.hb-summary-rows {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.hb-summary-row {
  display: flex;
  justify-content: space-between;
  padding: 4px 0;
  font-size: 14px;
  color: rgba(61, 43, 31, 0.7);
}
.hb-summary-total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding-top: 18px;
  margin-top: 12px;
  border-top: 2px solid rgba(61, 43, 31, 0.1);
}
.hb-summary-total span:first-child {
  font-size: 20px;
  font-weight: 700;
  color: #3d2b1f;
}
.hb-summary-total span:last-child {
  font-size: 20px;
  font-weight: 700;
  color: #3d2b1f;
}
.hb-summary-total .amount {
  font-size: 20px;
  font-weight: 700;
}
.hb-cart-summary .hb-btn--full {
  margin-top: 24px;
}
/* ── Cart Checkout Button — commented out, uses components.css ── */
/*
.hb-cart-summary a.hb-btn--primary,
.hb-cart-summary .hb-btn--primary {
  display: flex;
  width: 100%;
  height: 56px;
  padding: 0 32px;
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%) !important;
  color: #fff !important;
  border-radius: 9999px;
  border: none;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.7px;
  text-decoration: none;
  text-align: center;
  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1), 0 4px 6px rgba(0, 0, 0, 0.1);
  cursor: pointer;
  transition: transform 0.15s ease, opacity 0.15s ease;
}

.hb-cart-summary a.hb-btn--primary:hover,
.hb-cart-summary .hb-btn--primary:hover {
  color: #fff !important;
  text-decoration: none;
  transform: scale(1.02);
  opacity: 0.93;
}

.hb-cart-checkout-btn {
  display: block;
  width: 100%;
  padding: 16px;
  margin-top: 24px;
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%);
  color: #fff;
  border-radius: 9999px;
  text-align: center;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.7px;
  text-decoration: none;
  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
  transition: transform 0.15s ease;
}
.hb-cart-checkout-btn:hover {
  color: #fff;
  text-decoration: none;
  transform: scale(1.02);
}
*/
.hb-cart-secure {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 12px;
  color: rgba(61, 43, 31, 0.4);
  text-align: center;
  margin: 16px 0 0;
}

/* ── Cart Responsive ── */
@media (max-width: 900px) {
  .hb-cart-grid {
    grid-template-columns: 1fr;
  }
  .hb-cart-summary {
    order: -1;
    margin-bottom: 16px;
  }
}
@media (max-width: 600px) {
  .hb-cart-item {
    flex-direction: column;
    text-align: center;
  }
  .hb-cart-item__img {
    margin: 0 auto;
  }
  .hb-cart-item__qty {
    justify-content: center;
  }
  .hb-cart-actions {
    /* flex-direction: column; */
    gap: 16px;
    text-align: center;
  }
}

/* ============================================================
   Happy Buddha — My Account Page Styles (Figma: node 18:5132)
   Palette: #fff5f0 cream · #3d2b1f brown · #4b6b44 green
            #b87d2b/#d48a28 amber · #D81F29 red
   ============================================================ */

/* ── Account Layout ──
   Wrapper CSS unified in layout.css */

/* ── Account Header ── */
.hb-account-header {
  margin-bottom: 48px;
}
.hb-account-title {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 38.4px;
  font-weight: 500;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.96px;
  margin: 0 0 8px;
}
.hb-account-subtitle {
  font-size: 16px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.8);
  margin: 0;
}

/* ── Account Grid ── */
.hb-account-grid {
  display: grid;
  grid-template-columns: 256px 1fr;
  gap: 32px;
  flex: 1;
}

/* ── Account Sidebar ── */
.hb-account-sidebar {
  flex-shrink: 0;
}
.hb-account-nav {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 16px;
  width: 100%;
  box-sizing: border-box;
  background: linear-gradient(131.85deg, #fff5f0 0%, #ffe8db 100%);
  border-radius: 16px;
  box-shadow:
    0 10px 15px rgba(0, 0, 0, 0.1),
    0 4px 6px rgba(0, 0, 0, 0.1);
}
.hb-account-nav__btn {
  position: relative;
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  box-sizing: border-box;
  height: 44px;
  padding: 0 16px;
  border-radius: 14px;
  text-decoration: none;
  transition: all 0.15s ease;
  border: none;
  background: transparent;
  cursor: pointer;
  font-family: inherit;
}
.hb-account-nav__btn:hover {
  background: rgba(61, 43, 31, 0.05);
}
.hb-account-nav__btn--active {
  background: #fff;
  box-shadow:
    0 4px 6px rgba(0, 0, 0, 0.1),
    0 2px 4px rgba(0, 0, 0, 0.1);
}
.hb-account-nav__icon {
  width: 16px;
  height: 16px;
  font-size: 16px;
  flex-shrink: 0;
  color: rgba(61, 43, 31, 0.5);
  text-align: center;
  line-height: 1;
}
.hb-account-nav__btn--active .hb-account-nav__icon {
  color: #3d2b1f;
}
.hb-account-nav__label {
  flex: 1;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  color: rgba(61, 43, 31, 0.6);
}
.hb-account-nav__btn--active .hb-account-nav__label {
  font-weight: 700;
  color: #3d2b1f;
}
.hb-account-nav__btn--logout {
  margin-top: 8px;
  border-top: 1px solid rgba(61, 43, 31, 0.1);
  color: rgba(180, 60, 60, 0.7);
}
.hb-account-nav__btn--logout:hover {
  background: rgba(180, 60, 60, 0.06);
  color: #b43c3c;
}
.hb-account-nav__btn--logout .hb-account-nav__icon {
  color: inherit;
}
.hb-account-nav__btn--logout .hb-account-nav__label {
  color: inherit;
}
.hb-account-nav__check {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  font-size: 16px;
  color: #4b6b44;
}

/* ── Account Content ── */
.hb-account-content {
  flex: 1;
}

/* ── Section Header ── */
.hb-section-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 24px;
}
.hb-section-icon {
  font-size: 20px;
  color: #fff;
}
.hb-section-title {
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  margin: 0;
}

/* ── Subscription Card ── */
.hb-subscription-card {
  display: flex;
  align-items: flex-start;
  gap: 24px;
  padding: 24px;
  background: linear-gradient(168.5deg, #fff5f0 0%, #ffe8db 100%);
  border-radius: 16px;
  box-shadow:
    0 10px 15px rgba(0, 0, 0, 0.1),
    0 4px 6px rgba(0, 0, 0, 0.1);
}
.hb-sub-card__img {
  width: 80px;
  height: auto;
  flex-shrink: 0;
}
.hb-sub-card__img img {
  max-width: 100%;
  height: auto;
}
.hb-sub-card__info {
  flex: 1;
}
.hb-sub-card__header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 4px;
}
.hb-sub-card__name {
  font-size: 18px;
  font-weight: 700;
  color: #3d2b1f;
  margin: 0;
}
.hb-sub-card__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 12px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  border-radius: 9999px;
}
.hb-sub-card__badge--active {
  color: #4b6b44;
  background: rgba(75, 107, 68, 0.1);
}
.hb-sub-card__plan {
  font-size: 14px;
  color: rgba(61, 43, 31, 0.6);
  margin: 0 0 16px;
}
.hb-sub-card__plan-name {
  color: #d48a28;
  font-weight: 600;
}
.hb-sub-card__dates {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 16px;
}
.hb-sub-card__date {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: rgba(61, 43, 31, 0.5);
}
.hb-sub-card__date i {
  font-size: 16px;
  width: 16px;
  text-align: center;
}
.hb-sub-card__date--next {
  color: #4b6b44;
  font-weight: 600;
}
.hb-sub-card__price {
  margin: 0;
}
.hb-sub-card__amount {
  font-size: 20px;
  font-weight: 700;
  color: #3d2b1f;
}
.hb-sub-card__freq {
  font-size: 14px;
  color: rgba(61, 43, 31, 0.5);
}

/* ── Subscription Actions ── */
.hb-sub-card__actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}
.hb-sub-card__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 16px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  border-radius: 9999px;
  border: 2px solid;
  background: transparent;
  cursor: pointer;
  transition: all 0.15s ease;
  font-family: inherit;
}
.hb-sub-card__btn svg {
  width: 14px;
  height: 14px;
}
.hb-sub-card__btn i {
  font-size: 14px;
}
.hb-sub-card__btn--pause {
  color: #d48a28;
  border-color: rgba(212, 138, 40, 0.3);
}
.hb-sub-card__btn--pause:hover {
  background: rgba(212, 138, 40, 0.1);
  border-color: rgba(212, 138, 40, 0.5);
}
.hb-sub-card__btn--cancel {
  color: rgba(189, 9, 22, 0.7);
  border-color: rgba(189, 9, 22, 0.2);
}
.hb-sub-card__btn--cancel:hover {
  background: rgba(189, 9, 22, 0.1);
  border-color: rgba(189, 9, 22, 0.4);
}

/* ── No Subscriptions Message ── */
.hb-no-subscriptions {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
  margin-top: 24px;
}
.hb-no-subscriptions a {
  color: #fff;
  font-weight: 600;
}
.hb-subscriptions-note {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.5);
  margin-top: 16px;
}

/* ── Account Section Content (WooCommerce default styles integration) ── */
.hb-account-section {
  /* Override WooCommerce default table styles within account section */
}
/* ── Order History Cards ── */
.hb-orders-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.hb-order-card {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 24px;
  background: linear-gradient(170.98deg, #fff5f0 0%, #ffe8db 100%);
  border-radius: 16px;
  box-shadow:
    0 10px 15px rgba(0, 0, 0, 0.1),
    0 4px 6px rgba(0, 0, 0, 0.1);
  position: relative;
  cursor: pointer;
  transition:
    box-shadow 0.15s ease,
    transform 0.15s ease;
}
.hb-order-card:hover {
  box-shadow:
    0 14px 20px rgba(0, 0, 0, 0.13),
    0 6px 10px rgba(0, 0, 0, 0.1);
  transform: translateY(-1px);
}

/* Stretched link — invisible anchor covering the full card */
.hb-order-card__area-link {
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: 16px;
}
.hb-order-card__area-link:focus-visible {
  outline: 2px solid #d48a28;
  outline-offset: -2px;
}

/* Keep interactive elements above the stretched link */
.hb-order-card__copy,
.hb-order-card__btn {
  position: relative;
  z-index: 1;
}
.hb-order-card__img {
  flex-shrink: 0;
  width: 80px;
}
.hb-order-card__thumb {
  width: 80px;
  height: 80px;
  object-fit: cover;
  border-radius: 8px;
  display: block;
}
.hb-order-card__body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.hb-order-card__row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.hb-order-card__number {
  font-size: 18px;
  font-weight: 700;
  line-height: 28px;
  color: #3d2b1f;
}
.hb-order-card__badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 10px;
  border-radius: 100px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  font-family: "Plus Jakarta Sans", sans-serif;
}
.hb-order-card__badge--delivered {
  background: rgba(144, 192, 144, 0.4);
  color: #1a1a1a;
}
.hb-order-card__badge--processing {
  background: rgba(147, 197, 253, 0.4);
  color: #1a1a1a;
}
.hb-order-card__badge--on-hold {
  background: rgba(252, 211, 77, 0.4);
  color: #1a1a1a;
}
.hb-order-card__badge--pending,
.hb-order-card__badge--cancelled,
.hb-order-card__badge--refunded,
.hb-order-card__badge--failed,
.hb-order-card__badge--default {
  background: rgba(61, 43, 31, 0.08);
  color: rgba(61, 43, 31, 0.6);
}
.hb-order-card__desc {
  font-size: 14px;
  line-height: 20px;
  color: rgba(61, 43, 31, 0.7);
}
.hb-order-card__type {
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  color: #d48a28;
}
.hb-order-card__date,
.hb-order-card__tracking {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  line-height: 16px;
  color: rgba(61, 43, 31, 0.5);
}
.hb-order-card__tracking-num {
  font-weight: 600;
  color: #4b6b44;
}
.hb-order-card__copy {
  display: inline-flex;
  align-items: center;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  color: rgba(61, 43, 31, 0.4);
  transition: color 0.15s ease;
}
.hb-order-card__copy:hover {
  color: rgba(61, 43, 31, 0.7);
}
.hb-order-card__aside {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
}
.hb-order-card__price {
  font-size: 20px;
  font-weight: 700;
  line-height: 30px;
  color: #3d2b1f;
}
.hb-order-card__price .woocommerce-Price-amount {
  font-size: inherit;
  font-weight: inherit;
  color: inherit;
}
.hb-order-card__items {
  font-size: 12px;
  line-height: 16px;
  color: rgba(61, 43, 31, 0.4);
}
.hb-order-card__btn {
  display: inline-flex;
  align-items: center;
  margin-top: 4px;
  padding: 6px 14px;
  border-radius: 100px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  text-decoration: none;
  border: 1.5px solid;
  background: none;
  cursor: pointer;
  transition: background 0.15s ease;
}
.hb-order-card__btn--reorder {
  color: #d48a28;
  border-color: #d48a28;
}
.hb-order-card__btn--reorder:hover {
  background: rgba(212, 138, 40, 0.08);
  color: #d48a28;
}
.hb-order-card__btn--track {
  color: #4b6b44;
  border-color: #4b6b44;
}
.hb-order-card__btn--track:hover {
  background: rgba(75, 107, 68, 0.08);
  color: #4b6b44;
}
.hb-orders-empty {
  color: rgba(255, 255, 255, 0.8);
  font-size: 15px;
}
.hb-orders-empty a {
  color: #fff;
  text-decoration: underline;
  margin-left: 6px;
}
.hb-orders-pagination {
  margin-top: 8px;
  display: flex;
  justify-content: center;
}
.hb-orders-pagination .page-numbers {
  display: inline-flex;
  gap: 6px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.hb-orders-pagination .page-numbers li a,
.hb-orders-pagination .page-numbers li span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.8);
  text-decoration: none;
  background: rgba(255, 255, 255, 0.15);
  transition: background 0.15s ease;
}
.hb-orders-pagination .page-numbers li .current,
.hb-orders-pagination .page-numbers li a:hover {
  background: rgba(255, 255, 255, 0.35);
  color: #fff;
}

/* ── Order Card Responsive ── */
@media (max-width: 600px) {
  .hb-order-card {
    flex-direction: column;
    gap: 12px;
    padding: 16px;
  }

  .hb-order-card__img {
    display: none;
  }

  .hb-order-card__body {
    width: 100%;
  }

  .hb-order-card__aside {
    width: 100%;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding-top: 12px;
    border-top: 1px solid rgba(61, 43, 31, 0.1);
  }

  .hb-order-card__number {
    font-size: 16px;
  }

  .hb-order-card__price {
    font-size: 18px;
  }

  .hb-order-card__row {
    flex-wrap: wrap;
    gap: 6px;
  }
}

/* ── Order Detail Page ── */
.hb-order-detail {
  max-width: 720px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  font-family: "Plus Jakarta Sans", sans-serif;
  padding: 148px 24px 64px;
  margin: 0 auto;
}
.hb-order-detail__back-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 600;
  color: #3d2b1f;
  text-decoration: none;
  transition: color 0.15s ease;
}
.hb-order-detail__back-link:hover {
  color: #5a4a3a;
}
.hb-order-detail__header {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.hb-order-detail__title-row {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.hb-order-detail__number {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 28px;
  font-weight: 700;
  color: #3d2b1f;
  text-transform: uppercase;
  letter-spacing: 0.7px;
  margin: 0;
}
.hb-order-detail__date {
  font-size: 14px;
  color: #5a4a3a;
  margin: 0;
}
.hb-order-detail__card {
  background: linear-gradient(170.98deg, #fff5f0 0%, #ffe8db 100%);
  border-radius: 16px;
  padding: 24px;
  box-shadow:
    0 10px 15px rgba(0, 0, 0, 0.1),
    0 4px 6px rgba(0, 0, 0, 0.1);
}
.hb-order-detail__section-title {
  font-size: 16px;
  font-weight: 700;
  color: #3d2b1f;
  margin: 0 0 16px;
}
.hb-order-detail__items {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.hb-order-detail__item {
  display: flex;
  align-items: center;
  gap: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(61, 43, 31, 0.1);
}
.hb-order-detail__item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.hb-order-detail__item-img {
  flex-shrink: 0;
  width: 60px;
}
.hb-order-detail__thumb {
  width: 60px;
  height: 60px;
  object-fit: cover;
  border-radius: 8px;
  display: block;
}
.hb-order-detail__item-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.hb-order-detail__item-name {
  font-size: 14px;
  font-weight: 600;
  color: #3d2b1f;
  line-height: 20px;
}
.hb-order-detail__item-qty {
  font-size: 12px;
  color: rgba(61, 43, 31, 0.5);
}
.hb-order-detail__item-total {
  font-size: 16px;
  font-weight: 700;
  color: #3d2b1f;
  flex-shrink: 0;
}
.hb-order-detail__totals {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(61, 43, 31, 0.1);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.hb-order-detail__total-row {
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  color: rgba(61, 43, 31, 0.7);
}
.hb-order-detail__total-row--grand {
  font-size: 18px;
  font-weight: 700;
  color: #3d2b1f;
  padding-top: 8px;
  border-top: 1px solid rgba(61, 43, 31, 0.15);
  margin-top: 4px;
}
.hb-order-detail__addresses {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.hb-order-detail__address {
  font-size: 14px;
  line-height: 22px;
  color: rgba(61, 43, 31, 0.7);
  font-style: normal;
}
.hb-order-detail__actions {
  display: flex;
  gap: 12px;
}

/* ── Section header back link ── */
.hb-section-header {
  display: flex;
  align-items: center;
  gap: 10px;
}
.hb-section-back {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  transition: color 0.15s;
}
.hb-section-back:hover {
  color: #fff;
}
.hb-section-back svg {
  transform: rotate(180deg);
}

/* ── Order Detail — reset standalone-page spacing when inside a tab ── */
.hb-account-section .hb-order-detail {
  padding: 0;
  max-width: none;
  margin: 0;
}

/* ── Order Detail — extended styles (view-order.php) ── */

/* Header card */
.hb-order-detail__card--header {
  background: linear-gradient(170.98deg, #fff5f0 0%, #ffe8db 100%);
  border: none;
  box-shadow:
    0 10px 15px rgba(0, 0, 0, 0.1),
    0 4px 6px rgba(0, 0, 0, 0.1);
}

/* Meta row — chips below the order number */
.hb-order-detail__meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 10px;
}
.hb-order-detail__meta-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 13px;
  color: #3d2b1f;
  background: rgba(61, 43, 31, 0.08);
  border-radius: 20px;
  padding: 4px 12px 4px 8px;
}
.hb-order-detail__meta-item svg {
  color: #5a4a3a;
  flex-shrink: 0;
}
.hb-order-detail__tracking {
  gap: 6px;
}
.hb-order-detail__tracking-num {
  font-weight: 600;
  color: #3d2b1f;
}

/* Section title icon alignment */
.hb-order-detail__section-title {
  display: flex;
  align-items: center;
  gap: 7px;
}
.hb-order-detail__section-title svg {
  flex-shrink: 0;
  color: #9d5f35;
}

/* Item — SKU and meta */
.hb-order-detail__item-sku {
  font-size: 11px;
  color: rgba(61, 43, 31, 0.4);
  font-family: monospace;
}
.hb-order-detail__item-meta {
  font-size: 12px;
  color: rgba(61, 43, 31, 0.55);
}
.hb-order-detail__item-meta dl,
.hb-order-detail__item-meta p {
  margin: 0;
}

/* Item pricing — handles was/now */
.hb-order-detail__item-pricing {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  flex-shrink: 0;
}
.hb-order-detail__item-was {
  font-size: 12px;
  color: rgba(61, 43, 31, 0.4);
  text-decoration: line-through;
}

/* Total row variants */
.hb-order-detail__total-row--discount {
  color: #4b6b44;
}
.hb-order-detail__coupon-code {
  display: inline-block;
  font-size: 11px;
  font-family: monospace;
  background: rgba(75, 107, 68, 0.12);
  border: 1px solid rgba(75, 107, 68, 0.25);
  border-radius: 4px;
  padding: 1px 5px;
  margin-left: 6px;
  vertical-align: middle;
}
.hb-order-detail__free-shipping {
  font-size: 13px;
  font-weight: 600;
  color: #4b6b44;
  background: rgba(75, 107, 68, 0.1);
  border-radius: 10px;
  padding: 1px 8px;
}
.hb-order-detail__total-row--charitable {
  font-size: 13px;
  color: #9d5f35;
  background: rgba(157, 95, 53, 0.06);
  border-radius: 8px;
  padding: 6px 10px;
  margin-top: 4px;
}
.hb-order-detail__total-row--charitable svg {
  flex-shrink: 0;
}

/* Payment card */
.hb-order-detail__payment-method {
  font-size: 15px;
  font-weight: 600;
  color: #3d2b1f;
  margin: 0 0 6px;
}
.hb-order-detail__transaction {
  font-size: 13px;
  color: rgba(61, 43, 31, 0.55);
  margin: 0;
}
.hb-order-detail__transaction code {
  font-family: monospace;
  background: rgba(61, 43, 31, 0.08);
  border-radius: 4px;
  padding: 1px 6px;
}

/* Address contact lines */
.hb-order-detail__contact {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 13px;
  color: rgba(61, 43, 31, 0.6);
  margin: 4px 0 0;
}

/* Customer note */
.hb-order-detail__note-text {
  font-size: 14px;
  line-height: 22px;
  color: rgba(61, 43, 31, 0.75);
  margin: 0;
}

/* Order updates list */
.hb-order-detail__notes {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.hb-order-detail__note {
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(61, 43, 31, 0.08);
}
.hb-order-detail__note:last-child {
  padding-bottom: 0;
  border-bottom: none;
}
.hb-order-detail__note-date {
  display: block;
  font-size: 11px;
  color: rgba(61, 43, 31, 0.45);
  margin-bottom: 4px;
}

/* ── Order Detail Responsive ── */
@media (max-width: 600px) {
  .hb-order-detail {
    padding: 120px 16px 48px;
    gap: 16px;
  }
  .hb-order-detail__number {
    font-size: 22px;
  }
  .hb-order-detail__addresses {
    grid-template-columns: 1fr;
  }
  .hb-order-detail__meta-row {
    gap: 6px;
  }
  .hb-order-detail__actions {
    flex-direction: column;
  }
}

/* ── Account Responsive ── */
@media (max-width: 900px) {
  .hb-account-grid {
    grid-template-columns: 1fr;
  }
  .hb-account-sidebar {
    order: 1;
  }
  .hb-account-nav {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px;
  }
  .hb-account-nav__btn {
    padding: 10px 12px;
  }
  .hb-account-nav__label {
    font-size: 12px;
  }
  .hb-subscription-card {
    flex-direction: column;
    text-align: center;
  }
  .hb-sub-card__img {
    margin: 0 auto;
  }
  .hb-sub-card__header {
    justify-content: center;
  }
  .hb-sub-card__dates {
    justify-content: center;
  }
  .hb-sub-card__actions {
    justify-content: center;
    margin-top: 16px;
  }
}
@media (max-width: 600px) {
  /* Wrapper responsive handled by unified CSS in layout.css */
  .hb-account-title {
    font-size: 28px;
  }
  .hb-account-nav {
    padding: 12px;
  }
  .hb-account-nav__btn {
    flex: 1 1 calc(50% - 4px);
    justify-content: center;
  }
}

/* ============================================================
   Happy Buddha — Auth (Login/Register) Styles (Figma: node 63:876)
   ============================================================ */

/* ── Auth Layout ──
   Wrapper CSS unified in layout.css */

/* ── Auth Header (Same as logged-in) ── */
.hb-auth-header {
  margin-bottom: 32px;
}
.hb-auth-title {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 38.4px;
  font-weight: 500;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.96px;
  margin: 0 0 8px;
}
.hb-auth-subtitle {
  font-size: 16px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.6);
  margin: 0;
}

/* ── Auth Container (Two-column card) ── */
.hb-auth-container {
  background: linear-gradient(156.55deg, #fff5f0 0%, #ffe8db 100%);
  border-radius: 16px;
  padding: 48px;
  box-shadow:
    0 20px 25px rgba(0, 0, 0, 0.1),
    0 8px 10px rgba(0, 0, 0, 0.1);
}
.hb-auth-card {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.hb-auth-grid {
  display: grid;
  grid-template-columns: 472px 1px 472px;
  gap: 0 64px;
  align-items: start;
}

/* ── Auth Column ── */
.hb-auth-column {
  display: flex;
  flex-direction: column;
}
.hb-auth-form__title {
  font-family: "Crimson Pro", Georgia, serif;
  font-size: 25.6px;
  font-weight: 500;
  line-height: 38.4px;
  color: #3d2b1f;
  margin: 0 0 32px;
}

/* ── Form ── */
.hb-auth-form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* ── Auth Notices ── */
.hb-auth-notice {
  padding: 16px;
  border-radius: 8px;
  background: rgba(61, 43, 31, 0.05);
}
.hb-auth-notice p {
  margin: 0;
  font-size: 14px;
  color: rgba(61, 43, 31, 0.7);
}
.hb-auth-notice--success {
  background: rgba(75, 107, 68, 0.1);
}
.hb-auth-notice--success p {
  color: #4b6b44;
}
.hb-auth-notice--error {
  background: rgba(189, 9, 22, 0.1);
}
.hb-auth-notice--error p {
  color: #bd0916;
}

/* ── Form Groups — commented out, uses components.css ── */
/*
.hb-form-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.hb-form-label {
  font-family: "Poppins", sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  color: rgba(61, 43, 31, 0.8);
}
.hb-form-label .required {
  color: #bd0916;
}
.hb-form-input {
  width: 100%;
  height: 46px;
  padding: 0 16px;
  font-size: 14px;
  font-family: inherit;
  color: #3d2b1f;
  background: #fff;
  border: 1px solid rgba(61, 43, 31, 0.2);
  border-radius: 10px;
  outline: none;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}
.hb-form-input:focus {
  border-color: #d48a28;
  box-shadow: 0 0 0 3px rgba(212, 138, 40, 0.15);
}
*/

/* ── Password Field ── */
.hb-password-field {
  position: relative;
}
.hb-password-input {
  padding-right: 44px;
}
.hb-password-toggle {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  font-size: 16px;
  color: rgba(61, 43, 31, 0.5);
}

/* ── Checkbox ── */
.hb-form-group--checkbox {
  flex-direction: row;
  align-items: center;
  gap: 8px;
  margin-top: 0;
}
.hb-checkbox {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: #4b6b44;
  cursor: pointer;
}
.hb-checkbox-label {
  font-family: "Poppins", sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  color: rgba(61, 43, 31, 0.7);
  cursor: pointer;
}

/* ── Buttons — commented out, uses components.css ── */
/*
.hb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  padding: 14px 34px;
  font-family: "Poppins", sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: normal;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.15s ease;
  text-decoration: none;
  margin-top: 8px;
}
.hb-btn--outline {
  color: #d48a28;
  background: transparent;
  border: 2px solid #d48a28;
}
.hb-btn--outline:hover {
  background: rgba(212, 138, 40, 0.1);
}
*/

/* ── Lost Password Link ── */
.hb-lost-password {
  font-family: "Poppins", sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  color: #d48a28;
  text-decoration: none;
  margin-top: 24px;
}
.hb-lost-password:hover {
  text-decoration: underline;
}

/* ── Privacy Text ── */
.hb-privacy-text {
  font-family: "Poppins", sans-serif;
  font-size: 12px;
  line-height: 19.5px;
  color: rgba(61, 43, 31, 0.5);
  margin: 0;
}
.hb-privacy-link {
  color: #d48a28;
  text-decoration: none;
}
.hb-privacy-link:hover {
  text-decoration: underline;
}

/* Privacy Policy page text color override */
body.privacy-policy .hb-content-wrap,
body.privacy-policy .hb-content-wrap p,
body.privacy-policy .hb-content-wrap li,
body.privacy-policy .hb-content-wrap td,
body.privacy-policy .hb-content-wrap th,
body.privacy-policy .hb-content-wrap h1,
body.privacy-policy .hb-content-wrap h2,
body.privacy-policy .hb-content-wrap h3,
body.privacy-policy .hb-content-wrap h4,
body.privacy-policy .hb-content-wrap h5,
body.privacy-policy .hb-content-wrap h6 {
  color: #fff;
}

body.privacy-policy .hb-content-wrap a {
  color: #ffd37a;
}

/* ── Vertical Divider ── */
.hb-auth-divider {
  width: 1px;
  background: rgba(61, 43, 31, 0.1);
  align-self: stretch;
}

/* ── Auth Responsive ── */
@media (max-width: 1100px) {
  .hb-auth-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .hb-auth-divider {
    display: none;
  }
}
@media (max-width: 600px) {
  /* Wrapper responsive handled by unified CSS in layout.css */
  .hb-auth-title {
    font-size: 28px;
  }
  .hb-auth-container {
    padding: 24px;
  }
  .hb-auth-grid {
    grid-template-columns: 1fr;
  }
}

/* ============================================================
   Happy Buddha — Checkout Page Styles
   ============================================================ */

/* ── Checkout Layout ──
   Wrapper CSS unified in layout.css */

/* ── Back to Cart Link ── */
.hb-checkout-back {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  margin-bottom: 32px;
  transition: opacity 0.15s ease;
}
.hb-checkout-back:hover {
  color: #fff;
  opacity: 0.9;
}

/* ── Checkout Title ── */
.hb-checkout-title {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 38.4px;
  font-weight: 500;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.96px;
  margin: 0 0 32px;
}

/* ── Step Indicator ── */
.hb-checkout-steps {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 48px;
}
.hb-step {
  display: flex;
  align-items: center;
  gap: 12px;
}
.hb-step__num {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 9999px;
  font-size: 14px;
  font-weight: 700;
  background: rgba(61, 43, 31, 0.1);
  color: rgba(255, 255, 255, 0.4);
  box-shadow: none;
}
.hb-step__label {
  font-size: 14px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.4);
}
.hb-step__line {
  width: 48px;
  height: 2px;
  background: rgba(61, 43, 31, 0.1);
}
.hb-step--active .hb-step__num {
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%);
  color: #fff;
  box-shadow:
    0px 10px 15px rgba(0, 0, 0, 0.1),
    0px 4px 6px rgba(0, 0, 0, 0.1);
}
.hb-step--active .hb-step__label {
  color: #fff;
  font-weight: 700;
}

/* ── Pay for Order: Status & Customer Details ── */
.hb-pay-order-status {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}
.hb-order-status-badge {
  display: inline-flex;
  align-items: center;
  padding: 6px 14px;
  border-radius: 9999px;
  font-size: 13px;
  font-weight: 600;
  text-transform: capitalize;
}
.hb-order-status-badge--pending {
  background: rgba(212, 138, 40, 0.15);
  color: #d48a28;
}
.hb-order-status-badge--on-hold {
  background: rgba(61, 43, 31, 0.12);
  color: #3d2b1f;
}
.hb-order-status-badge--failed {
  background: rgba(180, 60, 60, 0.15);
  color: #b43c3c;
}
.hb-order-status-badge--processing,
.hb-order-status-badge--completed {
  background: rgba(75, 107, 68, 0.15);
  color: #4b6b44;
}
.hb-pay-order-date {
  font-size: 14px;
  color: white;
}

/* Customer Details - Inside Payment Card */
.hb-pay-order-details {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.hb-pay-order-details__col {
  min-width: 0;
}
.hb-pay-order-details__title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 700;
  color: rgba(61, 43, 31, 0.55);
  margin-bottom: 8px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.hb-pay-order-details__title .fa-solid {
  color: #d48a28;
  font-size: 14px;
}
.hb-pay-order-details__content {
  font-size: 14px;
  color: #3d2b1f;
}
.hb-pay-order-details__name {
  font-weight: 600;
  color: #3d2b1f;
  margin-bottom: 4px;
}
.hb-pay-order-details__address {
  font-size: 14px;
  color: rgba(61, 43, 31, 0.8);
  line-height: 1.5;
  margin: 0;
  font-style: normal;
}
.hb-pay-order-details__contact {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: rgba(61, 43, 31, 0.65);
  margin-top: 6px;
  margin-bottom: 0;
}
.hb-pay-order-details__contact .fa-solid {
  color: rgba(61, 43, 31, 0.4);
  font-size: 12px;
}

/* Single column when no shipping address */
.hb-pay-order-details__col:only-child {
  grid-column: 1 / -1;
}

@media (max-width: 600px) {
  .hb-pay-order-details {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

/* Font Awesome Icon Styles */
.hb-checkout-back .fa-solid,
.hb-checkout-back-step .fa-solid {
  margin-right: 6px;
}
.hb-checkout-continue__btn .fa-solid {
  margin-left: 8px;
}
.hb-validation-message .fa-solid {
  color: #dc2626;
  margin-right: 8px;
}

/* ── Checkout Grid ── */
.hb-checkout-grid {
  display: grid;
  grid-template-columns: 692px 380px;
  gap: 32px;
  flex: 1;
}

/* ── Shipping Form Panel ── */
.hb-checkout-form-wrap {
  display: flex;
  flex-direction: column;
}
.hb-checkout-form {
  position: relative;
  background: linear-gradient(137.5deg, #fff5f0 0%, #ffe8db 100%);
  border-radius: 24px;
  padding: 32px;
  box-shadow:
    0px 20px 25px rgba(0, 0, 0, 0.1),
    0px 8px 10px rgba(0, 0, 0, 0.1);
}
.hb-form-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 24px;
}
.hb-form-header .fa-solid {
  font-size: 18px;
  color: #d48a28;
}
.hb-form-title {
  font-size: 18px;
  font-weight: 700;
  color: #3d2b1f;
  margin: 0;
}

/* ── Form Fields ── */
.hb-shipping-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.hb-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.hb-shipping-form .form-row {
  margin: 0;
  padding: 0;
}
.hb-shipping-form .form-row label {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: rgba(61, 43, 31, 0.7);
  margin-bottom: 6px;
}
.hb-shipping-form .input-text,
.hb-shipping-form .input-email,
.hb-shipping-form .input-tel,
.hb-shipping-form input[type="text"],
.hb-shipping-form input[type="email"],
.hb-shipping-form input[type="tel"],
.hb-shipping-form input[type="number"],
.hb-shipping-form select {
  width: 100%;
  height: var(--hb-input-height);
  padding: 0 var(--hb-input-padding-x);
  background: var(--hb-white);
  border: 2px solid var(--hb-input-border-color);
  border-radius: var(--hb-input-border-radius);
  font-family: var(--hb-font-body);
  font-size: var(--hb-font-size-base);
  color: var(--hb-brown);
  outline: none;
  box-shadow: none;
  transition: border-color var(--hb-transition-fast);
}
.hb-shipping-form .input-text:focus,
.hb-shipping-form .input-email:focus,
.hb-shipping-form .input-tel:focus {
  border-color: var(--hb-input-focus-color);
}
.hb-shipping-form .input-text::placeholder,
.hb-shipping-form .input-email::placeholder,
.hb-shipping-form .input-tel::placeholder {
  color: var(--hb-input-placeholder-color);
}

/* ── Form Error State ── */
.hb-input--error,
.hb-shipping-form .input-text.hb-input--error {
  border-color: #bd0916;
}
.hb-field-error {
  font-size: 12px;
  color: #bd0916;
  margin-top: 4px;
}

/* ── Continue to Payment Button ── */
.hb-checkout-submit {
  display: block;
  width: 100%;
  padding: 16px;
  margin-top: 8px;
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%);
  color: #fff;
  border: none;
  border-radius: 9999px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow:
    0px 10px 15px rgba(0, 0, 0, 0.1),
    0px 4px 6px rgba(0, 0, 0, 0.1);
  transition:
    transform 0.15s ease,
    opacity 0.15s ease;
}
.hb-checkout-submit:hover {
  transform: scale(1.02);
  opacity: 0.95;
}

/* ── Order Summary Panel ── */
.hb-checkout-summary {
  background: linear-gradient(132.5deg, #fff 0%, #fff5f0 100%);
  border: 1px solid rgba(212, 138, 40, 0.2);
  border-radius: 16px;
  padding: 24px;
  box-shadow:
    0px 20px 25px rgba(0, 0, 0, 0.1),
    0px 8px 10px rgba(0, 0, 0, 0.1);
  height: fit-content;
}
.hb-checkout-summary__title {
  font-size: 18px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.9px;
  color: #3d2b1f;
  margin: 0 0 24px;
}

/* ── Checkout Items ── */
.hb-checkout-items {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 24px;
}
.hb-checkout-item {
  display: flex;
  align-items: center;
  gap: 12px;
}
.hb-checkout-item__img {
  width: 48px;
  height: auto;
  flex-shrink: 0;
}
.hb-checkout-item__img img {
  max-width: 100%;
  height: auto;
}
.hb-checkout-item__info {
  flex: 1;
  min-width: 0;
}
.hb-checkout-item__name {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: #3d2b1f;
  line-height: 20px;
}
.hb-checkout-item__meta {
  display: block;
  font-size: 12px;
  font-weight: 400;
  color: rgba(61, 43, 31, 0.5);
  line-height: 16px;
}
.hb-checkout-item__price {
  font-size: 14px;
  font-weight: 700;
  color: #3d2b1f;
  flex-shrink: 0;
}

/* ── Summary Rows ── */
.hb-checkout-summary-rows {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 17px;
  border-top: 1px solid rgba(61, 43, 31, 0.1);
}
.hb-summary-row {
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  color: rgba(61, 43, 31, 0.7);
}
.hb-summary-free {
  color: #4b6b44;
  font-weight: 600;
}

/* ── Summary Total ── */
.hb-checkout-summary-total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding-top: 18px;
  margin-top: 8px;
  border-top: 2px solid rgba(61, 43, 31, 0.1);
}
.hb-checkout-summary-total span:first-child {
  font-size: 20px;
  font-weight: 700;
  color: #3d2b1f;
}
.hb-checkout-summary-total span:last-child {
  font-size: 20px;
  font-weight: 700;
  color: #3d2b1f;
}
.hb-checkout-summary-total .amount {
  font-size: 20px;
  font-weight: 700;
}

/* ── Subscription Note ── */
.hb-checkout-sub-note {
  background: rgba(75, 107, 68, 0.1);
  border-radius: 14px;
  padding: 12px;
  margin-top: 16px;
}
.hb-checkout-sub-note__text {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: #4b6b44;
  line-height: 16px;
}

/* ── Checkout Responsive ── */
@media (max-width: 1100px) {
  .hb-checkout-grid {
    grid-template-columns: 1fr;
  }
  .hb-checkout-summary {
    order: -1;
    margin-bottom: 24px;
  }
}
@media (max-width: 600px) {
  /* Wrapper responsive handled by unified CSS in layout.css */
  .hb-checkout-title {
    font-size: 28px;
  }
  .hb-form-row {
    grid-template-columns: 1fr;
  }
  .hb-checkout-form {
    padding: 24px;
  }
  .hb-checkout-steps {
    flex-wrap: wrap;
  }
}

/* ── WooCommerce Checkout Form Fields ── */
.hb-checkout-form .woocommerce-billing-fields,
.hb-checkout-form .woocommerce-shipping-fields,
.hb-checkout-form .woocommerce-account-fields {
  margin-bottom: 0;
}
.hb-checkout-form .woocommerce-billing-fields h3,
.hb-checkout-form .woocommerce-shipping-fields h3 {
  display: none;
}
.hb-checkout-form .hb-checkout-fields {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.hb-checkout-form .form-row {
  margin: 0 0 16px 0;
  padding: 0;
}
.hb-checkout-form .form-row::before,
.hb-checkout-form .form-row::after {
  display: none;
}
.hb-checkout-form .form-row label {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: rgba(61, 43, 31, 0.7);
  margin-bottom: 6px;
}
.hb-checkout-form .form-row label .required {
  color: #bd0916;
}

/* Style WooCommerce input fields */
.hb-checkout-form .input-text,
.hb-checkout-form .input-email,
.hb-checkout-form .input-tel,
.hb-checkout-form .input-password,
.hb-checkout-form input[type="text"],
.hb-checkout-form input[type="email"],
.hb-checkout-form input[type="tel"],
.hb-checkout-form input[type="password"],
.hb-checkout-form input[type="number"],
.hb-checkout-form select:not(.select2-hidden-accessible),
.hb-checkout-form textarea {
  width: 100%;
  height: var(--hb-input-height);
  padding: 0 var(--hb-input-padding-x);
  background: var(--hb-white);
  border: 2px solid var(--hb-input-border-color);
  border-radius: var(--hb-input-border-radius);
  font-family: var(--hb-font-body);
  font-size: var(--hb-font-size-base);
  color: var(--hb-brown);
  outline: none;
  box-shadow: none;
  transition: border-color var(--hb-transition-fast);
  -webkit-appearance: none;
  appearance: none;
}
.hb-checkout-form .input-text:focus,
.hb-checkout-form .input-email:focus,
.hb-checkout-form .input-tel:focus,
.hb-checkout-form input:focus,
.hb-checkout-form select:not(.select2-hidden-accessible):focus,
.hb-checkout-form textarea:focus {
  border-color: var(--hb-input-focus-color);
}
.hb-checkout-form .input-text::placeholder,
.hb-checkout-form .input-email::placeholder {
  color: rgba(61, 43, 31, 0.3);
}
.hb-checkout-form textarea {
  height: auto;
  min-height: 100px;
  resize: vertical;
  padding: var(--hb-input-padding-x) !important;
}

/* Select dropdown styling — native selects only (not Select2) */
.hb-checkout-form select:not(.select2-hidden-accessible) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%233d2b1f' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px;
  padding-right: 40px;
  cursor: pointer;
}

/* ── Select2 overrides for Checkout Form ── */
/* Select2's CSS handles hiding the original select. We just override visual styles here. */

/* Select2 container takes full width */
.hb-checkout-form .select2-container {
  width: 100% !important;
}

.hb-checkout-form .select2-container--default .select2-selection--single {
  border: 2px solid rgba(61, 43, 31, 0.1) !important;
  border-radius: 14px !important;
  height: 48px !important;
  line-height: 44px !important;
  background: #fff !important;
  width: 100% !important;
}
.hb-checkout-form
  .select2-container--default
  .select2-selection--single
  .select2-selection__rendered {
  line-height: 44px !important;
  padding: 0 32px 0 16px !important;
  color: #3d2b1f !important;
  font-size: 14px;
}
.hb-checkout-form
  .select2-container--default
  .select2-selection--single
  .select2-selection__arrow {
  height: 46px !important;
  right: 12px !important;
}
.hb-checkout-form
  .select2-container--default.select2-container--open
  .select2-selection--single,
.hb-checkout-form
  .select2-container--default.select2-container--focus
  .select2-selection--single {
  border-color: #d48a28 !important;
  outline: none;
}

/* Select2 dropdown menu styling (appended to body) */
.select2-dropdown {
  border: 2px solid rgba(61, 43, 31, 0.1) !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 8px 24px rgba(61, 43, 31, 0.15) !important;
  margin-top: 4px !important;
}
.select2-results__option {
  padding: 12px 16px !important;
  font-size: 14px !important;
  color: #3d2b1f !important;
}
.select2-results__option--highlighted[aria-selected] {
  background: rgba(212, 138, 40, 0.1) !important;
  color: #3d2b1f !important;
}
.select2-results__option[aria-selected=true] {
  background: rgba(212, 138, 40, 0.15) !important;
  color: #3d2b1f !important;
}

/* Select2 search input in dropdown */
.select2-search--dropdown {
  padding: 8px !important;
}
.select2-search__field {
  width: 100% !important;
  height: 36px !important;
  padding: 0 8px !important;
  background: #fff !important;
  border: 2px solid rgba(61, 43, 31, 0.1) !important;
  border-radius: 14px !important;
  font-family: "Plus Jakarta Sans", sans-serif !important;
  font-size: 12px !important;
  color: #3d2b1f !important;
  outline: none !important;
  box-shadow: none !important;
}
.select2-search__field:focus {
  border-color: #d48a28 !important;
}
.select2-search__field::placeholder {
  color: rgba(61, 43, 31, 0.3) !important;
}

/* Two-column form rows */
.hb-checkout-form .form-row-first,
.hb-checkout-form .form-row-last {
  width: 48%;
  display: inline-block;
  vertical-align: top;
}
.hb-checkout-form .form-row-first {
  margin-right: 4%;
}

/* ── Add Payment Method page — card wrapper for right panel ── */
.woocommerce-add-payment-method .hb-account-content {
  background: linear-gradient(131.85deg, #fff5f0 0%, #ffe8db 100%);
  border-radius: var(--hb-card-radius);
  padding: var(--hb-card-padding);
  box-shadow:
    0 10px 15px rgba(0, 0, 0, 0.1),
    0 4px 6px rgba(0, 0, 0, 0.1);
}

/* Payment container — checkout + add-payment-method + pay-for-order */
.hb-checkout-form #payment,
#payment.woocommerce-checkout-payment,
#add_payment_method #payment {
  display: block;
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
}

/* Reset any grid/flex on payment form */
.hb-checkout-form #payment form#order_review {
  display: block;
}

/* Payment form row for button */
#payment .form-row {
  margin-top: 24px;
}

/* Payment methods list — checkout + add-payment-method */
/* Payment methods list — checkout uses wc_payment_methods; add-payment-method uses woocommerce-PaymentMethods */
.hb-checkout-form .wc_payment_methods,
#add_payment_method .wc_payment_methods,
#add_payment_method .woocommerce-PaymentMethods {
  margin-bottom: 24px;
  padding: 0;
  list-style: none;
  display: block;
}

/* Payment method item — checkout: wc_payment_method; add-payment-method: woocommerce-PaymentMethod */
.hb-checkout-form .wc_payment_method,
#add_payment_method .wc_payment_method,
#add_payment_method .woocommerce-PaymentMethod {
  box-sizing: border-box;
  padding: 16px;
  background: var(--hb-white) !important;
  border: 2px solid var(--hb-input-border-color) !important;
  border-radius: var(--hb-input-border-radius) !important;
  margin-bottom: 8px;
  display: block;
  width: 100%;
}

/* Selected state */
.hb-checkout-form .wc_payment_method.payment_method_selected,
#add_payment_method .wc_payment_method.payment_method_selected,
#add_payment_method .woocommerce-PaymentMethod--selected {
  border-color: var(--hb-input-focus-color) !important;
}

/* Radio inputs */
.hb-checkout-form .wc_payment_method input[type="radio"],
#add_payment_method .wc_payment_method input[type="radio"],
#add_payment_method .woocommerce-PaymentMethod input[type="radio"] {
  accent-color: var(--hb-input-focus-color);
  margin-right: 8px;
  vertical-align: middle;
}

/* Labels */
.hb-checkout-form .wc_payment_method label,
#add_payment_method .wc_payment_method label,
#add_payment_method .woocommerce-PaymentMethod label {
  font-weight: var(--hb-font-weight-semibold);
  color: var(--hb-brown);
  cursor: pointer;
  display: inline;
  vertical-align: middle;
}

/* Stripe payment icons - display horizontally inline */
.hb-checkout-form .wc_payment_method label img,
.wc_payment_method label img.stripe-icon,
.wc_payment_method label img.stripe-cards-icon,
.wc_payment_method img.stripe-icon,
img.stripe-cards-icon {
  display: inline-block !important;
  width: auto !important;
  max-width: 50px !important;
  height: 24px !important;
  max-height: 24px !important;
  vertical-align: middle !important;
  margin-left: 8px !important;
  margin-right: 0 !important;
  object-fit: contain !important;
}

/* Hide alt text fallback by ensuring image renders */
img.stripe-cards-icon[alt],
img.stripe-icon[alt] {
  font-size: 0 !important;
  color: transparent !important;
}

/* WooPayments card icons */
.wc_payment_method label img[alt*="Visa"],
.wc_payment_method label img[alt*="MasterCard"],
.wc_payment_method label img[alt*="Amex"],
.wc_payment_method label img[alt*="Discover"],
.wc_payment_method label img[alt*="Diners"],
.wc_payment_method img.payment-icon,
.payment_method_stripe img {
  max-width: 38px !important;
  height: 24px !important;
  max-height: 24px !important;
  object-fit: contain !important;
}
.hb-checkout-form .payment_box,
#add_payment_method #payment div.payment_box,
.woocommerce-checkout #payment div.payment_box,
.woocommerce-cart #payment div.payment_box,
.payment_box {
  background: var(--hb-gradient-card) !important;
  border: 2px solid var(--hb-input-border-color) !important;
  border-radius: var(--hb-card-radius) !important;
  padding: 20px !important;
  margin: 12px 0 0 !important;
  color: var(--hb-brown) !important;
}

/* Reset fieldset browser defaults inside payment methods */
.hb-checkout-form fieldset,
.payment_box fieldset,
#add_payment_method fieldset,
#payment fieldset {
  border: none;
  padding: 0;
  margin: 0;
}

/* Stripe UPE form fieldset spacing */
#wc-stripe-upe-form {
  margin-bottom: 8px !important;
}

/* Hide WooCommerce arrow pointer on payment_box */
.hb-checkout-form .payment_box::before,
.payment_box::before,
.payment_method_cod .payment_box::before,
.wc_payment_method .payment_box::before {
  display: none !important;
  content: none !important;
  border: none !important;
}
.hb-checkout-form .payment_box p {
  margin: 0;
  font-size: 13px;
  color: rgba(61, 43, 31, 0.65);
  line-height: 1.5;
}

/* Test mode / info notice inside payment box */
.hb-checkout-form .payment_box .woocommerce-info,
.hb-checkout-form .payment_box .wc-payment-notice {
  background: rgba(212, 138, 40, 0.08);
  border-left: 3px solid var(--hb-amber-light);
  border-radius: 10px;
  padding: 10px 14px;
  margin-bottom: 16px;
  font-size: var(--hb-font-size-xs);
  color: var(--hb-label-color);
}
.hb-checkout-form .payment_box .woocommerce-info a,
.hb-checkout-form .payment_box .wc-payment-notice a {
  color: var(--hb-amber-light);
  font-weight: var(--hb-font-weight-semibold);
}

/* Stripe / WooPayments UPE element container
   — no .payment_box requirement: UPE is injected by plugin at any level */
.hb-checkout-form .wcpay-upe-element,
.hb-checkout-form #wcpay-payment-element,
.hb-checkout-form .wc-stripe-elements-field,
.hb-checkout-form .stripe-elements-wrapper,
.hb-checkout-form #stripe-elements,
.hb-checkout-form .wc-stripe-upe-element,
.hb-checkout-form #wc-stripe-upe-form,
.hb-checkout-form .payment_box .wcpay-upe-element,
.hb-checkout-form .payment_box #wcpay-payment-element,
.hb-checkout-form .payment_box .wc-stripe-upe-element {
  background: var(--hb-white);
  border: 2px solid var(--hb-input-border-color);
  border-radius: var(--hb-input-border-radius);
  padding: var(--hb-input-padding-x);
  margin-top: 12px;
  min-height: 60px;
  width: 100%;
  overflow: hidden; /* clip iframe's -4px negative margin to border-radius */
}

/* Stripe hidden input for styling extraction */
.hb-checkout-form #wc-stripe-hidden-style-input {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Classic Stripe Card Element field wrappers
   — same: no .payment_box requirement */
.hb-checkout-form .StripeElement,
.hb-checkout-form .payment_box .StripeElement {
  background: var(--hb-white);
  border: 2px solid var(--hb-input-border-color);
  border-radius: var(--hb-input-border-radius);
  padding: 12px var(--hb-input-padding-x);
  overflow: hidden;
  transition: border-color var(--hb-transition-fast);
}
.hb-checkout-form .StripeElement--focus,
.hb-checkout-form .payment_box .StripeElement--focus {
  border-color: var(--hb-input-focus-color);
  box-shadow: 0 0 0 3px rgba(212, 138, 40, 0.12);
}
.hb-checkout-form .StripeElement--invalid,
.hb-checkout-form .payment_box .StripeElement--invalid {
  border-color: var(--hb-red);
}

/* Field labels inside payment box (Stripe card field labels) */
.hb-checkout-form .payment_box label {
  font-size: var(--hb-font-size-xs);
  font-weight: var(--hb-font-weight-semibold);
  color: var(--hb-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 6px;
  display: block;
}

/* Save card checkbox row */
.hb-checkout-form .payment_box .wc-stripe-add-payment-method-form,
.hb-checkout-form .payment_box .woocommerce-SavedPaymentMethods-saveNew,
.hb-checkout-form .payment_box .wcpay-save-payment-method-checkbox-container,
.hb-checkout-form
  .payment_box
  p.form-row.woocommerce-SavedPaymentMethods-saveNew {
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid rgba(61, 43, 31, 0.08);
  border-radius: 10px;
  padding: 12px 14px;
  margin-top: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.hb-checkout-form .payment_box input[type="checkbox"] {
  accent-color: var(--hb-input-focus-color);
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}
.hb-checkout-form .payment_box input[type="checkbox"] + label,
.hb-checkout-form .payment_box .woocommerce-form__label-for-checkbox {
  font-size: var(--hb-font-size-sm);
  font-weight: var(--hb-font-weight-medium);
  color: var(--hb-brown);
  text-transform: none;
  letter-spacing: 0;
  margin: 0;
}

/* Place Order button */
.hb-checkout-form .place-order {
  margin-top: 24px;
  padding: 0;
}
.hb-checkout-form button#place_order {
  display: block;
  width: 100%;
  padding: 16px;
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 9999px !important;
  font-family: "Plus Jakarta Sans", sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0.7px !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  box-shadow:
    0px 10px 15px rgba(0, 0, 0, 0.1),
    0px 4px 6px rgba(0, 0, 0, 0.1) !important;
  transition:
    transform 0.15s ease,
    opacity 0.15s ease !important;
}
.hb-checkout-form button#place_order:hover {
  transform: scale(1.02);
  opacity: 0.95;
}

/* ── Order Review Table ── */
.hb-checkout-form .woocommerce-checkout-review-order-table {
  display: none;
}

/* ── Shipping Fields ── */
.hb-checkout-form .woocommerce-shipping-fields {
  margin-top: 24px;
}
.hb-checkout-form .woocommerce-shipping-fields h3 {
  display: none;
}
.hb-checkout-form #ship-to-different-address {
  margin-bottom: 16px;
}
.hb-checkout-form #ship-to-different-address label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  color: #3d2b1f;
  cursor: pointer;
}
.hb-checkout-form #ship-to-different-address input {
  width: 20px;
  height: 20px;
  accent-color: #d48a28;
}

/* ── Checkbox Fields ── */
.hb-checkout-form input[type="checkbox"] {
  width: 20px;
  height: 20px;
  accent-color: #d48a28;
}

/* ── Error Messages ── */
.hb-checkout-form .woocommerce-error {
  background: #fff5f5;
  border: 1px solid #bd0916;
  border-radius: 14px;
  padding: 16px;
  margin-bottom: 16px;
  list-style: none;
}
.hb-checkout-form .woocommerce-error li {
  color: #bd0916;
  font-size: 14px;
}
.hb-checkout-form .woocommerce-invalid .input-text,
.hb-checkout-form .woocommerce-invalid input {
  border-color: #bd0916;
}

/* ── Hide Default WooCommerce Elements on Checkout ── */
.hb-checkout-page .woocommerce-breadcrumb,
.hb-checkout-page .woocommerce-info,
.hb-checkout-page .woocommerce-NoticeGroup {
  display: none;
}

/* Make checkout page full-width with video background */
.hb-checkout-page {
  margin: 0 !important;
  padding: 0 !important;
}

/* Remove page title on checkout */
.hb-checkout-page .entry-title {
  display: none;
}

/* Ensure page content wrapper is full-width for checkout */
body.hb-checkout-page .site-content,
body.hb-checkout-page #primary,
body.hb-checkout-page .elementor-primary {
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
}
body.hb-checkout-page .entry-content,
body.hb-checkout-page .page-content {
  margin: 0 !important;
  padding: 0 !important;
}

/* ── Coupon Form ── */
.hb-checkout-form .woocommerce-form-coupon {
  background: rgba(61, 43, 31, 0.05);
  border-radius: 14px;
  padding: 16px;
  margin-bottom: 16px;
}
.hb-checkout-form .woocommerce-form-coupon p {
  margin: 0;
}
.hb-checkout-form .woocommerce-form-coupon input[type="text"] {
  height: 48px;
  padding: 12px 16px;
  border: 2px solid rgba(61, 43, 31, 0.1);
  border-radius: 14px;
}
.hb-checkout-form .woocommerce-form-coupon button {
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%);
  color: #fff;
  border: none;
  border-radius: 9999px;
  padding: 12px 24px;
  font-weight: 700;
  text-transform: uppercase;
  cursor: pointer;
}

/* ============================================================
   Happy Buddha — Product Detail Page Styles
   ============================================================ */

/* ── Product Layout ── */
.hb-product-wrap {
  position: relative;
  z-index: 1;
  width: 100%;
  padding: 64px 160px;
  font-family: "Plus Jakarta Sans", sans-serif;
  background: linear-gradient(
    155.5deg,
    #fff5f0 0%,
    #fff3ed 14.3%,
    #fff1ea 28.6%,
    #ffefe7 42.9%,
    #ffeee4 57.1%,
    #ffece1 71.4%,
    #ffeade 85.7%,
    #ffe8db 100%
  );
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

/* ── Breadcrumb ── */
.hb-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 32px;
  font-size: 14px;
}
.hb-breadcrumb a {
  color: rgba(0, 0, 0, 0.5);
  text-decoration: none;
  font-family: "Poppins", sans-serif;
}
.hb-breadcrumb a:hover {
  color: #3d2b1f;
}
.hb-breadcrumb__sep {
  color: rgba(0, 0, 0, 0.5);
}
.hb-breadcrumb__current {
  color: #000;
  font-weight: 600;
  font-family: "Poppins", sans-serif;
}

/* ── Product Grid ── */
.hb-product-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  margin-bottom: 48px;
}

/* ── Product Image ── */
.hb-product-image-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.hb-product-image {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.hb-product-image img {
  max-width: 100%;
  max-height: 600px;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}

/* ── Image carousel dots ── */
.hb-image-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 20px;
}
.hb-image-dot {
  display: block;
  height: 12px;
  border-radius: 9999px;
  background: rgba(61, 43, 31, 0.2);
  width: 12px;
  transition:
    width 0.2s ease,
    background 0.2s ease;
}
.hb-image-dot--active {
  background: #d48a28;
  width: 28px;
}

/* ── Size dropdown ── */
.hb-size-dropdown {
  margin-bottom: 4px;
}
.hb-size-select {
  appearance: none;
  -webkit-appearance: none;
  height: 43px;
  min-width: 120px;
  padding: 0 36px 0 14px;
  border-radius: 14px;
  border: 2px solid rgba(61, 43, 31, 0.15);
  background: rgba(255, 255, 255, 0.6)
    url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%233d2b1f' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
    no-repeat right 12px center;
  font-family: "Poppins", sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: #3d2b1f;
  cursor: pointer;
  transition: border-color 0.15s ease;
}
.hb-size-select:focus {
  outline: none;
  border-color: #d48a28;
}

/* ── Product Details ── */
.hb-product-details {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* Rating */
.hb-product-rating {
  display: flex;
  align-items: center;
  gap: 2px;
  margin-bottom: 8px;
}
.hb-product-rating svg {
  flex-shrink: 0;
}
.hb-product-rating__count {
  margin-left: 8px;
  font-size: 14px;
  color: rgba(61, 43, 31, 0.5);
}

/* Title */
.hb-product-title {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 32px;
  font-weight: 500;
  color: #3d2b1f;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  margin: 0 0 4px;
  line-height: 1.2;
}

.hb-product-price {
  margin: 16px 0 24px;
}

.hb-product-price__amount {
  font-family: "Plus Jakarta Sans", Georgia, serif;
  font-size: 36px;
  font-weight: 400;
  color: #3d2b1f;
}

.hb-product-price__badge {
  display: inline-block;
  background: #b8860b;
  color: #fff;
  font-family: "Montserrat", sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 10px 20px;
  border-radius: 9999px;
}
.hb-product-title__variant {
  display: block;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 15px;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.3px;
  color: rgba(61, 43, 31, 0.6);
  margin-top: 6px;
}
.hb-product-title__variant:empty {
  display: none;
}

/* Variant */
.hb-product-variant {
  font-family: "Crimson Pro", Georgia, serif;
  font-size: 19.2px;
  font-weight: 400;
  color: #d48a28;
  margin: 0 0 24px;
}

/* Description */
.hb-product-desc {
  font-size: 16px;
  line-height: 26px;
  color: rgba(61, 43, 31, 0.75);
  margin: 0 0 32px;
}

/* ── Plan Selector ── */
.hb-plan-selector {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 24px;
}
.hb-plan-selector__label {
  font-size: 14px;
  font-weight: 700;
  color: #3d2b1f;
  text-transform: uppercase;
  letter-spacing: 0.7px;
}
.hb-size-label {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: #3d2b1f;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin: 0 0 12px;
}
.hb-plan-btns {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}
.hb-plan-btn {
  position: relative;
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid rgba(61, 43, 31, 0.1);
  border-radius: 9999px;
  padding: 11px 20px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  color: rgba(61, 43, 31, 0.7);
  cursor: pointer;
  transition: all 0.2s ease;
}
.hb-plan-btn:hover {
  background: rgba(255, 255, 255, 0.8);
}
.hb-plan-btn--active {
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow:
    0px 10px 15px rgba(0, 0, 0, 0.1),
    0px 4px 6px rgba(0, 0, 0, 0.1);
}
.hb-plan-btn__badge {
  position: absolute;
  top: -8px;
  left: 50%;
  transform: translateX(-50%);
  background: #4b6b44;
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 9999px;
  text-transform: uppercase;
  letter-spacing: 0.45px;
  white-space: nowrap;
}
.hb-plan-btn--disabled {
  opacity: 0.5;
  cursor: not-allowed !important;
  position: relative;
}
.hb-plan-btn--disabled:hover {
  background: rgba(255, 255, 255, 0.6);
}
.hb-plan-btn--disabled:hover::after {
  content: "Coming soon";
  position: absolute;
  top: -28px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(61, 43, 31, 0.9);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 6px;
  white-space: nowrap;
  z-index: 10;
}
.hb-plan-btn--disabled .hb-plan-btn__badge {
  display: none;
}

/* ── Size Selector ── */
.hb-size-selector {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 16px;
}
.hb-size-selector__label {
  font-size: 14px;
  font-weight: 700;
  color: #3d2b1f;
  text-transform: uppercase;
  letter-spacing: 0.7px;
}
.hb-size-btns {
  display: flex;
  gap: 8px;
}
.hb-size-btn {
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid rgba(61, 43, 31, 0.1);
  border-radius: 9999px;
  padding: 11px 20px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  color: rgba(61, 43, 31, 0.7);
  cursor: pointer;
  transition: all 0.2s ease;
}
.hb-size-btn:hover {
  background: rgba(255, 255, 255, 0.8);
}
.hb-size-btn--active {
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%) !important;
  border-color: none;
  color: #fff !important;
  box-shadow:
    0px 10px 15px rgba(0, 0, 0, 0.1),
    0px 4px 6px rgba(0, 0, 0, 0.1);
}

/* ── Price ── */
.hb-product-price {
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin-bottom: 4px;
}
.hb-product-price__amount {
  font-family: "Plus Jakarta Sans", Georgia, serif;
  font-size: 36px;
  font-weight: 400;
  color: #3d2b1f;
}

.hb-product-price__regular {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: rgba(61, 43, 31, 0.55);
  text-decoration: line-through;
  margin-right: 6px;
}

.hb-product-price__amount--sale {
  color: #b00020;
  font-weight: 700;
}
.hb-product-price__amount .woocommerce-Price-amount {
  font-size: 40px;
}
.hb-product-price__per {
  font-size: 14px;
  color: rgba(61, 43, 31, 0.6);
}
.hb-product-price__save {
  font-size: 14px;
  color: rgba(61, 43, 31, 0.7);
  margin: 0 0 32px;
}

/* ── Add to Cart Button ── */
.hb-product-add-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 16px;
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%);
  color: #fff;
  border: none;
  border-radius: 9999px;
  font-family: inherit;
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  cursor: pointer;
  box-shadow:
    0px 10px 15px rgba(0, 0, 0, 0.1),
    0px 4px 6px rgba(0, 0, 0, 0.1);
  transition:
    transform 0.15s ease,
    opacity 0.15s ease;
}
.hb-product-add-btn:hover {
  transform: scale(1.02);
  opacity: 0.95;
}
.hb-product-add-btn:disabled {
  background: rgba(61, 43, 31, 0.3);
  cursor: not-allowed;
  transform: none;
  opacity: 0.6;
  box-shadow: none;
}
.hb-product-add-btn--soon {
  background: transparent !important;
  border: 2px dashed #d48a28 !important;
  color: #d48a28 !important;
  box-shadow: none !important;
  cursor: default !important;
  opacity: 1 !important;
  transform: none !important;
  gap: 10px;
}
.hb-product-add-btn--soon i {
  font-size: 16px;
}

/* ── Feature Badges ── */
.hb-product-features {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.hb-feature {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  background: rgba(255, 255, 255, 0.4);
  border-radius: 16px;
  padding: 16px 12px;
  text-align: center;
}
.hb-feature span {
  font-size: 12px;
  font-weight: 600;
  color: rgba(61, 43, 31, 0.7);
}

/* ── Product Panels ── */
.hb-product-panels {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
}
.hb-product-panel {
  background: linear-gradient(144.42deg, #fff5f0 0%, #ffe8db 100%);
  border-radius: 24px;
  padding: 32px;
  box-shadow:
    0px 10px 15px rgba(0, 0, 0, 0.1),
    0px 4px 6px rgba(0, 0, 0, 0.1);
}
.hb-product-panel__header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 24px;
}
.hb-product-panel__title {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 17.6px;
  font-weight: 500;
  color: #3d2b1f;
  text-transform: uppercase;
  letter-spacing: 0.44px;
  margin: 0;
}
.hb-product-panel__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.hb-product-panel__list li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  color: rgba(61, 43, 31, 0.7);
}

/* ── Nutrition Table ── */
.hb-nutrition-table {
  display: flex;
  flex-direction: column;
}
.hb-nutrition-row {
  display: flex;
  justify-content: space-between;
  padding: 12px 0;
  border-bottom: 1px solid rgba(61, 43, 31, 0.1);
}
.hb-nutrition-row:last-child {
  border-bottom: none;
}
.hb-nutrition-row span:first-child {
  font-size: 14px;
  color: rgba(61, 43, 31, 0.6);
}
.hb-nutrition-row span:last-child {
  font-size: 14px;
  font-weight: 600;
  color: #3d2b1f;
}

/* ── Responsive ── */
@media (max-width: 1100px) {
  .hb-product-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .hb-product-image-wrap {
    width: 100%;
  }
  .hb-product-image {
    min-height: unset;
  }
  .hb-product-panels {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 600px) {
  .hb-product-wrap {
    padding: 32px 16px 40px;
  }
  .hb-product-title {
    font-size: 24px;
  }
  .hb-product-variant {
    font-size: 16px;
  }
  .hb-product-price__amount {
    font-size: 32px;
  }
  .hb-product-price__amount .woocommerce-Price-amount {
    font-size: 32px;
  }
  .hb-product-features {
    grid-template-columns: 1fr;
  }
  .hb-product-image {
    height: auto;
  }
  .hb-plan-btns {
    flex-wrap: wrap;
  }
  .hb-plan-btn {
    flex: 1;
    min-width: 100px;
  }
}

/* ============================================================
   Happy Buddha — Header Styles
   ============================================================ */

/* ── Header Container ── */
.hb-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  transition:
    background-color 0.3s ease,
    backdrop-filter 0.3s ease;
}

.hb-header.scrolled {
  background-color: rgba(0, 0, 0, 0.5);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
}

/* ── Top Bar ── */
.hb-header__top {
  background-color: black;
  height: var(--hb-header-top-height);
  padding: 0 20px;
  display: flex;
  align-items: center;
  font-family: "Poppins", sans-serif;
  font-size: 10px;
}

.hb-header__top-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1296px;
  margin: 0 auto;
}

.hb-header__contact {
  display: flex;
  align-items: center;
  gap: 15px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.hb-header__contact li {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  color: #fff;
}

.hb-header__contact svg {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
}

.hb-header__signin {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  color: #ba2025;
  text-decoration: none;
  font-weight: 600;
}

.hb-header__signin:hover {
  color: #8b181b;
}

.hb-header__signin svg {
  width: 14px;
  height: 14px;
}

/* ── Main Header ── */
.hb-header__main {
  max-width: 1400px;
  height: var(--hb-header-main-height);
  padding: 0 10px;
  display: flex;
  align-items: center;
  transition: height 0.3s ease;
  margin: 0 auto;
}

/* ── Logo ── */
.hb-header__logo {
  display: flex;
  align-items: center;
  gap: 0;
  text-decoration: none;
  flex-shrink: 0;
}

.hb-header__logo-img {
  width: 50px;
  height: auto;
}

.hb-header__brand {
  display: flex;
  flex-direction: column;
  margin-left: 0;
}

.hb-header__brand-title {
  display: flex;
  align-items: flex-start;
  position: relative;
}

.hb-header__brand-name {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 18px;
  font-weight: 600;
  color: #fff;
  /* -webkit-text-stroke: 0.3px #d48a28; */
  /* text-stroke: 0.3px #d48a28; */
  line-height: 1;
  color: #aa0000;
  stroke-width: 0.3px;
  stroke: white;
  -webkit-text-stroke-width: 0.3px;
  -webkit-text-stroke-color: white;
}

.hb-header__reg {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 18px;
  font-weight: 600;
  color: white;
  line-height: 1;
  margin-left: 2px;
  margin-top: -2px;
}

.hb-header__tagline {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 10px;
  font-weight: 400;
  color: white;
  line-height: 1.3;
  text-align: center;
}

/* ── Divider ── */
.hb-header__divider {
  width: 2px;
  height: 60px;
  background: rgba(255, 255, 255, 0.5);
  margin: 0 15px;
}

/* ── Navigation ── */
.hb-header__nav {
  flex: 1;
  display: flex;
  justify-content: flex-start;
}

.hb-nav {
  display: flex;
  align-items: center;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
}

.hb-nav .menu-item {
  margin: 0;
}

.hb-nav .menu-item a {
  display: block;
  padding: 10px 15px;
  font-size: 14px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.5);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.7px;
  transition: color 0.2s ease;
}

.hb-nav .menu-item a:hover,
.hb-nav .menu-item.current-menu-item a {
  color: #fff;
}

/* ── Navigation Icons ── */
.hb-nav .menu-item a svg,
.hb-nav .menu-item a i {
  width: 16px;
  height: 16px;
  margin-right: 6px;
  vertical-align: middle;
  flex-shrink: 0;
}

.hb-nav .menu-item a span {
  vertical-align: middle;
}

/* ── Cart Badge ── */
.hb-cart-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  margin-left: 6px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  color: #fff;
  background: #d81f29;
  border-radius: 9px;
  vertical-align: middle;
}

/* ── Mobile Toggle (hamburger — always pushed to the right) ── */
.hb-header__toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 40px;
  height: 40px;
  margin-left: auto;
  background: rgba(255, 255, 255, 0.1);
  border: 1.5px solid rgba(255, 255, 255, 0.25);
  border-radius: 8px;
  cursor: pointer;
  padding: 8px;
  flex-shrink: 0;
}

.hb-header__toggle-bar {
  display: block;
  width: 18px;
  height: 2px;
  background: #fff;
  border-radius: 2px;
  transition:
    transform 0.3s ease,
    opacity 0.3s ease;
}

.hb-header__toggle[aria-expanded="true"] .hb-header__toggle-bar:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}

.hb-header__toggle[aria-expanded="true"] .hb-header__toggle-bar:nth-child(2) {
  opacity: 0;
}

.hb-header__toggle[aria-expanded="true"] .hb-header__toggle-bar:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* ── Backdrop ── */
.hb-menu-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  z-index: 199;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.35s ease;
}

.hb-menu-backdrop.active {
  opacity: 1;
  pointer-events: auto;
}

/* ── Mobile Navigation (right-side drawer) ── */
.hb-header__mobile-nav {
  position: fixed;
  top: 14px;
  right: 0;
  width: 280px;
  height: 100vh;
  background: rgba(15, 7, 3, 0.98);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  z-index: 200;
  padding: 80px 0 32px;
  overflow-y: auto;
  transform: translateX(100%);
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  display: block;
}

.hb-header__mobile-nav.active {
  transform: translateX(0);
}

/* ── Mobile nav list — vertical layout ── */
/* Covers both real menu (.hb-mobile-nav) and fallback (.hb-nav) */
.hb-header__mobile-nav .hb-mobile-nav,
.hb-header__mobile-nav .hb-nav {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 0;
}

.hb-header__mobile-nav .hb-mobile-nav .menu-item a,
.hb-header__mobile-nav .hb-nav .menu-item a {
  display: flex;
  align-items: center;
  padding: 16px 28px;
  font-size: 15px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.65);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  transition:
    color 0.2s ease,
    background 0.2s ease;
}

.hb-header__mobile-nav .hb-mobile-nav .menu-item a:hover,
.hb-header__mobile-nav .hb-nav .menu-item a:hover,
.hb-header__mobile-nav .hb-mobile-nav .menu-item.current-menu-item a,
.hb-header__mobile-nav .hb-nav .menu-item.current-menu-item a {
  color: #fff;
  background: rgba(255, 255, 255, 0.05);
}

/* ── Mobile Nav Icons ── */
.hb-header__mobile-nav .menu-item a svg,
.hb-header__mobile-nav .menu-item a i {
  width: 18px;
  height: 18px;
  margin-right: 12px;
  flex-shrink: 0;
  opacity: 0.7;
}

.hb-header__mobile-nav .menu-item.current-menu-item a svg,
.hb-header__mobile-nav .menu-item a:hover svg,
.hb-header__mobile-nav .menu-item.current-menu-item a i,
.hb-header__mobile-nav .menu-item a:hover i {
  opacity: 1;
}

/* ── Mobile Cart Badge ── */
.hb-header__mobile-nav .hb-cart-badge {
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  margin-left: 8px;
  font-size: 11px;
  border-radius: 10px;
}

/* ── Header Responsive ── */
@media (max-width: 1024px) {
  .hb-header__nav {
    display: none;
  }

  .hb-header__toggle {
    display: flex;
  }
}

@media (max-width: 768px) {
  /* Header height adjustments for mobile */
  :root {
    --hb-header-top-height: 48px;
    --hb-header-main-height: 72px;
    --hb-header-height: 120px;
  }

  .hb-header__top-inner {
    flex-direction: column;
    gap: 8px;
  }

  .hb-header__contact {
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
  }

  .hb-header__contact li {
    font-size: 9px;
  }

  .hb-header__signin {
    font-size: 9px;
  }

  .hb-header__divider {
    display: none;
  }

  .hb-header__main {
    padding: 0 12px;
    justify-content: space-between;
  }

  .hb-header__logo-img {
    width: 38px;
  }

  .hb-header__brand-name,
  .hb-header__reg {
    font-size: 15px;
  }

  .hb-header__tagline {
    font-size: 8px;
  }

}

@media (max-width: 480px) {
  :root {
    --hb-header-top-height: 56px;
    --hb-header-main-height: 64px;
    --hb-header-height: 120px;
    --hb-footer-height: 180px;
  }

}

/* ============================================================
   Happy Buddha — Footer Styles
   ============================================================ */

/* ── Footer Container ── */
.hb-footer {
  background-color: #3d2b1f;
  height: var(--hb-footer-height);
  padding: 20px 10px;
  position: relative;
  z-index: 10;
  box-sizing: border-box;
}

.hb-footer__inner {
  display: flex;
  align-items: center;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 10px;
}

/* ── Footer Brand ── */
.hb-footer__brand {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.hb-footer__logo {
  width: 50px;
  height: auto;
}

.hb-footer__brand-text {
  display: flex;
  flex-direction: column;
  margin-left: 0;
}

.hb-footer__brand .hb-brand {
  --hb-brand-base: 18px;
  --hb-brand-stroke: 0.3px;
}

.hb-footer__brand-title {
  display: flex;
  align-items: flex-start;
  position: relative;
}

.hb-footer__brand-name {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 18px;
  font-weight: 600;
  color: #aa0000;
  stroke-width: 0.3px;
  stroke: white;
  -webkit-text-stroke-width: 0.3px;
  -webkit-text-stroke-color: white;
  line-height: 1;
}

.hb-footer__reg {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 18px;
  font-weight: 600;
  color: white;
  line-height: 1;
  margin-left: 2px;
  margin-top: -2px;
}

.hb-footer__tagline {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 10px;
  font-weight: 400;
  color: white;
  line-height: 1.3;
  text-align: center;
}

/* ── Footer Divider ── */
.hb-footer__divider {
  width: 2px;
  height: 60px;
  background: rgba(255, 255, 255, 0.5);
  margin: 0 20px;
}

/* ── Footer Bottom Section ── */
.hb-footer__bottom {
  /* flex: 1; */
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 12px;
}

/* ── Footer Links ── */
.hb-footer__links {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: center;
  justify-content: center;
}

.hb-footer__link {
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  font-size: 13px;
  transition: color 0.2s ease;
}

.hb-footer__link:hover {
  color: #fff;
  text-decoration: underline;
}

/* ── Footer Copyright ── */

.hb-footer__copyright p {
  margin: 0;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.5);
  line-height: 1.6;
}

.hb-footer__copyright a {
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
}

.hb-footer__copyright a:hover {
  color: #fff;
  text-decoration: underline;
}

/* ── Footer Responsive ── */
@media (max-width: 768px) {
  :root {
    --hb-header-top-height: 48px;
    --hb-header-main-height: 72px;
    --hb-header-height: 120px;
    --hb-footer-height: 180px;
  }

  .hb-footer {
    height: auto;
    padding: 24px 16px;
  }

  .hb-footer__inner {
    flex-direction: column;
    text-align: center;
    gap: 16px;
  }

  .hb-footer__brand {
    margin-bottom: 0;
  }

  .hb-footer__divider {
    display: none;
  }

  .hb-footer__bottom {
    gap: 12px;
    align-items: center;
    width: 100%;
  }

  .hb-footer__links {
    justify-content: center;
    gap: 12px;
  }

  .hb-footer__link {
    font-size: 11px;
  }

  .hb-footer__copyright {
    text-align: center;
  }

  .hb-footer__copyright p {
    font-size: 11px;
    line-height: 1.5;
  }

  .hb-footer__brand-text {
    align-items: center;
  }

  .hb-footer__brand-title {
    justify-content: center;
  }

  .hb-footer__brand .hb-brand {
    --hb-brand-base: 16px;
  }

  .hb-footer__brand .hb-brand__tagline {
    font-size: 9px;
  }

  .hb-footer__logo {
    width: 40px;
  }
}

/* ============================================================
   Happy Buddha — Shop Page Styles (Figma: node 48:2)
   ============================================================ */

/* ── Shop Layout ──
   Wrapper CSS unified in layout.css */

/* ── Hero Banner ── */
.hb-shop-hero {
  position: relative;
  background: linear-gradient(
    to right,
    rgba(61, 43, 31, 0.8) 0%,
    rgba(0, 0, 0, 0) 100%
  );
  border-radius: 24px;
  overflow: hidden;
  min-height: 320px;
  margin-bottom: 32px;
  box-shadow:
    0px 20px 25px -5px rgba(0, 0, 0, 0.1),
    0px 8px 10px -6px rgba(0, 0, 0, 0.1);
}

.hb-shop-hero__image {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.hb-shop-hero__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hb-shop-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    to right,
    rgba(61, 43, 31, 0.8) 0%,
    rgba(61, 43, 31, 0.5) 50%,
    rgba(0, 0, 0, 0) 100%
  );
}

.hb-shop-hero__content {
  position: relative;
  z-index: 2;
  padding: 48px;
  max-width: 512px;
}

.hb-shop-hero__title {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 35.2px;
  font-weight: 500;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.88px;
  margin: 0 0 16px;
}

.hb-shop-hero__subtitle {
  font-family: "Poppins", "Plus Jakarta Sans", sans-serif;
  font-size: 15.2px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.5;
  margin: 0 0 32px;
}

.hb-shop-hero__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%);
  color: #fff;
  padding: 14px 28px;
  border-radius: 9999px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.7px;
  text-decoration: none;
  box-shadow:
    0px 10px 15px rgba(0, 0, 0, 0.1),
    0px 4px 6px rgba(0, 0, 0, 0.1);
  transition:
    transform 0.15s ease,
    opacity 0.15s ease;
}

.hb-shop-hero__cta:hover {
  color: #fff;
  text-decoration: none;
  transform: scale(1.02);
}

/* ── Feature Badges ── */
.hb-shop-features {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin-bottom: 32px;
  flex-wrap: wrap;
}

.hb-shop-feature {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  background: rgba(255, 255, 255, 0.4);
  border-radius: 16px;
  padding: 16px 24px;
  min-width: 140px;
}

.hb-shop-feature__icon {
  width: 20px;
  height: 20px;
}

.hb-shop-feature__text {
  font-size: 12px;
  font-weight: 600;
  color: rgba(61, 43, 31, 0.7);
  text-align: center;
}

/* ── Products Grid ── */
.hb-shop-products {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  margin-bottom: 48px;
}

/* ── Product Card ── */
.hb-product-card {
  position: relative;
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  height: 100%;
  box-shadow:
    0px 10px 15px -3px rgba(0, 0, 0, 0.1),
    0px 4px 6px -4px rgba(0, 0, 0, 0.1);
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.hb-product-card:hover {
  transform: translateY(-4px);
  box-shadow:
    0px 18px 24px -8px rgba(0, 0, 0, 0.16),
    0px 8px 12px -8px rgba(0, 0, 0, 0.12);
}

.hb-product-card__link {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
  color: inherit;
}

.hb-product-card__badge {
  position: absolute;
  top: 16px;
  right: 16px;
  background: #4b6b44;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 8px 16px;
  border-radius: 9999px;
  z-index: 2;
}

.hb-product-card__badge--golden {
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%);
}

.hb-product-card__image {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 256px;
  padding: 18px 24px 0;
  background: #fff;
  position: relative;
  overflow: hidden;
}

.hb-product-card--has-ribbon .hb-product-card__image {
  padding-top: 56px;
}

.hb-product-card__image img {
  max-width: 100%;
  max-height: 296px;
  height: auto;
  object-fit: contain;
}

.hb-product-card__promo-ribbon {
  position: absolute;
  top: 14px;
  right: 0;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 150px;
  height: 42px;
  padding: 0 22px;
  background: linear-gradient(180deg, #ff6f6f 0%, #ff4343 100%);
  color: #fff;
  font-family: var(--hb-font-body);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  text-align: center;
  white-space: nowrap;
  border-radius: 20px 0 0 20px;
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.25);
  pointer-events: none;
  animation: hb-sale-ribbon-pulse 2.2s ease-in-out infinite;
}

.hb-product-card__promo-ribbon--coming-soon {
  min-width: 170px;
  height: 42px;
  padding: 0 22px;
  white-space: nowrap;
  line-height: normal;
  letter-spacing: 0.8px;
  font-size: 13px;
  background: #b8860b;
  animation: none;
}

@keyframes hb-sale-ribbon-pulse {
  0%,
  100% {
    transform: translateY(0);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.25);
  }
  50% {
    transform: translateY(-2px);
    box-shadow: 0 12px 20px rgba(0, 0, 0, 0.32);
  }
}

.hb-product-card__content {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  gap: 16px;
  padding: 24px;
  background: #f8f8f8;
}

/* Badge row */
.hb-product-card__badge-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 2px;
}

.hb-product-card__ship-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 9999px;
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%);
  color: #fff;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.2px;
  line-height: 1;
  text-transform: uppercase;
  padding: 7px 12px;
}

.hb-product-card__ship-badge i {
  font-size: 12px;
}

.hb-product-card__sale-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 9999px;
  background: linear-gradient(180deg, #ff7b7b 0%, #e55353 100%);
  color: #fff;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.2px;
  line-height: 1;
  text-transform: uppercase;
  padding: 7px 12px;
}

.hb-product-card__sale-badge i {
  font-size: 11px;
}

.hb-product-card__rating {
  display: flex;
  align-items: center;
  gap: 2px;
  margin-bottom: 12px;
}

.hb-product-card__rating-count {
  font-size: 12px;
  color: rgba(61, 43, 31, 0.4);
  margin-left: 8px;
}

/* Title */
.hb-product-card__title {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 18.4px;
  font-weight: 700;
  color: #3d2b1f;
  text-transform: uppercase;
  line-height: 1.22;
  letter-spacing: 0.1px;
  margin: 0;
}
.hb-product-card__title-variant {
  display: block;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 12px;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.3px;
  color: rgba(61, 43, 31, 0.5);
  margin-top: 4px;
}

/* Variant */
.hb-product-card__variant {
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #d48a28;
  line-height: 24px;
  margin: 0;
}

.hb-product-card__size-value {
  font-weight: 400;
  color: #d48a28;
}

/* Description */
.hb-product-card__desc {
  font-family: "Poppins", sans-serif;
  font-size: 14px;
  line-height: 22.75px;
  color: #626262;
  margin: 0;
}

/* Footer */
.hb-product-card__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-top: auto;
  height: 56px;
}

.hb-product-card__price {
  display: flex;
  align-items: center;
  height: 100%;
}

.hb-product-card__price--coming-soon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  padding: 0 16px;
  border-radius: 9999px;
  background: #b8860b;
}

.hb-product-card__price-line {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  min-height: 100%;
}

.hb-product-card__price-main {
  font-family: "Plus Jakarta Sans", Georgia, serif;
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
  color: #bd0916;
}

.hb-product-card__price-regular {
  font-family: "Plus Jakarta Sans", Georgia, serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  color: #232323;
  text-decoration: line-through;
  opacity: 0.9;
}

.hb-product-card__price-sale {
  color: #bd0916;
}

.hb-product-card__price-suffix {
  font-family: "Plus Jakarta Sans", Georgia, serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  color: #232323;
}

.hb-product-card__coming-soon-text {
  color: #fff;
  font-family: "Montserrat", sans-serif;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  line-height: 1;
  white-space: nowrap;
}

.hb-product-card__price-sub {
  font-size: 12px;
  color: rgba(61, 43, 31, 0.4);
}

.hb-product-card__price-sub strong {
  color: #4b6b44;
  font-weight: 600;
}

.hb-product-card__view {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  text-transform: none;
  letter-spacing: normal;
  height: 40px;
}

.hb-product-card:hover .hb-product-card__view {
  transform: translateY(-1px);
}

/* ── Subscription CTA ── */
.hb-shop-cta {
  position: relative;
  background: linear-gradient(164deg, #fff5f0 0%, #ffe8db 100%);
  border-radius: 24px;
  padding: 48px;
  padding-top: 64px;
  text-align: center;
  box-shadow:
    0px 20px 25px rgba(0, 0, 0, 0.1),
    0px 8px 10px rgba(0, 0, 0, 0.1);
  margin-top: 48px;
}

.hb-shop-cta__logo {
  position: absolute;
  top: -40px;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: auto;
  z-index: 2;
}

.hb-shop-cta__logo img {
  width: 100%;
  height: auto;
}

@media (max-width: 768px) {
  .hb-shop-cta__logo {
    width: 48px;
    top: -24px;
  }
}

.hb-shop-cta__content {
  max-width: 500px;
  margin: 0 auto;
  padding-top: 16px;
}

.hb-shop-cta__title {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 22.4px;
  font-weight: 500;
  color: #3d2b1f;
  text-transform: uppercase;
  letter-spacing: 0.56px;
  margin: 0 0 12px;
}

.hb-shop-cta__desc {
  font-family: "Poppins", "Plus Jakarta Sans", sans-serif;
  font-size: 16px;
  line-height: 1.5;
  color: rgba(61, 43, 31, 0.6);
  margin: 0 0 32px;
}

.hb-shop-cta__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%);
  color: #fff;
  padding: 14px 32px;
  border-radius: 9999px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.7px;
  text-decoration: none;
  box-shadow:
    0px 10px 15px rgba(0, 0, 0, 0.1),
    0px 4px 6px rgba(0, 0, 0, 0.1);
  transition:
    transform 0.15s ease,
    opacity 0.15s ease;
}

.hb-shop-cta__btn:hover {
  color: #fff;
  text-decoration: none;
  transform: scale(1.02);
}

/* ── Shop Empty State ── */
.hb-shop-empty {
  text-align: center;
  padding: 48px;
  background: linear-gradient(137deg, #fff5f0 0%, #ffe8db 100%);
  border-radius: 24px;
  font-size: 16px;
  color: rgba(61, 43, 31, 0.6);
}

/* ── Hide Default WooCommerce Elements ── */
.post-type-archive-product .woocommerce-breadcrumb,
.post-type-archive-product .woocommerce-result-count,
.post-type-archive-product .woocommerce-ordering,
.post-type-archive-product .products-header {
  display: none;
}

/* Remove WooCommerce product loop wrapper */
.hb-shop-products .woocommerce-loop-product__link {
  display: none;
}

/* ── Shop Responsive ── */
@media (max-width: 900px) {
  .hb-shop-products {
    grid-template-columns: 1fr;
  }
  .hb-shop-hero__content {
    padding: 32px;
  }
  .hb-shop-hero__title {
    font-size: 28px;
  }
}

@media (max-width: 600px) {
  .hb-page-content {
    padding: 32px 16px 32px;
  }

  /* Wrapper responsive handled by unified CSS in layout.css */
  .hb-shop-hero {
    min-height: 280px;
  }
  .hb-shop-hero__title {
    font-size: 24px;
  }
  .hb-shop-hero__subtitle {
    font-size: 14px;
  }
  .hb-shop-features {
    flex-direction: row;
  }
  .hb-shop-feature {
    flex: 1;
    min-width: 100px;
    padding: 12px 16px;
  }
  .hb-product-card__image {
    min-height: 200px;
    padding: 18px 18px 0;
  }
  .hb-product-card__content {
    padding: 20px;
  }
  .hb-product-card__price-main {
    font-size: 24px;
  }
  .hb-product-card__price-regular,
  .hb-product-card__price-suffix {
    font-size: 14px;
  }
  .hb-product-card__view {
    min-height: 0;
  }
  .hb-product-card__price--coming-soon {
    height: 40px;
    padding: 0 12px;
  }
  .hb-product-card__coming-soon-text {
    font-size: 10px;
    letter-spacing: 0.35px;
  }
  .hb-shop-cta {
    padding: 32px 24px;
  }
  .hb-shop-cta__title {
    font-size: 20px;
  }
}

/* ============================================================
   My Account — Address Form (hb-acct-*)
   ============================================================ */

.hb-acct-form {
  margin: 0;
}

/* Card with Figma gradient */
.hb-acct-card {
  background: linear-gradient(151deg, #fff5f0 0%, #ffe8db 100%);
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Layout rows */
.hb-acct-row {
  display: grid;
  gap: 16px;
}
.hb-acct-row--2col {
  grid-template-columns: 1fr 1fr;
}
.hb-acct-row--3col {
  grid-template-columns: 1fr 1fr 1fr;
}
.hb-acct-field {
  display: flex;
  flex-direction: column;
}

/* WooCommerce form-row reset inside card (both address and profile forms) */
.hb-acct-card .form-row,
.hb-acct-card .woocommerce-form-row {
  margin: 0;
  padding: 0;
  float: none;
  width: auto !important;
}

/* Labels */
.hb-acct-card .form-row label,
.hb-acct-card .form-row > label,
.hb-acct-card .woocommerce-form-row label,
.hb-acct-card .woocommerce-form-row > label {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: rgba(61, 43, 31, 0.7);
  margin-bottom: 6px;
  order: unset;
}
.hb-acct-card .form-row .optional,
.hb-acct-card .woocommerce-form-row .optional {
  opacity: 0.5;
  font-weight: 400;
}

/* Inputs & selects */
.hb-acct-card .form-row input.input-text,
.hb-acct-card .form-row input[type="text"],
.hb-acct-card .form-row input[type="email"],
.hb-acct-card .form-row input[type="tel"],
.hb-acct-card .form-row input[type="number"],
.hb-acct-card .form-row input[type="password"],
.hb-acct-card .form-row select,
.hb-acct-card .woocommerce-form-row input.input-text,
.hb-acct-card .woocommerce-form-row input[type="text"],
.hb-acct-card .woocommerce-form-row input[type="email"],
.hb-acct-card .woocommerce-form-row input[type="password"],
.hb-acct-card .woocommerce-form-row select,
.hb-acct-card .form-row .select2-container .select2-selection--single {
  width: 100%;
  height: var(--hb-input-height);
  padding: 0 var(--hb-input-padding-x);
  background: var(--hb-white);
  border: 2px solid var(--hb-input-border-color);
  border-radius: var(--hb-input-border-radius);
  font-family: var(--hb-font-body);
  font-size: var(--hb-font-size-base);
  color: var(--hb-brown);
  outline: none;
  box-shadow: none;
  transition: border-color var(--hb-transition-fast);
  -webkit-appearance: none;
  appearance: none;
}
.hb-acct-card .form-row input.input-text:focus,
.hb-acct-card .form-row input[type="text"]:focus,
.hb-acct-card .form-row input[type="password"]:focus,
.hb-acct-card .form-row select:focus,
.hb-acct-card .woocommerce-form-row input:focus,
.hb-acct-card .woocommerce-form-row select:focus {
  border-color: var(--hb-input-focus-color);
}
.hb-acct-card .form-row input::placeholder,
.hb-acct-card .woocommerce-form-row input::placeholder {
  color: var(--hb-input-placeholder-color);
}

/* Display name hint text */
.hb-acct-card .woocommerce-form-row em {
  display: block;
  font-size: 12px;
  color: rgba(61, 43, 31, 0.5);
  margin-top: 6px;
  font-style: italic;
}

/* Password fieldset */
.hb-acct-card fieldset {
  border: 1.5px solid rgba(61, 43, 31, 0.12);
  border-radius: 12px;
  padding: 16px;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.hb-acct-card fieldset legend {
  font-size: 13px;
  font-weight: 600;
  color: rgba(61, 43, 31, 0.55);
  padding: 0 8px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Select2 overrides */
.hb-acct-card .select2-container--default .select2-selection--single {
  border: 2px solid rgba(61, 43, 31, 0.1) !important;
  border-radius: 14px !important;
  height: 48px !important;
  line-height: 44px !important;
  background: #fff !important;
}
.hb-acct-card
  .select2-container--default
  .select2-selection--single
  .select2-selection__rendered {
  line-height: 44px !important;
  padding: 0 32px 0 16px !important;
  color: #3d2b1f !important;
  font-size: 14px;
}
.hb-acct-card
  .select2-container--default
  .select2-selection--single
  .select2-selection__arrow {
  height: 46px !important;
  right: 12px !important;
}
.hb-acct-card
  .select2-container--default.select2-container--open
  .select2-selection--single,
.hb-acct-card
  .select2-container--default.select2-container--focus
  .select2-selection--single {
  border-color: #d48a28 !important;
  outline: none;
}

/* Validation error state */
.hb-acct-card .form-row.woocommerce-invalid input,
.hb-acct-card .form-row.woocommerce-invalid select {
  border-color: #bd0916 !important;
}
.hb-acct-card .form-row .woocommerce-error,
.hb-acct-card .form-row em.required {
  color: #bd0916;
  font-size: 12px;
  margin-top: 4px;
  display: block;
}

/* Action buttons */
.hb-acct-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 8px;
}

.hb-acct-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  padding: 0 28px;
  border-radius: 9999px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition:
    opacity 0.15s ease,
    box-shadow 0.15s ease;
  text-decoration: none;
}

.hb-acct-btn--save {
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%);
  color: #fff;
  border: none;
  box-shadow: 0 4px 12px rgba(212, 138, 40, 0.35);
}
.hb-acct-btn--save:hover {
  opacity: 0.9;
  box-shadow: 0 6px 16px rgba(212, 138, 40, 0.45);
  color: #fff;
}

.hb-acct-btn--cancel {
  background: transparent;
  color: rgba(61, 43, 31, 0.65);
  border: 2px solid rgba(61, 43, 31, 0.2);
}
.hb-acct-btn--cancel:hover {
  border-color: rgba(61, 43, 31, 0.4);
  color: #3d2b1f;
}

/* Responsive */
@media (max-width: 600px) {
  .hb-acct-row--2col,
  .hb-acct-row--3col {
    grid-template-columns: 1fr;
  }
  .hb-acct-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .hb-acct-btn {
    width: 100%;
    text-align: center;
  }
}

/* ══════════════════════════════════════════════════
   Order Confirmation / Thank You Page
   ══════════════════════════════════════════════════ */
.hb-thankyou-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 80vh;
  padding: 48px 24px;
}

.hb-thankyou {
  background: linear-gradient(137.5deg, #fff5f0 0%, #ffe8db 100%);
  border-radius: 28px;
  padding: 48px 40px 40px;
  width: 100%;
  max-width: 600px;
  text-align: center;
  box-shadow:
    0 20px 40px rgba(61, 43, 31, 0.12),
    0 4px 12px rgba(61, 43, 31, 0.06);
}

/* Icon */
.hb-thankyou__icon-wrap {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 24px;
  font-size: 36px;
}
.hb-thankyou__icon-wrap.hb-thankyou__icon--success {
  background: linear-gradient(135deg, #d4edda 0%, #a8d5b5 100%);
  color: #2d7a4f;
  box-shadow: 0 8px 20px rgba(45, 122, 79, 0.2);
}
.hb-thankyou__icon-wrap.hb-thankyou__icon--pending {
  background: linear-gradient(135deg, #fff3cd 0%, #f5d78e 100%);
  color: #b07d28;
  box-shadow: 0 8px 20px rgba(176, 125, 40, 0.2);
}

/* Headline */
.hb-thankyou__headline {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: 28px;
  font-weight: 700;
  color: #3d2b1f;
  margin: 0 0 8px;
}
.hb-thankyou__subline {
  font-size: 15px;
  color: rgba(61, 43, 31, 0.65);
  margin: 0 0 32px;
  line-height: 1.5;
}

/* Meta pills row */
.hb-thankyou__meta {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 28px;
}
.hb-thankyou__meta-item {
  background: rgba(255, 255, 255, 0.7);
  border-radius: 14px;
  padding: 12px 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  border: 1px solid rgba(61, 43, 31, 0.08);
}
.hb-thankyou__meta-label {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: rgba(61, 43, 31, 0.45);
}
.hb-thankyou__meta-value {
  font-size: 13px;
  font-weight: 700;
  color: #3d2b1f;
}
.hb-thankyou__status {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 99px;
  font-size: 11px;
}
.hb-thankyou__status--processing,
.hb-thankyou__status--on-hold {
  background: rgba(212, 138, 40, 0.15);
  color: #a06a1a;
}
.hb-thankyou__status--completed {
  background: rgba(45, 122, 79, 0.12);
  color: #2d7a4f;
}
.hb-thankyou__status--pending {
  background: rgba(61, 43, 31, 0.08);
  color: rgba(61, 43, 31, 0.6);
}
.hb-thankyou__status--cancelled,
.hb-thankyou__status--failed {
  background: rgba(180, 60, 60, 0.1);
  color: #b43c3c;
}

/* Order items */
.hb-thankyou__items {
  text-align: left;
  margin-bottom: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.hb-thankyou__item {
  display: flex;
  align-items: center;
  gap: 14px;
  background: rgba(255, 255, 255, 0.6);
  border-radius: 14px;
  padding: 12px 14px;
  border: 1px solid rgba(61, 43, 31, 0.07);
}
.hb-thankyou__item-img {
  width: 52px;
  height: 52px;
  flex-shrink: 0;
  border-radius: 10px;
  overflow: hidden;
  background: rgba(61, 43, 31, 0.05);
}
.hb-thankyou__thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.hb-thankyou__item-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.hb-thankyou__item-info strong {
  font-size: 13px;
  font-weight: 600;
  color: #3d2b1f;
}
.hb-thankyou__item-info span {
  font-size: 12px;
  color: rgba(61, 43, 31, 0.5);
}
.hb-thankyou__item-price {
  font-size: 14px;
  font-weight: 700;
  color: #3d2b1f;
}

/* Shipping address */
.hb-thankyou__address {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  background: rgba(255, 255, 255, 0.6);
  border-radius: 14px;
  padding: 14px 16px;
  margin-bottom: 28px;
  border: 1px solid rgba(61, 43, 31, 0.07);
  text-align: left;
}
.hb-thankyou__address-label {
  font-size: 12px;
  font-weight: 600;
  color: rgba(61, 43, 31, 0.5);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 6px;
  padding-top: 1px;
}
.hb-thankyou__address-value {
  font-size: 13px;
  color: #3d2b1f;
  line-height: 1.5;
}

/* CTA buttons */
.hb-thankyou__actions {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
}
/* ── Thank You Buttons — commented out, uses components.css ── */
/*
.hb-thankyou__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 13px 24px;
  border-radius: 9999px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  text-decoration: none;
  transition:
    transform 0.15s ease,
    opacity 0.15s ease;
}
.hb-thankyou__btn:hover {
  transform: scale(1.03);
  opacity: 0.92;
  text-decoration: none;
}
.hb-thankyou__btn--primary {
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%);
  color: #fff;
  box-shadow: 0 8px 18px rgba(212, 138, 40, 0.35);
}
.hb-thankyou__btn--secondary {
  background: rgba(61, 43, 31, 0.08);
  color: #3d2b1f;
  border: 1px solid rgba(61, 43, 31, 0.15);
}
*/

@media (max-width: 600px) {
  .hb-thankyou {
    padding: 36px 20px 28px;
  }
  .hb-thankyou__meta {
    grid-template-columns: repeat(2, 1fr);
  }
  .hb-thankyou__actions {
    flex-direction: column;
  }
  .hb-thankyou__btn {
    justify-content: center;
  }
}

/* ══════════════════════════════════════════════════
   WooCommerce Generic Button overrides
   (.button.alt / .woocommerce-Button--alt)
   ══════════════════════════════════════════════════ */
.woocommerce-Button--alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
#add_payment_method button.button.alt,
#add_payment_method #place_order,
button#place_order {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 13px 28px !important;
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 9999px !important;
  font-family: "Plus Jakarta Sans", sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0.6px !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  cursor: pointer !important;
  box-shadow: 0 8px 18px rgba(212, 138, 40, 0.35) !important;
  transition:
    transform 0.15s ease,
    opacity 0.15s ease !important;
}
.woocommerce-Button--alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #respond input#submit.alt:hover,
#add_payment_method button.button.alt:hover,
#add_payment_method #place_order:hover,
button#place_order:hover {
  color: #fff !important;
  text-decoration: none !important;
  transform: scale(1.02) !important;
  opacity: 0.93 !important;
}

/* ══════════════════════════════════════════════════
   Payment Methods — My Account
   ══════════════════════════════════════════════════ */
.hb-pm-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Card */
.hb-pm-card {
  display: flex;
  align-items: center;
  gap: 16px;
  background: linear-gradient(137.5deg, #fff5f0 0%, #ffe8db 100%);
  border: 1.5px solid rgba(61, 43, 31, 0.08);
  border-radius: 18px;
  padding: 18px 20px;
  transition:
    box-shadow 0.15s ease,
    transform 0.15s ease;
}
.hb-pm-card:hover {
  box-shadow: 0 6px 18px rgba(61, 43, 31, 0.1);
  transform: translateY(-1px);
}
.hb-pm-card--default {
  border-color: rgba(212, 138, 40, 0.35);
  box-shadow: 0 0 0 3px rgba(212, 138, 40, 0.08);
}

/* Brand icon */
.hb-pm-card__icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid rgba(61, 43, 31, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  color: #3d2b1f;
  flex-shrink: 0;
}

/* Body */
.hb-pm-card__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.hb-pm-card__label {
  font-size: 14px;
  font-weight: 600;
  color: #3d2b1f;
}
.hb-pm-card__expires {
  font-size: 12px;
  color: rgba(61, 43, 31, 0.5);
  display: flex;
  align-items: center;
  gap: 5px;
}
.hb-pm-card__default-badge {
  display: inline-flex;
  align-items: center;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #a06a1a;
  background: rgba(212, 138, 40, 0.12);
  border-radius: 99px;
  padding: 2px 8px;
  width: fit-content;
}

/* Actions */
.hb-pm-card__actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}

/* Empty state */
.hb-pm-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 48px 24px;
  text-align: center;
}
.hb-pm-empty__icon {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: rgba(61, 43, 31, 0.06);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  color: white;
}
.hb-pm-empty__text {
  font-size: 14px;
  color: white;
  margin: 0;
}

@media (max-width: 540px) {
  .hb-pm-card {
    flex-wrap: wrap;
  }
  .hb-pm-card__actions {
    width: 100%;
    justify-content: flex-end;
  }
}

/* ============================================================
   Single Product — Add-to-Cart Notice
   ============================================================ */

/* The notice is a <div class="woocommerce-message"> containing text + <a.button> */
.hb-product-wrap .woocommerce-message {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  margin: 0 0 24px !important;
  padding: 10px 0px 10px 14px !important;
  background: linear-gradient(144.42deg, #fff5f0 0%, #ffe8db 100%) !important;
  border-radius: 24px !important;
  border: none !important;
  border-top: none !important;
  box-shadow:
    0px 10px 15px rgba(0, 0, 0, 0.1),
    0px 4px 6px rgba(0, 0, 0, 0.1) !important;
  font-family: "Plus Jakarta Sans", sans-serif !important;
  font-size: 15px !important;
  color: #3d2b1f !important;
  line-height: 1.4 !important;
}

/* Replace WooCommerce's ::before icon with our green check circle */
.hb-product-wrap .woocommerce-message::before {
  content: "" !important;
  display: block !important;
  flex-shrink: 0 !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  border-radius: 50% !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='12' fill='%234b6b44'/%3E%3Cpath d='M7 12.5l3.5 3.5 6.5-7' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
    center / contain no-repeat !important;
  position: static !important;
  top: auto !important;
  left: auto !important;
  font-family: inherit !important;
  font-size: 0 !important;
  color: transparent !important;
}

/* "View cart" — gold gradient pill, matching .hb-product-add-btn */
.hb-product-wrap .woocommerce-message .button,
.hb-product-wrap .woocommerce-message a.button {
  margin-left: auto !important;
  flex-shrink: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  padding: 12px 28px !important;
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 9999px !important;
  font-family: "Plus Jakarta Sans", sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.8px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  float: none !important;
  box-shadow:
    0px 10px 15px rgba(0, 0, 0, 0.1),
    0px 4px 6px rgba(0, 0, 0, 0.1) !important;
  transition:
    transform 0.15s ease,
    opacity 0.15s ease;
}

.hb-product-wrap .woocommerce-message .button:hover,
.hb-product-wrap .woocommerce-message a.button:hover {
  transform: scale(1.02) !important;
  opacity: 0.95 !important;
  color: #fff !important;
  text-decoration: none !important;
}

/* ============================================================
   Happy Buddha — Product Detail V2
   Tabs · CTA row · About · Cooking · Better · Shop sections
   ============================================================ */

/* ── Tabs ── */
.hb-product-tabs {
  margin-top: 16px;
}
.hb-product-tabs__nav {
  display: flex;
  gap: 0;
  border-bottom: 1px solid rgba(61, 43, 31, 0.15);
  margin-bottom: 16px;
}
body.single-product .hb-tab-btn,
body.single-product .hb-tab-btn:hover,
body.single-product .hb-tab-btn:focus,
body.single-product .hb-tab-btn:active,
body.single-product .hb-tab-btn--active,
body.single-product .hb-tab-btn--active:hover,
body.single-product .hb-tab-btn--active:focus {
  background: none !important;
  background-color: transparent !important;
}
body.single-product .hb-tab-btn,
body.single-product .hb-tab-btn:hover,
body.single-product .hb-tab-btn:focus {
  color: rgba(0, 0, 0, 0.5) !important;
}
body.single-product .hb-tab-btn--active,
body.single-product .hb-tab-btn--active:hover,
body.single-product .hb-tab-btn:hover {
  color: #3d2b1f !important;
}
.hb-tab-btn {
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  padding: 0 0 10px;
  margin-right: 24px;
  font-family: "Poppins", sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.5) !important;
  cursor: pointer;
  transition:
    color 0.15s ease,
    border-color 0.15s ease;
  white-space: nowrap;
}
.hb-tab-btn--active,
.hb-tab-btn:hover {
  color: #3d2b1f !important;
  border-bottom-color: #d48a28;
  font-weight: 600;
}
.hb-tab-pane {
  display: none;
}
.hb-tab-pane--active {
  display: block;
}
.hb-product-tabs__body {
  position: relative;
  overflow: hidden;
  /* height set dynamically by JS */
}
.hb-product-tabs__body.hb-tabs-expanded {
  height: auto !important;
  overflow: visible;
}
.hb-tab-readmore-wrap {
  margin-top: 8px;
}
.hb-tabs-expanded ~ .hb-tab-readmore-wrap,
.hb-tab-readmore-wrap--expanded {
  margin-top: 4px;
  padding-top: 0;
  background: none;
}
.hb-tab-readmore {
  display: block;
  background: none !important;
  background-color: transparent !important;
  border: none;
  padding: 0;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #d48a28 !important;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hb-tab-readmore:hover {
  color: #b8721f !important;
}
.hb-tab-text {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 16px;
  line-height: 1.625;
  color: rgba(0, 0, 0, 0.7);
  margin: 0 0 12px;
}
.hb-tab-text:last-child {
  margin-bottom: 0;
}
.hb-product-desc {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 15px;
  line-height: 1.625;
  color: rgba(0, 0, 0, 0.7);
  margin-bottom: 12px;
}

/* ── Free shipping badge (above CTA) ── */
.hb-free-shipping-badge {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.7);
  margin: 12px 0 16px;
}
.hb-free-shipping-badge svg path {
  fill: rgba(61, 43, 31, 0.8);
}

/* ── CTA row: Add to Cart + Find Your Plan ── */
.hb-cart-form {
  margin-bottom: 0;
}
.hb-cta-row {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
}
.hb-cta-row .hb-product-add-btn {
  flex: 1;
  min-width: 140px;
}
.hb-find-plan-btn {
  flex: 1;
  min-width: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 52px;
  border-radius: 9999px;
  border: 2px solid #d48a28;
  background: transparent;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  color: #d48a28;
  text-decoration: none;
  transition:
    background 0.15s ease,
    color 0.15s ease;
}
.hb-find-plan-btn:hover {
  background: #d48a28;
  color: #fff;
  text-decoration: none;
}

/* ── Shared section styles ── */
.hb-section-heading {
  font-family: "Trajan Pro", "Times New Roman", serif;
  font-size: 28.8px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.72px;
  text-transform: uppercase;
  color: #3d2b1f;
  margin: 0 0 40px;
}
.hb-section-heading--white {
  color: #fff;
}

/* ── Section: What is Happy Buddha Rice? ── */
.hb-section-about {
  position: relative;
  z-index: 1;
  overflow: hidden;
  height: 512px;
}
/* Buddha: absolute, pinned to left edge, full height */
.hb-section-about__buddha-img {
  position: absolute;
  left: -10px;
  top: 50%;
  transform: translateY(-50%);
  height: clamp(240px, 50vh, 400px) !important;
  width: auto;
  z-index: 2;
  pointer-events: none;
}
/* Inner row: brand text + star card */
.hb-section-about__inner {
  position: relative;
  z-index: 1;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: clamp(16px, 2.4vw, 40px);
  height: 100%;
  padding: 60px 120px 60px 240px;
}
/* Brand: heading + tagline */
.hb-section-about__brand {
  flex: 0 1 auto;
  padding: 0 32px;
}
.hb-section-about__brand .hb-brand {
  --hb-brand-base: clamp(28px, 3.2vw, 42px);
  --hb-brand-stroke: 1px;
  width: max-content;
  max-width: 100%;
  align-items: flex-start;
}
.hb-section-about__brand .hb-brand__tagline {
  text-align: left;
}
.hb-section-about__heading {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: clamp(22px, 2.6vw, 42px);
  font-weight: 600;
  color: #fff;
  /* -webkit-text-stroke: 0.3px #d48a28; */
  /* text-stroke: 0.3px #d48a28; */
  line-height: 1;
  color: #aa0000;
  stroke-width: 1px;
  stroke: white;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: white;
}
.hb-section-about__reg {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: clamp(22px, 2.6vw, 42px);
  font-weight: 600;
  color: white;
  -webkit-text-stroke-width: 0;
  vertical-align: super;
  top: 10px !important;
}
.hb-section-about__tagline {
  font-family: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  font-size: clamp(13px, 1.4vw, 22px);
  font-weight: 400;
  color: #fff;
  line-height: 1.45;
  margin: 0;
  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.3);
}
/* Star card: image + overlaid content */
.hb-section-about__star-wrap {
  flex: 0 0 auto;
  width: clamp(280px, 38vw, 560px);
  aspect-ratio: 1764 / 1572;
  background: center / contain no-repeat
    url("/wp-content/uploads/2025/02/Happy_Buddha_Star_Background_1764x1572.png");
  display: flex;
  align-items: center;
  justify-content: center;
}
.hb-section-about__star-img {
  display: block;
  width: 100%;
  height: auto;
}
.hb-section-about__star-content {
  position: static;
  transform: none;
  width: 52%;
  text-align: center;
}
.hb-section-about__coin-img {
  display: block;
  width: 40%;
  min-width: 96px;
  max-width: 220px;
  height: auto;
  margin: 0 auto 10px;
}
.hb-section-about__donation {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: clamp(10px, 0.85vw, 14px);
  line-height: 1.45;
  color: #1a0a00;
  margin: 0;
}
.hb-section-about__donation--2 {
  margin-top: 10px;
}
.hb-section-about__donation strong {
  font-weight: 700;
  color: #1a0a00;
}

/* ── Section: How to Cook ── */
.hb-section-cooking {
  position: relative;
  z-index: 1;
  background: #fffaf4;
  padding: 56px 80px 44px;
}
.hb-section-cooking__inner {
  max-width: 1720px;
  margin: 0 auto;
}
.hb-section-cooking .hb-section-heading {
  text-align: center;
}
.hb-cooking-eyebrow {
  margin: 0 0 8px;
  text-align: center;
  font-family: "Plus Jakarta Sans", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: clamp(22px, 1.6vw, 36px);
  line-height: 1.08;
  color: #402006;
  font-weight: 700;
}
.hb-cooking-heading {
  margin: 0 0 30px;
  font-size: clamp(30px, 2.7vw, 58px);
  line-height: 0.98;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  color: #eb4a1a;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-weight: 800;
}
.hb-cooking-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
  margin-bottom: 14px;
}
.hb-cooking-col {
  display: grid;
  grid-template-columns: 34% 66%;
  border: 2px solid #f8c6a0;
  border-radius: 24px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.75);
}
.hb-cooking-col__media {
  min-height: 100%;
  max-height: 320px;
}
.hb-cooking-col__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.hb-cooking-col__content {
  padding: 30px 26px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.hb-cooking-col__title {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: clamp(24px, 1.4vw, 34px);
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #ec6a26;
  margin: 0;
}
.hb-cooking-col__ratio-line {
  margin: 12px 0 10px;
  width: 80%;
  height: 1px;
  background: linear-gradient(
    90deg,
    rgba(241, 151, 95, 0) 0%,
    rgba(241, 151, 95, 0.8) 32%,
    rgba(241, 151, 95, 0.8) 68%,
    rgba(241, 151, 95, 0) 100%
  );
  position: relative;
}
.hb-cooking-col__ratio-dot {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #f09863;
  transform: translate(-50%, -50%);
}
.hb-cooking-ratio-value {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: clamp(40px, 3.1vw, 72px);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.03em;
  color: #f26c1f;
  margin: 0 0 18px;
}
.hb-ratio-num {
  display: block;
  font-size: clamp(16px, 0.95vw, 20px);
  font-weight: 800;
  color: #de5c16;
  line-height: 1;
  margin-bottom: 2px;
}
.hb-cooking-ratios {
  display: flex;
  justify-content: center;
  align-items: stretch;
  width: 100%;
  gap: 12px;
}
.hb-cooking-ratio {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 14px;
  min-width: 0;
  flex: 1;
}
.hb-cooking-ratios__divider {
  width: 1px;
  background: #f3bf9f;
  opacity: 0.85;
}
.hb-cooking-cup {
  width: clamp(52px, 3.4vw, 76px);
  height: clamp(52px, 3.4vw, 76px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  font-size: clamp(24px, 1.8vw, 34px);
  line-height: 1;
}
.hb-cooking-cup--rice {
  color: #de5c16;
  background: rgba(242, 108, 31, 0.12);
}
.hb-cooking-cup--water-full,
.hb-cooking-cup--water-half {
  color: #2d7ff9;
  background: rgba(45, 127, 249, 0.12);
}
.hb-cooking-cup--water-half {
  opacity: 0.75;
}
.hb-cooking-ratio__label {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: clamp(15px, 0.85vw, 18px);
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  color: #5f2f12;
  text-align: center;
}
.hb-cooking-footnote {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: clamp(17px, 1vw, 22px);
  line-height: 1.25;
  color: #5d2f14;
  text-align: center;
  margin: 14px auto 0;
}

/* ── Section: What Makes Happy Buddha Better? ── */
.hb-section-better {
  position: relative;
  z-index: 1;
  padding: 64px 153px;
}
.hb-section-better__inner {
  background: rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(4px);
  border-radius: 24px;
  padding: 40px 24px;
  box-shadow: 0 2px 13px rgba(0, 0, 0, 0.1);
}
.hb-section-better .hb-section-heading {
  text-align: center;
  margin-bottom: 48px;
}
.hb-better-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
}
.hb-better-col {
  text-align: center;
  padding: 0 24px;
}
.hb-better-col + .hb-better-col {
  border-left: 1px solid rgba(255, 255, 255, 0.1);
}
.hb-better-col__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 16px;
  background: rgba(75, 107, 68, 0.2);
  margin: 0 auto 20px;
  color: white;
}
.hb-better-col > .fa-solid {
  display: block;
  font-size: 64px;
  line-height: 1;
  color: #fff;
  margin: 0 auto 20px;
}
.hb-better-col__title {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  color: #fff;
  margin: 0 0 12px;
}
.hb-better-col__desc {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  line-height: 1.625;
  color: rgba(255, 255, 255, 0.7);
  margin: 0;
}

/* ── Section: Shop Our Other Product ── */
.hb-section-shop {
  position: relative;
  z-index: 1;
  padding: 64px 153px 80px;
}
.hb-section-shop__inner {
  max-width: 1154px;
  margin: 0 auto;
}
.hb-shop-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 24px;
}

.hb-shop-empty {
  text-align: center;
  padding: 40px 20px;
  color: #fff;
}

.hb-shop-empty__message {
  font-size: 18px;
  margin-bottom: 16px;
}

.hb-shop-empty__link {
  display: inline-block;
  padding: 12px 24px;
  background: #3d2b1f;
  color: #fff;
  text-decoration: none;
  border-radius: 4px;
  font-weight: 500;
}

.hb-shop-empty__link:hover {
  background: #5a4030;
}

.hb-shop-card {
  display: flex;
  flex-direction: column;
  border-radius: 24px;
  overflow: hidden;
  background: linear-gradient(124deg, #fff5f0 0%, #ffe8db 100%);
  box-shadow:
    0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -4px rgba(0, 0, 0, 0.1);
  text-decoration: none;
  color: inherit;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}
.hb-shop-card:hover {
  transform: translateY(-4px);
  box-shadow:
    0 16px 24px -4px rgba(0, 0, 0, 0.15),
    0 8px 10px -4px rgba(0, 0, 0, 0.1);
  text-decoration: none;
  color: inherit;
}
.hb-shop-card__image {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 240px;
  background: linear-gradient(141deg, #ffe8db 0%, #ffdcc8 100%);
  padding: 20px;
}
.hb-shop-card__image img {
  max-height: 200px;
  width: auto;
  object-fit: contain;
}
.hb-shop-card__content {
  padding: 20px 24px 24px;
}
.hb-shop-card__rating {
  display: flex;
  align-items: center;
  gap: 2px;
  margin-bottom: 8px;
}
.hb-shop-card__rating svg {
  width: 14px;
  height: 14px;
}
.hb-shop-card__rating-count {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 12px;
  color: rgba(61, 43, 31, 0.4);
  margin-left: 4px;
}
.hb-shop-card__title {
  font-family: "Trajan Pro", "Times New Roman", serif;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.46px;
  text-transform: uppercase;
  color: #3d2b1f;
  margin: 0 0 8px;
}
.hb-shop-card__desc {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  line-height: 1.625;
  color: rgba(61, 43, 31, 0.6);
  margin: 0 0 16px;
}
.hb-shop-card__price {
  font-family: "Crimson Pro", serif;
  font-size: 28px;
  color: #3d2b1f;
}
.hb-shop-card__price .woocommerce-Price-amount {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}

/* ── Responsive: new sections ── */
@media (max-width: 1300px) {
  .hb-product-wrap {
    padding: 40px 48px 64px;
  }
}
@media (max-width: 1280px) {
  .hb-section-cooking,
  .hb-section-better,
  .hb-section-shop {
    padding-left: 48px;
    padding-right: 48px;
  }
}
@media (max-width: 900px) {
  .hb-section-about__buddha-img {
    height: 46%;
  }
  .hb-section-about__inner {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px 48px 36%;
    gap: 24px;
  }
  .hb-section-about__brand {
    padding: 0;
    text-align: left;
  }
  .hb-section-about__star-wrap {
    width: clamp(220px, 70vw, 360px);
  }
  .hb-section-about__coin-img {
    width: 22%;
    min-width: 56px;
    max-width: 140px;
  }
  .hb-section-cooking,
  .hb-section-better,
  .hb-section-shop {
    padding: 48px 24px;
  }
  .hb-cooking-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .hb-cooking-col {
    grid-template-columns: 1fr;
  }
  .hb-cooking-col__media {
    height: auto;
    max-height: none;
  }
  .hb-cooking-col__media img {
    height: auto;
    object-fit: contain;
  }
  .hb-cooking-col__content {
    padding: 30px 22px;
  }
  .hb-cooking-ratio-value {
    margin-bottom: 16px;
  }
  .hb-cooking-ratios {
    gap: 10px;
  }
  .hb-better-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .hb-better-col + .hb-better-col {
    border-left: none;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 32px;
  }
  .hb-cta-row {
    flex-direction: column;
  }
  .hb-cta-row .hb-product-add-btn,
  .hb-find-plan-btn {
    width: 100%;
    flex: none;
  }
}
/* Override subscription-page min-height on size buttons for product page */
body.single-product .hb-sz-btn {
  min-height: unset !important;
  padding-right: 24px !important;
}

/* ── Coming Soon ── */
.hb-coming-soon-notice {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 28px;
  background: linear-gradient(160deg, #fff5f0 0%, #ffe8db 100%);
  border: 2px dashed #d48a28;
  border-radius: 9999px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: #d48a28;
  margin-top: 8px;
}
.hb-coming-soon-notice i {
  font-size: 16px;
}
.hb-coming-soon-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  background: rgba(212, 138, 40, 0.1);
  border: 1.5px dashed #d48a28;
  border-radius: 9999px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: #d48a28;
  pointer-events: none;
}

/* Coming Soon card badge (archive page) */

/* Coming Soon card badge (archive page) */

/* ============================================================
/* ============================================================
   Happy Buddha — 404 Page  (Figma: node 42:270)
   Uses same video background layout as subscription/cart pages.
   ============================================================ */

/* ── 404 Wrapper (centered in video background) ── */
.hb-404-wrap {
  position: relative !important;
  z-index: 10 !important;
  position: relative;
  z-index: 10;
  width: 100%;
  max-width: 720px;
  margin: 0 auto;
  padding: 156px 32px 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
}

/* ── 404 Card ── */
.hb-404-card {
  position: relative;
  z-index: 10;
  background: linear-gradient(147deg, #fff5f0 0%, #fff2d9 50%, #ffe4d9 100%);
  border-radius: 24px;
  padding: 60px 48px 50px;
  box-shadow:
    0 20px 25px rgba(0, 0, 0, 0.1),
    0 8px 10px rgba(0, 0, 0, 0.1);
  text-align: center;
  width: 100%;
}

/* ── 404 Number ── */
.hb-404-number {
  font-family: "Crimson Pro", Georgia, serif;
  font-size: 80px;
  font-weight: 400;
  color: #d48a28;
  line-height: 1;
  margin-bottom: 8px;
}

/* ── 404 Title ── */
.hb-404-title {
  font-family: "Trajan Pro", "Crimson Pro", Georgia, serif;
  font-size: 25.6px;
  font-weight: 500;
  color: #3d2b1f;
  text-transform: uppercase;
  letter-spacing: 0.64px;
  margin-bottom: 24px;
}

/* ── 404 Message ── */
.hb-404-message {
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  color: rgba(61, 43, 31, 0.6);
  line-height: 1.5;
  margin-bottom: 40px;
  max-width: 448px;
  margin-left: auto;
  margin-right: auto;
}

/* ── 404 Buttons ── */
.hb-404-buttons {
  display: flex;
  gap: 16px;
  justify-content: center;
  align-items: center;
}

.hb-404-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 32px;
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%);
  color: #fff;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.7px;
  border-radius: 9999px;
  box-shadow:
    0 10px 15px rgba(0, 0, 0, 0.1),
    0 4px 6px rgba(0, 0, 0, 0.1);
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.hb-404-btn-primary:hover {
  transform: translateY(-2px);
  box-shadow:
    0 12px 20px rgba(0, 0, 0, 0.15),
    0 6px 8px rgba(0, 0, 0, 0.1);
  color: #fff;
}

.hb-404-btn-primary i {
  font-size: 16px;
}

.hb-404-btn-secondary {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 24px;
  background: transparent;
  color: rgba(61, 43, 31, 0.7);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.7px;
  border: 2px solid rgba(61, 43, 31, 0.15);
  border-radius: 9999px;
  transition:
    border-color 0.2s ease,
    color 0.2s ease;
}

.hb-404-btn-secondary:hover {
  border-color: rgba(61, 43, 31, 0.3);
  color: #3d2b1f;
}

.hb-404-btn-secondary i {
  font-size: 16px;
}

/* ── Mobile Responsive ── */
@media (max-width: 768px) {
  .hb-404-wrap {
    position: relative !important;
    z-index: 10 !important;
    padding: 24px 16px;
  }

  .hb-404-card {
    padding: 40px 24px 32px;
  }

  .hb-404-number {
    font-size: 60px;
  }

  .hb-404-title {
    font-size: 20px;
  }

  .hb-404-message {
    font-size: 14px;
    margin-bottom: 32px;
  }

  .hb-404-buttons {
    flex-direction: column;
    gap: 12px;
  }

  .hb-404-btn-primary,
  .hb-404-btn-secondary {
    width: 100%;
    justify-content: center;
  }
}

/* ── Checkout Step Navigation ── */
.hb-checkout-step--hidden {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 0;
  overflow: hidden;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  z-index: -1;
}

.hb-checkout-step {
  position: relative;
  width: 100%;
  transition:
    opacity 0.3s ease,
    visibility 0.3s ease;
}

/* ── Validation Message ── */
.hb-validation-message {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  margin-bottom: 16px;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 8px;
  color: #dc2626;
  font-size: 14px;
  font-weight: 500;
}

.hb-validation-message svg {
  color: #dc2626;
}

.hb-checkout-form .woocommerce-invalid input,
.hb-checkout-form .woocommerce-invalid select {
  border-color: #dc2626 !important;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.15) !important;
}

/* ── Express Payment Methods ── */
.hb-express-payment {
  margin-bottom: 24px;
}

.hb-express-payment:empty {
  display: none;
}

/* Style Stripe Payment Request buttons */
.hb-express-payment .woocommerce-payment-request-buttons {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.hb-express-payment .woocommerce-payment-request-buttons li {
  list-style: none;
  margin: 0;
}

/* ── Express payment separator (Apple Pay / Google Pay above standard methods) ── */
.hb-checkout-form .hb-express-payment:not(:empty) + * {
  border-top: 1px solid rgba(61, 43, 31, 0.1);
  padding-top: 24px;
}

.hb-checkout-continue {
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid rgba(61, 43, 31, 0.1);
}

.hb-checkout-continue__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 16px 24px;
  background: linear-gradient(180deg, #f3b255 0%, #d48a28 100%);
  border: none;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  cursor: pointer;
  box-shadow:
    0px 10px 15px rgba(0, 0, 0, 0.1),
    0px 4px 6px rgba(0, 0, 0, 0.1);
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.hb-checkout-continue__btn:hover {
  transform: translateY(-2px);
  box-shadow:
    0px 12px 18px rgba(0, 0, 0, 0.15),
    0px 5px 8px rgba(0, 0, 0, 0.15);
}

.hb-checkout-continue__btn svg {
  transition: transform 0.2s ease;
}

.hb-checkout-continue__btn:hover svg {
  transform: translateX(4px);
}

.hb-checkout-back-step {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0;
  margin-bottom: 24px;
  background: none !important;
  border: none;
  font-size: 14px;
  font-weight: 500;
  color: rgba(61, 43, 31, 0.5);
  cursor: pointer;
  transition: color 0.2s ease;
  outline: none;
  box-shadow: none;
}

.hb-checkout-back-step:hover {
  color: rgba(61, 43, 31, 0.8);
  background: none !important;
  outline: none;
  box-shadow: none;
}

.hb-checkout-back-step svg {
  transition: transform 0.2s ease;
}

.hb-checkout-back-step:hover svg {
  transform: translateX(-4px);
}

/* ── Delivery Fee Display ── */
.hb-summary-pending {
  color: rgba(61, 43, 31, 0.5);
  font-size: 13px;
}

.hb-summary-row--delivery .hb-summary-free {
  color: #22c55e;
  font-weight: 700;
}

@media (max-width: 768px) {
  .hb-checkout-continue__btn {
    padding: 14px 20px;
    font-size: 15px;
  }

  .hb-checkout-back-step {
    margin-bottom: 16px;
  }
}

/* ============================================================
   Homepage (front-page.php) — hb-home-*
   ============================================================ */

/* ── Shared video background utility ── */
.hb-home {
  overflow-x: hidden;
}

.hb-home-video-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

.hb-home-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.hb-home-overlay {
  position: absolute;
  inset: 0;
  background: var(--hb-gradient-video-overlay);
  z-index: 1;
}

/* Slide-specific overlay — overrides the shared brand gradient */
.hb-home-slide .hb-home-overlay {
  background: var(--hb-gradient-slide-dark);
  background-color: transparent;
}

/* ── Section 1: Hero ── */
.hb-home-hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hb-home-hero__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
  padding: 32px var(--hb-page-padding);
}

.hb-home-hero__logo {
  width: 120px;
  height: auto;
}

/* Brand block scaled up for hero */
.hb-home-hero__content .hb-brand {
  --hb-brand-base: 42px;
  --hb-brand-stroke: 1px;
  align-items: center;
}

.hb-home-hero__content .hb-btn {
  margin-top: 16px;
}

/* ── Section 2: Home Promotion Banner ── */
.hb-home-promotion-banner {
  position: relative;
  width: 100%;
  height: 100vh;
  background-color: #c44b06;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.hb-home-promotion-banner__bg-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  pointer-events: none;
  user-select: none;
}

.hb-home-promotion-banner__foreground {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 1300px;
  min-height: calc(100vh - var(--hb-header-height, 120px));
  padding: calc(var(--hb-header-height, 120px) + 24px) var(--hb-page-padding) 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}

.hb-home-promotion-banner__products {
  flex: 0 1 80%;
  min-width: 0;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
}

.hb-home-promotion-banner__bag {
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 14px 34px rgba(0, 0, 0, 0.32));
  animation: hb-banner-bag-bounce 2.8s ease-in-out infinite;
  transform-origin: center bottom;
}

.hb-home-promotion-banner__bag--20kg {
  width: min(34vw, 420px);
  animation-delay: 0s;
}

.hb-home-promotion-banner__bag--10kg {
  width: min(23.8vw, 294px);
  margin-left: -60px;
  animation-delay: 0.24s;
}

@keyframes hb-banner-bag-bounce {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-12px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hb-home-promotion-banner__bag {
    animation: none;
  }
}

.hb-home-promotion-banner__offer {
  flex: 1 1 40%;
  min-width: 0;
  max-width: none;
  width: 100%;
}

.hb-home-promotion-banner__offer-link {
  display: block;
  width: 100%;
}

.hb-home-promotion-banner__offer-image {
  display: block;
  width: 100%;
  height: auto;
  transform: scale(1);
  transform-origin: center;
  transition: transform 220ms ease;
}

.hb-home-promotion-banner__offer-link:hover .hb-home-promotion-banner__offer-image,
.hb-home-promotion-banner__offer-link:focus-visible .hb-home-promotion-banner__offer-image {
  transform: scale(1.03);
}

@media (prefers-reduced-motion: reduce) {
  .hb-home-promotion-banner__offer-image {
    transition: none;
  }

  .hb-home-promotion-banner__offer-link:hover .hb-home-promotion-banner__offer-image,
  .hb-home-promotion-banner__offer-link:focus-visible .hb-home-promotion-banner__offer-image {
    transform: none;
  }
}

.hb-home-promotion-banner__price-card,
.hb-home-promotion-banner__shipping-card {
  position: relative;
  border-radius: 22px;
  background: linear-gradient(180deg, #fff9db 0%, #fff0bb 100%);
  border: 2px solid rgba(255, 255, 255, 0.65);
  box-shadow: 0 10px 24px rgba(97, 20, 0, 0.28), 0 0 18px rgba(255, 210, 92, 0.55);
  text-align: center;
  padding: 20px 20px 16px;
  overflow: hidden;
}

.hb-home-promotion-banner__weight {
  display: inline-block;
  margin-top: -44px;
  margin-bottom: 10px;
  padding: 5px 18px;
  border-radius: 999px;
  background: linear-gradient(180deg, #d11302 0%, #840600 100%);
  color: #fff;
  font-family: var(--hb-font-poppins);
  font-size: clamp(20px, 1.6vw, 34px);
  line-height: 1;
  font-weight: 700;
}

.hb-home-promotion-banner__price-line {
  margin: 0;
  color: #b10800;
  font-family: var(--hb-font-title);
  font-size: clamp(42px, 4vw, 62px);
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0.01em;
  display: inline-flex;
  align-items: baseline;
  justify-content: center;
  gap: 12px;
}

.hb-home-promotion-banner__price-old {
  text-decoration: line-through;
  text-decoration-thickness: 2px;
  text-decoration-color: rgba(177, 8, 0, 0.8);
  opacity: 0.92;
}

.hb-home-promotion-banner__price-sep {
  font-size: 0.64em;
  line-height: 1;
  color: #b10800;
}

.hb-home-promotion-banner__price-new {
  color: #b10800;
}

.hb-home-promotion-banner__shipping-title {
  margin: 0;
  color: #b10800;
  font-family: var(--hb-font-poppins);
  font-size: clamp(28px, 2.2vw, 44px);
  line-height: 1.05;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.hb-home-promotion-banner__shipping-subtitle {
  margin: 4px 0 0;
  color: #2d2d2d;
  font-family: var(--hb-font-poppins);
  font-size: clamp(16px, 1.2vw, 22px);
  line-height: 1.2;
  font-weight: 700;
}

.hb-home-promotion-banner__cta {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 84px;
  padding: 16px 40px;
  border-radius: 999px;
  background: linear-gradient(180deg, #ff4e00 0%, #ba0900 100%);
  color: #fff;
  border: 2px solid rgba(255, 255, 255, 0.85);
  font-family: var(--hb-font-poppins);
  font-size: clamp(34px, 2.4vw, 54px);
  font-weight: 800;
  letter-spacing: 0.02em;
  text-decoration: none;
  box-shadow: 0 12px 24px rgba(108, 20, 0, 0.4);
  transition: transform var(--hb-transition-normal), filter var(--hb-transition-normal);
  overflow: hidden;
  isolation: isolate;
  gap: 12px;
}

.hb-home-promotion-banner__inline-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  font-size: 0.82em;
}

.hb-home-promotion-banner__cta:hover,
.hb-home-promotion-banner__cta:focus-visible {
  transform: translateY(-2px);
  filter: brightness(1.03);
}


/* ── Section 3: Giveaway Banner ── */
/* ============================================================
   Section 2: Giveaway Banner — matches Elementor structure
   Outer container: classic BG (#D81F29 HB Red)
   Inner video container: 500px min-height
   ============================================================ */
/* ============================================================
   Section 2: Giveaway Banner — 100vh viewport
   Background: video (top 500px) + red color
   Overlay elements: positioned relative to section
   ============================================================ */
.hb-home-giveaway {
  position: relative;
  height: 100vh;
  min-height: 100vh;
  background-color: #D81F29;
  overflow: hidden;
}

.hb-home-giveaway__video-container {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 500px;
  overflow: hidden;
  z-index: 1;
  background-color: #000000;
}

.hb-home-giveaway__video-container .hb-home-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hb-home-giveaway__video-container::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.3);
  z-index: 2;
}

.hb-home-giveaway__paint {
  position: absolute;
  top: 400px;
  left: 0;
  width: 100%;
  height: auto;
  z-index: 2;
}

.hb-home-giveaway__overlay {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: var(--hb-page-max-width);
  height: 100%;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  justify-content: space-between;
  padding: 80px var(--hb-page-padding);
  z-index: 3;
}

.hb-home-giveaway__col-left {
  flex: 1;
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: flex-start;
}

.hb-home-giveaway__col-middle {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.hb-home-giveaway__col-right {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
}

.hb-home-giveaway__airline {
  width: 100%;
  max-width: 600px;
  height: auto;
  transform: translateY(64px);
}

.hb-home-giveaway__prize-text {
  width: 100%;
  max-width: 600px;
  height: auto;
  transform: translateY(-16px);
}

.hb-home-giveaway__btn {
  margin-top: 16px;
}

.hb-home-giveaway__bag--20kg {
  width: 290px;
  height: auto;
  position: relative;
  z-index: 1;
}

.hb-home-giveaway__bag--10kg {
  width: 200px;
  height: auto;
  margin-left: -55px;
  position: relative;
  z-index: 2;
}

.hb-home-giveaway__couple {
  width: 350px;
  height: auto;
}

/* ── Section 3: Product Carousel ── */
.hb-home-carousel {
  position: relative;
  height: 100vh;
  overflow: hidden;
}

.hb-home-slides {
  position: relative;
  width: 100%;
  height: 100%;
}

.hb-home-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.6s ease;
  pointer-events: none;
}

.hb-home-slide--active {
  opacity: 1;
  pointer-events: auto;
}

.hb-home-slide__inner {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: row;
  align-items: center;
  height: 100%;
  gap: 24px;
  max-width: 1200px;
  margin: 0 auto;
  box-sizing: border-box;
}

.hb-home-slide__images {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 24px;
  flex: 0 0 50%;
}

.hb-home-slide__bags {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: center;
  gap: 16px;
}

.hb-home-slide__bag {
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 8px 24px rgba(0, 0, 0, 0.4));
}

.hb-home-slide__bag--20kg {
  width: 280px;
}

.hb-home-slide__bag--10kg {
  width: 200px;
}

.hb-home-slide__images .hb-btn--secondary {
  color: white;
  border: 2px solid white;
}

.hb-home-slide__btn {
  width: 50%;
  margin-top: 12px;
}


.hb-home-slide__content {
  flex: 0 0 50%;
  min-height: 320px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 12px;
  padding: 0;
  overflow: hidden;
}

/* Brand component in slide context - same size as hero */
.hb-home-slide__content .hb-brand {
  --hb-brand-base: 42px;
  --hb-brand-stroke: 1px;
}

.hb-home-slide__subtitle {
  font-family: var(--hb-font-title);
  font-size: var(--hb-font-size-xl);
  color: var(--hb-white);
  margin: 0;
  line-height: 1.4;
}

.hb-home-slide__desc {
  font-family: var(--hb-font-poppins);
  color: var(--hb-white);
  font-size: var(--hb-font-size-sm);
  line-height: 1.7;
}

.hb-home-slide__desc p {
  margin: 0 0 12px;
  text-align: justify;
}

.hb-home-slide__desc p:last-child {
  margin-bottom: 0;
}

/* Carousel dot navigation */
.hb-home-carousel__dots {
  position: absolute;
  bottom: 32px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  display: flex;
  gap: 12px;
  align-items: center;
}

.hb-home-carousel__dot {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid var(--hb-white);
  background: transparent;
  cursor: pointer;
  padding: 0;
  transition: background var(--hb-transition-normal), transform var(--hb-transition-normal);
}

.hb-home-carousel__dot--active {
  background: var(--hb-white);
  transform: scale(1.4);
}

.hb-home-carousel__dot:hover:not(.hb-home-carousel__dot--active) {
  background: var(--hb-text-lighter);
}

/* ── Section 4: CSR Mission ── */
.hb-home-csr {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
}


/* ── Homepage Responsive ── */
@media (max-width: 1024px) {
  .hb-home-slide__bag--20kg {
    width: 160px;
  }

  .hb-home-slide__bag--10kg {
    width: 120px;
  }

  /* Giveaway tablet */
  .hb-home-giveaway__overlay {
    padding: 80px var(--hb-page-padding) 50px;
  }

  .hb-home-giveaway__col-left {
    width: 27%;
  }

  .hb-home-giveaway__col-middle {
    width: 38%;
  }

  .hb-home-giveaway__col-right {
    width: 35%;
  }

  .hb-home-giveaway__bag--20kg {
    width: 160px;
  }

  .hb-home-giveaway__bag--10kg {
    width: 110px;
    margin-left: -28px;
    margin-top: 0;
  }

  .hb-home-giveaway__couple {
    width: 260px;
  }

  .hb-home-giveaway__airline {
    max-width: 180px;
  }

  .hb-home-giveaway__prize-text {
    max-width: 290px;
  }
}

@media (max-width: 768px) {
  .hb-home-giveaway {
    height: auto;
    min-height: 100vh;
  }

  .hb-home-carousel {
    height: auto;
    min-height: 100vh;
    overflow: visible;
  }

  .hb-home-slides {
    height: auto;
  }

  .hb-home-slide {
    position: relative;
    inset: auto;
    display: none;
    min-height: 100vh;
  }

  .hb-home-slide--active {
    display: block;
  }

  .hb-home-hero__content .hb-brand {
    --hb-brand-base: 28px;
  }

  .hb-home-slide__inner {
    flex-direction: column;
    justify-content: flex-end;
    padding: 0 24px 24px;
    gap: 12px;
    height: auto;
    min-height: 100vh;
  }

  .hb-home-slide__images {
    align-items: center;
    gap: 16px;
    flex: 0 0 30%;
    justify-content: center;
  }

  .hb-home-slide__bag--20kg {
    width: 120px;
  }

  .hb-home-slide__bag--10kg {
    width: 90px;
  }

  .hb-home-slide__btn {
    width: 100%;
    text-align: center;
  }

  .hb-home-slide__content {
    padding: 0;
    overflow: visible;
  }

  .hb-home-slide__content .hb-brand {
    --hb-brand-base: 34px;
    --hb-brand-stroke: 0.8px;
  }

  .hb-home-slide__subtitle {
    font-size: var(--hb-font-size-lg);
    line-height: 1.3;
  }

  .hb-home-slide__desc {
    max-height: none;
    overflow: visible;
  }

  .hb-home-carousel__dots {
    position: absolute;
    left: 50%;
    bottom: 16px;
    transform: translateX(-50%);
    justify-content: center;
    margin: 0;
    z-index: 4;
  }

  /* Giveaway mobile - maintain 3-col layout */
  .hb-home-giveaway__video-container {
    height: 400px;
  }

  .hb-home-giveaway__paint {
    top: 380px;
  }

  .hb-home-giveaway__overlay {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 50% 50%;
    align-items: center;
    justify-items: stretch;
    padding: 16px 16px 24px;
    gap: 0 10px;
  }

  .hb-home-giveaway__col-left {
    width: 100%;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    grid-column: 1 / 2;
    grid-row: 2 / 3;
    gap: 8px;
    min-height: 0;
  }

  .hb-home-giveaway__col-middle {
    width: 100%;
    grid-column: 1 / 3;
    grid-row: 1 / 2;
    gap: 8px;
    justify-content: flex-end;
    min-height: 0;
  }

  .hb-home-giveaway__col-right {
    width: 100%;
    justify-content: flex-start;
    align-items: center;
    grid-column: 2 / 3;
    grid-row: 2 / 3;
    min-height: 0;
  }

  .hb-home-giveaway__airline {
    max-width: 220px;
    transform: translateY(0);
  }

  .hb-home-giveaway__prize-text {
    max-width: 360px;
    transform: translateY(0);
  }

  .hb-home-giveaway__bag--20kg {
    width: 110px;
  }

  .hb-home-giveaway__bag--10kg {
    width: 84px;
    margin-top: -20px;
    margin-left: 0;
  }

  .hb-home-giveaway__couple {
    width: 165px;
  }

}

@media (max-height: 860px) {
}

@media (max-height: 860px) {
  .hb-home-promotion-banner__foreground {
    padding-top: min(var(--hb-header-height, 120px), 72px);
    padding-bottom: 24px;
  }
}

@media (max-width: 767px) {
  .hb-home-promotion-banner {
    height: auto;
    min-height: calc(100vh - var(--hb-header-height, 0px));
  }

  .hb-home-promotion-banner__foreground {
    min-height: calc(100vh - var(--hb-header-height, 0px));
    padding: calc(var(--hb-header-height, 0px) + 20px) 16px 24px;
    flex-direction: column;
    justify-content: flex-start;
    gap: 20px;
  }

  .hb-home-promotion-banner__products {
    width: 100%;
    justify-content: center;
  }

  .hb-home-promotion-banner__bag--20kg {
    width: min(53vw, 230px);
  }

  .hb-home-promotion-banner__bag--10kg {
    width: min(37.1vw, 161px);
    margin-left: -24px;
  }

  .hb-home-promotion-banner__offer {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .hb-home-promotion-banner__price-card,
  .hb-home-promotion-banner__shipping-card {
    border-radius: 16px;
    padding: 16px 14px 14px;
  }

  .hb-home-promotion-banner__weight {
    margin-top: -34px;
    margin-bottom: 8px;
    font-size: 20px;
  }

  .hb-home-promotion-banner__price-line {
    font-size: clamp(30px, 10vw, 44px);
  }

  .hb-home-promotion-banner__shipping-title {
    font-size: clamp(22px, 7vw, 32px);
  }

  .hb-home-promotion-banner__shipping-subtitle {
    font-size: clamp(13px, 4.2vw, 17px);
  }

  .hb-home-promotion-banner__cta {
    min-height: 64px;
    font-size: clamp(28px, 8.4vw, 40px);
  }
}

/* ── Customer Care Section ── */
.hb-customer-care-section {
  position: relative;
  isolation: isolate;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #d81f29;
  background-image: var(--hb-gradient-slide-brand);
  /* background:
    linear-gradient(205.63deg, rgba(249, 182, 23, 0.8) 0%, #d82029 76.9%),
    #ffffff; */
}

/* Dedicated customer-care page only: stretch content to viewport height
   without affecting the reusable section on other templates. */
#hb-customer-care-page.hb-customer-care-page {
  min-height: calc(100vh - var(--hb-footer-height, 100px));
  display: flex;
  flex-direction: column;
}

#hb-customer-care-page .hb-customer-care-section {
  flex: 1 1 auto;
  display: flex;
}

.hb-customer-care-section__inner {
  position: relative;
  min-height: 720px;
  overflow: hidden;
  z-index: 0;
}

#hb-customer-care-page .hb-customer-care-section__inner {
  flex: 1 1 auto;
  min-height: calc(
    100vh - var(--hb-header-height, 128px) - var(--hb-footer-height, 100px)
  );
  display: flex;
  align-items: center;
}

.hb-customer-care-section__inner::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: inherit;
}

.hb-customer-care-section__content {
  position: relative;
  z-index: 2;
  width: min(476px, calc(100% - 64px));
  margin-left: clamp(24px, 8vw, 122px);
  padding-top: clamp(56px, 9vw, 133px);
  padding-bottom: clamp(48px, 9vw, 122px);
  color: #fff;
  font-family: "Poppins", "Plus Jakarta Sans", sans-serif;
}

#hb-customer-care-page .hb-customer-care-section__content {
  padding-top: clamp(24px, 4vw, 48px);
  padding-bottom: clamp(24px, 4vw, 48px);
}

#hb-customer-care-page .hb-customer-care-section__media {
  top: 50%;
  transform: translateY(-50%);
}

.hb-customer-care-section__title {
  margin: 0 0 16px;
  font-size: clamp(34px, 3.4vw, 40px);
  line-height: 1.2;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  font-weight: 700;
}

.hb-customer-care-section__desc {
  margin: 0 0 52px;
  font-size: 18px;
  line-height: 1.45;
  font-weight: 400;
}

.hb-customer-care-section__contact-title {
  margin: 0 0 16px;
  font-size: clamp(22px, 2.2vw, 24px);
  line-height: 1.3;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  font-weight: 700;
}

.hb-customer-care-section__contact-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.hb-customer-care-section__contact-item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.hb-customer-care-section__contact-item p {
  margin: 0;
  font-size: 18px;
  line-height: 1.35;
  color: #fff;
}

.hb-customer-care-section__contact-item a {
  color: inherit;
  text-decoration: none;
}

.hb-customer-care-section__contact-item a:hover,
.hb-customer-care-section__contact-item a:focus-visible {
  text-decoration: underline;
}

.hb-customer-care-section__icon {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  color: #fff;
  margin-top: 3px;
  line-height: 1;
}

.hb-customer-care-section__media {
  position: absolute;
  top: -120px;
  right: -340px;
  width: min(1006px, 72vw);
  height: min(1006px, 72vw);
  z-index: 1;
}

.hb-customer-care-section__image-wrap {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  overflow: hidden;
}

.hb-customer-care-section__image {
  width: 100%;
  height: 100% !important;
  display: block;
  object-fit: cover;
  object-position: right center;
}

@media (max-width: 1100px) {
  .hb-customer-care-section__inner {
    min-height: 680px;
  }

  .hb-customer-care-section__media {
    right: -420px;
    width: min(960px, 90vw);
    height: min(960px, 90vw);
  }
}

@media (max-width: 900px) {
  .hb-customer-care-section__inner {
    min-height: 0;
    display: grid;
    grid-template-columns: 1fr;
  }

  #hb-customer-care-page .hb-customer-care-section__inner {
    min-height: 0;
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .hb-customer-care-section__content {
    width: auto;
    margin: 0;
    padding: 48px 24px 36px;
  }

  #hb-customer-care-page .hb-customer-care-section__content {
    padding-top: calc(var(--hb-header-height, 120px) + 20px);
  }

  .hb-customer-care-section__desc {
    margin-bottom: 36px;
    font-size: 16px;
  }

  .hb-customer-care-section__contact-item p {
    font-size: 16px;
  }

  .hb-customer-care-section__media {
    position: relative;
    top: auto;
    right: auto;
    width: 100%;
    height: auto;
    margin-top: 8px;
  }

  .hb-customer-care-section__image-wrap {
    border-radius: 0;
  }

  .hb-customer-care-section__image {
    height: auto;
    object-fit: cover;
    object-position: right center;
  }

  /* Dedicated customer-care page: show the media block as full-width image. */
  #hb-customer-care-page .hb-customer-care-section__media {
    position: relative;
    top: auto;
    right: auto;
    transform: none;
    width: 100%;
    height: auto;
    display: block;
    float: none;
    clear: both;
    margin-top: 0;
  }

  #hb-customer-care-page .hb-customer-care-section__image-wrap {
    width: 100%;
    height: auto;
    border-radius: 0;
  }

  #hb-customer-care-page .hb-customer-care-section__image {
    width: 100%;
    height: auto;
    max-width: 100%;
  }
}

@media (hover: hover) and (pointer: fine) {
  .hb-home-promotion-banner__image {
    transition: transform 220ms ease, filter 220ms ease;
    will-change: transform;
  }

  .hb-home-promotion-banner__link:hover .hb-home-promotion-banner__image,
  .hb-home-promotion-banner__link:focus-visible .hb-home-promotion-banner__image {
    transform: scale(1.015);
    filter: brightness(1.02);
  }
}