html {
    font-size: clamp(14px, 1.3vw, 18px);
}

*{margin:0;padding:0;box-sizing:border-box}
:root{--header-height:64px}
html{scroll-behavior:smooth}
body{font-family:system-ui,Arial,sans-serif;color:#000;background:#fff}

/* === Базовая адаптивная типографика для всего сайта === */
h1 {
  /* от 26px на очень малых до 40px на десктопе */
  font-size: clamp(26px, 4.5vw, 40px);
  line-height: 1.2;
}

h2 {
  /* от 20px до 30px */
  font-size: clamp(20px, 3.2vw, 30px);
  line-height: 1.25;
}

p {
  /* от 14px до 18px */
  font-size: clamp(14px, 2.0vw, 18px);
  line-height: 1.6;
  margin: 0 0 1em;
}

/* На очень маленьких экранах чуть плотнее */
@media (max-width: 480px) {
  h1 { line-height: 1.18; }
  h2 { line-height: 1.22; }
  p  { line-height: 1.5; }
}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.header{position:sticky;top:0;z-index:1000;display:flex;align-items:center;justify-content:space-between;padding:14px 6vw;background:rgba(34, 34, 34, 1);transition:background .3s,border-color .3s;height:var(--header-height)}
.header.scrolled{background:rgba(220, 220, 220,0.8);backdrop-filter:saturate(120%) blur(4px)}
.logo{position:relative;width:150px;height:40px}
.logo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:opacity .25s}
.logo-light{opacity:1}.logo-dark{opacity:0}.header.scrolled .logo-light{opacity:0}.header.scrolled .logo-dark{opacity:1}
.nav{display:flex;align-items:center}
.menu-links a{margin-left:20px;text-decoration:none;color:#29AD29;font-weight:600;transition:color .25s}
.menu-links a:hover{text-decoration:underline}
.header.scrolled .menu-links a{color:#0A5D00}
.lang{display:flex;align-items:center;gap:10px;margin-left:40px}
.lang .flag{width:24px;height:24px;cursor:pointer;transition:transform .2s}
.lang .flag:hover{transform:scale(1.1)}
.burger{display:none;position:relative;width:24px;height:24px;cursor:pointer;z-index:2000;background:transparent;border:0}
.burger span{position:absolute;left:50%;top:50%;width:20px;height:2px;background:#fff;border-radius:1px;transform:translate(-50%,-50%);transition:all .3s}
.header.scrolled .burger span{background:#000}
.burger span:nth-child(1){transform:translate(-50%,-8px)}
.burger span:nth-child(2){transform:translate(-50%,0)}
.burger span:nth-child(3){transform:translate(-50%,8px)}
.burger.open span:nth-child(1){transform:translate(-50%,0) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translate(-50%,0) rotate(-45deg)}
@media(max-width:768px){.nav{display:none!important}.burger{display:block}}
.mobile-menu{display:flex;flex-direction:column;background:rgba(220, 220, 220,1); position:fixed;top:var(--header-height);left:0;width:100%;max-height:0;opacity:0;overflow:hidden;transition:max-height .35s,opacity .35s;z-index:1500;}
.mobile-menu.open{max-height:500px;opacity:1}
.mobile-menu a{padding:15px 6vw;text-decoration:none;font-weight:600;color:#0A5D00}
.mobile-menu .lang{margin:10px 6vw}
.nav a.active,.mobile-menu a.active{font-weight:900}
.hero-slider{position:relative;min-height:100vh;overflow:hidden;contain: layout paint;}
/* .hero-slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity .6s} */
.hero-slide{  position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity .6s ease;will-change: opacity;transform: translateZ(0);}
.hero-slide.active{opacity:1;z-index:1}
.hero-slide::before{content:"";position:absolute;inset:0;background:linear-gradient(to right,rgba(0,0,0,.75) 0%,rgba(0,0,0,.25) 50%,rgba(0,0,0,0) 100%)}
.hero-content{position:relative;height:100%;width:50%;padding:0 6vw;display:flex;flex-direction:column;justify-content:center;color:#fff;max-width:50%}
.hero-content p{margin-bottom:14px;line-height:1.6}
.hero-dots{position:absolute;bottom:calc(24px + var(--header-height));left:50%;transform:translateX(-50%);display:flex;gap:10px;z-index:10}
.hero-dots .dot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.55);cursor:pointer;border:0}
.hero-dots .dot.active{background:#228B22;transform:scale(1.2)}
@media(max-width:768px){.hero-content{width:100%;max-width:100%;background:rgba(0,0,0,.45);padding:24px 6vw}.hero-content h2{font-size:clamp(22px,6vw,40px)}}
.bg-section{position:relative;color:var(--text-color,#fff);background-size:cover;background-position:center;background-repeat:no-repeat}
.bg-section::before{content:"";position:absolute;inset:0;background:var(--overlay-color,rgba(0,0,0,.6));z-index:0}
.section-inner{position:relative;z-index:1;display:grid;grid-template-columns:1.2fr 1.4fr 1.4fr;max-width:1400px;margin:0 auto;padding:120px 6vw;column-gap:24px}
.section-inner .title{text-align:left}
.section-inner .text{text-align:left}
.section-inner.two-cols{grid-template-columns:1.2fr 1.8fr}
.section-inner .col{position:relative}
.section-inner .colb{position:relative}
.section-inner .col:not(:last-child)::after{content:"";position:absolute;top:0;right:-12px;width:1px;height:100%;background:rgba(41,173,41,.5)}
.section-inner .colb:not(:last-child)::after{content:"";position:absolute;top:0;right:-12px;width:1px;height:100%;background:rgba(10,93,0,.5)}
.bg-section h1,.bg-section h2,.bg-section h3,.bg-section p{color:inherit}
@media(max-width:900px){.section-inner,.section-inner.two-cols{grid-template-columns:1fr}.section-inner{padding:80px 6vw}.section-inner .col:not(:last-child)::after{display:none} .colb:not(:last-child)::after{display:none}}
.contacts-content{display:flex;flex-direction:column;gap:12px}
.fade-in{opacity:0;transform:translateY(40px);transition:opacity .6s,transform .6s}
.fade-in.visible{opacity:1;transform:translateY(0)}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ===== CERTIFICATES STRIP ===== 

.certs-strip{
  width:100%;
  overflow:hidden;
  background:var(--certs-bg, rgba(220,220,220,.9));
  padding:30px 0;
}

.certs-track{
  display:flex;
  align-items:center;
  gap:60px;
  width:max-content;
  animation: certs-scroll 180s linear infinite;
}

.certs-track img{
  height:100px;
  width:auto;
  opacity:1;
  transition:opacity .3s;
}

.certs-track img:hover{
  opacity:1;
}

@keyframes certs-scroll{
  from{ transform:translateX(0); }
  to{ transform:translateX(-100%); }
} */

/* ===== CONTACT ICONS =====  */

.contact-item{
  display:flex;
  align-items:center;
  gap:12px;
}

.contact-icon{
  width:20px;
  height:20px;
  flex-shrink:0;
}

.contacts-content a{
  color:inherit;
  text-decoration:none;
}

/* ===== HERO MOBILE RIGHT FOCUS ===== */

@media (max-width: 768px){
  .hero-slide{
    background-position: 75% center;
  }
}
/* ===== SERVICES ICON LIST ===== */

.services-list{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.service-item{
  display:flex;
  align-items:flex-start;
  gap:14px;
  margin:0;
}

.service-icon{
  width:22px;
  height:22px;
  flex-shrink:0;
  margin-top:4px;
}

.service-item span{
  display:block;
}

.bold {
  font-weight: 700; /* или bold */
}

/* === UPDATED SERVICE ITEMS === */

.service-item {
    display: flex;
    align-items: flex-start;
    gap: 14px; /* расстояние между иконкой и текстовым блоком */
}

.service-content {
    display: flex;
    flex-direction: column;
    line-height: 1.3; /* компактный текст */
}

.service-content .bold {
    margin-bottom: 2px; /* уменьшает расстояние между жирным и обычным текстом */
}

.service-text {
    margin: 0;
}

/* расстояние между услугами остаётся прежним */
.services-list {
    display: flex;
    flex-direction: column;
    gap: 18px;
}


/* === HERO ARROWS === */
.hero-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0,0,0,0.15);
    color: #fff;
    border: none;
    width: 46px;
    height: 46px;
    font-size: 28px;
    cursor: pointer;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 20;
    transition: 0.25s;
}

.hero-arrow:hover {
    background: rgba(0,0,0,0.55);
}

.hero-arrow-left {
    left: 20px;
}

.hero-arrow-right {
    right: 20px;
}

/* Мобильная адаптация */
@media (max-width: 768px) {
    .hero-arrow {
        width: 38px;
        height: 38px;
        font-size: 22px;
    }
}

@media (max-width: 768px) {
    .hero-content h1 {
        font-size: clamp(20px, 6vw, 32px);
        line-height: 1.25;
    }

    .hero-content p {
        font-size: 14px;
        line-height: 1.4;
    }
}

@media (max-width: 768px) {
    .hero-arrow {
        top: 40%; /* было 50% */
    }
}

/* --- Fix hero arrows on mobile --- */
@media (max-width: 768px) {
    .hero-arrow {
        top: 30% !important;   /* Было 40–50%, поднимаем выше */
        width: 34px;
        height: 34px;
        font-size: 20px;
        background: rgba(0,0,0,0.3);
    }
}

@media (max-width: 480px) {
    .hero-arrow {
        top: 28% !important;   /* Ещё выше на маленьких экранах */
    }
}


/* Убираем синюю/серую вспышку при нажатии на ссылку на мобильных */
a, button {
    -webkit-tap-highlight-color: transparent;
    -webkit-focus-ring-color: transparent;
    outline: none;
}

/* --- Уменьшаем расстояния в разделе Контакты --- */
.contacts-content {
    gap: 6px !important; /* Было 12px — делаем компактнее */
}

.contact-item {
    margin: 0;
    padding: 0;
    line-height: 1.2; /* Было 1.5–1.6 по умолчанию — делаем плотнее */
}

.contact-item a,
.contact-item span {
    line-height: 1.2 !important;
    font-size: clamp(14px, 1.8vw, 17px); /* Адаптивный размер */
}

@media (max-width: 480px) {
    .contacts-content {
        gap: 4px !important;
    }
    .contact-item {
        line-height: 1.15;
    }
}