/*   
Theme Name: your-clean-template-3 (uncommented)
Theme URI: https://github.com/saxap/clean-wp-template
Version: 3.0
Tags: clean, development, html5, bootstrap
Description: Clean wordpress theme with minimal bootstrap3 markup for fast development starting
Author: saxa:p
Author URI: http://dontforget.pro
*/
html {scroll-behavior: smooth;}
body {font-family: Arial, sans-serif;margin: 0;background: #fff;}
* {box-sizing: border-box;margin: 0;padding: 0;}
h2 {font-size: 28px;margin-bottom: 10px;}
.hedmenu {width: 100%;height: 80px;position: relative;overflow: hidden;z-index: 999;border-top: 4px solid #ec244f;box-shadow: 0 1px 6px #ccc;}
.gra {width: 1240px;margin: 0 auto;}
.hmenu {display: flex;flex-direction: row;flex-wrap: nowrap;justify-content: space-between;align-items: center;gap: 0;}
.logo_b {width: 250px;height: 100%;display: flex;align-items: center;align-content: center;margin: 20px 0;}
.logo_b a {display: block;position: relative;width: 100%;height: auto;}
.logo_b img {width: 100%;}
.menu ul {margin: 0;display: flex;flex-direction: row;align-items: center;gap: 30px;justify-content: space-between;list-style: none;padding: 0;}
.menu ul li a {color: #171717;text-decoration: none;font-size: 16px;padding-bottom: 6px;border-bottom: 2px solid #fff;}
.menu ul .active a, .menu ul li a:hover {border-bottom: 2px solid #ec244f;color: #ec244f;}
a:hover {text-decoration: none; transition: 0.2s all ease;-webkit-transition: 0.4s all ease;}
.telega, .max, .vk {width: 30px; height: 30px;display: block;border-radius: 100%;}
.telega {background: url(img/tg.svg);background-size: cover;}
.max {background: url(img/max.svg);background-size: cover;}
.vk {background: url(img/vk.svg);background-size: cover;}
.soc {display: flex;flex-direction: row;gap: 15px;}
a.tel {text-decoration: none;color: #ec244f;font-size: 25px;font-weight: 600;}
.gl_ban {width: 100%;height: 600px;position: relative;overflow: hidden;margin: 0 0 40px;}
.gl_ban_img {width: 100%;height: 100%;position: absolute;top: 0;left: 0;z-index: 1;}
.gl_ban_img img {width: 100%;height: 100%;object-fit: cover;}
.gl_ban_block {position: relative;display: flex;z-index: 2;width: 1240px;margin: 0px auto 0;flex-direction: column;}
.gl_ban h1 {margin: 140px 0 40px;font-size: 64px;text-transform: uppercase;letter-spacing: 0.09em;font-weight: bold;}
.gl_ban_block b {color: #ec244f;}
.gl_ban_block p {margin: 0 0 40px;line-height: 1.5;color: #6a6a6a;font-size: 24px;}
a.btn {text-decoration: none;text-transform: uppercase;background: #ec244f;display: inline-block;padding: 16px 30px;color: #fff;}
a.btn:hover {background: #c30f36;}
.red-line {width: 60px;height: 3px;background: #ec244f;margin: 0 auto 40px;}
.services {display: grid;grid-template-columns: 1fr 1fr;gap: 30px;margin-bottom: 80px;}
.service-card {display: flex;background: #fff;box-shadow: 0 4px 15px rgba(0,0,0,0.08);border-radius: 8px;overflow: hidden;position: relative;}
.service-content {flex: 1;padding: 25px 25px 25px 90px;position: relative;}
.service-banner {position: absolute;left: 0;top: 0;background: #ec244f;color: white;padding: 12px 20px 12px 18px;clip-path: polygon(0 0, 100% 0, 80% 100%, 0 100%);display: flex;align-items: center;gap: 10px;font-weight: bold;font-size: 15px;}
.service-content h3 {margin: 50px 0 15px;font-size: 18px;color: #222;}
.service-content p {font-size: 14px;color: #555;line-height: 1.5;}
.service-image {width: 45%;min-height: 220px;object-fit: cover;}
.why-us {display: grid;grid-template-columns: repeat(4, 1fr);gap: 30px;text-align: center;}
.why-item {padding: 10px;}
.why-icon {width: 100px;height: 100px;margin: 0 auto 30px;}
.why-item h4 {font-size: 15px;margin: 0 0 10px;color: #222;}
.why-item p {font-size: 13px;color: #666;line-height: 1.4;margin: 0;}
.gk_container {width: 1240px;margin: 0 auto;position: relative;overflow: hidden;}
.gk_container h2 {text-align: center;margin-top: 40px;text-transform: uppercase;}
.service-banner img {width: 40px;height: auto;}
.sider {display: flex;flex-direction: row;flex-wrap: nowrap;gap: 13px;width: 1240px;height: 100%;overflow: hidden;position: relative;margin: 0 auto 80px;}
.slid_img {width: 300px;position: relative;overflow: hidden;border-radius: 15px;height: 360px;}
.slid_img img {width: 100%;height: 360px;border-radius: 15px;}

.contacts-banner {position: relative;width: 100%;height: 320px;overflow: hidden;background-color: #f2f2f2;}
.map-container {position: absolute;top: 0;right: 0;} 
.contacts-info {position: absolute;top: 0;left: 0;width: 100%; height: 100%;background-color: #ec244f; color: #ffffff;z-index: 2;clip-path: polygon(0 0, 57% 0, 47% 100%, 0 100%);}
.contacts-content {padding: 60px 0;max-width: 1240px;margin: 0 auto;}
.contacts-title {font-size: 24px;font-weight: 800;letter-spacing: 1px;text-transform: uppercase;}
.title-line {width: 45px;height: 3px;background-color: #ffffff;margin: 8px 0 22px 0;}
.contacts-list {list-style: none;}
.contacts-list li {display: flex;align-items: center;margin-bottom: 14px;font-size: 15px;font-weight: 500;}
.contacts-list svg {width: 20px;height: 20px;margin-right: 15px;flex-shrink: 0;}
.contacts-list a {color: #ffffff;text-decoration: none;transition: opacity 0.2s;}
.contacts-list a:hover {opacity: 0.85;}

@media (max-width: 1260px) {
.gra, .gl_ban_block, .gk_container, .sider, .contacts-content {max-width: 960px;width: 100%;}
.menu ul {gap: 10px;}
.menu ul li a {font-size: 14px;}
.soc {gap: 10px;}
a.tel {font-size: 18px;}
.gl_ban h1 {font-size: 44px;}
.gl_ban_block p {font-size: 18px;}
a.btn {font-size: 14px;}
h2 {font-size: 24px;}
.service-content h3 {margin-top: 60px;}
.service-content {padding: 20px;}
.services {gap: 15px;}
.why-icon {width: 80px;height: 80px;}
.slid_img:last-child {display: none;}
.sider {gap: 30px;}
.map-container {overflow: hidden;}
}@media (max-width: 980px) {
.menu {display: none;}
.gra, .gl_ban_block, .gk_container, .sider, .contacts-content {max-width: 740px;}
.gl_ban h1 {text-align: center;}
.gl_ban_block p {text-align: center;}
.bloc_btn {text-align: center;}
.services {display: flex;flex-direction: column;}
.slid_img:last-child {display: block;}
.sider {display: flex;flex-wrap: wrap;justify-content: center;}
}
@media (max-width: 850px) {
.contacts-banner {height: auto;}
.contacts-info {position: relative;width: 100%;clip-path: none;}
.contacts-content {padding: 30px 20px;}
.map-container {position: relative;height: 200px;}
.map-pin {left: 50%;}
}
@media (max-width: 760px) {
.gra, .gl_ban_block, .gk_container, .sider, .contacts-content {max-width: 370px;}
.hmenu {display: flex;flex-wrap: wrap;flex-direction: column;align-items: center;gap: 10px;}
.hedmenu {height: 130px;}
.logo_b {margin: 0;}
.gl_ban {height: 500px;}
.gl_ban h1 {font-size: 34px;margin: 80px 0;}
.services {gap: 30px;}
.service-card {display: flex;flex-direction: column;}
.service-image {width: 100%;min-width: auto;height: auto;margin-bottom: -160px;}
.why-us {display: flex;flex-direction: column;flex-wrap: wrap;}
}