/*
Theme Name: DarmMut Bold
Theme URI: https://darmmut.de
Author: DarmMut
Author URI: https://darmmut.de
Description: Ein farbstarkes, modernes WordPress-Theme für einen persönlichen Blog über Colitis ulcerosa. Klar, responsiv, barrierebewusst und Gutenberg-kompatibel.
Version: 2.19.0
Requires at least: 6.4
Requires PHP: 8.0
Text Domain: darmmut
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Tags: blog, accessibility-ready, custom-logo, custom-menu, featured-images, wide-blocks, threaded-comments
*/

:root {
  --dm-night: #101d30;
  --dm-navy: #162943;
  --dm-navy-2: #203a5c;
  --dm-purple: #6d4aff;
  --dm-purple-bright: #8f72ff;
  --dm-purple-soft: #eee9ff;
  --dm-teal: #00a99b;
  --dm-teal-bright: #00c2b2;
  --dm-orange: #ff7a2b;
  --dm-orange-soft: #fff0e5;
  --dm-yellow: #ffd45a;
  --dm-ink: #152033;
  --dm-text: #344154;
  --dm-muted: #687588;
  --dm-paper: #f4f7fb;
  --dm-white: #ffffff;
  --dm-border: #dfe5ee;
  --dm-shadow: 0 24px 70px rgba(16, 29, 48, .14);
  --dm-shadow-sm: 0 12px 34px rgba(16, 29, 48, .10);
  --dm-radius: 18px;
  --dm-radius-lg: 30px;
  --dm-max: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--dm-text); background: var(--dm-white); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 17px; line-height: 1.7; -webkit-font-smoothing: antialiased; }
body::selection { color: var(--dm-white); background: var(--dm-purple); }
img { max-width: 100%; height: auto; }
a { color: var(--dm-purple); }
a:hover { color: #4e30d7; }
button, input, textarea, select { font: inherit; }
h1, h2, h3, h4, h5, h6 { margin: 0 0 .55em; color: var(--dm-ink); font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-weight: 900; line-height: 1.08; letter-spacing: -.04em; }
h1 { font-size: clamp(3.2rem, 7.4vw, 6.8rem); }
h2 { font-size: clamp(2.15rem, 4vw, 4.2rem); }
h3 { font-size: clamp(1.28rem, 2vw, 1.7rem); }
p { margin: 0 0 1.2em; }

.screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.screen-reader-text:focus { z-index: 100000; top: 10px; left: 10px; width: auto; height: auto; padding: 12px 16px; clip: auto !important; color: var(--dm-night); background: var(--dm-white); border-radius: 8px; box-shadow: var(--dm-shadow-sm); }
.dm-container { width: min(calc(100% - 48px), var(--dm-max)); margin-inline: auto; }
.dm-narrow { width: min(calc(100% - 48px), 840px); margin-inline: auto; }
.dm-section { padding: 106px 0; }
.dm-kicker { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 20px; color: var(--dm-purple); font-size: .78rem; font-weight: 900; letter-spacing: .17em; text-transform: uppercase; }
.dm-kicker::before { content: ""; width: 28px; height: 5px; border-radius: 10px; background: linear-gradient(90deg, var(--dm-teal), var(--dm-purple)); }
.dm-lead { max-width: 720px; color: var(--dm-muted); font-size: clamp(1.06rem, 2vw, 1.28rem); line-height: 1.68; }

.dm-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 13px 22px; border: 2px solid var(--dm-purple); border-radius: 12px; color: var(--dm-white); background: var(--dm-purple); font-size: .94rem; font-weight: 900; letter-spacing: -.01em; text-decoration: none; cursor: pointer; box-shadow: 0 8px 0 #4a2cc5; transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }
.dm-button:hover { color: var(--dm-white); background: #7a59ff; transform: translateY(-2px); box-shadow: 0 10px 0 #4a2cc5; }
.dm-button:active { transform: translateY(4px); box-shadow: 0 3px 0 #4a2cc5; }
.dm-button--teal { border-color: var(--dm-teal); background: var(--dm-teal); box-shadow: 0 8px 0 #007d73; }
.dm-button--teal:hover { background: #00b8a9; box-shadow: 0 10px 0 #007d73; }
.dm-button--light { border-color: rgba(255,255,255,.28); color: var(--dm-white); background: rgba(255,255,255,.08); box-shadow: none; }
.dm-button--light:hover { border-color: rgba(255,255,255,.6); background: rgba(255,255,255,.14); box-shadow: none; }
.dm-button--outline { border-color: var(--dm-border); color: var(--dm-night); background: var(--dm-white); box-shadow: none; }
.dm-button--outline:hover { border-color: var(--dm-purple); color: var(--dm-purple); background: var(--dm-white); box-shadow: none; }
.dm-arrow { font-size: 1.25em; }

.site-header { position: sticky; z-index: 1000; top: 0; color: var(--dm-white); background: rgba(16,29,48,.96); border-bottom: 1px solid rgba(255,255,255,.08); backdrop-filter: blur(16px); }
.admin-bar .site-header { top: 32px; }
.site-header::after { content: ""; position: absolute; left: 0; right: 0; bottom: -3px; height: 3px; background: linear-gradient(90deg, var(--dm-purple) 0 45%, var(--dm-teal) 45% 74%, var(--dm-orange) 74%); }
.dm-header-inner { display: flex; align-items: center; justify-content: space-between; min-height: 88px; gap: 28px; }
.site-branding { flex: 0 0 auto; }
.custom-logo-link { display: block; line-height: 0; }
.custom-logo { width: auto; max-width: 260px; max-height: 66px; }
.dm-brand { display: inline-flex; align-items: center; gap: 12px; color: var(--dm-white); text-decoration: none; }
.dm-brand-mark { width: 58px; height: 58px; }
.dm-brand-name { display: grid; line-height: 1; }
.dm-brand-name strong { color: var(--dm-white); font-size: 1.55rem; font-weight: 950; letter-spacing: -.045em; }
.dm-brand-name strong em { color: var(--dm-purple-bright); font-style: normal; }
.dm-brand-name span { margin-top: 7px; color: #aebbd0; font-size: .62rem; font-weight: 900; letter-spacing: .17em; text-transform: uppercase; }
.dm-nav-wrap { display: flex; align-items: center; gap: 22px; }
.primary-menu { display: flex; align-items: center; gap: 28px; padding: 0; margin: 0; list-style: none; }
.primary-menu a { position: relative; color: #d9e2ef; font-size: .91rem; font-weight: 800; text-decoration: none; }
.primary-menu a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -9px; height: 3px; border-radius: 3px; background: var(--dm-teal-bright); transition: right .2s ease; }
.primary-menu a:hover, .primary-menu .current-menu-item > a { color: var(--dm-white); }
.primary-menu a:hover::after, .primary-menu .current-menu-item > a::after { right: 0; }
.menu-toggle { display: none; align-items: center; justify-content: center; width: 46px; height: 46px; padding: 0; border: 1px solid rgba(255,255,255,.2); border-radius: 10px; color: var(--dm-white); background: transparent; }
.dm-header-cta { min-height: 44px; padding: 9px 17px; box-shadow: none; }

.dm-hero { position: relative; overflow: hidden; color: var(--dm-white); background: var(--dm-night); }
.dm-hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 44px 44px; mask-image: linear-gradient(to bottom, #000, transparent 88%); }
.dm-hero::after { content: ""; position: absolute; width: 620px; height: 620px; right: -240px; top: -310px; border-radius: 50%; background: radial-gradient(circle, rgba(109,74,255,.38), rgba(109,74,255,0) 70%); }
.dm-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1.08fr .92fr; gap: 64px; align-items: center; min-height: 720px; padding-top: 76px; padding-bottom: 80px; }
.dm-hero h1 { color: var(--dm-white); max-width: 760px; }
.dm-hero h1 .accent { color: var(--dm-purple-bright); }
.dm-hero .dm-kicker { color: #a9fff7; }
.dm-hero .dm-lead { color: #b9c5d6; }
.dm-actions { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 32px; }
.dm-signal-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 34px; }
.dm-signal-row span { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid rgba(255,255,255,.13); border-radius: 8px; color: #dbe4f1; background: rgba(255,255,255,.04); font-size: .78rem; font-weight: 800; }
.dm-signal-row span::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--dm-teal-bright); box-shadow: 0 0 0 4px rgba(0,194,178,.12); }
.dm-hero-panel { position: relative; display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.dm-hero-badges { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding: 0 18px; }
.dm-mini-card { position: relative; z-index: 3; display: grid; gap: 3px; min-height: 78px; padding: 17px 19px; border-radius: 14px; box-shadow: var(--dm-shadow-sm); }
.dm-mini-card strong { font-size: .86rem; letter-spacing: -.01em; }
.dm-mini-card span { font-size: .72rem; }
.dm-mini-card--one { color: var(--dm-night); background: var(--dm-yellow); transform: rotate(1deg); }
.dm-mini-card--two { color: var(--dm-white); background: var(--dm-orange); transform: rotate(-1deg); }
.dm-power-card { position: relative; min-height: 470px; padding: 38px; border: 1px solid rgba(255,255,255,.16); border-radius: 30px; background: linear-gradient(145deg, rgba(31,55,87,.96), rgba(18,32,52,.98)); box-shadow: 0 40px 90px rgba(0,0,0,.32); overflow: hidden; }
.dm-power-card::before { content: ""; position: absolute; width: 240px; height: 240px; right: -80px; bottom: -70px; border-radius: 50%; background: rgba(0,194,178,.13); }
.dm-power-card::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 8px; background: linear-gradient(90deg, var(--dm-purple), var(--dm-teal), var(--dm-orange)); }
.dm-power-top { position: relative; z-index: 2; display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.dm-icon-stage { display: grid; place-items: center; width: 190px; height: 190px; border-radius: 24px; background: linear-gradient(145deg, #8062ff, #5533cc); transform: rotate(-3deg); box-shadow: 18px 18px 0 rgba(0,194,178,.18); }
.dm-icon-stage img { width: 126px; filter: drop-shadow(0 16px 24px rgba(0,0,0,.28)); transform: rotate(3deg); }
.dm-panel-code { color: #7ff7ed; font-size: .72rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; writing-mode: vertical-rl; }
.dm-power-copy { position: relative; z-index: 2; margin-top: 34px; }
.dm-power-copy small { color: var(--dm-orange); font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.dm-power-copy strong { display: block; max-width: 370px; margin-top: 8px; color: var(--dm-white); font-size: clamp(1.8rem, 3vw, 2.7rem); line-height: 1.08; letter-spacing: -.04em; }
.dm-power-copy p { max-width: 390px; margin-top: 15px; color: #afbdd0; font-size: .94rem; }

.dm-topic-bar { position: relative; z-index: 3; margin-top: -1px; background: var(--dm-white); border-bottom: 1px solid var(--dm-border); }
.dm-topic-bar-inner { display: grid; grid-template-columns: repeat(4, 1fr); }
.dm-topic-bar a { display: flex; align-items: center; gap: 12px; min-height: 76px; padding: 14px 22px; color: var(--dm-night); border-right: 1px solid var(--dm-border); font-size: .84rem; font-weight: 900; text-decoration: none; }
.dm-topic-bar a:first-child { border-left: 1px solid var(--dm-border); }
.dm-topic-bar b { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 8px; color: var(--dm-white); background: var(--dm-purple); font-size: .75rem; }
.dm-topic-bar a:nth-child(2) b { background: var(--dm-teal); }
.dm-topic-bar a:nth-child(3) b { background: var(--dm-orange); }
.dm-topic-bar a:nth-child(4) b { color: var(--dm-night); background: var(--dm-yellow); }

.dm-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 36px; margin-bottom: 46px; }
.dm-section-heading h2 { max-width: 800px; }
.dm-post-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 24px; }
.dm-card { position: relative; display: flex; flex-direction: column; min-height: 100%; border: 1px solid var(--dm-border); border-radius: var(--dm-radius); background: var(--dm-white); box-shadow: var(--dm-shadow-sm); overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }
.dm-card:hover { transform: translateY(-6px); box-shadow: var(--dm-shadow); }
.dm-card-media { position: relative; aspect-ratio: 16/9; overflow: hidden; background: var(--dm-purple-soft); }
.dm-card-media img { width: 100%; height: 100%; object-fit: cover; }
.dm-card-placeholder { position: absolute; inset: 0; display: grid; place-items: center; overflow: hidden; }
.dm-card-placeholder::before { content: ""; position: absolute; width: 230px; height: 230px; right: -80px; top: -110px; border-radius: 50%; background: rgba(255,255,255,.22); }
.dm-card-placeholder::after { content: attr(data-index); position: absolute; left: 18px; bottom: -18px; color: rgba(255,255,255,.24); font-size: 7rem; font-weight: 950; line-height: 1; }
.dm-card:nth-child(1) .dm-card-placeholder { background: linear-gradient(135deg,#6d4aff,#9b7fff); }
.dm-card:nth-child(2) .dm-card-placeholder { background: linear-gradient(135deg,#008e84,#00c2b2); }
.dm-card:nth-child(3) .dm-card-placeholder { background: linear-gradient(135deg,#f2681b,#ff9d5f); }
.dm-card-placeholder img { position: relative; z-index: 2; width: 94px; height: 94px; object-fit: contain; filter: drop-shadow(0 12px 20px rgba(0,0,0,.22)); }
.dm-card-body { display: flex; flex: 1; flex-direction: column; padding: 25px 26px 27px; }
.dm-card-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 15px; color: var(--dm-muted); font-size: .72rem; font-weight: 800; }
.dm-pill { display: inline-flex; padding: 5px 9px; border-radius: 6px; color: var(--dm-purple); background: var(--dm-purple-soft); font-weight: 900; }
.dm-card h3 { margin-bottom: 12px; }
.dm-card h3 a { color: inherit; text-decoration: none; }
.dm-card p { color: var(--dm-muted); font-size: .94rem; }
.dm-card-link { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; color: var(--dm-night); font-size: .9rem; font-weight: 950; text-decoration: none; }
.dm-card-link::after { content: "→"; color: var(--dm-purple); font-size: 1.2em; transition: transform .2s ease; }
.dm-card-link:hover::after { transform: translateX(4px); }

.dm-story { color: var(--dm-text); background: var(--dm-white); overflow: hidden; }
.dm-story-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 84px; align-items: center; }
.dm-story h2 { color: var(--dm-ink); }
.dm-story .dm-lead { color: var(--dm-muted); }
.dm-story-visual { position: relative; min-height: 520px; }
.dm-story-board { position: absolute; inset: 34px 20px 18px 24px; border: 1px solid var(--dm-border); border-radius: 30px; background: var(--dm-paper); box-shadow: 24px 24px 0 rgba(0,194,178,.23); transform: rotate(-2deg); overflow: hidden; }
.dm-story-board::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(var(--dm-border) 1px, transparent 1px), linear-gradient(90deg, var(--dm-border) 1px, transparent 1px); background-size: 36px 36px; opacity: .55; }
.dm-story-symbol { position: absolute; z-index: 2; left: 50%; top: 44%; width: 210px; transform: translate(-50%,-50%) rotate(2deg); }
.dm-story-sticker { position: absolute; z-index: 3; padding: 14px 16px; border-radius: 10px; color: var(--dm-night); font-weight: 950; box-shadow: var(--dm-shadow-sm); }
.dm-story-sticker--top { top: 18px; right: -3px; background: var(--dm-yellow); transform: rotate(4deg); }
.dm-story-sticker--bottom { left: -6px; bottom: 2px; color: var(--dm-white); background: var(--dm-purple); transform: rotate(-4deg); }
.dm-check-list { display: grid; gap: 14px; margin: 30px 0 34px; }
.dm-check-list div { display: flex; align-items: flex-start; gap: 13px; color: var(--dm-text); }
.dm-check-list b { display: grid; place-items: center; flex: 0 0 28px; width: 28px; height: 28px; border-radius: 8px; color: var(--dm-night); background: var(--dm-teal-bright); }


/* Version 2.15: Die Hintergrundfarben von „Warum DarmMut?“ und „Neu im Blog“ sind getauscht. */
.dm-blog-section { color: var(--dm-white); background: var(--dm-navy); }
.dm-blog-section h2 { color: var(--dm-white); }
.dm-blog-section .dm-kicker { color: #a9fff7; }
.dm-blog-section .dm-button--outline { border-color: rgba(255,255,255,.24); color: var(--dm-night); background: var(--dm-white); }
.dm-blog-section .dm-button--outline:hover { border-color: var(--dm-purple-bright); color: var(--dm-purple); background: var(--dm-white); }

.dm-worlds { background: var(--dm-paper); }
.dm-world-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
.dm-world { position: relative; min-height: 300px; padding: 34px; border-radius: 22px; color: var(--dm-white); text-decoration: none; overflow: hidden; box-shadow: var(--dm-shadow-sm); transition: color .2s ease, transform .2s ease, box-shadow .2s ease; }
.dm-world:visited { color: var(--dm-white); }
.dm-world:nth-child(1) { background: var(--dm-purple); }
.dm-world:nth-child(2) { background: var(--dm-teal); }
.dm-world:nth-child(3) { background: var(--dm-orange); }
.dm-world:nth-child(4) { background: var(--dm-yellow); }
.dm-world:hover,
.dm-world:focus-visible { color: var(--dm-night); transform: translateY(-5px); box-shadow: 0 20px 48px rgba(16,29,48,.18); }
.dm-world:focus-visible { outline: 4px solid var(--dm-night); outline-offset: 4px; }
.dm-world::after { content: attr(data-number); position: absolute; right: 20px; bottom: -35px; color: rgba(255,255,255,.18); font-size: 11rem; font-weight: 950; line-height: 1; transition: color .2s ease; }
.dm-world:hover::after,
.dm-world:focus-visible::after { color: rgba(16,29,48,.14); }
.dm-world small { position: relative; z-index: 2; display: inline-flex; padding: 6px 9px; border: 1px solid rgba(255,255,255,.45); border-radius: 7px; color: inherit; font-size: .72rem; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; transition: border-color .2s ease; }
.dm-world:hover small,
.dm-world:focus-visible small { border-color: rgba(16,29,48,.32); }
.dm-world strong { position: relative; z-index: 2; display: block; max-width: 380px; margin-top: 44px; color: inherit; font-size: clamp(1.7rem, 3vw, 2.65rem); line-height: 1.05; letter-spacing: -.04em; }
.dm-world span { position: absolute; z-index: 3; left: 34px; bottom: 30px; color: inherit; font-size: .86rem; font-weight: 900; }

.dm-quote-band { position: relative; padding: 94px 0; color: var(--dm-white); background: var(--dm-purple); overflow: hidden; }
.dm-quote-band::before { content: "MUT"; position: absolute; left: 50%; top: 50%; color: rgba(255,255,255,.09); font-size: min(34vw, 420px); font-weight: 950; line-height: .8; transform: translate(-50%,-50%); }
.dm-quote-band blockquote { position: relative; z-index: 2; margin: 0; text-align: center; color: var(--dm-white); font-size: clamp(2rem, 4.6vw, 4.8rem); font-weight: 950; line-height: 1.08; letter-spacing: -.05em; }
.dm-quote-band blockquote span { color: #bdfff8; }
.dm-quote-band cite { display: block; margin-top: 22px; color: #e5dcff; font-size: .9rem; font-style: normal; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }


/* Lila-Schleife Teaser auf der Startseite */
.dm-ribbon-teaser { position: relative; padding: 96px 0; color: var(--dm-white); background: linear-gradient(125deg, #241750 0%, #5632d5 48%, #101d30 100%); overflow: hidden; }
.dm-ribbon-teaser::before { content: ""; position: absolute; width: 420px; height: 420px; left: -150px; top: -210px; border: 68px solid rgba(255,255,255,.07); border-radius: 50%; }
.dm-ribbon-teaser::after { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(90deg,#000,transparent 82%); }
.dm-ribbon-teaser-grid { position: relative; z-index: 2; display: grid; grid-template-columns: .72fr 1.28fr; gap: 70px; align-items: center; }
.dm-ribbon-teaser-art { position: relative; display: grid; place-items: center; min-height: 360px; border: 1px solid rgba(255,255,255,.14); border-radius: 30px; background: rgba(10,20,35,.42); box-shadow: 0 28px 80px rgba(0,0,0,.28); }
.dm-ribbon-teaser-art::before { content: ""; position: absolute; width: 230px; height: 230px; border: 2px solid rgba(189,255,248,.24); border-radius: 50%; }
.dm-ribbon-teaser-art img { position: relative; z-index: 2; width: 185px; max-height: 265px; }
.dm-ribbon-teaser-tag { position: absolute; right: 24px; top: 22px; padding: 8px 11px; border-radius: 9px; color: var(--dm-night); background: var(--dm-yellow); font-size: .68rem; font-weight: 950; letter-spacing: .12em; text-transform: uppercase; transform: rotate(2deg); }
.dm-ribbon-teaser .dm-kicker { color: #bdfff8; }
.dm-ribbon-teaser h2 { color: var(--dm-white); }
.dm-ribbon-teaser p { max-width: 720px; color: #d7ddea; }
.dm-ribbon-teaser-points { display: flex; flex-wrap: wrap; gap: 9px; margin: 25px 0 31px; }
.dm-ribbon-teaser-points span { padding: 7px 10px; border: 1px solid rgba(255,255,255,.18); border-radius: 8px; color: #f7f3ff; background: rgba(255,255,255,.07); font-size: .76rem; font-weight: 850; }

/* Eigene Seite: Die lila Schleife */
.dm-ribbon-page-hero { position: relative; padding: 96px 0 92px; color: var(--dm-white); background: radial-gradient(circle at 80% 10%, rgba(143,114,255,.38), transparent 32%), linear-gradient(135deg, #101d30 0%, #1b2247 50%, #351b78 100%); overflow: hidden; }
.dm-ribbon-page-hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 44px 44px; mask-image: linear-gradient(to bottom,#000,transparent 92%); }
.dm-ribbon-page-hero-grid { position: relative; z-index: 2; display: grid; grid-template-columns: 1.08fr .92fr; gap: 70px; align-items: center; }
.dm-ribbon-page-hero h1 { color: var(--dm-white); font-size: clamp(3.3rem, 7.2vw, 6.6rem); }
.dm-ribbon-page-hero h1 span { color: var(--dm-purple-bright); }
.dm-ribbon-page-hero .dm-lead { color: #c9d2df; }
.dm-ribbon-page-hero .dm-kicker { color: #bdfff8; }
.dm-ribbon-page-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 30px; }
.dm-ribbon-page-art { position: relative; display: grid; place-items: center; min-height: 480px; border: 1px solid rgba(255,255,255,.16); border-radius: 34px; background: linear-gradient(150deg, rgba(109,74,255,.2), rgba(7,16,29,.58)); box-shadow: 0 38px 100px rgba(0,0,0,.35); }
.dm-ribbon-page-art::before, .dm-ribbon-page-art::after { content: ""; position: absolute; border-radius: 50%; }
.dm-ribbon-page-art::before { width: 320px; height: 320px; border: 2px solid rgba(189,255,248,.22); }
.dm-ribbon-page-art::after { width: 220px; height: 220px; border: 34px solid rgba(255,212,90,.09); }
.dm-ribbon-page-art img { position: relative; z-index: 3; width: 225px; max-height: 335px; }
.dm-ribbon-page-stamp { position: absolute; z-index: 4; right: 22px; top: 25px; padding: 12px 15px; border-radius: 10px; color: var(--dm-night); background: var(--dm-yellow); font-size: .72rem; font-weight: 950; letter-spacing: .12em; text-transform: uppercase; transform: rotate(2deg); }
.dm-ribbon-page-content { padding: 90px 0 106px; background: var(--dm-paper); }
.dm-ribbon-page .entry-content > * { max-width: none; }
.dm-ribbon-article { padding: 54px; border: 1px solid var(--dm-border); border-radius: 30px; background: var(--dm-white); box-shadow: var(--dm-shadow); }
.dm-ribbon-article h2 { max-width: 860px; margin-top: 0; }
.dm-ribbon-article p { max-width: 850px; }
.dm-ribbon-intro-grid { display: grid; grid-template-columns: 1.3fr .7fr; gap: 48px; align-items: center; margin-bottom: 76px; padding-bottom: 58px; border-bottom: 1px solid var(--dm-border); }
.dm-ribbon-eyebrow { margin-bottom: 13px; color: var(--dm-purple) !important; font-size: .76rem; font-weight: 950; letter-spacing: .15em; text-transform: uppercase; }
.dm-ribbon-intro { margin-bottom: 0; color: var(--dm-night) !important; font-size: clamp(1.2rem,2.4vw,1.7rem); font-weight: 760; line-height: 1.55; }
.dm-ribbon-definition { display: grid; gap: 8px; padding: 27px; border-left: 7px solid var(--dm-teal); border-radius: 0 16px 16px 0; background: #eafffc; }
.dm-ribbon-definition strong { color: var(--dm-night); font-size: 1.35rem; }
.dm-ribbon-definition span { color: #3f5b61; font-size: .86rem; }
.dm-ribbon-section { margin-top: 82px; }
.dm-ribbon-section:first-of-type { margin-top: 0; }
.dm-ribbon-timeline { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; margin-top: 36px; }
.dm-ribbon-timeline article { display: grid; grid-template-columns: 68px 1fr; gap: 20px; align-items: start; min-height: 190px; padding: 26px; border: 1px solid var(--dm-border); border-radius: 18px; background: var(--dm-paper); box-shadow: 0 10px 28px rgba(16,29,48,.06); }
.dm-ribbon-timeline article:nth-child(1) { background: var(--dm-purple-soft); }
.dm-ribbon-timeline article:nth-child(2) { background: #eafffc; }
.dm-ribbon-timeline article:nth-child(3) { background: var(--dm-orange-soft); }
.dm-ribbon-timeline article:nth-child(4) { background: #fff8dc; }
.dm-ribbon-timeline article > span { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 14px; color: var(--dm-white); background: var(--dm-purple); font-weight: 950; box-shadow: 0 7px 0 rgba(74,44,197,.18); }
.dm-ribbon-timeline article:nth-child(2) > span { background: var(--dm-teal); box-shadow: 0 7px 0 rgba(0,125,115,.16); }
.dm-ribbon-timeline article:nth-child(3) > span { background: var(--dm-orange); box-shadow: 0 7px 0 rgba(177,72,8,.15); }
.dm-ribbon-timeline article:nth-child(4) > span { color: var(--dm-night); background: var(--dm-yellow); box-shadow: 0 7px 0 rgba(176,137,27,.16); }
.dm-ribbon-timeline strong { display: block; color: var(--dm-night); font-size: 1.08rem; line-height: 1.25; }
.dm-ribbon-timeline p { margin: 8px 0 0; color: var(--dm-muted); font-size: .91rem; line-height: 1.62; }
.dm-ribbon-meaning-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; margin-top: 34px; }
.dm-ribbon-meaning-grid article { position: relative; min-height: 240px; padding: 29px; border-radius: 20px; overflow: hidden; }
.dm-ribbon-meaning-grid article:nth-child(1) { background: var(--dm-purple-soft); }
.dm-ribbon-meaning-grid article:nth-child(2) { background: #eafffc; }
.dm-ribbon-meaning-grid article:nth-child(3) { background: var(--dm-orange-soft); }
.dm-ribbon-meaning-grid article:nth-child(4) { background: #fff8dc; }
.dm-ribbon-meaning-grid b { display: block; margin-bottom: 30px; color: var(--dm-purple); font-size: .75rem; letter-spacing: .12em; }
.dm-ribbon-meaning-grid h3 { margin-bottom: 10px; }
.dm-ribbon-meaning-grid p { margin: 0; font-size: .92rem; }
.dm-ribbon-article blockquote { max-width: none; margin: 36px 0 0; padding: 32px 36px; border: 0; border-radius: 18px; color: var(--dm-white); background: linear-gradient(135deg,var(--dm-purple),#3f249e); font-size: clamp(1.25rem,2.4vw,1.8rem); }
.dm-ribbon-article blockquote p { margin: 0; color: var(--dm-white); font-weight: 850; }
.dm-ribbon-personal { display: grid; grid-template-columns: 1.2fr .8fr; gap: 46px; align-items: center; padding: 42px; border: 1px solid var(--dm-border); border-radius: 22px; background: var(--dm-paper); }
.dm-ribbon-personal h2 { margin-top: 0; }
.dm-ribbon-quote-card { display: grid; align-content: center; min-height: 260px; padding: 30px; border-radius: 20px; color: var(--dm-white); background: var(--dm-night); box-shadow: 12px 12px 0 var(--dm-teal); }
.dm-ribbon-quote-card span { color: #aebbd0; font-size: .78rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.dm-ribbon-quote-card strong { margin-top: 20px; color: var(--dm-white); font-size: clamp(1.6rem,3.3vw,2.8rem); line-height: 1.08; letter-spacing: -.04em; }
.dm-ribbon-sources { padding: 0 0 100px; background: var(--dm-paper); }
.dm-ribbon-sources-box { padding: 28px 32px; border: 1px solid #cfd7e3; border-radius: 18px; background: var(--dm-white); }
.dm-ribbon-sources-box h2 { margin-bottom: 13px; font-size: 1.35rem; }
.dm-ribbon-sources-box p, .dm-ribbon-sources-box li { color: var(--dm-muted); font-size: .84rem; }
.dm-ribbon-sources-box ul { margin: 16px 0 0; padding-left: 20px; }

.dm-newsletter { padding: 104px 0; background: var(--dm-white); }
.dm-newsletter-box { position: relative; display: grid; grid-template-columns: 1.05fr .95fr; gap: 56px; align-items: center; padding: 56px; border-radius: 28px; color: var(--dm-white); background: var(--dm-night); box-shadow: var(--dm-shadow); overflow: hidden; }
.dm-newsletter-box::before { content: ""; position: absolute; width: 270px; height: 270px; right: -120px; top: -130px; border: 54px solid rgba(109,74,255,.34); border-radius: 50%; }
.dm-newsletter-box h2 { color: var(--dm-white); }
.dm-newsletter-box p { color: #afbdd0; }
.dm-form { position: relative; z-index: 2; }
.dm-form-row { display: flex; gap: 10px; padding: 8px; border-radius: 14px; background: var(--dm-white); }
.dm-form-row input { flex: 1; min-width: 0; padding: 12px 13px; border: 0; outline: 0; color: var(--dm-ink); background: transparent; }
.dm-form small { display: block; margin-top: 12px; color: #8291a5; font-size: .72rem; }
.dm-newsletter-fallback { display: grid; justify-items: start; gap: 6px; }

.dm-blog-toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 34px; }
.dm-blog-toolbar a { display: inline-flex; padding: 8px 12px; border: 1px solid var(--dm-border); border-radius: 9px; color: var(--dm-night); background: var(--dm-white); font-size: .8rem; font-weight: 900; text-decoration: none; }
.dm-blog-toolbar a:hover { color: var(--dm-white); border-color: var(--dm-purple); background: var(--dm-purple); }
.dm-contact-grid { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(280px,.8fr); gap: 42px; align-items: start; }
.dm-contact-card, .dm-page-card { padding: 30px; border: 1px solid var(--dm-border); border-radius: 20px; background: var(--dm-white); box-shadow: var(--dm-shadow-sm); }
.dm-contact-form { display: grid; gap: 19px; }
.dm-field { display: grid; gap: 7px; }
.dm-field label { color: var(--dm-night); font-size: .86rem; font-weight: 900; }
.dm-field input, .dm-field textarea { width: 100%; padding: 13px 14px; border: 1px solid #cad4e2; border-radius: 10px; color: var(--dm-ink); background: var(--dm-white); }
.dm-field input:focus, .dm-field textarea:focus { outline: 3px solid rgba(109,74,255,.18); border-color: var(--dm-purple); }
.dm-field textarea { min-height: 190px; resize: vertical; }
.dm-field--honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.dm-check-field { display: flex; align-items: flex-start; gap: 10px; color: var(--dm-muted); font-size: .82rem; }
.dm-check-field input { margin-top: .35em; }
.dm-form-status { margin-bottom: 24px; padding: 16px 18px; border: 1px solid #a9dfd8; border-left: 6px solid var(--dm-teal); border-radius: 12px; color: #155a54; background: #eafffc; }
.dm-form-status--error { color: #6f3214; border-color: #f2c4a5; border-left-color: var(--dm-orange); background: var(--dm-orange-soft); }
.dm-info-list { display: grid; gap: 14px; padding: 0; margin: 24px 0 0; list-style: none; }
.dm-info-list li { display: flex; gap: 11px; align-items: flex-start; }
.dm-info-list b { color: var(--dm-teal); }
.dm-page-callout { margin: 28px 0; padding: 22px 24px; border-left: 7px solid var(--dm-yellow); border-radius: 0 14px 14px 0; color: var(--dm-night); background: #fff9df; }
.dm-page-callout p:last-child { margin-bottom: 0; }
.dm-newsletter-box .dm-page-callout p, .dm-newsletter-box .dm-page-callout strong { color: var(--dm-night); }

.dm-disclaimer { padding: 0 0 90px; }
.dm-disclaimer-box { display: flex; align-items: flex-start; gap: 18px; padding: 25px 28px; border: 1px solid #f0c5aa; border-left: 7px solid var(--dm-orange); border-radius: 14px; background: var(--dm-orange-soft); }
.dm-disclaimer-icon { display: grid; place-items: center; flex: 0 0 42px; width: 42px; height: 42px; border-radius: 10px; color: var(--dm-white); background: var(--dm-orange); font-weight: 950; }
.dm-disclaimer-box p { margin: 0; color: #684833; font-size: .88rem; }
.dm-disclaimer-box strong { color: #432b1d; }

.dm-page-header { padding: 92px 0 62px; color: var(--dm-white); background: var(--dm-night); }
.dm-page-header h1 { color: var(--dm-white); font-size: clamp(2.7rem, 6vw, 5.5rem); }
.dm-page-header p { max-width: 720px; color: #b7c3d4; }
.dm-content-wrap { padding: 76px 0 104px; }
.entry-content > * { max-width: 780px; margin-left: auto; margin-right: auto; }
.entry-content > .alignwide { max-width: var(--dm-max); }
.entry-content > .alignfull { max-width: none; }
.entry-content p, .entry-content li { color: #344154; }
.entry-content h2 { margin-top: 1.8em; }
.entry-content h3 { margin-top: 1.5em; }
.entry-content blockquote { padding: 26px 30px; border-left: 7px solid var(--dm-purple); color: var(--dm-night); background: var(--dm-purple-soft); border-radius: 0 16px 16px 0; font-size: 1.16rem; font-weight: 700; }
.entry-meta { color: var(--dm-muted); font-size: .86rem; font-weight: 750; }
.entry-footer { margin-top: 42px; padding-top: 24px; border-top: 1px solid var(--dm-border); }
.post-thumbnail { width: min(calc(100% - 48px), 1000px); margin: -38px auto 54px; border-radius: 24px; overflow: hidden; box-shadow: var(--dm-shadow); }
.post-navigation { width: min(calc(100% - 48px), 780px); margin: 36px auto 96px; }
.nav-links { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.nav-links a { display: block; padding: 19px 21px; border: 1px solid var(--dm-border); border-radius: 14px; color: var(--dm-night); background: var(--dm-white); text-decoration: none; }
.comments-area { width: min(calc(100% - 48px), 780px); margin: 0 auto 100px; }
.comment-list { padding: 0; list-style: none; }
.comment-body { margin-bottom: 18px; padding: 22px; border: 1px solid var(--dm-border); border-radius: 14px; }
.comment-form input:not([type=submit]), .comment-form textarea, .search-form input[type=search] { width: 100%; padding: 13px 14px; border: 1px solid var(--dm-border); border-radius: 10px; background: var(--dm-white); }
.search-form { display: flex; gap: 10px; max-width: 650px; }
.search-form label { flex: 1; }

.site-footer { padding: 76px 0 26px; color: #aab7ca; background: #0a1423; }
.dm-footer-grid { display: grid; grid-template-columns: 1.45fr .7fr .7fr; gap: 58px; }
.site-footer h4 { color: var(--dm-white); font-size: 1rem; letter-spacing: -.01em; }
.site-footer a { color: #cbd5e3; text-decoration: none; }
.site-footer a:hover { color: var(--dm-white); }
.dm-footer-brand { max-width: 430px; }
.dm-footer-brand p { margin-top: 20px; }
.dm-footer-links { display: grid; gap: 9px; padding: 0; margin: 0; list-style: none; }
.dm-footer-bottom { display: flex; justify-content: space-between; gap: 18px; margin-top: 56px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.1); font-size: .79rem; }

.pagination { margin-top: 44px; }
.pagination .nav-links { display: flex; flex-wrap: wrap; gap: 8px; }
.page-numbers { display: grid; place-items: center; min-width: 44px; min-height: 44px; padding: 6px 10px; border: 1px solid var(--dm-border); border-radius: 10px; color: var(--dm-night); background: var(--dm-white); text-decoration: none; }
.page-numbers.current { color: var(--dm-white); border-color: var(--dm-purple); background: var(--dm-purple); }


@media (max-width: 1040px) {
  .dm-ribbon-teaser-grid, .dm-ribbon-page-hero-grid { grid-template-columns: 1fr; }
  .dm-ribbon-teaser-art { width: min(100%,620px); }
  .dm-ribbon-page-art { width: min(100%,620px); margin-inline: auto; }
}

@media (max-width: 1040px) {
  .dm-hero-grid { grid-template-columns: 1fr; min-height: auto; }
  .dm-hero-copy { max-width: 850px; }
  .dm-hero-panel { width: min(100%, 650px); margin-inline: auto; }
  .dm-topic-bar-inner { grid-template-columns: repeat(2,1fr); }
  .dm-topic-bar a:nth-child(3) { border-left: 1px solid var(--dm-border); border-top: 1px solid var(--dm-border); }
  .dm-topic-bar a:nth-child(4) { border-top: 1px solid var(--dm-border); }
  .dm-post-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .dm-story-grid { gap: 48px; }
  .dm-newsletter-box { grid-template-columns: 1fr; }
}

@media (max-width: 850px) {
  .admin-bar .site-header { top: 46px; }
  .menu-toggle { display: inline-flex; }
  .site-navigation { position: absolute; left: 20px; right: 20px; top: calc(100% + 2px); display: none; padding: 18px; border: 1px solid rgba(255,255,255,.12); border-radius: 14px; background: var(--dm-night); box-shadow: var(--dm-shadow); }
  .site-navigation.is-open { display: block; }
  .primary-menu { align-items: stretch; flex-direction: column; gap: 4px; }
  .primary-menu a { display: block; padding: 10px 8px; }
  .primary-menu a::after { display: none; }
  .dm-header-cta { display: none; }
  .dm-story-grid { grid-template-columns: 1fr; }
  .dm-story-visual { width: min(100%, 590px); margin-inline: auto; }
  .dm-footer-grid { grid-template-columns: 1fr 1fr; }
  .dm-footer-brand { grid-column: 1/-1; }
}

@media (max-width: 680px) {
  body { font-size: 16px; }
  .dm-container, .dm-narrow { width: min(calc(100% - 28px), var(--dm-max)); }
  .dm-section { padding: 76px 0; }
  .dm-ribbon-teaser { padding: 76px 0; }
  .dm-ribbon-teaser-grid { gap: 38px; }
  .dm-ribbon-teaser-art { min-height: 300px; }
  .dm-ribbon-page-hero { padding: 72px 0; }
  .dm-ribbon-page-hero-grid { gap: 40px; }
  .dm-ribbon-page-art { min-height: 390px; }
  .dm-ribbon-page-art img { width: 180px; }
  .dm-ribbon-page-content { padding: 62px 0 76px; }
  .dm-ribbon-article { padding: 28px 22px; border-radius: 21px; }
  .dm-ribbon-intro-grid, .dm-ribbon-personal { grid-template-columns: 1fr; gap: 28px; }
  .dm-ribbon-intro-grid { margin-bottom: 56px; padding-bottom: 42px; }
  .dm-ribbon-meaning-grid { grid-template-columns: 1fr; }
  .dm-ribbon-timeline { grid-template-columns: 1fr; }
  .dm-ribbon-timeline article { grid-template-columns: 58px 1fr; min-height: 0; gap: 15px; padding: 18px; }
  .dm-ribbon-timeline article > span { width: 50px; height: 50px; }
  .dm-ribbon-personal { padding: 26px 20px; }
  .dm-ribbon-sources { padding-bottom: 76px; }
  .dm-header-inner { min-height: 76px; }
  .dm-brand-mark { width: 48px; height: 48px; }
  .dm-brand-name strong { font-size: 1.3rem; }
  .dm-brand-name span { display: none; }
  h1 { font-size: clamp(3rem, 16vw, 4.8rem); }
  h2 { font-size: clamp(2.1rem, 10vw, 3.2rem); }
  .dm-hero-grid { gap: 36px; padding-top: 62px; padding-bottom: 70px; }
  .dm-actions { align-items: stretch; flex-direction: column; }
  .dm-button { width: 100%; }
  .dm-hero-panel { min-height: 0; }
  .dm-hero-badges { gap: 10px; padding: 0; }
  .dm-mini-card { min-height: 72px; padding: 14px 15px; }
  .dm-power-card { min-height: 430px; padding: 26px; }
  .dm-icon-stage { width: 144px; height: 144px; border-radius: 20px; }
  .dm-icon-stage img { width: 98px; }
  .dm-power-copy { margin-top: 26px; }
  .dm-topic-bar-inner { grid-template-columns: 1fr; }
  .dm-topic-bar a, .dm-topic-bar a:nth-child(3), .dm-topic-bar a:nth-child(4) { border-left: 1px solid var(--dm-border); border-right: 1px solid var(--dm-border); border-top: 1px solid var(--dm-border); }
  .dm-topic-bar a:first-child { border-top: 0; }
  .dm-section-heading { align-items: flex-start; flex-direction: column; }
  .dm-post-grid { grid-template-columns: 1fr; }
  .dm-story-visual { min-height: 420px; }
  .dm-story-symbol { width: 170px; }
  .dm-world-grid { grid-template-columns: 1fr; }
  .dm-world { min-height: 260px; }
  .dm-newsletter-box { padding: 34px 23px; }
  .dm-form-row { align-items: stretch; flex-direction: column; background: transparent; padding: 0; }
  .dm-form-row input { padding: 14px; border-radius: 10px; background: var(--dm-white); }
  .dm-disclaimer-box { padding: 20px; }
  .dm-contact-grid { grid-template-columns: 1fr; }
  .dm-footer-grid { grid-template-columns: 1fr; gap: 34px; }
  .dm-footer-brand { grid-column: auto; }
  .dm-footer-bottom { flex-direction: column; }
  .nav-links { grid-template-columns: 1fr; }
  .search-form { flex-direction: column; }
}

@media (max-width: 420px) {
  .dm-hero-badges { grid-template-columns: 1fr; }
  .dm-mini-card { min-height: 0; transform: none; }
  .dm-panel-code { writing-mode: horizontal-tb; }
  .dm-power-top { align-items: center; flex-direction: column; }
  .dm-icon-stage { align-self: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Spezifische Overrides nach den allgemeinen Inhaltsstilen */
.dm-ribbon-page .dm-ribbon-article h2 { margin-top: 0; }
.dm-ribbon-page .dm-ribbon-article blockquote { max-width: none; margin: 36px 0 0; padding: 32px 36px; border: 0; border-radius: 18px; color: var(--dm-white); background: linear-gradient(135deg,var(--dm-purple),#3f249e); font-size: clamp(1.25rem,2.4vw,1.8rem); }
.dm-ribbon-page .dm-ribbon-article blockquote p { margin: 0; color: var(--dm-white); font-weight: 850; }


/* Version 2.5: robuste Kartenbreiten auf der Seite „Die lila Schleife“.
   Die gezielten !important-Regeln verhindern, dass Block-, Plugin- oder
   Browser-Konvertierungsstile die Textspalte auf Minimalbreite reduzieren. */
.dm-ribbon-page .dm-ribbon-article .dm-ribbon-timeline {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: stretch;
  width: 100% !important;
  max-width: none !important;
}
.dm-ribbon-page .dm-ribbon-article .dm-ribbon-timeline > article {
  display: flex !important;
  align-items: flex-start;
  gap: 20px;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 190px;
  margin: 0 !important;
}
.dm-ribbon-page .dm-ribbon-article .dm-ribbon-timeline > article > span {
  flex: 0 0 58px !important;
  width: 58px !important;
  min-width: 58px !important;
  max-width: 58px !important;
}
.dm-ribbon-page .dm-ribbon-article .dm-ribbon-timeline > article > div,
.dm-ribbon-page .dm-ribbon-article .dm-ribbon-timeline > article > .dm-ribbon-timeline-copy {
  display: block !important;
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.dm-ribbon-page .dm-ribbon-article .dm-ribbon-timeline strong,
.dm-ribbon-page .dm-ribbon-article .dm-ribbon-timeline p {
  display: block;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word;
}

@media (max-width: 680px) {
  .dm-ribbon-page .dm-ribbon-article .dm-ribbon-timeline {
    grid-template-columns: 1fr !important;
  }
  .dm-ribbon-page .dm-ribbon-article .dm-ribbon-timeline > article {
    min-height: 0;
    gap: 15px;
  }
  .dm-ribbon-page .dm-ribbon-article .dm-ribbon-timeline > article > span {
    flex-basis: 50px !important;
    width: 50px !important;
    min-width: 50px !important;
    max-width: 50px !important;
  }
}


/* Version 2.9: integrierte Einwilligungsverwaltung */
.dm-consent-root[hidden],
.dm-consent-banner[hidden],
.dm-consent-backdrop[hidden],
.dm-consent-settings[hidden] { display: none !important; }

.dm-consent-root {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  pointer-events: none;
  font-family: inherit;
}

.dm-consent-banner {
  position: absolute;
  right: 16px;
  bottom: max(16px, env(safe-area-inset-bottom));
  left: 16px;
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr) 238px;
  gap: 30px;
  align-items: center;
  width: min(calc(100% - 32px), 1480px);
  max-height: calc(100vh - 32px);
  margin-inline: auto;
  padding: 24px 26px;
  overflow: auto;
  border: 1px solid rgba(16, 29, 48, .14);
  border-radius: 20px;
  color: var(--dm-text);
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 24px 80px rgba(10, 20, 35, .25), 0 2px 8px rgba(10, 20, 35, .08);
  pointer-events: auto;
}

.dm-consent-brand {
  display: flex;
  align-items: center;
  gap: 13px;
  min-width: 0;
}

.dm-consent-brand img {
  flex: 0 0 56px;
  width: 56px;
  height: 56px;
}

.dm-consent-brand strong {
  display: block;
  color: var(--dm-night);
  font-size: 1.15rem;
  line-height: 1;
}

.dm-consent-brand span {
  display: block;
  margin-top: 6px;
  color: var(--dm-muted);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.dm-consent-copy h2,
.dm-consent-settings h2 {
  margin: 0 0 8px;
  color: var(--dm-night);
  font-size: clamp(1.15rem, 2vw, 1.55rem);
  line-height: 1.15;
  letter-spacing: -.025em;
}

.dm-consent-copy p,
.dm-consent-settings p {
  margin: 0;
  color: var(--dm-text);
  font-size: .91rem;
  line-height: 1.6;
}

.dm-consent-copy a,
.dm-consent-settings a {
  color: var(--dm-purple);
  font-weight: 850;
  text-underline-offset: 3px;
}

.dm-consent-actions {
  display: grid;
  gap: 9px;
}

.dm-consent-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 11px 17px;
  border: 2px solid transparent;
  border-radius: 10px;
  font: inherit;
  font-size: .86rem;
  font-weight: 950;
  line-height: 1.1;
  text-align: center;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.dm-consent-button:hover { transform: translateY(-1px); }
.dm-consent-button:focus-visible,
.dm-footer-link-button:focus-visible {
  outline: 3px solid rgba(143, 114, 255, .45);
  outline-offset: 3px;
}
.dm-consent-button--primary {
  color: #fff;
  background: var(--dm-purple);
  box-shadow: 0 8px 20px rgba(109, 74, 255, .25);
}
.dm-consent-button--primary:hover { background: #5b38eb; }
.dm-consent-button--secondary {
  color: #fff;
  background: var(--dm-night);
}
.dm-consent-button--secondary:hover { background: #203a5c; }
.dm-consent-button--reject {
  color: var(--dm-night);
  border-color: rgba(16, 29, 48, .22);
  background: #fff;
}
.dm-consent-button--reject:hover { background: #f4f6fa; }

.dm-consent-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 15, 27, .68);
  backdrop-filter: blur(4px);
  pointer-events: auto;
}

.dm-consent-settings {
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(calc(100% - 32px), 720px);
  max-height: calc(100vh - 32px);
  padding: 30px;
  overflow: auto;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 22px;
  color: var(--dm-text);
  background: #fff;
  box-shadow: 0 34px 100px rgba(0, 0, 0, .4);
  transform: translate(-50%, -50%);
  pointer-events: auto;
}

.dm-consent-settings-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 22px;
  margin-bottom: 22px;
}

.dm-consent-kicker {
  display: block;
  margin-bottom: 8px;
  color: var(--dm-teal);
  font-size: .72rem;
  font-weight: 950;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.dm-consent-categories {
  display: grid;
  gap: 12px;
  margin: 24px 0;
}

.dm-consent-category {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 18px;
  border: 1px solid var(--dm-border);
  border-radius: 15px;
  background: #f8f9fc;
}

.dm-consent-category strong {
  display: block;
  margin-bottom: 4px;
  color: var(--dm-night);
  font-size: 1rem;
}

.dm-consent-category small {
  display: block;
  color: var(--dm-muted);
  font-size: .8rem;
  line-height: 1.5;
}

.dm-consent-required {
  padding: 7px 10px;
  border-radius: 999px;
  color: #05685f;
  background: #d9fff9;
  font-size: .7rem;
  font-weight: 950;
  white-space: nowrap;
}

.dm-consent-toggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}

.dm-consent-toggle input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.dm-consent-switch {
  position: relative;
  display: block;
  width: 52px;
  height: 30px;
  border: 2px solid #b8c1ce;
  border-radius: 999px;
  background: #e7eaf0;
  transition: background-color .18s ease, border-color .18s ease;
}

.dm-consent-switch::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 6px rgba(16, 29, 48, .24);
  transition: transform .18s ease;
}

.dm-consent-toggle input:checked + .dm-consent-switch {
  border-color: var(--dm-teal);
  background: var(--dm-teal);
}
.dm-consent-toggle input:checked + .dm-consent-switch::after { transform: translateX(22px); }
.dm-consent-toggle input:focus-visible + .dm-consent-switch {
  outline: 3px solid rgba(0, 169, 155, .3);
  outline-offset: 3px;
}

.dm-consent-settings-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding-top: 22px;
  border-top: 1px solid var(--dm-border);
}

.dm-consent-settings-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 9px;
}

.dm-footer-link-button {
  padding: 0;
  border: 0;
  color: #cbd5e3;
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.dm-footer-link-button:hover { color: #fff; }

@media (max-width: 980px) {
  .dm-consent-banner {
    grid-template-columns: 1fr 220px;
    gap: 20px;
  }
  .dm-consent-brand { grid-column: 1 / -1; }
}

@media (max-width: 680px) {
  .dm-consent-banner {
    right: 10px;
    bottom: max(10px, env(safe-area-inset-bottom));
    left: 10px;
    grid-template-columns: 1fr;
    width: calc(100% - 20px);
    max-height: calc(100vh - 20px);
    gap: 17px;
    padding: 20px;
    border-radius: 17px;
  }
  .dm-consent-brand { grid-column: auto; }
  .dm-consent-brand img { width: 46px; height: 46px; flex-basis: 46px; }
  .dm-consent-actions { grid-template-columns: 1fr; }
  .dm-consent-settings {
    width: calc(100% - 20px);
    max-height: calc(100vh - 20px);
    padding: 22px 18px;
    border-radius: 17px;
  }
  .dm-consent-category { grid-template-columns: 1fr; gap: 13px; }
  .dm-consent-required { width: max-content; }
  .dm-consent-settings-footer { align-items: stretch; flex-direction: column; }
  .dm-consent-settings-actions { display: grid; grid-template-columns: 1fr; }
}

/* Version 2.10: persönliche „Über mich“-Seite von Florian */
.dm-about-hero {
  position: relative;
  padding: 104px 0 98px;
  color: var(--dm-white);
  background: radial-gradient(circle at 82% 18%, rgba(0,194,178,.22), transparent 28%), radial-gradient(circle at 14% 88%, rgba(109,74,255,.27), transparent 34%), var(--dm-night);
  overflow: hidden;
}
.dm-about-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(to bottom,#000,transparent 96%);
}
.dm-about-hero-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1.12fr .68fr;
  gap: 72px;
  align-items: center;
}
.dm-about-hero h1 { max-width: 760px; color: var(--dm-white); font-size: clamp(3.3rem,7vw,6.5rem); }
.dm-about-hero h1 span { display: block; color: var(--dm-purple-bright); }
.dm-about-hero .dm-kicker { color: #bdfff8; }
.dm-about-hero .dm-lead { color: #c7d2df; }
.dm-about-hero-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px; }
.dm-about-portrait-card {
  position: relative;
  min-height: 410px;
  padding: 38px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 30px;
  background: linear-gradient(150deg, rgba(32,58,92,.97), rgba(17,31,50,.98));
  box-shadow: 0 36px 90px rgba(0,0,0,.34);
  overflow: hidden;
}
.dm-about-portrait-card::before { content: ""; position: absolute; right: -70px; bottom: -85px; width: 240px; height: 240px; border-radius: 50%; background: rgba(0,194,178,.15); }
.dm-about-portrait-card::after { content: ""; position: absolute; inset: 0 0 auto; height: 8px; background: linear-gradient(90deg,var(--dm-purple),var(--dm-teal),var(--dm-orange),var(--dm-yellow)); }
.dm-about-monogram {
  display: grid;
  place-items: center;
  width: 148px;
  height: 148px;
  margin-bottom: 40px;
  border-radius: 28px;
  color: var(--dm-white);
  background: linear-gradient(145deg,var(--dm-purple-bright),#4f2fc5);
  box-shadow: 18px 18px 0 rgba(0,194,178,.17);
  font-size: 5.2rem;
  font-weight: 950;
  line-height: 1;
  transform: rotate(-3deg);
}
.dm-about-card-label { margin: 0 0 8px; color: var(--dm-orange) !important; font-size: .75rem; font-weight: 950; letter-spacing: .15em; text-transform: uppercase; }
.dm-about-portrait-card > strong { display: block; color: var(--dm-white); font-size: 2rem; line-height: 1.1; letter-spacing: -.04em; }
.dm-about-portrait-card > span { display: block; margin-top: 10px; color: #b9c7d8; }
.dm-about-card-tags { position: relative; z-index: 2; display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.dm-about-card-tags b { padding: 7px 10px; border: 1px solid rgba(255,255,255,.16); border-radius: 8px; color: #edf4ff; background: rgba(255,255,255,.05); font-size: .72rem; }
.dm-about-content { padding: 94px 0 110px; background: var(--dm-paper); }
.dm-about-page .entry-content > * { max-width: none; }
.dm-about-article { padding: 58px; border: 1px solid var(--dm-border); border-radius: 30px; background: var(--dm-white); box-shadow: var(--dm-shadow); }
.dm-about-opening { display: grid; grid-template-columns: .42fr 1.58fr; gap: 46px; align-items: start; padding-bottom: 54px; border-bottom: 1px solid var(--dm-border); }
.dm-about-eyebrow { margin: 0 !important; color: var(--dm-purple) !important; font-size: clamp(1.4rem,3vw,2.3rem); font-weight: 950; line-height: 1.12; letter-spacing: -.04em; }
.dm-about-intro { margin: 0 !important; color: var(--dm-night) !important; font-size: clamp(1.2rem,2.3vw,1.65rem); font-weight: 730; line-height: 1.58; }
.dm-about-timeline { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin: 54px 0 74px; }
.dm-about-timeline article { display: flex; flex-direction: column; min-width: 0; min-height: 245px; padding: 24px; border-radius: 18px; background: var(--dm-purple-soft); }
.dm-about-timeline article:nth-child(2) { background: var(--dm-orange-soft); }
.dm-about-timeline article:nth-child(3) { background: #fff8dc; }
.dm-about-timeline article:nth-child(4) { background: #eafffc; }
.dm-about-timeline span { align-self: flex-start; padding: 6px 9px; border-radius: 7px; color: var(--dm-white); background: var(--dm-purple); font-size: .68rem; font-weight: 950; letter-spacing: .07em; text-transform: uppercase; }
.dm-about-timeline article:nth-child(2) span { background: var(--dm-orange); }
.dm-about-timeline article:nth-child(3) span { color: var(--dm-night); background: var(--dm-yellow); }
.dm-about-timeline article:nth-child(4) span { background: var(--dm-teal); }
.dm-about-timeline strong { display: block; margin-top: 30px; color: var(--dm-night); font-size: 1.08rem; line-height: 1.25; }
.dm-about-timeline p { margin: 10px 0 0; color: var(--dm-muted); font-size: .86rem; line-height: 1.58; }
.dm-about-section { max-width: 880px; margin: 0 auto; padding: 56px 0; border-top: 1px solid var(--dm-border); }
.dm-about-timeline + .dm-about-section { border-top: 0; }
.dm-about-section h2 { max-width: 760px; margin: 0 0 26px; font-size: clamp(2rem,4vw,3.5rem); }
.dm-about-section p { max-width: 830px; color: #344154; }
.dm-about-section--accent,
.dm-about-section--teal,
.dm-about-section--purple { max-width: none; margin: 26px 0; padding: 48px; border: 0; border-radius: 24px; }
.dm-about-section--accent { background: var(--dm-orange-soft); }
.dm-about-section--teal { background: #eafffc; }
.dm-about-section--purple { background: var(--dm-purple-soft); }
.dm-about-section--accent h2,
.dm-about-section--teal h2,
.dm-about-section--purple h2,
.dm-about-section--accent p,
.dm-about-section--teal p,
.dm-about-section--purple p { max-width: 840px; margin-left: auto; margin-right: auto; }
.dm-about-quote { max-width: 930px !important; margin: 38px auto !important; padding: 38px 42px !important; border: 0 !important; border-radius: 22px !important; color: var(--dm-white) !important; background: linear-gradient(135deg,var(--dm-purple),#3c2295) !important; box-shadow: 0 18px 46px rgba(77,44,193,.22); }
.dm-about-quote p { margin: 0 !important; color: var(--dm-white) !important; font-size: clamp(1.35rem,2.8vw,2.1rem); font-weight: 850; line-height: 1.42; }
.dm-about-closing { position: relative; margin-top: 38px; padding: 56px; border-radius: 26px; color: var(--dm-white); background: var(--dm-night); overflow: hidden; }
.dm-about-closing::after { content: "MUT"; position: absolute; right: -12px; bottom: -44px; color: rgba(255,255,255,.055); font-size: 11rem; font-weight: 950; line-height: 1; }
.dm-about-closing > * { position: relative; z-index: 2; max-width: 820px; }
.dm-about-closing-kicker { margin: 0 0 10px !important; color: #bdfff8 !important; font-size: .75rem; font-weight: 950; letter-spacing: .15em; text-transform: uppercase; }
.entry-content .dm-about-closing h2 { margin: 0 0 24px !important; color: var(--dm-white); }
.dm-about-closing p { color: #d0d9e6; }
.dm-about-closing p:last-child { margin-bottom: 0; color: var(--dm-white); font-size: 1.2rem; }
.dm-about-medical-note { max-width: 880px !important; margin: 28px auto 0 !important; padding: 20px 22px; border-left: 6px solid var(--dm-yellow); border-radius: 0 14px 14px 0; color: #465164 !important; background: #fff9df; font-size: .86rem; }

@media (max-width: 980px) {
  .dm-about-hero-grid { grid-template-columns: 1fr; }
  .dm-about-portrait-card { max-width: 620px; min-height: 360px; }
  .dm-about-timeline { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .dm-about-opening { grid-template-columns: 1fr; gap: 16px; }
}

@media (max-width: 680px) {
  .dm-about-hero { padding: 76px 0 72px; }
  .dm-about-hero-actions { align-items: stretch; flex-direction: column; }
  .dm-about-portrait-card { min-height: 0; padding: 28px; }
  .dm-about-monogram { width: 118px; height: 118px; margin-bottom: 34px; font-size: 4rem; }
  .dm-about-content { padding: 54px 0 76px; }
  .dm-about-article { padding: 25px 20px; border-radius: 22px; }
  .dm-about-timeline { grid-template-columns: 1fr; margin: 38px 0 48px; }
  .dm-about-timeline article { min-height: 0; }
  .dm-about-section { padding: 42px 0; }
  .dm-about-section--accent,
  .dm-about-section--teal,
  .dm-about-section--purple { margin: 14px 0; padding: 30px 22px; }
  .dm-about-quote { padding: 28px 24px !important; }
  .dm-about-closing { padding: 36px 24px; }
}

/* Version 2.17: dezenter, aber weiterhin erkennbarer MVZ-Link. */
.dm-about-mvz-link {
  display: inline;
  padding: .02em .12em;
  border-radius: .24em;
  color: var(--dm-ink);
  background: rgba(109,74,255,.075);
  font-weight: inherit;
  text-decoration: none;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  transition: color .18s ease, background-color .18s ease;
}
.dm-about-mvz-link:visited { color: var(--dm-ink); }
.dm-about-mvz-link:hover {
  color: var(--dm-night);
  background: var(--dm-purple-soft);
}
.dm-about-mvz-link:focus-visible {
  color: var(--dm-night);
  background: var(--dm-purple-soft);
  outline: 2px solid var(--dm-purple);
  outline-offset: 3px;
}