/* Лендинг консультации по Claude Code. Токены и визуальный язык общие с /ai-business. */

:root{
  --bg:#f5f4f1;
  --ink:#171714;
  --muted:#716d63;
  --line:rgba(40,35,25,.12);
  --accent:#a08b62;
  --kicker:#948a76;
  --spring-smooth:linear(0, 0.0355, 0.1176, 0.2203, 0.3278, 0.431, 0.5252, 0.6083, 0.6799, 0.7403, 0.7908, 0.8323, 0.8663, 0.8938, 0.916, 0.9337, 0.9479, 0.9592, 0.968, 0.9751, 0.9806, 0.9849, 0.9883, 0.9909, 0.993, 0.9946, 0.9958, 0.9968, 0.9975, 0.9981, 0.9985, 1);
  --spring-smooth-dur:.58s;
  --spring-bounce:linear(0, 0.0334, 0.1148, 0.2219, 0.3389, 0.4549, 0.5631, 0.6595, 0.7425, 0.8116, 0.8676, 0.9117, 0.9454, 0.9704, 0.9883, 1.0004, 1.0082, 1.0127, 1.0147, 1.0151, 1.0145, 1.0131, 1.0115, 1.0097, 1.0079, 1.0063, 1.0049, 1.0037, 1.0027, 1.0019, 1.0012, 1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{
  margin:0;color:var(--ink);
  background:radial-gradient(ellipse at 85% 0%,#fff,transparent 30%),var(--bg);
  font-family:Manrope,Arial,sans-serif;-webkit-font-smoothing:antialiased;
}
a{color:inherit}
button,input,textarea{font:inherit}
a,button,input,summary{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #ad9568;outline-offset:5px}
img{max-width:100%;height:auto}
h1,h2,h3{margin-top:0;text-wrap:balance}
p{margin-top:0;line-height:1.7;text-wrap:pretty}

h1{font-size:clamp(34px,3.5vw,49px);line-height:1.12;letter-spacing:-.047em;margin-bottom:24px}
h2{font-size:clamp(31px,3.7vw,50px);line-height:1.13;letter-spacing:-.05em;margin-bottom:26px}
h3{font-size:22px;line-height:1.35;letter-spacing:-.025em;margin-bottom:14px}
h1 span,h2 span{color:var(--muted)}

.wrap{width:min(1220px,100%);margin:auto;padding:0 32px}
.kicker{margin-bottom:22px;color:var(--kicker);font-size:11px;font-weight:800;letter-spacing:.13em;line-height:1.8;text-transform:uppercase}
.lead{margin-bottom:25px;color:var(--muted);font-size:17px;line-height:1.75}
.micro{margin:0;color:#8a8478;font-size:12px;line-height:1.7;letter-spacing:.008em}
.section{padding:100px 0;border-top:1px solid var(--line)}
.tinted{background:#eeece780}
.wide-title{max-width:940px}
.wide-copy{max-width:760px}

/* Навигация */
.nav{
  position:sticky;top:0;z-index:60;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  width:min(1220px,calc(100% - 36px));margin:7px auto;padding:13px 28px;
  border:1px solid transparent;border-radius:24px;background:transparent;
  transition:background .28s ease,border-color .28s ease,box-shadow .28s ease,backdrop-filter .28s ease;
}
.nav.is-scrolled{
  border-color:rgba(20,18,14,.09);
  background:rgba(245,244,241,.76);
  box-shadow:0 12px 28px -22px rgba(20,18,14,.38),inset 0 1px rgba(255,255,255,.7);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
}
.brand{font-size:19px;font-weight:800;letter-spacing:-.04em;text-decoration:none;white-space:nowrap}
.brand span{color:#918a7c}
.nav nav{display:flex;gap:27px}
.nav nav a{color:var(--muted);font-size:12px;font-weight:600;text-decoration:none}
.nav nav a:hover{color:var(--ink)}

/* Кнопки */
.button{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:56px;padding:17px 28px;
  border:1px solid transparent;border-radius:999px;
  background:linear-gradient(#302e28,#1b1a18);color:#fff;
  box-shadow:0 12px 28px #26221720;
  font-size:14px;font-weight:700;line-height:1.5;text-align:center;text-decoration:none;cursor:pointer;
  transition:transform .13s cubic-bezier(.2,.8,.3,1),box-shadow .2s ease;
}
.button:hover{transform:translateY(-2px);box-shadow:0 16px 28px #26221730}
.button:active{transform:translateY(0) scale(.975);box-shadow:0 6px 14px #26221726}
.nav-button{min-height:44px;padding:11px 18px;font-size:12px}
.text-link{display:inline-block;font-size:14px;font-weight:700;line-height:1.7;text-underline-offset:7px;transition:opacity .13s ease}
.text-link:active{opacity:.62}

/* Первый экран */
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr);column-gap:54px;align-items:center;padding:42px 0 72px}
.hero-copy{grid-column:1;grid-row:1}
.hero-bullets{display:grid;gap:13px;margin:22px 0 0;padding:0;list-style:none;font-size:15px;line-height:1.6}
.hero-bullets li{display:flex;align-items:flex-start;gap:12px}
.hero-bullets li:before{content:"✓";flex:0 0 22px;width:22px;height:22px;margin-top:2px;display:grid;place-items:center;border-radius:50%;background:#e6e9df;color:#76816b;font-size:12px}
.hero-actions{grid-column:1;grid-row:2;display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:28px}
.hero-actions .micro{flex-basis:100%}
.hero-visual{grid-column:2;grid-row:1/3;margin:0}
.hero-visual img{display:block;width:100%}
.trust{display:flex;align-items:center;gap:10px;width:100%;margin-top:10px;flex-wrap:wrap}
.trust p{margin:0;font-size:12px;font-weight:800;white-space:nowrap}
.trust a{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:7px 11px;border:1px solid var(--line);border-radius:8px;background:#ffffff70;font-size:12px;font-weight:700;text-decoration:none;transition:background .18s ease,transform .13s cubic-bezier(.2,.8,.3,1)}
.trust a:hover{background:#fff}
.trust a:active{transform:scale(.97)}
.trust img{width:20px;height:20px;object-fit:contain}
.trust-more{color:var(--muted);font-size:12px;font-weight:600}

/* Возможности */
.cards{display:grid;gap:18px;margin-top:40px}
.cards.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.glass{padding:26px;border:1px solid #fff;border-radius:24px;background:linear-gradient(145deg,#fff9,#ffffff40);box-shadow:0 12px 35px #42392207}
.glass img{display:block;width:100%;height:120px;margin-bottom:16px;object-fit:contain}
.glass>span{display:block;margin-bottom:12px;color:#95836a;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.glass h3{font-size:18px;margin-bottom:9px}
.glass p{margin:0;color:var(--muted);font-size:14px;line-height:1.6;letter-spacing:.008em}
.closing-line{max-width:820px;margin:34px 0 0;font-size:17px;line-height:1.7}

/* Программа, тёмная секция */
.dark{background:radial-gradient(ellipse at 70% 100%,#514a3c,#24231f 70%);color:#f9f8f4;border-top:0}
.dark .kicker{color:#b3a386}
.dark .lead{color:#bbb5a9}
.steps{margin:44px 0 30px;padding:0;list-style:none}
.steps li{display:grid;grid-template-columns:54px minmax(0,1fr) 128px;gap:20px;align-items:center;padding:20px 0;border-top:1px solid #ffffff20}
.steps li>span{color:#b7a582;font-size:17px;line-height:1.7}
.steps h3{margin-bottom:7px;font-size:21px}
.steps p{max-width:660px;margin:0;color:#bbb5a9;font-size:14px;line-height:1.6;letter-spacing:.008em}
.steps img{width:120px;height:88px;object-fit:contain;justify-self:end}
.dark-note{margin:0;padding:24px;border:1px solid #ffffff20;border-radius:14px;color:#d2cbbe;font-size:16px;line-height:1.65}

/* Кто ведёт */
.about{background:linear-gradient(135deg,#f6f5f1,#eef3fb)}
.about-layout{display:grid;grid-template-columns:minmax(260px,.68fr) minmax(0,1.32fr);gap:clamp(30px,5vw,70px);align-items:start;margin-top:32px}
.about-portrait{margin:0;padding:20px;border:1px solid rgba(24,29,39,.12);border-radius:30px;background:linear-gradient(145deg,rgba(255,255,255,.85),rgba(226,234,248,.68));box-shadow:0 24px 50px rgba(29,42,64,.12)}
.about-portrait img{display:block;width:100%;border-radius:20px;aspect-ratio:.82;object-fit:cover}
.about-name{margin:0;font-size:clamp(34px,4.4vw,58px);line-height:1;letter-spacing:-.055em}
.about-role{margin:10px 0 24px;color:#7b7a75;font-size:18px}
.about-copy p{max-width:690px;font-size:17px;line-height:1.65}
.about-trust{margin:28px 0 0;padding:0;list-style:none;border-top:1px solid rgba(24,29,39,.14)}
.about-trust li{display:grid;grid-template-columns:230px minmax(0,1fr);gap:18px;padding:15px 0;border-bottom:1px solid rgba(24,29,39,.14)}
.about-trust strong{font-size:16px}
.about-trust span{color:#6f706d;font-size:16px;line-height:1.55}

/* Кейсы */
.case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:40px}
.case-card{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:22px;background:#fff;box-shadow:0 12px 35px #4239220a}
.case-card img{display:block;width:100%;height:180px;object-fit:contain;padding:18px 18px 0;background:#f7f6f2}
.case-body{display:flex;flex-direction:column;flex:1;padding:22px}
.case-eyebrow{margin:0 0 9px;color:#95836a;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.case-card h3{margin-bottom:10px;font-size:19px}
.case-card p{margin:0;color:var(--muted);font-size:14px;line-height:1.6;letter-spacing:.008em}
.case-card strong{display:block;margin-top:14px;padding-top:14px;border-top:1px solid var(--line);font-size:14px;line-height:1.5}
.case-badge{align-self:flex-start;margin:0 0 14px;padding:6px 11px;border-radius:999px;background:#eef1e8;color:#5d7059;font-size:11px;font-weight:800;letter-spacing:.04em}

/* Отзывы */
.reviews{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:40px}
.review video{display:block;width:100%;aspect-ratio:.75;border-radius:20px;background:#e6e3dc;object-fit:cover}
.review-placeholder{display:grid;place-items:center;aspect-ratio:.75;padding:24px;border:2px dashed #c3bcab;border-radius:20px;color:#9a927f;font-size:13px;text-align:center;line-height:1.6}
.review p{margin:14px 0 0;font-size:14px;line-height:1.55}
.review p strong{display:block;font-size:15px}
.review p span{color:var(--muted)}

/* Цена и сравнение */
.price-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:18px;margin-bottom:8px}
.price-tag{font-size:clamp(40px,5.2vw,68px);font-weight:800;letter-spacing:-.055em;line-height:1}
.price-note{color:var(--muted);font-size:16px}
.compare{width:100%;margin:36px 0 0;border-collapse:collapse;font-size:15px}
.compare caption{margin-bottom:16px;color:var(--ink);font-size:18px;font-weight:700;text-align:left;letter-spacing:-.02em}
.compare th,.compare td{padding:16px 18px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.compare thead th{color:var(--kicker);font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.compare tbody th{font-weight:600;color:var(--muted)}
.compare td:last-child{background:#f3f5ef;font-weight:600}
.compare-note{max-width:760px;margin:22px 0 0;color:var(--muted);font-size:15px}
.self-study{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:44px}
.self-study div{padding:28px;border:1px solid var(--line);border-radius:22px;background:#fff}
.self-study b{display:block;margin-bottom:10px;font-size:clamp(32px,3.6vw,46px);font-weight:800;letter-spacing:-.05em}
.self-study p{margin:0;color:var(--muted);font-size:15px;line-height:1.65}
.price-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:40px}
.price-actions .micro{flex-basis:100%}

/* FAQ */
.faq-layout{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:60px}
.faq-list details{padding:20px 0;border-bottom:1px solid var(--line)}
.faq-list details:first-child{padding-top:0}
.faq-list details[data-animating]{overflow:hidden}
.faq-list summary{padding-right:18px;font-size:17px;line-height:1.5;font-weight:600;cursor:pointer;list-style:none;transition:opacity .13s ease}
.faq-list summary:active{opacity:.62}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::marker{content:""}
.faq-list details p{margin:14px 0 0;color:var(--muted);font-size:15px;line-height:1.65}

/* Финальный экран и форма */
.final-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.final .lead{color:#c8c1b5}
.final .micro{color:#a9a08f}
.lead-form{min-width:0;padding:32px;border-radius:24px;background:#fff;color:var(--ink)}
.lead-form h3{margin-bottom:22px}
.lead-form label:not(.consent):not(.honeypot){display:block;margin-bottom:16px;font-size:12px;font-weight:600;letter-spacing:.008em}
.lead-form label small{color:#8a8478;font-weight:500}
.lead-form input:not([type=checkbox]),.lead-form textarea{display:block;width:100%;min-width:0;margin-top:7px;padding:14px;border:1px solid #dedbd3;border-radius:9px;background:#f7f6f3;color:var(--ink);font-size:15px}
.lead-form textarea{min-height:96px;line-height:1.5;resize:vertical}
.consent{display:flex;gap:10px;margin:18px 0;color:var(--muted);font-size:10px;line-height:1.65;letter-spacing:.008em}
.consent input{flex:0 0 auto;width:16px;height:16px;margin:3px 0 0;accent-color:#302e28}
.consent-optional{margin-top:-4px}
.lead-form .button{width:100%;font-size:13px}
.lead-form .button:disabled{opacity:.6;cursor:wait}
.form-status{margin:14px 0 0;color:#527258;font-size:12px;line-height:1.5}
.form-status:empty{display:none}
.form-status.error{color:#a33932}
.honeypot{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}

/* Подвал */
footer{padding:56px 0;background:#191917;color:#b4ad9f}
.footer-layout{display:grid;grid-template-columns:1.35fr 1fr .9fr;gap:36px}
.footer-layout .brand{color:#f4f2ec}
.footer-layout p{margin:20px 0;font-size:12px;line-height:1.9;letter-spacing:.008em}
.footer-layout a:not(.brand){font-size:12px;line-height:1.7;text-decoration:none;letter-spacing:.008em}
.footer-layout a:not(.brand):hover{text-decoration:underline}
.footer-contacts{display:flex;flex-direction:column;gap:13px;padding-top:4px}
.footer-layout>div:last-child p{margin-top:0}

/* Появление при скролле */
.reveal{opacity:0;transform:translateY(22px);transition:opacity var(--spring-smooth-dur) ease,transform var(--spring-smooth-dur) var(--spring-smooth)}
.reveal:not(.is-visible){will-change:opacity,transform}
.reveal.is-visible{opacity:1;transform:none}

/* Планшет */
@media(max-width:1000px){
  .nav{width:calc(100% - 28px);padding:12px 20px}
  .nav nav{gap:17px}
  .hero{grid-template-columns:1fr;column-gap:0;padding-top:28px}
  .hero-copy,.hero-actions,.hero-visual{grid-column:1}
  .hero-visual{grid-row:auto;order:1;max-width:560px;margin:28px 0 0}
  .hero-actions{order:2}
  .cards.four{grid-template-columns:repeat(2,minmax(0,1fr))}
  .case-grid,.reviews{grid-template-columns:repeat(2,minmax(0,1fr))}
  .about-layout{grid-template-columns:minmax(220px,.7fr) minmax(0,1.3fr);gap:34px}
  .faq-layout,.final-layout{grid-template-columns:1fr;gap:34px}
  .steps li{grid-template-columns:44px minmax(0,1fr) 100px;gap:16px}
  .steps img{width:94px;height:72px}
  .self-study{grid-template-columns:1fr}
}

/* Телефон */
@media(max-width:700px){
  .wrap{padding:0 22px}
  .nav{width:calc(100% - 18px);margin:5px auto;padding:10px 14px;border-radius:19px}
  .nav nav{display:none}
  .nav-button{min-height:40px;padding:9px 13px;font-size:10px}
  .section{padding:62px 0}
  .hero{padding:24px 0 50px}
  h1{font-size:clamp(29px,7.7vw,39px);line-height:1.16;letter-spacing:-.045em}
  h2{font-size:clamp(28px,7.4vw,37px);line-height:1.17;letter-spacing:-.04em;margin-bottom:22px}
  .lead{font-size:15px}
  .hero-bullets{font-size:14px;gap:11px}
  .hero-actions .button,.price-actions .button{width:100%}
  .cards.four,.case-grid,.reviews{grid-template-columns:1fr}
  .cards{margin-top:28px}
  .glass{padding:22px}
  .about-layout{grid-template-columns:1fr;gap:24px}
  .about-portrait{width:min(100%,320px);padding:14px;border-radius:24px}
  .about-trust li{grid-template-columns:1fr;gap:4px}
  .steps{margin-top:30px}
  .steps li{grid-template-columns:28px minmax(0,1fr);gap:13px;padding:18px 0}
  .steps img{display:none}
  .steps h3{font-size:19px}
  .compare{font-size:14px}
  .compare th,.compare td{padding:13px 10px}
  .lead-form{padding:24px 20px}
  .footer-layout{grid-template-columns:1fr;gap:26px}
  footer{padding:42px 0}
}

/* Системные режимы доступности */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{transition:none!important;animation:none!important}
  .reveal{opacity:1;transform:none}
}
@media(prefers-reduced-transparency:reduce){
  .nav.is-scrolled{background:#f5f4f1;backdrop-filter:none;-webkit-backdrop-filter:none;border-color:rgba(20,18,14,.16)}
  .glass{background:#fdfcfa;border-color:var(--line)}
  .trust a{background:#fff}
}
@media(prefers-contrast:more){
  :root{--muted:#4f4b43;--line:rgba(30,26,18,.34)}
  .glass,.case-card{background:#fff;border-color:rgba(30,26,18,.34)}
  .kicker{color:#6d6250}
  .micro{color:#5d584e}
  .steps p,.dark-note,.dark .lead{color:#ddd8cd}
}
