/* =========================================================
   THEME (light + green accents) — подходит под Chicken Landing
========================================================= */
:root{
	--maxw: var(--wp--style--global--wide-size, 1200px);
	--gap: 32px;
	--radius: 14px;
	--shadow: 0 10px 30px rgba(17,24,39,.08);

	/* light colors */
	--bg: #eef1f5;       /* общий фон страницы */
	--surface: #ffffff;  /* хедер и карточки */
	--surface-2: #ffffff;/* вторичные карточки */
	--text: #0f1115;
	--muted: #4b5563;

	/* green accents */
	--accent: #22c55e;
	--accent-hover: #16a34a;
	--accent-glow: rgba(34,197,94,.35);
}

/* =========================================================
   GLOBAL
========================================================= */
html, body{ background: var(--bg); color: var(--text); }
img{ max-width: 100%; height: auto; display: block; }

a{ color: var(--accent); text-decoration: none; }
a:hover{ text-decoration: none; }

a:focus-visible,
.ch-btn:focus-visible{
	outline: 2px solid #86efac;
	outline-offset: 3px;
	border-radius: 12px;
}

.ch-container{ max-width: var(--maxw); margin: 0 auto; padding: 0 16px; }

/* =========================================================
   HEADER
========================================================= */
.ch-header{
	width: 100%;
	background: var(--surface);
	position: relative;
	box-shadow: 0 8px 20px rgba(17,24,39,.06);
}
.ch-header::after{
	content: "";
	position: absolute; left: 0; right: 0; bottom: -2px; height: 3px;
	background: linear-gradient(90deg, #16a34a, #22c55e);
	opacity: .95;
}
.ch-header__inner{
	max-width: var(--maxw); margin: 0 auto;
	padding: 18px 16px;
	display: flex; align-items: center; justify-content: space-between; gap: 24px;
}
.ch-header__logo img{ height: 48px; width: auto; filter: drop-shadow(0 2px 8px rgba(0,0,0,.05)); }
.ch-header__cta{
	display:inline-block; padding:10px 18px; border-radius:12px;
	background:var(--accent); color:#fff; font-weight:800;
	transition: transform .15s ease, background .15s ease, box-shadow .15s ease;
	box-shadow: 0 8px 24px var(--accent-glow);
}
.ch-header__cta:hover{ background:var(--accent-hover); transform: translateY(-1px); }

/* =========================================================
   TITLE
========================================================= */
.ch-title{
	margin: 20px 0 16px;
	font-weight: 800;
	font-size: clamp(28px,4vw,44px);
	line-height: 1.15;
	text-shadow: 0 1px 0 rgba(255,255,255,.85);
}

/* =========================================================
   SECTION 1 (двухколоночный грид + баннер с PLAY)
========================================================= */
.section-1{ margin: 8px auto 48px; }
.section-1__grid{
	display:grid; grid-template-columns: 1.4fr 1fr;
	gap: var(--gap); align-items: start;
}
@media (max-width: 900px){ .section-1__grid{ grid-template-columns: 1fr; } }

/* Баннер */
.hero-card{
	position:relative; border-radius:16px; overflow:hidden;
	box-shadow: var(--shadow); background: var(--surface);
}
.hero-banner-img{ width:100%; height:auto; display:block; }

/* Большая кнопка PLAY по центру баннера */
.hero-cta{
	position:absolute; left:50%; top:50%; transform: translate(-50%,-50%);
	display:inline-block; padding:28px 50px; border-radius:16px;
	background: var(--accent); color:#fff; font-weight:900; font-size:28px; line-height:1;
	box-shadow: 0 12px 36px var(--accent-glow);
	animation: heroPulse 2.6s ease-in-out infinite;
	transition: background .15s ease, transform .15s ease;
}
.hero-cta:hover{ background: var(--accent-hover); transform: translate(-50%,-51%) scale(1.02); }
@keyframes heroPulse{
	0%{   transform: translate(-50%,-50%) scale(1);   box-shadow: 0 0 0 rgba(0,0,0,0); }
	50%{  transform: translate(-50%,-50%) scale(1.06); box-shadow: 0 0 30px var(--accent-glow), 0 0 60px rgba(34,197,94,.25); }
	100%{ transform: translate(-50%,-50%) scale(1);   box-shadow: 0 0 0 rgba(0,0,0,0); }
}

/* Правая карточка с таблицей/контентом ACF */
.overview-card{
	border:1px solid #e7e7ea; border-radius:16px;
	box-shadow: var(--shadow); background:#fff; padding:18px;
}
.overview-card h2{ margin:0 0 12px 0; text-align:center; }
.overview-card table{
	width:100%; border-collapse:separate; border-spacing:0; overflow:hidden; border-radius:10px;
}
.overview-card th, .overview-card td{
	padding:12px 14px; vertical-align:top; border-top:1px solid #eef0f3;
}
.overview-card tr:first-child th, .overview-card tr:first-child td{ border-top:none; }
.overview-card thead th{ background:#f7f8fa; font-weight:700; }
.overview-card tbody tr:nth-child(odd) td,
.overview-card tbody tr:nth-child(odd) th{ background:#fafbfc; }

/* =========================================================
   AUTHOR BLOCK (плашка сразу после Section 1)
========================================================= */
.author-block{ margin: 52px auto 0; }
.author-block__grid{
	background: var(--surface-2);
	border: 1px solid #e7e7ea;
	border-radius: var(--radius);
	box-shadow: var(--shadow);
	padding: 20px;
	display: grid; grid-template-columns: 1fr; gap: 16px;
}
@media (min-width:860px){ .author-block__grid{ grid-template-columns: 1fr 3fr; gap: 24px; } }

.author-block__left{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:10px; }
.author-block__photo{
	width:120px; height:120px; border-radius:50%; object-fit:cover;
	box-shadow: 0 8px 24px rgba(17,24,39,.10);
	border: 2px solid #eaecef;
}
.author-block__name{ font-weight:900; font-size:18px; color: var(--text); }
.author-block__job{ color: var(--muted); font-size:14px; }
.author-block__right{ color: var(--muted); line-height:1.7; }

/* =========================================================
   DEMO EMBED (iframe вставляется в середину контента)
========================================================= */
.demo-embed{ margin: 32px auto; }
.demo-embed__inner{ max-width: var(--maxw); margin: 0 auto; }

.demo-embed__frame-wrap{
	width: 100%; aspect-ratio: 16/9;
	background: #f6f8fb;
	border-radius: var(--radius);
	box-shadow: var(--shadow);
	overflow: hidden; border: 1px solid #e7e7ea;
}
.demo-embed__iframe{ width: 100%; height: 100%; border: 0; display: block; }

/* Состояние с постером */
.demo-embed__frame-wrap.is-poster{ position: relative; isolation: isolate; }
.demo-embed__poster{ position: relative; width: 100%; height: 100%; }
.demo-embed__poster-img, .demo-embed__poster-fallback{
	position:absolute; inset:0; width:100%; height:100%;
	object-fit:cover; filter: blur(8px); transform: scale(1.06); z-index:0;
}
.demo-embed__poster-fallback{ background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%); }
.demo-embed__poster::after{
	content:""; position:absolute; inset:0;
	background: radial-gradient(closest-side, rgba(0,0,0,.18), rgba(0,0,0,.28));
	pointer-events:none; z-index:1;
}
/* CTA поверх постера (используем ту же .hero-cta, но не конфликтуем с баннером) */
.demo-embed .hero-cta.demo-cta{
	position:absolute; left:50%; top:50%; transform: translate(-50%,-50%);
	z-index:2; filter:none !important; will-change: transform;
}
.demo-embed .hero-cta.demo-cta:hover{ transform: translate(-50%,-51%) scale(1.02); }

/* =========================================================
   FOOTER (чёрный с зелёными полосками, 5 колонок)
========================================================= */
.ch-footer{
	margin-top: 48px; padding: 24px 16px;
	background: #0b0b0b; color:#d1d5db;
	position: relative; border-top: 1px solid rgba(255,255,255,.06);
	box-shadow: 0 -8px 20px rgba(0,0,0,.35);
}
.ch-footer::before{
	content:""; position:absolute; left:0; right:0; top:-2px; height:3px;
	background: linear-gradient(90deg, #16a34a, #22c55e); opacity:.95;
}
.ch-footer__inner{
	max-width: var(--maxw); margin:0 auto;
	display:grid; grid-template-columns: repeat(5,1fr);
	align-items:start; column-gap:24px; row-gap:0;
}
.ch-footer__inner > div:empty{ display:none; }

/* 1/5 — большой логотип */
.ch-footer__logo{ grid-column:1; justify-self:start; align-self:start; }
.ch-footer__logo img{ height:192px; max-width:100%; width:auto; object-fit:contain; }

/* “contents”, чтобы дети стали колонками родителя */
.ch-footer__center{ display: contents; }

/* 2–4/5 — кнопка, логотипы, мета */
.ch-footer__center .ch-btn{
	grid-column: 2 / span 3; grid-row:1; justify-self:center;
	padding:20px 36px; font-size:20px; border-radius:16px;
}
.ch-footer__logos{
	grid-column: 2 / span 3; grid-row:2;
	display:flex; flex-wrap:wrap; gap:16px; align-items:center; justify-content:center;
	position:relative; padding:14px 0;
}
.ch-footer__logo-item{
	height:56px; width:auto; transition: transform .15s ease, opacity .15s ease;
}
.ch-footer__logo-item:hover{ transform: translateY(-1px); }
/* зелёные полосы сверху/снизу */
.ch-footer__logos::before, .ch-footer__logos::after{
	content:""; position:absolute; left:0; right:0; height:3px;
	background: linear-gradient(90deg, #16a34a, #22c55e); opacity:.95; pointer-events:none;
}
.ch-footer__logos::before{ top:0; } .ch-footer__logos::after{ bottom:0; }

.ch-footer__meta{
	grid-column: 2 / span 3; grid-row:3;
	margin-top:12px; font-size:14px; color:#cbd5e1; text-align:center;
}
.ch-footer__meta a{ color:#bbf7d0; }
.ch-footer__meta a:hover{ color:#86efac; }

/* 5/5 — меню */
.ch-footer__menu{ grid-column:5; grid-row:1 / span 3; align-self:start; justify-self:start; }
.ch-footer__menu-list{ list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.ch-footer__menu a{
	color:#86efac; font-weight:800; text-decoration:none;
	transition: color .15s ease, transform .15s ease;
}
.ch-footer__menu a:hover{ color:#22c55e; transform: translateX(2px); }

/* адаптив футера */
@media (max-width:1080px){
	.ch-footer__inner{ grid-template-columns:1fr; gap:18px; text-align:center; }
	.ch-footer__logo{ justify-self:center; }
	.ch-footer__logo img{ height:140px; }
	.ch-footer__center .ch-btn, .ch-footer__logos, .ch-footer__meta, .ch-footer__menu{
		grid-column:1; grid-row:auto; justify-self:center; text-align:center;
	}
	.ch-footer__logos{ justify-content:center; }
	.ch-footer__menu-list{ justify-items:center; }
}
@media (max-width:560px){
	.ch-footer__logo img{ height:110px; }
	.ch-footer__logo-item{ height:44px; }
	.ch-footer__center .ch-btn{ font-size:18px; padding:16px 28px; }
}

/* =========================================================
   BUTTONS (unified: green)
========================================================= */
.ch-btn,
.wp-block-button__link,
.wp-element-button,
button,
input[type="submit"],
input[type="button"],
a.button{
	background: var(--accent) !important;
	color: #fff !important;
	border-radius: 12px;
	border: none;
	text-decoration: none;
	transition: transform .15s ease, background .15s ease, box-shadow .15s ease;
	box-shadow: 0 8px 24px var(--accent-glow);
}
.ch-btn:hover,
.wp-block-button__link:hover,
.wp-element-button:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
a.button:hover{
	background: var(--accent-hover) !important;
	transform: translateY(-1px);
}

/* =========================================================
   TABLES (global, light + green)
========================================================= */
.ch-container table,
.entry-content table,
article table,
.wp-block-table table,
table.ch-table,
table{
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	background: var(--surface-2);
	color: var(--text);
	border: 1px solid var(--accent);
	border-radius: var(--radius);
	overflow: hidden;
	box-shadow: var(--shadow);
	margin: 24px 0 32px;
}

/* Ячейки */
.ch-container table th, .ch-container table td,
.entry-content table th, .entry-content table td,
article table th, article table td,
.wp-block-table table th, .wp-block-table table td,
table.ch-table th, table.ch-table td,
table th, table td{
	padding: 14px 16px;
	vertical-align: top;
	text-align: left;
	border-bottom: 1px solid #eef0f3;
}

/* Заголовок thead */
.ch-container table thead th,
.entry-content table thead th,
article table thead th,
.wp-block-table table thead th,
table.ch-table thead th,
table thead th{
	background: linear-gradient(90deg, #16a34a, #22c55e);
	color: #fff;
	font-weight: 800;
	letter-spacing: .02em;
	border-bottom: 1px solid rgba(0,0,0,.06);
}

/* Если thead отсутствует — красим первую строку */
.ch-container table:not(:has(thead)) tbody tr:first-child td,
.entry-content table:not(:has(thead)) tbody tr:first-child td,
article table:not(:has(thead)) tbody tr:first-child td,
.wp-block-table table:not(:has(thead)) tbody tr:first-child td,
table.ch-table:not(:has(thead)) tbody tr:first-child td,
table:not(:has(thead)) tbody tr:first-child td,
.ch-container table:has(thead:empty) tbody tr:first-child td,
.entry-content table:has(thead:empty) tbody tr:first-child td,
article table:has(thead:empty) tbody tr:first-child td,
.wp-block-table table:has(thead:empty) tbody tr:first-child td,
table.ch-table:has(thead:empty) tbody tr:first-child td,
table:has(thead:empty) tbody tr:first-child td{
	background: linear-gradient(90deg, #16a34a, #22c55e);
	color: #fff;
	font-weight: 800;
	letter-spacing: .02em;
	border-bottom: 1px solid rgba(0,0,0,.06);
}

/* Если thead есть — первую строку tbody не красим */
.ch-container table:has(thead:not(:empty)) tbody tr:first-child td,
.entry-content table:has(thead:not(:empty)) tbody tr:first-child td,
article table:has(thead:not(:empty)) tbody tr:first-child td,
.wp-block-table table:has(thead:not(:empty)) tbody tr:first-child td,
table.ch-table:has(thead:not(:empty)) tbody tr:first-child td,
table:has(thead:not(:empty)) tbody tr:first-child td{
	background: transparent; color: var(--text);
	font-weight: 600; border-bottom: 1px solid #eef0f3;
}

/* Зебра + hover */
.ch-container table tbody tr:nth-child(even) td,
.entry-content table tbody tr:nth-child(even) td,
article table tbody tr:nth-child(even) td,
.wp-block-table table tbody tr:nth-child(even) td,
table.ch-table tbody tr:nth-child(even) td,
table tbody tr:nth-child(even) td{ background: #fafbfc; }
.ch-container table tbody tr:hover td,
.entry-content table tbody tr:hover td,
article table tbody tr:hover td,
.wp-block-table table tbody tr:hover td,
table.ch-table tbody tr:hover td,
table tbody tr:hover td{ background: #ecfdf5; }

/* Последняя строка без нижней границы */
.ch-container table tbody tr:last-child td,
.entry-content table tbody tr:last-child td,
article table tbody tr:last-child td,
.wp-block-table table tbody tr:last-child td,
table.ch-table tbody tr:last-child td,
table tbody tr:last-child td{ border-bottom: none; }

/* Подпись к таблице */
.wp-block-table figcaption{
	padding: 10px 16px 14px;
	color: var(--muted);
	text-align: left;
	border-top: 1px dashed var(--accent);
}

/* Адаптивный горизонтальный скролл */
@media (max-width: 720px){
	.ch-container table, .entry-content table, article table, .wp-block-table table, table.ch-table, table{
		display: block; overflow-x: auto; -webkit-overflow-scrolling: touch;
		border-radius: 12px; margin: 18px -8px 26px;
	}
	.ch-container table th, .ch-container table td,
	.entry-content table th, .entry-content table td,
	article table th, article table td,
	.wp-block-table table th, .wp-block-table table td,
	table.ch-table th, table.ch-table td,
	table th, table td{
		padding: 12px 14px; font-size: 14px;
	}
}
/* ==== DEMO EMBED — фикс позиционирования CTA, ширина как у контента ==== */

/* секция демо занимает ширину контента (как .ch-container) */
.demo-embed{ margin: 32px auto; }
.demo-embed__inner{
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 16px; /* как у .ch-container */
}

/* сам фрейм — позиционируемый контейнер */
.demo-embed__frame-wrap{
  position: relative;            /* ВАЖНО: контекст для кнопки */
  width: 100%;
  aspect-ratio: 16/9;
  background: #f6f8fb;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
  border: 1px solid #e7e7ea;
}

/* постер заполняет контейнер и центрирует контент через grid */
.demo-embed__frame-wrap.is-poster{ isolation: isolate; }
.demo-embed__poster{
  position: absolute; inset: 0;  /* заполняем wrap */
  display: grid; place-items: center; /* центрируем кнопку без abs */
}

/* размытый превью-слой */
.demo-embed__poster-img,
.demo-embed__poster-fallback{
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  filter: blur(10px);           /* чуть сильнее блюр, чтобы CTA был чётче */
  transform: scale(1.08);       /* прячем края блюра */
  z-index: 0;
}
.demo-embed__poster-fallback{
  background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
}

/* лёгкое затемнение под кнопкой, остаётся под CTA */
.demo-embed__poster::after{
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(closest-side, rgba(0,0,0,.18), rgba(0,0,0,.28));
  pointer-events: none;
  z-index: 1;
}

/* CTA на постере: сбрасываем глобальные left/top/translate и центрируем grid'ом */
.demo-embed .hero-cta.demo-cta{
  position: relative;   /* НЕ absolute — grid сам центрирует */
  inset: auto;          /* сброс любых left/top из глобального .hero-cta */
  left: auto; top: auto; right: auto; bottom: auto;
  transform: none;      /* чтобы не «утягивало» translate(-50%,-50%) */
  z-index: 2;
  filter: none !important;
  will-change: transform;
  /* отдельная пульсация без translate, только scale — чтобы не дрейфовала */
  animation: demoPulse 2.4s ease-in-out infinite;
}
.demo-embed .hero-cta.demo-cta:hover{
  transform: scale(1.02);
}

/* отдельные keyframes для демо-кнопки (scale-only) */
@keyframes demoPulse{
  0%   { transform: scale(1);   box-shadow: 0 0 0 rgba(0,0,0,0), 0 0 0 rgba(0,0,0,0); }
  50%  { transform: scale(1.06); box-shadow: 0 0 30px var(--accent-glow), 0 0 60px rgba(34,197,94,.25); }
  100% { transform: scale(1);   box-shadow: 0 0 0 rgba(0,0,0,0), 0 0 0 rgba(0,0,0,0); }
}

/* iframe как обычно */
.demo-embed__iframe{
  width: 100%; height: 100%; border: 0; display: block;
}