/* === Minimal reset + Bootstrap 4 grid (replaces full Bootstrap 4.3.1, ~152KB) === Only the grid (container/row/col-*) used by the theme templates is kept. Design tokens (--color-*, --radius-*, --shadow-*, --transition-*) are defined in critical.css (inlined in for no-FOUC). They resolve before this file applies. */ *,*::before,*::after{box-sizing:border-box} .container{width:100%;padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto} @media(min-width:576px){.container{max-width:540px}} @media(min-width:768px){.container{max-width:720px}} @media(min-width:992px){.container{max-width:960px}} @media(min-width:1200px){.container{max-width:1140px}} .row{display:flex;flex-wrap:wrap;margin-right:-15px;margin-left:-15px} [class*="col-"],.col{position:relative;width:100%;padding-right:15px;padding-left:15px} .col{flex:0 0 auto;width:auto;max-width:100%} .col-1{flex:0 0 8.333333%;max-width:8.333333%} .col-2{flex:0 0 16.666667%;max-width:16.666667%} .col-3{flex:0 0 25%;max-width:25%} .col-4{flex:0 0 33.333333%;max-width:33.333333%} .col-5{flex:0 0 41.666667%;max-width:41.666667%} .col-6{flex:0 0 50%;max-width:50%} .col-7{flex:0 0 58.333333%;max-width:58.333333%} .col-8{flex:0 0 66.666667%;max-width:66.666667%} .col-9{flex:0 0 75%;max-width:75%} .col-10{flex:0 0 83.333333%;max-width:83.333333%} .col-11{flex:0 0 91.666667%;max-width:91.666667%} .col-12{flex:0 0 100%;max-width:100%} @media(min-width:576px){.col-sm-1{flex:0 0 8.333333%;max-width:8.333333%} .col-sm-2{flex:0 0 16.666667%;max-width:16.666667%} .col-sm-3{flex:0 0 25%;max-width:25%} .col-sm-4{flex:0 0 33.333333%;max-width:33.333333%} .col-sm-5{flex:0 0 41.666667%;max-width:41.666667%} .col-sm-6{flex:0 0 50%;max-width:50%} .col-sm-7{flex:0 0 58.333333%;max-width:58.333333%} .col-sm-8{flex:0 0 66.666667%;max-width:66.666667%} .col-sm-9{flex:0 0 75%;max-width:75%} .col-sm-10{flex:0 0 83.333333%;max-width:83.333333%} .col-sm-11{flex:0 0 91.666667%;max-width:91.666667%} .col-sm-12{flex:0 0 100%;max-width:100%} } @media(min-width:768px){.col-md-1{flex:0 0 8.333333%;max-width:8.333333%} .col-md-2{flex:0 0 16.666667%;max-width:16.666667%} .col-md-3{flex:0 0 25%;max-width:25%} .col-md-4{flex:0 0 33.333333%;max-width:33.333333%} .col-md-5{flex:0 0 41.666667%;max-width:41.666667%} .col-md-6{flex:0 0 50%;max-width:50%} .col-md-7{flex:0 0 58.333333%;max-width:58.333333%} .col-md-8{flex:0 0 66.666667%;max-width:66.666667%} .col-md-9{flex:0 0 75%;max-width:75%} .col-md-10{flex:0 0 83.333333%;max-width:83.333333%} .col-md-11{flex:0 0 91.666667%;max-width:91.666667%} .col-md-12{flex:0 0 100%;max-width:100%} } @media(min-width:992px){.col-lg-1{flex:0 0 8.333333%;max-width:8.333333%} .col-lg-2{flex:0 0 16.666667%;max-width:16.666667%} .col-lg-3{flex:0 0 25%;max-width:25%} .col-lg-4{flex:0 0 33.333333%;max-width:33.333333%} .col-lg-5{flex:0 0 41.666667%;max-width:41.666667%} .col-lg-6{flex:0 0 50%;max-width:50%} .col-lg-7{flex:0 0 58.333333%;max-width:58.333333%} .col-lg-8{flex:0 0 66.666667%;max-width:66.666667%} .col-lg-9{flex:0 0 75%;max-width:75%} .col-lg-10{flex:0 0 83.333333%;max-width:83.333333%} .col-lg-11{flex:0 0 91.666667%;max-width:91.666667%} .col-lg-12{flex:0 0 100%;max-width:100%} } @media(min-width:1200px){.col-xl-1{flex:0 0 8.333333%;max-width:8.333333%} .col-xl-2{flex:0 0 16.666667%;max-width:16.666667%} .col-xl-3{flex:0 0 25%;max-width:25%} .col-xl-4{flex:0 0 33.333333%;max-width:33.333333%} .col-xl-5{flex:0 0 41.666667%;max-width:41.666667%} .col-xl-6{flex:0 0 50%;max-width:50%} .col-xl-7{flex:0 0 58.333333%;max-width:58.333333%} .col-xl-8{flex:0 0 66.666667%;max-width:66.666667%} .col-xl-9{flex:0 0 75%;max-width:75%} .col-xl-10{flex:0 0 83.333333%;max-width:83.333333%} .col-xl-11{flex:0 0 91.666667%;max-width:91.666667%} .col-xl-12{flex:0 0 100%;max-width:100%} } /*Swiper 6.1.1*/ :root{--swiper-theme-color:#007aff}.swiper-container{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}.swiper-container-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;box-sizing:content-box}.swiper-container-android .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-container-multirow>.swiper-wrapper{flex-wrap:wrap}.swiper-container-multirow-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-container-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform}.swiper-slide-invisible-blank{visibility:hidden}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-container-3d{perspective:1200px}.swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-container-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-container-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-container-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-container-horizontal.swiper-container-css-mode>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-container-vertical.swiper-container-css-mode>.swiper-wrapper{scroll-snap-type:y mandatory}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:calc(var(--swiper-navigation-size)/ 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(-1 * var(--swiper-navigation-size)/ 2);z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;text-transform:none;font-variant:initial;line-height:1}.swiper-button-prev,.swiper-container-rtl .swiper-button-next{left:10px;right:auto}.swiper-button-prev:after,.swiper-container-rtl .swiper-button-next:after{content:'prev'}.swiper-button-next,.swiper-container-rtl .swiper-button-prev{right:10px;left:auto}.swiper-button-next:after,.swiper-container-rtl .swiper-button-prev:after{content:'next'}.swiper-button-next.swiper-button-white,.swiper-button-prev.swiper-button-white{--swiper-navigation-color:var(--color-white)fff}.swiper-button-next.swiper-button-black,.swiper-button-prev.swiper-button-black{--swiper-navigation-color:#000000}.swiper-button-lock{display:none}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet-active{opacity:1;background:var(--swiper-pagination-color,var(--swiper-theme-color))}.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;transform:translate3d(0px,-50%,0)}.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:6px 0;display:block}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-container-horizontal>.swiper-pagination-progressbar,.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-container-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0}.swiper-pagination-white{--swiper-pagination-color:var(--color-white)fff}.swiper-pagination-black{--swiper-pagination-color:#000000}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}.swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;animation:swiper-preloader-spin 1s infinite linear;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:var(--radius-round);border-top-color:transparent}.swiper-lazy-preloader-white{--swiper-preloader-color:var(--color-white)}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{100%{transform:rotate(360deg)}}.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-container-fade.swiper-container-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-container-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube{overflow:visible}.swiper-container-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-container-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-cube.swiper-container-rtl .swiper-slide{transform-origin:100% 0}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-next+.swiper-slide,.swiper-container-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right,.swiper-container-cube .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;background:#000;opacity:.6;-webkit-filter:blur(50px);filter:blur(50px);z-index:0}.swiper-container-flip{overflow:visible}.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right,.swiper-container-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden} :root{--color-surface:#F7F8FA} /*main*/ @font-face{ font-family:'Roboto'; src:url("../fonts/Roboto-Light.ttf") format("truetype"); font-weight:300; font-style:normal; font-display:swap } @font-face{ font-family:'Roboto'; src:url("../fonts/Roboto-Regular.ttf") format("truetype"); font-weight:400; font-style:normal; font-display:swap } @font-face{ font-family:'Roboto'; src:url("../fonts/Roboto-Medium.ttf") format("truetype"); font-weight:500; font-style:normal; font-display:swap } body{ font-size:16px; color:var(--color-text); font-weight:300; font-family:'Roboto',sans-serif; line-height:1.5; margin:0 } body::-webkit-scrollbar{ width:7px } body::-webkit-scrollbar-thumb{ background:var(--color-primary) } body::-webkit-scrollbar-track{ background:rgba(0,0,0,0.2) } p{ width:100% } img{ max-width:100% } li{ list-style-type:none } a{ outline:0; color:var(--color-primary); text-decoration:none } a:hover{ text-decoration:none; color:var(--color-primary); outline:0 } .single-text li{ list-style-type:disc; margin-bottom:5px; } textarea{ resize:none } textarea:hover,textarea:focus{ outline:0; text-decoration:none } select:hover,select:focus{ outline:0; text-decoration:none } input:hover,input:focus{ outline:0; text-decoration:none } button:hover,button:focus{ outline:0; text-decoration:none } html,body{ height:100% } span.wpcf7-not-valid-tip{ font-size:11px; margin-bottom:0 } div.wpcf7-response-output{ margin:0 50px } .wrapper{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; min-height:100%; height:100% } .content{ -webkit-box-flex:1; -ms-flex:1 0 auto; flex:1 0 auto } footer{ -webkit-box-flex:0; -ms-flex:0 0 auto; flex:0 0 auto } header{ padding:30px 0 } .header-box{ position:relative; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:end; -ms-flex-pack:end; justify-content:flex-end } .custom-logo-link{ position:absolute; z-index:2; top:-30px; left:65px } .custom-logo-link img{ height:92px; width:auto } .header-menu{ display:-webkit-box; display:-ms-flexbox; display:flex } .header-menu_list{ display:-webkit-box; display:-ms-flexbox; display:flex; padding-left:0; margin-top:0; margin-bottom:0 } .header-menu li{ margin-right:50px } .header-menu li:last-child{ margin-right:0 } .header-menu a{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; position:relative; padding-bottom:4px; line-height:normal; /* отменяет унаследованный 1.5 от body → меню ~23px, как на live */ color:var(--color-text) } .header-menu a:before{ content:''; position:absolute; bottom:0; left:0; display:block; height:2px; width:0; margin-top:5px; background:var(--color-primary); -webkit-transition:var(--transition); transition:var(--transition) } .header-menu_list .current-menu-item a:before{ width:100% } .header-burger{ width:35px; height:23px; position:relative; -webkit-transform:rotate(0); transform:rotate(0); -webkit-transition:.5s ease-in-out; transition:.5s ease-in-out; cursor:pointer; z-index:60 } .header-two .row{ position:relative } .header-line{ position:absolute; right:15px; width:90%; bottom:-30px; height:1px; background:var(--color-border) } .header-two .custom-logo-link{ left:65px; padding-right:30px; background:var(--color-white) } .main { position: relative; isolation: isolate; height: 400px; overflow: hidden; } .main-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; } .main .container { height: 100%; } .main .row { height: 100%; } .main-box { display: flex; flex-direction: column; justify-content: center; /* вертикальное центрирование */ align-items: center; /* горизонтальное центрирование */ position: relative; height: 100%; /* блок занимает всю высоту родителя */ padding: 0 40px; /* горизонтальные отступы */ text-align: center; /* выравнивание текста по центру */ gap: 20px; /* равный промежуток между H1, p и кнопкой */ } .main-box:before { content: ''; position: absolute; top: 0; left: 0; /* фон покрывает весь блок */ width: 100%; height: 100%; background: rgba(255,255,255,0.6); z-index: 1; } .main-box h1 { font-size: 25px; font-weight: 500; margin: 0; /* отступы между блоками задаёт gap на .main-box */ position: relative; z-index: 2; } .main-box p { width: 100%; font-size: 25px; margin: 0; /* отступы между блоками задаёт gap на .main-box */ position: relative; z-index: 2; } .main-box a { position: relative; z-index: 2; } .info { margin-bottom: 110px; } .info-img img{ width:100% } .info-img_close{ display:none } .info-img_open{ display:block } .section-title{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center } .section-title span{ color:var(--color-primary) } .section-title h2{ position:relative; text-align:center; font-size:32px; font-weight:500; padding-bottom:15px; margin-bottom:30px; text-transform:uppercase } /* Главная: H2 секций — отступ снизу 20px на десктопе (запрос 2026-07-17) */ @media (min-width: 992px) { .front-page .section-title h2 { margin-bottom: 20px; } } .section-title { position: relative; text-align: center; } .section-title h2 { position: relative; display: inline-block; margin-top: 30px; /* отступ сверху 30px на всех устройствах */ padding-bottom: 10px; /* вместо 18px */ font-weight: 600; letter-spacing: .5px; } /* Линия Apple-style */ .section-title h2:after{ content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%); height:2px; background:linear-gradient(90deg, rgba(0,0,0,0) 0%, var(--color-primary) 40%, var(--color-blue-grad) 60%, rgba(0,0,0,0) 100%); border-radius:var(--radius-xs); animation:apple-line 2.2s ease-in-out infinite; opacity:.85; } /* Мягкое свечение (glow) */ .section-title h2:before{ content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:184px; height:6px; background:radial-gradient(circle, rgba(0,87,183,0.35) 0%, rgba(0,87,183,0) 70%); border-radius:var(--radius-pill); filter:blur(6px); animation:apple-glow 2.2s ease-in-out infinite; opacity:.8; } /* Пульсация полосы */ @keyframes apple-line{ 0%{ width:0; } 50%{ width:184px; } 100%{ width:0; } } /* Пульсация свечения */ @keyframes apple-glow{ 0%{ opacity:.1; transform:translateX(-50%) scaleX(.2); } 50%{ opacity:.9; transform:translateX(-50%) scaleX(1); } 100%{ opacity:.1; transform:translateX(-50%) scaleX(.2); } } .section-title h1{ position:relative; text-align:center; font-size:32px; font-weight:500; margin-top:30px; /* отступ сверху 30px (запрос 2026-07-17) */ padding-bottom:10px; /* вместо 15px */ margin-bottom:20px; /* вместо 30px */ text-transform:uppercase; letter-spacing:.5px; } /* Анимационная линия как у h2 */ .section-title h1:after{ content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%); height:2px; background:linear-gradient( 90deg, rgba(0,0,0,0) 0%, var(--color-primary) 40%, var(--color-blue-grad) 60%, rgba(0,0,0,0) 100% ); border-radius:var(--radius-xs); animation:apple-line 2.5s ease-in-out infinite; opacity:.9; } /* Glow эффект как у h2 */ .section-title h1:before{ content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:184px; height:8px; background:radial-gradient(circle, rgba(0,87,183,.4) 0%, rgba(0,87,183,0) 80%); border-radius:60px; filter:blur(8px); animation:apple-glow 2.5s ease-in-out infinite; opacity:.85; } /* Используем ту же анимацию */ @keyframes apple-line{ 0%{ width:0; } 50%{ width:184px; } 100%{ width:0; } } @keyframes apple-glow{ 0%{ opacity:.2; transform:translateX(-50%) scaleX(.3); } 50%{ opacity:.95; transform:translateX(-50%) scaleX(1); } 100%{ opacity:.2; transform:translateX(-50%) scaleX(.3); } } .info-text{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start } .info-text a{ position:relative; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; color:var(--color-primary); font-weight:400; margin-top:20px; padding-bottom:1px } .info-text a:after{ content:''; position:absolute; right:-35px; bottom:0; display:block; width:28px; height:20px; background:url(../img/icon/arrow-orange.svg) center no-repeat; background-size:contain } .info-text a:before{ content:''; position:absolute; bottom:0; left:0; height:1px; width:0; background:var(--color-primary); -webkit-transition:var(--transition); transition:var(--transition) } .info-img_iframe{ display:block; position:relative; width:100% } .info-img_iframe.open{ display:none } .info-img_iframe:after{ content:''; position:absolute; display:block; left:50%; top:50%; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); width:50px; height:50px; background:url(../img/icon/load.gif) center no-repeat; background-size:contain; z-index:-1 } .info-img_iframe iframe{ width:100%; height:300px } .product-boxes{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-bottom:20px } .product-box{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:center; -ms-flex-align:center; align-items:center; min-width:0; position:relative; padding:10px } /* База карточки */ .product-box { position: relative; border-radius:var(--radius-xl); transition: box-shadow .35s cubic-bezier(.4,0,.2,1), transform .3s cubic-bezier(.4,0,.2,1); } /* Легкая тень при наведении, эффект "воздуха" */ .product-box:hover { transform: translateY(-4px); box-shadow: 0 8px 22px rgba(0,0,0,0.10), 0 4px 10px rgba(0,0,0,0.06); } /* Мягкое сияние вокруг карточки */ .product-box::after { content: ""; position: absolute; inset: 0; border-radius:var(--radius-xl); pointer-events: none; opacity: 0; transition: opacity .35s cubic-bezier(.4,0,.2,1); box-shadow:var(--shadow-blue); } .product-box:hover::after { opacity: 1; } .product-box_img{ display:block; aspect-ratio:1 / 1; width:100%; margin-bottom:10px; overflow:hidden } .product-box_img img{ display:block; width:100%; height:100%; border-radius:var(--radius-lg); -o-object-fit:cover; object-fit:cover } .product-box h3{ font-size:18px; font-weight:500; text-align:center; margin-bottom:10px } .product-box button{ width:170px; height:38px; margin-bottom:10px } .product-box_btn{ width:170px; height:38px } .product-button{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; margin:30px 0 } /* .product-button a → теперь .btn .btn--primary */ .product-box_back{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; position:absolute; z-index:-1; top:0; left:0; height:100%; width:100%; background:var(--color-primary); border-radius:var(--radius-lg); -webkit-transition:.7s; transition:.7s; opacity:0 } .product-box button.open+.product-box_back{ z-index:10; opacity:1 } .product-box_back span{ font-size:18px; font-weight:500; color:var(--color-white) } .product-box_social{ display:-webkit-box; display:-ms-flexbox; display:flex; margin-top:15px } .product-box_social a{ display:block; width:30px; height:30px } .product-box_social a.product-social--ms{ background:url(../img/icon/social/messenger-white.svg) center no-repeat; background-size:contain; margin-right:20px } .product-box_social a.product-social--wa{ background:url(../img/icon/social/whatsapp-white.svg) center no-repeat; background-size:contain } .product-box_contact{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:center; -ms-flex-align:center; align-items:center; margin-top:15px } .product-box_contact a{ font-size:18px; color:var(--color-white); position:relative } .product-box_contact a:first-child{ margin-bottom:5px } .product-box_contact a:after{ content:''; position:absolute; bottom:0; left:0; height:1px; width:0; background:var(--color-white); -webkit-transition:var(--transition); transition:var(--transition) } /*standarts*/ .standarts-slider { padding-bottom: 30px; padding-left: 15px; padding-right: 15px; margin-bottom: 110px; } .standarts-slide { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center; -ms-align-items: center; align-items: center; max-height: 150px; padding: 5px; background: var(--color-white); box-shadow: inset 0px 0px 3px 0px rgba(0,69,131,0.2); } .standarts-slide img { height: 100%; } .swiper-slide { border-radius:var(--radius-lg); overflow: hidden; } .swiper-slide img { border-radius:var(--radius-lg); } .swiper-container-horizontal>.swiper-pagination-progressbar { top: auto; bottom: 0; max-width: 300px; left: 50%; transform: translateX(-50%); padding-left: 15px; } .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: var(--color-primary); } /*-standarts*/ .plus{ margin-bottom:80px } .plus-boxs{ display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between } .plus-box{ width:32%; background:var(--color-white); -webkit-box-shadow:var(--shadow-card); box-shadow:var(--shadow-card); border-radius:var(--radius-lg); margin-bottom:30px } .plus-box img{ width:100%; height:100%; border-radius:var(--radius-lg); -o-object-fit:cover; object-fit:cover } .plus-box_text{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:center; -ms-flex-align:center; align-items:center; padding:40px 17px } .plus-box_text span{ display:block; width:32px; height:32px; background:url(../img/icon/ok.svg) center no-repeat; background-size:contain; margin-bottom:20px } .plus-box_text p{ text-align:center; margin-bottom:0 } .news.news-hide{ display:none } .news.news-show{ display:block } .news{ margin-bottom:80px } .news-boxs{ display:flex; flex-wrap:wrap; justify-content:space-between; } /* Карточка новости — Apple-style */ .news-box{ display:flex; position:relative; width:49%; color:var(--color-text); padding:14px; margin-bottom:20px; /* База */ border-radius:var(--radius-xl); transition:box-shadow .35s cubic-bezier(.4,0,.2,1), transform .3s cubic-bezier(.4,0,.2,1); } /* Hover эффект подъёма */ .news-box:hover{ transform:translateY(-4px); color:var(--color-text); box-shadow: 0 8px 22px rgba(0,0,0,0.10), 0 4px 10px rgba(0,0,0,0.06); } /* Сияние */ .news-box::after{ content:""; position:absolute; inset:0; border-radius:var(--radius-xl); pointer-events:none; opacity:0; transition:opacity .35s cubic-bezier(.4,0,.2,1); box-shadow:var(--shadow-blue); } .news-box:hover::after{ opacity:1; } .news-box_img{ width:200px; min-width:200px; height:170px; margin-right:10px } .news-box_img img{ width:100%; height:100%; border-radius:var(--radius-lg); -o-object-fit:cover; object-fit:cover } .news-box h3{ width:100%; font-size:20px; font-weight:500; text-transform:uppercase; margin-bottom:10px; -webkit-transition:var(--transition); transition:var(--transition); -webkit-box-flex:1; -ms-flex:1 1 auto; flex:1 1 auto } .news-box p{ width:100%; font-size:15px; margin-bottom:10px; -webkit-box-flex:1; -ms-flex:1 1 auto; flex:1 1 auto } .news-box span{ font-size:14px; font-weight:500 } .news-box_date{ position:absolute; right:10px; bottom:10px } .description-box{ margin:auto } .description-box p{ font-size:20px; font-weight:400; text-align:center; margin-bottom:30px } .description-box_button{ display:-webkit-box; display:-ms-flexbox; display:flex; margin-bottom: 30px; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center } .description-box_products{ position:relative; z-index:2; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; height:38px; margin-right:50px } .description-box_contact{ height:38px } .products{ margin-top:0; margin-bottom:0 } .products-top{ margin:auto } .products-top p{ text-align:center; font-size:18px } .products-tabs_list{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; padding-left:0; margin-bottom:45px } .products-tabs_list li{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; position:relative; width:160px; height:40px; font-size:16px; color:var(--color-text-caption); border:1px solid var(--color-border); border-radius:var(--radius-xs); margin-right:5px; cursor:pointer } .products-tabs_list li.active{ border-radius:var(--radius-xs); color:var(--color-primary); font-weight:400; border:1px solid var(--color-primary) } .products-tabs_list li.active:hover{ border:1px solid var(--color-primary) } .products-tabs_list li.active:hover:before,.products-tabs_list li.active:hover:after{ display:none } .products-tabs_list li:last-child{ margin-right:0 } .products-tabs_list li::after,.products-tabs_list li::before{ content:''; position:absolute; opacity:1; z-index:-1; -webkit-transition:all var(--transition-slow) ease-out; transition:all var(--transition-slow) ease-out; top:0; bottom:0; left:0; right:0; border-radius:var(--radius-xs) } .products-tabs_list li::before{ border-top:1px solid var(--color-primary); border-bottom:1px solid var(--color-primary); -webkit-transform:scale(0,1); transform:scale(0,1) } .products-tabs_list li::after{ border-left:1px solid var(--color-primary); border-right:1px solid var(--color-primary); -webkit-transform:scale(1,0); transform:scale(1,0) } .products-tabs_boxs{ padding-left:0; margin-bottom:30px } .products-tabs_boxs li{ display:grid; grid-template-columns:repeat(4,1fr); column-gap:20px; row-gap:30px; width:100% } .products-tabs_boxs li .product-box{ margin:0 } .products-wrap{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:center; -ms-flex-align:center; align-items:center; background:var(--color-white); -webkit-box-shadow:var(--shadow-card-strong); border-radius:var(--radius-lg); box-shadow:var(--shadow-card-strong); margin:auto; padding:40px 60px; margin-bottom:50px } .products-wrap p{ text-align:center } .products-wrap ul{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:center; -ms-flex-align:center; align-items:center; padding-left:0; margin-bottom:0 } .products-wrap li{ font-weight:500; list-style-type:disc } .products-wrap span { display: block; width: 0; height: 2px; background: linear-gradient( 90deg, rgba(0,0,0,0) 0%, var(--color-primary) 40%, var(--color-blue-grad) 60%, rgba(0,0,0,0) 100% ); border-radius:var(--radius-xs); margin-bottom: 20px; animation: products-line 2.5s ease-in-out infinite; position: relative; overflow: hidden; } /* мягкое свечение под линией */ .products-wrap span:after { content: ''; position: absolute; bottom: -2px; left: 50%; transform: translateX(-50%); width: 84px; height: 6px; background: radial-gradient(circle, rgba(0,87,183,0.35) 0%, rgba(0,87,183,0) 70%); border-radius:var(--radius-pill); filter: blur(6px); animation: products-glow 2.5s ease-in-out infinite; opacity: .8; } /* анимация движения линии */ @keyframes products-line { 0% { width: 0; opacity: 0.2; } 50% { width: 84px; opacity: 1; } 100% { width: 0; opacity: 0.2; } } /* анимация свечения */ @keyframes products-glow { 0% { opacity: .1; transform: translateX(-50%) scaleX(.3); } 50% { opacity: .95; transform: translateX(-50%) scaleX(1); } 100% { opacity: .1; transform: translateX(-50%) scaleX(.3); } } .products-descr{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:center; -ms-flex-align:center; align-items:center; margin:auto; margin-bottom:50px } .products-descr p{ text-align:center } .products-descr span { display: block; width: 0; height: 2px; background: linear-gradient( 90deg, rgba(0,0,0,0) 0%, var(--color-primary) 40%, var(--color-blue-grad) 60%, rgba(0,0,0,0) 100% ); border-radius:var(--radius-xs); margin-bottom: 20px; animation: products-line 2.5s ease-in-out infinite; position: relative; overflow: hidden; } /* мягкое свечение под линией */ .products-descr span:after { content: ''; position: absolute; bottom: -2px; left: 50%; transform: translateX(-50%); width: 84px; height: 6px; background: radial-gradient(circle, rgba(0,87,183,0.35) 0%, rgba(0,87,183,0) 70%); border-radius:var(--radius-pill); filter: blur(6px); animation: products-glow 2.5s ease-in-out infinite; opacity: .8; } /* анимация движения линии */ @keyframes products-line { 0% { width: 0; opacity: 0.2; } 50% { width: 84px; opacity: 1; } 100% { width: 0; opacity: 0.2; } } /* анимация свечения */ @keyframes products-glow { 0% { opacity: .1; transform: translateX(-50%) scaleX(.3); } 50% { opacity: .95; transform: translateX(-50%) scaleX(1); } 100% { opacity: .1; transform: translateX(-50%) scaleX(.3); } } .products-boxs{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; margin-bottom:50px } .products-box{ position:relative; width:30%; padding:0 10px; height:80px } .products-box:after{ content:''; position:absolute; right:-30px; top:0; width:1px; height:80%; background:var(--color-border) } .products-box:last-child:after{ display:none } .products-box p{ text-align:center; margin-bottom:0 } .products-box span{ position:absolute; left:0; bottom:0; display:block; width:100%; height:2px; background:var(--color-primary) } .products-info{ margin:auto } .products-info p{ text-align:center } .uncos{ margin-top:0; margin-bottom:70px } .uncos-boxs{ display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between } .uncos-boxs a{ display:none } .products-load{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; margin-top:10px } .products-load_btn{ border:0; position:relative; z-index:2; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center } .products-load_btn:after{ content:''; display:block; width:17px; height:17px; background:url(../img/icon/arrow.svg) center no-repeat; background-size:contain; -webkit-transform:rotate(90deg); transform:rotate(90deg); margin-left:10px } .error-box{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; margin:60px 0 } .error-box h1{ font-weight:900; font-size:100px } .error-box p{ font-size:30px; font-weight:500; text-align:center } /* UNIFIED BUTTON SYSTEM: вся визуал и hover (радиус 12px, высота 38px, цвета, смена фона при наведении) берётся из .btn .btn--primary (см. UNIFIED BUTTON SYSTEM выше). Старая уникальная анимация hover-wipe (scaleX :before) удалена — она конфликтовала с унификацией и давала «старую» анимацию поверх .btn. Здесь оставлен только position:relative, чтобы кнопка держала свой слой (z-index) внутри flex-колонки .error-box. */ .error-box a{ position:relative; z-index:2 } .about{ margin-top:0; margin-bottom:0 } .about-boxs{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; -ms-flex-wrap:wrap; flex-wrap:wrap } .about-box{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; width:32%; height:215px; background:var(--color-white); -webkit-box-shadow:var(--shadow-card); box-shadow:var(--shadow-card); border-radius:var(--radius-lg); margin-bottom:25px } .about-box p{ text-align:center } .about-box span{ display:block; margin-bottom:20px } .about-box:nth-child(1) span{ width:35px; height:35px; background:url(../img/icon/about/01.svg) center no-repeat; background-size:contain } .about-box:nth-child(2) span{ width:35px; height:35px; background:url(../img/icon/about/02.svg) center no-repeat; background-size:contain } .about-box:nth-child(3) span{ width:35px; height:35px; background:url(../img/icon/about/03.svg) center no-repeat; background-size:contain } .about-box:nth-child(4) span{ width:35px; height:35px; background:url(../img/icon/about/04.svg) center no-repeat; background-size:contain } .about-box:nth-child(5) span{ width:35px; height:35px; background:url(../img/icon/about/05.svg) center no-repeat; background-size:contain } .about-box:nth-child(6) span{ width:35px; height:35px; background:url(../img/icon/about/06.svg) center no-repeat; background-size:contain } .about-p p{ text-align:center; font-weight:400; font-size:18px; color:var(--color-primary) } .about-p{ margin-bottom:70px } .about-certificate{ padding:70px 0; background:var(--color-surface); margin-bottom:70px } .about-certificate_text span { display: block; width: 0; height: 2px; background: linear-gradient( 90deg, rgba(0,0,0,0) 0%, var(--color-primary) 40%, var(--color-blue-grad) 60%, rgba(0,0,0,0) 100% ); border-radius:var(--radius-xs); margin-bottom: 30px; animation: products-line 2.5s ease-in-out infinite; position: relative; overflow: hidden; } /* мягкое свечение под линией */ .about-certificate_text span:after { content: ''; position: absolute; bottom: -2px; left: 50%; transform: translateX(-50%); width: 284px; height: 6px; background: radial-gradient(circle, rgba(0,87,183,0.35) 0%, rgba(0,87,183,0) 70%); border-radius:var(--radius-pill); filter: blur(6px); animation: products-glow 2.5s ease-in-out infinite; opacity: .8; } /* анимация движения линии */ @keyframes products-line { 0% { width: 0; opacity: 0.2; } 50% { width: 284px; opacity: 1; } 100% { width: 0; opacity: 0.2; } } /* анимация свечения */ @keyframes products-glow { 0% { opacity: .1; transform: translateX(-50%) scaleX(.3); } 50% { opacity: .95; transform: translateX(-50%) scaleX(1); } 100% { opacity: .1; transform: translateX(-50%) scaleX(.3); } } .about-info{ margin-bottom:70px } .about-info_box{ display:-webkit-box; display:-ms-flexbox; display:flex } .about-info_img{ min-width:55% } .about-info_img img{ width:100%; height:100%; border-radius:var(--radius-lg); -o-object-fit:cover; object-fit:cover } .about-info_text{ padding:34px; background:var(--color-white); -webkit-box-shadow:var(--shadow-card); border-radius:var(--radius-lg); box-shadow:var(--shadow-card) } .about-info_text span { display: block; width: 0; height: 2px; background: linear-gradient( 90deg, rgba(0,0,0,0) 0%, var(--color-primary) 40%, var(--color-blue-grad) 60%, rgba(0,0,0,0) 100% ); border-radius:var(--radius-xs); margin-bottom: 30px; animation: products-line 2.5s ease-in-out infinite; position: relative; overflow: hidden; } /* мягкое свечение под линией */ .about-info_text span:after { content: ''; position: absolute; bottom: -2px; left: 50%; transform: translateX(-50%); width: 284px; height: 6px; background: radial-gradient(circle, rgba(0,87,183,0.35) 0%, rgba(0,87,183,0) 70%); border-radius:var(--radius-pill); filter: blur(6px); animation: products-glow 2.5s ease-in-out infinite; opacity: .8; } /* анимация движения линии */ @keyframes products-line { 0% { width: 0; opacity: 0.2; } 50% { width: 284px; opacity: 1; } 100% { width: 0; opacity: 0.2; } } /* анимация свечения */ @keyframes products-glow { 0% { opacity: .1; transform: translateX(-50%) scaleX(.3); } 50% { opacity: .95; transform: translateX(-50%) scaleX(1); } 100% { opacity: .1; transform: translateX(-50%) scaleX(.3); } } @-webkit-keyframes section-line2{ from{ width:0 } to{ width:42px } } @keyframes section-line2{ from{ width:0 } to{ width:42px } } .about-text_box{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center } .about-text_box p{ width:80%; text-align:center } .about-text_descr{ font-weight:500; margin-bottom: 30px; margin-top:40px } .about-text_descr p{ width:100%; text-align:center; margin-bottom:0 } .about-text_descr p:nth-child(2){ color:var(--color-primary) } .about-certificate_btn{ display:none; margin:10px 0 } .about-certificate_btn span{ color:var(--color-primary); font-weight:500 } .about-certificate_btn.open{ display:none } .about-slider { padding-left: 15px; padding-right: 15px; } .about-slide { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center; -ms-align-items: center; align-items: center; } .contacts{ margin-top:0; margin-bottom:70px } .phone-row{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start; gap:4px; margin-bottom:14px } .phone-row:last-of-type{ margin-bottom:0 } .phone-dept{ -webkit-box-ordinal-group:0; -ms-flex-order:-1; order:-1; display:block; font-size:10px; font-weight:500; line-height:1; letter-spacing:.08em; text-transform:uppercase; color:var(--color-text-muted) } .contacts-map{ position:relative; width:100%; height:400px } .contacts-map iframe { width:100%; height:100%; border-radius:var(--radius-lg); overflow: hidden; box-shadow: 0 8px 22px rgba(0,0,0,0.10), 0 4px 10px rgba(0,0,0,0.06); } /* Обёртка карты ограничена шириной .container (как и остальной контент), см. page-contacts.php — класс container даёт max-width + боковые отступы */ .contacts .contacts-map-wrap{ margin-top:0 } .contacts-info_social{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:stretch; -ms-flex-align:stretch; align-items:stretch; gap:12px; margin-top:18px; width:100% } .contacts-info_social a{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; gap:12px; padding:13px 20px; border-radius:var(--radius-lg); color:var(--color-white); font-size:15px; font-weight:500; text-decoration:none; -webkit-box-shadow:var(--shadow-card); box-shadow:var(--shadow-card); -webkit-transition:var(--transition); transition:var(--transition) } .contacts-info_social a:last-child{ margin-bottom:0 } .contacts-info_social a:after{ display:none } .contacts-info_social a.contacts-social--ms{ background:#0084ff } .contacts-info_social a.contacts-social--wa{ background:#25d366 } .contacts-info_social a:before{ content:''; display:block; -webkit-box-flex:0; -ms-flex:0 0 auto; flex:0 0 auto; width:22px; height:22px; background-position:center; background-repeat:no-repeat; background-size:contain } .contacts-info_social a.contacts-social--ms:before{ background-image:url(../img/icon/social/messenger-white.svg) } .contacts-info_social a.contacts-social--wa:before{ background-image:url(../img/icon/social/whatsapp-white.svg) } .contacts-info_social a:hover{ -webkit-transform:translateY(-2px); transform:translateY(-2px); color:var(--color-white); -webkit-box-shadow:0 10px 22px rgba(0,0,0,.16); box-shadow:0 10px 22px rgba(0,0,0,.16) } /*====================================== КОНТАКТЫ — РЕДИЗАЙН (на базе draft-contact.html) Данные — из ACF; форма — CF7 id=5; цвета/радиусы — из :root. ======================================*/ .contact-hero{ padding:90px 0 50px } .contact-hero_lead{ max-width:600px; margin:0 auto; text-align:center; color:var(--color-text-muted); font-size:18px; line-height:1.55 } .contact-main{ display:grid; grid-template-columns:360px 1fr; gap:50px; align-items:start; padding-bottom:70px } .contact-aside{ position:sticky; top:30px; align-self:start } .contact-card{ padding:20px 0; border-bottom:1px solid var(--color-border) } .contact-card:last-of-type{ border-bottom:0 } .contact-card_title{ margin:0 0 10px; font-size:16px; font-weight:600; color:var(--color-text-strong) } .contact-card_text{ margin:0; color:var(--color-text-muted); line-height:1.6 } .contact-card a{ color:var(--color-text-strong); text-decoration:none; -webkit-transition:var(--transition); transition:var(--transition) } .contact-card a:hover{ color:var(--color-primary); text-decoration:underline } .contact-card .phone-row{ margin-bottom:14px } .contact-card .phone-row:last-child{ margin-bottom:0 } .contact-card .phone-row a{ font-size:16px; color:var(--color-text-strong) } .contact-quick{ margin-top:28px } .contact-quick_title{ margin:0 0 14px; font-size:14px; font-weight:600; color:var(--color-text) } .contact-quick .contacts-info_social{ margin-top:0 } .contacts-form h2{ font-size:30px; text-align:left; margin:0 0 8px; color:var(--color-text-strong) } .contacts-form > p{ color:var(--color-text-muted); margin:0 0 28px } .contacts-form_field{ margin-bottom:0 } .contacts-form_field:has(textarea), .contacts-form_field:has(.contacts-form_textarea){ grid-column:1 / -1 } /* TRUST */ .contact-trust{ margin-top:60px; background:var(--color-surface); padding:50px 0; border-top:1px solid var(--color-border); border-bottom:1px solid var(--color-border) } .contact-trust_grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px } .contact-trust_item{ background:var(--color-white); border:1px solid var(--color-border); border-radius:var(--radius-lg); padding:24px } .contact-trust_item h3{ margin:0 0 8px; font-family:'Roboto',sans-serif; font-weight:500; font-size:20px; color:var(--color-text-strong) } .contact-trust_item p{ margin:0; color:var(--color-text-muted); font-size:15px; line-height:1.5 } /* CTA */ .contact-cta{ text-align:center; padding:90px 0 } .contact-cta h2{ font-size:38px; color:var(--color-text-strong); margin:0 0 14px } .contact-cta p{ color:var(--color-text-muted); max-width:560px; margin:0 auto 28px } /* .contact-cta_btn → теперь .btn .btn--primary (см. UNIFIED BUTTON SYSTEM) */ /*====================================== ФОРМА ЗАХВАТА ======================================*/ .contacts-form h3 { text-align: center; margin-top: 0; margin-bottom: 20px; } .contacts-form h4 { text-align: center; color: var(--color-text-muted); font-size: 14px; font-weight: 400; margin-top: 0px; margin-bottom: 15px; } .contacts-form { background: var(--color-surface); border: 0; border-radius: 24px; padding: 35px; margin: 0; max-width: none; } .contacts-form_inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; } /* Служебный fieldset CF7 (hidden-inputs _wpcf7*) не имеет своего сброса в теме, поэтому дефолтная рамка
рисовалась пустым блоком над 1-м полем. Контейнер скрываем — вложенные hidden-inputs всё равно отправляются формой. */ fieldset.hidden-fields-container { display: none; } .contacts-form_field { display: flex; flex-direction: column; } /* ========================= LABEL ========================= */ .form-label { font-size: 14px; font-weight: 500; color: var(--color-primary); margin-bottom: 2px; line-height: 1.3; /* Резервируем высоту под 2 строки: у длинных ярлыков (напр. «Destination Country, City / Port») перенос на 2 строки не сдвигает инпут вниз, поэтому поля в одном ряду grid остаются на одном уровне. */ min-height: 2.6em; } .form-label .required { color: var(--color-accent); font-size: 16px; position: relative; top: -1px; } /* ========================= INPUT WRAPPER (SAFE) ========================= */ .input-wrap { position: relative; } /* CF7 wrapper НЕ влияет */ .wpcf7-form-control-wrap { display: block; margin: 0; padding: 0; } /* ========================= INPUTS ========================= */ .contacts-form_input, .contacts-form_textarea { width: 100%; border: 0.5px solid var(--color-border); border-radius:var(--radius-lg); font-size: 16px; font-weight: 300; color: var(--color-text-strong); box-sizing: border-box; background-color: var(--color-white); position: relative; z-index: 2; } /* INPUT */ .contacts-form_input { height: 32px; padding: 0 20px; } /* TEXTAREA */ .contacts-form_textarea { height: 150px; padding: 10px 20px; resize: none; display: block; line-height: 1.4; } /* ========================= ❌ NUMBER SPINNERS OFF ========================= */ input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } input[type=number] { -moz-appearance: textfield; } /* ========================= SELECT ========================= */ select.contacts-form_input { appearance: none; -webkit-appearance: none; -moz-appearance: none; cursor: pointer; padding-right: 48px; background-image: linear-gradient(45deg, transparent 50%, var(--color-primary) 50%), linear-gradient(135deg, var(--color-primary) 50%, transparent 50%); background-position: calc(100% - 20px) 50%, calc(100% - 14px) 50%; background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; } /* ========================= SAFE GLOW (FIXED - ONLY FIELD) ========================= */ /* glow рисуется ТОЛЬКО через input/textarea, не через wrapper */ .contacts-form_input, .contacts-form_textarea { transition: box-shadow .35s ease, border-color .2s ease; } /* focus glow */ .contacts-form_input:focus, .contacts-form_textarea:focus, select.contacts-form_input:focus { outline: none; border-color: var(--color-primary); box-shadow:var(--shadow-blue); } /* error glow */ .wpcf7-not-valid { border-color: var(--color-accent) !important; box-shadow: 0 0 16px rgba(229, 53, 53, .22) !important; } /* ========================= BUTTON ========================= */ /*====================================== UNIFIED BUTTON SYSTEM (.btn) Все залитые/контурные CTA используют .btn + .btn--primary / .btn--outline. Единый радиус: --radius-lg (12px). Цвета/шрифт/hover — только здесь. ======================================*/ .btn{ display:inline-flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; box-sizing:border-box; min-height:38px; padding:0 32px; border:0; border-radius:var(--radius-lg); font-family:'Roboto',sans-serif; font-size:16px; font-weight:400; line-height:1.2; text-decoration:none; white-space:nowrap; cursor:pointer; -webkit-transition:background var(--transition),color var(--transition); transition:background var(--transition),color var(--transition); -webkit-transform:translateZ(0); transform:translateZ(0) } .btn:focus-visible{ outline:2px solid var(--color-primary); outline-offset:2px } .btn--primary{ background:var(--color-primary); color:var(--color-white) } .btn--primary:hover{ background:var(--color-primary-hover); color:var(--color-white) } .btn--outline{ position:relative; background:transparent; color:var(--color-primary); border:1px solid var(--color-primary); -webkit-transition:background var(--transition),color var(--transition),border-color var(--transition); transition:background var(--transition),color var(--transition),border-color var(--transition) } /* «Рисование карандашом» толстого контура при наведении */ .btn--outline::before, .btn--outline::after{ content:''; position:absolute; inset:0; border-radius:inherit; pointer-events:none; box-sizing:border-box } /* горизонтали (верх+низ) рисуются от центра к краям */ .btn--outline::before{ border-top:2px solid var(--color-primary-hover); border-bottom:2px solid var(--color-primary-hover); -webkit-transform:scaleX(0); transform:scaleX(0); -webkit-transition:-webkit-transform var(--transition); transition:transform var(--transition) } /* вертикали (лево+право) рисуются после горизонталей */ .btn--outline::after{ border-left:2px solid var(--color-primary-hover); border-right:2px solid var(--color-primary-hover); -webkit-transform:scaleY(0); transform:scaleY(0); -webkit-transition:-webkit-transform var(--transition); transition:transform var(--transition) } .btn--outline:hover{ background:transparent; color:var(--color-primary-hover); border-color:transparent } .btn--outline:hover::before{ -webkit-transform:scaleX(1); transform:scaleX(1) } .btn--outline:hover::after{ -webkit-transform:scaleY(1); transform:scaleY(1); -webkit-transition-delay:.2s; transition-delay:.2s } .contacts-form_btn { display: flex; justify-content: center; margin-top: 20px; } .contacts-form_btn input { width: 170px; height: 38px; border: 0; cursor: pointer; font-family:'Roboto',sans-serif; font-size:16px; font-weight:400; border-radius:var(--radius-lg); background:var(--color-primary); color:var(--color-white); -webkit-transition:background var(--transition),color var(--transition); transition:background var(--transition),color var(--transition) } .contacts-form_btn input:hover{ background:var(--color-primary-hover); color:var(--color-white) } /* ========================= HONEYPOT ========================= */ .email-wrap { display: none !important; } /*====================================== FULL AUTOFILL RESET ======================================*/ input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px var(--color-white) inset !important; -webkit-text-fill-color: var(--color-text-strong) !important; border-radius:var(--radius-lg); transition: background-color 9999s ease-in-out 0s; } input, textarea, select { font-size: 16px !important; } /*====================================== КОНТАКТЫ — АДАПТИВ (наши брейкпоинты) ======================================*/ @media (max-width: 991px){ .contact-hero{ padding:60px 0 36px } .contact-main{ grid-template-columns:1fr; gap:36px; padding-bottom:50px } .contact-aside{ position:static; top:auto } .contacts-form{ padding:28px } .contacts-form_inputs{ grid-template-columns:1fr } .contact-trust_grid{ grid-template-columns:repeat(3,1fr) } .contact-cta{ padding:64px 0 } .contact-cta h2{ font-size:30px } } @media (max-width: 575px){ .contact-hero{ padding:48px 0 28px } .contact-hero_lead{ font-size:16px } .contacts-form{ padding:22px } .contact-trust_grid{ grid-template-columns:1fr } .contact-quick .contacts-info_social{ gap:10px } .contact-cta{ padding:48px 0 } .contact-cta h2{ font-size:26px } .contact-cta .btn{ width:100% } } /*====================================== END =================================*/ .single{ margin-top:30px; margin-bottom:70px } .single-img{ display:block; width:100%; overflow:hidden; align-self:stretch; padding:0 } .single-img img{ display:block; width:100%; height:100%; border-radius:var(--radius-lg); -o-object-fit:cover; object-fit:cover } .single-info_top{ display:block; padding-bottom:7px; margin-bottom:10px; border-bottom:0 } .single-info_top h1, .single-info_top h2{ display:block; font-size:28px; font-weight:500; line-height:1.2; color:var(--color-white); background:var(--color-primary); padding:12px 28px; border-radius:var(--radius-xl); box-shadow:var(--shadow-card); text-align:center; margin:0 } .single-info_top button{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; background:transparent; border:0; font-weight:400; color:var(--color-primary) } .single-info_top button:before{ content:''; display:block; height:15px; width:1px; background:var(--color-border); margin-right:20px } .single-info_top button:after{ content:''; display:block; width:20px; height:20px; background:url(../img/icon/play.svg) center no-repeat; background-size:contain; margin-left:7px; -webkit-transition:var(--transition); transition:var(--transition) } .single-info_text{ display:block; font-size:18px; font-weight:500; line-height:1.2; color:var(--color-white); background:var(--color-primary); padding:12px 28px; border-radius:var(--radius-xl); box-shadow:var(--shadow-card); text-align:center; margin-bottom:15px } .single-info_social{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start } .single-info_social a{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; position:relative; color:var(--color-text); font-size:18px; -webkit-transition:.3s; transition:.3s; margin-bottom:10px } .single-info_social a:nth-child(1):before{ content:''; display:block; width:30px; height:30px; background:url(../img/icon/social/messenger.svg) center no-repeat; background-size:contain; margin-right: 10px; } .single-info_social a:nth-child(2):before{ content:''; display:block; width:30px; height:30px; background:url(../img/icon/social/whatsapp.svg) center no-repeat; background-size:contain; margin-right: 10px; } .single-info_contact{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start } .single-info_contact a{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; position:relative; color:var(--color-text); font-size:18px; -webkit-transition:.3s; transition:.3s; margin-bottom:10px } .single-info_contact a:nth-child(1):before{ content:''; display:block; width:30px; height:30px; background:url(../img/icon/email.svg) center no-repeat; background-size:contain; margin-right:10px } .single-info_contact a:nth-child(2):before{ content:''; display:block; width:30px; height:30px; background:url(../img/icon/phone.svg) center no-repeat; background-size:contain; margin-right:10px } .single-info_box{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start } /* ===== Product specifications — sticker/label card ===== */ .single-specs{ background:var(--color-white); border-radius:var(--radius-xl); box-shadow:var(--shadow-card); margin-bottom:10px } .single-specs_head{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; gap:8px; background:var(--color-primary); color:var(--color-white); border-radius:var(--radius-xl) var(--radius-xl) 0 0; padding:13px 22px; font-size:14px; font-weight:500; letter-spacing:.12em; text-transform:uppercase } .single-specs_icon{ width:16px; height:16px; flex:0 0 auto; margin-left:auto } .single-specs_body{ padding:6px 22px 16px } .single-specs_list{ padding-left:0; margin-bottom:0 } .single-specs_item{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:baseline; -ms-flex-align:baseline; align-items:baseline; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; gap:14px; padding:11px 2px; border-bottom:1px dashed var(--color-border) } .single-specs_item:last-child{ border-bottom:0; padding-bottom:4px } .single-specs_name{ color:var(--color-text-muted); font-size:14px; font-weight:400 } .single-specs_val{ color:var(--color-text-strong); font-size:15px; font-weight:500; text-align:right } .single-text{ margin:40px 0 } .single-text_title{ font-weight:500; font-size:18px; margin-bottom:10px } .single-text_line{ display:block; position:relative; width:100%; height:1px; background:var(--color-bg-soft); margin-bottom:10px } .single-text_line:before{ content:''; position:absolute; top:-1px; left:0; background:var(--color-primary); height:2px; -webkit-animation:section-line3 5s infinite; animation:section-line3 5s infinite } @-webkit-keyframes section-line3{ from{ width:0 } to{ width:170px } } @keyframes section-line3{ from{ width:0 } to{ width:170px } } /* ===== FAQ accordion (P6-6, card style — mirrors .product-box) ===== */ .single-faq{ margin-top:40px } /* мягкая «подложка», на которой плавают белые карточки (Apple-подобно) */ .single-faq_list{ margin:0; background:var(--color-surface); border-radius:var(--radius-xl); padding:14px } /* каждый вопрос — отдельная скруглённая карточка */ .single-faq_item{ background:var(--color-white); border-radius:var(--radius-xl); box-shadow:var(--shadow-card); margin-bottom:12px; overflow:hidden; transition:transform var(--transition-fast) var(--ease-smooth), box-shadow var(--transition-fast) var(--ease-smooth) } .single-faq_item:last-child{ margin-bottom:0 } .single-faq_item:hover{ transform:translateY(-2px); box-shadow:0 8px 22px rgba(0,0,0,.10), 0 4px 10px rgba(0,0,0,.06) } .single-faq_item dt{ margin:0 } .single-faq_item dd{ margin:0 } .single-faq_q{ display:flex; align-items:center; justify-content:space-between; gap:16px; width:100%; padding:8px 22px; background:transparent; border:0; cursor:pointer; text-align:left; font-family:inherit; font-size:17px; font-weight:500; line-height:1.4; color:var(--color-text-strong); transition:color var(--transition-fast) var(--ease-smooth) } .single-faq_q:hover{ color:var(--color-primary) } .single-faq_q:focus-visible{ outline:2px solid var(--color-primary); outline-offset:2px; border-radius:var(--radius-xl) } .single-faq_q-text{ padding-right:0 } /* круглый «+»-индикатор, как CTA на карточке товара */ .single-faq_icon{ position:relative; flex:0 0 auto; width:28px; height:28px; border-radius:var(--radius-round); background:var(--color-surface); transition:background var(--transition-fast) var(--ease-smooth) } .single-faq_item:hover .single-faq_icon, .single-faq_item.open .single-faq_icon{ background:var(--color-primary) } /* шеврон «⌄», поворачивается на 180° при открытии */ .single-faq_icon::before{ content:''; position:absolute; left:50%; top:50%; width:9px; height:9px; border-right:2px solid var(--color-primary); border-bottom:2px solid var(--color-primary); border-radius:1px; transform:translate(-50%,-50%) rotate(45deg); transition:transform var(--transition-fast) var(--ease-smooth), border-color var(--transition-fast) var(--ease-smooth) } .single-faq_item:hover .single-faq_icon::before, .single-faq_item.open .single-faq_icon::before{ border-color:var(--color-white) } .single-faq_item.open .single-faq_icon::before{ transform:translate(-50%,-28%) rotate(225deg) } /* высота анимируется через max-height; реальная высота задаётся из JS (scrollHeight) */ .single-faq_a{ max-height:0; overflow:hidden; padding:0 22px; color:var(--color-text); font-size:15px; line-height:1.6; transition:max-height var(--transition) cubic-bezier(.32,.72,0,1) } .single-faq_a-inner{ padding-bottom:20px } .single-text_line.two:before{ -webkit-animation:section-line4 5s infinite; animation:section-line4 5s infinite } @-webkit-keyframes section-line4{ from{ width:0 } to{ width:60px } } @keyframes section-line4{ from{ width:0 } to{ width:60px } } .single-video_hide{ display:none } .single-video_show{ display:block } .single-video iframe{ width:100%; height:300px } .single-video_iframe{ width:100%; height:100% } .single-video{ position:relative; margin:40px 0 } .single-video_iframe{ position:relative } .single-video_iframe:after{ content:''; position:absolute; display:block; left:50%; top:50%; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); width:50px; height:50px; background:url(../img/icon/load.gif) center no-repeat; background-size:contain; z-index:-1 } .single-text p:last-child{ margin-bottom:0 } /* ===== Single product — redesigned layout (draft.html design source) ===== */ /* Hero */ .single .product-intro{ max-width:850px; margin:30px 0 20px } .single .category{ color:var(--color-primary); font-size:14px; font-weight:500; text-transform:uppercase; letter-spacing:.08em; margin-bottom:18px } .single .product-intro h1{ font-family:'Roboto',sans-serif; font-weight:500; font-size:56px; line-height:1.1; letter-spacing:-2px; margin-bottom:18px } .single .product-intro p{ max-width:720px; color:var(--color-text-muted); font-size:20px; line-height:1.6 } @media(max-width:767px){ .single .product-intro h1{ font-size:40px } .single .product-intro p{ font-size:17px } } /* Two-column layouts (hero + content/quality sections) */ .single .content-layout{ display:grid; grid-template-columns:minmax(0,1fr) 390px; gap:60px; align-items:stretch } .single .content-layout--hero{ align-items:stretch } @media(max-width:991px){ .single .content-layout{ grid-template-columns:1fr } } /* Square product image */ .single .product-image-wrapper{ position:relative; display:flex; justify-content:center; align-items:center } .single .product-image{ position:relative; width:100%; max-width:540px; aspect-ratio:1 / 1; border-radius:28px; overflow:hidden; background:#f3f3ef } .single .product-image img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block } @media(max-width:991px){ .single .product-image-wrapper{ height:auto; display:block } .single .product-image{ width:100%; max-width:540px; margin:0 auto; height:auto } .single .product-image img{ position:static; height:auto; aspect-ratio:1 / 1 } } /* Contact card */ .single .export-card{ background:var(--color-surface); border-radius:24px; padding:32px; display:flex; flex-direction:column; justify-content:flex-start } .single .export-card h3{ font-family:'Roboto',sans-serif; font-weight:500; font-size:26px; margin-bottom:12px } .single .export-card > p{ color:var(--color-text-muted); margin-bottom:25px } .single .export-contact{ flex:1; display:flex; flex-direction:column; justify-content:center; padding:15px 0; border-bottom:1px solid var(--color-border) } .single .export-contact:last-child{ border:none } .single .export-contact span{ display:block; color:var(--color-text-muted); font-size:13px; margin-bottom:5px } .single .export-contact a{ align-self:flex-start; display:inline-flex; align-items:center; gap:8px; color:var(--color-text-strong); text-decoration:none; font-weight:500; transition:color var(--transition) } .single .export-contact a:after{ content:''; flex:0 0 auto; width:18px; height:18px; background:center / contain no-repeat } .single .export-contact a.export-link--wa:after{ background-image:url(../img/icon/social/whatsapp.svg) } .single .export-contact a.export-link--ms:after{ background-image:url(../img/icon/social/messenger.svg) } .single .export-contact a:hover{ color:var(--color-primary); text-decoration:underline } /* Content sections spacing */ .single .content-section{ padding:30px 0 } /* Article typography */ .single .article h2{ font-family:'Roboto',sans-serif; font-weight:700; font-size:36px; line-height:1.2; margin-top:0; margin-bottom:25px } .single .article h3{ font-family:'Roboto',sans-serif; font-weight:500; font-size:24px; margin:40px 0 15px } .single .article p{ color:var(--color-text-muted); font-size:17px; margin-bottom:20px } /* Request quotation form card */ .single .product-aside{ display:flex; flex-direction:column; gap:30px } .single .form-card{ background:var(--color-surface); border-radius:24px; padding:35px; position:sticky; top:30px } @media(max-width:991px){ .single .form-card{ position:relative; top:auto } } .single .form-card h2{ font-family:'Roboto',sans-serif; font-weight:500; font-size:28px; margin-bottom:10px } .single .form-card > p{ color:var(--color-text-muted); margin-bottom:30px } /* Форма на странице товара переиспользует ту же CF7-форму (id=5, классы .contacts-form_*), поэтому input/submit стилизуются глобально — как на контактах. Меняем только раскладку: на товаре — одна колонка (в узком блоке 390px две колонки тесноваты), на контактах — две. */ .single .form-card .contacts-form_inputs{ grid-template-columns:1fr } /* Advantages */ .single .spec-section{ background:var(--color-surface); border-radius:24px; padding:60px 30px; margin:30px 0 } .single .spec-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px } @media(max-width:991px){ .single .spec-grid{ grid-template-columns:1fr } } .single .spec-card{ background:var(--color-white); border:1px solid var(--color-border); border-radius:20px; padding:30px } .single .spec-card h3{ font-family:'Roboto',sans-serif; font-weight:500; margin-bottom:20px } .single .spec-card p{ color:var(--color-text-muted) } /* Final CTA — карточка с заливкой, как у формы захвата (.contacts-form) */ .single .cta-final{ text-align:center; background:var(--color-surface); border-radius:24px; padding:64px 35px; margin:30px 0 } .single .cta-final h2{ font-family:'Roboto',sans-serif; font-weight:500; font-size:38px; color:var(--color-text-strong); margin:0 0 14px } .single .cta-final p{ color:var(--color-text-muted); max-width:560px; margin:0 auto 28px } /* .single .cta-final .cta-button → теперь .btn .btn--primary */ @media (max-width:992px){ .single .cta-final{ padding:52px 35px } .single .cta-final h2{ font-size:30px } } @media (max-width:575px){ .single .cta-final{ padding:40px 20px } .single .cta-final h2{ font-size:26px } .single .cta-final .btn{ width:100% } } /* More Product heading */ .single .more-product_head{ display:flex; align-items:center; justify-content:space-between; gap:20px; margin:30px 0 } .single .more-product_head h2{ font-family:'Roboto',sans-serif; font-weight:500; font-size:36px; line-height:1.2; margin:0 } @media(max-width:575px){ .single .more-product_head h2{ font-size:28px } } /* All Products button */ .single .more-product_all{ text-align:center; margin-top:40px } /* .single .more-product_all-link → теперь .btn .btn--primary */ .page{ margin:70px 0 } .page-title{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:center; -ms-flex-align:center; align-items:center; position:relative; padding-bottom:10px; margin:auto; margin-bottom:30px } .page-title h1{ font-size:35px; text-transform:uppercase; text-align:center } .page-title:after{ content:''; position:absolute; bottom:0; left:50%; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); height:2px; background:var(--color-primary); -webkit-animation:section-line 3s infinite; animation:section-line 3s infinite } @keyframes section-line{ from{ width:0 } to{ width:84px } } .page-content{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start } .page-content ul{ padding-left:10px } .page-content li{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; margin-bottom:5px } .page-content li:before{ content:''; width:5px; height:5px; border-radius:var(--radius-round); background:var(--color-primary); margin-right:5px } .page-content img{ margin-bottom:1rem } footer{ background:var(--color-primary); color:var(--color-white); padding:45px 0 } .footer-menu{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; margin-bottom:20px } .footer-menu_list{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; padding-left:0; margin-bottom:0 } .footer-menu_list li{ margin-right:35px } .footer-menu_list li:last-child{ margin-right:0 } .footer-menu_list a{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start; color:var(--color-white) } .footer-menu_list a:after{ content:''; height:2px; width:0; background:var(--color-white); -webkit-transition:var(--transition); transition:var(--transition) } .footer-menu_list .current-menu-item a:after{ width:100% } .footer-social{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; margin-bottom:20px } .footer-social a{ display:block; margin-right:15px } .footer-social a:last-child{ margin-right:0 } .footer-social a.ft-youtube{ min-width:35px; height:25px; background:url(../img/icon/ft-youtube.svg); background-size:contain; background-repeat:no-repeat } .footer-social a.ft-facebook{ min-width:16px; height:25px; background:url(../img/icon/ft-facebook.svg); background-size:contain; background-repeat:no-repeat } .footer-social a.ft-linkedin{ min-width:26px; height:25px; background:url(../img/icon/ft-linkedin.svg); background-size:contain; background-repeat:no-repeat } .footer-info{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:center; -ms-flex-align:center; align-items:center } .footer-info p{ text-align:center; margin-bottom:0 } .totop{ display:none; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; position:fixed; z-index:20; bottom:100px; right:30px; width:30px; height:30px; border:2px solid var(--color-primary); background:transparent; cursor:pointer } .totop.show{ display:-webkit-box; display:-ms-flexbox; display:flex } .totop span{ display:block; width:16px; height:16px; background:url(../img/icon/totop.svg) center no-repeat; background-size:contain } .overlay{ position:fixed; top:0; left:0; z-index:10; display:none; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; width:100%; height:100%; overflow:hidden; outline:0; background-color:rgba(0,0,0,0.5) } .overlay.open{ display:-webkit-box; display:-ms-flexbox; display:flex } .overlay-iframe{ width:500px; height:350px; position:relative } .overlay-iframe iframe{ width:100%; height:100% } .overlay-iframe_close{ position:absolute; right:0; top:-30px; width:20px; height:20px; background:url(../img/icon/close.svg) center no-repeat; background-size:contain; cursor:pointer } .overlay-box{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:center; -ms-flex-align:center; align-items:center; position:relative; padding:50px 60px; background:var(--color-white); -webkit-box-shadow:var(--shadow-modal); box-shadow:var(--shadow-modal); border-radius:30px; text-align:center; width:470px; -webkit-animation:fly-box 5s ease-in-out infinite forwards; animation:fly-box 5s ease-in-out infinite forwards } .overlay-box_close{ position:absolute; top:20px; right:20px; display:block; width:25px; height:25px; background:url(../img/icon/close.svg) center no-repeat; background-size:contain; cursor:pointer } .overlay-box_close:hover{ -webkit-animation:hover-icon 3s ease-in-out infinite forwards; animation:hover-icon 3s ease-in-out infinite forwards } @-webkit-keyframes hover-icon{ 0{ -webkit-transform:rotate(0); transform:rotate(0) } 0{ -webkit-transform:rotate(360deg); transform:rotate(360deg) } 100%{ -webkit-transform:rotate(0); transform:rotate(0) } } .overlay-box h3{ color:#63bbed; font-size:30px; font-weight:700 } .overlay-box span{ color:#5f5f5f; font-size:24px; margin-bottom:40px } .overlay-box button{ width:100%; margin-top:25px } @media screen and (-ms-high-contrast:active),(-ms-high-contrast:none){ .main{ background-attachment:inherit } } @media(min-width:992px){ .products-tabs_list li:hover::before{ -webkit-transform:scale(1,1); transform:scale(1,1) } .products-tabs_list li:hover::after{ -webkit-transform:scale(1,1); transform:scale(1,1) } .products-tabs_list li:hover{ border:0; border-radius:var(--radius-xs); color:var(--color-primary); font-weight:400 } .header-menu li:hover a:before{ width:100% } .footer-menu_list li:hover a:after{ width:100% } .info-text a:hover:before{ width:100% } .product-box:hover::before{ -webkit-transform:scale(1,1); transform:scale(1,1) } .product-box:hover::after{ -webkit-transform:scale(1,1); transform:scale(1,1) } .news-box:hover::before{ -webkit-transform:scale(1,1); transform:scale(1,1) } .news-box:hover::after{ -webkit-transform:scale(1,1); transform:scale(1,1) } .news-box:hover h3{ color:var(--color-primary) } .single-info_top button:hover:after{ -webkit-transform:rotate(360deg); transform:rotate(360deg) } .single-info_social a:hover{ color:var(--color-primary); } .contacts-info_social a:hover{ color:var(--color-white); } .single-info_contact a:hover:after{ width:100% } .single-info_contact a:hover{ color:var(--color-primary) } .product-box_contact a:hover:after{ width:100% } } @media(max-width:1200px){ .custom-logo-link{ left:65px } .product-box_img{ aspect-ratio:1 / 1 } .plus-box{ margin-bottom:20px } .plus-box_text{ padding:30px 15px } .plus-box_text p{ font-size:14px } .plus-box_text span{ margin-bottom:10px } .news-box h3{ font-size:17px } .news-box p{ font-size:14px } .news-box_img{ width:170px; min-width:170px; height:150px } .products-tabs_boxs li .product-box{ margin-right:12px } .products-box:after{ right:-23px } .about-box{ height:180px; margin-bottom:20px } .about-certificate_img{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center } .contacts-map{ width:100% } .single-info_top h2{ font-size:28px } .single-text iframe{ height:250px } } @media(max-width:992px){ /* На всех экранах делаем колонку вертикальной */ .info-img { display: block !important; /* отключаем flex от Bootstrap */ } /* SVG-блоки внутри колонки */ .info-img .svg-block { display: block !important; width: 100% !important; /* занимаем всю ширину колонки */ margin-bottom: 20px; /* расстояние между блоками */ } /* Чтобы последний блок не имел лишнего отступа */ .info-img .svg-block:last-child { margin-bottom: 0; } .info-img .svg-block:first-child { margin-top: 20px; } body{ font-size:14px } .section-title h2{ font-size:25px; margin-bottom:20px } header{ padding:0 } .custom-logo-link{ position:relative; top:auto; left:92px; height:57px } .header-two .custom-logo-link{ left:92px } .custom-logo-link img{ height:63px } .header-menu{ -webkit-box-pack:end; -ms-flex-pack:end; justify-content:flex-end; position:fixed; z-index:50; top:0; right:0; height:100%; width:200px; background:var(--color-white); -webkit-transform:translateX(100%); transform:translateX(100%); -webkit-transition:var(--transition); transition:var(--transition); -webkit-box-shadow:var(--shadow-card-strong); box-shadow:var(--shadow-card-strong) } .header-burger{ width:35px; height:26px; position:relative; -webkit-transform:rotate(0); transform:rotate(0); -webkit-transition:var(--transition-slow) ease-in-out; transition:var(--transition-slow) ease-in-out; cursor:pointer; z-index:60 } .header-burger span{ display:block; position:absolute; height:5px; width:100%; background:var(--color-text-caption); border-radius:9px; opacity:1; right:0; -webkit-transform:rotate(0); transform:rotate(0); -webkit-transition:.25s ease-in-out; transition:.25s ease-in-out } .header-burger span:nth-child(1){ top:0 } .header-burger span:nth-child(2){ top:10px } .header-burger span:nth-child(3){ top:20px } .header-burger.open span:nth-child(1){ top:10px; -webkit-transform:rotate(135deg); transform:rotate(135deg) } .header-burger.open span:nth-child(2){ opacity:0; right:-60px } .header-burger.open span:nth-child(3){ top:10px; -webkit-transform:rotate(-135deg); transform:rotate(-135deg) } .header-burger.open{ position:fixed; top:13px; right:12px } .header-menu.open{ -webkit-transform:translateX(0); transform:translateX(0) } .header-menu_list{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:end; -ms-flex-align:end; align-items:flex-end; padding-right:15px; padding-top:60px } .header-box{ position:static; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; -webkit-box-align:center; -ms-flex-align:center; align-items:center } .header-menu li{ margin-right:0; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:end; -ms-flex-align:end; align-items:flex-end; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; margin-bottom:10px } .header-menu a{ text-align:right; font-size:24px } .header-line{ position:absolute; right:15px; width:70%; bottom:0 } .main{ height:310px } .main-box{ padding:60px 30px /* симметрично по вертикали → центрирует группу H1+p+кнопка */ } .main-box h1{ font-size:22px } .main-box p{ font-size:20px } .info{ margin-bottom:60px } .info-text{ margin:auto } .info-text a{ font-size:16px; margin-top:10px } .info-img{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; margin:auto } .info-img_iframe{ margin-top:10px } .product-boxes{ grid-template-columns:repeat(3,1fr) } .products-tabs_boxs li{ grid-template-columns:repeat(3,1fr) } .product{ margin-bottom:60px } .standarts-slider { margin-bottom: 60px; } .plus{ margin-bottom:45px } .plus-box{ width:49%; margin-bottom:15px } .news-box{ width:100%; margin-bottom:10px } .news-box_img{ height:130px } .news{ margin-bottom:60px } .description{ padding:40px 0 } .description-box p{ font-size:16px } .description-box_products{ height:40px; margin-right:35px } .description-box_contact{ height:40px } .footer-menu_list a{ font-size:16px } .products-top p{ font-size:16px } .about-box{ height:130px; padding:0 15px } .about-certificate_text{ margin:auto } .about-certificate_img{ margin:auto } .about-info_box{ -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column } .about-info_img{ min-width:100%; height:250px } .about-info_box{ margin:auto } .about-text_box p{ width:100% } .about-text_box{ margin:auto } .about-certificate_img{ -webkit-box-pack:start; -ms-flex-pack:start; justify-content:flex-start } .contacts-map{ width:100%; height:300px } .single-img{ aspect-ratio:1 / 1; margin:auto; margin-bottom:10px } .single-info{ margin:auto } .single-mobile{ display:block; margin:auto } .single-info_top{ padding-bottom:0; border:0; margin-bottom:10px } .single-info_links{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:center; -ms-flex-align:center; align-items:center } .single-info_box{ -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -webkit-box-align:center; -ms-flex-align:center; align-items:center } .single-info_social{ margin-bottom:10px } .single-specs_item{ flex-wrap:wrap; row-gap:4px } .single-info_contact{ margin-left:0 } .single-info_top{ -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center } .single-video iframe{ height:390px } .single-text{ margin:30px 0 } .single-video{ margin-top:0; margin-bottom:30px } } /* ========================= MOBILE / TABLET FIX (768px) FIX INPUT + TEXTAREA BLUE GLOW OVERFLOW ========================= */ @media (max-width:768px){ .custom-logo-link{ left:79px; } .header-two .custom-logo-link{ left:79px; } .main-box{ padding-right:30px; } .product-boxes{ grid-template-columns:repeat(2,1fr) } .news-box_img{ width:130px; min-width:130px; height:120px; } .news-boxs .news-box:nth-child(3), .news-boxs .news-box:nth-child(4){ display:none; } .products-tabs_boxs li{ grid-template-columns:repeat(2,1fr) } .products-box{ width:70%; height:auto; margin-bottom:20px; } .products-box:last-child{ margin-bottom:0; } .products-box p{ margin-bottom:10px; } .products-boxs{ justify-content:center; flex-wrap:wrap; } .products-box:after{ display:none; } .about-box{ width:48%; } .about-certificate{ padding:40px 0; } .about-certificate_img{ justify-content:center; height:500px; } .about-certificate_img img{ height:100%; } .about-text{ padding:40px 0; } .about-info_text{ padding:20px 30px; } .about-p{ margin-bottom:50px; } .about-p p{ font-size:16px; } .about-certificate_text{ height:200px; overflow:hidden; position:relative; } .about-certificate_text.open{ height:100%; } .about-certificate_btn{ display:flex; } .about-certificate_text:after{ content:''; position:absolute; bottom:0; left:0; height:50px; width:100%; background:linear-gradient(to bottom,rgba(255,255,255,0) 0,var(--color-surface) 100%); } .about-certificate_text.open:after{ display:none; } .contacts-map{ width:100%; height:340px; } .single-img{ aspect-ratio:1 / 1; } .single-video iframe{ height:290px; } .page-title h1{ font-size:30px; } /* ========================= FIX BLUE GLOW (CRITICAL PART) ========================= */ .input-wrap::after{ inset: 2px; /* ВАЖНО: убирает “вылезание” */ border-radius:var(--radius-lg); box-shadow: 0 0 14px rgba(0, 69, 131, .18); } .input-wrap:focus-within::after{ opacity: 1; } /* textarea фикс отдельно (ключевой момент) */ .contacts-form_textarea{ overflow: hidden; } .contacts-form_field{ margin-bottom:10px; } .contacts-form_input, .contacts-form_textarea{ margin-bottom:0; } } @media(max-width:576px){ div.wpcf7-response-output{ margin:0 } .totop{ right:15px; bottom:90px } .section-title h2{ font-size:22px } .section-title h1{ font-size:25px; margin-bottom:20px } .header-menu{ width:150px } .header-menu_list{ padding-left:15px; padding-top:60px } .header-menu a{ font-size:22px } .custom-logo-link{ left:auto } .header-two .custom-logo-link{ left:auto } .main-box:before{ left:0 } .main{ height:250px } .main-box{ padding:40px 15px /* симметрично по вертикали → центрирует группу */ } .info{ margin-bottom:40px } .svg { display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; margin:auto } .info-img_iframe iframe{ height:250px } .product-boxes{ grid-template-columns:1fr; margin-bottom:10px } .product-box{ margin-bottom:10px; -webkit-box-shadow:var(--shadow-card); box-shadow:var(--shadow-card) } .product-box { border-radius: 16px; overflow: hidden; } .product-box_img{ aspect-ratio:1 / 1; width:100%; margin-bottom:10px } .product-box_img img{ width:100%; height:100%; -o-object-fit:cover; object-fit:cover; border-radius:var(--radius-lg) } .product-button{ -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center } .product{ margin-bottom:40px } .news-box{ -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column } .news-box_img{ width:100%; margin-bottom:10px } .news-box_date{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:end; -ms-flex-pack:end; justify-content:flex-end; position:static } .plus-box{ width:100% } .plus-box:last-child{ margin-bottom:0 } .footer-menu_list{ -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column } .news{ margin-bottom:40px } .description-box_button{ -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column } .description-box_products{ margin-right:0; margin-bottom:10px } .description-box p{ font-size:15px; margin-bottom:20px } .description{ padding:20px 0 } footer{ padding:20px 0 } .footer-menu_list li{ margin-right:0; margin-bottom:10px } .contacts-form_inputs .wpcf7-form-control-wrap{ width:100% } .products-tabs_boxs li{ grid-template-columns:1fr } .products-tabs_list{ -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; margin-bottom:10px } .products-tabs_list li{ margin-right:0; margin-bottom:5px } .products{ margin-top:0; margin-bottom:0 } .products-wrap{ padding:30px 20px; margin-left:15px; margin-right:15px; margin-bottom:30px } .products-descr{ margin-bottom:30px } .products-boxs{ margin-bottom:30px } .uncos{ margin-top:0; margin-bottom:40px } .error-box{ margin-top:40px; margin-bottom:40px } .error-box h1{ font-size:70px } .error-box p{ font-size:20px } .about{ margin-top:0; margin-bottom:0 } .about-boxs{ -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center } .about-box{ width:290px; height:120px; margin-bottom:10px } .about-box span{ margin-bottom:15px } .about-p p{ font-size:14px; margin-bottom:0 } .about-p{ margin-bottom:40px } .about-certificate{ padding:30px 0; margin-bottom:40px } .about-certificate_img{ height:330px } .about-certificate_text span{ margin-bottom:20px } .about-info_img{ height:200px } .about-info_text{ padding:15px } .about-info_text p:last-child{ margin-bottom:0 } .about-info_text span{ margin-bottom:20px } .about-info{ margin-bottom:40px } .about-text{ padding:30px 0 } .about-text_descr{ margin-top:15px } .contacts{ margin-top:0; margin-bottom:40px } .contacts-map{ margin:0 0 30px; width:100%; height:260px } .contacts-form_inputs{ margin-bottom:0; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column } .contacts-form_input{ font-size:14px; width:100%; margin-bottom:10px; height:40px } .contacts-form_textarea{ height:100px; font-size:14px } .contacts-form h3{ margin-top:0; margin-bottom:20px } .single{ margin:40px 0 } .single-img{ aspect-ratio:1 / 1 } .single-text{ margin:20px 0 } .single-video{ margin-top:0; margin-bottom:20px } .single-info_top{ -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column } .single-info_top button:before{ display:none } .single-info_top h2{ font-size:25px } .single-video iframe{ height:240px } .page-title h1{ font-size:24px } .page{ margin:40px 0 } .page-title{ margin-bottom:20px } /* Исправление blue glow на мобильных */ .contacts-form_field{ margin-bottom:10px; } .contacts-form_input, .contacts-form_textarea{ margin-bottom:0; width:100%; display:block; box-sizing:border-box; } .input-wrap{ position:relative; display:block; } .input-wrap::after{ top:1px; left:1px; right:1px; bottom:1px; } } svg path { fill: #BFC4C9; /* светло-серый фон для неактивных стран #BFC4C9 */ transition: .25s ease; } /* Общие страны */ svg .highlightable { fill: var(--color-primary); transition: fill .25s ease; cursor: pointer; } /* Наведение — только смена цвета */ svg .highlightable:hover { fill: var(--color-primary-hover); } /* Thank You Page Styles */ .thank-you { padding: 80px 0; text-align: center; } .thank-you-box { margin: auto; } .thank-you-icon { margin-bottom: 30px; animation: successPop 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55); } @keyframes successPop { 0% { transform: scale(0); opacity: 0; } 50% { transform: scale(1.1); } 100% { transform: scale(1); opacity: 1; } } .thank-you-icon svg path { stroke-dasharray: 60; stroke-dashoffset: 60; animation: drawCheck 0.5s ease-out 0.3s forwards; } @keyframes drawCheck { to { stroke-dashoffset: 0; } } .thank-you-box h1 { font-size: 48px; color: var(--color-primary); margin-bottom: 20px; } .thank-you-subtitle { font-size: 20px; font-weight: 400; text-align: center; margin-bottom: 50px; } .thank-you-steps { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 30px; justify-content: center; flex-wrap: wrap; margin-bottom: 50px; } .thank-you-step { max-width: 280px; text-align: center; } .step-number { width: 50px; height: 50px; border-radius:var(--radius-round); background: var(--color-primary); color: var(--color-white); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; font-size: 24px; font-weight: 500; margin: 0 auto 20px; } .thank-you-step h3 { font-size: 18px; color: var(--color-primary); margin-bottom: 10px; } .thank-you-step p { font-size: 14px; color: var(--color-text-muted); line-height: 1.5; } .thank-you-buttons { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 20px; flex-wrap: wrap; margin-bottom: 50px; } .thank-you-social { margin-top: 30px; } .thank-you-social p { font-size: 16px; color: var(--color-text-muted); margin-bottom: 15px; } .thank-you-social-links { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 15px; justify-content: center; } .thank-you-social-links a { width: 40px; height: 40px; border-radius:var(--radius-round); background: var(--color-surface); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; transition: background 0.3s; } .thank-you-social-links a:hover { background: var(--color-primary); } .thank-you-social-links img { width: 20px; height: 20px; } /* .thank-you-btn-primary → теперь .btn .btn--primary */ /* .thank-you-btn-secondary → теперь .btn .btn--outline */ @media (max-width: 768px) { .thank-you { padding: 40px 0; } .thank-you-box h1 { font-size: 32px; } .thank-you-box p { font-size: 16px; } }