/* =====================================================================
   ZEN — тёмный «агентский» стиль: WebGL-фон, неоновый лайм, крупная типографика,
   контурные кнопки-пилюли, разреженные подписи капсом.
   Подключается ПОСЛЕ modern.css / glass.css и переопределяет их токены.
   ===================================================================== */

/* ---------- Токены: тёмная тема по умолчанию ---------- */
:root, :root[data-theme="dark"], :root:not([data-theme="light"]) {
  --bg-base: #070603;
  --paper: rgba(255,255,255,.04); --paper-2: rgba(255,255,255,.025);
  --line: rgba(255,255,255,.10); --edge: rgba(255,255,255,.08);
  --ink: #FBF8EC; --ink-2: #D6D0BC; --muted: #9A937C;
  --yellow: #FDE018; --yellow-strong: #FFE94A; --yellow-soft: rgba(253,224,24,.10);
  --dark: rgba(255,255,255,.07); --code-bg: rgba(0,0,0,.55);
  --shadow: 0 24px 50px -28px rgba(0,0,0,.85);
  --shadow-lg: 0 0 44px -14px rgba(253,224,24,.38), 0 30px 60px -26px rgba(0,0,0,.9);
  --blur: blur(16px) saturate(140%);
  --grad-a: #FFFFFF; --grad-b: #FFF0A0;
  --blob-1: rgba(253,224,24,.10); --blob-2: rgba(180,120,10,.22); --blob-3: rgba(253,224,24,.08); --blob-4: rgba(150,100,10,.20);
  --zen-border-strong: rgba(255,255,255,.30);
  --zen-display: 'Space Grotesk', 'Inter', system-ui, sans-serif;
  color-scheme: dark;
}
:root[data-theme="light"] {
  --bg-base: #FBF8EC;
  --paper: rgba(255,255,255,.66); --paper-2: rgba(255,255,255,.42);
  --line: rgba(22,19,10,.11); --edge: rgba(22,19,10,.08);
  --ink: #16130A; --ink-2: #4A4330; --muted: #7A7258;
  --yellow: #FDE018; --yellow-strong: #F5D90A; --yellow-soft: rgba(253,224,24,.28);
  --dark: #16130A; --code-bg: rgba(8,12,6,.94);
  --shadow: 0 18px 44px -26px rgba(70,55,10,.35);
  --shadow-lg: 0 0 40px -12px rgba(220,180,0,.45), 0 26px 56px -26px rgba(70,55,10,.45);
  --grad-a: #16130A; --grad-b: #7A6200;
  --blob-1: rgba(253,224,24,.30); --blob-2: rgba(230,190,60,.20); --blob-3: rgba(253,224,24,.22); --blob-4: rgba(250,225,140,.30);
  --zen-border-strong: rgba(22,19,10,.34);
  color-scheme: light;
}

/* ---------- Основа ---------- */
html { background: var(--bg-base); }
html.has-shader body::before { display: none !important; }
body { font-family: 'Inter', system-ui, sans-serif !important; background: transparent !important; color: var(--ink); }
h1, h2, h3, h4, .disp, .itf-h1, .itf-hero__title, .hero-title, .itf-course__title, .itf-brand__name, .itf-colhead { font-family: var(--zen-display) !important; }
::selection { background: var(--yellow); color: #16130A; }

/* подписи-рубрики: мелкие, разреженные, капсом */
.ribbon, .itf-ribbon, .itf-colhead, .itf-crumbs, .itf-prose .itf-out::before {
  font-family: var(--zen-display) !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: .26em !important; text-transform: uppercase; color: var(--ink-2) !important;
}
.ribbon::before, .itf-ribbon::before { width: 7px; height: 7px; border-radius: 1px !important; background: var(--yellow) !important; box-shadow: 0 0 14px 1px var(--yellow) !important; }

/* ---------- Шапка (основной сайт) ---------- */
body > div > header { background: rgba(7,6,3,.35) !important; -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur); border-bottom: 1px solid var(--line) !important; box-shadow: none !important; }
:root[data-theme="light"] body > div > header { background: rgba(251,248,236,.6) !important; }
body > div > header .wrap { height: 76px !important; }
header .disp { color: var(--yellow) !important; font-weight: 700 !important; letter-spacing: .16em !important; text-transform: uppercase; font-size: 15px !important; }
:root[data-theme="light"] header .disp { color: var(--ink) !important; }
header nav a { color: var(--ink) !important; font-size: 14.5px !important; font-weight: 500 !important; background: transparent !important; border-radius: 0 !important; padding: 6px 4px !important; margin: 0 10px; position: relative; }
header nav a::after { content: ""; position: absolute; left: 4px; right: 4px; bottom: 0; height: 1px; background: var(--yellow); transform: scaleX(0); transform-origin: left; transition: transform .25s; }
header nav a:hover { color: var(--yellow) !important; background: transparent !important; }
:root[data-theme="light"] header nav a:hover { color: var(--ink) !important; }
header nav a:hover::after { transform: scaleX(1); }
.theme-toggle { background: transparent !important; border: 1px solid var(--zen-border-strong) !important; border-radius: 999px !important; color: var(--ink) !important; }
.theme-toggle:hover { border-color: var(--yellow) !important; color: var(--yellow) !important; background: transparent !important; }
:root[data-theme="light"] .theme-toggle:hover { color: var(--ink) !important; }

/* ---------- Кнопки ---------- */
.pill, .itf-btn, .button, input[type="submit"], button.form-submit {
  border-radius: 999px !important; font-family: var(--zen-display) !important; font-weight: 600 !important; font-size: 14px !important; letter-spacing: .01em;
  padding: 13px 26px !important; transition: background .2s, color .2s, border-color .2s, box-shadow .2s, transform .15s !important;
}
.pill-solid, .itf-btn, .button, input[type="submit"], button.form-submit {
  background: var(--yellow) !important; color: #16130A !important; border: 1px solid var(--yellow) !important; box-shadow: 0 0 0 0 rgba(253,224,24,0) !important;
}
.pill-solid:hover, .itf-btn:hover, .button:hover, input[type="submit"]:hover {
  background: var(--yellow-strong) !important; color: #16130A !important; box-shadow: 0 0 34px -4px rgba(253,224,24,.75) !important; transform: translateY(-1px) !important;
}
.pill-ghost, .pill-dark, .itf-btn--ghost, .itf-btn--dark {
  background: transparent !important; color: var(--ink) !important; border: 1px solid var(--zen-border-strong) !important; box-shadow: none !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
.pill-ghost:hover, .pill-dark:hover, .itf-btn--ghost:hover, .itf-btn--dark:hover {
  background: transparent !important; color: var(--yellow) !important; border-color: var(--yellow) !important; box-shadow: 0 0 28px -8px rgba(253,224,24,.6) !important;
}
:root[data-theme="light"] .pill-ghost:hover, :root[data-theme="light"] .pill-dark:hover, :root[data-theme="light"] .itf-btn--ghost:hover, :root[data-theme="light"] .itf-btn--dark:hover { color: var(--ink) !important; background: var(--yellow) !important; }
/* кнопка в шапке — контурная, как «LET'S TALK ↗» */
header .pill-solid { background: transparent !important; color: var(--yellow) !important; border: 1px solid var(--yellow) !important; padding: 11px 24px !important; }
header .pill-solid:hover { background: var(--yellow) !important; color: #16130A !important; }
:root[data-theme="light"] header .pill-solid { color: var(--ink) !important; border-color: var(--ink) !important; }
:root[data-theme="light"] header .pill-solid:hover { background: var(--yellow) !important; border-color: var(--yellow) !important; }
.itf-header .itf-btn--solid { background: transparent !important; color: var(--yellow) !important; }
.itf-header .itf-btn--solid:hover { background: var(--yellow) !important; color: #16130A !important; }

/* ---------- Главный экран ---------- */
section.hero-m { background: transparent !important; }
section.hero-m .wrap { padding-top: 104px !important; padding-bottom: 104px !important; }
.hero-title, .itf-hero__title {
  font-size: clamp(40px, 5.3vw, 78px) !important; font-weight: 700 !important; letter-spacing: -.045em !important; line-height: 1 !important;
  background: linear-gradient(120deg, var(--grad-a) 40%, var(--grad-b)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
}
section.hero-m .lead, .itf-lead { color: var(--ink-2) !important; font-size: 18px !important; }
section.hero-m .chip { border: 0 !important; background: none !important; padding: 0 !important; box-shadow: none !important; font-size: 11px !important; letter-spacing: .26em; text-transform: uppercase; color: var(--ink-2) !important; -webkit-backdrop-filter: none; backdrop-filter: none; }
section.hero-m .chip::before { content: "/"; color: var(--yellow); margin-right: 8px; }
section.hero-m::before { opacity: .0 !important; }
section.hero-m::after { display: none !important; }
section.hero-m div[style*="overflow:hidden; background:#fff"] { border-radius: 26px !important; padding: 8px; background: var(--paper) !important; border: 1px solid var(--line) !important; box-shadow: var(--shadow-lg) !important; }
section.hero-m img { filter: none; }

/* ---------- Карточки и блоки ---------- */
.hardcard, .faq-item, .itf-card, .itf-panel, .itf-hero__steps li, #submit-panel {
  background: var(--paper) !important; border: 1px solid var(--line) !important; border-radius: 20px !important; box-shadow: var(--shadow) !important;
  -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur);
}
.tilt-card:hover, .itf-course:hover, .itf-hero__steps li:hover { border-color: rgba(253,224,24,.55) !important; box-shadow: var(--shadow-lg) !important; transform: translateY(-4px) !important; }
.chip, .itf-chip { background: transparent !important; border: 1px solid var(--zen-border-strong) !important; border-radius: 999px !important; color: var(--ink) !important; box-shadow: none !important; font-weight: 500 !important; }
.itf-chip--beginner { color: var(--yellow) !important; border-color: rgba(253,224,24,.45) !important; }
.itf-chip--intermediate { color: #FFD166 !important; border-color: rgba(255,209,102,.45) !important; }
.itf-chip--advanced { color: #FF8A80 !important; border-color: rgba(255,138,128,.45) !important; }
:root[data-theme="light"] .itf-chip--beginner { color: #7A6200 !important; } :root[data-theme="light"] .itf-chip--intermediate { color: #8A5A00 !important; } :root[data-theme="light"] .itf-chip--advanced { color: #B3261E !important; }
#directions, section.who-m, #showcase { background: transparent !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; border-top: 1px solid var(--line) !important; border-bottom: 0 !important; }
#directions .chip { border: 1px solid var(--line) !important; background: var(--paper) !important; border-radius: 14px !important; padding: 14px 16px !important; -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur); }
#directions .chip:hover { border-color: var(--yellow) !important; color: var(--yellow) !important; background: var(--yellow-soft) !important; }
:root[data-theme="light"] #directions .chip:hover { color: var(--ink) !important; }
section h2.disp { font-size: clamp(30px, 4.4vw, 56px) !important; font-weight: 700 !important; letter-spacing: -.04em !important; line-height: 1.04 !important; }
section.who-m div[style*="border:1px solid rgba(255,255,255"] { border-radius: 20px !important; }
section.who-m .disp { color: var(--yellow) !important; }
:root[data-theme="light"] section.who-m .disp { color: var(--ink) !important; }
section.who-m .disp::before { border-radius: 1px; box-shadow: 0 0 12px 1px var(--yellow); }
div[style*="width:48px; height:48px"], div[style*="width:52px; height:52px"] { background: transparent !important; border: 1px solid rgba(253,224,24,.5) !important; box-shadow: 0 0 24px -8px rgba(253,224,24,.55) !important; border-radius: 14px !important; }
div[style*="width:48px; height:48px"] svg [stroke] { stroke: var(--yellow) !important; }
div[style*="width:48px; height:48px"] svg [fill]:not([fill="none"]) { fill: var(--yellow) !important; }
div[style*="width:52px; height:52px"] span { color: var(--yellow) !important; }
:root[data-theme="light"] div[style*="width:48px; height:48px"] svg [stroke] { stroke: var(--ink) !important; }
:root[data-theme="light"] div[style*="width:48px; height:48px"] svg [fill]:not([fill="none"]) { fill: var(--ink) !important; }
:root[data-theme="light"] div[style*="width:52px; height:52px"] span { color: var(--ink) !important; }
.faq-item:hover, .faq-item.open { border-color: rgba(253,224,24,.55) !important; background: var(--paper) !important; }
.faq-arrow path { stroke: var(--yellow) !important; }
:root[data-theme="light"] .faq-arrow path { stroke: var(--ink) !important; }
#join > .wrap { background: var(--paper); border: 1px solid var(--line); border-radius: 32px; box-shadow: var(--shadow-lg); }
#join > .wrap::before { background: radial-gradient(closest-side, rgba(253,224,24,.45), transparent); }
#join h2 { font-size: clamp(34px, 5vw, 64px) !important; }
#join .pill-dark { background: var(--yellow) !important; color: #16130A !important; border: 1px solid var(--yellow) !important; }
#join .pill-dark:hover { background: var(--yellow-strong) !important; color: #16130A !important; box-shadow: 0 0 34px -4px rgba(253,224,24,.75) !important; }
.social-btn { background: transparent !important; border: 1px solid var(--zen-border-strong) !important; border-radius: 50% !important; box-shadow: none !important; }
.social-btn:hover { border-color: var(--yellow) !important; background: var(--yellow-soft) !important; box-shadow: 0 0 22px -6px rgba(253,224,24,.7) !important; }
.social-btn svg [stroke="#131210"] { stroke: var(--ink) !important; } .social-btn svg [fill="#131210"] { fill: var(--ink) !important; }
.social-btn:hover svg [stroke="#131210"] { stroke: var(--yellow) !important; } .social-btn:hover svg [fill="#131210"] { fill: var(--yellow) !important; }
:root[data-theme="light"] .social-btn:hover svg [stroke="#131210"] { stroke: var(--ink) !important; } :root[data-theme="light"] .social-btn:hover svg [fill="#131210"] { fill: var(--ink) !important; }
footer, .itf-footer { background: transparent !important; border-top: 1px solid var(--line) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
footer .disp { color: var(--yellow) !important; letter-spacing: .14em; text-transform: uppercase; font-size: 14px !important; }
:root[data-theme="light"] footer .disp { color: var(--ink) !important; }
#cookie-banner { background: rgba(7,6,3,.85) !important; border: 1px solid var(--line) !important; border-radius: 16px !important; }
#cookie-banner button { background: var(--yellow) !important; color: #16130A !important; border-radius: 999px !important; }
#submit-panel input, #submit-panel textarea, input[type="text"], input[type="email"], input[type="password"], input[type="number"], textarea, select { background: var(--paper-2) !important; border: 1px solid var(--line) !important; color: var(--ink) !important; border-radius: 12px !important; }
input:focus, textarea:focus, select:focus { border-color: var(--yellow) !important; outline: 0 !important; box-shadow: 0 0 0 3px rgba(253,224,24,.22) !important; }

/* ---------- Академия ---------- */
.itf-header { background: rgba(7,6,3,.35) !important; border-bottom: 1px solid var(--line) !important; box-shadow: none !important; -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur); }
:root[data-theme="light"] .itf-header { background: rgba(251,248,236,.6) !important; }
.itf-brand__name { font-weight: 700 !important; letter-spacing: .08em !important; text-transform: uppercase; font-size: 14.5px !important; color: var(--yellow) !important; }
:root[data-theme="light"] .itf-brand__name { color: var(--ink) !important; }
.itf-brand__name em { border: 1px solid var(--zen-border-strong) !important; color: var(--ink-2) !important; letter-spacing: .2em; text-transform: uppercase; font-size: 10px !important; border-radius: 999px !important; padding: 2px 10px !important; }
.itf-nav a { color: var(--ink) !important; background: transparent !important; box-shadow: none !important; border-radius: 0 !important; padding: 6px 4px !important; margin: 0 8px; }
.itf-nav a:hover, .itf-nav a.is-active { color: var(--yellow) !important; background: transparent !important; box-shadow: inset 0 -1px 0 var(--yellow) !important; }
:root[data-theme="light"] .itf-nav a:hover, :root[data-theme="light"] .itf-nav a.is-active { color: var(--ink) !important; }
.itf-theme { background: transparent !important; border: 1px solid var(--zen-border-strong) !important; border-radius: 999px !important; color: var(--ink) !important; }
.itf-theme:hover { border-color: var(--yellow) !important; color: var(--yellow) !important; background: transparent !important; }
.itf-link { color: var(--ink) !important; }
.itf-hero { background: transparent !important; }
.itf-hero::before { opacity: 0 !important; }
.itf-hero__grid { padding-top: 110px !important; padding-bottom: 110px !important; }
.itf-hero__steps b { background: transparent !important; border: 1px solid var(--yellow) !important; color: var(--yellow) !important; box-shadow: 0 0 18px -4px rgba(253,224,24,.6) !important; }
:root[data-theme="light"] .itf-hero__steps b { color: var(--ink) !important; border-color: var(--ink) !important; box-shadow: none !important; }
.itf-hl { box-shadow: inset 0 -0.14em 0 var(--yellow) !important; color: inherit !important; }
.itf-panel--yellow { background: linear-gradient(135deg, rgba(253,224,24,.10), rgba(255,255,255,.02)) !important; border: 1px solid rgba(253,224,24,.28) !important; color: var(--ink) !important; }
.itf-panel--yellow::before { background: radial-gradient(closest-side, rgba(253,224,24,.35), transparent) !important; }
.itf-panel--yellow .itf-h1, .itf-panel--compact .itf-h1 { color: var(--ink) !important; }
.itf-panel--yellow .itf-btn--dark { background: var(--yellow) !important; color: #16130A !important; border-color: var(--yellow) !important; }
.itf-panel--yellow .itf-chip { color: var(--ink) !important; background: transparent !important; }
.itf-panel--compact { border-left: 3px solid var(--yellow) !important; }
.itf-h1 { letter-spacing: -.04em !important; font-weight: 700 !important; }
.itf-course__ph { background: radial-gradient(260px 160px at 80% 10%, rgba(253,224,24,.45), transparent 65%), radial-gradient(240px 160px at 10% 100%, rgba(210,150,10,.38), transparent 65%), linear-gradient(135deg, #150F02, #070502) !important; }
.itf-course__ph b { color: var(--yellow) !important; text-shadow: 0 0 28px rgba(253,224,24,.6); }
.itf-course__ph b::before, .itf-course__ph b::after { color: #fff !important; }
.itf-course__title { letter-spacing: -.02em; }
.itf-topics__list .is-current a { background: var(--yellow-soft) !important; box-shadow: inset 2px 0 0 var(--yellow) !important; color: var(--ink) !important; }
.itf-topics__list a:hover { background: rgba(255,255,255,.05) !important; }
.itf-topics__list .is-current .itf-topics__n { background: var(--yellow) !important; color: #16130A !important; border-color: var(--yellow) !important; }
.itf-topics__list .is-done .itf-topics__n { background: transparent !important; color: var(--yellow) !important; border-color: var(--yellow) !important; }
.itf-progress { background: rgba(255,255,255,.08) !important; border: 0 !important; }
:root[data-theme="light"] .itf-progress { background: rgba(22,19,10,.10) !important; }
.itf-progress i { background: var(--yellow) !important; box-shadow: 0 0 14px rgba(253,224,24,.8) !important; }
.itf-colhead b, .itf-step__title b { background: transparent !important; border: 1px solid var(--yellow) !important; color: var(--yellow) !important; box-shadow: none !important; }
:root[data-theme="light"] .itf-colhead b, :root[data-theme="light"] .itf-step__title b { color: var(--ink) !important; border-color: var(--ink) !important; }
.itf-card--practice { background: linear-gradient(135deg, rgba(253,224,24,.12), rgba(255,255,255,.02)) !important; border-color: rgba(253,224,24,.35) !important; }
.itf-complete.is-done { background: var(--yellow-soft) !important; border-color: rgba(253,224,24,.5) !important; }
.itf-prose { color: var(--ink); }
.itf-prose code { background: rgba(255,255,255,.07) !important; color: var(--yellow) !important; border: 1px solid var(--line) !important; }
:root[data-theme="light"] .itf-prose code { background: rgba(22,19,10,.06) !important; color: #6B5A00 !important; }
.itf-prose pre { background: var(--code-bg) !important; border: 1px solid var(--line) !important; }
.itf-prose pre code { background: transparent !important; border: 0 !important; color: #E6EDF3 !important; }
.itf-prose .itf-callout { background: var(--yellow-soft) !important; border: 1px solid rgba(253,224,24,.30) !important; border-left: 3px solid var(--yellow) !important; }
.itf-prose .itf-callout--warn { background: rgba(255,90,80,.10) !important; border-color: rgba(255,90,80,.30) !important; border-left-color: #FF5A50 !important; }
.itf-prose .itf-callout--ok { background: rgba(60,220,140,.10) !important; border-color: rgba(60,220,140,.30) !important; border-left-color: #3CDC8C !important; }
.itf-prose .itf-out { background: rgba(255,255,255,.04) !important; border: 1px dashed var(--zen-border-strong) !important; }
.itf-prose .itf-recap { background: var(--paper) !important; border-left: 3px solid var(--yellow) !important; }
.itf-prose ol.itf-lines li::before { background: transparent !important; border: 1px solid var(--yellow); color: var(--yellow) !important; box-shadow: none !important; }
:root[data-theme="light"] .itf-prose ol.itf-lines li::before { color: var(--ink) !important; border-color: var(--ink); }
.itf-prose a { border-bottom-color: var(--yellow) !important; }
.itf-dashcard--cert { background: linear-gradient(135deg, rgba(253,224,24,.14), var(--paper)) !important; border-color: rgba(253,224,24,.4) !important; }
.itf-main th { background: var(--paper) !important; color: var(--muted) !important; }
.itf-lessons tr:hover, .itf-lessons li:hover { background: rgba(255,255,255,.05) !important; }
:root[data-theme="light"] .itf-prose .itf-out, :root[data-theme="light"] .itf-topics__list a:hover, :root[data-theme="light"] .itf-lessons tr:hover { background: rgba(22,19,10,.04) !important; }

/* заголовок Академии: перебиваем лиловый градиент старого слоя */
:root[data-theme="dark"] .itf-hero__title, :root[data-theme="light"] .itf-hero__title, .itf-hero__title { background-image: linear-gradient(120deg, var(--grad-a) 40%, var(--grad-b)) !important; }

/* светлая тема Академии: читаемая кнопка в шапке и код в блоках */
:root[data-theme="light"] .itf-header .itf-btn--solid { color: var(--ink) !important; border-color: var(--ink) !important; background: transparent !important; }
:root[data-theme="light"] .itf-header .itf-btn--solid:hover { background: var(--yellow) !important; border-color: var(--yellow) !important; }
:root[data-theme="light"] .itf-prose pre code, :root[data-theme="dark"] .itf-prose pre code { color: #E6EDF3 !important; background: transparent !important; border: 0 !important; }

/* =====================================================================
   AURA — «дымный» центрированный лендинг: лёгкий заголовок с градиентом, стеклянный бейдж,
   тёмные кнопки со свечением, квадратные иконки, бегущая лента с затухающими краями.
   ===================================================================== */

/* плёночное зерно поверх всего */
body::after { content: ""; position: fixed; inset: 0; z-index: 3; pointer-events: none; opacity: .06; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); }
:root[data-theme="light"] body::after { opacity: .035; }
@media print { body::after { display: none; } }

/* ---------- Шапка: приглушённое меню, чистый логотип ---------- */
header .disp, .itf-brand__name { text-transform: none !important; letter-spacing: -.015em !important; font-size: 18px !important; font-weight: 600 !important; color: var(--ink) !important; }
header nav a, .itf-nav a { color: var(--muted) !important; font-weight: 500 !important; }
header nav a:hover, .itf-nav a:hover, .itf-nav a.is-active { color: var(--ink) !important; }
header .pill-solid, .itf-header .itf-btn--solid {
  background: var(--yellow) !important; color: #16130A !important; border: 1px solid var(--yellow) !important; border-radius: 12px !important;
  padding: 10px 20px !important; box-shadow: 0 0 28px -6px rgba(253,224,24,.6) !important;
}
header .pill-solid:hover, .itf-header .itf-btn--solid:hover { background: var(--yellow-strong) !important; color: #16130A !important; box-shadow: 0 0 36px -4px rgba(253,224,24,.8) !important; }
:root[data-theme="light"] header .pill-solid, :root[data-theme="light"] .itf-header .itf-btn--solid { color: #16130A !important; border-color: var(--yellow) !important; background: var(--yellow) !important; }

/* ---------- Герой по центру ---------- */
section.hero-m .wrap { grid-template-columns: 1fr !important; justify-items: center; text-align: center; gap: 64px !important; padding-top: 96px !important; padding-bottom: 72px !important; }
section.hero-m .wrap > div:first-child { align-items: center !important; max-width: 940px; }
section.hero-m .wrap > div:first-child > div { justify-content: center; }
section.hero-m .wrap > div:first-child .lead { max-width: 660px; margin-inline: auto; }
section.hero-m .wrap > div:last-child { width: 100%; max-width: 900px; }
section.hero-m .ribbon {
  padding: 9px 20px !important; border-radius: 999px !important; border: 1px solid rgba(255,255,255,.14); text-transform: none !important; letter-spacing: .01em !important; font-size: 13px !important; font-weight: 600 !important;
  color: var(--ink) !important; background: linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.02)); box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 10px 28px -12px rgba(0,0,0,.9);
  -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur);
}
:root[data-theme="light"] section.hero-m .ribbon { border-color: rgba(22,19,10,.14); background: rgba(255,255,255,.6); box-shadow: 0 10px 28px -14px rgba(70,55,10,.4); }
.hero-title, .itf-hero__title {
  font-weight: 500 !important; letter-spacing: -.05em !important; line-height: 1.02 !important; font-size: clamp(40px, 5.6vw, 82px) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #ffffff 36%, #8d8b94 62%, var(--yellow) 100%) !important;
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
}
:root[data-theme="light"] .hero-title, :root[data-theme="light"] .itf-hero__title { background-image: linear-gradient(180deg, #16130A 0%, #16130A 40%, #6e6a55 68%, #b89a00 100%) !important; }
section.hero-m .lead, .itf-lead { font-size: 18px !important; color: var(--ink-2) !important; }
/* главная кнопка — тёмная, с цветной обводкой и свечением */
.hero-cta .pill-dark, .itf-hero__cta .itf-btn--dark {
  background: linear-gradient(180deg, rgba(253,224,24,.16), rgba(0,0,0,.65)) !important; color: #fff !important; border: 1px solid rgba(253,224,24,.55) !important;
  box-shadow: 0 0 44px -10px rgba(253,224,24,.55), inset 0 1px 0 rgba(255,255,255,.14) !important; border-radius: 14px !important; padding: 15px 28px !important;
}
.hero-cta .pill-dark:hover, .itf-hero__cta .itf-btn--dark:hover { color: #fff !important; background: linear-gradient(180deg, rgba(253,224,24,.26), rgba(0,0,0,.6)) !important; box-shadow: 0 0 60px -8px rgba(253,224,24,.75), inset 0 1px 0 rgba(255,255,255,.2) !important; }
.hero-cta .pill-ghost, .itf-hero__cta .itf-btn--ghost { background: rgba(0,0,0,.45) !important; border: 1px solid rgba(255,255,255,.14) !important; border-radius: 14px !important; padding: 15px 28px !important; color: var(--ink) !important; }
.hero-cta .pill-ghost:hover, .itf-hero__cta .itf-btn--ghost:hover { border-color: rgba(253,224,24,.6) !important; color: var(--ink) !important; background: rgba(0,0,0,.55) !important; }
:root[data-theme="light"] .hero-cta .pill-dark, :root[data-theme="light"] .itf-hero__cta .itf-btn--dark { background: #16130A !important; color: #fff !important; border-color: #16130A !important; box-shadow: 0 18px 40px -16px rgba(22,19,10,.6) !important; }
:root[data-theme="light"] .hero-cta .pill-ghost, :root[data-theme="light"] .itf-hero__cta .itf-btn--ghost { background: rgba(255,255,255,.6) !important; border-color: rgba(22,19,10,.2) !important; }
section.hero-m .chip { justify-content: center; }
section.hero-m div[style*="overflow:hidden; background:#fff"] { box-shadow: 0 0 90px -24px rgba(253,224,24,.5), var(--shadow-lg) !important; }

/* ---------- Бегущая лента с затухающими краями ---------- */
.strip-m { display: block !important; background: transparent !important; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 20px 0 !important;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent); mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent); }
.strip-m .marquee-track { color: var(--muted) !important; font-family: 'Inter', sans-serif !important; font-weight: 500 !important; font-size: 15px !important; letter-spacing: .04em !important; }

/* ---------- Квадратные иконки соцсетей ---------- */
.social-btn { border-radius: 12px !important; background: rgba(255,255,255,.04) !important; }
:root[data-theme="light"] .social-btn { background: rgba(255,255,255,.6) !important; }

/* ---------- Карточки: тонкий верхний блик ---------- */
.hardcard, .itf-card, .itf-course { box-shadow: inset 0 1px 0 rgba(255,255,255,.07), var(--shadow) !important; }
:root[data-theme="light"] .hardcard, :root[data-theme="light"] .itf-card, :root[data-theme="light"] .itf-course { box-shadow: var(--shadow) !important; }

/* ---------- Появление блоков при прокрутке (reveal.js) ---------- */
.js-rv .rv { opacity: 0; transform: translate3d(0, 28px, 0) scale(.985); filter: blur(8px);
  transition: opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1), filter .9s cubic-bezier(.2,.7,.2,1);
  transition-delay: var(--d, 0ms); will-change: opacity, transform, filter; }
.js-rv .rv.in { opacity: 1; transform: none; filter: none; }
@media (prefers-reduced-motion: reduce) { .js-rv .rv { opacity: 1; transform: none; filter: none; transition: none; } }

/* ---------- Иллюстрация героя в виде монитора ---------- */
section.hero-m .wrap > div:last-child { position: relative; padding-bottom: 96px; max-width: 920px; animation: mon-float 8s ease-in-out infinite; }
@keyframes mon-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -9px; } }
section.hero-m .wrap > div:last-child > div[style*="overflow:hidden"] {
  position: relative; z-index: 1; padding: 16px 16px 30px !important; border-radius: 22px !important;
  background: linear-gradient(180deg, #1d1d20 0%, #0b0b0d 100%) !important; border: 1px solid #38383e !important;
  box-shadow: 0 0 0 2px #050505, 0 46px 90px -34px rgba(0,0,0,.95), 0 0 130px -34px rgba(253,224,24,.55), inset 0 1px 0 rgba(255,255,255,.20), inset 0 -2px 0 rgba(0,0,0,.6) !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
section.hero-m .wrap > div:last-child > div[style*="overflow:hidden"] img {
  border-radius: 9px !important; display: block; width: 100%; box-shadow: 0 0 0 1px #000, 0 0 40px -6px rgba(253,224,24,.35);
}
/* блик на стекле экрана */
section.hero-m .wrap > div:last-child > div[style*="overflow:hidden"]::after {
  content: ""; position: absolute; inset: 16px 16px 30px; border-radius: 9px; pointer-events: none;
  background: linear-gradient(118deg, rgba(255,255,255,.20) 0%, rgba(255,255,255,.06) 26%, rgba(255,255,255,0) 40%), linear-gradient(0deg, rgba(0,0,0,.18), rgba(0,0,0,0) 18%);
}
/* камера и индикатор */
section.hero-m .wrap > div:last-child > div[style*="overflow:hidden"]::before {
  content: ""; position: absolute; top: 5px; left: 50%; width: 5px; height: 5px; margin-left: -2.5px; border-radius: 50%; background: #17171a; z-index: 2;
  box-shadow: 0 0 0 2px #0c0c0e, 0 0 7px rgba(110,170,255,.55);
}
/* шея и основание подставки */
section.hero-m .wrap > div:last-child::before {
  content: ""; position: absolute; left: 50%; bottom: 14px; width: 130px; height: 70px; transform: translateX(-50%); z-index: 0;
  background: linear-gradient(90deg, #202024 0%, #55555c 48%, #202024 100%); clip-path: polygon(16% 0, 84% 0, 100% 100%, 0 100%);
}
section.hero-m .wrap > div:last-child::after {
  content: ""; position: absolute; left: 50%; bottom: 0; width: min(320px, 56%); height: 16px; transform: translateX(-50%); z-index: 0;
  border-radius: 10px 10px 16px 16px; background: linear-gradient(180deg, #6a6a72 0%, #2c2c31 55%, #17171a 100%);
  box-shadow: 0 22px 44px -14px rgba(0,0,0,.9), 0 0 70px -20px rgba(253,224,24,.40), inset 0 1px 0 rgba(255,255,255,.35);
}
@media (max-width: 700px) {
  section.hero-m .wrap > div:last-child { padding-bottom: 66px; }
  section.hero-m .wrap > div:last-child > div[style*="overflow:hidden"] { padding: 10px 10px 20px !important; border-radius: 16px !important; }
  section.hero-m .wrap > div:last-child > div[style*="overflow:hidden"]::after { inset: 10px 10px 20px; }
  section.hero-m .wrap > div:last-child::before { width: 84px; height: 46px; }
}
@media (prefers-reduced-motion: reduce) { section.hero-m .wrap > div:last-child { animation: none; } }

/* ---------- Герой: текст слева, монитор справа на одном уровне ---------- */
section.hero-m .wrap { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr) !important; justify-items: stretch !important; text-align: left !important; align-items: center !important; gap: 56px !important; padding-top: 112px !important; padding-bottom: 88px !important; }
section.hero-m .wrap > div:first-child { align-items: flex-start !important; max-width: none !important; }
section.hero-m .wrap > div:first-child > div { justify-content: flex-start !important; }
section.hero-m .wrap > div:first-child .lead { margin-inline: 0 !important; max-width: 540px !important; }
section.hero-m .wrap > div:last-child { max-width: none !important; width: 100% !important; align-self: center; }
section.hero-m .hero-title { font-size: clamp(34px, 4.3vw, 66px) !important; }
@media (max-width: 960px) {
  section.hero-m .wrap { grid-template-columns: 1fr !important; justify-items: center !important; text-align: center !important; gap: 44px !important; }
  section.hero-m .wrap > div:first-child { align-items: center !important; }
  section.hero-m .wrap > div:first-child > div { justify-content: center !important; }
  section.hero-m .wrap > div:first-child .lead { margin-inline: auto !important; }
  section.hero-m .wrap > div:last-child { max-width: 760px !important; }
}

section.hero-m .hero-title { text-wrap: balance; }