:root{
  --bg:#1c1c1a;
  --accent:#fe4f0d;
  --text:#b3b3b3;
}

*{margin:0;padding:0;box-sizing:border-box}
body{
  font-family:system-ui,-apple-system,sans-serif;
  background:var(--bg);
  color:var(--text);
  scroll-behavior:smooth;
}
.container{width:90%;max-width:1200px;margin:auto;}

/* Header */
.header{
  position:sticky;
  top:0;
  background:rgba(28,28,26,0.9);
  backdrop-filter:blur(10px);
  z-index:1000;
  transition:all .3s ease;
}
.header.scrolled{padding:5px 0;}

.header-inner{
  display:flex;
  flex-direction:column;
  padding:15px 0;
}

/* Desktop layout */
.header-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  width:100%;
  gap:20px;
}

.logo{
  height:50px; 
  max-width:200px; 
  object-fit:contain;
}

/* Navigation */
.nav{
  display:flex;
  gap:30px;
  flex-direction:row;
  flex-wrap:nowrap;
  align-items:center;
}
.nav-link{
  text-decoration:none;
  color:var(--accent);
  position:relative;
  white-space:nowrap;
}
.nav-link::after{
  content:'';position:absolute;width:0;height:2px;bottom:-5px;left:0;background:var(--accent);transition:.3s;
}
.nav-link:hover::after,
.nav-link.active::after{
  width:100%;
}

/* Buttons desktop */
.header-actions-desktop{
  display:flex;
  gap:10px;
  align-items:center;
}

/* Burger (hidden desktop) */
.burger{
  display:none;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
}
.burger span{
  width:25px;
  height:3px;
  background:var(--accent);
}

/* Buttons mobile */
.header-actions-mobile{
  display:none;
  margin-top:10px;
  justify-content:center;
  flex-wrap:wrap;
}

/* Кнопки для десктопу та мобільних */
.header-actions-desktop a,
.header-actions-mobile a {
  background: var(--accent);
  color: #fff;
  padding: 10px 20px;
  border-radius: 30px;
  text-decoration: none;
  display: inline-block;
  white-space: nowrap;
  text-align: center;
  transition: transform .3s, background .3s;
}
.header-actions-desktop a:hover,
.header-actions-mobile a:hover {
  transform: translateY(-2px);
  background: #ff6b2e;
}

.hero {
 /* min-height: 80vh;              /* висота блоку */
  display: flex;
  align-items: center;           /* вертикальне центрування */
  justify-content: center;       /* горизонтальне центрування */
  text-align: center;
}

/* Section / Card / Slider */
.section{padding:100px 0;text-align:center;}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px;margin-top:40px;}
.card{background:#222;padding:20px;border-radius:20px;transition:.4s;}
.card:hover{transform:translateY(-10px);}
.card img,.slide img{width:100%;max-width:100%;height:auto;border-radius:15px;object-fit:cover;}

.slider{position:relative;overflow:hidden;}
.slide{display:none;}
.slide.active{display:block;animation:fade 1s;}
@keyframes fade{from{opacity:0}to{opacity:1}}

/* Testimonials / Відгуки */
.testimonial {
  height: 300px;          /* фіксована висота блоку */
  width: 100%;
  overflow: hidden;
  border-radius: 20px;
  background: #222;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

.testimonial img {
  max-height: 70%;        /* картинка займає максимум 70% висоти блоку */
  width: auto;
  object-fit: cover;
  border-radius: 15px;
}

.testimonial p {
  margin: 0;
  color: var(--text);
  font-size: 0.9rem;
}

/* Contact Form */
.contact-form{display:flex;flex-direction:column;gap:20px;max-width:600px;margin:auto;}
input,textarea{padding:15px;background:#2a2a28;border:none;color:#fff;border-radius:10px;}

/* Footer / Contacts */
.footer{padding:40px 0;text-align:center;transition:all .3s;}
.contact-icons{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:40px;
  flex-wrap:wrap;
}
.contact-icons a{
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--accent);
  text-decoration:none;
  font-size:1rem;
  transition:transform .3s,color .3s;
}
.contact-icons a:hover{
  transform:translateY(-3px);
  color:#ff6b2e;
}

/* Media Queries */
@media(max-width:768px){
  /* Header adjustments */
  .header-top{
    justify-content:space-between;
    align-items:center;
  }

  .burger{
    display:flex;
  }

  .header-actions-desktop{
    display:none;
  }

  /* Buttons mobile — рядок */
  .header-actions-mobile{
    display:flex;
    flex-direction:row;
    gap:10px;
    align-items:center;
    justify-content:center;
    margin-top:10px;
    flex-wrap:wrap;
  }

  .nav{
    flex-direction:column;
    position:absolute;
    top:60px;
    right:10px;
    background:var(--bg);
    padding:20px;
    border-radius:10px;
    display:none;
    width:80%;
    max-width:300px;
    z-index:999;
  }
  .nav.active{
    display:flex;
  }

  /* Contact icons stack on mobile */
  .contact-icons{
    flex-direction:column;
    gap:20px;
  }
}

.contact-form button {
  background: var(--accent);
  color: #fff;
  padding: 12px 25px;
  border-radius: 30px;
  border: none;
  cursor: pointer;
  font-size: 1rem;
  transition: transform .3s, background .3s;
}

.contact-form button:hover {
  transform: translateY(-2px);
  background: #ff6b2e;
}

.hidden-field {
  position: absolute;
  left: -9999px;
}