*{

margin: 0;
padding: 0;

}
body{
 background: url(bg3.jpg);
  background-position: center;
    background-size: cover;
    height: 109vh;
     width: 100%;
}

nav {
      position: fixed;
      top: 0; left: 0; right: 0;
      z-index: 100;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 1.2rem 6%;
      background: rgba(26,10,0,0.75);
      backdrop-filter: blur(14px);
      border-bottom: 1px solid rgba(210,105,30,0.15);
      transition: background 0.4s;
    }

    .nav-logo {
      font-family: Arial, Helvetica, sans-serif;
      font-size: 1.6rem;
      font-weight: 900;
      letter-spacing: 0.08em;
      color: #fff;
    }
    .nav-logo span { color: var(--chocolate); }

    .nav-links {
      display: flex;
      gap: 2.4rem;
      list-style: none;
      align-items: center;
    }

    .nav-links a {
      font-size: 0.78rem;
      font-weight: 500;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: rgba(255,255,255,0.75);
      text-decoration: none;
      transition: color 0.3s;
      position: relative;
    }
    .nav-links a::after {
      content: '';
      position: absolute;
      bottom: -3px; left: 0;
      width: 0; height: 1px;
      background: var(--chocolate);
      transition: width 0.3s;
    }
    .nav-links a:hover { color: var(--white); }
    .nav-links a:hover::after { width: 100%; }

    .dropbtn{
  position: relative;
  text-decoration: none;
  color: aliceblue;
 font-family: Arial;
 transition: 0.4s ease-in-out;

}

.dropdown {
  position: relative;
  text-decoration: none;
  font-family: Arial;
 font-weight: bold;
 transition: 0.4s ease-in-out;
}

.dropdown-content {
  display: none;
  position: absolute;
  min-width: 200px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  background-color: #1a0a00;
}


.dropdown-content a {
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}


.dropdown:hover .dropdown-content {
  display: block;
}

* {box-sizing:border-box}

    .nav-cta {
      background: var(--chocolate);
      color: var(--white) !important;
      padding: 0.55rem 1.4rem;
      border-radius: 40px;
      font-size: 0.75rem !important;
      letter-spacing: 0.1em;
      transition: background 0.3s !important;
    }
    .nav-cta:hover { background: var(--amber) !important; }
    .nav-cta::after { display: none !important; }


.navbar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:20px 10%;
   width: 60%;
}

.icon{

    width: 200px;
    float: left;
    height: 70px;
}

.logo{
color: aliceblue;
font-size: 35px;
font-family: arial;
padding-left: 20px;
float: left;
padding: 10px;
}


.menu{
width: 30px;
float: left;
height: 70px;
}

ul{
float: left;
display: flex;
justify-content: center;
align-items: center;
}

ul li{

list-style: none;
margin-left: 62px;
margin-top: 50;
font-size: 14px;

} 

ul li a{
text-decoration: none;
color: aliceblue;
font-family: Arial;
font-weight: bold;
transition: 0.4s ease-in-out;

}

ul li a:hover{
color:coral
}



h1{
font-size: 2.5rem;
  font-weight: 700;
  color: #d2691e;
  font-family: 'Georgia', serif;
  text-transform: uppercase;
  letter-spacing: 0.1rem;
  position: top;
  text-align: center;
  margin-top: 20;
}
p {
  justify-content: center;
  align-items: center;
  color: #fff;
}

p {
  text-align: center;
}
.container{
width: 60%;
margin: 50px auto;
display: flex;


}
.contact-box{
background: #fff;
display: flex;
align-items: stretch;

}

.contact-left{
flex-basis: 60%;
padding: 40px 60px;

}

.contact-right{
flex-basis: 40%;
padding: 40px;
background: #d2691e;
color: #fff;
}

h1{

margin-bottom: 10px;

}
.container p{

margin-bottom: 10px;

}
.input-row{

display: flex;
justify-content: space-between;
margin-bottom: 20px;

}

.input-row .input-group{
flex-basis: 45%;

}
input{

    width: 100%;
    border: none;
    border-bottom: 1px solid #ccc;
    outline: none;
    padding: 5px;
}
textarea{
width: 100%;
border: 1px solid #ccc;
outline: none;
padding: 10px;
box-sizing: border-box;

}
label{
margin-bottom: 6px;
display: block;
color: #d2691e;

}
button{
background: #d2691e;
width: 100px;
border: none;
outline: none;
color: #fff;
height: 35px;
border-radius: 30px;
margin-top: 20px;
box-shadow: 0px 5px 15px 0px rgba(28, 0, 181, 0.3);

}

.contact-left h3{
 color: #d2691e;
 font-weight: 600;
 margin-bottom: 30px;
}

.contact-right h3{
 font-weight: 600;
 margin-bottom: 30px;
}

tr td:first-child{
padding-right: 20px;

}

tr td{

    padding-top: 20px;
}

 footer {
      background: #110700;
      padding: 4rem 6% 2rem;
    }

    .footer-top {
      display: grid;
      grid-template-columns: 1.5fr 1fr 1fr 1fr;
      gap: 3rem;
      padding-bottom: 3rem;
      border-bottom: 1px solid rgba(210,105,30,0.15);
    }

    .footer-brand h3 {
      font-family: 'Playfair Display', serif;
      font-size: 1.5rem;
      color: var(--white);
      margin-bottom: 1rem;
      color: #ccc;
    }
    .footer-brand h3 span { color: var(--chocolate); }

    .footer-brand p {
      font-size: 0.83rem;
      line-height: 1.8;
      color: rgba(255,255,255,0.4);
      max-width: 240px;
    }

    .footer-col h4 {
      font-size: 0.7rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--chocolate);
      margin-bottom: 1.2rem;
      color: #ccc;
    }

    .footer-col a {
      display: block;
      font-size: 0.83rem;
      color: rgba(255,255,255,0.45);
      text-decoration: none;
      margin-bottom: 0.6rem;
      transition: color 0.3s;
    }
    .footer-col a:hover { color: var(--white); }

    .footer-bottom {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding-top: 2rem;
    }
    .footer-bottom p {
      font-size: 0.75rem;
      color: rgba(255,255,255,0.25);
    }

    /* ── KEYFRAMES ── */
    @keyframes fadeUp {
      from { opacity: 0; transform: translateY(22px); }
      to   { opacity: 1; transform: translateY(0); }
    }
    @keyframes fadeIn {
      from { opacity: 0; }
      to   { opacity: 1; }
    }
    @keyframes slide {
      from { left: -100%; }
      to   { left: 100%; }
    }

    /* ── RESPONSIVE ── */
    @media (max-width: 900px) {
      .gallery-grid { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
      .gallery-item:first-child { grid-row: span 1; }
      .about-strip { grid-template-columns: 1fr; }
      .footer-top { grid-template-columns: 1fr 1fr; }
    }

    @media (max-width: 600px) {
      .nav-links { display: none; }
      .hero h1 { font-size: 2.6rem; }
      .gallery-grid { grid-template-columns: 1fr; }
      .footer-top { grid-template-columns: 1fr; }
    }