:root{
  --soil:#111D31; --stone:#F4F0E8; --clay:#C6A15B; --olive:#B8AEA2; --brass:#AD8A4C; --ivory:#F5F1E8;
  --soil-70: rgba(17,29,49,.7); --line: rgba(17,29,49,.12); --line-light: rgba(245,241,232,.18);
  --maxw: 1240px; --radius: 14px;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{ font-family:'Work Sans', sans-serif; background:var(--stone); color:var(--soil); line-height:1.6; }
h1,h2,h3{ font-family:'Fraunces', serif; }
a{ color:inherit; text-decoration:none; }
.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 32px; }

.menu-hero{
  position:relative; min-height:56vh; display:flex; align-items:center;
  background-size:cover; background-position:center;
}
.menu-hero.menu-hero-small{ min-height:38vh; }
.menu-hero.menu-hero-center .wrap{ display:flex; justify-content:center; text-align:center; }
.menu-hero.menu-hero-center .menu-hero-content{ max-width:560px; }
.menu-hero.menu-hero-center .menu-hero-cta{ margin-top:26px; }
.menu-hero-overlay{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(17,29,49,.55), rgba(17,29,49,.85));
}
.menu-hero-content{ position:relative; z-index:1; max-width:640px; }
.menu-hero-content .eyebrow{ color:var(--brass); text-transform:uppercase; letter-spacing:.15em; font-size:.78rem; font-weight:600; margin-bottom:14px; }
.menu-hero-content h1{ font-size:clamp(2.2rem, 5vw, 3.4rem); color:var(--ivory); margin-bottom:18px; }
.menu-hero-content h1 em{ font-style:italic; color:var(--brass); }
.menu-hero-content p{ color:rgba(245,241,232,.85); font-size:1.05rem; max-width:52ch; }
.menu-hero-divider{ width:64px; height:2px; background:var(--brass); margin:20px 0; }
.menu-hero-cta{
  display:inline-flex; align-items:center; gap:10px; margin-top:28px;
  background:var(--brass); color:var(--soil); font-family:'Work Sans', sans-serif; font-weight:600;
  font-size:.84rem; letter-spacing:.03em; text-transform:uppercase;
  padding:14px 28px; border-radius:999px; transition:.2s;
}
.menu-hero-cta:hover{ background:var(--clay); }
.menu-hero-cta svg{ width:16px; height:16px; }
@media (max-width:640px){ .menu-hero{ min-height:42vh; padding:70px 0; } }

.menu-category{ padding:56px 0 80px; }
.menu-category h2{ font-size:1.7rem; margin-bottom:8px; }
.menu-category .eyebrow{ color:var(--brass); text-transform:uppercase; letter-spacing:.15em; font-size:.74rem; font-weight:600; margin-bottom:10px; }
.menu-category-intro{ color:var(--soil-70); margin-bottom:36px; max-width:60ch; }

.dish-ingredients{ font-size:.86rem; color:var(--soil-70); }
.no-dishes{ text-align:center; padding:20px 0 0; color:var(--soil-70); }

/* ---------- page sub-nav (pill tabs under the header, anchors to sections on the same page) ---------- */
.section-nav{ background:var(--ivory); border-bottom:1px solid var(--line); }
.section-nav-inner{ display:flex; justify-content:center; gap:10px; flex-wrap:wrap; padding:16px 32px; }
.section-nav-inner a{
  padding:9px 22px; font-size:.8rem; text-transform:uppercase; letter-spacing:.05em;
  font-family:'Work Sans'; font-weight:500; color:var(--soil); background:var(--stone);
  border:1px solid var(--line); border-radius:999px; transition:.2s;
}
.section-nav-inner a:hover{ border-color:var(--clay); background:var(--ivory); }
.section-nav-inner.subcat-tabs{ margin-bottom:0; }

/* ---------- simple content section (about / kids blocks on reserve.php) ---------- */
.info-section{ padding:70px 0; max-width:70ch; }
.info-section + .info-section{ border-top:1px solid var(--line); }
.info-section .eyebrow{ color:var(--brass); text-transform:uppercase; letter-spacing:.15em; font-size:.74rem; font-weight:600; margin-bottom:10px; }
.info-section h2{ font-size:1.7rem; margin-bottom:16px; }
.info-section p{ color:var(--soil-70); margin-bottom:24px; }

/* ---------- menu: sub-category filter tabs (dinner only) + shared dish-card grid ---------- */
.subcat-tabs{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:36px; }
.subcat-tabs button{
  padding:9px 20px; font-size:.8rem; text-transform:uppercase; letter-spacing:.05em;
  font-family:'Work Sans'; font-weight:500; color:var(--soil); background:var(--ivory);
  border:1px solid var(--line); border-radius:999px; cursor:pointer; transition:.2s;
}
.subcat-tabs button:hover{ border-color:var(--clay); }
.subcat-tabs button.active{ background:var(--soil); color:var(--ivory); border-color:var(--soil); }
.dish-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:40px 28px; }
.dish-card{ text-align:center; }
.dish-media{
  width:100%; aspect-ratio:1/1; border-radius:50%; overflow:hidden; margin:0 auto 20px;
  background:var(--stone);
}
.dish-media img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.dish-card:hover .dish-media img{ transform:scale(1.06); }
.dish-media.no-photo{
  display:flex; align-items:center; justify-content:center; color:var(--olive);
  font-family:'Fraunces', serif; font-size:2.1rem; font-style:italic;
}
.dish-card-body{ padding:0; }
.dish-card-body h3{ font-size:1.06rem; margin-bottom:8px; }
.dish-card-footer{
  display:flex; justify-content:center; gap:16px; margin-top:14px; padding-top:12px; border-top:1px solid var(--line);
}
.dish-card-footer > div{ flex:none; }
.dish-card-footer > div + div{ border-left:1px solid var(--line); padding-left:16px; }
.dish-card-footer .dish-price{ font-family:'Fraunces', serif; font-size:1.05rem; color:var(--brass); }
.dish-card-footer .dish-weight{ font-size:.8rem; color:var(--olive); align-self:center; }
@media (max-width:1000px){ .dish-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:700px){ .dish-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:460px){ .dish-grid{ grid-template-columns:1fr; } }

/* ---------- landing page: teaser cards linking out to each menu page ---------- */
.menu-teasers{ padding:70px 0 90px; display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.menu-teaser{
  display:block; background:var(--ivory); border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; transition:transform .3s ease, box-shadow .3s ease;
}
.menu-teaser:hover{ transform:translateY(-4px); box-shadow:0 16px 32px rgba(17,29,49,.12); }
.menu-teaser-media{ height:200px; background:var(--stone) center/cover no-repeat; }
.menu-teaser-body{ padding:24px 26px 28px; }
.menu-teaser-body .eyebrow{ color:var(--brass); text-transform:uppercase; letter-spacing:.15em; font-size:.72rem; font-weight:600; margin-bottom:8px; }
.menu-teaser-body h3{ font-size:1.3rem; margin-bottom:10px; }
.menu-teaser-cta{
  display:inline-flex; align-items:center; gap:6px; margin-top:4px; color:var(--brass);
  font-size:.82rem; font-weight:600; text-transform:uppercase; letter-spacing:.04em;
}

/* ---------- landing page: split promo banner (edge-to-edge color block + photo) ---------- */
.split-banner{ display:grid; grid-template-columns:1fr 1fr; min-height:420px; }
.split-banner-text{
  background:var(--soil); color:var(--ivory); display:flex; flex-direction:column;
  justify-content:center; padding:60px 64px;
}
.split-banner-text .eyebrow{ color:var(--brass); text-transform:uppercase; letter-spacing:.15em; font-size:.74rem; font-weight:600; margin-bottom:12px; }
.split-banner-text h2{ font-size:2rem; color:var(--ivory); margin-bottom:16px; }
.split-banner-text p{ color:rgba(245,241,232,.75); margin-bottom:30px; max-width:42ch; }
.split-banner-ctas{ display:flex; gap:14px; flex-wrap:wrap; }
.split-banner-ctas a{
  padding:13px 26px; border-radius:999px; border:1px solid var(--line-light); color:var(--ivory);
  font-size:.8rem; text-transform:uppercase; letter-spacing:.04em; font-weight:600; transition:.2s;
}
.split-banner-ctas a:hover{ background:var(--ivory); color:var(--soil); border-color:var(--ivory); }
.split-banner-photo{ background-size:cover; background-position:center; min-height:300px; }
@media (max-width:800px){
  .split-banner{ grid-template-columns:1fr; }
  .split-banner-text{ padding:50px 32px; }
}

/* ---------- landing page: welcome/about section with overlapping location card ---------- */
.welcome-section{ padding:90px 0 130px; }
.welcome-grid{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.welcome-photo{ position:relative; border-radius:var(--radius); }
.welcome-photo img{ width:100%; height:100%; object-fit:cover; display:block; border-radius:var(--radius); }
.welcome-text .eyebrow{ color:var(--brass); text-transform:uppercase; letter-spacing:.15em; font-size:.74rem; font-weight:600; margin-bottom:12px; }
.welcome-text h2{ font-size:1.9rem; margin-bottom:16px; }
.welcome-text p{ color:var(--soil-70); margin-bottom:26px; max-width:52ch; }
.location-card{
  position:absolute; left:24px; right:24px; bottom:-44px; background:var(--ivory);
  border-radius:var(--radius); box-shadow:0 20px 40px rgba(17,29,49,.18); padding:24px 26px;
}
.location-card h4{ font-size:.76rem; text-transform:uppercase; letter-spacing:.12em; color:var(--brass); font-weight:600; margin-bottom:14px; font-family:'Work Sans'; }
.location-card ul{ list-style:none; }
.location-card li{ display:flex; align-items:center; gap:10px; font-size:.88rem; color:var(--soil); margin-bottom:8px; }
.location-card li:last-child{ margin-bottom:0; }
.location-card svg{ width:15px; height:15px; color:var(--brass); flex-shrink:0; }
@media (max-width:800px){
  .welcome-grid{ grid-template-columns:1fr; }
  .location-card{ position:static; margin-top:20px; box-shadow:0 8px 24px rgba(17,29,49,.1); }
  .welcome-section{ padding-bottom:90px; }
}
@media (max-width:900px){ .menu-teasers{ grid-template-columns:1fr; } }

/* ---------- reservation form (table booking) ---------- */
.reserve-section{ padding:70px 0 90px; }
.reserve-form{ max-width:760px; margin:36px auto 0; }
.reserve-form .form-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-bottom:20px; }
.reserve-form label{ display:flex; flex-direction:column; gap:8px; font-size:.82rem; font-weight:500; color:var(--soil-70); }
.reserve-form label.full-width{ margin-bottom:20px; }
.reserve-form input, .reserve-form textarea{
  font-family:'Work Sans', sans-serif; font-size:.95rem; color:var(--soil);
  padding:11px 14px; border:1px solid var(--line); border-radius:8px; background:var(--ivory);
}
.reserve-form input:focus, .reserve-form textarea:focus{ outline:none; border-color:var(--clay); }
.reserve-form textarea{ resize:vertical; font-family:inherit; }
.reserve-newsletter{ display:flex; align-items:center; gap:10px; margin-bottom:22px; font-size:.85rem; color:var(--soil-70); }
.reserve-newsletter input{ width:auto; }
.reserve-newsletter label{ display:inline; font-weight:400; }
.reserve-submit{
  display:inline-flex; align-items:center; gap:10px; background:var(--brass); color:var(--soil);
  font-family:'Work Sans', sans-serif; font-weight:600; font-size:.86rem; letter-spacing:.03em;
  text-transform:uppercase; padding:15px 32px; border-radius:999px; border:none; cursor:pointer; transition:.2s;
}
.reserve-submit:hover{ background:var(--clay); }
@media (max-width:700px){ .reserve-form .form-grid{ grid-template-columns:1fr; } }

/* ---------- utility bar (thin accent strip above the nav, mirrors Oazis's top bar) ---------- */
.utility-bar{ background:var(--clay); }
.utility-bar-inner{
  max-width:var(--maxw); margin:0 auto; padding:9px 32px;
  display:flex; justify-content:space-between; align-items:center;
}
.utility-bar a{ color:var(--soil); font-size:.82rem; font-weight:600; letter-spacing:.02em; }
.utility-bar a:hover{ opacity:.75; }
.utility-bar-social{ display:flex; gap:14px; }
.utility-bar-social a{ display:flex; align-items:center; }
.utility-bar-social svg{ width:16px; height:16px; }

/* ---------- header (this page's own simplified nav, not the hotel booking header) ---------- */
header.simple-header{
  position:relative; z-index:100;
  background: rgba(17,29,49,.94);
  backdrop-filter: blur(6px);
  box-shadow: 0 1px 0 var(--line-light);
}
.simple-header-inner{
  max-width:var(--maxw); margin:0 auto; padding:18px 32px;
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:20px;
}
.simple-header-nav{ display:flex; gap:22px; align-items:center; }
.simple-header-nav a{
  color:var(--ivory); font-size:.8rem; text-transform:uppercase; letter-spacing:.04em;
  font-weight:500; opacity:.85; transition:.2s;
}
.simple-header-nav a:hover, .simple-header-nav a.active{ opacity:1; color:var(--brass); }
.simple-header-logo{ display:flex; flex-direction:column; align-items:center; justify-self:center; }
.simple-header-logo img{ height:66px; width:auto; display:block; }
.simple-header-logo .tagline{
  margin-top:4px; color:var(--brass); font-size:.68rem; text-transform:uppercase;
  letter-spacing:.22em; font-weight:600;
}
.simple-header-right{ display:flex; align-items:center; justify-content:flex-end; gap:18px; }
@media (max-width:640px){
  .simple-header-inner{ grid-template-columns:1fr; justify-items:center; }
  .simple-header-right{ justify-content:center; }
}
.lang-compact{ position:relative; }
.lang-compact-toggle{
  background:none; border:1px solid var(--line-light); border-radius:6px; padding:6px 10px;
  font-size:1.1rem; cursor:pointer; line-height:1; display:flex; align-items:center;
}
.lang-compact-toggle:hover{ background:rgba(245,241,232,.08); }
.lang-compact-menu{
  display:none; position:absolute; top:calc(100% + 8px); right:0; background:var(--soil);
  border:1px solid var(--line-light); border-radius:8px; padding:8px; flex-direction:column; gap:6px; z-index:60;
  min-width:44px;
}
.lang-compact-menu.open{ display:flex; }
.lang-compact-menu a{ font-size:1.15rem; padding:6px; text-align:center; border-radius:4px; opacity:.7; transition:.2s; }
.lang-compact-menu a:hover, .lang-compact-menu a.active{ opacity:1; background:rgba(245,241,232,.08); }

/* ---------- footer (centered single-column layout, mirrors Oazis's footer anatomy) ---------- */
footer{background:var(--soil); color:var(--ivory); padding-top:70px;}
.footer-center{
  max-width:640px; margin:0 auto; padding:0 32px 50px; text-align:center;
  border-bottom:1px solid var(--line-light);
}
.footer-center .logo{display:inline-block; margin-bottom:26px;}
.footer-center .logo img{height:60px; width:auto; max-width:none;}
.footer-divider{width:64px; height:2px; background:var(--brass); margin:0 auto 26px;}
.footer-center h4{font-size:.76rem; text-transform:uppercase; letter-spacing:.12em; color:var(--brass); font-weight:600; margin-bottom:10px; font-family:'Work Sans';}
.footer-address{color:rgba(245,241,232,.7); font-size:.92rem; font-weight:300; margin-bottom:26px;}
.footer-info-table{display:flex; justify-content:center; gap:40px; flex-wrap:wrap;}
.footer-info-table div{font-size:.88rem;}
.footer-info-table span:first-child{color:var(--brass); font-weight:600; margin-right:8px;}
.footer-info-table a, .footer-info-table span:last-child{color:rgba(245,241,232,.85); font-weight:300;}
.footer-info-table a:hover{color:var(--brass);}
.footer-bottom{
  max-width:var(--maxw); margin:0 auto; padding:26px 32px 30px;
  text-align:center; font-size:.78rem; color:rgba(245,241,232,.45);
}
.footer-credit{color:var(--ivory); opacity:.7; text-decoration:none;}
.footer-credit:hover{opacity:1;}
