@charset "UTF-8";

/*
 * GBDS V2 — Gaming PC guide
 * Visual thesis: choose the screen, pass six compatibility gates, then build.
 */

/* Cocoon integration ---------------------------------------------------- */

body.gbds-v2-pc-build-page {
  overflow-x: clip;
  background: #fff;
}

body.gbds-v2-pc-build-page :where(.container, .content, .content-in) {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: #fff;
}

body.gbds-v2-pc-build-page .content-in { display: block; }

body.gbds-v2-pc-build-page :where(.main, #main, .article, .entry-content) {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.gbds-v2-pc-build-page :where(
  #header-container,
  .article-header,
  .date-tags,
  .eye-catch-wrap,
  #toc,
  .toc,
  #sidebar,
  .ad-area,
  .sns-share,
  .sns-follow,
  .article-footer,
  .under-entry-content,
  .pager-post-navi,
  .related-entry-heading,
  .related-list,
  .breadcrumb,
  .author-info,
  .mobile-footer-menu-buttons,
  .go-to-top
) { display: none !important; }

/* Foundation ------------------------------------------------------------ */

.gbds-v2-pc-build-shell {
  --pc-paper: #fff;
  --pc-soft: #f3f5f4;
  --pc-soft-2: #e9edeb;
  --pc-ink: #0c1012;
  --pc-copy: #3d4448;
  --pc-muted: #70777b;
  --pc-line: #d8dddb;
  --pc-teal: #087f76;
  --pc-blue: #266eaa;
  --pc-orange: #ff9a52;
  --pc-violet: #b49aff;
  --pc-dark: #0b0f11;
  --pc-dark-2: #14191d;
  --pc-layout: 1120px;
  --pc-wide: 1390px;
  --pc-copy-width: 760px;
  --pc-gutter: clamp(22px, 4.2vw, 68px);
  --pc-section-space: clamp(112px, 11vw, 184px);
  --pc-ease: cubic-bezier(.22, 1, .36, 1);
  position: relative;
  isolation: isolate;
  width: 100%;
  margin: 0;
  overflow: clip;
  background: var(--pc-paper);
  color: var(--pc-copy);
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, Meiryo, sans-serif;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: .006em;
  line-height: 1.9;
  text-align: left;
  word-break: normal;
  overflow-wrap: normal;
  line-break: strict;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.gbds-v2-pc-build-shell *,
.gbds-v2-pc-build-shell *::before,
.gbds-v2-pc-build-shell *::after { box-sizing: border-box; }

.gbds-v2-pc-build-shell :where(h1, h2, h3, h4, p, figure, ul, ol, dl, dd) { margin-top: 0; }

body.gbds-v2-pc-build-page .gbds-v2-pc-build-shell :where(h1, h2, h3, h4) {
  max-width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--pc-ink);
  font-family: inherit;
  font-weight: 740;
  letter-spacing: -.055em;
  line-height: 1.08;
  text-wrap: balance;
  word-break: keep-all;
  overflow-wrap: normal;
}

body.gbds-v2-pc-build-page .gbds-v2-pc-build-shell :where(h1, h2, h3, h4)::before,
body.gbds-v2-pc-build-page .gbds-v2-pc-build-shell :where(h1, h2, h3, h4)::after {
  display: none !important;
  content: none !important;
}

/* wpautop may insert br elements between authored phrase spans. */
.gbds-v2-pc-build-shell :where(h1, h2, h3) br { display: none !important; }
.gbds-v2-pc-build-shell h2 > [id^="toc"] { display: block; }
.gbds-v2-pc-build-shell h2 > [id^="toc"] > .pc-phrase { display: block; }

.gbds-v2-pc-build-shell :where(p, li, dd, figcaption) {
  text-wrap: pretty;
  word-break: auto-phrase;
}

.gbds-v2-pc-build-shell strong { color: var(--pc-ink); font-weight: 720; }
.gbds-v2-pc-build-shell a {
  color: var(--pc-teal);
  text-decoration-color: color-mix(in srgb, var(--pc-teal) 42%, transparent);
  text-decoration-thickness: 1px;
  text-underline-offset: .24em;
}
.gbds-v2-pc-build-shell a:hover { color: #045b55; text-decoration-color: currentColor; }
.gbds-v2-pc-build-shell :where(a, button, summary, .pc-table-wrap):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--pc-teal) 48%, transparent);
  outline-offset: 4px;
}
.gbds-v2-pc-build-shell [id] { scroll-margin-top: 82px; }

.pc-phrase {
  display: inline-block;
  white-space: nowrap;
  word-break: keep-all;
  overflow-wrap: normal;
}

.pc-hero h1 > .pc-phrase,
.pc-chapter-head h2 > .pc-phrase,
.pc-endcap > p > .pc-phrase { display: block; }

.pc-overline,
.pc-number {
  margin-bottom: 18px;
  color: var(--pc-teal);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .17em;
  line-height: 1.4;
  text-transform: uppercase;
}

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

/* Opening --------------------------------------------------------------- */

.pc-hero {
  display: grid;
  min-height: clamp(560px, 80svh, 900px);
  place-items: center;
  width: 100%;
  padding: clamp(86px, 11vw, 154px) var(--pc-gutter);
  background: #fff;
}

.pc-hero h1 {
  width: min(1320px, 100%);
  margin: 0;
  color: var(--pc-ink);
  font-size: clamp(58px, 7.9vw, 126px);
  line-height: .98;
  text-align: center;
}

.pc-after-hero { border-top: 1px solid var(--pc-line); }
.pc-disclosure {
  width: min(var(--pc-layout), calc(100% - (var(--pc-gutter) * 2)));
  margin: 0 auto;
  padding: 14px 0;
  color: var(--pc-muted);
  font-size: 12px;
  line-height: 1.65;
}

.pc-local-nav {
  position: sticky;
  z-index: 40;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(16px, 2.4vw, 38px);
  min-height: 60px;
  padding: 0 var(--pc-gutter);
  overflow-x: auto;
  border-top: 1px solid var(--pc-line);
  border-bottom: 1px solid var(--pc-line);
  background: rgba(255, 255, 255, .94);
  backdrop-filter: blur(18px) saturate(150%);
  -webkit-backdrop-filter: blur(18px) saturate(150%);
  scrollbar-width: none;
}
.pc-local-nav::-webkit-scrollbar { display: none; }
.pc-local-nav a {
  flex: 0 0 auto;
  padding: 18px 0;
  color: var(--pc-muted);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
}
.pc-local-nav a:hover,
.pc-local-nav a.is-current { color: var(--pc-ink); }
.pc-local-nav__progress {
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 2px;
  transform: scaleX(0);
  transform-origin: left;
  background: var(--pc-teal);
  pointer-events: none;
}
body.admin-bar .pc-local-nav { top: 32px; }

/* Shared editorial rhythm ---------------------------------------------- */

.pc-article-body { width: 100%; }
.pc-section {
  width: 100%;
  padding: var(--pc-section-space) var(--pc-gutter);
  background: #fff;
}

.pc-chapter-head {
  width: min(1120px, 100%);
  margin: 0 auto clamp(48px, 6vw, 82px);
  text-align: center;
}
.pc-chapter-head h2 {
  margin: 0;
  color: var(--pc-ink);
  font-size: clamp(50px, 6.2vw, 90px);
  line-height: 1.02;
}
.pc-chapter-head > p:last-child:not(.pc-overline) {
  width: min(690px, 100%);
  margin: 27px auto 0;
  color: var(--pc-muted);
  font-size: clamp(17px, 1.5vw, 21px);
  line-height: 1.8;
}

.pc-prose,
.pc-dark-prose {
  width: min(var(--pc-copy-width), 100%);
  margin: 0 auto;
}
.pc-prose p,
.pc-dark-prose p { margin-bottom: 1.45em; }
.pc-prose p:last-child,
.pc-dark-prose p:last-child { margin-bottom: 0; }

.pc-media { margin: 0; }
.pc-media__frame {
  position: relative;
  overflow: hidden;
  background: var(--pc-soft);
}
.pc-media__frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.pc-media figcaption {
  margin-top: 12px;
  color: var(--pc-muted);
  font-size: 12px;
  line-height: 1.65;
}
.pc-media figcaption strong { margin-right: .5em; }

.pc-related-link {
  width: min(var(--pc-layout), 100%);
  margin: clamp(60px, 8vw, 104px) auto 0;
  border-top: 1px solid var(--pc-line);
  border-bottom: 1px solid var(--pc-line);
}
.pc-related-link a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 23px 0;
  color: var(--pc-ink);
  font-weight: 700;
  text-decoration: none;
}
.pc-related-link a::after { content: "↗"; color: var(--pc-teal); font-size: 22px; }
.pc-related-link span {
  flex: 0 0 auto;
  color: var(--pc-teal);
  font-size: 11px;
  letter-spacing: .14em;
}

/* Introduction ---------------------------------------------------------- */

.pc-intro { padding-top: clamp(94px, 9vw, 150px); }
.pc-opening-visual {
  width: min(1480px, 100%);
  margin: clamp(66px, 8vw, 112px) auto 0;
}
.pc-opening-visual .pc-media__frame { aspect-ratio: 16 / 9; }
.pc-opening-visual figcaption { width: min(var(--pc-copy-width), 100%); margin-right: auto; margin-left: auto; }

.pc-first-decisions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: min(var(--pc-wide), 100%);
  margin: clamp(72px, 9vw, 126px) auto 0;
  border-top: 1px solid var(--pc-line);
  border-bottom: 1px solid var(--pc-line);
}
.pc-first-decisions article { min-width: 0; padding: clamp(34px, 4vw, 56px); }
.pc-first-decisions article + article { border-left: 1px solid var(--pc-line); }
.pc-first-decisions article > span {
  display: block;
  margin-bottom: 48px;
  color: var(--pc-teal);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .15em;
}
.pc-first-decisions h3 { margin: 0 0 18px; font-size: clamp(26px, 2.2vw, 35px); }
.pc-first-decisions p { margin: 0; color: var(--pc-muted); font-size: 15px; }

/* Screen routes --------------------------------------------------------- */

.pc-screen-section { background: #f8f9f8; }
.pc-screen-routes {
  width: min(var(--pc-layout), 100%);
  margin: clamp(64px, 8vw, 110px) auto 0;
  border-top: 1px solid var(--pc-line);
}
.pc-screen-routes article {
  display: grid;
  grid-template-columns: minmax(250px, .72fr) minmax(0, 1.28fr);
  gap: clamp(42px, 7vw, 104px);
  align-items: center;
  padding: clamp(45px, 6vw, 78px) 0;
  border-bottom: 1px solid var(--pc-line);
}
.pc-screen-routes__spec { margin: 0; }
.pc-screen-routes__spec strong {
  display: block;
  color: var(--pc-teal);
  font-size: clamp(55px, 6.2vw, 92px);
  font-weight: 760;
  letter-spacing: -.07em;
  line-height: .94;
}
.pc-screen-routes__spec span {
  display: block;
  margin-top: 12px;
  color: var(--pc-muted);
  font-size: 13px;
  letter-spacing: .08em;
}
.pc-screen-routes__label { margin: 0 0 13px; color: var(--pc-blue); font-size: 12px; font-weight: 800; letter-spacing: .12em; }
.pc-screen-routes h3 { margin: 0 0 18px; font-size: clamp(35px, 3.7vw, 58px); }
.pc-screen-routes article > div > p:last-child { margin: 0; }

/* Dark sections --------------------------------------------------------- */

.pc-dark-section {
  background: var(--pc-dark);
  color: #c8ced1;
}
.pc-dark-inner { width: min(var(--pc-wide), 100%); margin: 0 auto; }
.pc-chapter-head--dark h2 { color: #fff !important; }
.pc-chapter-head--dark .pc-overline { color: var(--pc-orange); }
.pc-chapter-head--dark > p:last-child:not(.pc-overline) { color: #aeb5b8; }
.pc-dark-section strong { color: #fff; }
.pc-dark-prose { color: #c3c9cc; }

/* Budget --------------------------------------------------------------- */

.pc-budget-tool { width: min(1180px, 100%); margin: 0 auto; }
.pc-budget-controls {
  display: grid;
  grid-template-columns: 1fr 1.35fr;
  gap: clamp(32px, 6vw, 92px);
  padding: clamp(36px, 5vw, 60px) 0;
  border-top: 1px solid #30363a;
  border-bottom: 1px solid #30363a;
}
.pc-control-label { margin: 0 0 15px; color: #f3f5f5; font-size: 13px; font-weight: 750; }
.pc-segmented { display: flex; flex-wrap: wrap; gap: 9px; }
.pc-segmented button {
  appearance: none;
  min-height: 44px;
  padding: 10px 16px;
  border: 1px solid #3b4246;
  border-radius: 999px;
  background: transparent;
  color: #aeb5b9;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
  cursor: pointer;
  transition: color .25s ease, border-color .25s ease, background .25s ease, transform .25s var(--pc-ease);
}
.pc-segmented button:hover { color: #fff; border-color: #777f83; transform: translateY(-1px); }
.pc-segmented button[aria-pressed="true"] { border-color: #fff; background: #fff; color: #0c1012; }
.pc-segmented--goals button[aria-pressed="true"] { border-color: var(--pc-orange); background: transparent; color: var(--pc-orange); }
.gbds-v2-pc-build-shell:not(.has-pc-js) .pc-budget-controls { display: none; }

.pc-budget-readout {
  display: grid;
  grid-template-columns: minmax(190px, .55fr) 1.45fr;
  gap: clamp(36px, 8vw, 116px);
  align-items: end;
  padding: clamp(45px, 6vw, 74px) 0;
}
.pc-budget-readout div > span { display: block; color: #777f83; font-size: 11px; font-weight: 800; letter-spacing: .15em; }
.pc-budget-readout div > strong { display: block; margin-top: 10px; color: var(--pc-orange); font-size: clamp(42px, 5vw, 74px); letter-spacing: -.06em; line-height: 1; }
.pc-budget-readout > p { margin: 0; color: #d3d8da; font-size: clamp(18px, 2vw, 27px); line-height: 1.55; }

.pc-budget-bars { border-top: 1px solid #30363a; }
.pc-budget-row {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr) 66px;
  gap: 24px;
  align-items: center;
  min-height: 82px;
  border-bottom: 1px solid #30363a;
}
.pc-budget-row > div:first-child { display: flex; flex-direction: column; line-height: 1.4; }
.pc-budget-row > div:first-child strong { font-size: 15px; }
.pc-budget-row > div:first-child span { color: #81898d; font-size: 11px; }
.pc-budget-row > b { color: #fff; font-size: 13px; text-align: right; }
.pc-budget-track { height: 3px; overflow: hidden; background: #2a3033; }
.pc-budget-track i { display: block; width: 0; height: 100%; background: var(--pc-orange); transition: width .75s var(--pc-ease); }
.pc-budget-row--gpu .pc-budget-track i { width: 43%; background: var(--pc-orange); }
.pc-budget-row--cpu .pc-budget-track i { width: 22%; background: var(--pc-violet); }
.pc-budget-row--platform .pc-budget-track i { width: 15%; background: #79d8ce; }
.pc-budget-row--power .pc-budget-track i { width: 13%; background: #ffd18f; }
.pc-budget-row--storage .pc-budget-track i { width: 7%; background: #79b8e9; }
.pc-tool-note { margin: 26px 0 0; color: #899195; font-size: 12px; line-height: 1.75; }

/* Compatibility --------------------------------------------------------- */

.pc-component-spread {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(300px, .82fr);
  gap: 18px;
  width: min(var(--pc-wide), 100%);
  margin: clamp(66px, 8vw, 112px) auto 0;
}
.pc-component-spread .pc-media__frame { height: clamp(430px, 48vw, 680px); }
.pc-component-spread__main .pc-media__frame img { object-position: center 54%; }
.pc-component-spread__side .pc-media__frame img { object-position: center; }

.pc-platform-switcher { width: min(var(--pc-layout), 100%); margin: clamp(76px, 9vw, 126px) auto 0; }
.pc-platform-tabs { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--pc-line); border-bottom: 1px solid var(--pc-line); }
.pc-platform-tabs button {
  appearance: none;
  position: relative;
  min-height: 74px;
  padding: 18px 22px;
  border: 0;
  background: transparent;
  color: var(--pc-muted);
  font: inherit;
  font-weight: 730;
  cursor: pointer;
}
.pc-platform-tabs button + button { border-left: 1px solid var(--pc-line); }
.pc-platform-tabs button[aria-selected="true"] { color: var(--pc-teal); }
.pc-platform-tabs button[aria-selected="true"]::after { position: absolute; right: 20%; bottom: -1px; left: 20%; height: 3px; background: var(--pc-teal); content: ""; }
.gbds-v2-pc-build-shell:not(.has-pc-js) .pc-platform-tabs { display: none; }
.pc-platform-panel { padding: 36px 0 24px; }
.pc-platform-panel p { width: min(780px, 100%); margin: 0 auto; }
.pc-platform-panel strong { display: block; margin-bottom: 6px; }
.has-pc-js .pc-platform-panel[hidden] { display: none; }

.pc-gates {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  padding: 0;
  margin: 44px 0 0;
  list-style: none;
  border-top: 1px solid var(--pc-line);
  border-bottom: 1px solid var(--pc-line);
}
.pc-gates li { min-width: 0; padding: 28px 18px; }
.pc-gates li + li { border-left: 1px solid var(--pc-line); }
.pc-gates span { display: block; margin-bottom: 28px; color: var(--pc-teal); font-size: 11px; font-weight: 800; }
.pc-gates strong { display: block; font-size: 13px; line-height: 1.45; }
.pc-gates small { display: block; margin-top: 8px; color: var(--pc-muted); font-size: 11px; line-height: 1.5; }

.pc-editorial-columns {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: min(var(--pc-layout), 100%);
  margin: clamp(84px, 9vw, 128px) auto 0;
  border-top: 1px solid var(--pc-line);
  border-bottom: 1px solid var(--pc-line);
}
.pc-editorial-columns article { min-width: 0; padding: clamp(34px, 4vw, 52px); }
.pc-editorial-columns article + article { border-left: 1px solid var(--pc-line); }
.pc-editorial-columns h3 { margin: 0 0 20px; font-size: clamp(23px, 1.7vw, 27px); }
.pc-editorial-columns article > p:last-child { margin: 0; color: var(--pc-muted); font-size: 15px; }

/* CPU and GPU ----------------------------------------------------------- */

.pc-cpu-gpu-section { background: #f8f9f8; }
.pc-role-images {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  width: min(var(--pc-wide), 100%);
  margin: clamp(70px, 8vw, 116px) auto 0;
}
.pc-role-images .pc-media__frame { aspect-ratio: 1 / 1; }
.pc-role-images figcaption { font-size: 13px; }

.pc-part-ledger {
  width: min(var(--pc-layout), 100%);
  margin: clamp(78px, 9vw, 124px) auto 0;
  border-top: 1px solid var(--pc-line);
}
.pc-part-ledger__head,
.pc-part-ledger article {
  display: grid;
  grid-template-columns: minmax(210px, .85fr) minmax(0, 1.25fr) minmax(0, 1.1fr);
  gap: clamp(26px, 4vw, 62px);
  padding: 26px 0;
  border-bottom: 1px solid var(--pc-line);
}
.pc-part-ledger__head { color: var(--pc-muted); font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.pc-part-ledger h3 { margin: 0; color: var(--pc-teal); font-size: 20px; line-height: 1.4; letter-spacing: -.025em; }
.pc-part-ledger article p { margin: 0; font-size: 14px; line-height: 1.75; }
.pc-part-ledger article p:last-child { color: var(--pc-muted); }

.pc-dark-spread {
  width: calc(100% + (var(--pc-gutter) * 2));
  margin: var(--pc-section-space) 0 calc(var(--pc-section-space) * -1) calc(var(--pc-gutter) * -1);
  padding: var(--pc-section-space) var(--pc-gutter);
  background: var(--pc-dark);
  color: #c4cacf;
}
.pc-dark-spread__inner { width: min(var(--pc-wide), 100%); margin: 0 auto; }
.pc-gpu-specs__intro { width: min(900px, 100%); margin: 0 auto clamp(52px, 6vw, 78px); text-align: center; }
.pc-gpu-specs__intro .pc-overline { color: var(--pc-orange); }
.pc-gpu-specs__intro h3 { margin: 0; color: #fff !important; font-size: clamp(38px, 4.6vw, 70px); }
.pc-gpu-specs__intro h3 .pc-phrase { display: block; }
.pc-gpu-specs__intro > p:last-child { width: min(640px, 100%); margin: 24px auto 0; color: #aeb5b8; }
.pc-table-wrap {
  overflow-x: auto;
  border-top: 1px solid #343a3e;
  border-bottom: 1px solid #343a3e;
  -webkit-overflow-scrolling: touch;
}
.pc-table-wrap table { width: 100%; min-width: 850px; margin: 0; border: 0; border-collapse: collapse; background: transparent; color: #c9ced1; }
.pc-table-wrap :where(th, td) { padding: 20px 18px; border: 0; border-bottom: 1px solid #292f32; background: transparent; text-align: left; vertical-align: top; }
.pc-table-wrap thead th { color: #858e92; font-size: 11px; font-weight: 800; letter-spacing: .1em; }
.pc-table-wrap tbody th { color: #fff; font-size: 14px; }
.pc-table-wrap tbody td { font-size: 13px; }
.pc-table-wrap tbody tr:last-child :where(th, td) { border-bottom: 0; }
.pc-gpu-specs .pc-tool-note { width: min(880px, 100%); margin: 28px auto 0; }

/* Price builds ---------------------------------------------------------- */

.pc-builds-section { padding-bottom: 0; }
.pc-build-stories {
  width: auto;
  margin: clamp(70px, 8vw, 112px) calc(var(--pc-gutter) * -1) 0;
}
.pc-build-story:not(.pc-build-story--featured) {
  width: min(var(--pc-wide), calc(100% - (var(--pc-gutter) * 2)));
  margin-right: auto;
  margin-left: auto;
}
.pc-build-story { padding: clamp(62px, 7vw, 96px) 0; border-top: 1px solid var(--pc-line); }
.pc-build-story:last-child { border-bottom: 1px solid var(--pc-line); }
.pc-build-story > header {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 12px;
  align-items: end;
  margin-bottom: clamp(46px, 6vw, 74px);
}
.pc-build-story > header p { align-self: center; margin: 0; color: var(--pc-teal); font-size: 12px; font-weight: 800; letter-spacing: .13em; }
.pc-build-story > header strong { color: var(--pc-ink); font-size: clamp(84px, 11vw, 164px); font-weight: 770; letter-spacing: -.09em; line-height: .74; }
.pc-build-story > header span { padding-bottom: 4px; color: var(--pc-muted); font-size: 15px; font-weight: 700; }
.pc-build-story__content { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(280px, .6fr); gap: clamp(48px, 8vw, 120px); }
.pc-build-list { border-top: 1px solid var(--pc-line); }
.pc-build-list dl { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 26px; margin: 0; padding: 19px 0; border-bottom: 1px solid var(--pc-line); }
.pc-build-list dt { color: var(--pc-teal); font-size: 12px; font-weight: 800; }
.pc-build-list dd { margin: 0; font-size: 15px; }
.pc-build-story aside { align-self: start; padding-top: 2px; }
.pc-build-story aside h3 { margin: 0 0 22px; font-size: clamp(31px, 3.1vw, 48px); }
.pc-build-story aside > p:last-child { margin: 0; color: var(--pc-muted); font-size: 15px; }

.pc-build-story--featured {
  width: 100%;
  margin-left: 0;
  padding: var(--pc-section-space) max(var(--pc-gutter), calc((100% - var(--pc-wide)) / 2));
  border: 0;
  background: var(--pc-dark);
  color: #c8ced1;
}
.pc-build-story--featured > header,
.pc-build-story--featured > .pc-split-builds,
.pc-build-story--featured > .pc-card-footnote { width: min(var(--pc-wide), 100%); margin-right: auto; margin-left: auto; }
.pc-build-story--featured > header p { color: var(--pc-orange); }
.pc-build-story--featured > header strong { color: #fff; }
.pc-build-story--featured > header span { color: #a8b0b4; }
.pc-split-builds { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid #33393d; border-bottom: 1px solid #33393d; }
.pc-split-builds section { min-width: 0; padding: clamp(38px, 5vw, 68px); }
.pc-split-builds section + section { border-left: 1px solid #33393d; }
.pc-split-builds__tag { margin: 0 0 40px; color: var(--pc-orange); font-size: 11px; font-weight: 800; letter-spacing: .14em; }
.pc-split-builds h3 { margin: 0 0 22px; color: #fff !important; font-size: clamp(31px, 3.6vw, 54px); }
.pc-split-builds section > p:last-child { margin: 0; color: #b7bec1; }
.pc-card-footnote { margin-top: 26px !important; color: #858e92; font-size: 12px; }

/* Power ---------------------------------------------------------------- */

.pc-power-section { margin-top: 0; }
.pc-power-path {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding: 0;
  margin: clamp(66px, 8vw, 106px) auto 0;
  list-style: none;
  border-top: 1px solid #343a3e;
  border-bottom: 1px solid #343a3e;
}
.pc-power-path li { min-width: 0; padding: 34px clamp(18px, 3vw, 40px); }
.pc-power-path li + li { border-left: 1px solid #343a3e; }
.pc-power-path span { display: block; margin-bottom: 44px; color: var(--pc-orange); font-size: 11px; font-weight: 800; }
.pc-power-path strong { display: block; font-size: 17px; }
.pc-power-path small { display: block; margin-top: 7px; color: #80888c; font-size: 11px; }
.pc-safety-callout {
  display: grid;
  grid-template-columns: .55fr 1.45fr;
  gap: clamp(32px, 7vw, 108px);
  width: min(980px, 100%);
  margin: clamp(62px, 8vw, 106px) auto 0;
  padding-top: 34px;
  border-top: 1px solid var(--pc-orange);
}
.pc-safety-callout strong { color: var(--pc-orange); font-size: 18px; }
.pc-safety-callout p { margin: 0; }

/* Case ----------------------------------------------------------------- */

.pc-case-feature {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(340px, .65fr);
  gap: clamp(44px, 7vw, 102px);
  align-items: start;
  width: min(var(--pc-wide), 100%);
  margin: 0 auto;
}
.pc-case-feature .pc-media__frame { aspect-ratio: 970 / 600; }
.pc-case-checks { padding-top: 8px; }
.pc-case-checks h3 { margin: 0 0 42px; font-size: clamp(29px, 2.8vw, 42px); }
.pc-case-checks ol { padding: 0; margin: 0; list-style: none; border-top: 1px solid var(--pc-line); }
.pc-case-checks li { display: grid; grid-template-columns: 38px 1fr; gap: 18px; padding: 21px 0; border-bottom: 1px solid var(--pc-line); }
.pc-case-checks li > span { color: var(--pc-teal); font-size: 11px; font-weight: 800; }
.pc-case-checks li p { margin: 0; font-size: 14px; }
.pc-case-checks li strong { display: block; margin-bottom: 3px; }

/* Choice, checklist, first boot ---------------------------------------- */

.pc-bto-section { background: #f8f9f8; }
.pc-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: min(var(--pc-layout), 100%);
  margin: 0 auto clamp(68px, 8vw, 104px);
  border-top: 1px solid var(--pc-line);
  border-bottom: 1px solid var(--pc-line);
}
.pc-choice-grid article { min-width: 0; padding: clamp(38px, 5vw, 64px); }
.pc-choice-grid article + article { border-left: 1px solid var(--pc-line); }
.pc-choice-grid h3 { margin: 0 0 26px; font-size: clamp(31px, 3vw, 46px); }
.pc-choice-grid ul { padding-left: 1.15em; margin: 0; }
.pc-choice-grid li + li { margin-top: 11px; }

.pc-checklist {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: min(var(--pc-layout), 100%);
  padding: 0;
  margin: 0 auto;
  list-style: none;
  border-top: 1px solid var(--pc-line);
}
.pc-checklist li {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 18px;
  min-width: 0;
  padding: 28px clamp(22px, 4vw, 48px);
  border-bottom: 1px solid var(--pc-line);
}
.pc-checklist li:nth-child(even) { border-left: 1px solid var(--pc-line); }
.pc-checklist li > span { color: var(--pc-teal); font-size: 11px; font-weight: 800; }
.pc-checklist p { margin: 0; font-size: 14px; }
.pc-checklist strong { display: block; margin-bottom: 4px; }

.pc-first-boot-section { background: #f8f9f8; }
.pc-first-boot-flow {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  width: min(var(--pc-wide), 100%);
  margin: 0 auto;
  border-top: 1px solid var(--pc-line);
  border-bottom: 1px solid var(--pc-line);
}
.pc-first-boot-flow article { min-width: 0; padding: clamp(28px, 3vw, 42px); }
.pc-first-boot-flow article + article { border-left: 1px solid var(--pc-line); }
.pc-first-boot-flow article > span { display: block; margin-bottom: 54px; color: var(--pc-teal); font-size: 11px; font-weight: 800; }
.pc-first-boot-flow h3 { margin: 0 0 18px; font-size: 20px; line-height: 1.35; }
.pc-first-boot-flow p { margin: 0; color: var(--pc-muted); font-size: 13px; }

/* FAQ, sources, closing ------------------------------------------------- */

.pc-faq-list { width: min(900px, 100%); margin: 0 auto; border-top: 1px solid var(--pc-line); }
.pc-faq-list details { border-bottom: 1px solid var(--pc-line); }
.pc-faq-list summary {
  position: relative;
  padding: 27px 54px 27px 0;
  color: var(--pc-ink);
  font-weight: 720;
  line-height: 1.55;
  list-style: none;
  cursor: pointer;
}
.pc-faq-list summary::-webkit-details-marker { display: none; }
.pc-faq-list summary::after { position: absolute; top: 50%; right: 2px; color: var(--pc-teal); font-size: 24px; font-weight: 400; line-height: 1; content: "+"; transform: translateY(-50%); }
.pc-faq-list details[open] summary::after { content: "−"; }
.pc-faq-list details p { width: min(720px, 100%); margin: 0; padding: 0 0 30px; color: var(--pc-muted); }

.pc-sources-section { background: #f8f9f8; }
.pc-source-groups {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: min(var(--pc-wide), 100%);
  margin: clamp(64px, 8vw, 104px) auto 0;
  border-top: 1px solid var(--pc-line);
  border-bottom: 1px solid var(--pc-line);
}
.pc-source-groups section { min-width: 0; padding: clamp(30px, 4vw, 50px); }
.pc-source-groups section + section { border-left: 1px solid var(--pc-line); }
.pc-source-groups h3 { margin: 0 0 23px; color: var(--pc-teal); font-size: 17px; letter-spacing: -.02em; }
.pc-source-groups ul { padding: 0; margin: 0; list-style: none; }
.pc-source-groups li + li { margin-top: 12px; }
.pc-source-groups a { display: inline; font-size: 12px; line-height: 1.6; word-break: auto-phrase; overflow-wrap: normal; }
.pc-source-date { width: min(var(--pc-copy-width), 100%); margin: 28px auto 0; color: var(--pc-muted); font-size: 12px; }

.pc-endcap {
  display: grid;
  min-height: min(78svh, 820px);
  place-content: center;
  padding: clamp(100px, 12vw, 180px) var(--pc-gutter);
  background: var(--pc-dark);
  text-align: center;
}
.pc-endcap > p { margin: 0; color: var(--pc-violet); font-size: clamp(45px, 6.2vw, 92px); font-weight: 760; letter-spacing: -.065em; line-height: 1.02; }
.pc-endcap > small { width: min(620px, 100%); margin: 30px auto 0; color: #a4acb0; font-size: 14px; line-height: 1.75; }

/* Cocoon contrast guard -------------------------------------------------
 * Cocoon applies post-body colors to p/strong with enough specificity to
 * override inherited dark-section colors. Keep every dark surface readable,
 * then restore the deliberately muted and accented roles below.
 */
body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell :is(
  .pc-dark-section,
  .pc-dark-spread,
  .pc-build-story--featured,
  .pc-endcap
) :where(p, li, dd, td, figcaption, small) {
  color: #c8ced1 !important;
}

body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell :is(
  .pc-dark-section,
  .pc-dark-spread,
  .pc-build-story--featured,
  .pc-endcap
) :where(strong, b, dt, th) {
  color: #fff !important;
}

body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell .pc-chapter-head--dark .pc-overline,
body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell .pc-gpu-specs__intro .pc-overline,
body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell .pc-build-story--featured > header p,
body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell .pc-split-builds__tag,
body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell .pc-safety-callout strong {
  color: var(--pc-orange) !important;
}

body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell .pc-budget-readout div > strong {
  color: var(--pc-orange) !important;
}

body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell .pc-budget-readout > p {
  color: #d3d8da !important;
}

body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell .pc-chapter-head--dark > p:last-child:not(.pc-overline),
body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell .pc-gpu-specs__intro > p:last-child {
  color: #aeb5b8 !important;
}

body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell .pc-tool-note,
body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell .pc-card-footnote {
  color: #899195 !important;
}

body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell .pc-split-builds section > p:last-child {
  color: #b7bec1 !important;
}

body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell .pc-power-path small {
  color: #929a9e !important;
}

body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell .pc-table-wrap thead th {
  color: #98a0a4 !important;
}

body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell .pc-endcap > p {
  color: var(--pc-violet) !important;
}

body.gbds-v2-pc-build-page .article .gbds-v2-pc-build-shell .pc-endcap > small {
  color: #a4acb0 !important;
}

/* Motion: progressive enhancement only -------------------------------- */

.has-pc-motion .pc-hero h1 .pc-phrase {
  animation: pc-title-in .95s var(--pc-ease) both;
}
.has-pc-motion .pc-hero h1 .pc-phrase:nth-child(2) { animation-delay: .12s; }
.has-pc-motion [data-pc-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .8s ease, transform 1s var(--pc-ease);
}
.has-pc-motion [data-pc-reveal].is-visible { opacity: 1; transform: none; }
.has-pc-motion [data-pc-media] .pc-media__frame img {
  transform: scale(1.035);
  transition: transform 1.35s var(--pc-ease);
}
.has-pc-motion [data-pc-media].is-media-visible .pc-media__frame img,
.has-pc-motion [data-pc-reveal].is-visible [data-pc-media] .pc-media__frame img { transform: scale(1); }
@keyframes pc-title-in {
  /* Keep the title readable if Safari suspends playback during a Space change. */
  from { transform: translateY(.42em); }
  to { transform: none; }
}

@media (hover: hover) {
  .pc-media__frame img { transition: transform .8s var(--pc-ease); }
  .pc-media:hover .pc-media__frame img { transform: scale(1.012); }
}

/* Responsive ------------------------------------------------------------ */

@media (max-width: 1180px) {
  .pc-first-decisions article { padding-right: 30px; padding-left: 30px; }
  .pc-gates { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pc-gates li:nth-child(4) { border-left: 0; }
  .pc-gates li:nth-child(n + 4) { border-top: 1px solid var(--pc-line); }
  .pc-first-boot-flow { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pc-first-boot-flow article:nth-child(4) { border-left: 0; }
  .pc-first-boot-flow article:nth-child(n + 4) { border-top: 1px solid var(--pc-line); }
}

@media (max-width: 900px) {
  .gbds-v2-pc-build-shell { font-size: 17px; }
  .pc-budget-controls,
  .pc-budget-readout,
  .pc-component-spread,
  .pc-build-story__content,
  .pc-case-feature,
  .pc-safety-callout { grid-template-columns: 1fr; }
  .pc-component-spread .pc-media__frame { height: auto; aspect-ratio: 16 / 10; }
  .pc-component-spread__side .pc-media__frame { aspect-ratio: 16 / 9; }
  .pc-budget-readout { gap: 24px; }
  .pc-first-decisions { grid-template-columns: 1fr; }
  .pc-first-decisions article + article { border-top: 1px solid var(--pc-line); border-left: 0; }
  .pc-editorial-columns { grid-template-columns: 1fr; }
  .pc-editorial-columns article + article { border-top: 1px solid var(--pc-line); border-left: 0; }
  .pc-build-story__content { gap: 58px; }
  .pc-case-feature { gap: 60px; }
  .pc-case-checks { width: min(680px, 100%); margin: 0 auto; }
  .pc-safety-callout { gap: 14px; }
  .pc-source-groups { grid-template-columns: 1fr; }
  .pc-source-groups section + section { border-top: 1px solid var(--pc-line); border-left: 0; }
}

@media (max-width: 760px) {
  .gbds-v2-pc-build-shell {
    --pc-gutter: clamp(18px, 5.4vw, 30px);
    --pc-section-space: clamp(88px, 20vw, 120px);
    font-size: 16px;
    line-height: 1.86;
  }
  body.admin-bar .pc-local-nav { top: 46px; }
  .pc-hero { min-height: 70svh; padding-top: 96px; padding-bottom: 96px; }
  .pc-hero h1 { font-size: clamp(35px, 9.6vw, 62px); }
  .pc-local-nav { justify-content: flex-start; gap: 24px; padding-right: 22px; padding-left: 22px; }
  .pc-local-nav a { font-size: 12px; }
  .pc-chapter-head { margin-bottom: 48px; }
  .pc-chapter-head h2 { font-size: clamp(31px, 8vw, 52px); }
  .pc-chapter-head > p:last-child:not(.pc-overline) { margin-top: 22px; font-size: 16px; }
  .pc-first-decisions { grid-template-columns: 1fr; }
  .pc-first-decisions article { padding: 32px 0; }
  .pc-first-decisions article + article { border-top: 1px solid var(--pc-line); border-left: 0; }
  .pc-first-decisions article > span { margin-bottom: 24px; }
  .pc-screen-routes article { grid-template-columns: 1fr; gap: 30px; }
  .pc-screen-routes__spec strong { font-size: clamp(58px, 17vw, 88px); }
  .pc-screen-routes h3 { font-size: clamp(31px, 8vw, 46px); }
  .pc-related-link a { align-items: flex-start; padding: 20px 0; font-size: 14px; }
  .pc-related-link span { display: none; }
  .pc-budget-row { grid-template-columns: 122px minmax(70px, 1fr) 48px; gap: 12px; }
  .pc-budget-row > div:first-child span { display: none; }
  .pc-budget-row > b { font-size: 11px; }
  .pc-platform-panel { padding-top: 28px; }
  .pc-platform-tabs button { padding-right: 12px; padding-left: 12px; font-size: 13px; }
  .pc-gates { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pc-gates li:nth-child(odd) { border-left: 0; }
  .pc-gates li:nth-child(even) { border-left: 1px solid var(--pc-line); }
  .pc-gates li:nth-child(n + 3) { border-top: 1px solid var(--pc-line); }
  .pc-editorial-columns article { padding-right: 0; padding-left: 0; }
  .pc-role-images { grid-template-columns: 1fr; gap: 50px; }
  .pc-part-ledger__head { display: none; }
  .pc-part-ledger article { grid-template-columns: 1fr; gap: 12px; padding: 27px 0; }
  .pc-part-ledger article p { font-size: 13px; }
  .pc-dark-spread { margin-bottom: calc(var(--pc-section-space) * -1); }
  .pc-gpu-specs__intro h3 { font-size: clamp(31px, 8vw, 50px); }
  .pc-build-story > header { grid-template-columns: 1fr auto; }
  .pc-build-story > header p { grid-column: 1 / -1; }
  .pc-build-story > header strong { font-size: clamp(88px, 27vw, 132px); }
  .pc-build-list dl { grid-template-columns: 94px minmax(0, 1fr); gap: 16px; }
  .pc-build-story aside h3 { font-size: clamp(29px, 8vw, 42px); }
  .pc-split-builds { grid-template-columns: 1fr; }
  .pc-split-builds section { padding-right: 0; padding-left: 0; }
  .pc-split-builds section + section { border-top: 1px solid #33393d; border-left: 0; }
  .pc-power-path { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pc-power-path li:nth-child(odd) { border-left: 0; }
  .pc-power-path li:nth-child(even) { border-left: 1px solid #343a3e; }
  .pc-power-path li:nth-child(n + 3) { border-top: 1px solid #343a3e; }
  .pc-choice-grid { grid-template-columns: 1fr; }
  .pc-choice-grid article + article { border-top: 1px solid var(--pc-line); border-left: 0; }
  .pc-checklist { grid-template-columns: 1fr; }
  .pc-checklist li { padding-right: 0; padding-left: 0; }
  .pc-checklist li:nth-child(even) { border-left: 0; }
  .pc-first-boot-flow { grid-template-columns: 1fr; }
  .pc-first-boot-flow article { padding-right: 0; padding-left: 0; }
  .pc-first-boot-flow article + article { border-top: 1px solid var(--pc-line); border-left: 0; }
  .pc-first-boot-flow article > span { margin-bottom: 25px; }
  .pc-endcap > p { font-size: clamp(36px, 10.5vw, 60px); }
}

@media (max-width: 520px) {
  .pc-disclosure { font-size: 11px; }
  .pc-hero h1 { font-size: clamp(30px, 9.6vw, 48px); }
  .pc-chapter-head h2 { font-size: clamp(25px, 7.8vw, 40px); }
  .pc-chapter-head .pc-overline { margin-bottom: 15px; }
  .pc-overline { font-size: 10px; }
  .pc-opening-visual { width: calc(100% + (var(--pc-gutter) * 2)); margin-left: calc(var(--pc-gutter) * -1); }
  .pc-opening-visual figcaption { width: calc(100% - (var(--pc-gutter) * 2)); }
  .pc-first-decisions h3,
  .pc-editorial-columns h3 { font-size: clamp(24px, 7vw, 31px); }
  .pc-segmented { gap: 7px; }
  .pc-segmented button { min-height: 41px; padding: 8px 12px; font-size: 12px; }
  .pc-budget-controls { padding-top: 30px; padding-bottom: 30px; }
  .pc-budget-row { grid-template-columns: 98px minmax(58px, 1fr) 44px; }
  .pc-budget-row > div:first-child strong { font-size: 12px; }
  .pc-budget-readout div > strong { font-size: 42px; }
  .pc-component-spread { width: calc(100% + (var(--pc-gutter) * 2)); margin-left: calc(var(--pc-gutter) * -1); }
  .pc-component-spread figcaption { padding-right: var(--pc-gutter); padding-left: var(--pc-gutter); }
  .pc-gates li { padding: 22px 12px; }
  .pc-gates span { margin-bottom: 18px; }
  .pc-role-images { width: calc(100% + (var(--pc-gutter) * 2)); margin-left: calc(var(--pc-gutter) * -1); }
  .pc-role-images figcaption { padding-right: var(--pc-gutter); padding-left: var(--pc-gutter); }
  .pc-build-story--featured { padding-right: var(--pc-gutter); padding-left: var(--pc-gutter); }
  .pc-case-feature { width: calc(100% + (var(--pc-gutter) * 2)); margin-left: calc(var(--pc-gutter) * -1); }
  .pc-case-feature figcaption,
  .pc-case-checks { width: calc(100% - (var(--pc-gutter) * 2)); margin-right: auto; margin-left: auto; }
  .pc-endcap > p { font-size: clamp(31px, 9.5vw, 48px); }
}

@media (max-width: 380px) {
  .pc-hero h1 { font-size: 30px; }
  .pc-chapter-head h2 { font-size: 25px; }
  .pc-screen-routes h3,
  .pc-case-checks h3,
  .pc-gpu-specs__intro h3,
  .pc-build-story aside h3,
  .pc-split-builds h3 { font-size: 25px; }
  .pc-budget-row { grid-template-columns: 90px minmax(48px, 1fr) 40px; gap: 9px; }
  .pc-budget-row > b { font-size: 10px; }
  .pc-platform-tabs button { font-size: 12px; }
  .pc-checklist li { grid-template-columns: 30px 1fr; gap: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .gbds-v2-pc-build-shell *,
  .gbds-v2-pc-build-shell *::before,
  .gbds-v2-pc-build-shell *::after {
    scroll-behavior: auto !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
  .has-pc-motion [data-pc-reveal] { opacity: 1 !important; transform: none !important; }
  .has-pc-motion [data-pc-media] .pc-media__frame img { transform: none !important; }
}