/* Editorial visual layer · 2026-07-14 */
:root {
  --paper: #f4efe4;
  --paper2: #e5eadc;
  --ink: #211f1a;
  --ink-faint: #696459;
  --line: rgba(41, 52, 36, .16);
  --green: #42543b;
  --greend: #263622;
  --copper: #a45e2c;
  --copper2: #be7540;
  --gold: #d2ad70;
  --display: "Sitka Display", "Iowan Old Style", Georgia, serif;
  --serif: "Sitka Text", Georgia, serif;
  --sans: "Segoe UI Variable Text", "Segoe UI", Arial, Helvetica, sans-serif;
  --wrap: min(1240px, calc(100vw - 64px));
  --narrow: min(980px, calc(100vw - 64px));
  --shadow-soft: 0 18px 55px rgba(38, 54, 34, .08);
}

body {
  background: var(--paper);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.68;
  font-kerning: normal;
  -webkit-font-smoothing: antialiased;
}

h1, h2, .logo, .ab-logo, .foot-logo, .lede,
.pillar h3, .article-card h3, .video-info h4, .c-name,
.interest-form label, .reader-copy h3 { font-family: var(--display); }

::selection { background: rgba(164, 94, 44, .22); }
a:focus-visible, button:focus-visible, textarea:focus-visible {
  outline: 3px solid rgba(190,117,64,.48);
  outline-offset: 4px;
}

.topbar {
  padding: 9px 18px;
  background: #1f2f1d;
  color: rgba(255,255,255,.72);
  font-size: 11px;
  letter-spacing: .105em;
  text-transform: uppercase;
}

nav {
  background: rgba(244, 239, 228, .9);
  box-shadow: 0 8px 30px rgba(33, 31, 26, .035);
}

.nav-inner { min-height: 78px; }
.logo { font-size: 31px; letter-spacing: -.035em; }
.nav-links { gap: 22px; font-size: 14px; }
.nav-links a { position: relative; padding: 27px 0 24px; }
.nav-links a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: 19px;
  height: 1px;
  background: var(--copper);
  transition: right .22s ease;
}
.nav-links a:hover::after { right: 0; }

.hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(90px, 10vw, 150px) 0 108px;
  background:
    radial-gradient(circle at 84% 24%, rgba(190,117,64,.13) 0 8%, transparent 8.2%),
    radial-gradient(circle at 84% 24%, transparent 0 16%, rgba(38,54,34,.09) 16.2% 16.45%, transparent 16.7%),
    linear-gradient(115deg, #f7f2e8 0%, #f4efe4 62%, #ece7d9 100%);
}

.hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: max(4vw, 28px);
  top: 22%;
  width: min(28vw, 390px);
  aspect-ratio: 1;
  border: 1px solid rgba(38,54,34,.12);
  border-radius: 50%;
  box-shadow: inset 0 0 0 34px rgba(255,255,255,.14), inset 0 0 0 35px rgba(164,94,44,.08);
}

.hero .wrap-narrow { width: var(--wrap); }
.eyebrow { margin-bottom: 20px; font-size: 11px; letter-spacing: .18em; }
h1, h2 { letter-spacing: -.035em; }
h1, h2, .reader-copy h3, .interest-form label { text-wrap: balance; }
h1 { max-width: 920px; font-size: clamp(56px, 6.3vw, 92px); line-height: .98; margin-bottom: 30px; }
h1 em { color: var(--copper); font-weight: 400; }
h2 { font-size: clamp(42px, 4.4vw, 64px); }
.hero-sub { max-width: 790px; color: #5f5a50; font-size: clamp(18px, 1.7vw, 22px); line-height: 1.65; }

.hero-actions { margin-top: 36px; gap: 14px; }
.hero-action {
  min-height: 54px;
  padding: 13px 22px;
  border-radius: 999px;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.hero-action:hover { transform: translateY(-2px); }
.hero-action.primary { box-shadow: 0 12px 28px rgba(140,85,36,.2); }
.hero-action.secondary { border-color: rgba(38,54,34,.24); }

.hero-meta { max-width: 900px; gap: 0; margin-top: 42px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.hero-meta > div { position: relative; border: 0; border-radius: 0; background: transparent; padding: 24px 28px 25px 0; }
.hero-meta > div + div { padding-left: 28px; border-left: 1px solid var(--line); }
.hero-meta .n { font-size: 42px; color: var(--copper); }

section { padding: clamp(88px, 8vw, 128px) 0; }
.standard {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, #22321f, #30442c 58%, #263a24);
}
.standard::before {
  content: "01 — 04";
  position: absolute;
  right: -20px;
  top: -68px;
  color: rgba(255,255,255,.035);
  font: 180px/1 var(--serif);
  letter-spacing: -.06em;
}
.standard h2 { max-width: 720px; color: #fffdf7; }
.standard .lede { font-size: 21px; line-height: 1.65; }
.std-rules { gap: 1px; margin-top: 50px; background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.15); border-radius: 18px; overflow: hidden; }
.std-rule { min-height: 292px; border: 0; border-radius: 0; padding: 30px; background: rgba(255,255,255,.055); }
.std-rule .num { font: 32px/1 var(--serif); color: var(--gold); }
.std-rule h4 { font-size: 18px; line-height: 1.35; }

.sec-head { margin-bottom: 44px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.sec-head h2 { margin-bottom: 0; }
.more { border-bottom: 0; padding-bottom: 3px; }

#pillars { background: linear-gradient(180deg, #f4efe4 0%, #f8f5ed 100%); }
.pillars { gap: 16px; }
.pillar, .article-card, .video-card {
  border-color: rgba(38,54,34,.13);
  border-radius: 20px;
  background: rgba(255,255,255,.64);
  box-shadow: 0 1px 0 rgba(255,255,255,.8), 0 16px 44px rgba(38,54,34,.045);
}
.pillar { position: relative; min-height: 330px; padding: 30px 28px; overflow: hidden; }
.pillar::after {
  content: "↗";
  position: absolute;
  right: 24px;
  bottom: 20px;
  color: var(--copper);
  font-size: 22px;
  opacity: .48;
  transition: opacity .2s ease, transform .2s ease;
}
.pillar:hover { transform: translateY(-6px); box-shadow: var(--shadow-soft); }
.pillar:hover::after { opacity: 1; transform: translate(3px,-3px); }
.pillar h3 { margin-top: 56px; font-size: 27px; letter-spacing: -.02em; }
.px { padding-bottom: 14px; border-bottom: 1px solid var(--line); }

#articles { background: #dfe6d8; }
#articles .wrap-narrow { width: var(--wrap); }
.articles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.article-card { position: relative; min-height: 300px; padding: 32px; transition: transform .2s ease, box-shadow .2s ease; }
.article-card::after { content: "Читать →"; position: absolute; right: 30px; bottom: 27px; color: var(--copper); font-size: 13px; font-weight: 700; }
.article-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-soft); }
.article-card h3 { max-width: 90%; margin-top: 28px; font-size: 29px; letter-spacing: -.025em; }
.article-card .meta { max-width: calc(100% - 100px); }

.founder {
  position: relative;
  padding: clamp(90px, 9vw, 138px) 0 !important;
  background: #f7f3e9 !important;
}
.founder::before { content: "“"; position: absolute; left: max(3vw, 20px); top: 45px; color: rgba(164,94,44,.12); font: 240px/.8 var(--serif); }
.founder-grid--text { grid-template-columns: minmax(0,960px) !important; }
.founder-text h2 { max-width: 720px; font-size: clamp(44px, 5vw, 68px) !important; letter-spacing: -.04em; }
.founder-lede { max-width: 770px; font-size: 22px !important; }
.founder-text p { max-width: 820px; font-size: 17px; }
.founder-pull { max-width: 900px !important; margin: 48px 0 32px !important; font-size: clamp(28px, 3vw, 42px) !important; }
.founder-sign { margin-top: 36px !important; padding: 20px 0 20px 24px !important; }

.about { background: #f0eadf; }
.about-grid { gap: clamp(42px, 7vw, 92px); align-items: start; }
.about .lede { position: sticky; top: 115px; font-size: clamp(34px, 4vw, 55px); letter-spacing: -.035em; }
.about .text { padding-left: 38px; border-left: 1px solid var(--line); }
.about .text p { font-size: 18px; }

.video-section { background: #e2e8dc; }
.video-grid { gap: 18px; }
.video-card { transition: transform .2s ease, box-shadow .2s ease; }
.video-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-soft); }
.video-loader { overflow: hidden; }
.video-loader::after { content: ""; position: absolute; inset: 0; box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); }
.video-info { padding: 26px; }
.video-info h4 { font-size: 26px; line-height: 1.22; }

#channels {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 85% 15%, rgba(164,94,44,.12), transparent 25%),
    #f7f3e9;
}
#channels::before { content: "СВЯЗЬ"; position: absolute; right: -25px; bottom: -48px; color: rgba(38,54,34,.035); font: 180px/1 var(--serif); letter-spacing: .05em; }
.channels { position: relative; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.channel {
  position: relative;
  min-height: 190px;
  padding: 28px;
  align-items: flex-end;
  overflow: hidden;
  border: 1px solid rgba(38,54,34,.15);
  border-radius: 18px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 18px 48px rgba(38,54,34,.06);
  transition: transform .22s ease, color .22s ease, background .22s ease;
}
.channel::before { content: attr(data-mark); position: absolute; top: 20px; right: 24px; color: rgba(164,94,44,.22); font: 60px/1 var(--serif); letter-spacing: -.06em; }
.channel:hover { transform: translateY(-6px); border-color: transparent; background: var(--greend); }
.channel:hover .c-name, .channel:hover .c-plat, .channel:hover .c-go { color: white; }
.c-name { font-size: 25px; line-height: 1.15; }
.c-plat { margin-top: 8px; text-transform: uppercase; letter-spacing: .12em; font-size: 11px; }
.c-go { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 50%; font-size: 0; }
.c-go::after { content: "↗"; font-size: 20px; }

.engage {
  position: relative;
  overflow: hidden;
  background: linear-gradient(125deg, #1e2e1d, #30452d 70%, #3a4b31);
}
.engage::after { content: ""; position: absolute; right: -180px; top: -210px; width: 520px; height: 520px; border: 1px solid rgba(210,173,112,.18); border-radius: 50%; box-shadow: inset 0 0 0 70px rgba(255,255,255,.015); }
.engage-title {
  position: relative;
  z-index: 1;
  max-width: 1180px;
  margin: 0 auto 34px;
  color: #fffdf7;
  font-size: clamp(38px, 4vw, 56px);
  letter-spacing: -.035em;
}
.reader-panel {
  position: relative;
  z-index: 1;
  grid-template-columns: minmax(0,1fr) minmax(500px,1.08fr);
  gap: 18px;
  max-width: 1180px;
  margin: 0 auto;
  padding: 18px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 32px;
  background: rgba(12,25,13,.16);
  box-shadow: 0 32px 90px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.06);
}
.reader-copy {
  display: flex;
  min-height: 520px;
  flex-direction: column;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 22px;
  padding: clamp(38px, 4vw, 58px);
  background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.018));
}
.reader-copy h3 { max-width: 470px; margin: 0 0 18px; color: #fffdf7; font-size: clamp(43px, 3.3vw, 54px); font-weight: 400; line-height: 1.02; letter-spacing: -.035em; }
.reader-copy p { max-width: 480px; font-size: 17px; line-height: 1.65; }
.interest-form {
  align-content: center;
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 22px;
  padding: clamp(38px, 4vw, 56px);
  background: linear-gradient(150deg, #faf6ed, #f0e8d9);
  color: var(--ink);
  box-shadow: 0 22px 55px rgba(7,20,8,.14), inset 0 1px 0 #fff;
}
.interest-form label { max-width: 470px; color: var(--ink); font-size: clamp(34px, 2.8vw, 42px); line-height: 1.08; letter-spacing: -.03em; }
.interest-form textarea {
  min-height: 150px;
  border: 1px solid rgba(38,54,34,.17);
  border-radius: 16px;
  background: rgba(255,255,255,.82);
  padding: 18px;
  box-shadow: inset 0 2px 5px rgba(38,54,34,.035);
}
.interest-chips { gap: 10px; }
.interest-chips button { min-height: 42px; border-color: rgba(38,54,34,.16); border-radius: 12px; background: rgba(38,54,34,.055); color: var(--greend); padding: 9px 14px; font-size: 13px; }
.interest-chips button:hover { border-color: var(--copper); background: rgba(164,94,44,.08); color: var(--ink); }
.interest-actions { justify-content: flex-start; }
.interest-actions p { color: var(--ink-faint); }
.engage-actions { justify-content: flex-start; }
.interest-actions button { min-height: 50px; border-radius: 999px; padding: 0 22px; box-shadow: 0 10px 24px rgba(140,85,36,.16); }

footer { padding: 72px 0 34px; background: #151912; }
.foot-logo { color: #f7f3e9; font-size: 34px; margin-bottom: 1.15em; }
.foot-grid { grid-template-columns: 1.5fr repeat(3, 1fr); gap: 50px; }
.foot-grid p, .foot-grid a { color: rgba(255,255,255,.62); }
.foot-grid a { display: inline-block; margin-bottom: 6px; }
.foot-grid a:hover { color: #fff; }
.foot-h { color: var(--gold); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.foot-related { margin-top: 44px; padding-top: 24px; }
.foot-related span { text-transform: uppercase; letter-spacing: .1em; font-size: 12px; }
.foot-legal { max-width: 1050px; line-height: 1.7; }

@media (max-width: 980px) {
  :root { --wrap: min(100vw - 40px, 1240px); --narrow: min(100vw - 40px, 980px); }
  .hero::after { opacity: .45; }
  .std-rules { grid-template-columns: repeat(2,1fr); gap: 1px; }
  .pillar { min-height: 290px; }
  .channels { grid-template-columns: repeat(3,1fr); }
  .channel { min-height: 170px; padding: 22px; }
  .reader-panel { grid-template-columns: 1fr; }
  .reader-copy { min-height: auto; }
  .about .lede { position: static; }
}

@media (max-width: 720px) {
  :root { --wrap: min(100vw - 28px, 1240px); --narrow: min(100vw - 28px, 980px); }
  .topbar { font-size: 9px; line-height: 1.45; }
  .nav-inner { min-height: 66px; }
  .hero { padding: 70px 0 72px; }
  .hero::after { right: -100px; top: 12%; width: 260px; opacity: .34; }
  h1 { font-size: clamp(46px, 14vw, 64px); }
  h2 { font-size: 42px; }
  .hero-meta { grid-template-columns: 1fr; }
  .hero-meta > div, .hero-meta > div + div { padding: 17px 0; border-left: 0; border-top: 1px solid var(--line); }
  .hero-meta > div:first-child { border-top: 0; }
  section { padding: 76px 0; }
  .std-rules { grid-template-columns: 1fr; }
  .std-rule { min-height: 0; }
  .pillars, .articles, .channels { grid-template-columns: 1fr; }
  .pillar { min-height: 280px; }
  .article-card { min-height: 330px; padding: 26px; }
  .article-card h3 { font-size: 27px; }
  .founder::before { font-size: 150px; }
  .founder-text p { font-size: 16px; }
  .about .text { padding-left: 0; border-left: 0; }
  .channel { min-height: 160px; }
  .reader-panel { gap: 8px; padding: 8px; border-radius: 20px; }
  .reader-copy, .interest-form { padding: 34px 24px; border-radius: 14px; }
  .interest-form label { font-size: 32px; }
  .foot-grid { grid-template-columns: 1fr 1fr; gap: 38px 24px; }
  .foot-grid > div:first-child { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .pillar, .article-card, .channel, .video-card, .hero-action { transition: none; }
}