/**
 * GOQUEER „Studio bei Nacht“ — Seitenfeinheiten
 * Lädt zuletzt (functions.php, Priorität 999). Hier steht nur, was die älteren
 * Bundles (Mediathek, Builder-Blöcke, Seiten) für das dunkle Design anders brauchen.
 * Tokens: assets/css/theme/variables.css · Regeln: GOQUEE-WWW/DESIGN.md
 */

/* ===================================================================
   KARUSSELL (Startseite „neu“, Mediathek, Reviews): .gqrc-hero-*
   =================================================================== */

html body .gqrc-hero-section {
    border-bottom: 0;
    background: var(--gq-flaeche-1);
}

html body .gqrc-hero-section::before {
    background: repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.12) 0 1px, transparent 1px 3px);
}

/* Unscharfer Hintergrund: ruhiger, wärmer, weniger Farbe */
html body .video-feed-hero .gqrc-hero-backdrop-blur {
    filter: blur(48px) saturate(0.7) brightness(0.55);
}

html body .gqrc-hero-overlay,
html body .video-feed-hero .gqrc-hero-overlay {
    background:
        linear-gradient(90deg, rgba(19, 17, 18, 0.94) 0%, rgba(19, 17, 18, 0.72) 42%, rgba(19, 17, 18, 0.2) 100%),
        linear-gradient(0deg, rgba(19, 17, 18, 0.7) 0%, rgba(19, 17, 18, 0) 40%);
}

html body .gqrc-hero-title {
    font-size: clamp(2rem, 4.6vw, 4rem);
    line-height: 0.98;
    letter-spacing: -0.035em;
    color: var(--gq-titel);
    text-wrap: balance;
}

html body .gqrc-hero-description {
    font-size: 1.0625rem;
    color: var(--gq-text);
}

/* „neu“: kleine grüne Pille statt Neon-Block */
html body .gqrc-hero-neu-label,
html body .gqrc-hero-review-label,
html body .gqrc-hero-podcast-label,
html body .gqrc-hero-video-label {
    top: clamp(20px, 3vw, 40px);
    left: clamp(20px, 5vw, 90px);
    right: auto;
    padding: 7px 16px 7px 12px;
    border-radius: var(--gq-pille);
    background: var(--gq-gruen);
    color: var(--gq-gruen-tinte);
    font-family: var(--gq-sans);
    font-size: 0.9375rem;
    font-weight: 600;
    letter-spacing: 0;
}

html body .gqrc-hero-review-label,
html body .gqrc-hero-podcast-label,
html body .gqrc-hero-video-label {
    left: auto;
    right: clamp(20px, 5vw, 90px);
    background: rgba(239, 233, 227, 0.14);
    color: var(--gq-titel);
}

html body .gqrc-hero-neu-label-icon,
html body .gqrc-hero-review-label-icon,
html body .gqrc-hero-podcast-label-icon,
html body .gqrc-hero-video-label-icon {
    margin-right: 6px;
}

html body .gqrc-hero-neu-label svg,
html body .gqrc-hero-neu-label img {
    width: 18px;
    height: 18px;
}

/* Meta-Chips */
html body .gqrc-hero-meta-badge,
html body .gqrc-hero-badge-current {
    padding: 5px 12px;
    border: 0 !important;
    border-radius: var(--gq-pille);
    background: rgba(239, 233, 227, 0.12) !important;
    color: var(--gq-text) !important;
    font-family: var(--gq-sans);
    font-size: 0.875rem;
    font-weight: 500;
    letter-spacing: 0;
    font-variant-numeric: tabular-nums;
}

/* Knöpfe als Pillen */
html body .gqrc-hero-btn {
    min-height: 48px;
    padding: 12px 24px;
    border: 0;
    border-radius: var(--gq-pille);
    font-family: var(--gq-sans);
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0;
    background: rgba(239, 233, 227, 0.14);
    color: var(--gq-titel);
}

html body .gqrc-hero-btn:hover,
html body .gqrc-hero-btn-secondary:hover {
    background: rgba(239, 233, 227, 0.22);
    color: var(--gq-titel);
}

html body .gqrc-hero-btn-primary {
    background: var(--gq-gruen);
    color: var(--gq-gruen-tinte);
}

html body .gqrc-hero-btn-primary:hover {
    background: var(--gq-gruen-hover);
    color: var(--gq-gruen-tinte);
}

html body .gqrc-hero-btn:active {
    transform: scale(0.97);
}

/* Pfeile rund und leise */
html body .video-feed-hero .gqrc-hero-nav,
html body .gqrc-hero-prev,
html body .gqrc-hero-next {
    width: 48px;
    height: 48px;
    border: 0;
    border-radius: 50%;
    background: rgba(239, 233, 227, 0.12);
    color: var(--gq-titel);
}

html body .video-feed-hero .gqrc-hero-nav:hover {
    background: rgba(239, 233, 227, 0.24);
    color: var(--gq-titel);
    transform: translateY(-50%);
}

/* Vorschaubild ohne Neonrahmen */
html body .video-feed-hero .gqrc-hero-thumbnail {
    border: 0;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
}

/* Fortschrittspunkte: größer zu treffen, linear laufend */
html body .gqrc-hero-indicators {
    gap: 6px;
}

html body .gqrc-hero-indicator {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: rgba(239, 233, 227, 0.35);
    outline: 10px solid transparent;
}

html body .gqrc-hero-indicator.active {
    width: 32px;
    border-radius: 999px;
    background: rgba(239, 233, 227, 0.25);
}

html body .gqrc-hero-indicator-progress {
    border-radius: 999px;
    background: var(--gq-titel);
}

html body .gqrc-hero-indicator.active .gqrc-hero-indicator-progress {
    animation-timing-function: linear;
}

html body .gqrc-hero-copyright,
html body .gqrc-hero-youtube-credit {
    font-family: var(--gq-sans);
    font-size: 0.8125rem;
    letter-spacing: 0;
    color: var(--gq-text-2);
}

/* ===================================================================
   STARTSEITE: Rubrik-Kacheln, Zahlen, Countdown, Sendepartner
   =================================================================== */

html body .nav-card {
    border: 0 !important;
    background: var(--gq-flaeche-2);
}

html body .nav-card__image {
    transition: transform 600ms var(--gq-ease);
}

@media (hover: hover) and (pointer: fine) {
    html body .nav-card__link:hover .nav-card__image {
        transform: scale(1.04);
    }

    html body .gqrc-review-card:hover .gqrc-card-image,
    html body .gqrc-video-card:hover .gqrc-card-image {
        filter: brightness(1.08);
    }
}

html body .nav-card__overlay {
    height: 70%;
    background: linear-gradient(0deg, rgba(19, 17, 18, 0.92) 0%, rgba(19, 17, 18, 0.5) 50%, rgba(19, 17, 18, 0) 100%);
}

html body .nav-card__title {
    padding: clamp(16px, 2vw, 24px);
}

html body .nav-card__title h3 {
    font-size: clamp(1.375rem, 2.2vw, 2rem);
    letter-spacing: -0.03em;
    color: var(--gq-titel);
}

html body .nav-card:hover {
    border-color: transparent;
}

html body .nav-card__link:focus-visible {
    outline: var(--gq-fokus);
    outline-offset: 4px;
}

/* Zahlen: eine ruhige Zeile statt vier Kästen */
html body .gqrc-columns:has(> .stat-box) {
    gap: 0 !important;
    background: var(--gq-flaeche-1);
}

html body .stat-box {
    background: transparent;
    border: 0;
    padding: clamp(24px, 3vw, 40px) clamp(16px, 2vw, 32px);
    text-align: left;
}

html body .stat-box + .stat-box {
    box-shadow: inset 1px 0 0 var(--gq-kante);
}

html body .stat-box:hover {
    border-color: transparent;
}

html body .stat-number {
    font-family: var(--gq-display);
    font-size: clamp(2.25rem, 4vw, 3.5rem);
    line-height: 1;
    letter-spacing: -0.03em;
    color: var(--gq-titel);
    font-variant-numeric: tabular-nums;
}

html body .stat-label {
    margin-top: 10px;
    font-family: var(--gq-sans);
    font-size: 1rem;
    color: var(--gq-text-2);
    text-transform: lowercase;
}

/* Countdown und Sendepartner: Flächenstufe statt weißer Kasten (Werte kommen inline aus dem Builder) */
html body .goqueer-countdown {
    background: var(--gq-flaeche-1) !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: clamp(28px, 3.5vw, 48px) !important;
    text-align: left !important;
}

html body .goqueer-countdown h3 {
    margin-bottom: 20px;
    font-size: clamp(1.375rem, 2.2vw, 2rem);
    letter-spacing: -0.03em;
    color: var(--gq-titel) !important;
}

html body .goqueer-countdown-inline {
    display: grid !important;
    grid-template-columns: repeat(4, auto);
    gap: clamp(12px, 2.4vw, 32px);
    justify-content: start !important;
}

html body .goqueer-countdown-inline > div {
    display: flex;
    align-items: baseline;
    gap: 6px;
}

html body .goqueer-countdown-days,
html body .goqueer-countdown-hours,
html body .goqueer-countdown-minutes,
html body .goqueer-countdown-seconds {
    font-family: var(--gq-display) !important;
    font-size: clamp(2.5rem, 4.2vw, 4rem) !important;
    letter-spacing: -0.03em;
    width: auto !important;
    min-width: 2ch !important;
    text-align: left !important;
    color: var(--gq-titel) !important;
}

html body .goqueer-countdown-inline span:not([class]) {
    font-size: 0.9375rem !important;
    color: var(--gq-text-2) !important;
}

html body .goqueer-countdown > p {
    margin: 20px 0 0;
    font-family: var(--gq-sans) !important;
    font-size: 1.0625rem !important;
    font-weight: 500 !important;
    color: var(--gq-gruen) !important;
}

/* Sekundentakt ohne Farbglitch */
html body .goqueer-countdown-days.glitch-flash,
html body .goqueer-countdown-hours.glitch-flash,
html body .goqueer-countdown-minutes.glitch-flash,
html body .goqueer-countdown-seconds.glitch-flash {
    animation: none;
}

html body .slider[id^="ps-"] {
    background: var(--gq-flaeche-1) !important;
    border-radius: 0 !important;
    padding: clamp(28px, 3.5vw, 48px) 0 !important;
}

html body .slider[id^="ps-"]::before {
    background: linear-gradient(90deg, var(--gq-flaeche-1) 0%, rgba(27, 24, 25, 0) 100%) !important;
    width: 96px !important;
}

html body .slider[id^="ps-"]::after {
    background: linear-gradient(270deg, var(--gq-flaeche-1) 0%, rgba(27, 24, 25, 0) 100%) !important;
    width: 96px !important;
}

html body .slider[id^="ps-"] .slider-title {
    text-align: left !important;
    padding: 0 clamp(28px, 3.5vw, 48px) !important;
    border-left: 0 !important;
    letter-spacing: -0.03em !important;
    font-size: clamp(1.375rem, 2.2vw, 2rem) !important;
    color: var(--gq-titel) !important;
}

/* Logos einheitlich hell auf Dunkel (Masken-Fläche), beim Drüberfahren in Senderfarbe */
html body .slider[id^="ps-"] .slide-color {
    background-color: rgba(239, 233, 227, 0.72) !important;
    transition: background-color var(--gq-t-kurz) var(--gq-ease) !important;
}

html body .slider[id^="ps-"] .slide a:hover .slide-color,
html body .slider[id^="ps-"] .slide:hover .slide-color {
    background-color: var(--partner-color, var(--gq-titel)) !important;
}

html body .slider[id^="ps-"] .slider-title {
    position: relative;
    z-index: 3;
}

/* Laufband hält an, wenn man drüberfährt oder es fokussiert (WCAG 2.2.2) */
html body .slider[id^="ps-"]:hover .slide-track,
html body .slider[id^="ps-"]:focus-within .slide-track {
    animation-play-state: paused !important;
}

@media (prefers-reduced-motion: reduce) {
    html body .slider[id^="ps-"] .slide-track {
        animation: none !important;
        flex-wrap: wrap;
        width: auto !important;
        justify-content: center;
    }
}

@media (max-width: 768px) {
    html body .gqrc-columns:has(> .stat-box) {
        grid-template-columns: 1fr 1fr !important;
    }

    html body .stat-box:nth-child(3) {
        box-shadow: inset 0 1px 0 var(--gq-kante);
    }

    html body .stat-box:nth-child(4) {
        box-shadow: inset 1px 0 0 var(--gq-kante), inset 0 1px 0 var(--gq-kante);
    }

    html body .gqrc-columns:has(> .goqueer-countdown) {
        grid-template-columns: 1fr !important;
    }

    html body .gqrc-columns:has(> .nav-card__link) {
        grid-template-columns: 1fr 1fr !important;
        gap: 12px !important;
    }

    html body .nav-card__title h3 {
        font-size: 1.25rem;
    }
}

/* ===================================================================
   MEDIATHEK & REVIEWS: Reihen, Karten, Abzeichen
   =================================================================== */

html body .gqrc-category-section {
    padding: 0 var(--gq-rand);
    margin-bottom: clamp(56px, 6vw, 96px) !important;
}

/* Keine Verlaufslinien zwischen den Reihen: Abstand trennt */
html body .gqrc-category-section + .gqrc-category-section::before {
    display: none;
}

html body .gqrc-section-header {
    align-items: flex-end;
    margin-bottom: 20px;
}

html body .gqrc-category-title {
    gap: 12px;
    padding-left: 0;
    border-left: 0;
    background: none;
    font-size: clamp(1.75rem, 3.2vw, 2.75rem);
    letter-spacing: -0.03em;
}

/* Rubrik-Symbol leise statt grün */
html body .gqrc-category-title i {
    font-size: 0.6em;
}

html body .gqrc-category-subtitle {
    font-family: var(--gq-sans);
    font-size: 0.42em;
    font-weight: 500;
    letter-spacing: 0;
    opacity: 1;
    color: var(--gq-text-2);
}

html body .gqrc-show-all-link {
    min-height: 44px;
    padding: 0 4px;
    border-bottom: 0;
    font-family: var(--gq-sans);
    font-size: 0.9375rem;
    font-weight: 500;
    letter-spacing: 0;
    color: var(--gq-text-2);
}

html body .gqrc-show-all-link:hover {
    color: var(--gq-titel);
}

/* Karten: kein Rahmen, ruhiges Anheben des Bildes */
html body .gqrc-review-card,
html body .gqrc-video-card {
    border: 0;
    background: var(--gq-flaeche-1);
}

html body .gqrc-review-card:hover,
html body .gqrc-video-card:hover {
    border-color: transparent;
    transition-delay: 0s;
}

html body .gqrc-card-image {
    transition: transform 500ms var(--gq-ease), filter 300ms var(--gq-ease);
}

html body .gqrc-card-link:focus-visible,
html body .gqrc-review-card:focus-visible {
    outline: var(--gq-fokus);
    outline-offset: 3px;
}

html body .gqrc-card-overlay {
    padding: 14px 12px 12px;
    background: linear-gradient(0deg, rgba(19, 17, 18, 0.95) 0%, rgba(19, 17, 18, 0.55) 60%, rgba(19, 17, 18, 0) 100%);
}

html body .gqrc-review-card:hover .gqrc-card-overlay {
    transition-delay: 0.1s;
}

html body .gqrc-card-title {
    font-family: var(--gq-sans);
    font-weight: 600;
    color: var(--gq-titel);
}

/* Dauer, Sterne, Aufrufe: kleine dunkle Pille unten rechts */
html body .gqrc-card-badge {
    bottom: 8px;
    right: 8px;
    padding: 4px 10px;
    border: 0;
    border-radius: var(--gq-pille);
    background: rgba(19, 17, 18, 0.82);
    color: var(--gq-titel);
    font-family: var(--gq-sans);
    font-size: 0.8125rem;
    font-weight: 500;
    letter-spacing: 0;
    font-variant-numeric: tabular-nums;
}

html body .gqrc-card-badge .fa-star,
html body .gqrc-card-badge .fa-star-half-alt {
    color: var(--gq-gruen);
}

/* Art der Karte (Mix-Reihe): ein Zeichen, eine Pille, keine Neonrahmen */
html body .gqrc-type-badge,
html body .gqrc-type-video,
html body .gqrc-type-shorts,
html body .gqrc-type-podcast,
html body .gqrc-type-review {
    top: 8px;
    left: 8px;
    width: 28px;
    height: 28px;
    padding: 0;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    background: rgba(19, 17, 18, 0.82);
    color: var(--gq-titel);
    font-family: var(--gq-sans);
    font-size: 0.75rem;
}

/* Kommende Reviews: Datum unter dem Plakat */
html body .gqrc-broadcast-info {
    background: var(--gq-flaeche-1) !important;
    border: 0 !important;
    padding: 10px 12px !important;
    font-family: var(--gq-sans) !important;
    font-size: 0.875rem !important;
    color: var(--gq-text) !important;
}

html body .gqrc-bc-sender,
html body .gqrc-bc-sender i {
    color: var(--gq-gruen) !important;
}

/* Blätterknöpfe: rund, sichtbar auch ohne Hover auf Tastatur-Fokus */
html body .gqrc-scroll-btn {
    width: 48px;
    height: 48px;
    border: 0;
    border-radius: 50% !important;
    background: var(--gq-flaeche-3);
    color: var(--gq-titel);
    font-size: 1rem;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

html body .gqrc-scroll-btn:hover {
    background: var(--gq-titel);
    color: var(--gq-grund);
}

html body .gqrc-scroll-btn:focus-visible {
    opacity: 1;
}

html body .gqrc-scroll-left {
    left: -24px;
}

html body .gqrc-scroll-right {
    right: -24px;
}

/* Top 10: große Ziffern in Arvo, leise */
html body .gqrc-top10-rank {
    font-family: var(--gq-display) !important;
    color: var(--gq-text-3) !important;
    -webkit-text-stroke: 0 !important;
    text-shadow: none !important;
}

html body .gqrc-top10-section .gqrc-top10-icon {
    color: var(--gq-text-3);
}

/* Zurück-Knopf */
html body .gqrc-back-button {
    min-height: 48px;
    border: 0;
    border-radius: var(--gq-pille);
    background: var(--gq-flaeche-3);
    color: var(--gq-titel);
    font-family: var(--gq-sans);
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

html body .gqrc-back-button:hover {
    background: var(--gq-titel);
    color: var(--gq-grund);
}

/* ===================================================================
   MITMACHEN (Kontakt & Spenden) und ÜBER UNS: Farben der Seiten-Tokens
   =================================================================== */

html body .gq-ks-host,
html body .gq-about-host,
html body .gq-about-page {
    --black: var(--gq-grund);
    --dark: var(--gq-flaeche-1);
    --white: var(--gq-titel);
    --grey: var(--gq-text-2);
    --grey-dark: var(--gq-text-3);
    --surface: var(--gq-flaeche-2);
    --surface2: var(--gq-flaeche-3);
    --blue: var(--gq-text-2);
    --purple: var(--gq-flaeche-2);
    --f-head: var(--gq-display);
    --f-body: var(--gq-sans);
}

html body.page-template-page-kontakt-spenden,
html body.page-template-page-about {
    background: var(--gq-grund);
}

/* Kein Neonrahmen um die ganze Seite */
html body .gq-ks-host::after,
html body .gq-about-host::after {
    display: none;
}

/* Mitmachen: Abschnitte stehen nicht mehr drei Bildschirme lang fest,
   die Seite liest sich von oben nach unten (wie bisher schon auf dem Handy). */
html body .gq-ks-host .gq-ks-sec {
    height: auto !important;
}

html body .gq-ks-host .gq-ks-sticky {
    position: relative !important;
    top: auto !important;
    height: auto !important;
    overflow: visible !important;
    padding-top: 0;
    background: transparent;
}

html body .gq-ks-host .gq-ks-sticky--first .hero {
    min-height: min(78svh, 760px);
    height: auto;
}

html body .gq-ks-host .gq-ks-sticky .sec {
    padding-top: var(--gq-abschnitt);
    padding-bottom: 0;
}

html body .gq-ks-host .gq-ks-sec--kontakt #kontakt,
html body .gq-ks-host .gq-ks-sec--kontakt .contact-split {
    height: auto;
}

/* Hervorgehobene Wörter: aufrecht, in Hausgrün */
html body .gq-ks-host .hero__word--accent,
html body .gq-ks-host .t-green,
html body .gq-pillars-h h2 em {
    font-style: normal !important;
    color: var(--gq-gruen);
}

html body .gq-ks-host .hero__hl {
    color: var(--gq-text-2);
}

/* Formularfelder: sichtbarer Rand, lesbare Platzhalter, klarer Fokus */
html body .gq-ks-host input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
html body .gq-ks-host select,
html body .gq-ks-host textarea,
html body .gq-contact-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
html body .gq-contact-form select,
html body .gq-contact-form textarea {
    background: var(--gq-flaeche-2) !important;
    border: 1px solid var(--gq-kante-feld) !important;
    border-radius: 10px !important;
    color: var(--gq-titel) !important;
    min-height: 48px;
    font-family: var(--gq-sans) !important;
    font-size: 1rem;
    box-shadow: none !important;
    transition: border-color var(--gq-t-kurz) var(--gq-ease), box-shadow var(--gq-t-kurz) var(--gq-ease);
}

html body .gq-ks-host input::placeholder,
html body .gq-ks-host textarea::placeholder,
html body .gq-contact-form input::placeholder,
html body .gq-contact-form textarea::placeholder {
    color: var(--gq-text-3) !important;
    opacity: 1;
}

html body .gq-ks-host input:hover,
html body .gq-ks-host select:hover,
html body .gq-ks-host textarea:hover {
    border-color: rgba(239, 233, 227, 0.5) !important;
}

html body .gq-ks-host input:focus,
html body .gq-ks-host select:focus,
html body .gq-ks-host textarea:focus,
html body .gq-contact-form input:focus,
html body .gq-contact-form select:focus,
html body .gq-contact-form textarea:focus {
    outline: none !important;
    border-color: var(--gq-gruen) !important;
    box-shadow: 0 0 0 3px var(--gq-gruen-schleier) !important;
}

html body .gq-ks-host input[aria-invalid="true"],
html body .gq-ks-host textarea[aria-invalid="true"],
html body .gq-ks-host .is-invalid {
    border-color: var(--gq-fehler) !important;
}

html body .gq-ks-host label,
html body .gq-contact-form label {
    color: var(--gq-text) !important;
    font-family: var(--gq-sans) !important;
    font-size: 0.9375rem !important;
    letter-spacing: 0 !important;
}

html body .gq-ks-host .toggle-opt:focus-visible,
html body .gq-ks-host [tabindex]:focus-visible {
    outline: var(--gq-fokus) !important;
    outline-offset: 3px !important;
}

html body .gq-ks-host button[type="submit"],
html body .gq-ks-host .btn-submit,
html body .gq-contact-form button[type="submit"] {
    min-height: 52px;
    border-radius: var(--gq-pille) !important;
    background: var(--gq-gruen) !important;
    color: var(--gq-gruen-tinte) !important;
    font-family: var(--gq-sans) !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
}

html body .gq-ks-host button[type="submit"]:disabled,
html body .gq-contact-form button[type="submit"]:disabled {
    background: var(--gq-flaeche-3) !important;
    color: var(--gq-aus) !important;
}

/* ===================================================================
   EMPFANG: Karte, Zoom, Senderkacheln (Builder schreibt Stile mit #id → !important)
   =================================================================== */

html body .gq-empfang {
    --leise: var(--gq-text-2);
    --linie: var(--gq-kante);
    padding: 72px var(--gq-rand) 8px;
}

html body .gq-empfang__titel {
    font-size: clamp(2.75rem, 6vw, 5.5rem) !important;
    letter-spacing: -0.035em;
}

html body .gq-empfang__lead {
    color: var(--gq-text) !important;
    font-size: 1.125rem;
}

html body .gq-empfang__naechster {
    border-radius: var(--gq-pille);
    background: var(--gq-flaeche-2) !important;
    padding: 10px 18px !important;
    border: 0 !important;
}

html body .gq-online__label {
    border-radius: var(--gq-pille);
    padding: 3px 10px;
    font-family: var(--gq-sans);
    font-weight: 600;
    color: var(--gq-gruen-tinte);
}

html body .goqueer-partner-map__viewport {
    border: 0 !important;
    background: var(--gq-flaeche-1);
}

html body .goqueer-map-controls {
    top: 20px !important;
    right: 20px !important;
    gap: 4px !important;
    padding: 6px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: rgba(19, 17, 18, 0.88) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
    font-family: var(--gq-sans) !important;
}

html body .goqueer-map-controls button {
    width: 40px !important;
    height: 40px !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: var(--gq-flaeche-3) !important;
    color: var(--gq-titel) !important;
}

html body .goqueer-map-controls button:hover {
    background: var(--gq-titel) !important;
    color: var(--gq-grund) !important;
}

html body .goqueer-map-zoom-slider {
    accent-color: var(--gq-titel) !important;
}

html body .gq-empfang-leitungen circle {
    fill: var(--gq-titel);
    stroke: var(--gq-grund);
}

html body .gq-bento__cell {
    background: var(--gq-flaeche-1) !important;
    border: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color var(--gq-t-kurz) var(--gq-ease), box-shadow var(--gq-t-kurz) var(--gq-ease) !important;
}

html body .gq-bento__cell:hover,
html body .gq-bento__cell:focus-within {
    background: var(--gq-flaeche-2) !important;
    box-shadow: inset 0 0 0 2px var(--cell-accent, var(--gq-titel)) !important;
}

html body .gq-bento__cell::before,
html body .gq-bento__cell::after {
    display: none !important;
}

html body .gq-bento__cell:hover .gq-bento__logo-img {
    animation: none !important;
}

html body .gq-bento__details {
    background: rgba(27, 24, 25, 0.96) !important;
}

html body .gq-bento__details-name,
html body .gq-bento__name {
    color: var(--gq-titel) !important;
    font-family: var(--gq-display) !important;
    font-size: 1rem !important;
}

html body .gq-bento__details-meta span {
    border: 0 !important;
    border-radius: var(--gq-pille);
    background: var(--gq-flaeche-3);
    color: var(--gq-text) !important;
    font-family: var(--gq-sans) !important;
    font-size: 0.8125rem !important;
    letter-spacing: 0 !important;
}

html body .gq-bento__details-desc {
    color: var(--gq-text) !important;
    font-size: 0.875rem !important;
}

html body .gq-bento__details-link {
    color: var(--gq-gruen) !important;
    font-family: var(--gq-sans) !important;
    font-size: 0.9375rem !important;
    letter-spacing: 0 !important;
}

html body .gq-bento__cta {
    background: var(--gq-flaeche-2) !important;
    border: 0 !important;
    box-shadow: none !important;
}

html body .gq-bento__cta-icon {
    color: var(--gq-gruen) !important;
}

html body .gq-bento__cta-text {
    color: var(--gq-titel) !important;
    font-family: var(--gq-display) !important;
    letter-spacing: -0.03em !important;
}

html body .gq-bento__cta-link {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 10px 20px !important;
    border: 0 !important;
    border-radius: var(--gq-pille) !important;
    background: var(--gq-gruen) !important;
    color: var(--gq-gruen-tinte) !important;
    font-family: var(--gq-sans) !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
}

html body .gq-bento__cta-link:hover {
    background: var(--gq-gruen-hover) !important;
}

/* ===================================================================
   COOKIE-DIALOG und -KNOPF, BARRIEREFREIHEITS-LEISTE
   =================================================================== */

html body .gq-cc__backdrop {
    background: rgba(10, 9, 9, 0.6);
}

html body .gq-cc__dialog {
    max-width: 640px;
    background: var(--gq-flaeche-1);
    border: 0;
    border-radius: 20px;
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.55), 0 0 0 1px var(--gq-kante);
}

html body .gq-cc__content {
    padding: clamp(24px, 4vw, 36px);
}

html body .gq-cc__title {
    animation: none;
    font-family: var(--gq-display);
    font-size: 1.75rem;
    letter-spacing: -0.03em;
}

html body .gq-cc__text,
html body .gq-cc__category-desc,
html body .gq-cc__service-item {
    color: var(--gq-text);
}

html body .gq-cc__btn {
    min-height: 48px;
    padding: 12px 22px;
    border: 0 !important;
    border-radius: var(--gq-pille);
    font-family: var(--gq-sans);
    font-weight: 600;
    font-size: 1rem;
    letter-spacing: 0;
}

/* Annehmen und Ablehnen gleich gewichtig (DSGVO) */
html body .gq-cc__btn--accept-all {
    background: var(--gq-gruen);
    color: var(--gq-gruen-tinte);
}

html body .gq-cc__btn--accept-all:hover {
    background: var(--gq-gruen-hover);
}

html body .gq-cc__btn--reject-all {
    background: var(--gq-titel);
    color: var(--gq-grund);
}

html body .gq-cc__btn--reject-all:hover {
    background: #ffffff;
}

html body .gq-cc__btn--toggle-details,
html body .gq-cc__btn--save {
    background: var(--gq-flaeche-3);
    color: var(--gq-titel);
}

html body .gq-cc__btn--toggle-details:hover,
html body .gq-cc__btn--save:hover {
    background: #3a3435;
}

html body .gq-cc__legal a,
html body .gq-cc__link {
    color: var(--gq-text-2);
    text-decoration: underline;
}

html body .gq-cc-badge {
    left: max(16px, env(safe-area-inset-left, 0px));
    bottom: max(16px, env(safe-area-inset-bottom, 0px));
    min-height: 40px;
    padding: 8px 16px;
    border: 0;
    border-radius: var(--gq-pille);
    background: var(--gq-flaeche-2);
    color: var(--gq-text);
    font-family: var(--gq-sans);
    font-size: 0.875rem;
    font-weight: 500;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
    transform: translateY(calc(100% + 24px));
}

html body .gq-cc-badge--visible {
    transform: none;
}

html body .gq-cc-badge:hover {
    background: var(--gq-flaeche-3);
    color: var(--gq-titel);
}

html body .gq-a11y-toolbar__toggle {
    width: 48px;
    height: 48px;
    background: var(--gq-flaeche-3);
    color: var(--gq-titel);
    border-radius: 14px 0 0 14px;
    box-shadow: -8px 0 24px rgba(0, 0, 0, 0.35);
}

html body .gq-a11y-toolbar__toggle:hover,
html body .gq-a11y-toolbar__toggle[aria-expanded="true"] {
    background: var(--gq-gruen);
    color: var(--gq-gruen-tinte);
}

html body .gq-a11y-toolbar__toggle:focus-visible {
    outline: var(--gq-fokus);
    outline-offset: 3px;
}

html body .gq-a11y-toolbar__panel {
    border: 0;
    border-radius: 16px 0 0 16px;
    box-shadow: -16px 0 48px rgba(0, 0, 0, 0.5), 0 0 0 1px var(--gq-kante);
}

/* Mitmachen: keine Geisterwörter und Zierzeichen hinter dem Inhalt */
html body .gq-ks-host .sec__watermark,
html body .gq-ks-host .contact-left__deco {
    display: none;
}

/* Drück-Feedback auf allem, was man tippt */
html body .nav-card__link:active .nav-card,
html body .gqrc-card-link:active .gqrc-card-inner,
html body .gqrc-scroll-btn:active,
html body .social-icon:active,
html body .gq-bento__cta-link:active,
html body .gq-cc__btn:active,
html body .gq-cc-badge:active {
    transform: scale(0.97);
}

html body .nav-card,
html body .gqrc-card-inner,
html body .gq-cc__btn {
    transition: transform var(--gq-t-kurz) var(--gq-ease);
}

/* Nachschärfen nach dem ersten Durchgang */
html body .nav-card__link,
html body .nav-card__link:hover {
    border-bottom: 0 !important;
}

html body .gqrc-hero-btn,
html body .gqrc-hero-meta-badge,
html body .gqrc-hero-badge-current {
    font-family: var(--gq-sans) !important;
    letter-spacing: 0 !important;
    text-transform: lowercase;
}

@media (max-width: 600px) {
    html body .goqueer-countdown-inline {
        grid-template-columns: repeat(4, auto);
        gap: 4px 14px;
    }

    html body .goqueer-countdown-inline > div {
        flex-direction: column;
        gap: 2px;
    }

    html body .goqueer-countdown-days,
    html body .goqueer-countdown-hours,
    html body .goqueer-countdown-minutes,
    html body .goqueer-countdown-seconds {
        font-size: 2.25rem !important;
    }
}

/* ===================================================================
   FARBE: die bestehenden goqueer-Farben Grün, Pink, Cyan, Lila
   Wechsel im alten 3er-Rhythmus, auf Dunkel als Zeichen, Zahlen,
   Ringe, Pillen und getönte Flächen.
   =================================================================== */

/* Reihen in Mediathek und Reviews: Symbol im Rhythmus Grün – Pink – Cyan */
html body .gqrc-category-section:nth-of-type(3n+1) { --reihe: var(--gq-gruen); }
html body .gqrc-category-section:nth-of-type(3n+2) { --reihe: var(--gq-pink); }
html body .gqrc-category-section:nth-of-type(3n+3) { --reihe: var(--gq-cyan); }

html body .gqrc-category-title i,
html body .gqrc-category-title span,
html body .gqrc-top10-section .gqrc-top10-icon {
    color: var(--reihe, var(--gq-gruen)) !important;
}

html body .gqrc-review-card:hover .gqrc-card-inner,
html body .gqrc-card-link:focus-visible .gqrc-card-inner {
    box-shadow: 0 0 0 2px var(--reihe, var(--gq-gruen));
}

html body .gqrc-scroll-btn:hover {
    background: var(--reihe, var(--gq-gruen));
    color: var(--gq-grund);
}

/* „neu“ und Art-Etiketten im Karussell: Pink wie bisher, als Pille */
html body .gqrc-hero-neu-label,
html body .gqrc-hero-review-label,
html body .gqrc-hero-podcast-label,
html body .gqrc-hero-video-label {
    background: var(--gq-pink);
    color: var(--gq-pink-tinte);
}

/* Art-Zeichen auf Karten in ihrer Farbe */
html body .gqrc-type-video { color: var(--gq-cyan); }
html body .gqrc-type-podcast { color: var(--gq-pink); }
html body .gqrc-type-review { color: var(--gq-gruen); }
html body .gqrc-type-shorts { color: var(--gq-pink); }

/* Startseite: Rubrik-Kacheln mit Farbkante unten */
html body .gqrc-columns > .nav-card__link:nth-child(4n+1) { --kachel: var(--gq-gruen); }
html body .gqrc-columns > .nav-card__link:nth-child(4n+2) { --kachel: var(--gq-pink); }
html body .gqrc-columns > .nav-card__link:nth-child(4n+3) { --kachel: var(--gq-cyan); }
html body .gqrc-columns > .nav-card__link:nth-child(4n+4) { --kachel: var(--gq-lila); }

html body .nav-card__overlay {
    box-shadow: inset 0 -5px 0 var(--kachel, var(--gq-gruen));
}

html body .nav-card__title h3 {
    z-index: 3;
}

/* Zahlenreihe: jede Zahl in einer Hausfarbe */
html body .stat-box:nth-child(1) .stat-number { color: var(--gq-gruen); }
html body .stat-box:nth-child(2) .stat-number { color: var(--gq-pink); }
html body .stat-box:nth-child(3) .stat-number { color: var(--gq-cyan); }
html body .stat-box:nth-child(4) .stat-number { color: var(--gq-lila-hell); }

/* Countdown auf Lila-Ton, Ziffern in Cyan; Sendepartner auf Pink-Ton */
html body .goqueer-countdown {
    background: var(--gq-ton-lila) !important;
}

html body .goqueer-countdown-days,
html body .goqueer-countdown-hours,
html body .goqueer-countdown-minutes,
html body .goqueer-countdown-seconds {
    color: var(--gq-cyan) !important;
}

html body .goqueer-countdown-inline span:not([class]) {
    color: var(--gq-lila-hell) !important;
}

html body .slider[id^="ps-"] {
    background: var(--gq-ton-pink) !important;
}

html body .slider[id^="ps-"]::before {
    background: linear-gradient(90deg, var(--gq-ton-pink) 0%, rgba(42, 18, 25, 0) 100%) !important;
}

html body .slider[id^="ps-"]::after {
    background: linear-gradient(270deg, var(--gq-ton-pink) 0%, rgba(42, 18, 25, 0) 100%) !important;
}

/* Kopf: aktive Seite mit Lila-Pille statt nur Strich */
html body .nav-links > .current-menu-item > a,
html body .nav-links > .current_page_item > a,
html body .nav-links > .current-menu-ancestor > a {
    background: #5a54e0; /* dunkleres Haus-Lila, damit Weiß 5,5:1 hat */
    color: #ffffff;
}

html body .nav-links > .current-menu-item > a::before,
html body .nav-links > .current_page_item > a::before,
html body .nav-links > .current-menu-ancestor > a::before {
    display: none;
}

/* Fuß auf Lila-Ton, Signet und Überschriften grün */
html body footer {
    background: var(--gq-ton-lila);
}

html body .footer-section h3,
html body footer .widget-title {
    color: var(--gq-gruen);
}

html body .social-icon,
html body footer a.social-icon {
    background: rgba(105, 98, 254, 0.28);
}

/* Empfang: „werde sendepartner“ auf Lila-Ton */
html body .gq-bento__cta {
    background: var(--gq-ton-lila) !important;
}

html body .gq-bento__cta-icon {
    color: var(--gq-lila-hell) !important;
}

/* Über uns: Karten in getönten Hausfarben */
html body .gq-pcard:nth-child(1) { background: var(--gq-ton-gruen); border: 0; }
html body .gq-pcard:nth-child(2) { background: var(--gq-ton-pink); border: 0; }
html body .gq-pcard:nth-child(3) { background: var(--gq-ton-cyan); border: 0; }
html body .gq-pcard:nth-child(1) .gq-picon { color: var(--gq-gruen); }
html body .gq-pcard:nth-child(2) .gq-picon { color: var(--gq-pink); }
html body .gq-pcard:nth-child(3) .gq-picon { color: var(--gq-cyan); }

/* News-Archiv: Zähler und Filmstreifen in Lila */
html body .gq-news-archiv,
html body .gqna {
    --band: var(--gq-lila);
    --band-tief: #4b45d6;
}

html body .gqna-item.is-offen .gqna-zeile {
    background: var(--gq-ton-lila);
}

html body .gq-about-bg {
    display: none;
}

/* Karten-Stecknadeln: kein Dauerpulsieren (Inline-Stil aus dem Builder) */
html body .goqueer-marker-pulse {
    animation: none !important;
}

/* ===================================================================
   BEWEGUNG (Phase 4) – wenige, begründete Momente
   Kurve: --gq-ease (starkes ease-out). Nur transform und opacity.
   =================================================================== */

/* 1. Startseite: der erste Eindruck baut sich auf – Titel, Text, Knöpfe, Zeile
      steigen nacheinander 16 px auf. Einmal pro Seitenaufruf, CSS-Animation
      (läuft auch, wenn die Seite noch lädt), kein Skript nötig. */
@keyframes gq-aufsteigen {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: none; }
}

html body .gq-home-hero__title,
html body .gq-home-hero__lead,
html body .gq-home-hero__actions,
html body .gq-home-hero__kicker {
    animation: gq-aufsteigen 640ms var(--gq-ease) both;
}

html body .gq-home-hero__lead { animation-delay: 80ms; }
html body .gq-home-hero__actions { animation-delay: 160ms; }
html body .gq-home-hero__kicker { animation-delay: 240ms; }

/* 2. Untermenü klappt von seinem Auslöser aus auf (oben links), 160 ms */
html body .nav-links .sub-menu {
    transform-origin: top left;
    transform: translateY(-4px) scale(0.97);
}

html body .nav-links .menu-item-has-children:hover > .sub-menu,
html body .nav-links .menu-item-has-children:focus-within > .sub-menu {
    transform: none;
}

/* 3. Handy-Menü: die Einträge folgen der Tafel mit 30 ms Versatz.
      Beim Schließen ohne Versatz, damit es sofort weg ist. */
@media (max-width: 1024px) {
    html body .nav-links > li {
        opacity: 0;
        transform: translateX(16px);
        transition: opacity 200ms var(--gq-ease), transform 320ms var(--gq-ease);
    }

    html body .nav-links.active > li {
        opacity: 1;
        transform: none;
    }

    html body .nav-links.active > li:nth-child(2) { transition-delay: 30ms; }
    html body .nav-links.active > li:nth-child(3) { transition-delay: 60ms; }
    html body .nav-links.active > li:nth-child(4) { transition-delay: 90ms; }
    html body .nav-links.active > li:nth-child(5) { transition-delay: 120ms; }
    html body .nav-links.active > li:nth-child(6) { transition-delay: 150ms; }
    html body .nav-links.active > li:nth-child(n+7) { transition-delay: 180ms; }
}

/* 4. News-Archiv: Meldung klappt schneller auf (vorher 420 ms) */
html body .gqna--js .gqna-detail {
    transition-duration: 280ms, 200ms;
}

/* Weniger Bewegung: nichts wandert, Inhalte sind sofort da */
@media (prefers-reduced-motion: reduce) {
    html body .gq-home-hero__title,
    html body .gq-home-hero__lead,
    html body .gq-home-hero__actions,
    html body .gq-home-hero__kicker {
        animation: none;
    }

    html body .nav-links > li,
    html body .nav-links.active > li {
        transform: none;
        transition: opacity 150ms ease;
        transition-delay: 0s !important;
    }

    html body .nav-links .sub-menu {
        transform: none;
    }
}

/* Offenes Handy-Menü: schwebende Knöpfe (Cookies, Barrierefreiheit) treten zurück */
html body:has(.nav-links.active) .gq-a11y-toolbar,
html body:has(.nav-links.active) .gq-cc-badge,
html body:has(.nav-links.active) .gq-back-to-top {
    opacity: 0;
    pointer-events: none;
}

/* ===================================================================
   HANDY (Phase 5, mobile-native)
   =================================================================== */

/* Karussell-Höhe an der kleinsten Bildschirmhöhe ausrichten (Adressleiste) */
html body .gqrc-hero-section {
    height: min(var(--gqrc-hero-height, 80vh), 80svh);
}

/* Reihen: Wischen rastet an Kartenkanten ein, die Seite scrollt weiter senkrecht */
@media (pointer: coarse) {
    html body .gqrc-cards-row {
        scroll-snap-type: x proximity;
        scroll-padding-inline: var(--gq-rand);
        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch;
    }

    html body .gqrc-cards-row > * {
        scroll-snap-align: start;
    }

    /* Blätterknöpfe sind Mauswerkzeug; auf Touch wischt man */
    html body .gqrc-scroll-btn {
        display: none;
    }
}

/* Hover-Zustände nur mit Maus: auf Touch bleiben sie sonst nach dem Tippen hängen */
@media (hover: none) {
    html body .gq-bento__cell:hover {
        background: var(--gq-flaeche-1) !important;
        box-shadow: none !important;
    }

    html body .gqrc-review-card:hover .gqrc-card-inner {
        box-shadow: none;
    }

    html body .gqrc-review-card:hover .gqrc-card-overlay {
        opacity: 0;
    }
}

/* ===================================================================
   EXTREMDATEN (Phase 5, break-ui): lange Titel, 320 px, große Zahlen
   =================================================================== */

/* Spalten im Builder dürfen schmaler werden als ihr Inhalt */
html body .gqrc-columns > * {
    min-width: 0;
}

/* Lange Wörter (Mail-Adressen, Komposita) brechen statt überzulaufen */
html body .gqrc-card-title,
html body .nav-card__title h3,
html body .gqrc-hero-title,
html body .gqna-h,
html body .gq-ks-host dd,
html body footer address {
    overflow-wrap: anywhere;
}

/* Karussell: lange Titel höchstens drei Zeilen, Text darunter bleibt lesbar */
html body .gqrc-hero-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    overflow: hidden;
}

html body .nav-card__title h3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
}

@media (max-width: 600px) {
    /* „neu“-Etikett gehört über den Titel, nicht darauf */
    html body .video-feed-hero .gqrc-hero-content {
        top: 64px;
        bottom: auto;
    }

    html body .gqrc-hero-title {
        font-size: clamp(1.625rem, 7.5vw, 2rem);
    }

    html body .gqrc-hero-description {
        -webkit-line-clamp: 3;
        height: auto;
        max-height: calc(1.0625rem * 1.6 * 3);
    }
}

/* Countdown: bei sehr schmalen Bildschirmen oder dreistelligen Tagen zwei mal zwei */
@media (max-width: 380px) {
    html body .goqueer-countdown-inline {
        grid-template-columns: repeat(2, auto);
        gap: 12px 28px;
    }
}

html body .goqueer-countdown-days,
html body .goqueer-countdown-hours,
html body .goqueer-countdown-minutes,
html body .goqueer-countdown-seconds {
    min-width: 2ch !important;
    width: auto !important;
}

/* Mitmachen: Spendenkarte bricht um statt seitlich zu scrollen */
html body .gq-ks-host .donate-card,
html body .gq-ks-host .donate-card__inner,
html body .gq-ks-host .donate-panel,
html body .gq-ks-host .donate-card__form {
    min-width: 0;
    max-width: 100%;
}

html body .gq-ks-host .toggle-row {
    flex-wrap: wrap;
    max-width: 100%;
    border: 0;
    border-radius: var(--gq-pille);
    background: var(--gq-flaeche-2);
    padding: 4px;
    gap: 4px;
}

html body .gq-ks-host .toggle-opt,
html body .gq-ks-host .donate-tab {
    min-height: 44px;
    padding: 8px 18px;
    border: 0;
    border-radius: var(--gq-pille);
    font-family: var(--gq-sans);
    font-weight: 600;
    letter-spacing: 0;
    background: transparent;
}

html body .gq-ks-host .toggle-opt[aria-pressed="true"],
html body .gq-ks-host .donate-tab[aria-selected="true"] {
    background: var(--gq-gruen);
    color: var(--gq-gruen-tinte);
}

html body .gq-ks-host .donate-tabs {
    border: 0;
    border-radius: var(--gq-pille);
    background: var(--gq-flaeche-2);
    padding: 4px;
    gap: 4px;
    flex-wrap: wrap;
}

html body .gq-ks-host .bank-data__row {
    flex-wrap: wrap;
    gap: 2px 16px;
}

html body .gq-ks-host .bank-data dt {
    font-family: var(--gq-sans);
    font-weight: 500;
    letter-spacing: 0;
    color: var(--gq-text-2);
}

html body .gq-ks-host .bank-data dd {
    text-align: left;
}

html body .gq-ks-host .bank-data__mono {
    font-family: var(--gq-sans);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.04em;
}

/* Suchergebnis leer: ruhig, mit Weg ins News-Archiv */
html body .search-overlay-no-results p {
    font-family: var(--gq-display);
    color: var(--gq-titel);
}

html body .search-overlay-no-results__hint {
    margin-top: 12px !important;
    font-family: var(--gq-sans) !important;
    font-size: 1.0625rem !important;
    color: var(--gq-text-2) !important;
}

html body .search-overlay-no-results i {
    color: var(--gq-text-3);
}

/* Empfang: keine helle Kante um die Karte */
html body .goqueer-partner-map,
html body .goqueer-partner-map__container {
    border: 0 !important;
    background-color: var(--gq-flaeche-1) !important;
}

/* Kartenkarte eines Senders bleibt im Bild */
html body .goqueer-partner-card {
    max-width: min(320px, calc(100vw - 32px)) !important;
}

@media (max-width: 600px) {
    html body .gqrc-scroll-left { left: 0; }
    html body .gqrc-scroll-right { right: 0; }
}

/* Text auf 200 %: umbrechen statt überlaufen (WCAG 1.4.4 / 1.4.10) */
html body .goqueer-countdown-inline {
    display: flex !important;
    flex-wrap: wrap;
}

html body .gq-ks-host .hero__word,
html body .gq-ks-host .hero__title {
    overflow-wrap: anywhere;
    max-width: 100%;
}

html body .gq-ks-host .donate-tab,
html body .gq-ks-host .donate-optin__text {
    white-space: normal;
    min-width: 0;
}

html body .gqna-select,
html body .gqna-select select {
    max-width: 100%;
    min-width: 0;
}

html body .nav-container {
    min-width: 0;
}

html body .logo {
    flex-shrink: 1;
    min-width: 0;
}

html body .logo img {
    max-width: 100%;
    height: auto !important;
    max-height: 42px;
}

html body .gq-ks-host .c-val,
html body .gq-email,
html body .gq-cc__title {
    overflow-wrap: anywhere;
    min-width: 0;
}

html body .gq-home-hero__title {
    overflow-wrap: anywhere;
}

/* Karussell auf dem Handy: Text bleibt innerhalb der Ränder */
@media (max-width: 600px) {
    html body .gqrc-hero-content {
        left: var(--gq-rand);
        right: var(--gq-rand);
        max-width: none;
    }
}

/* Mediathek-Karussell schreibt eckige Etiketten inline: auch dort Pillen */
html body .gqrc-hero-neu-label,
html body .gqrc-hero-review-label,
html body .gqrc-hero-podcast-label,
html body .gqrc-hero-video-label,
html body .gqrc-hero-meta-badge,
html body .gqrc-hero-badge-current {
    border-radius: var(--gq-pille) !important;
}

/* ===================================================================
   MITMACHEN / SPENDEN – Aufbau wie die übrigen Seiten
   (linksbündig, ein Raster, Karten auf Flächenstufe, keine Leerfläche)
   =================================================================== */

/* Kopf: linksbündig, ohne Bildschirmhöhe und Scroll-Hinweis */
html body .gq-ks-host .hero {
    min-height: 0 !important;
    height: auto !important;
    align-items: flex-start;
    text-align: left;
    padding: clamp(56px, 8vw, 112px) var(--gq-rand) 0;
    max-width: 1280px;
    margin: 0 auto;
}

html body .gq-ks-host .hero__scroll,
html body .gq-ks-host .hero__glow,
html body .gq-ks-host .hero__corner,
html body .gq-ks-host .gq-ks-prog,
html body .gq-ks-host .divider-purple {
    display: none !important;
}

html body .gq-ks-host .hero__title {
    margin: 0 0 24px;
    font-size: clamp(3rem, 7vw, 6.5rem);
    line-height: 0.95;
    letter-spacing: -0.035em;
    perspective: none;
}

html body .gq-ks-host .hero__word--break {
    margin-top: 0.08em;
}

html body .gq-ks-host .hero__hl {
    font-size: 0.62em;
    letter-spacing: -0.03em;
    color: var(--gq-gruen);
}

html body .gq-ks-host .hero__desc {
    max-width: 52ch;
    margin: 0;
    text-align: left;
    font-size: 1.125rem;
    line-height: 1.6;
    color: var(--gq-text);
}

html body .gq-ks-host .hero__desc strong {
    color: var(--gq-titel);
}

/* Spenden: Text links, Karte rechts */
html body .gq-ks-host #spenden {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: clamp(32px, 5vw, 80px);
    align-items: start;
    max-width: 1280px;
    margin: 0 auto;
    padding: var(--gq-abschnitt) var(--gq-rand) 0;
}

html body .gq-ks-host .sec-head {
    margin: 0;
    position: sticky;
    top: calc(var(--gqrc-nav-height, 76px) + 32px);
}

html body .gq-ks-host .sec-title {
    font-size: clamp(2.25rem, 4.2vw, 3.75rem);
    letter-spacing: -0.035em;
    line-height: 0.98;
}

html body .gq-ks-host .sec-desc {
    max-width: 44ch;
    margin-top: 20px;
    font-size: 1.0625rem;
    line-height: 1.65;
    color: var(--gq-text);
}

/* Spendenkarte */
html body .gq-ks-host .donate-row {
    min-width: 0;
}

html body .gq-ks-host .donate-card {
    background: var(--gq-flaeche-1);
    border: 0;
    border-radius: 20px;
    padding: clamp(24px, 3.5vw, 40px);
}

html body .gq-ks-host .donate-card::before {
    display: none;
}

/* Kopfzeile der Karte steht in der Karte statt auf ihrer Kante */
html body .gq-ks-host .donate-card__head {
    position: static;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 28px;
}

html body .gq-ks-host .donate-card__tag {
    padding: 0;
    background: none;
    color: var(--gq-titel);
    font-family: var(--gq-display);
    font-size: clamp(1.5rem, 2.4vw, 2rem);
    letter-spacing: -0.03em;
    line-height: 1;
}

/* Nur sichtbare Zahlungsart zählt für die Kartenhöhe */
html body .gq-ks-host .donate-panel[hidden] {
    display: none !important;
}

html body .gq-ks-host .bank-card__desc {
    color: var(--gq-text);
    margin-bottom: 20px;
}

html body .gq-ks-host .bank-data {
    border-radius: 14px;
    background: var(--gq-flaeche-2);
    padding: 4px 20px;
}

html body .gq-ks-host .bank-data__row {
    padding: 14px 0;
    border-bottom: 1px solid var(--gq-kante);
    align-items: baseline;
}

html body .gq-ks-host .bank-data dt {
    font-size: 0.9375rem;
    min-width: 7.5em;
}

html body .gq-ks-host .bank-data dd {
    font-size: 1.0625rem;
    color: var(--gq-titel);
}

html body .gq-ks-host .bank-data__mono {
    font-size: 1.125rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: var(--gq-titel);
    -webkit-user-select: all;
    user-select: all;
}

html body .gq-ks-host .bank-card__note,
html body .gq-ks-host .donate-panel p:last-child {
    color: var(--gq-text-2);
}

/* Kontakt: gleiches Raster, Formular als Karte */
html body .gq-ks-host #kontakt {
    max-width: 1280px;
    margin: 0 auto;
    padding: var(--gq-abschnitt) var(--gq-rand) 0;
    overflow: visible;
}

html body .gq-ks-host .contact-split {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: clamp(32px, 5vw, 80px);
    min-height: 0;
    align-items: start;
}

html body .gq-ks-host .contact-left {
    padding: 0;
    align-self: start;
    overflow: visible;
}

html body .gq-ks-host .contact-left::after {
    display: none;
}

html body .gq-ks-host .sec-num {
    margin-bottom: 12px;
    font-family: var(--gq-sans);
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0;
    color: var(--gq-pink);
}

html body .gq-ks-host .contact-left__title {
    font-size: clamp(2.25rem, 4.2vw, 3.75rem);
    letter-spacing: -0.035em;
    line-height: 0.98;
}

html body .gq-ks-host .contact-left__desc {
    max-width: 36ch;
    margin: 16px 0 32px;
    color: var(--gq-text);
}

html body .gq-ks-host .c-ico {
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 50%;
    background: var(--gq-flaeche-2);
}

html body .gq-ks-host .c-lbl {
    font-size: 0.9375rem;
    color: var(--gq-text-2);
}

html body .gq-ks-host .c-val {
    font-size: 1.0625rem;
    color: var(--gq-titel);
}

html body .gq-ks-host .contact-right {
    border: 0;
    border-radius: 20px;
    background: var(--gq-flaeche-1);
    padding: clamp(24px, 3.5vw, 40px);
    overflow: visible;
}

html body .gq-ks-host .contact-right::before {
    display: none;
}

html body .gq-ks-host .form-tag {
    font-family: var(--gq-sans);
    font-size: 1rem;
    letter-spacing: 0;
    color: var(--gq-text-2);
}

@media (max-width: 900px) {
    html body .gq-ks-host #spenden,
    html body .gq-ks-host .contact-split {
        grid-template-columns: minmax(0, 1fr);
    }

    html body .gq-ks-host .sec-head {
        position: static;
    }
}

/* Nur eine Zahlungsart sichtbar: dann ist der Reiter ein ruhiges Etikett, kein Knopf */
html body .gq-ks-host .donate-tabs:has(#donate-tab-online[style*="none"]) {
    background: none;
    padding: 0;
}

html body .gq-ks-host .donate-tabs:has(#donate-tab-online[style*="none"]) .donate-tab {
    background: var(--gq-flaeche-3);
    color: var(--gq-text);
    pointer-events: none;
    min-height: 36px;
    padding: 6px 14px;
    font-weight: 500;
}

/* Bankdaten: Bezeichnung über dem Wert, überall gleich */
html body .gq-ks-host .bank-data__row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}

html body .gq-ks-host .bank-data dt {
    min-width: 0;
    margin: 0;
    font-size: 0.875rem;
}

html body .gq-ks-host .bank-data dd {
    text-align: left;
}

html body .gq-ks-host .bank-data__row:last-child {
    border-bottom: 0;
}

@media (max-width: 420px) {
    html body .gq-ks-host .bank-data__mono {
        font-size: 1rem;
        letter-spacing: 0.02em;
    }
}

/* Keine Trennlinie unter den Kontaktangaben */
html body .gq-ks-host .c-socials {
    border-top: 0;
    padding-top: 0;
}

html body .gq-ks-host .contact-left > hr,
html body .gq-ks-host .contact-left::before {
    display: none;
}

/* Mitmachen: Kopf mit Bild aus dem eigenen Studio (Röhrenwand „comment“) */
html body .gq-ks-host .hero {
    position: relative;
    max-width: none;
    min-height: min(72svh, 680px) !important;
    justify-content: flex-end;
    padding: 120px var(--gq-rand) clamp(40px, 6vw, 72px);
    overflow: hidden;
    isolation: isolate;
}

html body .gq-ks-host .hero::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -2;
    background: url('../images/mitmachen-studio.webp') center 35% / cover no-repeat;
}

/* Schleier: unten und links für die Schrift, VHS-Zeilen fein darüber */
html body .gq-ks-host .hero::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.14) 0 1px, transparent 1px 3px),
        linear-gradient(0deg, rgba(19, 17, 18, 1) 0%, rgba(19, 17, 18, 0.86) 30%, rgba(19, 17, 18, 0.2) 70%, rgba(19, 17, 18, 0.35) 100%),
        linear-gradient(90deg, rgba(19, 17, 18, 0.7) 0%, rgba(19, 17, 18, 0) 65%);
}

html body .gq-ks-host .hero__content {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
}

@media (max-width: 760px) {
    html body .gq-ks-host .hero {
        min-height: 78svh !important;
        padding-top: 96px;
    }

    html body .gq-ks-host .hero::before {
        background-image: url('../images/mitmachen-studio-960.webp');
        background-position: 45% 30%;
    }
}

html body .gq-ks-host .hero__word--break,
html body .gq-ks-host .hero__hl {
    display: block;
    line-height: 1.02;
}