/* Vantage RP — Boutique V2 du panel. Prix lisibles, un bouton par pack, le pack recommandé mis en avant. Règles : DESIGN.md. */
.shop { width: 100%; max-width: 72rem; margin: 0 auto; padding: 1.75rem var(--gutter) calc(4rem + env(safe-area-inset-bottom, 0px)); }
.shop-head .h1 { font-size: 2.75rem; }
.shop-sub { margin-top: .5rem; max-width: 38rem; font-size: 1.0625rem; line-height: 1.47; color: var(--text-2); }
.shop-trust { display: inline-flex; align-items: center; gap: .5rem; margin-top: 1rem; padding: .5rem .875rem; border-radius: var(--pill); background: var(--tile); font-size: .875rem; color: var(--text-2); }
.shop-sec { margin-top: 2.75rem; }
.shop-desc { margin-top: .25rem; font-size: .9375rem; color: var(--muted); }

.pk-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin-top: 1rem; }
.pk-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 48rem; }
.pk { display: flex; flex-direction: column; gap: 1rem; padding: 1.5rem; border-radius: 1.375rem; background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01)), var(--tile); box-shadow: inset 0 1px 0 rgba(255,255,255,.06), inset 0 0 0 1px rgba(255,255,255,.05); }
.pk.best { background: radial-gradient(120% 90% at 50% 0%, rgba(139,92,246,.20), transparent 60%), linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.01)), var(--tile); box-shadow: inset 0 1px 0 rgba(255,255,255,.08), inset 0 0 0 1.5px rgba(139,92,246,.55), 0 1.5rem 3rem -1.5rem rgba(139,92,246,.45); }
.pk-top { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.pk-name { font-size: 1.1875rem; font-weight: 600; letter-spacing: -.012em; }
.pk-price b { display: block; font-size: 2.25rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.pk-price span { display: block; margin-top: .125rem; font-size: .875rem; color: var(--muted); }
.pk-feats { flex: 1; display: grid; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.pk-feats li { position: relative; padding-left: 1.5rem; font-size: .9375rem; line-height: 1.45; color: var(--text-2); }
.pk-feats li::before { content: ''; position: absolute; left: .125rem; top: .3125rem; width: .375rem; height: .6875rem; border: solid var(--green); border-width: 0 2px 2px 0; transform: rotate(45deg); }

.shop-call { display: grid; grid-template-columns: 3rem minmax(0, 1fr) auto; align-items: center; gap: 1rem; padding: 1.25rem; border-radius: var(--r-card); background: var(--tile); }
.sc-ico { width: 3rem; height: 3rem; display: grid; place-items: center; border-radius: .875rem; color: #5865F2; background: rgba(88,101,242,.14); }
.sc-ico svg { width: 1.375rem; height: 1.375rem; }
.shop-call b { display: block; font-size: 1.0625rem; font-weight: 600; }
.shop-call b + span { display: block; margin-top: .125rem; font-size: .9375rem; color: var(--muted); }

@media (max-width: 1024px) { .pk-grid { grid-template-columns: minmax(0, 1fr); max-width: 32rem; } .pk-grid.two { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 734px) {
  .shop { padding-top: 1.25rem; }
  .shop-head .h1 { font-size: 2.125rem; }
  .shop-sub { font-size: .9375rem; }
  .pk { padding: 1.25rem; }
  .shop-call { grid-template-columns: 3rem minmax(0, 1fr); }
  .shop-call .btn { grid-column: 1 / -1; }
}
