/* Полный эталон дизайн-системы zipka — единственный источник токенов:
   palette + semantic (light/dark + accent-варианты klein/cobalt/vermilion),
   typography, spacing, motion (все @keyframes mo-* и .mo-* утилиты),
   patterns, fonts (JetBrains Mono + Hanken Grotesk), base. */
@import url('/assets/ds/styles.css?v=20260801');
/* Ванильные zk-компоненты (Button, Input, Card, Dialog, Tabs, Alert, Badge…) */
@import url('/assets/ds-components.css?v=20260801');

/* zipka — дизайн-система (полностью на токенах zipka-ds):
   Swiss/brutalist, монопара JetBrains Mono + Hanken Grotesk, палитра Klein +
   редкий «арт»-акцент вермилион. */

:root{
  /* Локальные имена сайта → семантические токены DS.
     Цвета/акценты/линии/maxw/pad НЕ дублируются — приходят из DS под теми же
     именами (--accent, --line, --accent-2, --maxw, --pad) и потому реагируют на
     data-theme="dark" / data-accent сами. Здесь только мост для расходящихся имён. */
  --ink:       var(--text);
  --ink-soft:  var(--text-soft);
  --muted:     var(--text-muted);
  --paper:     var(--surface);
  --soft:      var(--surface-2);
  --mono:      var(--font-mono);
  --sans:      var(--font-sans);
  --code:      var(--font-mono);
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip;}
body{font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.65;-webkit-font-smoothing:antialiased;font-size:16px;overflow-x:clip;}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(var(--line) 1px,transparent 1px) 0 0/100% 96px,linear-gradient(90deg,color-mix(in srgb,var(--line) 30%,transparent) 1px,transparent 1px) 0 0/24px 100%;opacity:.26;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}

/* --- типографика --- */
.mono{font-family:var(--mono);}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--muted);text-transform:lowercase;}
h1,h2,h3{font-family:var(--mono);font-weight:500;line-height:1.12;letter-spacing:0;text-wrap:balance;}
p,.lead{text-wrap:pretty;}
h1{font-size:clamp(34px,6vw,60px);}
h2{font-size:clamp(24px,3.6vw,36px);}
h3{font-size:clamp(17px,2vw,20px);}
.lead{font-size:clamp(17px,2.2vw,20px);color:var(--ink-soft);line-height:1.6;}
p{color:var(--ink-soft);}
.muted{color:var(--muted);}

/* --- раскладка --- */
.wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad);}
section{padding:clamp(48px,8vw,92px) 0;border-top:1px solid var(--line);}
section.soft{background:var(--soft);}
.section-head{display:flex;flex-direction:column;gap:14px;max-width:680px;margin-bottom:40px;}
.grid{display:grid;gap:20px;}
.g2{grid-template-columns:repeat(2,1fr);}
.g3{grid-template-columns:repeat(3,1fr);}
.g4{grid-template-columns:repeat(4,1fr);}

/* --- кнопки --- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--mono);font-size:14px;font-weight:500;padding:13px 22px;border:1px solid var(--ink);background:var(--paper);color:var(--ink);transition:.16s ease;cursor:pointer;white-space:nowrap;min-height:46px;}
.btn:hover{transform:translateY(-1px);}
.btn-fill{background:var(--ink);color:var(--paper);}
.btn-fill:hover{background:var(--ink);opacity:.88;}
.btn-ghost:hover{background:var(--accent);border-color:var(--accent);color:var(--paper);}
.btn-lg{padding:16px 28px;font-size:15px;}
.ui-icon{width:18px;height:18px;display:inline-block;flex:0 0 auto;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;fill:none;}
button[data-ui-icon]{display:inline-flex;align-items:center;justify-content:center;gap:8px;}
.btn-icon-only,.icon-only{display:inline-grid;place-items:center;width:46px;min-width:46px;height:46px;padding:0;gap:0;line-height:1;}
.btn-icon-only.btn-sm{width:38px;min-width:38px;height:38px;padding:0;}
.ui-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* --- хедер --- */
.nav{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--surface) 86%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);}
.nav-in{width:min(1196px,calc(100% - 48px));max-width:none;margin:0 auto;padding:14px 0;display:flex;align-items:center;justify-content:space-between;gap:20px;}
.brand{display:flex;align-items:center;gap:11px;font-family:var(--mono);font-size:18px;font-weight:500;}
.nav-links{display:flex;align-items:center;gap:26px;font-family:var(--mono);font-size:14px;}
.nav-links a{position:relative;display:inline-flex;align-items:center;min-height:44px;color:var(--muted);text-decoration:none;border:0;background-image:none!important;background-size:0!important;box-shadow:none;transition:color .16s;}
.nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:7px;height:1px;background:currentColor;transition:right .22s var(--ease);}
.nav-links a:hover,.nav-links a:focus-visible,.nav-links a.active{color:var(--ink);}
.nav-links a:hover::after,.nav-links a:focus-visible::after,.nav-links a.active::after{right:0;}
.nav-tools{position:relative;display:flex;align-items:center;min-height:44px;}
.nav-tools__trigger{position:relative;min-height:44px;padding:0;border:0;background:none;background-image:none!important;color:var(--ink);font:inherit;cursor:pointer;}
.nav-tools__trigger::after{content:"";position:absolute;left:0;right:100%;bottom:7px;height:1px;background:currentColor;transition:right .22s var(--ease);}
.nav-tools:hover .nav-tools__trigger,.nav-tools.active .nav-tools__trigger{color:var(--ink);}
.nav-tools:hover .nav-tools__trigger::after,.nav-tools.active .nav-tools__trigger::after{right:0;}
.nav-tools-menu{position:absolute;z-index:20;top:100%;left:50%;width:min(620px,calc(100vw - 48px));max-height:min(560px,calc(100vh - 92px));overflow:auto;display:grid;grid-template-columns:190px minmax(0,1fr);background:var(--surface);border:1px solid var(--line);padding:8px;opacity:0;visibility:hidden;transform:translate(-42%,5px);transition:opacity .16s,transform .16s,visibility .16s;}
.nav-tools:hover .nav-tools-menu,.nav-tools:focus-within .nav-tools-menu,.nav-tools.open .nav-tools-menu{opacity:1;visibility:visible;transform:translate(-42%,0);}
.tools-category-list{display:grid;align-content:start;border-right:1px solid var(--line);padding-right:8px;}
.tools-category-list button{min-height:42px;padding:10px 12px;border:0;background:transparent;color:var(--ink);font:12px var(--mono);text-align:left;cursor:pointer;}
.tools-category-list button:hover,.tools-category-list button:focus-visible,.tools-category-list button.active{background:var(--ink);color:var(--paper);}
.tools-category-list button::after{content:"→";float:right;opacity:.5;}
.tools-category-panels{min-height:278px;padding:4px 4px 4px 12px;}
.tools-category-panels>div{display:grid;grid-template-columns:1fr 1fr;gap:6px;}
.tools-category-panels>div[hidden]{display:none;}
.tools-category-panels a{display:flex;align-items:center;min-height:44px;padding:10px 12px;border:1px solid transparent;color:var(--ink);font:12px/1.35 var(--mono);}
.nav-tools-menu a::after{display:none!important;content:none!important;}
.tools-category-panels a:hover,.tools-category-panels a:focus-visible{border-color:var(--line-strong);background:var(--soft);color:var(--accent);}
.nav-tools-menu>.tools-all-link{grid-column:1/-1;min-height:42px;margin-top:8px;padding:10px 12px;border-top:1px solid var(--line);color:var(--accent);font:12px var(--mono);}
.nav-cta{display:flex;align-items:center;gap:14px;flex-shrink:0;}
.nav-login{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;font-family:var(--mono);font-size:13px;color:var(--ink);text-decoration:underline;text-underline-offset:4px;}
.burger{display:none;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 4px;background:none;border:0;cursor:pointer;font-family:var(--mono);font-size:13px;color:var(--ink);}
.home-nav{position:relative;top:auto;height:76px;background:#fff;border:0;border-bottom:1px solid rgba(18,18,20,.13);backdrop-filter:none;}
.home-nav__inner{width:min(1196px,calc(100% - 48px));max-width:none;height:75px;padding:14px 0;gap:24px;}
.home-brand{min-height:44px;gap:11px;color:#00227a;}
.home-brand img,.home-brand__mark{display:block;flex:none;width:38px;height:29px;}
.home-brand__mark .m-body{fill:#fff;}
.home-brand__mark .m-body,.home-brand__mark .m-bar{fill-rule:evenodd;stroke:currentColor;stroke-width:2.0634;stroke-dasharray:128;stroke-dashoffset:0;}
.home-brand__mark .m-bar{fill:none;stroke-dasharray:32;stroke-dashoffset:0;}
.home-brand__word{display:inline-block;white-space:nowrap;}
.home-brand.is-brand-animating .home-brand__mark .m-body{stroke-dashoffset:128;animation:mo-draw .72s var(--ease) both;}
.home-brand.is-brand-animating .home-brand__mark .m-bar{stroke-dashoffset:32;animation:mo-draw .48s var(--ease) .24s both;}
.home-brand.is-brand-animating .home-brand__word{animation:home-brand-type .48s steps(5,end) .38s both;}
@keyframes home-brand-type{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.home-nav__links{gap:32px;color:#000;}
.home-nav__links a{color:#000;font-size:14px;font-weight:400;}
.home-nav__actions{gap:24px;}
.home-nav__icon{display:grid;place-items:center;width:24px;height:44px;min-height:44px;padding:0;color:var(--ink);text-decoration:none;transition:transform .16s,opacity .16s;}
.home-nav__icon:hover{transform:translateY(-1px);opacity:.72;}
.home-nav__icon img{display:block;max-width:none;}
.home-nav__burger{display:none;}

/* мобильное меню */
.mobile-menu{display:none;border-bottom:1px solid var(--line);background:var(--paper);}
.mobile-menu.open{display:block;}
.mobile-menu a{display:block;padding:14px var(--pad);font-family:var(--mono);font-size:15px;border-top:1px solid var(--line);color:var(--ink);}
.mobile-menu button{display:block;width:100%;padding:14px var(--pad);border:0;border-top:1px solid var(--line);background:var(--blue);color:#fff;text-align:left;font-family:var(--mono);font-size:15px;cursor:pointer;}
.skip-link{position:fixed;z-index:2000;top:8px;left:8px;transform:translateY(-150%);padding:10px 14px;background:var(--ink);color:var(--paper);font-family:var(--mono);}
.skip-link:focus{transform:none;}
:where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:3px solid var(--accent);outline-offset:3px;}
.mobile-tool-cats{display:grid;padding:8px var(--pad) 14px;border-top:1px solid var(--line);gap:6px;background:var(--soft);}
.mobile-tool-cats details{border:1px solid var(--line);background:var(--paper);}
.mobile-tool-cats details summary{padding:11px 12px;font-size:12px;}
.mobile-tool-cats details a{padding:10px 14px;border-top:1px solid var(--line);font:11px/1.45 var(--mono);color:var(--ink);}
.mobile-tool-cats .mobile-tools__all{padding:12px 2px;border:0;color:var(--accent);font:12px var(--mono);}
.mobile-tools{border-top:1px solid var(--line);}
.mobile-tools summary{display:block;padding:14px var(--pad);font:15px var(--mono);color:var(--ink);cursor:pointer;list-style:none;}
.mobile-tools summary::-webkit-details-marker{display:none;}
.mobile-tools summary::after{content:"+";float:right;}
.mobile-tools[open] summary::after{content:"−";}

/* --- карточки --- */
.card{border:1px solid var(--line);background:var(--paper);padding:22px;transition:.18s ease;}
.card:hover{border-color:var(--line-strong);transform:translateY(-2px);}
.card-pad{padding:26px;}
.tag{display:inline-block;font-family:var(--mono);font-size:11px;letter-spacing:.03em;padding:4px 10px;border:1px solid var(--line);color:var(--muted);}
.tile{aspect-ratio:4/3;border:1px solid var(--line);background:
  linear-gradient(var(--line) 1px,transparent 1px) 0 0/100% 32px,
  linear-gradient(90deg,color-mix(in srgb,var(--line) 35%,transparent) 1px,transparent 1px) 0 0/32px 100%,var(--soft);
  display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:12px;color:var(--muted);text-align:center;padding:14px;}

/* список с маркером > */
.lines{font-family:var(--mono);font-size:14px;color:var(--ink-soft);line-height:2.1;}
.lines span{display:block;}

/* метрики/факты */
.facts{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);}
.facts > div{padding:22px;border-right:1px solid var(--line);}
.facts > div:last-child{border-right:0;}
.facts .n{font-family:var(--mono);font-size:clamp(20px,3vw,26px);font-weight:500;}
.facts .l{font-size:13px;color:var(--muted);margin-top:4px;}

/* faq */
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{width:100%;text-align:left;background:none;border:0;padding:18px 0;display:flex;justify-content:space-between;align-items:center;gap:16px;cursor:pointer;font-family:var(--mono);font-size:15px;color:var(--ink);}
.faq-q .pm{font-size:18px;color:var(--muted);transition:.2s;}
.faq-q[aria-expanded="true"] .pm{transform:rotate(45deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .25s ease;}
.faq-a p{padding:0 0 18px;color:var(--ink-soft);max-width:680px;}

/* форма */
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px;}
.input,select.input{width:100%;font-family:var(--mono);font-size:14px;padding:13px 14px;border:1px solid var(--line);background:var(--paper);color:var(--ink);}
.input::placeholder{color:var(--muted);}
.input:focus{outline:none;border-color:var(--ink);}
.on-dark .input{background:transparent;border-color:color-mix(in srgb,var(--inv) 35%,transparent);color:var(--inv);}
.on-dark .input::placeholder{color:color-mix(in srgb,var(--inv) 50%,transparent);}

/* инвертированные поверхности (футер, тёмный CTA). В светлой теме это чернильный
   блок с обратным текстом; в тёмной инверсия дала бы белую плиту внизу страницы,
   поэтому там поверхность просто утоплена. --inv держит шкалу прозрачностей. */
.dark,.on-dark,.footer{--inv-bg:var(--ink);--inv:var(--text-inverse);}
[data-theme="dark"] .dark,[data-theme="dark"] .on-dark,[data-theme="dark"] .footer{--inv-bg:var(--surface-sunken);--inv:var(--text);}

/* тёмный блок CTA */
.dark{background:var(--inv-bg);color:var(--inv);}
.dark h2,.dark .eyebrow{color:var(--inv);}
.dark p{color:color-mix(in srgb,var(--inv) 72%,transparent);}

/* футер */
.footer{background:var(--inv-bg);color:color-mix(in srgb,var(--inv) 70%,transparent);font-size:14px;}
.footer-in{max-width:var(--maxw);margin:0 auto;padding:54px var(--pad) 30px;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:30px;}
.footer .brand{color:var(--inv);}
.footer h3,.footer h4{font-family:var(--mono);color:var(--inv);font-size:13px;font-weight:500;margin-bottom:14px;letter-spacing:.04em;}
.footer p{color:color-mix(in srgb,var(--inv) 78%,transparent);}
.footer a{display:flex;align-items:center;min-height:36px;color:color-mix(in srgb,var(--inv) 70%,transparent);line-height:1.45;}
.footer a:hover{color:var(--inv);}
.footer-bot{border-top:1px solid color-mix(in srgb,var(--inv) 14%,transparent);padding:18px var(--pad);max-width:var(--maxw);margin:0 auto;display:flex;justify-content:space-between;font-family:var(--mono);font-size:12px;color:color-mix(in srgb,var(--inv) 50%,transparent);}

/* знак-папка — геометрия из Figma («Ава баннер лого»): прямые углы, тяжёлый
   штрих, планка внутри. Цвет знака отдельным токеном: в светлой теме это
   фирменный тёмно-синий, в тёмной он нечитаем, поэтому берём чернила темы. */
:root{--logo-ink:var(--c-blue-700);}
[data-theme="dark"]{--logo-ink:var(--text);}
.footer{--logo-ink:var(--inv);}
.mark{flex:none;color:var(--logo-ink);overflow:visible;}
.mark .m-body{fill:var(--paper);}
.mark .m-body,.mark .m-bar{stroke:currentColor;stroke-width:5.43;fill-rule:evenodd;}
.mark .m-bar{fill:none;}

/* --- лого: планка знака подрагивает при наведении --- */
.brand .mark .m-bar{transition:transform .35s var(--ease);transform-origin:center;transform-box:fill-box;}
.brand:hover .mark .m-bar{transform:translateY(-1.5px);}

/* --- конверт-навигация (наведение → карточка с курсами выезжает из зева) --- */
.promo{display:inline-flex;align-items:center;gap:22px;border:1px solid var(--line);padding:18px 24px;cursor:pointer;transition:border-color .18s,transform .18s;background:var(--paper);color:var(--ink);font:inherit;text-align:left;}
.promo:hover{border-color:var(--line-strong);transform:translateY(-1px);}
.env-stage{position:relative;width:132px;height:129px;flex:none;}
.env-stage .env-l{position:absolute;inset:0;width:100%;height:100%;overflow:visible;display:block;}
.env-stage .lbody{z-index:1;}
.env-stage .lcard{z-index:2;transition:z-index 0s linear .5s;}
.promo:hover .lcard{z-index:6;transition-delay:0s;}
.env-stage .lflap{z-index:5;transform-origin:50% 32.35%;transform:scaleY(1);transition:transform .45s cubic-bezier(.22,1,.36,1) .48s;}
.promo:hover .lflap{transform:scaleY(-1);transition-delay:0s;}
.env-stage .cmove{transform-box:view-box;transform:translateY(2px);transition:transform .5s cubic-bezier(.22,1,.36,1) 0s;}
.promo:hover .cmove{transform:translateY(-62px);transition-delay:.42s;}
/* краски конверта — из токенов, чтобы он переворачивался вместе с темой
   (в разметке остались presentation-атрибуты, CSS их перебивает) */
.env-stage .lbody rect,.env-stage .lflap path{fill:var(--surface);stroke:var(--text);}
.env-stage .lcard rect{fill:var(--text);}
.env-stage .lcard text{fill:var(--surface);font-family:var(--mono);}
.promo .ptext b{font-family:var(--mono);font-weight:500;}
.promo .ptext span{display:block;font-size:13px;color:var(--muted);}

.modal-open{overflow:hidden;}
.zk-panel-back{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:20px;background:color-mix(in srgb,var(--c-ink-900) 48%,transparent);backdrop-filter:blur(8px);opacity:0;transition:opacity .18s;}
.zk-panel-back[hidden],.zk-cart-state[hidden]{display:none!important;}
.zk-panel-back.open{opacity:1;}
.zk-panel-back--drawer{justify-content:flex-end;padding:0;}
.zk-panel{position:relative;width:min(100%,470px);max-height:min(760px,calc(100vh - 40px));overflow:auto;border:1px solid var(--line-strong);background:var(--paper);padding:40px;box-shadow:0 24px 80px color-mix(in srgb,var(--c-ink-900) 16%,transparent);transform:translateY(10px);transition:transform .22s var(--ease);}
.zk-panel-back.open .zk-panel{transform:none;}
.zk-panel-back--drawer .zk-panel{width:min(460px,100%);height:100%;max-height:none;border-block:0;border-right:0;padding:44px 40px;box-shadow:-24px 0 80px color-mix(in srgb,var(--c-ink-900) 14%,transparent);transform:translateX(24px);}
.zk-panel-back--drawer.open .zk-panel{transform:none;}
.zk-panel h2{margin:12px 0 10px;font-size:clamp(28px,4vw,40px);}
.zk-panel h3{margin:16px 0 8px;}
.zk-panel__lead{max-width:36ch;margin-bottom:28px;color:var(--muted);}
.zk-panel__close{position:absolute;top:16px;right:16px;border:0;background:none;color:var(--ink);cursor:pointer;}
.zk-panel .field{margin-bottom:15px;}
.zk-panel label{display:block;margin-bottom:6px;font:12px var(--mono);color:var(--muted);}
.zk-panel__submit{width:100%;margin-top:4px;}
.zk-auth-switch{display:grid;grid-template-columns:1fr 1fr;margin:0 0 26px;border-bottom:1px solid var(--line);}
.zk-auth-switch button{position:relative;min-height:44px;border:0;background:var(--paper);color:var(--muted);font:12px var(--mono);cursor:pointer;}
.zk-auth-switch button+button{border-left:1px solid var(--line);}
.zk-auth-switch button::after{content:"";position:absolute;left:14px;right:100%;bottom:-1px;height:2px;background:var(--ink);transition:right .2s var(--ease);}
.zk-auth-switch button.active{color:var(--ink);}
.zk-auth-switch button.active::after,.zk-auth-switch button:hover::after,.zk-auth-switch button:focus-visible::after{right:14px;}
.zk-auth-policy{display:block;margin-top:12px;font:11px/1.55 var(--mono);color:var(--muted);}
.zk-auth-links{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:18px;}
.zk-panel__recovery{border:0;background:none;padding:0;color:var(--ink);font:12px var(--mono);text-decoration:underline;text-underline-offset:4px;cursor:pointer;}
.zk-panel__recovery[hidden],[data-auth-field][hidden]{display:none!important;}
.zk-panel__status{min-height:38px;margin-top:16px;padding-left:12px;border-left:2px solid var(--line-strong);font:12px/1.55 var(--mono);color:var(--muted);}
.zk-panel__status:empty{display:none;}
.zk-panel__fallback{display:inline-flex;font:12px var(--mono);text-decoration:underline;text-underline-offset:4px;}
.zk-field-note{display:block;min-height:18px;margin-top:4px;font:11px/1.4 var(--mono);color:var(--danger);}
.zk-panel [aria-invalid="true"]{border-color:var(--danger);}
.zk-cart-state{margin-top:30px;}
.zk-cart-state[data-cart-state="loading"]{display:flex;align-items:center;gap:12px;font:13px var(--mono);}
.zk-loader{width:18px;height:18px;border:1px solid var(--line-strong);border-top-color:var(--ink);animation:zk-spin .8s linear infinite;}
.zk-cart-empty-mark{display:grid;place-items:center;width:84px;height:84px;margin-bottom:30px;border:1px solid var(--line);background:var(--soft);}
.zk-cart-empty-mark img{opacity:.72;}
.zk-cart-state h3{font-size:24px;}
.zk-cart-state>p{max-width:34ch;margin-top:10px;}
.zk-cart-actions{display:flex;align-items:center;gap:18px;margin-top:26px;}
.zk-cart-actions>a:not(.btn){font:12px var(--mono);text-decoration:underline;text-underline-offset:4px;}
.zk-cart-summary{display:flex;align-items:end;justify-content:space-between;padding-bottom:12px;border-bottom:1px solid var(--line);font:12px var(--mono);color:var(--muted);}
.zk-cart-summary strong{font-size:32px;font-weight:400;color:var(--ink);}
.zk-cart-list{display:grid;gap:10px;margin-top:16px;}
.zk-cart-item{display:grid;grid-template-columns:72px minmax(0,1fr) auto;align-items:center;gap:16px;padding:16px;border:1px solid var(--line);background:var(--soft);}
.zk-cart-item__cover{display:block;width:72px;aspect-ratio:1;border:1px solid var(--line);background:var(--paper);}
.zk-cart-item__cover.course-cover--blue{background:#9eb7ff}.zk-cart-item__cover.course-cover--lime{background:#b9f27d}.zk-cart-item__cover.course-cover--violet{background:#c8adff}.zk-cart-item__cover.course-cover--orange{background:#ffbb72}.zk-cart-item__cover.course-cover--rose{background:#ffb6c7}.zk-cart-item__cover.course-cover--cyan{background:#8ee7e7}.zk-cart-item__cover.course-cover--yellow{background:#f3e879}.zk-cart-item__cover.course-cover--red{background:#ff9d90}
.zk-cart-item h3{margin:6px 0 0;font-size:16px;}.zk-cart-item p{margin:6px 0;color:var(--muted);font:10px/1.4 var(--mono)}.zk-cart-item strong{display:block;font:500 15px var(--mono)}
.zk-cart-item__link{display:inline-flex;margin-top:8px;color:var(--ink);font:11px var(--mono);text-decoration:underline;text-underline-offset:4px;white-space:nowrap;}
.zk-cart-item button{border:0;background:none;color:var(--muted);font:11px var(--mono);text-decoration:underline;text-underline-offset:4px;cursor:pointer;}
.zk-cart-item button:hover,.zk-cart-item button:focus-visible{color:var(--ink);}
@keyframes zk-spin{to{transform:rotate(360deg);}}

/* Swiss consistency pass */
input,select,textarea,button{border-radius:0;}
/* поля без собственных правил не должны падать на белый дефолт браузера */
textarea,select,input:not([type]),input[type="text"],input[type="search"],input[type="number"],input[type="email"],input[type="tel"],input[type="url"],input[type="password"]{background:var(--paper);color:var(--ink);}
input[type="range"]{min-height:24px;accent-color:var(--accent);background:transparent;}
pre,code,kbd,samp,.code-output pre,.code-output-box,.gradient-code{font-family:var(--code);}
.page-head{padding-top:clamp(36px,6vw,72px);padding-bottom:clamp(32px,5vw,60px);}
.page-head h1{margin:14px 0 16px;}
.page-head .lead{max-width:760px;}
.course,.rev,.work,.teacher,.rev-card,.font-pair-tool,.type-lab,.image-tool,.cvd-tool,.ct,.palg,.code-lab,.trainer-stats{background:var(--paper);border:1px solid var(--line);box-shadow:none;border-radius:0;}
.course:hover,.work:hover,.rev:hover,.teacher:hover{border-color:var(--line-strong);transform:translateY(-1px);}
.tag,.pill,.chip{border-radius:0;}
.soft,.code-panel,.soft-tool,.fp-toolbar,.lab-controls,.ct-suggest,.py-console,.trainer-stage,.sql-schema,.compiler-input textarea,.mobile-tool-cats{background:var(--soft);}
.stars{letter-spacing:1px;color:var(--accent);}
.tool-status.error,.ct-hex.bad,.image-error,.readability-check.bad b{color:var(--danger);}
.tool-status.good,.readability-check b,.ct-badge.pass span{color:var(--accent);}

/* меню из шести пунктов + кнопка перестают помещаться раньше 560px —
   на планшетной ширине шапка съезжала за край, поэтому бургер включаем с 900px */
@media(max-width:900px){
  .nav-links{display:none;}
  .burger{display:inline-flex;}
  .home-nav__actions{gap:14px;}
}
@media(max-width:700px){
  .nav-in{width:calc(100% - 32px);gap:12px;padding-block:9px;}
  .nav-cta{gap:12px;}
  .nav-cta > .btn{display:none;}
  .home-nav{height:64px;}
  .home-nav__inner{width:calc(100% - 32px);height:63px;padding:9px 0;}
  .home-brand{font-size:16px;}
  .home-brand img,.home-brand__mark{width:32px;height:auto;}
  .home-nav__actions{gap:8px;}
  .home-nav__icon{width:34px;}
  .home-nav__burger{min-width:46px;font-size:12px;}
  .home-mobile-menu{position:absolute;z-index:20;left:0;right:0;}
  .zk-panel,.zk-panel-back--drawer .zk-panel{padding:32px 24px;}
  .zk-cart-actions{align-items:flex-start;flex-direction:column;}
  .zk-auth-links{align-items:flex-start;flex-direction:column;}
}
@media(max-width:820px){
  .g3,.g4{grid-template-columns:repeat(2,1fr);}
  .footer-in{grid-template-columns:1fr 1fr;}
}
@media(max-width:560px){
  .g2,.g3,.g4,.form-row{grid-template-columns:1fr;}
  .facts{grid-template-columns:1fr;}
  .facts > div{border-right:0;border-bottom:1px solid var(--line);}
  .facts > div:last-child{border-bottom:0;}
  .footer-in{grid-template-columns:1fr;}
  .footer-bot{flex-direction:column;gap:8px;}
}

/* ============================================================= *
 *  ПРИМЕНЕНИЕ MOTION DS — анимации навешены на существующие узлы  *
 *  (keyframes mo-* и .mo-* утилиты живут в ds/tokens/motion.css)*
 * ============================================================= */

/* вход hero выше сгиба — текст поднимается, знак-папка всплывает */
.hero-grid > *:first-child{animation:mo-rise-lg var(--dur-enter) var(--ease) both;}
.hero-art{animation:mo-pop var(--dur-slow) var(--ease) both;animation-delay:.12s;}
/* знак-папка в hero тихо «дышит» (idle) */
.hero-art .mark,.hero-art svg{animation:mo-breathe 5s ease-in-out infinite;transform-origin:center;}
/* лого в шапке: 1px-lift при наведении (фирменный жест) */
.brand{transition:transform var(--dur-fast) var(--ease);}
.brand:hover{transform:translateY(-1px);}
/* факты въезжают по очереди */
.facts > div{animation:mo-rise var(--dur-enter) var(--ease) both;}
.facts > div:nth-child(2){animation-delay:80ms;}
.facts > div:nth-child(3){animation-delay:160ms;}

/* scroll-reveal: секции и карточки появляются при входе в кадр.
   Базово видимы; класс .is-rev навешивает app.js через IntersectionObserver. */
.reveal{opacity:0;transform:translateY(18px);}
.reveal.is-rev{animation:mo-rise var(--dur-enter) var(--ease) forwards;}
.result-next{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:28px;padding:20px 22px;border:1px solid var(--accent-line);background:var(--accent-tint)}.result-next div{display:grid;gap:4px}.result-next b{font:14px var(--mono)}.result-next span{font-size:13px;color:var(--ink-soft)}
@media(max-width:640px){.result-next{align-items:flex-start;flex-direction:column}.result-next .btn{width:100%}}
@media (prefers-reduced-motion: reduce){
  .hero-grid > *:first-child,.hero-art,.hero-art svg,.facts > div,.reveal,.reveal.is-rev,.zk-loader{animation:none;opacity:1;transform:none;}
  .home-brand__mark .m-body,.home-brand__mark .m-bar,.home-brand__word{animation:none!important;stroke-dashoffset:0;clip-path:none;}
  .nav-links a::after,.zk-panel,.zk-panel-back{transition:none;}
}

.zipka-footer{display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;max-width:1196px;margin:auto;padding:24px;font:13px/1.6 Arial,sans-serif}.zipka-footer a{color:inherit}.nav .nav-login{white-space:nowrap}