/* Laptop-Datenrettung (app/content/seiten/laptop-datenrettung.php) – nur Ergänzungen zu site.css */

/* Kopf: Text links, Bauteil-Zeichnung mit Preis rechts */
.ldr-kopf { padding-top: 28px; }
.ldr-kopf__raster { display: grid; gap: 40px; align-items: center; }
@media (min-width: 960px) { .ldr-kopf__raster { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 64px; } }
.ldr-kopf .h1 { font-size: clamp(2.1rem, 1.4rem + 2.9vw, 3.9rem); }
.ldr-kopf .gross { max-width: 50ch; }
.ldr-kopf p:not(.gross):not(.etikett):not(.vertrauenszeile) { color: var(--text-2); max-width: 56ch; }

.ldr-bauteil { margin: 0; padding: 28px 28px 22px; background: var(--werkbank); border-radius: 4px; border-top: 2px solid var(--schwarz); }
.ldr-bauteil__bild { margin: 0; }
.ldr-bauteil figcaption { margin: 14px 0 20px; font-size: .9rem; line-height: 1.5; color: var(--stahl); }
@media (max-width: 520px) { .ldr-bauteil { padding: 20px 16px 16px; } }

.ldr-ssd { width: 100%; height: auto; overflow: visible; }
.ldr-ssd__platine { fill: #fff; stroke: var(--schwarz); stroke-width: 1.6; stroke-linejoin: round; }
.ldr-ssd__pin { fill: var(--stahl); opacity: .55; }
.ldr-ssd__chip { fill: var(--graphit); stroke: var(--graphit); stroke-width: 1; }
.ldr-ssd__punkt { fill: var(--stahl); }
.ldr-ssd__klein { fill: var(--stahl); opacity: .7; }
.ldr-ssd__nand { fill: rgb(160 0 0 / .07); stroke: var(--rot); stroke-width: 1.6; }
.ldr-ssd__linie { fill: none; stroke: var(--stahl); stroke-width: 1; }
.ldr-ssd__linie--rot { stroke: var(--rot); }
.ldr-ssd__text { font: 500 12px var(--mono); fill: var(--stahl); }
.ldr-ssd__text--rot { fill: var(--rot); }
@media (max-width: 520px) { .ldr-ssd__text { font-size: 13px; } }

.ldr-preisliste { margin: 0; border-top: 1px solid var(--alu); }
.ldr-preisliste div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 12px 0; border-bottom: 1px dashed var(--alu); }
.ldr-preisliste dt { font-size: .95rem; }
.ldr-preisliste dd { margin: 0; font: 700 1.15rem/1 var(--din); color: var(--rot); white-space: nowrap; }
.ldr-klein { margin: 10px 0 0; font-size: .85rem; color: var(--stahl); }

/* Drei Fälle – wie ein Befundbogen */
.ldr-faelle { list-style: none; margin: 40px 0 0; padding: 0; display: grid; gap: 0 40px; border-top: 2px solid var(--schwarz); }
@media (min-width: 900px) { .ldr-faelle { grid-template-columns: repeat(3, 1fr); } }
.ldr-faelle li { display: flex; flex-direction: column; align-items: flex-start; padding: 22px 0 28px; border-bottom: 1px solid var(--alu); }
@media (min-width: 900px) { .ldr-faelle li { border-bottom: 0; } }
.ldr-faelle .h4 { font-size: 1.3rem; }
.ldr-faelle__nr { margin: 0 0 .6em; font: 700 .82rem/1 var(--din); letter-spacing: .2em; text-transform: uppercase; color: var(--rot); }
.ldr-faelle p:not(.ldr-faelle__nr) { color: var(--text-2); }
.ldr-faelle .pfeil-link { color: var(--schwarz); font-size: .95rem; margin-top: 4px; }
.ldr-faelle .pfeil-link:hover { color: var(--rot); }

/* BitLocker */
.ldr-bitlocker > * { min-width: 0; }   /* lange Adressen dürfen die Spalte nicht aufdrücken */
.ldr-text p:not(.etikett) { color: var(--text-2); max-width: 60ch; }
.ldr-schluessel { border-radius: 4px; align-self: start; }
.ldr-schluessel p { color: var(--text-2); }
.ldr-schluessel__muster { display: grid; grid-template-columns: repeat(4, max-content); gap: 6px 0; margin: 10px 0 0; font: 500 .95rem/1.2 var(--mono); color: var(--stahl); letter-spacing: .06em; }
@media (max-width: 520px) { .ldr-schluessel__muster { font-size: .8rem; letter-spacing: .02em; } .ldr-schluessel { padding: 24px 20px; } }
.ldr-schluessel__muster span:not(:last-child)::after { content: "-"; margin: 0 .25em; color: var(--alu); }
.ldr-schluessel__muster span:nth-child(4n)::after { content: none; }   /* kein Strich am Zeilenende */
.ldr-schluessel .ldr-klein { margin: 6px 0 18px; }
.ldr-schluessel .ldr-klein:last-child { margin-bottom: 0; }
.ldr-schritte-klein { list-style: none; counter-reset: sk; margin: 0 0 18px; padding: 0; border-top: 1px solid var(--alu); }
.ldr-schritte-klein li { counter-increment: sk; position: relative; padding: 12px 0 12px 34px; border-bottom: 1px solid var(--alu); color: var(--text-2); font-size: .98rem; }
.ldr-schritte-klein li::before { content: counter(sk); position: absolute; left: 0; top: 12px; width: 22px; height: 22px; border: 1.5px solid var(--rot); border-radius: 50%;
  display: grid; place-items: center; font: 700 .8rem/1 var(--din); color: var(--rot); }
.ldr-schluessel a { color: var(--rot); overflow-wrap: anywhere; }

/* Häufige Fälle */
.ldr-liste { margin: 32px 0 0; display: grid; gap: 0 56px; }
@media (min-width: 860px) { .ldr-liste { grid-template-columns: 1fr 1fr; } }
.ldr-liste div { padding: 20px 0 22px; border-top: 1px solid var(--alu); }
.ldr-liste dt { font: 700 1.2rem/1.25 var(--din); margin-bottom: .4em; }
.ldr-liste dd { margin: 0; color: var(--text-2); max-width: 60ch; }
.ldr-liste a { color: var(--rot); }

/* Was man lassen sollte */
.ldr-nicht { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--graphit-2); align-self: start; }
.ldr-nicht li { position: relative; padding: 16px 0 16px 34px; border-bottom: 1px solid var(--graphit-2); color: var(--text-hell-2); }
.ldr-nicht li::before { content: ""; position: absolute; left: 2px; top: 1.55em; width: 16px; height: 2px; background: var(--glut); }
.ldr-nicht code { color: var(--text-hell); }

/* Ablauf und Preis */
.ldr-ab { margin: 8px 0 4px; font-family: var(--din); line-height: 1; }
.ldr-ab span { font-size: 1.1rem; color: var(--stahl); margin-right: .2em; }
.ldr-ab strong { font-size: clamp(2.6rem, 2rem + 2.2vw, 3.6rem); color: var(--rot); letter-spacing: -.02em; }
.ldr-ab__zusatz { margin: 0 0 1.2em; font-size: .95rem; color: var(--stahl); }
#ablauf .weg__kopf p:not(.etikett):not(.ldr-ab):not(.ldr-ab__zusatz):not(.knopf-reihe) { color: var(--text-2); max-width: 46ch; }
#ablauf .schritte p a { color: var(--rot); }
#ablauf .ldr-modellhinweis { margin-top: 18px; font-size: .9rem; }
.ldr-modellhinweis a { color: var(--rot); }

/* Andere Geräte – die FAQ folgt direkt, darum unten weniger Luft */
.ldr-andere { padding-bottom: 0; }
.ldr-weiter-raster { margin-top: 32px; gap: 32px; }
.ldr-weiter { display: flex; flex-direction: column; gap: 10px; padding-top: 22px; border-top: 2px solid var(--schwarz); text-decoration: none; color: var(--schwarz); }
.ldr-weiter__titel { font: 700 clamp(1.3rem, 1.15rem + .6vw, 1.6rem)/1.15 var(--din); }
.ldr-weiter__text { color: var(--text-2); }
.ldr-weiter .pfeil-link { color: var(--rot); margin-top: 2px; }
.ldr-weiter:hover { color: var(--schwarz); border-top-color: var(--rot); }
.ldr-weiter:hover .ldr-weiter__titel { color: var(--rot); }
.ldr-hinweis { margin: 40px 0 0; padding-top: 20px; border-top: 1px solid var(--alu); color: var(--text-2); max-width: 80ch; }
.ldr-hinweis a { color: var(--schwarz); }
.ldr-hinweis a:hover { color: var(--rot); }