/*
Theme Name: Rotwerk
Theme URI: https://pflanz.berlin/
Author: David Pflanz
Description: Klares, seriöses Block-Theme in sozialdemokratischem Rot – ruhige Typografie, viel Weißraum, keine Effekte. Ohne Partei-Logo.
Version: 3.0.5
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: rotwerk
Tags: block-theme, full-site-editing, one-column, custom-colors, editor-style

Schriften: Inter und Archivo, SIL Open Font License 1.1, lokal eingebunden (keine Google-Fonts-Anfragen).
*/

/* ---------- Grundlagen ---------- */
html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
/* Kein weißer Streifen unter der Fußleiste: bei kurzen Seiten sitzt sie ganz
   unten, und das „Nachfedern“ beim Scrollen (iOS/macOS) zeigt keinen Hintergrund. */
html { overscroll-behavior-y: none; }
.wp-site-blocks { min-height: calc(100vh - 2px); min-height: calc(100dvh - 2px); display: flex; flex-direction: column; }
.wp-site-blocks > footer { margin-top: auto !important; }
/* Rundungsreste unter der Fußleiste (Safari/iOS) zeigen Fußleisten-Farbe statt Weiß:
   der Seitenhintergrund außerhalb von <body> ist dunkel, die Fußleiste ragt 2px darüber. */
html { background: var(--wp--preset--color--schwarz); }
.wp-site-blocks > footer:last-child { margin-bottom: -2px !important; }
.wp-site-blocks > footer:last-child .rw-footer { padding-bottom: calc(var(--wp--preset--spacing--40) + 2px) !important; }
::selection { background: var(--wp--preset--color--rot); color: #fff; }
:where(a) { text-underline-offset: .18em; text-decoration-thickness: 1px; }
:focus-visible { outline: 2px solid var(--wp--preset--color--rot); outline-offset: 3px; }
h1, h2 { text-wrap: balance; hyphens: auto; -webkit-hyphens: auto; overflow-wrap: break-word; }

/* ---------- Header ---------- */
/* Farben setzt die Vorlage „Kopfbereich“ (im Website-Editor änderbar).
   Kleben muss der Template-Part-Wrapper, sonst scrollt der Kopf mit weg. */
.wp-site-blocks > header.wp-block-template-part { position: sticky; top: 0; z-index: 50; }
.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 32px; }
@media (max-width: 782px) { .admin-bar .wp-site-blocks > header.wp-block-template-part { top: 46px; } }
.rw-header .wp-block-site-title a { text-decoration: none; }
/* Keine Haarlinie zwischen Kopf und Inhalt (Safari rundet Bruchteile von Pixeln):
   der Inhalt schiebt sich 1px unter den Kopf. */
.wp-site-blocks > header.wp-block-template-part + * { margin-top: -1px !important; }

/* ---------- Bühne ---------- */
.rw-hero { position: relative; }
.rw-kicker {
	display: block; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; line-height: 1.4;
	opacity: .9;
}
.rw-kicker--rot { color: var(--wp--preset--color--rot); opacity: 1; }

/* ---------- Karten ---------- */
.rw-card { border-radius: 8px; background: var(--wp--preset--color--hellgrau); height: 100%; }
.rw-card .wp-block-post-featured-image img { border-radius: 6px; aspect-ratio: 16/10; object-fit: cover; }
.rw-card .wp-block-post-title a { text-decoration: none; }
.rw-card .wp-block-post-title a:hover { color: var(--wp--preset--color--rot); }
.rw-num {
	font-family: var(--wp--preset--font-family--text); font-weight: 600; line-height: 1;
	color: var(--wp--preset--color--rot); font-size: .95rem; letter-spacing: .06em;
}
.rw-stat {
	font-family: var(--wp--preset--font-family--display); font-weight: 700; line-height: 1;
	color: var(--wp--preset--color--rot); font-size: clamp(2.2rem, 4vw, 3rem);
}

/* ---------- Buttons ---------- */
.wp-block-button__link { transition: background-color .2s ease, color .2s ease, border-color .2s ease; box-shadow: none !important; }
.is-style-outline > .wp-block-button__link { border-width: 1.5px; }

/* ---------- Zitat ---------- */
.wp-block-pullquote, .wp-block-quote.is-style-plain { border: 0; }

/* ---------- Beiträge ---------- */
.wp-block-post-content > * + h2 { margin-top: 2.2em; }
.wp-block-post-content img { border-radius: 6px; }
.wp-block-post-terms { font-weight: 600; font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; }
.wp-block-post-terms a { text-decoration: none; color: var(--wp--preset--color--rot); }

/* ---------- Footer ---------- */
/* Linkfarbe kommt aus dem Editor (Block-Einstellung), nicht aus dem Theme. */
.rw-footer a { text-decoration-color: currentColor; }
.rw-footer-links { display: flex; flex-wrap: wrap; gap: .4rem 1.5rem; }

/* ---------- Parallax-Text (assets/js/reveal.js, im Editor: Absatz → „Parallax-Text“) ---------- */
.rw-buehne { position: relative; margin-block: 0 !important; }
.rw-buehne > .rw-hero { position: sticky; z-index: 1; }
.rw-buehne__slot { display: grid; align-items: start; }
.rw-buehne__schritt { grid-area: 1 / 1; opacity: 0; will-change: opacity; }
.rw-buehne__schritt:first-child { opacity: 1; }
.rw-buehne__schritt > * { margin: 0; }
.rw-buehne__schritt--text { font-size: var(--wp--preset--font-size--large); line-height: 1.5; }
.rw-buehne__schritt--text > * { font: inherit; color: inherit; letter-spacing: normal; text-transform: none; }
.rw-buehne__schritt--text > * + * { margin-top: .5em; }
.rw-buehne__schritt--text ul, .rw-buehne__schritt--text ol { padding-left: 1.2em; }

/* ---------- Mobil ---------- */
@media (max-width: 600px) {
	.has-huge-font-size { font-size: clamp(2.1rem, 10.5vw, 2.8rem) !important; }
	.rw-header .rw-header-cta { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; scroll-behavior: auto !important; }
}
