/* THE BIKEPACK — gear-only additions.
   Builds on css/site.css (reuses .rcard, .rfilter, .rgrid, .rd-*).
   Linked only on gear.html and review.html. */

/* ---- Rating helpers (shared) ---- */
.rate-hi{--rt:#4E8C6A}   /* 9.0+  */
.rate-mid{--rt:var(--act)} /* 8.5–8.9 */
.rate-lo{--rt:#C2842E}   /* under 8.5 */

/* ---- Gear card: rating pill over media + price-led stats ---- */
.rcard .grate{position:absolute;top:14px;right:14px;z-index:2;display:inline-flex;align-items:baseline;gap:3px;
  font-family:var(--font-display);font-weight:700;color:#fff;background:rgba(20,18,15,.52);backdrop-filter:blur(6px);
  padding:7px 12px;border-radius:var(--r-pill);letter-spacing:.01em;line-height:1}
.rcard .grate .gn{font-size:1.05rem}
.rcard .grate .gd{font-size:.62em;opacity:.7;font-weight:600;letter-spacing:.04em}
.rcard .gverdict{font-family:var(--font-ui);font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--rt,var(--act));display:inline-flex;align-items:center;gap:9px}
.rcard .gverdict:before{content:"";width:3px;height:3px;border-radius:50%;background:var(--hairline-strong)}
.rcard .reb-row{display:flex;align-items:center;flex-wrap:wrap;gap:9px}
.gear-grid-sec .r-gpx{text-transform:uppercase}

/* ---- Detail: verdict panel (score ring + recommendation) ---- */
.gd-verdict{margin:0 0 50px}
.verdict-card{display:flex;align-items:center;gap:34px;background:#fff;border:1px solid var(--hairline);
  border-radius:var(--r-md);padding:34px 36px;box-shadow:var(--shadow-card)}
.score-ring{position:relative;flex-shrink:0;width:118px;height:118px;display:grid;place-items:center}
.score-ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.score-ring .ring-bg{fill:none;stroke:var(--hairline);stroke-width:7}
.score-ring .ring-fg{fill:none;stroke:var(--rt,var(--act));stroke-width:7;stroke-linecap:round;
  transition:stroke-dashoffset 1.1s var(--reveal-ease)}
.score-ring .num{position:relative;font-family:var(--font-display);font-weight:700;font-size:2.5rem;line-height:1;color:var(--ink)}
.score-ring .num .den{font-size:.42em;color:var(--muted);font-weight:600;margin-left:1px}
.verdict-body{min-width:0}
.verdict-body .vlabel{font-family:var(--font-ui);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--rt,var(--act))}
.verdict-body h3{font-family:var(--font-display);font-weight:700;text-transform:uppercase;font-size:1.9rem;line-height:1.02;
  letter-spacing:.01em;color:var(--ink);margin:10px 0 0}
.verdict-body p{font-family:var(--font-serif);font-style:italic;font-size:1.18rem;line-height:1.45;color:var(--ink-soft);margin:10px 0 0}

/* ---- Detail: body prose ---- */
.gd-prose{margin:0 0 50px}
.gd-prose p{font-family:var(--font-serif);font-size:1.18rem;line-height:1.66;color:var(--ink);max-width:720px;margin:0 0 22px}
.gd-prose p:last-child{margin-bottom:0}

/* ---- Detail: spec table ---- */
.gd-specs{margin:0 0 50px}
.spec-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 56px}
.spec-row{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:16px 0;border-bottom:1px solid var(--hairline)}
.spec-row .sk{font-family:var(--font-ui);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);white-space:nowrap;flex-shrink:0}
.spec-row .sv{font-family:var(--font-serif);font-size:1.06rem;color:var(--ink);text-align:right;flex:1;text-wrap:pretty}

/* ---- Detail: pros & cons ---- */
.gd-verdict-list{margin:0 0 50px}
.pc-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.pc-col{background:#fff;border:1px solid var(--hairline);border-radius:var(--r-md);padding:28px 30px}
.pc-col h4{font-family:var(--font-ui);font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  margin:0 0 18px;display:flex;align-items:center;gap:9px}
.pc-col.pros h4{color:#4E8C6A}
.pc-col.cons h4{color:var(--rust)}
.pc-col h4 svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.2}
.pc-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:13px}
.pc-col li{font-family:var(--font-serif);font-size:1.08rem;line-height:1.4;color:var(--ink);
  display:flex;align-items:flex-start;gap:11px}
.pc-col li:before{content:"";flex-shrink:0;width:7px;height:7px;border-radius:50%;margin-top:8px}
.pc-col.pros li:before{background:#4E8C6A}
.pc-col.cons li:before{background:var(--rust)}

/* ---- Detail: CTA buy button uses .btn; price chip beside it ---- */
.gd-cta .gd-price{font-family:var(--font-display);font-weight:700;font-size:1.5rem;color:var(--ink);line-height:1;
  display:inline-flex;align-items:baseline;gap:8px;margin-right:4px}
.gd-cta .gd-price .pl{font-family:var(--font-ui);font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}

@media (max-width:860px){
  .verdict-card{flex-direction:column;align-items:flex-start;gap:24px}
  .spec-grid{grid-template-columns:1fr;gap:0}
  .pc-grid{grid-template-columns:1fr;gap:20px}
}