/* SreDa — стили (собраны build.py) */
/* Шрифты со своего сервера (fonts/*.woff2, OFL 1.1). Montserrat — заголовки, Manrope — текст.
   У Manrope нет казахских букв ә ғ қ ң ұ: для них подставляется Onest (последнее правило Manrope),
   а казахские страницы целиком набираются Onest. */
@font-face{font-family:'Montserrat';font-style:normal;font-display:swap;font-weight:100 900;src:url(../fonts/montserrat-latin-wght-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Montserrat';font-style:normal;font-display:swap;font-weight:100 900;src:url(../fonts/montserrat-cyrillic-wght-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Montserrat';font-style:normal;font-display:swap;font-weight:100 900;src:url(../fonts/montserrat-cyrillic-ext-wght-normal.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:'Manrope';font-style:normal;font-display:swap;font-weight:200 800;src:url(../fonts/manrope-latin-wght-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Manrope';font-style:normal;font-display:swap;font-weight:200 800;src:url(../fonts/manrope-cyrillic-wght-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+2116}
@font-face{font-family:'Manrope';font-style:normal;font-display:swap;font-weight:200 800;src:url(../fonts/onest-cyrillic-wght-normal.woff2) format('woff2');unicode-range:U+04B0-04B1}
@font-face{font-family:'Manrope';font-style:normal;font-display:swap;font-weight:200 800;src:url(../fonts/onest-cyrillic-ext-wght-normal.woff2) format('woff2');unicode-range:U+0460-048F,U+0492-04AF,U+04B2-052F}
@font-face{font-family:'Onest';font-style:normal;font-display:swap;font-weight:100 900;src:url(../fonts/onest-latin-wght-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Onest';font-style:normal;font-display:swap;font-weight:100 900;src:url(../fonts/onest-cyrillic-wght-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Onest';font-style:normal;font-display:swap;font-weight:100 900;src:url(../fonts/onest-cyrillic-ext-wght-normal.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
html[lang="kk"] body,html[lang="kk"] button,html[lang="kk"] input,html[lang="kk"] select,html[lang="kk"] textarea{font-family:Onest,Manrope,system-ui,sans-serif}

body{margin:0;background:#F7F8FC}
a{color:#2F5BEA}a:hover{color:#1E3FB8}
*{box-sizing:border-box}
.h{font-family:Montserrat,system-ui,sans-serif}
.g-warm{background:linear-gradient(90deg,#FF7A1A,#FF3D7F 60%,#E0258F);-webkit-background-clip:text;background-clip:text;color:transparent}
.g-cool{background:linear-gradient(90deg,#F0287A,#8A3FF0);-webkit-background-clip:text;background-clip:text;color:transparent}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 26px;border-radius:12px;font:700 15px Manrope,system-ui,sans-serif;text-decoration:none;border:0;cursor:pointer}
.btn-p{background:linear-gradient(90deg,#F0287A,#8A3FF0 55%,#2F6BFF);color:#fff}
.btn-p:hover{color:#fff;filter:brightness(1.07)}
.btn-o{background:#fff;color:#141833;border:1.5px solid #DADDEA}
.btn-o:hover{color:#141833;border-color:#141833}
.btn-d{background:#141833;color:#fff}
.btn-d:hover{color:#fff;background:#262B52}
.ibtn{width:44px;height:44px;border-radius:12px;border:1.5px solid #E1E4EF;background:#fff;color:#141833;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:none;text-decoration:none}
.ibtn:hover{border-color:#141833;color:#141833}
.navlink{color:#141833;text-decoration:none;font-size:14px;font-weight:600}
.navlink:hover{color:#F0287A}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#6A7090}
.tab{display:flex;flex-direction:column;align-items:center;gap:6px;min-height:72px;padding:12px 6px;border:0;border-bottom:2px solid transparent;background:transparent;color:#5B6178;font:600 12px Manrope,system-ui,sans-serif;cursor:pointer;flex:1 1 0;min-width:78px}
.tab:hover{color:#141833}
.tab.on{color:#2F5BEA;border-bottom-color:#2F5BEA}
.chip{min-height:40px;padding:0 14px;border-radius:10px;border:1.5px solid #E1E4EF;background:#fff;color:#3A4060;font:600 13px Manrope,system-ui,sans-serif;cursor:pointer}
.chip:hover{border-color:#141833}
.chip.on{background:#2F5BEA;border-color:#2F5BEA;color:#fff}
.sel{width:100%;min-height:46px;padding:0 14px;border:1.5px solid #E1E4EF;border-radius:10px;background:#fff;color:#141833;font:600 14px Manrope,system-ui,sans-serif}
.sel:focus{outline:2px solid #8A3FF0;outline-offset:1px}
.card{background:#fff;border-radius:18px;border:1px solid #ECEEF5;box-shadow:0 10px 30px rgba(20,24,51,.05)}
.ph{display:flex;flex-direction:column;gap:4px;align-items:center;justify-content:center;text-align:center;color:#5B6178;font:600 13px Manrope,system-ui,sans-serif;background-color:#EEF0F7;background-image:repeating-linear-gradient(135deg,rgba(20,24,51,.04) 0 10px,transparent 10px 20px);padding:12px}
.ph small{font-weight:500;font-size:12px;color:#6A7090}
.foot a{color:#5B6178;text-decoration:none;font-size:14px}
.foot a:hover{color:#141833}
.works{display:grid;grid-template-columns:1.2fr 0.95fr 0.95fr 1.4fr;gap:16px}
.mlink{display:flex;align-items:center;min-height:52px;padding:0 14px;border-radius:12px;color:#141833;text-decoration:none;font:700 17px Manrope,system-ui,sans-serif;transition:background .2s,padding .2s}
.mlink:hover{background:#F3F4FA;color:#F0287A;padding-left:20px}
@keyframes slideIn{from{transform:translateX(100%)}to{transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.menu-panel{animation:slideIn .4s cubic-bezier(.2,.8,.2,1) both}
.menu-bg{animation:fadeIn .3s ease both}
.menu-panel .mlink{animation:rise .5s cubic-bezier(.2,.8,.2,1) both}
.menu-panel .mlink:nth-of-type(1){animation-delay:.08s}.menu-panel .mlink:nth-of-type(2){animation-delay:.12s}.menu-panel .mlink:nth-of-type(3){animation-delay:.16s}.menu-panel .mlink:nth-of-type(4){animation-delay:.2s}.menu-panel .mlink:nth-of-type(5){animation-delay:.24s}.menu-panel .mlink:nth-of-type(6){animation-delay:.28s}
.dd{position:relative;z-index:6}
.dd.open{z-index:20}
.dd-btn{width:100%;min-height:48px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;gap:10px;border:1.5px solid #E1E4EF;border-radius:12px;background:#fff;color:#141833;font:600 14px Manrope,system-ui,sans-serif;cursor:pointer;text-align:left;transition:border-color .2s,box-shadow .25s}
.dd-btn:hover{border-color:#B9BED6}
.dd.open .dd-btn,.dd-btn:focus-visible{border-color:#8A3FF0;box-shadow:0 0 0 4px rgba(138,63,240,.12);outline:none}
.chev{flex:none;color:#6A7090;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.dd.open .chev{transform:rotate(180deg);color:#8A3FF0}
@keyframes ddIn{from{opacity:0;transform:translateY(-8px) scale(.97)}to{opacity:1;transform:none}}
@keyframes optIn{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:none}}
.dd-list{position:absolute;left:0;right:0;top:calc(100% + 6px);background:#fff;border:1px solid #ECEEF5;border-radius:14px;box-shadow:0 20px 44px rgba(20,24,51,.16);padding:6px;display:flex;flex-direction:column;gap:2px;max-height:280px;overflow-y:auto;transform-origin:top center;animation:ddIn .24s cubic-bezier(.2,.8,.2,1) both;will-change:transform,opacity}
.dd-opt{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px;padding:0 12px;border:0;border-radius:10px;background:transparent;color:#141833;font:600 14px Manrope,system-ui,sans-serif;text-align:left;cursor:pointer;animation:optIn .28s cubic-bezier(.2,.8,.2,1) both;transition:background .15s,color .15s}
.dd-opt:nth-child(2){animation-delay:.03s}.dd-opt:nth-child(3){animation-delay:.06s}.dd-opt:nth-child(4){animation-delay:.09s}.dd-opt:nth-child(5){animation-delay:.12s}.dd-opt:nth-child(6){animation-delay:.15s}
.dd-opt:hover{background:#F3F1FF;color:#7030D8}
.dd-opt svg{opacity:0;color:#8A3FF0;transition:opacity .2s}
.dd-opt.on{color:#7030D8;background:#F7F5FF}
.dd-opt.on svg{opacity:1}
.site-head{position:sticky;top:0;z-index:40;border-bottom:1px solid transparent;transition:background .35s,box-shadow .35s,border-color .35s}
.head-in{padding:18px 24px;transition:padding .35s cubic-bezier(.2,.8,.2,1)}
.site-head.scrolled{background:rgba(255,255,255,.62);-webkit-backdrop-filter:saturate(180%) blur(18px);backdrop-filter:saturate(180%) blur(18px);box-shadow:0 10px 30px rgba(20,24,51,.07);border-bottom-color:rgba(225,228,239,.7)}

.totop{position:fixed;right:24px;bottom:24px;z-index:45;width:54px;height:54px;border-radius:16px;border:0;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;background:linear-gradient(135deg,#F0287A,#8A3FF0,#2F6BFF);box-shadow:0 14px 34px rgba(138,63,240,.35);opacity:0;transform:translateY(24px) scale(.85);pointer-events:none;transition:opacity .35s,transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
.totop.show{opacity:1;transform:none;pointer-events:auto}
.totop.show:hover{transform:translateY(-4px);box-shadow:0 20px 40px rgba(138,63,240,.45)}
.totop svg{transition:transform .3s}
.totop:hover svg{transform:translateY(-2px)}
.ico{width:48px;height:48px;border-radius:15px;display:flex;align-items:center;justify-content:center;flex:none;color:#fff;position:relative;box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 12px 24px -10px var(--sh);transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.ico::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.3),rgba(255,255,255,0) 55%);pointer-events:none}
.ico svg{position:relative}
.ico.sm{width:40px;height:40px;border-radius:12px}
.ico-pink{background:linear-gradient(145deg,#FF6BA8,#E0257A);--sh:rgba(224,37,122,.6)}
.ico-violet{background:linear-gradient(145deg,#A77BFF,#6C35E8);--sh:rgba(108,53,232,.6)}
.ico-blue{background:linear-gradient(145deg,#5B9BFF,#2558F0);--sh:rgba(37,88,240,.6)}
.ico-orange{background:linear-gradient(145deg,#FFA24D,#FF5E1A);--sh:rgba(255,94,26,.55)}
.ico-green{background:linear-gradient(145deg,#3FD9A4,#0FA374);--sh:rgba(15,163,116,.55)}
.ico-amber{background:linear-gradient(145deg,#FFCF5C,#F08A00);--sh:rgba(240,138,0,.55)}
.card:hover .ico,.ico:hover{transform:rotate(-6deg) scale(1.08)}
@media (min-width:961px){.mob{display:none !important}}
@media (max-width:1180px){.desk-xl{display:none !important}}
.bgw>*:not(.bigword){position:relative;z-index:1}
.bigword{position:absolute;z-index:0;pointer-events:none;user-select:none;white-space:nowrap;font:800 clamp(110px,17vw,260px)/0.9 Montserrat,system-ui,sans-serif;letter-spacing:-.045em;text-transform:uppercase;color:rgba(20,24,51,.08)}
.faq{border-bottom:1px solid #E6E8F2}
.faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:68px;padding:18px 4px;background:none;border:0;font:700 17px Manrope,system-ui,sans-serif;color:#141833;text-align:left;cursor:pointer}
.faq-q:hover{color:#7030D8}
.faq-ic{width:38px;height:38px;border-radius:11px;background:#F3F1FF;color:#7030D8;display:flex;align-items:center;justify-content:center;flex:none;transition:transform .4s cubic-bezier(.2,.8,.2,1),background .3s,color .3s}
.faq.open .faq-ic{transform:rotate(45deg);background:linear-gradient(145deg,#A77BFF,#6C35E8);color:#fff}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s cubic-bezier(.2,.8,.2,1)}
.faq.open .faq-a{grid-template-rows:1fr}
.faq-a>div{overflow:hidden}
.faq-a p{margin:0;padding:0 4px 22px;font-size:15px;line-height:1.65;color:#3A4060;max-width:760px}
.svc{display:flex;gap:14px;align-items:flex-start;padding:20px;border-radius:18px;background:#fff;border:1px solid #ECEEF5;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.svc:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(60,30,140,.1)}
.svc:hover .ico{transform:rotate(-6deg) scale(1.08)}
.logo-ph{height:72px;border-radius:14px;background:#fff;border:1px solid #ECEEF5;display:flex;align-items:center;justify-content:center;color:#8A90AC;font:700 13px Manrope,system-ui,sans-serif;filter:grayscale(1);transition:filter .3s,transform .3s}
.logo-ph:hover{filter:none;transform:translateY(-2px);color:#141833}
@keyframes wordDrift{from{transform:translateX(6%)}to{transform:translateX(-6%)}}
.num{font-size:44px;font-weight:800;line-height:1;letter-spacing:-.05em;font-variant-numeric:tabular-nums;-webkit-background-clip:text;background-clip:text;color:transparent}
.n1{background-image:linear-gradient(160deg,#B48CFF,#6C35E8)}
.n2{background-image:linear-gradient(160deg,#7FB2FF,#2558F0)}
.n3{background-image:linear-gradient(160deg,#FFB86B,#FF5E1A)}
.n4{background-image:linear-gradient(160deg,#5BE3B3,#0FA374)}
/* ===== MOTION ===== */
@keyframes rise{from{opacity:0;transform:translateY(28px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes shimmer{0%{background-position:0% 50%}100%{background-position:200% 50%}}
@keyframes drift1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(60px,-40px) scale(1.15)}}
@keyframes drift2{0%,100%{transform:translate(0,0) scale(1.1)}50%{transform:translate(-50px,50px) scale(.9)}}
@keyframes drift3{0%,100%{transform:translate(0,0)}50%{transform:translate(30px,40px) scale(1.2)}}
@keyframes bob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-14px) rotate(.4deg)}}
@keyframes shine{0%{transform:translateX(-120%) skewX(-20deg)}60%,100%{transform:translateX(320%) skewX(-20deg)}}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(37,211,102,.55)}50%{box-shadow:0 0 0 10px rgba(37,211,102,0)}}
@keyframes revealUp{from{opacity:0;transform:translateY(60px) scale(.97)}to{opacity:1;transform:none}}
@keyframes popIn{from{opacity:0;transform:translateY(40px) rotateX(18deg)}to{opacity:1;transform:none}}
.rise{animation:rise .9s cubic-bezier(.2,.8,.2,1) both}
.d1{animation-delay:.05s}.d2{animation-delay:.18s}.d3{animation-delay:.32s}.d4{animation-delay:.46s}.d5{animation-delay:.6s}.d6{animation-delay:.3s}
.g-warm,.g-cool{background-size:200% auto;animation:shimmer 4s linear infinite}
.g-warm{background-image:linear-gradient(90deg,#FF7A1A,#FF3D7F,#E0258F,#8A3FF0,#FF7A1A)}
.g-cool{background-image:linear-gradient(90deg,#F0287A,#8A3FF0,#2F6BFF,#F0287A)}
.stage{position:relative}
.blob{position:absolute;border-radius:50%;filter:blur(50px);opacity:.75;pointer-events:none}
.b1{width:340px;height:340px;background:#FF5FA2;top:-30px;left:-20px;animation:drift1 12s ease-in-out infinite}
.b2{width:380px;height:380px;background:#6E8BFF;bottom:-40px;right:-30px;animation:drift2 14s ease-in-out infinite}
.b3{width:260px;height:260px;background:#B07BFF;top:30%;left:35%;animation:drift3 10s ease-in-out infinite}
.float{animation:bob 6s ease-in-out infinite;position:relative;backdrop-filter:blur(4px);background-color:rgba(255,255,255,.55) !important}
.btn-p{position:relative;overflow:hidden;background-size:200% auto;transition:transform .25s,box-shadow .25s,background-position .6s}
.btn-p::after{content:"";position:absolute;top:0;left:0;width:35%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);animation:shine 3.2s ease-in-out infinite}
.btn-p:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(138,63,240,.35);background-position:100% 0}
.btn{transition:transform .25s,box-shadow .25s,background .25s,border-color .25s}
.btn-o:hover,.btn-d:hover{transform:translateY(-2px)}
.card{transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
a.card:hover{transform:translateY(-8px);box-shadow:0 24px 50px rgba(60,30,140,.16)}
a.card .ph{transition:transform .6s cubic-bezier(.2,.8,.2,1)}
a.card:hover .ph{transform:scale(1.06)}
.works>.ph{transition:transform .4s,box-shadow .4s}
.works>.ph:hover{transform:translateY(-6px) scale(1.02);box-shadow:0 20px 40px rgba(20,24,51,.14)}
.wa{animation:pulse 2.2s ease-out infinite}
@keyframes fillText{from{background-position:100% 0}to{background-position:0 0}}
.fill{background-image:linear-gradient(90deg,#F0287A 0%,#8A3FF0 25%,#2F6BFF 50%,#D3D7E6 50%,#D3D7E6 100%);background-size:200% 100%;background-position:0 0;-webkit-background-clip:text;background-clip:text;color:transparent}
@supports (animation-timeline: view()){
.fill{background-position:100% 0;animation:fillText linear both;animation-timeline:view();animation-range:entry 30% cover 55%}
.bigword{animation:wordDrift linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
.reveal{animation:revealUp linear both;animation-timeline:view();animation-range:entry 0% entry 45%}
.reveal .card:not(.nopop),.reveal .works>.ph{animation:popIn linear both;animation-timeline:view();animation-range:entry 0% entry 60%}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none !important;transition:none !important}}
@media (max-width:960px){.desk{display:none !important}.works{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.works{grid-template-columns:minmax(0,1fr)}}

.ph.ph-brand{background:#141833;background-image:radial-gradient(120% 90% at 100% 0%,rgba(224,37,143,.35),transparent 55%),radial-gradient(90% 80% at 0% 100%,rgba(123,63,242,.35),transparent 60%);color:#fff;font:800 20px Manrope,system-ui,sans-serif;letter-spacing:-.01em;padding:24px;min-height:170px}
.ph.ph-brand small{color:rgba(255,255,255,.7);font-weight:600;font-size:13px;letter-spacing:.06em;text-transform:uppercase}
.ph.ph-brand.float{background-color:#141833 !important;color:#fff}

/* Главная, SEO-блоки 29.10: прайс «от», «Типография рядом», текст о типографии */
.hp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:14px}
.hp-item{padding:18px 20px;display:flex;flex-direction:column;gap:6px;text-decoration:none;color:#141833}
.hp-item .hp-n{font-weight:700;font-size:15px;line-height:1.3}
.hp-item .hp-p{font:800 20px/1.2 Montserrat,system-ui,sans-serif;color:#141833}
.hp-item .hp-d{font-size:13px;color:#5B6178}
.hp-item:hover .hp-n{color:#7030D8}
.hp-more{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;font-size:14px;color:#5B6178}
.hp-more a{font-weight:700;text-decoration:none}
.near{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:20px;align-items:stretch}
.near-main{padding:32px;display:flex;flex-direction:column;gap:18px}
.near-dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px 18px;margin:0;font-size:15px;line-height:1.5}
.near-dl dt{color:#5B6178;font-weight:600}
.near-dl dd{margin:0;font-weight:700;color:#141833}
.near-dl a{color:#141833;text-decoration:none}
.near-side{border-radius:18px;background:#141833;color:#fff;padding:32px;display:flex;flex-direction:column;gap:14px;position:relative;overflow:hidden}
.near-side ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px;font-size:15px;line-height:1.5;color:#C9CDE3;position:relative}
.near-side li{display:flex;gap:10px;align-items:flex-start}
.near-side li svg{flex:none;color:#B48CFF;margin-top:2px}
.hp-seo{max-width:880px}
@media (max-width:900px){.near{grid-template-columns:minmax(0,1fr)}}
@media (max-width:560px){.hp-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.hp-item{padding:14px}.hp-item .hp-n{font-size:14px}.hp-item .hp-p{font-size:16px}.near-main,.near-side{padding:24px 20px}.near-dl{grid-template-columns:minmax(0,1fr);gap:2px}.near-dl dd{margin-bottom:10px}.near-main .btn{width:100%}}

/* ===== Production additions ===== */
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;color:#141833;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
[hidden]{display:none !important}
.page{width:100%;overflow-x:clip}
.wrap{max-width:1280px;margin:0 auto;padding-left:24px;padding-right:24px}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:#141833;color:#fff;padding:10px 16px;border-radius:10px}
.skip:focus{left:16px}
.navlink.cur{color:#F0287A}
.h2{margin:0;font-family:Montserrat,system-ui,sans-serif;font-size:clamp(28px,3.2vw,42px);font-weight:800;line-height:1.12}
.sec{padding-top:72px;padding-bottom:24px}
.muted{color:#5B6178}

/* breadcrumbs */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;color:#6A7090;margin:0;padding:0;list-style:none}
.crumbs a{color:#6A7090;text-decoration:none}
.crumbs a:hover{color:#141833}
.crumbs li+li::before{content:"/";margin-right:8px;color:#B9BED6}

/* product hero */
.p-hero{display:flex;flex-wrap:wrap;gap:40px;align-items:center;padding-top:24px;padding-bottom:40px}
.p-hero h1{margin:0;font-family:Montserrat,system-ui,sans-serif;font-size:clamp(34px,4.4vw,58px);line-height:1.06;font-weight:800;letter-spacing:-.02em}
.price-chip{display:inline-flex;align-items:baseline;gap:8px;padding:10px 16px;border-radius:12px;background:#fff;border:1px solid #ECEEF5;box-shadow:0 10px 30px rgba(20,24,51,.05);font-weight:600;color:#5B6178;font-size:14px}
.price-chip b{font-family:Montserrat,system-ui,sans-serif;font-size:24px;color:#141833}
.ticks{display:flex;flex-wrap:wrap;gap:10px 22px;margin:0;padding:0;list-style:none}
.ticks li{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:#3A4060}
.ticks svg{color:#0FA374;flex:none}

/* price table */
.ptable-wrap{overflow-x:auto;border-radius:18px;background:#fff;border:1px solid #ECEEF5;box-shadow:0 10px 30px rgba(20,24,51,.05)}
.ptable{width:100%;border-collapse:collapse;font-size:15px;min-width:420px}
.ptable th{text-align:left;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#6A7090;font-weight:700;padding:16px 20px;background:#FAFBFE;border-bottom:1px solid #ECEEF5}
.ptable td{padding:16px 20px;border-bottom:1px solid #F0F1F7}
.ptable tr:last-child td{border-bottom:0}
.ptable td.num-c{font-family:Montserrat,system-ui,sans-serif;font-weight:800}
.ptable tbody tr{transition:background .2s}
.ptable tbody tr:hover{background:#F7F5FF}

/* prose */
.prose p{margin:0 0 16px;font-size:16px;line-height:1.75;color:#3A4060}
.prose h3{font-family:Montserrat,system-ui,sans-serif;font-size:20px;margin:28px 0 12px}
.prose ul{margin:0 0 16px;padding-left:20px;color:#3A4060;line-height:1.75}
.use-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin:0;padding:0;list-style:none}
.use-list li{display:flex;gap:12px;align-items:center;padding:16px 18px;border-radius:14px;background:#fff;border:1px solid #ECEEF5;font-weight:600;font-size:14px}
.use-list svg{color:#8A3FF0;flex:none}

/* calculator (JS widget) */
.calc-card{position:relative}
.calc-tabs{display:flex;overflow-x:auto;border-bottom:1px solid #ECEEF5;padding:0 8px;scrollbar-width:none}
.calc-tabs::-webkit-scrollbar{display:none}
.calc-body{display:flex;flex-wrap:wrap}
.calc-fields{flex:1 1 280px;min-width:0;padding:22px 24px;display:flex;flex-direction:column;gap:14px}
.calc-res{flex:1 1 240px;min-width:0;padding:22px 24px;background:#FAFBFE;border-left:1px solid #ECEEF5;border-radius:0 0 18px 0;display:flex;flex-direction:column;gap:12px}
.dd-label{display:block;font-size:12px;font-weight:600;color:#5B6178;margin-bottom:6px}
.calc-price{font-family:Montserrat,system-ui,sans-serif;font-size:38px;font-weight:800;line-height:1}
.calc-price.bump{animation:bump .45s cubic-bezier(.2,.8,.2,1)}
@keyframes bump{0%{transform:scale(.94);opacity:.4}100%{transform:none;opacity:1}}
.calc-ok{display:flex;gap:8px;align-items:center;font-size:13px;color:#3A4060}
.calc-ok svg{color:#2F6BFF;flex:none}
.calc-custom{padding:32px;display:flex;flex-direction:column;gap:14px;align-items:flex-start}

/* contacts */
.ct-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.ct-card{padding:24px;display:flex;flex-direction:column;gap:10px}
.ct-card a{color:#141833;font-weight:700;text-decoration:none;font-size:18px}
.ct-card a:hover{color:#7030D8}

@media (max-width:720px){
  .calc-res{border-left:0;border-top:1px solid #ECEEF5;border-radius:0 0 18px 18px}
  .sec{padding-top:56px}
}

/* реальные работы */
.works>.wk{transition:transform .4s,box-shadow .4s}
.works>.wk:hover{transform:translateY(-6px) scale(1.02);box-shadow:0 20px 40px rgba(20,24,51,.14)}
@supports (animation-timeline:view()){.reveal .works>.wk{animation:popIn linear both;animation-timeline:view();animation-range:entry 0% entry 60%}}

/* ---- первый экран: широкое фото справа, растворяется под текстом ---- */
.hero-x{position:relative;overflow:hidden;min-height:620px;display:flex;align-items:center}
.hero-media{position:absolute;top:0;right:0;bottom:0;width:min(66%,1250px);-webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.28) 16%,#000 46%);mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.28) 16%,#000 46%)}
.hero-media .hero-img{height:100%;object-position:72% 50%}
.hero-media::before,.hero-media::after{content:"";position:absolute;left:0;right:0;pointer-events:none;z-index:1}
.hero-media::before{top:0;height:56px;background:linear-gradient(#F7F8FC,rgba(247,248,252,0))}
.hero-media::after{bottom:0;height:140px;background:linear-gradient(rgba(247,248,252,0),#F7F8FC)}
.hero-in{position:relative;z-index:2;width:100%;max-width:1280px;margin:0 auto;padding:56px 24px 64px}
.hero-copy{max-width:600px;display:flex;flex-direction:column;gap:26px}
@media (max-width:900px){
 .hero-x{display:block;min-height:0}
 .hero-media{position:relative;width:100%;height:300px;-webkit-mask-image:none;mask-image:none}
 .hero-media::before{display:none}.hero-media::after{height:90px}
 .hero-in{padding:6px 20px 40px;margin-top:-6px}
}
/* ---- факты под первым экраном: бенто-карточки на стекле ---- */
.proof{position:relative;z-index:3;max-width:1280px;margin:-56px auto 0;padding:0 24px;display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:14px}
.pf{display:flex;flex-direction:column;justify-content:space-between;gap:10px;min-height:128px;padding:20px 22px;border-radius:22px;text-decoration:none;color:#141833;background:rgba(255,255,255,.66);-webkit-backdrop-filter:blur(18px) saturate(1.3);backdrop-filter:blur(18px) saturate(1.3);border:1px solid rgba(255,255,255,.9);box-shadow:0 18px 40px -22px rgba(20,24,51,.35);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
a.pf:hover{transform:translateY(-4px);box-shadow:0 24px 50px -22px rgba(20,24,51,.45)}
.pf b{display:flex;align-items:center;gap:8px;font:800 clamp(26px,2.6vw,38px)/1 Montserrat,system-ui,sans-serif;letter-spacing:-.02em}
.pf span{font-size:14px;line-height:1.45;color:#4A5070}
.pf-main{background:linear-gradient(135deg,rgba(20,24,51,.92),rgba(58,40,120,.9));color:#fff;border-color:rgba(255,255,255,.15)}
.pf-main b{background:linear-gradient(90deg,#FF7AB6,#B49BFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.pf-main span{color:#D5D8EA}
@media (max-width:900px){.proof{grid-template-columns:1fr 1fr;margin-top:-10px;padding:0 16px}.pf-main{grid-column:1/-1}.pf{min-height:0}}

/* ---- акции: карточка на фото первого экрана и плашка на странице продукта ---- */
.pc-badge{display:inline-block;align-self:flex-start;font:800 12px/1 Manrope,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:linear-gradient(90deg,#E8408F,#7B3BE8);border-radius:6px;padding:7px 10px}
.promo-card{position:absolute;z-index:3;right:clamp(16px,4vw,64px);bottom:clamp(72px,9vw,120px);width:min(380px,calc(100% - 32px));display:flex;flex-direction:column;gap:10px;padding:22px 24px;border-radius:24px;color:#141833;background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(20px) saturate(1.4);backdrop-filter:blur(20px) saturate(1.4);border:1px solid rgba(255,255,255,.95);box-shadow:0 30px 60px -24px rgba(20,24,51,.45);animation:pcIn .7s cubic-bezier(.2,.8,.2,1) .4s both}
.pc-title{font:800 clamp(22px,2vw,28px)/1.15 Montserrat,system-ui,sans-serif;letter-spacing:-.01em}
.pc-text{font-size:15px;line-height:1.5;color:#3A4060}
.pc-until{font-size:13px;color:#5B6178}.pc-until a{color:#7B3BE8;font-weight:700;text-decoration:none}
.pc-btn{align-self:flex-start;margin-top:4px}
@keyframes pcIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.promo-strip{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"b t btn" "b x btn" "b u btn";align-items:center;gap:4px 18px;padding:18px 22px;border-radius:22px;background:linear-gradient(135deg,rgba(255,225,239,.7),rgba(233,222,255,.7));border:1px solid #fff;box-shadow:0 18px 40px -26px rgba(20,24,51,.4)}
.promo-strip .pc-badge{grid-area:b;align-self:center}.promo-strip .pc-title{grid-area:t;font-size:20px}.promo-strip .pc-text{grid-area:x}.promo-strip .pc-until{grid-area:u}.promo-strip .pc-btn{grid-area:btn;margin:0;align-self:center}
@media (max-width:900px){
 .hero-media:has(.promo-card){height:auto}.hero-media:has(.promo-card) .hero-img{height:300px!important}.hero-media:has(.promo-card)::after{bottom:auto;top:210px}
 .promo-card{position:relative;right:auto;bottom:auto;width:auto;margin:-50px 16px 40px;animation:none}
 .promo-strip{grid-template-columns:1fr;grid-template-areas:"b" "t" "x" "u" "btn"}
}
@media (prefers-reduced-motion:reduce){.promo-card{animation:none}}

/* ---- правки 25.10 (вечер) ---- */
html{scroll-padding-top:104px}
.calc-tabs{display:flex;flex-wrap:wrap;gap:8px;overflow:visible;padding:16px 18px;border-bottom:1px solid #ECEEF5}
.calc-tabs .tab{flex:0 0 auto;flex-direction:row;min-width:0;min-height:0;gap:7px;padding:9px 13px;border:1px solid #E3E6F0;border-radius:10px;background:#fff;font-size:13px;color:#3A4060;transition:background .2s,color .2s,border-color .2s}
.calc-tabs .tab svg{width:18px;height:18px}
.calc-tabs .tab:hover{border-color:#141833;color:#141833}
.calc-tabs .tab.on{background:#141833;border-color:#141833;color:#fff}
.btn-ghost{background:rgba(255,255,255,.1);color:#fff;border:1.5px solid rgba(255,255,255,.28)}
.btn-ghost:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.6);color:#fff;transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.25)}
.pf{justify-content:flex-start}
.hd-open{display:flex;align-items:center;gap:8px;margin-left:auto;font-size:13px;font-weight:600;color:#3A4060;text-decoration:none;white-space:nowrap;transition:color .2s}
.hd-open:hover{color:#E8408F}
.hd-open i{width:8px;height:8px;border-radius:50%;background:#B7BCCF;flex:none}
.hd-open.is-open i{background:#1FBF62;box-shadow:0 0 0 4px rgba(31,191,98,.18)}
.hd-open + div{margin-left:16px !important}
@media (max-width:1439px){.hd-open{display:none}.hd-open + div{margin-left:auto !important}}
.site-head .head-in > a:first-child span span{white-space:nowrap}

/* требования: крупное слово «Макет» просвечивает сквозь карточку */
.req-card{background:linear-gradient(120deg,rgba(255,255,255,.78) 0%,rgba(255,241,247,.78) 50%,rgba(241,238,255,.78) 100%) !important}
.site-head nav.desk{flex:none}

/* акции с фото: /akcii/ и плашка на странице продукта */
.promo-art{padding:0;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr);}
.promo-art:has(img){grid-template-columns:minmax(0,5fr) minmax(0,6fr)}
.promo-art img{display:block;width:100%;height:100%;min-height:260px;object-fit:cover}
.promo-body{padding:28px;display:flex;flex-direction:column;gap:12px}
.promo-strip.has-thumb{grid-template-columns:120px auto 1fr auto;grid-template-areas:"i b t btn" "i b x btn" "i b u btn"}
.pc-thumb{grid-area:i;width:120px;height:84px;object-fit:cover;border-radius:12px}
@media (max-width:900px){.promo-art:has(img){grid-template-columns:1fr}.promo-art img{min-height:200px;max-height:260px}.promo-strip.has-thumb{grid-template-columns:1fr;grid-template-areas:"i" "b" "t" "x" "u" "btn"}.pc-thumb{width:100%;height:160px}}
.pc-more{align-self:flex-start;margin-top:2px;padding-top:10px;border-top:1px solid rgba(20,24,51,.1);width:100%;font-size:14px;font-weight:700;color:#7B3BE8;text-decoration:none}
.pc-more:hover{color:#E8408F}

/* ---- блок «Акции» под первым экраном: одна акция, плавная смена ---- */
.promos{max-width:1280px;margin:0 auto;padding:56px 24px 8px}
.ps-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.ps-head .h2{margin:0}
.ps-right{display:flex;align-items:center;gap:18px}
.ps-all{font-weight:700;font-size:14px;text-decoration:none;color:#2F5BEA}
.ps-nav{display:flex;gap:8px}
.ps-arrow{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border:1px solid #E3E6F0;border-radius:12px;background:#fff;color:#141833;cursor:pointer;transition:border-color .2s,transform .2s}
.ps-arrow:hover{border-color:#141833;transform:translateY(-2px)}
.ps-track{display:grid;outline:none}
.ps-card{grid-area:1/1;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);background:#fff;border:1px solid #ECEEF5;border-radius:24px;overflow:hidden;box-shadow:0 18px 40px -28px rgba(20,24,51,.35);opacity:0;visibility:hidden;transition:opacity 1.1s cubic-bezier(.4,0,.2,1),visibility 0s linear 1.1s}
.ps-card.on{opacity:1;visibility:visible;transition:opacity 1.1s cubic-bezier(.4,0,.2,1),visibility 0s}
.ps-media{position:relative;display:block;min-height:320px;overflow:hidden;background:#141833}
.ps-media img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 7s ease-out}
.ps-card.on .ps-media img{transform:scale(1)}
.ps-fallback{position:absolute;inset:0;background:linear-gradient(135deg,#141833,#3A2878)}
.ps-fallback img{opacity:.45;mix-blend-mode:screen}
.ps-media .pc-badge{position:absolute;left:20px;top:20px;z-index:1}
.ps-body{padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;justify-content:center;gap:12px}
.ps-body>*{opacity:0;transform:translateY(12px);transition:opacity .7s .35s,transform .7s .35s cubic-bezier(.2,.8,.2,1)}
.ps-card.on .ps-body>*{opacity:1;transform:none}
.ps-title{margin:0;font:800 clamp(24px,2.4vw,34px)/1.15 Montserrat,system-ui,sans-serif;letter-spacing:-.01em;color:#141833}
.ps-text{margin:0;font-size:16px;line-height:1.55;color:#3A4060}
.ps-btn{align-self:flex-start;margin-top:8px}
.ps-dots{display:flex;justify-content:center;gap:8px;margin-top:18px}
.ps-dots button{position:relative;overflow:hidden;width:8px;height:6px;padding:0;border:0;border-radius:2px;background:#CDD1E0;cursor:pointer;transition:width .4s}
.ps-dots button[aria-current=true]{width:44px}
.ps-dots button[aria-current=true]::after{content:"";position:absolute;inset:0;background:#141833;transform-origin:left;transform:scaleX(1)}
.promos.run .ps-dots button[aria-current=true]::after{animation:psBar var(--d,7000ms) linear both}
.promos.hold .ps-dots button[aria-current=true]::after,.promos.away .ps-dots button[aria-current=true]::after{animation-play-state:paused}
@keyframes psBar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (max-width:900px){.promos{padding:40px 16px 0}.ps-card{grid-template-columns:1fr}.ps-media{min-height:0;aspect-ratio:16/9}.ps-nav{display:none}}
@media (prefers-reduced-motion:reduce){.ps-card,.ps-card.on,.ps-body>*,.ps-media img{transition:none}}

/* ---- /ceny/ ---- */
.pr-nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.pr-nav a{padding:8px 13px;border:1px solid #E3E6F0;border-radius:10px;background:#fff;font-size:14px;font-weight:600;color:#3A4060;text-decoration:none}
.pr-nav a:hover{border-color:#141833;color:#141833}
.pr-sec{padding-top:40px;display:flex;flex-direction:column;gap:18px}
.pr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,360px),1fr));gap:18px;align-items:start}
.pc{padding:20px;display:flex;flex-direction:column;gap:10px;scroll-margin-top:110px}
.pc-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.pc-h a{font:800 18px/1.25 Montserrat,system-ui,sans-serif;color:#141833;text-decoration:none}
.pc-h a:hover{color:#E8408F}
.pc-h span{font-size:13px;font-weight:700;color:#3A4060;white-space:nowrap}
.pc-cfg{margin:0;font-size:13px;color:#6A7090;line-height:1.5}
.pc .ptable{min-width:0;font-size:14px}.pc .ptable th,.pc .ptable td{padding:9px 14px}
.pc-calc{font-size:14px;font-weight:700;color:#2F5BEA;text-decoration:none}

/* оборудование */
.eq{position:relative;margin:0;height:300px;border-radius:18px;overflow:hidden;background:#141833}
.eq img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.eq:hover img{transform:scale(1.04)}
.eq figcaption{position:absolute;left:12px;right:12px;bottom:12px;padding:10px 14px;border-radius:12px;background:rgba(255,255,255,.82);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;flex-direction:column;gap:2px;font-size:13px;color:#3A4060}
.eq figcaption b{font-size:14px;color:#141833}

/* рейтинг 2ГИС в блоке отзывов */
.rate-card{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;padding:18px 20px 18px 24px;background:#fff;border:1px solid #ECEEF5;border-radius:18px;box-shadow:0 14px 40px rgba(60,30,140,.08);position:relative;overflow:hidden}
.rate-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#E8318A,#7B3FE4)}
.rate-num{display:flex;align-items:center;gap:14px}
.rate-num>b{font:800 46px/1 Montserrat,system-ui,sans-serif;letter-spacing:-.02em;color:#141833}
.rate-num>div{display:flex;flex-direction:column;gap:6px}
.rate-stars{display:flex;gap:2px}
.rate-src{font-size:13px;color:#5B6178}.rate-src i{font-style:normal;font-weight:800;color:#1BA136}
.rate-act{display:flex;gap:10px;flex-wrap:wrap}
.rate-act .btn{min-height:46px;padding:0 18px;font-size:14px}
.rate-all{background:#fff;border:1.5px solid #E2E4EE;color:#141833}.rate-all:hover{border-color:#141833}
.rate-add{background:linear-gradient(90deg,#E8318A,#7B3FE4);color:#fff}.rate-add:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(123,63,228,.3)}
@media (max-width:560px){.rate-card{width:100%;padding:16px 16px 16px 20px}.rate-act{width:100%;flex-wrap:nowrap}.rate-act .btn{flex:1;padding:0 10px;white-space:nowrap}}
