/* =====================================================================================================================
   Negozio con carrello, in stile Apple Store (21/10/2026). Il titolare: «come un piccolo e-commerce che mettiamo nel
   carrello e poi procediamo al checkout ... la UI shop deve essere in stile Apple ... sistema anche il catalogo con le
   nuove grafiche e migliorando la fruibilità». Catalogo (.shk), borsa e foglio del carrello (.crt).
   Senza questo foglio lo Shop e "Il tuo piano" restano quelli di prima (Static_Pages::store_class).
   ===================================================================================================================== */

/* ---- borsa: sempre in vista, in alto a destra sotto l'intestazione ---------------------------------------------- */
.crt-bag {
  position: fixed; right: max(16px, env(safe-area-inset-right, 0px)); top: var(--crt-top, 92px); z-index: 65;
  display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 16px 0 13px;
  border: 0; border-radius: 999px; cursor: pointer;
  background: rgba(255, 255, 255, 0.9); color: var(--asser-secondary, #4b2338);
  -webkit-backdrop-filter: saturate(180%) blur(18px); backdrop-filter: saturate(180%) blur(18px);
  box-shadow: 0 1px 1px rgba(40, 18, 30, 0.06), 0 10px 30px rgba(40, 18, 30, 0.16), inset 0 0 0 0.5px rgba(40, 18, 30, 0.08);
  font: 700 0.9rem/1 "Manrope", system-ui, sans-serif; letter-spacing: -0.005em;
  transition: transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.3s ease, top 0.25s ease;
  -webkit-tap-highlight-color: transparent;
}
.crt-bag:hover { transform: translateY(-1px); box-shadow: 0 1px 1px rgba(40, 18, 30, 0.06), 0 14px 34px rgba(40, 18, 30, 0.2), inset 0 0 0 0.5px rgba(40, 18, 30, 0.08); }
.crt-bag:focus-visible { outline: 3px solid rgba(180, 95, 134, 0.45); outline-offset: 2px; }
.crt-bag svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linejoin: round; stroke-linecap: round; }
.crt-bag__n {
  min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; display: inline-grid; place-items: center;
  background: var(--asser-primary, #7d445e); color: #fff; font: 800 0.76rem/1 "Manrope", system-ui, sans-serif; font-variant-numeric: tabular-nums;
}
.crt-bag__n[hidden], .crt-toast[hidden], .crt-sheet[hidden] { display: none !important; }
.crt-bag.is-bump { animation: crt-bump 0.5s cubic-bezier(0.2, 0.8, 0.2, 1); }
@keyframes crt-bump { 0% { transform: scale(1); } 35% { transform: scale(1.12); } 100% { transform: scale(1); } }
@media (max-width: 640px) {
  .crt-bag { width: 48px; height: 48px; padding: 0; justify-content: center; }
  .crt-bag__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .crt-bag__n { position: absolute; right: -3px; top: -3px; min-width: 20px; height: 20px; font-size: 0.7rem; box-shadow: 0 0 0 2px #fff; }
}
/* la moneta che vola nella borsa */
.crt-fly {
  position: fixed; z-index: 80; width: 22px; height: 22px; margin: -11px 0 0 -11px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle at 35% 30%, #fff6f9 0%, #f0b9cb 38%, #c27591 100%);
  box-shadow: 0 0 0 1.5px rgba(255, 255, 255, 0.8), 0 6px 14px rgba(90, 31, 62, 0.35);
  transition: transform 0.7s cubic-bezier(0.5, -0.2, 0.3, 1), opacity 0.7s ease;
}

/* ---- foglio del carrello: di lato sul computer, dal basso sul telefono ------------------------------------------ */
.crt-sheet { position: fixed; inset: 0; z-index: 90; }
.crt-sheet[hidden] { display: none; }
.crt-sheet__veil { position: absolute; inset: 0; background: rgba(24, 10, 18, 0.32); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); opacity: 0; transition: opacity 0.35s ease; }
.crt-sheet__panel {
  position: absolute; right: 0; top: 0; bottom: 0; width: min(440px, 100vw);
  display: flex; flex-direction: column; background: #fbfafb; color: var(--asser-text, #252129);
  box-shadow: -20px 0 60px rgba(30, 12, 22, 0.22);
  transform: translateX(104%); transition: transform 0.45s cubic-bezier(0.2, 0.8, 0.2, 1);
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
.crt-sheet.is-open .crt-sheet__veil { opacity: 1; }
.crt-sheet.is-open .crt-sheet__panel { transform: none; }
@media (max-width: 640px) {
  .crt-sheet__panel { left: 0; right: 0; top: auto; width: auto; max-height: 90vh; border-radius: 26px 26px 0 0; transform: translateY(104%); box-shadow: 0 -20px 60px rgba(30, 12, 22, 0.22); }
  .crt-sheet__panel::before { content: ""; display: block; width: 40px; height: 5px; margin: 8px auto 0; border-radius: 999px; background: rgba(40, 18, 30, 0.18); }
}
.crt-sheet__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 22px 22px 12px; }
.crt-sheet__title { margin: 0; color: var(--asser-secondary, #4b2338); font: 800 1.45rem/1.1 "Sora", "Manrope", system-ui, sans-serif; letter-spacing: -0.025em; }
.crt-sheet__x { display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: 50%; background: rgba(40, 18, 30, 0.06); color: var(--asser-secondary, #4b2338); cursor: pointer; }
.crt-sheet__x svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.crt-sheet__x:focus-visible, .crt-pay:focus-visible, .crt-step button:focus-visible, .crt-line__rm:focus-visible { outline: 3px solid rgba(180, 95, 134, 0.45); outline-offset: 2px; }
.crt-sheet__body { flex: 1 1 auto; min-height: 120px; overflow-y: auto; overscroll-behavior: contain; padding: 4px 22px 12px; }
.crt-list { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.crt-line {
  display: grid; grid-template-columns: 104px minmax(0, 1fr) auto; gap: 4px 14px; align-items: center;
  padding: 12px; border-radius: 18px; background: #fff; box-shadow: 0 1px 2px rgba(40, 18, 30, 0.05), inset 0 0 0 0.5px rgba(40, 18, 30, 0.07);
}
.crt-line.is-in { animation: crt-in 0.45s cubic-bezier(0.2, 0.8, 0.2, 1); }
@keyframes crt-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.crt-line__vis { grid-row: 1 / 3; align-self: start; width: 104px; height: auto; border-radius: 10px; box-shadow: 0 8px 16px -8px rgba(40, 12, 28, 0.5), inset 0 0 0 0.5px rgba(255, 255, 255, 0.22); }
.crt-line__vis .shk-vis__txt { left: 9cqi; bottom: 9cqi; }
.crt-line__vis .shk-vis__big { font-size: 15px; }
.crt-line__name { min-width: 0; margin: 0; color: var(--asser-secondary, #4b2338); font: 800 0.98rem/1.2 "Sora", "Manrope", system-ui, sans-serif; letter-spacing: -0.01em; }
.crt-line__sub { grid-column: 2; min-width: 0; margin: 0; color: var(--asser-muted, #726b67); font-size: 0.8rem; line-height: 1.35; }
.crt-line__price { grid-column: 3; grid-row: 1; margin: 0; justify-self: end; color: var(--asser-secondary, #4b2338); font: 800 0.98rem/1 "Sora", "Manrope", system-ui, sans-serif; font-variant-numeric: tabular-nums; white-space: nowrap; }
.crt-line__tools { grid-column: 2 / 4; display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 6px; }
.crt-step { display: inline-flex; align-items: center; height: 34px; border-radius: 999px; background: rgba(125, 68, 94, 0.08); }
.crt-step button { width: 34px; height: 34px; border: 0; border-radius: 50%; background: transparent; color: var(--asser-secondary, #4b2338); font: 700 1.1rem/1 "Manrope", system-ui, sans-serif; cursor: pointer; }
.crt-step button:disabled { opacity: 0.3; cursor: default; }
.crt-step output { min-width: 22px; text-align: center; font: 800 0.92rem/1 "Manrope", system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.crt-line__rm { border: 0; background: none; padding: 4px 2px; color: var(--asser-accent, #b45f86); font: 700 0.82rem/1 "Manrope", system-ui, sans-serif; cursor: pointer; }
.crt-empty { display: grid; justify-items: center; gap: 6px; padding: 34px 10px 10px; text-align: center; }
.crt-empty[hidden] { display: none; }
.crt-empty__title { margin: 0; color: var(--asser-secondary, #4b2338); font: 800 1.15rem/1.2 "Sora", "Manrope", system-ui, sans-serif; }
.crt-empty__text { margin: 0; max-width: 300px; color: var(--asser-muted, #726b67); font-size: 0.9rem; line-height: 1.45; }
.crt-empty__link { margin-top: 6px; color: var(--asser-primary, #7d445e); font-weight: 800; }
.crt-sheet__foot { padding: 14px 22px 20px; border-top: 0.5px solid rgba(40, 18, 30, 0.1); background: rgba(251, 250, 251, 0.94); }
.crt-sheet__foot[hidden] { display: none; }
.crt-sum { display: grid; gap: 6px; margin: 0; }
.crt-sum div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.crt-sum dt { color: var(--asser-muted, #726b67); font-size: 0.9rem; }
.crt-sum dd { margin: 0; color: var(--asser-text, #252129); font-weight: 700; font-variant-numeric: tabular-nums; }
.crt-sum__total dt { color: var(--asser-secondary, #4b2338); font: 800 1.05rem/1 "Sora", "Manrope", system-ui, sans-serif; }
.crt-sum__total dd { color: var(--asser-secondary, #4b2338); font: 800 1.45rem/1 "Sora", "Manrope", system-ui, sans-serif; letter-spacing: -0.02em; }
.crt-sum__note { margin: 6px 0 0; color: var(--asser-muted, #726b67); font-size: 0.78rem; line-height: 1.4; }
.crt-sum__note a { color: var(--asser-primary, #7d445e); font-weight: 700; }
.crt-pay {
  display: flex; align-items: center; justify-content: center; width: 100%; min-height: 52px; margin-top: 14px; padding: 0 20px;
  border: 0; border-radius: 14px; background: var(--asser-primary, #7d445e); color: #fff; text-decoration: none;
  font: 800 1rem/1 "Manrope", system-ui, sans-serif; cursor: pointer; box-shadow: 0 10px 24px rgba(125, 68, 94, 0.28);
  transition: background-color 0.2s ease, transform 0.2s ease;
}
.crt-pay:hover { background: var(--asser-secondary, #4b2338); color: #fff; }
.crt-pay:active { transform: scale(0.985); }
.crt-pay:disabled { opacity: 0.5; cursor: default; }
.crt-warn { margin: 12px 0 0; padding: 10px 12px; border-radius: 12px; background: rgba(180, 95, 134, 0.1); color: var(--asser-secondary, #4b2338); font-size: 0.85rem; line-height: 1.4; }
.crt-safe { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 12px 0 0; color: var(--asser-muted, #726b67); font-size: 0.75rem; line-height: 1.35; text-align: center; }
.crt-safe svg { flex: none; width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; }

/* avviso in basso: "Aggiunto al carrello" */
.crt-toast {
  position: fixed; left: 50%; bottom: calc(22px + env(safe-area-inset-bottom, 0px)); z-index: 95; translate: -50% 0;
  display: inline-flex; align-items: center; gap: 12px; max-width: calc(100vw - 32px); padding: 11px 12px 11px 18px; border-radius: 999px;
  background: rgba(38, 22, 31, 0.92); color: #fff; -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  box-shadow: 0 14px 40px rgba(20, 8, 14, 0.35); font: 700 0.9rem/1.3 "Manrope", system-ui, sans-serif;
  animation: crt-toast 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.crt-toast[hidden] { display: none; }
.crt-toast button { flex: none; padding: 8px 14px; border: 0; border-radius: 999px; background: rgba(255, 255, 255, 0.16); color: #fff; font: 800 0.85rem/1 "Manrope", system-ui, sans-serif; cursor: pointer; }
@keyframes crt-toast { from { opacity: 0; transform: translateY(12px) scale(0.98); } to { opacity: 1; transform: none; } }
@media (max-width: 920px) { .crt-toast { bottom: calc(84px + env(safe-area-inset-bottom, 0px)); } }

/* ---- catalogo ----------------------------------------------------------------------------------------------------- */
.shk { margin: 0 0 2rem; }
.shk__head { display: grid; justify-items: center; gap: 0.5rem; margin: 0 0 1.6rem; text-align: center; }
.shk__head .pw-kicker { margin: 0; }
.shk__title { margin: 0; color: var(--asser-secondary, #4b2338); font: 800 clamp(1.6rem, 3.4vw, 2.5rem)/1.1 "Sora", "Manrope", system-ui, sans-serif; letter-spacing: -0.03em; text-wrap: balance; }
.shk__jump { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 0.4rem; }
.shk__jump a {
  padding: 0.55rem 1rem; border-radius: 999px; background: #fff; color: var(--asser-secondary, #4b2338); text-decoration: none;
  font: 700 0.86rem/1 "Manrope", system-ui, sans-serif; box-shadow: 0 1px 2px rgba(40, 18, 30, 0.05), inset 0 0 0 0.5px rgba(40, 18, 30, 0.1);
  transition: background-color 0.2s ease, color 0.2s ease;
}
.shk__jump a:hover { background: var(--asser-secondary, #4b2338); color: #fff; }
.shk__group { margin: 0 0 2.6rem; scroll-margin-top: 110px; }
.shk__group-head { display: grid; gap: 0.35rem; max-width: 680px; margin: 0 0 1.1rem; scroll-margin-top: 110px; }
.shk__h3 { margin: 0; color: var(--asser-secondary, #4b2338); font: 800 clamp(1.3rem, 2.4vw, 1.75rem)/1.15 "Sora", "Manrope", system-ui, sans-serif; letter-spacing: -0.025em; }
.shk__lead { margin: 0; color: var(--asser-muted, #726b67); font-size: 0.98rem; line-height: 1.5; }
.shk__note { margin: 1rem 0 0; color: var(--asser-muted, #726b67); font-size: 0.86rem; line-height: 1.45; }

.shk-grid { display: grid; gap: 18px; }
.shk-grid--products { grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr)); }
@media (max-width: 640px) {
  /* sul telefono due ricariche per riga, schede compatte */
  .shk-grid--products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .shk-grid--products .shk-card { padding: 8px; border-radius: 20px; }
  .shk-grid--products .shk-card__body { padding: 10px 4px 4px; }
  .shk-grid--products .shk-card__name { font-size: 0.98rem; }
  .shk-grid--products .shk-card__sub, .shk-grid--products .shk-card__tag { font-size: 0.78rem; }
  .shk-grid--products .shk-card__price strong { font-size: 1.3rem; }
  .shk-grid--products .shk-add { min-height: 40px; padding: 0 10px; font-size: 0.82rem; }
  .shk-vis { border-radius: 13px; }
}
.shk-grid--plans { grid-template-columns: repeat(auto-fit, minmax(min(100%, 236px), 1fr)); }
.shk-grid--single { grid-template-columns: minmax(0, 1fr); }

.shk-card {
  position: relative; display: flex; flex-direction: column; min-width: 0; margin: 0; padding: 12px; border-radius: 24px;
  background: #fff; box-shadow: 0 1px 2px rgba(40, 18, 30, 0.04), 0 14px 36px rgba(40, 18, 30, 0.07), inset 0 0 0 0.5px rgba(40, 18, 30, 0.06);
  transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.35s ease; scroll-margin-top: 110px;
}
.shk-card:hover { transform: translateY(-3px); box-shadow: 0 1px 2px rgba(40, 18, 30, 0.04), 0 22px 48px rgba(40, 18, 30, 0.12), inset 0 0 0 0.5px rgba(40, 18, 30, 0.06); }
.shk-card.is-current { box-shadow: 0 0 0 2px var(--asser-primary, #7d445e), 0 14px 36px rgba(40, 18, 30, 0.08); }
.shk-card.is-shw-flash { animation: shk-flash 1.6s ease; }
@keyframes shk-flash { 30% { box-shadow: 0 0 0 4px rgba(224, 120, 159, 0.55), 0 18px 48px rgba(40, 18, 30, 0.12); } }
.shk-card__body { display: flex; flex: 1 1 auto; flex-direction: column; gap: 0.3rem; padding: 14px 8px 6px; }
.shk-card__name { margin: 0; color: var(--asser-secondary, #4b2338); font: 800 1.12rem/1.2 "Sora", "Manrope", system-ui, sans-serif; letter-spacing: -0.015em; }
.shk-card__sub, .shk-card__tag { margin: 0; color: var(--asser-muted, #726b67); font-size: 0.87rem; line-height: 1.4; }
.shk-card__gift, .shk-card__until { margin: 0.1rem 0 0; color: var(--asser-primary, #7d445e); font-size: 0.82rem; font-weight: 700; line-height: 1.35; }
.shk-card__price { margin: 0.5rem 0 0; color: var(--asser-secondary, #4b2338); }
.shk-card__price strong { font: 800 1.6rem/1 "Sora", "Manrope", system-ui, sans-serif; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.shk-card__price span { color: var(--asser-muted, #726b67); font-size: 0.86rem; font-weight: 700; }
.shk-card__price del { color: var(--asser-muted, #726b67); font-size: 0.9rem; }
.shk-card__per { margin: 0; color: var(--asser-muted, #726b67); font-size: 0.78rem; }
.shk-card__cta { display: grid; gap: 8px; margin-top: auto; padding-top: 0.9rem; }
.shk-add {
  display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 44px; margin: 0; padding: 0 16px;
  border: 0; border-radius: 999px; background: var(--asser-primary, #7d445e); color: #fff; text-decoration: none; text-align: center;
  font: 800 0.92rem/1.15 "Manrope", system-ui, sans-serif; cursor: pointer; transition: background-color 0.2s ease, transform 0.2s ease;
}
.shk-add:hover:not(:disabled) { background: var(--asser-secondary, #4b2338); color: #fff; }
.shk-add:active:not(:disabled) { transform: scale(0.98); }
.shk-add:disabled, .shk-add--off { background: rgba(40, 18, 30, 0.06); color: var(--asser-muted, #726b67); cursor: default; }
.shk-add.is-added { background: #2f7a52; }
.shk-in { justify-self: center; color: var(--asser-primary, #7d445e); font-size: 0.8rem; font-weight: 800; }
.shk-in[hidden] { display: none; }
.shk-badges { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 0.15rem; }
.shk-badge { padding: 0.22rem 0.6rem; border-radius: 999px; background: rgba(125, 68, 94, 0.1); color: var(--asser-primary, #7d445e); font-size: 0.68rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.shk-badge--accent { background: var(--asser-primary, #7d445e); color: #fff; }

/* la carta del livello in piccolo */
.shk-vis {
  position: relative; overflow: hidden; container-type: inline-size; aspect-ratio: 1.586 / 1; border-radius: 16px; color: #fff;
  background: radial-gradient(120% 140% at 80% 20%, #8a3d63 0%, #4b2338 45%, #1d0b15 100%);
  box-shadow: 0 14px 26px -14px rgba(40, 12, 28, 0.55), inset 0 0 0 0.5px rgba(255, 255, 255, 0.22);
}
.shk-vis > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 66% 50%; transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); }
.shk-card:hover .shk-vis > img { transform: scale(1.04); }
.shk-vis__veil { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(22, 7, 15, 0.72) 0%, rgba(22, 7, 15, 0.34) 46%, rgba(22, 7, 15, 0) 76%), linear-gradient(0deg, rgba(22, 7, 15, 0.5) 0%, rgba(22, 7, 15, 0) 42%); }
.shk-vis__brand { position: absolute; left: 7cqi; top: 7cqi; display: inline-flex; align-items: center; gap: 2cqi; font: 700 max(9px, 3.6cqi)/1 "Sora", "Manrope", system-ui, sans-serif; letter-spacing: 0.2em; text-transform: uppercase; }
.shk-vis__gem { width: max(16px, 8cqi); height: max(16px, 8cqi); object-fit: contain; filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.35)); }
.shk-vis__txt { position: absolute; left: 7cqi; right: 26cqi; bottom: 7cqi; display: flex; flex-direction: column; gap: 2.2cqi; }
.shk-vis__top { color: rgba(255, 255, 255, 0.76); font: 700 max(8px, 3.4cqi)/1.2 "Manrope", system-ui, sans-serif; letter-spacing: 0.12em; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.shk-vis__big { font: 800 max(16px, 11cqi)/1 "Sora", "Manrope", system-ui, sans-serif; letter-spacing: -0.03em; text-shadow: 0 2px 14px rgba(0, 0, 0, 0.3); white-space: nowrap; }
.shk-vis__big small { margin-left: 0.15em; color: rgba(255, 255, 255, 0.8); font: 800 max(8px, 3.4cqi)/1 "Manrope", system-ui, sans-serif; letter-spacing: 0.08em; text-shadow: none; }
.shk-vis--perla .shk-vis__veil { background: linear-gradient(90deg, rgba(110, 52, 78, 0.66) 0%, rgba(110, 52, 78, 0.3) 46%, rgba(110, 52, 78, 0) 76%), linear-gradient(0deg, rgba(90, 40, 62, 0.5) 0%, rgba(90, 40, 62, 0) 42%); }
.shk-vis--oro { box-shadow: 0 14px 26px -14px rgba(90, 52, 10, 0.55), inset 0 0 0 1px rgba(246, 214, 150, 0.7); }
.shk-vis--oro .shk-vis__big { background: linear-gradient(100deg, #fff4d6 0%, #f3cf86 30%, #fff1c9 52%, #d9a650 78%, #fbe3a6 100%); -webkit-background-clip: text; background-clip: text; color: transparent; text-shadow: none; }
.shk-vis--platino { box-shadow: 0 14px 26px -14px rgba(20, 16, 24, 0.55), inset 0 0 0 1px rgba(232, 232, 240, 0.55); }

/* ---- "I tuoi acquisti" in "Il tuo piano" (21/10/2026) -------------------------------------------------------------- */
.pbuy { margin: 0 0 2rem; padding: clamp(16px, 2.6vw, 26px); border-radius: 26px; background: #fff; box-shadow: 0 1px 2px rgba(40, 18, 30, 0.04), 0 14px 36px rgba(40, 18, 30, 0.07), inset 0 0 0 0.5px rgba(40, 18, 30, 0.06); }
.pbuy__head { display: grid; gap: 0.3rem; margin: 0 0 0.9rem; }
.pbuy__title { margin: 0; color: var(--asser-secondary, #4b2338); font: 800 clamp(1.25rem, 2.2vw, 1.6rem)/1.15 "Sora", "Manrope", system-ui, sans-serif; letter-spacing: -0.025em; }
.pbuy__lead { margin: 0; max-width: 640px; color: var(--asser-muted, #726b67); font-size: 0.9rem; line-height: 1.45; }
.pbuy__list { display: grid; margin: 0; padding: 0; list-style: none; }
.pbuy__row { display: grid; grid-template-columns: 132px minmax(0, 1fr) auto; align-items: center; gap: 4px 18px; padding: 12px 0; border-top: 0.5px solid rgba(40, 18, 30, 0.08); }
.pbuy__list > .pbuy__row:first-child { border-top: 0; }
.pbuy__vis { width: 132px; border-radius: 11px; box-shadow: 0 8px 18px -10px rgba(40, 12, 28, 0.55), inset 0 0 0 0.5px rgba(255, 255, 255, 0.22); }
.pbuy__vis .shk-vis__big { font-size: max(12px, 12cqi); }
.pbuy__text { min-width: 0; }
.pbuy__name { margin: 0; color: var(--asser-secondary, #4b2338); font: 800 1rem/1.2 "Sora", "Manrope", system-ui, sans-serif; letter-spacing: -0.01em; }
.pbuy__what { margin: 0.15rem 0 0; color: var(--asser-muted, #726b67); font-size: 0.82rem; line-height: 1.35; }
.pbuy__state { margin: 0.3rem 0 0; color: #2f7a52; font-size: 0.8rem; font-weight: 800; }
.pbuy__coins { margin: 0; color: var(--asser-secondary, #4b2338); text-align: right; white-space: nowrap; }
.pbuy__coins b { font: 800 1.15rem/1 "Sora", "Manrope", system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.pbuy__coins small { display: block; color: var(--asser-muted, #726b67); font-size: 0.68rem; font-weight: 800; letter-spacing: 0.08em; }
.pbuy__row.is-past .pbuy__vis { filter: grayscale(0.55) opacity(0.72); }
.pbuy__row.is-past .pbuy__state { color: var(--asser-muted, #726b67); }
.pbuy__more summary { display: inline-flex; align-items: center; gap: 6px; margin-top: 0.6rem; color: var(--asser-primary, #7d445e); cursor: pointer; list-style: none; font: 800 0.9rem/1.2 "Manrope", system-ui, sans-serif; }
.pbuy__more summary::-webkit-details-marker { display: none; }
.pbuy__more summary::after { content: "›"; transition: transform 0.25s ease; }
.pbuy__more[open] summary::after { transform: rotate(90deg); }
.pbuy__more .pbuy__list { margin-top: 0.4rem; border-top: 0.5px solid rgba(40, 18, 30, 0.08); }
.shk-vis--staff .shk-vis__veil { background: linear-gradient(90deg, rgba(22, 7, 15, 0.6) 0%, rgba(22, 7, 15, 0.2) 60%, rgba(22, 7, 15, 0) 100%); }
@media (max-width: 640px) {
  .pbuy__row { grid-template-columns: 96px minmax(0, 1fr); gap: 2px 12px; }
  .pbuy__vis { width: 96px; grid-row: 1 / 3; }
  .pbuy__coins { grid-column: 2; text-align: left; }
  .pbuy__coins small { display: inline; margin-left: 0.25em; }
  .pbuy__vis .shk-vis__big small { display: none; }
}

/* ---- Shop: "Quanto costa" e "Come funziona il pagamento" (21/10/2026) ------------------------------------------- */
.shk-info { margin: 0 0 2.6rem; }
.shk-info__head { display: grid; gap: 0.45rem; max-width: 720px; margin: 0 0 1.2rem; }
.shk-info__head .pw-kicker { margin: 0; }
.shk-info__head .shk__title { text-align: left; }
.shk-info__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 16px; }
.shk-info__card { display: grid; align-content: start; gap: 0.35rem; padding: 20px 22px; border-radius: 22px; background: #fff; box-shadow: 0 1px 2px rgba(40, 18, 30, 0.04), 0 14px 36px rgba(40, 18, 30, 0.07), inset 0 0 0 0.5px rgba(40, 18, 30, 0.06); }
.shk-info__name { margin: 0; color: var(--asser-secondary, #4b2338); font: 800 1rem/1.3 "Sora", "Manrope", system-ui, sans-serif; letter-spacing: -0.01em; }
.shk-info__detail { margin: 0; color: var(--asser-muted, #726b67); font-size: 0.88rem; line-height: 1.5; }
.shk-info__coins { margin: 0.5rem 0 0; color: var(--asser-secondary, #4b2338); font-size: 0.82rem; font-weight: 800; letter-spacing: 0.04em; }
.shk-info__coins b { margin-right: 0.2em; font: 800 2rem/1 "Sora", "Manrope", system-ui, sans-serif; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.shk-info__euro { display: grid; gap: 2px; margin: 0.2rem 0 0; color: var(--asser-muted, #726b67); font-size: 0.8rem; font-variant-numeric: tabular-nums; }
.shk-info__list { display: grid; margin: 1.2rem 0 0; padding: 0 20px; border-radius: 22px; background: #fff; list-style: none; box-shadow: 0 1px 2px rgba(40, 18, 30, 0.04), inset 0 0 0 0.5px rgba(40, 18, 30, 0.08); }
.shk-info__list li { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 18px; padding: 14px 0; border-top: 0.5px solid rgba(40, 18, 30, 0.08); font-size: 0.92rem; }
.shk-info__list li:first-child { border-top: 0; }
.shk-info__list li span { color: var(--asser-text, #252129); }
.shk-info__list li b { color: var(--asser-secondary, #4b2338); font-weight: 800; text-align: right; font-variant-numeric: tabular-nums; }
.shk-pay { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 16px; margin: 0 0 16px; padding: 0; list-style: none; counter-reset: none; }
.shk-pay li { position: relative; display: grid; align-content: start; gap: 0.4rem; padding: 22px; border-radius: 22px; background: linear-gradient(160deg, #4b2338 0%, #7d445e 100%); color: #fff; box-shadow: 0 18px 40px -18px rgba(75, 35, 56, 0.6); overflow: hidden; }
.shk-pay li::after { content: ""; position: absolute; inset: 0; background: radial-gradient(80% 90% at 100% 0%, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0) 60%); pointer-events: none; }
.shk-pay__n { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: rgba(255, 255, 255, 0.16); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3); font: 800 0.95rem/1 "Sora", "Manrope", system-ui, sans-serif; }
.shk-pay li b { font: 800 1.08rem/1.25 "Sora", "Manrope", system-ui, sans-serif; letter-spacing: -0.01em; }
.shk-pay li p { margin: 0; color: rgba(255, 255, 255, 0.82); font-size: 0.88rem; line-height: 1.5; }
@media (max-width: 640px) {
  .shk-info__list { padding: 0 16px; }
  .shk-info__list li { display: grid; gap: 2px; }
  .shk-info__list li b { text-align: left; }
}

/* abbonamenti: le caratteristiche principali */
.shk-specs { display: grid; gap: 0.4rem; margin: 0.7rem 0 0; padding: 0; list-style: none; }
.shk-specs li { position: relative; padding-left: 1.55rem; color: var(--asser-text, #252129); font-size: 0.88rem; line-height: 1.4; }
.shk-specs li b { font-weight: 800; font-variant-numeric: tabular-nums; }
.shk-specs li::before {
  content: ""; position: absolute; left: 0; top: 0.16rem; width: 1rem; height: 1rem; border-radius: 50%;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.4l2.6 2.6L12 5.6' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% no-repeat, linear-gradient(135deg, #e0789f, #b0424f);
}
.shk-card--oro {
  background: linear-gradient(#fff, #fff) padding-box, linear-gradient(135deg, #f6dc9c, #c99236 45%, #f3d58f 70%, #a8741f) border-box;
  border: 1.5px solid transparent; box-shadow: 0 18px 44px rgba(150, 100, 30, 0.16);
}
.shk-card--oro .shk-card__name, .shk-card--oro .shk-card__price strong { background: linear-gradient(100deg, #8a5a12 0%, #c99236 45%, #7a4e0e 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.shk-card--oro .shk-specs li::before { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.4l2.6 2.6L12 5.6' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% no-repeat, linear-gradient(135deg, #e7c174, #a8741f); }
.shk-card--oro .shk-add--plan:not(:disabled) { background: linear-gradient(135deg, #f6dc9c 0%, #d9a650 52%, #b9822e 100%); color: #3d2406; box-shadow: 0 10px 24px rgba(150, 100, 30, 0.28); }
.shk-card--oro .shk-badge--accent { background: linear-gradient(135deg, #f6dc9c, #d9a650); color: #3d2406; }

/* relazione singola: scheda larga */
@media (min-width: 760px) {
  .shk-card--wide { display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); align-items: center; gap: 10px; }
  .shk-card--wide .shk-card__body { padding: 10px 18px; }
  .shk-card--wide .shk-card__cta { max-width: 320px; }
}

/* confronto degli abbonamenti */
.shk-cmp { margin-top: 1.2rem; }
.shk-cmp summary {
  display: inline-flex; align-items: center; gap: 6px; padding: 0.4rem 0; color: var(--asser-primary, #7d445e); cursor: pointer; list-style: none;
  font: 800 0.95rem/1.2 "Manrope", system-ui, sans-serif;
}
.shk-cmp summary::-webkit-details-marker { display: none; }
.shk-cmp summary::after { content: "›"; display: inline-block; font-size: 1.2em; line-height: 1; transition: transform 0.25s ease; }
.shk-cmp[open] summary::after { transform: rotate(90deg); }
.shk-cmp__scroll { overflow-x: auto; margin-top: 0.6rem; border-radius: 20px; background: #fff; box-shadow: 0 1px 2px rgba(40, 18, 30, 0.04), inset 0 0 0 0.5px rgba(40, 18, 30, 0.08); -webkit-overflow-scrolling: touch; }
.shk-cmp table { width: 100%; min-width: 620px; border-collapse: collapse; font-size: 0.88rem; font-variant-numeric: tabular-nums; }
.shk-cmp th, .shk-cmp td { padding: 0.8rem 0.9rem; border-bottom: 0.5px solid rgba(40, 18, 30, 0.08); text-align: center; color: var(--asser-text, #252129); }
.shk-cmp thead th { color: var(--asser-secondary, #4b2338); font: 800 0.92rem/1.2 "Sora", "Manrope", system-ui, sans-serif; }
.shk-cmp tbody th { position: sticky; left: 0; z-index: 1; background: #fff; color: var(--asser-muted, #726b67); font-weight: 700; text-align: left; }
.shk-cmp tbody tr:last-child th, .shk-cmp tbody tr:last-child td { border-bottom: 0; }
.shk-cmp .is-oro { background: rgba(246, 214, 150, 0.14); }
.shk-cmp thead .is-oro { color: #8a5a12; }
.shk-yes { color: #2f7a52; font-weight: 800; }
.shk-no { color: var(--asser-muted, #726b67); }

@media (prefers-reduced-motion: reduce) {
  .crt-bag, .crt-sheet__panel, .crt-sheet__veil, .shk-card, .shk-vis > img { transition: none; }
  .crt-bag.is-bump, .crt-line.is-in, .crt-toast, .shk-card.is-shw-flash { animation: none; }
}

/* ---- tema scuro (scritto a mano) ------------------------------------------------------------------------------- */
html[data-asser-theme="dark"] body .crt-bag { background: rgba(40, 32, 36, 0.88); color: #fff; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5), inset 0 0 0 0.5px rgba(255, 255, 255, 0.12); }
html[data-asser-theme="dark"] body .crt-bag__n { box-shadow: 0 0 0 2px #2a2226; }
html[data-asser-theme="dark"] body .crt-sheet__panel { background: #1b1517; color: #efe6ea; }
html[data-asser-theme="dark"] body .crt-sheet__title,
html[data-asser-theme="dark"] body .crt-line__name,
html[data-asser-theme="dark"] body .crt-line__price,
html[data-asser-theme="dark"] body .crt-empty__title,
html[data-asser-theme="dark"] body .crt-sum__total dt,
html[data-asser-theme="dark"] body .crt-sum__total dd,
html[data-asser-theme="dark"] body .crt-sum dd { color: #fff; }
html[data-asser-theme="dark"] body .crt-sheet__x { background: rgba(255, 255, 255, 0.08); color: #fff; }
html[data-asser-theme="dark"] body .crt-line { background: #262022; box-shadow: inset 0 0 0 0.5px rgba(255, 255, 255, 0.08); }
html[data-asser-theme="dark"] body .crt-step { background: rgba(255, 255, 255, 0.08); }
html[data-asser-theme="dark"] body .crt-step button,
html[data-asser-theme="dark"] body .crt-step output { color: #fff; }
html[data-asser-theme="dark"] body .crt-line__sub,
html[data-asser-theme="dark"] body .crt-empty__text,
html[data-asser-theme="dark"] body .crt-sum dt,
html[data-asser-theme="dark"] body .crt-sum__note,
html[data-asser-theme="dark"] body .crt-safe { color: #a89aa1; }
html[data-asser-theme="dark"] body .crt-line__rm,
html[data-asser-theme="dark"] body .crt-empty__link,
html[data-asser-theme="dark"] body .crt-sum__note a { color: #f4b3cb; }
html[data-asser-theme="dark"] body .crt-sheet__foot { background: rgba(27, 21, 23, 0.96); border-top-color: rgba(255, 255, 255, 0.08); }
html[data-asser-theme="dark"] body .crt-warn { background: rgba(244, 179, 203, 0.12); color: #efe6ea; }
html[data-asser-theme="dark"] body .shk__title,
html[data-asser-theme="dark"] body .shk__h3,
html[data-asser-theme="dark"] body .shk-card__name,
html[data-asser-theme="dark"] body .shk-card__price,
html[data-asser-theme="dark"] body .shk-cmp thead th { color: #fff; }
html[data-asser-theme="dark"] body .shk__lead,
html[data-asser-theme="dark"] body .shk__note,
html[data-asser-theme="dark"] body .shk-card__sub,
html[data-asser-theme="dark"] body .shk-card__tag,
html[data-asser-theme="dark"] body .shk-card__per,
html[data-asser-theme="dark"] body .shk-card__price span,
html[data-asser-theme="dark"] body .shk-card__price del,
html[data-asser-theme="dark"] body .shk-cmp tbody th { color: #a89aa1; }
html[data-asser-theme="dark"] body .shk-specs li,
html[data-asser-theme="dark"] body .shk-cmp td { color: #efe6ea; }
html[data-asser-theme="dark"] body .shk__jump a { background: #262022; color: #fff; box-shadow: inset 0 0 0 0.5px rgba(255, 255, 255, 0.1); }
html[data-asser-theme="dark"] body .shk__jump a:hover { background: #fff; color: #1b1517; }
html[data-asser-theme="dark"] body .shk-card { background: #211a1d; box-shadow: 0 14px 36px rgba(0, 0, 0, 0.35), inset 0 0 0 0.5px rgba(255, 255, 255, 0.07); }
html[data-asser-theme="dark"] body .shk-card--oro { background: linear-gradient(#211a1d, #211a1d) padding-box, linear-gradient(135deg, #f6dc9c, #c99236 45%, #f3d58f 70%, #a8741f) border-box; }
html[data-asser-theme="dark"] body .shk-card--oro .shk-card__name,
html[data-asser-theme="dark"] body .shk-card--oro .shk-card__price strong { background-image: linear-gradient(100deg, #fff1c9 0%, #f0c46e 45%, #d9a650 100%); color: transparent; }
html[data-asser-theme="dark"] body .shk-card__gift,
html[data-asser-theme="dark"] body .shk-card__until,
html[data-asser-theme="dark"] body .shk-in,
html[data-asser-theme="dark"] body .shk-cmp summary { color: #f4b3cb; }
html[data-asser-theme="dark"] body .shk-add:disabled,
html[data-asser-theme="dark"] body .shk-add--off { background: rgba(255, 255, 255, 0.07); color: #a89aa1; }
html[data-asser-theme="dark"] body .shk-badge { background: rgba(244, 179, 203, 0.14); color: #f4b3cb; }
html[data-asser-theme="dark"] body .shk-badge--accent { background: #f4b3cb; color: #2a1520; }
html[data-asser-theme="dark"] body .shk-cmp__scroll { background: #211a1d; box-shadow: inset 0 0 0 0.5px rgba(255, 255, 255, 0.08); }
html[data-asser-theme="dark"] body .shk-cmp tbody th { background: #211a1d; }
html[data-asser-theme="dark"] body .shk-cmp th,
html[data-asser-theme="dark"] body .shk-cmp td { border-bottom-color: rgba(255, 255, 255, 0.07); }
html[data-asser-theme="dark"] body .shk-cmp thead .is-oro { color: #f0c46e; }
html[data-asser-theme="dark"] body .shk-yes { color: #7fd6a4; }
html[data-asser-theme="dark"] body .pbuy { background: #211a1d; box-shadow: 0 14px 36px rgba(0, 0, 0, 0.35), inset 0 0 0 0.5px rgba(255, 255, 255, 0.07); }
html[data-asser-theme="dark"] body .pbuy__title,
html[data-asser-theme="dark"] body .pbuy__name,
html[data-asser-theme="dark"] body .pbuy__coins { color: #fff; }
html[data-asser-theme="dark"] body .pbuy__lead,
html[data-asser-theme="dark"] body .pbuy__what,
html[data-asser-theme="dark"] body .pbuy__coins small,
html[data-asser-theme="dark"] body .pbuy__row.is-past .pbuy__state { color: #a89aa1; }
html[data-asser-theme="dark"] body .pbuy__state { color: #7fd6a4; }
html[data-asser-theme="dark"] body .pbuy__row,
html[data-asser-theme="dark"] body .pbuy__more .pbuy__list { border-top-color: rgba(255, 255, 255, 0.08); }
html[data-asser-theme="dark"] body .pbuy__more summary { color: #f4b3cb; }
html[data-asser-theme="dark"] body .shk-info__card,
html[data-asser-theme="dark"] body .shk-info__list { background: #211a1d; box-shadow: 0 14px 36px rgba(0, 0, 0, 0.35), inset 0 0 0 0.5px rgba(255, 255, 255, 0.07); }
html[data-asser-theme="dark"] body .shk-info__name,
html[data-asser-theme="dark"] body .shk-info__coins,
html[data-asser-theme="dark"] body .shk-info__list li b { color: #fff; }
html[data-asser-theme="dark"] body .shk-info__detail,
html[data-asser-theme="dark"] body .shk-info__euro { color: #a89aa1; }
html[data-asser-theme="dark"] body .shk-info__list li span { color: #efe6ea; }
html[data-asser-theme="dark"] body .shk-info__list li { border-top-color: rgba(255, 255, 255, 0.08); }