/*
 * PvH Cosmos — kosmische Zusatzschicht.
 * Alles, was theme.json nicht ausdrücken kann: Sternenfeld, Nebel, die
 * Konstellation der Disziplinen, Wappen-Aura, Scroll-Reveals, Animationen.
 * Tokens stammen aus theme.json (--wp--preset--*). Bewegung respektiert
 * prefers-reduced-motion (Block am Ende der Datei).
 */

/* ---------------------------------------------------------------------------
 * 1. Atmosphäre — Sternenfeld als Hintergrund (Group-Style "Sternenfeld")
 * ------------------------------------------------------------------------- */
.is-style-cosmos-starfield {
	position: relative;
	isolation: isolate;
	overflow: clip;
	background-color: var(--wp--preset--color--void);
}

.is-style-cosmos-starfield::before,
.is-style-cosmos-starfield::after {
	content: "";
	position: absolute;
	inset: -10%;
	z-index: -2;
	pointer-events: none;
}

/* Sterne: zwei Ebenen unterschiedlicher Dichte/Größe für Tiefe. */
.is-style-cosmos-starfield::before {
	background-image:
		radial-gradient(1.5px 1.5px at 20% 30%, rgba(243,241,250,0.9) 0, transparent 100%),
		radial-gradient(1.5px 1.5px at 75% 18%, rgba(243,241,250,0.7) 0, transparent 100%),
		radial-gradient(1px 1px at 50% 60%, rgba(243,241,250,0.8) 0, transparent 100%),
		radial-gradient(1px 1px at 88% 72%, rgba(229,199,134,0.8) 0, transparent 100%),
		radial-gradient(1.5px 1.5px at 33% 85%, rgba(243,241,250,0.6) 0, transparent 100%),
		radial-gradient(1px 1px at 10% 70%, rgba(157,139,255,0.8) 0, transparent 100%),
		radial-gradient(1.5px 1.5px at 64% 42%, rgba(243,241,250,0.75) 0, transparent 100%),
		radial-gradient(1px 1px at 92% 35%, rgba(243,241,250,0.6) 0, transparent 100%);
	background-repeat: no-repeat;
	animation: pvh-drift 120s linear infinite alternate;
}

/* Nebel: weicher violetter Schimmer von oben + Horizont von unten. */
.is-style-cosmos-starfield::after {
	background-image:
		radial-gradient(120% 90% at 50% -10%, rgba(110,91,214,0.22) 0%, rgba(7,6,14,0) 55%),
		radial-gradient(90% 60% at 80% 110%, rgba(157,139,255,0.14) 0%, rgba(7,6,14,0) 60%),
		radial-gradient(70% 50% at 12% 100%, rgba(229,199,134,0.08) 0%, rgba(7,6,14,0) 60%);
}

/* Feiner Twinkle-Layer (eigenes Element, das Patterns einsetzen können). */
.pvh-twinkle {
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background-image:
		radial-gradient(1px 1px at 15% 22%, #fff 0, transparent 100%),
		radial-gradient(1px 1px at 42% 78%, #fff 0, transparent 100%),
		radial-gradient(1px 1px at 68% 12%, #fff 0, transparent 100%),
		radial-gradient(1px 1px at 83% 55%, #fff 0, transparent 100%),
		radial-gradient(1px 1px at 27% 48%, #fff 0, transparent 100%);
	background-repeat: no-repeat;
	opacity: 0.0;
	animation: pvh-twinkle 6s ease-in-out infinite;
}

@keyframes pvh-drift {
	from { transform: translate3d(0, 0, 0) scale(1); }
	to   { transform: translate3d(-2%, -3%, 0) scale(1.06); }
}
@keyframes pvh-twinkle {
	0%, 100% { opacity: 0.15; }
	50%      { opacity: 0.6; }
}

/* ---------------------------------------------------------------------------
 * 2. Panel — erhöhte Nebula-Fläche (Group-Style "Kosmos-Panel")
 * ------------------------------------------------------------------------- */
.is-style-cosmos-panel {
	position: relative;
	background:
		linear-gradient(180deg, rgba(28,23,64,0.55) 0%, rgba(13,10,30,0.55) 100%);
	border: 1px solid var(--wp--preset--color--hairline);
	border-radius: 18px;
	box-shadow: 0 18px 60px rgba(7,6,14,0.55);
	backdrop-filter: blur(2px);
}
.is-style-cosmos-panel::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	padding: 1px;
	background: linear-gradient(135deg, rgba(229,199,134,0.35), rgba(110,91,214,0.0) 40%);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	        mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	        mask-composite: exclude;
	pointer-events: none;
}

/* ---------------------------------------------------------------------------
 * 3. Eyebrow — Koordinaten-Label (Heading-Style "Eyebrow")
 * ------------------------------------------------------------------------- */
.is-style-cosmos-eyebrow {
	font-family: var(--wp--preset--font-family--mono) !important;
	font-size: 0.8125rem !important;
	font-weight: 400 !important;
	letter-spacing: 0.28em !important;
	text-transform: uppercase;
	color: var(--wp--preset--color--gold) !important;
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
}

/* ---------------------------------------------------------------------------
 * 4. Hero
 * ------------------------------------------------------------------------- */
.pvh-hero {
	min-height: clamp(620px, 92svh, 980px);
	display: flex;
	align-items: center;
}
.pvh-hero h1 {
	background: linear-gradient(180deg, var(--wp--preset--color--starlight) 0%, #cfc8ec 100%);
	-webkit-background-clip: text;
	        background-clip: text;
	-webkit-text-fill-color: transparent;
	text-wrap: balance;
}
.pvh-hero__lede {
	max-width: 46ch;
	color: var(--wp--preset--color--mist);
}

/* ---------------------------------------------------------------------------
 * 5. Wappen-Aura (Image-Style "Wappen-Aura")
 * ------------------------------------------------------------------------- */
.is-style-cosmos-crest img {
	filter: drop-shadow(0 0 28px rgba(229,199,134,0.35)) drop-shadow(0 0 64px rgba(110,91,214,0.30));
	animation: pvh-float 9s ease-in-out infinite;
}
@keyframes pvh-float {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-10px); }
}

/* ---------------------------------------------------------------------------
 * 6. Konstellation der Disziplinen
 * ------------------------------------------------------------------------- */
.pvh-constellation {
	position: relative;
}
/* SVG-Verbindungslinien liegen hinter den Sternen-Knoten. */
.pvh-constellation__lines {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	pointer-events: none;
	overflow: visible;
}
.pvh-constellation__lines line,
.pvh-constellation__lines path {
	stroke: var(--wp--preset--color--violet);
	stroke-width: 1;
	stroke-dasharray: 1400;
	stroke-dashoffset: 1400;
	opacity: 0.5;
}
.pvh-constellation.is-drawn .pvh-constellation__lines line,
.pvh-constellation.is-drawn .pvh-constellation__lines path {
	animation: pvh-draw 2.4s ease forwards;
}
@keyframes pvh-draw {
	to { stroke-dashoffset: 0; }
}

/* Ein Disziplin-Stern. In Patterns: Group mit Klasse pvh-disc. */
.pvh-disc {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.5rem;
	padding: 1.25rem 0.75rem;
	border-radius: 14px;
	text-align: center;
	transition: transform .3s ease, background .3s ease;
}
.pvh-disc::before {
	content: "";
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: radial-gradient(circle, var(--wp--preset--color--gold-bright) 0%, var(--wp--preset--color--gold) 45%, rgba(229,199,134,0) 70%);
	box-shadow: 0 0 16px 4px rgba(229,199,134,0.5);
	margin-bottom: 0.35rem;
	transition: transform .3s ease, box-shadow .3s ease;
}
.pvh-disc:hover {
	transform: translateY(-4px);
	background: rgba(28,23,64,0.45);
}
.pvh-disc:hover::before {
	transform: scale(1.5);
	box-shadow: 0 0 26px 8px rgba(229,199,134,0.7);
}
.pvh-disc__name {
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.05rem;
	letter-spacing: 0.02em;
	color: var(--wp--preset--color--starlight);
}
.pvh-disc__meta {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.72rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--mist);
}

/* ---------------------------------------------------------------------------
 * 7. Arbeiten-Karten (Query-Loop / manuelle Karten)
 * ------------------------------------------------------------------------- */
.pvh-card {
	position: relative;
	border: 1px solid var(--wp--preset--color--hairline);
	border-radius: 16px;
	overflow: hidden;
	background: var(--wp--preset--color--nebula-deep);
	transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease;
	height: 100%;
}
.pvh-card:hover {
	transform: translateY(-6px);
	border-color: rgba(229,199,134,0.5);
	box-shadow: 0 22px 60px rgba(7,6,14,0.6);
}
.pvh-card img {
	transition: transform .5s ease;
}
.pvh-card:hover img {
	transform: scale(1.04);
}

/* ---------------------------------------------------------------------------
 * 8. Navigation / Header
 * ------------------------------------------------------------------------- */
.wp-block-navigation .wp-block-navigation-item__content {
	color: var(--wp--preset--color--mist);
	transition: color .2s ease;
}
.wp-block-navigation .wp-block-navigation-item__content:hover,
.wp-block-navigation .current-menu-item .wp-block-navigation-item__content {
	color: var(--wp--preset--color--starlight);
}

/* Outline-Button-Variante (für sekundäre CTAs via .is-style-outline). */
.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--gold) !important;
	border: 1px solid var(--wp--preset--color--gold);
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: rgba(229,199,134,0.12);
	color: var(--wp--preset--color--gold-bright) !important;
}

/* ---------------------------------------------------------------------------
 * 8b. Effekt-Layer (cosmos-fx) — Canvas-Hintergründe hinter dem Inhalt
 * ------------------------------------------------------------------------- */
.cosmos-fx-host {
	position: relative;
}
.cosmos-fx-layer {
	position: absolute;
	inset: 0;
	z-index: 0;
	overflow: hidden;
	pointer-events: none;
	/* „constrained"-Layout zwängt sonst auch diese Ebene auf contentSize → Effekt
	   würde nur mittig laufen. Hier erzwingen wir volle Breite. */
	max-width: none !important;
	width: auto !important;
	margin: 0 !important;
}
.cosmos-fx-layer .cosmos-fx-canvas {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
}
/* Inhalt des Hosts liegt über den Effekt-Canvases. */
.cosmos-fx-host > :not(.cosmos-fx-layer) {
	position: relative;
	z-index: 1;
}

/* ---------------------------------------------------------------------------
 * 8c. Effekt „aurora" — Lichtstrahlen (DOM, von effects/aurora.js gebaut)
 * ------------------------------------------------------------------------- */
.cosmos-aurora { position: absolute; inset: 0; overflow: hidden; }
.cosmos-aurora__floor {
	position: absolute; left: 0; right: 0; bottom: 0; height: 42%;
	background: radial-gradient(ellipse at 50% 100%, rgba(110,91,214,0.38), rgba(7,6,14,0) 70%);
	animation: pvh-aurora-floor 6s ease-in-out infinite;
}
.cosmos-aurora__column {
	position: absolute; left: 50%; bottom: 0; width: 220px; height: 72%;
	transform: translateX(-50%);
	background: linear-gradient(to top, rgba(157,139,255,0.5), rgba(229,199,134,0.12), transparent);
	filter: blur(22px);
	animation: pvh-aurora-main 4s ease-in-out infinite alternate;
}
.cosmos-aurora__beams { position: absolute; inset: 0; }
.cosmos-aurora__beam {
	position: absolute; bottom: 0; height: 62%;
	background: linear-gradient(to top, rgba(157,139,255,0.9), rgba(229,199,134,0.35), transparent);
	box-shadow: 0 0 12px rgba(110,91,214,0.8);
	opacity: 0;
	animation-name: pvh-aurora-rise, pvh-aurora-fade;
	animation-timing-function: ease-out, ease-in-out;
	animation-iteration-count: infinite, infinite;
}
@keyframes pvh-aurora-rise { 0% { transform: translateY(100%); } 100% { transform: translateY(-20%); } }
@keyframes pvh-aurora-fade { 0%, 100% { opacity: 0; } 10% { opacity: 0.9; } 80% { opacity: 0.5; } }
@keyframes pvh-aurora-floor { 0%, 100% { transform: scale(0.9); opacity: 0.6; } 50% { transform: scale(1.1); opacity: 1; } }
@keyframes pvh-aurora-main { from { opacity: 0.5; filter: blur(25px); } to { opacity: 0.8; filter: blur(15px); } }

/* ---------------------------------------------------------------------------
 * 8d. Intro-Portal & Wappen-Wiedergeburt
 * ------------------------------------------------------------------------- */
.pvh-intro {
	min-height: 100svh;
	display: flex;
	align-items: center;
	justify-content: center;
}
.pvh-rebirth { position: relative; perspective: 1000px; }
.pvh-rebirth-crest { transform-style: preserve-3d; transition: transform 0.25s ease-out; will-change: transform; }
/* Standard (ohne Cinematic / reduced-motion): Wappen einfach sichtbar, kein Dauer-Schein. */
/* Geschichtetes Wappen aus Einzelteilen — alle Ebenen überlagern sich exakt
   und ergeben zusammen das Original-Wappen. */
.pvh-crest-build { position: relative; width: 320px; max-width: 80vw; aspect-ratio: 1 / 1; margin: 0 auto; }
.pvh-slot { position: absolute; transform: translate(-50%, -50%); }
.pvh-slot img { display: block; width: 100%; height: auto; }
/* Position & Stapelung der Wappen-Teile (komponiert aus den Einzelgrafiken). */
.slot--fluegel    { left: 50%;   top: 34%; width: 78%;   z-index: 1; }
.slot--verzierung { left: 50%;   top: 67%; width: 60%;   z-index: 2; }
.slot--schild     { left: 50%;   top: 48%; width: 48%;   z-index: 4; }
.slot--v          { left: 45%; top: 42%; width: 9%;   z-index: 5; }
.slot--h          { left: 53%; top: 42%; width: 9%;   z-index: 5; }
.slot--anker      { left: 40%;   top: 37%; width: 53%;   z-index: 6; }
.slot--krone      { left: 50%;   top: 5%; width: 29%;   z-index: 7; }
.slot--bandarole  { left: 50%;   top: 71%; width: 60%;   z-index: 8; }

/* Mit Cinematic: Teile verborgen, dann nach „Ankunft" systematisch aufbauen. */
.pvh-cinematic .pvh-slot img { opacity: 0; }
.pvh-cinematic.is-arrived .pvh-slot img {
	animation-duration: 0.6s; animation-fill-mode: both;
	animation-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1);
}
.pvh-cinematic.is-arrived .slot--schild img     { animation-name: pvh-as-shield; animation-delay: 0s; }
.pvh-cinematic.is-arrived .slot--fluegel img    { animation-name: pvh-as-wings;  animation-delay: 0.45s; }
.pvh-cinematic.is-arrived .slot--bandarole img  { animation-name: pvh-as-banner; animation-delay: 1.0s; }
.pvh-cinematic.is-arrived .slot--verzierung img { animation-name: pvh-as-orn;    animation-delay: 1.45s; }
.pvh-cinematic.is-arrived .slot--anker img      { animation-name: pvh-as-anchor; animation-delay: 2.0s; animation-duration: 0.62s; animation-timing-function: cubic-bezier(0.5, 0, 0.4, 1.25); }
.pvh-cinematic.is-arrived .slot--v img          { animation-name: pvh-as-v;      animation-delay: 2.55s; }
.pvh-cinematic.is-arrived .slot--h img          { animation-name: pvh-as-h;      animation-delay: 2.55s; }
.pvh-cinematic.is-arrived .slot--krone img      { animation-name: pvh-as-crown;  animation-delay: 3.05s; animation-duration: 0.8s; }

@keyframes pvh-as-shield { 0% { opacity: 0; transform: scale(0.72); } 60% { opacity: 1; } 100% { opacity: 1; transform: scale(1); } }
@keyframes pvh-as-wings  { 0% { opacity: 0; transform: scaleX(0.42); } 100% { opacity: 1; transform: none; } }
@keyframes pvh-as-banner { 0% { opacity: 0; transform: scaleX(0.2) translateY(8px); } 100% { opacity: 1; transform: none; } }
@keyframes pvh-as-orn    { 0% { opacity: 0; transform: translateY(-10px) scale(0.9); } 100% { opacity: 1; transform: none; } }
@keyframes pvh-as-anchor { 0% { opacity: 0; transform: translateY(-230px) scale(1.05); } 60% { opacity: 1; } 84% { transform: translateY(7px) scaleY(0.93); } 100% { opacity: 1; transform: none; } }
@keyframes pvh-as-v      { 0% { opacity: 0; transform: translateX(20px); } 100% { opacity: 1; transform: none; } }
@keyframes pvh-as-h      { 0% { opacity: 0; transform: translateX(-20px); } 100% { opacity: 1; transform: none; } }
@keyframes pvh-as-crown  { 0% { opacity: 0; transform: translateY(-90px) scale(0.92); } 100% { opacity: 1; transform: none; } }
/* Cinematic-Lader: Wappen erst nach „Ankunft" holografisch materialisieren, danach
   statisch — der schwache, zufällige Schein + Kontur-Glints kommen per JS (warp.js). */
.pvh-cinematic .pvh-rebirth-crest img { opacity: 0; }
/* (alter Einzelbild-Reveal entfernt — Aufbau erfolgt jetzt per Teil-Ebenen oben) */
/* Holografischer Boot-up: Scan-Wipe von unten + Flackern + scharfstellen. */
@keyframes pvh-crest-rebirth {
	0%   { opacity: 0; transform: scale(0.6); filter: blur(18px) brightness(3); clip-path: inset(100% 0 0 0); }
	28%  { opacity: 1; clip-path: inset(0 0 0 0); filter: blur(7px) brightness(2); }
	36%  { opacity: 0.35; }
	44%  { opacity: 1; }
	52%  { opacity: 0.55; }
	60%  { opacity: 1; filter: blur(2px) brightness(1.3); }
	74%  { opacity: 0.8; }
	100% { opacity: 1; transform: scale(1); filter: blur(0) brightness(1); clip-path: inset(0 0 0 0); }
}
@keyframes pvh-crest-power {
	0%, 100% { filter: drop-shadow(0 0 7px rgba(229,199,134,0.26)); }
	50%      { filter: drop-shadow(0 0 13px rgba(229,199,134,0.38)); }
}
/* Metallisches Glanzlicht wandert über das fertige Wappen — gleicher Effekt wie beim
   Schriftzug. ZWEI Ebenen, damit das Licht korrekt geschichtet ist:
   - ::after = Flügel+Verzierung, z-index 3 → liegt UNTER Schild(4)/Anker(6)/Bandarole(8),
     die den Glanz dort natürlich verdecken (kein Glanz auf Schild/Bandarole).
   - ::before = nur Krone (oben, überlappt nichts), z-index 30 → liegt vorne.
   mix-blend-mode:screen lässt das Licht über dem Gold aufblitzen. */
.pvh-crest-build::after,
.pvh-crest-build::before {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	/* Intensität >50% schwächer als zuvor (Spitze 0.96 -> 0.40). */
	background: linear-gradient(105deg,
		rgba(255,240,194,0) 38%, rgba(230,198,136,0.14) 45%,
		rgba(246,224,166,0.34) 49%, rgba(255,243,205,0.40) 50%, rgba(246,224,166,0.34) 51%,
		rgba(230,198,136,0.14) 55%, rgba(255,240,194,0) 62%);
	background-size: 300% 100%;
	background-repeat: no-repeat;
	mix-blend-mode: screen;
	animation: pvh-crest-shine 3.8s linear 0.6s infinite;
}
.pvh-crest-build::after {  /* Flügel + Verzierung, UNTER dem Schild */
	z-index: 3;
	-webkit-mask: url('../img/crest-mask.png') center / 100% 100% no-repeat;
	        mask: url('../img/crest-mask.png') center / 100% 100% no-repeat;
}
.pvh-crest-build::before {  /* nur Krone, oben */
	z-index: 30;
	-webkit-mask: url('../img/crest-mask-crown.png') center / 100% 100% no-repeat;
	        mask: url('../img/crest-mask-crown.png') center / 100% 100% no-repeat;
}
/* Cinematic: Glanzlicht erst NACH dem Zusammensetzen (Krone landet ~3,85s nach is-arrived). */
.pvh-cinematic .pvh-crest-build::after,
.pvh-cinematic .pvh-crest-build::before { animation: none; opacity: 0; }
.pvh-cinematic.is-arrived .pvh-crest-build::after,
.pvh-cinematic.is-arrived .pvh-crest-build::before { opacity: 1; animation: pvh-crest-shine 3.8s linear 4.1s infinite; }
@keyframes pvh-crest-shine {
	0%   { background-position: 0% 0; }
	100% { background-position: 100% 0; }
}
/* FLASH-SCHUTZ: Solange JS verfügbar ist (html.pvh-js, früh im <head> gesetzt) sind
   Wappen-Teile und Texte standardmäßig verborgen — sie blitzen so beim Seitenaufbau
   NICHT kurz auf, bevor das JS-Intro übernimmt. Die Cinematic-Reveal-Animationen unten
   blenden sie zur richtigen Zeit ein. Ohne JS fehlt die Klasse → Inhalt sofort sichtbar.
   Bei prefers-reduced-motion läuft kein JS-Intro → alles bleibt statisch sichtbar. */
html.pvh-js .pvh-intro .pvh-slot img,
html.pvh-js .pvh-intro .pvh-rebirth-crest img,
html.pvh-js .pvh-intro .pvh-seq { opacity: 0; }
@media (prefers-reduced-motion: reduce) {
	html.pvh-js .pvh-intro .pvh-slot img,
	html.pvh-js .pvh-intro .pvh-rebirth-crest img,
	html.pvh-js .pvh-intro .pvh-seq { opacity: 1; }
}

/* Texte: mit Cinematic erst nach „Bereit" einblenden. */
.pvh-cinematic .pvh-seq { opacity: 0; }
.pvh-cinematic.is-ready .pvh-seq { animation: pvh-rise-in 1s both; }
.pvh-cinematic.is-ready .pvh-seq--1 { animation-delay: 0.1s; }
.pvh-cinematic.is-ready .pvh-seq--2 { animation-delay: 0.3s; }
.pvh-cinematic.is-ready .pvh-seq--3 { animation-delay: 0.5s; }
.pvh-cinematic.is-ready .pvh-seq--4 { animation-delay: 0.7s; }
@keyframes pvh-rise-in { 0% { opacity: 0; transform: translateY(22px); } 100% { opacity: 1; transform: none; } }

/* Elegant Woman (Demo, NihStudio) — Schriftart für die Intro-Wortmarke. */
@font-face {
	font-family: 'Romance Eleganto';
	src: url('../fonts/RomanceEleganto.otf') format('opentype');
	font-weight: 400; font-style: normal; font-display: swap;
}
/* Intro-Wortmarke: Elegant Woman, goldene Antik-Symbol-Textur (transluzent). */
.pvh-intro__name {
	font-family: 'Romance Eleganto', 'Cinzel', serif !important;
	font-size: clamp(2.3rem, 5vw, 5rem) !important;   /* etwas kleiner */
	position: relative;
	isolation: isolate;
	/* --mx/--my werden von warp.js auf der Section gesetzt und HIER GEERBT
	   (keine lokale Deklaration → sonst Überschattung!). Fallback 0. */
	font-weight: 400; letter-spacing: 0.01em;   /* Elegant Woman: enger, natürlicher */
	background: url('../img/text-gold.png?v=3');
	background-repeat: no-repeat;
	background-size: auto 155%;
	background-position: 0% 45%;
	animation: pvh-text-pan 9s ease-in-out infinite;   /* goldene Antik-Symbole wandern durch die Schrift */
	-webkit-background-clip: text; background-clip: text;
	-webkit-text-fill-color: transparent; color: transparent;
	filter:
		drop-shadow(calc(var(--mx, 0) * 1px) calc(var(--my, 0) * 1px) 0 rgba(196,156,82,0.4))
		drop-shadow(calc(var(--mx, 0) * 2px) calc(var(--my, 0) * 2px) 0 rgba(156,120,56,0.3))
		drop-shadow(calc(var(--mx, 0) * 3px) calc(var(--my, 0) * 3px) 0 rgba(120,92,40,0.22))
		drop-shadow(0 0 2px rgba(229,199,134,0.007));
	transition: filter 0.12s linear;
}
@keyframes pvh-text-pan {
	0%, 100% { background-position: 0% 45%; }
	50%      { background-position: 100% 58%; }
}
/* Beim cinematischen Reveal beide Animationen am Schriftzug (Einblenden + Symbol-Pan). */
.pvh-cinematic.is-ready .pvh-intro__name {
	animation: pvh-rise-in 1s both, pvh-text-pan 9s 1s ease-in-out infinite;
}

/* =====================================================================
 * „Eintreten"-Ausstieg (Portal-Durchflug). warp.js setzt .pvh-exit auf die
 * Sektion und navigiert nach 4,6 s. Selektoren mit .pvh-cinematic.pvh-exit,
 * damit sie die is-ready-Reveal-Animationen sicher überschreiben.
 * ===================================================================== */
.pvh-cinematic.pvh-exit { overflow: hidden; }
/* Texte bleiben bis zu ihrem eigenen Wegflug sichtbar: die Reveal-Animation ist jetzt
   durch die (verzögerte) Wegflug-Animation ersetzt, daher würde sonst in der Verzögerung
   der Flash-Schutz (opacity:0) greifen. Höhere Spezifität als der Flash-Schutz. */
html.pvh-js .pvh-cinematic.pvh-exit .pvh-seq { opacity: 1; }
/* Texte fliegen GESTAFFELT weg: zuerst „Willkommen…", dann „Artworks…"+Button,
   zuletzt „Pierre von Hoffmeister" — danach ist der Blick frei aufs Wappen. */
.pvh-cinematic.pvh-exit .pvh-seq--1 { animation: pvh-fly-up   0.7s 1.5s cubic-bezier(.6,0,.9,.2) forwards; }
.pvh-cinematic.pvh-exit .pvh-seq--3 { animation: pvh-fly-down 0.7s 2.0s cubic-bezier(.6,0,.9,.2) forwards; }
.pvh-cinematic.pvh-exit .pvh-seq--4 { animation: pvh-fly-down 0.7s 2.1s cubic-bezier(.6,0,.9,.2) forwards; }
.pvh-cinematic.pvh-exit .pvh-seq--2 { animation: pvh-fly-up   0.8s 2.6s cubic-bezier(.6,0,.9,.2) forwards; }
@keyframes pvh-fly-up   { to { opacity: 0; transform: translateY(-75vh) scale(0.82); filter: blur(3px); } }
@keyframes pvh-fly-down { to { opacity: 0; transform: translateY(75vh)  scale(0.82); filter: blur(3px); } }

/* Ins Wappen zoomen (ab 3,0 s) — es füllt den Blick und fliegt an der Kamera vorbei. */
.pvh-cinematic.pvh-exit .pvh-crest-build {
	animation: pvh-crest-zoom 1.8s 3.0s cubic-bezier(.5,0,.85,1) forwards;
	transform-origin: 50% 40%;
}
@keyframes pvh-crest-zoom {
	0%   { transform: scale(1); }
	70%  { opacity: 1; }
	100% { transform: scale(9); opacity: 0; }
}
/* …und teilt sich dabei in seine Einzelteile auf (jeder Teil eine eigene Richtung). */
.pvh-cinematic.pvh-exit .slot--krone    { --dx: 0;     --dy: -70%; }
.pvh-cinematic.pvh-exit .slot--bandarole{ --dx: 0;     --dy:  70%; }
.pvh-cinematic.pvh-exit .slot--verzierung{ --dx: 0;    --dy:  55%; }
.pvh-cinematic.pvh-exit .slot--fluegel  { --dx: 0;     --dy: -28%; }
.pvh-cinematic.pvh-exit .slot--anker    { --dx: 0;     --dy:  35%; }
.pvh-cinematic.pvh-exit .slot--schild   { --dx: 0;     --dy:   0; }
.pvh-cinematic.pvh-exit .slot--v        { --dx: -55%;  --dy:   0; }
.pvh-cinematic.pvh-exit .slot--h        { --dx:  55%;  --dy:   0; }
.pvh-cinematic.pvh-exit .pvh-slot { animation: pvh-slot-split 1.5s 3.0s ease-in forwards; }
@keyframes pvh-slot-split {
	to { transform: translate(-50%, -50%) translate(var(--dx, 0), var(--dy, 0)) scale(1.15); opacity: 0; }
}
/* Kontur als dünne Gold-Linie, über die ein metallisches Glanzlicht entlangwandert.
   Liegt als eigenes Text-Layer VOR der Füllung, damit der Effekt ausschließlich auf
   der Outline sitzt (nur der Rand wird gemalt, das Innere bleibt transparent). */
.pvh-intro__name::before {
	content: attr(data-text);
	position: absolute; left: 0; top: 0; width: 100%; z-index: 3;
	text-align: inherit; letter-spacing: inherit; pointer-events: none;
	-webkit-text-fill-color: transparent; color: transparent;
	-webkit-text-stroke: 1.4px transparent;
	/* Gold-Grundkontur mit wanderndem metallischem Glanzlicht (kein Weiß, sondern
	   strahlendes Champagner-Gold wie das Wappen). */
	background: linear-gradient(105deg,
		rgba(199,160,82,0.55) 0%, rgba(199,160,82,0.55) 40%,
		#e6c688 45%, #f6e0a6 48%, #fff0c2 50%, #f6e0a6 52%, #e6c688 55%,
		rgba(199,160,82,0.55) 60%, rgba(199,160,82,0.55) 100%);
	background-size: 300% 100%;
	background-repeat: no-repeat;
	-webkit-background-clip: text; background-clip: text;
	animation: pvh-contour-shine 3.6s linear infinite;
}
/* Lichtstreifen läuft einmal pro Zyklus über die Kontur; Ränder sind Gold → nahtlose Schleife. */
@keyframes pvh-contour-shine {
	0%   { background-position: 0% 0; }
	100% { background-position: 100% 0; }
}

/* Dezentes Trennzeichen über/unter dem Schriftzug. */
.pvh-divider { display: flex; align-items: center; justify-content: center; gap: 0.9rem; margin: 0.4rem auto; max-width: 360px; }
.pvh-divider::before, .pvh-divider::after { content: ""; height: 1px; flex: 1; background: linear-gradient(90deg, transparent, rgba(229,199,134,0.5), transparent); }
.pvh-divider span { color: var(--wp--preset--color--gold); font-size: 0.7rem; letter-spacing: 0.2em; }

/* „Eintreten"-Button: dunkle Pille mit rotierendem Gold-Spark-Rahmen. */
@property --pvh-a { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
.pvh-enter .wp-block-button__link {
	position: relative; isolation: isolate;
	background: #0d0a1c !important;
	color: #f0dca8 !important;
	border: 0 !important;
	border-radius: 999px !important;
	padding: 0.95rem 2.6rem !important;
	font-family: var(--wp--preset--font-family--mono) !important;
	letter-spacing: 0.18em; text-transform: uppercase; font-size: 0.8rem;
	transition: transform 0.25s ease, box-shadow 0.25s ease, color 0.25s ease;
}
.pvh-enter .wp-block-button__link::before {
	content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1.6px;
	background: conic-gradient(from var(--pvh-a), transparent 0 300deg, #e5c786 350deg, #fff6e0 360deg);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	        mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor; mask-composite: exclude;
	animation: pvh-enter-rot 3s linear infinite;
	pointer-events: none;
}
@keyframes pvh-enter-rot { to { --pvh-a: 360deg; } }
/* Hover: Pille füllt sich mit dem Logo-Gold, Schrift wird dunkelblau (vorherige Pillenfarbe). */
.pvh-enter .wp-block-button__link:hover {
	transform: translateY(-2px);
	background: #e5c786 !important;
	color: #0d0a1c !important;
	box-shadow: none !important;   /* kein Schein nach außen beim Hover */
}
.pvh-enter .wp-block-button__link:hover::before { opacity: 0; }
.pvh-enter .wp-block-button__link::before { transition: opacity 0.25s ease; }

/* Tagline: klein, dünn, subtil. */
.pvh-intro__tag {
	font-size: 0.8rem !important;
	font-weight: 300;
	letter-spacing: 0.03em;
	line-height: 1.65;
	opacity: 0.62;
	max-width: 480px;
	margin-inline: auto;
}

/* Cinematic-Ladebalken */
.pvh-loader {
	position: fixed; left: 50%; bottom: clamp(40px, 9vh, 80px); transform: translateX(-50%);
	z-index: 9999; display: flex; flex-direction: column; align-items: center; gap: 9px;
	width: min(360px, 70vw); transition: opacity 0.7s ease; pointer-events: none;
}
.pvh-loader.is-done { opacity: 0; }
.pvh-loader__txt { font-family: var(--wp--preset--font-family--mono); font-size: 0.7rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--wp--preset--color--gold); }
.pvh-loader__track { width: 100%; height: 3px; border-radius: 999px; background: rgba(255,255,255,0.1); overflow: hidden; }
.pvh-loader__track b { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #e5c786, #9d8bff); box-shadow: 0 0 10px rgba(229,199,134,0.6); }
.pvh-loader__pct { font-family: var(--wp--preset--font-family--mono); font-size: 0.68rem; letter-spacing: 0.1em; color: var(--wp--preset--color--mist); }
.pvh-portal-tiles {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	justify-content: center;
}
.pvh-portal-tiles .wp-block-button__link {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.78rem;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	background: rgba(28,23,64,0.5);
	color: var(--wp--preset--color--starlight) !important;
	border: 1px solid var(--wp--preset--color--hairline);
	backdrop-filter: blur(6px);
}
.pvh-portal-tiles .wp-block-button__link:hover {
	border-color: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--gold-bright) !important;
	background: rgba(28,23,64,0.7);
}

/* ---------------------------------------------------------------------------
 * 9. Scroll-Reveal
 * ------------------------------------------------------------------------- */
.pvh-reveal {
	opacity: 0;
	transform: translateY(28px);
	transition: opacity .8s ease, transform .8s ease;
	will-change: opacity, transform;
}
.pvh-reveal.is-visible {
	opacity: 1;
	transform: none;
}

/* ---------------------------------------------------------------------------
 * 10. Feinschliff
 * ------------------------------------------------------------------------- */
::selection {
	background: rgba(229,199,134,0.3);
	color: var(--wp--preset--color--starlight);
}
:where(a):focus-visible,
:where(button):focus-visible,
.wp-block-button__link:focus-visible {
	outline: 2px solid var(--wp--preset--color--gold-bright);
	outline-offset: 3px;
}
html {
	scroll-behavior: smooth;
}

/* ---------------------------------------------------------------------------
 * 10b. Konstellations-Raster & Arbeiten-Raster Feinheiten
 * ------------------------------------------------------------------------- */
.pvh-constellation__grid {
	position: relative;
	z-index: 1;
	gap: clamp(0.5rem, 2vw, 1.25rem);
}
/* Query-Loop-Karten: Bild oben randlos, Inhalt sitzt im Panel. */
.pvh-works .wp-block-post {
	height: 100%;
}
.pvh-card > .wp-block-post-featured-image {
	margin: 0;
}
.pvh-card .wp-block-post-featured-image img {
	width: 100%;
	display: block;
}
.pvh-card .wp-block-post-title a {
	color: var(--wp--preset--color--starlight);
}
.pvh-card .wp-block-post-title a:hover {
	color: var(--wp--preset--color--gold);
}

/* Suchfeld passend zum Kosmos. */
.wp-block-search__input {
	background: var(--wp--preset--color--nebula-deep);
	border: 1px solid var(--wp--preset--color--hairline);
	color: var(--wp--preset--color--starlight);
	border-radius: 999px;
	padding: 0.85rem 1.25rem;
}
.wp-block-search__input::placeholder { color: var(--wp--preset--color--mist); }
.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
	background: var(--wp--preset--color--nebula-deep);
	border: 1px solid var(--wp--preset--color--hairline);
	border-radius: 999px;
	padding: 4px;
}
.wp-block-search.wp-block-search__button-inside .wp-block-search__input {
	border: 0;
	background: transparent;
}

/* Kommentare / Eingaben generell. */
input[type="text"], input[type="email"], input[type="url"], textarea {
	background: var(--wp--preset--color--nebula-deep);
	border: 1px solid var(--wp--preset--color--hairline);
	color: var(--wp--preset--color--starlight);
	border-radius: 10px;
	padding: 0.7rem 0.9rem;
}

/* Pagination. */
.wp-block-query-pagination a,
.wp-block-query-pagination .wp-block-query-pagination-numbers {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.85rem;
	color: var(--wp--preset--color--mist);
}
.wp-block-query-pagination a:hover,
.wp-block-query-pagination .current { color: var(--wp--preset--color--gold); }

/* Mobile: Hero stapelt, Wappen kleiner. */
@media (max-width: 781px) {
	.pvh-hero { min-height: auto; text-align: center; }
	.pvh-hero__lede { margin-inline: auto; }
	.pvh-hero .wp-block-buttons { justify-content: center; }
}
/* Sehr schmale Screens: große Display-Schrift verkleinern, kein hässlicher Umbruch. */
@media (max-width: 480px) {
	.pvh-hero h1,
	.pvh-intro h1 {
		font-size: clamp(2rem, 10.5vw, 2.6rem) !important;
		letter-spacing: 0.01em;
		hyphens: none;
	}
}

/* ---------------------------------------------------------------------------
 * 12. Dashboard-Komponenten (Startseite im Referenz-Stil)
 * ------------------------------------------------------------------------- */
.pvh-wordmark {
	font-size: clamp(3.5rem, 9vw, 6rem) !important;
	line-height: 0.9 !important;
	letter-spacing: 0.04em !important;
	background: linear-gradient(180deg, #f2dca8 0%, #e5c786 45%, #b9923f 100%);
	-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}

/* Kennzahlen */
.pvh-stats { gap: 1px; border: 1px solid var(--wp--preset--color--hairline); border-radius: 14px; overflow: hidden; background: var(--wp--preset--color--hairline); }
.pvh-stat { background: var(--wp--preset--color--nebula-deep); padding: 1.4rem 1.1rem; display: flex; flex-direction: column; gap: 0.25rem; align-items: flex-start; }
.pvh-stat__num { font-family: var(--wp--preset--font-family--display); font-size: 1.9rem; color: var(--wp--preset--color--gold); line-height: 1; }
.pvh-stat__label { font-family: var(--wp--preset--font-family--mono); font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--wp--preset--color--mist); }

/* Badges */
.pvh-badge { display: inline-block; font-family: var(--wp--preset--font-family--mono); font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--wp--preset--color--gold); border: 1px solid rgba(229,199,134,0.4); border-radius: 999px; padding: 0.2rem 0.7rem; }
.pvh-badge--ok { color: #7fe0b0; border-color: rgba(127,224,176,0.4); }
.pvh-badge--beta { color: var(--wp--preset--color--violet-bright); border-color: rgba(157,139,255,0.4); }

/* Fortschrittsbalken */
.pvh-bar { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 0.3rem 0.5rem; margin-top: 0.6rem; }
.pvh-bar__label { font-family: var(--wp--preset--font-family--mono); font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--wp--preset--color--mist); }
.pvh-bar__val { font-family: var(--wp--preset--font-family--mono); font-size: 0.78rem; color: var(--wp--preset--color--gold); }
.pvh-bar__track { grid-column: 1 / -1; display: block; height: 6px; border-radius: 999px; background: rgba(255,255,255,0.08); overflow: hidden; }
.pvh-bar__track b { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #e5c786, #9d8bff); }

/* Was ich mache */
.pvh-services { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; margin-top: 2.2rem; }
.pvh-service { display: flex; align-items: center; gap: 14px; padding: 1.1rem 1.2rem; border: 1px solid var(--wp--preset--color--hairline); border-radius: 14px; background: rgba(28,23,64,0.35); text-decoration: none; transition: transform .25s ease, border-color .25s ease, background .25s ease; }
.pvh-service:hover { transform: translateY(-3px); border-color: rgba(229,199,134,0.45); background: rgba(28,23,64,0.6); }
.pvh-service__ic { flex: 0 0 42px; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 11px; background: rgba(110,91,214,0.18); color: var(--wp--preset--color--gold); }
.pvh-service__ic svg { width: 22px; height: 22px; }
.pvh-service__tx { display: flex; flex-direction: column; gap: 2px; flex: 1; }
.pvh-service__tx b { font-family: var(--wp--preset--font-family--display); color: var(--wp--preset--color--starlight); font-size: 1.02rem; }
.pvh-service__tx i { font-style: normal; color: var(--wp--preset--color--mist); font-size: 0.88rem; }
.pvh-service__ar { color: var(--wp--preset--color--gold); opacity: 0; transform: translateX(-6px); transition: all .25s ease; }
.pvh-service:hover .pvh-service__ar { opacity: 1; transform: none; }

/* Downloads & News Listen */
.pvh-dl-list, .pvh-news-list { display: flex; flex-direction: column; gap: 10px; margin-top: 1.4rem; }
.pvh-dl, .pvh-news { display: flex; align-items: center; gap: 12px; padding: 0.9rem 1.1rem; border: 1px solid var(--wp--preset--color--hairline); border-radius: 12px; background: var(--wp--preset--color--nebula-deep); text-decoration: none; transition: border-color .25s ease, transform .25s ease; }
.pvh-dl:hover, .pvh-news:hover { border-color: rgba(229,199,134,0.4); transform: translateX(3px); }
.pvh-dl__main { display: flex; flex-direction: column; flex: 1; }
.pvh-dl__main b { color: var(--wp--preset--color--starlight); }
.pvh-dl__main i { font-style: normal; font-size: 0.82rem; color: var(--wp--preset--color--mist); }
.pvh-dl__size { font-family: var(--wp--preset--font-family--mono); font-size: 0.78rem; color: var(--wp--preset--color--mist); white-space: nowrap; }
.pvh-news__tag { font-family: var(--wp--preset--font-family--mono); font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--wp--preset--color--violet-bright); border: 1px solid rgba(157,139,255,0.3); border-radius: 6px; padding: 0.15rem 0.45rem; white-space: nowrap; }
.pvh-news__tx { flex: 1; }
.pvh-news__tx b { color: var(--wp--preset--color--starlight); font-weight: 400; font-size: 0.92rem; }
.pvh-news__date { font-family: var(--wp--preset--font-family--mono); font-size: 0.72rem; color: var(--wp--preset--color--mist); white-space: nowrap; }

/* Projektstatus */
.pvh-status-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.pvh-status { border: 1px solid var(--wp--preset--color--hairline); border-radius: 14px; background: rgba(13,10,30,0.6); padding: 1.3rem 1.3rem 1.5rem; }
.pvh-status__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.pvh-status__head b { font-family: var(--wp--preset--font-family--display); color: var(--wp--preset--color--starlight); }
.pvh-status__sub { display: block; font-style: normal; font-size: 0.8rem; color: var(--wp--preset--color--mist); margin-top: 2px; }
.pvh-phases { display: flex; gap: 10px; margin-top: 1rem; }
.pvh-phases s { width: 12px; height: 12px; border-radius: 50%; border: 1px solid var(--wp--preset--color--hairline); background: transparent; }
.pvh-phases s.on { background: radial-gradient(circle, #f2dca8, #e5c786); border-color: transparent; box-shadow: 0 0 10px rgba(229,199,134,0.6); }
.pvh-phase-legend { display: flex; justify-content: space-between; gap: 4px; margin-top: 6px; }
.pvh-phase-legend span { font-family: var(--wp--preset--font-family--mono); font-size: 0.6rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--wp--preset--color--mist); }

/* Vertrauenspunkte */
.pvh-trust { display: flex; flex-direction: column; gap: 14px; }
.pvh-trust__item { border-left: 2px solid var(--wp--preset--color--gold); padding: 0.2rem 0 0.2rem 1rem; }
.pvh-trust__item b { display: block; font-family: var(--wp--preset--font-family--display); color: var(--wp--preset--color--starlight); }
.pvh-trust__item i { font-style: normal; color: var(--wp--preset--color--mist); font-size: 0.88rem; }

/* Anfrage-Formular */
.pvh-form { display: flex; flex-direction: column; gap: 12px; }
.pvh-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pvh-form input, .pvh-form select, .pvh-form textarea { width: 100%; background: var(--wp--preset--color--nebula-deep); border: 1px solid var(--wp--preset--color--hairline); color: var(--wp--preset--color--starlight); border-radius: 10px; padding: 0.8rem 1rem; font-family: var(--wp--preset--font-family--body); }
.pvh-form input::placeholder, .pvh-form textarea::placeholder { color: var(--wp--preset--color--mist); }
.pvh-form select { color: var(--wp--preset--color--mist); }
.pvh-form-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.pvh-form-btn { align-self: flex-start; font-family: var(--wp--preset--font-family--mono); text-transform: uppercase; letter-spacing: 0.12em; font-size: 0.8rem; font-weight: 700; color: var(--wp--preset--color--void); background: var(--wp--preset--color--gold); border: 0; border-radius: 999px; padding: 0.85rem 1.8rem; cursor: pointer; transition: transform .25s ease, background .25s ease; }
.pvh-form-btn:hover { background: var(--wp--preset--color--gold-bright); transform: translateY(-2px); }
.pvh-form-ok { border: 1px solid rgba(127,224,176,0.5); background: rgba(127,224,176,0.08); color: #aef0d0; border-radius: 12px; padding: 1.1rem 1.3rem; }
.pvh-form-err { color: #ffb4b4; font-size: 0.9rem; }

@media (max-width: 600px) {
	.pvh-form-row { grid-template-columns: 1fr; }
	.pvh-phase-legend span { font-size: 0.55rem; }
}

/* ---------------------------------------------------------------------------
 * 11. Reduced Motion — alle Bewegung deaktivieren, Inhalt bleibt sichtbar.
 * ------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}
	.pvh-reveal { opacity: 1; transform: none; }
	.pvh-constellation__lines line,
	.pvh-constellation__lines path { stroke-dashoffset: 0; }
}