@charset "UTF-8";
/* Главная школы: только типографика и сетка, ни одного изображения. */
:root {
  --paper:#f6f5ef;
  --card:#fdfcf8;
  --ink:#202925;
  --muted:#5c6359;
  --line:#dcded4;
  --accent:#b1432a;
  --sage:#eef0e6;
  --sage-line:#d5dbc7;
  --dark:#25362d;
  --radius:18px;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  font-size:100%;
  color:var(--ink);
  background:var(--paper);
  font-synthesis:none
}
* {
  box-sizing:border-box
}
body {
  margin:0;
  font-size:1rem;
  line-height:1.65;
  -webkit-font-smoothing:antialiased
}
a {
  color:inherit;
  text-decoration:none
}
button,a,summary {
  -webkit-tap-highlight-color:transparent
}
button,input {
  font:inherit
}
h1,h2,h3,p,ul,ol,figure {
  margin:0
}
ul,ol {
  padding:0;
  list-style:none
}
a,summary {
  touch-action:manipulation
}
a:focus-visible,summary:focus-visible,[tabindex]:focus-visible {
  outline:3px solid var(--accent);
  outline-offset:5px;
  border-radius:4px
}
::selection {
  background:#f2bba3;
  color:var(--ink)
}
[hidden] {
  display:none!important
}
.wrap {
  width:min(1200px,calc(100% - 32px));
  margin-inline:auto
}
.skip-link {
  position:fixed;
  top:-100px;
  left:16px;
  z-index:20;
  padding:12px 18px;
  border-radius:12px;
  background:var(--ink);
  color:var(--paper)
}
.skip-link:focus {
  top:16px
}

/* Типографика: один набор размеров на всю страницу */
h1 {
  font-size:clamp(2.25rem,11.5vw,6.5rem);
  line-height:1.02;
  letter-spacing:-.035em;
  font-weight:700
}
h1 span {
  color:var(--accent)
}
h2 {
  font-size:clamp(2rem,6.4vw,3.75rem);
  line-height:1.08;
  letter-spacing:-.025em;
  font-weight:700
}
h2 em {
  font-style:normal;
  color:var(--accent)
}
h3 {
  font-size:clamp(1.25rem,2.6vw,1.5rem);
  line-height:1.25;
  letter-spacing:-.015em;
  font-weight:650
}
.eyebrow {
  margin-bottom:22px;
  font-size:.75rem;
  font-weight:650;
  letter-spacing:.14em;
  line-height:1.4;
  text-transform:uppercase;
  color:var(--muted)
}
.status-dot {
  display:inline-block;
  width:7px;
  height:7px;
  margin-right:6px;
  border-radius:50%;
  background:#6c7f57;
  vertical-align:middle
}
.content-note,.gallery-note,.pricing-honesty {
  font-size:.875rem;
  line-height:1.55;
  color:var(--muted)
}
.inline-link {
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:44px;
  font-weight:650;
  color:var(--accent);
  border-bottom:1px solid transparent
}
.inline-link:hover {
  border-bottom-color:currentColor
}

/* Кнопки: одна высота, читаемая подпись */
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:54px;
  padding:0 28px;
  border-radius:12px;
  font-size:1rem;
  font-weight:650;
  letter-spacing:-.01em;
  text-align:center;
  transition:background .15s ease,color .15s ease,border-color .15s ease
}
.button-primary {
  background:var(--accent);
  color:#fff
}
.button-primary:hover {
  background:#98381f
}
.button-outline {
  border:1.5px solid var(--ink);
  color:var(--ink)
}
.button-outline:hover {
  background:var(--ink);
  color:var(--paper)
}
.button-light {
  background:var(--paper);
  color:var(--ink)
}
.button-light:hover {
  background:#fff
}
.button-text {
  padding:0 4px;
  color:var(--ink)
}
.button-text:hover {
  color:var(--accent)
}
.button-small {
  min-height:44px;
  padding:0 18px;
  border-radius:10px;
  font-size:.9375rem;
  background:var(--ink);
  color:var(--paper)
}
.button-small:hover {
  background:var(--accent)
}

/* Шапка */
.site-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:18px 0;
  border-bottom:1px solid var(--line)
}
.brand {
  display:flex;
  align-items:center;
  gap:12px;
  font-size:.9375rem;
  line-height:1.2
}
.brand strong {
  font-weight:700
}
.brand-mark {
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  border-radius:12px;
  background:var(--ink);
  color:var(--paper);
  font-size:1.25rem;
  font-weight:700
}
.brand-mark span {
  color:var(--accent)
}
.header-actions {
  display:flex;
  align-items:center;
  gap:10px
}
.login-link {
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:44px;
  padding:0 6px;
  font-size:.9375rem;
  font-weight:650;
  color:var(--muted)
}
.login-link:hover {
  color:var(--ink)
}
.only-wide {
  display:none
}

/* Первый экран */
.hero {
  padding:44px 0 36px
}
.hero h1 {
  margin-bottom:34px
}
.hero-bottom {
  display:grid;
  gap:28px;
  padding-top:30px;
  border-top:1px solid var(--line)
}
.hero-lead {
  font-size:clamp(1.25rem,3.4vw,1.75rem);
  line-height:1.3;
  letter-spacing:-.02em;
  font-weight:650
}
.hero-description {
  margin-top:14px;
  max-width:44ch;
  color:var(--muted)
}
.hero-actions {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px 20px
}
.hero-format {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
  margin-top:20px;
  font-size:.9375rem;
  color:var(--muted)
}
.hero-format i {
  width:4px;
  height:4px;
  border-radius:50%;
  background:var(--line)
}

/* Полоса фактов */
.facts {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px 20px;
  padding:32px 0 8px
}
.facts div {
  padding-top:16px;
  border-top:1px solid var(--line)
}
.facts strong {
  display:block;
  font-size:clamp(1.75rem,6vw,2.25rem);
  line-height:1.1;
  letter-spacing:-.03em;
  font-weight:700
}
.facts span {
  display:block;
  margin-top:6px;
  font-size:.875rem;
  line-height:1.45;
  color:var(--muted)
}

/* Вкладки: липкие, все четыре видны на телефоне */
.course-details {
  padding:36px 0 0
}
.course-tabs {
  position:sticky;
  top:0;
  z-index:6;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:4px;
  margin-bottom:40px;
  padding:8px 0;
  background:var(--paper);
  box-shadow:0 1px 0 var(--line)
}
.course-tabs a {
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:6px 8px;
  border-radius:10px;
  font-size:.8125rem;
  font-weight:650;
  line-height:1.25;
  text-align:center;
  color:var(--muted)
}
.course-tabs a:hover {
  color:var(--ink)
}
.course-tabs a[aria-selected="true"] {
  background:var(--ink);
  color:var(--paper)
}
.course-panel {
  scroll-margin-top:84px
}
.course-panel + .course-panel {
  margin-top:72px
}
.section-heading {
  display:grid;
  gap:18px;
  margin-bottom:8px
}
.section-heading > p {
  max-width:46ch;
  color:var(--muted)
}

/* Пронумерованные строки: результат и подход */
.numbered-list {
  margin-top:28px
}
.numbered-list li {
  display:grid;
  grid-template-columns:52px minmax(0,1fr);
  padding:26px 0;
  border-top:1px solid var(--line)
}
.numbered-list li:last-child {
  border-bottom:1px solid var(--line)
}
.row-number {
  font-size:.875rem;
  font-weight:650;
  letter-spacing:.08em;
  color:var(--accent)
}
.row-body p {
  margin-top:12px;
  max-width:60ch;
  color:var(--muted)
}
.row-flow {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px
}
.row-flow span {
  padding:7px 14px;
  border:1px solid var(--line);
  border-radius:9px;
  background:var(--card);
  font-size:.875rem;
  font-weight:650;
  color:var(--ink)
}
.row-flow .flow-final {
  border-color:var(--sage-line);
  background:var(--sage)
}
.row-flow b {
  color:var(--muted)
}
.audience-line {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px 14px;
  margin-top:26px;
  font-size:.9375rem;
  color:var(--muted)
}
.audience-line > span:first-child {
  font-size:.75rem;
  font-weight:650;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ink)
}

/* Программа */
.program-layout {
  display:grid;
  gap:28px;
  margin-top:28px
}
.program-note {
  padding:28px;
  border:1px solid var(--sage-line);
  border-radius:var(--radius);
  background:var(--sage)
}
.big-number {
  display:flex;
  align-items:baseline;
  gap:10px;
  margin-bottom:18px;
  font-size:clamp(3rem,9vw,4rem);
  line-height:1;
  letter-spacing:-.04em;
  font-weight:700
}
.big-number span {
  font-size:.875rem;
  font-weight:650;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--muted)
}
.program-note p:not(.big-number) {
  margin:14px 0 4px;
  color:var(--muted)
}
.module summary {
  display:grid;
  grid-template-columns:38px minmax(0,1fr) 28px;
  align-items:center;
  gap:8px;
  min-height:60px;
  padding:14px 0;
  border-top:1px solid var(--line);
  font-size:1.0625rem;
  font-weight:650;
  letter-spacing:-.01em;
  cursor:pointer;
  list-style:none
}
.module summary::-webkit-details-marker {
  display:none
}
.module:last-child summary {
  border-bottom:1px solid var(--line)
}
.module[open]:last-child summary {
  border-bottom:0
}
.module-number {
  font-size:.8125rem;
  font-weight:650;
  letter-spacing:.06em;
  color:var(--accent)
}
.details-plus {
  justify-self:end;
  font-size:1.25rem;
  font-weight:400;
  color:var(--muted);
  transition:transform .18s ease
}
details[open] .details-plus {
  transform:rotate(45deg)
}
.module-body {
  padding:0 28px 22px 38px
}
.module:last-child .module-body {
  border-bottom:1px solid var(--line)
}
.module-body p {
  color:var(--muted)
}
.course-panel > .content-note {
  margin-top:24px
}

/* Как я учу: единственная фотография на странице — Игорь на выезде */
.mentor-block {
  display:grid;
  gap:20px;
  margin:36px 0 0
}
.mentor-photo {
  display:block;
  width:100%;
  height:auto;
  border-radius:var(--radius);
  background:var(--sage)
}
.mentor-block figcaption {
  display:grid;
  gap:10px;
  align-content:center
}
.mentor-block p {
  max-width:52ch;
  color:var(--muted)
}
.mentor-block strong {
  color:var(--ink)
}

/* Тарифы */
.pricing-grid {
  display:grid;
  gap:18px;
  margin-top:28px
}
.price-card {
  display:flex;
  flex-direction:column;
  padding:28px 24px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--card)
}
.price-recommended {
  border-color:var(--accent);
  background:#fdf8f4
}
.price-badge {
  align-self:flex-start;
  margin-bottom:16px;
  padding:6px 14px;
  border-radius:999px;
  background:var(--accent);
  color:#fff;
  font-size:.6875rem;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase
}
.card-index {
  font-size:.75rem;
  font-weight:650;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted)
}
.price-card h3 {
  margin-top:10px
}
.price {
  margin-top:16px;
  font-size:clamp(2.25rem,7vw,2.75rem);
  line-height:1;
  letter-spacing:-.035em;
  font-weight:700
}
.price span {
  font-size:.5em;
  font-weight:650;
  color:var(--muted)
}
.price-unit {
  margin-top:8px;
  font-size:.8125rem;
  color:var(--muted)
}
.price-description {
  margin-top:16px;
  padding-bottom:20px;
  border-bottom:1px solid var(--line);
  color:var(--muted)
}
.check-list {
  margin:20px 0;
  display:grid;
  gap:12px
}
.check-list li {
  display:grid;
  grid-template-columns:20px minmax(0,1fr);
  gap:8px;
  font-size:.9375rem;
  line-height:1.5
}
.check-list li::before {
  content:"✓";
  color:#6c7f57;
  font-weight:700
}
.price-boundary {
  margin-bottom:20px;
  font-size:.875rem;
  color:var(--muted)
}
.price-card .button {
  margin-top:auto;
  width:100%
}
.pricing-honesty {
  margin-top:12px
}

/* Что внутри кабинета */
.cabinet-section {
  margin-top:72px;
  padding:56px 0;
  background:var(--sage)
}
.cabinet-list {
  display:grid;
  gap:0;
  margin-top:28px
}
.cabinet-list li {
  padding:22px 0;
  border-top:1px solid var(--sage-line)
}
.cabinet-list li:last-child {
  border-bottom:1px solid var(--sage-line)
}
.cabinet-list .row-number {
  display:block;
  margin-bottom:8px
}
.cabinet-list p {
  margin-top:8px;
  max-width:44ch;
  color:var(--muted)
}
.cabinet-section .content-note {
  margin-top:22px
}

/* Вопросы */
.faq-section {
  display:grid;
  gap:28px;
  padding:64px 0
}
.faq-list details {
  border-top:1px solid var(--line)
}
.faq-list details:last-child {
  border-bottom:1px solid var(--line)
}
.faq-list summary {
  display:grid;
  grid-template-columns:minmax(0,1fr) 28px;
  align-items:center;
  gap:12px;
  min-height:64px;
  padding:16px 0;
  font-size:1.0625rem;
  font-weight:650;
  letter-spacing:-.01em;
  cursor:pointer;
  list-style:none
}
.faq-list summary::-webkit-details-marker {
  display:none
}
.faq-list p {
  padding:0 28px 22px 0;
  max-width:62ch;
  color:var(--muted)
}

/* Последний экран и подвал */
.contact-section {
  display:grid;
  gap:26px;
  margin-bottom:64px;
  padding:44px 28px;
  border-radius:var(--radius);
  background:var(--dark);
  color:var(--paper)
}
.contact-section .eyebrow {
  color:#a9b7a4
}
.contact-section p:not(.eyebrow) {
  margin-top:18px;
  max-width:46ch;
  color:#c9d2c4
}
.contact-section .button {
  justify-self:start
}
.site-footer {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:18px 28px;
  padding:26px 0 40px;
  border-top:1px solid var(--line);
  font-size:.875rem;
  color:var(--muted)
}
.site-footer p {
  flex:1 1 220px
}
.site-footer a[href="/login"] {
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:44px;
  font-weight:650;
  color:var(--ink)
}
.build {
  width:100%;
  font-size:.75rem;
  letter-spacing:.06em;
  color:#9aa094
}

/* Самые узкие телефоны: вход остаётся в подвале, шапке не хватает места на три элемента */
@media (max-width:359px) {
  .header-actions .login-link {
    display:none
  }
}
@media (max-width:419px) {
  .brand {
    white-space:nowrap
  }
  .header-actions {
    gap:4px
  }
  .header-actions [aria-hidden="true"] {
    display:none
  }
  .button-small {
    padding:0 14px
  }
}
@media (min-width:560px) {
  .only-wide {
    display:inline
  }
}
@media (min-width:700px) {
  .wrap {
    width:min(1200px,calc(100% - 64px))
  }
  .course-tabs {
    display:flex;
    gap:6px;
    padding:10px 0
  }
  .course-tabs a {
    min-height:46px;
    padding:0 22px;
    font-size:.9375rem
  }
  .facts {
    grid-template-columns:repeat(4,minmax(0,1fr))
  }
  .cabinet-list {
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:36px
  }
  .contact-section {
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    padding:56px 44px
  }
  .contact-section .button {
    justify-self:end
  }
}
@media (min-width:900px) {
  .wrap {
    width:min(1200px,calc(100% - 80px))
  }
  .hero {
    padding:72px 0 48px
  }
  .hero-bottom {
    grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
    gap:48px;
    padding-top:36px
  }
  .hero-side {
    padding-top:6px
  }
  .section-heading {
    grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
    gap:40px;
    align-items:end
  }
  .section-heading > p {
    padding-bottom:8px
  }
  .numbered-list li {
    grid-template-columns:110px minmax(0,1fr);
    padding:32px 0
  }
  .row-body {
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
    column-gap:40px;
    align-items:start
  }
  .row-body h3 {
    grid-column:1;
    grid-row:1/span 6
  }
  .row-body > :not(h3) {
    grid-column:2
  }
  .row-body > :not(h3):first-of-type {
    margin-top:0
  }
  .program-layout {
    grid-template-columns:minmax(0,.85fr) minmax(0,1.25fr);
    gap:48px
  }
  .program-note {
    padding:34px
  }
  .pricing-grid {
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:20px
  }
  .mentor-block {
    grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
    align-items:center;
    gap:48px
  }
  .cabinet-section {
    padding:72px 0
  }
  .cabinet-list {
    grid-template-columns:repeat(4,minmax(0,1fr));
    column-gap:32px
  }
  .faq-section {
    grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);
    gap:48px;
    padding:80px 0
  }
}
@media (prefers-reduced-motion:reduce) {
  * {
    transition:none!important
  }
}