/* Themenseite Platinenreparatur (app/content/seiten/platinenreparatur.php) */

/* Kopf */
.pl-kopf .gross { max-width: 44ch; }
.pl-kopf__zeile { margin: 22px 0 0; font: 400 .8rem/1.6 var(--din); letter-spacing: .12em; text-transform: uppercase; color: var(--text-hell-2); }
@media (max-width: 599px) { .pl-kopf__zeile span { display: block; height: 0; overflow: hidden; } }

/* Überschrift links (klebt), Befundliste rechts */
.pl-raster { display: grid; gap: 32px; align-items: start; }
@media (min-width: 960px) {
  .pl-raster { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 72px; }
  .pl-raster__kopf { position: sticky; top: calc(var(--kopf-h) + 32px); }
}
.pl-raster__kopf p:not(.etikett) { color: var(--text-2); max-width: 40ch; }

.befunde { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--schwarz); counter-reset: befund; }
.befunde li { counter-increment: befund; position: relative; padding: 22px 0 20px 46px; border-bottom: 1px solid var(--alu); }
.befunde li::before { content: counter(befund, decimal-leading-zero); position: absolute; left: 0; top: 24px; font: 700 .95rem var(--din); color: var(--rot); letter-spacing: .04em; }
.befunde .h4 { font-size: 1.25rem; margin-bottom: .4em; }
.befunde p { margin: 0; color: var(--text-2); max-width: 62ch; }
.befunde a { color: var(--schwarz); }
.befunde a:hover { color: var(--rot); }

/* Mikrolöten: Text + Maßstab */
.pl-loeten p:not(.etikett) { max-width: 60ch; }
.pl-loeten__bild { display: grid; gap: 28px; align-content: start; }
@media (min-width: 900px) { .pl-loeten__bild { padding-top: 64px; } }
.massstab { margin: 0; background: #fff; border: 1px solid var(--alu); border-radius: 4px; padding: 28px 24px 20px; }
.massstab svg { width: 100%; height: auto; overflow: visible; }
.massstab__koerper { fill: var(--graphit); }
.massstab__kappe { fill: #B9BDC4; }
.massstab__teil--klein .massstab__koerper { fill: var(--schwarz); }
.massstab__name { font: 700 22px var(--din); fill: var(--schwarz); letter-spacing: .02em; }
.massstab__mass { font: 400 16px var(--din); fill: var(--stahl); }
.massstab__teil--klein .massstab__name { fill: var(--rot); }
.massstab__bemassung { fill: none; stroke: var(--rot); stroke-width: 2; }
.massstab__lineal path { fill: none; stroke: var(--schwarz); stroke-width: 2; }
.massstab__zahl { font: 700 18px var(--din); fill: var(--schwarz); }
.massstab figcaption { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--alu); font-size: .9rem; color: var(--stahl); }
@media (max-width: 599px) {
  .massstab { padding: 18px 12px 14px; }
  .massstab__name { font-size: 30px; }
  .massstab__mass { font-size: 22px; }
  .massstab__zahl { font-size: 26px; }
}

/* Geräte */
.pl-geraete { display: grid; gap: 36px 32px; margin-top: 12px; }
@media (min-width: 700px) { .pl-geraete { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .pl-geraete { grid-template-columns: repeat(4, 1fr); } }
.pl-geraet { border-top: 2px solid var(--schwarz); padding-top: 22px; display: flex; flex-direction: column; }
.pl-geraet .h4 { font-size: 1.25rem; margin-bottom: .5em; }
.pl-geraet p { color: var(--text-2); }
.pl-geraet__links { list-style: none; margin: auto 0 0; padding: 0; display: grid; gap: 2px; }
.pl-geraet__links a { display: inline-flex; padding-block: 6px; color: var(--schwarz); }
.pl-geraet__links a:hover { color: var(--rot); }

/* Preise */
.pl-preise__kopf { display: grid; gap: 8px 72px; margin-bottom: 36px; }
@media (min-width: 960px) { .pl-preise__kopf { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); align-items: end; } }
.pl-preise__kopf > p { color: var(--text-2); max-width: 60ch; margin-bottom: .6em; }
.pl-preise { display: grid; gap: 40px 28px; }
@media (min-width: 900px) {
  .pl-preise { grid-template-columns: repeat(3, 1fr); }
  .pl-preise .preisband { grid-template-columns: 1fr; }
  .pl-preise__gruppe--phone { grid-column: 1 / -1; }
  .pl-preise .pl-preise__gruppe--phone .preisband { grid-template-columns: repeat(4, 1fr); }
}
@media (min-width: 600px) and (max-width: 899px) { .pl-preise .pl-preise__gruppe--phone .preisband { grid-template-columns: 1fr 1fr; } }
.pl-preise__titel { font: 400 .78rem var(--din); letter-spacing: .16em; text-transform: uppercase; color: var(--stahl); margin: 0 0 12px; }
.pl-preise .preisband li { align-items: baseline; }
.pl-preise .preisband a { text-decoration: none; font-weight: 600; }
.pl-preise .preisband a:hover { text-decoration: underline; color: var(--rot); }
.pl-preise__fuss { display: grid; gap: 36px 72px; margin-top: 48px; }
@media (min-width: 960px) { .pl-preise__fuss { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); align-items: start; } }
.pl-preise__hinweis { color: var(--text-2); max-width: 56ch; }
.pl-preise__fuss .suche { max-width: 560px; }
.pl-abgrenzung { border-left: 3px solid var(--rot); padding: 4px 0 4px 20px; }
.pl-abgrenzung p { margin: 0; color: var(--text-2); }
.pl-abgrenzung a { color: var(--schwarz); }
.pl-abgrenzung a:hover { color: var(--rot); }

/* gleicher Ab-Preis überall: Zeilen ohne Preis, am Handy die Smartphones zweispaltig */
@media (max-width: 599px) { .pl-preise--einheit .pl-preise__gruppe--phone .preisband { grid-template-columns: 1fr 1fr; column-gap: 16px; } }
.pl-nb { white-space: nowrap; }

/* Grenzen und Zusagen */
.pl-zusagen { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--schwarz); align-self: start; }
.pl-zusagen li { display: grid; gap: 4px; padding: 16px 0; border-bottom: 1px solid var(--alu); }
.pl-zusagen strong { font: 700 1.1rem var(--din); }
.pl-zusagen span { color: var(--text-2); }
.pl-zusagen a { color: var(--schwarz); }
.pl-zusagen a:hover { color: var(--rot); }