*{
  box-sizing:border-box;
}

body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  background:#050505;
  color:white;
}

a{
  color:inherit;
  text-decoration:none;
}

:root{
  --gold:#d6a72c;
  --gold2:#f2c75c;
  --black:#050505;
}

.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:20px 30px;
  background:#050505;
  border-bottom:2px solid #D4A62A;
}

.menu{
  color:#D4A62A;
  font-size:42px;
  font-weight:bold;
}

.brand{
    font-size: 16px !important;
    line-height: 1 !important;
    max-width: 120px;
}

.brand span{
    font-size: 16px !important;
}

.top-call{
    width: 65px !important;
    font-size: 10px !important;
    padding: 4px !important;
    line-height: 1.1 !important;
}
.phone{
  border:2px solid var(--gold);
  color:var(--gold2);
  padding:12px 20px;
  border-radius:8px;
  font-weight:900;
  white-space:nowrap;
}

.hero{
  text-align:center;
  padding:55px 6% 65px;
  background:
    linear-gradient(rgba(0,0,0,.45),rgba(0,0,0,.9)),
    repeating-linear-gradient(0deg,#171717 0 34px,#0d0d0d 35px 42px);
  border-bottom:1px solid var(--gold);
}

.area{
  text-transform:uppercase;
  letter-spacing:8px;
  font-weight:900;
  font-size:clamp(16px,3vw,28px);
}

.hero h1{
  margin:25px 0 10px;
  line-height:.95;
}

.hero h1 span{
  display:block;
  font-size:clamp(58px,15vw,150px);
  font-weight:1000;
  color:white;
}

.hero h1 strong{
  display:block;
  font-size:clamp(58px,15vw,150px);
  font-weight:1000;
  color:var(--gold);
}

.tagline{
  font-family:Georgia,serif;
  font-style:italic;
  font-size:clamp(28px,6vw,58px);
  margin:20px 0;
}

.services{
  text-transform:uppercase;
  font-weight:900;
  font-size:clamp(20px,4vw,34px);
  line-height:1.4;
}

.buttons{
  display:flex;
  justify-content:center;
  gap:25px;
  flex-wrap:wrap;
  margin-top:35px;
}

.buttons a{
  background:linear-gradient(#f2c75c,#c99722);
  color:#100900;
  padding:18px 35px;
  border-radius:8px;
  font-size:clamp(18px,3vw,28px);
  font-weight:1000;
}

section{
  padding:60px 6%;
}

.quality{
  text-align:center;
  background:#090909;
  border-bottom:1px solid var(--gold);
}

h2{
  color:var(--gold);
  text-transform:uppercase;
  font-size:clamp(30px,5vw,48px);
  margin:0 0 20px;
}

.quality > p{
  max-width:850px;
  margin:0 auto 45px;
  font-size:clamp(18px,3vw,24px);
  line-height:1.5;
}

.cards{
  max-width:1200px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:25px;
}

.card{
  padding:25px;
  border-left:1px solid rgba(214,167,44,.5);
}

.card{
  font-size:42px;
}

.card h3{
  color:var(--gold);
  text-transform:uppercase;
  font-size:22px;
  margin:15px 0 10px;
}

.card p{
  font-size:17px;
  line-height:1.4;
}

.work{
  background:#050505;
}

.section-head{
  max-width:1200px;
  margin:auto;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  flex-wrap:wrap;
}

.section-head a{
  border:2px solid var(--gold);
  color:var(--gold2);
  padding:12px 24px;
  border-radius:6px;
  font-weight:900;
  text-transform:uppercase;
}

.gallery{
  max-width:1200px;
  margin:25px auto 0;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:20px;
}

.photo{
  min-height:180px;
  border:2px solid var(--gold);
  border-radius:10px;
  background:linear-gradient(135deg,#3a3a3a,#090909);
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--gold2);
  font-size:22px;
  font-weight:900;
}

.contact{
  text-align:center;
  background:#090909;
  border-top:1px solid var(--gold);
}

.contact p{
  font-size:20px;
}

.contact a{
  color:var(--gold2);
}

footer{
  background:#000;
  text-align:center;
  padding:25px;
  color:#aaa;
  border-top:1px solid var(--gold);
}

@media(max-width:700px){
  .topbar{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    padding:8px 10px !important;
  }

  .menu{
    font-size:24px !important;
  }

  .brand{
    font-size:18px !important;
    line-height:.9 !important;
    max-width:95px !important;
  }

  .brand span{
    font-size:18px !important;
  }

  .top-call,
  .phone{
    width:70px !important;
    font-size:11px !important;
    padding:5px !important;
    line-height:1.1 !important;
    white-space:normal !important;
    border:2px solid #D4A62A !important;
    border-radius:8px !important;
    text-align:center !important;
  }
}