/* ==========================================================================
   Giulia Nikolic – Theme styles

   Gestaltung in Anlehnung an die Apple-Produktseiten: ruhige Flächen in
   Weiß, Creme und Sand, viel Luft, große stille Typografie, Bewegung nur
   durch Scrollen. Rosé ist Akzentfarbe und bleibt den Kaufbuttons und
   einzelnen hervorgehobenen Wörtern vorbehalten.

   Die Farb- und Schrift-Tokens kommen aus theme.json (--wp--preset--*),
   darunter stehen kurze Aliase.
   ========================================================================== */

:root {
	--gn-rose: var(--wp--preset--color--rose, #e84279);
	--gn-rose-deep: var(--wp--preset--color--rose-deep, #b8285a);
	--gn-rose-soft: var(--wp--preset--color--rose-soft, #fbe3eb);
	--gn-sand: var(--wp--preset--color--sand, #ebdfd4);
	--gn-cream: var(--wp--preset--color--cream, #f6f3ef);
	--gn-ink: var(--wp--preset--color--ink, #1d1418);
	--gn-white: #fff;

	/* Flächen und Linien */
	--gn-line: rgba(29, 20, 24, .12);
	--gn-line-soft: rgba(29, 20, 24, .07);
	--gn-muted: rgba(29, 20, 24, .62);
	--gn-surface: #fff;

	--gn-radius: 22px;
	--gn-radius-l: 32px;
	--gn-radius-s: 14px;

	--gn-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--gn-shadow: 0 24px 60px -34px rgba(29, 20, 24, .3);
	--gn-shadow-l: 0 50px 110px -60px rgba(29, 20, 24, .45);
	--gn-header-h: 64px;
}

html { scroll-behavior: smooth; }

/* Kernklassen aus block-library/common.css, hier wiederholt, damit sie nie fehlen */
.has-text-align-center { text-align: center; }
.has-text-align-left { text-align: left; }
.has-text-align-right { text-align: right; }
.wp-block-image.aligncenter, .aligncenter { margin-left: auto; margin-right: auto; display: table; }

body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: clip; background: var(--gn-white); }
::selection { background: var(--gn-rose); color: #fff; }
img { height: auto; }
:where(.wp-site-blocks) > * { margin-block-start: 0; }
.wp-site-blocks > main { margin-block: 0; }
.wp-site-blocks { overflow-x: clip; }

:where(h1, h2, h3) { text-wrap: balance; overflow-wrap: normal; word-break: normal; }
:where(h1, h2, h3, h4) strong { font-weight: inherit; }

/* Das Rosé lebt in den Buttons und in einzelnen hervorgehobenen Wörtern. */
h1 em, h2 em, h3 em { font-style: normal; color: var(--gn-rose); }
.gn-accent { color: var(--gn-rose); }

/* --------------------------------------------------------------------------
   Kopfzeile
   -------------------------------------------------------------------------- */
.gn-header {
	position: sticky; top: 0; z-index: 50;
	background: rgba(255, 255, 255, .72);
	backdrop-filter: saturate(180%) blur(20px);
	-webkit-backdrop-filter: saturate(180%) blur(20px);
	border-bottom: 1px solid transparent;
	transition: border-color .4s var(--gn-ease), background-color .4s var(--gn-ease);
}
.gn-header.is-scrolled { border-bottom-color: var(--gn-line-soft); }
.admin-bar .gn-header { top: 32px; }
.gn-header .wp-block-site-title a, .gn-brand a { text-decoration: none; color: var(--gn-ink); }
.gn-brand { font-family: var(--wp--preset--font-family--heading); font-size: 1.35rem; letter-spacing: .01em; margin: 0; }
/* Logo wie in der ersten Version: „Nikolić“ in Rosé. */
.gn-brand a span { color: var(--gn-rose); }
.gn-header .wp-block-navigation { gap: clamp(1.1rem, 2.4vw, 2.2rem); }
.gn-header .wp-block-navigation a {
	text-decoration: none; font-size: .86rem; font-weight: 400; color: rgba(29, 20, 24, .82);
	transition: color .25s;
}
.gn-header .wp-block-navigation a:hover { color: var(--gn-ink); }

/* --------------------------------------------------------------------------
   Abschnitte
   -------------------------------------------------------------------------- */
/* Kein overflow-x: clip mehr am Abschnitt (25.10.): Safari auf dem iPhone schnitt damit beim Scrollen
   den Teil des Strichs ab, der über die Kante in den vorigen Abschnitt ragt. Seitlich begrenzen
   body und .wp-site-blocks, kein Abschnitt ragt innerhalb des Fensters über seinen Rand (geprüft). */
.gn-section { position: relative; isolation: isolate; }
.gn-section.is-white { background: var(--gn-white); }
.gn-section.is-cream { background: var(--gn-cream); }
.gn-section.is-sand { background: var(--gn-sand); }
/* Zwei Abschnitte mit gleicher Fläche hintereinander: sonst addieren sich beide
   Innenabstände zu einer Lücke, die doppelt so groß wirkt wie überall sonst. */
.gn-section.is-white + .gn-section.is-white,
.gn-section.is-cream + .gn-section.is-cream,
.gn-section.is-sand + .gn-section.is-sand,
.gn-section.is-night + .gn-section.is-night { padding-top: 0 !important; }
/* Die früher kräftig eingefärbten Töne werden ruhig ausgespielt. */
.gn-section.is-blush { background: var(--gn-cream); }
.gn-section.is-rose { background: var(--gn-cream); }
.gn-section.is-night { background: #0b0b0d; color: rgba(255, 255, 255, .72); }
.gn-section.is-night :is(h1, h2, h3, h4) { color: #fff; }
.gn-section.is-night { --gn-line: rgba(255, 255, 255, .14); --gn-line-soft: rgba(255, 255, 255, .09); --gn-muted: rgba(255, 255, 255, .62); --gn-surface: #141417; }

/* Kleine Überzeile */
.gn-kicker, .gn-eyebrow {
	display: block;
	font-size: .8rem; font-weight: 500; letter-spacing: 0;
	text-transform: none; color: var(--gn-rose);
	margin-bottom: .5rem;
}
.gn-section.is-night .gn-eyebrow { color: #ff86ab; }

.gn-lead {
	font-size: clamp(1.1rem, 1.8vw, 1.45rem); line-height: 1.5; color: var(--gn-muted);
	max-width: 46ch;
}
.has-text-align-center .gn-lead, .gn-center .gn-lead, .gn-lead.has-text-align-center { margin-inline: auto; }

.gn-heading-xl { font-size: var(--wp--preset--font-size--display) !important; }

/* Die dekorativen Farbwolken entfallen im ruhigen Layout. */
.gn-orbs { display: none; }

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */
.gn-hero { padding-top: clamp(3rem, 7vw, 6rem) !important; }
.gn-hero h1 {
	font-size: clamp(2.6rem, 6.2vw, 5.25rem); line-height: 1.04; letter-spacing: -.022em;
	margin-block: .18em .3em;
}
.gn-hero h1.is-long { font-size: clamp(2.1rem, 4.2vw, 3.6rem); line-height: 1.1; }
.gn-hero .wp-block-columns { align-items: center !important; gap: clamp(2rem, 5vw, 5rem); }
.gn-hero__media .wp-block-image { margin: 0; }
.gn-hero__media img { border-radius: var(--gn-radius-l); box-shadow: var(--gn-shadow-l); width: 100%; }

/* Häkchenliste */
.gn-chips { list-style: none; padding: 0 !important; margin: 1.8rem 0 0; display: grid; gap: .85rem; }
.gn-chips li { display: flex; align-items: flex-start; gap: .75rem; font-size: 1rem; color: var(--gn-muted); }
.gn-chips li::before {
	content: ""; flex: 0 0 20px; height: 20px; margin-top: .22em; border-radius: 50%;
	background: var(--gn-rose) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center / 11px no-repeat;
}
.gn-chips.is-inline { display: flex; flex-wrap: wrap; gap: .6rem 1.6rem; }
.has-text-align-center .gn-chips li, .gn-center .gn-chips li { justify-content: center; }

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */
.wp-block-button__link {
	transition: background-color .25s var(--gn-ease), color .25s var(--gn-ease), opacity .25s;
}
.wp-block-button__link:hover { background-color: var(--gn-rose-deep); }
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent; color: var(--gn-rose-deep); border: 1px solid currentColor; box-shadow: none;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--gn-rose-soft); }
.gn-section.is-night .wp-block-button.is-style-outline > .wp-block-button__link { color: #fff; }
.gn-section.is-night .wp-block-button.is-style-outline > .wp-block-button__link:hover { background: rgba(255, 255, 255, .1); }
.gn-btn-sub { display: block; font-size: .78em; font-weight: 400; opacity: .8; margin-top: .15rem; }
.wp-block-button.is-disabled > .wp-block-button__link { opacity: .4; pointer-events: none; }
.gn-cta { text-align: center; }
.wp-block-buttons { gap: .9rem; }

/* Textlink im Apple-Ton: Pfeil statt Unterstreichung */
.gn-textlink { color: var(--gn-rose); text-decoration: none; font-weight: 400; }
.gn-textlink::after { content: " \203A"; display: inline-block; transition: transform .25s var(--gn-ease); }
.gn-textlink:hover::after { transform: translateX(3px); }

/* --------------------------------------------------------------------------
   Karten und Raster
   -------------------------------------------------------------------------- */
.gn-cards { gap: clamp(1rem, 2vw, 1.5rem) !important; }
.gn-cards > .wp-block-column, .gn-card {
	position: relative; background: var(--gn-surface); border-radius: var(--gn-radius-l);
	padding: clamp(1.8rem, 3vw, 2.6rem);
	border: 1px solid var(--gn-line-soft);
	transition: border-color .4s var(--gn-ease);
}
.gn-section.is-white .gn-cards > .wp-block-column { background: var(--gn-cream); border-color: transparent; }
.gn-cards > .wp-block-column:hover { border-color: var(--gn-line); }
.gn-cards-visual { max-width: 560px; margin: 0 auto 1rem !important; }
.gn-cards-visual img { border-radius: var(--gn-radius); aspect-ratio: 16 / 10; object-fit: cover; width: 100%; }
.gn-cards h3 { font-size: 1.3rem; margin-bottom: .55rem; letter-spacing: -.01em; }
.gn-cards p, .gn-cards li { color: var(--gn-muted); }
.gn-card__icon {
	font-size: 1.5rem; line-height: 1; margin: 0 0 1rem; display: inline-grid; place-items: center;
	width: 48px; height: 48px; border-radius: 14px; background: var(--gn-rose-soft);
}
.gn-cards .wp-block-separator { width: 32px; border-top: 1px solid var(--gn-line) !important; opacity: 1; margin: 1.1rem 0; }

/* Passt zu dir / passt nicht zu dir */
.gn-fit > .wp-block-column:first-child { background: #fff; border-color: transparent; }
.gn-fit > .wp-block-column:last-child { background: #0b0b0d; color: rgba(255, 255, 255, .7); border-color: transparent; }
.gn-fit > .wp-block-column:last-child :is(h3, strong) { color: #fff; }
.gn-fit > .wp-block-column:last-child .gn-card__icon { background: rgba(255, 255, 255, .1); }
.gn-fit > .wp-block-column:last-child p, .gn-fit > .wp-block-column:last-child li { color: rgba(255, 255, 255, .7); }
.gn-fit .gn-card__icon { color: var(--gn-rose); font-size: 1.3rem; }
.gn-fit ul { list-style: none; padding: 0; display: grid; gap: .75rem; }
.gn-fit li { padding-left: 1.7rem; position: relative; }
.gn-fit > .wp-block-column:first-child li::before { content: "+"; position: absolute; left: 0; color: var(--gn-rose); }
.gn-fit > .wp-block-column:last-child li::before { content: "–"; position: absolute; left: 0; opacity: .55; }

/* Schritte */
.gn-step__num {
	font-family: var(--wp--preset--font-family--body); font-size: 1rem; font-weight: 500; line-height: 1;
	display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 50%;
	color: var(--gn-rose); background: var(--gn-rose-soft); margin: 0 0 1rem;
}

/* --------------------------------------------------------------------------
   Split (Bild und Text)
   -------------------------------------------------------------------------- */
.gn-split { align-items: center !important; gap: clamp(2rem, 6vw, 6rem) !important; }
.gn-split .wp-block-image { margin: 0; position: relative; }
.gn-split .wp-block-image img { border-radius: var(--gn-radius-l); width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.gn-frame::before { content: none; }
.gn-split ul { padding-left: 0; list-style: none; display: grid; gap: .9rem; }
.gn-split ul li { padding-left: 1.6rem; position: relative; color: var(--gn-muted); }
.gn-split ul li::before {
	content: ""; position: absolute; left: 0; top: .62em; width: 6px; height: 6px; border-radius: 50%;
	background: var(--gn-rose);
}

/* --------------------------------------------------------------------------
   Module
   -------------------------------------------------------------------------- */
.gn-modules > .wp-block-group, .gn-module {
	position: relative; background: var(--gn-surface); border-radius: var(--gn-radius-l); overflow: hidden;
	border: 1px solid var(--gn-line-soft);
}
.gn-section.is-white .gn-modules > .wp-block-group { background: var(--gn-cream); border-color: transparent; }
.gn-module .wp-block-image { margin: 0; overflow: hidden; }
.gn-module .wp-block-image img { width: 100%; aspect-ratio: 16 / 11; object-fit: cover; transition: transform 1.4s var(--gn-ease); }
.gn-module:hover .wp-block-image img { transform: scale(1.04); }
.gn-module__body { padding: 1.6rem 1.7rem 2rem !important; }
.gn-module h3 { font-size: 1.2rem; margin: 0 0 .5rem; letter-spacing: -.01em; }
.gn-module p, .gn-module li { font-size: .95rem; color: var(--gn-muted); }
.gn-module__badge {
	position: absolute; top: 1rem; left: 1rem; z-index: 2; margin: 0 !important;
	font-size: .75rem; color: var(--gn-ink);
	background: rgba(255, 255, 255, .82); backdrop-filter: blur(10px);
	padding: .28rem .7rem; border-radius: 999px;
}

/* --------------------------------------------------------------------------
   Stimmen
   -------------------------------------------------------------------------- */
.gn-quote {
	position: relative; background: var(--gn-surface); border-radius: var(--gn-radius-l);
	padding: 2rem 1.9rem 1.7rem !important; border: 1px solid var(--gn-line-soft); height: 100%;
}
.gn-section.is-white .gn-quote { background: var(--gn-cream); border-color: transparent; }
.gn-quote::before { content: none; }
.gn-stars { color: var(--gn-rose); letter-spacing: .18em; font-size: .85rem; margin: 0 0 .9rem; }
.gn-quote__text { font-size: .98rem; color: var(--gn-muted); }
.gn-quote__person { display: flex; align-items: center; gap: .8rem; margin-top: 1.3rem !important; }
.gn-quote__person .wp-block-image { margin: 0; flex: 0 0 44px; }
.gn-quote__person img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.gn-quote__name { font-weight: 500; margin: 0; line-height: 1.3; font-size: .95rem; }
.gn-quote__role { font-size: .8rem; color: var(--gn-muted); margin: 0; }
.gn-quote__more { font-size: .85rem; color: var(--gn-rose); cursor: pointer; background: none; border: 0; padding: 0; margin-top: .4rem; }
.gn-quote.is-clamped .gn-quote__text { display: -webkit-box; -webkit-line-clamp: 7; -webkit-box-orient: vertical; overflow: hidden; }

/* Stimmen als Instagram-Direktnachricht. is-chat: Chatfenster, is-blasen: nur Sprechblasen. */
.gn-dms { --gn-dm-bubble: #efecea; --gn-dm-bg: #fff; align-items: flex-start !important; }
.gn-section.is-cream .gn-dms.is-blasen { --gn-dm-bubble: #e8e3de; --gn-dm-bg: var(--gn-cream); }
.gn-quote.gn-dm { display: flex; flex-direction: column; height: auto; padding: 0 !important; }
.gn-dm > * { margin-block: 0 !important; }
.gn-dms.is-chat .gn-quote.gn-dm { background: #fff; border: 1px solid var(--gn-line-soft); border-radius: 28px; box-shadow: var(--gn-shadow); overflow: hidden; }
.gn-dms.is-blasen .gn-quote.gn-dm { background: none; border: 0; border-radius: 0; }
.gn-dm__head { display: flex; align-items: center; gap: .75rem; padding: .95rem 1.2rem; border-bottom: 1px solid var(--gn-line-soft); }
.gn-dm .gn-dm__avatar { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%; object-fit: cover; font-size: 1rem; }
.gn-dm__who { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.gn-dm__who .gn-quote__name { font-weight: 600; font-size: .95rem; }
.gn-dm__via { display: inline-flex; align-items: center; font-size: .78rem; color: var(--gn-muted); }
.gn-dm__via .gn-insta-ico { width: 1em; height: 1em; margin-left: .3em; }
.gn-dm__thread { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 1.3rem 1.2rem 1.4rem; }
.gn-dms.is-blasen .gn-dm__thread { padding: 0; }
.gn-dm__msg { position: relative; max-width: 92%; margin: 0 !important; padding: .62rem 1rem; border-radius: 6px 22px 22px 6px;
	background: var(--gn-dm-bubble); color: var(--gn-ink); font-size: .9rem; line-height: 1.55; }
.gn-dm__msg:first-child { border-top-left-radius: 22px; }
.gn-dm__msg:last-child { border-bottom-left-radius: 22px; }
.gn-dm__msg:has(.gn-dm__heart) { margin-bottom: 14px !important; }
.gn-dm__heart { position: absolute; left: 12px; bottom: -14px; display: grid; place-items: center; width: 26px; height: 21px; border-radius: 999px;
	background: var(--gn-dm-bubble); border: 2px solid var(--gn-dm-bg); color: var(--gn-rose); }
.gn-dm.is-clamped .gn-dm__thread { max-height: 22rem; overflow: hidden;
	-webkit-mask-image: linear-gradient(#000 calc(100% - 6rem), transparent); mask-image: linear-gradient(#000 calc(100% - 6rem), transparent); }
.gn-dm__more { align-self: flex-start; margin: -.2rem 1.2rem 1.3rem !important; padding: 0; background: none; border: 0; cursor: pointer;
	color: var(--gn-rose); font: inherit; font-size: .85rem; font-weight: 500; }
.gn-dms.is-blasen .gn-dm__more { margin: .6rem 0 0 !important; }
.gn-dm__from { display: flex; align-items: center; gap: .55rem; padding-top: 1.1rem; }
.gn-dm__from .gn-dm__avatar { flex-basis: 30px; width: 30px; height: 30px; font-size: .8rem; }
.gn-dm__from .gn-quote__name { font-weight: 500; font-size: .9rem; }
.gn-dm__from .gn-insta-ico { margin-left: .1em; color: var(--gn-muted); }
.gn-dms__nav { display: flex; justify-content: center; gap: .6rem; margin-top: 1.4rem !important; }
.gn-dms__nav[hidden] { display: none; }
.gn-dms__nav button { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border-radius: 50%; cursor: pointer;
	background: #fff; border: 1px solid var(--gn-line); color: var(--gn-ink); transition: opacity .2s, border-color .2s; }
.gn-dms__nav button:hover { border-color: var(--gn-ink); }
.gn-dms__nav button:disabled { opacity: .35; cursor: default; }
.gn-dms__nav svg { width: 18px; height: 18px; }
@media (max-width: 781px) {
	.gn-dms { flex-wrap: nowrap !important; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
		margin-inline: calc(var(--wp--style--root--padding-left, 1.25rem) * -1) !important;
		padding: 0 var(--wp--style--root--padding-left, 1.25rem) 2.5rem; scroll-padding-inline: var(--wp--style--root--padding-left, 1.25rem); }
	.gn-dms::-webkit-scrollbar { display: none; }
	.gn-dms > .wp-block-column { flex: 0 0 86% !important; scroll-snap-align: start; }
	.gn-dms__nav { margin-top: -1rem !important; }
}

/* --------------------------------------------------------------------------
   Bildband, Zahl, Über mich
   -------------------------------------------------------------------------- */
.gn-band { min-height: 62vh !important; overflow: hidden; }
.gn-band .wp-block-cover__image-background { transform: scale(1.15); will-change: transform; }
.gn-stat__num {
	font-family: var(--wp--preset--font-family--heading); font-weight: 700; line-height: 1;
	font-size: clamp(3.4rem, 10vw, 7rem); letter-spacing: -.03em; margin: 0; color: var(--gn-ink);
}
.gn-section.is-night .gn-stat__num { color: #fff; }
.gn-insta img { border-radius: var(--gn-radius-l); }
.gn-about h2 { margin-top: 0; }
.gn-signature { font-family: var(--wp--preset--font-family--heading); font-style: italic; font-size: 1.4rem; color: var(--gn-ink); }

/* --------------------------------------------------------------------------
   Preis
   -------------------------------------------------------------------------- */
.gn-price-wrap { perspective: none; }
.gn-price {
	position: relative; max-width: 560px; margin-inline: auto !important; text-align: center;
	border: 1px solid var(--gn-line); border-radius: var(--gn-radius-l);
	padding: clamp(2rem, 5vw, 3.4rem) !important; background: var(--gn-surface);
	animation: none;
}
.gn-section.is-white .gn-price { background: var(--gn-cream); border-color: transparent; }
.gn-price__amount {
	font-family: var(--wp--preset--font-family--heading); font-size: clamp(3rem, 8vw, 4.4rem);
	line-height: 1; letter-spacing: -.03em; color: var(--gn-ink); margin: .3em 0 .1em;
}
.gn-price__old { text-decoration: line-through; color: var(--gn-muted); font-size: 1rem; margin: 0; }
.gn-price ul { text-align: left; list-style: none; padding: 0; display: grid; gap: .8rem; margin: 1.8rem 0; }
.gn-price li { padding-left: 1.7rem; position: relative; font-size: .98rem; color: var(--gn-muted); }
.gn-price li::before {
	content: ""; position: absolute; left: 0; top: .42em; width: 16px; height: 16px; border-radius: 50%;
	background: var(--gn-rose) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center / 9px no-repeat;
}
.gn-price .wp-block-buttons { justify-content: center; }
.gn-price .wp-block-button, .gn-price .wp-block-button__link { width: auto; }

/* --------------------------------------------------------------------------
   Fragen und Antworten
   -------------------------------------------------------------------------- */
.gn-faq { max-width: 760px; margin-inline: auto; }
.gn-faq .wp-block-details {
	background: none; border-radius: 0; padding: 0; margin-block: 0;
	border-bottom: 1px solid var(--gn-line-soft); overflow: hidden;
}
.gn-faq .wp-block-details:first-of-type { border-top: 1px solid var(--gn-line-soft); }
.gn-faq .wp-block-details summary {
	list-style: none; cursor: pointer; padding: 1.4rem 3rem 1.4rem 0; position: relative;
	font-family: var(--wp--preset--font-family--body); font-size: 1.05rem; font-weight: 400;
}
.gn-faq .wp-block-details summary::-webkit-details-marker { display: none; }
.gn-faq .wp-block-details summary::after {
	content: ""; position: absolute; right: .4rem; top: 50%; translate: 0 -50%;
	width: 16px; height: 16px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 4h2v16h-2z'/%3E%3Cpath d='M4 11h16v2H4z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 4h2v16h-2z'/%3E%3Cpath d='M4 11h16v2H4z'/%3E%3C/svg%3E") center / contain no-repeat;
	color: var(--gn-rose);
	transition: transform .4s var(--gn-ease);
}
.gn-faq .wp-block-details[open] summary::after { transform: rotate(135deg); }
.gn-faq .wp-block-details > :not(summary) { padding-inline: 0; color: var(--gn-muted); }
.gn-faq .wp-block-details > :last-child { padding-bottom: 1.5rem; }
.gn-faq .wp-block-details::details-content { block-size: 0; overflow: clip; transition: block-size .45s var(--gn-ease), content-visibility .45s allow-discrete; }
.gn-faq .wp-block-details[open]::details-content { block-size: auto; }
:root { interpolate-size: allow-keywords; }

/* --------------------------------------------------------------------------
   Countdown
   -------------------------------------------------------------------------- */
.gn-countdown { display: flex; gap: 1.4rem; margin: 1.6rem 0; flex-wrap: wrap; }
.gn-countdown__unit { min-width: 0; padding: 0; text-align: center; background: none; }
.gn-countdown__num {
	display: block; font-family: var(--wp--preset--font-family--heading); font-size: 2.1rem;
	font-weight: 700; line-height: 1.05; letter-spacing: -.02em; color: var(--gn-ink);
	font-variant-numeric: tabular-nums;
}
.gn-section.is-night .gn-countdown__num { color: #fff; }
.gn-countdown__num.is-flip { animation: gn-fade .4s var(--gn-ease); }
@keyframes gn-fade { from { opacity: .25; } to { opacity: 1; } }
.gn-countdown__label { font-size: .72rem; color: var(--gn-muted); }
.gn-countdown.is-expired { display: none; }
.has-text-align-center .gn-countdown, .gn-center .gn-countdown { justify-content: center; }

.gn-topbar {
	padding: .6rem 1rem; text-align: center; color: var(--gn-ink);
	background: var(--gn-cream); border-bottom: 1px solid var(--gn-line-soft); font-size: .85rem;
}
.gn-topbar .gn-countdown { margin: 0; justify-content: center; gap: .55rem; display: inline-flex; vertical-align: middle; }
.gn-topbar .gn-countdown__unit { padding: 0; }
.gn-topbar .gn-countdown__num { color: var(--gn-rose); font-size: .9rem; display: inline; font-family: var(--wp--preset--font-family--body); font-weight: 500; }
.gn-topbar .gn-countdown__label { font-size: .72rem; margin-left: .15rem; display: inline; }
.gn-topbar:has(.gn-countdown.is-expired) { display: none; }

/* --------------------------------------------------------------------------
   Video
   -------------------------------------------------------------------------- */
.gn-video { border-radius: var(--gn-radius-l); overflow: hidden; background: #0b0b0d; }
.gn-video iframe { display: block; }
.gn-video-wrap { perspective: none; }

/* --------------------------------------------------------------------------
   3D-Gerät (Laptop und Handy, siehe assets/js/device.js)
   -------------------------------------------------------------------------- */
.gn-device {
	position: relative; width: 100%; margin-inline: auto;
	aspect-ratio: 16 / 11;
}
.gn-device.is-phone { aspect-ratio: 3 / 4; max-width: 440px; }
.gn-device canvas { display: block; width: 100% !important; height: 100% !important; }
/* Bis das Gerät gezeichnet ist, bleibt das Ausgangsbild stehen. */
/* Liegt über der Bühne, damit sich beim Wechsel zum 3D-Gerät nichts verschiebt. */
.gn-device__fallback { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; display: block; }
.gn-device.is-live .gn-device__fallback { display: none; }
.gn-device__stage { position: sticky; top: calc(var(--gn-header-h) + 2vh); }

/* --------------------------------------------------------------------------
   Fußzeile
   -------------------------------------------------------------------------- */
.gn-footer { font-size: .85rem; background: var(--gn-cream) !important; color: var(--gn-muted) !important; border-top: 1px solid var(--gn-line-soft); }
.gn-footer :is(p, a) { color: inherit; }
.gn-footer a { text-decoration: none; }
.gn-footer a:hover { color: var(--gn-rose); }
.gn-footer .gn-brand, .gn-footer .gn-brand a { color: var(--gn-ink) !important; }
.gn-footer .wp-block-navigation { gap: 1.4rem; }
/* Monogramm D2 über den Fußzeilen-Links */
.gn-footer__mark { margin: 0 0 1.1rem; line-height: 0; }
.gn-footer__mark.is-center { display: flex; justify-content: center; }
.gn-footer__mark img { display: block; width: 120px; height: auto; }
.gn-footer__mark a:hover { opacity: .8; }
.gn-crown img { width: 72px; }
.gn-disclaimer { font-size: .72rem; color: var(--gn-muted); line-height: 1.6; }

/* Rechtstexte */
.gn-legal h2 { font-size: var(--wp--preset--font-size--xl); margin-top: 2.4em; }
.gn-legal h3 { font-size: var(--wp--preset--font-size--l); margin-top: 1.8em; }
.gn-legal { overflow-wrap: anywhere; }

/* --------------------------------------------------------------------------
   Bewegung
   Alles läuft über den Scrollfortschritt. JS setzt .gn-js auf <html>;
   ohne JavaScript ist jeder Inhalt sichtbar.
   -------------------------------------------------------------------------- */
.gn-js [data-reveal] {
	opacity: 0;
	transform: translate3d(0, 26px, 0);
	transition: opacity .9s var(--gn-ease), transform 1s var(--gn-ease);
	transition-delay: calc(var(--gn-i, 0) * 80ms);
}
.gn-js [data-reveal="left"],
.gn-js [data-reveal="right"],
.gn-js [data-reveal="flip"],
.gn-js [data-reveal="card"] { transform: translate3d(0, 26px, 0); }
.gn-js [data-reveal="zoom"] { transform: scale(.97); }
.gn-js [data-reveal].is-in { opacity: 1; transform: none; }

/* Ganze Abschnitte steigen beim Scrollen ruhig auf. */
@supports (animation-timeline: view()) {
	.gn-js .gn-section[data-depth] > .gn-depth {
		animation: gn-rise linear both;
		animation-timeline: view();
		animation-range: entry 0% entry 85%;
	}
	@keyframes gn-rise {
		from { transform: translate3d(0, 36px, 0); opacity: .5; }
		to { transform: none; opacity: 1; }
	}
	/* Auf dem Handy ohne Aufsteigen (25.10.): Der bewegte Abschnitt liegt dort auf einer eigenen Ebene,
	   und Safari zeichnete den über die Kante ragenden Strich dabei mal halb, mal gar nicht. */
	@media (max-width: 781px) {
		.gn-js .gn-section[data-depth] > .gn-depth { animation: none; }
	}
}

/* Zeiger-Tilt und Glanz entfallen im ruhigen Layout. */
[data-tilt] { transform: none !important; }
.gn-tilt-glare { display: none; }

.gn-marquee { display: none; }

/* Scroll-Fortschritt */
.gn-progress {
	position: fixed; top: 0; left: 0; right: 0; height: 2px; z-index: 100;
	transform-origin: 0 50%; transform: scaleX(0); background: var(--gn-rose); pointer-events: none;
}
@supports (animation-timeline: scroll()) {
	.gn-progress { animation: gn-progress linear both; animation-timeline: scroll(root); }
	@keyframes gn-progress { to { transform: scaleX(1); } }
}

/* Mitlaufende Kaufleiste (wie die Produktleiste bei Apple) */
.gn-buybar {
	position: fixed; top: 0; left: 0; right: 0; z-index: 90;
	background: rgba(255, 255, 255, .8);
	backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px);
	border-bottom: 1px solid var(--gn-line-soft);
	transform: translateY(-100%); opacity: 0;
	transition: transform .45s var(--gn-ease), opacity .3s var(--gn-ease);
}
.gn-buybar.is-visible { transform: none; opacity: 1; }
.admin-bar .gn-buybar { top: 32px; }
.gn-buybar__inner {
	max-width: 1240px; margin: 0 auto; height: 56px; padding: 0 clamp(1rem, 4vw, 2.5rem);
	display: flex; align-items: center; justify-content: space-between; gap: 1rem;
}
.gn-buybar__name { font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: 1.15rem; color: var(--gn-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gn-buybar__right { display: flex; align-items: center; gap: 1rem; flex: none; }
.gn-buybar__price { font-size: .85rem; color: var(--gn-muted); }
.gn-buybar__btn {
	display: inline-block; padding: .5rem 1.1rem; border-radius: 999px; text-decoration: none;
	background: var(--gn-rose); color: #fff !important; font-size: .85rem; font-weight: 500; line-height: 1.3;
	transition: background-color .25s var(--gn-ease);
}
.gn-buybar__btn:hover { background: var(--gn-rose-deep); }
.gn-header { transition: border-color .4s var(--gn-ease), background-color .4s var(--gn-ease), opacity .3s var(--gn-ease); }
.has-buybar .gn-header { opacity: 0; pointer-events: none; }
@media (max-width: 480px) {
	.gn-buybar__name { font-size: 1rem; }
	.gn-buybar__price { font-size: .8rem; }
}

/* --------------------------------------------------------------------------
   Seitenübergänge
   -------------------------------------------------------------------------- */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: gn-vt-out .35s var(--gn-ease) both; }
::view-transition-new(root) { animation: gn-vt-in .45s var(--gn-ease) both; }
@keyframes gn-vt-out { to { opacity: 0; } }
@keyframes gn-vt-in { from { opacity: 0; transform: translateY(12px); } }

/* --------------------------------------------------------------------------
   Schmale Bildschirme
   -------------------------------------------------------------------------- */
@media (max-width: 781px) {
	.gn-hero { padding-top: 2rem !important; }
	.gn-hero .wp-block-columns { flex-direction: column-reverse; }
	.gn-split.is-reversed-mobile { flex-direction: column-reverse; }
	.gn-band { min-height: 46vh !important; }
	.gn-device__stage { position: static; }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
	.gn-js [data-reveal] { opacity: 1; transform: none; }
	@view-transition { navigation: none; }
}

/* Vollbreite Abschnitte stoßen bündig aneinander */
.wp-block-post-content > .alignfull, .wp-block-post-content > .gn-topbar { margin-block: 0 !important; }

/* --------------------------------------------------------------------------
 * Startseite
 * ------------------------------------------------------------------------ */
.gn-home-hero h1 { font-size: var(--wp--preset--font-size--display); }
.gn-home-hero .gn-hero__media img { aspect-ratio: 4 / 5; object-fit: cover; box-shadow: none; }

.gn-showcase .gn-section-head { margin-bottom: clamp(1.5rem, 4vw, 3rem); }
.gn-showcase .gn-device { max-width: 1080px; }
.gn-showcase.is-night .gn-lead { color: rgba(255, 255, 255, .62); }

.gn-offers > .wp-block-column { display: flex; flex-direction: column; padding: 0 0 1.8rem !important; overflow: hidden; }
.gn-offers > .wp-block-column > :not(.gn-offer__media) { padding-inline: 1.7rem; }
/* Mockups sind freigestellt und liegen direkt auf der Karte, ohne eigene Bildfläche */
.gn-offers .gn-offer__media { margin: 0 0 1.4rem; padding: 1.4rem 1.4rem 0; }
.gn-offers .gn-offer__media img { width: 100%; aspect-ratio: 4 / 3; object-fit: contain; display: block; }
.gn-offers .gn-eyebrow { margin-bottom: .4rem; }
.gn-offer__price { font-family: var(--wp--preset--font-family--heading); font-size: 1.35rem; color: var(--gn-ink) !important; margin-top: auto !important; padding-top: .6rem; }

.gn-free__list { margin-top: clamp(1.6rem, 3vw, 2.4rem) !important; }
.gn-free__item { padding: 1.5rem 0 1.6rem; border-top: 1px solid var(--gn-line, rgba(28, 22, 24, .12)); }
.gn-free__item:last-child { border-bottom: 1px solid var(--gn-line, rgba(28, 22, 24, .12)); }
.gn-free__item > * { margin-block: 0 !important; margin-left: 0 !important; }
.gn-free__kind { font-size: .78rem; letter-spacing: .02em; color: var(--gn-muted); }
.gn-free__item h3 { font-size: 1.35rem; margin-top: .35rem !important; }
.gn-free__item p:not(.gn-free__kind) { color: var(--gn-muted); margin: .5rem 0 0 !important; max-width: 34em; }
.gn-free__item p:has(.gn-textlink) { margin-top: .7rem !important; }
.gn-free__device .gn-device { margin-inline: auto; }
.gn-section-head + :is(.gn-offers, .gn-testimonials) { margin-top: clamp(2rem, 4.5vw, 3.75rem) !important; }
@media (max-width: 600px) {
	.gn-showcase .gn-device { aspect-ratio: 4 / 3; }
}

/* --------------------------------------------------------------------------
   Mockup-Fotos (Bewegung über main.js)
   -------------------------------------------------------------------------- */
.gn-showpiece { margin: 0 auto !important; }
.gn-showpiece img { display: block; width: 100%; height: auto; transform-origin: 50% 70%; will-change: transform, opacity; }
.gn-showpiece.is-laptop { max-width: 920px; }
.gn-showpiece.is-tablet { max-width: 560px; }
.gn-showcase.is-night .gn-showpiece img { filter: drop-shadow(0 40px 60px rgba(0, 0, 0, .55)); }
.gn-free__device .gn-device.is-phone { max-width: 520px; }

/* Hero mit 3D-MacBook: Bühne ohne Rahmen, etwas über die Spalte hinaus */
.gn-hero__device .gn-device { aspect-ratio: 5 / 4; margin-right: -4%; width: 108%; }
@media (max-width: 781px) {
	.gn-hero__device .gn-device { width: 100%; margin-right: 0; aspect-ratio: 4 / 3; }
}

/* --------------------------------------------------------------------------
   Verkaufsseiten (neu getextet, siehe tools/verkaufstexte.py)
   -------------------------------------------------------------------------- */
.gn-sales-hero h1 { font-size: clamp(2.5rem, 5.4vw, 4.6rem); }
.gn-hero__action { gap: 1rem 1.4rem !important; margin-top: 2rem !important; align-items: center; }
.gn-hero__action .wp-block-buttons { margin: 0; }
.gn-hero__action .wp-block-button__link { padding: 1.05rem 2rem; font-size: 1.02rem; box-shadow: 0 18px 38px -18px rgba(232, 66, 121, .75); }
.gn-hero__price { margin: 0 !important; font-size: .95rem; color: var(--gn-muted); }
.gn-sales-hero .gn-chips { margin-top: 1.6rem; }
.gn-sales-hero .gn-chips li { font-size: .9rem; }
.gn-hero__proof { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .7rem; margin-top: 1.8rem; font-size: .88rem; color: var(--gn-muted); }
.gn-hero__proof .gn-stars { margin: 0; }
.gn-hero__proof strong { color: var(--gn-ink); font-weight: 500; }

/* Kennst du das? */
.gn-pain { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: 1px; margin-top: clamp(2rem, 4vw, 3.5rem) !important;
	background: var(--gn-line-soft); border-radius: var(--gn-radius-l); overflow: hidden; border: 1px solid var(--gn-line-soft); }
.gn-pain__item { background: #fff; padding: clamp(1.6rem, 3vw, 2.4rem) !important; margin: 0 !important; text-align: center; }
.gn-pain__item h3 { font-size: 1.2rem; margin: 0 0 .5rem; letter-spacing: -.01em; text-wrap: balance; }
.gn-pain__item p { margin: 0; color: var(--gn-muted); font-size: .97rem; text-wrap: balance; }

/* Geschichte */
.gn-story .wp-block-image img { aspect-ratio: 4 / 5; }
.gn-story__text p:not(.gn-eyebrow):not(.gn-signature) { color: var(--gn-muted); font-size: 1.06rem; max-width: 36em; }
.gn-signature { font-size: 2rem; color: var(--gn-rose); margin-top: 1.2rem; }

/* Vorher / Nachher */
.gn-shift { max-width: 980px; margin: clamp(2rem, 4vw, 3.5rem) auto 0; }
.gn-shift__head, .gn-shift li { display: grid; grid-template-columns: 28px 1fr 28px 1fr; column-gap: 1rem; align-items: center; }
.gn-shift__head { font-size: .78rem; color: var(--gn-muted); padding: 0 0 .8rem; }
.gn-shift__head span:last-child { color: var(--gn-rose); }
.gn-shift ul { list-style: none; margin: 0; padding: 0; }
.gn-shift li { padding: 1.5rem 0; border-top: 1px solid var(--gn-line-soft); font-size: clamp(1.02rem, 1.6vw, 1.3rem); line-height: 1.35; }
.gn-shift li:last-child { border-bottom: 1px solid var(--gn-line-soft); }
.gn-shift__from { color: var(--gn-muted); text-decoration: line-through; text-decoration-color: rgba(29, 20, 24, .25); text-decoration-thickness: 1px; }
.gn-shift__to { font-family: var(--wp--preset--font-family--heading); font-weight: 700; color: var(--gn-ink); }
.gn-shift__arrow { justify-self: center; width: 28px; height: 28px; border-radius: 50%; background: rgba(52, 199, 89, .14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f9d47' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 14px no-repeat; }
.gn-shift__no { width: 28px; height: 28px; border-radius: 50%; background: rgba(255, 69, 58, .16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff453a' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M7 7l10 10M17 7L7 17'/%3E%3C/svg%3E") center / 12px no-repeat; }
.gn-shift__from { padding-right: 1.5rem; }
@media (max-width: 640px) {
	.gn-shift__head { display: none; }
	.gn-shift li { grid-template-columns: 22px 1fr; column-gap: .75rem; row-gap: .6rem; }
	.gn-shift__from { padding-right: 0; }
	.gn-shift__arrow, .gn-shift__no { width: 22px; height: 22px; background-size: 10px; }
	.gn-shift__arrow { transform: rotate(90deg); }
}

/* Drei Säulen auf Schwarz */
.gn-pillars { gap: clamp(1rem, 2vw, 1.5rem) !important; margin-top: clamp(2rem, 4vw, 3.5rem) !important; }
.gn-pillar { background: #141417; border-radius: var(--gn-radius-l); padding: clamp(1.8rem, 3vw, 2.6rem) !important; }
.gn-pillar__num { font-family: var(--wp--preset--font-family--heading); font-size: 3rem; line-height: 1; color: #ff86ab; margin: 0 0 1.4rem; }
.gn-pillar h3 { font-size: 1.35rem; margin: 0 0 .6rem; }
.gn-pillar p:not(.gn-pillar__num) { margin: 0; }

/* Module als Liste mit Bild */
.gn-lessons { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 32rem), 1fr)); gap: clamp(.9rem, 1.6vw, 1.25rem); margin-top: clamp(2rem, 4vw, 3.5rem) !important; }
.gn-lesson { display: grid !important; grid-template-columns: 132px 1fr; gap: 1.4rem; align-items: center; margin: 0 !important;
	background: #fff; border-radius: var(--gn-radius); padding: 1rem !important; transition: transform .5s var(--gn-ease), box-shadow .5s var(--gn-ease); }
.gn-lesson:hover { transform: translateY(-3px); box-shadow: var(--gn-shadow); }
.gn-lesson__media { margin: 0 !important; }
.gn-lesson__media img { width: 132px; height: 132px; object-fit: cover; border-radius: var(--gn-radius-s); display: block; }
.gn-lesson__body > * { margin-block: 0 !important; }
.gn-lesson__num { font-size: .75rem; color: var(--gn-rose); }
.gn-lesson h3 { font-size: 1.12rem; margin: .25rem 0 .35rem !important; letter-spacing: -.01em; }
.gn-lesson__body p:not(.gn-lesson__num) { font-size: .92rem; color: var(--gn-muted); }
@media (max-width: 480px) {
	.gn-lesson { grid-template-columns: 88px 1fr; gap: 1rem; }
	.gn-lesson__media img { width: 88px; height: 88px; }
}
.gn-lessons + .gn-cta { margin-top: clamp(2rem, 4vw, 3rem) !important; }

/* Stimmen mit Kernsatz */
.gn-quote__highlight { font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: 1.25rem; line-height: 1.3; color: var(--gn-ink); margin: 0 0 1rem; }
.gn-testimonials { gap: clamp(1rem, 2vw, 1.5rem) !important; }

/* Mentorin */
.gn-mentor__stat { display: flex; align-items: baseline; gap: 1rem; flex-wrap: wrap; margin-top: 2rem; padding-top: 1.6rem; border-top: 1px solid var(--gn-line-soft); }
.gn-mentor__stat .gn-stat__num { font-size: clamp(2.6rem, 6vw, 3.6rem); }
.gn-mentor__stat p:last-child { margin: 0; color: var(--gn-muted); }

/* Angebot */
.gn-pricing .gn-price { box-shadow: var(--gn-shadow-l); border: 0; }
.gn-price__note { color: var(--gn-muted); font-size: .9rem; margin: 0 0 .4rem; }
.gn-price__secure { font-size: .8rem; color: var(--gn-muted); margin-top: 1rem; }
.gn-price .wp-block-button__link { padding-block: 1.05rem; font-size: 1.05rem; }

/* Abschluss */
.gn-final-section { padding-block: clamp(5rem, 12vw, 10rem) !important; }
.gn-final__title { font-size: clamp(2.2rem, 5vw, 4rem); line-height: 1.08; letter-spacing: -.02em; }
.gn-final .gn-lead { color: rgba(255, 255, 255, .62); margin-bottom: 2.2rem; }
.gn-section-head + .gn-price-wrap { margin-top: clamp(2rem, 4vw, 3rem) !important; }

/* --------------------------------------------------------------------------
   Double-Opt-in-Seiten
   -------------------------------------------------------------------------- */
.gn-optin-section { min-height: calc(92vh - var(--gn-header-h)); display: grid; align-items: center; }
.gn-optin h1 { font-size: clamp(2.6rem, 6vw, 4.8rem); line-height: 1.04; letter-spacing: -.022em; margin: .2em 0 .35em; }
.gn-optin__icon { position: relative; width: 112px; height: 112px; margin: 0 auto 1.6rem; display: grid; place-items: center;
	border-radius: 32px; background: #fff; color: var(--gn-rose); box-shadow: var(--gn-shadow-l); }
.gn-optin__icon svg { width: 58px; height: 58px; }
.gn-optin__icon.is-mail { animation: gn-float 3.6s var(--gn-ease) infinite; }
.gn-optin__icon.is-check { border-radius: 50%; background: var(--gn-rose); color: #fff; animation: gn-pop .8s var(--gn-ease) both; }
.gn-optin__badge { position: absolute; top: -8px; right: -8px; width: 30px; height: 30px; border-radius: 50%; background: var(--gn-rose); color: #fff;
	font-size: .85rem; font-weight: 500; display: grid; place-items: center; box-shadow: 0 0 0 4px var(--gn-cream); animation: gn-pulse 2s ease-out infinite; }
.gn-optin__ring { stroke-dasharray: 176; stroke-dashoffset: 176; animation: gn-draw .9s .25s var(--gn-ease) forwards; }
.gn-optin__tick { stroke-dasharray: 40; stroke-dashoffset: 40; animation: gn-draw .5s .9s var(--gn-ease) forwards; }
@keyframes gn-float { 50% { transform: translateY(-8px) rotate(-2deg); } }
@keyframes gn-pop { from { transform: scale(.4); opacity: 0; } 60% { transform: scale(1.08); opacity: 1; } to { transform: none; } }
@keyframes gn-draw { to { stroke-dashoffset: 0; } }
@keyframes gn-pulse { 0% { box-shadow: 0 0 0 4px var(--gn-cream), 0 0 0 4px rgba(232, 66, 121, .5); } 100% { box-shadow: 0 0 0 4px var(--gn-cream), 0 0 0 18px rgba(232, 66, 121, 0); } }

.gn-optin__steps { list-style: none; padding: 0; margin: 2.6rem auto 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; max-width: 680px; counter-reset: none; text-align: left; }
.gn-optin__steps li { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 .6rem; }
.gn-optin__steps li::after { content: ""; position: absolute; top: 17px; left: calc(50% + 26px); right: calc(-50% + 26px); height: 2px; background: var(--gn-line); border-radius: 2px; }
.gn-optin__steps li:last-child::after { content: none; }
.gn-optin__steps li.is-done::after { background: var(--gn-rose); }
.gn-optin__dot { flex: none; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; font-size: .9rem; font-weight: 500;
	background: #fff; color: var(--gn-muted); border: 1px solid var(--gn-line); position: relative; z-index: 1; }
.gn-optin__steps li.is-done .gn-optin__dot { background: var(--gn-rose); border-color: var(--gn-rose); color: #fff; }
.gn-optin__steps li.is-active .gn-optin__dot { border-color: var(--gn-rose); color: var(--gn-rose); animation: gn-pulse-ring 1.8s ease-out infinite; }
@keyframes gn-pulse-ring { 0% { box-shadow: 0 0 0 0 rgba(232, 66, 121, .45); } 100% { box-shadow: 0 0 0 12px rgba(232, 66, 121, 0); } }
.gn-optin__steps strong { display: block; font-weight: 500; font-size: .95rem; color: var(--gn-ink); margin-top: .7rem; }
.gn-optin__steps small { display: block; font-size: .8rem; color: var(--gn-muted); line-height: 1.4; margin-top: .2rem; }
@media (max-width: 640px) {
	.gn-optin__steps { grid-template-columns: 1fr; gap: 1.1rem; max-width: 320px; }
	.gn-optin__steps li { flex-direction: row; align-items: flex-start; text-align: left; gap: .8rem; padding: 0; }
	.gn-optin__steps li::after { top: 40px; bottom: -14px; left: 17px; right: auto; width: 2px; height: auto; }
	.gn-optin__steps strong { margin-top: .45rem; }
}
.gn-optin .wp-block-buttons { margin-top: 2.4rem; }
.gn-optin__note { margin: 1.6rem auto 0; max-width: 34rem; padding: .85rem 1.2rem; border-radius: 16px;
  background: rgba(232, 66, 121, .09); color: var(--gn-ink); font-size: .9rem; line-height: 1.6; text-align: center; }
.gn-optin__note strong { font-weight: 500; }
.gn-optin__apps { margin-top: 2.6rem; text-align: center; }
.gn-optin__apps p { font-size: .8rem; color: var(--gn-muted); margin: 0 0 .8rem; }
.gn-optin__apps div { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; }
.gn-optin__app { display: inline-block; padding: .65rem 1.2rem; border-radius: 999px; background: #fff; color: var(--gn-ink); text-decoration: none;
	font-size: .9rem; border: 1px solid var(--gn-line-soft); transition: border-color .3s, transform .3s var(--gn-ease); }
.gn-optin__app:hover { border-color: var(--gn-rose); transform: translateY(-2px); }

/* Module mit Videoliste (Heal & Level Up) */
.gn-lessons.has-videos .gn-lesson { align-items: start; }
.gn-lesson__videos { list-style: none; padding: 0 !important; margin: .8rem 0 0 !important; display: flex; flex-wrap: wrap; gap: .4rem; }
.gn-lesson__videos li { font-size: .76rem; color: var(--gn-ink); background: var(--gn-cream); border-radius: 999px; padding: .28rem .7rem; }
.gn-lesson.is-bonus { background: #0b0b0d; color: rgba(255, 255, 255, .7); }
.gn-lesson.is-bonus h3 { color: #fff; }
.gn-lesson.is-bonus .gn-lesson__num { color: #ff86ab; }
.gn-lesson.is-bonus .gn-lesson__body p:not(.gn-lesson__num) { color: rgba(255, 255, 255, .62); }
.gn-lesson.is-bonus .gn-lesson__videos li { background: rgba(255, 255, 255, .1); color: #fff; }
.gn-quote__initial { flex: 0 0 44px; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center;
	background: var(--gn-rose-soft); color: var(--gn-rose); font-family: var(--wp--preset--font-family--heading); font-weight: 700; }
.gn-hero__plain img { box-shadow: none !important; border-radius: 0 !important; }
.gn-hero__plain .wp-block-image { margin: 0; }

/* YouTube mit Zwei-Klick-Lösung */
.gn-yt { position: relative; display: grid; place-items: center; background: radial-gradient(120% 120% at 50% 40%, #2a1a20 0%, #0b0b0d 70%); }
.gn-yt__play { width: 84px; height: 84px; border-radius: 50%; border: 0; cursor: pointer; background: var(--gn-rose);
	display: grid; place-items: center; box-shadow: 0 20px 50px -18px rgba(232, 66, 121, .8); transition: transform .4s var(--gn-ease); }
.gn-yt__play:hover { transform: scale(1.06); }
.gn-yt__play span { width: 0; height: 0; border-left: 22px solid #fff; border-top: 14px solid transparent; border-bottom: 14px solid transparent; margin-left: 6px; }
.gn-yt__note { position: absolute; left: 1.2rem; right: 1.2rem; bottom: 1rem; margin: 0; text-align: center; font-size: .75rem; color: rgba(255, 255, 255, .6); }
.gn-yt__note a { color: #fff; }

/* ---------------- Cookie-Banner ---------------- */
.gn-cc {
	position: fixed; z-index: 200; left: 0; right: 0; bottom: 0; padding: clamp(.75rem, 2vw, 1.5rem);
	display: flex; justify-content: center; pointer-events: none;
	opacity: 0; transform: translateY(24px); transition: opacity .4s var(--gn-ease), transform .5s var(--gn-ease);
}
.gn-cc.is-open { opacity: 1; transform: none; }
.gn-cc__card {
	pointer-events: auto; width: 100%; max-width: 560px; max-height: calc(100vh - 2rem); overflow: auto;
	background: rgba(255, 255, 255, .92); backdrop-filter: saturate(180%) blur(24px); -webkit-backdrop-filter: saturate(180%) blur(24px);
	border: 1px solid var(--gn-line-soft); border-radius: var(--gn-radius-l); box-shadow: 0 24px 60px -20px rgba(40, 20, 30, .35);
	padding: clamp(1.25rem, 3vw, 1.75rem); color: var(--gn-ink);
}
.gn-cc__title { font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: 1.25rem; margin: 0 0 .5rem; }
.gn-cc__text { font-size: .85rem; line-height: 1.55; color: var(--gn-muted); margin: 0 0 1rem; }
.gn-cc__text a { color: var(--gn-ink); }
.gn-cc__opts { display: none; margin: 0 0 1rem; border-top: 1px solid var(--gn-line-soft); }
.gn-cc.is-settings .gn-cc__opts { display: block; }
.gn-cc__opt { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem 0; border-bottom: 1px solid var(--gn-line-soft); cursor: pointer; }
.gn-cc__opt.is-locked { cursor: default; }
.gn-cc__opt strong { display: block; font-size: .9rem; }
.gn-cc__opt small { display: block; font-size: .78rem; color: var(--gn-muted); }
.gn-cc__opt input { position: absolute; opacity: 0; pointer-events: none; }
.gn-cc__opt i { flex: none; position: relative; width: 44px; height: 26px; border-radius: 999px; background: #d9d2cc; transition: background-color .25s var(--gn-ease); }
.gn-cc__opt i::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .25); transition: transform .25s var(--gn-ease); }
.gn-cc__opt input:checked + i { background: var(--gn-rose); }
.gn-cc__opt input:checked + i::after { transform: translateX(18px); }
.gn-cc__opt.is-locked input:checked + i { background: #b9aea6; }
.gn-cc__opt input:focus-visible + i { outline: 2px solid var(--gn-ink); outline-offset: 2px; }
.gn-cc__actions { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.gn-cc__btn {
	font: inherit; font-size: .9rem; font-weight: 500; padding: .8rem 1rem; border-radius: 999px; cursor: pointer;
	border: 1px solid var(--gn-ink); background: var(--gn-ink); color: #fff; transition: opacity .2s var(--gn-ease);
}
.gn-cc__btn:hover { opacity: .85; }
.gn-cc__btn.is-save { display: none; grid-column: 1 / -1; background: transparent; color: var(--gn-ink); }
.gn-cc.is-settings .gn-cc__btn.is-save { display: block; }
.gn-cc__link { grid-column: 1 / -1; justify-self: center; font: inherit; font-size: .8rem; background: none; border: 0; color: var(--gn-muted); text-decoration: underline; cursor: pointer; padding: .25rem; }
.gn-cc.is-settings .gn-cc__link { display: none; }
@media (max-width: 420px) { .gn-cc__actions { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .gn-cc { transition: none; } }

/* ---------------- Anmeldeformular (Brevo) ---------------- */
.gn-signup {
	position: relative; display: grid; gap: .9rem; margin: 2rem 0 0; max-width: 540px; text-align: left;
	padding: clamp(1.25rem, 3vw, 1.75rem); border-radius: 24px;
	background: #fff; border: 1px solid var(--gn-line-soft);
	box-shadow: 0 30px 60px -30px rgba(60, 20, 35, .28), 0 2px 6px rgba(60, 20, 35, .04);
}
.gn-signup__title { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .7rem; font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: 1.12rem; line-height: 1.3; color: var(--gn-ink); }
.gn-signup__badge { font-family: var(--wp--preset--font-family--body); font-size: .72rem; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; color: var(--gn-rose); background: var(--gn-rose-soft); padding: .3rem .65rem; border-radius: 999px; }
.gn-signup__fields { display: grid; grid-template-columns: 1fr 1.35fr; gap: .6rem; }
.gn-field { display: block; position: relative; }
.gn-field span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.gn-field input {
	width: 100%; box-sizing: border-box; font: inherit; font-size: 1rem; color: var(--gn-ink);
	padding: 1.05rem 1.15rem; border-radius: 14px; border: 1px solid transparent; background: var(--gn-cream);
	transition: border-color .2s var(--gn-ease), box-shadow .2s var(--gn-ease), background-color .2s var(--gn-ease);
}
.gn-field input::placeholder { color: #9b918b; }
.gn-field input:focus { outline: none; background: #fff; border-color: var(--gn-rose); box-shadow: 0 0 0 4px rgba(232, 66, 121, .14); }
.gn-signup__consent { display: flex; gap: .7rem; align-items: flex-start; font-size: .78rem; line-height: 1.5; color: var(--gn-muted); cursor: pointer; }
.gn-signup__consent input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.gn-signup__consent i { flex: none; width: 20px; height: 20px; margin-top: .05rem; border-radius: 6px; border: 1.5px solid #cbbfb7; background: #fff; display: grid; place-items: center; transition: background-color .2s var(--gn-ease), border-color .2s var(--gn-ease); }
.gn-signup__consent i::after { content: ""; width: 10px; height: 6px; border: 2px solid #fff; border-top: 0; border-right: 0; transform: rotate(-45deg) translate(1px, -1px) scale(0); transition: transform .2s var(--gn-ease); }
.gn-signup__consent input:checked + i { background: var(--gn-rose); border-color: var(--gn-rose); }
.gn-signup__consent input:checked + i::after { transform: rotate(-45deg) translate(1px, -1px) scale(1); }
.gn-signup__consent input:focus-visible + i { outline: 2px solid var(--gn-ink); outline-offset: 2px; }
.gn-signup__consent a { color: inherit; }
.gn-signup__btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .6rem; width: auto; justify-self: center; max-width: 100%;
	font: inherit; font-size: 1.02rem; font-weight: 500; color: #fff; cursor: pointer; border: 0; border-radius: 999px;
	padding: .95rem 2rem; background: var(--gn-rose); box-shadow: 0 18px 38px -16px rgba(232, 66, 121, .8);
	transition: background-color .25s var(--gn-ease), transform .25s var(--gn-ease), box-shadow .25s var(--gn-ease);
}
.gn-signup__btn svg { transition: transform .25s var(--gn-ease); }
.gn-signup__btn:hover { background: var(--gn-rose-deep); transform: translateY(-1px); box-shadow: 0 22px 44px -16px rgba(232, 66, 121, .9); }
.gn-signup__btn:hover svg { transform: translateX(4px); }
.gn-signup__btn:disabled { opacity: .7; cursor: progress; transform: none; }
.gn-signup__err { margin: 0; padding: .7rem 1rem; border-radius: 14px; background: rgba(232, 66, 121, .1); color: var(--gn-rose); font-size: .86rem; text-align: center; }
.gn-signup__note { margin: 0; display: flex; align-items: center; justify-content: center; gap: .4rem; font-size: .78rem; color: var(--gn-muted); text-align: center; }
.gn-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.gn-signup--card { margin: 1.4rem auto 0; }
.gn-final .gn-signup { margin: 0 auto; background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .12); box-shadow: 0 40px 80px -40px rgba(0, 0, 0, .5);
	backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.gn-final .gn-signup__title { color: #fff; }
.gn-final .gn-signup__badge { background: rgba(232, 66, 121, .18); color: #ff8fb4; }
.gn-final .gn-field input { background: rgba(255, 255, 255, .08); color: #fff; }
.gn-final .gn-field input:focus { background: rgba(255, 255, 255, .12); }
.gn-final .gn-field input::placeholder { color: rgba(255, 255, 255, .5); }
.gn-final .gn-signup__consent i { background: transparent; border-color: rgba(255, 255, 255, .35); }
.gn-final .gn-signup__consent, .gn-final .gn-signup__note { color: rgba(255, 255, 255, .62); }
#kaufen { scroll-margin-top: 80px; }
@media (max-width: 600px) { .gn-signup__fields { grid-template-columns: 1fr; } }

/* ---------------- Wünsche 2026-10-11 ---------------- */
/* Haken grün, Kreuz rot */
.gn-fit > .wp-block-column:first-child .gn-card__icon { background: rgba(52, 199, 89, .14); color: #1f9d47; }
.gn-fit > .wp-block-column:last-child .gn-card__icon { background: rgba(255, 69, 58, .16); color: #ff453a; }
.gn-fit > .wp-block-column:first-child li::before { color: #1f9d47; }
.gn-fit > .wp-block-column:last-child li::before { color: #ff453a; opacity: 1; }
/* Followerzahl pink, blauer Haken */
.gn-stat__num, .gn-section.is-night .gn-stat__num, .gn-hero__proof strong { color: var(--gn-rose); }
.gn-verified { display: inline-block; width: 1.05em; height: 1.05em; vertical-align: -.16em; margin-left: .3em; }
.gn-insta-ico { display: inline-block; width: 1.05em; height: 1.05em; vertical-align: -.16em; margin-left: .35em; flex: none; }
.wp-block-button__link .gn-insta-ico { width: 1.15em; height: 1.15em; margin-left: .5em; }
/* Kaufleiste: transparenter, größerer Button */
.gn-buybar { background: rgba(255, 255, 255, .42); backdrop-filter: saturate(180%) blur(24px); -webkit-backdrop-filter: saturate(180%) blur(24px); border-bottom-color: rgba(255, 255, 255, .35); }
.gn-buybar__inner { height: 68px; }
.gn-buybar__price { font-size: .95rem; color: var(--gn-ink); }
.gn-buybar__btn { padding: .8rem 1.7rem; font-size: 1rem; box-shadow: 0 10px 24px -12px rgba(232, 66, 121, .8); }
@media (max-width: 480px) { .gn-buybar__price.is-free { display: none; } .gn-buybar__inner { height: 62px; } .gn-buybar__btn { padding: .7rem 1.2rem; font-size: .92rem; } }

/* ---------------- 1:1 Coaching (Startseite) ---------------- */
.gn-coach { margin-top: clamp(1.5rem, 3vw, 2.2rem) !important; background: #fff; border-radius: 28px; overflow: hidden; gap: 0 !important;
	box-shadow: 0 30px 60px -36px rgba(60, 20, 35, .3); }
.gn-coach__mediacol { align-self: stretch !important; }
.gn-coach__media, .gn-coach__media img { height: 100%; margin: 0; }
.gn-coach__media img { width: 100%; object-fit: cover; object-position: 50% 20%; min-height: 360px; display: block; }
.gn-coach__text { padding: clamp(1.75rem, 4vw, 3.5rem) !important; }
.gn-coach__text h3 { font-size: clamp(1.8rem, 3vw, 2.5rem); margin: .3rem 0 .8rem; }
.gn-coach__list { list-style: none; padding: 0; margin: 1.2rem 0; display: grid; grid-template-columns: 1fr 1fr; gap: .7rem 1.2rem; font-size: .95rem; }
.gn-coach__list li { display: flex; gap: .55rem; align-items: flex-start; }
.gn-coach__list svg { flex: none; width: 20px; height: 20px; color: var(--gn-rose); margin-top: .1rem; }
@media (max-width: 781px) {
	.gn-coach__list { grid-template-columns: 1fr; }
	.gn-coach__media img { min-height: 0; aspect-ratio: 4 / 3; }
}

/* ---------------- Coaching-Anfrage ---------------- */
.gn-req-wrap { max-width: 760px; margin: clamp(2rem, 4vw, 3rem) auto 0; }
.gn-req { display: grid; gap: 1.4rem; padding: clamp(1.4rem, 4vw, 2.6rem); border-radius: 28px; background: #fff; border: 1px solid var(--gn-line-soft);
	box-shadow: 0 30px 60px -30px rgba(60, 20, 35, .28); text-align: left; }
.gn-req fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.gn-req legend { float: left; width: 100%; display: flex; align-items: center; gap: .7rem; padding: 0; margin-bottom: 1rem; font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: 1.25rem; color: var(--gn-ink); }
.gn-req legend b { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--gn-rose-soft); color: var(--gn-rose); font-family: var(--wp--preset--font-family--body); font-size: .9rem; font-weight: 600; }
.gn-req fieldset + fieldset { padding-top: 1.4rem; border-top: 1px solid var(--gn-line-soft); }
.gn-req__grid { clear: both; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.gn-req__field { display: grid; gap: .45rem; }
.gn-req__field.is-wide { grid-column: 1 / -1; }
.gn-req__field > span { font-size: .88rem; font-weight: 500; color: var(--gn-ink); }
.gn-req input[type="text"], .gn-req input[type="email"], .gn-req input[type="tel"], .gn-req select, .gn-req textarea {
	width: 100%; box-sizing: border-box; font: inherit; font-size: 1rem; color: var(--gn-ink);
	padding: .95rem 1.1rem; border-radius: 14px; border: 1px solid transparent; background: var(--gn-cream);
	transition: border-color .2s var(--gn-ease), box-shadow .2s var(--gn-ease), background-color .2s var(--gn-ease);
}
.gn-req textarea { resize: vertical; min-height: 120px; }
.gn-req select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%23e84279' stroke-width='2'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 1rem center; background-size: 18px; padding-right: 2.8rem; }
.gn-req input:focus, .gn-req select:focus, .gn-req textarea:focus { outline: none; background-color: #fff; border-color: var(--gn-rose); box-shadow: 0 0 0 4px rgba(232, 66, 121, .14); }
.gn-req__chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.gn-req__chip { position: relative; cursor: pointer; }
.gn-req__chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.gn-req__chip span { display: inline-block; padding: .7rem 1.1rem; border-radius: 999px; background: var(--gn-cream); border: 1px solid transparent; font-size: .95rem; transition: all .2s var(--gn-ease); }
.gn-req__chip input:checked + span { background: var(--gn-rose); color: #fff; }
.gn-req__chip input:focus-visible + span { outline: 2px solid var(--gn-ink); outline-offset: 2px; }
.gn-req__consent { font-size: .85rem; }
.gn-req__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.gn-req__error { margin: 0; padding: .9rem 1.1rem; border-radius: 14px; background: rgba(255, 69, 58, .1); color: #c4271c; font-size: .92rem; }
@media (max-width: 600px) { .gn-req__grid { grid-template-columns: 1fr; } }
.gn-req .gn-signup__btn svg { width: 20px; height: 20px; flex: none; }
.gn-coach .gn-eyebrow { font-size: .85rem; opacity: 1; }

/* ---------------- Hauptmenü ---------------- */
.gn-nav { display: flex; align-items: center; }
.gn-nav__links { list-style: none; margin: 0; padding: 0; display: flex; gap: clamp(1.1rem, 2.4vw, 2.2rem); }
.gn-nav__links a { text-decoration: none; font-size: .86rem; color: rgba(29, 20, 24, .82); transition: color .25s; }
.gn-nav__links a:hover { color: var(--gn-ink); }
.gn-nav__toggle { display: none; position: relative; z-index: 120; width: 44px; height: 44px; margin-right: -10px; border: 0; background: none; cursor: pointer; border-radius: 50%; }
.gn-nav__toggle span { position: absolute; left: 12px; right: 12px; height: 1.5px; background: var(--gn-ink); border-radius: 2px; transition: transform .45s var(--gn-ease), top .45s var(--gn-ease); }
.gn-nav__toggle span:first-child { top: 17px; }
.gn-nav__toggle span:last-child { top: 25px; }
.gn-menu-open .gn-nav__toggle span:first-child { top: 21px; transform: rotate(45deg); }
.gn-menu-open .gn-nav__toggle span:last-child { top: 21px; transform: rotate(-45deg); }
.gn-menu { position: fixed; inset: 0; z-index: 110; background: rgba(29, 20, 24, .14);
	opacity: 0; visibility: hidden; transition: opacity .35s var(--gn-ease), visibility 0s linear .35s; }
.gn-menu[hidden] { display: none; }
.gn-menu.is-open { opacity: 1; visibility: visible; transition: opacity .35s var(--gn-ease); }
.gn-menu__inner { position: absolute; top: calc(var(--gn-header-h) + 6px); left: auto; right: 12px; width: min(230px, calc(100vw - 24px));
	max-height: calc(100dvh - var(--gn-header-h) - 24px); overflow-y: auto; box-sizing: border-box;
	padding: .2rem 1rem .7rem; border-radius: 20px; text-align: right;
	background: rgba(255, 255, 255, .64); border: 1px solid rgba(255, 255, 255, .6);
	backdrop-filter: saturate(180%) blur(30px); -webkit-backdrop-filter: saturate(180%) blur(30px);
	box-shadow: 0 30px 60px -24px rgba(60, 20, 35, .35);
	transform-origin: top right; transform: translateY(-10px) scale(.97);
	transition: transform .45s var(--gn-ease); }
.gn-menu.is-open .gn-menu__inner { transform: none; }
.gn-menu__links { list-style: none; margin: 0; padding: 0; }
.gn-menu__links li { border-bottom: 1px solid rgba(29, 20, 24, .08); opacity: 0; transform: translateY(8px);
	transition: opacity .4s var(--gn-ease), transform .4s var(--gn-ease); transition-delay: calc(.04s * var(--i) + .06s); }
.gn-menu.is-open .gn-menu__links li { opacity: 1; transform: none; }
.gn-menu__links a { display: flex; flex-direction: column; align-items: flex-end; gap: 0; padding: .5rem 0; text-decoration: none; color: var(--gn-ink); }
.gn-menu__title { font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: .95rem; line-height: 1.2; }
.gn-menu__sub { font-size: .68rem; color: var(--gn-muted); }
.gn-menu__links a:active .gn-menu__title, .gn-menu__links a:hover .gn-menu__title { color: var(--gn-rose); }
.gn-menu__foot { padding-top: .6rem; justify-items: end !important; display: grid; gap: 1rem; justify-items: center;
	opacity: 0; transition: opacity .5s var(--gn-ease) .4s; }
.gn-menu.is-open .gn-menu__foot { opacity: 1; }
.gn-menu__cta { display: block; width: 100%; box-sizing: border-box; text-align: center; padding: .75rem 1.2rem; border-radius: 999px;
	background: var(--gn-rose); color: #fff; text-decoration: none; font-weight: 500; font-size: .88rem; box-shadow: 0 18px 38px -16px rgba(232, 66, 121, .8); }
.gn-menu__insta { display: grid; place-items: center; width: 36px; height: 36px; margin-right: -6px; color: var(--gn-ink); border-radius: 50%; transition: color .2s; }
.gn-menu__insta svg { width: 22px; height: 22px; }
.gn-menu__insta:hover { color: var(--gn-rose); }
body.gn-menu-open { overflow: hidden; }
.gn-menu-open .gn-header { z-index: 115; opacity: 1 !important; pointer-events: auto !important; }
@media (max-width: 900px) {
	.gn-nav__links { display: none; }
	.gn-nav__toggle { display: block; }
}
@media (prefers-reduced-motion: reduce) {
	.gn-menu, .gn-menu__links li, .gn-menu__foot, .gn-nav__toggle span { transition: none !important; }
}

/* --------------------------------------------------------------------------
   Gestaltung vom 25.10., in tools/build_wordpress.py schaltbar
   (TEXTUR_3D, STRICH, ECKEN)
   -------------------------------------------------------------------------- */
/* Struktur hinter den 3D-Szenen, ganz leicht durchscheinend, oben und unten ausgeblendet */
.gn-section.has-seide::after {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background: center / cover no-repeat;
	-webkit-mask-image: linear-gradient(to bottom, transparent, #000 22%, #000 78%, transparent);
	mask-image: linear-gradient(to bottom, transparent, #000 22%, #000 78%, transparent);
}
.gn-section.has-seide::after { background-image: url(../img/seide.webp); opacity: .24; mix-blend-mode: multiply; }
/* Coaching-Anfrage: nur ein Hauch, die lange Seite soll ruhig bleiben */
.gn-req-section.has-seide::after { opacity: .14; }
/* Kostenlos starten auf der Startseite: dezenter, weniger Beige, die Falten bleiben sichtbar (25.10.) */
.gn-kostenlos.has-seide::after { opacity: .12; filter: saturate(.35) brightness(1.1) contrast(1.9); }
/* Auf dem Handy: das 3D-Handy rückt an den Strich heran, über ihm ist die Bühne leer */
@media (max-width: 781px) {
	.gn-kostenlos .gn-free__device .gn-device.is-phone { margin-top: calc(min(440px, 100%) * -0.2) !important; }
}
/* Auf Schwarz hellt die Seide auf, statt abzudunkeln */
.gn-section.is-night.has-seide::after { opacity: .09; mix-blend-mode: screen; }

/* Feiner senkrechter Strich als Übergang über einem Abschnittskopf */
.has-strich::before {
	content: ""; display: block; width: 1px; height: clamp(56px, 7vw, 104px);
	margin: calc(var(--wp--preset--spacing--60) * -0.4) auto clamp(1.6rem, 3vw, 2.4rem) !important;
	background: currentColor; opacity: .5;
	/* Eigene Ebene, damit Safari den über die Kante ragenden Teil beim Scrollen immer über dem
	   vorigen Abschnitt zeichnet; vorher war er auf dem iPhone mal halb, mal gar nicht da (25.10.). */
	position: relative; z-index: 3; transform: translateZ(0); will-change: transform;
}

/* Zwei runde, zwei eckige Ecken (oben links und unten rechts rund) */
:root { --gn-ecke: clamp(48px, 7vw, 120px); --gn-ecke-s: clamp(32px, 4vw, 56px); }
.is-ecke img { border-radius: var(--gn-ecke) 0 var(--gn-ecke) 0 !important; }
/* Titelbild der Startseite gespiegelt: oben rechts und unten links rund */
.is-ecke.is-ecke-gedreht img { border-radius: 0 var(--gn-ecke) 0 var(--gn-ecke) !important; }
/* Über mich: feine rosé Rahmenlinie, versetzt hinter dem Bild (Variante B vom 25.10.) */
:is(.gn-section.gn-about, .gn-section:has(.gn-about)) .wp-block-image.is-ecke { isolation: isolate; }
:is(.gn-section.gn-about, .gn-section:has(.gn-about)) .wp-block-image.is-ecke::after {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	transform: translate(clamp(12px, 1.6vw, 22px), clamp(12px, 1.6vw, 22px));
	border: 1px solid rgba(232, 66, 121, .6); border-radius: var(--gn-ecke) 0 var(--gn-ecke) 0;
}
/* Produktkarten behalten ihre runden Ecken, nur das Chatfenster der Stimmen bekommt die Form */
.gn-dms.is-chat.has-ecken .gn-quote.gn-dm { border-radius: var(--gn-ecke-s) 0 var(--gn-ecke-s) 0; }

/* Kopfbereich der Startseite, Fassungen vom 25.10. (Schalter KOPF_STARTSEITE in tools/build_wordpress.py) */
.gn-home-hero:is(.is-kopf-kampagne, .is-kopf-magazin, .is-kopf-bogen)::after {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background: url(../img/seide.webp) center / cover no-repeat; opacity: .24; mix-blend-mode: multiply;
	-webkit-mask-image: linear-gradient(to bottom, transparent, #000 25%); mask-image: linear-gradient(to bottom, transparent, #000 25%);
}
.gn-home-hero:is(.is-kopf-magazin, .is-kopf-bogen),
body:has(.gn-home-hero:is(.is-kopf-magazin, .is-kopf-bogen)) .gn-header:not(.is-scrolled) { background: var(--gn-cream); }

/* B Kampagne: Schwarz mit Seidenschimmer, Foto als helle Karte mit rosé Linie, Kopfzeile oben dunkel */
.gn-home-hero.is-kopf-kampagne { background: #0e0e10; color: rgba(255, 255, 255, .72); }
.gn-home-hero.is-kopf-kampagne::after { opacity: .13; mix-blend-mode: screen; }
.gn-home-hero.is-kopf-kampagne h1 { color: #fff; font-size: clamp(3rem, 7.4vw, 6.6rem); line-height: 1; letter-spacing: -.02em; }
.gn-home-hero.is-kopf-kampagne h1 em { color: #ff4f8b; }
.gn-home-hero.is-kopf-kampagne .gn-lead { color: rgba(255, 255, 255, .7); }
.gn-home-hero.is-kopf-kampagne .gn-eyebrow { color: #ff86ab; }
.gn-home-hero.is-kopf-kampagne .is-style-outline .wp-block-button__link { color: #fff !important; border-color: rgba(255, 255, 255, .55) !important; background: transparent !important; }
.gn-home-hero.is-kopf-kampagne .gn-hero__media figure { position: relative; isolation: isolate; }
.gn-home-hero.is-kopf-kampagne .gn-hero__media figure::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	transform: translate(-22px, 22px); border: 1px solid rgba(255, 92, 147, .75); border-radius: 0 var(--gn-ecke) 0 var(--gn-ecke); }
body:has(.is-kopf-kampagne) .gn-header:not(.is-scrolled) { background: #0e0e10; }
body:has(.is-kopf-kampagne) .gn-header:not(.is-scrolled) .gn-brand a,
body:has(.is-kopf-kampagne) .gn-header:not(.is-scrolled) .gn-nav__links a { color: rgba(255, 255, 255, .88); }
body:has(.is-kopf-kampagne) .gn-header:not(.is-scrolled) .gn-brand a span { color: #ff5c93; }
body:has(.is-kopf-kampagne):not(.gn-menu-open) .gn-header:not(.is-scrolled) .gn-nav__toggle span { background: #fff; }

/* C Magazin: Foto randlos rechts und weich eingeblendet, die große Überschrift läuft ins Bild */
.gn-home-hero.is-kopf-magazin > .gn-depth { animation: none !important; transform: none !important; }
.gn-home-hero.is-kopf-magazin .gn-hero__text { position: relative; z-index: 2; }
.gn-home-hero.is-kopf-magazin h1 { font-size: clamp(3rem, 7.6vw, 6.9rem); line-height: .98; letter-spacing: -.035em; }

/* Magazin: Kopf und Laptop-Abschnitt laufen wie ein Bild ineinander (25.10.).
   Oben mit der Kopfzeile reines Weiß, nach unten nur ein Hauch Creme; kräftiger wird es erst
   ab „Online-Coaching und Kurse“. Die Seide ist EIN Bild über beide Abschnitte: main.js setzt
   dieselbe Größe und verschiebt sie im Laptop-Abschnitt um die Höhe des Kopfes, an der Naht
   blendet nichts aus. Sie liegt schräg: links beginnt sie auf halber Höhe zwischen Logo und
   „Coaching für Frauen“, die Kante läuft unten links am Foto vorbei, oben und rechts bleibt
   alles weiß (--gn-seide-winkel, --gn-seide-start, --gn-seide-weich). */
body:has(.gn-home-hero.is-kopf-magazin) .gn-header:not(.is-scrolled) { background: #fff; }
.gn-home-hero.is-kopf-magazin { background: linear-gradient(to bottom, #fff 0%, #fff 45%, #fbf9f6 100%); }
.gn-home-hero.is-kopf-magazin::after {
	background-size: var(--gn-seide-groesse, cover); background-position: center top;
	-webkit-mask-image: linear-gradient(var(--gn-seide-winkel, 180deg), transparent var(--gn-seide-start, 40%), #000 calc(var(--gn-seide-start, 40%) + var(--gn-seide-weich, 180px)));
	mask-image: linear-gradient(var(--gn-seide-winkel, 180deg), transparent var(--gn-seide-start, 40%), #000 calc(var(--gn-seide-start, 40%) + var(--gn-seide-weich, 180px)));
}
.gn-home-hero.is-kopf-magazin + .gn-showcase { background: linear-gradient(to bottom, #fbf9f6 0, var(--gn-cream) 240px, var(--gn-sand) 900px); }
.gn-home-hero.is-kopf-magazin + .gn-showcase.has-seide::after {
	background-size: var(--gn-seide-groesse, cover); background-position: center var(--gn-seide-y, 0px);
	/* Dieselbe schräge Kante läuft hier weiter, unten blendet die Seide aus */
	-webkit-mask-image: linear-gradient(var(--gn-seide-winkel, 180deg), transparent var(--gn-seide-start, -200px), #000 calc(var(--gn-seide-start, -200px) + var(--gn-seide-weich, 180px))), linear-gradient(to bottom, #000 78%, transparent);
	-webkit-mask-composite: source-in;
	mask-image: linear-gradient(var(--gn-seide-winkel, 180deg), transparent var(--gn-seide-start, -200px), #000 calc(var(--gn-seide-start, -200px) + var(--gn-seide-weich, 180px))), linear-gradient(to bottom, #000 78%, transparent);
	mask-composite: intersect;
}
/* Der aufgeklappte Laptop rückt an den Text heran, im selben Abstand wie die Zeilen darüber.
   Über dem Gerät ist die Bühne leer (etwa 12 % ihrer Breite), sie darf unter den Text greifen. */
.gn-home-hero.is-kopf-magazin + .gn-showcase .gn-section-head { position: relative; z-index: 1; }
.gn-home-hero.is-kopf-magazin + .gn-showcase .gn-device { margin-top: calc(min(1080px, 100%) * -0.09) !important; }
/* Am Computer rückt der Laptop-Abschnitt hoch: Der Strich beginnt neben den auslaufenden Beinen im
   Foto, etwa ein Viertel der Kopfhöhe über dessen Ende (26.10.). Die Kopfhöhe steht oben bei
   .gn-home-hero.is-kopf-magazin (Mindesthöhe plus Innenabstand oben und unten). */
@media (min-width: 782px) {
	.gn-home-hero.is-kopf-magazin + .gn-showcase > .gn-depth {
		margin-top: calc(-0.25 * (min(calc(100vh - var(--gn-header-h)), 900px) + 2 * clamp(3rem, 6vw, 6rem)));
	}
}

/* D Bogen: Foto im Rundbogen mit feiner rosé Linie */
.gn-home-hero.is-kopf-bogen h1 { font-size: clamp(3rem, 6.6vw, 6.2rem); line-height: 1; letter-spacing: -.02em; }
.gn-home-hero.is-kopf-bogen .gn-hero__media figure { position: relative; isolation: isolate; max-width: 480px; margin-inline: auto; }
.gn-home-hero.is-kopf-bogen .gn-hero__media img { border-radius: 999px 999px 0 0; aspect-ratio: 3 / 4.3; object-position: 50% 12%; }
.gn-home-hero.is-kopf-bogen .gn-hero__media figure::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	transform: translate(22px, 22px); border: 1px solid rgba(232, 66, 121, .6); border-radius: 999px 999px 0 0; }

@media (min-width: 782px) {
	/* WordPress rechnet Gruppen mit border-box und setzt .gn-depth relativ; beides hier
	   zurück, damit das Foto die ganze Kopffläche füllt und der Punkt nach „Energie“ an
	   der Taille endet, wie in der freigegebenen Vorschau (25.10.). */
	.gn-home-hero.is-kopf-magazin { box-sizing: content-box; min-height: min(calc(100vh - var(--gn-header-h)), 900px); display: flex; align-items: center; padding-block: clamp(3rem, 6vw, 6rem) !important; }
	.gn-home-hero.is-kopf-magazin > .gn-depth { width: 100%; position: static; }
	.gn-home-hero.is-kopf-magazin > .gn-depth > .wp-block-columns { max-width: none; margin-inline: 0; }
	.gn-home-hero.is-kopf-magazin h1 em { white-space: nowrap; }
	.gn-home-hero.is-kopf-magazin .gn-hero__text { flex-basis: 56% !important; }
	/* align-self: stretch, weil WordPress der Spalte „vertikal mittig“ gibt; damit war das Foto so hoch
	   wie das Bild selbst, ragte unter den Kopf und endete dort mit einer harten Kante (25.10.). */
	.gn-home-hero.is-kopf-magazin .gn-hero__media { position: absolute; top: 0; right: 0; bottom: 0; width: 47vw; margin: 0 !important; align-self: stretch; }
	/* Die Fläche blendet aus, das Foto liegt frei darin: main.js setzt Größe und Lage so, dass der Punkt
	   nach „Energie“ an Giulias Taille endet (--gn-foto-x, --gn-foto-y, --gn-foto-s; 25.10.).
	   Ohne Skript steht das Foto in voller Breite oben. */
	.gn-home-hero.is-kopf-magazin .gn-hero__media figure { position: relative; height: 100%; width: 100%; margin: 0; overflow: hidden;
		/* Unten läuft das Foto lang und weich aus, ohne Kante in den Laptop-Abschnitt; oben nur ein
		   kurzer Übergang, damit das Haar nicht verblasst (25.10.) */
		-webkit-mask-image: linear-gradient(to right, transparent, #000 26%), linear-gradient(to bottom, transparent, #000 5%, #000 52%, rgba(0, 0, 0, .78) 66%, rgba(0, 0, 0, .45) 79%, rgba(0, 0, 0, .16) 90%, transparent 99%); -webkit-mask-composite: source-in;
		mask-image: linear-gradient(to right, transparent, #000 26%), linear-gradient(to bottom, transparent, #000 5%, #000 52%, rgba(0, 0, 0, .78) 66%, rgba(0, 0, 0, .45) 79%, rgba(0, 0, 0, .16) 90%, transparent 99%); mask-composite: intersect;
		/* Endet das Foto über dem Boden der Fläche (niedrige Fenster), läuft es an seinem eigenen Ende
		   aus statt mit Kante; main.js setzt --gn-foto-mh (26.10.) */
		-webkit-mask-size: 100% 100%, 100% var(--gn-foto-mh, 100%); mask-size: 100% 100%, 100% var(--gn-foto-mh, 100%);
		-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; }
	.gn-home-hero.is-kopf-magazin .gn-hero__media img { position: absolute; top: 0; left: 0; width: 100%; height: auto; max-width: none; margin: 0;
		aspect-ratio: auto; object-fit: fill; border-radius: 0;
		transform-origin: 0 0; transform: translate(var(--gn-foto-x, 0px), var(--gn-foto-y, 0px)) scale(var(--gn-foto-s, 1));
		/* Seitlich weich, falls das verschobene Foto nicht bis an den Rand der Fläche reicht */
		-webkit-mask-image: linear-gradient(to right, transparent, #000 6%, #000 96%, transparent); mask-image: linear-gradient(to right, transparent, #000 6%, #000 96%, transparent); }
	.gn-home-hero.is-kopf-magazin .gn-lead { max-width: 30em; }
}
@media (max-width: 781px) {
	.gn-home-hero.is-kopf-kampagne .gn-hero__media figure::after { transform: translate(10px, 12px); }
	.gn-home-hero.is-kopf-magazin { padding-top: 0 !important; }
	.gn-home-hero.is-kopf-magazin .gn-hero__media { margin-inline: calc(-1 * var(--wp--style--root--padding-left, 16px)); width: auto; }
	.gn-home-hero.is-kopf-magazin .gn-hero__media img { aspect-ratio: 4 / 4.9; object-position: 50% 12%; border-radius: 0;
		-webkit-mask-image: linear-gradient(to bottom, #000 46%, rgba(0, 0, 0, .75) 62%, rgba(0, 0, 0, .4) 77%, rgba(0, 0, 0, .13) 89%, transparent 99%);
		mask-image: linear-gradient(to bottom, #000 46%, rgba(0, 0, 0, .75) 62%, rgba(0, 0, 0, .4) 77%, rgba(0, 0, 0, .13) 89%, transparent 99%); }
	.gn-home-hero.is-kopf-magazin .gn-hero__text { margin-top: -7.5rem !important; }
	.gn-home-hero.is-kopf-magazin h1 { font-size: clamp(3rem, 14vw, 4.6rem); }
	.gn-home-hero.is-kopf-bogen .gn-hero__media figure { max-width: 86%; }
	.gn-home-hero.is-kopf-bogen .gn-hero__media figure::after { transform: translate(12px, 12px); }
}

/* Verkaufs- und Freebie-Seiten: Kopfbereich im Magazin-Stil der Startseite (Schalter KOPF_VERKAUF).
   Kopfzeile in Creme, große enge Überschrift, unten läuft der Kopf weich ins Weiß des nächsten Abschnitts. */
body:has(.gn-sales-hero.is-kopf-magazin) .gn-header:not(.is-scrolled) { background: var(--gn-cream); }
/* Coaching-Anfrage und die Seiten nach dem Eintragen beginnen ebenfalls in Creme: Kopfzeile
   gleich einfärben, sonst steht oben eine weiße Leiste (25.10.). */
body:has(.wp-block-post-content > .gn-section.is-cream:first-child:is(.gn-req-section, .gn-optin-section)) .gn-header:not(.is-scrolled) { background: var(--gn-cream); }
.gn-sales-hero.is-kopf-magazin { background: linear-gradient(to bottom, var(--gn-cream) 0%, var(--gn-cream) 55%, #fff 100%); }
.gn-sales-hero.is-kopf-magazin.has-seide::after {
	-webkit-mask-image: linear-gradient(to bottom, transparent, #000 22%, #000 62%, transparent);
	mask-image: linear-gradient(to bottom, transparent, #000 22%, #000 62%, transparent);
}
.gn-sales-hero.is-kopf-magazin h1 { font-size: clamp(2.6rem, 5.4vw, 4.9rem); line-height: 1; letter-spacing: -.03em; }
@media (min-width: 782px) {
	.gn-sales-hero.is-kopf-magazin { min-height: min(calc(100vh - var(--gn-header-h)), 900px); display: flex; align-items: center; }
	.gn-sales-hero.is-kopf-magazin > .gn-depth { width: 100%; }
}
/* Auf dem Handy erst der Hook (Dachzeile und Überschrift), dann das Bild, dann der Rest (25.10.).
   Die Textspalte gibt ihre Kinder an die Spalten weiter, die Reihenfolge regelt order. */
@media (max-width: 781px) {
	.gn-sales-hero > .gn-depth > .wp-block-columns { flex-direction: column; align-items: stretch !important; row-gap: 0 !important; }
	.gn-sales-hero .gn-hero__text { display: contents; }
	.gn-sales-hero .gn-hero__text > * { order: 3; }
	.gn-sales-hero .gn-hero__text > :is(.gn-eyebrow, h1) { order: 1; }
	.gn-sales-hero .gn-hero__media { order: 2; flex-basis: auto !important; margin-block: clamp(1.4rem, 6vw, 2rem) 0 !important; }
}

/* Weicher Bodenschatten unter den Mockups im Kopfbereich, wie unter den 3D-Geräten */
.gn-hero__plain .wp-block-image { position: relative; isolation: isolate; }
.gn-hero__plain .wp-block-image::after {
	content: ""; position: absolute; z-index: -1; pointer-events: none;
	left: 14%; right: 14%; bottom: calc(var(--gn-boden, 6%) - 4%); height: 8%;
	border-radius: 50%; filter: blur(10px);
	background: radial-gradient(closest-side, rgba(60, 40, 30, .32), rgba(60, 40, 30, .12) 60%, transparent);
}
.gn-hero__plain.is-boden-7 { --gn-boden: 7%; }
.gn-hero__plain.is-boden-11 { --gn-boden: 11%; }

/* Gruß im Schlussblock als eigener Absatz */
.gn-final .gn-lead.gn-final__sign { margin-top: 1.4rem; }
.gn-final .gn-lead:has(+ .gn-final__sign) { margin-bottom: 0; }

/* Fast geschafft und Alles erledigt: der nächste Abschnitt rückt an den Button, der Strich läuft über die Kante */
.gn-optin-section:has(+ .gn-anschluss) { min-height: 0; padding-bottom: clamp(3.5rem, 6vw, 5rem) !important; }
.gn-section.gn-anschluss { padding-top: clamp(3.5rem, 6vw, 5rem) !important; }
.gn-anschluss .has-strich::before { margin-top: calc(-1 * clamp(3.5rem, 6vw, 5rem) - clamp(28px, 3.5vw, 52px)) !important; }
/* Überall, wo es von Hell in Schwarz geht (25.10.): der Strich läuft über die Kante,
   oben dunkel, unten hell, und der schwarze Abschnitt rückt näher heran. */
:is(.gn-section.is-white, .gn-section.is-cream, .gn-section.is-sand) + .gn-section.is-night:has(> .gn-depth > .has-strich:first-child) { padding-top: clamp(3.5rem, 6vw, 5rem) !important; }
:is(.gn-section.is-white, .gn-section.is-cream, .gn-section.is-sand) + .gn-section.is-night > .gn-depth > .has-strich:first-child::before {
	margin-top: calc(-1 * clamp(3.5rem, 6vw, 5rem) - clamp(28px, 3.5vw, 52px)) !important;
	background: linear-gradient(to bottom, var(--gn-ink) 50%, #fff 50%);
}

/* Unter dem Kopfbereich der Verkaufs- und Freebie-Seiten (25.10.): der nächste Abschnitt rückt heran,
   der Strich läuft über die Kante. */
.gn-sales-hero.is-kopf-magazin { padding-bottom: clamp(4.5rem, 8vw, 7.5rem) !important; }
.gn-sales-hero.is-kopf-magazin + .gn-section:has(> .gn-depth > .has-strich:first-child) { padding-top: clamp(3.5rem, 6vw, 5rem) !important; }
.gn-sales-hero.is-kopf-magazin + .gn-section > .gn-depth > .has-strich:first-child::before { margin-top: calc(-1 * clamp(3.5rem, 6vw, 5rem) - clamp(28px, 3.5vw, 52px)) !important; }

/* Von Schwarz zurück in Hell (25.10.): der Strich läuft ebenfalls über die Kante, oben hell, unten dunkel. */
.gn-section.is-night:not(.gn-final-section) + :is(.gn-section.is-white, .gn-section.is-cream, .gn-section.is-sand):has(> .gn-depth > .has-strich:first-child) { padding-top: clamp(3.5rem, 6vw, 5rem) !important; }
.gn-section.is-night:not(.gn-final-section) + :is(.gn-section.is-white, .gn-section.is-cream, .gn-section.is-sand) > .gn-depth > .has-strich:first-child::before {
	margin-top: calc(-1 * clamp(3.5rem, 6vw, 5rem) - clamp(28px, 3.5vw, 52px)) !important;
	background: linear-gradient(to bottom, #fff 50%, var(--gn-ink) 50%);
}

/* Auch zwischen zwei hellen Flächen verschiedener Farbe läuft der Strich über die Kante, etwa vom
   kräftigen Beige in das hellere bei „Die Kurse“, und der Abschnitt rückt näher heran
   (25.10. auf dem Handy, seit 28.10. auf allen Bildschirmen). */
:is(.gn-section.is-white:not(.gn-hero) + .gn-section:is(.is-cream, .is-sand), .gn-section.is-cream:not(.gn-hero) + .gn-section:is(.is-white, .is-sand), .gn-section.is-sand:not(.gn-hero) + .gn-section:is(.is-white, .is-cream)):has(> .gn-depth > .has-strich:first-child) { padding-top: clamp(3.5rem, 6vw, 5rem) !important; }
:is(.gn-section.is-white:not(.gn-hero) + .gn-section:is(.is-cream, .is-sand), .gn-section.is-cream:not(.gn-hero) + .gn-section:is(.is-white, .is-sand), .gn-section.is-sand:not(.gn-hero) + .gn-section:is(.is-white, .is-cream)) > .gn-depth > .has-strich:first-child::before { margin-top: calc(-1 * clamp(3.5rem, 6vw, 5rem) - clamp(28px, 3.5vw, 52px)) !important; }

/* Abschnitte ohne eigenen Strich im Kopf (etwa „Für dich, wenn du …“, Über mich, Fragen) bekommen
   einen an der Kante zum vorigen Abschnitt (25.10.). Nicht vor und nach dem Schlussblock. */
.gn-section:not(.gn-final-section) + .gn-section:not(.gn-final-section):not(:has(> .gn-depth > .has-strich:first-child))::before {
	content: ""; position: absolute; z-index: 1; left: 50%; top: calc(-1 * clamp(28px, 3.5vw, 52px)); pointer-events: none;
	width: 1px; height: clamp(56px, 7vw, 104px); background: var(--gn-ink); opacity: .5;
	transform: translateZ(0); will-change: transform;
}
.gn-section.is-night:not(.gn-final-section) + .gn-section:not(.gn-final-section):not(:has(> .gn-depth > .has-strich:first-child))::before { background: linear-gradient(to bottom, #fff 50%, var(--gn-ink) 50%); }
/* Gleiche Fläche hintereinander: dort fehlt sonst der Platz unter dem Strich */
:is(.gn-section.is-white + .gn-section.is-white, .gn-section.is-cream + .gn-section.is-cream, .gn-section.is-sand + .gn-section.is-sand):not(.gn-final-section):not(:has(> .gn-depth > .has-strich:first-child)) { padding-top: calc(clamp(28px, 3.5vw, 52px) + clamp(3rem, 5vw, 4.5rem)) !important; }

/* Kaufknopf im Schlussblock mittig, auch falls die Ausrichtung des Blocks fehlt */
.gn-final .wp-block-buttons { justify-content: center; }

/* Fußzeile: Logo und Instagram (25.10.). Das Instagram-Zeichen bleibt schwarz-weiß. */
.gn-footer__grid { display: grid; grid-template-columns: 1fr minmax(0, 440px); gap: 2rem clamp(2rem, 6vw, 6rem); align-items: end; }
.gn-footer__main > * { margin: 0 0 1.1rem; }
.gn-footer__main > :last-child { margin-bottom: 0; }
.gn-footer__copy { font-size: .8rem; }
.gn-footer__side { display: grid; gap: 1.4rem; justify-items: end; }
.gn-footer__side .gn-footer__mark { margin: 0; }
.gn-footer__insta { box-sizing: border-box; display: flex; align-items: center; gap: .9rem; width: 100%; padding: 1rem 1.1rem; border-radius: 20px; background: transparent;
	border: 1px solid var(--gn-line); color: var(--gn-ink) !important; transition: border-color .25s var(--gn-ease); }
.gn-footer__insta:hover { border-color: var(--gn-ink); }
.gn-footer__insta-ico { flex: none; width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; color: #fff; background: var(--gn-ink); }
.gn-footer__insta-text { display: grid; gap: .1rem; font-size: .85rem; color: var(--gn-muted); min-width: 0; }
.gn-footer__insta-text strong { font-family: var(--wp--preset--font-family--heading); font-size: 1.05rem; color: var(--gn-ink); }
.gn-footer__insta-btn { margin-left: auto; flex: none; padding: .55rem 1.1rem; border-radius: 999px; background: var(--gn-rose); color: #fff; font-size: .85rem; font-weight: 500; }
@media (max-width: 781px) {
	.gn-footer__grid { grid-template-columns: 1fr; }
	.gn-footer__side { order: -1; justify-items: start; }
}
/* Eine Zeile: Rechtliches links, GN mittig in Höhe der Instagram-Karte, Instagram rechts */
.gn-footer__grid.is-zeile { grid-template-columns: 1fr auto 1fr; align-items: center; }
.gn-footer__grid.is-zeile .gn-footer__mark { margin: 0; }
.gn-footer__grid.is-zeile .gn-footer__mark img { width: auto; height: 80px; }
.gn-footer__grid.is-zeile .gn-footer__insta { max-width: 440px; }
@media (max-width: 1000px) {
	.gn-footer__grid.is-zeile { grid-template-columns: 1fr; justify-items: center; gap: 1.6rem; text-align: center; }
	.gn-footer__grid.is-zeile .gn-footer__mark { order: -2; }
	.gn-footer__grid.is-zeile .gn-footer__side { order: -1; justify-items: center; width: 100%; }
	.gn-footer__grid.is-zeile .gn-footer__insta { text-align: left; }
}