*{
    box-sizing:border-box
}
html{
    scroll-behavior:smooth
}
body{
    margin:0;
    background:#f5f0e7;
    color:#292c25;
    font-family:DM Sans,sans-serif
}
a{
    color:inherit;
    text-decoration:none
}
img{
    display:block;
    max-width:100%;
    width:100%;
    object-fit:cover
}
button{
    font:inherit;
    cursor:pointer
}
.restaurant-demo{
    background:#244437;
    color:#f7e9d0;
    text-align:center;
    font-size:10px;
    letter-spacing:.17em;
    padding:8px;
    font-weight:800
}
.rest-head{
    height:105px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:0 5%;
    gap:30px;
    background:#f5f0e7;
    position:sticky;
    top:0;
    z-index:20;
    border-bottom:1px solid #ded7ca
}
.rest-logo{
    font:italic 600 35px Playfair Display,serif;
    color:#244437;
    line-height:1
}
.rest-logo small{
    display:block;
    font:700 9px DM Sans;
    letter-spacing:.24em;
    margin-top:9px;
    color:#8d5a45
}
.logo-ornament{
    color:#a34b34;
    font-size:22px;
    padding-right:8px
}
.rest-head nav{
    display:flex;
    gap:28px;
    font-size:13px;
    font-weight:600
}
.rest-head nav a:hover{
    color:#a34b34
}
.reservation{
    background:#244437;
    color:#fff;
    padding:16px 21px;
    font-size:13px
}
.reservation span{
    margin-left:22px
}
.rest-toggle{
    display:none;
    border:0;
    background:transparent;
    font-size:25px
}
.rest-hero{
    min-height:760px;
    display:grid;
    grid-template-columns:1fr 1fr;
    background:#244437;
    color:#f5f0e7
}
.rest-hero-copy{
    padding:95px 10% 80px 12%;
    display:flex;
    flex-direction:column;
    justify-content:center;
    position:relative
}
.rest-hero-copy:before{
    content:'✳';
    position:absolute;
    top:38px;
    right:50px;
    font-size:70px;
    color:#b5a181;
    opacity:.55
}
.rest-eyebrow{
    font-size:11px;
    letter-spacing:.3em;
    font-weight:800;
    color:#b88764
}
.rest-hero h1{
    font:400 clamp(75px,8vw,145px)/.94 Playfair Display,serif;
    letter-spacing:-.065em;
    margin:35px 0
}
.rest-hero h1 em{
    color:#d9b18e
}
.rest-hero-copy>p:not(.rest-eyebrow){
    font-size:17px;
    line-height:1.9;
    max-width:440px;
    color:#e5e0d4
}
.rest-button{
    display:inline-flex;
    align-items:center;
    gap:40px;
    width:max-content;
    border-bottom:1px solid #c7a886;
    padding:16px 0;
    color:#f2d1aa;
    font-size:12px;
    font-weight:800;
    letter-spacing:.16em;
    margin-top:30px
}
.rest-hero-image{
    position:relative;
    min-height:680px;
    overflow:hidden
}
.rest-hero-image img{
    height:100%;
    position:absolute;
    inset:0
}
.hero-seal{
    position:absolute;
    bottom:40px;
    left:-85px;
    width:170px;
    height:170px;
    background:#a34b34;
    border-radius:50%;
    display:grid;
    place-items:center;
    text-align:center;
    transform:rotate(-15deg);
    font:italic 22px Playfair Display;
    color:#fff;
    line-height:1.3
}
.rest-marquee{
    text-align:center;
    padding:35px 20px;
    border-bottom:1px solid #d8cfc0;
    font:italic 26px Playfair Display;
    color:#9a6b52
}
.rest-section{
    padding:120px 8%
}
.rest-section .center{
    text-align:center
}
.rest-section h2,.rest-feature h2,.rest-page h1{
    font:400 clamp(55px,6vw,100px)/1.1 Playfair Display,serif;
    letter-spacing:-.06em;
    margin:20px 0 30px
}
.rest-section h2 em,.rest-feature h2 em{
    color:#a34b34
}
.rest-intro{
    text-align:center;
    max-width:750px;
    margin:0 auto 65px
}
.rest-intro>p:last-child{
    color:#77746c;
    line-height:1.9
}
.dish-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:25px
}
.dish-card{
    background:#fffaf2;
    padding:12px 12px 26px;
    border:1px solid #e4d9c9
}
.dish-card img{
    height:300px
}
.dish-card h3{
    font:italic 31px Playfair Display;
    margin:22px 12px 8px
}
.dish-card p{
    color:#77746c;
    line-height:1.7;
    font-size:13px;
    margin:0 12px
}
.dish-card .dish-type{
    color:#a34b34;
    font-weight:800;
    font-size:10px;
    letter-spacing:.2em;
    margin:16px 12px 0
}
.rest-feature{
    display:grid;
    grid-template-columns:1fr 1fr;
    background:#e7dfd0;
    min-height:650px
}
.rest-feature img{
    height:100%;
    min-height:550px
}
.rest-feature>div{
    padding:100px 12%;
    align-self:center
}
.rest-feature p:not(.rest-eyebrow){
    color:#6c675e;
    line-height:1.9
}
.rest-feature a{
    display:inline-block;
    margin-top:25px;
    border-bottom:1px solid #a34b34;
    padding:12px 0;
    color:#a34b34;
    font-weight:800;
    letter-spacing:.1em;
    font-size:12px
}
.rest-quote{
    text-align:center;
    background:#a34b34;
    color:#fff6e9;
    padding:100px 20px
}
.rest-quote h2{
    font:italic 400 clamp(40px,5vw,75px) Playfair Display;
    max-width:1000px;
    margin:0 auto 35px
}
.rest-quote a{
    border:1px solid #fff;
    padding:17px 26px;
    font-size:12px;
    letter-spacing:.12em
}
.rest-foot{
    background:#244437;
    color:#fff6e9;
    display:grid;
    grid-template-columns:2fr 1fr 1.5fr;
    gap:50px;
    padding:75px 8%
}
.rest-foot .rest-logo{
    color:#fff6e9
}
.rest-foot p{
    color:#c7d0c5;
    line-height:1.8;
    font-size:13px
}
.rest-foot b{
    font-size:11px;
    letter-spacing:.16em
}
.rest-foot a{
    display:block;
    margin-top:16px;
    font-size:13px
}
.rest-page{
    background:#244437;
    color:#f5f0e7;
    text-align:center;
    padding:95px 20px 110px
}
.rest-page h1{
    font-size:clamp(60px,8vw,110px);
    margin:24px 0
}
.rest-page>p:last-child{
    max-width:550px;
    margin:auto;
    line-height:1.8;
    color:#d7dfd4
}
.rest-gallery{
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    gap:18px
}
.rest-gallery img{
    height:370px
}
.rest-gallery img:nth-child(2){
    margin-top:65px
}
.rest-gallery img:nth-child(3){
    margin-top:130px
}
.menu-controls{
    display:flex;
    gap:10px;
    justify-content:center;
    flex-wrap:wrap;
    margin-bottom:45px
}
.menu-controls button{
    background:transparent;
    border:1px solid #cbbcac;
    padding:13px 24px;
    color:#244437
}
.menu-controls button.active,.menu-controls button:hover{
    background:#244437;
    color:#fff
}
.menu-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:25px
}
.menu-item{
    padding:28px;
    border-bottom:1px solid #cdbfaf;
    display:flex;
    gap:22px;
    align-items:center
}
.menu-item img{
    width:130px;
    height:110px;
    flex:none
}
.menu-item h3{
    font:italic 28px Playfair Display;
    margin:0 0 10px
}
.menu-item p{
    color:#77746c;
    line-height:1.7;
    font-size:13px;
    margin:0
}
.rest-note{
    background:#e6dccb;
    padding:20px;
    margin-top:35px;
    text-align:center;
    font-size:13px
}
.rest-contact{
    max-width:800px;
    margin:auto;
    text-align:center
}
.rest-contact p{
    color:#6c675e;
    line-height:1.9
}
.rest-contact a{
    display:inline-block;
    margin-top:30px;
    background:#244437;
    color:#fff;
    padding:18px 28px
}
.rest-toggle{
    display:none
}
@media(max-width:1050px){
    .rest-head nav{
        display:none;
        position:absolute;
        top:105px;
        left:0;
        right:0;
        background:#f5f0e7;
        padding:25px;
        flex-direction:column
    }
    .rest-head nav.open{
        display:flex
    }
    .rest-toggle{
        display:block
    }
    .rest-head .reservation{
        display:none
    }
    .rest-hero{
        grid-template-columns:1fr
    }
    .rest-hero-image{
        min-height:500px
    }
    .hero-seal{
        left:auto;
        right:25px
    }
    .rest-feature{
        grid-template-columns:1fr
    }
    .rest-feature img{
        max-height:500px
    }
    .dish-grid{
        grid-template-columns:1fr 1fr
    }
}
@media(max-width:650px){
    .rest-head{
        height:85px
    }
    .rest-head nav{
        top:85px
    }
    .rest-logo{
        font-size:27px
    }
    .rest-hero-copy{
        padding:80px 7%
    }
    .rest-hero h1{
        font-size:78px
    }
    .rest-hero-image{
        min-height:380px
    }
    .rest-section{
        padding:75px 6%
    }
    .dish-grid,.menu-grid,.rest-gallery,.rest-foot{
        grid-template-columns:1fr
    }
    .rest-gallery img,.rest-gallery img:nth-child(2),.rest-gallery img:nth-child(3){
        margin:0;
        height:310px
    }
    .menu-item{
        padding:20px 0
    }
    .menu-item img{
        width:95px;
        height:95px
    }
    .rest-foot{
        gap:30px
    }
    .rest-feature>div{
        padding:70px 8%
    }
}
@media(prefers-reduced-motion:reduce){
    html{
        scroll-behavior:auto
    }
}
