/* uni-kom.ru — общий стиль (светлый вариант) */
:root{--red:#B31B34;--red2:#951429;--ink:#1D2026;--text:#3C414B;--muted:#6B717C;--line:#E6E8EC;--bg:#FFFFFF;--soft:#F5F6F8;--r:14px;--max:1240px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 Manrope,Arial,sans-serif}
img{max-width:100%;height:auto;vertical-align:middle}
a{color:var(--red)}a:hover{color:var(--red2)}
p{margin:0 0 1em}
h1,h2,h3{color:var(--ink);line-height:1.15;letter-spacing:-.01em}
h2{margin:.3em 0 .6em;font-weight:800}
.eyebrow{margin:0 0 10px;color:var(--red);font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.f7{font-size:clamp(26px,3.2vw,42px);line-height:1.15;font-weight:800;color:var(--ink);letter-spacing:-.01em}
.f6{font-size:clamp(20px,2.1vw,28px);line-height:1.2;font-weight:800;color:var(--ink)}
.f5{font-size:clamp(18px,1.6vw,22px);line-height:1.3;font-weight:700}
.f4{font-size:18px}.f3{font-size:16px;line-height:1.6}.f2{font-size:14px}.f1{font-size:12px}
.c{text-align:center}.r{text-align:right}

/* шапка */
.hd{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.hd__in{max-width:var(--max);margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:28px}
.hd__logo{flex:none;line-height:0}.hd__logo img{width:150px;height:auto}
.hd__nav{display:flex;gap:22px;flex:1;font-weight:600;font-size:15px}
.hd__nav a{text-decoration:none;color:var(--ink);white-space:nowrap}.hd__nav a:hover,.hd__nav a[aria-current]{color:var(--red)}
.hd__act{display:flex;align-items:center;gap:16px;margin-left:auto}
.hd__tel{font-weight:700;color:var(--ink);white-space:nowrap}
.burger{display:none;flex:none;width:42px;height:42px;border:0;border-radius:50%;background:var(--soft);cursor:pointer;place-items:center;padding:0}
.burger span,.burger span::before,.burger span::after{display:block;width:18px;height:2px;background:var(--ink);border-radius:2px;position:relative;content:"";transition:transform .2s}
.burger span::before{position:absolute;top:-6px}.burger span::after{position:absolute;top:6px}
.hd.is-open .burger span{background:transparent}.hd.is-open .burger span::before{transform:translateY(6px) rotate(45deg)}.hd.is-open .burger span::after{transform:translateY(-6px) rotate(-45deg)}
.mnav{display:none;border-top:1px solid var(--line);background:#fff;max-height:calc(100vh - 66px);overflow-y:auto}
.hd.is-open .mnav{display:block}
.mnav__in{max-width:var(--max);margin:0 auto;padding:12px 24px 24px;display:grid;grid-template-columns:1fr 1fr;gap:4px 32px}
.mnav a{display:block;padding:9px 0;color:var(--ink);text-decoration:none;font-weight:600;border-bottom:1px solid var(--line)}
.mnav__h{grid-column:1/-1;margin:14px 0 2px;color:var(--red);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.mnav__tel{grid-column:1/-1;margin-top:14px;font-weight:700;color:var(--ink)}

/* поиск */
.search{position:relative;width:220px}
.search__row{display:flex;align-items:center;background:var(--soft);border:1px solid transparent;border-radius:999px;padding:0 6px 0 14px;transition:border-color .2s,background .2s}
.search__row:focus-within{border-color:var(--ink);background:#fff}
.search input{flex:1;min-width:0;border:0;background:transparent;padding:9px 0;font:inherit;font-size:14px;color:var(--ink);outline:none}
.search input::placeholder{color:var(--muted)}
.search input::-webkit-search-cancel-button{display:none}
.search button{border:0;background:transparent;color:var(--muted);cursor:pointer;display:flex;align-items:center;padding:6px 8px;border-radius:50%}
.search button:hover,.search button:focus-visible{color:var(--red);outline:none}
.search__list{position:absolute;z-index:60;right:0;top:100%;width:360px;max-width:calc(100vw - 32px);margin:8px 0 0;padding:6px;list-style:none;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:0 18px 40px rgba(29,32,38,.16);max-height:70vh;overflow-y:auto}
.search__list[hidden]{display:none}
.search__list a{display:block;padding:9px 12px;border-radius:10px;text-decoration:none;color:var(--text);font-size:14px;line-height:1.35}
.search__list a b{display:block;color:var(--ink);font-weight:700}
.search__list a span{display:block;font-size:12px;color:var(--muted)}
.search__list a:hover,.search__list a.is-active{background:var(--soft)}
.search__none{padding:9px 12px;font-size:14px;color:var(--muted)}

/* главная: первый экран */
.hero{max-width:var(--max);margin:0 auto;padding:32px 24px 0;display:grid;gap:28px}
.hero__media{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:1366/600;background:#d9dbe0;box-shadow:0 20px 50px rgba(29,32,38,.12)}
.hero__media img,.hero__media video{display:block;width:100%;height:100%;object-fit:cover}
.hero__play{position:absolute;left:24px;bottom:24px;width:60px;height:60px;border:0;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 8px 20px rgba(179,27,52,.4);transition:transform .2s,background .2s}
.hero__play:hover{background:var(--red2);transform:scale(1.06)}
.hero__play svg{width:22px;height:22px;margin-left:3px;fill:#fff}
.hero__text{display:grid;grid-template-columns:1.3fr 1fr;gap:14px 48px;align-items:end}
.hero__text .eyebrow{grid-column:1/-1}
.hero h1{margin:0;font-size:clamp(30px,4vw,52px);font-weight:800}
.hero h1 .title__sub{display:block;margin-top:14px;font-size:clamp(17px,1.6vw,22px);font-weight:600;color:var(--muted);letter-spacing:0;line-height:1.35}
.lead{margin:0 0 18px;font-size:18px}
.btns{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;padding:13px 22px;border-radius:999px;font-weight:700;text-decoration:none;font-size:15px;transition:background .2s,color .2s}
.btn--main{background:var(--red);color:#fff}.btn--main:hover{background:var(--red2);color:#fff}
.btn--ghost{border:1.5px solid var(--ink);color:var(--ink)}.btn--ghost:hover{background:var(--ink);color:#fff}
.nums{max-width:var(--max);margin:44px auto 0;padding:0 24px;display:grid;grid-template-columns:repeat(4,1fr)}
.nums div{padding:18px 20px;border-left:1px solid var(--line)}.nums div:first-child{border-left:0;padding-left:0}
.nums b{display:block;font-size:28px;color:var(--ink);font-weight:800;line-height:1.2}.nums span{color:var(--muted);font-size:14px}

/* секции главной */
.sec{max-width:var(--max);margin:0 auto;padding:80px 24px 0}
.sec--alt{max-width:none;background:var(--soft);margin-top:80px;padding:72px 24px}
.sec--alt>*{max-width:calc(var(--max) - 48px);margin-left:auto;margin-right:auto}
.sec__head{margin-bottom:32px}.sec__head h2{margin:0;font-size:clamp(26px,3vw,40px)}
.sec__head--row{display:flex;justify-content:space-between;align-items:end;gap:20px}
.more{font-weight:700;text-decoration:none;white-space:nowrap}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.pc{display:flex;gap:18px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:var(--r);text-decoration:none;background:#fff;transition:box-shadow .25s,transform .25s,border-color .25s}
.pc:hover{box-shadow:0 14px 34px rgba(29,32,38,.12);transform:translateY(-3px);border-color:transparent}
.pc__img{flex:none;width:150px;aspect-ratio:1;border-radius:10px;overflow:hidden}
.pc__img img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s}.pc:hover .pc__img img{transform:scale(1.06)}
.pc__body{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.pc__body b{font-size:20px;color:var(--ink);font-weight:800}.pc__body span{font-size:14px;color:var(--muted);line-height:1.45}
.pc__go{font-style:normal;color:var(--red);font-weight:800;margin-top:6px}
.partner{margin:24px 0 0;color:var(--muted);font-size:15px}.partner a{font-weight:700}
.advs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.adv{background:#fff;border-radius:var(--r);padding:26px}
.adv svg{width:36px;height:36px;fill:none;stroke:var(--red);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;margin-bottom:14px}
.adv h3{font-size:19px;margin:0 0 8px}.adv p{margin:0;font-size:15px}
.prs{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.pr{margin:0;position:relative;border-radius:var(--r);overflow:hidden}
.pr:first-child{grid-column:1/-1}
.pr img{display:block;width:100%;aspect-ratio:1366/600;object-fit:cover}
.pr figcaption{position:absolute;left:0;right:0;bottom:0;padding:28px 18px 14px;color:#fff;font-weight:700;font-size:15px;background:linear-gradient(transparent,rgba(0,0,0,.6))}
.seo{display:grid;grid-template-columns:1fr 1fr;gap:12px 48px}
.seo h2{grid-column:1/-1;margin:0 0 8px;font-size:clamp(24px,2.6vw,34px)}
.seo h3{margin:0 0 6px;font-size:19px}
.seo p{margin:0 0 14px}

/* призыв и подвал */
.cta{max-width:calc(var(--max) - 48px);margin:80px auto;padding:44px 48px;border-radius:24px;background:var(--ink);color:#C9CCD3;display:flex;justify-content:space-between;align-items:center;gap:32px}
.cta h2{color:#fff;font-size:clamp(22px,2.4vw,32px);margin:0 0 8px}.cta p{margin:0}
.cta__c{display:flex;flex-direction:column;gap:2px;text-align:right}.cta__c b{color:#fff;font-size:22px;white-space:nowrap}
.ft{border-top:1px solid var(--line);background:#fff}
.ft__in{max-width:var(--max);margin:0 auto;padding:48px 24px;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;font-size:14px}
.ft .ft__h{margin:0 0 12px;color:var(--ink);font-size:15px;font-weight:800}.ft p{margin:0 0 10px;color:var(--muted)}
.ft__logo{width:150px;height:auto;margin-bottom:14px}
.ft ul{list-style:none;margin:0;padding:0}.ft li{margin:0 0 8px}
.ft a{color:var(--text);text-decoration:none}.ft a:hover{color:var(--red)}
.ft__bot{border-top:1px solid var(--line);text-align:center;padding:16px;color:var(--muted);font-size:13px}

/* внутренние страницы */
.page{max-width:var(--max);margin:0 auto;padding:0 0 8px}
.crumbs{padding:20px 24px 0;font-size:14px;color:var(--muted)}
.crumbs a{color:var(--muted);text-decoration:none}.crumbs a:hover{color:var(--red)}
.crumbs [aria-current]{color:var(--ink);font-weight:600}
.ptitle{padding:18px 24px 26px;text-align:left}
.ptitle h1{margin:0;font-size:clamp(30px,4vw,50px);font-weight:800}
.ptitle .title__sub,.title__sub{display:block;margin-top:12px;font-size:clamp(16px,1.5vw,21px);font-weight:600;color:var(--muted);letter-spacing:0;line-height:1.35}
.hero-img{margin:0 24px 40px;border-radius:var(--r);overflow:hidden;aspect-ratio:1366/600;background:#d9dbe0;box-shadow:0 20px 50px rgba(29,32,38,.10)}
.hero-img img,.hero-img video{display:block;width:100%;height:100%;object-fit:cover}
.anchor{display:block;position:relative;top:-10px}
.line{height:1px;background:var(--line);margin:32px 24px}
.sp{max-height:48px}
.row{display:grid;grid-template-columns:var(--cols);gap:0 32px;padding:0 24px;margin:0 0 16px}
.row.imgs{gap:28px 24px;align-items:start}
.row.n1{padding:0 24px}
.row.n3.imgs>.cell:last-child:nth-child(3n+1){grid-column:2}
.colh{margin:.2em 0 .6em;line-height:1.2}
.cell{min-width:0;overflow-wrap:break-word}
.cell.mid{align-self:center}
.cell img{margin-bottom:8px;border-radius:10px}
.cell a img{transition:transform .3s,box-shadow .3s}
.cell a:hover img{transform:translateY(-3px);box-shadow:0 14px 30px rgba(29,32,38,.14)}
img.bd{border:1px solid var(--line)}
.swap{position:relative;display:inline-block;line-height:0;border-radius:10px;overflow:hidden}
.swap img{margin:0}
.swap .hov{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;transition:opacity .2s}
.swap:hover .hov,.swap:focus-visible .hov{opacity:1}
.cell a img[src$="pdf.jpg"],.cell a img[src$="pdf.gif"]{border-radius:0;box-shadow:none!important;transform:none!important}
.title{margin:0;font-size:clamp(26px,3.4vw,44px);line-height:1.2;font-weight:800}
.sections{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;padding:0 24px;margin:0 0 28px}
.sections a{padding:9px 18px;border-radius:999px;background:var(--soft);color:var(--ink);text-decoration:none;font-weight:700;font-size:15px}
.sections a:hover{background:var(--ink);color:#fff}
.banner,.hero--old{min-height:var(--h);display:flex;align-items:center;justify-content:center;text-align:center;padding:28px 24px;margin:0 24px 24px;border-radius:var(--r);background-size:cover;background-position:center;background-color:#8a8a8a;overflow:hidden}
.banner__in{max-width:1000px}.banner__in p{margin:.25em 0}.banner__in h2{margin:.2em 0}.banner__in a{color:inherit}
.tiles{display:grid;gap:12px;grid-template-columns:repeat(3,minmax(0,1fr));padding:0 24px;margin:0 0 24px}
.tiles.n2{grid-template-columns:repeat(2,minmax(0,1fr))}.tiles.n4{grid-template-columns:repeat(4,minmax(0,1fr))}
.tile{min-width:0;border-radius:var(--r);background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;text-align:center;padding:12px}
.price-call{margin:8px 0 24px;font-size:18px}
.docs{display:flex;flex-wrap:wrap;gap:12px;padding:24px 24px 0}
.docs a{display:flex;align-items:center;gap:10px;padding:10px 16px 10px 10px;border:1px solid var(--line);border-radius:12px;color:var(--ink);text-decoration:none;font-weight:600;font-size:14px}
.docs a:hover{border-color:var(--red);color:var(--red)}
.docs img{width:32px;height:40px}

/* галерея проектов */
.gal{padding:8px 24px 12px}
.gal__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.gal__item{display:block;text-decoration:none;color:var(--text)}
.gal__item img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:12px;transition:transform .3s,box-shadow .3s}
.gal__item:hover img,.gal__item:focus-visible img{transform:translateY(-3px);box-shadow:0 14px 30px rgba(29,32,38,.14)}
.gal__cap{display:block;font-size:14px;padding-top:8px;color:var(--ink);font-weight:600}
.lb{position:fixed;inset:0;z-index:100;background:rgba(20,22,26,.94);display:flex;align-items:center;justify-content:center;padding:48px 56px}
.lb[hidden]{display:none}
.lb__fig{margin:0;max-width:100%;max-height:100%;text-align:center;color:#C9CCD3;font-size:14px}
.lb__img{max-width:100%;max-height:calc(100vh - 140px);width:auto;height:auto;border-radius:8px}
.lb__cap{padding-top:10px}
.lb button{position:absolute;background:rgba(255,255,255,.08);border:0;border-radius:50%;width:52px;height:52px;color:#fff;cursor:pointer;font:32px/1 Manrope,Arial,sans-serif;display:grid;place-items:center}
.lb button:hover,.lb button:focus-visible{background:var(--red);outline:none}
.lb__close{top:12px;right:12px}.lb__prev{left:10px;top:50%;transform:translateY(-50%)}.lb__next{right:10px;top:50%;transform:translateY(-50%)}

/* аспекты шпона */
.asp-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,500px);gap:40px;padding:8px 24px;align-items:start}
.asp-intro__img img,.asp__img img{display:block;width:100%;height:auto;border-radius:12px}
.asp-toc{display:grid;grid-template-columns:1fr 1fr;gap:8px 40px;margin:20px 24px 0;padding:22px 26px;background:var(--soft);border-radius:var(--r)}
.asp-toc__h{font-size:18px;font-weight:800;color:var(--ink);margin:0 0 8px}
.asp-toc ul{margin:0;padding-left:20px}.asp-toc li{margin:4px 0}
.asp-h{margin:8px 0 24px}
.asp{display:grid;grid-template-columns:minmax(0,500px) minmax(0,1fr);gap:40px;padding:0 24px;margin:0 0 40px;align-items:start;scroll-margin-top:90px}
.asp--rev .asp__img{order:2}
.asp__text h3{margin:0 0 .6em;line-height:1.2}.asp__text h3.f5{margin-top:1.4em}
.asp-sub{font-size:.7em}.asp-more{padding:0 24px;margin:0 0 24px}

/* старые страницы ЮНИКС */
.leg{display:grid;grid-template-columns:minmax(0,500px) minmax(0,1fr);gap:40px;padding:0 24px;align-items:start}
.leg__img img{display:block;width:100%;height:auto;border-radius:12px}
.leg__text{min-width:0;overflow-wrap:anywhere}
.series{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;padding:36px 24px 8px}
.series a,.series span{padding:8px 16px;border-radius:999px;background:var(--soft);color:var(--ink);text-decoration:none;font-weight:700;font-size:14px}
.series a:hover{background:var(--ink);color:#fff}.series [aria-current]{background:var(--red);color:#fff}
.stub{display:grid;grid-template-columns:repeat(2,minmax(0,360px));justify-content:center;gap:32px;padding:8px 24px;text-align:center}
.stub a{color:var(--ink);font-weight:700;text-decoration:none}
.stub img{display:block;width:100%;height:auto;margin-bottom:10px;border-radius:12px}
.lead2{max-width:900px;margin:0 0 28px;padding:0 24px;color:var(--muted);font-size:18px}

@media(max-width:1288px){.cta{margin-left:24px;margin-right:24px}}
@media(max-width:1100px){
 .hd__nav{display:none}.burger{display:grid}
 .grid,.advs{grid-template-columns:repeat(2,minmax(0,1fr))}
 .row.n3,.row.n4,.row.n5,.row.n6{grid-template-columns:repeat(2,minmax(0,1fr))}
 .cell.empty{display:none}
 .ft__in{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
 html{scroll-padding-top:70px}
 .hd__in{padding:10px 16px;gap:10px}.hd__logo img{width:110px}.hd__tel{display:none}
 .hd__act{flex:1;min-width:0}.search{width:auto;flex:1;min-width:0}.search input{font-size:16px}
 .search__list{right:auto;left:0;width:calc(100vw - 32px)}
 .mnav__in{grid-template-columns:1fr;padding:8px 16px 20px}
 .hero{padding:16px 16px 0;gap:20px}.hero__text{grid-template-columns:1fr}.hero__play{width:46px;height:46px;left:14px;bottom:14px}
 .nums{grid-template-columns:repeat(2,1fr);padding:0 16px}.nums b{font-size:22px}.nums div{border-left:0;padding:14px 0}
 .sec{padding:56px 16px 0}.sec--alt{padding:52px 16px;margin-top:56px}.sec__head--row{flex-direction:column;align-items:flex-start}
 .grid,.advs,.seo{grid-template-columns:minmax(0,1fr)}.pc__img{width:110px}.pc__body b{font-size:18px}
 .prs{grid-template-columns:1fr}
 .cta{margin:56px 16px;padding:28px 22px;flex-direction:column;align-items:flex-start}.cta__c{text-align:left}
 .ft__in{grid-template-columns:1fr;padding:36px 16px;gap:24px}
 .crumbs{padding:14px 16px 0}.ptitle{padding:12px 16px 20px}
 .hero-img{margin:0 16px 28px}
 .line{margin:24px 16px}
 .row,.row.n1{grid-template-columns:minmax(0,1fr)!important;padding:0 16px;row-gap:20px}
 .row.imgs{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px 12px}
 .row.imgs.n1{grid-template-columns:minmax(0,1fr)!important}
 .row.imgs>.cell:last-child:nth-child(odd){grid-column:1/-1;justify-self:center;width:calc(50% - 6px)}
 .banner,.hero--old{min-height:calc(var(--h)*.7);margin:0 16px 20px}
 .tiles,.tiles.n2,.tiles.n4{grid-template-columns:1fr;padding:0 16px}
 .sections,.docs,.series{padding-left:16px;padding-right:16px}
 .gal{padding:8px 16px 12px}.gal__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .asp-intro,.asp,.leg{grid-template-columns:minmax(0,1fr);gap:16px;padding:0 16px}
 .asp--rev .asp__img{order:0}
 .asp-toc{grid-template-columns:1fr;margin:16px 16px 0;padding:16px}
 .stub{grid-template-columns:minmax(0,1fr)}
 .lead2{padding:0 16px}
 .lb{padding:56px 8px}.lb__prev,.lb__next{top:auto!important;bottom:10px;transform:none!important}
}
/* доп. оформление блоков ЮНИКС и галереи */
.wp__img img,.ux-card img,.ux-custom img{border-radius:12px}
.doc img{border-radius:6px}
.ux-tags li{border-radius:999px;padding:7px 14px!important}
.ux-card:hover b{color:var(--red)}
.gallery{padding:0 24px!important;gap:20px!important}
.gallery a{border-radius:12px}
@media(max-width:600px){.gallery{padding:0 16px!important;gap:12px!important}}
.gal-more a{padding:9px 18px;border-radius:999px;background:var(--soft);color:var(--ink);text-decoration:none;font-weight:700;font-size:15px}.gal-more a:hover{background:var(--ink);color:#fff}
