.promo__buttons {
  display: flex;
  align-items: center;
  gap: 16px;
}

.promo__btn--whatsapp {
  display: flex;
  align-items: center;
  justify-content: center;
}

.promo__btn--whatsapp img {
  width: 26px;
  margin-right: 16px;
}

/* Sidebar */

.sidebar.sidebar--contacts{
  position:fixed;
  left:0;
  top:50%;
  transform:translateY(-50%);
  width:48px;
  border-radius:0 10px 10px 0;
  overflow:hidden;
  box-shadow:0 4px 12px rgba(0,0,0,.18);
  z-index:1000;
}

.sidebar__item{
  width:48px;
  height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  text-decoration:none;
}
.sidebar__item img {
  width: 18px;
  height: 18px;
  filter: invert(1);
}

.sidebar__icon{
  width:18px;
  height:18px;
}

/* modifiers (colors) */
.sidebar__item--download{ background:#000; }
.sidebar__item--phone{ background:#c62828; }
.sidebar__item--mail{ background:#f57c00; }
.sidebar__item--whatsapp{ background:#25d366; }
.sidebar__item--facebook{ background:#1877f2; }
.sidebar__item--google{ background: rgba(233, 30, 99, 0.74); color:#444; }

/* mobile */
@media (max-width:768px){
  .sidebar.sidebar--contacts{
    left:0;
    right:0;
    bottom:0;
    top:auto;
    transform:none;
    width:100%;
    height:44px;
    display:flex;
    border-radius:10px 10px 0 0;
  }

  .sidebar__item{
    flex:1;
    height:44px;
  }

  .sidebar__icon{
    width:16px;
    height:16px;
  }
}

.btn--icon {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 8px;
  height: 64px;
  padding-top: 0;
  padding-bottom: 0;
}

.btn--icon img {
  width: 24px
}

.why-choose__buttons {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Fixed Steps */
.fixed-steps{
  padding:60px 0;
}

.fixed-steps__title{
  text-align:center;
  margin-bottom:60px;
}

.fixed-steps__content{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:40px;
  text-align:center;
}

.fixed-steps__item{
  max-width:320px;
  margin:0 auto;
}

.fixed-steps__icon{
  margin-bottom:20px;
}

.fixed-steps__button {
  margin: 0 auto;
  margin-top: 40px;
}

.fixed-steps__icon img{
  max-width:90px;
  height:auto;
}

.fixed-steps__item-title{
  font-size:18px;
  font-weight:600;
  margin-bottom:10px;
}

.fixed-steps__text{
  font-size:14px;
  line-height:1.5;
  margin-bottom:20px;
  color:#555;
}

@media (max-width:768px){
  .fixed-steps__content{
    grid-template-columns:1fr;
    gap:16px;
  }
  .fixed-steps {
    padding-bottom: 40px;
  }
  .fixed-steps__title {
    margin-bottom: 40px;
  }
  .fixed-steps__button {
    margin-top: 24px;
  }
}

.fixed-steps__icon{
  margin-bottom:20px;
  display:flex;
  justify-content:center;
}

.fixed-steps__icon svg{
  width:48px;
  height:48px;
  stroke-width:1.75;
  color:#222;
}

.fixed-steps__icon--whatsapp i{
  color:#25d366;
}

/* Stats Block */

.stats{
  padding-bottom: 60px;
}

.stats__wrap{
  position:relative;
  border-radius:20px;
  background:#fff;
  box-shadow:0 18px 50px rgba(0,0,0,.12);
  overflow:hidden;
}

.stats__list{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  align-items:center;
}

/* dividers like in screenshot */
.stats__item{
  padding:34px 24px 28px;
  text-align:center;
  position:relative;
}

.stats__item:not(:last-child)::after{
  content:"";
  position:absolute;
  top:18%;
  right:0;
  width:1px;
  height:64%;
  background:repeating-linear-gradient(
    to bottom,
    rgba(0,0,0,.18) 0 2px,
    transparent 2px 6px
  );
  opacity:.8;
}

/* icon badges */
.stats__icon{
  width:52px;
  height:52px;
  margin:0 auto 14px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  box-shadow:0 10px 22px rgba(0,0,0,.12);
}

.stats__icon i{
  width:26px;
  height:26px;
}

/* bright gradients per icon */
.stats__icon--cal{ background:linear-gradient(135deg,#2b7cff,#00c2ff); }
.stats__icon--lock{ background:linear-gradient(135deg,#ffb020,#ff4d4d); }
.stats__icon--tech{ background:linear-gradient(135deg,#32d074,#00d4a6); }
.stats__icon--time{ background:linear-gradient(135deg,#a855f7,#ff4d4d); }

.stats__value{
  font-size:44px;
  font-weight:800;
  line-height:1;
  margin-bottom:8px;
  color: rgba(0, 0, 0, 0.82);
  letter-spacing:-0.02em;
}

.stats__label{
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#5b6472;
}

/* hover polish */
.stats__item{
  transition:transform .15s ease, background .15s ease;
}
.stats__item:hover{
  background:rgba(43,124,255,.03);
  transform:translateY(-2px);
}

/* responsive */
@media (max-width:992px){

  .stats {
    margin-top: 32px;
  }

  .stats__list{
    grid-template-columns:repeat(2,1fr);
  }
  .stats__item:not(:last-child)::after{
    display:none;
  }
  .stats__item{
    padding:30px 18px 24px;
  }
}

@media (max-width:520px){
  .stats__list{
    grid-template-columns:1fr 1fr;
  }
  .stats__value{
    font-size:32px;
  }

  .stats {
    padding-bottom: 0;
  }

  .stats__label {
    line-height: 1.2;
  }
}

/* Features */
.features{
  padding: 40px 0;
}

.features__list{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:40px;
  align-items:center;
}

.features__item{
  display:flex;
  align-items:center;
  gap:16px;
}

.features__icon{
  color:#e11d48; /* red/pink like screenshot */
  flex:0 0 auto;
}

.features__icon svg{
  width:42px;
  height:42px;
  stroke-width:1.75;
}

.features__title{
  margin:0 0 6px;
  font-size:18px;
  font-weight:800;
  color:#111;
}

.features__desc{
  margin:0;
  font-size:14px;
  color:#6b7280;
}

@media (max-width:768px){
  .features {
    padding: 28px 0;
  }
  .features__list{
    grid-template-columns:1fr;
    gap:18px;
  }
}

/* Last Works */
.works{
  padding:60px 0;
}

.works__kicker{
  margin:0 0 8px;
  color:#6b7280;
  font-size:16px;
}

.works__title{
  margin-bottom: 60px;
  text-align: center;
}

.faq {
  padding-top: 60px;
}

.works__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 18px;
  background:#fbbf24;       /* yellow like screenshot */
  color:#111;
  font-weight:800;
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:13px;
  border-radius:0;          /* square button like screenshot */
  min-width:200px;
}

.works__btn:hover{ filter:brightness(1.03); }

/* GRID */
.works__grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
}

.works__item{
  position:relative;
  overflow:hidden;
  border-radius:10px;
  background:#eef2f7;
  aspect-ratio: 4 / 3; /* тримає сітку рівною */
}

.works__img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.01);
  transition:transform .25s ease, filter .25s ease;
}

.works__item:hover .works__img{
  transform:scale(1.06);
  filter:contrast(1.05);
}

/* Optional: легкий градієнт внизу як у прикладі */
.works__item::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:40%;
  background:linear-gradient(to top, rgba(0,0,0,.25), transparent);
  opacity:.0;
  transition:opacity .25s ease;
}

.works__item:hover::after{
  opacity:1;
}

/* Responsive */
@media (max-width:1200px){
  .works__grid{ grid-template-columns:repeat(3,1fr); }
}

@media (max-width:900px){
  .works__head{
    flex-direction:column-mail;
  }
  .works__head{
    align-items:flex-start;
  }
  .works__btn{
    min-width:auto;
    width:100%;
  }
  .works__grid{ grid-template-columns:repeat(2,1fr); }

  .works {
    padding:40px 0;
  }

  .works__title {
    margin-bottom: 24px;
  }

  .faq {
    padding: 40px 0;
  }

  .faq .container {
    grid-template-columns: 1fr !important;
    grid-gap: 24px;
  }

  .faq__title {
    margin-top: 0 !important;
    text-align: center;
  }
}

/* Contact Form */

.faq .container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 40px;
}

.contact-form{
  color:#000;
  padding:32px;
  background: #fff;
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.contact-form__title{
  margin:0 0 16px;
  font-size:36px;
  font-weight:800;
}

.contact-form__desc{
  margin:0 0 24px;
  font-size:14px;
  color: #000;
}

.contact-form__form{
  display:grid;
  gap:18px;
}

.contact-form__label{
  display:grid;
  gap:8px;
  font-size:14px;
}

.contact-form__req{
  color:#ff4d4d;
}

.contact-form__input,
.contact-form__textarea{
  width:100%;
  padding:12px;
  font-size:14px;
  border: 1px solid #c4c4c4;
}

.contact-form__textarea{
  min-height:90px;
  resize:vertical;
}

.contact-form__btn{
  align-self:flex-start;
  background: #ffda48;
  color:#000;
  border:0;
  padding:10px 18px;
  font-weight:700;
  cursor:pointer;
}

.contact-form__btn:hover{
  filter:brightness(1.05);
}

.contact-form__status{
  font-size:14px;
  margin-top:6px;
  color: #1877f2;
  font-weight: 500;
}

.contact-form__hp{
  position:absolute; left:-9999px; width:1px; height:1px; opacity:0;
}

.contact-form__input.is-invalid,
.contact-form__textarea.is-invalid{
  outline:2px solid #ff4d4d;
  outline-offset:2px;
}

.contact-form__error{
  margin-top:6px;
  font-size:12px;
  color:#ffb4b4;
}

/* Gratings */

.grating{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;

  padding: 22px;
  background:#fff;
  border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,.08);
  margin-bottom: 24px;
}

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

.grating__icon {
  width:24px;
  height:24px;
  color:#16a34a;
}

.grating__brand{
  font-size:18px;
  display: flex;
  align-items: center;
  font-weight: 500;
  gap: 8px;
}

.grating__google img {
  height: 24px;
  margin-bottom: -3px;
}

.grating__text{
  color: #111;
}

.grating__right{
  display:flex;
  align-items:center;
  gap:10px;
}

.grating__value{
  font-size:20px;
  font-weight:900;
  color:#111;
}

.grating__stars{
  display:flex;
  gap:4px;
}

.grating__stars svg{
  width:16px;
  height:16px;
  color:#fbbc04;
  fill:#fbbc04; /* важливо для lucide */
}

.grating__count{
  font-size:13px;
  color:#6b7280;
}

@media (max-width:520px){
  .grating{
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
  }

}

.review-author{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom: 12px;
}

.review-author__avatar{
  width:40px;
  height:40px;
  border-radius:50%;
  background:#1f2937;
  color:#fff;
  font-weight:800;
  font-size:18px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.review-author__info{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.review-author__name{
  display:flex;
  align-items:center;
  gap:6px;
  font-weight:800;
  color:#111;
  font-size:15px;
  margin-bottom: 4px;
}

.review-author__verified{
  width:16px;
  height:16px;
  color:#2563eb;
}

.review-author__meta{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:13px;
  color:#6b7280;
}

.review-author__google{
  width:16px;
  height:16px;
  color:#ea4335;
}

.header-dbs {
  height: 24px;
}

@media screen and (max-width: 991px) {
  .header-dbs {
    order: -2;
  }
  .header__info {
    order: -1;
  }
}

.floating-buttons {
  position: fixed;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 12px;
  z-index: 9999;

  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

.floating-buttons .promo__btn {
  margin-bottom: 0 !important;
  white-space: nowrap;
}

.floating-buttons.is-visible {
  opacity: 1;
  pointer-events: auto;
}

/* адаптація під мобільні */
@media (max-width: 768px) {
  .floating-buttons {
    flex-direction: column;
    width: calc(100% - 32px);
  }

  .floating-buttons .promo__btn {
    width: 100%;
    justify-content: center;
  }
}