/* vitrine.css — composants de modules/vitrine.php : bandeau de pub (gabarit .w-actionbox .tile de modules/app_download.php), pneus d'une
   dimension, dimensions de pneus par diamètre, tuiles d'univers. Charte du site public (docs/front-guidelines.md). */
.vt-h2{ margin:0 0 12px; font-family:var(--font-bold); font-weight:normal; font-size:1.35rem; color:var(--color-ink); }
.vt-lien{ font-weight:600; font-size:14px; color:var(--color-primary); text-decoration:none; white-space:nowrap; }
.vt-lien:hover{ text-decoration:underline; }

/* bandeau publicitaire */
.vt-pub{ margin:24px 0; }
.vt-pub-lien{ display:block; color:inherit; text-decoration:none; }
.vt-pub-box.w-actionbox{ display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:150px; padding:26px 36px; border-radius:22px; overflow:hidden; }
.vt-pub-txt{ display:flex; flex-direction:column; gap:8px; }
.vt-pub-intro{ align-self:flex-start; padding:4px 10px; border-radius:8px; background:rgba(255,255,255,.18); font-weight:700; font-size:13px; color:#fff; }
.vt-pub-titre{ font-family:var(--font-bold); font-weight:normal; font-size:clamp(1.3rem, 2.4vw, 2rem); line-height:1.1; color:#fff; }
.vt-pub-img{ max-height:170px; max-width:40%; object-fit:contain; margin:-10px 0; transition:transform .25s; }
.vt-pub-lien:hover .vt-pub-img{ transform:scale(1.05); }
@media (max-width:640px){ .vt-pub-box.w-actionbox{ padding:20px; flex-direction:column; align-items:flex-start; } .vt-pub-img{ max-width:70%; align-self:center; } }

/* pneus d'une dimension */
.vt-pv{ margin:24px 0; }
.vt-pv-tete{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.vt-pv-grille{ display:grid; grid-template-columns:repeat(auto-fill, minmax(190px, 1fr)); gap:12px; }
.vt-pv-carte{ position:relative; display:flex; flex-direction:column; gap:3px; padding:12px 14px 14px; border-radius:14px; background:#fff;
  border:1px solid rgba(15,23,42,.06); color:var(--color-ink); text-decoration:none; transition:border-color .15s, box-shadow .15s, transform .15s; }
.vt-pv-carte:hover{ border-color:rgba(15,23,42,.18); box-shadow:0 6px 18px rgba(15,23,42,.09); transform:translateY(-2px); }
.vt-pv-img{ display:flex; align-items:center; justify-content:center; aspect-ratio:1; margin-bottom:6px; border-radius:10px; background:#f6f7f9; }
.vt-pv-img img{ width:80%; height:80%; object-fit:contain; mix-blend-mode:multiply; }
.vt-pv-saison{ position:absolute; top:12px; left:12px; padding:2px 8px; border-radius:6px; background:#fff; font-size:11px; font-weight:600; color:#475569; box-shadow:0 1px 2px rgba(15,23,42,.08); }
.vt-pv-saison:empty{ display:none; }
.vt-pv-profil{ font-size:13px; color:#64748b; }
.vt-pv-prix{ margin-top:4px; font-family:var(--font-bold); font-size:16px; color:var(--color-primary); }
@media (max-width:640px){ .vt-pv-grille, .tg .vt-pv-mini .vt-pv-grille{ grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px; } .vt-pv-carte{ padding:8px 10px 10px; font-size:14px; } .vt-pv-prix{ font-size:15px; } }

/* dimensions par diamètre */
.vt-dims{ margin:28px 0; }
.vt-dims-grille{ display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:12px; }
.vt-dims-col{ padding:14px 16px; border-radius:14px; background:#fff; border:1px solid rgba(15,23,42,.06); }
.vt-dims-col h3{ display:flex; align-items:baseline; gap:8px; margin:0 0 10px; font-family:var(--font-bold); font-weight:normal; font-size:1.25rem; color:var(--color-ink); }
.vt-dims-col h3 span{ font-family:inherit; font-size:13px; color:#94a3b8; }
.vt-puces{ display:flex; flex-wrap:wrap; gap:6px; }
.vt-puces a{ padding:5px 9px; border-radius:8px; background:#f3f3f5; font-size:13px; font-weight:600; color:var(--color-ink); text-decoration:none; font-variant-numeric:tabular-nums; }
.vt-puces a:hover{ background:var(--color-ink); color:#fff; }
.vt-dims-col details{ margin-top:8px; }
.vt-dims-col summary{ cursor:pointer; font-size:13px; font-weight:600; color:#64748b; margin-bottom:6px; }

/* tuiles d'univers */
.vt-univers{ margin:28px 0 8px; }
.vt-univers-grille{ display:grid; grid-template-columns:repeat(auto-fill, minmax(170px, 1fr)); gap:12px; }
.vt-univers-tuile{ position:relative; display:block; aspect-ratio:16 / 10; border-radius:14px; overflow:hidden; background:#f3f3f5; text-decoration:none; }
.vt-univers-tuile img{ width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.vt-univers-tuile:hover img{ transform:scale(1.06); }
.vt-univers-tuile b{ position:absolute; left:0; right:0; bottom:0; padding:22px 12px 10px; background:linear-gradient(180deg, transparent, rgba(0,0,0,.65));
  font-family:var(--font-bold); font-weight:normal; font-size:15px; color:#fff; }

/* navigation d'une dimension de pneus (rp_pneus_nav_dim) : saisons en stock et équivalences */
.vt-dimnav{ display:flex; flex-wrap:wrap; gap:8px; margin:-24px 0 26px; }
.vt-dimnav-it{ display:inline-flex; align-items:center; gap:7px; padding:8px 14px; border-radius:999px; background:#f3f3f5; color:var(--color-ink); font-weight:600; font-size:14px; text-decoration:none; border:1px solid transparent; transition:border-color .15s, background .15s; }
.vt-dimnav-it i.icon{ margin:0; font-size:.9em; }
.vt-dimnav-it b{ font-weight:700; color:#64748b; }
.vt-dimnav-it:hover{ border-color:rgba(15,23,42,.25); }
.vt-dimnav-it.is-actif{ background:var(--color-ink); color:#fff; }
.vt-dimnav-it.is-actif b{ color:rgba(255,255,255,.75); }
.vt-dimnav-ete i{ color:#d97706; } .vt-dimnav-hiver i{ color:#0284c7; } .vt-dimnav-allseason i{ color:#16a34a; }
.vt-dimnav-it.is-actif i{ color:inherit; }
.vt-dimnav-equiv{ background:#fff; border-color:rgba(15,23,42,.12); }
.vt-dimnav-bas .vt-dimnav{ margin:4px 0 8px; }