:root {
  --brasa-red: #b83224;
  --brasa-red-dark: #8f251b;
  --brasa-orange: #f26a21;
  --brasa-yellow: #f6b93b;
  --brasa-teal: #167c80;
  --brasa-teal-dark: #0f5f62;
  --brasa-cream: #fff4df;
  --brasa-soft: #fffaf2;
  --brasa-charcoal: #2d2420;
}

/* Color strip across the top */
body::before {
  content: "";
  display: block;
  height: 8px;
  background: linear-gradient(
    90deg,
    var(--brasa-red),
    var(--brasa-orange),
    var(--brasa-yellow),
    var(--brasa-teal)
  );
}

/* General page style */
body {
  color: var(--brasa-charcoal);
  background-color: var(--brasa-soft);
  background-image:
    radial-gradient(circle at 10% 8%, rgba(246, 185, 59, 0.55), transparent 22%),
    radial-gradient(circle at 88% 10%, rgba(242, 106, 33, 0.38), transparent 24%),
    radial-gradient(circle at 18% 72%, rgba(184, 50, 36, 0.18), transparent 24%),
    radial-gradient(circle at 84% 78%, rgba(22, 124, 128, 0.22), transparent 26%),
    radial-gradient(rgba(184, 50, 36, 0.10) 1px, transparent 1px),
    radial-gradient(rgba(22, 124, 128, 0.09) 1px, transparent 1px),
    linear-gradient(180deg, #fff3d6 0%, #fffaf2 42%, #ffe9c0 100%);
  background-position:
    top left,
    top right,
    bottom left,
    bottom right,
    0 0,
    18px 18px,
    center;
  background-size:
    auto,
    auto,
    auto,
    auto,
    38px 38px,
    38px 38px,
    auto;
  background-attachment: fixed;
}

/* Navbar */
.navbar {
  background-color: rgba(255, 250, 242, 0.96) !important;
  backdrop-filter: blur(8px);
}

.navbar-brand {
  color: var(--brasa-red) !important;
  letter-spacing: -0.03em;
}

.nav-link {
  color: var(--brasa-charcoal);
  font-weight: 500;
}

.nav-link:hover,
.nav-link.active {
  color: var(--brasa-teal) !important;
}

/* Light background sections */
.bg-light {
  background:
    linear-gradient(135deg, rgba(255, 244, 223, 0.92), rgba(255, 250, 242, 0.90)),
    radial-gradient(circle at top left, rgba(246, 185, 59, 0.42), transparent 32%),
    radial-gradient(circle at bottom right, rgba(242, 106, 33, 0.22), transparent 34%),
    radial-gradient(circle at top right, rgba(22, 124, 128, 0.12), transparent 30%) !important;
}

/* Main headings */
h1,
h2,
h3,
.navbar-brand {
  font-weight: 700;
}

/* Accent text */
.text-uppercase {
  color: var(--brasa-orange) !important;
  letter-spacing: 0.08em;
}

/* Buttons */
.btn-primary {
  --bs-btn-bg: var(--brasa-red);
  --bs-btn-border-color: var(--brasa-red);
  --bs-btn-hover-bg: var(--brasa-red-dark);
  --bs-btn-hover-border-color: var(--brasa-red-dark);
}

.btn-outline-secondary {
  --bs-btn-color: var(--brasa-teal);
  --bs-btn-border-color: var(--brasa-teal);
  --bs-btn-hover-bg: var(--brasa-teal);
  --bs-btn-hover-border-color: var(--brasa-teal);
  --bs-btn-hover-color: #ffffff;
}

.btn-outline-primary {
  --bs-btn-color: var(--brasa-teal);
  --bs-btn-border-color: var(--brasa-teal);
  --bs-btn-hover-bg: var(--brasa-teal);
  --bs-btn-hover-border-color: var(--brasa-teal);
  --bs-btn-hover-color: #ffffff;
}

/* Cards and panels */
.card,
.rounded-4 {
  border-radius: 1rem;
}

.card,
.p-4.border {
  border-color: rgba(184, 50, 36, 0.20) !important;
  background-color: rgba(255, 255, 255, 0.90);
}

.card {
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.card:hover {
  transform: translateY(-3px);
  box-shadow: 0 1rem 2rem rgba(45, 36, 32, 0.10) !important;
}

/* Borders */
.border,
.border-bottom,
.border-top {
  border-color: rgba(184, 50, 36, 0.18) !important;
}

/* Form fields */
.form-control {
  border-color: rgba(184, 50, 36, 0.22);
}

.form-control:focus {
  border-color: var(--brasa-orange);
  box-shadow: 0 0 0 0.25rem rgba(242, 106, 33, 0.2);
}

/* Carousel */
#foodCarousel {
  max-width: 1100px;
  margin: 0 auto;
  border: 6px solid rgba(255, 250, 242, 0.95);
  box-shadow: 0 1rem 2.5rem rgba(45, 36, 32, 0.18);
}

.carousel-food-img {
  width: 100%;
  height: 430px;
  object-fit: cover;
}

.carousel-caption {
  background: rgba(45, 36, 32, 0.72);
  border-radius: 1rem;
  padding: 1rem;
}

.carousel-caption h5 {
  color: #ffffff;
  font-weight: 700;
}

.carousel-caption p {
  color: var(--brasa-cream);
  margin-bottom: 0;
}

/* Footer */
footer {
  background-color: rgba(255, 250, 242, 0.96) !important;
}