/* Синий дубль главной: вёрстка та же, красная палитра макета заменена
   на фирменные цвета ST-Fishing (#1270B5 — основной цвет сайта).
   Класс body ставит WordPress по имени шаблона. */

/* Единственное место, где заданы фирменные цвета. Файл подключается на всех
   страницах: вне синей главной от него работает только этот блок, остальные
   правила заскоплены классом шаблона. Отсюда же цвета берёт stf-site.css. */
:root{
	--stf-navy:#0F1628;
	--stf-gray:#F3F3F4;
	/* Фон страницы. На главной он был вписан числом в stf-home-hero.css
	   (body.home), теперь значение живёт здесь и одно на весь сайт. */
	--stf-page:#F5F6F9;
	--stf-blue:#1270B5;
	--stf-blue-light:#4BA3DE;
	--stf-blue-dark:#0D5387;
	--stf-blue-deep:#0057A8;
	--stf-grad:linear-gradient(90deg,#1270B5 0%,#4BA3DE 100%);
	/* Общая система движения: все карточки используют одни длительности,
	   easing, подъём, рамку и тень. Локальные стили меняют только медиа внутри. */
	--stf-motion-fast:180ms;
	--stf-motion-card:280ms;
	--stf-motion-media:420ms;
	--stf-ease-out:cubic-bezier(.22,1,.36,1);
	--stf-card-lift:-6px;
	--stf-card-border-hover:rgba(18,112,181,.44);
	--stf-card-shadow-hover:0 20px 44px rgba(18,112,181,.14);
}

.page-template-page-stf-modern-blue .stfm{
	--red1:var(--stf-blue);
	--red2:var(--stf-blue-light);
	--reddark:var(--stf-blue-dark);
	--grad:var(--stf-grad);
	--grad-icon:linear-gradient(135deg,#1270B5 0%,#4BA3DE 100%);
}

/* Ниже места, где в макете цвет прописан мимо переменных. */

/* Обводка-градиент у кнопки первого экрана и круглых кнопок карточек. */
.page-template-page-stf-modern-blue .stfm .hero__explore::before,
.page-template-page-stf-modern-blue .stfm .iconbtn::before{
	background:linear-gradient(90deg,#4BA3DE 0%,#1270B5 100%);
}

/* Заливки поверх видео и фонов. */
.page-template-page-stf-modern-blue .stfm .quiz__grad{
	background:linear-gradient(90deg,#0057A8 0%,#1270B5 100%);
}
/* Видеофон формы больше не используется: форма делит процедурный liquid-фон
   с блоком собственных разработок. */
.page-template-page-stf-modern-blue .stfm .form-sec{
	background:none;
}
.page-template-page-stf-modern-blue .stfm .form-sec__bg{
	display:none;
}
.page-template-page-stf-modern-blue .stfm .form-sec__grad{display:none;}

/* Блок разработок: спокойный mesh/aurora-фон из небольших световых областей.
   Пятна движутся разными траекториями, мягко сходятся в центре и расходятся. */
.page-template-page-stf-modern-blue .stfm .production,
.page-template-page-stf-modern-blue .stfm .form-sec--liquid{
	position:relative;
	isolation:isolate;
	border-radius:40px;
	overflow:hidden;
	background-image:
		radial-gradient(ellipse at center,rgba(38,163,222,.52) 0,rgba(31,125,187,.24) 29%,transparent 66%),
		radial-gradient(ellipse at center,rgba(91,199,233,.43) 0,rgba(47,145,199,.22) 28%,transparent 64%),
		linear-gradient(135deg,#03182f 0%,#06355f 52%,#082848 100%);
	background-repeat:no-repeat;
	background-size:52% 46%,46% 42%,100% 100%;
	background-position:-12% 8%,112% 90%,0 0;
	will-change:background-position;
	animation:stfm-production-mesh 10s cubic-bezier(.45,0,.55,1) infinite alternate;
}
.stfm .production__fluid{
	position:absolute;
	inset:0;
	z-index:1;
	display:block !important;
	width:100%;
	height:100%;
	pointer-events:none;
	opacity:.84;
	mix-blend-mode:screen;
	filter:blur(18px) saturate(.96) contrast(.92);
	transform:scale(1.045);
	transform-origin:center;
	will-change:contents,transform;
}
.stfm .production__inner{
	position:relative;
	z-index:3;
}
.page-template-page-stf-modern-blue .stfm .form-sec--liquid .form-sec__inner{
	position:relative;
	z-index:3;
}
.page-template-page-stf-modern-blue .stfm .production::before,
.page-template-page-stf-modern-blue .stfm .form-sec--liquid::before{
	content:"";
	position:absolute;
	inset:-8%;
	z-index:0;
	pointer-events:none;
	background:
		radial-gradient(circle,rgba(52,178,225,.39) 0,rgba(36,130,188,.18) 27%,transparent 64%),
		radial-gradient(circle,rgba(104,205,236,.34) 0,rgba(53,154,205,.16) 25%,transparent 62%),
		radial-gradient(circle,rgba(39,157,213,.38) 0,rgba(27,112,176,.16) 29%,transparent 65%);
	background-repeat:no-repeat;
	background-size:34% 32%,28% 27%,31% 30%;
	background-position:5% 18%,52% 62%,94% 24%;
	filter:blur(28px);
	opacity:.68;
	will-change:background-position,opacity;
	animation:stfm-ice-surface-flow 11s cubic-bezier(.45,0,.55,1) infinite alternate;
}
.page-template-page-stf-modern-blue .stfm .production::after{
	content:"";
	display:none;
	position:absolute;
	inset:0;
	z-index:2;
	pointer-events:none;
	background:
		linear-gradient(90deg,rgba(2,17,36,.46) 0%,rgba(3,24,48,.34) 48%,rgba(2,18,38,.43) 100%),
		linear-gradient(180deg,rgba(0,10,25,.16) 0%,rgba(0,12,29,.28) 100%);
	box-shadow:none;
	-webkit-mask-image:none;
	mask-image:none;
	opacity:1;
	filter:none;
	animation:none;
}
.page-template-page-stf-modern-blue .stfm .production__grad{
	display:block;
	position:absolute;
	inset:0;
	z-index:0;
	overflow:hidden;
	background:linear-gradient(180deg,rgba(225,246,255,.035),rgba(0,13,31,.14));
	opacity:1;
	pointer-events:none;
}
.page-template-page-stf-modern-blue .stfm .production__grad::before,
.page-template-page-stf-modern-blue .stfm .production__grad::after{
	content:"";
	position:absolute;
	width:clamp(230px,32vw,480px);
	height:auto;
	aspect-ratio:1.15;
	border-radius:46% 54% 58% 42% / 55% 43% 57% 45%;
	background:
		radial-gradient(circle at 34% 38%,rgba(66,195,237,.62) 0,rgba(40,151,207,.32) 30%,transparent 66%),
		radial-gradient(circle at 68% 64%,rgba(29,139,202,.52) 0,rgba(21,102,169,.24) 33%,transparent 70%);
	filter:blur(44px);
	mix-blend-mode:screen;
	opacity:.30;
	will-change:transform,opacity;
}
.page-template-page-stf-modern-blue .stfm .production__grad::before{
	top:8%;
	left:4%;
	animation:stfm-under-ice-mesh-a 10s cubic-bezier(.45,0,.55,1) infinite;
}
.page-template-page-stf-modern-blue .stfm .production__grad::after{
	right:5%;
	bottom:8%;
	background:
		radial-gradient(circle at 66% 36%,rgba(59,187,231,.59) 0,rgba(35,143,199,.30) 29%,transparent 66%),
		radial-gradient(circle at 30% 68%,rgba(25,132,198,.53) 0,rgba(18,95,163,.23) 34%,transparent 71%);
	filter:blur(48px);
	opacity:.28;
	animation:stfm-under-ice-mesh-b 12s cubic-bezier(.45,0,.55,1) -3s infinite;
}
@keyframes stfm-ice-surface-flow{
	0%{background-position:5% 18%,52% 62%,94% 24%;opacity:.34;}
	33%{background-position:29% 34%,58% 42%,76% 55%;opacity:.48;}
	66%{background-position:48% 58%,35% 29%,55% 38%;opacity:.38;}
	100%{background-position:72% 42%,23% 61%,34% 68%;opacity:.50;}
}
@keyframes stfm-production-mesh{
	0%{background-position:-12% 8%,112% 90%,0 0;}
	33%{background-position:28% 34%,72% 58%,0 0;}
	66%{background-position:62% 60%,38% 31%,0 0;}
	100%{background-position:94% 80%,7% 13%,0 0;}
}
@keyframes stfm-frost-shimmer{
	0%{filter:saturate(.70) brightness(.91) drop-shadow(0 0 5px rgba(181,229,247,.20));}
	100%{filter:saturate(.78) brightness(1.02) drop-shadow(0 0 9px rgba(209,241,253,.30));}
}
@keyframes stfm-under-ice-mesh-a{
	0%,100%{transform:translate3d(-8%,-6%,0) rotate(-5deg) scale(.90,1.08);opacity:.36;border-radius:44% 56% 62% 38% / 58% 42% 56% 44%;}
	25%{transform:translate3d(38%,18%,0) rotate(3deg) scale(1.04,.94);opacity:.49;border-radius:58% 42% 46% 54% / 44% 59% 41% 56%;}
	50%{transform:translate3d(78%,46%,0) rotate(-2deg) scale(1.08,.95);opacity:.63;border-radius:47% 53% 59% 41% / 61% 39% 54% 46%;}
	75%{transform:translate3d(48%,86%,0) rotate(4deg) scale(.94,1.06);opacity:.44;border-radius:60% 40% 43% 57% / 46% 56% 44% 54%;}
}
@keyframes stfm-under-ice-mesh-b{
	0%,100%{transform:translate3d(8%,6%,0) rotate(5deg) scale(1.05,.90);opacity:.35;border-radius:58% 42% 46% 54% / 45% 60% 40% 55%;}
	25%{transform:translate3d(-35%,-16%,0) rotate(-4deg) scale(.92,1.05);opacity:.48;border-radius:43% 57% 61% 39% / 59% 41% 56% 44%;}
	50%{transform:translate3d(-76%,-44%,0) rotate(2deg) scale(1.06,.95);opacity:.61;border-radius:60% 40% 44% 56% / 42% 58% 46% 54%;}
	75%{transform:translate3d(-42%,-82%,0) rotate(-4deg) scale(.95,1.07);opacity:.43;border-radius:46% 54% 59% 41% / 61% 39% 53% 47%;}
}
@media (max-width:640px){
	.page-template-page-stf-modern-blue .stfm .production,
	.page-template-page-stf-modern-blue .stfm .form-sec--liquid{border-radius:24px;}
	.page-template-page-stf-modern-blue .stfm .production__grad::before,
	.page-template-page-stf-modern-blue .stfm .production__grad::after{width:min(60vw,240px);filter:blur(44px);}
	.page-template-page-stf-modern-blue .stfm .production::before,
	.page-template-page-stf-modern-blue .stfm .form-sec--liquid::before{background-size:58% 23%,46% 20%,52% 22%;filter:blur(26px);}
	.page-template-page-stf-modern-blue .stfm .production::after{background-size:100% 100%;}
	.stfm .production__fluid{opacity:.78;filter:blur(15px) saturate(.94) contrast(.90);transform:scale(1.055);}
}
@media (prefers-reduced-motion:reduce){
	.page-template-page-stf-modern-blue .stfm .production,
	.page-template-page-stf-modern-blue .stfm .form-sec--liquid,
	.page-template-page-stf-modern-blue .stfm .production::before,
	.page-template-page-stf-modern-blue .stfm .form-sec--liquid::before,
	.page-template-page-stf-modern-blue .stfm .production__grad::before,
	.page-template-page-stf-modern-blue .stfm .production__grad::after{animation-duration:30s;}
	.page-template-page-stf-modern-blue .stfm .production::after{animation:none;}
	.stfm .production__fluid{display:none !important;}
}

/* Способ связи — единая кликабельная карточка. Нативный radio остаётся в
   разметке и доступен клавиатуре, но не занимает место между узкими кнопками. */
.page-template-page-stf-modern-blue .stfm .form-card .cf_block--way .wpcf7-radio{
	display:grid;
	grid-template-columns:minmax(0,1fr) minmax(0,.85fr) minmax(0,1.35fr) minmax(0,.85fr);
	gap:10px;
}
.page-template-page-stf-modern-blue .stfm .form-card .cf_block--way .wpcf7-list-item{
	min-width:0;
	margin:0;
}
.page-template-page-stf-modern-blue .stfm .form-card .cf_block--way .wpcf7-list-item label{
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	width:100%;
	min-width:0;
	height:46px;
	padding:0 6px;
	gap:0;
	overflow:hidden;
	border:1px solid transparent;
	border-radius:12px;
	background:#f2f2f4;
	box-shadow:0 0 0 rgba(18,112,181,0);
	transition:transform .22s var(--stf-ease-out),background-color .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.page-template-page-stf-modern-blue .stfm .form-card .cf_block--way input[type="radio"]{
	position:absolute !important;
	width:1px !important;
	height:1px !important;
	margin:0 !important;
	padding:0 !important;
	overflow:hidden;
	clip:rect(0 0 0 0);
	clip-path:inset(50%);
	white-space:nowrap;
	opacity:0;
}
.page-template-page-stf-modern-blue .stfm .form-card .cf_block--way .wpcf7-list-item-label{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:0;
	gap:6px;
	font-size:14px;
	white-space:nowrap;
}
.page-template-page-stf-modern-blue .stfm .form-card .cf_block--way .wpcf7-list-item:has(input[value="Telegram"]) .wpcf7-list-item-label::before,
.page-template-page-stf-modern-blue .stfm .form-card .cf_block--way .wpcf7-list-item:has(input[value="MAX"]) .wpcf7-list-item-label::before{
	width:20px;
	height:20px;
}
.page-template-page-stf-modern-blue .stfm .form-card .cf_block--way .wpcf7-list-item label:hover{
	transform:translateY(-2px);
	background:#fff;
	border-color:rgba(18,112,181,.55);
	box-shadow:0 8px 18px rgba(18,112,181,.14);
}
.page-template-page-stf-modern-blue .stfm .form-card .cf_block--way .wpcf7-list-item label:has(input:checked){
	background:#fff;
	border-color:#1270b5;
	box-shadow:0 7px 18px rgba(18,112,181,.18),inset 0 0 0 1px rgba(18,112,181,.08);
}
.page-template-page-stf-modern-blue .stfm .form-card .cf_block--way .wpcf7-list-item label:has(input:focus-visible){
	outline:3px solid rgba(75,163,222,.32);
	outline-offset:2px;
}
@media (max-width:760px){
	.page-template-page-stf-modern-blue .stfm .form-card .cf_block--way .wpcf7-radio{
		grid-template-columns:repeat(2,minmax(0,1fr));
	}
}

/* Рамки карточек и открытого вопроса. */
.page-template-page-stf-modern-blue .stfm .reason__card,
.page-template-page-stf-modern-blue .stfm .faq__item--open{
	border-color:rgba(18,112,181,.6);
}

/* Вопросы сохраняют подъём, рамку и тень. Бегущий световой блик убран:
   он выглядел слишком быстрым и отвлекал от чтения. */
.page-template-page-stf-modern-blue .stfm .faq__item{
	position:relative;
	overflow:hidden;
	transform:translateZ(0);
	transition:transform var(--stf-motion-card) var(--stf-ease-out),border-color var(--stf-motion-card) ease,box-shadow var(--stf-motion-card) var(--stf-ease-out);
}
.page-template-page-stf-modern-blue .stfm .faq__q,
.page-template-page-stf-modern-blue .stfm .faq__a{position:relative;z-index:1;}
.page-template-page-stf-modern-blue .stfm .faq__item:hover,
.page-template-page-stf-modern-blue .stfm .faq__item:focus-within{
	transform:translateY(-4px);
	border-color:var(--stf-card-border-hover);
	box-shadow:0 16px 34px rgba(18,112,181,.13);
}
.page-template-page-stf-modern-blue .stfm .faq__sign{
	width:34px;
	height:34px;
	flex:0 0 34px;
	border:1px solid rgba(18,112,181,.16);
	border-radius:11px;
	background:rgba(18,112,181,.055);
	transition:transform 420ms var(--stf-ease-out),background-color 240ms ease,border-color 240ms ease,box-shadow 240ms ease;
}
.page-template-page-stf-modern-blue .stfm .faq__item:hover .faq__sign,
.page-template-page-stf-modern-blue .stfm .faq__item:focus-within .faq__sign{
	background:rgba(18,112,181,.11);
	border-color:rgba(18,112,181,.34);
	box-shadow:0 8px 18px rgba(18,112,181,.13);
	transform:scale(1.07);
}
.page-template-page-stf-modern-blue .stfm .faq__item:not(.faq__item--open):hover .faq__sign,
.page-template-page-stf-modern-blue .stfm .faq__item:not(.faq__item--open):focus-within .faq__sign{
	transform:rotate(90deg) scale(1.07);
}
.page-template-page-stf-modern-blue .stfm .faq__item:hover .faq__sign::before,
.page-template-page-stf-modern-blue .stfm .faq__item:hover .faq__sign::after,
.page-template-page-stf-modern-blue .stfm .faq__item:focus-within .faq__sign::before,
.page-template-page-stf-modern-blue .stfm .faq__item:focus-within .faq__sign::after{
	background:var(--stf-blue);
}

@media (prefers-reduced-motion:reduce){
	.page-template-page-stf-modern-blue .stfm .faq__item,
	.page-template-page-stf-modern-blue .stfm .faq__sign{transition:none;}
}

/* Стрелка в круглой кнопке карточки: цвет задан атрибутом в разметке.
   Правило на hover в макете специфичнее, белая стрелка при наведении остаётся. */
.page-template-page-stf-modern-blue .stfm .iconbtn svg path{stroke:#1270B5;}

/* Ошибка в квизе. */
.page-template-page-stf-modern-blue .stfm .quiz__error{
	background:rgba(18,112,181,.08);
	border-color:rgba(18,112,181,.25);
}

/* Шапка на этом шаблоне остаётся штатной, синей: правила красной капсулы
   в stf-modern.css привязаны к классу основного шаблона и сюда не доходят. */

/* Волна перед подвалом: инлайн-SVG в цвет подвала, 44px высотой, вплотную к футеру. */
.page-template-page-stf-modern-blue .stfm .waves{margin:70px 0 -1px;line-height:0;overflow:hidden;}
.page-template-page-stf-modern-blue .stfm .waves__svg{display:block;width:200%;height:44px;animation:stfm-wave-slide 80s linear infinite;will-change:transform;}
@keyframes stfm-wave-slide{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){.page-template-page-stf-modern-blue .stfm .waves__svg{animation:none;}}
