/* ══════════════════════════════════════════════════════════════════════════ Director Courses — общая дизайн-система ══════════════════════════════════════════════════════════════════════════ */ /* Выход из контейнера родительской темы */ #content.site-content{max-width:100%!important;padding-left:0!important;padding-right:0!important;padding-top:0!important;width:100%!important;background:transparent!important;flex:1} .site-content-inner{display:block!important;max-width:100%!important;width:100%!important;padding:0!important;} /* Sticky footer: футер всегда прижат к низу, белый фон body не просвечивает. ВАЖНО: не добавлять html,body{height:100%} — в паре с overflow-x:hidden ниже это заставляет браузер вычислить overflow-y:auto на html (правило CSS Overflow: невидимая ось становится auto, если другая ось не visible), из-за чего превращается в зафиксированный по высоте 100vh скролл-контейнер и sticky-элементы (сайдбар фильтров) начинают вести себя непредсказуемо при скролле. min-height:100vh на #page достаточно. */ #page.site{display:flex!important;flex-direction:column!important;min-height:100vh!important;} body{background:#0F1830!important} /* Предотвращаем горизонтальный скролл. ВАЖНО: overflow-x:hidden только на html, НЕ на body. По спеке CSS Overflow невидимая ось (overflow-y) при заданной overflow-x автоматически считается "auto" — на html это нормально (html и есть реальный скролл-контейнер документа), но на body это превращает body в "глухой" scroll-container (сам никогда не скроллится — реальный скролл идёт на html), а именно body является ближайшим scroll-container предком для position:sticky хедера и сайдбара фильтров → sticky полностью ломается, элементы просто едут со страницей вместо прилипания. */ html{overflow-x:hidden} html,body{max-width:100%} *,*::before,*::after{box-sizing:border-box} /* ── Базовые переменные: «Деловой реестр» ── ink — основной текст и hero, brass — единственный цветной акцент, paper — тёплый нейтральный фон вместо холодного SaaS-серого */ :root{ --al-ink:#161B2C; --al-primary:#b8860b; --al-primary-dark:#8a6a0a; --al-primary-light:#fbf1dc; --al-dark:#161B2C; --al-gray:#6b7280; --al-lgray:#9ca3af; --al-border:#e3ded2; --al-bg:#f7f6f2; --al-white:#fff; --al-font-display:'Source Serif 4',Georgia,serif; --al-font-body:'Golos Text',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; --al-font-mono:'IBM Plex Mono',ui-monospace,Menlo,monospace; } .al-page{background:var(--al-bg);color:var(--al-dark);font-family:var(--al-font-body);font-size:15px;line-height:1.55} .al-wrap{max-width:1240px;margin:0 auto;padding:0 16px} /* ── Hero — единая тёмная полоса на всех страницах ── */ .al-hero{ background:linear-gradient(135deg,#0F1830 0%,#1C2B4D 100%); border-bottom:none; padding:32px 0 28px; position:relative; overflow:hidden; } /* Тонкий паттерн-шум для глубины */ .al-hero::after{ content:'';position:absolute;inset:0; background:url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M0 40L40 0H20L0 20M40 40V20L20 40'/%3E%3C/g%3E%3C/svg%3E") repeat; pointer-events:none; } .al-hero .al-wrap{position:relative;z-index:1} /* Хлебные крошки — белые на тёмном */ .al-breadcrumb{font-size:12px;color:rgba(255,255,255,.62);margin-bottom:10px;display:flex;align-items:center;gap:5px;flex-wrap:wrap} .al-breadcrumb a{color:rgba(255,255,255,.82);text-decoration:none;transition:color .15s} .al-breadcrumb a:hover{color:#fff} /* H1 — белый */ .al-hero h1{font-family:var(--al-font-display);font-size:clamp(18px,3vw,28px);font-weight:700;color:#fff;margin:0 0 10px;letter-spacing:0;line-height:1.25} /* Мета — полупрозрачный белый */ .al-hero-meta{display:flex;flex-wrap:wrap;gap:14px;font-size:12px;color:rgba(255,255,255,.55)} .al-hero-meta b{color:rgba(255,255,255,.9);font-weight:700} /* Чипы доверия внутри hero (trust items) — светлые */ .al-hero .al-trust-item{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.15);color:rgba(255,255,255,.75)} .al-hero .al-trust-item b{color:#fff} .al-hero .al-trust-item svg{color:#caa052} /* ── Direction tags bar ── */ /* Раньше — горизонтальный скролл (nowrap+overflow-x), на мобилке было нечитаемо и непонятно, что можно скроллить (жалоба 2026-09-03, см. bug_direction_tags_bar_mobile_2026_09_03) — теперь просто переносится. Затрагивает front-page.php и page-schools.php (используют общий класс без своих переопределений); taxonomy-direction.php — своя локальная версия с урезкой до топ-5 + сортировкой по релевантности. */ .al-tags-bar{background:var(--al-white);border-bottom:1px solid var(--al-border);padding:10px 0} .al-tags{display:flex;flex-wrap:wrap;gap:8px} .al-tag{display:inline-block;flex-shrink:0;font-size:13px;font-weight:500;color:#374151;background:#f3f4f6;border:1.5px solid var(--al-border);border-radius:100px;padding:5px 14px;text-decoration:none;transition:all .15s;white-space:nowrap} .al-tag:visited{color:#374151} .al-tag:hover{background:var(--al-primary-light);border-color:var(--al-primary);color:var(--al-primary)} .al-tag.active,.al-tag.active:visited,.al-tag.active:hover{background:var(--al-primary);border-color:var(--al-primary);color:var(--al-white)} .al-tag:active{color:#374151} .al-tag--all,.al-tag--all:visited{background:transparent;border-style:dashed;color:var(--al-primary);font-weight:700} .al-tag--all:hover{background:var(--al-primary-light)} /* ── Body layout ── */ .al-body{padding:24px 0 60px} .al-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:24px;align-items:start} /* ── Sidebar ── top/max-height учитывают реальную высоту sticky-хедера (125px: 84px контент + 20px+20px padding родительской темы + 1px border) — иначе верх сайдбара (заголовок "Фильтры") заезжает под хедер при скролле. */ .al-sidebar{position:sticky;top:141px;background:var(--al-white);border:1px solid var(--al-border);border-radius:8px;overflow-y:auto;max-height:calc(100vh - 157px)} .al-sidebar-header{padding:16px 18px;border-bottom:1px solid #f3f4f6;font-weight:700;font-size:15px;color:var(--al-dark);display:flex;align-items:center;gap:8px;position:sticky;top:0;background:var(--al-white);z-index:1} .al-sidebar-header-title{display:flex;align-items:center;gap:8px;flex:1} /* Забыт при первом переносе классов сайдбара в общий файл — на странице школы падал на дефолтный вид браузера (2026-09-03) */ .al-filter-reset{background:none;border:none;font-size:12px;font-weight:600;color:var(--al-primary);cursor:pointer;padding:4px 2px;flex-shrink:0;transition:color .12s} .al-filter-reset:hover{color:var(--al-primary-dark);text-decoration:underline} .al-filter-reset[hidden]{display:none} .al-drawer-close{display:none;background:none;border:none;font-size:22px;font-weight:300;color:var(--al-lgray);cursor:pointer;padding:0 2px;line-height:1;transition:color .12s;flex-shrink:0} .al-drawer-close:hover{color:#374151} .al-filter-section{border-bottom:1px solid #f3f4f6}.al-filter-section:last-child{border-bottom:none} .al-filter-toggle{width:100%;background:none;border:none;padding:13px 18px;display:flex;align-items:center;justify-content:space-between;font-size:13px;font-weight:600;color:#374151;cursor:pointer;text-align:left;transition:color .12s} .al-filter-toggle:hover{color:var(--al-primary)} .al-filter-toggle .arr{font-size:10px;transition:transform .2s;color:var(--al-lgray)} .al-filter-section.open .arr{transform:rotate(180deg)} .al-filter-body{max-height:0;overflow:hidden;transition:max-height .3s ease} .al-filter-section.open .al-filter-body{max-height:400px} .al-filter-inner{padding:4px 18px 14px} .al-chk{display:flex;align-items:center;gap:8px;padding:5px 0;cursor:pointer;font-size:13px;color:#374151;transition:color .12s} .al-chk:hover{color:var(--al-primary)} .al-chk input{accent-color:var(--al-primary);width:15px;height:15px;cursor:pointer;flex-shrink:0} .al-chk-count{margin-left:auto;font-size:11px;color:var(--al-lgray)} .al-quick-checks{padding:10px 18px 14px;border-bottom:1px solid #f3f4f6} .al-quick-checks .al-chk{background:#f9fafb;border:1.5px solid var(--al-border);border-radius:8px;padding:7px 12px;margin-bottom:6px} .al-quick-checks .al-chk:has(input:checked){background:var(--al-primary-light);border-color:var(--al-primary);color:var(--al-primary)} .al-price-option{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:13px;color:#374151;cursor:pointer} .al-price-option input{accent-color:var(--al-primary);cursor:pointer} .al-drawer-apply{display:none;position:sticky;bottom:0;padding:12px 18px 20px;background:var(--al-white);border-top:1px solid #f3f4f6} .al-drawer-apply button{width:100%;background:var(--al-primary);color:var(--al-white);border:none;border-radius:10px;padding:13px;font-size:15px;font-weight:700;cursor:pointer;transition:background .15s} .al-drawer-apply button:hover{background:var(--al-primary-dark)} /* ── Topbar ── */ .al-topbar{display:flex;align-items:center;gap:12px;margin-bottom:18px;flex-wrap:wrap} .al-result-count{font-size:13px;color:var(--al-gray)} .al-result-count b{color:var(--al-dark);font-weight:700} .al-sort{margin-left:auto;font-size:13px;color:var(--al-gray);display:flex;align-items:center;gap:6px} .al-sort select{font-size:13px;border:1.5px solid var(--al-border);border-radius:8px;padding:5px 10px;background:var(--al-white);color:#374151;cursor:pointer;outline:none} .al-sort select:focus{border-color:var(--al-primary)} /* ── Mobile filter button ── */ .al-mobile-filter-btn{display:none;position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:99990;background:var(--al-primary);color:var(--al-white);border:none;border-radius:100px;padding:13px 28px;font-size:14px;font-weight:700;box-shadow:0 4px 24px rgba(184,134,11,.45);cursor:pointer;align-items:center;gap:8px;white-space:nowrap;transition:background .15s,box-shadow .15s} .al-mobile-filter-btn:hover{background:var(--al-primary-dark)} .al-filter-badge{background:rgba(255,255,255,.3);border-radius:100px;padding:1px 8px;font-size:12px;font-weight:800;min-width:20px;text-align:center} .al-filter-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:99992;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);transition:opacity .25s} .al-filter-overlay.active{display:block} /* ── Cards grid ── */ .al-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px} @media(max-width:1100px){.al-cards{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:600px){.al-cards{grid-template-columns:minmax(0,1fr)}} /* ── Пагинация (SEO /page/N/, см. taxonomy-direction.php/taxonomy-school.php) ── */ .dc-pagination{display:flex;justify-content:center;gap:8px;margin-top:24px;flex-wrap:wrap} .dc-pagination a,.dc-pagination span{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;font-size:14px;font-weight:600;text-decoration:none;transition:all .15s;border:1.5px solid #e5e7eb;color:#374151} .dc-pagination a:hover{border-color:#b8860b;color:#b8860b;background:#fbf1dc} .dc-pagination .current{background:#b8860b;border-color:#b8860b;color:#fff} /* ── Card ── */ .al-card{background:var(--al-white);border:1px solid var(--al-border);border-radius:6px;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .15s,transform .12s;position:relative;will-change:transform} .al-card:hover{box-shadow:0 6px 24px rgba(0,0,0,.1);transform:translateY(-2px)} .al-card[hidden]{display:none} .al-card__img{height:118px;overflow:hidden;background:#f3f4f6;position:relative;flex-shrink:0} .al-card__img img{width:100%;height:100%;object-fit:cover} .al-card__img-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:42px;font-weight:800;color:#d1d5db} /* ── Фирменная плашка школы в карточке курса (вместо сток-картинок) ── */ .al-plate{display:flex;align-items:center;justify-content:center} .al-plate::after{ content:'';position:absolute;inset:0; background:url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M0 40L40 0H20L0 20M40 40V20L20 40'/%3E%3C/g%3E%3C/svg%3E") repeat; pointer-events:none; } .al-card__img.al-plate--0{background:linear-gradient(130deg,#b8860b,#8a6a0a)} .al-card__img.al-plate--1{background:linear-gradient(130deg,#1c2b4d,#0f1830)} .al-card__img.al-plate--2{background:linear-gradient(130deg,#8c5a2b,#6b4419)} .al-card__img.al-plate--3{background:linear-gradient(130deg,#7a2e3a,#5c1f29)} .al-card__img.al-plate--4{background:linear-gradient(130deg,#2f5d44,#1f4030)} .al-card__img.al-plate--5{background:linear-gradient(130deg,#475569,#334155)} .al-plate__chip{ background:#fff;border-radius:4px;padding:10px 18px; min-width:96px;max-width:75%;height:56px; display:flex;align-items:center;justify-content:center; box-shadow:0 6px 20px rgba(0,0,0,.25); position:relative;z-index:1; } .al-plate__chip img{max-height:34px;max-width:140px;object-fit:contain;display:block} .al-plate__initials{font-size:20px;font-weight:800;color:#334155;letter-spacing:.04em} .al-plate__dir{ position:absolute;bottom:8px;right:10px;z-index:1; font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase; color:rgba(255,255,255,.55); } .al-card__discount{position:absolute;top:10px;left:10px;background:#ef4444;color:var(--al-white);font-size:11px;font-weight:700;border-radius:6px;padding:2px 8px} .al-card__body{padding:14px;flex:1;display:flex;flex-direction:column;gap:8px} .al-card__school{font-size:11px;font-weight:700;color:var(--al-gray);text-transform:uppercase;letter-spacing:.05em} .al-card__title{font-size:15px;font-weight:700;color:var(--al-dark);line-height:1.4;flex:1} .al-card__dur{font-size:12px;color:var(--al-gray);display:flex;align-items:center;gap:4px} .al-card__chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px} .al-chip{font-size:11px;padding:2px 8px;border-radius:100px;background:#f3f4f6;color:var(--al-gray)} .al-chip--green{background:#ecfdf5;color:#059669} .al-chip--blue{background:#fbf1dc;color:#8a6a0a} .al-chip--amber{background:#fffbeb;color:#d97706} .al-card__price-block{border-top:1px solid #f3f4f6;padding-top:11px;margin-top:6px} /* Верхний ряд: слева рассрочка+старая цена стопкой (обе мелкие), справа промокод стопкой (тоже 2 строки) — высоты естественно совпадают, никакого flex-выравнивания разных по высоте блоков. Крупная цена (price-row) — отдельно ниже, ни с чем не делит ряд. */ .al-card__price-top-row{display:flex;align-items:flex-start;justify-content:space-between;gap:8px} .al-card__price-secondary{display:flex;flex-direction:column;gap:2px} .al-card__install{font-family:var(--al-font-mono);font-size:11.5px;font-weight:600;color:var(--al-gray);letter-spacing:.01em} .al-card__install small{font-weight:400;color:var(--al-lgray)} .al-card__price-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px;margin-top:6px} .al-card__price-full{font-family:var(--al-font-mono);font-size:16px;color:var(--al-dark);font-weight:800;letter-spacing:-.01em;line-height:1} /* Своей строкой НАД ценой (не рядом в price-row) — по просьбе пользователя, зачёркнутая цена рядом с новой мешала/отвлекала. Заодно освобождает место в price-row под промокод. */ .al-card__price-old{display:block;font-family:var(--al-font-mono);font-size:12px;color:var(--al-lgray);text-decoration:line-through;line-height:1.3} .al-card__cta{display:block;width:100%;margin-top:10px;background:var(--al-primary);color:var(--al-white);font-size:13px;font-weight:600;letter-spacing:.01em;text-align:center;padding:10px 16px;border-radius:8px;text-decoration:none;border:none;cursor:pointer;transition:background .15s} .al-card__cta:hover{background:var(--al-primary-dark);color:var(--al-white)} .al-card__cta:visited{color:var(--al-white)} .al-card__cta--outline{background:var(--al-white);color:#374151;border:1.5px solid #d1d5db} .al-card__cta--outline:hover{border-color:#9ca3af;background:#f9fafb;color:#374151} .al-card__cta--outline:visited{color:#374151} .al-empty{text-align:center;padding:80px 20px;color:var(--al-lgray);grid-column:1/-1} .al-empty-icon{font-size:56px;margin-bottom:12px} /* ── Intro ── */ .al-intro{background:var(--al-white);border-bottom:1px solid var(--al-border);padding:20px 0} .al-intro-text{font-size:14px;color:#374151;line-height:1.7;margin:0 0 16px;max-width:780px} .al-trust{display:flex;flex-wrap:wrap;gap:10px} .al-trust-item{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--al-gray);background:#f9fafb;border:1px solid var(--al-border);border-radius:100px;padding:5px 12px} .al-trust-item svg{flex-shrink:0;color:var(--al-primary)} .al-trust-item b{color:var(--al-dark)} /* ── Quick pick ── */ .al-qpick{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px} .al-qpick-btn{display:inline-flex;align-items:center;gap:6px;background:var(--al-white);border:1.5px solid var(--al-border);border-radius:100px;padding:8px 16px;font-size:13px;font-weight:600;color:#374151;cursor:pointer;transition:all .15s;white-space:nowrap;box-shadow:0 1px 3px rgba(0,0,0,.06)} .al-qpick-btn:hover{border-color:var(--al-primary);color:var(--al-primary);background:var(--al-primary-light)} .al-qpick-btn.active{background:var(--al-primary);border-color:var(--al-primary);color:var(--al-white);box-shadow:0 2px 8px rgba(184,134,11,.3)} .al-qpick-btn.active svg{stroke:#fff} .al-qpick-btn svg{flex-shrink:0;transition:stroke .15s} @media(max-width:480px){.al-qpick-btn{font-size:12px;padding:7px 12px;gap:5px}} /* ── Content blocks ── */ .al-cb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px} @media(max-width:900px){.al-cb-grid{grid-template-columns:1fr}} .al-cb{background:var(--al-white);border:1px solid var(--al-border);border-radius:8px;padding:24px;display:flex;flex-direction:column;gap:16px;position:relative;overflow:hidden} .al-cb::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#b8860b,#caa052);border-radius:16px 16px 0 0} .al-cb-head{display:flex;align-items:center;gap:12px} .al-cb-icon{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#fbf1dc,#efe2c4);display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 2px 8px rgba(184,134,11,.15)} .al-cb-icon svg{color:var(--al-primary)} .al-cb h3{font-size:15px;font-weight:700;color:var(--al-dark);margin:0;letter-spacing:-.01em} .al-cb-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;counter-reset:al-item} .al-cb-list li{display:flex;align-items:flex-start;gap:10px;font-size:13px;color:#374151;line-height:1.5} .al-cb-list li::before{content:counter(al-item);counter-increment:al-item;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:7px;flex-shrink:0;margin-top:1px;background:linear-gradient(135deg,#b8860b,#8a6a0a);color:#fff;font-size:11px;font-weight:800} .al-skills{display:flex;flex-wrap:wrap;gap:7px} .al-skill-tag{font-size:12px;font-weight:600;padding:5px 12px;border-radius:100px;background:linear-gradient(135deg,#faf6ec,#f1e6cc);color:#8a6a0a;border:1px solid #ddc89a;transition:all .15s} .al-skill-tag:hover{background:linear-gradient(135deg,#efe2c4,#ddc89a);border-color:#caa052} .al-price-stats{display:flex;flex-direction:column;gap:0} .al-price-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px dashed #f3f4f6;font-size:13px} .al-price-row:last-child{border-bottom:none} .al-price-row span{color:var(--al-gray)} .al-price-row b{color:var(--al-primary);font-weight:800;font-size:14px} .al-price-row.al-price-row--main b{font-size:18px;color:var(--al-dark)} /* ── Compare table ── */ .al-cmp{background:var(--al-white);border:1px solid var(--al-border);border-radius:8px;margin-bottom:24px} .al-cmp-header{padding:14px 20px;border-bottom:1px solid #f3f4f6;display:flex;align-items:center;justify-content:space-between;gap:12px} .al-cmp-header-title{font-size:14px;font-weight:700;color:var(--al-dark);display:flex;align-items:center;gap:8px} .al-cmp-toggle{font-size:12px;color:var(--al-primary);background:none;border:none;cursor:pointer;padding:0;font-weight:600;white-space:nowrap} .al-cmp-toggle:hover{text-decoration:underline} .al-cmp-body.collapsed{display:none} .al-cmp-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;width:100%} .al-cmp-table{width:100%;border-collapse:collapse;font-size:13px} .al-cmp-table thead th{background:#f9fafb;padding:9px 14px;text-align:left;font-size:11px;font-weight:700;color:var(--al-gray);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--al-border);white-space:nowrap} .al-cmp-table tbody tr{border-bottom:1px solid #f3f4f6;transition:background .1s} .al-cmp-table tbody tr:last-child{border-bottom:none} .al-cmp-table tbody tr:hover{background:#f9fafb} .al-cmp-table td{padding:11px 14px;vertical-align:middle} .al-cmp-place{width:44px;text-align:center} .al-cmp-badge{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;font-size:12px;font-weight:800} .al-cmp-badge--1{background:#fef9c3;color:#a16207} .al-cmp-badge--2{background:#f1f5f9;color:#64748b} .al-cmp-badge--3{background:#fff7ed;color:#c2410c} .al-cmp-badge--n{background:#f3f4f6;color:#9ca3af;font-weight:600} .al-cmp-course{min-width:190px} .al-cmp-school{font-size:11px;font-weight:700;color:#9ca3af;text-transform:uppercase;letter-spacing:.04em;margin-bottom:3px} .al-cmp-title{font-size:13px;font-weight:600;color:var(--al-dark);line-height:1.3} .al-cmp-price{font-family:var(--al-font-mono);font-size:13px;font-weight:600;color:var(--al-dark);white-space:nowrap} .al-cmp-old{font-size:11px;color:#9ca3af;text-decoration:line-through;white-space:nowrap;margin-top:1px} .al-cmp-install{font-size:12px;color:var(--al-gray);white-space:nowrap} .al-cmp-dur{font-size:12px;color:var(--al-gray);white-space:nowrap} .al-cmp-dash{color:#d1d5db;font-size:12px} .al-chip-sm{font-size:11px;padding:3px 9px;border-radius:100px;white-space:nowrap;display:inline-block} .al-cmp-btn{display:inline-block;background:var(--al-primary);color:#fff;font-size:12px;font-weight:600;padding:7px 14px;border-radius:7px;text-decoration:none;white-space:nowrap;transition:background .15s} .al-cmp-btn:hover,.al-cmp-btn:active{background:var(--al-primary-dark);color:#fff} .al-cmp-btn:visited{color:#fff} @media(max-width:560px){ .al-cmp-table{font-size:12px} .al-cmp-col-dur,.al-cmp-col-doc,.al-cmp-col-install{display:none} .al-cmp-table .al-cmp-place{width:26px} .al-cmp-table thead .al-cmp-col-rating{font-size:0} .al-cmp-table thead .al-cmp-col-rating::after{content:'★';font-size:11px} .al-cmp-badge{width:22px;height:22px;font-size:11px;border-radius:6px} .al-cmp-course{min-width:0} .al-cmp-title{font-size:12px} .al-cmp-school{font-size:9px;letter-spacing:.02em;margin-bottom:2px} .al-cmp-table .al-cmp-price{font-size:12px;white-space:nowrap} .al-cmp-old{display:none} .al-cmp-scroll .al-cmp-table td{padding:10px 5px} .al-cmp-scroll .al-cmp-table thead th{padding:8px 5px} .al-cmp-btn{padding:6px 10px;font-size:11px} } /* ── FAQ ── */ .al-section{margin-top:44px} .al-section-head{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;margin-bottom:16px} .al-section-title{font-family:var(--al-font-display);font-size:21px;font-weight:700;color:var(--al-dark);margin:0;letter-spacing:0} .al-section-badge{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;background:#fbf1dc;color:var(--al-primary);font-size:11px;font-weight:800;border-radius:100px;padding:4px 12px;border:1px solid #ddc89a} .al-faq{display:flex;flex-direction:column;gap:8px} .al-faq-item{background:var(--al-white);border-radius:8px;overflow:hidden;box-shadow:inset 0 0 0 1.5px var(--al-border);transition:box-shadow .18s} .al-faq-item:hover{box-shadow:inset 0 0 0 1.5px #ddc89a} .al-faq-item.open{box-shadow:inset 0 0 0 2px var(--al-primary),0 4px 16px rgba(184,134,11,.12)} .al-faq-q{width:100%;background:none;border:none;font-size:14px;font-weight:600;color:var(--al-dark);text-align:left;padding:16px 18px;cursor:pointer;display:flex;justify-content:space-between;align-items:flex-start;gap:12px;transition:color .15s;line-height:1.4} .al-faq-q:hover{color:var(--al-primary)} .al-faq-item.open .al-faq-q{color:var(--al-primary)} .al-faq-chevron{width:22px;height:22px;border-radius:50%;background:#f3f4f6;flex-shrink:0;margin-top:1px;display:flex;align-items:center;justify-content:center;transition:background .18s,transform .28s cubic-bezier(.4,0,.2,1)} .al-faq-chevron svg{transition:stroke .18s} .al-faq-item.open .al-faq-chevron{background:var(--al-primary);transform:rotate(180deg)} .al-faq-item.open .al-faq-chevron svg{stroke:#fff} .al-faq-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .28s cubic-bezier(.4,0,.2,1)} .al-faq-item.open .al-faq-body{grid-template-rows:1fr} .al-faq-inner{overflow:hidden} .al-faq-separator{height:1px;background:linear-gradient(90deg,#ddc89a,#f1e6cc,transparent);margin:0 18px 12px} .al-faq-a{font-size:13px;color:#374151;line-height:1.8;padding:0 18px 20px} /* ── Schools grid ── */ .al-schools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px} @media(max-width:480px){.al-schools-grid{grid-template-columns:repeat(2,1fr)}} .al-school-card{background:var(--al-white);border:1.5px solid var(--al-border);border-radius:12px;padding:16px 14px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:10px;transition:border-color .15s,box-shadow .15s,transform .12s;text-align:center} .al-school-card:hover{border-color:var(--al-primary);box-shadow:0 4px 16px rgba(184,134,11,.12);transform:translateY(-2px)} .al-school-card.active{border-color:var(--al-primary);background:var(--al-primary-light);box-shadow:0 4px 16px rgba(184,134,11,.15)} .al-school-avatar{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:800;color:#fff;flex-shrink:0} .al-school-name{font-size:12px;font-weight:700;color:var(--al-dark);line-height:1.3} .al-school-count{font-size:11px;color:var(--al-gray);font-weight:500} .al-school-card.active .al-school-name{color:#8a6a0a} .al-school-card.active .al-school-count{color:var(--al-primary)} /* ── AI Review ── */ .al-review{border-top:1px solid #f3f4f6;padding-top:9px;margin-top:6px;display:flex;flex-direction:column;gap:5px} .al-review-top{display:flex;align-items:center;justify-content:space-between;gap:6px} .al-review-rating{display:flex;align-items:center;gap:4px} /* Значок-шеврон рейтинга — знак ранга, а не звёзды */ .al-review-badge{display:inline-flex;align-items:center;gap:3px;font-family:var(--al-font-mono);font-weight:700;font-size:12px;color:var(--al-primary);background:var(--al-primary-light);padding:3px 9px 3px 7px;clip-path:polygon(6px 0,100% 0,100% 100%,6px 100%,0 50%);line-height:1.3} .al-review-badge--lg{font-size:18px;padding:7px 18px 7px 13px;clip-path:polygon(10px 0,100% 0,100% 100%,10px 100%,0 50%)} /* Счётчик реальных отзывов на карточке курса — под названием, отдельно от al-review-badge (тот — редакционная AI-оценка). Пусто, если 0 отзывов — dc_card_reviews_html() сама ничего не выводит, ничего скрывать вручную. */ .al-card__reviews{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--al-gray);text-decoration:none;margin:2px 0 4px} .al-card__reviews:hover{color:var(--al-primary-dark);text-decoration:underline} /* Промокод на карточке — компактный вариант того же 🎁-блока, что на странице курса (dc-promo__row), но для СВЕТЛОЙ карточки, не тёмного сайдбара — там был бы тёмный-на-тёмном, см. bug 2026-09-08. */ /* Отдельный блок под ценой (не в price-row!) — длинный код промокода не толкает и не переносит цену, см. баг 2026-09-08 "промокод съезжает". */ .al-card__promo{display:flex;flex-direction:column;align-items:flex-end;gap:3px;margin-left:auto;min-width:0;cursor:help} .al-card__promo-discount{font-size:10.5px;font-weight:600;color:var(--al-gray);white-space:nowrap} /* Жёсткий max-width (не 100%!) — код промокода ("onlinekursreit" и т.п.) обрезается многоточием при любой ширине карточки. Без этого промокод иногда помещался рядом с ценой (широкая карточка на мобилке), а иногда падал на новую строку (узкая колонка в десктопной сетке 3 в ряд) — вид карточки менялся от экрана к экрану непредсказуемо. */ /* Код НЕ обрезается — цена рядом (price-full) уменьшена специально, чтобы освободить место под самый длинный реальный код в базе ("onlinekursreit", 14 симв.). Если совсем экстремальный случай всё же не влезет — flex-wrap на price-row уводит промокод на новую строку целиком, не обрезая. display:inline-block, НЕ inline-flex — text-overflow:ellipsis не применяется к flex-контейнерам (известная особенность CSS, наступил на баг 2026-09-08). */ .al-card__promo-code{display:inline-block;font-family:var(--al-font-mono);font-size:11px;font-weight:700;color:var(--al-primary-dark);background:var(--al-primary-light);border:1px dashed #ddc89a;border-radius:5px;padding:2px 8px;white-space:nowrap;line-height:1.3;vertical-align:middle} .al-review-label{font-size:10px;font-weight:600;color:#9ca3af;text-transform:uppercase;letter-spacing:.05em;background:#f3f4f6;border-radius:100px;padding:2px 7px} .al-review-list{display:flex;flex-direction:column;gap:3px} .al-review-item{display:flex;align-items:flex-start;gap:5px;font-size:11px;color:#374151;line-height:1.4} .al-review-item span{flex:1} .al-review-pro::before{content:'✓';color:#059669;font-weight:800;flex-shrink:0;font-size:11px;margin-top:1px} .al-review-con::before{content:'−';color:#ef4444;font-weight:800;flex-shrink:0;font-size:13px;line-height:1.1} .al-review-forwhom{font-size:10px;color:var(--al-gray);font-style:italic;padding-top:1px} /* ══════════════════════════════════════════════════════════════════════════ HOMEPAGE ══════════════════════════════════════════════════════════════════════════ */ .al-home-hero{background:linear-gradient(135deg,#0F1830 0%,#1C2B4D 100%);padding:64px 0 56px;position:relative;overflow:hidden} .al-home-hero::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") repeat} .al-home-hero__inner{position:relative;z-index:1;display:grid;grid-template-columns:1fr 400px;gap:48px;align-items:center} @media(max-width:900px){.al-home-hero__inner{grid-template-columns:1fr}} .al-home-hero h1{font-family:var(--al-font-display);font-size:clamp(26px,4.2vw,44px);font-weight:700;color:#fff;margin:0 0 14px;letter-spacing:0;line-height:1.15;position:relative;padding-bottom:18px} .al-home-hero h1::after{content:'';position:absolute;left:0;bottom:0;width:64px;height:3px;background:linear-gradient(90deg,#caa052,#caa052 60%,transparent)} .al-home-hero h1 span{color:#caa052;font-style:italic} .al-home-hero__sub{font-size:16px;color:rgba(255,255,255,.75);line-height:1.6;margin-bottom:32px;max-width:480px} .al-home-cta-group{display:flex;flex-wrap:wrap;gap:12px} .al-btn{display:inline-flex;align-items:center;gap:8px;padding:14px 28px;border-radius:6px;font-size:15px;font-weight:700;text-decoration:none;transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease;cursor:pointer;border:none} /* Белая кнопка — основной CTA на тёмном hero */ .al-btn.al-btn--primary{background:#fff;color:#b8860b;box-shadow:0 4px 20px rgba(0,0,0,.18)} .al-btn.al-btn--primary:visited{color:#b8860b} .al-btn.al-btn--primary:hover{background:#f1e6cc;color:#8a6a0a;box-shadow:0 8px 32px rgba(0,0,0,.25);transform:translateY(-2px)} /* Прозрачная кнопка — вторичный CTA на тёмном hero */ .al-btn.al-btn--outline{background:rgba(255,255,255,.12);color:#fff;border:1.5px solid rgba(255,255,255,.5);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)} .al-btn.al-btn--outline:visited{color:#fff} .al-btn.al-btn--outline:hover{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.85);color:#fff;box-shadow:0 6px 24px rgba(255,255,255,.12);transform:translateY(-2px)} .al-home-hero__stats{background:rgba(255,255,255,.1);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.15);border-radius:8px;padding:28px;display:flex;flex-direction:column;gap:20px} .al-home-stat{display:flex;align-items:center;gap:14px} .al-home-stat__icon{width:44px;height:44px;border-radius:12px;background:rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;flex-shrink:0} .al-home-stat__icon svg{color:#caa052} .al-home-stat__val{font-family:var(--al-font-mono);font-size:24px;font-weight:600;color:#fff;line-height:1} .al-home-stat__label{font-size:12px;color:rgba(255,255,255,.6);font-weight:500} /* Homepage sections */ .al-home-section{padding:56px 0} .al-home-section--alt{background:var(--al-white)} .al-home-section__head{text-align:center;margin-bottom:40px} .al-home-section__title{font-family:var(--al-font-display);font-size:clamp(22px,3vw,32px);font-weight:700;color:var(--al-dark);margin:0 0 10px;letter-spacing:0} .al-home-section__sub{font-size:15px;color:var(--al-gray);max-width:480px;margin:0 auto} /* ── Реестр направлений — «ledger index» вместо плиток с эмодзи-иконками ── Пронумерованный список с точечной линией-лидером (как в содержании отчёта). */ .al-ledger{display:grid;grid-template-columns:1fr 1fr;column-gap:40px} @media(max-width:760px){.al-ledger{grid-template-columns:1fr !important}} .al-ledger-row{display:flex;align-items:baseline;gap:10px;padding:13px 2px;border-bottom:1px solid var(--al-border);text-decoration:none;color:var(--al-dark);transition:background .12s} .al-ledger-row:hover{background:var(--al-primary-light)} .al-ledger-row__rank{font-family:var(--al-font-mono);font-size:12px;color:var(--al-lgray);flex-shrink:0;width:22px} .al-ledger-row:hover .al-ledger-row__rank{color:var(--al-primary)} .al-ledger-row__name{font-size:14.5px;font-weight:600;color:var(--al-dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:0;max-width:78%} .al-ledger-row__dots{flex:1;min-width:12px;border-bottom:1px dotted #c7bfa8;margin-bottom:5px;height:0} .al-ledger-row__count{font-family:var(--al-font-mono);font-size:12px;color:var(--al-gray);flex-shrink:0;white-space:nowrap} .al-ledger-row__arrow{flex-shrink:0;color:var(--al-primary);opacity:0;transform:translateX(-3px);transition:opacity .15s,transform .15s} .al-ledger-row:hover .al-ledger-row__arrow{opacity:1;transform:translateX(0)} @media(max-width:760px){.al-ledger-row{overflow:hidden}.al-ledger-row__name{max-width:calc(100% - 140px)}} /* How it works */ .al-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;position:relative} .al-steps::before{content:'';position:absolute;top:30px;left:calc(16.67% + 16px);right:calc(16.67% + 16px);height:2px;background:linear-gradient(90deg,var(--al-primary),var(--al-primary-dark));z-index:0} @media(max-width:700px){.al-steps{grid-template-columns:1fr}.al-steps::before{display:none}} .al-step{text-align:center;position:relative;z-index:1} .al-step__num{width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,var(--al-primary),var(--al-primary-dark));color:#fff;font-size:22px;font-weight:900;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;box-shadow:0 6px 20px rgba(184,134,11,.35)} .al-step__title{font-size:16px;font-weight:700;color:var(--al-dark);margin:0 0 8px} .al-step__desc{font-size:13px;color:var(--al-gray);line-height:1.6} /* Schools carousel on homepage */ .al-home-schools{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px} .al-home-school{background:var(--al-white);border:1.5px solid var(--al-border);border-radius:12px;padding:20px 16px;display:flex;flex-direction:column;align-items:center;gap:10px;text-decoration:none;transition:all .15s;text-align:center} .al-home-school:hover{border-color:var(--al-primary);box-shadow:0 4px 16px rgba(184,134,11,.12);transform:translateY(-2px)} .al-home-school__avatar{width:50px;height:50px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:900;color:#fff} .al-home-school__name{font-size:12px;font-weight:700;color:var(--al-dark);line-height:1.3} .al-home-school__count{font-size:11px;color:var(--al-gray)} /* CTA block */ .al-cta-block{background:linear-gradient(135deg,#0F1830,#1C2B4D);border-radius:8px;padding:56px 48px;text-align:center;margin:0 0 60px} .al-cta-block h2{font-family:var(--al-font-display);font-size:clamp(20px,3vw,32px);font-weight:700;color:#fff;margin:0 0 12px} .al-cta-block p{font-size:15px;color:rgba(255,255,255,.75);margin:0 0 32px} .al-cta-block .al-btn--primary{font-size:16px;padding:16px 40px} @media(max-width:600px){.al-cta-block{padding:40px 24px}} /* ══════════════════════════════════════════════════════════════════════════ SCHOOL PAGE (taxonomy-school) ══════════════════════════════════════════════════════════════════════════ */ .al-school-hero{ padding:32px 0 28px; background:linear-gradient(135deg,#0F1830 0%,#1C2B4D 100%); border-bottom:none; position:relative;overflow:hidden; } .al-school-hero::after{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M0 40L40 0H20L0 20M40 40V20L20 40'/%3E%3C/g%3E%3C/svg%3E") repeat;pointer-events:none} .al-school-hero .al-wrap{position:relative;z-index:1} .al-school-hero .al-breadcrumb{color:rgba(255,255,255,.62)} .al-school-hero .al-breadcrumb a{color:rgba(255,255,255,.82)} .al-school-hero .al-breadcrumb a:hover{color:#fff} .al-school-hero__inner{display:flex;align-items:center;gap:24px;flex-wrap:wrap} .al-school-hero__avatar{width:72px;height:72px;border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:900;color:#fff;flex-shrink:0;box-shadow:0 4px 24px rgba(0,0,0,.3);border:2px solid rgba(255,255,255,.2)} .al-school-hero__body{flex:1;min-width:200px} .al-school-hero__name{font-family:var(--al-font-display);font-size:clamp(18px,3vw,26px);font-weight:700;color:#fff;margin:0 0 6px} .al-school-hero__desc{font-size:14px;color:rgba(255,255,255,.7);line-height:1.6;margin:0} .al-school-hero__link{display:inline-flex;align-items:center;gap:6px;margin-top:8px;font-size:13px;font-weight:600;color:#caa052;text-decoration:none} .al-school-hero__link:hover{color:#fff;text-decoration:underline} .al-school-stats{display:flex;flex-wrap:wrap;gap:24px;margin-top:20px;padding-top:16px;border-top:1px solid rgba(255,255,255,.15)} .al-school-stat{display:flex;flex-direction:column;gap:2px} .al-school-stat__val{font-family:var(--al-font-mono);font-size:20px;font-weight:600;color:#fff} .al-school-stat__label{font-size:11px;color:rgba(255,255,255,.55);font-weight:600;text-transform:uppercase;letter-spacing:.04em} /* Direction pills for school filtering */ .al-dir-pills{display:flex;flex-wrap:wrap;gap:8px;padding:14px 0;border-bottom:1px solid var(--al-border);background:var(--al-white)} .al-dir-pill{background:#f3f4f6;border:1.5px solid var(--al-border);color:#374151;border-radius:100px;padding:6px 16px;font-size:13px;font-weight:600;cursor:pointer;transition:all .15s;white-space:nowrap} .al-dir-pill:hover{border-color:var(--al-primary);color:var(--al-primary);background:var(--al-primary-light)} .al-dir-pill.active{background:var(--al-primary);border-color:var(--al-primary);color:#fff} .al-dir-pill--extra{display:none} .al-dir-pills.expanded .al-dir-pill--extra{display:inline-block} .al-dir-pill--toggle{background:transparent;border-style:dashed;color:var(--al-primary);font-weight:700} .al-dir-pill--toggle:hover{background:var(--al-primary-light)} /* ══════════════════════════════════════════════════════════════════════════ STATIC PAGES (about, contacts, privacy) ══════════════════════════════════════════════════════════════════════════ */ .al-static{background:var(--al-bg)} .al-static__hero{background:linear-gradient(135deg,#0F1830,#1C2B4D);padding:48px 0;text-align:center} .al-static__hero h1{font-family:var(--al-font-display);font-size:clamp(22px,4vw,36px);font-weight:700;color:#fff;margin:0 0 10px} .al-static__hero p{font-size:15px;color:rgba(255,255,255,.7);margin:0} .al-static__body{padding:48px 0 80px} .al-static__card{background:var(--al-white);border-radius:8px;border:1px solid var(--al-border);padding:40px;margin-bottom:24px} .al-static__card h2{font-size:20px;font-weight:800;color:var(--al-dark);margin:0 0 16px;letter-spacing:-.01em} .al-static__card p{font-size:14px;color:#374151;line-height:1.8;margin:0 0 14px} .al-static__card p:last-child{margin-bottom:0} .al-static__card ul{font-size:14px;color:#374151;line-height:1.8;padding-left:20px;margin:0 0 14px} .al-static__card ul li{margin-bottom:6px} .al-static__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px} @media(max-width:700px){.al-static__grid{grid-template-columns:1fr}} .al-contact-box{background:var(--al-white);border:1.5px solid var(--al-border);border-radius:8px;padding:28px;display:flex;flex-direction:column;gap:12px} .al-contact-box__icon{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,#fbf1dc,#efe2c4);display:flex;align-items:center;justify-content:center} .al-contact-box__icon svg{color:var(--al-primary)} .al-contact-box__label{font-size:12px;font-weight:700;color:var(--al-gray);text-transform:uppercase;letter-spacing:.05em} .al-contact-box__value{font-size:16px;font-weight:700;color:var(--al-dark)} .al-contact-box__sub{font-size:13px;color:var(--al-gray)} .al-about-values{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:8px} @media(max-width:700px){.al-about-values{grid-template-columns:1fr}} .al-value-card{background:#f9fafb;border-radius:12px;padding:20px;border:1px solid var(--al-border)} .al-value-card__icon{font-size:28px;margin-bottom:10px} .al-value-card__title{font-size:14px;font-weight:700;color:var(--al-dark);margin-bottom:6px} .al-value-card__desc{font-size:13px;color:var(--al-gray);line-height:1.6} /* ══════════════════════════════════════════════════════════════════════════ EDITOR CONTENT (the_content() output styling) ══════════════════════════════════════════════════════════════════════════ */ .dc-editor-content h2{font-size:19px;font-weight:800;color:#111827;margin:28px 0 12px;letter-spacing:-.01em} .dc-editor-content h2:first-child{margin-top:0} .dc-editor-content h3{font-size:16px;font-weight:700;color:#111827;margin:22px 0 10px} .dc-editor-content h4{font-size:14px;font-weight:700;color:#374151;margin:16px 0 8px} .dc-editor-content p{font-size:14px;color:#374151;line-height:1.8;margin:0 0 14px} .dc-editor-content p:last-child{margin-bottom:0} .dc-editor-content ul,.dc-editor-content ol{font-size:14px;color:#374151;line-height:1.8;padding-left:22px;margin:0 0 14px} .dc-editor-content li{margin-bottom:6px} .dc-editor-content a{color:#b8860b;text-decoration:none} .dc-editor-content a:hover{text-decoration:underline} .dc-editor-content strong,.dc-editor-content b{color:#111827;font-weight:700} .dc-editor-content em,.dc-editor-content i{font-style:italic} .dc-editor-content blockquote{border-left:4px solid #b8860b;margin:20px 0;padding:12px 20px;background:#faf6ec;border-radius:0 8px 8px 0;font-style:italic;color:#374151} .dc-editor-content hr{border:none;border-top:1px solid #e5e7eb;margin:24px 0} .dc-editor-content img{max-width:100%;height:auto;border-radius:10px;margin:12px 0;display:block} .dc-editor-content table{width:100%;border-collapse:collapse;font-size:13px;margin:16px 0} .dc-editor-content table th{background:#f3f4f6;padding:9px 14px;text-align:left;font-weight:700;color:#374151;border-bottom:2px solid #e5e7eb} .dc-editor-content table td{padding:9px 14px;border-bottom:1px solid #f3f4f6} .dc-editor-content code{background:#f3f4f6;padding:2px 6px;border-radius:4px;font-size:12px;font-family:monospace;color:#8a6a0a} .dc-editor-content pre{background:#1e293b;color:#e2e8f0;padding:16px 20px;border-radius:10px;overflow-x:auto;font-size:12px;line-height:1.6;margin:16px 0} /* Gutenberg blocks */ .dc-editor-content .wp-block-separator{border:none;border-top:1px solid #e5e7eb;margin:24px 0} .dc-editor-content .wp-block-quote{border-left:4px solid #b8860b;margin:20px 0;padding:12px 20px;background:#faf6ec;border-radius:0 8px 8px 0} .dc-editor-content .wp-block-image{margin:16px 0} .dc-editor-content .wp-block-image img{max-width:100%;height:auto;border-radius:10px} .dc-editor-content .wp-block-columns{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px;margin:16px 0} .dc-editor-content .wp-block-button .wp-block-button__link{display:inline-block;background:#b8860b;color:#fff;padding:12px 24px;border-radius:9px;text-decoration:none;font-weight:700;font-size:14px;transition:background .15s} .dc-editor-content .wp-block-button .wp-block-button__link:hover{background:#8a6a0a} /* ══════════════════════════════════════════════════════════════════════════ MOBILE — комплексные правки ══════════════════════════════════════════════════════════════════════════ */ /* ── 900px: tablet/large phone ── */ @media(max-width:900px){ /* Sidebar → drawer снизу */ .al-layout{grid-template-columns:minmax(0,1fr)} .al-sidebar{position:fixed!important;bottom:0;left:0;right:0;top:auto!important;border-radius:20px 20px 0 0!important;border-left:none;border-right:none;border-bottom:none;border-top:1px solid var(--al-border);z-index:99995;max-height:85vh;overflow-y:auto;transform:translateY(100%);transition:transform .32s cubic-bezier(.32,.72,0,1);box-shadow:0 -8px 40px rgba(0,0,0,.15)} .al-sidebar.drawer-open{transform:translateY(0)} .al-sidebar-header{border-radius:20px 20px 0 0;position:relative;padding-top:22px} .al-sidebar-header::before{content:'';display:block;width:36px;height:4px;background:#d1d5db;border-radius:100px;position:absolute;top:10px;left:50%;transform:translateX(-50%)} .al-drawer-close{display:block} .al-drawer-apply{display:block} .al-mobile-filter-btn{display:flex} .al-body{padding-bottom:90px} /* Hero — меньше отступы */ .al-hero{padding:24px 0 20px} .al-school-hero{padding:24px 0 20px} /* Статичные страницы — карточки уже */ .al-static__card{padding:24px 20px} .al-static__grid{grid-template-columns:1fr} /* Контент-блоки */ .al-cb-grid{grid-template-columns:1fr} /* Блог-пост — sidebar под контентом */ .dc-single__layout{grid-template-columns:1fr} .dc-single__sidebar{position:static} /* Курс: hero CTA под заголовком */ .dc-course__hero-inner{grid-template-columns:1fr} .dc-course__hero-cta{flex-direction:row;flex-wrap:wrap;min-width:0} /* Школы: stats в 2 колонки */ .al-school-stats{gap:16px} /* Ступени */ .al-steps{grid-template-columns:1fr} .al-steps::before{display:none} /* Главная: hero stats */ .al-home-hero__inner{grid-template-columns:1fr} .al-home-hero__stats{flex-direction:row;flex-wrap:wrap;gap:16px;padding:20px} .al-home-stat{min-width:calc(50% - 8px)} } /* ── 640px: смартфон ── */ @media(max-width:640px){ /* Wrap — меньше padding */ .al-wrap{padding:0 12px} /* Hero */ .al-hero{padding:20px 0 16px} .al-hero h1{font-size:20px} .al-school-hero{padding:20px 0 16px} .al-school-hero__name{font-size:20px} .al-home-hero{padding:40px 0 32px} /* Хлебные крошки — короче */ .al-breadcrumb{font-size:11px;gap:3px} /* Карточки курсов — 1 колонка */ .al-cards{grid-template-columns:minmax(0,1fr)} /* Школы на главной */ .al-home-schools{grid-template-columns:repeat(2,1fr)} /* Пилюли-фильтр школы — горизонтальный скролл */ .al-dir-pills{overflow-x:auto;-webkit-overflow-scrolling:touch;flex-wrap:nowrap!important;padding-bottom:4px} .al-dir-pills::-webkit-scrollbar{height:3px} .al-dir-pills::-webkit-scrollbar-track{background:transparent} .al-dir-pills::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:100px} .al-dir-pill{white-space:nowrap;flex-shrink:0} /* Таблица сравнения */ .al-cmp-table{font-size:12px} .al-cmp-col-dur,.al-cmp-col-doc,.al-cmp-col-install{display:none} .al-cmp-btn{padding:6px 10px;font-size:11px} /* Быстрый выбор */ .al-qpick{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px} .al-qpick-btn{white-space:nowrap;flex-shrink:0} /* Статичные страницы */ .al-static__hero{padding:32px 0 24px} .al-static__hero h1{font-size:24px} .al-static__card{padding:20px 16px} .al-about-values{grid-template-columns:1fr} /* FAQ */ .al-faq-q{font-size:13px;padding:14px 16px} .al-faq-a{font-size:13px;padding:0 16px 16px} /* Trust chips — без горизонтального скролла на мобильном (2026-09-03: прятал последний чип/дату за пределами экрана), просто переносятся */ .al-trust{flex-wrap:wrap} /* Школы-сетка */ .al-schools-grid{grid-template-columns:repeat(2,1fr)} .al-school-card{padding:12px 10px} .al-school-avatar{width:40px;height:40px;font-size:15px} /* Hero CTA курса */ .dc-course__hero-cta{flex-direction:column} .dc-course__price-block{text-align:left} /* Блог */ .dc-blog-grid{grid-template-columns:1fr} /* Пагинация */ .dc-pagination a,.dc-pagination span{width:36px;height:36px;font-size:13px} /* Footer */ .dc-footer-top{grid-template-columns:1fr} .dc-footer-col--dirs ul{grid-template-columns:1fr} .dc-footer-bottom{flex-direction:column;gap:8px;text-align:center} /* Контакты — форма */ .dc-contact-form .dc-grid-2{grid-template-columns:1fr!important} /* Кнопки — min touch target 44px */ .al-card__cta{padding:12px 16px;min-height:44px} .al-btn{padding:14px 20px;min-height:44px} .dc-course__btn{min-height:44px} /* Курс: связанные карточки */ .dc-related__grid{grid-template-columns:1fr} } /* ── 480px: маленькие смартфоны ── */ @media(max-width:480px){ .al-qpick-btn{font-size:12px;padding:7px 12px;gap:5px} .al-home-hero h1{font-size:24px} .al-home-hero__sub{font-size:14px} .al-home-cta-group{flex-direction:column} .al-btn{width:100%;justify-content:center} .al-home-schools{grid-template-columns:repeat(2,1fr)} /* Школа: stats в столбик */ .al-school-stats{flex-direction:column;gap:10px} .al-school-stat{flex-direction:row;align-items:center;gap:12px} .al-school-stat__val{font-size:18px} /* Курс: убираем старую цену на малом экране */ .dc-course__price-old{display:none} /* Статики */ .al-contact-box{padding:18px} } /* ── Карточки цен (общий компонент) ── */ .al-price-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px} .al-price-card{background:#f8faff;border:1px solid #e5e7eb;border-radius:10px;padding:12px 14px;display:flex;flex-direction:column;gap:2px} .al-price-card__label{font-size:11px;color:#9ca3af;font-weight:600;text-transform:uppercase;letter-spacing:.04em} .al-price-card__val{font-size:18px;font-weight:900;color:#b8860b;line-height:1.2} .al-price-card--install{grid-column:1/-1;background:linear-gradient(135deg,#faf6ec,#fbf1dc);border-color:#ddc89a} .al-price-card--install .al-price-card__val{color:#8a6a0a} /* ── Отзывы (реальные, от посетителей — не путать с al-review-badge, это редакционная AI-оценка) ── */ /* Явный фон обязателен: секция вставлена ПОСЛЕ закрытия .dc-course (у него свой светлый фон #f7f8fa), иначе просвечивает тёмный фон страницы и текст сливается — баг, найденный вживую 2026-09-08. */ .dc-course__reviews{padding:40px 0;background:#f7f8fa;border-top:1px solid var(--al-border)} .dc-reviews__title{font-family:var(--al-font-display);font-size:22px;font-weight:700;color:var(--al-dark);margin:0 0 14px;display:flex;align-items:baseline;gap:8px} .dc-reviews__count{font-family:var(--al-font-mono);font-size:14px;font-weight:400;color:var(--al-gray)} .dc-reviews__summary{display:flex;align-items:center;gap:10px;margin-bottom:22px;padding:14px 16px;background:var(--al-bg);border:1px solid var(--al-border);border-radius:10px} .dc-reviews__avg{font-family:var(--al-font-mono);font-size:24px;font-weight:700;color:var(--al-dark)} .dc-reviews__stars{color:var(--al-primary);font-size:18px;letter-spacing:1px} .dc-reviews__of{font-size:13px;color:var(--al-gray)} .dc-reviews__notice{padding:12px 16px;border-radius:8px;font-size:14px;margin-bottom:18px} .dc-reviews__notice--ok{background:#eaf7ee;color:#1e7a3d;border:1px solid #bfe6ca} .dc-reviews__notice--err{background:#fdeceb;color:#a23b2e;border:1px solid #f3c9c4} .dc-reviews__empty{color:var(--al-gray);font-size:14.5px;margin-bottom:18px} .dc-reviews__list{display:flex;flex-direction:column;gap:14px;margin-bottom:24px} .dc-review-card{background:var(--al-white);border:1px solid var(--al-border);border-radius:10px;padding:16px 18px} .dc-review-card__top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px} .dc-review-card__author{font-weight:700;color:var(--al-dark);font-size:14.5px} .dc-review-card__rating{color:var(--al-primary);font-size:15px;letter-spacing:1px} .dc-review-card__course{font-family:var(--al-font-mono);font-size:12px;color:var(--al-primary-dark);background:var(--al-primary-light);display:inline-block;padding:2px 8px;border-radius:5px;margin-bottom:8px} .dc-review-card__title{font-family:var(--al-font-display);font-size:15.5px;font-weight:700;margin:0 0 6px;color:var(--al-dark)} .dc-review-card__body{font-size:14.5px;color:var(--al-ink);line-height:1.55;margin:0 0 8px} .dc-review-card__pros,.dc-review-card__cons{font-size:13.5px;margin:0 0 4px;color:var(--al-gray)} .dc-review-card__pros b{color:#1e7a3d} .dc-review-card__cons b{color:#a23b2e} .dc-review-card__date{display:block;font-family:var(--al-font-mono);font-size:11.5px;color:var(--al-lgray);margin-top:8px} .dc-reviews__form-wrap{border:1px solid var(--al-border);border-radius:10px;padding:4px 18px} .dc-reviews__form-wrap[open]{padding-bottom:18px} .dc-reviews__form-toggle{cursor:pointer;padding:14px 0;font-weight:700;color:var(--al-primary-dark);font-size:14.5px;list-style:none} .dc-reviews__form-toggle::-webkit-details-marker{display:none} .dc-reviews__form-toggle::before{content:"+ ";} details[open] > .dc-reviews__form-toggle::before{content:"− ";} .dc-review-form{display:flex;flex-direction:column;gap:14px;margin-top:6px} .dc-review-form__hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden} .dc-review-form__row{display:grid;grid-template-columns:1fr 1fr;gap:14px} @media(max-width:600px){.dc-review-form__row{grid-template-columns:1fr}} .dc-review-form__field{display:flex;flex-direction:column;gap:5px;font-size:13px;font-weight:600;color:var(--al-dark)} .dc-review-form__field small{font-weight:400;color:var(--al-lgray)} .dc-review-form__field input[type="text"],.dc-review-form__field input[type="email"],.dc-review-form__field textarea{ font-family:var(--al-font-body);font-size:14px;font-weight:400;color:var(--al-ink); border:1px solid var(--al-border);border-radius:7px;padding:9px 11px;resize:vertical; } .dc-review-form__field input:focus,.dc-review-form__field textarea:focus{outline:2px solid var(--al-primary);outline-offset:1px} .dc-review-form__label{font-size:13px;font-weight:600;color:var(--al-dark);display:block;margin-bottom:6px} /* Звёзды оценки — радиокнопки в обратном порядке (5→1), подсветка через ~ */ .dc-review-form__stars{display:inline-flex;flex-direction:row-reverse;gap:2px} .dc-review-form__stars input{position:absolute;opacity:0;width:1px;height:1px} .dc-review-form__stars label{cursor:pointer;font-size:26px;line-height:1;color:var(--al-border)} .dc-review-form__stars label::before{content:"★"} .dc-review-form__stars input:checked ~ label, .dc-review-form__stars label:hover, .dc-review-form__stars label:hover ~ label{color:var(--al-primary)} .dc-course-picker{position:relative} .dc-course-picker__input{font-family:var(--al-font-body);font-size:14px;border:1px solid var(--al-border);border-radius:7px;padding:9px 11px} .dc-course-picker__input:disabled{background:var(--al-bg);color:var(--al-lgray)} .dc-course-picker__suggestions{position:absolute;top:100%;left:0;right:0;z-index:5;background:var(--al-white);border:1px solid var(--al-border);border-top:none;border-radius:0 0 7px 7px;max-height:220px;overflow-y:auto;box-shadow:0 6px 16px rgba(22,27,44,.1)} .dc-course-picker__opt{padding:9px 11px;font-size:13.5px;cursor:pointer;color:var(--al-ink)} .dc-course-picker__opt:hover{background:var(--al-primary-light);color:var(--al-primary-dark)} .dc-course-picker__notfound{display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:400;color:var(--al-gray);margin-top:8px} .dc-course-picker__custom{margin-top:8px} .dc-review-form__agreement{display:flex;align-items:flex-start;gap:8px;font-size:12.5px;color:var(--al-gray);line-height:1.4} .dc-review-form__agreement input{margin-top:3px} .dc-review-form__agreement a{color:var(--al-primary-dark)} .dc-review-form__submit{ align-self:flex-start;font-family:var(--al-font-body);font-weight:700;font-size:14px; color:#fff;background:var(--al-primary);border:none;border-radius:8px;padding:11px 22px;cursor:pointer; } .dc-review-form__submit:hover{background:var(--al-primary-dark)} @media(max-width:600px){ .dc-course__reviews{padding:28px 0} .dc-review-card__top{flex-wrap:wrap} }