/*!
 * DLA Welcome Gate - frontend styles
 *
 * Toate culorile vin din variabilele scrise inline in <head> de plugin.
 *
 * Nota de specificitate: reset-ul defensiv de mai jos tinteste elemente
 * (div, p, span), deci #dlawg-gate div = (1,0,1). Toate regulile de layout
 * sunt prefixate cu #dlawg-gate si folosesc o clasa = (1,1,0), ca sa castige
 * si in fata reset-ului, si in fata temelor agresive.
 */

/* ------------------------------------------------ ecran de text (faza 2) */

#dlawg-gate .dlawg-phase--intro {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: none;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: clamp(16px, 3.5vh, 34px);
	padding: clamp(24px, 6vh, 60px) clamp(20px, 8vw, 80px);
	cursor: pointer;
}

#dlawg-gate.is-text .dlawg-phase--intro {
	display: flex;
}

#dlawg-gate.is-text .dlawg-gate__scroll,
#dlawg-gate.is-tocross .dlawg-gate__scroll {
	pointer-events: none;
}

#dlawg-gate.is-text .dlawg-gate__scroll {
	display: none;
}

#dlawg-gate .dlawg-intro__line {
	position: relative;
	max-width: 100%;
	font-size: calc(clamp(1.35rem, 5.4vw, 2.7rem) * var(--dlawg-fs-intro, 1));
	font-weight: 400;
	line-height: 1.35;
	color: var(--dlawg-ink, #f7f3e9);
}

#dlawg-gate .dlawg-intro__line--1 {
	top: var(--dlawg-off-intro1, 0px);
}

#dlawg-gate .dlawg-intro__line--2 {
	top: var(--dlawg-off-intro2, 0px);
	font-style: italic;
	color: var(--dlawg-gold-lt, #f0ce8b);
}

/* Typewriter: fantoma invizibila rezerva latimea si randurile finale, textul
   viu se scrie litera cu litera peste ea, aliniat la stanga, cutia centrata. */
#dlawg-gate .dlawg-type {
	width: -moz-fit-content;
	width: fit-content;
	margin-left: auto;
	margin-right: auto;
	text-align: var(--dlawg-type-align, center);
}

#dlawg-gate .dlawg-type__ghost {
	display: block;
	visibility: hidden;
	white-space: pre-wrap;
}

#dlawg-gate .dlawg-type__live {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	display: block;
	text-align: inherit;
	white-space: pre-wrap;
}

@keyframes dlawg-caret {
	50% {
		opacity: 0;
	}
}

#dlawg-gate .dlawg-type__live.is-typing::after {
	content: "";
	display: inline-block;
	width: 2px;
	height: 0.9em;
	margin-left: 2px;
	vertical-align: -0.08em;
	background-color: var(--dlawg-gold-lt, #f0ce8b);
	animation: dlawg-caret 0.8s steps(1) infinite;
}

/* Trecerea de la gate la ecranul de text: elementele gate-ului se disperseaza
   cu blur, fundalul ramane, apoi incepe scrierea. */
html.dlawg-armed #dlawg-gate.is-tocross [data-anim] {
	animation: dlawg-disperse calc(0.62s * var(--dlawg-t, 1)) cubic-bezier(0.4, 0, 0.7, 0.4) calc(var(--dout, 0s) * var(--dlawg-t, 1)) forwards;
}

html.dlawg-armed #dlawg-gate.is-tocross .dlawg-emblem[data-anim] {
	animation-name: dlawg-disperse-emblem;
	animation-duration: calc(0.72s * var(--dlawg-t, 1));
}

html.dlawg-armed #dlawg-gate.is-tocross .dlawg-rule__line,
html.dlawg-armed #dlawg-gate.is-tocross .dlawg-emblem__sheen {
	animation: none;
}

/* ---------------------------------------------------------------- shell */

#dlawg-gate {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: var(--dlawg-z, 2147483001);
	display: none;
	color: var(--dlawg-ink, #f7f3e9);
	font-family: var(--dlawg-font, Georgia, serif);
	text-align: center;
	touch-action: none;
	overscroll-behavior: contain;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-tap-highlight-color: transparent;
}

html.dlawg-armed #dlawg-gate {
	display: block;
}

/* Focusul initial se pune pe dialog, nu pe buton, ca sa nu apara inelul
   auriu la vizitatorii care folosesc mouse-ul sau touch-ul. */
#dlawg-gate:focus {
	outline: none;
}

/* Reset defensiv fata de teme agresive (Divi, Avada, Astra). */
#dlawg-gate *,
#dlawg-gate *::before,
#dlawg-gate *::after {
	box-sizing: border-box;
}

#dlawg-gate p,
#dlawg-gate div,
#dlawg-gate span,
#dlawg-gate i,
#dlawg-gate b {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	font-style: normal;
	font-weight: inherit;
	line-height: inherit;
	text-transform: none;
	letter-spacing: inherit;
	text-shadow: none;
}

#dlawg-gate img {
	display: block;
	max-width: 100%;
	height: auto;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

#dlawg-gate .dlawg-gate__bg {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: var(--dlawg-bg, #000e29);
	background-image: radial-gradient(118% 76% at 50% 33%, var(--dlawg-bg-lift, #0b2145) 0%, var(--dlawg-bg, #000e29) 58%);
	opacity: 1;
}

#dlawg-gate .dlawg-gate__scroll {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
	touch-action: pan-y;
	-webkit-overflow-scrolling: touch;
}

#dlawg-gate .dlawg-gate__inner {
	display: grid;
	grid-template-rows: 1fr auto;
	gap: clamp(20px, 3.6vh, 42px);
	min-height: 100%;
	padding: clamp(24px, 5vh, 60px) clamp(20px, 6vw, 52px) clamp(22px, 4.5vh, 52px);
}

#dlawg-gate .dlawg-gate__main {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: clamp(18px, 4vh, 44px);
}

/* --------------------------------------------------------------- emblem */

#dlawg-gate .dlawg-emblem {
	position: relative;
	top: var(--dlawg-off-emblem, 0px);
	width: min(var(--dlawg-logo-w, 250px), 42vw);
	line-height: 0;
}

#dlawg-gate .dlawg-emblem__img {
	width: 100%;
}

#dlawg-gate .dlawg-emblem__sheen {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-image: linear-gradient(102deg, rgba(255, 247, 228, 0) 38%, rgba(255, 247, 228, 0.92) 50%, rgba(255, 247, 228, 0) 62%);
	background-repeat: no-repeat;
	background-size: 260% 100%;
	background-position: 190% 0;
	-webkit-mask-image: var(--dlawg-emblem);
	mask-image: var(--dlawg-emblem);
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	mix-blend-mode: screen;
	opacity: 0;
	pointer-events: none;
}

/* ---------------------------------------------------------------- title */

#dlawg-gate .dlawg-title {
	position: relative;
	top: var(--dlawg-off-title, 0px);
	display: flex;
	flex-direction: column;
	align-items: center;
	max-width: 100%;
	/* 6.3vw este calibrat pe randul implicit cel mai lung ("Welcome to the
	   Intellectual Home", raport masurat 13.5px text / 1px font, cu padding
	   lateral de 6vw pe fiecare parte): incape pe un singur rand de la 320px
	   in sus la scala 100%. Scala vine din setarea "Marimi". */
	font-size: calc(clamp(1.25rem, 6.3vw, 3.4rem) * var(--dlawg-fs-title, 1));
	font-weight: 400;
	line-height: 1.24;
	letter-spacing: 0.005em;
	color: var(--dlawg-ink, #f7f3e9);
	overflow-wrap: break-word;
	text-wrap: balance;
}

#dlawg-gate .dlawg-title__line {
	display: block;
}

/* ----------------------------------------------------------------- rule */

#dlawg-gate .dlawg-gate__main .dlawg-rule {
	position: relative;
	top: var(--dlawg-off-rule, 0px);
}

#dlawg-gate .dlawg-rule {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: clamp(10px, 3vw, 18px);
}

#dlawg-gate .dlawg-rule__line {
	display: block;
	width: clamp(56px, 17vw, 118px);
	height: 1px;
	background-image: linear-gradient(to right, rgba(var(--dlawg-gold-rgb, 194, 146, 46), 0), rgba(var(--dlawg-gold-rgb, 194, 146, 46), 0.85));
	transform-origin: right center;
}

#dlawg-gate .dlawg-rule__line:last-child {
	background-image: linear-gradient(to left, rgba(var(--dlawg-gold-rgb, 194, 146, 46), 0), rgba(var(--dlawg-gold-rgb, 194, 146, 46), 0.85));
	transform-origin: left center;
}

#dlawg-gate .dlawg-rule__gem {
	display: block;
	width: 7px;
	height: 7px;
	background-color: var(--dlawg-gold, #c2922e);
	transform: rotate(45deg);
}

#dlawg-gate .dlawg-rule--sm {
	position: relative;
	top: var(--dlawg-off-rule-sm, 0px);
}

#dlawg-gate .dlawg-rule--sm .dlawg-rule__line {
	width: clamp(64px, 22vw, 150px);
	opacity: 0.75;
}

#dlawg-gate .dlawg-rule--sm .dlawg-rule__gem {
	width: 5px;
	height: 5px;
}

/* --------------------------------------------------------------- button */

#dlawg-gate .dlawg-cta {
	position: relative;
	top: var(--dlawg-off-button, 0px);
	padding-top: clamp(2px, 1.2vh, 16px);
}

#dlawg-gate .dlawg-enter {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: calc(min(420px, 72vw) * var(--dlawg-btn-scale, 1));
	min-height: calc(56px * var(--dlawg-btn-scale, 1));
	margin: 0;
	padding: calc(clamp(15px, 2.1vh, 21px) * var(--dlawg-btn-scale, 1)) calc(clamp(40px, 12vw, 84px) * var(--dlawg-btn-scale, 1));
	border: 0;
	border-radius: 0;
	background-color: var(--dlawg-btn, #1a483e);
	background-image: none;
	color: var(--dlawg-btn-ink, #f7f3e9);
	font-family: inherit;
	font-size: calc(clamp(1.15rem, 4.4vw, 1.45rem) * var(--dlawg-fs-btn, 1));
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.05em;
	text-transform: none;
	text-shadow: none;
	cursor: pointer;
	overflow: hidden;
	box-shadow:
		0 18px 42px -24px rgba(0, 0, 0, 0.95),
		inset 0 0 0 1px rgba(var(--dlawg-gold-rgb, 194, 146, 46), 0);
	transition:
		background-color 0.4s ease,
		box-shadow 0.45s ease,
		letter-spacing 0.45s cubic-bezier(0.22, 0.61, 0.36, 1),
		transform 0.2s ease;
}

#dlawg-gate .dlawg-enter:hover,
#dlawg-gate .dlawg-enter:focus-visible {
	background-color: var(--dlawg-btn-lift, #2b5b4f);
	letter-spacing: 0.1em;
	box-shadow:
		0 22px 48px -22px rgba(0, 0, 0, 1),
		inset 0 0 0 1px rgba(var(--dlawg-gold-rgb, 194, 146, 46), 0.5);
}

#dlawg-gate .dlawg-enter:focus-visible {
	outline: 2px solid var(--dlawg-gold-lt, #f0ce8b);
	outline-offset: 4px;
}

#dlawg-gate .dlawg-enter:active {
	transform: translateY(1px);
}

#dlawg-gate .dlawg-enter__txt {
	position: relative;
	z-index: 1;
}

#dlawg-gate .dlawg-enter__fold {
	position: absolute;
	right: 0;
	bottom: 0;
	width: clamp(30px, 9vw, 46px);
	height: clamp(30px, 9vw, 46px);
	background-image: linear-gradient(to top left, rgba(255, 255, 255, 0.18) 50%, rgba(255, 255, 255, 0) 50%);
	pointer-events: none;
}

/* --------------------------------------------------------------- footer */

#dlawg-gate .dlawg-foot {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: clamp(9px, 1.6vh, 18px);
}

#dlawg-gate .dlawg-motto {
	position: relative;
	top: var(--dlawg-off-motto, 0px);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: clamp(9px, 3vw, 20px);
	color: var(--dlawg-gold-lt, #f0ce8b);
	font-size: calc(clamp(0.8rem, 3.1vw, 1rem) * var(--dlawg-fs-foot, 1));
	line-height: 1.4;
	letter-spacing: 0.19em;
	text-transform: uppercase;
}

#dlawg-gate .dlawg-motto__gem {
	display: block;
	width: 5px;
	height: 5px;
	background-color: var(--dlawg-gold, #c2922e);
	transform: rotate(45deg);
}

#dlawg-gate .dlawg-tagline {
	position: relative;
	top: var(--dlawg-off-tagline, 0px);
	color: var(--dlawg-gold, #c2922e);
	font-size: calc(clamp(0.66rem, 2.5vw, 0.82rem) * var(--dlawg-fs-foot, 1));
	line-height: 1.9;
	letter-spacing: 0.17em;
	text-transform: uppercase;
	opacity: 0.92;
}

/* ------------------------------------------------------------- intrarea */

@keyframes dlawg-rise {
	from {
		opacity: 0;
		transform: translateY(16px);
		filter: blur(9px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
		filter: blur(0);
	}
}

@keyframes dlawg-emblem-in {
	from {
		opacity: 0;
		transform: scale(0.9);
		filter: blur(13px);
	}

	to {
		opacity: 1;
		transform: scale(1);
		filter: blur(0);
	}
}

@keyframes dlawg-draw {
	from {
		transform: scaleX(0);
	}

	to {
		transform: scaleX(1);
	}
}

@keyframes dlawg-sheen {
	0% {
		background-position: 190% 0;
		opacity: 0;
	}

	14% {
		opacity: 0.85;
	}

	60% {
		opacity: 0.85;
	}

	100% {
		background-position: -90% 0;
		opacity: 0;
	}
}

@keyframes dlawg-sheen-loop {
	0% {
		background-position: 190% 0;
		opacity: 0;
	}

	3% {
		opacity: 0.8;
	}

	14% {
		opacity: 0.8;
	}

	24% {
		background-position: -90% 0;
		opacity: 0;
	}

	100% {
		background-position: -90% 0;
		opacity: 0;
	}
}

html.dlawg-armed #dlawg-gate [data-anim] {
	animation: dlawg-rise calc(0.95s * var(--dlawg-t, 1)) cubic-bezier(0.22, 0.61, 0.36, 1) calc(var(--d, 0s) * var(--dlawg-t, 1)) backwards;
}

html.dlawg-armed #dlawg-gate .dlawg-emblem[data-anim] {
	animation-name: dlawg-emblem-in;
	animation-duration: calc(1.25s * var(--dlawg-t, 1));
}

/* Countdown-ul doar apare, nu mai urca: pe telefon urcarea de 16px cu blur
   pe cifrele mari pierdea cadre si se vedea ca un salt in sus. */
html.dlawg-armed #dlawg-gate .dlawg-cd[data-anim] {
	animation-name: dlawg-fade;
}

@keyframes dlawg-fade {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

html.dlawg-armed #dlawg-gate .dlawg-rule__line {
	animation: dlawg-draw calc(0.9s * var(--dlawg-t, 1)) cubic-bezier(0.22, 0.61, 0.36, 1) calc((var(--d, 0s) + 0.12s) * var(--dlawg-t, 1)) backwards;
}

html.dlawg-armed #dlawg-gate.has-sheen .dlawg-emblem__sheen {
	animation: dlawg-sheen calc(2.3s * var(--dlawg-t, 1)) cubic-bezier(0.32, 0, 0.2, 1) calc(var(--dlawg-sheen-d, 0.8s) * var(--dlawg-t, 1)) both;
}

html.dlawg-armed #dlawg-gate.has-sheen.has-ambient .dlawg-emblem__sheen {
	animation: dlawg-sheen-loop 11s cubic-bezier(0.32, 0, 0.2, 1) calc(var(--dlawg-sheen-d, 0.8s) * var(--dlawg-t, 1)) infinite both;
}

/* -------------------------------------------------------------- iesirea */

/* Elementele interioare sunt sub o animatie CSS cu fill both. Daca la iesire
   doar anulam animatia si punem valori noi cu transition, browserul nu mai
   porneste tranzitia si continutul dispare instant. De aceea iesirea lor este
   tot pe keyframes: o animatie o inlocuieste curat pe cealalta. */

@keyframes dlawg-disperse {
	to {
		opacity: 0;
		transform: translateY(-18px) scale(1.03);
		filter: blur(12px);
	}
}

@keyframes dlawg-disperse-emblem {
	to {
		opacity: 0;
		transform: translateY(-16px) scale(1.16);
		filter: blur(16px);
	}
}

#dlawg-gate.is-leaving {
	opacity: 0;
	transform: scale(1.055);
	filter: blur(var(--dlawg-exit-blur, 22px));
	pointer-events: none;
	transition:
		opacity calc(0.82s * var(--dlawg-t, 1)) cubic-bezier(0.5, 0, 0.85, 0.45),
		transform calc(1s * var(--dlawg-t, 1)) cubic-bezier(0.36, 0, 0.2, 1),
		filter calc(0.82s * var(--dlawg-t, 1)) cubic-bezier(0.5, 0, 0.85, 0.45);
}

#dlawg-gate.is-leaving .dlawg-gate__bg {
	opacity: 0;
	transition: opacity calc(0.78s * var(--dlawg-t, 1)) cubic-bezier(0.5, 0, 0.85, 0.45);
}

@supports ((-webkit-backdrop-filter: blur(4px)) or (backdrop-filter: blur(4px))) {
	#dlawg-gate.is-leaving .dlawg-gate__bg {
		-webkit-backdrop-filter: blur(16px);
		backdrop-filter: blur(16px);
	}
}

html.dlawg-armed #dlawg-gate.is-leaving [data-anim] {
	animation: dlawg-disperse calc(0.62s * var(--dlawg-t, 1)) cubic-bezier(0.4, 0, 0.7, 0.4) calc(var(--dout, 0s) * var(--dlawg-t, 1)) forwards;
}

html.dlawg-armed #dlawg-gate.is-leaving .dlawg-emblem[data-anim] {
	animation-name: dlawg-disperse-emblem;
	animation-duration: calc(0.72s * var(--dlawg-t, 1));
}

html.dlawg-armed #dlawg-gate.is-leaving .dlawg-rule__line,
html.dlawg-armed #dlawg-gate.is-leaving .dlawg-emblem__sheen {
	animation: none;
}

/* ------------------------------------------------------------ accesibil */

@media (prefers-reduced-motion: reduce) {
	html.dlawg-armed #dlawg-gate [data-anim],
	html.dlawg-armed #dlawg-gate .dlawg-rule__line,
	html.dlawg-armed #dlawg-gate .dlawg-emblem__sheen {
		animation: none !important;
	}

	#dlawg-gate .dlawg-emblem__sheen {
		display: none;
	}

	#dlawg-gate .dlawg-type__live.is-typing::after {
		animation: none;
	}

	html.dlawg-armed #dlawg-gate.is-leaving [data-anim],
	html.dlawg-armed #dlawg-gate.is-leaving .dlawg-emblem[data-anim] {
		animation: none !important;
	}

	#dlawg-gate.is-leaving {
		transform: none;
		filter: none;
		transition: opacity 0.35s ease;
	}

	#dlawg-gate.is-leaving .dlawg-gate__bg {
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
	}

	#dlawg-gate .dlawg-enter {
		transition: background-color 0.2s ease;
	}

	#dlawg-gate .dlawg-enter:hover,
	#dlawg-gate .dlawg-enter:focus-visible {
		letter-spacing: 0.05em;
	}
}

/* ----------------------------------------------------------- responsive */

@media (max-width: 480px) {
	#dlawg-gate .dlawg-motto {
		letter-spacing: 0.15em;
	}
}

/* Latimea emblemei pe mobil, setabila separat din admin. Plafonul de 62vw
   garanteaza ca nu iese din ecran nici cu valori mari. */
@media (max-width: 782px) {
	#dlawg-gate .dlawg-emblem {
		width: min(var(--dlawg-logo-w-m, 190px), 62vw);
	}
}

/* Ecrane joase sau telefon in landscape: totul se compacteaza. */
@media (max-height: 640px) and (orientation: landscape) {
	#dlawg-gate .dlawg-gate__inner {
		gap: 10px;
		padding: 16px 24px 18px;
	}

	#dlawg-gate .dlawg-gate__main {
		gap: 10px;
	}

	#dlawg-gate .dlawg-emblem {
		width: min(104px, 17vw);
	}

	#dlawg-gate .dlawg-title {
		font-size: calc(clamp(1rem, 2.9vw, 1.55rem) * var(--dlawg-fs-title, 1));
	}

	#dlawg-gate .dlawg-cta {
		padding-top: 0;
	}

	#dlawg-gate .dlawg-enter {
		min-height: calc(42px * var(--dlawg-btn-scale, 1));
		padding: calc(10px * var(--dlawg-btn-scale, 1)) calc(44px * var(--dlawg-btn-scale, 1));
		font-size: calc(1.05rem * var(--dlawg-fs-btn, 1));
	}

	#dlawg-gate .dlawg-foot {
		gap: 6px;
	}

	#dlawg-gate .dlawg-motto {
		font-size: 0.72rem;
	}

	#dlawg-gate .dlawg-tagline {
		font-size: 0.6rem;
		line-height: 1.7;
	}
}

/* ======================================================================
   MOD LANSARE — countdown, formular, poarta care nu se inchide
   ====================================================================== */

/* In modul lansare nu exista iesire: fara buton de inchidere, fara scroll
   in spate, fara cursorul de "tap to enter". */
.dlawg-gate.is-launch .dlawg-close,
.dlawg-gate.is-launch .dlawg-skip,
.dlawg-gate.is-launch .dlawg-gate__hint { display: none !important; }
.dlawg-gate.is-launch { cursor: default; }

/* ── Countdown ── */
/* Deplasarea se face cu top, ca la emblema si titlu, nu cu transform:
   countdown-ul intra cu animatia dlawg-rise, care controleaza transform pana
   se termina; cu translateY, offset-ul (de ex. -20px pe mobil) se aplica abia
   dupa animatie, iar countdown-ul sarea brusc mai sus. */
.dlawg-cd {
	position: relative;
	top: var(--dlawg-off-cd, 0px);
	margin-top: var(--dlawg-gap-cd, 34px);
	text-align: center;
}
/* "We launch in" foloseste fontul de afisaj al gate-ului (Marcellus, ca
   titlul randului "Remind me" si cifrele), cu majuscule naturale. Prefixul
   #dlawg-gate tine tema departe de font, marime si transformare. */
html #dlawg-gate .dlawg-cd .dlawg-cd__label {
	margin: 0 0 12px !important;
	font-family: 'Marcellus', 'Cormorant Garamond', Georgia, serif !important;
	font-size: calc(15px * var(--dlawg-fs-cdlabel, 1)) !important;
	font-weight: 400 !important;
	font-style: normal !important;
	line-height: 1.3 !important;
	letter-spacing: .06em !important;
	text-transform: none !important;
	color: var(--dlawg-gold, #cdac6c);
	opacity: 1;
}
.dlawg-cd__row {
	display: inline-flex;
	align-items: flex-start;
	gap: 10px;
}
.dlawg-cd__cell {
	min-width: 72px;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.dlawg-cd__num {
	font-family: 'Marcellus', 'Cormorant Garamond', Georgia, serif;
	font-size: var(--dlawg-cd-size, 46px);
	line-height: 1;
	color: #f3ead3;
	font-variant-numeric: tabular-nums;
	font-feature-settings: 'tnum' 1;
}
.dlawg-cd__unit {
	margin-top: 8px;
	font-family: 'Montserrat', system-ui, sans-serif;
	font-size: calc(9px * var(--dlawg-fs-cdunit, 1));
	letter-spacing: .22em;
	text-transform: uppercase;
	color: rgba(243, 234, 211, .55);
}
.dlawg-cd__sep {
	font-family: 'Marcellus', Georgia, serif;
	font-size: calc(var(--dlawg-cd-size, 46px) * .7);
	line-height: 1;
	color: rgba(205, 172, 108, .45);
	font-style: normal;
	margin-top: 2px;
}

/* Pe mobil coloana principala intinde copiii; countdown-ul si formularul
   trebuie sa isi pastreze inaltimea proprie. */
#dlawg-gate .dlawg-gate__main > .dlawg-cd,
#dlawg-gate .dlawg-gate__main > .dlawg-remind,
#dlawg-gate .dlawg-gate__main > .dlawg-done { flex: 0 0 auto; width: 100%; }

/* ── Formularul "Remind me" ── */
.dlawg-remind {
	flex: 0 0 auto;
	margin-top: var(--dlawg-gap-form, 28px);
	transform: translateY(var(--dlawg-off-form, 0px));
	width: 100%;
	max-width: var(--dlawg-form-w, 460px);
	margin-left: auto;
	margin-right: auto;
}
.dlawg-remind__cue {
	position: relative;          /* ancora pentru textul care se scrie */
	margin: 0 0 16px;
	transform: translateY(var(--dlawg-off-cue, 0px));
	text-align: center;
	font-family: 'Marcellus', 'Cormorant Garamond', Georgia, serif;
	font-size: calc(20px * var(--dlawg-fs-cue, 1));
	line-height: 1.35;
	color: #f3ead3;
	min-height: 1.35em;
}
.dlawg-form {
	opacity: 0;
	transform: translateY(8px);
	transition: opacity .6s ease, transform .6s ease;
	pointer-events: none;
}
.dlawg-form.is-ready { opacity: 1; transform: none; pointer-events: auto; }
.dlawg-form__row { display: flex; gap: var(--dlawg-field-gap, 10px); flex-wrap: wrap; align-items: flex-start; }
.dlawg-field { flex: 1 1 180px; display: block; min-width: 0; }
.dlawg-form input[type="text"],
.dlawg-form input[type="email"] {
	width: 100%;
	box-sizing: border-box;
	height: 48px;
	padding: 0 16px;
	background: rgba(255, 255, 255, .05);
	border: 1px solid rgba(205, 172, 108, .35);
	border-radius: 2px;
	color: #f3ead3;
	font-family: 'Montserrat', system-ui, sans-serif;
	font-size: calc(14px * var(--dlawg-fs-form, 1));
	outline: none;
	transition: border-color .3s ease, background .3s ease;
}
#dlawg-gate .dlawg-form input::placeholder {
	color: rgba(243, 234, 211, .45);
	font-family: inherit;
	font-style: normal;
	font-size: inherit;
	letter-spacing: normal;
	opacity: 1;
}
.dlawg-form input:focus {
	border-color: var(--dlawg-gold, #cdac6c);
	background: rgba(255, 255, 255, .08);
}
.dlawg-form input.has-error { border-color: #c25b5b; }
/* Specificitate cu #dlawg-gate: regula de baza "#dlawg-gate .dlawg-enter
   { margin: 0 }" anula distanta pana la buton setata din admin. */
#dlawg-gate .dlawg-form .dlawg-form__submit {
	display: flex;
	width: 100%;
	min-width: 0;
	margin: var(--dlawg-btn-gap, 12px) 0 0 !important;
	justify-content: center;
	/* butonul formularului are propria inaltime si font (Lansare > Formular) */
	min-height: var(--dlawg-sub-h, 48px) !important;
	height: var(--dlawg-sub-h, 48px) !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	font-size: calc(clamp(1.05rem, 3.6vw, 1.4rem) * var(--dlawg-sub-fs, 1)) !important;
}
.dlawg-form input[type="text"],
.dlawg-form input[type="email"] { height: var(--dlawg-field-h, 48px); }
.dlawg-form__consent {
	margin: 12px 0 0;
	font-family: 'Montserrat', system-ui, sans-serif;
	font-size: 11px;
	line-height: 1.6;
	color: rgba(243, 234, 211, .5);
	text-align: center;
}
.dlawg-form__consent a { color: var(--dlawg-gold, #cdac6c); }
.dlawg-form__msg {
	margin: 14px 0 0;
	min-height: 1.4em;
	text-align: center;
	font-family: 'Montserrat', system-ui, sans-serif;
	font-size: 13px;
	color: rgba(243, 234, 211, .7);
}
.dlawg-form__msg.is-error { color: #e2a0a0; }
.dlawg-form__msg.is-done { color: var(--dlawg-gold, #cdac6c); }
.dlawg-remind.is-done .dlawg-form__row,
.dlawg-remind.is-done .dlawg-form__submit,
.dlawg-remind.is-done .dlawg-form__consent { display: none; }
.dlawg-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 680px) {
	.dlawg-cd__cell { min-width: 56px; }
	.dlawg-cd__num { font-size: var(--dlawg-cd-size-m, 30px); }
	.dlawg-cd__sep { font-size: calc(var(--dlawg-cd-size-m, 30px) * .7); }
	.dlawg-cd__row { gap: 6px; }
	.dlawg-remind__cue { font-size: calc(17px * var(--dlawg-fs-cue, 1)); }
	.dlawg-form__row { flex-direction: column; gap: var(--dlawg-field-gap, 10px); }
	/* intr-o coloana, flex-grow ar intinde fiecare camp pe toata inaltimea libera */
	.dlawg-field { flex: 0 0 auto; width: 100%; }
}

/* ── Dupa inscriere: mesajul ia locul formularului ───────────────────
   Emblema, titlul, filetul si countdown-ul raman neschimbate. Formularul
   si mesajul final stau suprapuse in aceeasi celula de grid, asa ca zona
   are mereu inaltimea celui mai inalt dintre ele si nimic nu sare:
   formularul se stinge (is-sending), apoi mesajul se scrie in locul lui. */

#dlawg-gate .dlawg-gate__main > .dlawg-swap { flex: 0 0 auto; width: 100%; }

.dlawg-swap {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	width: 100%;
}

.dlawg-swap > .dlawg-remind,
.dlawg-swap > .dlawg-done {
	grid-area: 1 / 1;
	justify-self: center;
	min-width: 0;
}

#dlawg-gate .dlawg-remind {
	transition: opacity .5s ease, transform .6s ease, visibility 0s linear 0s;
}

#dlawg-gate.is-sending .dlawg-remind,
#dlawg-gate.is-sent .dlawg-remind {
	opacity: 0;
	transform: translateY(calc(var(--dlawg-off-form, 0px) - 8px));
	pointer-events: none;
}

#dlawg-gate.is-sent .dlawg-remind {
	visibility: hidden;
	transition-delay: 0s, 0s, .5s;
}

.dlawg-done {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-self: center;
	margin-top: var(--dlawg-gap-form, 28px);          /* acelasi loc ca formularul */
	transform: translateY(calc(var(--dlawg-off-form, 0px) + var(--dlawg-off-done, 0px)));
	width: 100%;
	max-width: var(--dlawg-done-w, 44rem);
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .9s ease;
}

#dlawg-gate.is-sent .dlawg-done {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

/* ── Al doilea ecran (Dupa inscriere = "Al doilea ecran") ───────────────
   Titlul, filetul, countdown-ul si formularul se sting, apoi ies din pagina;
   mesajul ramane singur (sub emblema, daca e pastrata), centrat pe ecran. */
#dlawg-gate.done-screen .dlawg-title,
#dlawg-gate.done-screen .dlawg-gate__main > .dlawg-rule,
#dlawg-gate.done-screen .dlawg-cd,
#dlawg-gate.done-screen.done-hides-emblem .dlawg-emblem {
	transition: opacity .5s ease, transform .6s ease;
}

#dlawg-gate.done-screen.is-sending .dlawg-title,
#dlawg-gate.done-screen.is-sending .dlawg-gate__main > .dlawg-rule,
#dlawg-gate.done-screen.is-sending .dlawg-cd,
#dlawg-gate.done-screen.done-hides-emblem.is-sending .dlawg-emblem {
	opacity: 0;
	transform: translateY(-10px);
	pointer-events: none;
}

#dlawg-gate.done-screen.is-sent .dlawg-title,
#dlawg-gate.done-screen.is-sent .dlawg-gate__main > .dlawg-rule,
#dlawg-gate.done-screen.is-sent .dlawg-cd,
#dlawg-gate.done-screen.done-hides-emblem.is-sent .dlawg-emblem,
#dlawg-gate.done-screen.is-sent .dlawg-remind {
	display: none !important;
}

#dlawg-gate.done-screen .dlawg-done {
	margin-top: var(--dlawg-gap-done, 10px);
	transform: translateY(var(--dlawg-off-done, 0px));
}

.dlawg-done__line {
	position: relative;
	margin: 0 0 clamp(10px, 1.6vh, 18px);
	font-family: 'Marcellus', 'Cormorant Garamond', Georgia, serif;
	font-size: calc(clamp(18px, 1.9vw, 25px) * var(--dlawg-fs-done, 1));
	line-height: 1.5;
	color: #f3ead3;
	min-height: 1.5em;
}

.dlawg-done__line:last-child {
	margin-bottom: 0;
	color: var(--dlawg-gold, #cdac6c);
}

@media (max-width: 680px) {
	.dlawg-done__line { font-size: calc(17px * var(--dlawg-fs-done, 1)); }
}

/* ======================================================================
   3.1.1 — Stabilitate: elementele nu mai dispar cand intra urmatorul
   ======================================================================

   1. Dupa ce un element si-a terminat intrarea, JS-ul ii pune .is-in si
      animatia lui se scoate de tot. Fara animatie activa nu mai exista nimic
      care sa-l poata reporni sau ascunde cand se schimba o clasa pe poarta
      sau pe <html>, iar browserul nu mai tine cate un strat GPU pentru fiecare.
      Doar animation:none — opacitatea si pozitia raman cele din stilul de baza,
      deci trecerea la ecranul 2 si iesirea functioneaza ca inainte. */
html.dlawg-armed #dlawg-gate:not(.is-leaving):not(.is-tocross) [data-anim].is-in,
html.dlawg-armed #dlawg-gate:not(.is-leaving):not(.is-tocross) .dlawg-rule__line.is-in {
	animation: none !important;
}

/* 2. Safari (macOS si iPhone): animarea filter:blur pe mai multe elemente
      suprapuse face ca stratul precedent sa nu se mai picteze cand porneste
      urmatorul — exact „apare textul, dispare logo-ul”. In Safari intrarea
      ramane aceeasi (fade + urcare), doar fara blur. hanging-punctuation e
      suportat numai de Safari, deci regula nu atinge Chrome / Firefox. */
@keyframes dlawg-rise-s {
	from { opacity: 0; transform: translateY(16px); }
	to   { opacity: 1; transform: translateY(0); }
}

@keyframes dlawg-emblem-in-s {
	from { opacity: 0; transform: scale(0.9); }
	to   { opacity: 1; transform: scale(1); }
}

@supports (hanging-punctuation: first) and (-webkit-appearance: none) {
	html.dlawg-armed #dlawg-gate [data-anim] {
		animation-name: dlawg-rise-s;
	}

	html.dlawg-armed #dlawg-gate .dlawg-emblem[data-anim] {
		animation-name: dlawg-emblem-in-s;
	}

	html.dlawg-armed #dlawg-gate .dlawg-cd[data-anim] {
		animation-name: dlawg-fade;
	}
}
