/* Service page layout — extends styles.css, no visual overload */
.service-page .hero.page-hero{
  min-height:0;
  align-items:flex-end;
}
.service-page .hero.page-hero .hero-copy{
  padding:56px 0 36px;
  max-width:740px;
}
.service-page h1,
.service-page .hero-subtitle{
  overflow-wrap:break-word;
}
.service-page .hero-hook{
  margin:0 0 18px;
  font-size:18px;
  color:#d7e6f3;
  font-weight:700;
}
.service-page .hero-actions .btn{
  min-height:50px;
}

.breadcrumbs{
  position:relative;
  z-index:3;
  padding:14px 0 0;
}
.breadcrumbs ol{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:0;
  margin:0;
  padding:0;
  list-style:none;
  font-size:13px;
  color:#9eb0c0;
}
.breadcrumbs li{
  display:flex;
  align-items:center;
}
.breadcrumbs li + li::before{
  content:">";
  margin:0 8px;
  color:#6f8498;
  font-weight:700;
}
.breadcrumbs a{
  color:#9ec9ea;
  min-height:32px;
  display:inline-flex;
  align-items:center;
}
.breadcrumbs a:hover{color:#fff}
.breadcrumbs [aria-current="page"]{color:#e8f2fb;font-weight:700}

.device-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin:0 0 10px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#79c8ff;
}
.device-kicker span{
  width:8px;height:8px;border-radius:50%;
  background:var(--device-accent, var(--blue));
}

.device-ps5{--device-accent:#2e6dff}
.device-hdmi{--device-accent:#4aa3ff}
.device-xbox{--device-accent:#3ddc84}
.device-nintendo{--device-accent:#e60012}
.device-steam{--device-accent:#66c0f4}
.device-console{--device-accent:#159cff}

.service-page.device-ps5 .hero.page-hero{border-bottom:2px solid rgba(46,109,255,.35)}
.service-page.device-xbox .hero.page-hero{border-bottom:2px solid rgba(61,220,132,.28)}
.service-page.device-nintendo .hero.page-hero{border-bottom:2px solid rgba(230,0,18,.28)}
.service-page.device-steam .hero.page-hero{border-bottom:2px solid rgba(102,192,244,.32)}
.service-page.device-hdmi .hero.page-hero{border-bottom:2px solid rgba(74,163,255,.5)}

.model-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}
.model-card{
  background:#0b1d31;
  border:1px solid rgba(255,255,255,.075);
  border-radius:16px;
  padding:20px;
  display:flex;
  flex-direction:column;
  min-height:220px;
  border-top:3px solid var(--device-accent, var(--blue));
}
.model-card h2,.model-card h3{margin:0 0 10px;font-size:20px}
.model-card p{color:#aebccc;margin:0 0 12px;font-size:14px}
.model-card ul{
  margin:0 0 16px;
  padding-left:18px;
  color:#c5d2de;
  font-size:14px;
  display:grid;
  gap:4px;
}
.model-card a.text-button{margin-top:auto}
.model-note{
  font-size:13px;
  color:#9fb0c0;
  margin:16px 0 0;
}

.fault-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
}
.fault-card{
  background:rgba(11,29,49,.85);
  border:1px solid rgba(255,255,255,.07);
  border-radius:14px;
  padding:18px;
}
.fault-card h3{
  margin:0 0 8px;
  font-size:15px;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.fault-card p{margin:0;color:#aebccc;font-size:15px}
.fault-card a{
  display:inline-flex;
  margin-top:10px;
  color:#55baff;
  font-weight:800;
  min-height:40px;
  align-items:center;
}

.feature-block{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:28px;
  align-items:center;
  padding:28px;
  border-radius:18px;
  background:linear-gradient(180deg,rgba(13,31,50,.98),rgba(6,18,31,.98));
  border:1px solid rgba(63,170,255,.28);
}
.feature-block:not(:has(.image-slot:not([hidden]))){
  grid-template-columns:1fr;
}
.feature-block h2{margin-bottom:12px}
.feature-block p{color:#c2cfdd;margin:0 0 16px}
.diagnosis-block{
  padding:28px;
  border-radius:18px;
  border-left:4px solid var(--device-accent, var(--blue));
  background:rgba(7,21,34,.72);
}
.diagnosis-block h2{font-size:clamp(24px,3vw,34px)}
.symptom-list{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:12px;
  margin:0;
  padding:0;
  list-style:none;
}
.symptom-list li{
  padding:14px 16px;
  border-radius:12px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.07);
  font-weight:700;
}
.price-ready{
  padding:18px 20px;
  border-radius:14px;
  background:#071522;
  border:1px solid rgba(255,255,255,.08);
}
.price-ready p,.policy-panel p{margin:0 0 10px;color:#c2cfdd}
.price-ready p:last-child,.policy-panel p:last-child{margin-bottom:0}
[data-business-slot]:empty{display:none}
.image-slot{
  min-height:160px;
  border:1px dashed rgba(76,180,255,.28);
  border-radius:14px;
  background:rgba(8,24,40,.7);
  color:#7aa0bb;
  font-size:13px;
  display:grid;
  place-items:center;
  text-align:center;
  padding:16px;
}
.image-slot.follow{margin-top:18px}
.collection-callout{
  display:grid;
  grid-template-columns:1fr auto;
  gap:20px;
  align-items:center;
  padding:24px;
  border-radius:16px;
  background:linear-gradient(180deg,#071a2c 0%, #081625 100%);
  border:1px solid rgba(47,162,255,.18);
}
.collection-callout p{margin:8px 0 0;color:#a8b8c8}
.footer-links{
  display:flex;
  flex-wrap:wrap;
  gap:8px 18px;
  justify-content:flex-end;
}
.footer-links a{
  color:#9ec9ea;
  min-height:40px;
  display:inline-flex;
  align-items:center;
  font-weight:700;
  font-size:13px;
}
.footer-links a:hover{color:#fff}
.service-page .footer-grid{align-items:flex-start}

@media(max-width:1024px){
  .model-grid{grid-template-columns:repeat(2,1fr)}
  .feature-block,.collection-callout{grid-template-columns:1fr}
}

@media(max-width:768px){
  .service-page .hero.page-hero .hero-copy{padding:88px 0 24px}
  .fault-grid,.symptom-list{grid-template-columns:1fr}
  .collection-callout .btn{width:100%}
}

@media(max-width:640px){
  .model-grid{grid-template-columns:1fr}
  .breadcrumbs{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .breadcrumbs ol{flex-wrap:nowrap;white-space:nowrap;padding-bottom:4px}
  .feature-block,.diagnosis-block,.collection-callout{padding:18px}
}

/* ——————————————————————————————————————
   Money page: phone/tablet/laptop/battery
   —————————————————————————————————————— */
.device-phone{--device-accent:#159cff}
.device-iphone{--device-accent:#8acdff}
.device-samsung{--device-accent:#1d6fe8}
.device-tablet{--device-accent:#46c6ff}
.device-laptop{--device-accent:#5ab4ff}
.device-board{--device-accent:#ff9a3c}
.device-micro{--device-accent:#ff6b6b}
.device-battery{--device-accent:#3ddc84}
.device-ebike{--device-accent:#00c875}

.service-page.device-phone .hero.page-hero{border-bottom:2px solid rgba(21,156,255,.35)}
.service-page.device-iphone .hero.page-hero{border-bottom:2px solid rgba(138,205,255,.4)}
.service-page.device-samsung .hero.page-hero{border-bottom:2px solid rgba(29,111,232,.4)}
.service-page.device-tablet .hero.page-hero{border-bottom:2px solid rgba(70,198,255,.35)}
.service-page.device-laptop .hero.page-hero{border-bottom:2px solid rgba(90,180,255,.35)}
.service-page.device-board .hero.page-hero{border-bottom:2px solid rgba(255,154,60,.35)}
.service-page.device-micro .hero.page-hero{border-bottom:2px solid rgba(255,107,107,.35)}
.service-page.device-battery .hero.page-hero{border-bottom:2px solid rgba(61,220,132,.35)}
.service-page.device-ebike .hero.page-hero{border-bottom:2px solid rgba(0,200,117,.35)}

/* Category card grid (phone hub, laptop hub) */
.category-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.category-card{
  background:#0b1d31;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  padding:24px 20px 20px;
  display:flex;
  flex-direction:column;
  border-top:3px solid var(--device-accent,var(--blue));
}
.category-card h2,.category-card h3{margin:0 0 8px;font-size:18px}
.category-card p{color:#a8b8c8;margin:0 0 16px;font-size:14px;flex:1}

/* Fault symptom pill list */
.fault-pills{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  list-style:none;
  margin:0;
  padding:0;
}
.fault-pills li{
  padding:8px 14px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:999px;
  font-size:14px;
  font-weight:600;
  color:#c5d2de;
}

/* Model selector */
.model-selector{
  background:#071a2c;
  border:1px solid rgba(47,162,255,.2);
  border-radius:18px;
  padding:24px;
  margin-bottom:24px;
}
.model-selector label{
  display:block;
  font-size:13px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#9ec9ea;
  margin-bottom:8px;
}
.model-selector select{
  width:100%;
  padding:12px 14px;
  background:#071522;
  border:1px solid rgba(255,255,255,.12);
  border-radius:10px;
  color:#f7faff;
  font-size:16px;
  font-weight:600;
  appearance:none;
  -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%239ec9ea' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  cursor:pointer;
}
.model-selector select:focus{
  outline:2px solid #7dd3ff;
  outline-offset:2px;
}
.model-price-result{
  margin-top:16px;
  padding:16px;
  background:rgba(21,156,255,.07);
  border:1px solid rgba(76,180,255,.22);
  border-radius:12px;
  display:none;
}
.model-price-result.is-visible{display:block;color:#d5e6f5;font-size:14px}
.model-price-result .repair-rows{
  list-style:none;margin:0;padding:0;display:grid;gap:8px;
}
.model-price-result .repair-row{
  display:flex;justify-content:space-between;align-items:baseline;
  gap:12px;font-size:15px;
}
.model-price-result .repair-row .label{color:#c2cfdd;font-weight:600}
.model-price-result .repair-row .val{color:#e8f4ff;font-weight:800;white-space:nowrap}
.model-price-result .repair-cta{
  display:block;
  margin-top:14px;
  text-align:center;
}

/* Price matrix table (desktop) / accordion (mobile) */
.price-matrix-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.price-matrix{
  width:100%;
  border-collapse:collapse;
  font-size:14px;
}
.price-matrix th{
  text-align:left;
  padding:10px 12px;
  background:#071a2c;
  color:#9ec9ea;
  font-size:12px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.price-matrix td{
  padding:10px 12px;
  border-bottom:1px solid rgba(255,255,255,.05);
  color:#e0ecf7;
  vertical-align:middle;
}
.price-matrix tr:last-child td{border-bottom:none}
.price-matrix td:first-child{font-weight:700}
.price-matrix a.val-price,
.price-accordion-body a.val-price,
.repair-row a.val{
  color:#e8f4ff;
  font-weight:800;
  text-underline-offset:3px;
}
.price-matrix .val-ask{color:#9eb0c0;font-style:italic}
.price-matrix .val-hidden{display:none}
.price-matrix .val-assess{color:#ffb74d;font-weight:700}
.price-matrix tbody tr:hover td{background:rgba(255,255,255,.02)}

/* Accordion price list — shown on mobile */
.price-accordion{display:none}
.price-accordion-item{
  border-bottom:1px solid rgba(255,255,255,.06);
}
.price-accordion-trigger{
  width:100%;
  background:none;
  border:none;
  text-align:left;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:14px 0;
  font-size:15px;
  font-weight:700;
  color:#e8f4ff;
  cursor:pointer;
  gap:12px;
}
.price-accordion-trigger::after{
  content:"▾";
  font-size:14px;
  color:#9ec9ea;
  flex-shrink:0;
  transition:transform .2s;
}
.price-accordion-trigger[aria-expanded="true"]::after{transform:rotate(180deg)}
.price-accordion-body{
  display:none;
  padding:0 0 14px;
}
.price-accordion-body.is-open{display:block}
.price-accordion-body ul{
  list-style:none;margin:0;padding:0;display:grid;gap:8px;
}
.price-accordion-body li{
  display:flex;justify-content:space-between;gap:12px;
  font-size:14px;color:#c2cfdd;
}
.price-accordion-body li strong{color:#e8f4ff;white-space:nowrap}

/* Battery safety message */
.battery-safety-box{
  padding:20px 22px;
  border-radius:16px;
  background:rgba(61,220,132,.07);
  border:2px solid rgba(61,220,132,.35);
}
.battery-safety-box h3{margin:0 0 8px;color:#3ddc84;font-size:16px;text-transform:uppercase;letter-spacing:.06em}
.battery-safety-box p{margin:0 0 10px;color:#c8dece}
.battery-safety-box p:last-child{margin:0}

/* Service capability list */
.capability-list{
  list-style:none;margin:0;padding:0;display:grid;gap:10px;
}
.capability-list li{
  display:flex;align-items:flex-start;gap:10px;
  font-size:15px;color:#c2cfdd;
}
.capability-list li::before{
  content:"→";
  color:var(--device-accent,var(--blue));
  font-weight:800;
  flex-shrink:0;
  line-height:1.6;
}

/* Brand tag grid */
.brand-pills{
  display:flex;flex-wrap:wrap;gap:8px;
  list-style:none;margin:0;padding:0;
}
.brand-pills li{
  padding:6px 14px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  font-size:13px;font-weight:700;
  color:#c5d2de;
  background:rgba(255,255,255,.03);
}

/* Diagnostic info box */
.diag-box{
  display:flex;
  align-items:center;
  gap:16px;
  padding:18px 22px;
  border-radius:14px;
  background:#071522;
  border:1px solid rgba(255,255,255,.1);
}
.diag-box-price{
  font-size:34px;
  font-weight:900;
  color:#f7faff;
  white-space:nowrap;
}
.diag-box-text{color:#a8b8c8;font-size:14px}
.diag-box-text strong{color:#e8f4ff;display:block;margin-bottom:2px}

/* Responsive adjustments */
@media(max-width:1024px){
  .category-grid{grid-template-columns:repeat(2,1fr)}
}
.static-price-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-top:16px;
}
.static-price-note{
  grid-column:1 / -1;
  margin:0 0 4px;
  color:#a8b8c8;
  font-size:14px;
}
.static-price-card{
  min-width:0;
  background:rgba(7,26,44,.55);
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  padding:14px 16px;
}
.static-price-card h3{
  margin:0 0 10px;
  font-size:16px;
  color:#e8f4ff;
}
.static-price-card dl{
  margin:0;
  display:grid;
  gap:8px;
}
.static-price-card dl > div{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:12px;
  font-size:14px;
}
.static-price-card dt{
  color:#c2cfdd;
  font-weight:600;
}
.static-price-card dd{
  margin:0;
  font-weight:800;
  white-space:nowrap;
}
.static-price-card a{
  color:#e8f4ff;
  text-decoration:underline;
  text-underline-offset:3px;
}
.static-price-cta{
  margin:12px 0 0;
  font-size:13px;
}
.static-price-card.is-highlighted{
  border-color:rgba(76,180,255,.8);
  box-shadow:0 0 0 1px rgba(76,180,255,.35);
}
.static-price-block p{margin:0 0 8px}
.static-warranty ul{
  margin:10px 0 0;
  padding-left:18px;
  color:#c2cfdd;
}
.static-warranty li{margin:4px 0}
@media(max-width:768px){
  .category-grid{grid-template-columns:repeat(2,1fr)}
  .static-price-list{grid-template-columns:minmax(0,1fr)}
  .static-price-card dl > div{flex-wrap:wrap}
}
@media(max-width:540px){
  .category-grid{grid-template-columns:1fr}
  .diag-box{flex-direction:column;align-items:flex-start;gap:8px}
}