/* ==========================================================================================================
   pages-g3.css: page-level rules for /buy-refurbished/, /live/, /gaming/ and /warranty/ only (g3 builder, 2026-09-29).
   Built on the shared builder kit in site.css (section, split, card, steps, answer, link-arrow, door2, proof-list).
   Lime / black / white only: surfaces are paper, --floor (lime tint) or --ink. No new hex greys.
   ========================================================================================================== */

/* ---------- shared bits across the four pages ---------- */
.g3-ticks { display: grid; gap: 6px; margin: 6px 0 0; padding: 0; list-style: none; }
.g3-ticks li { position: relative; padding-left: 22px; line-height: 1.45; color: var(--text-2); }
.g3-ticks li::before { content: ""; position: absolute; left: 2px; top: 0.55em; width: 8px; height: 8px; border-radius: 50%; background: var(--lime); }
.section--ink .g3-ticks li, .card--ink .g3-ticks li { color: var(--on-ink-2); }

.g3-quote { margin: 0; }
.g3-quote blockquote p { font-weight: 500; font-size: clamp(1.25rem, 1.05rem + 0.7vw, 1.625rem); line-height: 1.35; letter-spacing: -0.01em; }
.g3-quote figcaption { margin-top: var(--s4); font-size: var(--fs-small); font-weight: 700; letter-spacing: 0.02em; }
.g3-quote figcaption::before { content: ""; display: inline-block; width: 24px; height: 2px; margin-right: 10px; vertical-align: middle; background: var(--lime); }

/* ---------- inner hero, tightened so the three doors show on a laptop's first screen ---------- */
.g3-hero__sub { color: var(--text-2); max-width: 36rem; }
/* The hero IS the three ways to buy: H1 + sub, then the door row inside the same section, so all three doors, hooks
   and buttons sit in the first screen at 1280x800 and 1366x768 (tom-research NB-Q6, grader g3 r1 C5). */
.hero--inner.g3-hero { padding-bottom: var(--section-y); }
.g3-ways { margin-top: var(--s8); }
.g3-hero__foot { margin-top: var(--s5); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 var(--s8); }
.g3-hero__foot .g3-also { margin-top: 0; }
.g3-hero__call { color: var(--text-2); }
.g3-hero__call a { display: inline-flex; min-height: 44px; align-items: center; font-weight: 700; color: var(--ink); text-decoration: underline; text-decoration-color: var(--lime); text-decoration-thickness: 2px; text-underline-offset: 0.25em; }
/* phones: the three doors matter more than a second shelf photo (the band below carries the testing photo) */
@media (max-width: 63.99rem) { .g3-hero__photo { display: none; } }
@media (min-width: 64rem) {
  .hero--inner.g3-hero { padding-top: 28px; }
  .hero--inner.g3-hero .hero__grid { grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); column-gap: clamp(40px, 5vw, 80px); align-items: center; }
  .hero--inner.g3-hero .hero__photo img { aspect-ratio: 4 / 3; max-height: 15rem; width: 100%; object-fit: cover; }
  .g3-hero__h1 { font-size: clamp(2.25rem, 1.35rem + 1.9vw, 3.25rem); line-height: 1.06; text-wrap: balance; }
  .g3-ways { margin-top: var(--s6); }
  .g3-door .door2__body { padding: 22px 24px 24px; }
  .g3-door .door2__hook { margin-top: 12px; }
  .g3-door .door2__desc { margin-bottom: 16px; }
}

/* ---------- /buy-refurbished/: three doors ---------- */
.g3-doors { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; margin: 0; padding: 0; list-style: none; }
@media (min-width: 64rem) { .g3-doors { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; } }
.g3-door .door2__label { font-size: 1rem; }
.g3-door--lead { box-shadow: 0 1px 2px rgb(18 19 17 / 0.06), 0 12px 32px -14px rgb(18 19 17 / 0.28), inset 0 0 0 2px var(--lime); }
.g3-also { margin-top: var(--s5); display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--s5); font-size: 0.9375rem; }
.g3-also span { display: inline-flex; min-height: 44px; align-items: center; color: var(--text-2); margin-right: var(--s1); }
.g3-also a { display: inline-flex; min-height: 44px; align-items: center; font-weight: 600; text-decoration: underline; text-decoration-color: var(--lime); text-decoration-thickness: 2px; text-underline-offset: 0.25em; }
.g3-also a:hover { text-decoration-color: currentColor; }
.g3-nowrap { white-space: nowrap; }
/* below desktop the label takes its own line, so the four links wrap as one group instead of stranding the last one */
@media (max-width: 63.99rem) { .g3-also span { flex-basis: 100%; min-height: 0; margin: 0 0 var(--s1); } }

/* ---------- /buy-refurbished/: what comes with a bulk order (ink band) ---------- */
.g3-band__top { display: grid; gap: var(--s8); align-items: center; }
.g3-band__head { display: grid; gap: var(--s5); justify-items: start; }
.g3-band .answer { color: var(--on-ink-2); }
.g3-band__cta { margin-top: var(--s2); }
.g3-band__photo { margin: 0; border-radius: 24px; overflow: hidden; background: var(--ink-3); }
.g3-band__photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: 50% 60%; }
.g3-specs { margin-top: var(--s10); }
@media (min-width: 64rem) {
  .g3-band__top { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: var(--s16); }
  .g3-band__photo img { aspect-ratio: 5 / 4; }
  .g3-specs { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s5); }
  .g3-specs .gc-specs__row { padding: var(--s6); border-radius: 28px; }
}
.g3-specs dd a { color: var(--on-dark); }
.g3-scale { display: grid; gap: var(--s8); margin-top: var(--s10); padding-top: var(--s10); border-top: 1px solid var(--hairline-dark); }
.g3-scale__line { font-size: var(--fs-lead); line-height: 1.5; color: var(--on-ink-2); max-width: 34rem; }
.g3-scale__line strong { display: block; margin-bottom: var(--s3); font-size: var(--fs-h2); line-height: 1.12; font-weight: 500; letter-spacing: -0.015em; color: var(--on-dark); }
.g3-band .g3-quote { padding: var(--s6); border-radius: 24px; background: rgb(255 255 255 / 0.06); border: 1px solid var(--hairline-dark); color: var(--on-dark); }
.g3-band .g3-quote figcaption { color: var(--on-ink-2); }
@media (min-width: 64rem) {
  .g3-scale { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--s16); align-items: center; }
  .g3-band .g3-quote { padding: var(--s10); }
}

/* ---------- /buy-refurbished/: how buying works ---------- */
.g3-how__head { display: grid; gap: var(--s5); justify-items: start; }
.g3-how__cta { margin-top: var(--s2); }
.g3-steps { background: var(--floor); border-radius: 32px; padding: var(--s8) var(--s6); gap: var(--s8); }
.g3-steps > li::before { background: var(--ink); color: var(--lime); }
.g3-steps > li > * { grid-column: 2; }
@media (min-width: 48rem) { .g3-steps { padding: var(--s10); } }
@media (min-width: 64rem) { .g3-how .split { align-items: center; } }

/* ---------- /buy-refurbished/: resellers ---------- */
.g3-resell__photo { margin: 0; border-radius: 32px; overflow: hidden; background: var(--ink); }
.g3-resell__photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.g3-resell__text { display: grid; gap: var(--s5); justify-items: start; }
.g3-resell__actions { margin-top: var(--s2); gap: var(--s3) var(--s6); }

/* ---------- /buy-refurbished/: retire loop ---------- */
.g3-loop__card { display: grid; gap: var(--s6); padding: var(--s8) var(--s6); border-radius: 32px; }
.g3-loop__h2 { font-size: var(--fs-h3); font-weight: 600; line-height: 1.25; letter-spacing: -0.01em; color: var(--lime); }
.g3-loop__mission { margin-top: var(--s3); font-size: clamp(1.25rem, 1.05rem + 0.7vw, 1.625rem); line-height: 1.35; font-weight: 500; letter-spacing: -0.01em; max-width: 34ch; }
.g3-loop__links { display: grid; gap: var(--s2); margin: 0; padding: 0; list-style: none; }
.g3-loop__links .link-arrow { color: var(--on-dark); }
@media (min-width: 64rem) {
  .g3-loop__card { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); column-gap: var(--s16); align-items: center; padding: var(--s12) var(--s16); }
}

/* ---------- /live/ ---------- */
.g3-live .hero__sub { color: var(--text-2); }
.g3-channel { margin-top: var(--s8); width: 100%; max-width: 36rem; display: grid; gap: var(--s2); padding: var(--s6); border-radius: 24px;
  background: var(--paper); box-shadow: 0 1px 2px rgb(18 19 17 / 0.06), 0 12px 32px -14px rgb(18 19 17 / 0.28), inset 0 0 0 2px var(--lime); }
.g3-channel__top { display: flex; align-items: center; gap: var(--s3); }
.g3-channel__dot { width: 10px; height: 10px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 4px rgb(142 198 63 / 0.25); flex: none; }
.g3-channel__name { font-size: var(--fs-h3); font-weight: 600; line-height: 1.2; letter-spacing: -0.01em; }
.g3-channel__handle { font-size: var(--fs-small); font-weight: 700; color: var(--text-2); }
.g3-channel .btn { margin-top: var(--s3); justify-self: start; }
.g3-asof { margin-top: var(--s3); font-size: var(--fs-small); color: var(--text-2); }
/* Right half: a real photo of the stock on Regadget's floor (no show photo exists yet), with Gadget (live is an
   allowed mascot page) on a paper tab over its bottom edge. */
.g3-live__side { position: relative; margin: var(--s8) 0 0; border-radius: 32px; overflow: hidden; background: var(--ink); }
.g3-live__photo img { display: block; width: 100%; height: 16rem; object-fit: cover; object-position: 50% 40%; }
.g3-live__cap { position: absolute; left: var(--s4); right: var(--s4); bottom: var(--s4); display: flex; align-items: center; gap: var(--s3);
  padding: var(--s3) var(--s5) var(--s3) var(--s3); border-radius: 20px; background: var(--paper);
  box-shadow: 0 1px 2px rgb(18 19 17 / 0.08), 0 12px 28px -12px rgb(18 19 17 / 0.4);
  font-size: var(--fs-lead); font-weight: 600; line-height: 1.25; letter-spacing: -0.01em; }
.g3-live__cap img { flex: none; width: 44px; height: auto; }
@media (min-width: 64rem) {
  .hero--inner.g3-live { padding: 56px 0 64px; }
  .hero--inner.g3-live .hero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: var(--s16); align-items: stretch; }
  .g3-live__side { margin: 0; min-height: 26rem; }
  .g3-live__photo img { position: absolute; inset: 0; height: 100%; }
  .g3-live__cap { left: var(--s6); right: auto; bottom: var(--s6); }
  .g3-live__cap img { width: 56px; }
}
/* step row: every step title starts on the same line (grader g3 r1: step 3 sat ~8px high at 1280) */
.g3-live-steps > li { align-content: start; }
.g3-live-steps .steps__title { font-size: 1.125rem; }
.g3-help { display: grid; gap: var(--s5); }
@media (min-width: 64rem) { .g3-help { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s6); } }
.g3-help .card__title { font-size: 1.25rem; }

/* ---------- /gaming/ ---------- */
.g3-game-hero .hero__sub { color: var(--text-2); }
.g3-game-hero__tag { margin-top: var(--s4); font-weight: 600; font-size: var(--fs-lead); }
.g3-game-hero .proof-row { margin-top: var(--s6); font-size: 0.9375rem; }
.g3-game-hero__photo { margin: var(--s10) 0 0; display: grid; place-items: center; border-radius: var(--r-card); background: var(--floor); padding: var(--s8); }
.g3-game-hero__photo img { width: auto; max-width: 100%; max-height: 22rem; mix-blend-mode: multiply; }
.g3-game-hero__shop { margin-top: var(--s5); color: var(--text-2); }
.g3-game-hero__shop a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; color: var(--ink); text-decoration: underline; text-decoration-color: var(--lime); text-decoration-thickness: 2px; text-underline-offset: 0.25em; }
@media (min-width: 64rem) {
  .hero--inner.g3-game-hero { padding: 56px 0; }
  .hero--inner.g3-game-hero .hero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: var(--s16); }
  .g3-game-hero__photo { margin: 0; min-height: 30rem; }
  .g3-game-hero__photo img { max-height: 28rem; }
  .g3-game-h1 { font-size: clamp(2.25rem, 1.5rem + 2.1vw, 3.375rem); line-height: 1.06; }
}
.g3-why__head { margin-bottom: 0; }
.g3-why__quote { padding: var(--s8); }
.g3-why__quote figcaption { color: var(--on-ink-2); }
@media (min-width: 64rem) { .g3-why__quote { padding: var(--s12); } }
.g3-phoenix .accent { color: var(--green-text); }
.g3-phoenix__text { display: grid; gap: var(--s5); }
.g3-phoenix__quote { padding: var(--s8); }
@media (min-width: 64rem) { .g3-phoenix__quote { padding: var(--s10); } }
.g3-bundle-now { margin-top: var(--s3); display: inline-flex; align-self: start; padding: 6px 14px; border-radius: 999px; background: var(--lime); font-weight: 700; }
.g3-game-also { justify-content: flex-start; }
.g3-why__lead { font-size: clamp(1.5rem, 1.2rem + 1vw, 2.125rem); line-height: 1.2; font-weight: 500; letter-spacing: -0.015em; max-width: 26ch; }
.g3-why .card { height: 100%; }
.g3-bundles .d-specs__card { padding: var(--s5); }
@media (min-width: 48rem) { .g3-bundles .d-specs__card { padding: var(--s8) var(--s10); } }
.g3-bundles .d-specs td strong { font-weight: 700; }
.g3-bundles__btns { margin-top: var(--s6); }
.g3-custom { margin-top: var(--s8); display: grid; gap: var(--s5); align-items: center; }
@media (min-width: 64rem) { .g3-custom { grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--s10); } }

/* ---------- /warranty/ ---------- */
.g3-war-hero .answer { margin-top: var(--s5); color: var(--text-2); }
.g3-war-date { margin-top: var(--s4); font-size: var(--fs-small); font-weight: 700; color: var(--text-2); }
.g3-war-hero .hero__actions { margin-top: var(--s6); }
.g3-toc { margin-top: var(--s8); padding: var(--s5) var(--s6); border-radius: 24px; background: var(--floor); }
.g3-toc__h { font-size: var(--fs-small); font-weight: 700; margin-bottom: var(--s2); color: var(--text-2); }
.g3-toc ol { display: grid; margin: 0; padding: 0; list-style: none; counter-reset: toc; }
.g3-toc li { counter-increment: toc; }
.g3-toc a { display: flex; align-items: center; gap: 12px; min-height: 44px; font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--hairline); }
.g3-toc a::before { content: counter(toc); flex: none; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: var(--paper); font-size: 0.8125rem; font-variant-numeric: tabular-nums; }
.g3-toc li:last-child a { border-bottom: 0; }
.g3-toc a:hover { text-decoration: underline; text-decoration-color: var(--lime); text-decoration-thickness: 2px; text-underline-offset: 0.25em; }
@media (min-width: 64rem) {
  .hero--inner.g3-war-hero { padding: 56px 0 64px; }
  .hero--inner.g3-war-hero .hero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: var(--s16); align-items: center; }
  .g3-toc { margin-top: 0; padding: var(--s8); }
  .g3-war-h1 { font-size: clamp(2.5rem, 1.7rem + 2.3vw, 3.75rem); }
}
.g3-qa { display: grid; gap: var(--s4); padding: var(--s8) 0; border-top: 1px solid var(--hairline); scroll-margin-top: calc(var(--header-h) + 16px); }
.g3-qa:last-child { border-bottom: 1px solid var(--hairline); }
.g3-qa__q { font-size: var(--fs-h3); font-weight: 500; line-height: 1.25; letter-spacing: -0.01em; max-width: 22ch; }
.g3-qa__a { display: grid; gap: var(--s4); font-size: 1.0625rem; line-height: 1.6; color: var(--text-2); max-width: 44rem; }
.g3-qa__a .g3-ticks { gap: var(--s3); }
.g3-qa__a .g3-ticks li { color: var(--text-2); }
@media (min-width: 48rem) { .g3-ticks--cols { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--s8); } }
/* returns: one card style, equal columns, equal heights (grader g3 r1 C13; X18 one card style) */
.g3-ret { display: grid; gap: var(--s4); margin-top: var(--s2); align-items: stretch; }
.g3-ret .card { gap: var(--s4); height: 100%; background: var(--floor); box-shadow: none; }
.g3-ret .card__title { font-size: 1.1875rem; color: var(--ink); }
@media (min-width: 48rem) { .g3-ret { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64rem) {
  .g3-qa { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); column-gap: var(--s16); padding: var(--s12) 0; }
  .g3-qa__a { max-width: none; }
}
.g3-claim { padding-top: 0; }
/* the §9 data disclaimer and the paid-repair note are terms, not captions: body size on phones too (grader C16) */
.g3-claim .gc-claim__note, .g3-claim .gc-claim__data { font-size: 1rem; }
/* /gaming/: the §7 modification rule, beside the bundle table it qualifies */
.g3-mod { margin-top: var(--s5); max-width: 48rem; }
.g3-phoenix__next { font-size: 1.0625rem; color: var(--text-2); }
.g3-note { padding: var(--s4) var(--s5); border-radius: 16px; background: var(--floor); color: var(--ink); font-size: 1rem; }
.g3-cross { margin-top: var(--s8); display: flex; flex-wrap: wrap; gap: var(--s2) var(--s8); }
.g3-cross p { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--s2); color: var(--text-2); }

/* ==========================================================================================================
   v2-g3 content pass (2026-09-29): new /buy-refurbished/ sections only (g3b-*). Same kit, lime / black / white.
   ========================================================================================================== */
/* what we sell: answer left, a scannable device list right (a list, not a card grid) */
.g3b-range__head { display: grid; gap: var(--s5); align-content: start; }
.g3b-range__fit { color: var(--text-2); font-size: 1.0625rem; line-height: 1.55; max-width: 34rem; }
.g3b-kinds { margin: 0; border-top: 1px solid var(--hairline); }
.g3b-kinds__row { display: grid; gap: var(--s1); padding: var(--s5) 0; border-bottom: 1px solid var(--hairline); }
.g3b-kinds dt { font-size: var(--fs-h3); font-weight: 600; line-height: 1.25; letter-spacing: -0.01em; }
.g3b-kinds dd { margin: 0; color: var(--text-2); font-size: 1.0625rem; line-height: 1.55; }
.g3b-kinds dd .textlink { display: inline; padding-block: 10px; color: var(--ink); }
.g3b-kinds__row--shop dt { font-size: 1.0625rem; font-weight: 700; }
@media (min-width: 48rem) {
  .g3b-kinds__row { grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); column-gap: var(--s6); align-items: baseline; }
}

/* is refurbished a compromise: answer + real bench photo, then the four things every machine goes through */
.g3b-refurb__head { display: grid; gap: var(--s5); }
.g3b-refurb__photo { margin: 0; border-radius: 32px; overflow: hidden; background: var(--ink); }
.g3b-refurb__photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.g3b-steps { display: grid; gap: var(--s4); margin: var(--s10) 0 0; padding: 0; list-style: none; }
.g3b-step { display: grid; gap: var(--s2); align-content: start; padding: var(--s6); border-radius: 24px; background: var(--paper); }
.g3b-step__title { font-size: 1.1875rem; font-weight: 700; line-height: 1.3; }
.g3b-step__title::before { content: ""; display: block; width: 28px; height: 4px; margin-bottom: var(--s4); border-radius: 2px; background: var(--lime); }
.g3b-step__text { color: var(--text-2); line-height: 1.55; }
.g3b-step__text .textlink { display: inline; padding-block: 10px; color: var(--ink); }
@media (min-width: 48rem) { .g3b-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64rem) { .g3b-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s5); } }

/* how buying works: the two buying patterns under the steps */
.g3b-ways { margin-top: var(--s12); padding-top: var(--s10); border-top: 1px solid var(--hairline); display: grid; gap: var(--s5); }
.g3b-ways__h { font-size: var(--fs-h3); font-weight: 600; line-height: 1.25; letter-spacing: -0.01em; }
.g3b-ways .card { height: 100%; }
.g3b-ways .card__title { font-size: 1.25rem; }

/* where the stock comes from: story left, retire card right */
.g3b-source__text { display: grid; gap: var(--s5); }
.g3b-story { display: grid; gap: var(--s5); margin-top: var(--s2); }
.g3b-story__h { font-size: 1.1875rem; font-weight: 700; line-height: 1.3; margin-bottom: var(--s1); }
.g3b-story p { color: var(--text-2); line-height: 1.55; }
@media (min-width: 48rem) { .g3b-story { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s8); } }
.g3b-source__card { gap: var(--s5); padding: var(--s8) var(--s6); border-radius: 32px; }
.g3b-source__why { font-size: clamp(1.25rem, 1.05rem + 0.7vw, 1.5rem); line-height: 1.35; font-weight: 500; letter-spacing: -0.01em; }
.g3b-source__card .g3-loop__links { margin-top: var(--s2); }
@media (min-width: 64rem) {
  .g3b-source .split { align-items: center; }
  .g3b-source__card { padding: var(--s12) var(--s10); }
}

/* FAQ: the page's questions whose answers live nowhere else on it */
.g3b-faq { padding-bottom: var(--section-y); }

/* ==========================================================================================================
   v2-g3 r1 grade fixes (2026-09-29)
   ========================================================================================================== */
/* The lead door's CTA is the one filled lime button in the hero (grader C12; impeccable: one filled button per view).
   The shop and live doors stay outlined. Hover keeps the kit's ink-on-lime inversion. */
.door2__cta.g3-door__cta--solid { background: var(--lime); border-color: var(--lime); color: var(--ink); }
.door2:hover .door2__cta.g3-door__cta--solid { background: var(--ink); border-color: var(--ink); color: var(--lime); }
/* The hook is now the h3 and the label a p (grader C15): keep the door's rhythm */
.g3-door h3.door2__hook { margin-bottom: 0; }
.g3-door p.door2__label { margin: 0; }
/* FAQ to closing card: one section gap, not two (~224px at 1920, grader C16) */
.g3b-faq + .closing, .g3b-source + .g3b-faq { padding-top: 0; }