/* Queere Landingpage, Überarbeitung 18.10.2026 (Janet): Hero mit Michelle und Marlene über die ganze Breite,
   zwei Fotos bei „Wer euch begleitet“, Reportagen als klickbare Karten, Fotos quer über die Seite,
   dunkle Abschnitte. Ergänzt queer.css und überschreibt dessen Hero vollständig. */
.queer-page{--q-night:#1d2e25;--q-paper:#f1f2ec;--q-apricot:#f3e2c7;--q-sage:#e5e8df;--q-line:#bbc5b6;--q-accent:#a9531c;--q-glow:#eaa66a;--q-gutter:max(7%,calc((100% - 1360px)/2))}

/* Hero: Foto über die ganze Breite, Text rechts auf dem abgedunkelten Wald. */
.queer-page .page-hero.queer-hero{position:relative;display:flex;align-items:flex-end;justify-content:flex-end;max-width:none;min-height:min(calc(100svh - var(--navigation-height,122px)),max(40vw,560px));margin:0;padding:clamp(40px,5vw,96px) var(--q-gutter) clamp(40px,4vw,72px);background:var(--q-night);color:var(--q-paper);overflow:hidden;isolation:isolate}
.queer-page .queer-hero>figure{position:absolute;inset:0;z-index:-2;width:100%;height:100%;aspect-ratio:auto;margin:0;transform:none}
.queer-page .queer-hero>figure :is(picture,img){display:block;width:100%;height:100%}
.queer-page .page-hero.queer-hero img{width:100%;height:100%;max-height:none;object-fit:cover;object-position:28% 40%;border-radius:0}
.queer-page .queer-hero::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(18,30,24,0) 30%,rgba(18,30,24,.55) 58%,rgba(18,30,24,.86) 100%),linear-gradient(0deg,rgba(18,30,24,.55) 0%,rgba(18,30,24,0) 45%)}
.queer-hero-text{width:min(560px,44%);margin-right:-38px} /* Janet, 19.10.2026: Text etwa 1 cm weiter rechts */
.queer-page .queer-hero h1{margin:0;color:var(--q-paper);font-size:clamp(34px,3.2vw,50px);line-height:1.1;text-align:left}
.queer-page .queer-hero-title{display:block;max-width:14ch;text-wrap:balance}
/* Flaggenverlauf der Schreibschrift (benannte Ausnahme in DESIGN_RULES), aufgehellt für den dunklen Grund. */
.queer-page .page-hero.queer-hero h1 .hand{font-size:clamp(84px,8vw,124px);line-height:1.15;white-space:nowrap;margin:calc(6px - .24em) 0 0;padding:.24em 12px 0 0;transform:none;color:#f0a18f;background-image:linear-gradient(94deg,#f0a18f 0%,#f1b57a 20%,#ead27f 39%,#a9d39a 58%,#9cc8ea 78%,#c6b0ec 100%)}
.queer-page .queer-hero-text>p{margin:24px 0 0;max-width:46ch;font-size:17px;line-height:1.8;color:#e9ece4}
.queer-page .queer-hero-text>p.queer-hero-me{margin-top:28px;font-size:clamp(19px,1.5vw,22px);line-height:1.5;color:var(--q-paper)}
.queer-page .queer-hero-text>p.queer-hero-me+p{margin-top:12px}
.queer-page .page-hero.queer-hero .queer-hero-text>p a{color:#fff;text-decoration:underline;text-decoration-color:var(--q-glow);text-underline-offset:4px}
.queer-page .page-hero.queer-hero .queer-hero-text>p a:hover{color:var(--q-glow)}
.queer-page .queer-hero-action{display:flex;align-items:center;gap:32px;margin-top:32px}
.queer-page .queer-hero-action .button{margin:0;background:#efd3a6;color:#263c30}
.queer-page .queer-hero-action .button:hover{background:#f5dfbd;color:#263c30}
.queer-page .queer-hero-action .pride-stitch{margin:0}
.queer-page .queer-hero :focus-visible{outline-color:var(--q-glow)}

/* Kurznavigation direkt unter dem Hero */
.queer-page .queer-paths{margin:0 var(--q-gutter)}

/* Wer euch begleitet: zwei Fotos, das Hochformat leicht über dem Flaggenbild */
.queer-meet{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:8%;align-items:center;padding:var(--queer-space) var(--q-gutter);background:var(--q-apricot)}
.queer-meet-photos{position:relative;padding-bottom:22%}
.queer-meet-photos figure{margin:0}
.queer-meet-photos img{display:block;width:100%;height:auto}
.queer-meet-photos figure:first-child{width:84%}
.queer-meet-photos figure:first-child img{border-radius:8px 88px 8px 88px}
.queer-meet-photos figure:last-child{position:absolute;right:0;bottom:0;width:40%}
.queer-meet-photos figure:last-child img{aspect-ratio:3/4;object-fit:cover;object-position:40% 30%;border-radius:64px 8px 64px 8px;outline:10px solid var(--q-apricot)}
.queer-meet-text h2{margin-bottom:28px;text-wrap:balance}
.queer-meet-text p{margin:0;font-size:17px;line-height:1.85;max-width:60ch}
.queer-meet-text p+p{margin-top:18px}
.queer-meet-text .pride-stitch{margin:0 0 24px}

/* Reportagen: dunkle Fläche, zwei Karten nebeneinander, Bild und Titel sind ein Link */
.queer-page .queer-story{padding:var(--queer-space) var(--q-gutter) calc(var(--queer-space) * .8);background:var(--q-night);color:var(--q-paper)}
.queer-page .queer-story-intro{max-width:none;padding:0 0 clamp(32px,4vw,56px)}
.queer-page .queer-story h2{color:var(--q-paper)}
.queer-page .queer-story .text-link,.queer-card>.text-link{color:var(--q-paper)}
.queer-page .queer-story .text-link:hover{color:var(--q-glow)}
.queer-story-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,4vw,64px)}
.queer-card{display:flex;flex-direction:column;align-items:flex-start}
.queer-card-link{display:block;width:100%;color:inherit;text-decoration:none}
.queer-card-link figure{margin:0;overflow:hidden;border-radius:6px}
.queer-card-link img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;transition:transform .5s ease}
.queer-card-link:hover img{transform:scale(1.035)}
.queer-card-body{padding-top:24px}
.queer-card-place{margin:0 0 8px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#c9d2c4}
.queer-card h3{margin:0;font:400 clamp(34px,3vw,46px)/1.08 'Barlow Condensed',sans-serif;color:var(--q-paper)}
.queer-card-body>p:not(.queer-card-place){margin:12px 0 0;max-width:44ch;line-height:1.75;color:#e1e6dc}
.queer-card-more{display:inline-flex;align-items:center;gap:10px;min-height:44px;margin-top:12px;font-size:15px;text-decoration:underline;text-decoration-color:var(--q-glow);text-underline-offset:6px}
.queer-card-more::after{content:'↗';text-decoration:none}
.queer-card-link:hover .queer-card-more{color:var(--q-glow);text-decoration-thickness:2px}
.queer-card-link:focus-visible{outline:3px solid var(--q-glow);outline-offset:8px;border-radius:6px}
.queer-card>.text-link{min-height:44px;display:inline-flex;align-items:center;margin-top:4px;font-size:14px;opacity:1}
.queer-page .queer-story :focus-visible{outline-color:var(--q-glow)}

/* Fotos über die ganze Breite */
.queer-band{position:relative;margin:0;background:var(--q-night)}
.queer-band :is(picture,img){display:block;width:100%}
.queer-band img{height:clamp(420px,58vw,820px);object-fit:cover;object-position:50% 40%}
.queer-band-cta img{object-position:50% 38%}
.queer-band-cta::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(18,30,24,0) 45%,rgba(18,30,24,.55) 75%,rgba(18,30,24,.7) 100%);pointer-events:none}
.queer-band-cta-text{position:absolute;right:var(--q-gutter);top:50%;transform:translateY(-50%);z-index:1;max-width:min(440px,36%);color:var(--q-paper)}
.queer-page .queer-band-cta-text h2{margin:0 0 28px;color:var(--q-paper);font-size:clamp(40px,4vw,62px);line-height:1.06;text-wrap:balance}
.queer-page .queer-band-cta-text .button{margin:0;background:#efd3a6;color:#263c30}
.queer-page .queer-band-cta-text .button:hover{background:#f5dfbd;color:#263c30}
.queer-page .queer-band-cta :focus-visible{outline-color:var(--q-glow)}

/* Dunkle Textabschnitte */
.queer-page .editorial-section.queer-dark{max-width:none;padding-inline:var(--q-gutter);background:var(--q-night);color:#e9ece4}
.queer-page .editorial-section.queer-dark h2{color:var(--q-paper)}
.queer-page .editorial-section.queer-dark .text-link{color:var(--q-paper)}
.queer-page .editorial-section.queer-dark .text-link:hover{color:var(--q-glow)}
.queer-page .editorial-section.queer-dark :focus-visible{outline-color:var(--q-glow)}
.queer-page .editorial-section.queer-dark figure img{border-radius:8px 80px 8px 80px}

/* Bildpaar am Ende: zwei Trauungen */
.queer-page .queer-pair{padding-top:var(--queer-space)}

/* Weiterlesen: Blog und weitere Seiten */
.queer-further{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:8%;padding:var(--queer-space) var(--q-gutter);background:var(--q-sage)}
.queer-further h2{margin-bottom:24px}
.queer-blog-list,.queer-further-pages ul{list-style:none;margin:0;padding:0}
.queer-blog-list li{border-top:1px solid var(--q-line)}
.queer-blog-list li:last-child{border-bottom:1px solid var(--q-line)}
.queer-blog-list a{display:block;padding:24px 0;color:inherit;text-decoration:none}
.queer-blog-title{display:block;font:400 clamp(28px,2.4vw,36px)/1.15 'Barlow Condensed',sans-serif}
.queer-blog-title::after{content:' ↗';font-size:.7em}
.queer-blog-text{display:block;margin-top:8px;max-width:52ch;line-height:1.7}
.queer-blog-list a:hover .queer-blog-title{color:var(--q-accent)}
.queer-further-pages{padding-top:8px}
.queer-further-pages h3{font:400 26px/1.2 'Barlow Condensed',sans-serif;margin:0 0 16px}
.queer-further-pages li{border-top:1px solid var(--q-line)}
.queer-further-pages a{display:flex;align-items:center;min-height:48px;color:inherit;text-decoration:none;font-size:16px}
.queer-further-pages a:hover{color:var(--q-accent);text-decoration:underline;text-underline-offset:5px}

/* Flache Laptop-Bildschirme: Text kompakter, damit der Hero auf den Bildschirm passt */
@media(min-width:1051px) and (max-height:900px){
 .queer-page .queer-hero h1{font-size:clamp(30px,2.6vw,42px)}
 .queer-page .page-hero.queer-hero h1 .hand{font-size:clamp(70px,6.2vw,100px)}
 .queer-page .queer-hero-text>p.queer-hero-me{margin-top:18px;font-size:19px}
 .queer-page .queer-hero-text>p{font-size:16px;line-height:1.7}
 .queer-page .queer-hero-action{margin-top:22px}
}
@media(max-width:1050px){
 /* Tablet und Mobil: Foto oben ohne Text darüber, Text darunter auf der dunklen Fläche, damit kein Gesicht verdeckt wird */
 .queer-page .page-hero.queer-hero{display:block;min-height:0;padding:0 0 56px}
 .queer-page .queer-hero>figure{position:relative;inset:auto;z-index:auto;height:auto}
 .queer-page .page-hero.queer-hero img{height:auto;aspect-ratio:3/2;object-position:36% 50%}
 .queer-page .queer-hero::after{display:none}
 .queer-hero-text{width:auto;max-width:720px;margin-right:0;padding:40px 7% 0}
}
@media(max-width:760px){
 .queer-page .page-hero.queer-hero{padding-bottom:48px}
 .queer-page .page-hero.queer-hero img{aspect-ratio:3/2;object-position:36% 40%}
 .queer-hero-text{padding-top:32px}
 .queer-page .queer-hero h1{font-size:clamp(28px,7vw,36px)}
 .queer-page .page-hero.queer-hero h1 .hand{font-size:clamp(76px,19vw,108px);margin-top:calc(2px - .24em)}
 .queer-page .queer-hero-text>p{font-size:16px}
 .queer-page .queer-hero-action{flex-wrap:wrap;gap:20px 28px}
 .queer-page .queer-paths{margin:0 7%}
 .queer-meet{display:block;padding:56px 7%}
 .queer-meet-photos{margin-bottom:40px;padding-bottom:26%}
 .queer-meet-photos figure:first-child{width:88%}
 .queer-meet-photos figure:last-child{width:44%}
 .queer-meet-photos figure:last-child img{outline-width:6px}
 .queer-meet-text h2{font-size:42px}
 .queer-page .queer-story{padding:56px 7%}
 .queer-story-grid{grid-template-columns:1fr;gap:48px}
 .queer-band img{height:auto;aspect-ratio:4/3}
 .queer-band-cta-text{position:static;transform:none;max-width:none;padding:32px 7% 48px;background:var(--q-night)}
 .queer-band-cta::after{display:none}
 .queer-page .queer-band-cta-text h2{font-size:38px;margin-bottom:22px}
 .queer-page .editorial-section.queer-dark{padding-inline:7%}
 .queer-further{display:block;padding:56px 7%}
 .queer-further-pages{margin-top:48px}
}
@media(prefers-reduced-motion:reduce){
 .queer-card-link img{transition:none}
 .queer-card-link:hover img{transform:none}
}
@media(forced-colors:active){
 .queer-page .page-hero.queer-hero h1 .hand{background:none;color:CanvasText;-webkit-text-fill-color:CanvasText}
 .queer-page .queer-hero::after,.queer-band-cta::after{display:none}
}

/* Featured article and two related reads. Other page links remain in context and the footer. */
.queer-further.queer-reading{display:block}
.queer-reading>h2{margin-bottom:36px}
.queer-reading-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(32px,6vw,96px);align-items:start}
.queer-blog-feature{display:block;color:inherit;text-decoration:none}
.queer-blog-feature figure{margin:0}
.queer-blog-feature img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.queer-blog-feature h3{font:400 clamp(32px,3vw,46px)/1.12 'Barlow Condensed',sans-serif;margin:26px 0 14px;text-wrap:balance}
.queer-blog-feature p{font-size:18px;line-height:1.8;max-width:48ch;margin:0}
.queer-feature-more{display:inline-flex;align-items:center;gap:12px;min-height:44px;margin-top:12px;text-decoration:underline;text-underline-offset:6px}
.queer-blog-feature:hover .queer-feature-more{color:var(--q-accent);text-decoration-thickness:2px}
.queer-blog-feature:focus-visible{outline:3px solid var(--q-accent);outline-offset:8px}
.queer-reading-more .text-link{display:inline-flex;align-items:center;min-height:44px;margin-top:20px}
@media(max-width:760px){
 .queer-reading-grid{grid-template-columns:1fr;gap:36px}
 .queer-reading>h2{margin-bottom:28px}
 .queer-blog-feature p{font-size:17px}
}