/* Fleur · Hero (дизайн «Дневник»). Базовые размеры — inline в render.php (mobile-first
   390px макет). Десктопные правки — с !important, т.к. база инлайн. */
.wp-block-fleur-hero {
	/* тёмная база + мягкие розовые свечения (для лёгкого «стеклянного» ощущения баннера).
	   Свечения заданы ЗДЕСЬ, а не inline: WordPress вырезает inline background у обёртки блока. */
	background:
		radial-gradient(55% 40% at 88% 16%, rgba(236, 72, 153, 0.16), transparent 62%),
		radial-gradient(48% 38% at 6% 84%, rgba(255, 156, 205, 0.12), transparent 60%),
		#131B2B;
}

/* Рукописная Caveat-строка «пишется» слева направо при появлении.
   Keyframes объявлены глобально; сама анимация — только если пользователь НЕ просил reduced-motion. */
@keyframes fleurHeroWrite {
	from { clip-path: inset(-14% 100% -14% 0); opacity: .35; }
	to   { clip-path: inset(-14% -6% -14% 0);  opacity: 1; }
}
@media (prefers-reduced-motion: no-preference) {
	.wp-block-fleur-hero .fleur-hero__caveat {
		animation: fleurHeroWrite 2200ms cubic-bezier(.33, .1, .25, 1) 300ms both;
	}
}

/* Кнопка «Зарегистрироваться» «переливается» В ТАКТ с write-on строки «получится…»:
   те же delay 300ms, длительность прохода ~2200ms (31% цикла) и easing, что у fleurHeroWrite —
   первый блик идёт в унисон с написанием строки, дальше повторяется в том же ритме (цикл 7s).
   Keyframes глобальны; анимация — только без reduced-motion. */
@keyframes fleurBtnShine {
	0%        { transform: translateX(-130%); }
	31%, 100% { transform: translateX(130%); }
}
@media (prefers-reduced-motion: no-preference) {
	.wp-block-fleur-hero .fleur-hero__cta { position: relative; overflow: hidden; }
	.wp-block-fleur-hero .fleur-hero__cta::after {
		content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 1;
		background: linear-gradient(115deg, transparent 38%, rgba(255, 255, 255, 0.5) 50%, transparent 62%);
		transform: translateX(-130%);
		animation: fleurBtnShine 7000ms cubic-bezier(.33, .1, .25, 1) 300ms infinite;
	}
}

@media (min-width: 768px) {
	.wp-block-fleur-hero .fleur-hero__inner { max-width: 620px !important; }
	.wp-block-fleur-hero .fleur-hero__body { padding: 96px 24px 124px !important; }
	.wp-block-fleur-hero .fleur-hero__title { font-size: 56px !important; }
	.wp-block-fleur-hero .fleur-hero__caveat { font-size: 28px !important; }
}

/* Горизонтальный лого-вордмарк: высотой (не шириной) — чтобы хедер «дышал».
   Держим фикс-высоту, width:auto; max-width — только страховка от переполнения на узких экранах
   (при height 32px вордмарк ~152px, кап не срабатывает, высота остаётся 32px). */
@media (max-width: 600px) {
	.wp-block-fleur-hero .fleur-hero__barinner { padding-left: 18px !important; padding-right: 18px !important; }
	.wp-block-fleur-hero .fleur-hero__barinner img { max-width: 60vw; }
	.wp-block-fleur-hero .fleur-hero__lang { font-size: 11px; letter-spacing: 0.02em; }
	.wp-block-fleur-hero .fleur-hero__lang a { padding: 4px 5px; }
}

/* Запиненная CTA «Зарегистрироваться»: появляется со 2-го экрана (hero ушёл из вида),
   прячется, когда видна форма. Показ/скрытие — класс .is-visible из hero/view.js. */
.fleur-sticky-cta {
	position: fixed; z-index: 60; left: 16px; right: 16px; bottom: 16px;
	display: block; max-width: 560px; margin: 0 auto; box-sizing: border-box;
	text-align: center; text-decoration: none;
	background: #FF9CCD; color: #131B2B;
	border-radius: 999px; padding: 16px 24px;
	font-family: 'Manrope', system-ui, sans-serif; font-size: 15px; font-weight: 700; letter-spacing: 0.01em;
	box-shadow: 0 14px 40px rgba(60, 20, 45, 0.35), 0 6px 18px rgba(236, 72, 153, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.55);
	opacity: 0; transform: translateY(150%); pointer-events: none;
	transition: opacity .3s ease, transform .38s cubic-bezier(.2, .7, .2, 1);
}
.fleur-sticky-cta.is-visible { opacity: 1; transform: translateY(0); pointer-events: auto; }
@media (prefers-reduced-motion: reduce) {
	.fleur-sticky-cta { transition: opacity .2s ease; transform: none; }
	.fleur-sticky-cta.is-visible { transform: none; }
}
/* Десктоп: CTA — компактная пилюля ПО ЦЕНТРУ низа экрана (правка Ильи 2026-08-05: в правом
   углу она налезала на третью карточку тарифов — это и была причина, по которой её когда-то
   прятали на десктопе). WhatsApp-кнопка остаётся одна в правом углу, они не пересекаются. */
@media (min-width: 768px) {
	.fleur-sticky-cta { left: 0; right: 0; bottom: 24px; width: fit-content; max-width: none; margin-inline: auto; padding: 15px 42px; }
}
/* MK /mk-ulm-zefir: временно прячем бургер-меню (обе языковые версии: RU page-id-38 + UA page-id-78). */
body.page-id-38 .fleur-hero__burger,
body.page-id-78 .fleur-hero__burger { display: none !important; }

/* Десктоп ≥1024: hero центрований, масштабований, заповнює банер (не вузька смужка ліворуч). */
@media (min-width: 1024px) {
	.wp-block-fleur-hero .fleur-hero__barinner { max-width: 1120px !important; }
	.wp-block-fleur-hero .fleur-hero__barinner img { height: 44px !important; }
	.wp-block-fleur-hero .fleur-hero__inner { max-width: 860px !important; }
	.wp-block-fleur-hero .fleur-hero__body { padding: 116px 24px 140px !important; align-items: center !important; text-align: center !important; gap: 34px !important; }
	.wp-block-fleur-hero .fleur-hero__caveat { font-size: 32px !important; }
	.wp-block-fleur-hero .fleur-hero__titlewrap { align-items: center !important; }
	.wp-block-fleur-hero .fleur-hero__title { font-size: 68px !important; line-height: 1.03 !important; }
	.wp-block-fleur-hero .fleur-hero__subtitle { font-size: 18px !important; margin: 0 auto !important; }
	.wp-block-fleur-hero .fleur-hero__pills { justify-content: center !important; }
	.wp-block-fleur-hero .fleur-hero__cta { width: 100% !important; max-width: 440px !important; margin: 0 auto !important; }
	.wp-block-fleur-hero .fleur-hero__note { max-width: 440px !important; margin: 0 auto !important; }
}

/* — page-153 (курс меренги): мягкие стыки секций — «стопка карточек»: каждая секция
   скругляется сверху и наезжает на предыдущую (по фидбеку: резкие границы блоков).
   isolation:isolate — чтобы позиционированные дети ранних секций (глоу, оверлап-карточки)
   не рисовались ПОВЕРХ скругления следующей. padding-bottom !important — единый запас
   под наезд следующей секции (перебивает inline-паддинги render.php). — */
/* margin-top c !important — в плагине есть глобальный reset [class*="wp-block-fleur-"]{margin:0!important},
   иначе наезд не применяется (у одинаковой important-важности выигрывает специфичность). */
:is(body.page-id-153, body.page-id-163) section[class*="wp-block-fleur-"] {
	--fleur-sect-r: 28px;
	border-radius: var(--fleur-sect-r) var(--fleur-sect-r) 0 0;
	margin-top: calc(-1 * var(--fleur-sect-r)) !important;
	padding-bottom: 92px !important;
	isolation: isolate;
}
:is(body.page-id-153, body.page-id-163) section.wp-block-fleur-hero {
	margin-top: 0 !important;
	border-radius: 0;
}
/* Первая секция ПОСЛЕ hero — тоже flush (без скругления/наезда): скруглённая «карточка»
   поверх тёмного hero смотрелась как оторванный блок. Наезд-стопка начинается со 2-й секции.
   ⚠️ hero рендерит <a.fleur-sticky-cta> ПОСЛЕ </section>, поэтому первая контент-секция —
   это `.fleur-sticky-cta + section` (а не `hero + section`). Держим оба на всякий случай. */
:is(body.page-id-153, body.page-id-163) section.wp-block-fleur-hero + section[class*="wp-block-fleur-"],
:is(body.page-id-153, body.page-id-163) .fleur-sticky-cta + section[class*="wp-block-fleur-"] {
	margin-top: 0 !important;
	border-radius: 0 !important;
}
@media ( min-width: 1024px ) {
	:is(body.page-id-153, body.page-id-163) section[class*="wp-block-fleur-"] { --fleur-sect-r: 40px; }
}