/* Wiener Komitee für Menschenrechte in Eritrea – gemeinsames Stylesheet */

/* === Schrift (EB Garamond, OFL, selbst gehostet – siehe fonts/OFL.txt) === */
@font-face{font-family:"EB Garamond";src:url(fonts/eb-garamond-latin-wght-normal.woff2) format("woff2");font-weight:400 800;font-style:normal;font-display:swap}
@font-face{font-family:"EB Garamond";src:url(fonts/eb-garamond-latin-wght-italic.woff2) format("woff2");font-weight:400 800;font-style:italic;font-display:swap}

/* === Farben === */
:root{--ink:#000;--muted:#5c5c5c;--accent:#6b1d1d;--line:#d9d4cc;--bg:#fff}

/* === Grundlayout (aus v0.1 übernommen) === */
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"EB Garamond",Garamond,Georgia,serif;color:var(--ink);background:var(--bg);min-height:100vh;min-height:100svh;display:flex;flex-direction:column;padding:clamp(20px,3vw,32px) clamp(28px,8vw,120px)}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.15em}
a:hover{color:var(--accent)}
a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
nav{align-self:flex-end;font-size:1rem;color:var(--muted)}
nav button{font:inherit;color:inherit;background:none;border:0;padding:2px 4px;cursor:pointer}
nav button[aria-pressed="true"]{color:var(--ink);font-weight:600}
nav button:focus-visible{outline:2px solid var(--accent)}
main{margin:auto 0;padding:10vh 0}
h1{display:flex;gap:.42em;font-size:clamp(26px,6.8vw,64px);font-weight:500;line-height:1;margin-left:calc(-.42em - .19em)}
.stroke{width:.19em;flex:none;position:relative;margin:-.06em 0 -.14em}
.stroke svg{position:absolute;inset:0;width:100%;height:100%;fill:var(--accent)}
.words{display:flex;flex-direction:column}
.l1{font-size:.68em;font-weight:450;margin-bottom:.14em}
.more{margin-top:2em;color:var(--muted);font-size:clamp(1.1rem,1.6vw,1.3rem)}
footer{font-size:.85rem;color:var(--muted);line-height:1.5}

/* Zweisprachigkeit: Elemente mit lang="de"/"en" werden je nach gewählter Sprache ausgeblendet */
html[lang="de"] [lang="en"],html[lang="en"] [lang="de"]{display:none}

/* === Event (Klassen generisch – für künftige Veranstaltungen wiederverwendbar) === */
.event{margin-top:clamp(4rem,12vh,8rem);max-width:62rem;line-height:1.45}
.event .eyebrow{font-size:.9rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:600}
.event h2{font-size:clamp(1.7rem,3.6vw,2.6rem);font-weight:500;line-height:1.12;margin:.3em 0 .4em}
.event .when{font-size:clamp(1.2rem,2vw,1.45rem);font-weight:500}
.event .facts{margin-top:.4em;font-size:1.1rem}
.event .partners{margin-top:1em;color:var(--muted);font-size:1rem;max-width:44rem}
.days{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.25rem,3vw,2.5rem);margin-top:2.5rem}
.day{border-top:1px solid var(--accent);padding-top:.9rem}
.day h3{font-size:1.35rem;font-weight:600;color:var(--accent)}
.day .place{margin-top:.15em;font-weight:500}
.day .address{color:var(--muted);font-size:.95rem}
.day .time{margin-top:.9em;font-style:italic}
.day ul{list-style:none;margin-top:.5em;font-size:1.05rem}
.day li{margin-bottom:.45em}
.day .role{color:var(--muted)}
/* Programmpunkt mit Personen: Label, Name, Beschreibung, Titel – je eine Zeile */
.day li.entry{margin-bottom:.8em}
.day .entry>*{display:block}
.day .entry .role{font-size:.92rem;line-height:1.35}
.day .entry .role+.person{margin-top:.35em}
.day .entry .topic{font-style:italic;margin-bottom:.2em}
.event .note{margin-top:2rem;color:var(--muted)}
.event .note+.note{margin-top:.6rem}
.funders{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 2rem;margin-top:2rem;padding-top:1rem;border-top:1px solid var(--line);color:var(--muted);font-size:.95rem}
.funders img{height:38px;width:auto;display:block}
@media (max-width:760px){.days{grid-template-columns:1fr}.event h2 br{display:none}}

/* === Verein: Zweck und Kontakt === */
.about{margin-top:clamp(4rem,12vh,8rem);max-width:40rem;font-size:clamp(1.1rem,1.6vw,1.3rem);line-height:1.5}
.about h2{font-size:.9rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:600;margin-bottom:.6em}
.about .contact{margin-top:.8em}

/* === Unterseiten (Impressum) === */
.page{max-width:44rem;line-height:1.5;font-size:1.1rem}
.page .back{margin-bottom:2rem;color:var(--muted)}
.page h1{display:block;margin:0 0 .6em;font-size:clamp(2rem,4.5vw,2.8rem)}
.page h1.next{margin-top:2.5em}
.page h2{font-size:1.3rem;font-weight:600;margin:2em 0 .4em;color:var(--accent)}
.page p+p{margin-top:.6em}
.page .lead{color:var(--muted)}
.page ul{margin:.4em 0 0 1.2em}
.page li{margin-bottom:.3em}
