.solar-page {
  --solar-line: color-mix(in srgb, currentColor 30%, transparent);
  --solar-surface: color-mix(in srgb, currentColor 5%, transparent);
}
.solar-page h1 { overflow-wrap: anywhere; }
.solar-page :is(h2,h3) { line-height: 1.18; }
.solar-keyfacts, .solar-steps, .solar-specs {
  display: grid;
  gap: 14px;
}
.solar-keyfacts, .solar-specs { grid-template-columns: repeat(2,minmax(0,1fr)); }
.solar-keyfacts { margin: 0; }
.solar-keyfacts div, .solar-steps li, .solar-specs article {
  padding: clamp(16px,2.3vw,30px);
  border: 1px solid var(--solar-line);
  background: var(--solar-surface);
}
.solar-keyfacts dt { font-size: 12px; line-height: 1.4; }
.solar-keyfacts dd {
  margin: 12px 0 0;
  font-size: clamp(18px,2.4vw,32px);
  line-height: 1.15;
  font-weight: 700;
}
.solar-components {
  display: grid;
  grid-template-columns: minmax(0,2.3fr) minmax(0,1fr);
  gap: clamp(24px,4vw,64px);
  align-items: center;
}
.solar-page #componenti {
  isolation: isolate;
  background: var(--bg);
}
.solar-figure {
  position: relative;
  margin: 0;
  padding-inline: clamp(6px, 1vw, 16px);
}
.solar-figure::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: -8% -5% -2%;
  filter: blur(clamp(22px, 3vw, 48px));
  background: radial-gradient(
    ellipse farthest-corner at 48% 45%,
    #d5dfe5 10%,
    #abbec8 44%,
    #758d9c 65%,
    transparent 94%
  );
  pointer-events: none;
}
html:has(.palette-picker[data-light="true"]) .solar-figure::before { content: none; }
.solar-diagram {
  display: block;
  cursor: zoom-in;
}
.solar-diagram img {
  display: block;
  width: 100%;
  height: auto;
  mix-blend-mode: multiply;
}
.solar-figure figcaption {
  margin-top: 13px;
  font-size: 12px;
  line-height: 1.6;
}
.solar-figure figcaption a { text-decoration: underline; text-underline-offset: .2em; }
.solar-part-list { margin: 0; }
.solar-part-list div { padding: 15px 0; border-top: 1px solid var(--solar-line); }
.solar-part-list dt, .solar-specs dt { font-weight: 700; }
.solar-part-list dd {
  margin: 6px 0 0;
  font-size: 14px;
  line-height: 1.65;
}
.solar-steps {
  padding: 0;
  margin: 25px 0 0;
  grid-template-columns: repeat(3,minmax(0,1fr));
  list-style: none;
}
.solar-steps h3, .solar-specs h3, .solar-sites h3 { margin: 0 0 12px; font-size: 20px; }
.solar-steps p, .solar-sites p { margin: 0; }
.solar-sites { max-width: 780px; margin-top: 34px; }
.solar-specs dl { margin: 0; }
.solar-specs dl div {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1.6fr);
  gap: 14px;
  padding: 12px 0;
  border-top: 1px solid var(--solar-line);
  font-size: 13px;
  line-height: 1.55;
}
.solar-specs dd { margin: 0; }
@media (max-width: 900px) {
  .solar-components { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .solar-steps, .solar-specs { grid-template-columns: 1fr; }
}
