:root{
  --forest:#304A39;
  --moss:#7F8E62;
  --sage:#B8C2B0;
  --ivory:#F5F2E9;
  --stone:#D5CEC3;
  --cream:#E9E3D6;
  --charcoal:#5F6266;
  --gold:#C6B47A;
  --gold-dark:#B09D64;
  --ink:#22231F;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:hidden}
body{
  background:var(--ivory);
  color:var(--ink);
  font-family:Georgia,serif;
  overflow-x:hidden;
}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}

.page{
  position:relative;
  min-height:100vh;
  background:var(--ivory);
}
.page-botanical-overlay{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  background:url("../img/menu background flowers.png") center/cover no-repeat;
  opacity:.13;
}

.container{width:min(1460px,92vw);margin:0 auto}

.botanical-img{
  position:absolute;
  pointer-events:none;
  z-index:1;
}
.floral-left{
  left:-30px;top:180px;
  width:320px;opacity:.55;
}
.floral-right{
  right:-20px;top:900px;
  width:160px;opacity:.5;
}

.header{
  height:96px;
  border-bottom:1px solid var(--stone);
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:relative;
  z-index:5;
}
.logo img{
  height:62px;
  width:auto;
  display:block;
}
.logo-mark{display:none}
.logo-text{display:none}
.nav{
  display:flex;
  align-items:center;
  gap:42px;
  font-weight:500;
  color:#242424;
}
.nav a{
  position:relative;
  padding:8px 0;
}
.nav a:after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:1px;
  background:var(--gold);
  transform:scaleX(0);
  transform-origin:left;
  transition:.35s;
}
.nav a:hover:after{transform:scaleX(1)}
.location{display:flex;gap:8px;color:var(--charcoal);font-weight:500}

.hero{
  position:relative;
  z-index:2;
  padding:38px 0 86px;
}

@keyframes heroFlowerFloat{
  0%,100%{transform:translateY(0) rotate(0deg)}
  50%{transform:translateY(-18px) rotate(2deg)}
}
section.hero::after {
  content: '';
  background: url(../img/hero-bg.png);
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  animation:heroFlowerFloat 8s ease-in-out infinite;
}

.hero-frame{
  min-height:760px;
  position:relative;
  border:1px solid var(--stone);
  background:
    linear-gradient(90deg, rgba(0,0,0,.48), rgba(0,0,0,.12), rgba(0,0,0,.35)),
    url("../img/hero.png") center/cover;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  overflow:hidden;
}
.hero-frame:before{
  content:"";
  position:absolute;
  inset:28px;
  border:1px solid rgba(245,242,233,.38);
}
.hero-kicker{
  color:var(--cream);
  text-transform:uppercase;
  letter-spacing:.25em;
  font-size:13px;
  margin-bottom:22px;
}
.hero h1{
  font-family:Georgia,serif;
  font-size:clamp(37px,4vw,72.5px);
  line-height:.9;
  font-weight:500;
  color:white;
  letter-spacing:-.055em;
  text-shadow:0 6px 24px rgba(0,0,0,.32);
}
.hero p{
  color:white;
  font-size:22px;
  line-height:1.55;
  max-width:820px;
  margin:28px auto 42px;
  font-weight:300;
}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:210px;
  height:66px;
  padding:0 34px;
  background:var(--gold);
  border:4px double rgba(255,255,255,.45);
  color:white;
  font-size:18px;
  transition:.25s ease;
  position:relative;
  z-index:10;
}
.btn:hover{background:var(--gold-dark);transform:translateY(-2px)}

.section{
  position:relative;
  z-index:2;
  padding:118px 0;
  border-top:1px solid var(--stone);
}
.section-heading{
  text-align:center;
  margin-bottom:66px;
}
.eyebrow{
  color:var(--gold-dark);
  text-transform:uppercase;
  letter-spacing:.22em;
  font-size:13px;
  margin-bottom:10px;
}
.section-title{
  font-family:Georgia,serif;
  font-size:clamp(54px,6vw,92px);
  font-weight:500;
  line-height:.95;
  letter-spacing:-.04em;
}
.story-grid{
  display:grid;
  grid-template-columns:.86fr 1.14fr;
  gap:72px;
  align-items:center;
}
.story-copy h2{
  font-family:Georgia,serif;
  font-size:clamp(58px,6vw,102px);
  line-height:.92;
  font-weight:500;
  margin-bottom:28px;
}
.story-copy p{
  font-size:18px;
  line-height:1.9;
  color:#343430;
  max-width:620px;
}
.signature{
  font-family:Georgia,serif;
  font-style:italic;
  font-size:54px;
  color:var(--forest);
  margin-top:34px;
}
.story-image{
  height:680px;
  border:1px solid var(--stone);
  background:url("../img/unsplash-bg-1.jpg") center/cover;
  position:relative;
}
.story-image:after{
  content:"";
  position:absolute;
  right:-22px;
  bottom:-22px;
  width:45%;
  height:42%;
  border:1px solid var(--gold);
  z-index:-1;
}

.menu-tabs{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:16px 24px;
  margin-bottom:70px;
  font-family:Georgia,serif;
  font-size:clamp(22px,4vw,44px);
}
.about-wrap{display:grid;grid-template-columns:1fr 1fr;gap:0;min-height:560px}
.about-img{background:url("../img/about-img.png") center/cover;min-height:480px}
.about-text{padding:72px 64px;display:flex;flex-direction:column;justify-content:center;background:#f9f6e9;}
.about-text h2{font-family:Georgia,serif;font-size:clamp(28px,3vw,48px);font-weight:500;margin-bottom:24px;color:var(--forest)}
.about-text p{font-size:16px;line-height:1.8;color:var(--charcoal);margin-bottom:16px}
.menu-tabs span{color:var(--gold-dark)}
.menu-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr 1fr;
  gap:54px;
  align-items:start;
}
.menu-item{
  position:relative;
}
.menu-item.large{margin-top:0}
.menu-item.offset{margin-top:145px}
.menu-photo{
  height:430px;
  border:1px solid var(--stone);
  object-fit:cover;
  width:100%;
  margin-bottom:28px;
}
.menu-item h3{
  font-family:Georgia,serif;
  font-size:44px;
  line-height:1;
  font-weight:500;
  letter-spacing:-.035em;
}
.menu-item p{
  font-size:18px;
  line-height:1.55;
  margin-top:12px;
  max-width:360px;
}
.price{
  color:var(--gold-dark);
  font-size:30px;
  margin-top:14px;
}
.menu-note{
  font-family:Georgia,serif;
  color:rgba(48,74,57,.18);
  font-size:126px;
  line-height:.85;
  position:absolute;
  right:8px;
  top:220px;
  writing-mode:vertical-rl;
}

.chefs-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:36px;
}
.chef-card{
  text-align:center;
}
.chef-photo{
  height:500px;
  width:100%;
  object-fit:cover;
  border:9px solid var(--cream);
  outline:1px solid var(--gold);
}
.chef-card h3{
  font-family:Georgia,serif;
  font-size:42px;
  font-weight:500;
  margin-top:24px;
}
.chef-card p{
  max-width:360px;
  margin:8px auto 0;
  line-height:1.7;
  color:#454545;
}

.reservation-wrap{
  display:grid;
  grid-template-columns:1fr 1.05fr;
  gap:66px;
  align-items:center;
}
.reservation-image{
  height:640px;
  background:url("../img/unsplash-bg-2.jpg") center/cover;
  border:1px solid var(--stone);
  overflow:hidden;
}
.reservation-video{width:100%;height:100%;object-fit:cover;display:block}
.booking{
  padding:56px;
  border:1px solid var(--stone);
  background:rgba(245,242,233,.74);
}
.booking h2{
  font-family:Georgia,serif;
  font-size:72px;
  line-height:.95;
  font-weight:500;
  margin-bottom:30px;
}
.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
input,select{
  width:100%;
  height:58px;
  background:transparent;
  border:1px solid var(--stone);
  padding:0 18px;
  color:#333;
  font-family:Georgia,serif;
}
.full{grid-column:1/-1}

.gallery-grid{
  display:grid;
  grid-template-columns:1.2fr .8fr .8fr;
  gap:20px;
}
.gallery-grid img{
  width:100%;
  height:430px;
  object-fit:cover;
  border:1px solid var(--stone);
}
.gallery-grid img:first-child{height:620px;grid-row:span 2}
.gallery-grid img:nth-child(4){grid-column:2/4;height:170px}

.footer{
  border-top:1px solid var(--stone);
  padding:60px 0;
}
.footer-inner{
  display:flex;
  justify-content:space-between;
  gap:40px;
  align-items:flex-end;
}
.footer .logo-text{font-size:58px}
.footer p{color:var(--charcoal);line-height:1.8}
.hours{
  text-align:right;
  line-height:1.8;
}

.hamburger{display:none}

@media(max-width:980px){
  .header{height:72px;padding:0;flex-direction:row}
  .logo img{height:48px}
  .location{display:none}

  .hamburger{
    display:flex;flex-direction:column;justify-content:space-between;
    width:28px;height:20px;background:none;border:none;cursor:pointer;padding:0;z-index:1001;
  }
  .hamburger span{
    display:block;height:2px;background:var(--ink);border-radius:2px;
    transition:transform .35s,opacity .35s;
  }
  .hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(9px) rotate(45deg)}
  .hamburger[aria-expanded="true"] span:nth-child(2){opacity:0}
  .hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-9px) rotate(-45deg)}

  .nav{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:32px;
    position:fixed;top:0;left:0;width:100vw;height:100vh;background:var(--ivory);z-index:1000;
    font-size:24px;font-weight:500;
    opacity:0;pointer-events:none;transition:opacity .35s;
  }
  .nav.open{opacity:1;pointer-events:all}
  .nav a:after{display:none}

  .botanical-img{display:none}
  .page-botanical-overlay{opacity:.07}

  .hero{padding:20px 0 48px}
  section.hero::after{
    background-image:url(../img/hero-bg-left.png),url(../img/hero-bg-right.png);
    background-size:auto 40%,auto 70%;
    background-position:left bottom,right bottom;
    background-repeat:no-repeat,no-repeat;
  }
  .hero-frame{min-height:480px;padding:32px 20px}
  .hero h1{letter-spacing:-.03em}
  .hero p{font-size:17px;margin:18px auto 28px}
  .btn{height:54px;font-size:16px;min-width:170px}

  .section{padding:64px 0}
  .about-wrap{grid-template-columns:1fr}
  .story-grid,.menu-grid,.chefs-grid,.reservation-wrap{grid-template-columns:1fr}
  .story-image{height:380px}
  .story-image:after{display:none}
  .story-copy h2{font-size:clamp(44px,10vw,72px)}

  .menu-item.offset{margin-top:0}
  .menu-photo{height:300px}
  .menu-note{display:none}

  .chef-photo{height:360px}

  .reservation-image{height:320px}
  .booking{padding:32px 24px}
  .booking h2{font-size:52px}
  .form-grid{grid-template-columns:1fr}
  .form-grid .full{grid-column:auto}

  .gallery-grid{grid-template-columns:1fr 1fr}
  .gallery-grid img{height:220px;grid-column:auto;grid-row:auto}
  .gallery-grid img:first-child{height:220px;grid-column:auto;grid-row:auto}
  .gallery-grid img:nth-child(4){height:220px;grid-column:auto;grid-row:auto}

  .footer-inner{flex-direction:column;text-align:center;align-items:center}
  .hours{text-align:center}
}

@media(max-width:520px){
  .hero-frame{min-height:420px;background-position:60% center}
  .hero-kicker{font-size:11px;letter-spacing:.18em}
  .hero p{font-size:15px}
  .section{padding:48px 0}
  .section-title{font-size:clamp(42px,12vw,72px)}
  .menu-tabs{margin-bottom:40px}
  .gallery-grid{grid-template-columns:1fr}
  .gallery-grid img{height:260px}
  .booking h2{font-size:42px}
}