/*
Theme Name: ASIAVED Child
Template: twentytwentyfive
Text Domain: asiaved-child
Version: 1.0
*/


:root{
  --container: 1200px;
  --gap: 24px;
  --green: #2e7d32;
  --green-dark:#1e5b23;
  --text:#222;
  --muted:#666;
  --bg:#f5f6f7;
  --white:#fff;
  --shadow: 0 10px 20px rgba(0,0,0,.08);
}

html,body{margin:0;padding:0}
*{box-sizing:border-box}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}

.container{max-width:var(--container);margin:0 auto;padding:0 16px}
.section{padding:56px 0}
.section--light{background:var(--bg)}

.headerbar{padding:12px 0;background:#fff;box-shadow:var(--shadow)}
.headerbar__row{display:flex;align-items:center;gap:16px}
.headerbar__brand{display:flex;align-items:center;gap:12px;margin-right:auto}
.headerbar__brand img{width:120px;height:auto}
.headerbar__meta{font-size:12px;color:var(--muted)}
.headerbar__contacts{display:flex;align-items:center;gap:20px;font-weight:600}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:8px;padding:10px 18px;background:var(--green);color:#fff;font-weight:700;box-shadow:inset 0 -2px 0 rgba(0,0,0,.15)}
.btn:hover{background:var(--green-dark)}

.hero{position:relative;overflow:hidden}
.hero__image{width:100%;height:340px;object-fit:cover;object-position:bottom}
.hero__content{position:relative;margin-top:-90px;padding-bottom:15px}
.hero__card{background:var(--white);box-shadow:var(--shadow);padding:32px;border-radius:12px;max-width:880px}
.hero h1{font-size:40px;line-height:1.15;margin:0 0 12px}
.hero p.lead{font-size:18px;color:var(--muted);margin:0}

.services{display:grid;grid-template-columns:repeat(2,1fr);gap:32px;margin-top:28px}
@media (max-width:900px){.services{grid-template-columns:1fr}}

.service{background:#fff;border-radius:12px;box-shadow:var(--shadow);padding:22px}
.badge{display:inline-block;background:linear-gradient(#3aa74b,#2e7d32);color:#fff;font-weight:800;border-radius:9999px;padding:10px 18px;margin-bottom:12px}
.service p{color:var(--muted);margin:0}

.split{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center}
@media (max-width:900px){.split{grid-template-columns:1fr}}
.list{margin:0 0 18px;padding-left:22px}
.list li{margin:6px 0}
.card-image{border-radius:12px;overflow:hidden;box-shadow:var(--shadow)}

.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:24px}
.kpi{background:#fff;box-shadow:var(--shadow);border-radius:12px;padding:18px}
.kpi__num{font-weight:800;color:var(--green);font-size:28px;margin-bottom:6px}
.kpi__text{color:var(--muted)}

.faq{max-width:900px}
.faq__item{background:#fff;border-radius:10px;box-shadow:var(--shadow);margin-bottom:12px;overflow:hidden}
.faq__q{display:flex;justify-content:space-between;gap:12px;cursor:pointer;padding:16px 18px;font-weight:600}
.faq__a{display:none;padding:0 18px 18px;color:var(--muted)}
.faq__item.is-open .faq__a{display:block}

.contacts{display:grid;grid-template-columns:1fr 1fr;gap:32px}
@media (max-width:900px){.contacts{grid-template-columns:1fr}}

.form{max-width:720px}
.form label{display:block;font-weight:600;margin:14px 0 6px}
.form input,.form textarea{
  width:100%;padding:12px 14px;border:1px solid #ddd;border-radius:8px;background:#fff
}
.form textarea{min-height:120px;resize:vertical}

.footerbar{padding:24px 0;background:#f0f1f2;color:#555;font-size:14px}
:root{
  --font-heading: "Montserrat", "Post No Bills Jaffna", Arial, sans-serif;
  --font-base: "Roboto", "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --font-accent: "Post No Bills Jaffna", "Montserrat", Arial, sans-serif; /* для бейджей/акцентов */
}

/* База */
body{
  font-family: var(--font-base);
  font-weight: 400;
}

/* Заголовки */
h1,h2,h3,h4{
  font-family: var(--font-heading);
  font-weight: 800;          /* можно 700/800 в зависимости от макета */
  line-height: 1.15;
  margin: 0 0 .6em;
}

/* Акцентные элементы — бейджи/кнопки при желании */
.badge{
  font-family: var(--font-accent);
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: uppercase;

}

/* Кнопки — чаще лучше на Montserrat */
.btn{
  font-family: "Montserrat", Arial, sans-serif;
  font-weight: 700;
}/* --- стрелки: по бокам слайдера --- */
.split-slider{
  position: relative;
  overflow: hidden;
  --slide-gap: 36px;
  --dots-gap: 8px;
  --nav-inset: 12px;            /* отступ стрелок от краёв слайдера */
}

/* лента */
.split-slider__track{
  display: flex;
  transition: transform .5s ease;
  will-change: transform;
}

/* слайды */
.split-slider__slide{
  min-width: 100%;
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: var(--slide-gap);
  align-items: center;
  padding: 10px;

}
.split-slider__slide > div:first-child h2{ margin-top: 0 }

/* картинка справа — фикс. формат */
.split-slider__slide .card-image{
  border-radius: 12px;
  overflow: hidden;
  box-shadow: var(--shadow);

}
.split-slider__slide .card-image img{
  width: 100%; height: 100%; object-fit: cover;
}

/* стрелки — по центру высоты, прижаты к краям СЛАЙДЕРА */
.split-slider__nav{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 42px; height: 42px;
  border-radius: 50%; border: 0;
  background: #fff; box-shadow: var(--shadow);
  cursor: pointer;
  font-size: 28px; line-height: 42px; text-align: center;
  user-select: none; z-index: 2;
}
.split-slider__nav--prev{ left: var(--nav-inset); }
.split-slider__nav--next{ right: var(--nav-inset); }
.split-slider__nav:hover{ background:#f6f7f8 }

/* точки */
.split-slider__dots{
  display:flex; gap: var(--dots-gap); justify-content:center; margin-top:16px;
}
.split-slider__dots button{
  width:8px; height:12px; border-radius:50%; border:0; background:#cfd3d6; cursor:pointer;
}
.split-slider__dots button.is-active{ background: var(--green); }

/* адаптив */
@media (max-width: 900px){
  .split-slider__slide{ grid-template-columns: 1fr; gap: 20px; }
  .split-slider__nav{
    width: 36px; height: 36px; line-height: 36px; font-size: 24px;
  }
  .badge{
  font-family: var(--font-accent);
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: uppercase;
  font-size: 17px;
}
}
/* стрелки скрыты по умолчанию */
.split-slider__nav {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

/* при наведении на слайдер — показываем */
.split-slider:hover .split-slider__nav {
  opacity: 1;
  visibility: visible;
}


/* ===== KPI на всю ширину секции "О нас" ===== */
.kpis--full{ grid-column:1 / -1 }              /* растягиваем на две колонки сетки .split */
.kpis--full{ margin-top:24px }
@media (max-width:900px){
  .kpis--full{ grid-template-columns:1fr; }    /* на мобилке по одному в ряд, если нужно: можно 2 */
}
/* === About layout как в макете === */
.split--about{
  grid-template-columns: 1.1fr .9fr; /* текст | фото */
  align-items: start;
}
.split--about > div:first-child p{ max-width: 560px; }

/* Фото справа — как карточка с рамкой и лёгкой тенью */
.card-image--portrait{
  justify-self: end;
  max-width: 460px;              /* ≈ визуально как на превью */
  border-radius: 12px;
  overflow: hidden;
  box-shadow: var(--shadow);
  border: 1px solid #e7eaee;     /* нежная рамка */
}
.card-image--portrait img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 3 / 4;           /* портретное */
}

/* === KPI под блоком, во всю ширину, без карточек === */
.kpis--under{
  grid-column: 1 / -1;                   /* тянем на ширину всей секции */
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 36px;
  margin-top: 28px;
  padding-top: 22px;
  border-top: 1px solid #e8ecef;         /* тонкая разделительная линия */
}

/* убираем стили «карточек» из базовых KPI для этого варианта */
.kpis--under .kpi{
  background: transparent;
  box-shadow: none;
  border-radius: 0;
  padding: 0;
}

/* номер — крупный зелёный */
.kpis--under .kpi__num{
  font-weight: 800;
  color: var(--green);
  font-size: 42px;
  line-height: 1;
  margin-bottom: 6px;
}

/* заголовок KPI — жирный */
.kpis--under .kpi__text{
  font-weight: 800;
  color: #0f1d13;
  margin-bottom: 6px;
}

/* подпись — серый текст, компактнее */
.kpis--under .kpi__desc{
  color: var(--muted);
  font-size: 14px;
  line-height: 1.55;
}

/* Адаптив */
@media (max-width: 900px){
  .split--about{ grid-template-columns: 1fr; gap: 20px; }
  .card-image--portrait{ justify-self: start; max-width: 100%; }
  .kpis--under{ grid-template-columns: 1fr; gap: 20px; }
}
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  padding: 15px 27px;
  background: linear-gradient(#3aa74b, #2e7d32);;
  color: #fff;
  font-weight: 700;
  box-shadow: inset 0 -2px 0 rgba(0,0,0,.15);
  border: none;         /* убираем рамку */
  outline: none;        /* убираем серую обводку при клике */
}

.btn:focus {
  outline: none;
  box-shadow: inset 0 -2px 0 rgba(0,0,0,.15);
}
.service {
  background: #fff;
  border-radius: 12px;
  box-shadow: var(--shadow);
  padding: 22px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.service:hover {
  transform: translateY(-6px); /* лёгкий подъём */
  box-shadow: 0 14px 28px rgba(0,0,0,.12); /* чуть глубже тень */
}
/* === About: текст тянется по высоте фото === */
.split--about > div:first-child {
  align-self: stretch;        /* растягиваем текстовую колонку */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* абзацы в "О нас" чуть крупнее */
.split--about > div:first-child p {
  font-size: 17px;
  line-height: 1.7;
}

/* первый абзац после заголовка светло-серый */
.split--about > div:first-child p:first-of-type {
  color: var(--muted);
}
/* Заголовок "О нас" */
.split--about h1 {
  font-size: 48px;    
  line-height: 1.2;
  margin-bottom: 20px;
}

/* Заголовок "О нас" */
.form h3 {
  font-size: 32px;    
  line-height: 1.2;
  margin-bottom: 20px;
}
.section--light h2 {
  font-size: 32px;    
  line-height: 1.2;
  margin-bottom: 20px;
}


/* Контакты */
.contacts__info h2 {
  font-size: 32px;
  margin-bottom: 20px;
}

.contacts__item {
  margin: 8px 0;
  font-size: 18px;
  font-weight: 600;
}

.contacts__link {
  color: var(--green);
  text-decoration: none;
}

.contacts__link:hover {
  text-decoration: underline;
}

.contacts__address {
  margin-top: 18px;
  font-size: 15px;
  line-height: 1.6;
  color: var(--muted);
}






/* === Адаптив под телефоны === */
@media (max-width: 600px) {

  .section {
    padding: 32px 0; /* меньше отступы */
  }

  /* Заголовки */
  h1 { font-size: 28px; }
  h2 { font-size: 24px; }
  h3 { font-size: 20px; }

  /* Герой блок */
  .hero__image {
    height: 220px;
  }
  .hero__card {
    padding: 20px;
  }
  .hero h1 {
    font-size: 28px;
  }
  .hero p.lead {
    font-size: 16px;
  }

  /* Услуги */
  .services {
    grid-template-columns: 1fr; /* по одной карточке */
    gap: 20px;
  }

  .service {
    padding: 16px;
  }

  /* Split-блоки (About, Slider) */
  .split,
  .split-slider__slide {
    grid-template-columns: 1fr; /* текст сверху, фото снизу */
    gap: 20px;
  }

  .card-image--portrait {
    max-width: 100%;
    aspect-ratio: auto; /* чтобы не резало */
  }

  .split--about h1 {
    font-size: 32px; /* меньше заголовок */
  }

  .split--about > div:first-child p {
    font-size: 15px;
    line-height: 1.6;
  }

  /* KPI */
  .kpis,
  .kpis--under {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .kpis--under .kpi__num {
    font-size: 28px;
  }

  /* Контакты */
  .contacts {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .contacts__info h2 {
    font-size: 24px;
  }
  .contacts__item {
    font-size: 16px;
  }
  .contacts__address {
    font-size: 14px;
  }

  /* Форма */
  .form label {
    font-size: 14px;
  }
  .form input,
  .form textarea {
    font-size: 15px;
    padding: 10px 12px;
  }

  /* Кнопки */
  .btn {
    padding: 12px 20px;
    font-size: 15px;
  }
}
@media (max-width: 600px) {
  .headerbar__row {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .headerbar__brand img {
    width: 100px;
  }

  .headerbar__contacts {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    font-size: 14px;
  }

  .headerbar__meta {
    font-size: 11px;
  }
}
@media (max-width: 600px) {
  .split-slider__slide {
    grid-template-columns: 1fr;
    gap: 16px;
    height: auto; /* убираем фикс */
    padding: 0;
  }

  .split-slider__slide .card-image {
    aspect-ratio: 16 / 10; /* более широкое фото */
  }

  .split-slider__nav {
    width: 30px;
    height: 30px;
    font-size: 20px;
    line-height: 30px;
  }

  .split-slider__nav--prev {
    left: 4px;
  }
  .split-slider__nav--next {
    right: 4px;
  }

  .split-slider__dots {
    margin-top: 10px;
  }
}





/* --- Split slider (fixed, как было) --- */
.split-slider{
  position:relative; overflow:hidden;
  --slide-gap:36px; --dots-gap:8px; --nav-inset:12px;
}
.split-slider__track{ display:flex; transition:transform .5s ease; will-change:transform; }
/* каждый слайд = сетка (текст | картинка) без фикс-высоты */
.split-slider__slide{
  min-width:100%;
  display:grid; grid-template-columns:1.1fr .9fr;
  gap:var(--slide-gap); align-items:center; padding:10px;
}
.split-slider__slide > div:first-child h2{ margin-top:0; }

/* колонка с картинкой справа, фикс. формат как было */
.split-slider__slide .card-image{
  border-radius:12px; overflow:hidden; box-shadow:var(--shadow);
  aspect-ratio:4/3; /* держим пропорцию */
}
.split-slider__slide .card-image img{ width:100%; height:100%; object-fit:cover; }

/* стрелки по бокам */
.split-slider__nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:42px;height:42px;border-radius:50%;border:0;background:#fff;box-shadow:var(--shadow);
  cursor:pointer;font-size:28px;line-height:42px;text-align:center;user-select:none;z-index:2;
}
.split-slider__nav--prev{ left:var(--nav-inset); }
.split-slider__nav--next{ right:var(--nav-inset); }
.split-slider__nav:hover{ background:#f6f7f8; }

/* точки */
.split-slider__dots{ display:flex; gap:var(--dots-gap); justify-content:center; margin-top:16px; }
.split-slider__dots button{ width:8px;height:12px;border-radius:50%;border:0;background:#cfd3d6;cursor:pointer; }
.split-slider__dots button.is-active{ background:var(--green); }

/* показывать стрелки только при ховере на десктопе */
.split-slider__nav{ opacity:0; visibility:hidden; transition:opacity .3s ease, visibility .3s ease; }
.split-slider:hover .split-slider__nav{ opacity:1; visibility:visible; }

/* адаптив */
@media (max-width:900px){
  .split-slider__slide{ grid-template-columns:1fr; gap:20px; }
  .split-slider__nav{ width:36px;height:36px;line-height:36px;font-size:24px; }
}
html{ scroll-behavior:smooth; }
/* чтобы при переходе по #callback контент не прятался под шапкой */
.section[id]{ scroll-margin-top: 80px; }









/* ===== READABILITY UPGRADE (site-wide) ===== */
:root{
  /* чуть шире контейнер, но безопасно */
  --container: 1240px;
}

/* База: читаемый размер и межстрочный интервал */
.site-main{
  font-size: 17.5px;
  line-height: 1.75;
  color:#1f2937; /* близко к #111, но мягче */
}
.site-main p{ margin: 0 0 1.05em; }
.site-main li{ margin: .25em 0; }

/* Заголовки — плавные через clamp */
.site-main h1{
  font-size: clamp(32px, 3.6vw, 46px);
  line-height: 1.15;
  letter-spacing: -.01em;
  margin: 0 0 16px;
}
.site-main h2{
  font-size: clamp(26px, 2.4vw, 36px);
  line-height: 1.2;
  margin: 0 0 26px;
}
.site-main h3{
  font-size: clamp(20px, 1.6vw, 22px);
  line-height: 1.25;
  margin: 12px 0 12px;
}

/* Секции — побольше «воздуха» */
.site-main .section{ padding: 84px 0; }
.site-main .section.section--light{ padding: 92px 0; }

/* Hero */
.site-main .hero__card{ padding: 40px; }
.site-main .hero p.lead{ font-size: 19px; color:#4b5563; }

/* Услуги (карточки) */
.site-main .services{ gap: 28px; margin-top: 26px; }
.site-main .service{ padding: 24px; }
.site-main .service p{ font-size: 17px; line-height: 1.7; }

/* Split-блоки и About */
.site-main .split{ gap: 36px; }
.site-main .split--about > div:first-child p{
  font-size: 17.5px;
  line-height: 1.75;
  max-width: 60ch;
}

/* FAQ */
.site-main .faq__q{ padding: 18px 20px; }
.site-main .faq__a{ padding: 0 20px 20px; line-height: 1.7; }

/* Контакты */
.site-main .contacts{ gap: 40px; }
.site-main .contacts__address{ font-size: 16.5px; line-height: 1.75; }

/* Формы + кнопки */
.site-main .form{ max-width: 780px; }
.site-main .form h3{ font-size: 34px; margin-bottom: 18px; }
.site-main .form label{ font-size: 15.5px; }
.site-main .form input,
.site-main .form textarea{
  font-size: 16.5px;
  padding: 13px 15px;
}
.site-main .btn{
  font-size: 16.5px;
  padding: 15px 26px;
}

/* Цена — чистый блок с крупным текстом (как обсуждали) */
#pricing{
  text-align: center;
  padding: 88px 0;
  background:#fff;
}
#pricing h2{
  font-size: clamp(28px, 2.6vw, 40px);
  margin-bottom: 22px;
}
/* ВАЖНО: 26px desktop и 18px на мобилке, повышаем специфичность и добиваемся приоритета */
#pricing p.pricing-clean__lead{
  font-size: 26px !important;
  line-height: 1.7;
  color:#333;
  margin: 0 0 22px;
}

/* Кнопка в блоке цены — заметнее */
#pricing .btn{
  font-size: 18px;
  padding: 16px 32px;
  border-radius: 10px;
  box-shadow: 0 8px 18px rgba(0,0,0,.12);
}

/* ===== Мобайл-тюнинг (<=900px) ===== */
@media (max-width: 900px){
  .site-main{ font-size: 16.5px; line-height: 1.75; }
  .site-main .section{ padding: 58px 0;         overflow: hidden;}
  .site-main .section.section--light{ padding: 62px 0; }
  .site-main .hero__card{ padding: 24px; margin-top: 50px; }
  .site-main .services{ gap: 20px; }
  .site-main .service{ padding: 18px; }
  .site-main .split{ gap: 22px; }
  .site-main .ts-card{ max-width: 88vw; }
}

/* ===== Телефоны (<=600px): ещё компактнее, но без «мелочи» ===== */
@media (max-width: 600px){
  .site-main{ font-size: 15.5px; }
  .site-main h1{ font-size: 28px; }
  .site-main h2{ font-size: 24px; margin-bottom: 18px; }
  .site-main h3{ font-size: 19px; }
  .site-main .hero p.lead{ font-size: 16px; }
  .site-main .form input,
  .site-main .form textarea{ font-size: 15.5px; }
  .site-main .btn{ font-size: 15px; padding: 12px 20px; }

  /* Цена — мобильное правило, перекрывает desktop */
  #pricing{ padding: 54px 0; }
  #pricing h2{ font-size: 26px; }
  #pricing p.pricing-clean__lead{
    font-size: 18px !important;
    line-height: 1.65;
    margin-bottom: 20px;
  }
  #pricing .btn{ font-size: 16px; padding: 12px 22px; }
}




/* === 1. Фиксированный хедер === */
.headerbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  background: #fff;
  box-shadow: var(--shadow);
}

/* === 2. Десктоп: текст крупнее, логотип меньше === */
.headerbar__brand img {
  width: 90px; /* было 120px */
}
.headerbar__brand > div > div:first-child {
  font-size: 20px; /* название компании */
}
.headerbar__meta {
  font-size: 14px;
}
.headerbar__contacts {
  font-size: 18px;
}

/* === 3. Мобильная версия === */
@media (max-width: 600px) {
  .headerbar__row {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }

  /* убираем логотип */
  .headerbar__brand img {
    display: none;
  }

  /* бренд и слоган меньше */
  .headerbar__brand > div > div:first-child {
    font-size: 16px;
  }
  .headerbar__meta {
    font-size: 11px;
  }

  /* контакты — упрощаем */
  .headerbar__contacts {
    flex-direction: row;
    gap: 12px;
    font-size: 14px;
  }

  /* кнопка справа */
  .headerbar__contacts .btn {
    padding: 10px 10px;
    font-size: 10px;
    margin-left: auto;
  }
}
/* Фикс шапки: единая высота, правильное выравнивание */
.headerbar{
  position: fixed;
  top:0; left:0; right:0;
  z-index:1000;
  background:#fff;
  box-shadow:var(--shadow);
}


/* строка шапки — по центру и с равными отступами */
.headerbar__row{
  display:flex;
  align-items:center;
  justify-content:space-between;      /* главное — растянуть в одну линию */
  gap:24px;
}

/* логотип компактнее, чтобы дать место контактам */
.headerbar__brand img{ width:84px; height:auto; }

/* правая часть: столбик (тел/почта) + кнопка в одну линию */
.headerbar__contacts{
  display:flex;
  align-items:center;
  gap:22px;
  font-weight:600;
  flex-shrink:0;                      /* не сжимать блок контактов */
}

/* столбик с контактами */
.headerbar__contacts > div{
  display:flex;
  flex-direction:column;

}

/* не ломаем телефон и email на две строки */
.headerbar__contacts a{
  white-space:nowrap;                 /* КЛЮЧ: запрет переносов */
}


/* Мобилка: без логотипа, всё в одну строку: бренд + контакты + кнопка */
@media (max-width:600px){
  .headerbar__row{
    flex-direction:row;               /* не в колонку */
    align-items:center;
    justify-content:space-between;
    gap:12px;
  }
  .headerbar__brand img{ display:none; }   /* убираем лого */
  .headerbar__brand > div > div:first-child{ font-size:16px; }
  .headerbar__meta{ font-size:11px; }

  .headerbar__contacts{
    gap:12px;
    font-size:14px;
  }
  .headerbar .btn{
    padding:10px 10px;
    font-size:9px;
  }

}



@media (max-width: 600px) {
  body {
    padding-top: 0px;
}
}


/* dots: одинаковые везде */
.split-slider__dots{
  display:flex; gap:10px; justify-content:center; margin-top:16px;
}
.split-slider__dots button{
  width:12px; 
  height:12px;                 /* одинаковая ширина/высота */
  aspect-ratio:1/1;            /* страховка от «яиц» */
  border:0;
  padding:0;
  border-radius:50%;
  background:#cfd3d6;
  cursor:pointer;
  appearance:none;
  -webkit-appearance:none;     /* iOS/Safari */
  line-height:0;               /* убираем влияние шрифтов */
}
.split-slider__dots button.is-active{
  background:var(--green);
 
}
@media (max-width: 600px){
  .split-slider{ padding-bottom: 18px; }  /* место для точек */
}

.footerbar .container {
  text-align: center;
}
@media (max-width: 600px) {
  .split--about {
    display: flex;
    flex-direction: column;
  }
  .split--about .card-image--portrait {
    order: -1; /* картинка будет первой */
    margin-bottom: 20px; /* немного отступа вниз */
  }
}
.split--about {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 36px;
  align-items: start;
}

.split--about .about-text:first-child {
  grid-column: 1 / -1; /* заголовок на всю ширину */
}

.split--about .card-image--portrait {
  grid-column: 2; /* картинка справа */
  justify-self: end;
  max-width: 460px;
}

.split--about .about-text:last-child {
  grid-column: 1; /* текст слева */
}

/* мобильный вариант — всё в одну колонку */
@media (max-width: 600px) {
  .split--about {
    grid-template-columns: 1fr;
  }
  .split--about .card-image--portrait {
    grid-column: 1;
    justify-self: start;
    max-width: 100%;
    margin: 20px 0;
  }
}
@media (max-width: 900px) {
    .site-main .section {
        padding: 25px, 0;
    }}



/* Split-slider: на мобилке картинка перед текстом */
.split-slider__slide{
  grid-template-areas: "text img"; /* десктоп по умолчанию */
}
.split-slider__slide > div:first-child{ grid-area: text; }
.split-slider__slide .card-image{ grid-area: img; }

@media (max-width: 900px){
  .split-slider__slide{
    grid-template-columns: 1fr;
    grid-template-areas:
      "img"
      "text";
    gap: 16px;
  }
  .split-slider__slide .card-image { margin: 0 0 8px; }
}
/* Единая высота для трека и слайдов */
.split-slider{ --slide-h:auto; }
.split-slider__track{ height: var(--slide-h); }
.split-slider__slide{ height: var(--slide-h); }

/* Точки всегда круглые */
.split-slider__dots button{
  width: 10px;
  height: 10px;
  aspect-ratio: 1 / 1;
  display: inline-block;
  border-radius: 50%;
  border: 0;
  background: #cfd3d6;
  flex: 0 0 auto;
}
.split-slider__dots button.is-active{ background: var(--green); }

/* На мобилке даём место под точки, чтобы их не съедал overflow */
@media (max-width: 900px){
  .split-slider{ padding-bottom: 28px; }
}
/* MOBILE layout для split-slider */
@media (max-width: 900px){

  /* сам слайд — колонкой, фиксируем равные внутренние отступы */
  .split-slider__slide{
    display: flex;                /* вместо grid на мобилке */
    flex-direction: column;
    align-items: stretch;
    justify-content: stretch;
    padding: 16px;                /* одинаковые отступы сверху/снизу */
    box-sizing: border-box;
    min-width: 100%;
    width: 100%;
    flex: 0 0 100%;
    gap: 16px;                    /* зазор между картинкой и контентом */
  }

  /* картинка всегда первой и «прижата» вверх */
  .split-slider__slide .card-image{
    order: 0;
    width: 100%;
    flex: 0 0 auto;               /* не растягиваем */
    aspect-ratio: 16 / 9;         /* или 4/3 — как нравится */
    border-radius: 12px;
    overflow: hidden;
  }
  .split-slider__slide .card-image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  /* текстовый столбец — растягивается между картинкой и кнопкой */
  .split-slider__slide > div:first-child{
    order: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1 1 auto;               /* занимай всё оставшееся место */
    min-height: 0;                /* чтобы не выталкивало */
  }

  /* кнопка вниз — всегда у нижней кромки */
  .split-slider__slide > div:first-child .btn{
    margin-top: auto;             /* прижимает кнопку вниз */
  }

  /* чтобы точки не уезжали под overflow */
  .split-slider{ overflow: visible; }
  .split-slider__dots{ margin-top: 14px; }
}



/* ====== header ====== */
.headerbar{
  padding:12px 0;
  background:#fff;
  box-shadow:var(--shadow);
}
.headerbar__row{
  display:flex;
  align-items:center;
  gap:16px;
}
.headerbar__brand{
  display:flex;
  align-items:center;
  gap:12px;
  margin-right:auto; /* уводим контакты вправо */
  color:inherit;
}
.headerbar__brand img{
  width:120px;
  height:auto;
  display:block;
}
.headerbar__meta{
  font-size:12px;
  color:var(--muted);
}
.headerbar__contacts{
  display:flex;
  align-items:center;
  gap:20px;
  font-weight:600;
}

/* mobile */
@media (max-width:600px){
  .headerbar__row{
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
  }
  .headerbar__brand img{ width:100px; }
  .headerbar__contacts{
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
    font-size:14px;
  }
  .headerbar__meta{ font-size:11px; }
}



/* === 1. Фиксированный хедер === */
.headerbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  background: #fff;
  box-shadow: var(--shadow);
  
}



/* === 2. Десктоп: текст крупнее, логотип меньше === */
.headerbar__brand img {
  width: 90px; /* было 120px */
}
.headerbar__brand > div > div:first-child {
  font-size: 20px; /* название компании */
}
.headerbar__meta {
  font-size: 14px;
}
.headerbar__contacts {
  font-size: 18px;
}

/* === 3. Мобильная версия === */
@media (max-width: 600px) {

  .headerbar__row {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }

  /* убираем логотип */
  .headerbar__brand img {
    display: none;
  }

  /* бренд и слоган меньше */
  .headerbar__brand > div > div:first-child {
    font-size: 16px;
  }
  .headerbar__meta {
    font-size: 11px;
  }

  /* контакты — упрощаем */
  .headerbar__contacts {
    flex-direction: row;
    gap: 12px;
    font-size: 14px;
  }

  /* кнопка справа */
  .headerbar__contacts .btn {
    padding: 10px 10px;
    font-size: 9px;
    margin-left: auto;
  }

}

/* === Mobile header: shrink instead of overflow === */

/* базовое мобильное состояние */
@media (max-width: 600px) {
  .headerbar__row{
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    flex-wrap: nowrap;        /* всё в одну линию */
  }

  /* не позволяем элементам ужиматься до нуля */
  .headerbar__brand,
  .headerbar__contacts,
  .headerbar__contacts .btn {
    flex-shrink: 0;
  }

  /* логотип прячем, чтобы не «съедал» ширину */
  .headerbar__brand img { display:none; }

  /* названия/слоганы в одну строку */
  .headerbar__brand > div > div:first-child,
  .headerbar__meta,
  .headerbar__contacts a {
    white-space: nowrap;
  }

  /* размеры по умолчанию для мобилок */
  .headerbar__brand > div > div:first-child { font-size: 16px; }
  .headerbar__meta { font-size: 11px; }
  .headerbar__contacts { font-size: 14px; gap: 12px; }
  .headerbar__contacts .btn { font-size: 12px; padding: 8px 12px; }
}

/* уже — ещё уменьшить */
@media (max-width: 480px) {
  .headerbar__brand > div > div:first-child { font-size: 14px; }
  .headerbar__meta { font-size: 10px; }
  .headerbar__contacts {  gap: 10px; }
  .headerbar__contacts .btn { font-size: 11px; padding: 7px 10px; }
}

/* совсем узко — прячем подпись и ещё сжимаем */
@media (max-width: 380px) {
  .headerbar__meta { display: none; }                  /* освобождаем место */
  .headerbar__brand > div > div:first-child { font-size: 13px; }
  .headerbar__contacts { font-size: 12px; gap: 8px; }
  .headerbar__contacts .btn { font-size: 10px; padding: 6px 8px; }
}
  /* контакты — справа, нормальный зазор перед телефоном */
  .headerbar__contacts{
    flex: 0 0 auto;
    display: flex;
    align-items: center;
  }
  /* mobile: единый стиль кнопки в хедере */

.headerbar__contacts .btn {
  font-family: "Montserrat", Arial, sans-serif;
  font-weight: 700;
  letter-spacing: 0;       /* убираем расхождения */
  text-transform: none;    /* если вдруг где-то прописано uppercase */
}
.card-map {
  border-radius: 12px;
  overflow: hidden;
  box-shadow: var(--shadow);
}
.card-map iframe {
  width: 100%;
  height: 400px;   /* совпадает с URL-параметром */
  border: 0;
  display: block;
}
@media (max-width: 600px){
  .card-map iframe { height: 320px; } /* при желании меньше на мобилке */
}
/* тулбар под textarea */
.list-tools{
  margin-top: 6px;
}
.list-tools .button.button-small{
  line-height: 24px;
  height: 26px;
  padding: 0 8px;
}
