
:root{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:#171717;background:#f5f5f2;
  --space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;
  --radius-sm:10px;--radius-md:16px;--radius-lg:24px;--radius-pill:999px;
}
*{box-sizing:border-box}
body{margin:0;background:inherit;color:inherit}
button{font:inherit}
.shell{max-width:1240px;margin:0 auto;padding:56px 24px 40px}
.hero{display:flex;justify-content:space-between;gap:32px;align-items:flex-end;margin-bottom:28px}
.eyebrow{font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:600}
h1{font-size:clamp(38px,6vw,72px);line-height:.98;letter-spacing:-.04em;margin:.2em 0}
.lede{font-size:18px;max-width:680px;line-height:1.5;margin:0;opacity:.72}
.summary{min-width:180px;padding:16px 18px;border:1px solid #d8d8d3;border-radius:16px;background:#fff;display:grid;gap:4px}
.summary span,.meta,.status{font-size:14px;opacity:.65}
.collections,.toolbar,.segmented,.actions{display:flex;gap:8px;flex-wrap:wrap}
.collections{margin:20px 0 14px}
.toolbar{align-items:center;justify-content:space-between;margin-bottom:24px}
button{border:1px solid #d1d1cc;background:#fff;border-radius:999px;padding:10px 14px;cursor:pointer}
button:hover{border-color:#888}
button:focus-visible{outline:3px solid currentColor;outline-offset:3px}
.chip.active,.primary{background:#171717;color:#fff;border-color:#171717}
.secondary{background:transparent}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.card{overflow:hidden;background:#fff;border:1px solid #deded8;border-radius:24px}
.media{aspect-ratio:4/3;background:linear-gradient(180deg,#eee,#e5e5df);display:grid;place-items:center}
.media span{font-size:12px;letter-spacing:.16em;opacity:.5}
.card-body{padding:20px}
.card h2{font-size:22px;letter-spacing:-.02em;margin:6px 0 8px}
.price{font-size:26px;font-weight:700;margin:4px 0}
.actions{margin-top:18px}
.trust{margin-top:36px;padding:22px 0;border-top:1px solid #d3d3ce;display:flex;gap:12px;flex-wrap:wrap}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:860px){.hero{display:grid}.summary{max-width:240px}.grid{grid-template-columns:1fr}}
@media(max-width:560px){.shell{padding:32px 16px}.toolbar{align-items:flex-start}.segmented{width:100%}.segmented button{flex:1}.actions button{width:100%}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
