/* Shared components: product cards, event rows, buttons. Page layouts stay in each page. */
:root{--bg:#fff;--fg:#111;--mute:#8a8a8a;--line:#e3e3e3;--card:#ececec;--dark:#000;--neon:#f2ff3a;--ply:#bd9e65;--alu:#c9cdd1}

.btn{display:inline-block;background:#000;color:var(--neon);font-family:Archivo,sans-serif;font-weight:800;font-size:13px;letter-spacing:.08em;padding:14px 28px;border:0;border-radius:999px;cursor:pointer;margin-top:24px;text-align:center}
.btn:hover{background:#222}
.btn[disabled]{background:#bbb;color:#fff;cursor:not-allowed}
.btn.ghost{background:none;color:var(--fg);border:1px solid var(--fg)}

/* LP card: sleeve with disc peeking out, slides on hover */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:40px 16px}
.lp{display:block}
.sleeve{position:relative;aspect-ratio:1}
.sleeve img{position:relative;z-index:1;width:86%;aspect-ratio:1;object-fit:cover;border-radius:4px;display:block;background:#000;box-shadow:4px 0 12px rgba(0,0,0,.25)}
.sleeve.full img{width:100%}
.disc{position:absolute;top:2%;left:16%;width:82%;aspect-ratio:1;border-radius:50%;transition:transform .5s cubic-bezier(.2,.7,.3,1);
  background:radial-gradient(circle,var(--bg) 0 2.5%,var(--neon) 3% 17%,transparent 17.5%),repeating-radial-gradient(circle,var(--disc) 0 1.5px,color-mix(in srgb,var(--disc) 75%,#fff) 2px 2.5px)}
.disc.cd{background:radial-gradient(circle,var(--bg) 0 7%,#ddd 7.5% 16%,transparent 16.5%),conic-gradient(#e8e8e8,#bfc5cc,#f6f6f6,#aab0b8,#e8e8e8)}
.lp:hover .disc{transform:translateX(10%) rotate(120deg)}
.lp .label{display:block;font:700 12px/1.4 Archivo,sans-serif;letter-spacing:.02em;margin-top:14px}
.lp .meta{display:block;font-size:12px;color:var(--mute);line-height:1.5}
.lp .price{display:block;font-size:13px;font-weight:700;margin-top:4px}
.badge{position:absolute;z-index:2;top:8px;left:8px;font:800 10px/1 Archivo,sans-serif;letter-spacing:.08em;padding:5px 7px;border-radius:3px;background:var(--neon);color:#000}
.badge.signed{background:var(--alu)}
.badge.out{background:#fff;color:var(--mute);text-decoration:line-through}

/* event rows */
.evlist{display:grid;gap:0;border-top:1px solid var(--fg)}
.ev{display:grid;grid-template-columns:96px 1fr auto;grid-template-areas:"img type status" "img title status" "img when status";column-gap:20px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.ev img{grid-area:img;width:96px;height:96px;object-fit:cover;border-radius:4px;background:#000}
.ev-type{grid-area:type;font:800 11px Archivo,sans-serif;letter-spacing:.14em;color:var(--mute);align-self:end}
.ev-title{grid-area:title;font-weight:700;line-height:1.35}
.ev-when{grid-area:when;font-size:13px;color:var(--mute);align-self:start}
.ev-status{grid-area:status;font:800 12px Archivo,sans-serif;letter-spacing:.06em;padding:8px 14px;border-radius:999px;background:#000;color:var(--neon);white-space:nowrap}
.ev-status.soon{background:var(--neon);color:#000}
.ev-status.closed{background:var(--card);color:var(--mute)}
.ev:hover .ev-title{text-decoration:underline}
@media (max-width:640px){
  .ev{grid-template-columns:72px 1fr;grid-template-areas:"img type" "img title" "img when" "img status"}
  .ev img{width:72px;height:72px}
  .ev-status{justify-self:start;margin-top:6px}
  .pgrid{grid-template-columns:repeat(2,1fr)}
}
@media (prefers-reduced-motion:reduce){.disc{transition:none}}
