/* Scoped to the power station CMS landing. */
.content-shell:has(.power-repair) {
  width: min(1240px, 100%);
}
.wa-page:has(.power-repair) > h1 {
  max-width: 1040px;
  margin-bottom: 38px;
}
.power-repair {
  --power-accent: #c6d1ff;
}
.content-screen .power-repair .power-eyebrow {
  margin: 0 0 16px;
  color: var(--power-accent);
  font-size: var(--info-page-kicker-size);
  line-height: var(--type-kicker-leading);
  font-weight: var(--type-kicker-weight);
  letter-spacing: var(--type-kicker-tracking);
  text-transform: uppercase;
}
.power-repair h2 {
  margin: 0 0 20px;
}
/* H1/H2/H3 inherit the shared info-page scale through .wa-info-lead. */
.power-hero {
  display: grid;
  grid-template-columns: 1.08fr 1fr;
  align-items: center;
  gap: clamp(24px, 4vw, 58px);
}
.content-screen .power-repair .power-lead {
  margin: 0;
  max-width: 65ch;
}
.power-vendors {
  padding: 30px 0;
  border-top: 1px solid var(--theme-line);
  border-bottom: 1px solid var(--theme-line);
}
.content-screen .power-repair .power-brand-list {
  max-width: 100%;
  margin: 18px 0 0;
  color: var(--theme-text);
  font-size: var(--info-page-body-size);
  font-weight: 500;
  line-height: 1.9;
}
.power-brand-list span {
  white-space: nowrap;
}
.power-repair .wa-info-actions {
  align-items: center;
  gap: 12px;
}
.power-repair .glass-button {
  min-height: 48px;
  padding: 14px 22px;
  gap: 14px;
  text-align: center;
}
.power-repair .power-primary {
  background: linear-gradient(120deg, rgba(192, 208, 255, 0.22), rgba(133, 154, 244, 0.13));
  border-color: rgba(204, 215, 255, 0.48);
}
.content-screen .power-repair .power-note {
  font-size: 14px;
  line-height: 1.6;
  margin: 20px 0 0;
}
.power-photo {
  min-width: 0;
  margin: 0;
}
.power-photo > a {
  display: block;
  overflow: hidden;
  border: 1px solid rgba(212, 222, 255, 0.16);
  border-radius: 20px;
  background: #121723;
}
.power-photo img {
  display: block;
  width: 100%;
  height: 250px;
  object-fit: cover;
  transition: transform 0.25s ease;
}
.power-photo > a:hover img {
  transform: scale(1.025);
}
.power-photo > a:focus-visible {
  outline: 2px solid var(--power-accent);
  outline-offset: 5px;
}
.power-photo figcaption {
  padding: 12px 2px;
  color: var(--theme-muted);
  font-size: 14px;
  line-height: 1.55;
}
.power-photo--hero img {
  height: 510px;
  object-position: center 62%;
}
.power-section {
  margin-top: clamp(55px, 7vw, 94px);
  scroll-margin-top: 120px;
}
.power-section-intro {
  max-width: 820px;
  margin-bottom: 28px;
}
.power-symptoms {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--theme-line);
  border-bottom: 1px solid var(--theme-line);
}
.power-symptom {
  padding: 28px 23px;
  border-right: 1px solid var(--theme-line);
}
.power-symptom:first-child {
  padding-left: 0;
}
.power-symptom:last-child {
  border-right: 0;
}
.power-number {
  color: var(--power-accent);
  font-size: var(--type-label-size);
  letter-spacing: 0.1em;
  font-variant-numeric: tabular-nums;
}
.power-repair .power-symptom h3,
.power-repair .power-steps h3 {
  margin: 17px 0 10px;
}
.power-symptom p,
.power-steps p {
  margin: 0;
}
.power-split {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: clamp(24px, 4vw, 56px);
  align-items: center;
}
.power-split .power-photo img {
  height: 400px;
}
.power-checklist {
  list-style: none;
  padding: 0;
  margin: 22px 0;
}
.power-checklist li {
  position: relative;
  padding: 9px 0 9px 23px;
  border-bottom: 1px solid var(--theme-line);
}
.power-checklist li:before {
  content: "↗";
  position: absolute;
  left: 0;
  color: var(--power-accent);
}
.power-gallery {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px 18px;
}
.power-gallery .power-photo img {
  height: 255px;
}
.power-more {
  margin-top: 24px;
}
.power-more > summary {
  width: fit-content;
  padding: 15px 22px;
  border: 1px solid var(--theme-line);
  border-radius: 28px;
  cursor: pointer;
  font-size: var(--type-control-size);
  line-height: 1.5;
}
.power-more[open] > .power-gallery {
  margin-top: 28px;
}
.power-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 28px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.power-steps li {
  border-top: 1px solid var(--theme-line);
  padding-top: 22px;
}
.power-location {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 40px;
  padding: 36px;
  border: 1px solid var(--theme-line);
  border-radius: 24px;
  background: radial-gradient(ellipse at top right, rgba(126, 153, 255, 0.1), transparent 70%);
}
.power-location p {
  margin-bottom: 0;
}
.power-location__contact {
  align-self: center;
  border-left: 1px solid var(--theme-line);
  padding-left: 35px;
}
.power-repair .power-address {
  color: var(--theme-text);
  margin-top: 0;
  margin-bottom: 22px;
}
.power-repair .power-phone {
  font-size: clamp(1.15rem, 2vw, 1.7rem);
  text-decoration: none;
}
.power-faq details {
  border-bottom: 1px solid var(--theme-line);
  padding: 21px 0;
}
.power-faq summary {
  cursor: pointer;
  font-size: var(--info-page-body-size);
  font-weight: 500;
  color: var(--theme-text);
  line-height: 1.6;
  padding-right: 14px;
}
.power-faq details p {
  max-width: 880px;
  margin: 16px 0 0;
}
.power-end {
  border-top: 1px solid var(--theme-line);
  padding-top: 42px;
}
.power-back {
  font-size: var(--type-control-size);
  line-height: 1.5;
  padding: 12px 0;
}
.power-lightbox {
  position: fixed;
  inset: 0;
  width: min(1100px, calc(100vw - 32px));
  max-width: none;
  max-height: calc(100dvh - 32px);
  padding: 48px 20px 16px;
  border: 1px solid #535b73;
  border-radius: 18px;
  background: #0b101b;
  color: #edf0ff;
  overflow: auto;
}
.power-lightbox::backdrop {
  background: rgba(0, 0, 0, 0.88);
}
.power-lightbox figure {
  margin: 0;
  text-align: center;
}
.power-lightbox figure img {
  display: block;
  max-width: 100%;
  width: auto;
  height: auto;
  max-height: calc(100dvh - 210px);
  object-fit: contain;
  margin: 0 auto;
}
.power-lightbox figcaption {
  margin: 13px 0;
  line-height: 1.55;
  font-size: 14px;
  color: #c7cede;
}
.power-lightbox button {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  background: #20283b;
  color: #fff;
  border: 1px solid #697389;
  border-radius: 50%;
  font-size: 1.3rem;
  cursor: pointer;
}
.power-lightbox button:focus-visible,
.power-repair summary:focus-visible {
  outline: 2px solid #c6d1ff;
  outline-offset: 4px;
}
.power-lightbox__close {
  position: absolute;
  right: 10px;
  top: 8px;
}
.power-lightbox__nav {
  display: flex;
  justify-content: center;
  gap: 18px;
}
@media (max-width: 1000px) {
  .power-hero {
    grid-template-columns: 1fr 1fr;
    gap: 25px;
  }
  .power-photo--hero img {
    height: 460px;
  }
  .power-symptoms,
  .power-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .power-symptom:nth-child(2) {
    border-right: 0;
  }
  .power-symptom:nth-child(3) {
    padding-left: 0;
  }
  .power-symptom:nth-child(-n + 2) {
    border-bottom: 1px solid var(--theme-line);
  }
  .power-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .power-location {
    padding: 28px;
    gap: 25px;
  }
  .power-gallery .power-photo img {
    height: 300px;
  }
}
@media (max-width: 650px) {
  .wa-page:has(.power-repair) > h1 {
    margin-bottom: 26px;
  }
  .power-hero,
  .power-split,
  .power-location {
    grid-template-columns: 1fr;
  }
  .power-hero {
    gap: 26px;
  }
  .power-photo--hero img {
    height: auto;
    max-height: 450px;
    object-fit: cover;
  }
  .power-hero .wa-info-actions {
    align-items: stretch;
  }
  .power-hero .glass-button {
    flex: 1 1 180px;
  }
  .power-symptom {
    padding: 23px 16px;
  }
  .power-split > .power-photo {
    order: 2;
  }
  .power-split .power-photo img {
    height: 250px;
  }
  .power-gallery {
    gap: 20px 12px;
  }
  .power-gallery .power-photo img {
    height: 200px;
  }
  .power-steps {
    gap: 24px 18px;
  }
  .power-location {
    padding: 24px 20px;
  }
  .power-location__contact {
    border-left: 0;
    border-top: 1px solid var(--theme-line);
    padding: 24px 0 0;
  }
  .power-lightbox {
    width: calc(100vw - 16px);
    padding: 55px 10px 14px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .power-photo img {
    transition: none;
  }
}
/* DEBUG: uncomment to inspect section boundaries during layout review. */
/* .power-repair section { outline: 1px dashed #c6d1ff; } */

/* Make labels and prose roles explicit so generic paragraph rules cannot enlarge them. */
.content-screen .wa-page:has(.power-repair) > .content-kicker {
  font-size: var(--info-page-kicker-size);
  line-height: var(--type-kicker-leading);
}
.content-screen
  .power-repair
  p:not(.power-eyebrow):not(.power-note):not(.power-brand-list):not(.power-address),
.content-screen .power-repair .power-checklist li {
  max-width: 70ch;
}
.power-repair h2,
.power-repair h3 {
  text-wrap: balance;
}
@media (max-width: 650px) {
  /* A single column gives the shared H3 scale enough room for useful line lengths. */
  .power-symptoms,
  .power-steps {
    grid-template-columns: minmax(0, 1fr);
  }
  .power-symptom {
    padding: 23px 0;
    border-right: 0;
  }
  .power-symptom:not(:last-child) {
    border-bottom: 1px solid var(--theme-line);
  }
  .power-repair .power-vendors {
    padding: 25px 0;
  }
}

/* Contact links and the location map use the landing's shared glass treatment. */
.power-messengers {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 14px;
}
.power-repair .power-messenger {
  gap: 10px;
  padding-inline: 18px;
}
.power-messenger svg,
.power-map__header svg {
  width: 21px;
  height: 21px;
  flex: 0 0 21px;
}
.power-messenger svg {
  fill: currentColor;
}
.power-messenger .power-icon-cutout {
  fill: #171c2b;
}
.power-repair .power-messenger--telegram {
  color: #acdfff;
  border-color: rgba(113, 198, 255, 0.32);
  background: rgba(54, 151, 211, 0.1);
}
.power-repair .power-messenger--viber {
  color: #d9c5ff;
  border-color: rgba(177, 137, 255, 0.32);
  background: rgba(138, 94, 209, 0.1);
}
.power-repair .power-messenger:hover {
  border-color: currentColor;
}
.power-messenger:focus-visible,
.power-map .glass-button:focus-visible {
  outline: 2px solid var(--power-accent);
  outline-offset: 4px;
}
.power-map {
  padding: 32px;
  border: 1px solid var(--theme-line);
  border-radius: 24px;
  background: radial-gradient(ellipse at top left, rgba(126, 153, 255, 0.11), transparent 65%);
}
.power-map__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  margin-bottom: 28px;
}
.power-map__header > div {
  min-width: 0;
}
.power-map__header > .glass-button {
  flex-shrink: 0;
}
.power-map__header h2 {
  margin-bottom: 14px;
}
.power-repair .power-map__header .power-address {
  margin-bottom: 0;
}
.power-map__canvas {
  overflow: hidden;
  border: 1px solid var(--theme-line);
  border-radius: 18px;
  background: #e8ebef;
}
.power-map__frame {
  display: block;
  width: 100%;
  height: 420px;
  border: 0;
  color-scheme: light;
}
.content-screen .power-repair .power-map__note {
  margin-top: 18px;
}
@media (max-width: 800px) {
  .power-map__header {
    align-items: flex-start;
    flex-direction: column;
    gap: 20px;
  }
}
@media (max-width: 650px) {
  .power-map {
    padding: 24px 16px;
  }
  .power-map__frame {
    height: 340px;
  }
  .power-map__canvas {
    border-radius: 14px;
  }
  .power-messengers .power-messenger {
    flex: 1 1 120px;
  }
  .power-map__header > .glass-button {
    width: 100%;
  }
}
