/* Gemeinsames Aussehen fuer Impressum & Datenschutz.
   Gleiche Farben und Schriften wie die Startseite, nur ruhiger. */

:root{
  --navy:        #0A1326;
  --line:        rgba(199, 212, 232, 0.16);
  --line-strong: rgba(199, 212, 232, 0.38);
  --silver:      #C7D4E8;
  --silver-dim:  #99A9C7;
  --silver-bright:#EAF1FB;
  --gold:        #CBA76A;
  --panel:       linear-gradient(180deg, rgba(22,33,60,.75), rgba(13,22,42,.7));
  --f-head: "Cinzel", Georgia, serif;
  --f-body: "EB Garamond", Georgia, serif;
  --ease: cubic-bezier(.22,.61,.36,1);
}

*{ box-sizing: border-box; }

body{
  margin:0;
  font-family: var(--f-body);
  font-size: 1.075rem;
  line-height: 1.75;
  color: var(--silver);
  background: var(--navy);
  background-image:
    radial-gradient(90% 55% at 50% -5%, rgba(199,212,232,.09), transparent 65%),
    radial-gradient(80% 45% at 50% 105%, rgba(203,167,106,.09), transparent 60%);
  background-attachment: fixed;
  -webkit-font-smoothing: antialiased;
}

a{ color: var(--silver-bright); text-decoration-color: var(--line-strong); text-underline-offset:3px; }
a:hover{ color: var(--gold); }
a:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; border-radius:2px; }
::selection{ background: rgba(203,167,106,.32); color:#fff; }

.page{ max-width: 74ch; margin-inline:auto; padding: clamp(2rem,6vw,4.5rem) clamp(1.25rem,5vw,3rem) 4rem; }

.back{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family: var(--f-head); font-size:.72rem; letter-spacing:.18em; text-transform:uppercase;
  color: var(--silver-dim); text-decoration:none; transition: color .2s var(--ease);
}
.back:hover{ color: var(--gold); }

.masthead{ text-align:center; margin: clamp(2rem,6vw,3.5rem) 0 clamp(2rem,5vw,3rem); }
.masthead img{ width: clamp(120px,20vw,170px); height:auto; margin:0 auto 1.2rem; display:block; opacity:.9; }
.masthead .eyebrow{
  display:block; font-family: var(--f-head); font-size:.7rem; letter-spacing:.34em;
  text-transform:uppercase; color: var(--gold); margin-bottom:.7rem;
}
h1{
  font-family: var(--f-head); font-weight:600; color:#fff; margin:0;
  font-size: clamp(2rem,5vw,2.9rem); letter-spacing:.02em; line-height:1.15;
}
h2{
  font-family: var(--f-head); font-weight:600; color: var(--silver-bright);
  font-size: clamp(1.15rem,2.6vw,1.4rem); letter-spacing:.03em;
  margin: 2.6rem 0 .8rem; padding-top:1.6rem; border-top:1px solid var(--line);
}
h3{ font-family: var(--f-head); font-weight:500; color: var(--silver-bright); font-size:1.02rem; letter-spacing:.04em; margin:1.6rem 0 .4rem; }
p{ margin:.9rem 0; }
ul{ margin:.9rem 0; padding-left:1.3rem; }
li{ margin:.35rem 0; }
strong{ color: var(--silver-bright); font-weight:500; }

.adresse{
  background: var(--panel);
  border:1px solid var(--line);
  border-left:2px solid var(--gold);
  border-radius:8px;
  padding: 1.2rem 1.4rem;
  margin: 1.2rem 0;
  line-height:1.6;
}
.adresse .name{ font-family: var(--f-head); color:#fff; letter-spacing:.03em; }

.hinweis{ font-size:.92rem; color: var(--silver-dim); background: rgba(7,12,24,.5); border:1px solid var(--line); border-radius:8px; padding:1rem 1.2rem; }

.stand{ margin-top:3rem; padding-top:1.4rem; border-top:1px solid var(--line); font-size:.85rem; color: var(--silver-dim); }
.stand a{ color: var(--silver); }