/* SEO Drift — главная, концепция «Сигнал» (design-prototypes/round-3/03-signal-airy.html).
   Подключается только на главной и на «Обо мне» (там блок направлений). Шапка, подвал, шрифт
   и кнопки — общие из site.css; здесь — первый экран и блоки главной полосами во всю ширину. */

.tpl-home, .tpl-about {
  --h-line: #284356;
  --h-panel: #0b1725;
  --h-panel2: #0d1d2b;
  --h-muted: #9cb3c4;
  --h-soft: #b6cbd4;
  --h-text2: #d5e7ed;
  --h-cyan: #00e5ff;
  --h-lime: #c8f781;
  --h-amber: #ffb547;
  /* поля по краям полосы: контент выровнен по .container шапки (1180px, поля 16px) */
  --h-gutter: max(16px, calc((100% - 1180px) / 2 + 16px));
}

/* ---------- первый экран ---------- */
.home-hero {
  position: relative; overflow: hidden; padding-top: var(--header-h);
  background: radial-gradient(circle at 85% 37%, #073847 0, transparent 31%), radial-gradient(circle at 11% 9%, #0c2850 0, transparent 45%);
}
.home-hero::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, transparent 49.9%, #3e72802c 50%, transparent 50.1%), linear-gradient(0deg, transparent 49.9%, #3e72802c 50%, transparent 50.1%);
  background-size: 105px 105px; -webkit-mask-image: linear-gradient(90deg, transparent, #000); mask-image: linear-gradient(90deg, transparent, #000);
}
.home-hero-in {
  position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(285px, .7fr);
  gap: 45px; align-items: center; padding-top: 50px; padding-bottom: 58px;
}
.home-eyebrow {
  display: inline-flex; align-items: center; gap: 9px; border: 1px solid #2b6c76; border-radius: 100px; padding: 8px 12px;
  background: #09232d; font-size: 12px; font-weight: 800; color: var(--h-cyan); letter-spacing: .07em; text-transform: uppercase;
}
.home-eyebrow i { width: 7px; height: 7px; background: var(--h-cyan); border-radius: 50%; box-shadow: 0 0 12px var(--h-cyan); }
.home-hero h1 { font-size: clamp(44px, 4.5vw, 68px); line-height: 1.02; letter-spacing: -.065em; margin: 23px 0; font-weight: 900; }
.home-hero h1 em { font-style: normal; color: var(--h-cyan); }
.home-lead { max-width: 650px; font-size: 19px; color: #c5d8e3; }
.home-actions { display: flex; flex-wrap: wrap; gap: 11px; margin: 30px 0 28px; }
.home-signature { display: flex; align-items: center; gap: 14px; padding-top: 12px; }
.home-signature strong { display: block; font-size: 14px; }
.home-signature span { display: block; color: var(--h-muted); font-size: 12px; }
.home-avatar { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; border: 2px solid var(--h-cyan); }
.home-hero-visual { height: 400px; position: relative; display: flex; align-items: center; justify-content: center; }
.home-portrait {
  width: min(100%, 325px); aspect-ratio: 1; border-radius: 50%; padding: 10px; border: 1px solid #38ddeb99;
  box-shadow: 0 0 0 1px var(--line-strong), 0 0 60px rgba(0, 229, 255, .2);
}
.home-portrait img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; filter: saturate(.8); display: block; }
.home-orbit {
  position: absolute; display: flex; gap: 6px; align-items: center; border: 1px solid #487080; background: #091b28;
  padding: 8px 11px; border-radius: 7px; font-size: 12px; font-weight: 800; box-shadow: 0 15px 35px #0008;
}
.home-orbit b { color: var(--h-cyan); }
.home-orbit-1 { left: -48px; top: 17%; }
.home-orbit-2 { left: -12px; bottom: 7%; }
.home-orbit-3 { right: -8px; bottom: 17%; }
.home-hero-bottom { position: relative; z-index: 1; border-top: 1px solid #2b5462; background: #06121e9c; }
.home-hero-bottom .container { display: flex; align-items: center; gap: 28px; min-height: 56px; font-size: 12px; color: #a9c1cb; flex-wrap: wrap; }
.home-hero-bottom strong { color: #e8f8fa; }
.home-hero-bottom a { color: var(--h-cyan); font-weight: 800; margin-left: auto; }

/* ---------- блоки: полосы во всю ширину ---------- */
.home-blocks > .blk { padding: calc(var(--sec) + 8px) var(--h-gutter); }
.home-blocks > .blk-tone-alt { background: #08121f; border-block: 1px solid var(--h-line); }
.home-blocks > .blk-brief { padding-top: 80px; padding-bottom: 10px; }
.home-blocks > .blk-situations { padding-top: calc(var(--sec) + 8px); padding-bottom: calc(var(--sec) + 8px); }
.home-blocks > .blk-tools { padding-top: calc(var(--sec) + 8px); padding-bottom: calc(var(--sec) + 8px); }
.home-blocks > .blk-trust { padding-top: 30px; }

.home-blocks .section-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 410px); gap: 15px 35px; align-items: end; margin: 0 0 28px; }
.home-blocks .section-eyebrow, .home-brief .section-eyebrow {
  grid-column: 1 / -1; display: flex; align-items: center; gap: 12px; margin: 0; padding: 0; background: none; border: 0; border-radius: 0;
  font: 700 12px/1.3 var(--font-mono); letter-spacing: .13em; text-transform: uppercase; color: var(--h-cyan);
}
.home-blocks .section-eyebrow::before { content: ""; height: 1px; width: 30px; background: var(--h-cyan); }
.home-blocks .section-head h2 { font-size: var(--fs-h2); line-height: 1.1; letter-spacing: var(--ls-tight); margin: 0; }
.home-blocks .section-head:not(:has(.section-sub)) h2 { grid-column: 1 / -1; }
.home-blocks .section-sub { color: var(--h-muted); margin: 0; font-size: 16px; max-width: 410px; }
.home-more { display: inline-block; margin-top: 26px; color: var(--h-cyan); font-size: 13px; font-weight: 850; }
.home-more:hover { color: var(--text); }
/* мелкие надписи внутри блоков — без черты слева */
.home-blocks .proof .section-eyebrow::before, .home-blocks .research-side .section-eyebrow::before,
.home-blocks .terms .section-eyebrow::before, .home-blocks .feed-posts .section-eyebrow::before { display: none; }

/* коротко */
.home-brief .brief-text { font-size: clamp(21px, 2.1vw, 28px); line-height: 1.45; letter-spacing: -.02em; color: #d8e9f0; max-width: 980px; margin: 16px 0 30px; }
.home-brief .brief-text strong { color: var(--text); }
.facts-line { display: flex; flex-wrap: wrap; border-top: 1px solid var(--h-line); }
.facts-line > div { padding: 18px 34px 0 0; margin-right: 34px; border-right: 1px solid var(--h-line); font-size: 13px; }
.facts-line > div:last-child { border-right: 0; }
.facts-line dt { color: var(--h-muted); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 4px; }
.facts-line dd { margin: 0; color: #e6f5f9; }
.facts-line a { color: var(--h-cyan); }

/* ситуации */
.situations { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.situation { display: flex; flex-direction: column; min-height: 210px; padding: 23px; background: #0a1725; border: 1px solid var(--h-line); border-radius: var(--r-md); color: var(--text); transition: border-color var(--t), background var(--t); }
a.situation:hover { border-color: var(--h-cyan); background: #0d2131; color: var(--text); }
.situation b { font-size: 18px; line-height: 1.25; letter-spacing: -.025em; }
.situation p { font-size: 13px; color: var(--h-muted); margin: 12px 0 15px; }
.situation span { margin-top: auto; color: var(--h-cyan); font-size: 12px; font-weight: 900; }

/* направления (и на «Обо мне») */
.paths { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; }
.path { background: #0d1d2b; border: 1px solid #2c4859; border-radius: 12px; padding: 28px; min-height: 345px; display: flex; flex-direction: column; }
.path:nth-child(2) { background: #10212e; }
.path:nth-child(3) { background: linear-gradient(145deg, #102338, #0a2631); }
.path-id { font: 700 12px var(--font-mono); letter-spacing: .1em; color: var(--h-cyan); }
.path h3 { font-size: 36px; line-height: 1; letter-spacing: -.06em; margin: 40px 0 14px; font-weight: 800; }
.path p { color: #aabfcd; font-size: 14px; margin: 0 0 14px; }
.path ul { padding-left: 18px; color: var(--h-text2); font-size: 13px; margin: 0 0 24px; }
.path li { margin: 5px 0; }
.path-go { margin-top: auto; color: var(--h-cyan); font-size: 13px; font-weight: 850; }
.tpl-about .paths { margin-top: var(--s-sm); }

/* метод */
.method-wide { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: center; }
.method-lead { color: var(--h-muted); font-size: 16px; max-width: 520px; margin: 0; }
.method-steps { list-style: none; padding: 0; margin: 34px 0 0; counter-reset: ms; }
.method-steps li { counter-increment: ms; padding: 16px 0; border-top: 1px solid var(--h-line); display: grid; grid-template-columns: 44px 1fr; font-size: 15px; color: var(--h-text2); }
.method-steps li::before { content: "0" counter(ms); font: 700 12px var(--font-mono); color: var(--h-cyan); padding-top: 3px; }
.method-more { display: inline-block; margin-top: 26px; color: var(--h-cyan); font-size: 13px; font-weight: 850; }
.method-vis svg { width: 100%; height: auto; display: block; }
.method-example { margin: 26px 0 0; display: flex; gap: 22px; align-items: baseline; }
.method-example b { font-size: 48px; letter-spacing: -.07em; color: var(--h-lime); white-space: nowrap; line-height: 1; }
.method-example span { color: var(--h-muted); font-size: 14px; }
.method-example a { color: var(--h-cyan); font-weight: 800; }

/* кейсы */
.proof { display: grid; grid-template-columns: 1.1fr .9fr; gap: 16px; }
.proof-main, .proof-side { border: 1px solid var(--h-line); border-radius: 12px; padding: 30px; background: #0e2030; }
.proof-big { font-size: clamp(54px, 8vw, 105px); font-weight: 950; letter-spacing: -.09em; color: var(--h-cyan); line-height: 1; margin-top: 14px; }
.proof-main h3 { font-size: 27px; letter-spacing: -.04em; margin: 20px 0 8px; }
.proof-main p, .proof-side p { color: var(--h-muted); font-size: 14px; }
.proof-main a { color: var(--h-cyan); font-weight: 800; font-size: 13px; }
.proof-side { display: grid; align-content: space-between; gap: 20px; }
.proof-side strong { display: block; font-size: 24px; letter-spacing: -.04em; margin: 10px 0; }
.proof-metric { display: flex; gap: 10px; border-top: 1px solid var(--h-line); padding-top: 15px; }
.proof-metric b { font-size: 29px; color: var(--h-lime); }
.proof-metric span { font-size: 12px; color: var(--h-muted); max-width: 180px; }
.case-rows { margin-top: 16px; border-top: 1px solid var(--h-line); }
.case-row { display: grid; grid-template-columns: 160px 1fr auto; gap: 30px; align-items: baseline; padding: 22px 0; border-bottom: 1px solid var(--h-line); }
.case-row > b { font-size: 34px; letter-spacing: -.06em; color: var(--h-cyan); line-height: 1; }
.case-row strong { display: block; font-size: 18px; letter-spacing: -.025em; }
.case-row span { color: var(--h-muted); font-size: 13px; }
.case-row a { color: var(--h-cyan); font-size: 13px; font-weight: 850; white-space: nowrap; }

/* исследования */
.research-feature { display: grid; grid-template-columns: 1.25fr .75fr; gap: 70px; align-items: start; }
.live { display: inline-flex; align-items: center; gap: 8px; font: 700 12px var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--h-lime); }
.live i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; box-shadow: 0 0 10px currentColor; }
.live-planned { color: var(--h-amber); }
.live-done { color: var(--h-cyan); }
.research-feature h3 { font-size: 30px; letter-spacing: -.045em; line-height: 1.12; margin: 14px 0 12px; }
.research-feature p { color: var(--h-soft); font-size: 15px; max-width: 620px; }
.research-feature .spark { width: 100%; height: 90px; margin: 18px 0 0; display: block; }
.research-side { border-left: 1px solid var(--h-line); padding-left: 34px; }
.research-side h3 { font-size: 22px; }
.research-side ul { list-style: none; padding: 0; margin: 0; }
.research-side li { padding: 12px 0; border-top: 1px solid var(--h-line); font-size: 14px; color: var(--h-text2); }
.research-side li b { display: block; color: var(--h-cyan); font-size: 20px; letter-spacing: -.03em; }

/* как работаю */
.flow { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--h-line); counter-reset: fl; }
.flow li { counter-increment: fl; padding: 26px 28px 0 0; }
.flow li::before { content: "0" counter(fl); display: block; font: 700 12px var(--font-mono); color: var(--h-cyan); margin-bottom: 24px; }
.flow b { display: block; font-size: 21px; letter-spacing: -.035em; margin-bottom: 8px; }
.flow p { font-size: 14px; color: var(--h-muted); margin: 0; }
.terms { display: grid; grid-template-columns: 1fr 1fr .9fr; gap: 60px; margin-top: 80px; }
.terms h3 { font-size: 22px; letter-spacing: -.035em; margin: 12px 0 14px; }
.terms ul { list-style: none; padding: 0; margin: 0; }
.terms li { padding: 11px 0; border-top: 1px solid var(--h-line); font-size: 14px; color: var(--h-text2); }
.terms-no li { color: #aabfcd; }
.terms .price { font-size: clamp(44px, 4.5vw, 64px); font-weight: 950; letter-spacing: -.07em; color: var(--h-lime); line-height: 1; margin: 12px 0 16px; }
.terms-price p { color: var(--h-muted); font-size: 14px; }

/* вопросы и ответы */
.answers { display: grid; grid-template-columns: 300px 1fr; gap: 55px; }
.answers-note { position: sticky; top: calc(var(--header-h) + 30px); align-self: start; }
.answers-note .section-head { display: block; margin: 0; }
.answers-note .section-head h2 { font-size: var(--fs-h2); line-height: 1.1; margin: 13px 0; }
.answers-note .section-sub { font-size: 14px; }
.answers-aside { font: 700 12px/1.7 var(--font-mono); letter-spacing: .07em; text-transform: uppercase; color: #63bfca; border-top: 1px solid #38606b; padding-top: 15px; margin-top: 26px; }
.answer-row { padding: 26px 0; border-top: 1px solid var(--h-line); display: grid; grid-template-columns: 1fr 1.05fr; gap: 30px; }
.answer-row:last-child { border-bottom: 1px solid var(--h-line); }
.answer-row h3 { font-size: 21px; line-height: 1.25; letter-spacing: -.035em; margin: 0; }
.answer-row p { margin: 0; color: var(--h-soft); font-size: 14px; }
.answer-row a { display: inline-block; margin-top: 9px; color: var(--h-cyan); font-size: 12px; font-weight: 800; }
.answer-tag { display: inline-block; font: 700 12px var(--font-mono); color: #b8f1f5; border: 1px solid #366271; border-radius: 100px; padding: 5px 8px; margin-bottom: 9px; }

/* инструменты: сетка 2×2, карточки как в прототипе */
.blk-tools .grid-cards { grid-template-columns: repeat(2, 1fr); gap: 14px; }
.blk-tools .tool-card { padding: 30px; min-height: 210px; background: var(--h-panel); border: 1px solid var(--h-line); border-radius: var(--r-md); }
.blk-tools .tool-card .chip { background: none; border: 0; padding: 0; font: 700 12px var(--font-mono); color: var(--h-cyan); text-transform: uppercase; letter-spacing: .08em; }
.blk-tools .card-title { font-size: 22px; margin-top: 14px; }
.blk-tools .card-text { color: var(--h-muted); font-size: 13px; }
.tool-status { font-size: 12px; font-weight: 800; color: var(--h-amber); margin-left: 6px; letter-spacing: 0; }

/* доверие */
.blk-trust .trust-list { border-top: 1px dashed #5f7f8f; padding-top: 20px; }

/* канал и свежее */
.feed { display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; align-items: start; }
.feed-num { font-size: clamp(64px, 7vw, 96px); font-weight: 950; letter-spacing: -.08em; color: var(--h-cyan); line-height: 1; margin: 18px 0 4px; }
.feed-label { color: var(--h-muted); }
.feed-channel h3 { font-size: 26px; letter-spacing: -.04em; margin: 18px 0 8px; }
.feed-channel p { color: var(--h-muted); font-size: 15px; margin-bottom: 14px; }
.feed-posts .section-eyebrow { margin-bottom: 22px; }
.feed-posts > a:not(.home-more) { display: grid; grid-template-columns: 120px 1fr; gap: 24px; padding: 22px 0; border-top: 1px solid var(--h-line); color: var(--text); }
.feed-posts > a:not(.home-more):last-of-type { border-bottom: 1px solid var(--h-line); }
.feed-posts > a:hover b { color: var(--h-cyan); }
.feed-posts small { font: 700 12px var(--font-mono); color: var(--h-muted); letter-spacing: .08em; text-transform: uppercase; padding-top: 4px; }
.feed-posts b { display: block; font-size: 19px; letter-spacing: -.025em; line-height: 1.3; }
.feed-posts span { font-size: 13px; color: var(--h-muted); }

/* контакт */
.home-blocks > .blk-contact { padding-top: 85px; padding-bottom: 85px; background: linear-gradient(120deg, #0d3b4c, #0c1a37); border-top: 1px solid #267086; }
.contact-band { display: flex; align-items: center; justify-content: space-between; gap: 35px; }
.contact-band h2 { font-size: clamp(37px, 4.5vw, 62px); letter-spacing: -.06em; line-height: 1.05; max-width: 730px; margin: 10px 0 15px; }
.contact-band .section-sub { color: #c8dce5; max-width: 620px; }
.contact-alt { display: flex; gap: 22px; margin-top: 14px; font-size: 13px; }
.contact-alt a { color: #c8dce5; border-bottom: 1px solid #4d8fa3; }
.contact-alt a:hover { color: var(--text); }
/* справа: большая кнопка Telegram и под ней короткая форма */
.contact-side { flex: 0 1 400px; display: flex; flex-direction: column; gap: 14px; }
.contact-tg { width: 100%; min-height: 64px; font-size: 1.08rem; }
.contact-or { text-align: center; color: #c8dce5; font-size: 13px; margin: 2px 0 -2px; }
.lead-form-compact { background: #07192a99; border-color: #2f6378; padding: 20px; gap: 12px; border-radius: 14px; }
.lead-form-compact label { font-size: .82rem; }
.lead-form-compact .consent { font-size: .76rem; }
.lead-form-compact .btn { align-self: stretch; }

/* ---------- адаптив ---------- */
@media (max-width: 1100px) {
  .method-wide, .research-feature, .feed { gap: 40px; }
  .terms { gap: 34px; }
}
@media (max-width: 1000px) {
  .home-hero-in { grid-template-columns: 1fr 300px; gap: 15px; }
  .home-portrait { width: 280px; }
  .situations { grid-template-columns: repeat(2, 1fr); }
  .answers { grid-template-columns: 230px 1fr; gap: 25px; }
}
@media (max-width: 760px) {
  .home-hero-in { grid-template-columns: 1fr; padding-top: 40px; padding-bottom: 42px; }
  .home-hero-visual { display: none; }
  .home-hero h1 { font-size: clamp(40px, 10vw, 62px); }
  .home-lead { font-size: 16px; }
  .home-hero-bottom .container { gap: 8px 18px; padding-block: 14px; }
  .home-hero-bottom a { margin-left: 0; }
  .home-blocks > .blk { padding-top: 60px; padding-bottom: 60px; }
  .home-blocks > .blk-brief { padding-top: 48px; padding-bottom: 0; }
  .home-blocks .section-head { display: block; }
  .home-blocks .section-head h2 { margin-top: 15px; }
  .home-blocks .section-sub { margin-top: 15px; }
  .paths, .method-wide, .proof, .research-feature, .terms, .feed, .answers, .blk-tools .grid-cards { grid-template-columns: 1fr; }
  .path { min-height: 0; }
  .path h3 { margin-top: 28px; }
  .terms { margin-top: 50px; }
  .research-side { border-left: 0; padding-left: 0; }
  .flow { grid-template-columns: 1fr 1fr; }
  .flow li { padding-bottom: 22px; }
  .case-row { grid-template-columns: 1fr; gap: 6px; }
  .answers-note { position: static; }
  .answers-aside { display: none; }
  .answer-row { grid-template-columns: 1fr; gap: 10px; }
  .feed-posts > a:not(.home-more) { grid-template-columns: 1fr; gap: 6px; }
  .facts-line > div { border-right: 0; margin-right: 0; padding-right: 22px; }
  .contact-band { display: block; }
  .contact-alt { flex-direction: column; gap: 10px; }
  .contact-side { margin-top: 24px; }
}
@media (max-width: 490px) {
  .situations, .flow { grid-template-columns: 1fr; }
  .situation { min-height: 0; }
  .home-hero h1 { font-size: 40px; }
  .method-example { flex-direction: column; gap: 8px; }
}
@media (prefers-reduced-motion: reduce) { .situation { transition: none; } }

/* Консилиум, волна 2: H1 называет услугу — кегль меньше; признание в первом экране */
.home-hero h1 { font-size: clamp(38px, 3.9vw, 58px); letter-spacing: -.05em; }
.home-badge { display: inline-flex; gap: 8px; align-items: baseline; margin: -10px 0 24px; padding: 8px 14px; border: 1px solid var(--h-line); border-radius: 100px; color: var(--text-read, #cfdde8); font-size: 14px; text-decoration: none; }
.home-badge b { color: var(--h-lime, #c8f781); font-weight: 900; }
.home-badge:hover { border-color: var(--h-cyan); color: var(--text); }
@media (max-width: 900px) { .home-hero h1 { font-size: clamp(34px, 8.5vw, 48px); } }