/* Внутренние страницы N'KORA — «Консультации» (consultations.html) и «Обо мне» (about-me.html).
   🗣 Е.Г. 31.10: «страницу консультаций сделать в таком же стиле… взять данные со старого
   сайта»; «так же ОБО МНЕ отдельную страницу». План — DOCS/PLANS/plan_2026-10-31_nkora-konsultacii.md.
   Общий вид (шапка, разделители, плашки, шрифты) — из style.css; здесь только своё.
   Правишь файл — обнови `?v=` у ссылки на него в ОБЕИХ страницах (первые 8 знаков sha1sum). */

/* ── Заголовок страницы и вступление («Консультации») ─────────────────────────── */
.page-head{text-align:center;padding:48px 0 8px}
.page-head h1{font-size:60px;line-height:1;margin:0 0 28px}
.page-intro{max-width:760px;margin:0 auto}
.page-intro p,.page-text p{text-align:justify;hyphens:manual;font-size:16px;line-height:1.6}
/* «Читать подробнее» — кнопка ПОД текстом: раскрыто — «Свернуть». Золотая стрелка вниз / вверх
   (🗣 Е.Г. 31.10: «стрелочку, чтобы было понятно, что можно развернуть, и свернуть»).
   Плавность — expand.js. */

/* ── Карточки консультаций — вид «Почему мне доверяют» (золотая кайма, тёмная заливка) ── */
.kons-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;padding-bottom:48px}
.kons-card{display:flex;flex-direction:column;align-items:center;text-align:center;border:1px solid #765528;border-radius:20px;padding:24px 32px 32px;background:linear-gradient(145deg,#13091888,#030204)}
/* Картинок у карточек нет: старые орнаменты сняты (🗣 Е.Г. 31.10: «убирай эти иконки старые»). */
.kons-card h3{font-size:26px;color:var(--lilac);margin:4px 0 6px}
.kons-accent{font:18px/1.3 var(--font-title);color:var(--gold);margin:0 0 16px}
.kons-list,.kons-notes ul{list-style:none;padding:0;margin:0 0 16px;text-align:left;width:100%}
.kons-list li,.kons-notes li{position:relative;padding-left:18px;margin-bottom:8px;font-size:16px;line-height:1.5;text-align:justify;hyphens:manual}
/* Маркер — мельчайший ромб разделителей (тот же рисунок `--rule-diamond` из style.css). */
.kons-list li::before,.kons-notes li::before{content:'';position:absolute;left:2px;top:.62em;width:6px;height:6px;background:var(--rule-diamond) center/contain no-repeat;filter:var(--rule-glow)}
.kons-notes{width:100%;text-align:left;border-top:1px solid #74502d66;padding-top:16px;margin-bottom:24px}
.kons-notes p{font-size:14px;line-height:1.5;margin:0 0 8px;color:#a99cb5;text-align:justify;hyphens:manual}
.kons-notes li{font-size:14px;color:#a99cb5}
/* Две стороны карточки, как на старом сайте: лицо — описание, оборот — формат, заметки, цена.
   Переключает «Подробнее» / «Описание» (kons.js). Цены — заглушки «0 €», как на старом
   (🗣 Е.Г. 31.10: «пока заглушки так же все 0 евро»). */
.kons-face,.kons-back{width:100%}
.kons-back .kons-notes{border-top:0;padding-top:0}
.kons-price{font:22px var(--font-title);color:var(--gold);text-align:center;margin:8px 0 16px;font-variant-numeric:lining-nums;text-shadow:0 0 6px #e8c48a40}
/* Низ карточки — две кнопки рядом: «Подробнее» и «Записаться» (🗣 31.10). Обычная плашка игры
   (`plate.webp`, 4 : 1) 190 × 48 — две длинные 330 в карточку не встают. Всё свободное место
   карточки — над ними, поэтому кнопки в ряду карточек на одной высоте. */
.kons-foot{margin-top:auto;display:flex;justify-content:center;gap:16px;flex-wrap:wrap}
.kons-foot .ornate{width:190px;height:48px;padding:0 16px;background-image:url('assets/plate.webp?v=5311dd27')}

/* ── «Обо мне»: первый экран — фото слева (из файла), имя и регалии справа ─────── */
.me-hero{position:relative;min-height:590px;display:flex;align-items:center;background:url('assets/about-hero.webp?v=b7b97241') center/auto 100% no-repeat}
.me-hero-grid{display:grid;grid-template-columns:1fr 1fr;width:min(100% - 48px,1040px)}
.me-hero-copy{grid-column:2;max-width:440px;justify-self:center;text-align:center;position:relative;z-index:1}
.me-hero-copy h1{font-size:48px;line-height:1.05;margin:0 0 20px}
.me-hero-copy p{font-size:16px;line-height:1.5;margin:0 0 24px}
.me-qr{width:120px;height:auto;margin:0 auto;opacity:.92}
/* Края фото растворяются в фон страницы — тот же приём, что у картин главной. */
@media(min-width:651px){.me-hero::after{content:'';position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);height:100%;aspect-ratio:1920/590;pointer-events:none;background:linear-gradient(90deg,#030204,#03020400 14%,#03020400 86%,#030204)}}

.page-text{max-width:760px}

/* ── «Опыт работы» — как на старом сайте: одна плашка, внутри лента (🗣 Е.Г. 31.10: «одна
   плашка и всё так же вертикально, только шрифты новые и цвет»). Слева период золотом,
   посередине вертикальная черта с точкой у каждой строки, справа должность и пояснение.
   Черту рисует каждая строка своим `::before` — строки стоят вплотную, отрезки сливаются. */
.career{--when:240px;--gap:64px;padding:40px 48px;margin-bottom:48px;border:1px solid #765528;border-radius:20px;background:linear-gradient(145deg,#13091888,#030204)}
.career-item{position:relative;display:grid;grid-template-columns:var(--when) 1fr;column-gap:var(--gap);padding-bottom:32px}
.career-item:last-child{padding-bottom:0}
.career-item::before{content:'';position:absolute;left:calc(var(--when) + var(--gap) / 2);top:0;bottom:0;width:1px;background:#765528}
.career-item:first-child::before{top:12px}
.career-item::after{content:'';position:absolute;left:calc(var(--when) + var(--gap) / 2 - 4px);top:8px;width:9px;height:9px;border-radius:50%;background:var(--gold);box-shadow:0 0 8px #e8c48a99}
/* Вспышка бежит по точкам сверху вниз, по кругу (🗣 Е.Г. 31.10: «моргающая точка по порядку
   сверху вниз нужна»). Круг — 7 строк × 0.8 с; вспышка занимает первую седьмую круга,
   каждая следующая точка опаздывает на 0.8 с. Строк станет больше — поправить 5.6s и 14%. */
.career-item::after{animation:career-blink 5.6s infinite;animation-delay:calc(var(--i,0) * .8s)}
.career-item:nth-child(2){--i:1}.career-item:nth-child(3){--i:2}.career-item:nth-child(4){--i:3}
.career-item:nth-child(5){--i:4}.career-item:nth-child(6){--i:5}.career-item:nth-child(7){--i:6}
@keyframes career-blink{0%,14%,100%{transform:scale(1);background:var(--gold);box-shadow:0 0 8px #e8c48a99}7%{transform:scale(1.6);background:#fff4dc;box-shadow:0 0 14px 4px #f1dbabcc}}
@media(prefers-reduced-motion:reduce){.career-item::after{animation:none}}
.career-when{grid-column:1;grid-row:1 / span 9;font:20px/1.3 var(--font-title);color:var(--gold);margin:0;font-variant-numeric:lining-nums;text-shadow:0 0 6px #e8c48a40}
.career-item h3{grid-column:2;font-size:20px;color:var(--lilac);text-transform:none;margin:0 0 8px;line-height:1.3}
.career-item p:not(.career-when){grid-column:2;font-size:15px;line-height:1.5;margin:0 0 6px;text-align:justify;hyphens:manual}

/* Фон страницы «Консультации» — картина итога «Твой путь» из игры (`summary_bg.webp`),
   повторённая по высоте, как в игре (🗣 Е.Г. 31.10: «по бокам сделать фоновый рисунок у нас
   есть в игре который вертикально размножен»). Ширина по окну, высота — по пропорции. */
.page-bg{background:#030204 url('assets/page-bg.webp?v=686a6fd3') center top/100% auto repeat-y}

/* Фон страниц «Обо мне» и «Контакты» — картины фонов игры, по одной на страницу, НЕ повторяются
   (🗣 Е.Г. 31.10: «фоны какие-то из игры не повторяющиеся брось на фон на эти страницы»).
   Выбраны с тёмной серединой и узором по краям — текст по центру читается: «Обо мне» — фон
   точки отправления (`departure_field`), «Контакты» — фон зоны (`zone_field`).
   🔴 Слоем `position:fixed` во весь экран, а не `background-attachment:fixed` у `body`: второе
   телефоны Apple не поддерживают, картина растягивалась бы на всю длину страницы. Слой стоит на
   месте, страница едет поверх. */
.page-art{background:#030204}
.page-art::before{content:'';position:fixed;inset:0;z-index:-1;background:center/cover no-repeat;pointer-events:none}
.page-art-about::before{background-image:url('assets/bg-about.webp?v=4a293fc2')}
/* Подложка подвала на этих страницах — от середины вверх уходит в прозрачность до нуля
   (🗣 Е.Г. 31.10): резкая верхняя полоса дыма резала картину фона. Маска гасит весь блок, но
   логотип стоит в нижней половине — он не тускнеет. */
.page-art .ending,.page-bg .ending,.page-daily .ending{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 50%);mask-image:linear-gradient(to bottom,transparent,#000 50%)}
/* `.page-bg` — «Консультации» (🗣 01.11: «в „Контактах“ и других местах сделали, а в
   „Консультациях“ нет — сделай»); `.page-daily` — «Карта дня» (🗣 «и тут футер тоже так же»). */
.page-art-contacts::before{background-image:url('assets/bg-contacts.webp?v=446a03b4')}
/* «Карта дня» — свечи, аметист, сухоцветы (🗣 Е.Г. 01.11: «это для фона карты дня»). */
.page-art-daily::before{background-image:url('assets/bg-daily.webp?v=ceac58f6');filter:brightness(.9) contrast(1.05)}

/* ── «Контакты» (31.10) ─────────────────────────────────────────────────────────────
   Как первый экран «Обо мне», зеркально: фото старой страницы (Наталья справа от середины,
   3462×1169) во всю высоту блока, данные — в левой колонке. Края картины уходят в чёрное
   той же полосой, что у остальных во всю ширину. Подписи — золотом заглавными, как
   подзаголовки разделов; ссылки — с прежними значками Telegram и Instagram. */
.ct-hero{position:relative;min-height:560px;display:flex;align-items:center;background:url('assets/img/contacty-hero.webp?v=9c40bb0d') center/auto 100% no-repeat}
/* Колонка — той же ширины и по центру, что форма ниже (`.ct-form-wrap`, 760): левый край
   контактов стоит в столбик с левым краем формы (🗣 Е.Г. 31.10: «контакты слева слишком —
   сделай в столбик с формой»). */
.ct-hero-grid{width:min(100% - 48px,760px);margin:0 auto}
.ct-copy{max-width:420px;position:relative;z-index:1}
.ct-copy h1{font-size:48px;line-height:1.05;margin:0 0 28px}
.ct-label{font:13px var(--font-body);letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin:0 0 10px}
.ct-list,.ct-links{list-style:none;margin:0 0 26px;padding:0}
.ct-list li{font-size:16px;line-height:1.7}
.ct-links li{margin:0 0 10px}
.ct-links a{display:inline-flex;align-items:center;gap:12px;font-size:16px;transition:color .2s}
.ct-links a:hover{color:#f1dbab}
.ct-links img{width:26px;height:26px;border-radius:50%}
.ct-mail{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1px solid var(--line);color:var(--gold);font-size:13px}
@media(min-width:651px){.ct-hero::after{content:'';position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);height:100%;aspect-ratio:3462/1169;pointer-events:none;background:linear-gradient(90deg,#030204,#03020400 14%,#03020400 86%,#030204)}}

/* Форма — в рамке карточек сайта; поля — тёмные, с золотой нитью при фокусе. */
.ct-form-wrap{max-width:760px;padding-bottom:48px}
.ct-form{border:1px solid #765528;border-radius:20px;padding:32px 40px;background:linear-gradient(145deg,#13091888,#030204);display:grid;gap:18px}
.ct-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.ct-field{display:grid;gap:6px;font-size:14px;color:var(--lilac)}
.ct-field input,.ct-field textarea{font:16px var(--font-body);color:var(--body);background:#0b0510cc;border:1px solid #4a3a52;border-radius:12px;padding:12px 14px;width:100%;resize:vertical}
.ct-field input:focus,.ct-field textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 1px #d3aa6155}
.ct-consent{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.4}
.ct-consent input{width:18px;height:18px;margin:1px 0 0;accent-color:var(--gold);flex:none}
.ct-consent a{color:var(--gold);text-decoration:underline;text-underline-offset:3px}
.ct-status{min-height:1.4em;margin:0;font-size:14px;color:#e8a3a3}
.ct-status.ct-ok{color:#bfe3b0}
.ct-form .ornate{justify-self:center}
.ct-form .ornate:disabled{filter:grayscale(.6);cursor:wait}
/* Ловушка для программ — вне экрана, не `display:none`: часть рассыльщиков такие поля пропускает. */
.ct-trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ── Телефон ───────────────────────────────────────────────────────────────────── */
@media(max-width:650px){
.page-head h1{font-size:40px}
.kons-grid{grid-template-columns:1fr;gap:22px}
.kons-card{padding:20px 20px 28px}
.me-hero{min-height:0;display:block;background-size:auto 300px;background-position:30% top;padding-top:290px}
.me-hero-grid{display:block}
.me-hero-copy{max-width:100%}
.me-hero-copy h1{font-size:32px}
.career{padding:24px 18px}
.career-item{grid-template-columns:1fr;padding-left:28px}
.career-item::before{left:4px}
.career-item::after{left:0;top:6px}
.career-when{grid-row:auto;margin-bottom:4px}
.career-item h3,.career-item p:not(.career-when){grid-column:1}
.ct-hero{min-height:0;display:block;background-size:auto 280px;background-position:62% top;padding-top:270px}
.ct-hero-grid{display:block}
.ct-copy{max-width:100%}
.ct-copy h1{font-size:36px}
.ct-form{padding:22px 18px}
.ct-row{grid-template-columns:1fr}
}

/* Цена — всегда в одном месте: внизу оборота, прямо над кнопками (🗣 Е.Г. 01.11: «стоимость
   везде в одном месте снизу над кнопками»). Оборот тянется до кнопок, цена прижата к его низу.
   `:not([hidden])` — иначе `display:flex` открыл бы скрытый оборот. */
.kons-back:not([hidden]){flex:1;display:flex;flex-direction:column}
.kons-back .kons-price{margin:auto 0 16px}

/* ═══ Карта дня (`daily-card.html`, план игры `plan_2026-11-01_daily-card.md`) ═══════════════════
   Вид принят по образцу 01.11 (🗣 «да, всё нравится»): карта посередине без кнопки; наведение —
   подъём и свет; нажатие — переворот, карта уезжает влево, справа текст; на телефоне текст под
   картой. Приставка `dc-` — класс `.daily` занят фоном главной. */
.page-daily .divider{margin:14px auto 22px}
@media(min-width:651px){.page-daily main{display:flex;flex-direction:column;min-height:calc(100svh - 80px)}.page-daily main>*{width:100%}.page-daily .ending{margin-top:auto}}
.page-daily .ending{width:100vw;margin-inline:calc(50% - 50vw)}
.dc{max-width:960px;margin:0 auto;padding:0 0 24px;text-align:center}
.dc h1{font-size:44px;margin:0 0 4px}
.dc-lead{font:19px var(--font-title);color:var(--lilac);margin:0 0 20px}
.dc [hidden]{display:none!important}
.dc-play{--card:340px;--gap:56px;position:relative;display:grid;grid-template-columns:var(--card) 1fr;gap:var(--gap);align-items:center;width:min(960px,100%);margin:0 auto}
.dc-move{--shift:calc((min(960px,100vw - 48px) - var(--card)) / 2);transform:translateX(var(--shift));transition:transform 1s cubic-bezier(.22,1,.36,1)}
.dc-play.open .dc-move{transform:none}
.dc-stage{perspective:1400px;width:var(--card);aspect-ratio:2/3}
.dc-card{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.22,1,.36,1),scale .35s ease;border-radius:18px;outline:none}
.dc-play:is(.can,.again) .dc-card{cursor:pointer}
.dc-play.can .dc-card:is(:hover,:focus-visible){scale:1.05}
.dc-play.can .dc-card:is(:hover,:focus-visible) .dc-back{box-shadow:0 0 0 1px #f1dbab,0 26px 60px #000d,0 0 34px #f2cf6380,0 0 80px #c08cff55}
.dc-play.open .dc-card{transform:rotateY(180deg)}
.dc-side{position:absolute;inset:0;border-radius:18px;overflow:hidden;backface-visibility:hidden;box-shadow:0 0 0 1px #c9a24a88,0 18px 50px #000c,0 0 40px #7c3e6844;transition:box-shadow .35s ease;background:#140a1c}
.dc-side img{width:100%;height:100%;object-fit:cover;display:block}
.dc-back img{filter:brightness(.91) contrast(1.05)}
.dc-face{transform:rotateY(180deg)}
.dc-title{position:absolute;left:0;right:0;top:0;padding:26px 22px 60px;font:24px/1.1 var(--font-title);text-transform:uppercase;color:#f6e3b8;text-shadow:0 2px 6px #000,0 0 18px #000c;background:linear-gradient(#000a,transparent)}
.dc-title.bottom{top:auto;bottom:0;padding:60px 22px 26px;background:linear-gradient(transparent,#000a)}
.dc-broken{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;font-size:15px;color:#c7bdca}
.dc-text{text-align:left;opacity:0;transform:translateX(30px);transition:opacity .7s .6s,transform .7s .6s}
.dc-play.open .dc-text{opacity:1;transform:none}
.dc-sub{font:24px var(--font-title);color:var(--gold);text-transform:uppercase;letter-spacing:1px;margin:0 0 14px;outline:none}
.dc-body{font-size:17px;line-height:1.6;margin:0 0 22px;text-align:justify;hyphens:manual}
.dc-practice{border:1px solid #765528;border-radius:16px;padding:16px 20px;background:linear-gradient(145deg,#13091888,#030204)}
.dc-practice b{display:block;font:16px var(--font-title);letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin-bottom:6px}
.dc-next{margin-top:22px;font-size:14px;color:#9c89a8}
.dc-note{max-width:560px;margin:26px auto 0;font-size:16px}
.dc-note .ornate{margin:18px auto 0}
@media(max-width:900px){.dc-play{--card:min(340px,86vw);grid-template-columns:1fr;justify-items:center;gap:30px}.dc-move{transform:none}.dc-text{transform:translateY(14px);max-width:560px}.dc-play.open .dc-text{transform:none}}
@media(max-width:650px){.dc h1{font-size:34px}.dc-title{font-size:20px;padding:20px 16px 50px}.dc-title.bottom{padding:50px 16px 20px}.dc-sub{font-size:20px}.dc-body{font-size:16px}}
.dc-play.still :is(.dc-move,.dc-card,.dc-text){transition:none}
@media(prefers-reduced-motion:reduce){.dc-move,.dc-card,.dc-text,.dc-side{transition:none}}