/* ==========================================================================
   Aletheia Wellness — component styles
   Tokens come from theme.json. Everything here is component-level.
   Follows DESIGN.md: marble ground, aegean navy, gold accent used sparingly,
   1px borders, 2px radii, no shadows at rest.
   ========================================================================== */

:root {
  --alw-ink: #071B33;
  --alw-navy: #0C2F57;
  --alw-blue: #1B5A9E;
  --alw-gold: #C6A55C;
  --alw-gilt: #F0DCA8;
  --alw-bronze: #8C6C2C;
  --alw-marble: #F7F4ED;
  --alw-paper: #FFFFFF;
  --alw-slate: #5A6B7C;
  --alw-hairline: rgba(12, 47, 87, 0.12);
  --alw-key: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='12' viewBox='0 0 12 12'%3E%3Cg fill='none' stroke='%23C6A55C' stroke-width='1'%3E%3Cpath d='M0,12 L0,0 L9,0 L9,9 L3,9 L3,3 L6,3'/%3E%3Cpath d='M0,12 L12,12'/%3E%3C/g%3E%3C/svg%3E");
}

/* --------------------------------------------------------------- typography */

body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, .alw-display {
  text-wrap: balance;
}

p {
  text-wrap: pretty;
}

.alw-eyebrow {
  font-family: Jost, Futura, system-ui, sans-serif;
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--alw-bronze);
}

/* Numbers in prices, tables and COA data align in columns. */
.price, .woocommerce-Price-amount, table td, table th, .alw-tabular {
  font-variant-numeric: tabular-nums;
}

/* --------------------------------------------------- the Greek key divider */

.alw-key-rule {
  height: 12px;
  background-image: var(--alw-key);
  background-repeat: repeat-x;
  background-position: center;
  opacity: 0.9;
}

/* ------------------------------------------------------- research banner */

.aletheia-banner {
  background: var(--alw-ink);
  color: var(--alw-gilt);
  text-align: center;
  padding: 0.5rem 1rem;
  font-family: Jost, Futura, system-ui, sans-serif;
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(198, 165, 92, 0.35);
}

/* --------------------------------------------------------------- buttons */

.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  background: var(--alw-navy);
  color: var(--alw-marble);
  border: 1px solid var(--alw-navy);
  border-radius: 2px;
  font-family: Jost, Futura, system-ui, sans-serif;
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  padding: 0.85rem 1.75rem;
  min-height: 44px;
  line-height: 1.3;
  transition: background-color 140ms ease, color 140ms ease;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.wp-block-button__link:hover {
  background: var(--alw-ink);
  color: var(--alw-gilt);
  border-color: var(--alw-ink);
}

.woocommerce a.button.alt,
.woocommerce button.button.alt {
  background: var(--alw-gold);
  border-color: var(--alw-gold);
  color: var(--alw-ink);
}

.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
  background: var(--alw-gilt);
  border-color: var(--alw-gilt);
  color: var(--alw-ink);
}

/* Never remove the outline without replacing it — see DESIGN.md §4. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.wp-block-button__link:focus-visible {
  outline: 2px solid var(--alw-gold);
  outline-offset: 2px;
  border-radius: 2px;
}

/* ---------------------------------------------------------------- inputs */

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.wp-block-search__input {
  border: 1px solid rgba(12, 47, 87, 0.3);
  border-radius: 2px;
  padding: 0.75rem 0.875rem;
  min-height: 44px;
  /* 16px minimum stops iOS zooming the page on focus. */
  font-size: 16px;
  font-family: Jost, Futura, system-ui, sans-serif;
  background: var(--alw-paper);
  color: var(--alw-navy);
}

.woocommerce form .form-row label {
  font-family: Jost, Futura, system-ui, sans-serif;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--alw-navy);
  margin-bottom: 0.35rem;
  display: block;
}

/* Windows renders <select> with a transparent background by default. */
select {
  background-color: var(--alw-paper);
}

/* ------------------------------------------------------- product listing */

.woocommerce ul.products {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 2rem;
  margin: 0;
  padding: 0;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after {
  content: none;
}

.woocommerce ul.products li.product {
  width: 100%;
  margin: 0;
  float: none;
  background: var(--alw-paper);
  border: 1px solid var(--alw-hairline);
  border-radius: 2px;
  padding: 1.5rem 1.25rem 1.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  text-align: center;
  transition: box-shadow 160ms ease, border-color 160ms ease;
}

.woocommerce ul.products li.product:hover {
  border-color: rgba(198, 165, 92, 0.55);
  box-shadow: 0 1px 2px rgba(7, 27, 51, 0.06), 0 8px 24px rgba(7, 27, 51, 0.08);
}

.woocommerce ul.products li.product a img {
  margin: 0 auto 1rem;
  max-width: 190px;
  height: auto;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: Cinzel, Georgia, serif;
  font-weight: 600;
  font-size: 1.0625rem;
  letter-spacing: 0.08em;
  color: var(--alw-navy);
  padding: 0;
}

.woocommerce ul.products li.product .price {
  font-family: Jost, Futura, system-ui, sans-serif;
  font-size: 1rem;
  font-weight: 500;
  color: var(--alw-bronze);
}

@media (max-width: 1023px) {
  .woocommerce ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
}

@media (max-width: 599px) {
  /* Two across, never one — the vials read as a range. DESIGN.md §5. */
  .woocommerce ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
  .woocommerce ul.products li.product { padding: 1rem 0.75rem 1.25rem; }
  .woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 0.9375rem; }
}

/* ---------------------------------------------------------- single product */

.woocommerce div.product .product_title {
  font-family: Cinzel, Georgia, serif;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--alw-navy);
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--alw-navy);
  font-family: Jost, Futura, system-ui, sans-serif;
  font-size: 1.75rem;
  font-weight: 500;
}

.aletheia-purity {
  font-family: Jost, Futura, system-ui, sans-serif;
  font-size: 0.8125rem;
  letter-spacing: 0.08em;
  color: var(--alw-bronze);
  border-left: 2px solid var(--alw-gold);
  padding-left: 0.75rem;
  margin: 0 0 1rem;
}

.aletheia-ruo {
  background: var(--alw-navy);
  color: var(--alw-marble);
  font-family: Jost, Futura, system-ui, sans-serif;
  font-size: 0.8125rem;
  line-height: 1.6;
  letter-spacing: 0.02em;
  padding: 1rem 1.25rem;
  border-top: 2px solid var(--alw-gold);
  border-radius: 2px;
  margin: 1.5rem 0 1rem;
}

.aletheia-coa {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  margin: 0 0 1.5rem;
}

.aletheia-coa__link {
  font-family: Jost, Futura, system-ui, sans-serif;
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--alw-bronze);
  text-decoration: none;
  border-bottom: 1px solid var(--alw-gold);
  align-self: flex-start;
  padding-bottom: 2px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

.aletheia-coa__link:hover {
  color: var(--alw-navy);
  border-bottom-color: var(--alw-navy);
}

.aletheia-coa__note {
  font-size: 0.8125rem;
  color: var(--alw-slate);
}

/* ------------------------------------------------------------- the gate */

.aletheia-gate {
  border: 1px solid var(--alw-hairline);
  border-top: 2px solid var(--alw-gold);
  background: var(--alw-paper);
  padding: 1.5rem;
  border-radius: 2px;
  margin: 1.5rem 0;
}

.aletheia-gate p {
  margin: 0 0 1rem;
  font-size: 0.9375rem;
  color: var(--alw-slate);
}

.aletheia-gate-link,
.aletheia-gate-button {
  font-family: Jost, Futura, system-ui, sans-serif;
  font-size: 0.875rem;
  letter-spacing: 0.04em;
}

.aletheia-gate-link {
  color: var(--alw-bronze);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ------------------------------------------------------- footer disclaimer */

.aletheia-footer-note {
  background: var(--alw-ink);
  border-top: 1px solid rgba(198, 165, 92, 0.3);
  padding: 1.75rem 1.5rem;
  text-align: center;
}

.aletheia-footer-note p {
  margin: 0 auto;
  max-width: 68ch;
  color: rgba(247, 244, 237, 0.7);
  font-family: Jost, Futura, system-ui, sans-serif;
  font-size: 0.8125rem;
  line-height: 1.7;
  letter-spacing: 0.02em;
}

/* ------------------------------------------------------------- messages */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  border-top-color: var(--alw-gold);
  background: var(--alw-paper);
  border-radius: 2px;
  font-family: Jost, Futura, system-ui, sans-serif;
  font-size: 0.9375rem;
}

.woocommerce-message::before,
.woocommerce-info::before {
  color: var(--alw-gold);
}

/* --------------------------------------------------------------- tables */

.woocommerce table.shop_table {
  border: 1px solid var(--alw-hairline);
  border-radius: 2px;
  font-family: Jost, Futura, system-ui, sans-serif;
}

.woocommerce table.shop_table th {
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 0.75rem;
  color: var(--alw-slate);
}

/* Wide tables scroll inside their own box; the page body never does. */
.woocommerce table.shop_table_responsive,
.alw-scroll {
  display: block;
  overflow-x: auto;
  max-width: 100%;
}

/* --------------------------------------------------------------- motion */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ==========================================================================
   Header & footer
   ========================================================================== */

.alw-header { border-bottom: 0; }

.alw-lockup {
  display: flex;
  align-items: center;
  gap: 14px;
  text-decoration: none;
  min-height: 44px;
}

.alw-lockup__rule {
  width: 1px;
  height: 40px;
  background: var(--alw-gold);
  opacity: 0.55;
}

.alw-lockup__text {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.alw-lockup__name {
  font-family: Cinzel, Georgia, serif;
  font-weight: 600;
  font-size: 1.5rem;
  line-height: 1;
  letter-spacing: 0.2em;
  text-indent: 0.2em;
  color: var(--alw-navy);
}

.alw-lockup__sub {
  font-family: Jost, Futura, system-ui, sans-serif;
  font-weight: 400;
  font-size: 0.625rem;
  line-height: 1;
  letter-spacing: 0.02em;
  color: var(--alw-bronze);
  text-align: justify;
  text-align-last: justify;
}

.alw-nav a {
  font-family: Jost, Futura, system-ui, sans-serif;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--alw-navy);
  text-decoration: none;
  padding: 0.5rem 0;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  border-bottom: 1px solid transparent;
}

.alw-nav a:hover,
.alw-nav .current-menu-item > a {
  color: var(--alw-bronze);
  border-bottom-color: var(--alw-gold);
}

/* ------------------------------------------------------------------ footer */

.alw-footer__inner {
  display: flex;
  flex-wrap: wrap;
  gap: 3rem;
  justify-content: space-between;
  align-items: flex-start;
}

.alw-footer__brand {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
}

.alw-footer__name {
  font-family: Cinzel, Georgia, serif;
  font-weight: 600;
  font-size: 1.375rem;
  line-height: 1;
  letter-spacing: 0.22em;
  text-indent: 0.22em;
  color: var(--alw-marble);
  margin-top: 6px;
}

.alw-footer__sub {
  font-family: Jost, Futura, system-ui, sans-serif;
  font-size: 0.625rem;
  letter-spacing: 0.02em;
  color: var(--alw-gold);
  width: 100%;
  max-width: 168px;
  text-align: justify;
  text-align-last: justify;
}

.alw-footer__tag {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-style: italic;
  font-size: 1.0625rem;
  color: rgba(247, 244, 237, 0.55);
  margin-top: 8px;
}

.alw-footer__nav {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem 3rem;
}

.alw-footer__nav a {
  font-family: Jost, Futura, system-ui, sans-serif;
  font-size: 0.875rem;
  letter-spacing: 0.04em;
  color: rgba(247, 244, 237, 0.82);
  text-decoration: none;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

.alw-footer__nav a:hover {
  color: var(--alw-gilt);
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (max-width: 599px) {
  .alw-lockup__name { font-size: 1.25rem; }
  .alw-footer__inner { gap: 2rem; }
  .alw-footer__nav { gap: 0.5rem 2rem; }
}

/* ==========================================================================
   Mobile header
   The header renders four siblings in one flex row: lockup, navigation,
   customer account and mini-cart. Left to wrap, the two icons fall to a
   second row and the whole header eats 150px before any content shows.
   This keeps all four on one line and brings every control up to a 44px
   touch target.
   ========================================================================== */

@media (max-width: 899px) {
  .alw-header {
    padding-top: 0.625rem !important;
    padding-bottom: 0.625rem !important;
  }

  .alw-header > .wp-block-group {
    flex-wrap: nowrap !important;
    gap: 0.25rem;
    align-items: center;
  }

  /* The lockup takes the slack; the controls keep their intrinsic width. */
  .alw-header a.alw-lockup {
    flex: 1 1 auto;
    min-width: 0;
    gap: 10px;
  }
  .alw-header a.alw-lockup svg { width: 36px; height: 36px; }
  .alw-lockup__rule { height: 30px; }
  .alw-lockup__name { font-size: 1.0625rem; letter-spacing: 0.16em; text-indent: 0.16em; }
  .alw-lockup__sub { font-size: 0.5rem; }

  /* Order: logo … account, cart, menu. The menu button sits under the thumb
     at the trailing edge, which is where a one-handed reach lands. */
  .alw-header .wp-block-woocommerce-customer-account { order: 2; flex: 0 0 auto; }
  .alw-header .wp-block-woocommerce-mini-cart { order: 3; flex: 0 0 auto; }
  .alw-header .alw-nav { order: 4; flex: 0 0 auto; }

  /* 24x24 was the icon, not the button. */
  .alw-header .wp-block-navigation__responsive-container-open,
  .alw-header .wc-block-customer-account__link,
  .alw-header .wc-block-mini-cart__button {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 0;
  }

  .alw-header .wp-block-navigation__responsive-container-open svg { width: 26px; height: 26px; }
}

/* The overlay menu itself: links large enough to hit, spaced to read. */
.wp-block-navigation__responsive-container.is-menu-open {
  padding: 1.5rem 1.25rem 3rem;
  background: var(--alw-marble);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
  gap: 0.25rem;
  width: 100%;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
  font-family: Cinzel, Georgia, serif;
  font-size: 1.375rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  color: var(--alw-navy);
  min-height: 56px;
  display: flex;
  align-items: center;
  width: 100%;
  border-bottom: 1px solid var(--alw-hairline);
}

.wp-block-navigation__responsive-container-close {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* The standing banner must not wrap to two lines on a phone. */
@media (max-width: 599px) {
  .aletheia-banner {
    font-size: 0.5625rem;
    letter-spacing: 0.14em;
    padding: 0.4375rem 0.75rem;
  }
}

/* ==========================================================================
   WooCommerce — modern editorial pass
   ========================================================================== */

.woocommerce ul.products li.product {
  border-radius: 4px;
  transition: transform 0.4s cubic-bezier(.16,.84,.44,1), box-shadow 0.4s, border-color 0.3s;
}

.woocommerce ul.products li.product:hover {
  transform: translateY(-5px);
}

.woocommerce ul.products li.product a img {
  transition: transform 0.5s cubic-bezier(.16,.84,.44,1);
}

.woocommerce ul.products li.product:hover a img { transform: scale(1.04); }

/* Two-line product names must not shove the price out of alignment. */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  min-height: 2.6em;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1.3;
}

.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .aletheia-gate-button {
  margin-top: auto;
  width: 100%;
  justify-content: center;
  display: inline-flex;
  align-items: center;
}

/* --------------------------------------------------------- single product */

@media (max-width: 767px) {
  .woocommerce div.product div.images,
  .woocommerce div.product div.summary {
    width: 100% !important;
    float: none !important;
    margin-right: 0 !important;
  }
  .woocommerce div.product div.summary { margin-top: 1.75rem; }
  .woocommerce div.product .product_title { font-size: 1.625rem; line-height: 1.2; }
  .woocommerce div.product p.price,
  .woocommerce div.product span.price { font-size: 1.5rem; }

  /* Variation pickers are the one control every order passes through. */
  .woocommerce div.product form.cart .variations select {
    width: 100%;
    min-height: 48px;
    font-size: 16px;
  }
  .woocommerce div.product form.cart .variations th,
  .woocommerce div.product form.cart .variations td {
    display: block;
    width: 100%;
    text-align: left;
    padding: 0.25rem 0;
  }
  .woocommerce div.product form.cart div.quantity { float: none; margin: 0 0 0.75rem; }
  .woocommerce div.product form.cart .button {
    width: 100%;
    justify-content: center;
  }
}

/* Cart and checkout tables never force the page to scroll sideways. */
@media (max-width: 767px) {
  .woocommerce table.shop_table_responsive tr td { text-align: right; }
  .woocommerce-cart table.cart td.actions .coupon .input-text {
    width: 100%;
    margin: 0 0 0.75rem;
  }
  .woocommerce #content table.cart td.actions .button,
  .woocommerce table.cart td.actions .button { width: 100%; }
  .woocommerce-checkout #payment div.payment_box { font-size: 0.875rem; }
}

/* Nothing on any page may push the document sideways.
   `clip`, not `hidden`: overflow-x:hidden turns the element into a scroll
   container, which silently breaks every position:sticky inside it — the
   range filter bar included. */
body { overflow-x: clip; }
img, svg, video, table, pre { max-width: 100%; }

/* The site-wide link underline from theme.json must not reach the lockup. */
.alw-header a.alw-lockup,
.alw-header a.alw-lockup:hover,
.alw-footer__nav a,
.alw-nav a {
  text-decoration: none;
}

.alw-header a.alw-lockup {
  display: flex !important;
  flex-direction: row;
  align-items: center;
  gap: 14px;
}

.alw-header a.alw-lockup svg {
  flex: 0 0 auto;
  width: 46px;
  height: 46px;
}

/* ==========================================================================
   Touch targets on WooCommerce's own markup
   Measured on the live site at 375px: product titles, breadcrumbs, the
   sorting select, the variation Clear link and the quantity field all came
   in at 17–36px. 44px is the floor a thumb hits reliably.
   ========================================================================== */

/* Form controls, every screen size — a 35px number field is awkward on a
   mouse too. */
.woocommerce .quantity input.qty,
.woocommerce-ordering select,
.woocommerce div.product form.cart .variations select {
  min-height: 44px;
  font-size: 16px; /* stops iOS zooming the page on focus */
}

.woocommerce a.reset_variations {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 0.25rem;
}

.woocommerce .woocommerce-product-gallery__trigger {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}

@media (max-width: 767px) {
  /* Product name in the grid: the tap target is the text line, so pad it
     rather than only enlarging the type. */
  .woocommerce ul.products li.product a .woocommerce-loop-product__title,
  .woocommerce ul.products li.product .woocommerce-loop-product__title {
    min-height: 44px;
    padding: 0.5rem 0;
  }

  /* Breadcrumb links sit on one line and are easy to miss. */
  .woocommerce .woocommerce-breadcrumb {
    line-height: 2.75;
  }
  .woocommerce .woocommerce-breadcrumb a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 0.125rem;
  }

  /* The sorting dropdown is the only control on the Shop toolbar. */
  .woocommerce-ordering { width: 100%; }
  .woocommerce-ordering select { width: 100%; }
}

/* ==========================================================================
   Shop — WooCommerce BLOCK product grid
   The Shop page renders through the Product Collection block
   (ul.wc-block-product-template > li.wc-block-product), not the classic
   ul.products templates. Every rule above that targets `.woocommerce
   ul.products li.product` therefore never reached this page — the cards had
   no surface, no border and 20px tap targets. These rules are the ones that
   actually apply.
   ========================================================================== */

.wc-block-product-template {
  list-style: none;
  margin: 0;
  padding: 0;
  gap: clamp(0.625rem, 1.6vw, 1.5rem) !important;
}

li.wc-block-product {
  background: var(--alw-paper);
  border: 1px solid var(--alw-hairline);
  border-radius: 4px;
  padding: 0.625rem 0.625rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  text-align: center;
  transition: transform 0.4s cubic-bezier(.16,.84,.44,1),
              box-shadow 0.4s cubic-bezier(.16,.84,.44,1),
              border-color 0.3s;
}

li.wc-block-product:hover {
  transform: translateY(-5px);
  border-color: rgba(198, 165, 92, 0.55);
  box-shadow: 0 2px 4px rgba(7, 27, 51, 0.05), 0 18px 40px rgba(7, 27, 51, 0.12);
}

li.wc-block-product .wc-block-components-product-image {
  margin: 0 0 0.5rem;
  background: linear-gradient(180deg, #fff 0%, var(--alw-marble) 70%, #ECE6DA 100%);
  border-radius: 3px;
  overflow: hidden;
}
li.wc-block-product .wc-block-components-product-image img {
  display: block;
  width: 100%;
  height: auto;
  transition: transform 0.5s cubic-bezier(.16,.84,.44,1);
}
li.wc-block-product:hover .wc-block-components-product-image img { transform: scale(1.04); }

/* The product name is the main tap target in the grid — it was 22px. */
li.wc-block-product .wp-block-post-title {
  margin: 0;
  font-family: Cinzel, Georgia, serif;
  font-weight: 600;
  font-size: 0.9375rem;
  line-height: 1.25;
  letter-spacing: 0.04em;
}
li.wc-block-product .wp-block-post-title a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0.25rem 0;
  color: var(--alw-navy);
  text-decoration: none;
}
li.wc-block-product .wp-block-post-title a:hover { color: var(--alw-bronze); }

li.wc-block-product .wc-block-components-product-price {
  font-family: Jost, Futura, system-ui, sans-serif;
  font-size: 0.9375rem;
  color: var(--alw-bronze);
}

/* "Sign in to view pricing" — 20px before this. */
.aletheia-gate-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 0.25rem;
}

li.wc-block-product .aletheia-gate-button,
li.wc-block-product .wp-block-woocommerce-product-button .button {
  margin-top: auto;
  width: 100%;
  justify-content: center;
}

/* Two across on a phone — one giant card per row wastes the screen. */
@media (max-width: 599px) {
  ul.wc-block-product-template.columns-3,
  ul.wc-block-product-template {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  li.wc-block-product .wp-block-post-title { font-size: 0.875rem; }
}

/* Breadcrumb and toolbar links on the block shop. */
@media (max-width: 767px) {
  .wp-block-woocommerce-breadcrumbs a,
  .woocommerce-breadcrumb a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
  .wp-block-woocommerce-catalog-sorting select,
  .wc-block-catalog-sorting select { min-height: 44px; font-size: 16px; }
}