/* ==========================================================================
   Revive v10
   Loaded after every other stylesheet. Covers:
   1. Glowing review stars (site-wide)      4. Product card + home shelf
   2. Reviews page revamp                   5. Products page
   3. Shared bits (chips, buttons, search)  6. FAQ page
   ========================================================================== */

:root {
  --rv10-bg: #06060a;
  --rv10-surface: #0e0e15;
  --rv10-raised: #14141d;
  --rv10-line: rgba(255, 255, 255, .09);
  --rv10-line-strong: rgba(255, 255, 255, .16);
  --rv10-text: #f8f8fc;
  --rv10-muted: #9d9dad;
  --rv10-accent: #a855f7;
  --rv10-accent-soft: rgba(168, 85, 247, .14);
  --rv10-accent-glow: rgba(168, 85, 247, .38);
  --rv10-ok: #22c55e;
  --rv10-bad: #ef4444;
  --rv10-star: #ffd34d;
  --rv10-r: 17px;
}

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* --------------------------------------------------------------------------
   1. Glowing stars  (reviews page, home feedback, rating summary)
   -------------------------------------------------------------------------- */
.revive-rating-track { color: #2d2838; }
.revive-rating-fill {
  color: var(--rv10-star);
  filter:
    drop-shadow(0 0 2px rgba(255, 214, 77, .95))
    drop-shadow(0 0 7px rgba(255, 184, 28, .7))
    drop-shadow(0 0 16px rgba(255, 150, 20, .42));
}
.revive-review-card:hover .revive-rating-fill,
.revive-featured-review .revive-rating-fill {
  filter:
    drop-shadow(0 0 2px rgba(255, 224, 120, 1))
    drop-shadow(0 0 9px rgba(255, 190, 40, .85))
    drop-shadow(0 0 20px rgba(255, 150, 20, .55));
}

/* --------------------------------------------------------------------------
   2. Reviews page
   -------------------------------------------------------------------------- */
.revive-reviews-hero { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 56px; align-items: center; padding-block: 72px 48px; }
.revive-reviews h1 { font-size: clamp(40px, 5.2vw, 68px); line-height: 1; letter-spacing: -.035em; max-width: 11ch; margin-bottom: 24px; }
.revive-reviews .revive-reviews-lead { margin-bottom: 28px; }
.revive-reviews-hero-band { border-bottom: 0; }

.revive-trust-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.revive-trust-list li { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border: 1px solid var(--rv10-line); border-radius: 999px; background: rgba(255, 255, 255, .025); color: #c9c4d6; font-size: 13px; font-weight: 500; }
.revive-trust-list svg { width: 15px; height: 15px; fill: none; stroke: var(--rv10-accent); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.revive-score {
  position: relative; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 32px;
  padding: 32px 36px; margin-bottom: 16px; overflow: hidden;
  border: 1px solid rgba(255, 205, 80, .22); border-radius: 22px;
  background:
    radial-gradient(ellipse 70% 120% at 18% 0%, rgba(255, 190, 40, .13), transparent 62%),
    linear-gradient(180deg, rgba(20, 16, 30, .98), rgba(12, 10, 19, .98));
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .02) inset, 0 24px 80px -30px rgba(255, 170, 30, .28);
}
.revive-score-main { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; min-width: 0; }
.revive-score .revive-metric-number { font-family: var(--ff-heading), ui-sans-serif, system-ui, sans-serif; font-weight: 800; letter-spacing: -.045em; color: #fff; }
.revive-score-number { font-size: clamp(72px, 9vw, 112px); line-height: .9; text-shadow: 0 0 40px rgba(255, 190, 40, .35); }
.revive-score-total { font-size: clamp(36px, 4vw, 52px); line-height: 1; }
.revive-score-stars { line-height: 0; }
.revive-score .revive-rating-stars { width: 170px; height: 34px; margin: 0; }
.revive-score .revive-rating-track, .revive-score .revive-rating-fill > span { width: 170px; height: 34px; }
.revive-score .revive-rating-fill { height: 34px; }
.revive-score .revive-rating-stars svg { width: 34px; height: 34px; min-width: 34px; }
.revive-score-caption { color: var(--rv10-muted); font-size: 13px; line-height: 1.4; }
.revive-score-side { padding-left: 32px; border-left: 1px solid var(--rv10-line); display: flex; flex-direction: column; gap: 8px; }

.revive-featured-review { border-radius: 18px; }
.revive-reviews .revive-featured-review blockquote { font-size: 15px; font-weight: 500; line-height: 1.65; }

.revive-reviews-toolbar { padding-block: 8px 0; }
.revive-reviews-controls { max-width: none; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; padding: 14px; border: 1px solid var(--rv10-line); border-radius: 20px; background: rgba(14, 14, 21, .72); backdrop-filter: blur(10px); }
.revive-reviews-controls[hidden] { display: none; }
.revive-reviews-controls .revive-review-search { flex: 0 1 380px; height: 44px; }
.revive-reviews-controls .revive-product-filters { margin-top: 0; flex: 1 1 320px; }
.revive-reviews .revive-review-chip { font-weight: 600; padding: 7px 14px; }
.revive-reviews .revive-review-chip.is-active { background: var(--rv10-accent); border-color: var(--rv10-accent); color: #fff; box-shadow: 0 0 22px -4px var(--rv10-accent-glow); }

.revive-reviews-content { padding-block: 40px 104px; }
.revive-review-card { padding: 22px; border-radius: 18px; background: linear-gradient(180deg, rgba(20, 20, 29, .9), rgba(14, 14, 21, .9)); }
.revive-review-card:hover { border-color: rgba(255, 205, 80, .28); background: linear-gradient(180deg, rgba(24, 22, 32, .96), rgba(15, 14, 22, .96)); }
.revive-reviews .revive-review-message { font-weight: 500; font-size: 14.5px; line-height: 1.6; color: #dcd7e6; }
.revive-review-card-rating { margin-bottom: 12px; }
.revive-review-product { font-family: inherit; text-transform: none; letter-spacing: 0; font-size: 12px; padding: 3px 10px; border: 1px solid var(--rv10-line); border-radius: 999px; background: rgba(255, 255, 255, .03); color: #b4adc4; }
.revive-review-product + .revive-review-product::before { content: none; }

/* --------------------------------------------------------------------------
   3. Shared: dot, chips, search, buttons, empty state
   -------------------------------------------------------------------------- */
.rv10-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--rv10-ok); box-shadow: 0 0 8px var(--rv10-ok); flex: none; }

.rv10-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 11px 20px; border-radius: 12px; font-size: 14px; font-weight: 700; line-height: 1.2; text-decoration: none; border: 1px solid transparent; cursor: pointer; transition: transform .2s, box-shadow .2s, border-color .2s, background .2s; }
.rv10-btn--primary { color: #fff; background: linear-gradient(115deg, #b872fb, #a855f7 60%, #8f3fe0); box-shadow: 0 10px 30px -12px var(--rv10-accent-glow); }
.rv10-btn--primary:hover { transform: translateY(-2px); box-shadow: 0 14px 34px -10px var(--rv10-accent-glow); }
.rv10-btn--ghost { color: var(--rv10-text); border-color: var(--rv10-line-strong); background: rgba(255, 255, 255, .03); }
.rv10-btn--ghost:hover { border-color: rgba(168, 85, 247, .6); background: var(--rv10-accent-soft); }

.rv10-search { position: relative; display: flex; align-items: center; height: 44px; min-width: 0; border: 1px solid var(--rv10-line); border-radius: 12px; background: rgba(6, 6, 10, .6); transition: border-color .2s, box-shadow .2s; }
.rv10-search:focus-within { border-color: rgba(168, 85, 247, .7); box-shadow: 0 0 0 3px var(--rv10-accent-soft); }
.rv10-search > i { margin-left: 14px; color: var(--rv10-muted); font-size: 13px; }
.rv10-search input { flex: 1; min-width: 0; height: 100%; padding: 0 12px; background: transparent !important; border: 0 !important; outline: none !important; box-shadow: none !important; color: var(--rv10-text); font-size: 14px; }
.rv10-search input::placeholder { color: #7d7d8e; }
.rv10-search kbd { margin-right: 10px; padding: 3px 7px; border: 1px solid var(--rv10-line); border-radius: 6px; color: var(--rv10-muted); font: 600 11px/1 var(--ff-body), sans-serif; }

.rv10-empty { text-align: center; padding: 56px 24px; border: 1px dashed var(--rv10-line-strong); border-radius: var(--rv10-r); background: rgba(14, 14, 21, .6); }
.rv10-empty[hidden] { display: none; }
.rv10-empty > i { font-size: 22px; color: var(--rv10-accent); margin-bottom: 14px; display: block; }
.rv10-empty h2 { font-size: 18px; font-weight: 700; color: var(--rv10-text); margin: 0 0 6px; }
.rv10-empty p { color: var(--rv10-muted); font-size: 14px; margin: 0; }
.rv10-empty button, .rv10-empty a { display: inline-block; margin-top: 18px; padding: 9px 16px; border-radius: 10px; border: 1px solid rgba(168, 85, 247, .4); background: var(--rv10-accent-soft); color: #e6d3ff; font-size: 13px; font-weight: 600; cursor: pointer; text-decoration: none; }

body:has(.rv10-catalog) .sa-breadcrumbs,
body:has(.rv10-faq) .sa-breadcrumbs { display: none !important; }

/* --------------------------------------------------------------------------
   4. Product card + home shelf
   -------------------------------------------------------------------------- */
.rv10-card { position: relative; display: flex; flex-direction: column; min-width: 0; overflow: hidden; color: inherit; text-decoration: none; background: var(--rv10-surface); border: 1px solid var(--rv10-line); border-radius: var(--rv10-r); transition: border-color .25s, box-shadow .25s, transform .25s; }
.rv10-card:hover { border-color: rgba(168, 85, 247, .5); box-shadow: 0 22px 54px -24px var(--rv10-accent-glow); transform: translateY(-3px); }
.rv10-card:focus-visible { outline: 2px solid var(--rv10-accent); outline-offset: 3px; }

.rv10-card-media { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--rv10-raised); margin: 8px 8px 0; border-radius: calc(var(--rv10-r) - 6px); }
.rv10-card-media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s cubic-bezier(.2, .7, .2, 1), filter .3s; }
.rv10-card:hover .rv10-card-media img { transform: scale(1.04); }
.rv10-card.is-out .rv10-card-media img { filter: saturate(.75) brightness(.85); }
.rv10-card-noimg { position: absolute; inset: 0; display: grid; place-items: center; color: var(--rv10-accent); font-size: 26px; }

.rv10-status { --st: #22c55e; position: absolute; top: 10px; left: 10px; display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: var(--st); background: rgba(6, 6, 10, .72); border: 1px solid color-mix(in srgb, var(--st) 45%, transparent); backdrop-filter: blur(8px); }
.rv10-status-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--st); box-shadow: 0 0 8px var(--st); }

.rv10-card-body { display: flex; flex-direction: column; gap: 10px; padding: 14px 16px 16px; flex: 1; }
.rv10-card-meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.rv10-type { padding: 3px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 600; color: #d3c4ea; background: var(--rv10-accent-soft); border: 1px solid rgba(168, 85, 247, .28); }
.rv10-type--external { color: #ffd2b0; background: rgba(251, 146, 60, .12); border-color: rgba(251, 146, 60, .3); }
.rv10-type--utility { color: #a8ecf5; background: rgba(34, 211, 238, .1); border-color: rgba(34, 211, 238, .28); }
.rv10-type--accounts { color: #b9dcff; background: rgba(96, 165, 250, .12); border-color: rgba(96, 165, 250, .3); }
.rv10-type--other { color: #c9c9d6; background: rgba(255, 255, 255, .05); border-color: var(--rv10-line); }
.rv10-stock { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 500; color: var(--rv10-ok); }
.rv10-stock.is-out { color: var(--rv10-bad); }
.rv10-stock.is-out .rv10-dot { background: var(--rv10-bad); box-shadow: 0 0 8px var(--rv10-bad); }

.rv10-card-title { margin: 0; font-size: 17px; font-weight: 700; letter-spacing: -.015em; color: var(--rv10-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rv10-card-foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 4px; }
.rv10-price { display: flex; align-items: baseline; gap: 6px; font-size: 19px; font-weight: 800; letter-spacing: -.02em; color: #c78bff; }
.rv10-price small { font-size: 12px; font-weight: 500; letter-spacing: 0; color: var(--rv10-muted); }
.rv10-go { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--rv10-line-strong); color: var(--rv10-text); font-size: 12px; transition: background .2s, border-color .2s, transform .2s; }
.rv10-card:hover .rv10-go { background: var(--rv10-accent); border-color: var(--rv10-accent); transform: translateX(2px); }

/* Home shelf: every product, lower part cut off by a fade */
.rv10-shelf { --rv10-cols: 3; position: relative; }
.rv10-shelf-grid { display: grid; grid-template-columns: repeat(var(--rv10-cols), minmax(0, 1fr)); gap: 20px; }
.rv10-shelf.is-clipped .rv10-shelf-grid {
  max-height: var(--rv10-clip, 30rem); overflow: hidden;
  -webkit-mask-image: linear-gradient(#000 0, #000 calc(var(--rv10-clip, 30rem) - 190px), transparent 100%);
  mask-image: linear-gradient(#000 0, #000 calc(var(--rv10-clip, 30rem) - 190px), transparent 100%);
}
.rv10-shelf.is-clipped .rv10-card { pointer-events: none; }
.rv10-shelf.is-clipped .rv10-card.is-visible-row { pointer-events: auto; }
.rv10-shelf-foot { position: relative; z-index: 2; display: flex; justify-content: center; margin-top: 32px; }
.rv10-shelf.is-clipped .rv10-shelf-foot { margin-top: -26px; }

/* --------------------------------------------------------------------------
   5. Products page
   -------------------------------------------------------------------------- */
body:has(.rv10-catalog) { background: radial-gradient(ellipse 60% 420px at 78% 0, rgba(103, 36, 161, .16), transparent 70%), var(--rv10-bg); }
.rv10-catalog.py-section { padding-top: 56px; padding-bottom: 96px; }
.rv10-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 20px 40px; margin-bottom: 32px; }
.rv10-head h1 { margin: 0; font-size: clamp(36px, 5vw, 56px); font-weight: 800; line-height: 1; letter-spacing: -.035em; color: var(--rv10-text); }
.rv10-head p { margin: 12px 0 0; color: var(--rv10-muted); font-size: 16px; max-width: 52ch; }
.rv10-live { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 !important; }
.rv10-live > span { display: inline-flex; align-items: center; gap: 7px; padding: 7px 14px; border: 1px solid var(--rv10-line); border-radius: 999px; background: rgba(255, 255, 255, .03); color: var(--rv10-muted); font-size: 13px; }
.rv10-live b { color: var(--rv10-text); font-weight: 700; }

.rv10-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; padding: 12px; margin-bottom: 24px; border: 1px solid var(--rv10-line); border-radius: 20px; background: rgba(14, 14, 21, .72); backdrop-filter: blur(10px); }
.rv10-chips { display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; }
.rv10-chip { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--rv10-line); background: rgba(255, 255, 255, .025); color: #bdb8cb; font-size: 14px; font-weight: 600; cursor: pointer; transition: color .2s, background .2s, border-color .2s, box-shadow .2s; }
.rv10-chip i { font-style: normal; min-width: 22px; padding: 1px 7px; border-radius: 999px; background: rgba(255, 255, 255, .07); color: #d8d3e4; font-size: 12px; text-align: center; }
.rv10-chip:hover { color: #fff; border-color: rgba(168, 85, 247, .5); }
.rv10-chip.is-active { color: #fff; background: var(--rv10-accent); border-color: var(--rv10-accent); box-shadow: 0 0 24px -4px var(--rv10-accent-glow); }
.rv10-chip.is-active i { background: rgba(255, 255, 255, .22); color: #fff; }
.rv10-chip:focus-visible, .rv10-toggle:focus-visible, .rv10-sort select:focus-visible { outline: 2px solid var(--rv10-accent); outline-offset: 2px; }

.rv10-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.rv10-tools .rv10-search { width: 220px; }
.rv10-toggle { display: inline-flex; align-items: center; gap: 10px; height: 44px; padding: 0 14px; border: 1px solid var(--rv10-line); border-radius: 12px; background: rgba(6, 6, 10, .6); color: #cfcadb; font-size: 14px; font-weight: 600; cursor: pointer; }
.rv10-switch { position: relative; width: 32px; height: 18px; border-radius: 999px; background: #2d2838; transition: background .2s; flex: none; }
.rv10-switch::after { content: ""; position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff; transition: transform .2s; }
.rv10-toggle[aria-pressed="true"] { border-color: rgba(168, 85, 247, .6); color: #fff; }
.rv10-toggle[aria-pressed="true"] .rv10-switch { background: var(--rv10-accent); }
.rv10-toggle[aria-pressed="true"] .rv10-switch::after { transform: translateX(14px); }
.rv10-sort select { height: 44px; padding: 0 34px 0 14px; border: 1px solid var(--rv10-line); border-radius: 12px; background: rgba(6, 6, 10, .6) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239d9dad' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center; color: #cfcadb; font-size: 14px; font-weight: 600; appearance: none; -webkit-appearance: none; cursor: pointer; }
.rv10-sort select option { background: #14141d; color: #f8f8fc; }

.rv10-cats { display: flex; flex-wrap: wrap; gap: 8px; margin: -8px 0 24px; }
.rv10-cats a { padding: 6px 13px; border: 1px solid var(--rv10-line); border-radius: 999px; font-size: 13px; color: var(--rv10-muted); text-decoration: none; }
.rv10-cats a:hover, .rv10-cats a.is-active { color: #fff; border-color: rgba(168, 85, 247, .55); background: var(--rv10-accent-soft); }

.rv10-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.rv10-grid > [hidden] { display: none !important; }
.rv10-pagination { margin-top: 40px; }

.rv10-help { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 32px; margin-top: 72px; padding: 28px 32px; border: 1px solid var(--rv10-line); border-radius: 22px; background: radial-gradient(ellipse 60% 140% at 0 0, rgba(168, 85, 247, .14), transparent 60%), var(--rv10-surface); }
.rv10-help h2 { margin: 0 0 4px; font-size: 21px; font-weight: 800; letter-spacing: -.02em; color: var(--rv10-text); }
.rv10-help p { margin: 0; color: var(--rv10-muted); font-size: 15px; }
.rv10-help-actions { display: flex; flex-wrap: wrap; gap: 10px; }

/* --------------------------------------------------------------------------
   6. FAQ page
   -------------------------------------------------------------------------- */
body:has(.rv10-faq) { background: radial-gradient(ellipse 55% 460px at 12% 0, rgba(103, 36, 161, .17), transparent 70%), var(--rv10-bg); }
.rv10-faq.py-section { padding-top: 64px; padding-bottom: 104px; }
.rv10-faq-grid { display: grid; grid-template-columns: minmax(0, 380px) minmax(0, 1fr); gap: 64px; align-items: start; }
.rv10-faq-side { position: sticky; top: 112px; display: flex; flex-direction: column; gap: 22px; }
.rv10-faq-side h1 { margin: 0; font-size: clamp(36px, 4.4vw, 54px); font-weight: 800; line-height: 1; letter-spacing: -.035em; color: var(--rv10-text); text-wrap: balance; }
.rv10-faq-sub { margin: -6px 0 0; color: var(--rv10-muted); font-size: 16px; line-height: 1.6; max-width: 34ch; }
.rv10-faq-help { padding: 22px; border: 1px solid var(--rv10-line); border-radius: 20px; background: radial-gradient(ellipse 90% 120% at 0 0, rgba(168, 85, 247, .16), transparent 65%), var(--rv10-surface); }
.rv10-faq-help h2 { margin: 0 0 6px; font-size: 18px; font-weight: 800; color: var(--rv10-text); }
.rv10-faq-help p { margin: 0 0 16px; color: var(--rv10-muted); font-size: 14px; line-height: 1.55; }

.rv10-faq-count { margin: 0 0 14px; color: var(--rv10-muted); font-size: 13px; }
.rv10-faq-count b { color: var(--rv10-text); }
.rv10-faq-list { display: flex; flex-direction: column; gap: 10px; }
.rv10-q { border: 1px solid var(--rv10-line); border-radius: 16px; background: var(--rv10-surface); overflow: hidden; transition: border-color .25s, box-shadow .25s, background .25s; }
.rv10-q[hidden] { display: none; }
.rv10-q:hover { border-color: var(--rv10-line-strong); }
.rv10-q.is-open { border-color: rgba(168, 85, 247, .5); background: linear-gradient(180deg, rgba(26, 18, 40, .9), var(--rv10-surface)); box-shadow: 0 18px 48px -26px var(--rv10-accent-glow); }
.rv10-q-btn { display: flex; align-items: center; justify-content: space-between; gap: 18px; width: 100%; padding: 20px 22px; background: transparent; border: 0; text-align: left; cursor: pointer; color: var(--rv10-text); font-size: 16.5px; font-weight: 600; line-height: 1.35; letter-spacing: -.01em; }
.rv10-q-btn:focus-visible { outline: 2px solid var(--rv10-accent); outline-offset: -4px; border-radius: 16px; }
.rv10-q-icon { position: relative; flex: none; width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--rv10-line-strong); transition: background .25s, border-color .25s, transform .3s; }
.rv10-q-icon::before, .rv10-q-icon::after { content: ""; position: absolute; top: 50%; left: 50%; width: 11px; height: 2px; margin: -1px 0 0 -5.5px; border-radius: 2px; background: currentColor; transition: transform .3s; }
.rv10-q-icon::after { transform: rotate(90deg); }
.rv10-q.is-open .rv10-q-icon { background: var(--rv10-accent); border-color: var(--rv10-accent); transform: rotate(180deg); }
.rv10-q.is-open .rv10-q-icon::after { transform: rotate(0); }
.rv10-q-panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .3s ease; }
.rv10-q.is-open .rv10-q-panel { grid-template-rows: 1fr; }
.rv10-q-inner { overflow: hidden; }
.rv10-q-inner p { margin: 0; padding: 0 22px 22px; max-width: 64ch; color: #b9b5c7; font-size: 15px; line-height: 1.7; white-space: pre-line; }
.rv10-faq-empty { margin-top: 12px; }

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 1279px) {
  .rv10-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1023px) {
  .rv10-shelf { --rv10-cols: 2 !important; }
  .rv10-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .revive-reviews-hero { grid-template-columns: 1fr; gap: 36px; padding-block: 48px 32px; }
  .revive-reviews h1 { max-width: none; }
  .rv10-faq-grid { grid-template-columns: 1fr; gap: 36px; }
  .rv10-faq-side { position: static; }
  .rv10-tools { width: 100%; }
  .rv10-tools .rv10-search { flex: 1 1 220px; width: auto; }
}
@media (max-width: 639px) {
  .rv10-shelf { --rv10-cols: 1 !important; }
  .rv10-shelf-grid, .rv10-grid { gap: 16px; }
  .rv10-grid { grid-template-columns: 1fr; }
  .rv10-chips { flex-wrap: nowrap; overflow-x: auto; margin-inline: -4px; padding: 2px 4px 6px; scrollbar-width: none; }
  .rv10-chips::-webkit-scrollbar { display: none; }
  .rv10-chip { flex: none; }
  .rv10-bar { padding: 10px; }
  .rv10-tools { display: grid; grid-template-columns: 1fr 1fr; }
  .rv10-tools .rv10-search { grid-column: 1 / -1; width: auto; }
  .rv10-tools .rv10-search kbd { display: none; }
  .rv10-toggle, .rv10-sort select { width: 100%; }
  .revive-score { grid-template-columns: 1fr; gap: 24px; padding: 24px; }
  .revive-score-side { padding: 20px 0 0; border-left: 0; border-top: 1px solid var(--rv10-line); flex-direction: row; align-items: baseline; gap: 12px; }
  .revive-score .revive-rating-stars { width: 150px; height: 30px; }
  .revive-score .revive-rating-track, .revive-score .revive-rating-fill > span { width: 150px; height: 30px; }
  .revive-score .revive-rating-fill { height: 30px; }
  .revive-score .revive-rating-stars svg { width: 30px; height: 30px; min-width: 30px; }
  .rv10-q-btn { padding: 17px 16px; font-size: 15.5px; }
  .rv10-q-inner p { padding: 0 16px 18px; }
  .rv10-help { padding: 22px 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .rv10-card, .rv10-card-media img, .rv10-go, .rv10-q, .rv10-q-panel, .rv10-q-icon, .rv10-q-icon::before, .rv10-q-icon::after, .rv10-btn { transition: none !important; }
  .rv10-card:hover, .rv10-btn--primary:hover { transform: none; }
}

/* ==========================================================================
   7. Colour-matched cards (v10.1)
   Each card reads its own colour from the product art (revive-v10.js sets
   --tint). Hover outline, glow, surface tint and the page glow all use it.
   ========================================================================== */
@property --tint { syntax: "<color>"; inherits: true; initial-value: #a855f7; }

.rv10-card {
  --tint: #a855f7;
  --mx: 50%; --my: 0%;
  background: linear-gradient(180deg, color-mix(in srgb, var(--tint) 17%, var(--rv10-surface)) 0, var(--rv10-surface) 68%);
  border-color: color-mix(in srgb, var(--tint) 22%, rgba(255, 255, 255, .07));
  transition: border-color .25s, box-shadow .25s, transform .25s ease-out, --tint .3s;
  transform-style: preserve-3d;
}
.rv10-card::after { /* cursor sheen */
  content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: inherit; opacity: 0; transition: opacity .3s;
  background: radial-gradient(260px circle at var(--mx) var(--my), color-mix(in srgb, var(--tint) 30%, transparent), transparent 70%);
}
.rv10-card:hover {
  border-color: var(--tint);
  box-shadow: 0 0 0 1px var(--tint), 0 0 34px -6px color-mix(in srgb, var(--tint) 65%, transparent), 0 26px 60px -26px var(--tint);
}
.rv10-card:hover::after { opacity: 1; }
.rv10-card:focus-visible { outline: 2px solid var(--tint); }
.rv10-card:hover .rv10-go { background: var(--tint); border-color: var(--tint); color: #0a0a10; }
.rv10-card:hover .rv10-price { color: color-mix(in srgb, var(--tint) 70%, #fff); }
.rv10-card-media, .rv10-card-body { position: relative; z-index: 1; }
.rv10-card-media { box-shadow: 0 10px 30px -14px color-mix(in srgb, var(--tint) 70%, transparent); }

.rv10-dot--soon { background: #a3a3b5; box-shadow: none; }
.rv10-stock.is-soon { color: #a3a3b5; }
.rv10-soon { font-size: 15px; font-weight: 700; letter-spacing: -.01em; color: #c9c9d6; }
.rv10-card.is-soon .rv10-card-media img { filter: saturate(.9) brightness(.9); }
.rv10-cta { display: none; }

/* --- Products page ------------------------------------------------------ */
.rv10-catalog { position: relative; isolation: isolate; --tint: #a855f7; transition: --tint .45s; }
.rv10-catalog::before { /* page glow follows the hovered product's colour */
  content: ""; position: absolute; z-index: -1; inset: -120px 0 auto; height: 760px; pointer-events: none;
  background: radial-gradient(ellipse 55% 100% at 50% 0, color-mix(in srgb, var(--tint) 26%, transparent), transparent 72%);
}
.rv10-catalog .wrap { max-width: min(1240px, calc(100% - 48px)) !important; }

.rv10-head { display: block; margin-bottom: 36px; }
.rv10-head h1 { font-size: clamp(44px, 7vw, 84px); line-height: .95; letter-spacing: -.045em; }
.rv10-head p { font-size: 17px; margin-top: 16px; }
.rv10-live { margin-top: 24px !important; }

.rv10-bar { position: sticky; top: 12px; z-index: 20; box-shadow: 0 18px 40px -24px rgba(0, 0, 0, .9); }
.rv10-tools .rv10-search { flex: 1 1 200px; width: auto; min-width: 190px; }

.rv10-catalog .rv10-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-flow: dense; gap: 22px; }
.rv10-catalog .rv10-card-title { font-size: 18px; }

/* Feature slot: the first in-stock product (set by JS when no filters are active) */
.rv10-catalog .rv10-card.is-feature { grid-column: span 2; grid-row: span 2; }
.rv10-catalog .rv10-card.is-feature .rv10-card-media { aspect-ratio: auto; flex: 1; min-height: 260px; }
.rv10-catalog .rv10-card.is-feature .rv10-card-media img { position: absolute; inset: 0; }
.rv10-catalog .rv10-card.is-feature .rv10-card-body { gap: 14px; padding: 20px 22px 22px; }
.rv10-catalog .rv10-card.is-feature .rv10-card-title { font-size: clamp(26px, 3vw, 38px); letter-spacing: -.03em; }
.rv10-catalog .rv10-card.is-feature .rv10-price { font-size: 26px; }
.rv10-catalog .rv10-card.is-feature .rv10-go { display: none; }
.rv10-catalog .rv10-card.is-feature .rv10-cta {
  display: inline-flex; align-items: center; padding: 12px 22px; border-radius: 12px; font-size: 14px; font-weight: 800;
  color: #0a0a10; background: color-mix(in srgb, var(--tint) 85%, #fff); box-shadow: 0 10px 30px -10px var(--tint);
}
.rv10-catalog .rv10-card.is-feature .rv10-card-media::after {
  content: "Featured"; position: absolute; top: 10px; right: 10px; padding: 4px 11px; border-radius: 999px;
  font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: #0a0a10; background: color-mix(in srgb, var(--tint) 85%, #fff);
}

@media (max-width: 1279px) { .rv10-catalog .rv10-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1023px) {
  .rv10-catalog .rv10-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rv10-catalog .rv10-card.is-feature { grid-row: auto; }
  .rv10-catalog .rv10-card.is-feature .rv10-card-media { aspect-ratio: 16 / 9; min-height: 0; flex: none; }
}
@media (max-width: 639px) {
  .rv10-catalog .rv10-grid { grid-template-columns: 1fr; }
  .rv10-catalog .rv10-card.is-feature { grid-column: auto; }
  .rv10-bar { position: static; }
}
@media (prefers-reduced-motion: reduce), (hover: none) {
  .rv10-card { transform: none !important; }
}

/* Fixes + gap-filling help tile */
.rv10-catalog .rv10-card.is-feature .rv10-card-body { flex: none; }
.rv10-tools { flex: 1 1 auto; justify-content: flex-end; }
.rv10-grid > .rv10-tile { grid-column: 1 / -1; margin: 0; min-width: 0; }
.rv10-grid > .rv10-tile[hidden] { display: none; }
.rv10-tile.is-narrow { flex-direction: column; align-items: flex-start; justify-content: center; gap: 18px; padding: 26px; }
.rv10-tile.is-narrow h2 { font-size: 20px; }
@media (max-width: 1023px) { .rv10-grid > .rv10-tile { grid-column: 1 / -1 !important; } }

/* v10.2: no type pills, no featured slot */
.rv10-card-meta { justify-content: flex-end; }
.rv10-type { display: none !important; }
.rv10-catalog .rv10-card.is-feature { grid-column: auto !important; grid-row: auto !important; }
.rv10-catalog .rv10-card.is-feature .rv10-card-media::after { content: none !important; }
