/* =====================================================================
   Gestaltung nach dem Canvas (Mockup „FSR Jura Redesign“, Stand 01.10.2026)
   Wird als letzte Datei geladen. Regeln: docs/TYPOGRAFIE.md
   Schriften: Newsreader (Überschriften) · Schibsted Grotesk (Text) ·
   Instrument Sans (Navigation, Buttons, Footer, Oberzeilen, Chips)
   Ecken: Inhalt kantig (0) · kleine Icon-Kacheln 12 px · Buttons/Chips Pille

   ---------------------------------------------------------------------
   Layout-Konventionen (261001-hgx T2, gelten für alle weiteren Seiten)
   ---------------------------------------------------------------------
   Bänder: `wp:group {"align":"full","className":"band band--<farbe>",
   "backgroundColor":"<slug>","layout":{"type":"default"}}`. Breite/Innen-
   abstand ausschließlich über diese Datei (`.band`), NICHT über
   theme.json `contentSize`: die editor-styles-wrapper lädt canvas.css
   genauso wie das Frontend (siehe functions.php `add_editor_style`), die
   Innenbreite ist also in Editor und Frontend automatisch identisch, ohne
   die global genutzte theme.json-Vorgabe (1168px, von praktisch jedem
   Block site-weit verwendet) anzufassen. Innenbreite `--fsr-inhalt`
   (1040px, = Board-Breite 1280 − 2×120px Rand), Außenabstand
   `--fsr-gutter` (zentriert bei großen Fenstern, min. 40px/20px mobil).
   Variante `band--split`: zweispaltig 300px Überschrift / Rest Text
   (Board z. B. „Bevor du reinschaust“). Bandabstände je Board übernommen,
   Standard 56px oben / 60px unten. Kleine Abschnitts-Überschrift (Band-
   Titel wie „Nützliche Links“, 28/24 px) über Klasse `.band-titel--klein`.
   ===================================================================== */

:root {
    --fsr-inhalt: 1040px;
    --fsr-gutter: max(40px, calc((var(--fsr-page, 100vw) - var(--fsr-inhalt)) / 2));
    --fsr-serif: Newsreader, Georgia, serif;
    --fsr-text: 'Schibsted Grotesk', Arial, sans-serif;
    --fsr-ui: 'Instrument Sans', Arial, sans-serif;
    --fsr-bordeaux: #5e1f27;
    --fsr-pink: #ff66c4;
    --fsr-lila: #e2a9f1;
    --fsr-rosa: #ff99d8;
    --fsr-blau: #1d3b58;
    --fsr-dunkel: #1a2431;
}
@media (max-width: 900px) { :root { --fsr-gutter: 20px; } }

/* ---------- Grundschrift ---------- */
body { font-family: var(--fsr-text); color: var(--fsr-dunkel); }
body h1, body h2,
body .wp-block-heading:is(h1, h2) {
    font-family: var(--fsr-serif) !important;
    font-weight: 400 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
}
body h1 strong, body h2 strong { font-weight: 400 !important; }
body h1 { font-size: 52px; line-height: 1.05; }
body h2 { font-size: 36px; line-height: 1.1; }
@media (max-width: 900px) {
    body h1 { font-size: 34px; }
    body h2 { font-size: 28px; }
}
body h3, body h4 { font-family: var(--fsr-text); font-weight: 500; letter-spacing: normal; }
.wp-block-button__link, .wp-element-button, button { font-family: var(--fsr-ui); }
/* TYPOGRAFIE.md: kein 700/800 mehr auf der Seite. Browser-Standard für
   <strong>/<b> ist 700 (bold) – im Fließtext auf die erlaubten 600 gedeckelt. */
body strong, body b { font-weight: 600; }
/* bausteine.css setzt .schritt-karte__nummer auf 800 – auf 600 gedeckelt
   (gilt für alle Seiten, die den Baustein schritt-karte nutzen). */
.schritt-karte__nummer { font-weight: 600 !important; }
/* Board (Klausurenpool, Examenspfand): Schritt-Karten kantig, Inhalt oben bündig. */
.schritt-karte { border-radius: 0 !important; align-items: flex-start; }
/* Die folgenden drei Bausteine (chip, seiten-label, download-item-Titel)
   werden ab 261001-hgx T6 erstmals auf einer Canvas-Seite verwendet
   (Studium/Hausarbeiten/Remonstration/Examenspfand) – bausteine.css setzt sie
   auf 700/0,06em/Schibsted bzw. 700 Gewicht; TYPOGRAFIE.md verlangt für
   Oberzeilen/Chips Instrument Sans 500/max. 0,04em, für Kacheltitel (auch
   Download-Titel) höchstens 500. Fix hier gilt site-weit für jede Seite,
   die diese Bausteine (wieder-)verwendet, z. B. Task 7 ordnungen-protokolle. */
.chip { font-family: var(--fsr-ui) !important; font-weight: 500 !important; letter-spacing: 0.04em !important; }
.seiten-label { font-family: var(--fsr-ui) !important; font-weight: 500 !important; letter-spacing: 0.04em !important; }
.download-item .wp-block-file > a:not(.wp-block-file__button) { font-weight: 500 !important; }
.kontodaten-box__kopieren { font-weight: 500 !important; }

/* ---------- Seiteninhalt (alle Seiten über templates/page.html) ---------- */
/* Jede normale Seite steckt komplett in einem wp:post-content-Block
   (.wp-block-post-content.entry-content). bausteine.css gab diesem Block
   selbst zusätzlich ein Gutter-Padding links/rechts (!important auf
   max-width/width, padding ohne !important) - das war fuer die alte
   einspaltige Seite gedacht und kollidierte mit dem eigenen Gutter-Padding
   jedes "Bands" (.band, siehe unten), sodass der Inhalt bei breiten Fenstern
   doppelt eingerueckt und zu schmal wirkte.
   Korrektur: WordPress' eingebauter Wurzel-Randabstand (theme.json
   settings.useRootPaddingAwareAlignments + styles.spacing.padding mit
   --fsr-gutter) setzt das Padding jetzt zentral auf <main> (Klasse
   has-global-padding); align:full-Bloecke, die DIREKTE Kinder von
   .wp-site-blocks sind (Vorlagen wie front-page.html), ziehen es
   automatisch per negativem Rand wieder ab. Baender in Seiteninhalt
   (tiefer verschachtelt in .entry-content) erbt dieses <main>-Padding
   trotzdem mit - dafuer die eigene Regel bei .band weiter unten. Der alte
   blosse "padding:0 !important"-Override hier wuerde den neuen
   Wurzel-Randabstand wieder aufheben und ist deshalb entfernt
   (261001-hgx T9, Rueckschritt behoben: T5-Seiten ohne eigenes
   .band-Padding standen sonst randlos am Fensterrand).
   bausteine.css gibt .wp-block-post-content.entry-content zusaetzlich SELBST
   ein --fsr-gutter-Padding (Z. ~291, aus der Vor-Canvas-Zeit) - das addiert
   sich jetzt zum neuen Wurzel-Randabstand (240px statt 120px). Hier auf 0
   gesetzt, Wurzel-Randabstand uebernimmt die Funktion allein. */
.wp-block-post-content.entry-content { padding-left: 0; padding-right: 0; }

/* ---------- Kopfzeile (Board: alle Seiten) ---------- */
.header {
    background: var(--fsr-bordeaux);
    padding: 9.6px var(--fsr-gutter) !important;
    box-sizing: border-box;
    font-family: var(--fsr-ui);
}
/* Höhen wie auf der aktuellen Live-Seite (gemessen bei 1280px): Kopfzeile 88px
   (Logo 64px, 12px Padding), mobil ca. 59px (Logo 34px). */
.header .wp-block-site-logo img { width: 34px !important; height: 34px !important; }
@media (min-width: 1151px) {
    .header { padding-top: 12px !important; padding-bottom: 12px !important; transition: padding 0.3s ease, min-height 0.3s ease, box-shadow 0.3s ease; }
    .header .wp-block-site-logo img { width: 64px !important; height: 64px !important; }
    /* Beim Scrollen (assets/js/navigation.js setzt .is-scrolled) schrumpft die Kopfzeile
       auf die schlanke 64px-Version (Schriftzug statt Logo, siehe bausteine.css). Der
       klebende Rahmen behält 88px, die Seite springt also nicht. */
    .header.is-scrolled { padding-top: 0 !important; padding-bottom: 0 !important; min-height: 64px; align-items: center; }
}
.header .wp-block-navigation__container { gap: 28px !important; }
.header .wp-block-navigation-item__content {
    font-family: var(--fsr-ui) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #f4e3e6 !important;
    letter-spacing: normal !important;
}
.header .wp-block-navigation-item__content:hover { color: #fff !important; }
.header .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
.header .wp-block-navigation-item.current-menu-ancestor > .wp-block-navigation-item__content,
.header .wp-block-navigation-item.current-menu-parent > .wp-block-navigation-item__content,
.header .wp-block-navigation-item > .wp-block-navigation-item__content[aria-current="page"] {
    color: #fff !important;
    font-weight: 600 !important;
    box-shadow: inset 0 -2px 0 var(--fsr-pink);
    padding-bottom: 3px;
}
.header .wp-block-navigation__submenu-icon svg { width: 9px; height: 9px; }
.header .wp-block-navigation__submenu-container {
    background: var(--fsr-bordeaux) !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.25) !important;
    padding: 16px 24px !important;
    min-width: 220px !important;
}
.header .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
    font-size: 15px !important;
    color: #fff !important;
    box-shadow: none !important;
}
.header .wp-block-navigation__submenu-container .wp-block-navigation-item { margin-bottom: 4px !important; }
/* Platzhalter-Höhe des klebenden Rahmens (bausteine.css: 59px mobil / 88px ab 1151px)
   entspricht wieder der Kopfzeile - kein eigener Override mehr nötig. */

/* ---------- Fußzeile ---------- */
.footer {
    background: var(--fsr-dunkel) !important;
    padding: 28px var(--fsr-gutter) !important;
    font-family: var(--fsr-ui);
    gap: 24px;
}
.footer .footer-copyright, .footer .last-updated-hint, .footer .last-updated-hint * {
    font-family: var(--fsr-ui) !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
    color: #fff !important;
    opacity: 0.85;
    margin: 0 !important;
    font-weight: 400 !important;
}
/* .footer-text ist ein "constrained"-Layout (max-width + margin auto) und wurde im
   Flex-Footer in die Mitte geschoben, die Links rutschten in eine zweite Zeile
   (Footer zu hoch). Board: eine Zeile, Copyright links, Links rechts. */
.footer .footer-text { margin: 0 !important; max-width: none !important; flex: 0 1 auto; padding-left: 0 !important; padding-right: 0 !important; }
.footer .footer-text > * { margin-left: 0 !important; margin-right: 0 !important; }
.footer .footer-links { display: flex; gap: 22px; margin: 0; }
.footer .footer-links a, .footer .footer-links a.rcb-sc-link {
    font-family: var(--fsr-ui) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: var(--fsr-rosa) !important;
    text-decoration: none;
}
.footer .footer-links a:hover { color: #fff !important; }
@media (max-width: 900px) {
    .footer { padding: 24px 20px !important; flex-direction: column-reverse; align-items: flex-start !important; }
    .footer .footer-links { flex-wrap: wrap; gap: 18px; }
    .footer .footer-copyright, .footer .last-updated-hint, .footer .last-updated-hint * { font-size: 12px !important; }
}

/* =====================================================================
   Bänder (siehe Layout-Konventionen im Kopf dieser Datei)
   ===================================================================== */
.band {
    padding: 56px var(--fsr-gutter) 60px;
    box-sizing: border-box;
}
.band > * { max-width: var(--fsr-inhalt); margin-left: auto; margin-right: auto; }
/* WordPress' useRootPaddingAwareAlignments (261001-hgx T9) hebt den
   Wurzel-Randabstand nur fuer align:full-Bloecke auf, die direkte Kinder
   von .wp-site-blocks sind (Vorlagen wie front-page.html). Baender
   innerhalb von Seiteninhalt (.entry-content, z. B. Klausurenpool,
   Hausarbeiten) sind tiefer verschachtelt und erben <main>s Padding
   trotz alignfull mit - hier per Hand mit demselben Betrag abziehen,
   damit sie wie die Vorlagen-Baender echt randlos bleiben. */
.wp-block-post-content.entry-content .band {
    margin-left: calc(-1 * var(--fsr-gutter));
    margin-right: calc(-1 * var(--fsr-gutter));
    width: auto;
}
.band--split {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 48px;
    align-items: start;
}
.band--split > * { max-width: none; margin: 0; }
@media (max-width: 900px) {
    .band { padding: 40px 20px 44px; }
    .band--split { grid-template-columns: 1fr; gap: 20px; }
}
.band-titel--klein.wp-block-heading { font-size: 28px !important; line-height: 1.1 !important; }
@media (max-width: 900px) {
    .band-titel--klein.wp-block-heading { font-size: 24px !important; }
}

/* ===== Board: Klausurenpool ===== */
/* Board: Einstieg links bündig (120px Rand), nur die Absätze sind 640px breit.
   Die Band-Regel (.band > * mit margin auto) zentrierte den 640px-Block. */
.klausurenpool-seite .klausurenpool-einstieg { max-width: none; margin-left: 0; margin-right: 0; }
.klausurenpool-seite .klausurenpool-einstieg h1 { margin: 0 0 16px; }
.klausurenpool-seite .klausurenpool-einstieg p { max-width: 640px; margin: 0 0 12px; font-size: 18px; line-height: 1.65; }
.klausurenpool-seite .klausurenpool-einstieg p.klausurenpool-hinweis { font-size: 15px; line-height: 1.6; margin-bottom: 28px; }
.klausurenpool-seite .klausurenpool-hinweis { font-size: 15px; color: #555; margin: 0 0 28px; }
.band--blau h2 { color: #fff; }
.band--blau.band--split p { font-size: 16px; line-height: 1.7; margin: 0 0 12px; }
.band--blau.band--split p:last-child { margin-bottom: 0; }
.klausurenpool-schritte { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 22px; }
.klausurenpool-schritte .schritt-karte { align-items: flex-start; }
@media (max-width: 900px) {
    .klausurenpool-schritte { grid-template-columns: 1fr; }
}

/* Reihen-Band: eine Zeile, zwei Teile (links Text, rechts Aktion), z. B.
   „Mitmachen im FSR“. Eigene CSS statt WP-Flex-Layout, sonst kollidiert
   die generische .band > *-Zentrierung (siehe Kopfkommentar) mit justify-content. */
.band--reihe { display: flex; align-items: center; justify-content: space-between; gap: 40px; flex-wrap: wrap; }
.band--reihe > * { max-width: none; margin: 0; }

/* ===== Board: Startseite ===== */
.startseite-hero { position: relative; }
.startseite-hero .wp-block-cover__background { background: linear-gradient(to top, rgba(26,36,49,0.85) 0%, rgba(26,36,49,0.45) 38%, rgba(26,36,49,0) 65%) !important; opacity: 1 !important; }
.startseite-hero .wp-block-cover__inner-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    height: 100%;
    max-width: none;
    padding: 0 var(--fsr-gutter) 88px;
    box-sizing: border-box;
    gap: 8px;
}
.startseite-hero__text h1.wp-block-heading { color: #fff; margin: 0 0 12px; font-size: 64px; line-height: 1.05; }
.startseite-hero__motto { font-family: var(--fsr-text); font-size: 22px; line-height: 1.4; margin: 0; color: #fff; }
/* Board: Text 88px über der Bildunterkante, links bündig mit dem Inhalt (120px
   bei 1280), Bildnachweis rechts unten (right 16 / bottom 10). core/cover
   zentriert den Inhalt vertikal und gibt dem Innen-Container 16px Rand -
   Text saß dadurch mittig und 16px zu weit rechts. */
.startseite-hero { align-items: flex-end !important; padding: 0 !important; }
.startseite-hero .wp-block-cover__inner-container { width: 100%; margin: 0 !important; height: auto; }
.startseite-hero__nachweis { position: absolute; right: 16px; bottom: 10px; font-size: 11px; color: #fff; opacity: 0.8; margin: 0 !important; }
@media (max-width: 900px) {
    .startseite-hero { min-height: 520px !important; }
    .startseite-hero .wp-block-cover__inner-container { padding-bottom: 40px; }
    .startseite-hero__text h1.wp-block-heading { font-size: 36px; }
    .startseite-hero__motto { font-size: 18px; }
    .startseite-hero__nachweis { align-self: flex-start; font-size: 10px; }
}

.aktuelles-band .aktuelles-band__kopf { margin-bottom: 18px; }
.aktuelles-band__alle { margin: 0; }
.aktuelles-band__alle a { font-size: 14px; font-weight: 500; color: #1a2431; text-decoration: underline; text-decoration-color: var(--fsr-bordeaux); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.aktuelles-band__alle a:hover { background: var(--fsr-bordeaux); color: #fff !important; }
/* Einheitlicher Textlink-Hover (Board: a.textlink): 4px Radius, 1px/3px Padding,
   0,2s Übergang, Unterstreichung verschwindet. Gilt wie im Fließtext (bausteine.css)
   auch für die Links in Bändern/Karten, die bisher keinen oder einen eigenen Hover hatten. */
.aktuelles-band__alle a, .instagram-band__link a, .referat-karte__link a {
    border-radius: 4px; padding: 1px 3px; margin: 0 -3px;
    transition: color 0.2s ease, background 0.2s ease, text-decoration-color 0.2s ease;
}
.aktuelles-band__alle a:hover, .aktuelles-band__alle a:focus,
.instagram-band__link a:hover, .instagram-band__link a:focus,
.referat-karte__link a:hover, .referat-karte__link a:focus { text-decoration-color: transparent !important; outline: none; }
.referat-karte__link a:hover, .referat-karte__link a:focus { background: var(--fsr-bordeaux); color: #fff !important; }

.beitrags-raster { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; align-items: stretch; }
.beitrags-raster .wp-block-query,
.beitrags-raster .wp-block-post-template { display: contents; }
/* bausteine.css gibt dem Datum eine Pille in 700/Schibsted – TYPOGRAFIE.md
   verlangt Oberzeilen in Instrument Sans 500, Sperrung max. 0,04em. */
.beitrags-raster .wp-block-post-date { font-family: var(--fsr-ui); font-weight: 500; letter-spacing: 0.04em; }
/* Board: Beitrags-/Ersti-Kachel (a.beitrag) hat kein border-radius = kantig.
   bausteine.css gibt .beitrags-karte noch 14px. */
.beitrags-karte { position: relative; padding: 20px 22px 18px; box-sizing: border-box; border-radius: 0; }
.beitrags-karte--statisch .beitrags-karte__badge { display: inline-block; background: var(--wp--preset--color--lila, #e2a9f1); color: var(--wp--preset--color--dunkelblau, #1a2431); font-family: var(--fsr-ui); font-size: 11px; font-weight: 500; letter-spacing: 0.04em; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; margin: 0 0 12px; }
.beitrags-karte--statisch .beitrags-karte__titel { font-size: 19px; line-height: 1.3; letter-spacing: -0.01em; font-weight: 500; color: var(--wp--preset--color--dunkelblau, #1a2431); margin: 0 0 10px; font-family: var(--fsr-text); }
/* bausteine.css (.beitrags-karte__text) hat noch Padding 22px 26px 26px aus dem
   alten Karten-Design, wo __text ein Innen-Wrapper war - auf dem schlichten
   Absatz der Ersti-Kachel erzeugte das Einzug und Abstand. */
.beitrags-karte--statisch .beitrags-karte__text { font-size: 14px; line-height: 1.65; color: #444; margin: 0 0 10px; padding: 0; }
.beitrags-karte--statisch .beitrags-karte__link { margin: 0; }
.beitrags-karte--statisch .beitrags-karte__link a { color: var(--fsr-bordeaux); font-weight: 600; font-size: 14px; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
@media (max-width: 900px) {
    .beitrags-raster { grid-template-columns: 1fr; }
}

/* Aktuelles-Kacheln (Ersti-Woche-Kachel + Beitrags-Kacheln): ganze Kachel wird
   bordeaux beim Hovern; der Link-Text wird erst flieder, wenn die Maus genau
   darauf steht (eigenes :hover auf dem Link, nicht auf der ganzen Kachel). */
.beitrags-karte:hover { background: var(--fsr-bordeaux) !important; box-shadow: 0 8px 22px rgba(94, 31, 39, 0.3); }
.beitrags-karte:hover .wp-block-post-date,
.beitrags-karte:hover .wp-block-post-title a,
.beitrags-karte:hover .wp-block-post-excerpt,
.beitrags-karte:hover .beitrags-karte__badge,
.beitrags-karte:hover .beitrags-karte__titel,
.beitrags-karte:hover .beitrags-karte__text { color: #fff !important; }
.beitrags-karte:hover .wp-block-read-more,
.beitrags-karte:hover .beitrags-karte__link a { color: #fff !important; background: none !important; }
.beitrags-karte .wp-block-read-more:hover,
.beitrags-karte .wp-block-read-more:focus,
.beitrags-karte .wp-block-post-title a:hover,
.beitrags-karte--statisch .beitrags-karte__link a:hover { color: var(--fsr-lila) !important; background: none !important; text-decoration-color: transparent; }

.ueber-uns-band { padding-top: 80px; padding-bottom: 80px; }
.ueber-uns-band .wp-block-post-content { max-width: 700px; }
.ueber-uns-band .wp-block-post-content p { font-size: 18px; line-height: 1.65; margin: 0 0 14px; }
@media (max-width: 900px) {
    .ueber-uns-band { padding-top: 40px; padding-bottom: 40px; }
    .ueber-uns-band .wp-block-post-content p { font-size: 16px; }
}

.mitmachen-band { padding: 26px var(--fsr-gutter) 28px; }
.mitmachen-band .band-titel--klein { margin: 0 0 4px; }
.mitmachen-band__text { font-size: 15px; line-height: 1.5; margin: 0; }
/* bausteine.css faerbt jeden Button beim Hovern pink (sitweite Konvention) -
   der dunkelblaue Button hier soll laut Rueckmeldung dunkelblau bleiben. */
.mitmachen-band .wp-block-button__link:hover,
.mitmachen-band .wp-block-button__link:focus { background-color: var(--fsr-dunkel) !important; color: #fff !important; box-shadow: none !important; }
@media (max-width: 900px) {
    .mitmachen-band { flex-direction: column; align-items: flex-start; gap: 16px; }
}

/* Board: Band 36px oben / 40px unten, Überschrift mit 120px Rand wie die Kacheln
   (bausteine.css: padding 48px 0, Überschrift klebte am Fensterrand). */
.useful-links { padding-top: 36px !important; padding-bottom: 40px !important; }
.useful-links__kopf { margin-bottom: 18px; padding: 0 var(--fsr-gutter); }
.useful-links h2.band-titel--klein { color: #fff; margin: 0; }
@media (max-width: 900px) {
    .useful-links__kopf { padding: 0 20px; margin-bottom: 14px; }
        .useful-links .useful-gallery figure.wp-block-image img { display: none; }
    .useful-links .useful-gallery figure.wp-block-image {
        background: #fff;
        border-radius: 999px;
        padding: 0;
        height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: none;
    }
    /* Das Bild ist mobil ausgeblendet; der Link füllt die ganze Pille (klickbar), die
       Beschriftung steht mittig (vorher schob der leere Link mit 24px Padding sie nach unten). */
    .useful-links .useful-gallery figure.wp-block-image { flex-direction: row; position: relative; }
    .useful-links .useful-gallery figure.wp-block-image a { position: absolute; inset: 0; padding: 0; z-index: 1; border-radius: 999px; }
    .useful-links .useful-gallery figure.wp-block-image figcaption { font-size: 15px; font-weight: 500; color: #1a2431; padding: 0 20px; margin: 0; line-height: 1; text-align: center; white-space: nowrap; }
}

/* ===== Board: Aktuelles ===== */
.aktuelles-seite { padding: 0 !important; max-width: none; }
.aktuelles-kopf { padding: 40px var(--fsr-gutter) 32px; box-sizing: border-box; }
.aktuelles-kopf h1.wp-block-heading { margin: 0 0 18px; }
.sitzungshinweis-band { gap: 20px; padding: 14px 24px; align-items: baseline; }
.sitzungshinweis-band__titel { font-family: var(--fsr-text); font-weight: 500; font-size: 17px; white-space: nowrap; margin: 0; }
.sitzungshinweis-band__termin { font-size: 15px; white-space: nowrap; margin: 0; }
.sitzungshinweis-band__hinweis { margin: 0 0 0 auto; font-size: 13px; opacity: 0.85; }
@media (max-width: 900px) {
    .aktuelles-kopf { padding: 28px 20px 24px; }
    .sitzungshinweis-band { flex-direction: column; align-items: flex-start; gap: 2px; padding: 12px 16px; }
    .sitzungshinweis-band__hinweis { margin: 0; display: none; }
}

.beitraege-band__kopf { margin-bottom: 18px; }
.beitraege-band__archiv { gap: 12px; font-size: 14px; font-weight: 500; color: #1a2431; }
.beitraege-band__archiv-label { margin: 0; }
/* Der Archiv-Block bringt ein eigenes Label "Archiv" mit - Board zeigt das Wort
   nur einmal neben der Auswahl. Für Screenreader bleibt es erhalten. */
.news-archive-dropdown label, .news-archive-dropdown .wp-block-archives__label, .news-archive-dropdown .screen-reader-text {
    position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important;
    overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important;
}
.beitraege-band .news-archive-dropdown select { background: #fff; color: var(--fsr-bordeaux); font: 500 13px var(--fsr-ui); padding: 8px 18px; border-radius: 999px; border: none; }
.beitraege-band .wp-block-query-pagination { grid-column: 1 / -1; display: flex; justify-content: center; gap: 16px; margin-top: 10px; font-weight: 500; }
@media (max-width: 900px) {
    .beitraege-band__kopf { flex-wrap: wrap; gap: 10px; }
}

.instagram-band__kopf { margin-bottom: 18px; }
.instagram-band__link { margin: 0; }
.instagram-band__link a { color: #fff; font-size: 14px; font-weight: 500; text-decoration: underline; text-decoration-color: var(--fsr-pink); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.instagram-band__link a:hover { background: #fff; color: var(--fsr-bordeaux) !important; }
.instagram-kachel { padding: 22px 24px; box-sizing: border-box; }
.instagram-kachel .instagram-wrapper { margin: 0; }
/* Abweichung (bewusst, s. SUMMARY): das Board zeigt eine statische
   Profilkopf-Vorschau (Follower/Beitragszahl, 6 Post-Platzhalter); live
   bleibt der bestehende Instagram-Embed (wp:html, lädt erst nach
   Cookie-Einwilligung) – sein Innenleben lässt sich nicht gestalten. */

/* ===== Board: Aktuelles (mobil) ===== */
@media (max-width: 900px) {
    .aktuelles-kopf h1.wp-block-heading { font-size: 28px; }
}

/* ===== Board: Einzelner Beitrag ===== */
.beitrag-seite h1.wp-block-heading { font-size: 52px; line-height: 1.05; }
.beitrag-datum, .beitrag-weitere__label, .beitrag-weitere .wp-block-post-date {
    font-family: var(--fsr-ui);
    font-weight: 500;
    letter-spacing: 0.04em;
}
@media (max-width: 900px) {
    .beitrag-seite h1.wp-block-heading { font-size: 34px; }
}

/* ===== Board: Der Fachschaftsrat ===== */
/* Mobil: pages.css begrenzt die Foto-Figur auf 120px, die Spalte ist aber ~185px breit -
   Fotos klebten links, rechts blieb Leerraum. Bild füllt jetzt die Spalte, Name und Amt
   stehen linksbündig am Bildrand. */
@media (max-width: 900px) {
    .vorstand-gallery-section .vorstand-img, .vorstand-gallery-section figure.wp-block-image { width: 100% !important; max-width: none !important; }
    .vorstand-gallery-section .wp-block-column { align-items: stretch; text-align: left; }
}
.fsr-header h1.wp-block-heading { font-size: 52px; }
/* bausteine.css setzt den Namen unter dem Foto auf 800 - TYPOGRAFIE.md
   erlaubt hoechstens 600; auf die Spezifitaet von
   .vorstand-gallery-section p.vorstand-name gehoben, sonst gewinnt die
   bestehende Regel trotz spaeterem Laden von canvas.css. */
.vorstand-gallery-section p.vorstand-name { font-weight: 600; }
/* bausteine.css rundet die Mitglieder-Kachel oben ab (16px) - Bänder mit
   Inhalt sollen laut Ecken-Regel kantig sein, Board hat keine Rundung. */
.vorstand-gallery-section.fsr-mitglieder-section.wp-block-group { border-radius: 0 !important; }

/* ===== Board: Kontakt ===== */
/* TYPOGRAFIE.md: keine Sperrung über 0,04em, Gewicht max. 600, Oberzeilen
   in Instrument Sans – bausteine.css setzte bisher 700/0,06em/Schibsted. */
.kontakt-block.has-background .kontakt-title, .kontakt-block.has-background .kontakt-label,
.kontakt-links .kontakt-title, .kontakt-links .kontakt-label {
    font-family: var(--fsr-ui);
    font-weight: 500;
    letter-spacing: 0.04em;
}
.kontakt-links .kontakt-block, .kontakt-karte { border-radius: 0; }

/* ===== Board: Struktur (Organisation) ===== */
.struktur-band .struktur-band__titel {
    font-family: var(--fsr-serif) !important;
    font-weight: 400 !important;
    font-size: 36px !important;
    letter-spacing: normal !important;
}
@media (max-width: 900px) {
    .struktur-band .struktur-band__titel { font-size: 28px !important; }
}
.struktur-band .referat-karte { border-radius: 0; }
.struktur-band .referat-karte h3 { font-family: var(--fsr-text); font-weight: 500; }
.struktur-band .referat-karte.has-bordeaux-background-color h3.wp-block-heading { color: #fff; }
.referat-raster { grid-auto-rows: 1fr; }
.referat-karte--outline { border: 1.5px solid var(--fsr-bordeaux); }
.referat-karte--mitmachen { position: relative; display: flex; flex-direction: column; }
.referat-karte--mitmachen .referat-karte__link { margin: 14px 0 0 !important; font-size: 13px; font-weight: 500; }
.referat-karte--mitmachen .referat-karte__link a { color: var(--fsr-bordeaux); text-decoration: underline; text-decoration-color: var(--fsr-pink); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.referat-karte--mitmachen .referat-karte__link a::after { content: ''; position: absolute; inset: 0; }

.ag-liste { padding: 8px 28px; box-sizing: border-box; margin-bottom: 20px; border-radius: 0; }
.ag-zeile { display: grid; grid-template-columns: 260px 1fr 220px; gap: 24px; align-items: baseline; padding: 20px 0; border-bottom: 1px solid #eadfe2; }
.ag-zeile > * { margin: 0 !important; }
/* Trennlinie zwischen den Zeilen, keine nach der letzten - per :last-child statt
   Sonderklasse, damit sich AG-Zeilen im Editor frei duplizieren/löschen lassen. */
.ag-zeile:last-child { border-bottom: 0; }
/* Board: Download-Kacheln 12px (bausteine.css: 14px) */
.download-item { border-radius: 12px; }
.ag-zeile__titel { font-weight: 500; font-size: 17px; color: var(--fsr-bordeaux); }
.ag-zeile__text { font-size: 14px; line-height: 1.6; }
.ag-zeile__kontakt { font-size: 13px; color: #555; }
.struktur-band__abschluss { font-size: 15px; line-height: 1.6; margin: 0 !important; }
.struktur-band__abschluss a { color: var(--fsr-bordeaux); font-weight: 500; }
@media (max-width: 900px) {
    .ag-zeile { grid-template-columns: 1fr; gap: 6px; }
}

/* ===== Board: Mitmachen ===== */
.mitmachen-seite h1.wp-block-heading { font-size: 52px; }
/* TYPOGRAFIE.md: Einleitung/Lead max. 500 (bausteine.css setzte 600);
   Unterueberschriften "Unterstuetzende Mitglieder"/"Mitarbeit in
   Arbeitsgruppen" sind laut Board Kacheltitel (Schibsted, nicht
   Newsreader) - daher als h3 statt h2 gesetzt (siehe seiten/mitmachen.html),
   bestehende CSS zielte auf h2 und muss auf h3 erweitert werden. */
.mitmachen-lead { font-weight: 500; }
.mitmachen-box__text h3.wp-block-heading { font-size: 22px; margin: 0 0 14px; text-align: left; font-family: var(--fsr-text); font-weight: 500; }
.mitmachen-ags h3.wp-block-heading { font-size: 22px; margin: 0 0 12px; text-align: left; font-family: var(--fsr-text); font-weight: 500; color: var(--fsr-bordeaux); }
.mitmachen-box, .mitmachen-box__hinweis { border-radius: 0; }

/* ===== Board: Studium ===== */
.studium-angebote-band { padding: 40px var(--fsr-gutter); }
.studium-angebote-band .angebot-karte { border-radius: 0; }
.angebot-raster { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
@media (max-width: 900px) {
    .angebot-raster { grid-template-columns: 1fr; }
}

/* ===== Board: Hausarbeiten (nutzt .klausurenpool-seite aus Board: Klausurenpool) ===== */
.hausarbeiten-seite .download-item { max-width: 640px; margin-top: 4px; }

/* ===== Board: Remonstration ===== */
/* Kein eigenes Seitenpadding: der Seitenrahmen (root padding aus theme.json) setzt
   den Rand schon - mit zusätzlichem var(--fsr-gutter) war der Text doppelt eingerückt. */
.remonstration-seite { padding: 48px 0 56px; box-sizing: border-box; }
.remonstration-spalten { display: flex; gap: 48px; align-items: flex-start; }
/* Board nutzt 640px/Rest (bei 1280px Boardbreite = ~352px Kasten-Spalte);
   mit echtem Text wirkt das laut Rueckmeldung zu eng - Kasten-Spalte verbreitert. */
.remonstration-text { flex: 0 0 560px; }
.remonstration-text p { font-size: 15px; line-height: 1.7; color: #333; margin: 0 0 16px; }
.remonstration-seite__karten { flex: 1 1 auto; display: flex; flex-direction: column; gap: 20px; }
.remo-karte { padding: 20px 22px; box-sizing: border-box; border-radius: 0; }
.remo-karte__label { font-family: var(--fsr-ui); font-size: 12px; font-weight: 500; letter-spacing: 0.04em; margin: 0 0 10px !important; }
.remo-karte__zitat { font-size: 13px; line-height: 1.65; font-style: italic; opacity: 0.95; margin: 0 !important; }
@media (max-width: 900px) {
    .remonstration-spalten { flex-direction: column; }
    .remonstration-text { flex: 0 0 auto; }
}

/* ===== Board: Examenspfand ===== */
/* Hinweis-Box (Examenspfand, Ordnungen & Protokolle u. a.): Board border-radius:0,
   bausteine.css rundete sie noch ab. Button und Chip darin bleiben Pillen. */
.hinweis-box { border-radius: 0 !important; }
.examen-kopf__text h2, .examen-seite > h2 { font-size: 24px !important; }
.kontodaten-box__label { font-family: var(--fsr-ui); font-weight: 500 !important; letter-spacing: 0.04em !important; }
.vergabe-legende { font-family: var(--fsr-ui); font-weight: 500 !important; }
.examen-kopf .kontodaten-box { border-radius: 0; }
/* bausteine.css setzt IBAN/BIC (2./3. Zeile) auf ui-monospace, damit Ziffern
   sich ausrichten; TYPOGRAFIE.md erlaubt nur Newsreader/Schibsted Grotesk/
   Instrument Sans – Schibsted Grotesk mit tabular-nums behält die Ausrichtung. */
.kontodaten-box .kontodaten-box__zeile:nth-of-type(2) .kontodaten-box__wert,
.kontodaten-box .kontodaten-box__zeile:nth-of-type(3) .kontodaten-box__wert {
    font-family: var(--fsr-text) !important;
    font-variant-numeric: tabular-nums;
}

/* ===== Board: Infos für Ersties ===== */
/* Board: Label nur "ERSTI-WOCHE" (ohne Zusatz, über der Zeile), kein Datum,
   kein Begleittext, kein §-Wasserzeichen, Box kantig. Icon links, die zwei
   Buttons rechts daneben in einer Spalte (seiten/infos-fuer-ersties.html an
   die Board-Struktur angepasst, hier die passende Breite/Abstand dazu). */
.ersti-blick { border-radius: 0 !important; }
.ersti-blick::after { content: none !important; }
.ersti-blick__label { line-height: 1.2 !important; font-family: var(--fsr-ui) !important; font-weight: 500 !important; font-size: 12px !important; letter-spacing: 0.04em !important; margin-bottom: 14px !important; }
.ersti-blick__kopf { gap: 18px; align-items: center; }
.ersti-blick__icon { margin: 0 !important; flex: 0 0 62px; }
.ersti-blick__icon img { width: 62px; height: auto; display: block; }
.ersti-blick__buttons { flex: 1 1 auto; min-width: 0; margin: 0 !important; }
.termin-datum__tag { font-weight: 500 !important; letter-spacing: 0.04em !important; }
/* Board (Zeile mit "Erstsemestergrillen" etc.): Termin-Zeile und Datums-
   Kasten sind kantig (border-radius:0), nur die Zeit-Pille bleibt rund -
   bausteine.css rundete bisher die ganze Zeile (14px) und den Datums-
   Kasten (10px). */
.termin-tag { border-radius: 0 !important; }
.termin-datum { border-radius: 0 !important; }
.termin-datum__datum { font-weight: 600 !important; }
.termin__zeit { font-weight: 500 !important; }
.termin__titel { font-weight: 500 !important; }

/* ===== Board: Ordnungen/Protokolle, Sitzungsprotokolle, Impressum, Datenschutz ===== */
/* TYPOGRAFIE.md: Überschrift in Rechtstexten 24/22px; bausteine.css setzte
   19px (vor der Canvas-Umstellung so gewaehlt). */
.rechtstext-seite h2 { font-size: 24px !important; line-height: 1.2 !important; }
@media (max-width: 900px) {
    .rechtstext-seite h2 { font-size: 22px !important; }
}

/* ===== Nachträge nach Board-Abgleich (02.10.2026) ===== */
/* Inhaltsflächen kantig (Ecken-Regel): Instagram-Feld (Aktuelles), Kopf- und
   Vorstand-Abschnitt (Der Fachschaftsrat). */
.instagram-wrapper, .instagram-kachel, .fsr-header, .vorstand-gallery-section { border-radius: 0 !important; }
/* Studium: Board hat 40px zwischen pastelllila Kachelband und "NÜTZLICHES FÜR DEIN STUDIUM",
   darunter 16px bis zu den Pillen. */
.studium-angebote-band + .seiten-label { margin-top: 40px !important; margin-bottom: 16px !important; }
/* Angebots-Kacheln (Studium): wie die Aktuelles-Kacheln - Kachel bordeaux, Linktext weiß,
   erst wenn die Maus genau auf dem Link steht wird er flieder. */
.angebot-karte:hover .angebot-karte__link a:hover,
.angebot-karte:hover .angebot-karte__link a:focus { color: var(--fsr-lila) !important; background: none !important; }

/* ===== Schrift-Abgleich mit dem Canvas (tools/canvas-seiten/schrift-abgleich.cjs) ===== */
/* Buttons: Board 15px / 500 / Instrument Sans (Link-Pillen 13px). bausteine.css hatte 13px / 600. */
.wp-block-button__link, .wp-element-button, .wp-block-file__button { font-family: var(--fsr-ui) !important; font-size: 15px !important; font-weight: 500 !important; }
.link-pillen .wp-block-button__link { font-size: 13px !important; font-weight: 500 !important; }
@media (max-width: 420px) { .ersti-blick .wp-block-button__link { font-size: 13px !important; } }
/* Inhalt maximal 500 (Board): Namen, Ämter, Ansprechpersonen, Weiterlesen-/Textlinks. */
.vorstand-gallery-section p.vorstand-name, .vorstand-gallery-section p.vorstand-title,
.referat-karte__kontakt, .beitrags-karte .wp-block-read-more, .beitrags-karte__link a,
.rechts-zeile__name, .rechts-zeile__link a, .angebot-karte__link a,
.kontakt-links .kontakt-kontaktzeilen, .kontakt-links .kontakt-kontaktzeilen a,
.beitrags-karte .wp-block-post-title, .beitrags-karte .wp-block-post-title a { font-weight: 500 !important; }
.kontodaten-box__name { font-weight: 400 !important; }
.ueber-uns-band .wp-block-post-content p a { font-weight: 500; }
.ueber-uns-band .wp-block-post-content > p:last-child:has(> a:only-child) { font-size: 14px; }
.wp-block-post-content p a:not(.wp-block-button__link) { font-weight: 500; }
/* Schriftart laut Board: diese Beschriftungen stehen dort in Schibsted Grotesk (nicht Instrument Sans). */
.useful-gallery figcaption, .termin__titel, .seiten-label, .kontakt-title, .kontakt-label,
.kontodaten-box__label, .remo-karte__label, .ersti-blick__label, .vergabe-legende,
.download-item, .download-item p, .download-item a:not(.wp-block-file__button) { font-family: var(--fsr-text) !important; }
.useful-gallery figcaption { font-weight: 500 !important; }
.seiten-label, .kontakt-title, .kontakt-label { font-size: 13px !important; }
/* Überschriften-Größen laut Board */
.beitraege-band h2.wp-block-heading, .instagram-band h2.wp-block-heading { font-size: 28px !important; }
.angebot-karte h3.wp-block-heading { font-size: 20px; }
.erstiwoche-section-label.wp-block-heading { font-family: var(--fsr-text) !important; font-weight: 500 !important; font-size: 26px !important; letter-spacing: -0.01em !important; }
@media (max-width: 900px) { .beitraege-band h2.wp-block-heading, .instagram-band h2.wp-block-heading { font-size: 24px !important; } }

/* Menü: Markierung der aktiven Seite (Linie) ohne Rundung - der Menülink erbte 4px Radius. */
.header .wp-block-navigation-item__content { border-radius: 0 !important; }
/* Untermenü flach wie die übrigen Flächen: keine Rundung, kein Schatten. */
.header .wp-block-navigation__submenu-container { border-radius: 0 !important; box-shadow: none !important; }

/* Handy (bausteine.css): "PDF herunterladen" wird zum runden Download-Knopf mit Pfeil, indem
   die Schrift auf 0 gesetzt wird. Die Button-Schrift-Regel oben (15px !important) hatte das
   überschrieben - Text und Pfeil überlagerten sich. */
@media (max-width: 700px) {
    .download-item:has(.download-untertitel) .wp-block-file__button { font-size: 0 !important; }
    .download-item:has(.download-untertitel) .wp-block-file__button::after { font-family: var(--fsr-ui); font-weight: 500; }
}

/* Ersti-Box wie im Board: Padding 22/24, Buttons einzeilig und gleich hoch (kleineres Button-Padding,
   damit der Text in die schmale Spalte neben dem Icon passt). */
.ersti-blick { padding: 22px 24px !important; width: min(384px, 100%); flex: 0 0 auto !important; }
.ersti-blick .wp-block-button__link { white-space: nowrap !important; line-height: 19px; text-align: center; padding: 10px 20px !important; display: block; box-sizing: border-box; }

/* Kontakt-Reihe (z. B. Seite „Ersti-Gruppe“): zwei Kontakt-Blöcke nebeneinander, mobil untereinander.
   Nutzt die Stile von .kontakt-links (Kontaktseite), nur als Zeile statt Spalte. */
.kontakt-links.kontakt-reihe { flex: 0 0 auto; width: 100%; flex-direction: row; flex-wrap: wrap; gap: 24px; align-items: stretch; }
.kontakt-links.kontakt-reihe > .kontakt-block { flex: 1 1 300px; }

/* Textlinks haben 3 px Innenabstand für den Hover-Hintergrund; der negative Außenabstand (wie im Board,
   a.textlink) gleicht ihn aus, damit Links am Zeilenanfang bündig mit dem übrigen Text stehen. */
.entry-content p a:not(.wp-block-button__link),
.entry-content li a:not(.wp-block-button__link) { margin: 0 -3px; }

/* Handy-Menü (eigenes Slide-Menü, assets/js/navigation.js): kleinere Schrift, damit lange Einträge wie
   „Ordnungen/Protokolle“ und „Der Fachschaftsrat“ nicht mitten im Wort umbrechen (vorher 28,8 px). */
@media (max-width: 781px) {
    .fsr-slide-nav__link, .fsr-slide-nav__trigger { font-size: clamp(20px, 6.4vw, 28px) !important; line-height: 1.25; overflow-wrap: break-word; word-break: normal; }
    .fsr-slide-nav__link--sub { font-size: clamp(18px, 5.6vw, 24px) !important; }
}
/* Eingeloggt (nur Redaktion): Die WordPress-Leiste scrollt unter 600 px mit der Seite weg,
   die Kopfzeile soll dann oben bleiben statt 46 px darunter zu hängen. */
@media (max-width: 600px) { .admin-bar .wp-site-blocks > header.wp-block-template-part { top: 0; } }

/* iOS „Fette Schrift“ / große Schrift: Menütext nicht automatisch vergrößern. */
.fsr-slide-nav { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }