/*
Theme Name: Wellenwerk
Theme URI: https://wellenwerk-berlin.de
Author: Wellenwerk Berlin
Author URI: https://wellenwerk-berlin.de
Description: Schlankes, eigenes Block-Theme (Full-Site-Editing) für den Website-Relaunch von Wellenwerk Berlin. Keine Page-Builder-Abhängigkeiten, Design-Tokens zentral in theme.json, Layouts über gesperrte Patterns.
Version: 0.2.15
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: wellenwerk
Tags: full-site-editing, block-patterns, one-column, custom-colors, custom-logo
*/

/*
 * HINWEIS:
 * Dieses Stylesheet bleibt bewusst (fast) leer.
 * Alle Design-Tokens (Farben, Typografie, Abstände, Layout-Breiten)
 * werden zentral in theme.json gepflegt — NICHT hier.
 *
 * Nur echte Sonderfälle, die theme.json nicht abbilden kann
 * (z. B. ::before/::after, komplexe Selektoren), gehören hierher.
 *
 * CI-Lookbook-Abgleich 08.07.2026: Palette in theme.json revidiert
 * (accent = Ocean #00ACB3 statt Cyan #02CBE6, secondary = Deep Blue Light
 * #0c4b70, neue Slugs gold/sunshine/hibiscus/ocean-light; Headings =
 * Source Sans 3 Bold in Versalien statt Archivo). Die Fallback-Hexwerte
 * unten (#192a53, #0f1b33, #ffffff) sind davon nicht betroffen — geprüft.
 */

/* Fokus-Sichtbarkeit für Tastaturnutzung (BFSG / Barrierefreiheit).
   theme.json kann :focus-visible nicht global stylen. */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
	outline: 2px solid var(--wp--preset--color--primary, #192a53);
	outline-offset: 2px;
}

/* "Skip to content"-Link für Screenreader/Tastatur (wird von WP automatisch
   ausgegeben, hier nur sauber positioniert). */
.skip-link.screen-reader-text {
	position: absolute;
	left: -9999px;
	top: 0;
}
.skip-link.screen-reader-text:focus {
	left: 1rem;
	top: 1rem;
	z-index: 100000;
	padding: 0.75rem 1.25rem;
	background: var(--wp--preset--color--contrast, #0f1b33);
	color: var(--wp--preset--color--base, #ffffff);
}

/* Bewegung reduzieren, wenn Nutzer:in das wünscht (BFSG). */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}


/* Lesbarkeit auf Navy-Flächen (Primary) — Absicherung zusätzlich zu Block-Attributen */
.has-primary-background-color h1,
.has-primary-background-color h2,
.has-primary-background-color h3 { color: var(--wp--preset--color--contrast); }
.has-primary-background-color p { color: #dfeef4; }
.has-primary-background-color a:not(.wp-element-button) { color: var(--wp--preset--color--ocean-light); }


/* ===== Darkmode-Feinschliff Richtung Prototyp (v0.2.0) ===== */
.wp-block-details { background: var(--wp--preset--color--surface); border: 1px solid rgba(255,255,255,.12); border-radius: 10px; padding: 1em 1.25em; }
.wp-block-details summary { font-weight: 700; cursor: pointer; }
.wp-block-details[open] summary { margin-bottom: .5em; }
.wp-block-image img, .wp-block-media-text__media img, .wp-block-post-featured-image img { border-radius: 10px; }
.wp-block-button__link { border-radius: 4px; }
.wp-block-list.is-style-plain { list-style: none; padding-left: 0; }
.wp-block-list.is-style-plain li { margin-bottom: .45em; }
footer.wp-block-group a { color: #dfeef4; text-decoration: none; }
footer.wp-block-group a:hover { color: var(--wp--preset--color--accent); }
/* Formulare (Fluent Forms) auf Dunkel */
.fluentform input[type=text], .fluentform input[type=email], .fluentform input[type=number],
.fluentform textarea, .fluentform select { background: var(--wp--preset--color--surface) !important; color: var(--wp--preset--color--contrast) !important; border: 1px solid rgba(255,255,255,.18) !important; border-radius: 8px !important; }
.fluentform .ff-el-input--label label, .fluentform .ff_t_c { color: var(--wp--preset--color--contrast) !important; }
.fluentform .ff-btn-submit { background: var(--wp--preset--color--accent) !important; color: #0A1428 !important; border-radius: 4px !important; font-weight: 700 !important; border: 0 !important; }
/* Listen: bündig mit dem Fließtext, ohne Karten-Optik */
main ul.wp-block-list { padding-left: 0; list-style: none; }
main ul.wp-block-list li { margin-bottom: .55em; }
/* Outline-Buttons: heller Text auf dunklem Grund, sofern keine explizite Farbe */
.wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color) { color: var(--wp--preset--color--contrast); }

/* ===== Testimonials, Stats & Magazin-Teaser (Startseite, Prototyp-Optik) ===== */
.wp-block-quote { margin: 0; background: var(--wp--preset--color--base); border: 1px solid rgba(255,255,255,.14); border-top: 3px solid var(--wp--preset--color--gold); border-radius: 10px; padding: 1.4em; font-size: .95rem; height: 100%; box-sizing: border-box; }
.wp-block-quote p { margin: 0 0 .8em; }
.wp-block-quote cite { font-style: normal; font-weight: 700; color: var(--wp--preset--color--contrast-soft); font-size: .85rem; }
p.stat-num { font-family: var(--wp--preset--font-family--heading); font-weight: 800; font-size: clamp(1.5rem, 1.3rem + .6vw, 2rem); margin-bottom: 0; }
p.stat-lbl { color: var(--wp--preset--color--contrast-soft); font-size: .85rem; margin-top: .2em; }
p.known-from { color: var(--wp--preset--color--contrast-soft); font-size: .85rem; }
.wp-block-latest-posts.is-grid { gap: 1.5em; padding-left: 0; }
.wp-block-latest-posts.is-grid li { background: var(--wp--preset--color--surface); border: 1px solid rgba(255,255,255,.12); border-radius: 10px; overflow: hidden; margin: 0 0 1em; padding-bottom: 1em; }
.wp-block-latest-posts__featured-image img { width: 100%; height: 170px; object-fit: cover; border-radius: 0; }
.wp-block-latest-posts.is-grid li > a { display: block; font-weight: 700; padding: .9em 1em .3em; color: var(--wp--preset--color--contrast); text-decoration: none; }
.wp-block-latest-posts__post-excerpt { padding: 0 1em; font-size: .9rem; color: var(--wp--preset--color--contrast-soft); margin: .2em 0 0; }

/* ===== v0.2.3: Magazin-Teaser-Grid + vertikaler Rhythmus ===== */
/* Teaser-Kacheln: 3 gleichmäßige Spalten, gleiche Höhen (Desktop) */
.wp-block-latest-posts.is-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5em; }
.wp-block-latest-posts.is-grid li { width: auto !important; margin: 0 !important; display: flex; flex-direction: column; }
.wp-block-latest-posts.is-grid li > a { flex: 0 0 auto; }
@media (max-width: 781px) { .wp-block-latest-posts.is-grid { grid-template-columns: 1fr; } }
/* Vertikaler Rhythmus wie im Entwurf: Überschrift nah am Inhalt, Luft davor */
main h2 + *, main h3 + * { margin-block-start: .6em !important; }
main :is(p, ul, ol, figure, div, blockquote) + h2 { margin-block-start: 2.4em !important; }
main :is(p, ul, ol, figure, div, blockquote) + h3 { margin-block-start: 1.8em !important; }

/* Mobile-Header: großes Logo links, daneben nur der Burger (CTA steckt im Hero) */
@media (max-width: 781px) {
  header .wp-block-group.alignwide { flex-wrap: nowrap; }
  header .wp-block-site-logo img { width: 170px !important; height: auto !important; }
  header .cta--book { display: none !important; }
}

/* Mobile-Menü: linksbündig, kompakte Hierarchie statt Flattersatz */
@media (max-width: 781px) {
  .wp-block-navigation__responsive-container.is-menu-open { padding: 4.5rem 1.5rem 2rem; }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { align-items: flex-start; }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { align-items: flex-start; text-align: left; gap: .3rem; width: 100%; }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { width: 100%; justify-content: flex-start; }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { padding: .3rem 0; font-size: 1.05rem; }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu > .wp-block-navigation-item__content { font-weight: 700; text-transform: uppercase; letter-spacing: .06em; font-size: .8rem; color: var(--wp--preset--color--contrast-soft); margin-top: 1rem; }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container { padding-left: .9rem; border-left: 2px solid rgba(255,255,255,.15); gap: .25rem; align-items: flex-start; }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon { display: none; }
}

/* Header wie im Entwurf: Nav neben dem Logo, luftige Abstände, DE/EN-Pill */
header nav.wp-block-navigation { gap: 1.5rem; }
header .lang-switch .wp-block-button__link { padding: .35em .7em; font-size: .8rem; font-weight: 600; background: transparent; border: 1px solid rgba(255,255,255,.35); border-radius: 8px; color: var(--wp--preset--color--contrast); }
header .lang-switch .wp-block-button__link:hover { background: rgba(255,255,255,.08); color: var(--wp--preset--color--contrast); }
@media (max-width: 900px) { header .lang-switch { display: none; } }

/* ===== v0.2.4: Mobile-Menü-Feinschliff (WP-Navigations-CSS lädt nach dem Theme, daher !important) ===== */
@media (max-width: 900px) {
  header .lang-switch { display: none !important; }
}
@media (max-width: 781px) {
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: .4rem !important; }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { padding: .3rem 0 !important; }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container { padding-left: 1rem !important; gap: .2rem !important; }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu { gap: .3rem !important; }
}

/* Mobile: Burger in Gold rechts außen (wie alte Seite) */
@media (max-width: 781px) {
  header .wp-block-group.alignwide > .wp-block-group:first-of-type { flex: 1 1 auto; justify-content: space-between; }
  header .wp-block-navigation__responsive-container-open { color: var(--wp--preset--color--gold); }
  header .wp-block-navigation__responsive-container-open svg { width: 36px; height: 36px; }
}

/* ===== v0.2.7: Footer-Feinschliff + größeres Mobil-Logo ===== */
footer .footer-socials { justify-content: flex-end; }
footer .wp-block-list.is-style-plain li { margin-bottom: .5em; }
footer h4 { margin-bottom: .9em; }
@media (max-width: 781px) {
  header .wp-block-site-logo img { width: 200px !important; }
  footer .footer-socials { justify-content: flex-start; margin-top: .8em; }
  footer .wp-block-buttons { justify-content: flex-start !important; }
}
/* Desktop: mehr Luft zwischen Logo und Navigation */
@media (min-width: 782px) {
  header .wp-block-site-logo { margin-right: 3.5rem; }
}

/* ===== v0.2.8: Hero-Absätze linksbündig unter der H1, begrenzte Zeilenlänge ===== */
.wp-block-cover p.hero-sub { max-width: 62ch; margin-left: max(0px, calc((100% - 1160px) / 2)) !important; margin-right: auto !important; }

/* Gutschein-Karten: gleiche Höhe, Button unten */
.wp-block-column > .voucher-card { height: 100%; display: flex; flex-direction: column; }
.voucher-card .wp-block-buttons { margin-top: auto; }

/* ===== v0.2.13: Complianz-Banner im Dark-Design ===== */
.cmplz-cookiebanner { background-color: var(--wp--preset--color--surface) !important; color: var(--wp--preset--color--contrast) !important; border: 1px solid rgba(255,255,255,.14) !important; border-radius: 12px !important; box-shadow: 0 12px 40px rgba(0,0,0,.45) !important; }
.cmplz-cookiebanner .cmplz-title, .cmplz-cookiebanner .cmplz-message, .cmplz-cookiebanner .cmplz-category *, .cmplz-cookiebanner .cmplz-links a { color: var(--wp--preset--color--contrast) !important; }
.cmplz-cookiebanner .cmplz-message a { color: var(--wp--preset--color--secondary) !important; }
.cmplz-cookiebanner .cmplz-btn.cmplz-accept { background-color: var(--wp--preset--color--accent) !important; color: #0A1428 !important; border: 0 !important; border-radius: 4px !important; font-weight: 700 !important; }
.cmplz-cookiebanner .cmplz-btn.cmplz-deny, .cmplz-cookiebanner .cmplz-btn.cmplz-view-preferences, .cmplz-cookiebanner .cmplz-btn.cmplz-save-preferences { background: transparent !important; color: var(--wp--preset--color--contrast) !important; border: 1px solid rgba(255,255,255,.35) !important; border-radius: 4px !important; }
.cmplz-cookiebanner .cmplz-category { background: var(--wp--preset--color--base) !important; border-radius: 8px !important; }
.cmplz-cookiebanner input:checked + .cmplz-label { background-color: var(--wp--preset--color--accent) !important; }
#cmplz-manage-consent .cmplz-manage-consent { background: var(--wp--preset--color--surface) !important; color: var(--wp--preset--color--contrast) !important; border: 1px solid rgba(255,255,255,.2) !important; }

/* ===== v0.2.15: Sektions-Überschriften zentriert (Karten/Media-Text bleiben links) ===== */
main h2.wp-block-heading { text-align: center; }
main .wp-block-media-text h2.wp-block-heading,
main .wp-block-column h2.wp-block-heading { text-align: left; }
body.page main h2.wp-block-heading + p { text-align: center; }
body.page main .wp-block-media-text h2.wp-block-heading + p,
body.page main .wp-block-column h2.wp-block-heading + p { text-align: left; }