/* Tennis & Padel: planogramma, panchina lunga, categorie, scheda tecnica, formule. Da design/assets/css/svm.css */

.planogram-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(24px,4vw,56px);align-items:start}
@media (max-width:860px){.planogram-wrap{grid-template-columns:1fr}}
.cabinet{background:#050505;border-radius:18px;padding:18px 18px 22px;border:1px solid var(--hair);box-shadow:inset 0 0 0 6px #151515,0 30px 70px -30px rgba(0,0,0,.8);position:relative}
.cabinet::before{content:"";position:absolute;inset:6px;border-radius:14px;border:2px dashed rgba(255,255,255,.25);pointer-events:none}
.shelf{display:grid;gap:6px;padding:10px 8px 6px;border-bottom:3px solid #2c2c2c;position:relative}
.slot{appearance:none;border:0;background:#121212;border-radius:6px;min-height:58px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;padding:6px 2px;cursor:pointer;color:var(--muted);font-family:var(--f-mono);font-size:.62rem;transition:transform .15s,background .2s;position:relative;overflow:hidden}
.slot::before{content:"";width:62%;border-radius:4px;background:var(--c,#3a3a3a);flex:1;max-height:40px;min-height:18px;transition:filter .2s}
.slot:hover{transform:translateY(-2px)}
.slot.on{background:#262626;color:var(--line)}
.slot.on::before{filter:brightness(1.35);box-shadow:0 0 16px var(--c)}
.slot.dim{opacity:.35}
.cab-foot{margin-top:16px;display:flex;justify-content:space-between;align-items:center;color:var(--muted)}
.cab-foot .pay{width:44px;height:44px;border-radius:50%;border:2px solid #2c2c2c;display:grid;place-items:center;font-size:.55rem}

.legend{display:flex;flex-direction:column;gap:10px}
.legend button{appearance:none;font:inherit;color:inherit;text-align:left;display:grid;grid-template-columns:16px 1fr auto;align-items:center;gap:14px;padding:16px 18px;border-radius:16px;background:var(--court-2);border:1px solid transparent;cursor:pointer;transition:border-color .2s,background .2s}
.legend button:hover{border-color:var(--hair)}
.legend button[aria-pressed="true"]{border-color:var(--c);background:var(--court-3)}
.legend i{width:16px;height:16px;border-radius:4px;background:var(--c)}
.legend b{font-weight:700;display:block}
.legend small{color:var(--muted);display:block;font-size:.85rem}
.legend .mono{color:var(--muted)}

/* panchina lunga */
.bench-grid{display:flex;flex-direction:column;border-top:1px solid var(--hair)}
.pl{display:grid;grid-template-columns:90px 1fr auto;gap:24px;align-items:center;padding-block:26px;border-bottom:1px solid var(--hair);transition:background .25s,padding .25s}
.pl:hover{background:var(--court-2);padding-inline:18px}
.pl .num{font-family:var(--f-display);font-weight:900;font-size:3.4rem;line-height:.8;color:transparent;-webkit-text-stroke:1.5px var(--muted);font-variant-numeric:tabular-nums}
.pl:hover .num{-webkit-text-stroke-color:var(--acc-ink)}
.pl h3{font-size:clamp(1.8rem,3.5vw,2.6rem)}
.pl p{color:var(--muted);margin-top:8px;max-width:58ch}
.pl > div{min-width:0}
@media (max-width:640px){.pl{grid-template-columns:1fr;gap:10px}.pl .chip{justify-self:start}}

.cats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.cat{border-radius:20px;padding:26px;background:var(--court-2);display:flex;flex-direction:column;gap:16px;min-width:0;position:relative;overflow:hidden}
.cat .ico{width:64px;height:64px;border-radius:16px;background:var(--court-3);display:grid;place-items:center}
.cat .ico svg{width:36px;height:36px}
.cat h3{font-size:2rem}
.cat p{color:var(--muted)}
.cat .brands{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto}
.cat.feat{grid-column:span 2;background:var(--clay);color:var(--on-clay)}
.cat.feat p{color:#3a4400}
.cat.feat .ico{background:rgba(0,0,0,.1)}
.cat.feat .chip{border-color:rgba(0,0,0,.3);color:var(--on-clay)}
@media (max-width:860px){.cats{grid-template-columns:1fr}.cat.feat{grid-column:auto}}

.specs{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,56px);align-items:center}
.specs-photo{border-radius:22px;overflow:hidden;border:1px solid var(--hair);aspect-ratio:4/5;max-width:100%}
.specs-photo img{width:100%;height:100%;object-fit:cover}
.spec-table{display:flex;flex-direction:column}
.spec-table div{display:grid;grid-template-columns:150px 1fr;gap:16px;padding-block:16px;border-top:1px solid var(--hair);align-items:baseline}
.spec-table div:last-child{border-bottom:1px solid var(--hair)}
.spec-table dt{margin:0;color:var(--muted)}
.spec-table dd{margin:0;font-family:var(--f-display);font-size:1.7rem;font-weight:800;text-transform:uppercase;line-height:1.05}
@media (max-width:860px){.specs{grid-template-columns:1fr}.spec-table div{grid-template-columns:1fr;gap:4px}}

.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.plan{border:1px solid var(--hair);border-radius:22px;padding:30px;display:flex;flex-direction:column;gap:18px;min-width:0}
.plan.hl{background:var(--line);color:var(--court);border-color:var(--line)}
.plan .mono{color:var(--acc-ink)}
.plan h3{font-size:2.6rem}
.plan p{color:var(--muted)}
.plan.hl p{color:var(--inv-muted)}
.plan ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.plan li{display:flex;gap:10px;align-items:baseline}
.plan li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--clay);flex:none;transform:translateY(-1px)}
.plan .btn{margin-top:auto;justify-content:center}
.plan.hl .btn{border-color:rgba(0,0,0,.25);color:var(--court)}
.plan.hl .btn.primary{color:var(--clay);background:var(--on-clay);border-color:var(--on-clay)}
.plan.hl .mono{color:var(--inv-muted)}
@media (max-width:860px){.plans{grid-template-columns:1fr}}
