/* drivebro — Rechtliches und Systemseiten: impressum.html, agb.html, datenschutz.html, bildnachweis.html, 404.html. Klassen mit Präfix re-. */

/* ---------- Vorschau- und Entwurf-Hinweis ---------- */
.re-vorschau{margin-bottom:12px;font-size:15px}
.re-vorschau p{margin:0}
.re-vorschau + .re-raster{margin-top:clamp(24px,3vw,40px)}
.re-vorschau .re-knopfzeile{margin:12px 0 0}
.re-entwurf{display:flex;gap:14px;align-items:flex-start;padding:16px 20px;border-radius:var(--radius-feld);background:var(--bernstein-flaeche);color:#6E4300;font-size:15px;line-height:1.55;margin-bottom:clamp(28px,3vw,44px);border:1px solid rgba(178,106,0,.18)}
.re-entwurf .ic{width:20px;height:20px;flex:none;margin-top:2px}
.re-entwurf p{margin:0}
.re-entwurf b{color:#5A3600}

/* ---------- Text mit Inhaltsverzeichnis ---------- */
.re-raster{display:grid;grid-template-columns:240px minmax(0,1fr);gap:clamp(28px,5vw,80px);align-items:start}
.re-seite{position:sticky;top:calc(var(--kopf-h) + 24px);min-width:0}
.re-inhalt h2{font-size:14px;letter-spacing:0;color:var(--grau);font-weight:700;margin-bottom:10px}
.re-inhalt ol{list-style:none;margin:0;padding:0;border-left:2px solid var(--linie)}
.re-inhalt a{display:block;padding:6px 0 6px 16px;margin-left:-2px;border-left:2px solid transparent;font-size:14.5px;line-height:1.35;color:var(--text)}
.re-inhalt a:hover{color:var(--tinte);border-left-color:var(--linie-stark)}
.re-text{max-width:74ch;min-width:0}
.re-text h2{font-size:clamp(21px,1.9vw,25px);line-height:1.2;margin:44px 0 12px;scroll-margin-top:calc(var(--kopf-h) + 24px)}
.re-text h2:first-child{margin-top:0}
.re-text h3{font-size:18px;margin:24px 0 8px}
.re-text h2+h3{margin-top:4px}
.re-text p,.re-text li{font-size:16.5px;line-height:1.7;color:var(--text)}
.re-text p{margin:0 0 14px}
.re-text ul{margin:0 0 16px;padding:0;list-style:none}
.re-text li{position:relative;padding-left:24px;margin-bottom:7px}
.re-text li::before{content:"";position:absolute;left:4px;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--akzent)}
.re-text a:not(.knopf):not(.tlink){color:var(--akzent);font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.re-text b{color:var(--tinte)}
.re-platz{padding:1px 6px;border-radius:6px;background:var(--bernstein-flaeche);color:#6E4300;font-weight:600;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.re-stand{margin-top:40px!important;font-size:14px!important;color:var(--grau)!important}

/* Angaben-Karte (Impressum) */
.re-karte{padding:clamp(20px,2.6vw,32px);margin-bottom:12px}
.re-karte dl{display:grid;grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:0;margin:0}
.re-karte dt,.re-karte dd{padding:11px 0;border-bottom:1px solid var(--linie);font-size:16px}
.re-karte dt{color:var(--grau)}
.re-karte dd{margin:0;color:var(--tinte);font-weight:600}
.re-karte dl>:nth-last-child(-n+2){border-bottom:0}

.re-knopfzeile{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin:6px 0 18px}

/* Pakettabelle in den AGB */
.re-tabelle-rahmen{margin:6px 0 20px;overflow:hidden}
.re-tabelle{width:100%;border-collapse:collapse;font-size:15px;line-height:1.45}
.re-tabelle th,.re-tabelle td{padding:11px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--linie)}
.re-tabelle thead th{background:var(--flaeche);color:var(--akzent-dunkel);font-weight:700}
.re-tabelle tbody th{font-weight:600;color:var(--grau);width:34%}
.re-tabelle td{font-weight:600;color:var(--tinte)}
.re-tabelle tbody tr:last-child>*{border-bottom:0}
.re-tabelle-rahmen:has(> .re-deckel){max-width:560px}
.re-deckel tbody th{width:50%}
.re-vorschlag{margin:6px 0 16px!important;padding:12px 16px;border-radius:12px;background:var(--bernstein-flaeche);color:#6E4300!important;font-size:15px!important}
.re-vorschlag b{color:#5A3600}

/* ---------- Bildnachweis ---------- */
.re-filterzeile{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;margin-bottom:28px}
.re-filter{display:flex;align-items:center;gap:10px;flex:1 1 320px;max-width:520px;height:50px;padding:0 8px 0 18px;border-radius:999px}
.re-filter .ic{width:19px;height:19px;color:var(--grau);flex:none}
.re-filter input{flex:1;min-width:0;height:100%;border:0;outline:0;background:none;font-size:16px;color:var(--tinte)}
.re-filter:focus-within{box-shadow:var(--feld-fokus)}
.re-zahl{font-size:14.5px;color:var(--grau)}
.re-gruppe{margin-top:36px}
.re-gruppe:first-child{margin-top:0}
.re-gruppe[hidden]{display:none}
.re-gruppe h2{font-size:21px;margin-bottom:12px}
.re-bilder{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,380px),1fr));gap:12px}
.re-bild{display:grid;grid-template-columns:112px minmax(0,1fr);gap:16px;align-items:start;padding:12px;min-width:0;border-radius:var(--radius);box-shadow:var(--schatten-klein)}
.re-bild[hidden]{display:none}
.re-bild-vorschau{aspect-ratio:4/3;border-radius:12px;overflow:hidden;background:var(--flaeche)}
.re-bild-vorschau img{width:100%;height:100%;object-fit:cover}
.re-bild-text{min-width:0;font-size:14px;line-height:1.45;color:var(--text)}
.re-bild-text b{display:block;font-size:14.5px;color:var(--tinte);overflow-wrap:anywhere;margin-bottom:3px}
.re-bild-text span{display:block;overflow-wrap:anywhere}
.re-bild-text a{color:var(--akzent);font-weight:600}
.re-bild-text a:hover{text-decoration:underline}
.re-leer{display:grid;justify-items:center;gap:12px;text-align:center;padding:48px 20px}
.re-leer .glas{--s:72px}
.re-leer h2{font-size:22px}
.re-leer p{margin:0;max-width:52ch;color:var(--grau)}

/* ---------- 404 ---------- */
.re-404{max-width:860px}
.re-suche{display:flex;align-items:center;gap:10px;max-width:640px;margin-top:28px;padding:8px 8px 8px 22px;border-radius:999px}
.re-suche>.ic{width:21px;height:21px;color:var(--grau);flex:none}
.re-suche input{flex:1;min-width:0;height:46px;border:0;outline:0;background:none;color:var(--tinte);font-size:17px}
.re-suche input::placeholder{color:var(--grau-hell)}
.re-suche:focus-within{box-shadow:0 0 0 3px color-mix(in srgb,var(--akzent) 16%,transparent),var(--schatten)}
.re-wege{list-style:none;margin:0;padding:0;border-bottom:1px solid var(--linie);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px}
.re-wege li{border-top:1px solid var(--linie)}
.re-wege a{display:grid;grid-template-columns:48px minmax(0,1fr) 18px;gap:16px;align-items:center;padding:18px 0}
.re-wege .glas{--s:48px}
.re-wege b{display:block;font-size:17.5px;color:var(--tinte)}
.re-wege small{display:block;font-size:14px;color:var(--grau)}
.re-wege a>.ic{width:16px;height:16px;color:var(--grau);transition:transform .3s var(--weich)}
.re-wege a:hover b{color:var(--akzent)}
.re-wege a:hover>.ic{transform:translateX(3px)}

/* ---------- Tablet und Telefon ---------- */
@media (max-width:1100px){
  .re-raster{grid-template-columns:minmax(0,1fr)}
  .re-seite{position:static}
  .re-inhalt ol{display:flex;flex-wrap:wrap;gap:8px;border:0}
  .re-inhalt a{margin:0;padding:7px 13px;border:1px solid var(--linie-stark);border-radius:999px;font-size:14px;background:rgba(255,255,255,.7)}
}
@media (max-width:760px){
  .re-karte dl{grid-template-columns:minmax(0,1fr)}
  .re-pakete,.re-pakete tbody,.re-pakete tr,.re-pakete th,.re-pakete td{display:block;width:auto}
  .re-pakete thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .re-pakete tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 10px;padding:12px 14px;border-bottom:1px solid var(--linie)}
  .re-pakete tbody tr:last-child{border-bottom:0}
  .re-pakete th,.re-pakete td{padding:0;border:0;font-size:14px}
  .re-pakete tbody th{grid-column:1/-1;width:auto;color:var(--tinte);font-weight:700;margin-bottom:2px}
  .re-pakete td::before{content:attr(data-titel);display:block;font-size:12px;font-weight:600;color:var(--grau)}
  .re-karte dt{padding-bottom:0;border-bottom:0}
  .re-karte dd{padding-top:2px}
  .re-bild{grid-template-columns:88px minmax(0,1fr);gap:12px}
  .re-wege{grid-template-columns:minmax(0,1fr)}
  .re-suche{padding-left:16px}
  .re-suche input{font-size:16px}
}