/* Computers page only. Shared theme, navigation and service modules remain independent. */
.cp-page { --cp-navy:var(--navy,#022c5d); --cp-teal:var(--cyan,#007f9f); --cp-orange:var(--action,#b94018); --cp-ink:var(--ink,#22384b); --cp-muted:var(--muted,#536776); --cp-line:var(--line,#d7e0e8); --cp-warm:#f7f4ef; color:var(--cp-ink); font-size:1.125rem; line-height:1.65; }
.cp-page *, .cp-page *::before, .cp-page *::after { box-sizing:border-box; }
.cp-page .cp-wrap { width:min(1200px,calc(100% - 64px)); margin-inline:auto; }
.cp-page h1,.cp-page h2,.cp-page h3 { color:var(--cp-navy); margin:0 0 20px; font-weight:700; letter-spacing:-.025em; line-height:1.17; }
.cp-page h1 { font-size:clamp(2.625rem,4.3vw,3.625rem); font-weight:800; }
.cp-page h2 { font-size:clamp(1.875rem,3vw,2.4375rem); }
.cp-page h3 { font-size:1.375rem; letter-spacing:-.015em; line-height:1.3; }
.cp-page p { margin:0 0 20px; }
.cp-page figure { margin:0; }
.cp-page img { display:block; width:100%; height:auto; }
.cp-page a { text-underline-offset:4px; }
.cp-page a:focus-visible,.cp-page summary:focus-visible { outline:3px solid var(--cp-teal); outline-offset:5px; }
.cp-page [id] { scroll-margin-top:24px; }
.cp-page .cp-section { padding-block:72px; }
.cp-page .cp-eyebrow { font-size:0.75rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase; color:var(--cp-teal); line-height:1.6; margin-bottom:20px; }
.cp-page .cp-hero { background:linear-gradient(110deg,#fff 38%,#f5f3ef); padding-block:44px; border-bottom:1px solid #eee9e1; }
.cp-page .cp-hero-grid { display:grid; grid-template-columns:1.1fr 1fr; align-items:center; gap:70px; }
.cp-page .cp-hero-copy { padding-block:12px; }
.cp-page .cp-hero-copy h1 { margin-bottom:26px; }
.cp-page .cp-hero-copy h1 em { color:var(--cp-teal); font-style:normal; }
.cp-page .cp-lead { font-size:1.25rem; line-height:1.6; }
.cp-page .cp-hero-copy > p { max-width:590px; }
.cp-page .cp-hero-photo { width:min(100%,480px); justify-self:end; border-radius:var(--radius,12px); overflow:hidden; }
.cp-page .cp-hero-photo img { aspect-ratio:1122/1402; object-fit:contain; }
.cp-page .cp-actions { display:flex; align-items:center; flex-wrap:wrap; gap:16px 28px; margin:30px 0 16px; }
.cp-page .cp-button { display:inline-flex; align-items:center; justify-content:center; gap:18px; padding:13px 21px; min-height:50px; border:1px solid var(--cp-orange); border-radius:7px; background:var(--cp-orange); color:#fff; font-size:1rem; font-weight:700; line-height:1.5; text-decoration:none; }
.cp-page .cp-button:hover { background:#993615; border-color:#993615; color:#fff; }
.cp-page .cp-text-link { display:inline-flex; align-items:center; gap:12px; color:var(--cp-navy); font-size:1rem; font-weight:700; min-height:44px; }
.cp-page .cp-text-link:hover,.cp-page .cp-quiet-link:hover,.cp-page .cp-address:hover { color:var(--cp-teal); }
.cp-page .cp-text-link span { color:var(--cp-teal); }
.cp-page .cp-quiet-link { display:inline-block; min-height:44px; padding-block:8px; color:var(--cp-muted); font-size:0.9375rem; }
.cp-page .cp-start h2 { margin-bottom:32px; }
.cp-page .cp-route-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px; }
.cp-page .cp-route { border-top:1px solid var(--cp-line); padding-top:22px; }
.cp-page .cp-route h3 { font-size:1.4375rem; margin-bottom:15px; }
.cp-page .cp-route p { margin:0; }
.cp-page .cp-advice { background:var(--cp-warm); }
.cp-page .cp-advice-grid { display:grid; grid-template-columns:.82fr 1.4fr; gap:86px; }
.cp-page .cp-accent { display:block; width:48px; height:4px; background:var(--cp-teal); margin:5px 0 25px; }
.cp-page .cp-advice h2 { font-size:clamp(2.125rem,3.3vw,2.6875rem); line-height:1.2; }
.cp-page .cp-advice-copy p:last-child { margin-bottom:0; }
.cp-page .cp-advice-promise { color:var(--cp-navy); border-top:1px solid #dcd5ca; padding-top:22px; margin-top:24px; }
.cp-page .cp-components { padding-top:76px; background:linear-gradient(#fff 0,#fff 135px,var(--cp-warm) 460px); }
.cp-page .cp-section-intro { max-width:880px; margin-inline:auto; }
.cp-page .cp-centered { text-align:center; }
.cp-page .cp-section-intro p { max-width:790px; margin-inline:auto; }
.cp-page .cp-components .cp-section-intro p { text-wrap:balance; }
.cp-page .cp-component-layout { position:relative; display:grid; grid-template-columns:1fr 400px 1fr; grid-template-rows:minmax(280px,auto) minmax(280px,auto) auto; column-gap:45px; max-width:1120px; margin:48px auto 28px; }
.cp-page .cp-connectors { position:absolute; inset:0; width:100%; height:100%; z-index:2; color:#5c9fa7; pointer-events:none; opacity:0; }
.cp-page .cp-central-pc { grid-column:2; grid-row:1/3; z-index:1; align-self:start; margin-top:22px; border-radius:var(--radius,12px); overflow:hidden; }
.cp-page .cp-central-pc img { aspect-ratio:1122/1402; object-fit:contain; }
.cp-page .cp-component { position:relative; z-index:3; text-align:center; width:100%; max-width:228px; justify-self:center; }
.cp-page .cp-component-photo { width:156px; height:156px; border-radius:50%; border:1px solid #a8d1d5; background:#fff; padding:4px; margin:0 auto 14px; overflow:hidden; }
.cp-page .cp-component-photo img { width:100%; height:100%; border-radius:50%; object-fit:cover; }
.cp-page .cp-component h3 { font-size:1.4375rem; margin-bottom:7px; }
.cp-page .cp-component p { margin:0 auto; max-width:210px; font-size:1.0625rem; line-height:1.55; }
.cp-page .cp-processor { grid-column:1; grid-row:1; }
.cp-page .cp-memory { grid-column:3; grid-row:2; }
.cp-page .cp-storage { grid-column:2; grid-row:3; }
.cp-page .cp-graphics { grid-column:1; grid-row:2; }
.cp-page .cp-cooling { grid-column:3; grid-row:1; }
.cp-page .cp-component-caption { text-align:center; color:var(--cp-muted); font-size:1rem; margin:0 auto 30px; }
.cp-page .cp-brands-note { max-width:850px; margin:0 auto; padding-top:26px; border-top:1px solid #dfd9d0; }
.cp-page .cp-gallery { background:var(--cp-navy); color:#e9f0f5; }
.cp-page .cp-gallery-intro { display:grid; grid-template-columns:.85fr 1.15fr; align-items:start; gap:70px; margin-bottom:34px; }
.cp-page .cp-gallery h2 { color:#fff; font-size:2.5rem; }
.cp-page .cp-gallery-intro p { margin:0; }
.cp-page .cp-gallery-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:26px 24px; }
.cp-page .cp-gallery-grid figure { min-width:0; }
.cp-page .cp-gallery-frame { display:block; position:relative; background:#e8e5e0; overflow:hidden; border-radius:var(--radius,12px); aspect-ratio:1/1; }
.cp-page .cp-gallery-frame img { width:100%; height:100%; object-fit:contain; }
.cp-page .cp-gallery-feature { grid-row:span 2; }
.cp-page .cp-gallery-feature .cp-gallery-frame { aspect-ratio:auto; height:calc(100% - 42px); min-height:580px; }
.cp-page .cp-gallery-detail .cp-gallery-frame img { object-fit:cover; }
.cp-page .cp-gallery figcaption { color:#edf5f9; padding-top:11px; font-size:0.9375rem; line-height:1.5; }
.cp-page .cp-gallery-note { color:#cbdfe9; margin:30px 0 0; font-size:1.0625rem; }
.cp-page .cp-process h2 { max-width:680px; margin-bottom:36px; }
.cp-page .cp-process-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px; list-style:none; margin:0; padding:0; }
.cp-page .cp-process-grid li { margin:0; position:relative; border-top:1px solid var(--cp-line); padding-top:28px; }
.cp-page .cp-step-number { display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; border:1px solid #bed8df; border-radius:50%; background:#edf6f7; color:var(--cp-teal); font-size:1rem; font-weight:700; margin-bottom:20px; }
.cp-page .cp-process-grid h3 { margin-bottom:14px; }
.cp-page .cp-process-grid p { margin:0; }
.cp-page .cp-thinking { padding:26px 30px; margin:40px 0 0; background:#edf6f7; border-left:3px solid var(--cp-teal); border-radius:0 7px 7px 0; }
.cp-page .cp-thinking h3 { color:var(--cp-navy); margin:0 0 12px; }
.cp-page .cp-thinking p { color:var(--cp-navy); max-width:960px; margin:0; }
.cp-page .cp-faq { padding-top:0; }
.cp-page .cp-faq-grid { display:grid; grid-template-columns:.82fr 1.4fr; gap:86px; }
.cp-page .cp-faq h2 { max-width:340px; }
.cp-page .cp-faq-list { border-top:1px solid var(--cp-line); }
.cp-page .cp-faq-list details { border-bottom:1px solid var(--cp-line); }
.cp-page .cp-faq-list summary { display:flex; align-items:center; justify-content:space-between; gap:26px; cursor:pointer; color:var(--cp-navy); font-size:1.125rem; font-weight:700; line-height:1.5; padding:23px 0; list-style:none; }
.cp-page .cp-faq-list summary::-webkit-details-marker { display:none; }
.cp-page .cp-faq-list summary::after { content:'+'; color:var(--cp-teal); flex:none; font-size:1.6875rem; line-height:1; font-weight:400; }
.cp-page .cp-faq-list details[open] summary::after { content:'−'; }
.cp-page .cp-faq-list details > div { padding:0 34px 23px 0; }
.cp-page .cp-faq-list details p { margin:0; }
.cp-page .cp-faq-list details p + p { margin-top:16px; }
.cp-page .cp-closing { padding-block:46px; background:#edf6f7; border-top:1px solid #d6e7e9; }
.cp-page .cp-closing-grid { display:grid; grid-template-columns:1.3fr 1fr; gap:65px; align-items:center; }
.cp-page .cp-closing h2 { font-size:2.125rem; max-width:590px; }
.cp-page .cp-closing p { margin-bottom:17px; }
.cp-page .cp-address { display:inline-block; padding-block:6px; font-size:1rem; color:var(--cp-muted); }
.cp-page .cp-closing-actions { display:flex; flex-direction:column; align-items:flex-start; justify-self:end; gap:15px; }
.cp-page .cp-closing-actions .cp-text-link { font-size:0.9375rem; }
@media (max-width:1120px) and (min-width:901px) {
  .cp-page .cp-hero-grid { gap:38px; }
  .cp-page .cp-hero-copy > p { font-size:1.0625rem; }
  .cp-page .cp-hero-copy .cp-lead { font-size:1.125rem; }
  .cp-page .cp-hero-copy h1 { font-size:2.8125rem; }
  .cp-page .cp-component-layout { grid-template-columns:1fr 36vw 1fr; column-gap:20px; grid-template-rows:minmax(270px,auto) minmax(270px,auto) auto; }
  .cp-page .cp-component p { max-width:185px; }
  .cp-page .cp-gallery-feature .cp-gallery-frame { min-height:490px; }
}
@media (max-width:900px) {
  .cp-page .cp-wrap { width:calc(100% - 40px); }
  .cp-page .cp-section { padding-block:52px; }
  .cp-page .cp-hero { padding-block:32px; }
  .cp-page .cp-hero-grid { grid-template-columns:1fr; gap:30px; }
  .cp-page .cp-hero-copy { max-width:680px; }
  .cp-page .cp-hero-copy > p { max-width:none; }
  .cp-page .cp-hero h1 { font-size:3rem; }
  .cp-page .cp-hero-photo { width:min(100%,420px); justify-self:center; }
  .cp-page .cp-route-grid,.cp-page .cp-process-grid { gap:24px; }
  .cp-page .cp-route h3,.cp-page .cp-process-grid h3 { font-size:1.3125rem; }
  .cp-page .cp-route p,.cp-page .cp-process-grid p { font-size:1.0625rem; }
  .cp-page .cp-advice-grid { grid-template-columns:1fr; gap:18px; }
  .cp-page .cp-advice h2 { font-size:2.25rem; }
  .cp-page .cp-advice h2 br { display:none; }
  .cp-page .cp-advice h2 br::after { content:' '; }
  .cp-page .cp-components { background:var(--cp-warm); }
  .cp-page .cp-component-layout { display:grid; grid-template-columns:1fr; grid-template-rows:none; gap:0; max-width:600px; margin:30px auto 24px; }
  .cp-page .cp-connectors { display:none; }
  .cp-page .cp-central-pc { grid-column:auto; grid-row:auto; width:min(100%,360px); margin:0 auto 34px; }
  .cp-page .cp-component { display:flex; align-items:center; gap:24px; grid-column:auto; grid-row:auto; max-width:none; text-align:left; border-top:1px solid #ddd7cd; padding:19px 0; }
  .cp-page .cp-component-photo { width:96px; height:96px; flex:0 0 96px; margin:0; padding:3px; }
  .cp-page .cp-component h3 { margin-bottom:5px; font-size:1.375rem; }
  .cp-page .cp-component p { max-width:none; }
  .cp-page .cp-component-caption { max-width:600px; }
  .cp-page .cp-gallery-intro { grid-template-columns:1fr; gap:0; max-width:700px; }
  .cp-page .cp-gallery-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px 24px; }
  .cp-page .cp-gallery-feature { grid-column:1/-1; grid-row:auto; }
  .cp-page .cp-gallery-feature .cp-gallery-frame { aspect-ratio:5/4; height:auto; min-height:0; }
  .cp-page .cp-gallery-feature .cp-gallery-frame img { object-fit:contain; }
  .cp-page .cp-faq { padding-top:0; }
  .cp-page .cp-faq-grid { grid-template-columns:1fr; gap:8px; }
  .cp-page .cp-faq h2 { max-width:none; }
  .cp-page .cp-closing-grid { grid-template-columns:1fr; gap:24px; }
  .cp-page .cp-closing-actions { justify-self:start; }
}
@media (max-width:680px) {
  .cp-page .cp-route-grid,.cp-page .cp-process-grid { grid-template-columns:1fr; gap:28px; }
  .cp-page .cp-route h3,.cp-page .cp-process-grid h3 { font-size:1.4375rem; }
  .cp-page .cp-route p,.cp-page .cp-process-grid p { font-size:1.125rem; }
  .cp-page .cp-step-number { margin-bottom:14px; }
}
@media (max-width:600px) {
  .cp-page { font-size:1.0625rem; }
  .cp-page .cp-section { padding-block:40px; }
  .cp-page .cp-hero { padding-block:26px 30px; }
  .cp-page .cp-hero-copy { padding:0; }
  .cp-page .cp-hero h1 { font-size:2.5rem; }
  .cp-page .cp-hero-copy h1 { margin-bottom:22px; }
  .cp-page h2 { font-size:1.875rem; }
  .cp-page .cp-lead { font-size:1.125rem; }
  .cp-page .cp-eyebrow { font-size:0.6875rem; letter-spacing:.07em; margin-bottom:18px; }
  .cp-page .cp-actions { margin-top:24px; gap:10px 24px; }
  .cp-page .cp-button { padding:12px 18px; }
  .cp-page .cp-hero-photo { max-width:380px; }
  .cp-page .cp-advice-grid { gap:10px; }
  .cp-page .cp-advice h2 { font-size:2.125rem; }
  .cp-page .cp-accent { margin-bottom:20px; }
  .cp-page .cp-centered { text-align:left; }
  .cp-page .cp-component-layout { margin-top:28px; }
  .cp-page .cp-central-pc { width:min(calc(100% - 24px),340px); }
  .cp-page .cp-component { gap:20px; }
  .cp-page .cp-component-caption { text-align:left; font-size:0.9375rem; margin-bottom:24px; }
  .cp-page .cp-brands-note { padding-top:23px; }
  .cp-page .cp-gallery h2 { font-size:2.125rem; }
  .cp-page .cp-gallery-grid { grid-template-columns:1fr; gap:28px; }
  .cp-page .cp-gallery-feature { grid-column:auto; }
  .cp-page .cp-gallery-frame,.cp-page .cp-gallery-feature .cp-gallery-frame { aspect-ratio:1122/1402; max-height:none; }
  .cp-page .cp-gallery-detail .cp-gallery-frame { aspect-ratio:1; }
  .cp-page .cp-gallery figcaption { padding-top:12px; font-size:1rem; }
  .cp-page .cp-gallery-note { margin-top:26px; }
  .cp-page .cp-process h2 { margin-bottom:28px; }
  .cp-page .cp-process-grid li { padding-top:22px; }
  .cp-page .cp-thinking { margin-top:30px; padding:22px; }
  .cp-page .cp-faq { padding-top:0; }
  .cp-page .cp-faq-list summary { padding-block:20px; font-size:1.0625rem; gap:18px; }
  .cp-page .cp-faq-list details > div { padding-right:5px; }
  .cp-page .cp-closing { padding-block:34px; }
  .cp-page .cp-closing h2 { font-size:1.875rem; }
}
@media (max-width:360px) {
  .cp-page .cp-wrap { width:calc(100% - 32px); }
  .cp-page .cp-hero h1 { font-size:2.25rem; }
  .cp-page .cp-component { gap:14px; }
  .cp-page .cp-component h3 { font-size:1.3125rem; }
  .cp-page .cp-component p { font-size:1rem; }
}

/* Photo-bound connectors: measured from the actual image and circular thumbnails. */
.cp-page .cp-connectors[data-ready] { opacity:1; }
.cp-page .cp-connectors polyline { stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke; }
.cp-page .cp-connectors circle { fill:#007f91; }
.cp-page .cp-gallery-open { cursor:zoom-in; text-decoration:none; }
.cp-page .cp-gallery-open:focus-visible { outline:3px solid #b9eeee; outline-offset:6px; }
.cp-page .cp-enlarge { position:absolute; right:10px; bottom:10px; display:flex; gap:10px; align-items:center; border:1px solid #667785; border-radius:6px; padding:8px 11px; background:#fff; color:#022c5d; font-size:.875rem; font-weight:700; line-height:1.4; box-shadow:0 2px 8px #0002; }
.cp-page .cp-gallery-open:hover .cp-enlarge { background:#e3f2f4; }

/* Gallery dialog lives on the browser top layer, outside the page's content wrapper. */
.cp-lightbox { box-sizing:border-box; max-width:none; max-height:none; width:min(1120px,calc(100% - 40px)); height:min(960px,calc(100dvh - 40px)); padding:0; border:1px solid #516675; border-radius:12px; background:#102c42; color:#fff; overflow:hidden; }
.cp-lightbox::backdrop { background:rgba(3,17,29,.88); }
.cp-lightbox *, .cp-lightbox *::before, .cp-lightbox *::after { box-sizing:border-box; }
.cp-lightbox-panel { display:flex; flex-direction:column; height:100%; min-height:0; padding:14px 18px 18px; }
.cp-lightbox-toolbar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px 20px; flex:none; }
.cp-lightbox-position { margin:0; color:#dce9f1; font:500 1rem/1.5 Roboto,Arial,sans-serif; }
.cp-lightbox button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-width:48px; min-height:48px; padding:10px 15px; border:1px solid #8cabbc; border-radius:7px; color:#fff; background:#173b55; font:700 1rem/1.4 Roboto,Arial,sans-serif; cursor:pointer; }
.cp-lightbox button:hover { background:#245371; }
.cp-lightbox button:focus-visible,.cp-lightbox a:focus-visible { outline:3px solid #ffd088; outline-offset:3px; }
.cp-lightbox-stage { display:grid; grid-template-columns:max-content minmax(0,1fr) max-content; align-items:center; gap:14px; flex:1; min-height:0; padding-top:12px; }
.cp-lightbox-figure { display:flex; flex-direction:column; min-width:0; min-height:0; height:100%; margin:0; }
.cp-lightbox-image { display:block; width:100%; flex:1; min-height:0; object-fit:contain; }
.cp-lightbox figcaption { flex:none; padding-top:12px; margin:0; color:#fff; font:400 1rem/1.5 Roboto,Arial,sans-serif; text-align:center; }
.cp-lightbox-status { margin:8px 0 0; font:400 1rem/1.5 Roboto,Arial,sans-serif; text-align:center; }
.cp-lightbox-status:empty { display:none; }
.cp-lightbox-original { color:#c8f0f2; }
@media(max-width:600px){
  .cp-lightbox { width:calc(100% - 16px); height:calc(100dvh - 16px); border-radius:9px; }
  .cp-lightbox-panel { padding:10px; }
  .cp-lightbox-stage { grid-template-columns:1fr 1fr; grid-template-rows:minmax(0,1fr) auto; gap:12px; }
  .cp-lightbox-figure { grid-column:1/-1; grid-row:1; }
  .cp-lightbox-prev { grid-column:1; grid-row:2; justify-self:start; }
  .cp-lightbox-next { grid-column:2; grid-row:2; justify-self:end; }
}

body.cp-lightbox-open { overflow:hidden; }
.cp-lightbox:not([open]),.cp-lightbox [hidden] { display:none !important; }

@media(min-width:601px){ .cp-lightbox-prev,.cp-lightbox-next { white-space:nowrap; } }
@media(max-width:600px){ .cp-lightbox .cp-lightbox-prev,.cp-lightbox .cp-lightbox-next { font-size:.875rem; padding-inline:8px; } }

/* Allow enlarged text to reflow without widening the phone layout. */
.cp-page h1,.cp-page h2,.cp-page h3 { overflow-wrap:anywhere; }
@media(max-width:900px){
  .cp-page .cp-component-layout,.cp-page .cp-gallery-intro { grid-template-columns:minmax(0,1fr); }
  .cp-page .cp-component { min-width:0; flex-wrap:wrap; }
  .cp-page .cp-component > div:last-child { flex:1 1 min-content; min-width:0; }
}