/* ===========================================================================
   CTRL+N events.ctrln.eu v2 — компоненты хаба.
   events.css перенесён из Landing-Event/index.html без изменений; здесь только
   то, чего там не было: 4 карточки-входа, шапка подстраниц, блок Luma с
   демо-панелью, сетка модулей и цепочка Modular, аккордеон и каталог QuestBox,
   пометка HYPOTHESIS. Токены и приёмы — те же (var(--red), .gslot, .setup-card).
   =========================================================================== */

/* Текущий раздел в шапке */
nav a.is-current{color:#fff}

/* ---------- Хаб: 4 карточки-входа (на .entry-card) ---------- */
.entry-grid.entry-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.entry-card .btn-primary{margin-top:auto}

/* ---------- Шапка подстраницы (на .hero) ---------- */
.hero.hero-page{padding:calc(68px + 48px) 0 56px}
.hero-page .hero-sub{margin-bottom:12px}
.hero-page .hero-ctas{margin-top:26px}
.crumbs{display:flex;gap:8px;align-items:center;font-size:12px;letter-spacing:.04em;color:rgba(255,255,255,.4);margin-bottom:26px}
.crumbs a{color:rgba(255,255,255,.62);text-decoration:none}
.crumbs a:hover{color:#fff}
.hero-core{font-size:15px;line-height:1.6;color:rgba(255,255,255,.55);max-width:36em}

/* ---------- 01 Ready: Luma 3×3 + живая демо-панель (на .cons-*) ---------- */
.luma-demo-label{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--cream-muted);text-align:center}
/* Переключатель режимов — сегменты; кнопки создаёт luma.js из реестра MODES */
.luma-modes{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;padding:4px;border-radius:100px;background:#14100D;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.luma-mode{border:none;background:none;cursor:pointer;padding:8px 18px;border-radius:100px;font-family:var(--font-body);font-size:13px;font-weight:600;color:var(--cream-muted);transition:background .2s,color .2s}
.luma-mode:hover{color:var(--cream-light)}
.luma-mode[aria-pressed="true"]{background:var(--red);color:#fff}
.luma-mode:focus-visible{outline:2px solid var(--red);outline-offset:2px}
/* Шкала результата над панелью, как на Luma 3×3 */
.luma-scale{display:grid;grid-template-columns:repeat(32,1fr);gap:2px;width:100%;max-width:340px;height:12px}
.luma-cell{border-radius:2px;background:#1E1815;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);transition:background .15s,box-shadow .15s}
.luma-cell.on{background:var(--cell);box-shadow:0 0 6px var(--cell)}
.luma-score{display:flex;justify-content:space-between;gap:16px;width:100%;max-width:340px;font-size:12px;color:var(--cream-muted);min-height:18px;visibility:hidden}
.luma-score b{color:#fff;font-family:var(--font-display);font-size:15px;font-variant-numeric:tabular-nums}
@media (max-width:900px){.luma-score{max-width:290px}}
.cons-demo[data-mode="reaction"] .luma-score{visibility:visible}
/* Музыка: у каждой кнопки постоянный приглушённый цвет */
.cons-btn.tint:not(.lit){background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--led) 30%,#1E1815) 0%,color-mix(in srgb,var(--led) 14%,#14100D) 100%);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--led) 40%,transparent)}
/* Победа: шкала мигает */
.cons-demo.is-win .luma-cell{animation:luma-blink .3s steps(2) infinite}
@keyframes luma-blink{50%{background:#fff;box-shadow:0 0 8px #fff}}
@media (prefers-reduced-motion:reduce){.cons-demo.is-win .luma-cell{animation:none}}
@media (max-width:900px){.luma-scale{max-width:290px}}
.luma-prices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:26px 0 18px;max-width:420px}
.luma-prices div{border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:14px 16px}
.luma-prices dt{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--cream-muted);margin-bottom:4px}
.luma-prices dd{margin:0;font-family:var(--font-display);font-size:22px;font-weight:800;color:#fff}
.luma-vat{margin:-8px 0 16px;font-size:11px;color:var(--cream-muted)}
.luma-case{margin-bottom:24px;font-size:14px}
.luma-case a{color:var(--cream-light);text-decoration:underline;text-underline-offset:3px}
.luma-case a:hover{color:#fff}

/* ---------- 02 Modular ---------- */
.chain-section{background:var(--cream)}
.chain-grid{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);gap:14px;align-items:stretch;margin-top:40px}
.chain-col{background:#fff;border:1px solid var(--border);border-radius:12px;padding:22px}
.chain-col h3{font-size:18px;margin-bottom:14px}
.chain-items{display:flex;flex-wrap:wrap;gap:6px}
.chain-items span{font-size:12px;font-weight:600;color:var(--mid);border:1.5px dashed var(--border);border-radius:100px;padding:4px 11px}
.chain-arrow{align-self:center;font-family:var(--font-display);font-size:26px;font-weight:800;color:var(--red)}
.mod-section{background:var(--warm-white)}
.mod-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:44px}
.mod-num{font-family:var(--font-display);font-size:12px;font-weight:900;letter-spacing:.06em;color:var(--red);margin-bottom:6px}
.mod-roles{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.kit-section{background:var(--cream)}
.kit-section .who-card{margin-top:28px;max-width:760px}
.kit-cta{margin-top:32px}

/* ---------- Пометка HYPOTHESIS ---------- */
/* Как и зелёный слот, пометка намеренно вне палитры бренда: это рабочий
   маркер для владельца, а не оформление. Статус HYPOTHESIS не повышается —
   плашка снимается только после решения владельца. */
.hyp-note{margin-top:28px;max-width:760px;border:2px dashed #D9A400;background:rgba(242,183,5,.12);border-radius:10px;padding:14px 18px}
.hyp-badge{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;background:#F2B705;color:#1C1916;padding:4px 9px;border-radius:4px;margin-bottom:8px}
.hyp-note p{margin:0;font-size:14px;line-height:1.6;color:var(--text)}
.hyp-tag{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;background:#F2B705;color:#1C1916;padding:3px 8px;border-radius:4px;white-space:nowrap}
.plain-tag{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--mid);border:1.5px dashed var(--border);padding:2px 8px;border-radius:4px;white-space:nowrap}

/* ---------- 04 QuestBox: аккордеон «Для кого это» ---------- */
.qb-aud-section{background:var(--warm-white)}
.qb-acc{margin-top:36px;border-top:1px solid var(--border)}
.qb-item{border-bottom:1px solid var(--border)}
.qb-item summary{display:grid;grid-template-columns:44px 1fr 28px;gap:14px;align-items:center;padding:22px 4px;cursor:pointer;list-style:none}
.qb-item summary::-webkit-details-marker{display:none}
.qb-item summary::after{content:'+';font-size:24px;font-weight:300;color:var(--red);text-align:center;transition:transform .2s}
.qb-item[open] summary::after{transform:rotate(45deg)}
.qb-num{font-family:var(--font-display);font-size:13px;font-weight:900;color:var(--red);letter-spacing:.06em}
.qb-sum strong{display:block;font-family:var(--font-display);font-size:19px;font-weight:800;line-height:1.3;color:var(--text)}
.qb-sum span{display:block;font-size:14px;color:var(--mid);margin-top:2px}
.qb-body{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:32px;align-items:start;padding:4px 4px 32px 62px}
.qb-body p{font-size:15px;line-height:1.7;color:var(--text)}
.qb-visual{position:relative;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:var(--cream)}

/* ---------- 04 QuestBox: каталог ---------- */
.qb-cat-section{background:var(--cream)}
.qb-table-wrap{margin-top:32px;background:#fff;border:1px solid var(--border);border-radius:12px;overflow:hidden}
.qb-table{width:100%;border-collapse:collapse;font-size:14px}
.qb-table th{text-align:left;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--mid);padding:14px 18px;border-bottom:1px solid var(--border);background:var(--warm-white)}
.qb-table td{padding:14px 18px;border-bottom:1px solid var(--border);vertical-align:top;line-height:1.5}
.qb-table tr:last-child td{border-bottom:none}
.qb-price{font-family:var(--font-display);font-weight:800;white-space:nowrap}
.qb-ex-section{background:var(--warm-white)}
.qb-ex-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:44px;max-width:860px}

/* ---------- Адаптив ---------- */
@media(max-width:1100px){
  .entry-grid.entry-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mod-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
  .hero.hero-page{padding:calc(56px + 32px) 0 44px}
  .chain-grid{grid-template-columns:1fr;gap:10px}
  .chain-arrow{transform:rotate(90deg);justify-self:center;line-height:1}
  .qb-body{grid-template-columns:1fr;gap:18px;padding:0 4px 28px}
}
@media(max-width:600px){
  .entry-grid.entry-grid-4{grid-template-columns:1fr}
  .qb-ex-grid{grid-template-columns:1fr}
  .qb-item summary{grid-template-columns:34px 1fr 24px;gap:10px}
  .qb-sum strong{font-size:17px}
  .qb-table th,.qb-table td{padding:12px}
}
@media(max-width:520px){
  .mod-grid{grid-template-columns:1fr}
  .luma-prices{grid-template-columns:1fr 1fr}
}

/* ---------- Эскизы модулей и общий лист (28.09.2026) ---------- */
.mod-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,340px);gap:40px;align-items:start}
.mod-intro .lead+.lead{margin-top:12px}
.mod-overview{margin:0}
.mod-overview .proof-tile{aspect-ratio:auto;background:#fff}
.mod-overview .proof-tile img{height:auto}
.mod-overview figcaption{margin-top:8px;font-size:12px;color:var(--mid)}
.setup-media.mod-sketch{background:#fff;border-bottom:1px solid var(--border)}
.setup-media.mod-sketch img{width:100%;height:100%;object-fit:contain;padding:14px;display:block}

/* ---------- QuestBox: ролик в шапке и готовые квесты ---------- */
.video-sound{position:absolute;right:12px;bottom:12px;z-index:2;display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border-radius:100px;border:1px solid rgba(255,255,255,.3);background:rgba(0,0,0,.55);color:#fff;font-family:var(--font-body);font-size:12px;font-weight:600;cursor:pointer}
.video-sound:hover{background:rgba(0,0,0,.75)}
.video-sound svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.video-sound .snd-wave{display:none}
.video-sound.is-on .snd-wave{display:inline}
.video-sound.is-on .snd-off{display:none}
.qb-quests-section{background:var(--cream)}
.qb-quest-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:44px}
.setup-media img{width:100%;height:100%;object-fit:cover;display:block}
.qb-thumbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:auto;padding-top:6px}
.qb-thumbs .proof-tile{border-radius:8px}
@media(max-width:1000px){
  .qb-quest-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mod-intro{grid-template-columns:1fr;gap:24px}
  .mod-overview{max-width:340px}
}
@media(max-width:600px){
  .qb-quest-grid{grid-template-columns:1fr}
}