/* Шрифт Oswald хранится на сайте (assets/fonts), без обращения к Google. Лицензия SIL Open Font License 1.1 */
@font-face { font-family: 'Oswald'; font-style: normal; font-weight: 200 400; font-display: swap;
  src: url('fonts/oswald-cyrillic-ext.woff2') format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: 'Oswald'; font-style: normal; font-weight: 200 400; font-display: swap;
  src: url('fonts/oswald-cyrillic.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Oswald'; font-style: normal; font-weight: 200 400; font-display: swap;
  src: url('fonts/oswald-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Oswald'; font-style: normal; font-weight: 200 400; font-display: swap;
  src: url('fonts/oswald-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* Токены из брендбука, раздел 12 */
:root {
  --ivory: #F4EFE7; --latte: #E3D7C6;
  --chestnut: #4A3C37; --night: #241F1D; --photo-dark: #1A1615;
  --chocolate: #3A2E2A; /* первый экран: между каштаном и почти-чёрным */
  --ink: #2A2523; --ink-2: #6E675F;
  --taupe: #8A7F72; --numeral: #C6BBAC;
  --on-dark: #F4EFE7; --on-dark-2: rgba(244,239,231,.78);
  --on-dark-3: rgba(244,239,231,.6);
  --red: #8A1338; --red-hover: #6F0F2D; --red-press: #5A0C25;
  --red-on-dark: #E0596B; --red-deco-dark: #C4394F;
  --highlight: rgba(230,208,74,.72); --highlight-dark: rgba(230,208,74,.42);
  --line: #E3D7C6; --line-dark: rgba(244,239,231,.32);
  --font-display: 'Oswald', 'Arial Narrow', Arial, sans-serif;
  --font-body: Arial, Helvetica, sans-serif;
  --fs-display: clamp(42px, 7.2vw, 104px);
  --fs-h2: clamp(36px, 4.3vw, 62px);
  --fs-h3: clamp(22px, 2.2vw, 32px);
  --fs-lead: clamp(19px, 1.67vw, 24px);
  --fs-body: clamp(17px, 1.32vw, 19px);
  --fs-label: clamp(12px, 1vw, 14px);
  --fs-btn: 16px;
  --fs-note: 14px;
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 40px; --s-8: 56px; --s-9: 72px; --s-10: 96px; --s-11: 144px;
  --container: 1200px;
  --gutter: clamp(24px, 5.5vw, 80px);
  --section-y: clamp(72px, 10vw, 144px);
  --measure: 680px;
  --radius-pill: 999px;
  --ease: cubic-bezier(.2,.7,.2,1);
  --header-h: 80px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--ivory); color: var(--ink);
  font: 400 var(--fs-body)/1.6 var(--font-body); -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; }
h1, h2, h3 { font-family: var(--font-display); text-transform: uppercase;
  letter-spacing: 1px; margin: 0; text-wrap: balance; }
h1 { font-weight: 200; font-size: var(--fs-display); line-height: 1; }
h2 { font-weight: 200; font-size: var(--fs-h2); line-height: 1.06; }
h3 { font-weight: 300; font-size: var(--fs-h3); line-height: 1.16; }
h1 em, h2 em { font-style: normal; font-weight: 300; color: var(--red); }
.dark h1 em, .dark h2 em { color: var(--red-on-dark); }
p { max-width: var(--measure); text-wrap: pretty; margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
::selection { background: rgba(138,19,56,.18); }
a { color: var(--red); text-underline-offset: 4px; }
a:hover { color: var(--red-hover); }
section[id] { scroll-margin-top: var(--s-10); }

.container { width: 100%; max-width: calc(var(--container) + 2 * var(--gutter));
  margin: 0 auto; padding: 0 var(--gutter); }
.section { padding: var(--section-y) 0; position: relative; overflow: hidden; }
.stack { display: flex; flex-direction: column; gap: var(--s-5); }
.stack-s { display: flex; flex-direction: column; gap: var(--s-3); }
.stack-l { display: flex; flex-direction: column; gap: var(--s-7); }
.section-head { display: flex; flex-direction: column; gap: var(--s-5); max-width: 760px; }

/* Фоны секций */
.bg-ivory { background: var(--ivory); }
.bg-latte { background: var(--latte); }
.bg-night { background: var(--night); }
.bg-chestnut { background: var(--chestnut); }
.bg-red { background: var(--red); }
.dark { color: var(--on-dark); }
.dark p, .dark .muted { color: var(--on-dark-2); }
.dark .label { color: var(--on-dark-3); }

/* Текстовые стили */
.label { font: 300 var(--fs-label)/1 var(--font-display); letter-spacing: .42em;
  text-transform: uppercase; color: var(--taupe); }
.label-red { color: var(--red); }
.lead { font-size: var(--fs-lead); line-height: 1.42; }
.muted { color: var(--ink-2); }
.note { font-size: var(--fs-note); line-height: 1.5; color: var(--ink-2); }
.rule { border-left: 2px solid var(--red); padding-left: var(--s-5); }
.mark { background: linear-gradient(transparent 52%, var(--highlight) 52%,
  var(--highlight) 92%, transparent 92%); box-decoration-break: clone;
  -webkit-box-decoration-break: clone; padding: 0 2px; }

/* Кнопки */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 56px; padding: 18px 34px; border-radius: var(--radius-pill);
  border: 1px solid transparent; font: 300 var(--fs-btn)/1 var(--font-display);
  letter-spacing: 3px; text-transform: uppercase; text-decoration: none; cursor: pointer;
  transition: background .2s, color .2s, border-color .2s; align-self: flex-start; }
.btn-primary { background: var(--red); color: var(--ivory); }
.btn-primary:hover { background: var(--red-hover); color: var(--ivory); }
.btn-primary:active { background: var(--red-press); }
.btn-secondary { border-color: var(--ink); color: var(--ink); background: none; }
.btn-secondary:hover { background: var(--ink); color: var(--ivory); }
.btn-light { background: var(--ivory); color: var(--red); }
.btn-light:hover { background: var(--latte); color: var(--red); }
.btn:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.btn.is-missing { opacity: .45; cursor: not-allowed; pointer-events: none; }
.missing-note { font-size: var(--fs-note); line-height: 1.5; color: var(--ink-2); }
.dark .missing-note { color: var(--on-dark-3); }
.link-arrow { font: 300 15px/1 var(--font-display); letter-spacing: 3px;
  text-transform: uppercase; text-decoration: none; color: var(--ink); align-self: flex-start;
  border-bottom: 1px solid currentColor; padding-bottom: var(--s-1); }
.link-arrow:hover { color: var(--red); }
.dark .link-arrow { color: var(--on-dark); }
.dark .link-arrow:hover { color: var(--on-dark-2); }

.pills { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.pill { padding: 10px 18px; border-radius: var(--radius-pill); background: var(--ink); color: var(--ivory);
  font: 300 14px/1 var(--font-display); letter-spacing: 2.5px; text-transform: uppercase; }
.dark .pill { background: none; border: 1px solid var(--line-dark); color: var(--on-dark); }

/* Пометки для незаполненного (только в предварительной версии) */
.ph { display: inline; font: 400 15px/1.5 var(--font-body); letter-spacing: 0; text-transform: none;
  color: var(--ink-2); background: rgba(138,127,114,.12); padding: 1px 6px;
  outline: 1px dashed var(--taupe); outline-offset: -1px; white-space: normal; }
.dark .ph { color: var(--on-dark-2); background: rgba(244,239,231,.08); outline-color: var(--on-dark-3); }
.preview-bar { background: var(--latte); color: var(--ink-2); font: 400 12px/1.4 var(--font-body);
  padding: 6px var(--gutter); text-align: center; }
.preview-bar strong { font-weight: 400; color: var(--ink); }

/* Шапка */
.site-header { position: sticky; top: 0; z-index: 20; background: var(--ivory);
  border-bottom: 1px solid transparent; transition: border-color .2s; }
.site-header.is-scrolled { border-bottom-color: var(--line); }
.header-inner { max-width: calc(var(--container) + 2 * var(--gutter)); margin: 0 auto;
  padding: 0 var(--gutter); height: var(--header-h); display: flex; align-items: center;
  justify-content: space-between; gap: var(--s-5); }
.logo { font: 300 18px/1 var(--font-display); letter-spacing: 3px; text-transform: uppercase;
  color: var(--ink); text-decoration: none; }
.nav { display: flex; gap: var(--s-6); }
.nav a { font: 300 14px/1 var(--font-display); letter-spacing: 3px; text-transform: uppercase;
  color: var(--ink); text-decoration: none; padding: var(--s-2) 0; }
.nav a:hover { color: var(--red); }
.burger { display: none; width: 44px; height: 44px; border: 0; background: none; padding: 0;
  cursor: pointer; flex-direction: column; justify-content: center; align-items: flex-end; gap: var(--s-2); }
.burger span { display: block; width: 28px; height: 1.5px; background: var(--ink); transition: transform .2s; }

/* Hero */
.hero { padding: var(--s-9) 0 var(--s-10); }
.hero-grid { display: grid; grid-template-columns: 7fr 5fr; gap: var(--s-10); align-items: center; }
.hero-text { display: flex; flex-direction: column; gap: var(--s-7); }
.hero-photo { margin: 0; display: flex; flex-direction: column; gap: var(--s-4); }
.hero-photo .portrait { width: 100%; }
.hero-facts { display: flex; flex-wrap: wrap; gap: var(--s-5) var(--s-7); padding-top: var(--s-2); }
.hero-fact { display: flex; flex-direction: column; gap: var(--s-2); }
.hero-fact-num { font: 200 clamp(28px, 2.6vw, 38px)/1 var(--font-display); text-transform: uppercase;
  letter-spacing: 1px; color: var(--ink); }
.hero-fact-text { font: 300 12px/1 var(--font-display); text-transform: uppercase; letter-spacing: .3em; color: var(--ink-2); }
@media (min-width: 1024px) {
  .hero { min-height: min(calc(100svh - var(--header-h) - 30px), 900px); display: flex; align-items: center; padding: var(--s-8) 0; }
  .hero > .container { width: 100%; }
  .hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 460px); }
}
.portrait { aspect-ratio: 4 / 5; background: var(--latte); position: relative;
  display: flex; align-items: center; justify-content: center; text-align: center; padding: var(--s-5); }
.portrait:not(.has-photo)::after { content: ''; position: absolute; inset: var(--s-4);
  border: 1px dashed var(--taupe); }
.portrait.has-photo { padding: 0; background: none; }
.portrait img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 25%;
  filter: sepia(.13) saturate(.95); }
.portrait-ph { display: flex; flex-direction: column; gap: var(--s-2); color: var(--ink-2);
  font-size: var(--fs-note); position: relative; z-index: 1; }
.bg-chestnut .portrait { background: rgba(244,239,231,.08); }
.bg-chestnut .portrait:not(.has-photo)::after { border-color: var(--on-dark-3); }
.bg-chestnut .portrait-ph { color: var(--on-dark-3); }

/* Узнавание */
.quote-deco { position: absolute; top: -.18em; right: var(--gutter); font: 200 clamp(240px, 30vw, 420px)/1 var(--font-display);
  color: var(--red-deco-dark); opacity: .14; pointer-events: none; user-select: none; }
.bg-red .quote-deco { color: var(--ivory); }
.recognize-list { display: flex; flex-direction: column; gap: var(--s-6); max-width: 860px; }
.recognize-list li { font: 300 var(--fs-h3)/1.25 var(--font-display); text-transform: uppercase;
  letter-spacing: 1px; color: var(--on-dark); display: grid; grid-template-columns: var(--s-7) 1fr; gap: var(--s-4); }
.recognize-list li::before { content: '—'; color: var(--red-deco-dark); }

/* Программа */
.steps { display: flex; flex-direction: column; gap: var(--s-7); }
.step { display: grid; grid-template-columns: 92px 1fr; gap: var(--s-5); align-items: start; }
.step-num { font: 200 48px/1 var(--font-display); color: var(--numeral); }
.bg-latte .step-num { color: var(--taupe); }

.split { display: grid; grid-template-columns: 7fr 5fr; gap: var(--s-10); align-items: start; }
.facts { display: flex; flex-direction: column; gap: var(--s-5); }
.fact { display: flex; flex-direction: column; gap: var(--s-2); }
.fact strong { font: 300 22px/1.25 var(--font-display); text-transform: uppercase; letter-spacing: 1px; }

/* Карточки форматов */
.cards { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-6); }
.card { background: var(--latte); padding: var(--s-7); display: flex; flex-direction: column; gap: var(--s-5); }
.card p { flex: 1; }

/* Обо мне */
.about-grid { display: grid; grid-template-columns: 5fr 7fr; gap: var(--s-10); align-items: start; }
.creds { display: flex; flex-direction: column; gap: var(--s-5); margin: 0; }
.cred { display: flex; flex-direction: column; gap: var(--s-2); }
.cred dd { margin: 0; color: var(--on-dark-2); }
.cred-list { display: flex; flex-direction: column; gap: var(--s-3); max-width: var(--measure); }
.cred-list li { display: grid; grid-template-columns: var(--s-5) 1fr; }
.cred-list li::before { content: '—'; color: var(--on-dark-3); }
.num-facts { display: flex; flex-wrap: wrap; gap: var(--s-7) var(--s-8); }
.num-fact { display: flex; flex-direction: column; gap: var(--s-3); }
.num { font: 200 clamp(44px, 5vw, 72px)/.9 var(--font-display); text-transform: uppercase;
  letter-spacing: 1px; color: var(--on-dark); }
.quote { font: 300 var(--fs-h3)/1.25 var(--font-display); text-transform: uppercase;
  letter-spacing: 1px; color: var(--on-dark); max-width: 760px; }
.dark p.quote { color: var(--on-dark); }

/* Цена */
.price-box { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--s-7); }
.price { font: 200 clamp(56px, 8vw, 120px)/.9 var(--font-display); color: var(--red); letter-spacing: 1px; }
.price .ph { font-size: 17px; vertical-align: middle; }
.buy { display: flex; flex-direction: column; gap: var(--s-3); }

/* FAQ */
.faq { max-width: 860px; }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item:first-child { border-top: 1px solid var(--line); }
.faq-item summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between;
  align-items: center; gap: var(--s-5); padding: 28px 0; font: 300 clamp(19px, 1.7vw, 24px)/1.25 var(--font-display);
  text-transform: uppercase; letter-spacing: 1px; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.plus { font: 200 32px/1 var(--font-display); transition: transform .2s; flex: none; }
.faq-item[open] .plus { transform: rotate(45deg); }
.faq-a { padding: 0 0 28px; }

/* Финальный призыв */
.final { text-align: center; }
.final .container { display: flex; flex-direction: column; align-items: center; gap: var(--s-6); position: relative; }
.final h2 { color: var(--ivory); }
.final p { color: rgba(244,239,231,.86); }
.final .btn { align-self: center; }
.final .missing-note { color: rgba(244,239,231,.75); }

/* Подвал */
.site-footer { background: var(--night); color: var(--on-dark); padding: var(--s-9) 0 var(--s-7); }
.footer-inner { display: flex; flex-direction: column; gap: var(--s-8); }
.footer-top { display: flex; justify-content: space-between; gap: var(--s-6); flex-wrap: wrap; }
.site-footer .logo { color: var(--on-dark); }
.site-footer .label { color: var(--on-dark-3); letter-spacing: 6px; }
.footer-links { display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-6); }
.footer-links li { font: 300 14px/1.6 var(--font-display); letter-spacing: 3px; text-transform: uppercase; color: var(--on-dark-3); }
.footer-links a { color: var(--on-dark); text-decoration: none; }
.footer-links a:hover { color: var(--on-dark-2); text-decoration: underline; }
.footer-bottom { display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-6); font-size: var(--fs-note); color: var(--on-dark-3); }
.footer-bottom a { color: var(--on-dark-3); }
.footer-bottom a:hover { color: var(--on-dark); }

/* Хлебные крошки на внутренних страницах */
.back { font: 300 14px/1 var(--font-display); letter-spacing: 3px; text-transform: uppercase;
  color: var(--taupe); text-decoration: none; align-self: flex-start; }
.back:hover { color: var(--red); }

/* Появление */
.will-reveal { opacity: 0; transform: translateY(16px); transition: opacity .6s var(--ease), transform .6s var(--ease); }
.will-reveal.is-in { opacity: 1; transform: none; }

@media (max-width: 1023px) {
  .hero-grid, .split, .about-grid { grid-template-columns: 1fr; gap: var(--s-8); }
  .hero-photo, .about-grid .portrait { max-width: 420px; }
}

@media (max-width: 760px) {
  :root { --header-h: 64px; }
  .burger { display: flex; z-index: 31; position: relative; }
  .nav { position: fixed; inset: 0; background: var(--night); flex-direction: column; justify-content: center;
    padding: 0 var(--gutter); gap: var(--s-5); display: none; z-index: 30; }
  .nav a { font: 200 40px/1.1 var(--font-display); letter-spacing: 1px; color: var(--on-dark); }
  .menu-open { overflow: hidden; }
  .menu-open .nav { display: flex; }
  .menu-open .burger span { background: var(--on-dark); }
  .menu-open .burger span:first-child { transform: translateY(4.75px) rotate(45deg); }
  .menu-open .burger span:last-child { transform: translateY(-4.75px) rotate(-45deg); }
  .hero { padding-top: var(--s-7); }
  .hero-text { gap: var(--s-6); }
  .hero-facts { gap: var(--s-4) var(--s-6); }
  .preview-more { display: none; }
  .cards { grid-template-columns: 1fr; }
  .card { padding: var(--s-6) var(--s-5); }
  .step { grid-template-columns: 56px 1fr; gap: var(--s-4); }
  .step-num { font-size: 36px; }
  .recognize-list { gap: var(--s-5); }
  .recognize-list li { grid-template-columns: var(--s-5) 1fr; gap: var(--s-3); }
  .btn { padding: 16px 28px; font-size: 15px; width: 100%; }
  .final .btn { width: auto; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation: none !important; transition: none !important; }
  .will-reveal { opacity: 1; transform: none; }
}

/* Статус продукта */
.card-top { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3) var(--s-4); }
.pill-status { background: none; border: 1px solid var(--ink); color: var(--ink); }
.dark .pill-status { border-color: var(--line-dark); color: var(--on-dark); }

/* Страница ссылок для Instagram */
.links-page { min-height: 100svh; display: flex; flex-direction: column; }
.links-main { flex: 1; width: 100%; max-width: 520px; margin: 0 auto;
  padding: var(--s-8) var(--s-5) var(--s-9); display: flex; flex-direction: column; gap: var(--s-6); }
.links-head { display: flex; flex-direction: column; align-items: center; gap: var(--s-4); text-align: center; }
.links-head .portrait { width: 136px; padding: 0; }
.links-head .portrait:not(.has-photo)::after { inset: var(--s-2); }
.links-head .portrait-ph { font-size: 12px; }
.links-head h1 { font-size: clamp(36px, 9vw, 48px); }
.links-head p { font-size: 17px; color: var(--ink-2); }
.links-head .hero-facts { justify-content: center; text-align: center; }
.links-head .hero-fact { align-items: center; }
.links-head .hero-fact-num { font-size: 26px; }
.link-list { display: flex; flex-direction: column; gap: var(--s-3); }
.link-item { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--s-1);
  min-height: 64px; padding: var(--s-3) var(--s-6); border-radius: var(--radius-pill);
  border: 1px solid var(--ink); color: var(--ink); text-decoration: none; text-align: center;
  transition: background .2s, color .2s, border-color .2s; }
a.link-item:hover { background: var(--ink); color: var(--ivory); }
a.link-item:hover .link-sub { color: var(--on-dark-2); }
.link-item:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.link-item.is-primary { background: var(--red); border-color: var(--red); color: var(--ivory); }
.link-item.is-primary .link-sub { color: rgba(244,239,231,.78); }
a.link-item.is-primary:hover { background: var(--red-hover); border-color: var(--red-hover); }
.link-item.is-off { opacity: .5; border-style: dashed; }
.link-title { font: 300 16px/1.2 var(--font-display); letter-spacing: 3px; text-transform: uppercase; }
.link-sub { font: 400 14px/1.3 var(--font-body); color: var(--ink-2); }
.links-foot { text-align: center; padding: 0 var(--s-5) var(--s-7); display: flex; flex-direction: column; gap: var(--s-3); align-items: center; }
.links-foot a { font-size: var(--fs-note); color: var(--ink-2); }
.hero h1 { font-size: clamp(42px, 6vw, 88px); }
@media (max-width: 760px) {
  .hero-facts { display: grid; grid-template-columns: repeat(3, auto); justify-content: space-between; gap: var(--s-4); }
  .links-head .hero-facts { justify-content: center; gap: var(--s-5); }
  .hero-fact-num, .links-head .hero-fact-num { font-size: 24px; }
  .hero-fact-text { font-size: 11px; line-height: 1.4; letter-spacing: .2em; }
}

/* Первый экран: фото на весь экран, плавно уходит в тёмный шоколад, текст светлый */
.cover { position: relative; background: var(--chocolate); color: var(--on-dark); overflow: hidden;
  margin-top: calc(-1 * var(--header-h)); }
.cover-media { position: relative; height: 66svh; min-height: 420px; }
.cover-media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 22%;
  filter: sepia(.13) saturate(.95) brightness(1.03); }
.cover-media::after { content: ''; position: absolute; inset: 0; bottom: -2px; pointer-events: none;
  background: linear-gradient(to bottom, rgba(58,46,42,.45) 0%, rgba(58,46,42,0) 14%, rgba(58,46,42,0) 52%,
    rgba(58,46,42,.7) 70%, rgba(58,46,42,.97) 84%, rgba(58,46,42,1) 100%); }
.cover-content { position: relative; z-index: 1; display: flex; flex-direction: column; gap: var(--s-6);
  margin-top: -128px; padding-bottom: var(--s-9); }
.cover h1 { color: var(--on-dark); font-size: clamp(42px, 6vw, 92px); }
.cover .rule { border-left-color: var(--red-on-dark); }
.cover .lead { color: var(--on-dark); }
.cover .btn-light { color: var(--ink); }
.cover .hero-fact-num { color: var(--on-dark); }
.cover .hero-fact-text { color: var(--on-dark-2); }

@media (min-width: 1024px) {
  .cover { min-height: min(100svh, 960px); display: flex; align-items: flex-end; }
  .cover-media { position: absolute; top: 0; bottom: 0; left: 46%; right: 0; height: auto; }
  .cover-media::after { left: -2px; bottom: 0; background:
    linear-gradient(to bottom, rgba(58,46,42,.45) 0%, rgba(58,46,42,0) 14%),
    linear-gradient(to right, rgba(58,46,42,1) 0%, rgba(58,46,42,.8) 10%, rgba(58,46,42,.35) 22%, rgba(58,46,42,0) 40%); }
  .cover-content { margin-top: 0; padding-top: calc(var(--header-h) + var(--s-9)); padding-bottom: var(--s-10); }
  .cover-content > * { max-width: 600px; }
  .cover h1 { font-size: clamp(48px, 5.6vw, 80px); }
}

/* Прозрачная шапка поверх фото, пока страница не прокручена */
.has-cover .site-header:not(.is-scrolled) { background: transparent; }
.has-cover .site-header:not(.is-scrolled) .logo,
.has-cover .site-header:not(.is-scrolled) .nav a { color: var(--on-dark); }
.has-cover .site-header:not(.is-scrolled) .nav a:hover { color: var(--on-dark-2); }
.has-cover .site-header:not(.is-scrolled) .burger span { background: var(--on-dark); }
.site-header { transition: border-color .2s, background .2s; }

/* Лимонный маркер: на тёмном и красном фоне — альфа .42 */
.dark .mark, .bg-red .mark { background: linear-gradient(transparent 52%, var(--highlight-dark) 52%,
  var(--highlight-dark) 92%, transparent 92%); }
.nowrap { white-space: nowrap; }

/* «Обо мне»: фото с вступлением сверху, опыт и образование ниже в две колонки */
.about-wrap { display: flex; flex-direction: column; gap: var(--s-9); }
.about-top { display: grid; gap: var(--s-7); }
.about-media { position: relative; margin: 0 calc(-1 * var(--gutter)); aspect-ratio: 4 / 5; max-height: 72svh; }
.about-media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%;
  filter: sepia(.13) saturate(.95); }
.about-media::after { content: ''; position: absolute; inset: 0 0 -2px; pointer-events: none;
  background: linear-gradient(to bottom, rgba(74,60,55,0) 55%, rgba(74,60,55,.75) 85%, rgba(74,60,55,1) 100%); }
.about { padding-top: 0; }
.about-intro { margin-top: -96px; position: relative; z-index: 1; }
.about-bottom { display: grid; gap: var(--s-7); }
.about.no-photo { padding-top: var(--section-y); }
.about.no-photo .about-media { display: none; }
.about.no-photo .about-intro { margin-top: 0; }

@media (min-width: 1024px) {
  .about-top { grid-template-columns: 5fr 7fr; gap: var(--s-10); align-items: center; }
  /* фото уходит к левому краю экрана и растворяется справа в фоне */
  .about-media { --bleed: max(var(--gutter), (100vw - var(--container)) / 2);
    margin: 0 0 0 calc(-1 * var(--bleed)); width: calc(100% + var(--bleed));
    aspect-ratio: auto; height: 100%; min-height: 560px; max-height: none; }
  .about-media::after { inset: 0 -2px -2px 0; background:
    linear-gradient(to right, rgba(74,60,55,0) 55%, rgba(74,60,55,.7) 82%, rgba(74,60,55,1) 100%),
    linear-gradient(to bottom, rgba(74,60,55,0) 70%, rgba(74,60,55,1) 100%); }
  /* фото начинается от верхнего края блока, без пустой полосы */
  .about { padding-top: 0; }
  .about-top { align-items: stretch; }
  .about-media { min-height: 640px; }
  .about-intro { align-self: center; padding-top: var(--s-9); }
  .about-intro { margin-top: 0; }
  .about-bottom { grid-template-columns: 1fr 1fr; gap: var(--s-10); }
  .about.no-photo .about-top { grid-template-columns: 1fr; }
}


/* «Возможно, тебе знакомо» на светлом фоне */
.recognize .recognize-list li { color: var(--ink); }
.recognize .recognize-list li::before { color: var(--taupe); }
.recognize .quote-deco { color: var(--red); }

/* Юридические страницы */
.legal-title { font-size: clamp(40px, 5vw, 72px); }
.legal-langs { display: flex; gap: var(--s-5); }
.legal-langs a { font: 300 14px/1 var(--font-display); letter-spacing: 3px; text-transform: uppercase;
  color: var(--ink); text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: var(--s-1); }
.legal-langs a:hover { color: var(--red); }
.legal { display: flex; flex-direction: column; gap: var(--s-4); max-width: 760px; scroll-margin-top: var(--s-10); }
.legal + .legal { padding-top: var(--s-9); }
.legal h2 { font-size: clamp(32px, 3.4vw, 48px); }
.legal h3 { font-size: clamp(20px, 1.8vw, 26px); margin-top: var(--s-5); }
.legal h4 { font: 300 18px/1.3 var(--font-display); text-transform: uppercase; letter-spacing: 1px; margin-top: var(--s-4); }
.legal p, .legal li { font-size: 17px; line-height: 1.6; }
.legal a { overflow-wrap: anywhere; }
.legal-list { display: flex; flex-direction: column; gap: var(--s-2); padding-left: var(--s-5); }
.legal ul.legal-list { list-style: disc; }
.legal ol.legal-list { list-style: decimal; }
.legal-box { background: var(--latte); padding: var(--s-6); display: flex; flex-direction: column; gap: var(--s-4); }
.legal-box h3 { margin-top: 0; }
.legal-form { display: flex; flex-direction: column; gap: var(--s-3); }
.legal-form li { overflow-wrap: anywhere; }
@media (max-width: 760px) { .legal-box { padding: var(--s-5) var(--s-4); } }