/* Honest Junk — Cheese Barks page. Loaded after hj-home.css, which holds the shared tokens, buttons, nav and footer. */
:root {
  --cb-gold:  #F7941D;
  --cb-cream: #FFF4C2;
  --cb-warm:  #FBE0CE;
}
.btn--gold { background:var(--cb-gold); color:var(--paper); border-color:var(--cb-gold); }
.btn--gold:hover { box-shadow:0 4px 14px rgba(247,148,29,0.45); }
.btn--full { width:100%; justify-content:center; }
.chip--gold { color:var(--cb-gold); background:var(--cb-cream); }
.nav__links a.active { background:var(--ink); color:var(--paper); border-radius:var(--r-md); padding:7px 16px; }
.breadcrumb { padding:var(--sp4) 0; border-bottom:1px solid var(--cloud); }
.breadcrumb__inner { display:flex; align-items:center; gap:var(--sp2); font-family:var(--font-mono); font-size:11px; color:var(--ink-muted); letter-spacing:0.06em; }
.breadcrumb__inner a { color:var(--ink-muted); }
.breadcrumb__inner a:hover { color:var(--ink); }
.page-hero { background:var(--cb-cream); overflow:hidden; padding:var(--sp9) 0 0; }
.page-hero__inner { display:grid; grid-template-columns:1fr 1fr; gap:var(--sp8); align-items:center; }
.page-hero__eyebrow { font-family:var(--font-mono); font-size:11px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--cb-gold); display:flex; align-items:center; gap:8px; margin-bottom:var(--sp4); }
.page-hero__eyebrow::before { content:''; width:16px; height:1.5px; background:var(--cb-gold); }
.page-hero__title { font-family:var(--font-display); font-size:clamp(40px,6vw,76px); font-weight:900; text-transform:uppercase; letter-spacing:-0.03em; color:var(--ink); line-height:0.92; margin-bottom:var(--sp5); }
.page-hero__title .accent { color:var(--cb-gold); }
.page-hero__body { font-family:var(--font-body); font-size:17px; color:var(--ink-soft); line-height:1.7; max-width:420px; margin-bottom:var(--sp5); }
.page-hero__chips { display:flex; gap:var(--sp2); flex-wrap:wrap; margin-bottom:var(--sp6); }
.page-hero__btns { display:flex; gap:var(--sp3); flex-wrap:wrap; margin-bottom:var(--sp9); }
.hero-visual { display:flex; align-items:flex-end; justify-content:center; gap:var(--sp3); }
.bark-pack { border-radius:var(--r-lg) var(--r-lg) 0 0; padding:var(--sp5) var(--sp4) 0; text-align:center; position:relative; transition:transform .2s ease; }
.bark-pack:hover { transform:translateY(-8px); }
.bark-pack--tall { transform:scale(1.08); transform-origin:bottom; }
.bark-pack--tall:hover { transform:scale(1.08) translateY(-8px); }
.bark-pack__label { font-family:var(--font-display); font-size:11px; font-weight:800; text-transform:uppercase; color:var(--ink); margin-top:var(--sp3); }
.bark-pack__sub { font-family:var(--font-mono); font-size:10px; color:var(--ink-muted); margin-top:2px; }
.cracker-svg { display:block; margin:0 auto; }
.label-guide { display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp5); margin-top:var(--sp6); }
.label-row { display:grid; grid-template-columns:96px 1fr; gap:var(--sp4); align-items:start; background:var(--paper); border:1.5px solid var(--cloud); border-radius:var(--r-lg); padding:var(--sp5); box-shadow:var(--shadow-sm); }
.label-row__val { font-family:var(--font-display); font-size:19px; font-weight:900; color:var(--ink); line-height:1.05; letter-spacing:-0.01em; }
.label-row__unit { font-family:var(--font-mono); font-size:10px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-muted); margin-top:4px; }
.label-row__what { font-family:var(--font-display); font-size:14px; font-weight:800; text-transform:uppercase; color:var(--ink); margin-bottom:6px; letter-spacing:0.01em; }
.label-row__means { font-family:var(--font-body); font-size:13.5px; color:var(--ink-soft); line-height:1.65; }
.label-note { margin-top:var(--sp5); padding:var(--sp4) var(--sp5); background:var(--cloud); border-radius:var(--r-md); font-family:var(--font-mono); font-size:11px; color:var(--ink-soft); line-height:1.7; }
.label-note strong { color:var(--ink); }
@media (max-width:760px) {
  .label-guide { grid-template-columns:1fr; }
}
.malagos-visual--photo { padding:0; overflow:hidden; background:var(--ink); }
.malagos-visual--photo img { width:100%; aspect-ratio:1/1; object-fit:cover; display:block; }
.eat-card__photo { aspect-ratio:1/1; border-radius:var(--r-md); overflow:hidden; margin-bottom:var(--sp4); background:var(--cloud); }
.eat-card__photo img { width:100%; height:100%; object-fit:cover; display:block; }
.section--gold { background:var(--cb-gold); }
.section--cream { background:var(--cb-cream); }
.eyebrow-label--gold { color:var(--cb-gold); }
.eyebrow-label--gold::before { background:var(--cb-gold); }
.section__header-left .section__sub { margin-bottom:0; }
.flavour-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp5); }
.flavour-card { background:var(--paper); border-radius:var(--r-xl); border:1.5px solid var(--cloud); overflow:hidden; box-shadow:var(--shadow-sm); transition:box-shadow .15s, transform .15s; display:flex; flex-direction:column; }
.flavour-card:hover { box-shadow:var(--shadow-sticker-lg); transform:translateY(-4px); }
.flavour-card--feat { border-color:var(--cb-gold); border-width:2px; box-shadow:var(--shadow-sticker); }
.flavour-card--feat:hover { box-shadow:var(--shadow-sticker-lg); }
.flavour-card__top-tag { font-family:var(--font-mono); font-size:10px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; padding:6px 16px; text-align:center; }
.flavour-card__top-tag--gold { background:var(--cb-gold); color:var(--paper); }
.flavour-card__top-tag--green { background:var(--green); color:var(--paper); }
.flavour-card__top-tag--teal { background:var(--teal); color:var(--paper); }
.flavour-card__img { aspect-ratio:1/1; position:relative; overflow:hidden; background:var(--cloud); }
.flavour-card__img img { width:100%; height:100%; object-fit:cover; display:block; }
.flavour-card__img-main { font-size:56px; }
.flavour-card__superfood-badge { position:absolute; bottom:var(--sp3); right:var(--sp3); background:var(--ink); color:var(--paper); font-family:var(--font-mono); font-size:10px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; padding:4px 12px; border-radius:var(--r-pill); box-shadow: 1px 1px 0 rgba(0,0,0,0.2); }
.flavour-card__body { padding:var(--sp5); flex:1; display:flex; flex-direction:column; }
.flavour-card__name { font-family:var(--font-display); font-size:19px; font-weight:900; text-transform:uppercase; letter-spacing:-0.01em; color:var(--ink); margin-bottom:var(--sp2); line-height:1.0; }
.flavour-card__desc { font-family:var(--font-body); font-size:14px; color:var(--ink-soft); line-height:1.6; margin-bottom:var(--sp4); flex:1; }
.flavour-card__chips { display:flex; gap:var(--sp2); flex-wrap:wrap; margin-bottom:var(--sp5); }
.flavour-card__footer { border-top:1px solid var(--cloud); padding:var(--sp4) var(--sp5); display:flex; justify-content:space-between; align-items:center; }
.flavour-card__price { font-family:var(--font-display); font-size:22px; font-weight:900; color:var(--ink); }
.flavour-card__stock { font-family:var(--font-mono); font-size:10px; color:var(--green); text-transform:uppercase; letter-spacing:0.06em; }
.malagos-grid { display:grid; grid-template-columns:1fr 1fr; gap:var(--sp8); align-items:center; }
.malagos-visual { background:var(--ink); border-radius:var(--r-xl); padding:var(--sp8) var(--sp7); box-shadow:var(--shadow-sticker-lg); text-align:center; }
.malagos-visual__icon { font-size:72px; margin-bottom:var(--sp5); }
.malagos-visual__name { font-family:var(--font-display); font-size:32px; font-weight:900; text-transform:uppercase; color:var(--yellow); letter-spacing:-0.02em; margin-bottom:var(--sp3); }
.malagos-visual__desc { font-family:var(--font-mono); font-size:13px; color:rgba(255,255,255,0.55); line-height:1.7; letter-spacing:0.02em; }
.malagos-text {  }
.malagos-text__quote { font-family:var(--font-display); font-size:clamp(20px,3vw,30px); font-weight:800; text-transform:uppercase; letter-spacing:-0.02em; color:var(--ink); line-height:1.1; margin-bottom:var(--sp5); border-left:4px solid var(--cb-gold); padding-left:var(--sp5); }
.malagos-text__body { font-family:var(--font-body); font-size:16px; color:var(--ink-soft); line-height:1.75; margin-bottom:var(--sp5); }
.claims-strip { background:var(--ink); padding:0 var(--pad-x); }
.claims-strip__inner { display:flex; align-items:center; height:52px; max-width:var(--container); margin:0 auto; flex-wrap:nowrap; overflow-x:auto; }
.claims-strip__item { display:flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:11px; font-weight:700; letter-spacing:0.1em; text-transform:lowercase; color:rgba(255,255,255,0.7); white-space:nowrap; padding:0 20px; flex-shrink:0; }
.claims-strip__item + .claims-strip__item { border-left:1px solid rgba(255,255,255,0.12); }
.claims-strip__item .dot { width:5px; height:5px; background:var(--cb-gold); border-radius:50%; flex-shrink:0; }
.founder-note { background: var(--paper); border-radius: var(--r-xl); border: 1.5px solid var(--cloud); overflow: hidden; box-shadow: var(--shadow-md); }
.founder-note__stripe { height: 4px; background: linear-gradient(90deg, var(--rose) 0%, var(--cb-gold) 100%); }
.founder-note__inner { padding: var(--sp6); }
.founder-note__header { display: flex; align-items: center; gap: var(--sp4); margin-bottom: var(--sp5); }
.founder-note__av { width: 44px; height: 44px; border-radius: 50%; background: var(--blush); display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-size: 14px; font-weight: 900; color: var(--rose); flex-shrink: 0; }
.founder-note__meta { flex: 1; }
.founder-note__name { font-family: var(--font-display); font-size: 14px; font-weight: 800; text-transform: uppercase; color: var(--ink); margin-bottom: 2px; }
.founder-note__role { font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted); letter-spacing: 0.04em; }
.founder-note__pill { background: var(--blush); color: var(--rose); font-family: var(--font-mono); font-size: 10px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; padding: 4px 12px; border-radius: var(--r-pill); flex-shrink: 0; }
.founder-note__quote { font-family: var(--font-mono); font-size: 16px; font-weight: 400; font-style: italic; color: var(--ink); line-height: 1.75; margin: 0 0 var(--sp4); padding: var(--sp4) var(--sp5); background: var(--paper-warm); border-radius: var(--r-md); border-left: 3px solid var(--rose); }
.founder-note__body { font-family: var(--font-body); font-size: 15px; color: var(--ink-soft); line-height: 1.7; margin-bottom: var(--sp5); }
.founder-note__foot { border-top: 1px solid var(--cloud); padding-top: var(--sp4); display: flex; align-items: center; justify-content: space-between; gap: var(--sp4); flex-wrap: wrap; }
.founder-note__baon { display: flex; align-items: center; gap: var(--sp3); font-family: var(--font-mono); font-size: 12px; color: var(--ink-muted); letter-spacing: 0.03em; }
.founder-note__baon strong { color: var(--ink); font-weight: 700; }
.founder-note__link { font-family: var(--font-display); font-size: 12px; font-weight: 800; text-transform: uppercase; color: var(--rose); letter-spacing: 0.04em; display: inline-flex; align-items: center; gap: 4px; border-bottom: 1.5px solid var(--rose); padding-bottom: 1px; transition: gap .15s; white-space: nowrap; }
.founder-note__link::after { content: '→'; }
.founder-note__link:hover { gap: 8px; }
.ingredients-grid { display:grid; grid-template-columns:1fr 1fr; gap:var(--sp5); }
.ingredients-panel { background:var(--paper); border-radius:var(--r-lg); border:1.5px solid var(--cloud); padding:var(--sp6); box-shadow:var(--shadow-sm); }
.ingredients-panel__title { font-family:var(--font-display); font-size:16px; font-weight:900; text-transform:uppercase; color:var(--ink); margin-bottom:var(--sp5); letter-spacing:0.01em; display:flex; align-items:center; gap:var(--sp3); }
.ingredient-list { display:flex; flex-direction:column; gap:var(--sp2); }
.ingredient-item { display:flex; align-items:center; gap:var(--sp3); font-family:var(--font-mono); font-size:13px; color:var(--ink-soft); padding:var(--sp3) 0; border-bottom:1px solid var(--cloud); }
.ingredient-item:last-child { border-bottom:none; }
.ingredient-item__dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.ingredient-item strong { color:var(--ink); font-weight:700; }
.nf-panel { background:var(--paper); border:2px solid var(--ink); border-radius:var(--r-lg); padding:var(--sp5); box-shadow:var(--shadow-sticker); }
.nf-title { font-family:var(--font-display); font-size:22px; font-weight:900; color:var(--ink); border-bottom:8px solid var(--ink); padding-bottom:var(--sp2); margin-bottom:var(--sp3); }
.nf-serving { font-family:var(--font-mono); font-size:12px; color:var(--ink); margin-bottom:var(--sp3); border-bottom:4px solid var(--ink); padding-bottom:var(--sp3); }
.nf-row { display:flex; justify-content:space-between; align-items:center; font-family:var(--font-mono); font-size:13px; color:var(--ink); padding:5px 0; border-bottom:1px solid var(--cloud); }
.nf-row:last-child { border-bottom:none; }
.nf-row--main { font-weight:700; font-size:15px; }
.nf-row--indent { padding-left:var(--sp5); font-size:12px; color:var(--ink-soft); }
.nf-footer { font-family:var(--font-mono); font-size:10px; color:var(--ink-muted); margin-top:var(--sp4); line-height:1.6; border-top:4px solid var(--ink); padding-top:var(--sp3); }
.eat-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--sp4); }
.eat-card { background:var(--paper); border-radius:var(--r-lg); border:1.5px solid var(--cloud); padding:var(--sp5) var(--sp4); text-align:center; box-shadow:var(--shadow-sm); transition:box-shadow .15s, transform .15s; }
.eat-card:hover { box-shadow:var(--shadow-sticker); transform:translateY(-3px); }
.eat-card__icon { font-size:36px; margin-bottom:var(--sp3); }
.eat-card__title { font-family:var(--font-display); font-size:14px; font-weight:800; text-transform:uppercase; color:var(--ink); margin-bottom:var(--sp2); }
.eat-card__desc { font-family:var(--font-mono); font-size:12px; color:var(--ink-soft); line-height:1.55; }
.bundle-band { background:var(--cb-gold); padding:var(--sp8) 0; }
.bundle-band__inner { display:flex; justify-content:space-between; align-items:center; gap:var(--sp6); flex-wrap:wrap; }
.bundle-band__title { font-family:var(--font-display); font-size:clamp(24px,3.5vw,40px); font-weight:900; text-transform:uppercase; color:var(--paper); letter-spacing:-0.02em; line-height:1.0; margin-bottom:var(--sp3); }
.bundle-band__sub { font-family:var(--font-body); font-size:16px; color:rgba(255,255,255,0.85); max-width:400px; line-height:1.65; }
.nstrip { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp2); margin-bottom: var(--sp4); padding: var(--sp3) var(--sp4); background: var(--paper-warm); border-radius: var(--r-md); border: 1px solid var(--cloud); }
.nstrip__item { text-align: center; }
.nstrip__num { font-family: var(--font-display); font-size: 20px; font-weight: 900; color: var(--ink); line-height: 1; letter-spacing: -0.01em; }
.nstrip__num--small { font-size: 14px; }
.nstrip__label { font-family: var(--font-mono); font-size: 9px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-muted); margin-top: 3px; }
.nstrip__divider { width: 1px; background: var(--cloud); align-self: stretch; margin: 4px 0; }
.nf-expand { display: none; border-top: 1px solid var(--cloud); padding: var(--sp4) var(--sp5); background: var(--paper-warm); }
.nf-expand.open { display: block; }
.nf-expand__title { font-family: var(--font-display); font-size: 16px; font-weight: 900; color: var(--ink); border-bottom: 4px solid var(--ink); padding-bottom: var(--sp2); margin-bottom: var(--sp3); }
.nf-expand__serving { font-family: var(--font-mono); font-size: 11px; color: var(--ink-soft); margin-bottom: var(--sp3); border-bottom: 3px solid var(--ink); padding-bottom: var(--sp3); line-height: 1.6; }
.nf-expand__row { display: flex; justify-content: space-between; font-family: var(--font-mono); font-size: 12px; color: var(--ink); padding: 4px 0; border-bottom: 1px solid var(--cloud); }
.nf-expand__row:last-child { border-bottom: none; }
.nf-expand__row--b { font-weight: 700; font-size: 13px; }
.nf-expand__row--i { padding-left: var(--sp4); color: var(--ink-soft); font-size: 11px; }
.nf-expand__ing { font-family: var(--font-mono); font-size: 11px; color: var(--ink-soft); margin-top: var(--sp4); border-top: 3px solid var(--ink); padding-top: var(--sp3); line-height: 1.7; }
.nf-expand__ing strong { color: var(--ink); }
.nf-toggle { font-family: var(--font-mono); font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--cb-gold); background: none; border: none; cursor: pointer; display: flex; align-items: center; gap: 4px; padding: 0; transition: color .12s; }
.nf-toggle:hover { color: var(--rose-hv); }
.nf-toggle__icon { font-style: normal; transition: transform .2s; }
.nf-toggle.open .nf-toggle__icon { transform: rotate(180deg); }
.also-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp5); }
.also-card { background:var(--paper); border-radius:var(--r-lg); border:1.5px solid var(--cloud); overflow:hidden; box-shadow:var(--shadow-sm); transition:box-shadow .15s, transform .15s; display:flex; flex-direction:column; }
.also-card:hover { box-shadow:var(--shadow-sticker); transform:translateY(-3px); }
.also-card__img { aspect-ratio:1/1; margin:var(--sp5) var(--sp5) 0; border-radius:var(--r-md); overflow:hidden; background:var(--cloud); }
.also-card__img img { width:100%; height:100%; object-fit:cover; display:block; }
.also-card__body { padding:var(--sp4) var(--sp5) var(--sp5); text-align:center; flex:1; display:flex; flex-direction:column; }
.also-card__name { font-family:var(--font-display); font-size:15px; font-weight:900; text-transform:uppercase; color:var(--ink); margin-bottom:var(--sp2); }
.also-card__desc { font-family:var(--font-mono); font-size:12px; color:var(--ink-soft); line-height:1.55; margin-bottom:var(--sp4); }
.also-card__row { display:flex; justify-content:center; align-items:center; gap:var(--sp4); margin-top:auto; padding-top:var(--sp2); }
.also-card__price { font-family:var(--font-display); font-size:18px; font-weight:900; color:var(--ink); }
.founder-note__grid { display: grid; grid-template-columns: 300px 1fr; gap: 0; }
.founder-note__photo { position: relative; background: var(--cloud); min-height: 100%; }
.founder-note__photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 22%; display: block; }
.founder-note__col { padding: var(--sp6); display: flex; flex-direction: column; }
.founder-note__col .founder-note__body:last-of-type { margin-bottom: var(--sp5); }
.founder-note__col .founder-note__foot { margin-top: auto; }
@media (max-width: 860px) {
  .founder-note__grid { grid-template-columns: 1fr; }
  .founder-note__photo { min-height: 0; aspect-ratio: 3/2; }
  .founder-note__photo img { object-position: center 20%; }
}
@media (max-width:1000px) {
  .flavour-grid { grid-template-columns:repeat(2,1fr); }
  .page-hero__inner { grid-template-columns:1fr; }
  .hero-visual { display:none; }
  .malagos-grid { grid-template-columns:1fr; }
  .ingredients-grid { grid-template-columns:1fr; }
  .eat-grid { grid-template-columns:repeat(2,1fr); }
  .also-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:640px) {
  .flavour-grid { grid-template-columns:1fr; }
  .eat-grid { grid-template-columns:1fr 1fr; }
  .also-grid { grid-template-columns:1fr; }
  .bundle-band__inner { flex-direction:column; }
}

/* ── WordPress additions ─────────────────────────────────── */
.hero-visual__photo { border-radius: var(--r-xl); overflow: hidden; box-shadow: var(--shadow-sticker-lg); width: 100%; max-width: 480px; }
.hero-visual__photo img { width: 100%; height: auto; display: block; object-fit: cover; }
.flavour-card__img { display: block; }
.flavour-card__name a { color: inherit; }
.flavour-card__name a:hover { text-decoration: underline; text-underline-offset: 3px; }
.nstrip__note { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-muted); text-align: center; margin: -4px 0 var(--sp4); }
.flavour-card--soldout .flavour-card__img img { filter: grayscale(0.35); opacity: 0.85; }
.flavour-card--soldout .flavour-card__stock { color: var(--ink-muted); }
/* Footer: price + button on one row, nutrition toggle underneath */
.flavour-card__footer { flex-wrap: wrap; row-gap: var(--sp3); margin-top: auto; }
.flavour-card__footer > div:first-child { order: 1; }
.flavour-card__footer > .btn { order: 2; }
.flavour-card__footer > .nf-toggle { order: 3; flex-basis: 100%; justify-content: flex-start; }
.flavour-card__footer a.added_to_cart { order: 4; flex-basis: 100%; text-align: right; font: 700 11px var(--font-mono); text-transform: uppercase; letter-spacing: 0.06em; text-decoration: underline; text-underline-offset: 3px; color: var(--ink); }
.flavour-card__body { flex: 1 0 auto; }
.label-row__mg { font-size: 13px; }
.cb-chiprow, .cb-btnrow { display: flex; gap: var(--sp3); flex-wrap: wrap; }
.cb-ingredients { max-width: 620px; }
.cb-ingredients__note { font-family: var(--font-mono); font-size: 12px; color: var(--ink-muted); margin-bottom: var(--sp5); letter-spacing: 0.02em; }
.cb-ingredients__box { margin-top: var(--sp5); padding: var(--sp4); background: var(--cloud); border-radius: var(--r-md); }
.cb-ingredients__box p { font-family: var(--font-mono); font-size: 11px; color: var(--ink-soft); line-height: 1.6; }
.cb-ingredients__box strong { color: var(--ink); }
.cb-ingredients__shelf { margin-top: var(--sp4); font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted); line-height: 1.6; }

/* Full-width "Real cheese" banner */
.cb-banner { position: relative; overflow: hidden; height: 420px; background: var(--cloud); border-bottom: 1.5px solid var(--cloud); }
.cb-banner img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; display: block; opacity: 0.92; }
.cb-banner__fade { position: absolute; inset: 0; background: linear-gradient(to right, rgba(242,240,234,0.85) 0%, rgba(242,240,234,0.3) 60%, rgba(242,240,234,0) 100%); pointer-events: none; }
.cb-banner__text { position: absolute; bottom: var(--sp6); left: var(--pad-x); max-width: 520px; font-family: var(--font-display); font-size: clamp(28px, 4vw, 44px); font-weight: 900; text-transform: uppercase; letter-spacing: -0.02em; color: var(--ink); line-height: 1.0; }
.cb-banner__text span { color: var(--cb-gold); }

@media (max-width: 1000px) {
  .hero-visual { display: block; }
  .hero-visual__photo { max-width: 420px; margin: 0 auto; }
  .page-hero__inner { gap: var(--sp6); }
  .hero-visual__photo img { aspect-ratio: 4 / 5; }
}
@media (max-width: 640px) {
  .cb-banner { height: 300px; }
  .cb-banner__fade { background: linear-gradient(to top, rgba(242,240,234,0.92) 0%, rgba(242,240,234,0.4) 55%, rgba(242,240,234,0) 100%); }
}

/* Nutrition panel opens over its own card on multi-column layouts, so the
   neighbouring cards in the row don't stretch. On phones it opens inline. */
@media (min-width: 641px) {
  .flavour-card { position: relative; }
  .flavour-card__footer { position: relative; z-index: 3; background: var(--paper); }
  .nf-expand.open { position: absolute; inset: 0; z-index: 2; overflow-y: auto; border-top: 0; padding-bottom: 150px; }
}

/* ==========================================================================
   Honest Junk — cart, checkout, order received and My Account (1.18.0)
   Pages drawn by hj_render_woo_page() in functions.php. Added at the end of hj-cheese-barks.css
   (which these pages already load) because no new file could be uploaded without cPanel on
   4 Nov 2026; every rule here applies only on those pages (.hj-woo, .wc-hero, .wc-body,
   body.hj-woo-page). It can move to its own file, hj-woo.css, later.

   The content inside .hj-woo is WooCommerce's own (with Avada's WooCommerce markup:
   woocommerce-content-box, avada-cart-actions, the three checkout steps, the
   avada-myaccount-user box), so these styles restyle that markup rather than
   replace it. Nothing here changes what the forms do.
   ========================================================================== */

/* ---- Page title -------------------------------------------------------- */
.wc-hero { padding: clamp(28px, 5vw, 52px) 0 clamp(20px, 3vw, 32px); }
.wc-hero__title {
  font-family: var(--font-display);
  font-size: clamp(34px, 6vw, 60px);
  font-weight: 900;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  line-height: 0.95;
  color: var(--ink);
}
.wc-hero__title .accent { color: var(--rose); }
.wc-hero__sub { margin-top: var(--sp3); font-size: 15px; color: var(--ink-soft); max-width: 560px; }
.wc-body { padding: 0 0 var(--section-y); }

/* ---- Base -------------------------------------------------------------- */
.hj-woo { font-family: var(--font-body); font-size: 15px; line-height: 1.6; color: var(--ink); }

/* The page's Avada builder wrappers around the WooCommerce shortcode: make them plain boxes. */
.hj-woo > .fusion-fullwidth,
.hj-woo > .fusion-fullwidth > .fusion-builder-row,
.hj-woo > .fusion-fullwidth > .fusion-builder-row > .fusion-layout-column,
.hj-woo > .fusion-fullwidth > .fusion-builder-row > .fusion-layout-column > .fusion-column-wrapper,
.hj-woo > .fusion-fullwidth > .fusion-builder-row > .fusion-layout-column > .fusion-column-wrapper > .fusion-text {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  transform: none !important;
}

.hj-woo h2,
.hj-woo h3,
.hj-woo h4 {
  font-family: var(--font-display);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: -0.01em;
  line-height: 1.1;
  color: var(--ink);
}
.hj-woo h2 { font-size: 20px; margin: 0 0 var(--sp4); }
.hj-woo h3 { font-size: 17px; margin: 0 0 var(--sp4); }
.hj-woo h4 { font-size: 14px; margin: 0 0 var(--sp2); }
.hj-woo p { margin: 0 0 var(--sp3); }
.hj-woo ul,
.hj-woo ol { list-style: none; margin: 0; padding: 0; }
.hj-woo strong,
.hj-woo b { font-weight: 700; }
.hj-woo a {
  color: var(--ink);
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-decoration-color: rgba(237, 20, 91, 0.45);
  text-underline-offset: 3px;
}
.hj-woo a:hover { color: var(--rose); }
.hj-woo img { display: inline-block; max-width: 100%; height: auto; }
.hj-woo address { font-style: normal; line-height: 1.7; }
.hj-woo .screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.hj-woo .clear,
.hj-woo .clearboth { clear: both; }
.hj-woo abbr.required,
.hj-woo .required { color: var(--rose); text-decoration: none; border: 0; }
.hj-woo .optional { color: var(--ink-muted); font-size: 12px; font-weight: 400; text-transform: none; letter-spacing: 0; }

/* Cards */
.hj-woo .woocommerce-content-box,
.hj-woo .shipping-coupon > form,
.hj-woo .shipping-coupon > .coupon,
.hj-woo .cart_totals,
.hj-woo .woocommerce-MyAccount-content,
.hj-woo #customer_login > .u-column1,
.hj-woo #customer_login > .u-column2,
.hj-woo form.woocommerce-ResetPassword,
.hj-woo form.lost_reset_password,
.hj-woo .woocommerce-order-details,
.hj-woo .woocommerce-customer-details {
  background: var(--paper);
  border: 2px solid var(--ink);
  border-radius: var(--r-xl);
  padding: var(--sp6);
  box-shadow: var(--shadow-sticker);
}
.hj-woo .woocommerce-content-box .woocommerce-content-box,
.hj-woo .woocommerce-content-box .woocommerce-order-details,
.hj-woo .woocommerce-content-box .woocommerce-customer-details,
.hj-woo .woocommerce-MyAccount-content .woocommerce-order-details,
.hj-woo .woocommerce-MyAccount-content .woocommerce-customer-details {
  border: 0;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
  background: none;
}

/* ---- Buttons ----------------------------------------------------------- */
.hj-woo .button,
.hj-woo .fusion-button,
.hj-woo button[type="submit"],
.hj-woo input[type="submit"],
.hj-woo #place_order,
.hj-woo #wc_gc_cart_redeem_send {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp2);
  width: auto;
  min-height: 46px;
  padding: 12px 22px;
  border-radius: var(--r-md);
  border: 2px solid var(--ink);
  background: var(--ink);
  color: var(--paper);
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1.1;
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  box-shadow: none;
  -webkit-appearance: none;
  appearance: none;
  transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
}
.hj-woo .button:hover,
.hj-woo .fusion-button:hover,
.hj-woo button[type="submit"]:hover,
.hj-woo input[type="submit"]:hover,
.hj-woo #wc_gc_cart_redeem_send:hover {
  background: #000;
  border-color: #000;
  color: var(--paper);
  box-shadow: var(--shadow-md);
  transform: translateY(-1px);
}
/* The main next step: Proceed to checkout, Continue, Place order, Return to shop. */
.hj-woo .checkout-button,
.hj-woo .continue-checkout,
.hj-woo #place_order,
.hj-woo .return-to-shop .button,
.hj-woo .wc-backward {
  background: var(--rose);
  border-color: var(--rose);
}
.hj-woo .checkout-button:hover,
.hj-woo .continue-checkout:hover,
.hj-woo #place_order:hover,
.hj-woo .return-to-shop .button:hover,
.hj-woo .wc-backward:hover {
  background: var(--rose-hv);
  border-color: var(--rose-hv);
  box-shadow: 0 4px 14px rgba(237, 20, 91, 0.35);
}
/* Update cart is secondary. */
.hj-woo .fusion-update-cart,
.hj-woo button[name="update_cart"] {
  background: transparent;
  color: var(--ink);
}
.hj-woo .fusion-update-cart:hover,
.hj-woo button[name="update_cart"]:hover { background: var(--ink); color: var(--paper); }
.hj-woo .button:disabled,
.hj-woo .button.disabled,
.hj-woo button:disabled,
.hj-woo .button[disabled] {
  opacity: 0.4;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

/* ---- Form fields ------------------------------------------------------- */
.hj-woo label {
  display: block;
  margin-bottom: 6px;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ink);
}
.hj-woo input[type="text"],
.hj-woo input[type="email"],
.hj-woo input[type="tel"],
.hj-woo input[type="password"],
.hj-woo input[type="number"],
.hj-woo input[type="url"],
.hj-woo input[type="search"],
.hj-woo input[type="date"],
.hj-woo select,
.hj-woo textarea {
  width: 100%;
  min-height: 46px;
  padding: 11px 14px;
  font: 15px/1.4 var(--font-body);
  color: var(--ink);
  background: var(--paper-warm);
  border: 1.5px solid #E2DED3;
  border-radius: var(--r-md);
  box-shadow: none;
  text-transform: none;
  letter-spacing: 0;
  -webkit-appearance: none;
  appearance: none;
}
.hj-woo textarea { min-height: 110px; resize: vertical; }
.hj-woo select {
  padding-right: 40px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%231A1A1A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
}
.hj-woo input:focus,
.hj-woo select:focus,
.hj-woo textarea:focus {
  outline: none;
  border-color: var(--ink);
  background-color: var(--paper);
}
.hj-woo input::placeholder,
.hj-woo textarea::placeholder { color: var(--ink-muted); }
.hj-woo input[type="checkbox"],
.hj-woo input[type="radio"] {
  width: 18px;
  height: 18px;
  margin: 0;
  flex: none;
  accent-color: var(--rose);
  vertical-align: middle;
}
.hj-woo label.checkbox,
.hj-woo .woocommerce-form__label-for-checkbox {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  cursor: pointer;
}
.hj-woo .form-row { margin: 0 0 var(--sp4); }
.hj-woo .woocommerce-input-wrapper { display: block; }
.hj-woo .form-row.woocommerce-invalid input,
.hj-woo .form-row.woocommerce-invalid select,
.hj-woo .form-row.woocommerce-invalid .select2-selection { border-color: var(--rose); }
.hj-woo .woocommerce-password-strength { margin-top: 6px; font-size: 12px; }
.hj-woo .woocommerce-password-hint { display: block; margin-top: 4px; font-size: 12px; color: var(--ink-soft); }
.hj-woo .password-input { display: block; position: relative; }
.hj-woo .show-password-input {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 26px;
  height: 26px;
  border: 0;
  background: none;
  cursor: pointer;
  opacity: 0.5;
}
.hj-woo .show-password-input::after { content: '👁'; font-size: 15px; }

/* Field rows that sit side by side (first name / last name). */
.hj-woo .woocommerce-billing-fields__field-wrapper,
.hj-woo .woocommerce-shipping-fields__field-wrapper,
.hj-woo .woocommerce-address-fields__field-wrapper,
.hj-woo form.woocommerce-EditAccountForm,
.hj-woo form.register {
  display: flex;
  flex-wrap: wrap;
  gap: 0 16px;
}
.hj-woo .woocommerce-billing-fields__field-wrapper > *,
.hj-woo .woocommerce-shipping-fields__field-wrapper > *,
.hj-woo .woocommerce-address-fields__field-wrapper > *,
.hj-woo form.woocommerce-EditAccountForm > *,
.hj-woo form.register > * { flex: 1 1 100%; min-width: 0; }
.hj-woo .woocommerce-billing-fields__field-wrapper > .form-row-first,
.hj-woo .woocommerce-billing-fields__field-wrapper > .form-row-last,
.hj-woo .woocommerce-shipping-fields__field-wrapper > .form-row-first,
.hj-woo .woocommerce-shipping-fields__field-wrapper > .form-row-last,
.hj-woo .woocommerce-address-fields__field-wrapper > .form-row-first,
.hj-woo .woocommerce-address-fields__field-wrapper > .form-row-last,
.hj-woo form.woocommerce-EditAccountForm > .form-row-first,
.hj-woo form.woocommerce-EditAccountForm > .form-row-last { flex: 1 1 calc(50% - 8px); }
.hj-woo form.woocommerce-EditAccountForm > .clear,
.hj-woo form.register > .clear { display: none; }

/* Avada adds its own arrow box under each dropdown; the new design draws the arrow itself. */
.hj-woo .select-arrow { display: none !important; }

/* Country / state pickers (selectWoo). */
.hj-woo .select2-container { width: 100% !important; }
.hj-woo .select2-container--default .select2-selection--single {
  display: flex;
  align-items: center;
  height: 46px;
  padding: 0 40px 0 14px;
  background: var(--paper-warm);
  border: 1.5px solid #E2DED3;
  border-radius: var(--r-md);
}
.hj-woo .select2-container--default.select2-container--open .select2-selection--single,
.hj-woo .select2-container--default.select2-container--focus .select2-selection--single { border-color: var(--ink); background: var(--paper); }
.hj-woo .select2-container--default .select2-selection--single .select2-selection__rendered {
  padding: 0;
  line-height: 1.4;
  font: 15px var(--font-body);
  color: var(--ink);
}
.hj-woo .select2-container--default .select2-selection--single .select2-selection__arrow { height: 44px; right: 10px; }
body.hj-woo-page .select2-dropdown {
  border: 1.5px solid var(--ink);
  border-radius: var(--r-md);
  overflow: hidden;
  font: 14px var(--font-body);
}
body.hj-woo-page .select2-search--dropdown .select2-search__field {
  padding: 8px 10px;
  border: 1.5px solid #E2DED3;
  border-radius: var(--r-sm);
  font: 14px var(--font-body);
}
body.hj-woo-page .select2-results__option { padding: 8px 12px; }
body.hj-woo-page .select2-container--default .select2-results__option--highlighted[aria-selected],
body.hj-woo-page .select2-container--default .select2-results__option--highlighted[data-selected] { background: var(--ink); color: var(--paper); }

/* ---- Notices ----------------------------------------------------------- */
.hj-woo .woocommerce-error,
.hj-woo .woocommerce-message,
.hj-woo .woocommerce-info,
.hj-woo .woocommerce-notice,
.hj-woo .cart-empty {
  display: block;
  margin: 0 0 var(--sp5);
  padding: var(--sp4) var(--sp5);
  border: 2px solid var(--ink);
  border-radius: var(--r-lg);
  background: var(--butter);
  font-size: 14px;
  line-height: 1.55;
  color: var(--ink);
}
.hj-woo .woocommerce-error { background: var(--blush); border-color: var(--rose); }
.hj-woo .woocommerce-message { background: var(--mint); }
.hj-woo .woocommerce-error li + li { margin-top: 6px; }
.hj-woo .woocommerce-message .button,
.hj-woo .woocommerce-info .button,
.hj-woo .woocommerce-error .button {
  float: right;
  min-height: 0;
  margin: -4px 0 0 var(--sp4);
  padding: 8px 14px;
  font-size: 12px;
}
.hj-woo .return-to-shop { margin-top: var(--sp4); }

/* ---- Tables (shared) --------------------------------------------------- */
.hj-woo table.shop_table { width: 100%; border-collapse: collapse; font-size: 14px; }
.hj-woo table.shop_table thead th {
  padding: 0 var(--sp3) var(--sp3);
  border-bottom: 2px solid var(--ink);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-align: left;
  color: var(--ink-muted);
}
.hj-woo table.shop_table td {
  padding: var(--sp4) var(--sp3);
  border-bottom: 1px solid var(--cloud);
  vertical-align: middle;
}
.hj-woo table.shop_table tbody th,
.hj-woo table.shop_table tfoot th {
  padding: var(--sp3) var(--sp3) var(--sp3) 0;
  border-bottom: 1px solid var(--cloud);
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  text-align: left;
  vertical-align: top;
}
.hj-woo table.shop_table tfoot td { padding: var(--sp3) 0 var(--sp3) var(--sp3); text-align: right; }
.hj-woo table.shop_table .order-total th,
.hj-woo table.shop_table .order-total td {
  padding-top: var(--sp4);
  border-bottom: 0;
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 900;
}
.hj-woo table.shop_table .order-total .amount { color: var(--rose); }
.hj-woo table.shop_table .woocommerce-Price-amount { white-space: nowrap; }
.hj-woo table.shop_table small,
.hj-woo table.shop_table .includes_tax { display: block; font-size: 12px; font-weight: 400; color: var(--ink-soft); }

/* Shipping options inside totals. */
.hj-woo ul#shipping_method,
.hj-woo ul.woocommerce-shipping-methods { display: grid; gap: 6px; }
.hj-woo ul#shipping_method li {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 8px;
  text-align: right;
}
.hj-woo ul#shipping_method li input { margin-top: 2px; }
.hj-woo ul#shipping_method li label {
  display: inline;
  margin: 0;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
}
.hj-woo .woocommerce-shipping-destination,
.hj-woo .woocommerce-shipping-contents { margin: var(--sp2) 0 0; font-size: 12px; color: var(--ink-soft); }
.hj-woo .woocommerce-shipping-calculator .shipping-calculator-button { font-family: var(--font-display); }

/* ---- Cart -------------------------------------------------------------- */
.hj-woo--cart form.woocommerce-cart-form { margin-bottom: var(--sp5); }
.hj-woo--cart .woocommerce-content-box h2 { margin-bottom: var(--sp5); }
.hj-woo .fusion-product-name-wrapper { display: flex; align-items: center; gap: var(--sp4); }
.hj-woo .product-thumbnail a { display: block; text-decoration: none; }
.hj-woo .product-thumbnail img {
  display: block;
  width: 76px;
  height: 76px;
  object-fit: cover;
  border: 1.5px solid var(--cloud);
  border-radius: var(--r-md);
  background: var(--paper-warm);
}
.hj-woo .product-info .product-title,
.hj-woo td.product-name > a {
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  text-decoration: none;
}
.hj-woo .product-info dl.variation,
.hj-woo td.product-name dl.variation { margin-top: 4px; font-size: 12px; color: var(--ink-soft); }
.hj-woo dl.variation dt,
.hj-woo dl.variation dd { display: inline; margin: 0; }
.hj-woo dl.variation dd p { display: inline; margin: 0; }
.hj-woo td.product-subtotal { font-weight: 700; }
.hj-woo table.cart td.product-remove { width: 44px; text-align: right; }
.hj-woo a.remove {
  display: inline-grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border: 1.5px solid var(--cloud);
  border-radius: 50%;
  font-size: 20px;
  line-height: 1;
  color: var(--ink-muted);
  text-decoration: none;
}
.hj-woo a.remove:hover { background: var(--rose); border-color: var(--rose); color: var(--paper); }

/* Quantity box (Avada adds the − and + buttons). */
.hj-woo .quantity {
  display: inline-flex;
  align-items: center;
  overflow: hidden;
  background: var(--paper);
  border: 1.5px solid #E2DED3;
  border-radius: var(--r-pill);
}
.hj-woo .quantity input.qty {
  width: 46px;
  min-height: 40px;
  padding: 0;
  border: 0;
  background: transparent;
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 800;
  text-align: center;
  -moz-appearance: textfield;
}
.hj-woo .quantity input.qty::-webkit-outer-spin-button,
.hj-woo .quantity input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.hj-woo .quantity .minus,
.hj-woo .quantity .plus {
  width: 38px;
  height: 40px;
  padding: 0;
  border: 0;
  background: transparent;
  font: 800 18px/1 var(--font-display);
  color: var(--ink);
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}
.hj-woo .quantity .minus:hover,
.hj-woo .quantity .plus:hover { background: var(--cloud); }

/* WooCommerce's own coupon / update row is worked by Avada's buttons below; keep it, unseen. */
.hj-woo tr.avada-cart-actions td.actions { padding: 0; border: 0; height: 0; }
.hj-woo tr.avada-cart-actions td.actions > * {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.hj-woo tr.avada-cart-actions td:not(.actions) { padding: var(--sp5) 0 0; border-bottom: 0; }

/* Shipping calculator, promo code, totals. */
.hj-woo .cart-collaterals {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--sp5);
  align-items: start;
}
.hj-woo .shipping-coupon { display: grid; gap: var(--sp5); }
.hj-woo .shipping-coupon h2,
.hj-woo .cart_totals > h2 { font-size: 18px; }
.hj-woo .shipping-calculator-button { cursor: default; }
.hj-woo .avada-shipping-calculator-form { display: flex; flex-wrap: wrap; gap: 0 12px; }
.hj-woo .avada-shipping-calculator-form > * { flex: 1 1 100%; min-width: 0; }
.hj-woo .avada-shipping-calculator-form > .fusion-one-half { flex: 1 1 calc(50% - 6px); width: auto; }
.hj-woo .avada-shipping-calculator-form > p:last-of-type { margin: var(--sp2) 0 0; }
.hj-woo .avada-shipping-calculator-form button { width: 100%; }
.hj-woo .avada-coupon-fields { display: flex; flex-wrap: wrap; gap: var(--sp2); }
.hj-woo .avada-coupon-fields input { flex: 1 1 180px; width: auto; }
.hj-woo .cart_totals table.shop_table th { width: 38%; }
.hj-woo .cart_totals table.shop_table td { padding: var(--sp3) 0 var(--sp3) var(--sp3); text-align: right; }
.hj-woo .add_gift_card_form {
  margin: var(--sp4) 0;
  padding-top: var(--sp4);
  border-top: 1.5px dashed #E2DED3;
}
.hj-woo .add_gift_card_form h4 { font-size: 13px; }
.hj-woo #wc_gc_cart_redeem_form { display: flex; flex-wrap: wrap; gap: var(--sp2); }
.hj-woo #wc_gc_cart_redeem_form input { flex: 1 1 160px; width: auto; }
.hj-woo .wc-proceed-to-checkout { display: grid; gap: var(--sp3); margin-top: var(--sp4); }
.hj-woo .wc-proceed-to-checkout > .button,
.hj-woo .wc-proceed-to-checkout > .fusion-button { width: 100%; }
.hj-woo .wc-proceed-to-checkout .checkout-button { min-height: 54px; font-size: 16px; }
.hj-woo .cross-sells { margin-top: var(--sp6); }

/* ---- Checkout ---------------------------------------------------------- */
/* Avada's "Hello … / View Cart" box. Its two message columns hold Avada's sample text
   ("Call customer service at 888-555-5555", "info@yourshop.com"), so they're hidden. */
.hj-woo .avada-myaccount-user {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp2) var(--sp5);
  margin: 0 0 var(--sp5);
  padding: var(--sp3) var(--sp5);
  background: var(--paper);
  border: 1.5px solid var(--cloud);
  border-radius: var(--r-lg);
  font-size: 14px;
}
.hj-woo .avada-myaccount-user-column.message { display: none; }
.hj-woo .avada-myaccount-user .not-user { color: var(--ink-soft); }
.hj-woo .avada-myaccount-user .view-cart a { font-family: var(--font-display); font-weight: 800; text-transform: uppercase; font-size: 13px; }

/* Promo code (Avada shows it open; WooCommerce's script would hide it). */
.hj-woo form.checkout_coupon {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp3) var(--sp5);
  margin: 0 0 var(--sp5);
  padding: var(--sp4) var(--sp5);
  background: var(--butter);
  border-radius: var(--r-lg);
  box-shadow: none;
}
.hj-woo form.checkout_coupon .promo-code-heading { margin: 0; font-size: 15px; }
.hj-woo form.checkout_coupon .coupon-contents { display: flex; gap: var(--sp2); flex: 1 1 300px; max-width: 460px; }
.hj-woo form.checkout_coupon .form-row { margin: 0; float: none; width: auto; }
.hj-woo form.checkout_coupon .coupon-input { flex: 1; }
.hj-woo form.checkout_coupon .clear { display: none; }

/* The three steps: Billing, Shipping, Review & Payment (worked by Avada's script). */
.hj-woo ul.woocommerce-checkout-nav {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp2);
  margin: 0 0 var(--sp5);
  counter-reset: hjstep;
}
.hj-woo ul.woocommerce-checkout-nav li { counter-increment: hjstep; }
.hj-woo ul.woocommerce-checkout-nav a {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 100%;
  padding: 14px 16px;
  background: var(--paper);
  border: 2px solid var(--cloud);
  border-radius: var(--r-md);
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.15;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--ink-muted);
}
.hj-woo ul.woocommerce-checkout-nav a::before {
  content: counter(hjstep);
  display: inline-grid;
  place-items: center;
  flex: none;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--cloud);
  color: var(--ink-muted);
  font-size: 13px;
}
.hj-woo ul.woocommerce-checkout-nav a:hover { color: var(--ink); border-color: #DDD9CF; }
.hj-woo ul.woocommerce-checkout-nav li.is-active a {
  color: var(--ink);
  border-color: var(--ink);
  box-shadow: var(--shadow-sticker);
}
.hj-woo ul.woocommerce-checkout-nav li.is-active a::before { background: var(--rose); color: var(--paper); }

/* Only the first step shows at the start, as on the current site. */
.hj-woo .avada-checkout form.checkout .col-2,
.hj-woo .avada-checkout form.checkout #order_review_heading,
.hj-woo .avada-checkout form.checkout #order_review { display: none; }
.hj-woo form.checkout .col2-set .col-1,
.hj-woo form.checkout .col2-set .col-2 { float: none; width: 100%; }
.hj-woo .woocommerce-billing-fields h3,
.hj-woo .woocommerce-shipping-fields h3,
.hj-woo .woocommerce-additional-fields h3,
.hj-woo #order_review_heading { font-size: 20px; margin-bottom: var(--sp5); }
.hj-woo h3#ship-to-different-address { margin-bottom: var(--sp4); }
.hj-woo h3#ship-to-different-address label { font-size: 15px; }
.hj-woo .shipping_address { margin-bottom: var(--sp4); }
.hj-woo .mailchimp-newsletter label { font-size: 14px; }
.hj-woo .continue-checkout { margin-top: var(--sp3); min-width: 200px; }
.hj-woo .continue-checkout::after { content: '→'; font-size: 16px; }

/* Order review and payment. */
.hj-woo .woocommerce-checkout-review-order-table td.product-name { font-weight: 700; }
.hj-woo .woocommerce-checkout-review-order-table .product-quantity { font-weight: 400; color: var(--ink-soft); }
.hj-woo .woocommerce-checkout-review-order-table td.product-total { text-align: right; }
.hj-woo .woocommerce-checkout-review-order-table thead th.product-total { text-align: right; }
.hj-woo #payment { margin-top: var(--sp6); }
.hj-woo ul.payment_methods { display: grid; gap: var(--sp3); margin: 0 0 var(--sp5); }
.hj-woo li.wc_payment_method {
  padding: var(--sp4) var(--sp5);
  background: var(--paper-warm);
  border: 2px solid var(--cloud);
  border-radius: var(--r-lg);
}
.hj-woo li.wc_payment_method:has(> input:checked) {
  background: var(--paper);
  border-color: var(--ink);
  box-shadow: var(--shadow-sticker);
}
.hj-woo li.wc_payment_method > input { margin-right: 10px; vertical-align: middle; }
.hj-woo li.wc_payment_method > label {
  display: inline;
  margin: 0;
  font-size: 15px;
  vertical-align: middle;
  cursor: pointer;
}
.hj-woo li.wc_payment_method > label img {
  display: inline-block;
  max-height: 26px;
  width: auto;
  margin: 0 0 0 8px;
  vertical-align: middle;
}
.hj-woo li.wc_payment_method .about_paypal {
  margin-left: 8px;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
}
.hj-woo .payment_box {
  margin-top: var(--sp3);
  padding-left: 28px;
  font-size: 13px;
  color: var(--ink-soft);
}
.hj-woo .payment_box p:last-child { margin-bottom: 0; }
.hj-woo .woocommerce-terms-and-conditions-wrapper,
.hj-woo .woocommerce-privacy-policy-text { font-size: 12px; color: var(--ink-soft); }
.hj-woo .place-order { margin: 0; }
.hj-woo #place_order { width: 100%; min-height: 58px; margin-top: var(--sp4); font-size: 16px; }

/* ---- Order received / order details ------------------------------------ */
.hj-woo .woocommerce-order > .woocommerce-notice--success,
.hj-woo .woocommerce-thankyou-order-received {
  padding: var(--sp5);
  background: var(--mint);
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 800;
}
.hj-woo ul.woocommerce-order-overview {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: var(--sp3);
  margin: 0 0 var(--sp6);
}
.hj-woo ul.woocommerce-order-overview li {
  padding: var(--sp4);
  background: var(--paper);
  border: 1.5px solid var(--cloud);
  border-radius: var(--r-md);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-muted);
}
.hj-woo ul.woocommerce-order-overview li strong {
  display: block;
  margin-top: 6px;
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink);
  word-break: break-word;
}
.hj-woo .woocommerce-order-details,
.hj-woo .woocommerce-customer-details { margin-bottom: var(--sp5); }
.hj-woo .woocommerce-columns--addresses {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--sp5);
}
.hj-woo .woocommerce-column--billing-address,
.hj-woo .woocommerce-column--shipping-address { float: none; width: auto; }
.hj-woo .woocommerce-customer-details--phone,
.hj-woo .woocommerce-customer-details--email { margin: 6px 0 0; }
.hj-woo .order-again { margin-top: var(--sp4); }
.hj-woo .woocommerce-bacs-bank-details { margin-bottom: var(--sp5); }

/* ---- My Account -------------------------------------------------------- */
.logged-in .hj-woo--account .woocommerce {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: var(--sp5);
  align-items: start;
}
.logged-in .hj-woo--account .woocommerce > :not(.woocommerce-MyAccount-navigation):not(.woocommerce-MyAccount-content) { grid-column: 1 / -1; }
.hj-woo--account .avada-myaccount-user { margin-bottom: 0; }
.hj-woo .woocommerce-MyAccount-navigation ul {
  display: grid;
  gap: 4px;
  padding: var(--sp3);
  background: var(--paper);
  border: 2px solid var(--ink);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-sticker);
}
.hj-woo .woocommerce-MyAccount-navigation a {
  display: block;
  padding: 11px 14px;
  border-radius: var(--r-md);
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 800;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--ink);
}
.hj-woo .woocommerce-MyAccount-navigation a:hover { background: var(--cloud); color: var(--ink); }
.hj-woo .woocommerce-MyAccount-navigation .is-active a { background: var(--ink); color: var(--paper); }
.hj-woo .woocommerce-MyAccount-navigation-link--customer-logout a { color: var(--rose); }
.hj-woo .woocommerce-MyAccount-content > p:first-of-type { font-size: 15px; }
.hj-woo .woocommerce-MyAccount-content h2 { font-size: 18px; margin-top: var(--sp5); }
.hj-woo .woocommerce-MyAccount-content > h2:first-child,
.hj-woo .woocommerce-MyAccount-content > .woocommerce-notices-wrapper + h2,
.hj-woo .woocommerce-MyAccount-content > .avada-woocommerce-myaccount-heading { margin-top: 0; }
.hj-woo .woocommerce-notices-wrapper:empty { display: none; }
.hj-woo .woocommerce-orders-table .button,
.hj-woo .woocommerce-MyAccount-content td .button {
  min-height: 0;
  margin: 2px 4px 2px 0;
  padding: 7px 12px;
  font-size: 12px;
}
.hj-woo mark { background: var(--butter); color: var(--ink); padding: 0 4px; border-radius: var(--r-xs); }
.hj-woo .woocommerce-pagination { display: flex; gap: var(--sp2); margin-top: var(--sp4); }

/* Addresses. */
.hj-woo .woocommerce-Addresses {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--sp4);
  margin-top: var(--sp4);
}
.hj-woo .woocommerce-Addresses .woocommerce-Address {
  float: none;
  width: auto;
  padding: var(--sp5);
  border: 1.5px solid var(--cloud);
  border-radius: var(--r-lg);
}
.hj-woo .woocommerce-Address-title {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--sp2);
  margin-bottom: var(--sp3);
}
.hj-woo .woocommerce-Address-title h2,
.hj-woo .woocommerce-Address-title h3 { margin: 0; font-size: 16px; }
.hj-woo .woocommerce-Address-title .edit { font-family: var(--font-mono); font-size: 12px; }

/* Account details form. */
.hj-woo form.woocommerce-EditAccountForm fieldset {
  flex: 1 1 100%;
  margin: var(--sp3) 0 var(--sp5);
  padding: var(--sp5);
  border: 1.5px solid var(--cloud);
  border-radius: var(--r-lg);
}
.hj-woo form.woocommerce-EditAccountForm legend {
  padding: 0 8px;
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 900;
  text-transform: uppercase;
}
.hj-woo #account_display_name_description { display: block; margin-top: 4px; font-size: 12px; color: var(--ink-soft); }

/* Logged out: log in + register side by side. */
.hj-woo #customer_login {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sp5);
  align-items: start;
}
.hj-woo #customer_login > .u-column1,
.hj-woo #customer_login > .u-column2 { float: none; width: auto; }
.hj-woo form.login .form-row:last-of-type { margin-bottom: var(--sp2); }
.hj-woo .woocommerce-form-login__rememberme { margin: 0 var(--sp4) var(--sp3) 0; }
.hj-woo .woocommerce-form-login__submit,
.hj-woo .woocommerce-form-register__submit,
.hj-woo form.woocommerce-ResetPassword button { width: 100%; }
.hj-woo .lost_password { margin: var(--sp3) 0 0; font-size: 13px; }
.hj-woo form.woocommerce-ResetPassword,
.hj-woo form.lost_reset_password { max-width: 560px; }

/* ---- Computers narrower than the full layout ---------------------------- */
@media (max-width: 960px) {
  .hj-woo .cart-collaterals { grid-template-columns: minmax(0, 1fr); }
  .hj-woo .cart-collaterals .cart_totals { order: -1; }
  .logged-in .hj-woo--account .woocommerce { grid-template-columns: minmax(0, 1fr); }
  .hj-woo .woocommerce-MyAccount-navigation ul {
    display: flex;
    gap: 4px;
    overflow-x: auto;
    padding: var(--sp2);
    border-radius: var(--r-lg);
    -webkit-overflow-scrolling: touch;
  }
  .hj-woo .woocommerce-MyAccount-navigation a { white-space: nowrap; padding: 9px 12px; font-size: 13px; }
  .hj-woo #customer_login { grid-template-columns: minmax(0, 1fr); }
}

/* ---- Phones -------------------------------------------------------------- */
@media (max-width: 760px) {
  .hj-woo .woocommerce-content-box,
  .hj-woo .shipping-coupon > form,
  .hj-woo .shipping-coupon > .coupon,
  .hj-woo .cart_totals,
  .hj-woo .woocommerce-MyAccount-content,
  .hj-woo #customer_login > .u-column1,
  .hj-woo #customer_login > .u-column2,
  .hj-woo form.woocommerce-ResetPassword,
  .hj-woo form.lost_reset_password,
  .hj-woo .woocommerce-order-details,
  .hj-woo .woocommerce-customer-details {
    padding: var(--sp5) var(--sp4);
    border-radius: var(--r-lg);
  }

  /* Cart items as stacked rows. */
  .hj-woo table.cart thead { display: none; }
  .hj-woo table.cart,
  .hj-woo table.cart tbody { display: block; }
  .hj-woo table.cart tr.cart_item {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--sp3);
    padding: var(--sp4) 0;
    border-bottom: 1px solid var(--cloud);
  }
  .hj-woo table.cart tr.cart_item td { display: block; padding: 0; border: 0; text-align: left; }
  .hj-woo table.cart tr.cart_item td::before { display: none; }
  .hj-woo table.cart td.product-name { grid-column: 1 / -1; padding-right: 44px; }
  .hj-woo table.cart td.product-price { display: none; }
  .hj-woo table.cart td.product-quantity { grid-column: 1; }
  .hj-woo table.cart td.product-subtotal { grid-column: 2; text-align: right; }
  .hj-woo table.cart td.product-remove { position: absolute; top: var(--sp4); right: 0; width: auto; }
  .hj-woo .product-thumbnail img { width: 64px; height: 64px; }
  .hj-woo table.cart tr.avada-cart-actions { display: block; }
  .hj-woo table.cart tr.avada-cart-actions td:not(.actions) { display: block; padding: var(--sp4) 0 0; }
  .hj-woo table.cart tr.avada-cart-actions td:not(.actions) .button { width: 100%; }

  /* Account tables (orders etc.) as stacked rows with their labels. */
  .hj-woo--account table.shop_table_responsive thead { display: none; }
  .hj-woo--account table.shop_table_responsive,
  .hj-woo--account table.shop_table_responsive tbody,
  .hj-woo--account table.shop_table_responsive tr { display: block; }
  .hj-woo--account table.shop_table_responsive tr { padding: var(--sp3) 0; border-bottom: 1px solid var(--cloud); }
  .hj-woo--account table.shop_table_responsive td {
    display: flex;
    justify-content: space-between;
    gap: var(--sp3);
    padding: 4px 0;
    border: 0;
    text-align: right;
  }
  .hj-woo--account table.shop_table_responsive td[data-title]::before {
    content: attr(data-title);
    font-family: var(--font-mono);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ink-muted);
    text-align: left;
  }

  .hj-woo ul.woocommerce-checkout-nav a {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    padding: 10px;
    font-size: 11px;
  }
  .hj-woo ul.woocommerce-checkout-nav a::before { width: 22px; height: 22px; font-size: 11px; }
  .hj-woo li.wc_payment_method { padding: var(--sp4); }
  .hj-woo .continue-checkout { width: 100%; }
}

@media (max-width: 600px) {
  .hj-woo .woocommerce-billing-fields__field-wrapper > .form-row-first,
  .hj-woo .woocommerce-billing-fields__field-wrapper > .form-row-last,
  .hj-woo .woocommerce-shipping-fields__field-wrapper > .form-row-first,
  .hj-woo .woocommerce-shipping-fields__field-wrapper > .form-row-last,
  .hj-woo .woocommerce-address-fields__field-wrapper > .form-row-first,
  .hj-woo .woocommerce-address-fields__field-wrapper > .form-row-last,
  .hj-woo form.woocommerce-EditAccountForm > .form-row-first,
  .hj-woo form.woocommerce-EditAccountForm > .form-row-last,
  .hj-woo .avada-shipping-calculator-form > .fusion-one-half { flex-basis: 100%; }
  .hj-woo form.checkout_coupon .coupon-contents { flex-basis: 100%; max-width: none; }
  .hj-woo .woocommerce-message .button,
  .hj-woo .woocommerce-info .button,
  .hj-woo .woocommerce-error .button { float: none; display: flex; width: 100%; margin: var(--sp3) 0 0; }
}