/* Оболочка темы уже содержит main. clip сохраняет закрепление навигации. */
body.page-template-templatetemplate-lending-php { overflow-x: clip; }
body.page-template-templatetemplate-lending-php #main-wrap { overflow-x: clip; overflow-y: visible; }
/* /for-lawyers/: локальная композиция и компоненты на токенах HARANT. */
.hl-landing {
    --hl-space-xs: calc(var(--space-after-h4) / 2);
    --hl-space-sm: var(--space-after-h4);
    --hl-space-md: var(--space-after-h2);
    --hl-space-lg: var(--space-after-h1);
    --hl-anchor-gap: calc(var(--header-nav-h) + var(--hl-space-md));
    color: var(--color-body);
    background: var(--color-white);
    font-family: var(--font-family);
    font-size: var(--text-md);
    line-height: var(--leading-normal);
}
.hl-landing *, .hl-landing *::before, .hl-landing *::after { box-sizing: border-box; }
.hl-mobile-header { display: none; }
.hl-mobile-logo img { display: block; width: auto; max-width: calc(var(--h-big) * 3); height: var(--but-card-height); object-fit: contain; }
.hl-landing .hl-mobile-logo { text-decoration: none; font-size: var(--text-xl); font-weight: var(--weight-bold); }
.hl-landing .hl-mobile-login { display: flex; align-items: center; gap: var(--hl-space-xs); min-height: var(--but-card-height); text-decoration: none; font-size: var(--text-base); font-weight: var(--weight-bold); }
.hl-container { max-width: var(--space-page-max); margin-inline: auto; padding-inline: var(--space-page-x); }
.hl-landing h1, .hl-landing h2, .hl-landing h3 { color: var(--color-heading); font-family: var(--font-family); font-weight: var(--weight-bold); letter-spacing: var(--tracking-tight); }
.hl-landing h1 { margin: 0 0 var(--hl-space-md); font-size: var(--h1); line-height: var(--leading-tight); text-wrap: balance; }
.hl-landing h1 > span { color: var(--color-primary); }
.hl-landing h2 { margin: 0 0 var(--hl-space-sm); font-size: var(--section-h); line-height: var(--leading-heading); text-wrap: balance; }
.hl-landing h3 { margin: 0 0 var(--hl-space-xs); font-size: var(--text-xl); line-height: var(--leading-heading); }
.hl-landing p { margin: 0 0 var(--hl-space-sm); }
.hl-landing a { color: var(--color-primary); text-decoration: underline; text-underline-offset: calc(var(--hl-space-xs) / 2); }
.hl-landing a:hover { color: var(--color-primary-hover); }
.hl-landing :is(a, button, summary, input, [tabindex]):focus-visible { outline: medium solid var(--color-accent); outline-offset: calc(var(--hl-space-xs) / 2); }
.hl-landing section[id] { scroll-margin-top: var(--hl-anchor-gap); }
.hl-eyebrow { color: var(--color-muted); font-size: var(--text-sm); font-weight: var(--weight-bold); letter-spacing: var(--tracking-wide); }
.hl-small-label { display: block; margin-bottom: var(--hl-space-xs); color: var(--color-primary); font-size: var(--text-xs); font-weight: var(--weight-bold); letter-spacing: var(--tracking-wide); }
.hl-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--hl-space-sm) var(--hl-space-md); }
.hl-landing .hl-button { display: inline-flex; align-items: center; justify-content: center; gap: var(--hl-space-xs); min-height: var(--h-big); padding: var(--hl-space-xs) var(--hl-space-md); border: thin solid var(--color-primary); border-radius: var(--radius-sm); background: var(--color-primary); color: var(--btn-text-primary); font: inherit; font-weight: var(--weight-bold); line-height: var(--leading-heading); text-align: center; text-decoration: none; cursor: pointer; transition: background var(--transition), border-color var(--transition); }
.hl-landing .hl-button:hover { background: var(--color-primary-hover); border-color: var(--color-primary-hover); color: var(--btn-text-primary); }
.hl-landing .hl-button:active { background: var(--color-primary-active); border-color: var(--color-primary-active); }
.hl-landing .hl-button-secondary { color: var(--color-primary); background: var(--color-white); }
.hl-landing .hl-button-secondary:hover { color: var(--color-primary); background: var(--color-bg-tint-blue); border-color: var(--color-primary); }
.hl-landing .hl-button-secondary:active { background: var(--color-bg-tint-purple); }
.hl-landing .hl-text-link { display: inline-flex; align-items: center; gap: var(--hl-space-xs); font-weight: var(--weight-bold); }

/* Первый экран: продукт и люди, уже рекомендующие платформу. */
.hl-hero { display: grid; grid-template-columns: 1fr 1.05fr; gap: var(--hl-space-lg); align-items: center; padding-block: var(--space-section); }
.hl-hero .hl-eyebrow { display: inline-block; color: var(--color-primary); background: var(--color-bg-tint-blue); padding: var(--hl-space-xs) var(--hl-space-sm); border-radius: var(--radius-xl); }
.hl-landing .hl-lead { font-size: var(--text-lg); line-height: var(--leading-normal); margin-bottom: var(--hl-space-md); max-width: var(--max-width-text); color: var(--color-muted); }
.hl-benefits { display: flex; flex-wrap: wrap; gap: var(--hl-space-xs) var(--hl-space-sm); margin: var(--hl-space-md) 0 0; padding: 0; list-style: none; font-size: var(--text-sm); color: var(--color-muted); }
.hl-benefits li::before { content: '✓'; color: var(--color-success-text); margin-right: calc(var(--hl-space-xs) / 2); font-weight: var(--weight-bold); }
.hl-landing .hl-hero-community { display: flex; align-items: center; gap: var(--hl-space-sm); margin-top: var(--hl-space-lg); text-decoration: none; }
.hl-avatar-stack { display: flex; flex-shrink: 0; padding-left: 0; }
.hl-avatar-stack img { width: var(--h-big); height: var(--h-big); border: medium solid var(--color-white); border-radius: 50%; object-fit: cover; object-position: center 25%; background: var(--color-bg-tint-purple); }
.hl-avatar-stack img + img { margin-left: calc(-1 * var(--hl-space-sm)); }
.hl-hero-community > span:last-child { display: flex; flex-direction: column; font-size: var(--text-sm); line-height: var(--leading-relaxed); }
.hl-hero-community > span:last-child > span { color: var(--color-muted); font-size: var(--text-xs); }
.hl-hero-community:hover strong { text-decoration: underline; }
.hl-hero-visual { margin: 0; min-width: 0; }
.hl-hero-stage { position: relative; isolation: isolate; padding: var(--hl-space-md); background: var(--gradient-brand-panel); border-radius: var(--radius-xl); }
.hl-stage-label { display: block; margin-bottom: var(--hl-space-sm); color: var(--color-primary); font-size: var(--text-xs); font-weight: var(--weight-bold); }
.hl-hero-catalog { display: block; width: 100%; height: auto; border-radius: var(--radius-md); }
.hl-hero-visual figcaption { margin: var(--hl-space-sm) var(--hl-space-xs) 0; color: var(--color-caption); font-size: var(--text-xs); text-align: center; }
.hl-landing .hl-hero-recommendation { position: relative; z-index: 1; display: flex; align-items: center; gap: var(--hl-space-sm); width: 94%; margin: calc(-1 * var(--h-big)) 0 0 calc(-1 * var(--hl-space-sm)); padding: var(--hl-space-sm); border: thin solid var(--border-default); border-radius: var(--radius-md); background: var(--color-white); box-shadow: var(--shadow-modal); text-decoration: none; }
.hl-hero-recommendation > img { flex-shrink: 0; width: calc(var(--h-big) + var(--hl-space-md)); height: calc(var(--h-big) + var(--hl-space-md)); border-radius: var(--radius-sm); object-fit: cover; }
.hl-hero-recommendation > span > span { display: block; font-size: var(--text-xs); color: var(--color-muted); }
.hl-hero-recommendation strong { display: block; margin-block: calc(var(--hl-space-xs) / 2); color: var(--color-heading); font-size: var(--text-md); line-height: var(--leading-heading); }
.hl-hero-recommendation .hl-recommendation-label { color: var(--color-primary); font-weight: var(--weight-bold); }

/* Меню разделов в потоке страницы; горизонтальная прокрутка остаётся нативной. */
.hl-section-nav { position: relative; top: auto; z-index: auto; display: flex; align-items: center; gap: var(--hl-space-sm); padding-block: var(--hl-space-xs); border-block: thin solid var(--border-default); background: var(--color-white); }
.hl-nav-scroll { display: flex; flex: 1; min-width: 0; gap: var(--hl-space-md); overflow-x: auto; scrollbar-width: none; }
.hl-nav-scroll::-webkit-scrollbar { display: none; }
.hl-nav-scroll a { display: flex; flex-shrink: 0; align-items: center; min-height: var(--but-card-height); white-space: nowrap; font-size: var(--text-base); text-decoration: none; padding-inline: calc(var(--hl-space-xs) / 2); }
.hl-nav-scroll a:hover { text-decoration: underline; }
.hl-landing .hl-nav-cta { flex-shrink: 0; min-height: var(--but-card-height); padding-inline: var(--hl-space-sm); font-size: var(--text-base); }
.hl-section { padding-top: var(--space-section); }
.hl-section-heading { max-width: var(--max-width-text); margin-bottom: var(--hl-space-lg); }
.hl-section-heading > p:last-child { color: var(--color-muted); margin-bottom: 0; }
.hl-grid { display: grid; gap: var(--hl-space-md); }
.hl-grid-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hl-grid-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hl-card { min-width: 0; padding: var(--hl-space-md); border: thin solid var(--border-default); border-radius: var(--radius-lg); background: var(--color-white); margin: 0; }
.hl-card > p { color: var(--color-muted); }
.hl-card > p:last-child { margin-bottom: 0; }
.hl-number { display: inline-block; color: var(--color-primary); font-size: var(--text-2xl); font-weight: var(--weight-bold); margin-bottom: var(--hl-space-md); letter-spacing: var(--tracking-tight); }
.hl-channel { display: flex; flex-direction: column; align-items: flex-start; background: var(--color-bg-tint-blue); border-color: transparent; }
.hl-channel:nth-child(2) { background: var(--color-accent-green-bg); }
.hl-channel:nth-child(3) { background: var(--color-accent-purple-bg); }
.hl-channel-top { display: flex; align-items: center; justify-content: space-between; width: 100%; margin-bottom: var(--hl-space-md); color: var(--color-primary); }
.hl-channel-top .hl-number { margin: 0; }
.hl-channel-top svg { width: var(--h-small); height: var(--h-small); }
.hl-channel .hl-text-link { margin-top: auto; font-size: var(--text-base); }
.hl-contact-strip { display: grid; grid-template-columns: 1fr 2fr; align-items: start; gap: var(--hl-space-md); margin-top: var(--hl-space-md); padding: var(--hl-space-md); border-radius: var(--radius-md); border: thin solid var(--border-default); }
.hl-contact-strip strong { font-size: var(--text-xl); line-height: var(--leading-heading); }
.hl-contact-strip p { margin: 0; color: var(--color-muted); }

/* Открытые иллюстрации кабинета вместо скрытых и однотипных текстовых карточек. */
.hl-showcase { display: grid; grid-template-columns: 1.2fr 1fr; align-items: center; gap: var(--hl-space-lg); padding: var(--hl-space-lg); background: var(--gradient-brand-panel); border-radius: var(--radius-xl); }
.hl-showcase-media { margin: 0; min-width: 0; }
.hl-media-link { position: relative; display: block; border-radius: var(--radius-md); }
.hl-media-link img { display: block; width: 100%; height: auto; border-radius: var(--radius-md); }
.hl-showcase-media img { box-shadow: var(--shadow-modal); }
.hl-zoom-label { position: absolute; display: flex; align-items: center; gap: var(--hl-space-xs); right: var(--hl-space-xs); bottom: var(--hl-space-xs); padding: var(--hl-space-xs); background: var(--color-primary); color: var(--color-white); border-radius: var(--radius-xs); font-size: var(--text-xs); opacity: 0; transition: opacity var(--transition); }
.hl-media-link:hover .hl-zoom-label, .hl-media-link:focus-visible .hl-zoom-label { opacity: 1; }
.hl-showcase-copy h3 { font-size: var(--sub-h); }
.hl-showcase-copy p { color: var(--color-muted); }
.hl-showcase-copy .hl-text-link { font-size: var(--text-base); }
.hl-showcase-media figcaption, .hl-visual-media figcaption { margin-top: var(--hl-space-sm); color: var(--color-caption); font-size: var(--text-xs); line-height: var(--leading-relaxed); }
.hl-checklist { padding: 0; margin: 0 0 var(--hl-space-sm); list-style: none; }
.hl-checklist li { position: relative; padding-left: var(--hl-space-md); margin-bottom: var(--hl-space-xs); }
.hl-checklist li::before { position: absolute; left: 0; content: '✓'; color: var(--color-success-text); font-weight: var(--weight-bold); }
.hl-visual-grid, .hl-benefit-grid { margin-top: var(--hl-space-md); }
.hl-visual-card { display: flex; flex-direction: column; min-width: 0; border: thin solid var(--border-default); border-radius: var(--radius-xl); padding-bottom: var(--hl-space-md); }
.hl-visual-copy { padding: var(--hl-space-md) var(--hl-space-md) 0; }
.hl-visual-copy p { color: var(--color-muted); }
.hl-visual-media { flex: 1; margin: 0 var(--hl-space-md); padding: var(--hl-space-md); border-radius: var(--radius-md); background: var(--color-bg-tint-blue); }
.hl-media-practice img { aspect-ratio: 4 / 3; object-fit: contain; background: var(--color-white); }
.hl-media-business { background: var(--color-bg-tint-purple); }
.hl-media-business .hl-media-link { width: 82%; }
.hl-business-front { transform: rotate(-3deg); z-index: 1; }
.hl-business-back { margin-left: auto; margin-top: -22%; transform: rotate(3deg); }
.hl-media-business img { box-shadow: var(--shadow-modal); }
.hl-media-business figcaption { margin-top: var(--hl-space-md); }
.hl-landing .hl-note { font-size: var(--text-sm); line-height: var(--leading-relaxed); color: var(--color-muted); margin-top: var(--hl-space-sm); margin-bottom: 0; }
.hl-visual-card > .hl-note { padding-inline: var(--hl-space-md); }
.hl-workflow-card { background: var(--color-blend); border-color: transparent; }
.hl-stat-path { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: var(--hl-space-xs); padding-block: var(--hl-space-md); }
.hl-stat-path div { min-width: 0; }
.hl-stat-path strong { display: block; font-size: var(--text-base); }
.hl-stat-path div span { display: block; color: var(--color-muted); font-size: var(--text-xs); }
.hl-stat-path > span { color: var(--color-primary); }
.hl-editorial-note { padding: var(--hl-space-md) 0 0 var(--hl-space-md); margin-top: var(--hl-space-md); border-left: medium solid var(--color-bg-tint-purple); }
.hl-editorial-note strong { display: block; margin-bottom: var(--hl-space-xs); font-size: var(--text-lg); }
.hl-editorial-note p { color: var(--color-muted); font-size: var(--text-base); }
.hl-editorial-note p:last-child { margin-bottom: 0; }
.hl-section-actions { margin-top: var(--hl-space-lg); }
.hl-action-note { color: var(--color-muted); font-size: var(--text-sm); }
