/* shop.css — Shop page hero + product card + toolkit grid */

/* ─── Hero wrapper (forest bg, 2-col layout) ─────────────────────────── */
.sm-shop-hero{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(2rem, 4vw, 4rem);
  align-items:start;                  /* was: center — causes empty top-left */
  background:var(--sm-forest);
  border-radius:var(--sm-r-lg);
  padding:clamp(2rem, 4vw, 3.5rem);
  margin-bottom:var(--sm-space-16)
}

.sm-shop-hero__text{display:flex;flex-direction:column;gap:1.25rem;align-self:center;padding:1rem 0}
.sm-shop-hero__visual{display:flex;justify-content:flex-end;align-items:flex-start}

.sm-shop-hero__title{margin:0}
.sm-shop-hero__desc{margin:0;line-height:1.7;font-size:var(--sm-size-md)}

/* Price anchor (Value / Your price) — legible on dark bg */
.sm-price-anchor{display:flex;gap:.875rem;align-items:baseline;flex-wrap:wrap;margin:.25rem 0}
.sm-price-anchor__old{font-family:var(--sm-font-body);font-size:var(--sm-size-base);color:rgba(255,255,255,.5);text-decoration:line-through}
.sm-price-anchor__new{font-family:var(--sm-font-body);font-size:var(--sm-size-md);color:var(--sm-mint);font-weight:500}

/* Trust badges — legible on dark bg */
.sm-trust-badges{display:flex;gap:1rem;flex-wrap:wrap;margin-top:.5rem}
.sm-trust-badges span{font-family:var(--sm-font-body);font-size:var(--sm-size-sm);color:rgba(255,255,255,.8);display:inline-flex;align-items:center;gap:.25rem;white-space:nowrap}

/* ─── Forest-bg text overrides — SCOPED to left column only ──────────── */
/* NOTE: Do NOT target .sm-shop-hero descendants generally — the white
   card on the right would inherit these and become invisible. */
.sm-shop-hero__text h1,
.sm-shop-hero__text h2,
.sm-shop-hero__text h3,
.sm-shop-hero__text .wp-block-heading{color:var(--sm-paper)}
.sm-shop-hero__text h1 em,
.sm-shop-hero__text h2 em,
.sm-shop-hero__text h3 em{color:var(--sm-mint);font-style:italic}
.sm-shop-hero__text p:not(.sm-price-anchor__old):not(.sm-price-anchor__new){color:rgba(255,255,255,.8)}
.sm-shop-hero__text .sm-tag-label{color:var(--sm-mint);background:rgba(159,225,203,.12);border:1px solid rgba(159,225,203,.3)}

/* ─── Product card (white, right column) ─────────────────────────────── */
.sm-product-card{background:var(--sm-paper);border-radius:var(--sm-r-lg);overflow:hidden;max-width:22rem;width:100%;box-shadow:0 .75rem 2.5rem rgba(0,0,0,.25)}
.sm-product-card__header{background:var(--sm-paper-2);padding:1.5rem;border-bottom:1px solid var(--sm-border)}
.sm-product-card__label{font-family:var(--sm-font-body);font-size:var(--sm-size-xs);font-weight:600;color:var(--sm-green-dark);margin-bottom:.5rem;text-transform:uppercase;letter-spacing:.5px}
.sm-product-card__price{font-family:var(--sm-font-display);font-size:3rem;font-weight:400;color:var(--sm-green);line-height:1;margin-bottom:.25rem}
.sm-product-card__price span{font-size:1.75rem;vertical-align:top;margin-right:.125rem}
.sm-product-card__note{font-family:var(--sm-font-body);font-size:var(--sm-size-sm);color:var(--sm-ink-3);margin:0 0 .25rem}
.sm-product-card__social{font-family:var(--sm-font-body);font-size:var(--sm-size-xs);color:var(--sm-amber);margin:0;font-weight:500}

.sm-product-card__body{padding:1.5rem}
.sm-product-includes{list-style:none;padding:0;margin:0 0 1.25rem}
.sm-product-includes li{font-family:var(--sm-font-body);font-size:var(--sm-size-sm);color:var(--sm-ink-2);padding:.625rem 0;border-bottom:1px solid var(--sm-border);display:flex;align-items:flex-start;gap:.5rem;line-height:1.4}
.sm-product-includes li:last-child{border-bottom:none}
.sm-product-includes li::before{content:"✓";color:var(--sm-green);font-weight:700;flex-shrink:0;line-height:1.4}
.sm-product-buy-btn{width:100%;justify-content:center;margin-bottom:.75rem}
.sm-product-card__disclaimer{font-family:var(--sm-font-body);font-size:var(--sm-size-xs);color:var(--sm-ink-4);text-align:center;margin:0}

/* ─── Toolkit features grid ──────────────────────────────────────────── */
.sm-toolkit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sm-gap-lg);margin-bottom:var(--sm-space-12)}
.sm-toolkit-item{background:var(--sm-paper-2);border:1px solid var(--sm-border);border-radius:var(--sm-r-lg);padding:1.5rem;transition:border-color var(--sm-transition-md),transform var(--sm-transition-md)}
.sm-toolkit-item:hover{border-color:var(--sm-green-dim-25);transform:translateY(-2px)}
.sm-toolkit-item__icon{font-size:1.75rem;margin-bottom:.75rem}
.sm-toolkit-item__name{font-family:var(--sm-font-body);font-weight:500;font-size:var(--sm-size-md);color:var(--sm-ink);margin-bottom:.375rem}
.sm-toolkit-item__desc{font-family:var(--sm-font-body);font-size:var(--sm-size-sm);color:var(--sm-ink-3);line-height:1.6}

/* ─── Responsive ─────────────────────────────────────────────────────── */
@media(max-width:1024px){
  .sm-shop-hero{grid-template-columns:1fr;padding:2.5rem;gap:2rem}
  .sm-shop-hero__visual{justify-content:center;align-items:flex-start}
  .sm-shop-hero__text{padding:0}
  .sm-product-card{max-width:24rem}
  .sm-toolkit-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .sm-shop-hero{padding:1.5rem;gap:1.5rem;border-radius:var(--sm-r)}
  .sm-toolkit-grid{grid-template-columns:1fr}
  .sm-trust-badges{gap:.5rem}
  .sm-trust-badges span{font-size:var(--sm-size-xs)}
}
