/* Gemeinsame Grundstile für Startseite-Platzhalter, Impressum, Datenschutz, 404.
   Schriften werden per <link> in jeder Seite geladen (/fonts/fonts.css). */
:root{--nacht:#120F0C;--kreide:#EADCCE;--sand:#A39376;--ort:#3E87F7;--rand:6vw}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html,body{background:var(--nacht);color:var(--kreide)}
body{font-family:'Archivo',system-ui,sans-serif;font-size:17px;line-height:1.6;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;-webkit-font-smoothing:antialiased;overflow-wrap:break-word}
a{color:inherit;text-decoration-color:var(--sand);text-underline-offset:3px}
a:hover{text-decoration-color:var(--ort)}

/* Stern: gezeichnet statt Schriftzeichen – sonst macht iOS daraus ein grünes Emoji */
.stern{display:inline-block;width:.62em;height:.62em;margin-left:.06em;vertical-align:baseline;background:currentColor;
  -webkit-mask:url('/assets/stern.svg') center/contain no-repeat;mask:url('/assets/stern.svg') center/contain no-repeat}

.kopf{display:flex;align-items:center;gap:14px;padding:28px var(--rand);border-bottom:1px solid #2a251f}
.mono{display:inline-grid;grid-template-columns:auto auto;border:2px solid var(--kreide);font:700 11px/1 'Archivo',sans-serif;letter-spacing:.06em;flex:none}
.mono span{padding:5px 7px}
.mono span+span{border-left:2px solid var(--kreide);display:flex;flex-direction:column;align-items:center;gap:2px;min-width:2.4em}
.mono small{font-size:9px;border-top:1px solid var(--kreide);padding-top:2px}
.marke{font-family:'Playfair Display',Georgia,serif;font-weight:700;font-size:26px;text-decoration:none;white-space:nowrap}
main{flex:1;padding:8vh var(--rand);max-width:880px;width:100%}
h1{font-family:'Playfair Display',Georgia,serif;font-weight:700;font-size:clamp(40px,7vw,84px);line-height:1.02;margin-bottom:.5em;hyphens:manual}
h2{font-family:'Playfair Display',Georgia,serif;font-weight:700;font-size:26px;margin:1.8em 0 .5em}
p,li{max-width:68ch;margin-bottom:.8em}
ul{padding-left:1.2em}
.fuss{display:flex;flex-wrap:wrap;gap:12px 24px;padding:24px var(--rand);padding-bottom:max(24px,env(safe-area-inset-bottom));border-top:1px solid #2a251f;font-size:14px;color:var(--sand)}

@media (max-width:600px){
  :root{--rand:22px}
  body{font-size:16px}
  .kopf{padding:20px var(--rand);gap:12px}
  .marke{font-size:22px}
  main{padding:6vh var(--rand)}
  h1{font-size:clamp(34px,11vw,48px)}
  h2{font-size:22px}
  .fuss{flex-direction:column;gap:10px}
}
