@import url('https://fonts.googleapis.com/css2?family=Anton&family=Urbanist:wght@300;400;500;600&family=Forum&family=Dancing+Script:wght@400..700&display=swap');

/* ---- CSS Variables (corrected to match style.css) ---- */
:root {
  --card-color:       hsla(0, 0%, 8%, 1);
  --background-color: #0f0f0f;
  --light-oak:        #a67c52;   /* Warm Oak */
  --lighter-oak:      #c0a385;
  --cruel-oak:        #5e281d;
  --basic-oak:        #b84e36;
  --quick-silver:     hsla(30, 5%, 65%, 1);
  --white:            hsla(30, 20%, 96%, 1);
  --white-alpha-10:   hsla(30, 20%, 96%, 0.10);
  --white-alpha-20:   hsla(30, 20%, 96%, 0.20);

  --fontFamily-forum:        'Forum', cursive;
  --fontFamily-dm_sans:      'DM Sans', sans-serif;
  --fontFamily-dancing:      'Dancing Script', cursive;
  --fontFamily-anton:        'Anton', sans-serif;
  --fontFamily-urbanist:     'Urbanist', sans-serif;

  --transition-1: 250ms ease;
  --transition-2: 500ms ease;
}

/* ---- Reset ---- */
*, *::before, *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html { scroll-behavior: smooth; font-size: 10px;}

li  { list-style: none; }
img { display: block; height: auto; }
a   { color: inherit; text-decoration: none; }

input, button, select, textarea { display: block; }

::-webkit-scrollbar       { width: 5px; }
::-webkit-scrollbar-track { background-color: transparent; }
::-webkit-scrollbar-thumb { background-color: var(--light-oak); }

/* ---- Base ---- */
body {
  background-color: var(--background-color);
  color: var(--white);
  font-family: var(--fontFamily-urbanist);
  font-size: 10px;        /* rem base */
}

/* TOPBAR  (address / phone / email) */
.header {
  display: flex;
  padding: 10px 0;
  align-items: center;
  justify-content: center;
  gap: 32px;
  max-width: 1300px;
  margin-inline: auto;
  padding-inline: 24px;
}

.header-container-1,
.header-container-2 {
  display: flex;
  gap: 24px;
  align-items: center;
}

.item1, .item3, .item4 {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--fontFamily-dm_sans);
  color: var(--quick-silver);
  transition: color var(--transition-1);
}

.item1 p, .item3 p, .item4 p { font-size: 1.5rem; }

.item1:hover, .item3:hover, .item4:hover {
  color: var(--light-oak);
}

.header-icon { font-size: 1.6rem; }

.link { text-decoration: none; }

/* Outer wrapper matches index.html's .topbar */
.header-wrap {
  background-color: #0a0a0a;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

@media (max-width: 768px) {
  .header-container-1 { display: none; }
  .header {
    justify-content: center;
  }
}

/* NAVBAR  (logo + home icon) */
.navbar-wrap {
  background-color: #0a0a0a;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.menu {
  display: flex;
  padding: 14px 24px;
  justify-content: space-between;
  align-items: center;
  max-width: 1300px;
  margin-inline: auto;
}

.logo-img {
  width: 180px;
}

.menu-home-icon {
  font-size: 3.2rem;
  color: var(--quick-silver);
  transition: color var(--transition-1);
}

.menu-home-icon:hover { color: var(--light-oak); }

.catering-hero {
  text-align: center;
  padding: 50px 24px 45px;
  position: relative;
}

.catering-hero-title {
  font-family: var(--fontFamily-anton);
  font-size: clamp(4rem, 6vw, 5.5rem);
  letter-spacing: 3px;
  color: var(--white);
  line-height: 1.1;
  margin-bottom: 16px;
}

.catering-hero-divider {
  width: 50px;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--light-oak), transparent);
  margin-inline: auto;
  margin-bottom: 16px;
}

.catering-hero-sub {
  font-family: var(--fontFamily-urbanist);
  font-size: 1.9rem;
  font-weight: 300;
  color: var(--quick-silver);
  max-width: 600px;
  margin-inline: auto;
  line-height: 1.7;
}

/* FORM SECTION */
.form-section-wrap {
  background: linear-gradient(180deg,
    rgba(94, 40, 29, 0.06) 0%,
    transparent 100%);
  padding-block: 70px;
}

.form-container {
  max-width: 900px;
  margin-inline: auto;
  padding-inline: 24px;
}

.form-card {
  background-color: hsla(0, 0%, 7%, 1);
  border: 1px solid rgba(166, 124, 82, 0.15);
  border-radius: 18px;
  padding: 50px 48px;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.6);
}

/* COPYRIGHT */
.copyright-wrap {
  background-color: #0a0a0a;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.copyright-sec {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 22px 0;
  font-family: var(--fontFamily-urbanist);
  font-size: 1.5rem;
  color: rgba(255, 255, 255, 0.4);
}