/* ==========================================================================
   Mix-Stil für die übrigen Seiten – CI 2026 (seit 28.09.2026, Etappe 2)
   Gleiche Sprache wie ci-unterseiten.css (Landingpages): Navy/Creme-Bänder,
   Kontur + harter Schatten (teal auf Navy, navy auf Creme, gelb nur für Preise),
   Sticker-Kicker, Mono-Nummern, max. 2 Handschrift-Notizen je Seite.
   Regeln: Gelb nie als Text auf Hell · Radien einheitlich · keine Emoji-Icons.
   ========================================================================== */

body.sd-ci {
	--m-navy: var(--sd-navy, #031E36);
	--m-cream: var(--sd-cream, #FFF5E0);
	--m-yellow: var(--sd-yellow, #F5C518);
	--m-teal: var(--sd-teal, #00A896);
	--m-teal-dark: #00766A;
	--m-ink: rgba(3, 30, 54, .78);
}

/* ── Gemeinsame Bausteine ── */

/* Hero-Kicker als gelber Sticker */
body.sd-ci :is(.sd-page--leistungen, .sd-page--kontakt) .sd-hero__eyebrow,
body.sd-ci .sd-um-hero .sd-um-eyebrow {
	display: inline-block; font-family: var(--sd-font-mono, monospace) !important; font-size: .74rem !important; font-weight: 600 !important;
	letter-spacing: .06em !important; text-transform: uppercase; color: var(--m-navy) !important; background: var(--m-yellow);
	padding: .45rem .8rem; border: 2px solid var(--m-navy); border-radius: 10px; box-shadow: 4px 4px 0 rgba(0, 0, 0, .35);
	transform: rotate(-1.5deg); margin: 0 0 1.4rem !important;
}

/* Hero-Hintergrund: Foto als Navy-Duoton, Text bleibt auf fast vollem Navy */
body.sd-ci .sd-leist-hero {
	background:
		linear-gradient(90deg, var(--m-navy) 0%, rgba(3, 30, 54, .96) 40%, rgba(3, 30, 54, .74) 100%),
		url('../images/bg-skizze.webp') right center / cover no-repeat, var(--m-navy) !important;
}
body.sd-ci .sd-contact-hero {
	background:
		linear-gradient(90deg, var(--m-navy) 0%, rgba(3, 30, 54, .96) 40%, rgba(3, 30, 54, .74) 100%),
		url('../images/bg-schreibtisch.webp') right center / cover no-repeat, var(--m-navy) !important;
}
@media (max-width: 600px) {
	body.sd-ci :is(.sd-leist-hero, .sd-contact-hero) { background-position: 0 0, center top !important; }
	body.sd-ci :is(.sd-leist-hero, .sd-contact-hero) { background-image:
		linear-gradient(180deg, rgba(3, 30, 54, .82) 0%, rgba(3, 30, 54, .94) 60%, var(--m-navy) 100%),
		var(--m-hero-img, none) !important; }
	body.sd-ci .sd-leist-hero { --m-hero-img: url('../images/bg-skizze.webp'); }
	body.sd-ci .sd-contact-hero { --m-hero-img: url('../images/bg-schreibtisch.webp'); }
}

/* Überschriften: ausgeglichene Zeilen */
body.sd-ci :is(.sd-leist-hero__title, .sd-contact-hero__title, .sd-um-h1, .sd-um-h2, .sd-leist-pricing__title) { text-wrap: balance; }

/* Handschrift-Notiz (Caveat „SD Hand“, in ci-unterseiten.css geladen) */
body.sd-ci .m-hand {
	font-family: 'SD Hand', cursive; font-weight: 700; line-height: 1; color: var(--m-yellow); white-space: nowrap; pointer-events: none; }

/* ==========================================================================
   Leistungen
   ========================================================================== */
body.sd-ci .sd-leist-hero__title { line-height: 1.12 !important; }

/* Karten-Band in Creme */
body.sd-ci .sd-leist-grid-section { background: var(--m-cream) !important; border-top: 3px solid var(--m-navy); border-bottom: 3px solid var(--m-navy); }
body.sd-ci .sd-leist-grid { counter-reset: mkarte; }
body.sd-ci .sd-leist-card {
	position: relative; counter-increment: mkarte; padding-top: 2.6rem !important;
	background: #fff !important; border: 2px solid var(--m-navy) !important; border-radius: 18px !important;
	box-shadow: 6px 6px 0 var(--m-navy); transition: transform .2s, box-shadow .2s !important; }
body.sd-ci .sd-leist-card:hover { transform: translate(-2px, -2px) !important; box-shadow: 8px 8px 0 var(--m-navy); border-color: var(--m-navy) !important; }
body.sd-ci .sd-leist-card::before {
	content: counter(mkarte, decimal-leading-zero); position: absolute; top: -13px; left: 18px;
	font-family: var(--sd-font-mono, monospace); font-size: .72rem; font-weight: 700; letter-spacing: .04em;
	background: var(--m-yellow); color: var(--m-navy); border: 2px solid var(--m-navy); border-radius: 8px; padding: .2rem .55rem; }
body.sd-ci .sd-leist-card__icon { display: none !important; }
body.sd-ci .sd-leist-card__title { color: var(--m-navy) !important; }
body.sd-ci :is(.sd-leist-card__text, .sd-leist-card__list li) { color: var(--m-ink) !important; }
body.sd-ci .sd-leist-card__list li strong { color: var(--m-navy); }
body.sd-ci .sd-leist-card__list li::before { color: var(--m-teal-dark) !important; }
body.sd-ci .sd-leist-card__cta { color: var(--m-navy) !important; font-weight: 800 !important; text-decoration: underline; text-decoration-color: var(--m-teal); text-underline-offset: 4px; text-decoration-thickness: 2px; }
body.sd-ci .sd-leist-card__sub { color: var(--m-ink) !important; }
body.sd-ci .sd-leist-card__sub a { color: var(--m-navy) !important; font-weight: 700; }

/* Preis-Box: gelb mit Kontur + Sticker, einzige gelbe Fläche der Seite */
body.sd-ci .sd-leist-pricing__box {
	position: relative; background: var(--m-yellow) !important; border: 2px solid var(--m-navy) !important; border-radius: 20px !important;
	box-shadow: 10px 10px 0 rgba(0, 0, 0, .35); }
body.sd-ci .sd-leist-pricing__box::before {
	content: 'Stundensätze · § 19 UStG'; position: absolute; top: -16px; right: 24px; transform: rotate(2deg);
	font-family: var(--sd-font-mono, monospace); font-size: .72rem; font-weight: 700; letter-spacing: .04em;
	background: var(--m-cream); color: var(--m-navy); border: 2px solid var(--m-navy); border-radius: 8px; padding: .3rem .65rem;
	box-shadow: 3px 3px 0 var(--m-navy); }
body.sd-ci .sd-leist-pricing__box::after {
	content: 'fair, versprochen!'; position: absolute; right: 40px; bottom: -40px; transform: rotate(-5deg);
	font-family: 'SD Hand', cursive; font-weight: 700; font-size: 1.9rem; line-height: 1; color: var(--m-yellow);
	text-shadow: 0 2px 0 var(--m-navy); white-space: nowrap; pointer-events: none; }
body.sd-ci .sd-leist-pricing__title { color: var(--m-navy) !important; }
body.sd-ci .sd-leist-pricing__text { color: rgba(3, 30, 54, .85) !important; }
body.sd-ci .sd-leist-pricing__text strong { color: var(--m-navy) !important; }
body.sd-ci .sd-leist-pricing__portrait { border: 2px solid var(--m-navy) !important; }
body.sd-ci .sd-leist-pricing__box .sd-btn--primary { background: var(--m-navy) !important; color: var(--m-cream) !important; border: 2px solid var(--m-navy) !important; }
body.sd-ci .sd-leist-pricing { padding-bottom: 6rem !important; }
@media (max-width: 600px) {
	body.sd-ci .sd-leist-card { box-shadow: 4px 4px 0 var(--m-navy); }
	body.sd-ci .sd-leist-pricing__box { padding: 2.6rem 1.4rem 2rem !important; box-shadow: 6px 6px 0 rgba(0, 0, 0, .35); }
	body.sd-ci .sd-leist-pricing__box::before { right: 12px; }
	body.sd-ci .sd-leist-pricing__box::after { right: 24px; bottom: -34px; font-size: 1.6rem; }
}

/* ==========================================================================
   Kontakt
   ========================================================================== */
body.sd-ci .sd-contact-form-wrap {
	position: relative; border: 2px solid var(--m-cream) !important; border-radius: 20px !important;
	box-shadow: 10px 10px 0 var(--m-teal) !important; background: rgba(255, 255, 255, .04) !important; }
body.sd-ci .sd-contact-form-wrap__title::after {
	content: 'les ich selbst!'; display: inline-block; margin-left: .7rem; transform: rotate(-4deg) translateY(-2px);
	font-family: 'SD Hand', cursive; font-weight: 700; font-size: 1.5rem; line-height: 1; color: var(--m-yellow); white-space: nowrap; }
body.sd-ci .sd-contact-form-wrap :is(.sd-form__input, .sd-form__select, .sd-form__textarea, textarea) {
	border: 2px solid rgba(255, 245, 224, .55) !important; border-radius: 10px !important; }
body.sd-ci .sd-contact-form-wrap :is(.sd-form__input, .sd-form__select, textarea):focus {
	border-color: var(--m-yellow) !important; outline: none; box-shadow: 3px 3px 0 var(--m-yellow) !important; }
body.sd-ci .sd-contact-form-wrap .sd-btn--primary { border: 2px solid var(--m-navy) !important; box-shadow: 4px 4px 0 rgba(0, 0, 0, .35); }
body.sd-ci .sd-contact-info__item {
	border: 2px solid var(--m-cream) !important; border-radius: 14px !important; box-shadow: 5px 5px 0 var(--m-teal) !important;
	background: rgba(255, 255, 255, .04) !important; }
body.sd-ci .sd-contact-info__label { font-family: var(--sd-font-mono, monospace) !important; letter-spacing: .05em; }
body.sd-ci .sd-contact-byline__img { border: 2px solid var(--m-cream); box-shadow: 3px 3px 0 var(--m-teal); border-radius: 50%; }
@media (max-width: 600px) {
	body.sd-ci .sd-contact-form-wrap { box-shadow: 6px 6px 0 var(--m-teal) !important; }
	body.sd-ci .sd-contact-info__item { box-shadow: 4px 4px 0 var(--m-teal) !important; }
}

/* ==========================================================================
   Über mich
   ========================================================================== */
/* Portrait mit Kontur + Teal-Schatten */
body.sd-ci .sd-um-hero__portrait img { border: 3px solid var(--m-cream); border-radius: 50%; box-shadow: 10px 10px 0 var(--m-teal); }

/* Abschnitts-Kicker: Mono */
body.sd-ci .sd-um-eyebrow--center { font-family: var(--sd-font-mono, monospace) !important; letter-spacing: .08em !important; }

/* Zitat: Kontur-Karte */
body.sd-ci .sd-um-quote {
	border: 2px solid var(--m-cream) !important; border-radius: 18px !important; box-shadow: 6px 6px 0 var(--m-teal);
	background: rgba(255, 255, 255, .04) !important; padding: 1.4rem 1.6rem !important; }

/* „Was ich kann“ als Creme-Band mit weißen Kontur-Karten */
body.sd-ci .sd-um-skills { background: var(--m-cream) !important; border-top: 3px solid var(--m-navy); border-bottom: 3px solid var(--m-navy); }
body.sd-ci .sd-um-skills :is(.sd-um-h2, .sd-um-h2 em) { color: var(--m-navy) !important; }
body.sd-ci .sd-um-skills :is(.sd-um-text, .sd-um-eyebrow) { color: var(--m-ink) !important; }
body.sd-ci .sd-um-skills__grid { counter-reset: mskill; }
body.sd-ci .sd-um-skill {
	position: relative; counter-increment: mskill; padding-top: 2.4rem !important;
	background: #fff !important; border: 2px solid var(--m-navy) !important; border-radius: 18px !important; box-shadow: 6px 6px 0 var(--m-navy); }
body.sd-ci .sd-um-skill::before {
	content: counter(mskill, decimal-leading-zero); position: absolute; top: -13px; left: 18px;
	font-family: var(--sd-font-mono, monospace); font-size: .72rem; font-weight: 700; letter-spacing: .04em;
	background: var(--m-yellow); color: var(--m-navy); border: 2px solid var(--m-navy); border-radius: 8px; padding: .2rem .55rem; }
body.sd-ci .sd-um-skill__icon { display: none !important; }
body.sd-ci .sd-um-skill h3 { color: var(--m-navy) !important; }
body.sd-ci .sd-um-skill p { color: var(--m-ink) !important; }
body.sd-ci .sd-um-cert {
	font-family: var(--sd-font-mono, monospace) !important; font-size: .74rem !important; background: #fff !important; color: var(--m-navy) !important;
	border: 2px solid var(--m-navy) !important; border-radius: 8px !important; box-shadow: 3px 3px 0 var(--m-navy); }

/* Werte: Kontur-Karten auf Navy, Nummer als Sticker */
body.sd-ci .sd-um-wert {
	position: relative; border: 2px solid var(--m-cream) !important; border-radius: 18px !important; box-shadow: 6px 6px 0 var(--m-teal);
	background: rgba(255, 255, 255, .04) !important; }
body.sd-ci .sd-um-wert__num {
	display: inline-block; font-family: var(--sd-font-mono, monospace) !important; font-size: .78rem !important; font-weight: 700 !important;
	background: var(--m-yellow); color: var(--m-navy) !important; border: 2px solid var(--m-navy); border-radius: 8px; padding: .2rem .55rem; line-height: 1.3 !important; }

/* Zeitstrahl: Jahreszahlen in Mono, aktueller Punkt als Sticker */
body.sd-ci .sd-um-tl__year { font-family: var(--sd-font-mono, monospace) !important; letter-spacing: .03em; }
body.sd-ci .sd-um-tl--current .sd-um-tl__year {
	display: inline-block; background: var(--m-yellow); color: var(--m-navy) !important; border: 2px solid var(--m-navy); border-radius: 8px; padding: .1rem .5rem; }

/* Buttons wie auf den Landingpages */
body.sd-ci .sd-um-btn--primary { border: 2px solid var(--m-navy) !important; box-shadow: 4px 4px 0 rgba(0, 0, 0, .35); }
body.sd-ci .sd-um-btn--ghost { border: 2px solid rgba(255, 245, 224, .7) !important; }

@media (max-width: 600px) {
	body.sd-ci .sd-um-hero__portrait img { box-shadow: 6px 6px 0 var(--m-teal); }
	body.sd-ci :is(.sd-um-skill, .sd-um-wert) { box-shadow: 4px 4px 0 var(--m-navy); }
	body.sd-ci .sd-um-wert { box-shadow: 4px 4px 0 var(--m-teal); }
}
@media (prefers-reduced-motion: reduce) {
	body.sd-ci .sd-leist-card { transition: none !important; }
}

/* ==========================================================================
   Unterer Seitenteil (ganze Website, 28.09.2026, Basti: „unteren Teil spannender und schöner")
   Tauchgang-Leiste als Ticket mit Wellenkante, persönlicher Abschluss „Servus aus …“, Footer mit Kontur-Details
   ========================================================================== */

/* Tauchgang-Leiste: Ticket mit gestrichelter Kontur und Stanzkerben, Wellenkante nach unten */
body.sd-ci .sf-tg-bar { position: relative; padding: 26px 24px 30px !important; }
body.sd-ci .sf-tg-bar__inner {
	position: relative; border: 2px dashed var(--m-navy); border-radius: 18px; padding: 16px 28px;
	background: rgba(255, 255, 255, .18); }
body.sd-ci .sf-tg-bar__inner::before,
body.sd-ci .sf-tg-bar__inner::after {
	content: ''; position: absolute; top: 50%; width: 22px; height: 22px; margin-top: -11px; border-radius: 50%;
	background: var(--m-yellow); border: 2px dashed var(--m-navy); }
body.sd-ci .sf-tg-bar__inner::before { left: -12px; clip-path: inset(0 0 0 50%); }
body.sd-ci .sf-tg-bar__inner::after { right: -12px; clip-path: inset(0 50% 0 0); }
body.sd-ci .sf-tg-bar__pre {
	align-self: flex-start; font-family: var(--sd-font-mono, monospace) !important; opacity: 1 !important; letter-spacing: .06em !important;
	background: var(--m-navy); color: var(--m-yellow); border-radius: 6px; padding: .15rem .5rem; margin-bottom: .35rem; }
body.sd-ci .sf-tg-bar__sub { font-family: var(--sd-font-mono, monospace) !important; font-size: .76rem !important; opacity: .9 !important; }
body.sd-ci .sf-tg-bar__btn { border: 2px solid var(--m-navy) !important; box-shadow: 4px 4px 0 rgba(3, 30, 54, .35); }
body.sd-ci .sf-tg-bar::after {
	content: ''; position: absolute; left: 0; right: 0; bottom: -17px; height: 18px; pointer-events: none; z-index: 1;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='18' viewBox='0 0 120 18'%3E%3Cpath d='M0 0h120v6c-15 0-15 12-30 12S75 6 60 6 45 18 30 18 15 6 0 6z' fill='%23F5C518'/%3E%3C/svg%3E") repeat-x;
	background-size: 120px 18px; }

/* Persönlicher Abschluss über den Footer-Spalten */
body.sd-ci .site-footer { padding-top: 5rem !important; border-top: 0 !important; }
body.sd-ci .sf-hello {
	max-width: 1200px; margin: 0 auto 3.5rem; padding-bottom: 2.5rem; border-bottom: 2px dashed rgba(255, 245, 224, .18); }
body.sd-ci .sf-hello__title {
	font-family: var(--sd-font-head, 'Fraunces', serif); font-weight: 800; font-size: clamp(2rem, 5.2vw, 3.8rem); line-height: 1.08;
	color: var(--m-cream); margin: 0 0 .8rem; text-wrap: balance; letter-spacing: -.01em; }
body.sd-ci .sf-hello__title span { color: var(--m-yellow); font-style: italic; }
body.sd-ci .sf-hello__text { color: rgba(255, 255, 255, .72); font-size: 1.02rem; margin: 0 0 1.5rem; max-width: 560px; }
body.sd-ci .sf-hello__links { display: flex; flex-wrap: wrap; gap: .8rem; margin: 0; }
body.sd-ci .sf-hello__links a {
	font-family: var(--sd-font-mono, monospace); font-size: .82rem; font-weight: 600; color: var(--m-cream); text-decoration: none;
	border: 2px solid var(--m-cream); border-radius: 999px; padding: .55rem 1rem; box-shadow: 4px 4px 0 var(--m-teal);
	transition: transform .2s, box-shadow .2s; }
body.sd-ci .sf-hello__links a:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--m-teal); }
body.sd-ci .sf-hello__links a:focus-visible { outline: 3px solid var(--m-yellow); outline-offset: 3px; }

/* Footer-Spalten: Mono-Überschriften in Gelb, Links mit Teal-Unterstrich beim Hover */
body.sd-ci .sf-nav-heading { font-family: var(--sd-font-mono, monospace) !important; color: var(--m-yellow) !important; opacity: 1 !important; }
body.sd-ci .sf-link { text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 4px; text-decoration-thickness: 2px; transition: text-decoration-color .2s, color .2s; }
body.sd-ci .sf-link:hover { text-decoration-color: var(--m-teal); color: #fff !important; }
body.sd-ci .sf-logo img { border: 2px solid var(--m-cream); border-radius: 50%; box-shadow: 3px 3px 0 var(--m-teal); }
body.sd-ci .sf-bottom { border-top: 2px dashed rgba(255, 245, 224, .12) !important; color: rgba(255, 255, 255, .55) !important; }
body.sd-ci .sf-bottom-links a { color: rgba(255, 255, 255, .6) !important; }

@media (max-width: 600px) {
	body.sd-ci .sf-tg-bar { padding: 20px 16px 26px !important; }
	body.sd-ci .sf-tg-bar__inner { padding: 16px 18px; }
	body.sd-ci .sf-tg-bar__btn { width: 100%; text-align: center; }
	body.sd-ci .site-footer { padding-top: 4rem !important; }
	body.sd-ci .sf-hello { margin-bottom: 2.5rem; }
	body.sd-ci .sf-hello__links a { box-shadow: 3px 3px 0 var(--m-teal); }
}
@media (prefers-reduced-motion: reduce) {
	body.sd-ci .sf-hello__links a { transition: none; }
}

/* ── Seitenende der Unterseiten ── */

/* Landingpages: Faktenleiste als Creme-Band mit leicht gedrehten Stickern */
body.sd-ci :is(.sd-page--stadt, .sd-page--webdesign) .sd-trust {
	background: var(--m-cream) !important; border-top: 3px solid var(--m-navy); border-bottom: 3px solid var(--m-navy); padding: 2.6rem 0 !important; }
body.sd-ci :is(.sd-page--stadt, .sd-page--webdesign) .sd-trust-grid > li {
	background: #fff !important; border: 2px solid var(--m-navy) !important; box-shadow: 4px 4px 0 var(--m-navy) !important; }
body.sd-ci :is(.sd-page--stadt, .sd-page--webdesign) .sd-trust-grid > li:nth-child(odd) { transform: rotate(-1deg); }
body.sd-ci :is(.sd-page--stadt, .sd-page--webdesign) .sd-trust-grid > li:nth-child(even) { transform: rotate(1deg); }
body.sd-ci :is(.sd-page--stadt, .sd-page--webdesign) .sd-trust-grid > li strong { color: var(--m-navy) !important; }
body.sd-ci :is(.sd-page--stadt, .sd-page--webdesign) .sd-trust-grid > li span:not(.sd-trust-ico) { color: var(--m-ink) !important; }

/* Tauchgang-Hinweis mit Kursbild rechts (Navy-Verlauf, Text bleibt lesbar) */
body.sd-ci .sd-tg-hook { padding-top: 4rem !important; }
body.sd-ci .sd-tg-hook__box {
	background:
		linear-gradient(90deg, #0b2a44 0%, rgba(11, 42, 68, .97) 45%, rgba(11, 42, 68, .55) 100%),
		url('/wp-content/uploads/tauchgang/tauchgang-kurs.webp') right center / cover no-repeat, #0b2a44 !important; }
@media (max-width: 600px) {
	body.sd-ci .sd-tg-hook__box { background: linear-gradient(180deg, rgba(11, 42, 68, .8) 0%, rgba(11, 42, 68, .97) 45%), url('/wp-content/uploads/tauchgang/tauchgang-kurs.webp') center top / cover no-repeat, #0b2a44 !important; }
	body.sd-ci :is(.sd-page--stadt, .sd-page--webdesign) .sd-trust-grid > li { transform: none !important; }
}

/* Über mich: Abschluss „Lass uns reden.“ als Creme-Bühne */
body.sd-ci .sd-um-cta { background: var(--m-cream) !important; border-top: 3px solid var(--m-navy); }
body.sd-ci .sd-um-cta .sd-um-h2 { color: var(--m-navy) !important; }
body.sd-ci .sd-um-cta .sd-um-text { color: var(--m-ink) !important; }
body.sd-ci .sd-um-cta .sd-um-btn--ghost { color: var(--m-navy) !important; border-color: var(--m-navy) !important; background: #fff !important; box-shadow: 4px 4px 0 var(--m-navy); }
body.sd-ci .sd-um-cta .sd-um-h2::after {
	content: 'ich freu mich!'; display: block; margin-top: .3rem; transform: rotate(-3deg);
	font-family: 'SD Hand', cursive; font-weight: 700; font-size: 1.7rem; line-height: 1; color: var(--m-teal-dark); }
/* Über mich: Jahreszahlen wieder in Textschrift (Mono war zu breit), Kontaktformular mit Innenabstand */
body.sd-ci .sd-um-tl__year { font-family: inherit !important; }
body.sd-ci .sd-contact-form-wrap { padding: 2rem !important; }
@media (max-width: 600px) { body.sd-ci .sd-contact-form-wrap { padding: 1.4rem !important; } }
body.sd-ci .sd-leist-hero { padding-top: 7.5rem !important; }
/* Abschluss-Block: am Desktop linksbündig, am Handy komplett zentriert; Ticket-Kerben am Handy aus */
body.sd-ci .sf-hello, body.sd-ci .sf-hello__text { text-align: left; margin-left: 0; }
body.sd-ci .sf-hello { margin-left: auto; margin-right: auto; }
@media (max-width: 600px) {
	body.sd-ci .sf-hello, body.sd-ci .sf-hello__text { text-align: center; margin-left: auto; margin-right: auto; }
	body.sd-ci .sf-hello__links { justify-content: center; }
	body.sd-ci .sf-tg-bar__inner::before, body.sd-ci .sf-tg-bar__inner::after { display: none; }
}

/* ==========================================================================
   Etappe 2c: Blog, Beiträge, Rechtsseiten, Tauchgang-Seite (28.09.2026)
   ========================================================================== */

/* ── Blog-Übersicht ── */
body.sd-ci .blog-hero {
	background: linear-gradient(90deg, var(--m-navy) 0%, rgba(3, 30, 54, .96) 40%, rgba(3, 30, 54, .74) 100%),
		url('../images/bg-schreibtisch.webp') right center / cover no-repeat, var(--m-navy) !important; }
body.sd-ci .blog-eyebrow {
	display: inline-block; font-family: var(--sd-font-mono, monospace) !important; font-size: .74rem !important; letter-spacing: .06em !important;
	color: var(--m-navy) !important; background: var(--m-yellow); padding: .45rem .8rem; border: 2px solid var(--m-navy); border-radius: 10px;
	box-shadow: 4px 4px 0 rgba(0, 0, 0, .35); transform: rotate(-1.5deg); }
body.sd-ci .blog-title { text-wrap: balance; }
body.sd-ci .blog-topic {
	font-family: var(--sd-font-mono, monospace) !important; font-size: .74rem !important; background: transparent !important;
	border: 2px solid var(--m-cream) !important; color: var(--m-cream) !important; border-radius: 8px !important; box-shadow: 3px 3px 0 var(--m-teal); }
body.sd-ci .blog-grid-section { background: var(--m-cream) !important; border-top: 3px solid var(--m-navy); border-bottom: 3px solid var(--m-navy); }
body.sd-ci .blog-card {
	background: #fff !important; border: 2px solid var(--m-navy) !important; border-radius: 18px !important; box-shadow: 6px 6px 0 var(--m-navy) !important; }
body.sd-ci .blog-card:hover { transform: translate(-2px, -2px) !important; box-shadow: 8px 8px 0 var(--m-navy) !important; }
body.sd-ci .blog-card__img-wrap { border-bottom: 2px solid var(--m-navy); }
body.sd-ci .blog-card__cat-badge {
	font-family: var(--sd-font-mono, monospace) !important; background: var(--m-yellow) !important; color: var(--m-navy) !important; backdrop-filter: none !important;
	border: 2px solid var(--m-navy) !important; border-radius: 8px !important; }
body.sd-ci .blog-card__featured-badge {
	font-family: var(--sd-font-mono, monospace) !important; background: var(--m-cream) !important; color: var(--m-navy) !important;
	border: 2px solid var(--m-navy) !important; border-radius: 8px !important; box-shadow: 3px 3px 0 var(--m-navy); }
body.sd-ci .blog-card__title, body.sd-ci .blog-card__title a { color: var(--m-navy) !important; }
body.sd-ci :is(.blog-card__excerpt, .blog-card__meta) { color: var(--m-ink) !important; }
body.sd-ci .blog-card__link { color: var(--m-navy) !important; font-weight: 800 !important; text-decoration: underline; text-decoration-color: var(--m-teal); text-underline-offset: 4px; text-decoration-thickness: 2px; }
body.sd-ci .blog-pagination .page-numbers {
	color: var(--m-navy) !important; background: #fff !important; border: 2px solid var(--m-navy) !important; border-radius: 10px !important; box-shadow: 3px 3px 0 var(--m-navy); }
body.sd-ci .blog-pagination .page-numbers.current { background: var(--m-yellow) !important; }
body.sd-ci .blog-cta { background: transparent !important; border: 0 !important; padding: 0 1rem !important; }
body.sd-ci .blog-cta__row {
	background: var(--m-cream) !important; border: 2px solid var(--m-cream) !important; border-radius: 20px !important; box-shadow: 10px 10px 0 var(--m-teal) !important; }
body.sd-ci .blog-cta__eyebrow { font-family: var(--sd-font-mono, monospace) !important; color: var(--m-teal-dark) !important; }
body.sd-ci .blog-cta__title { color: var(--m-navy) !important; }
body.sd-ci :is(.blog-cta__text, .blog-cta__note) { color: var(--m-ink) !important; }
body.sd-ci .blog-cta__btn { border: 2px solid var(--m-navy) !important; box-shadow: 4px 4px 0 var(--m-navy) !important; }

/* ── Einzelner Beitrag ── */
body.sd-ci .post-cat-badge {
	display: inline-block; font-family: var(--sd-font-mono, monospace) !important; font-size: .74rem !important; color: var(--m-navy) !important;
	background: var(--m-yellow) !important; border: 2px solid var(--m-navy) !important; border-radius: 10px !important; box-shadow: 4px 4px 0 rgba(0, 0, 0, .35); transform: rotate(-1.5deg); }
body.sd-ci .post-title { text-wrap: balance; }
body.sd-ci .post-hero-img__img { border: 2px solid var(--m-cream) !important; border-radius: 20px !important; box-shadow: 10px 10px 0 var(--m-teal) !important; }
body.sd-ci .post-share__btn { border: 2px solid var(--m-cream) !important; border-radius: 999px !important; box-shadow: 3px 3px 0 var(--m-teal) !important; }
body.sd-ci .post-author-box__inner {
	border: 2px solid var(--m-cream) !important; border-radius: 18px !important; box-shadow: 6px 6px 0 var(--m-teal) !important; background: rgba(255, 255, 255, .04) !important; }
body.sd-ci .post-author-box__img { border: 2px solid var(--m-cream); border-radius: 50%; }
body.sd-ci .post-nav__item {
	border: 2px solid var(--m-cream) !important; border-radius: 14px !important; box-shadow: 4px 4px 0 var(--m-teal) !important; background: rgba(255, 255, 255, .04) !important; }
body.sd-ci .post-nav__dir { font-family: var(--sd-font-mono, monospace) !important; }
body.sd-ci .post-content blockquote { border-left: 4px solid var(--m-yellow) !important; padding-left: 1.2rem !important; }
@media (max-width: 600px) {
	body.sd-ci .post-hero-img__img { box-shadow: 6px 6px 0 var(--m-teal) !important; }
	body.sd-ci .blog-card { box-shadow: 4px 4px 0 var(--m-navy) !important; }
	body.sd-ci .blog-cta__row { box-shadow: 6px 6px 0 var(--m-teal) !important; }
}

/* ── Rechtsseiten & einfache Seiten: Titel mit gelber Marke, Kicker als Sticker ── */
body.sd-ci:not(.sensei) :is(.sd-static-page__title, .sd-page-header__title)::before {
	content: ''; display: block; width: 46px; height: 10px; margin: 0 0 1rem; background: var(--m-yellow); border: 2px solid var(--m-cream); border-radius: 6px; }
body.sd-ci:not(.sensei) .sd-static-page .kicker {
	display: inline-block; font-family: var(--sd-font-mono, monospace) !important; font-size: .74rem !important; color: var(--m-navy) !important;
	background: var(--m-yellow); border: 2px solid var(--m-navy); border-radius: 10px; padding: .35rem .7rem; }
body.sd-ci .sd-breadcrumb { font-family: var(--sd-font-mono, monospace); font-size: .76rem; }

/* ── Tauchgang-Seite ── */
body.sd-ci .sd-page--tauchgang .tg-badge {
	font-family: var(--sd-font-mono, monospace) !important; font-size: .74rem !important; color: var(--m-navy) !important; background: var(--m-yellow) !important;
	border: 2px solid var(--m-navy) !important; border-radius: 10px !important; box-shadow: 4px 4px 0 rgba(0, 0, 0, .35); transform: rotate(-1.5deg); }
body.sd-ci .sd-page--tauchgang .tg-badge__dot { background: var(--m-navy) !important; }
body.sd-ci .sd-page--tauchgang .tg-hero__title { text-wrap: balance; }
/* Module: Kontur-Karten mit Nummern-Sticker */
body.sd-ci .tg-module-item {
	border: 2px solid var(--m-cream) !important; border-radius: 16px !important; box-shadow: 5px 5px 0 var(--m-teal); background: rgba(255, 255, 255, .04) !important;
	transition: transform .2s, box-shadow .2s !important; }
body.sd-ci .tg-module-item:hover { transform: translate(-2px, -2px); box-shadow: 7px 7px 0 var(--m-teal); }
body.sd-ci .tg-module-item__num {
	font-family: var(--sd-font-mono, monospace) !important; font-size: .8rem !important; color: var(--m-navy) !important; background: var(--m-yellow);
	border: 2px solid var(--m-navy); border-radius: 8px; width: auto !important; height: fit-content; padding: .2rem .5rem !important; line-height: 1.3 !important; }
/* „Für dich, wenn …“ als Creme-Band */
body.sd-ci .tg-section--for-whom { background: var(--m-cream) !important; border-top: 3px solid var(--m-navy); border-bottom: 3px solid var(--m-navy); }
body.sd-ci .tg-section--for-whom :is(.sd-section__title, .sd-section__lead) { color: var(--m-navy) !important; }
body.sd-ci .tg-check-list { background: #fff !important; border: 2px solid var(--m-navy) !important; border-radius: 18px !important; box-shadow: 6px 6px 0 var(--m-navy); }
body.sd-ci .tg-check-list__title--yes { color: var(--m-teal-dark) !important; }
body.sd-ci .tg-check-list__title--no { color: var(--m-navy) !important; }
body.sd-ci .tg-check-list__item { color: var(--m-ink) !important; }
body.sd-ci .tg-check-list__item--yes .tg-check-list__icon { color: var(--m-teal-dark) !important; }
body.sd-ci .tg-check-list__item--no .tg-check-list__icon { color: #B23A1E !important; }
/* Geschenke + Varianten + FAQ */
body.sd-ci .tg-gift-card { border: 2px solid var(--m-cream) !important; border-radius: 14px !important; box-shadow: 4px 4px 0 var(--m-teal); }
body.sd-ci .tg-gift-card__num {
	font-family: var(--sd-font-mono, monospace) !important; color: var(--m-navy) !important; background: var(--m-yellow) !important; border: 2px solid var(--m-navy); border-radius: 8px !important; }
body.sd-ci .tg-variant-card { border: 2px solid var(--m-cream) !important; border-radius: 18px !important; box-shadow: 6px 6px 0 var(--m-teal); }
body.sd-ci .tg-variant-card__badge {
	font-family: var(--sd-font-mono, monospace) !important; color: var(--m-navy) !important; background: var(--m-cream) !important; border: 2px solid var(--m-navy) !important; border-radius: 8px !important; }
body.sd-ci .tg-variant-card__badge--profi { background: var(--m-yellow) !important; }
body.sd-ci .tg-faq-item { border: 2px solid var(--m-cream) !important; border-radius: 14px !important; }
body.sd-ci .tg-faq-item[open] { box-shadow: 5px 5px 0 var(--m-teal); border-color: var(--m-cream) !important; }
/* Abschluss als Creme-Bühne mit Handschrift */
body.sd-ci .tg-final-cta { background: var(--m-cream) !important; border-top: 3px solid var(--m-navy) !important; }
body.sd-ci .tg-final-cta__title { color: var(--m-navy) !important; text-wrap: balance; }
body.sd-ci .tg-final-cta__title::after {
	content: 'wirklich gratis!'; display: block; margin-top: .4rem; transform: rotate(-3deg);
	font-family: 'SD Hand', cursive; font-weight: 700; font-size: 1.8rem; line-height: 1; color: var(--m-teal-dark); }
body.sd-ci :is(.tg-final-cta__text, .tg-final-cta__sub) { color: var(--m-ink) !important; }
body.sd-ci .tg-final-cta .sd-btn--primary { border: 2px solid var(--m-navy) !important; box-shadow: 4px 4px 0 var(--m-navy) !important; }
@media (max-width: 600px) {
	body.sd-ci :is(.tg-module-item, .tg-variant-card) { box-shadow: 4px 4px 0 var(--m-teal); }
	body.sd-ci .tg-check-list { box-shadow: 4px 4px 0 var(--m-navy); }
}
/* Blog: nur die einzelnen Seitenzahlen als Kacheln, nicht die ganze Leiste; Newsletter-Box auf Inhaltsbreite */
body.sd-ci .blog-pagination ul.page-numbers, body.sd-ci .blog-pagination .nav-links { background: none !important; border: 0 !important; box-shadow: none !important; }
body.sd-ci .blog-pagination :is(a, span).page-numbers { display: inline-block; padding: .35rem .75rem; }
body.sd-ci .blog-cta__row { max-width: 1100px; margin-left: auto !important; margin-right: auto !important; }
body.sd-ci .blog-cta { display: block !important; padding: 0 16px !important; }
/* Basti 28.09.: Wellenkante unter der Tauchgang-Leiste raus, gerade Kante mit Navy-Linie */
body.sd-ci .sf-tg-bar::after { content: none !important; display: none !important; }
body.sd-ci .sf-tg-bar { border-bottom: 3px solid var(--m-navy); }

/* ==========================================================================
   Startseite (main.nx, Wasserlinie) im Mix-Stil (28.09.2026, Basti: „auch Startseite")
   Wasserlinie + Tiefen-Verlauf bleiben; neu sind Konturen, harte Teal-Schatten, Sticker-Kicker, Mono-Nummern.
   Handschrift: „fair, versprochen!“ an den Preisen, „dauert 2 Minuten“ am Formular (max. 2).
   ========================================================================== */
body.sd-ci main.nx { --nx-radius: 18px; }

/* Faktenleiste unter dem Hero: Mono-Sticker */
body.sd-ci .nx-trust-list li strong { font-family: var(--sd-font-mono, monospace); letter-spacing: .02em; }

/* Abschnitts-Kicker als kleines Mono-Label mit gelbem Balken davor */
body.sd-ci main.nx .eye { font-family: var(--sd-font-mono, monospace) !important; letter-spacing: .08em !important; }
body.sd-ci main.nx .nx-head .eye::before, body.sd-ci main.nx .nx-about-text .eye::before, body.sd-ci main.nx .nx-yt .eye::before {
	content: ''; display: block; width: 46px; height: 10px; margin: 0 0 .9rem; background: var(--m-yellow); border: 2px solid var(--m-cream); border-radius: 6px; }
body.sd-ci main.nx .sh { text-wrap: balance; }

/* Leistungs-Kacheln */
body.sd-ci main.nx .nx-card {
	border: 2px solid var(--m-cream) !important; box-shadow: 6px 6px 0 var(--m-teal); transition: transform .2s, box-shadow .2s !important; }
body.sd-ci main.nx .nx-card:hover { transform: translate(-2px, -2px); box-shadow: 8px 8px 0 var(--m-teal); }
body.sd-ci main.nx .nx-card-kicker {
	display: inline-block !important; font-family: var(--sd-font-mono, monospace) !important; letter-spacing: .05em !important;
	background: var(--m-yellow); color: var(--m-navy) !important; border: 2px solid var(--m-navy); border-radius: 8px; padding: .2rem .55rem; }
body.sd-ci main.nx .nx-chips li { font-family: var(--sd-font-mono, monospace); font-size: .72rem !important; border: 1.5px solid rgba(255, 245, 224, .45) !important; border-radius: 8px !important; }

/* Projekte */
body.sd-ci main.nx .nx-project { border: 2px solid var(--m-cream) !important; box-shadow: 6px 6px 0 var(--m-teal); }
body.sd-ci main.nx .nx-browser { border-bottom: 2px solid var(--m-cream); }
body.sd-ci main.nx .nx-project-cat { font-family: var(--sd-font-mono, monospace) !important; }

/* Ablauf: Nummern als Sticker */
body.sd-ci main.nx .nx-step-num {
	border-radius: 10px !important; font-family: var(--sd-font-mono, monospace) !important; font-weight: 700 !important;
	border: 2px solid var(--m-cream) !important; box-shadow: 3px 3px 0 var(--m-teal); }
body.sd-ci main.nx .nx-steps li:first-child .nx-step-num { border-color: var(--m-navy) !important; }

/* Kundenstimmen (Texte bleiben unverändert) */
body.sd-ci main.nx .nx-testi .tcard { border: 2px solid var(--m-cream) !important; box-shadow: 6px 6px 0 var(--m-teal); }

/* Preise: Kontur, Paket „Meistgebucht“ mit gelbem Schatten (Gelb = Preise) + Handschrift */
body.sd-ci main.nx .nx-price { border: 2px solid var(--m-cream) !important; box-shadow: 6px 6px 0 var(--m-teal); }
body.sd-ci main.nx .nx-price--hot { box-shadow: 8px 8px 0 var(--m-yellow) !important; }
body.sd-ci main.nx .nx-badge {
	font-family: var(--sd-font-mono, monospace) !important; border: 2px solid var(--m-navy); border-radius: 8px !important; transform: rotate(-2deg); box-shadow: 3px 3px 0 rgba(0, 0, 0, .35); }
body.sd-ci main.nx .nx-price-grid { position: relative; }
body.sd-ci main.nx .nx-price--hot::after {
	content: 'fair, versprochen!'; position: absolute; right: 18px; bottom: -44px; transform: rotate(-5deg);
	font-family: 'SD Hand', cursive; font-weight: 700; font-size: 1.8rem; line-height: 1; color: var(--m-yellow); white-space: nowrap; pointer-events: none; }
body.sd-ci main.nx .nx-note { margin-top: 3rem !important; }

/* Über mich: Portrait mit Kontur + Teal-Schatten, Gründe als Karten */
body.sd-ci main.nx .nx-about-photo img { border: 3px solid var(--m-cream) !important; box-shadow: 10px 10px 0 var(--m-teal) !important; }
body.sd-ci main.nx .nx-reasons li { border: 2px solid var(--m-cream) !important; border-radius: 14px !important; box-shadow: 4px 4px 0 var(--m-teal); }
body.sd-ci main.nx .nx-story { border: 2px solid var(--m-cream) !important; border-left: 6px solid var(--m-yellow) !important; border-radius: 14px !important; box-shadow: 5px 5px 0 var(--m-teal); }
body.sd-ci main.nx .nx-story-kicker { font-family: var(--sd-font-mono, monospace) !important; }

/* FAQ + Kontaktformular */
body.sd-ci main.nx .faq-item { border: 2px solid rgba(255, 245, 224, .55) !important; border-radius: 14px !important; margin-bottom: 10px; }
body.sd-ci main.nx .faq-item.open, body.sd-ci main.nx .faq-item[open] { border-color: var(--m-cream) !important; box-shadow: 4px 4px 0 var(--m-teal); }
body.sd-ci main.nx .calc-box { position: relative; border: 2px solid var(--m-cream) !important; border-radius: 20px !important; box-shadow: 10px 10px 0 var(--m-teal) !important; }
body.sd-ci main.nx .calc-box :is(input:not([type="checkbox"]), select, textarea) { border: 2px solid rgba(255, 245, 224, .5) !important; border-radius: 10px !important; }
body.sd-ci main.nx .calc-box :is(input, select, textarea):focus { border-color: var(--m-yellow) !important; box-shadow: 3px 3px 0 var(--m-yellow) !important; outline: none; }
body.sd-ci main.nx .form-btn { border: 2px solid var(--m-navy) !important; box-shadow: 4px 4px 0 rgba(0, 0, 0, .35) !important; }
body.sd-ci main.nx .form-submit { position: relative; }
body.sd-ci main.nx .form-submit::before {
	content: 'dauert 2 Minuten'; position: absolute; top: -34px; left: 50%; transform: translateX(-50%) rotate(-4deg);
	font-family: 'SD Hand', cursive; font-weight: 700; font-size: 1.5rem; line-height: 1; color: var(--m-yellow); white-space: nowrap; pointer-events: none; }

/* Buttons wie überall */
body.sd-ci main.nx :is(.by, .nx-price-btn.by) { border: 2px solid var(--m-navy) !important; box-shadow: 4px 4px 0 rgba(0, 0, 0, .35); }

@media (max-width: 600px) {
	body.sd-ci main.nx :is(.nx-card, .nx-project, .nx-testi .tcard, .nx-price) { box-shadow: 4px 4px 0 var(--m-teal); }
	body.sd-ci main.nx .nx-price--hot { box-shadow: 5px 5px 0 var(--m-yellow) !important; }
	body.sd-ci main.nx .nx-about-photo img { box-shadow: 6px 6px 0 var(--m-teal) !important; }
	body.sd-ci main.nx .calc-box { box-shadow: 6px 6px 0 var(--m-teal) !important; }
	body.sd-ci main.nx .nx-price--hot::after { font-size: 1.5rem; bottom: -38px; }
}
@media (prefers-reduced-motion: reduce) { body.sd-ci main.nx .nx-card { transition: none !important; } }
/* Notiz „dauert 2 Minuten“ neben den Senden-Button statt über das Textfeld; am Handy weglassen (zu eng) */
body.sd-ci main.nx .form-submit::before { content: none !important; }
body.sd-ci main.nx .form-btn { position: relative; overflow: visible !important; }
body.sd-ci main.nx .form-btn::after {
	content: 'dauert 2 Minuten'; position: absolute; left: calc(100% + 16px); top: 50%; transform: translateY(-50%) rotate(-5deg);
	font-family: 'SD Hand', cursive; font-weight: 700; font-size: 1.5rem; line-height: 1; color: var(--m-yellow); white-space: nowrap; pointer-events: none; }
@media (max-width: 700px) { body.sd-ci main.nx .form-btn::after { display: none; } }

/* ==========================================================================
   Portfolio (Elementor-Seite 880) im Mix-Stil (28.09.2026)
   ========================================================================== */
body.sd-ci.page-id-880 .elementor-element-psec_hero {
	background: linear-gradient(90deg, var(--m-navy) 0%, rgba(3, 30, 54, .96) 40%, rgba(3, 30, 54, .74) 100%),
		url('../images/bg-skizze.webp') right center / cover no-repeat, var(--m-navy) !important; }
body.sd-ci.page-id-880 .elementor-element-ph1 .elementor-heading-title {
	display: inline-block; font-family: var(--sd-font-mono, monospace) !important; font-size: .74rem !important; letter-spacing: .06em !important;
	color: var(--m-navy) !important; background: var(--m-yellow); padding: .45rem .8rem; border: 2px solid var(--m-navy); border-radius: 10px;
	box-shadow: 4px 4px 0 rgba(0, 0, 0, .35); transform: rotate(-1.5deg); }
body.sd-ci.page-id-880 .sd-portfolio-grid { counter-reset: mprojekt; }
body.sd-ci.page-id-880 .sd-project-card { counter-increment: mprojekt; }
body.sd-ci.page-id-880 .sd-project-info {
	position: relative; padding: 2.4rem 2rem 1.8rem; border: 2px solid var(--m-cream); border-radius: 18px;
	background: rgba(255, 255, 255, .04); box-shadow: 6px 6px 0 var(--m-teal); }
body.sd-ci.page-id-880 .sd-project-info::before {
	content: counter(mprojekt, decimal-leading-zero); position: absolute; top: -13px; left: 18px;
	font-family: var(--sd-font-mono, monospace); font-size: .72rem; font-weight: 700; letter-spacing: .04em;
	background: var(--m-yellow); color: var(--m-navy); border: 2px solid var(--m-navy); border-radius: 8px; padding: .2rem .55rem; }
body.sd-ci.page-id-880 .sd-project-type { font-family: var(--sd-font-mono, monospace) !important; color: var(--m-yellow) !important; }
body.sd-ci.page-id-880 .sd-project-title { text-wrap: balance; }
body.sd-ci.page-id-880 .sd-project-line { height: 10px !important; width: 46px !important; background: var(--m-yellow) !important; border: 2px solid var(--m-cream); border-radius: 6px !important; }
body.sd-ci.page-id-880 .sd-project-tag {
	font-family: var(--sd-font-mono, monospace); background: transparent !important; color: var(--m-cream) !important;
	border: 1.5px solid rgba(255, 245, 224, .55) !important; border-radius: 8px !important; }
body.sd-ci.page-id-880 .sd-project-link { border-bottom-color: var(--m-teal) !important; }
@media (max-width: 600px) {
	body.sd-ci.page-id-880 .sd-project-info { padding: 2.2rem 1.3rem 1.5rem; box-shadow: 4px 4px 0 var(--m-teal); }
}

/* ==========================================================================
   Rechtsseiten (Impressum & Datenschutz, AGB, Widerruf) als „Dokument“ (28.09.2026, Basti: „Unterseiten wie Impressum auch anpassen")
   Kopf auf Navy mit Skizzen-Bild, Text auf Creme-Blatt mit Navy-Kontur + Teal-Schatten – ruhig und gut lesbar.
   ========================================================================== */

/* Kopfbereich */
body.sd-ci:not(.sensei) .sd-static-page {
	max-width: none !important; padding: 0 16px 5rem !important;
	background: linear-gradient(180deg, rgba(3, 30, 54, .7) 0, var(--m-navy) 420px), url('../images/bg-skizze.webp') center top / 100% auto no-repeat, var(--m-navy) !important; }
body.sd-ci:not(.sensei) .sd-static-page__title {
	max-width: 860px; margin: 0 auto !important; padding: clamp(7rem, 12vw, 9rem) 0 2.2rem !important;
	color: #fff !important; line-height: 1.1 !important; text-wrap: balance; }
body.sd-ci .sd-page--impressum .sd-page-header__title { color: #fff !important; text-wrap: balance; }
body.sd-ci .sd-page--impressum .sd-section--legal {
	background: linear-gradient(180deg, rgba(3, 30, 54, .7) 0, var(--m-navy) 380px), url('../images/bg-skizze.webp') center top / 100% auto no-repeat, var(--m-navy) !important; }

/* Doppelte Überschriften weg (Titel steht schon oben) */
body.sd-ci:not(.sensei) .sd-static-page__body > h2:first-child,
body.sd-ci:not(.sensei) .sd-static-page__body > .kicker + h2,
body.sd-ci .sd-page--impressum .elementor-element-imsec_hero { display: none !important; }

/* Das Blatt */
body.sd-ci:not(.sensei) :is(.sd-static-page__body, .sd-page--impressum .sd-content--legal) {
	position: relative; max-width: 860px; margin: 0 auto !important; padding: clamp(2rem, 5vw, 3.4rem) !important;
	background: var(--m-cream) !important; color: var(--m-ink) !important; border: 2px solid var(--m-navy); border-radius: 20px;
	box-shadow: 10px 10px 0 var(--m-teal); }
body.sd-ci:not(.sensei) .sd-static-page__body .kicker {
	position: absolute; top: -16px; left: 28px; margin: 0 !important; transform: rotate(-2deg); box-shadow: 3px 3px 0 var(--m-navy); }

/* Elementor-Hülle im Impressum neutralisieren (volle Breite, eigene Hintergründe) */
body.sd-ci .sd-page--impressum .elementor-element-imsec_content {
	width: auto !important; left: auto !important; padding: 0 !important; background: transparent !important; }
body.sd-ci .sd-page--impressum .elementor-element-imsec_content > .elementor-container { max-width: none !important; }
body.sd-ci .sd-page--impressum .elementor-element-im1 > div > div { max-width: none !important; }

/* Typografie auf dem Blatt (überschreibt auch Inline-Farben aus Elementor) */
body.sd-ci:not(.sensei) :is(.sd-static-page__body, .sd-content--legal) :is(p, li, div, span, td) { color: var(--m-ink) !important; }
body.sd-ci:not(.sensei) :is(.sd-static-page__body, .sd-content--legal) :is(p, li) { font-size: 1rem !important; line-height: 1.75 !important; }
body.sd-ci:not(.sensei) :is(.sd-static-page__body, .sd-content--legal) strong { color: var(--m-navy) !important; }
body.sd-ci:not(.sensei) :is(.sd-static-page__body, .sd-content--legal) h2 {
	color: var(--m-navy) !important; font-family: var(--sd-font-head, 'Fraunces', serif) !important; font-size: clamp(1.3rem, 2.4vw, 1.6rem) !important;
	line-height: 1.2 !important; margin: 2.4rem 0 .8rem !important; padding-top: 1.6rem; border-top: 2px dashed rgba(3, 30, 54, .18); }
body.sd-ci:not(.sensei) :is(.sd-static-page__body > h2:nth-child(2), .sd-static-page__body > .kicker + h2 + h2, .sd-content--legal .elementor-element-im1 h2:first-of-type) {
	margin-top: 0 !important; padding-top: 0; border-top: 0; }
body.sd-ci:not(.sensei) :is(.sd-static-page__body, .sd-content--legal) h3 {
	color: var(--m-teal-dark) !important; font-family: var(--sd-font-mono, monospace) !important; font-size: .82rem !important;
	letter-spacing: .06em !important; text-transform: uppercase; margin: 1.6rem 0 .45rem !important; }
body.sd-ci:not(.sensei) :is(.sd-static-page__body, .sd-content--legal) a {
	color: var(--m-navy) !important; font-weight: 700; text-decoration: underline; text-decoration-color: var(--m-teal); text-underline-offset: 3px; text-decoration-thickness: 2px; }
body.sd-ci:not(.sensei) :is(.sd-static-page__body, .sd-content--legal) hr { border: 0; border-top: 2px dashed rgba(3, 30, 54, .18); margin: 2.4rem 0; }
body.sd-ci .sd-page--impressum .sd-breadcrumb { background: transparent !important; }
body.sd-ci .sd-page--impressum .sd-breadcrumb__link { color: var(--m-yellow) !important; }

@media (max-width: 600px) {
	body.sd-ci:not(.sensei) :is(.sd-static-page__body, .sd-page--impressum .sd-content--legal) { box-shadow: 6px 6px 0 var(--m-teal); border-radius: 16px; }
	body.sd-ci:not(.sensei) .sd-static-page__body .kicker { left: 18px; }
}

/* Rechtsseiten, Runde 2 (Basti: „mit Bildern und schönen Elementen, einheitlich"):
   eigenes Kopfbild (Klemmbrett, CC0 StockSnap „Office Work“ UP9J4EZYNJ), Sticker „Rechtliches“,
   rundes Portrait als Aufkleber am Blatt + Handschrift „Fragen? Schreib mir.“ */
body.sd-ci:not(.sensei) .sd-static-page,
body.sd-ci .sd-page--impressum .sd-section--legal {
	background:
		linear-gradient(90deg, var(--m-navy) 0%, rgba(3, 30, 54, .92) 45%, rgba(3, 30, 54, .7) 100%) top / 100% 520px no-repeat,
		linear-gradient(180deg, rgba(3, 30, 54, 0) 300px, var(--m-navy) 520px) top / 100% 100% no-repeat,
		url('../images/bg-papier.webp') right top / auto 520px no-repeat,
		var(--m-navy) !important; }
body.sd-ci .sd-page--impressum .sd-breadcrumb { position: relative; z-index: 2; }

/* Sticker statt gelbem Balken über dem Titel */
body.sd-ci:not(.sensei) :is(.sd-static-page__title, .sd-page--impressum .sd-page-header__title)::before {
	content: 'Rechtliches'; width: auto; height: auto; display: table; margin: 0 0 1.1rem;
	font-family: var(--sd-font-mono, monospace); font-size: .74rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
	color: var(--m-navy); background: var(--m-yellow); padding: .45rem .8rem; border: 2px solid var(--m-navy); border-radius: 10px;
	box-shadow: 4px 4px 0 rgba(0, 0, 0, .35); transform: rotate(-1.5deg); }
body.sd-ci:not(.sensei) .sd-static-page__body .kicker { display: none !important; }
body.sd-ci .sd-page--impressum .sd-page-header { padding-top: clamp(3rem, 6vw, 4.5rem) !important; margin-bottom: 2.2rem !important; }

/* Portrait-Aufkleber oben rechts am Blatt */
body.sd-ci:not(.sensei) :is(.sd-static-page__body, .sd-page--impressum .sd-content--legal)::before {
	content: ''; position: absolute; top: -44px; right: 34px; width: 92px; height: 92px; border-radius: 50%;
	background: #fff url('../images/sebastian-sperber-portrait-rund.png') center / cover no-repeat;
	border: 3px solid var(--m-navy); box-shadow: 5px 5px 0 var(--m-teal); transform: rotate(4deg); z-index: 2; }
body.sd-ci:not(.sensei) :is(.sd-static-page__body, .sd-page--impressum .sd-content--legal)::after {
	content: 'Fragen? Schreib mir.'; position: absolute; top: -40px; right: 140px; transform: rotate(-4deg);
	font-family: 'SD Hand', cursive; font-weight: 700; font-size: 1.6rem; line-height: 1; color: var(--m-yellow); white-space: nowrap; pointer-events: none; }
body.sd-ci:not(.sensei) :is(.sd-static-page__body, .sd-page--impressum .sd-content--legal) { margin-top: 1.2rem !important; }

@media (max-width: 600px) {
	body.sd-ci:not(.sensei) .sd-static-page,
	body.sd-ci .sd-page--impressum .sd-section--legal {
		background:
			linear-gradient(180deg, rgba(3, 30, 54, .78) 0, rgba(3, 30, 54, .92) 260px, var(--m-navy) 420px) top / 100% 100% no-repeat,
			url('../images/bg-papier.webp') center top / auto 420px no-repeat, var(--m-navy) !important; }
	body.sd-ci:not(.sensei) :is(.sd-static-page__body, .sd-page--impressum .sd-content--legal)::before { width: 70px; height: 70px; top: -34px; right: 16px; }
	body.sd-ci:not(.sensei) :is(.sd-static-page__body, .sd-page--impressum .sd-content--legal)::after { right: 96px; top: -30px; font-size: 1.35rem; }
	body.sd-ci:not(.sensei) :is(.sd-static-page__body, .sd-page--impressum .sd-content--legal) { margin-top: 2rem !important; }
}
/* Einheitliche Titel (AGB/Widerruf wie Impressum) + mehr Luft für die Handschrift unter dem Titel */
body.sd-ci:not(.sensei) .sd-static-page__title { font-family: var(--sd-font-head, 'Fraunces', serif) !important; font-weight: 800 !important; font-size: clamp(2.1rem, 5vw, 3.2rem) !important; padding-bottom: 3rem !important; }
body.sd-ci .sd-page--impressum .sd-page-header { margin-bottom: 3.4rem !important; }

/* Rechtsseiten-Stil gilt NICHT für Kurs, Lektionen und Kursübersicht (Sensei nutzt dasselbe Seiten-Template, Basti 28.09.: „passt nicht“) */
/* Kurs: Sensei-Etikett „Vorschau“ ausblenden – alle Lektionen sind frei zugänglich (Basti 28.09.) */
body.sd-ci.single-course .preview-label { display: none !important; }
/* Lektionen: Code-Blöcke lesbar (heller Code auf Navy, kein weißer Balken), lange Zeilen umbrechen statt überlaufen */
body.sd-ci .sd-lesson-shell pre {
	background: var(--m-navy) !important; color: var(--m-cream) !important; border-radius: 12px !important; padding: 14px 16px !important;
	white-space: pre-wrap; word-break: break-word; overflow-x: auto; border: 2px solid var(--m-navy); box-shadow: 4px 4px 0 var(--m-teal); }
body.sd-ci .sd-lesson-shell pre code { background: none !important; color: var(--m-cream) !important; padding: 0 !important; font-size: .92rem !important; }
body.sd-ci .sd-lesson-shell :not(pre) > code { color: var(--m-navy) !important; word-break: break-word; }
/* Lektionen: Text in dunklen Info-Boxen hell halten (Kurs-CSS färbte ihn dunkel = unlesbar) */
body.sd-ci .sd-lesson-shell div[style*="background:#06182E"] :is(p, li, span):not([style*="#F5C518"]) { color: rgba(255, 255, 255, .9) !important; }
body.sd-ci .sd-lesson-shell div[style*="background:#06182E"] a { color: var(--m-yellow) !important; }
/* Gelbe Kicker-Zeile auf der weißen Lektionskarte: Gelb nie als Text auf Hell → Teal-Dunkel */
body.sd-ci .sd-lesson-shell > p[style*="uppercase"][style*="#F5C518"],
body.sd-ci .sd-lesson-shell p[style*="uppercase"][style*="#F5C518"]:not(div[style*="background:#06182E"] p) { color: var(--m-teal-dark) !important; }

/* ==========================================================================
   Feinschliff 28.09. nachts (Basti: „Buttons geht nicht“, „Abstände anpassen“, „Anker gehen nicht an die richtige Position“)
   ========================================================================== */
/* Sprungziele nicht mehr hinter der festen Kopfleiste verstecken */
html { scroll-padding-top: 96px; }
@media (max-width: 600px) { html { scroll-padding-top: 84px; } }

/* Buttons: Text immer zentriert, am Handy volle Breite in Boxen statt dreizeiliger Pille */
body.sd-ci :is(.sd-btn, .sd-lead-btn, .tg-btn, .sd-um-btn, .blog-cta__btn, .form-btn, .nx-price-btn, .sf-tg-bar__btn) { text-align: center !important; justify-content: center; }
@media (max-width: 600px) {
	body.sd-ci :is(.sd-cta-box, .sd-leist-pricing__box, .tg-final-cta, .sd-um-cta) :is(.sd-btn, .sd-um-btn) {
		display: flex !important; width: 100%; box-sizing: border-box; padding: .95rem 1.2rem !important; line-height: 1.3 !important; }
	body.sd-ci .sd-cta-box__inner { padding-left: 1.4rem !important; padding-right: 1.4rem !important; }
	body.sd-ci .sd-hero__actions .sd-btn, body.sd-ci .sd-hero__inner > .sd-btn { padding-left: 1.4rem !important; padding-right: 1.4rem !important; }
}

/* Kontakt „Oder direkt“: Innenabstand in den Kacheln, Mail-Adresse ohne Wortbruch */
body.sd-ci .sd-contact-info__item { padding: .8rem 1rem !important; gap: .9rem !important; align-items: center !important; }
body.sd-ci .sd-contact-info__label { display: block; margin-bottom: .15rem; }
body.sd-ci .sd-contact-info__list { display: grid; gap: 1rem; }
@media (max-width: 600px) {
	body.sd-ci .sd-contact-info { padding: 1.4rem 1.1rem !important; }
	body.sd-ci .sd-contact-info__item { padding: .75rem .8rem !important; gap: .7rem !important; }
	body.sd-ci .sd-contact-info__icon { flex: 0 0 40px; width: 40px !important; height: 40px !important; }
	body.sd-ci .sd-contact-info__value { font-size: .9rem !important; overflow-wrap: anywhere; }
}

/* ==========================================================================
   Lead-Boxen + Anfrage-Wege (28.09.2026, Basti: „Ja gerne so umsetzen“)
   ========================================================================== */
/* Box am Ende von Blogbeiträgen und im Tauchgang (sd-core/leads.php) */
body.sd-ci .sd-leadbox {
	position: relative; margin: 3rem 0 1rem; padding: 2.2rem 1.8rem 1.6rem; background: var(--m-yellow); color: var(--m-navy);
	border: 2px solid var(--m-navy); border-radius: 20px; box-shadow: 8px 8px 0 var(--m-navy); }
body.sd-ci .sd-leadbox__kicker {
	position: absolute; top: -15px; left: 22px; transform: rotate(-2deg);
	font-family: var(--sd-font-mono, monospace); font-size: .72rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
	background: var(--m-cream); color: var(--m-navy); border: 2px solid var(--m-navy); border-radius: 8px; padding: .25rem .6rem; box-shadow: 3px 3px 0 var(--m-navy); }
body.sd-ci .sd-leadbox__title { font-family: var(--sd-font-head, 'Fraunces', serif) !important; font-weight: 800 !important; font-size: clamp(1.35rem, 3vw, 1.7rem) !important; line-height: 1.2 !important; color: var(--m-navy) !important; margin: 0 0 .6rem !important; text-wrap: balance; }
body.sd-ci .sd-leadbox__text { color: rgba(3, 30, 54, .85) !important; margin: 0 0 1.2rem !important; line-height: 1.6 !important; }
body.sd-ci .sd-leadbox__actions { display: flex; flex-wrap: wrap; gap: .8rem; margin: 0 0 .9rem !important; }
body.sd-ci .sd-leadbox__btn {
	display: inline-flex; align-items: center; justify-content: center; text-align: center; padding: .85rem 1.4rem; border-radius: 999px;
	font-weight: 800; text-decoration: none !important; background: var(--m-navy); color: var(--m-cream) !important; border: 2px solid var(--m-navy);
	box-shadow: 4px 4px 0 rgba(0, 0, 0, .3); transition: transform .2s; }
body.sd-ci .sd-leadbox__btn:hover { transform: translate(-2px, -2px); }
body.sd-ci .sd-leadbox__btn--ghost { background: #fff; color: var(--m-navy) !important; box-shadow: 4px 4px 0 var(--m-navy); }
body.sd-ci .sd-leadbox__note { font-family: var(--sd-font-mono, monospace); font-size: .74rem !important; color: rgba(3, 30, 54, .75) !important; margin: 0 !important; }
@media (max-width: 600px) {
	body.sd-ci .sd-leadbox { padding: 2rem 1.2rem 1.4rem; box-shadow: 5px 5px 0 var(--m-navy); }
	body.sd-ci .sd-leadbox__btn { width: 100%; }
}
/* Leistungen: Button direkt unter dem Einstiegstext */
body.sd-ci .sd-leist-hero__actions { margin: 1.8rem 0 0 !important; }
body.sd-ci .sd-leist-hero__actions .sd-btn--primary { background: var(--m-yellow) !important; color: var(--m-navy) !important; border: 2px solid var(--m-navy) !important; box-shadow: 4px 4px 0 rgba(0, 0, 0, .35); }
/* KI-Schulung hat jetzt auch Faktenleiste + Anfrage-Bereich: gleicher Stil wie Landingpages */
body.sd-ci .sd-page--ki-beratung .sd-trust { background: var(--m-cream) !important; border-top: 3px solid var(--m-navy); border-bottom: 3px solid var(--m-navy); padding: 2.6rem 0 !important; }
body.sd-ci .sd-page--ki-beratung .sd-trust-grid > li { background: #fff !important; border: 2px solid var(--m-navy) !important; box-shadow: 4px 4px 0 var(--m-navy) !important; }
body.sd-ci .sd-page--ki-beratung .sd-trust-grid > li strong { color: var(--m-navy) !important; }
body.sd-ci .sd-page--ki-beratung .sd-trust-grid > li span:not(.sd-trust-ico) { color: var(--m-ink) !important; }
/* KI-Schulung: Tauchgang-Hinweis „Noch kein Website-Projekt …“ passt dort nicht (Leser will KI, nicht Website) */
body.sd-ci .sd-page--ki-beratung .sd-tg-hook { display: none !important; }
