body { font-family: Arial, sans-serif; margin:0; background:#fff7f0; color:#3b2b18; }
.site-header { background:#8b4513; color:white; padding:12px; display:flex; justify-content:space-between; align-items:center; }
.site-header a { color:white; margin-left:10px; text-decoration:none; font-weight:bold; }
.container { padding:20px; max-width:1000px; margin:0 auto; }
.hero { text-align:center; padding:30px; background:#ffdfb5; border-radius:8px; }
.menu-grid { display:grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap:16px; margin-top:16px; }
.menu-item { background:white; padding:12px; border-radius:8px; box-shadow:0 1px 4px rgba(0,0,0,0.08); }
.btn { display:inline-block; background:#8b4513; color:white; padding:10px 14px; border-radius:6px; text-decoration:none; }
.cart-table { width:100%; border-collapse:collapse; }
.cart-table th, .cart-table td { padding:8px; border-bottom:1px solid #eee; text-align:left; }
.total { font-weight:bold; font-size:1.1rem; margin-top:12px; }
footer { text-align:center; padding:12px; margin-top:30px; color:#fff; background:#8b4513; }
.logo-area { display: flex; align-items: center; gap: 12px; }
.logo-img {   height: 100px;   width: auto; }
.logo-text h1 {   margin: 0;  font-size: 1.4rem;}
.logo-text p {  margin: 0;  font-size: 0.8rem;  opacity: 0.9;}
.site-header {  background: #f5b181;  color: rgb(72, 20, 20);  padding: 12px 20px;}
.header-container {  max-width: 1200px;  margin: 0 auto;  display: flex;  justify-content: space-between; gap: 200px; align-items: center; }
.logo-area {  display: flex;  align-items: center;  gap: 12px;}
.logo-img {  height: 100px;  width: auto;}
.logo-text h1 {  margin: 0;  font-size: 1.5rem;}
.logo-text p {  margin: 0;  font-size: 0.8rem;  opacity: 0.9;}
.main-nav {  display: flex;  align-items: center;  gap: 2px;}
.main-nav a {  color: rgb(72, 20, 20);  text-decoration: none;  font-weight: bold;  font-size: 0.95rem; padding: 5px 12px; border-radius: 6px; border: 1px solid rgb(72, 20, 20); background-color: #e0a072;}
.main-nav a:hover {  text-decoration:none; background-color: #fad7bd; }
.lang-btn {  border: 1px solid rgb(72, 20, 20);  padding: 4px 8px;  border-radius: 6px;  font-size: 0.8rem;}
.hero {
  background: 
    linear-gradient(rgba(0,0,0,0.55), rgba(0,0,0,0.55)),
    url("/static/img/hero-bg.png.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  min-height: 85vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 60px 20px;
  color: white;
}

.hero-content {
  max-width: 900px;
}

.hero h2 {
  font-size: 3rem;
  margin-bottom: 20px;
}

.hero p {
  font-size: 1.2rem;
  margin-bottom: 30px;
}

.hero-btn {
  background: #ffb703;
  color: #583101;
  padding: 14px 28px;
  border-radius: 30px;
  text-decoration: none;
  font-weight: bold;
  font-size: 1rem;
}

.hero-btn:hover {
  background: #ffd166;
}