/* LOUYZ Docs – statisch, ohne JavaScript */
@font-face{font-family:"Big Shoulders Display";font-weight:800;font-display:swap;src:url(../fonts/big-shoulders-display-latin-800-normal.woff2) format("woff2")}
@font-face{font-family:"Big Shoulders Display";font-weight:900;font-display:swap;src:url(../fonts/big-shoulders-display-latin-900-normal.woff2) format("woff2")}
@font-face{font-family:"Inter";font-weight:400;font-display:swap;src:url(../fonts/inter-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Inter";font-weight:500;font-display:swap;src:url(../fonts/inter-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Inter";font-weight:600;font-display:swap;src:url(../fonts/inter-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-weight:500;font-display:swap;src:url(../fonts/jetbrains-mono-latin-500-normal.woff2) format("woff2")}

:root{
  --ink:#121314;--ink-2:#1c1e21;--paper:#f2efe8;--paper-2:#e7e3da;--accent:#e8600a;--white:#fff;
  --line-dark:#2e3136;--line:rgba(18,19,20,.14);--muted-dark:#8b8e92;--muted:#6d6a63;
  --f-display:"Big Shoulders Display","Arial Narrow",Impact,sans-serif;
  --f-body:"Inter",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.6 var(--f-body)}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:1180px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.label{font:500 11px/1.3 var(--f-mono);letter-spacing:.16em;text-transform:uppercase}
.display{font-family:var(--f-display);font-weight:900;text-transform:uppercase;line-height:.92;margin:0;letter-spacing:.005em}

/* Kopf */
.top{background:var(--ink);color:var(--white);border-bottom:1px solid var(--line-dark)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:68px;padding-top:env(safe-area-inset-top,0px)}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none}
.brand img{height:26px;width:auto}
.brand .label{color:var(--accent);border-left:1px solid var(--line-dark);padding-left:14px}
.top nav a{color:var(--muted-dark);text-decoration:none}
.top nav a:hover,.top nav a:focus-visible{color:var(--white)}

/* Hero */
.hero{background:var(--ink);color:var(--white);padding:88px 0 72px;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:40px 40px}
.kicker{display:flex;align-items:center;gap:14px;margin-bottom:28px}
.kicker .n{color:var(--accent)}
.kicker .bar{width:40px;height:1px;background:currentColor;opacity:.5}
.hero .kicker{color:var(--white)}
.hero h1{font-size:clamp(52px,10vw,120px)}
.hero h1 span{display:block}
.hero h1 .a{color:var(--accent)}
.lead{max-width:56ch;margin:28px 0 0;font-size:18px;line-height:1.55;color:#d9d9d9}
.facts{display:flex;flex-wrap:wrap;gap:12px 32px;list-style:none;margin:36px 0 0;padding:0;color:var(--muted-dark)}
.facts b{color:var(--accent);font-weight:500}

/* Downloads */
.list{padding:80px 0 96px}
.list .kicker{color:var(--ink)}
.docs{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.doc{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:24px;align-items:center;padding:24px 0;border-bottom:1px solid var(--line)}
.fmt{width:56px;height:68px;border:1px solid var(--ink);border-radius:4px;position:relative;display:flex;align-items:flex-end;justify-content:center;padding-bottom:10px;background:var(--white)}
.fmt::before{content:"";position:absolute;top:-1px;right:-1px;width:16px;height:16px;background:var(--paper);border-left:1px solid var(--ink);border-bottom:1px solid var(--ink);border-bottom-left-radius:4px}
.fmt span{font:500 10px/1 var(--f-mono);letter-spacing:.08em;padding:4px 5px;border-radius:2px;background:var(--ink);color:var(--white)}
.fmt.pdf span{background:var(--accent)}
.fmt.docx span{background:#2b5797}
.fmt.xlsx span{background:#1d6f42}
.fmt.zip span{background:#6d6a63}
.doc-main{display:flex;flex-direction:column;gap:6px;min-width:0}
.doc-main .label{color:var(--muted)}
.doc-main .label .no{color:var(--accent)}
.doc h3{font:900 30px/1 var(--f-display);text-transform:uppercase;margin:0;overflow-wrap:anywhere}
.doc p{margin:0;color:#3a3a3a;max-width:70ch}
.meta{color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:0 22px;border:1px solid var(--ink);border-radius:4px;background:var(--ink);color:var(--white);font:500 12px/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;white-space:nowrap;transition:background .2s,border-color .2s,color .2s}
.btn:hover,.btn:focus-visible{background:var(--accent);border-color:var(--accent);color:var(--ink)}
.btn svg{width:14px;height:14px}
a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.empty{padding:40px 0;color:var(--muted);border-bottom:1px solid var(--line)}

/* Rechtliches */
.legal{padding:80px 0 96px}
.legal h1{font-size:clamp(48px,8vw,88px)}
.legal h1 .a{color:var(--accent)}
.legal .body{max-width:68ch;margin-top:40px}
.legal h2{font:900 26px/1 var(--f-display);text-transform:uppercase;margin:44px 0 12px}
.legal p,.legal li{margin:0 0 12px;text-align:justify;-webkit-hyphens:auto;hyphens:auto}
.legal ul{padding-left:20px}
.back{margin-top:48px}

/* Fuß */
.foot{background:var(--ink);color:var(--muted-dark);padding:36px 0 calc(36px + env(safe-area-inset-bottom,0px))}
.foot .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.foot .mark{display:flex;align-items:center;gap:16px}
.foot img{width:36px;height:36px;border-radius:8px}
.foot a{text-decoration:none}
.foot a:hover,.foot a:focus-visible{color:var(--white)}

@media (max-width:700px){
  .hero{padding:64px 0 56px}
  .doc{grid-template-columns:48px minmax(0,1fr);gap:16px 18px}
  .fmt{width:44px;height:54px;padding-bottom:7px}.fmt::before{width:12px;height:12px}
  .doc .btn{grid-column:1/-1;width:100%}
  .doc h3{font-size:26px}
}
@media (prefers-reduced-motion:reduce){.btn{transition:none}}

/* Download-Formular als Overlay (CSS :target, kein JavaScript) */
.modal{position:fixed;inset:0;z-index:50;display:none;align-items:center;justify-content:center;padding:16px}
.modal:target{display:flex}
.modal-bg{position:absolute;inset:0;background:rgba(18,19,20,.8)}
.modal-box{position:relative;width:min(560px,100%);max-height:calc(100dvh - 32px);overflow:auto;background:var(--ink-2);color:var(--white);border:1px solid var(--line-dark);border-radius:6px;padding:36px 32px 32px;display:flex;flex-direction:column;gap:14px}
.modal-x{position:absolute;top:8px;right:12px;font-size:30px;line-height:1;color:var(--muted-dark);text-decoration:none;padding:6px}
.modal-x:hover{color:var(--accent)}
.modal-k{color:var(--accent)}
.modal-box h2{font-size:40px}.modal-box h2 span{color:var(--accent)}
.modal-t{margin:0;color:#c9cacc;font-size:15px}
.modal-f{display:flex;flex-direction:column;gap:14px;margin-top:6px}
.modal-f .row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.modal-f label{display:flex;flex-direction:column;gap:8px;font:500 11px/1.3 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted-dark)}
.modal-f input:not([type=checkbox]){font:400 16px/1.4 var(--f-body);letter-spacing:0;text-transform:none;color:var(--white);background:rgba(255,255,255,.05);border:0;border-bottom:1px solid #4a4d52;border-radius:4px 4px 0 0;padding:12px 14px}
.modal-f input:focus{outline:none;border-bottom:2px solid var(--accent)}
.modal-f .consent{flex-direction:row;align-items:flex-start;gap:12px;font:400 13px/1.5 var(--f-body);letter-spacing:0;text-transform:none;color:#c9cacc}
.modal-f .consent input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--accent);flex:none}
.modal-f .consent a{color:var(--white)}
.modal-f .btn{align-self:flex-start;background:var(--accent);border-color:var(--accent);color:var(--ink)}
.modal-f .btn:hover{background:var(--white);border-color:var(--white)}
.hp{position:absolute!important;left:-9999px}
.hero-msg{padding:96px 0 112px}
.hero-msg .lead a{color:var(--white)}
.btn-ghost{background:transparent;border-color:#4a4d52;color:var(--white)}
@media (max-width:600px){.modal-f .row2{grid-template-columns:1fr}.modal-box{padding:32px 20px 24px}.modal-box h2{font-size:32px}}
.modal-f input:not([type=checkbox]){width:100%;min-width:0}.modal-f .row2 label{min-width:0}
