/* Brand Sprint 4. Public HTML only; load after seo-pages and product-directions.
   Tokens → UI primitives → legacy layout → product architecture → this layer.
   No cabinet/backend stylesheet imports this file. */
.public-brand {
  --ink: var(--httb-dark); --blue: var(--httb-green);
  --muted: var(--httb-color-text-secondary); --bg: var(--httb-cloud);
  --line: var(--httb-color-border);
  background: var(--httb-white); color: var(--httb-dark);
  font-family: var(--httb-font-sans); line-height: var(--httb-line-relaxed);
}
.public-brand .wrap {max-width:1200px; padding-inline:32px}
.public-brand .top .wrap {min-height:82px;gap:24px}
.public-brand .top .nav {gap:24px;align-items:center}
.public-brand .top .nav a {color:var(--httb-dark);font-size:14px;font-weight:600;min-height:44px;display:inline-flex;align-items:center}
.public-brand .top .nav a:hover {color:var(--httb-green)}
.public-brand .public-login {border:1px solid var(--httb-color-border);border-radius:var(--httb-radius-md);padding:8px 14px}
.public-brand .brand img,.public-footer img {width:138px;height:40px;object-fit:contain}
.public-footer img {filter:brightness(0) invert(1)}
.public-brand .hero,.public-brand.product-page .hero {background:var(--httb-cloud);padding:64px 0}
.public-brand h1 {font-size:clamp(34px,4.5vw,58px);line-height:1.1;letter-spacing:-.035em;max-width:950px}
.public-brand h2 {font-size:clamp(25px,3vw,36px);line-height:var(--httb-line-tight);letter-spacing:-.025em}
.public-brand h3 {font-size:20px;line-height:1.3}
.public-brand .lead {color:var(--httb-color-text-secondary);font-size:clamp(18px,2vw,21px);max-width:800px}
.public-brand .product-direction-label,.public-brand .eyebrow {font-size:13px;letter-spacing:.05em;font-weight:700;color:var(--httb-green)}
.public-brand section {padding-block:64px}
.public-brand .service-need {padding-bottom:40px}
.public-brand .service-need h2 {margin-top:8px}
.public-brand .btn {display:inline-flex;align-items:center;justify-content:center;min-height:48px;border:1px solid transparent;border-radius:var(--httb-radius-md);font:700 15px/1.5 var(--httb-font-sans);padding:13px 22px;cursor:pointer}
.public-brand .btn.alt {border-color:var(--httb-color-border);background:var(--httb-white);color:var(--httb-dark)}
.public-brand .btn:hover {box-shadow:var(--httb-shadow-sm)}
.public-brand :is(.card,.role,.person-placeholder,.product-crosslinks>a) {border:1px solid var(--httb-color-border);border-radius:var(--httb-radius-lg);padding:24px;background:var(--httb-white)}
.public-brand :is(.card,.role,.person-placeholder) p {color:var(--httb-color-text-secondary)}
.public-brand .trustbar {background:var(--httb-dark);padding-block:28px}
.public-brand .trustitem {border-radius:var(--httb-radius-lg)}
.public-brand .trustitem span {color:var(--httb-white)}
.public-brand .role .mark,.public-brand .person-placeholder .avatar {border-radius:var(--httb-radius-md);background:var(--httb-cloud);color:var(--httb-green);font-family:var(--httb-font-sans)}
.public-brand .scenario {gap:24px;padding:24px;background:var(--httb-white);border:1px solid var(--httb-color-border);border-radius:var(--httb-radius-lg);margin-block:12px}
.public-brand .scenario .label {margin:0;font-size:16px;line-height:1.5;color:var(--httb-green)}
.public-brand .steps,.public-brand .product-ecosystem {background:var(--httb-cloud)}
.public-brand .proof-note {background:var(--httb-cloud);border-left-color:var(--httb-green);border-radius:0 var(--httb-radius-lg) var(--httb-radius-lg) 0}
.public-brand .content {max-width:1000px}
.public-brand .content h2:first-child {margin-top:0}
.public-brand .content :is(p,li) {color:var(--httb-color-text-secondary)}
.public-brand .content .brand-promise {color:var(--httb-green);font-size:24px;font-weight:700}
.public-brand .people-grid {grid-template-columns:repeat(3,minmax(0,1fr))}
.public-brand .person-placeholder h3 {margin-bottom:12px}
.public-brand .person-placeholder p {margin-bottom:0}
.public-brand .product-office p {color:var(--httb-white)}
.public-brand .product-office .product-label {color:var(--httb-active)}
.public-brand .product-capabilities div {border-radius:var(--httb-radius-lg)}
.public-brand .product-crosslinks span,.public-brand .industry-link {color:var(--httb-color-text-secondary)}
.public-brand .all-directions {grid-template-columns:repeat(4,minmax(0,1fr))}
.public-brand .industry-banner {background:var(--httb-cloud);border-color:var(--httb-color-border)}
.public-brand .industry-banner span {color:var(--httb-color-text-secondary)}
.public-brand .industry-badge {display:inline-block;margin-left:12px;padding:4px 10px;border-radius:var(--httb-radius-pill);background:var(--httb-white);color:var(--httb-green);border:1px solid var(--httb-color-border)}
.public-brand .leadbox {border-radius:var(--httb-radius-lg);background:var(--httb-cloud);gap:48px;padding:40px}
.public-brand .leadbox h2 {margin-top:12px}
.public-brand .leadform :is(input,select,textarea) {border-radius:var(--httb-radius-md);color:var(--httb-dark);min-height:48px}
.public-brand .consent-check {display:grid;grid-template-columns:24px 1fr;gap:10px;align-items:start;font-size:13px;line-height:1.45;color:var(--httb-color-text-secondary)}
.public-brand .consent-check input {width:20px;height:20px;min-height:0;margin-top:1px}
.public-brand .consent-check a {color:var(--httb-green);text-decoration:underline}
html body.public-brand footer.public-footer {margin:0;background:var(--httb-dark);color:var(--httb-white);padding:56px 0;border:0}
.public-footer-grid {display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
.public-footer-grid b,.public-footer-grid a {display:block}
.public-footer-grid b {margin-bottom:12px}
.public-footer-grid a {font-size:14px;padding-block:7px;min-height:38px;text-decoration:none;overflow-wrap:anywhere}
.public-footer-grid p {margin-bottom:8px}
.public-footer-grid small {font-size:13px}
.footer-services {display:flex;gap:8px 24px;flex-wrap:wrap;border-top:1px solid var(--httb-color-text-secondary);margin-top:32px;padding-top:24px}
.footer-services a {font-size:13px;min-height:32px;padding-block:5px}
html body.public-brand footer a:hover {color:var(--httb-active)}
.public-brand footer a:focus-visible {outline-color:var(--httb-white);box-shadow:0 0 0 6px var(--httb-green)}
.public-brand :is(.product-cta,.industry-link a) {display:inline-flex;align-items:center;min-height:44px}
@media(max-width:1000px) {
  .public-brand .top .nav {gap:12px}
  .public-brand .top .nav a {font-size:13px}
  .public-brand .roles,.public-brand .people-grid,.public-brand .all-directions {grid-template-columns:repeat(2,minmax(0,1fr))}
  .public-footer-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px) {
  .public-brand .public-menu-toggle {display:block;min-height:44px;padding:8px 14px;border:1px solid var(--httb-color-text-secondary);border-radius:var(--httb-radius-md);background:var(--httb-white);color:var(--httb-dark);font-weight:700}
  .public-brand .top .nav {display:none;position:absolute;top:100%;left:16px;right:16px;background:var(--httb-white);border:1px solid var(--httb-color-border);border-radius:var(--httb-radius-lg);padding:14px;z-index:40;box-shadow:var(--httb-shadow-md)}
  .public-brand .top .nav.is-open {display:flex;flex-direction:column;align-items:stretch;gap:4px}
  .public-brand .top .nav a {font-size:16px;padding:8px 12px}
}
@media(max-width:600px) {
  .public-brand .wrap {padding-inline:24px}
  .public-brand .top .wrap {min-height:72px}
  .public-brand section,.public-brand .hero {padding-block:44px}
  .public-brand .actions {flex-direction:column;align-items:stretch}
  .public-brand .actions .btn {width:100%}
  .public-brand .roles,.public-brand .people-grid,.public-brand .all-directions,.public-footer-grid {grid-template-columns:1fr}
  .public-brand .leadbox {padding:20px;gap:24px}
  .public-brand .scenario {grid-template-columns:1fr;gap:10px;padding:20px}
  .public-brand .industry-badge {display:table;margin:8px 0 0}
  .public-brand .product-directions .wrap {gap:0;justify-content:space-between}
  .public-brand .product-directions a {padding-inline:7px}
  .public-brand .trustbar {padding-block:24px}
  .public-footer-grid a,.footer-services a {min-height:44px}
  .footer-services {flex-direction:column;gap:0}
}

/* New Brand Design 2026-09-22 — shared corporate-tech public layer. */
.public-brand{background:#fff;color:#0B1C30}
.public-brand .top{background:rgba(255,255,255,.97);border-bottom:1px solid rgba(11,28,48,.12);box-shadow:none}
.public-brand .top .wrap{min-height:88px}
.public-brand .brand{display:flex;align-items:center;gap:14px;text-decoration:none}
.public-brand .brand img{width:168px;height:52px}
.public-brand .brand::after{content:"Цифровой офис бизнеса";max-width:98px;padding-left:14px;border-left:1px solid rgba(11,28,48,.16);color:#006A61;font-size:10px;font-weight:750;line-height:1.25;letter-spacing:.06em;text-transform:uppercase}
.public-brand .top .nav a{position:relative;font-weight:700}
.public-brand .top .nav a:not(.public-login)::after{content:"";position:absolute;left:0;right:100%;bottom:3px;height:2px;background:#10B981;transition:right .2s}
.public-brand .top .nav a:hover::after,.public-brand .top .nav a:focus-visible::after{right:0}
.public-brand .public-login{border-radius:8px;border-color:rgba(11,28,48,.24);background:#fff}
.public-brand .hero,.public-brand.product-page .hero{position:relative;overflow:hidden;padding:76px 0;background-color:#F5F7F8;background-image:linear-gradient(rgba(11,28,48,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(11,28,48,.035) 1px,transparent 1px);background-size:32px 32px}
.public-brand .hero::after{content:"";position:absolute;right:-130px;top:-160px;width:430px;height:430px;background:rgba(16,185,129,.09);clip-path:polygon(38% 0,100% 0,100% 62%,72% 100%,0 72%);pointer-events:none}
.public-brand h1{font-size:clamp(40px,5vw,66px);line-height:1.02;letter-spacing:-.05em}
.public-brand .product-direction-label,.public-brand .eyebrow{display:inline-flex;align-items:center;gap:9px;color:#006A61;text-transform:uppercase;letter-spacing:.1em}
.public-brand .product-direction-label::before,.public-brand .eyebrow::before{content:"";width:8px;height:8px;background:#10B981;box-shadow:6px -6px 0 -2px #006A61}
.public-brand .btn{border-radius:8px;box-shadow:none}
.public-brand :is(.card,.role,.person-placeholder,.product-crosslinks>a){border-radius:10px;box-shadow:none}
.public-brand :is(.card,.role,.person-placeholder,.product-crosslinks>a):hover{border-color:#006A61}
.public-brand .role .mark,.public-brand .person-placeholder .avatar{border-radius:6px}
.public-brand .scenario,.public-brand .leadbox,.public-brand .product-capabilities div{border-radius:10px}
.public-brand .product-directions{border-block:1px solid rgba(11,28,48,.1);background:#fff}
.public-brand .product-directions a{font-weight:750}
.public-brand .product-office,.public-brand .trustbar{background:#0B1C30}
html body.public-brand footer.public-footer{background:#0B1C30}
.public-footer img{width:182px;height:52px;filter:none}
@media(max-width:1120px){.public-brand .brand::after{display:none}}
@media(max-width:600px){.public-brand .top .wrap{min-height:72px}.public-brand .brand img{width:150px;height:44px}.public-brand .hero,.public-brand.product-page .hero{padding:52px 0;background-size:24px 24px}.public-brand h1{font-size:clamp(36px,11vw,48px)}}

/* Reference-board alignment: organic nodes, clean white space, compact corporate-tech system. */
.public-brand .top .wrap{min-height:90px}.public-brand .brand img{width:205px;height:54px}.public-brand .brand::after{display:none}
.public-brand .hero,.public-brand.product-page .hero{padding:82px 0;background:#fff}
.public-brand .hero::before{content:"";position:absolute;right:-130px;top:-145px;width:410px;height:410px;border-radius:50%;background:rgba(16,185,129,.07);box-shadow:-145px 225px 0 -105px rgba(0,106,97,.12);pointer-events:none}
.public-brand .hero::after{right:6%;top:auto;bottom:-105px;width:245px;height:245px;border-radius:50%;clip-path:none;background:rgba(0,106,97,.07)}
.public-brand .hero>.wrap{position:relative;z-index:1}.public-brand .product-direction-label::before,.public-brand .eyebrow::before{width:22px;height:3px;box-shadow:none;border-radius:3px}
.public-brand :is(.card,.role,.person-placeholder,.product-crosslinks>a){border-color:rgba(11,28,48,.08);box-shadow:0 12px 34px rgba(11,28,48,.05)}
.public-brand .role .mark{border:0;background:rgba(0,106,97,.07);color:#006A61}
.public-brand .product-office{position:relative;overflow:hidden}.public-brand .product-office::after{content:"";position:absolute;right:-130px;bottom:-150px;width:380px;height:380px;border-radius:50%;background:rgba(16,185,129,.08)}
.public-brand .product-office>.wrap{position:relative;z-index:1}.public-footer{position:relative;overflow:hidden}.public-footer::after{content:"";position:absolute;right:-90px;bottom:-105px;width:260px;height:260px;border-radius:50%;background:rgba(16,185,129,.1)}.public-footer>.wrap{position:relative;z-index:1}.public-footer img{width:210px;height:auto}
@media(max-width:600px){.public-brand .brand img{width:170px;height:48px}.public-brand .hero,.public-brand.product-page .hero{padding:56px 0}.public-brand .hero::before{right:-270px}.public-footer img{width:190px}}
