/* Badenweiler Ausblick — Impressum und Datenschutz.
   Ruhige Lesefassung derselben Marke: Creme-Grund, Tanne als Schrift- und
   Linienfarbe, Messing für die Marker. Bewusst schlicht — Rechtstexte werden
   gelesen, nicht bewundert. Werte aus dem CI-Manual (:root der Projektseite). */
:root{
  --tanne:#1F3A2E; --tanne-tief:#152720;
  --sandstein:#C2A57B; --mokka:#5C463A;
  --messing:#9F8654; --messing-hell:#C0A469;
  --creme:#F4EFE6; --creme-warm:#EFE8DB; --stein:#E2D9C9;
  --line:#E0D7C6; --soft:#6E685E;
  --serif:"Bodoni Moda","Didot","Bodoni 72",Cormorant Garamond,Georgia,serif;
  --sans:"Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --maxw:760px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--creme);color:var(--tanne-tief);font-family:var(--sans);
  font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased}
a{color:var(--mokka);text-decoration:none;border-bottom:1px solid rgba(92,70,58,.32)}
a:hover{color:var(--tanne)}
img{max-width:100%;display:block}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(22px,5vw,32px)}

nav{position:sticky;top:0;z-index:20;background:rgba(244,239,230,.92);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
nav .in{max-width:var(--maxw);margin:0 auto;padding:14px clamp(22px,5vw,32px);
  display:flex;align-items:center;justify-content:space-between;gap:16px}
nav .logo{height:38px;width:auto;border:0}
nav .zurueck{font-size:14px;color:var(--soft);border:0}
nav .zurueck:hover{color:var(--tanne)}

header.kopf{padding:clamp(48px,8vw,88px) 0 clamp(26px,4vw,38px)}
header.kopf .eyebrow{font-family:var(--sans);font-size:11.5px;letter-spacing:.28em;
  text-transform:uppercase;color:var(--messing);font-weight:500}
header.kopf h1{font-family:var(--serif);font-weight:400;font-size:clamp(36px,6.4vw,58px);
  line-height:1.06;margin:16px 0 0;color:var(--tanne)}
header.kopf .stand{color:var(--soft);font-size:14.5px;margin-top:16px}

main{padding-bottom:clamp(56px,8vw,96px)}
section.block{padding:clamp(26px,4vw,38px) 0;border-top:1px solid var(--line)}
h2{font-family:var(--serif);font-weight:500;font-size:clamp(22px,3.3vw,28px);
  line-height:1.2;margin:0 0 14px;color:var(--tanne)}
h3{font-family:var(--sans);font-weight:600;font-size:16px;margin:22px 0 8px;color:var(--tanne)}
p{color:var(--soft);margin:0 0 12px}
p b,li b,td b{color:var(--tanne-tief);font-weight:600}
ul{list-style:none;margin:0 0 14px}
li{color:var(--soft);padding-left:20px;position:relative;margin-bottom:8px}
li::before{content:"";position:absolute;left:2px;top:12px;width:5px;height:5px;
  background:var(--messing);border-radius:50%}
.karte{background:var(--creme-warm);border:1px solid var(--line);
  border-left:2px solid var(--messing);padding:20px 22px;margin:0 0 14px}
.karte p{margin-bottom:4px;color:var(--tanne-tief)}
.karte p:last-child{margin-bottom:0}
table{width:100%;border-collapse:collapse;margin:0 0 14px;font-size:15px}
th,td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:top}
th{color:var(--tanne);font-weight:600;font-size:13px;letter-spacing:.03em;width:34%}
td{color:var(--soft)}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13.5px;
  background:var(--stein);padding:1px 5px;border-radius:2px;color:var(--tanne-tief)}

footer{background:var(--tanne);color:rgba(244,239,230,.72);
  padding:clamp(32px,5vw,48px) 0;font-size:13.5px}
footer .in{display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between}
footer a{border:0;color:rgba(244,239,230,.72)}
footer a:hover{color:var(--creme)}
@media(max-width:600px){ th{width:auto} table,tbody,tr,th,td{display:block}
  th{border:0;padding-bottom:2px} td{padding-top:0;border-bottom:1px solid var(--line)} }