/* ===== Base Layout ===== */
body {
  font-family: Arial, sans-serif;
  line-height: 1.6;
  margin: 0;
  background: #fefae0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* ===== Header ===== */
header {
  background: #c3c7c3;
  color:#264653;
  text-align: center;
  padding: 20px 20px;
}

header h1 {
  margin: 0;
  font-size: 2.5rem;
}

/* ===== Main Content ===== */
main {
  flex: 1;                 /* pushes footer down */
  padding: 0 20px 40px;
}

section {
  max-width: 800px;                /* keeps section from being too wide */
  width: 90%;                       /* responsive for mobile */
  margin: 10px auto;                /* center horizontally with vertical spacing */
  padding: 30px 20px;               /* inner spacing */

  background: #e9c46a;              /* light warm background */
  border: 2px solid #264653;        /* professional border */
  border-radius: 12px;              /* rounded corners */
  box-shadow: 0 6px 15px rgba(0,0,0,0.1); /* subtle shadow for depth */

  text-align: center;               /* center text inside */
  transition: transform 0.2s;       /* optional hover effect */
}

/* Optional: hover effect for interactive feel */
section:hover {
  transform: translateY(-5px);      /* slight lift on hover */
  box-shadow: 0 10px 20px rgba(0,0,0,0.15);
}

/*section {
  max-width: 800px;        // limits width 
  width: 90%;              // responsive 
  margin: 0 auto;          // centers horizontally 
  background: #e9c46a;
  padding: 30px 20px;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
  text-align: center;
}*/

section h2 {
  margin-top: 0;
  color: #264653;
}

section p {
  color: #264653;
  font-size: 1.1rem;
}

/* ===== Footer ===== */
footer {
  background: #264653;
  color: white;
  text-align: center;
  padding: 15px 10px;
}

footer p {
  margin: 0;
}
header nav {
  text-align: center;
  margin-top: 20px;
}

nav a {
  text-decoration: none;
  color: white;
  margin: 0 15px;
  font-weight: bold;
  font-size: 1.5rem;
}

nav a:hover {
  text-decoration: underline;
}

.restaurant-heading {
  text-align: center; /* optional: centers both lines */
  line-height: 1.2;   /* adjust spacing between lines */
}


.punchline {
  font-family:  'Tangerine', elegant; 
  font-size: 36px;
  text-shadow: 4px 4px 4px #aaa;
  font-style: italic;                 /* italic punchline */
  color: #555;                        /* muted color */
}


/* ===== Mobile Adjustments ===== */
@media (max-width: 600px) {
  header h1 {
    font-size: 2rem;
  }

  section {
    padding: 20px;
  }
  
}