/* Shop pages. Mobile first. Tokens come from brand.css. This sheet is
   loaded only on /shop, so the home page and /team do not shift.
   The canvas is white. Navy is the text and the shared CTA.
   Small green type uses #1E5648 (8.47:1 on white). */

html:has(body.shop){background:#FFFFFF;color-scheme:light}
body.shop{
  --bg:#FFFFFF;--surface:#FFFFFF;--raised:#EFEFEA;
  --text:#24204A;--head:#24204A;--muted:#545172;
  --line:#D9D6E2;--link:#1E5648;--focus:#1E5648;--field:#545172;
  background:#FFFFFF;color:#24204A;color-scheme:light;
}
.shop-main{max-width:680px}
.shop-main a{color:#1E5648;font-weight:700;text-decoration-thickness:2px;text-decoration-color:#2FA36B;text-underline-offset:3px}
.shop-main a.btn{color:var(--on-accent);text-decoration:none}
/* Ghost controls (cart Remove) sit on white. #1E5648 is 8.47:1 there.
   The filled checkout button is the shared navy CTA. */
body.shop .btn.ghost,.shop-main a.btn.ghost{color:#1E5648;border-color:#1E5648;background:transparent}
body.shop .btn.ghost:hover,.shop-main a.btn.ghost:hover{background:#E7F6EE}
body.shop .mf-kicker{color:#1E5648}
body.shop .mf-crumb{color:#545172}
body.shop .mf-crumb a{color:#1E5648}
body.shop .mf-crumb .mf-crumb-here{color:#24204A}
body.shop .shop-grid-card{background:#FFFFFF;border-color:#E4E1D8;box-shadow:none;color:#24204A}
body.shop .chip-l{color:#24204A;border-color:#D9D6E2}
body.shop .chip-l:has(input:checked){background:#E7F6EE;border-color:#1E5648;color:#24204A}
.shop-filters{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 16px}
.shop-filters a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 16px;border:1.5px solid var(--line);border-radius:999px;background:transparent;color:var(--head);font-weight:700;text-decoration:none}
.shop-filters a[aria-current=page]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.shop-grid{display:grid;grid-template-columns:1fr;gap:16px}
.shop-grid [hidden]{display:none !important}
.shop-grid-card img,.shop-photo img,.shop-card img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:contain;border-radius:14px;background:#ECECEE}
.shop-shots{display:flex;gap:8px;margin:8px 0 0}
.shop-shot{padding:0;border:1.5px solid #D9D6E2;border-radius:12px;background:#FFFFFF;cursor:pointer}
.shop-shot[aria-pressed=true]{border-color:#1E5648}
.shop-shot img{width:72px;height:72px;aspect-ratio:1/1;object-fit:contain;border-radius:10px;background:#ECECEE}
.shop-card-kicker{margin:12px 0 4px;color:#1E5648;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.shop-card-title{margin:0;color:var(--head);font-size:18px;font-weight:700;line-height:1.3}
.shop-card-price,.shop-price,.shop-total{font-variant-numeric:tabular-nums;font-weight:800;color:var(--head)}
.shop-price{margin:8px 0;font-size:28px}
.shop-sale-note{margin:0 0 8px;color:#1E5648;font-size:16px;font-weight:800}
.shop-empty{margin:8px 0 16px}
.shop-photo{margin:12px 0}
.shop-buy .choice{display:flex;flex-wrap:wrap;gap:8px}
.shop-buy .field{margin:12px 0}
.swatch{display:inline-block;width:14px;height:14px;border-radius:999px;border:1.5px solid var(--head);vertical-align:-2px}
.swatch[data-color=Black]{background:#1a1a1a}
.swatch[data-color=White]{background:#f7f4ef}
.swatch[data-color=Navy]{background:#24204a}
.size-chart{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.size-chart caption{caption-side:top;text-align:left;margin:0 0 8px;color:var(--head);font-weight:800}
.size-chart th,.size-chart td{padding:12px 8px;border-bottom:1.5px solid var(--line);text-align:left}
.cart-line{display:grid;grid-template-columns:72px 1fr;gap:12px;align-items:center;padding:12px 0;border-bottom:1.5px solid var(--line)}
.cart-line img{width:72px;height:72px;object-fit:contain;border-radius:12px;background:#ECECEE}
.cart-line h2{margin:0 0 4px;font-size:18px}
.qty{width:4.5rem;min-height:44px}
.order{margin:12px 0;padding:14px;border:1.5px solid var(--line);border-radius:14px;background:var(--surface)}
.order h2{margin:0 0 6px;font-size:18px}
.order .actions{margin:8px 0 0}
@media (min-width:721px){
  .shop-main{max-width:960px}
  .shop-grid{grid-template-columns:1fr 1fr}
  .shop-product{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:start}
}
@media (prefers-reduced-motion:reduce){
  .shop-filters a,.shop-grid-card{transition:none}
}
@media print{
  .shop-card-kicker{color:#1E5648}
  .shop-sale-note{color:#1E5648}
}