/* Bushido – Platzhalterseite. Basis: Vorlage „Me“ (One Page Love, Lizenz erworben), neu geschrieben. */
@font-face{font-family:"Roboto";src:url("../fonts/roboto-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Roboto";src:url("../fonts/roboto-latin-700-normal.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
:root{--bg:#111111;--text:#f2efe9;--muted:#b9b2a6;--gold:#d4b06a;--focus:#ffd88a}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:"Roboto",system-ui,-apple-system,"Segoe UI",sans-serif;font-size:1.125rem;line-height:1.6}
a{color:var(--gold);text-underline-offset:.2em}
a:hover{color:var(--text)}
a:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:2px}
.seite{display:grid;grid-template-columns:1fr 1fr;height:100vh;height:100dvh;overflow:hidden}
.inhalt{display:flex;flex-direction:column;justify-content:safe center;align-items:flex-start;padding:2rem clamp(1.5rem,6vw,6rem);min-height:0;overflow-y:auto}
.logo{width:clamp(96px,min(14vw,22vh),180px);height:auto;margin:0 0 clamp(1rem,3vh,2rem)}
h1{font-size:clamp(2.25rem,4.5vw,3.5rem);font-weight:700;letter-spacing:.02em;line-height:1.1;margin:0 0 1rem}
.text{max-width:32rem;margin:0;color:var(--text)}
.fuss{margin-top:clamp(1rem,5vh,3rem);font-size:.9375rem;color:var(--muted)}
.fuss a{color:var(--muted)}
.fuss a:hover{color:var(--text)}
.bild{position:relative;margin:0;overflow:hidden;min-height:0}
.bild picture{position:absolute;inset:0}
.bild img{display:block;width:100%;height:100%}
.bild img{object-fit:cover;object-position:50% 30%}
.bild::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--bg) 0,rgba(17,17,17,0) 18%);pointer-events:none}
@media (max-width:820px){
 .seite{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}
 .bild{order:-1}
 .bild::after{background:linear-gradient(0deg,var(--bg) 0,rgba(17,17,17,0) 35%)}
 .inhalt{padding:0 1rem 1.25rem;align-items:center;text-align:center;overflow:visible}
 .logo{width:clamp(72px,14vh,110px);margin:calc(-1 * clamp(36px,7vh,55px)) 0 .75rem;position:relative;z-index:1}
 h1{margin-bottom:.5rem}
 .text{margin-inline:auto}
 .fuss{margin-top:1rem}
}
/* sehr niedrige Fenster: lieber scrollen als abschneiden */
@media (max-height:480px){
 .seite{height:auto;min-height:100vh;overflow:visible}
 .bild{min-height:60vh}
}
/* Aufklapper „Was das heißt“ */
.kodex{max-width:32rem;margin-top:1rem;text-align:left}
.kodex summary{cursor:pointer;color:var(--gold);display:inline-block;padding:.25rem 0;list-style-position:inside}
.kodex summary:hover{color:var(--text)}
.kodex summary:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:2px}
.kodex dl{margin:.75rem 0 0;font-size:1rem;line-height:1.5}
.kodex dt{font-weight:700;margin-top:.75rem}
.kodex dt span{color:var(--gold);margin-right:.35em}
.kodex dd{margin:.1rem 0 0;color:var(--muted)}
@media (max-width:820px){
 .kodex{margin-inline:auto}
 .seite:has(.kodex[open]){height:auto;min-height:100dvh;overflow:visible;grid-template-rows:55vh auto}
}
/* Unterseite Datenschutz */
.rechtstext{max-width:44rem;margin:0 auto;padding:3rem 1rem 4rem}
.rechtstext h1{font-size:clamp(1.75rem,4vw,2.5rem)}
.rechtstext h2{font-size:1.25rem;margin:2rem 0 .5rem}
.rechtstext .zurueck{display:inline-block;margin-bottom:2rem}
.rechtstext .logo{width:96px;margin-bottom:1.5rem}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}