:root { --ink:#171514; --paper:#f7f3ec; --timber:#b68866; --wine:#5b2726; --leaf:#44302a; --aqua:#d5a08a; --line:rgba(23,21,20,.17); --display:"Cormorant Garamond", Georgia, serif; --sans:"DM Sans", Arial, sans-serif; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; scroll-padding-top:5rem; } body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:16px; line-height:1.55; } img { display:block; width:100%; } a { color:inherit; text-decoration:none; } .section-shell { width:min(1180px, calc(100% - 3rem)); margin-inline:auto; } .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }.skip-link { position:fixed; left:1rem; top:-4rem; z-index:100; background:var(--ink); color:white; padding:.75rem 1rem; }.skip-link:focus { top:1rem; }
.site-header { min-height:5.35rem; display:flex; align-items:center; justify-content:space-between; padding:0 max(1.5rem, calc((100vw - 1180px)/2)); position:absolute; top:0; left:0; right:0; z-index:10; color:var(--ink); transition:.25s ease; }.site-header.is-scrolled { position:fixed; background:rgba(23,21,20,.96); color:white; box-shadow:0 1px 0 rgba(255,255,255,.12); }.brand { display:flex; align-items:center; justify-content:center; width:4.25rem; height:4.25rem; }.brand-logo { width:4.25rem; height:4.25rem; object-fit:contain; border-radius:50%; }.footer-brand, .footer-brand .brand-logo { width:4.8rem; height:4.8rem; }.primary-nav { display:flex; align-items:center; gap:1.75rem; font-size:.82rem; font-weight:600; }.primary-nav > a:not(.button) { opacity:.85; position:relative; }.primary-nav > a:not(.button):after { content:""; position:absolute; height:1px; left:0; right:0; bottom:-.42rem; background:var(--aqua); transform:scaleX(0); transform-origin:left; transition:.2s; }.primary-nav > a:not(.button):hover:after { transform:scaleX(1); }.nav-toggle { display:none; border:0; background:transparent; width:2.8rem; padding:.55rem; }.nav-toggle span:not(.sr-only) { display:block; height:1px; margin:.3rem 0; background:currentColor; }.nav-toggle.is-open { color:white; }.button { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.9rem 1.25rem; background:var(--ink); color:white; border:1px solid var(--ink); text-transform:uppercase; letter-spacing:.08em; font-size:.72rem; font-weight:700; transition:.2s ease; }.button:hover { transform:translateY(-2px); background:var(--wine); border-color:var(--wine); }.button-small { padding:.65rem .9rem; font-size:.66rem; }.text-link { border-bottom:1px solid currentColor; padding-bottom:.18rem; font-size:.82rem; font-weight:600; }.text-link span { display:inline-block; transition:transform .2s; }.text-link:hover span { transform:translate(.2rem,-.16rem); }.eyebrow, .menu-label, .detail-label { margin:0 0:.8rem; font-size:.68rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }.eyebrow { color:var(--wine); }
.hero { background:#eee7de; min-height:min(760px, 100vh); color:var(--ink); position:relative; display:grid; grid-template-columns:1fr 1fr; overflow:hidden; }.hero-image-wrap { min-height:650px; grid-column:2; }.hero-image { height:100%; object-fit:cover; filter:saturate(.76) brightness(.94); }.hero-image-wrap:after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, #f1ebe3 0%, rgba(241,235,227,.88) 34%, rgba(241,235,227,.12) 76%); pointer-events:none; }.hero-copy { align-self:center; grid-column:1; grid-row:1; padding:10rem max(1.5rem, calc((100vw - 1180px)/2)) 5rem; position:relative; z-index:1; }.hero .eyebrow { color:var(--leaf); }.hero h1, h2 { font-family:var(--display); font-weight:600; letter-spacing:-.045em; line-height:.9; }.hero h1 { max-width:610px; margin:0; font-size:clamp(4.5rem, 8.4vw, 8rem); }.hero h1 em, h2 em { color:var(--wine); font-weight:500; }.hero-text { max-width:410px; margin:2rem 0 2.1rem; color:rgba(23,21,20,.76); font-size:1.05rem; }.action-row { display:flex; align-items:center; flex-wrap:wrap; gap:1.4rem; }.hero .text-link { color:var(--ink); }.hero-note { position:absolute; right:2rem; bottom:2rem; z-index:1; font-size:.67rem; letter-spacing:.08em; text-transform:uppercase; writing-mode:vertical-rl; transform:rotate(180deg); color:rgba(23,21,20,.68); }.dot { display:inline-block; width:.45rem; height:.45rem; border-radius:50%; background:var(--wine); margin:.6rem auto; }
.intro-section { padding:9rem 0; }.intro-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:5rem; align-items:end; }.intro-grid h2, .section-heading h2, .about-copy h2, .visit-section h2, .booking-section h2 { font-size:clamp(3rem,5.4vw,5.8rem); margin:0; }.intro-grid p { max-width:390px; margin:0 0 .6rem; font-size:1.05rem; }.menu-section { background:#e8e2d7; padding:7.5rem 0; }.section-heading { display:flex; justify-content:space-between; align-items:end; gap:2rem; padding-bottom:2.8rem; }.section-heading h2 { margin:0; }.section-heading > p { max-width:360px; margin:0; font-size:.92rem; }.menu-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; }.menu-card { background:var(--paper); padding:2.25rem; }.menu-card-dark { background:var(--ink); color:white; }.menu-card-dark .menu-label { color:var(--aqua); }.menu-list { display:flex; flex-direction:column; }.menu-item { display:grid; grid-template-columns:1fr auto; gap:1.3rem; padding:1.3rem 0; border-top:1px solid var(--line); }.menu-item h3 { margin:0 0 .25rem; font:600 1.1rem/1.1 var(--display); letter-spacing:-.01em; }.menu-item p { margin:0; font-size:.78rem; line-height:1.45; max-width:330px; }.menu-item b { font-size:.76rem; white-space:nowrap; }.dietary { display:inline-flex; align-items:center; justify-content:center; width:1.1rem; height:1.1rem; border:1px solid currentColor; border-radius:50%; font:600 .52rem/1 var(--sans); vertical-align:middle; }.menu-footer { display:flex; justify-content:space-between; align-items:center; gap:1.5rem; padding-top:1.7rem; font-size:.78rem; }.menu-footer p { margin:0; color:rgba(16,17,19,.68); }.about-section { display:grid; grid-template-columns:1fr 1fr; gap:clamp(3rem,8vw,8rem); align-items:center; padding:8rem 0; }.about-photo { position:relative; }.about-photo:after { content:""; position:absolute; width:43%; height:43%; background:var(--wine); z-index:-1; right:-1.1rem; bottom:-1.1rem; }.about-photo img { aspect-ratio:4/5; object-fit:cover; }.about-copy p:not(.eyebrow) { max-width:420px; font-size:1.02rem; }.about-copy .text-link { display:inline-block; margin-top:1rem; }.gallery-section { padding:2rem 0 8rem; overflow:hidden; }.gallery-heading { padding-bottom:2.5rem; }.gallery-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:1rem; width:min(1380px, calc(100% - 3rem)); margin:auto; }.gallery-grid figure { margin:0; overflow:hidden; }.gallery-grid img { height:100%; min-height:320px; object-fit:cover; transition:transform .55s ease; }.gallery-grid figure:hover img { transform:scale(1.04); }.gallery-large { grid-row:span 2; }.gallery-large img { min-height:655px; }.visit-section { background:var(--leaf); color:white; padding:7.5rem 0; }.visit-section .eyebrow { color:var(--aqua); }.visit-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; }.directions-link { display:inline-block; margin-top:2rem; color:var(--aqua); font-size:.8rem; font-weight:700; border-bottom:1px solid var(--aqua); padding-bottom:.2rem; }.visit-details { display:grid; grid-template-columns:1fr 1fr; gap:2rem; padding-top:1rem; }.detail-label { color:var(--aqua); }.visit-details address { font-style:normal; font-size:1rem; line-height:1.65; }.hours { margin:0; font-size:.83rem; }.hours div { display:flex; justify-content:space-between; gap:1rem; padding:.42rem 0; border-bottom:1px solid rgba(255,255,255,.16); }.hours dd { margin:0; }.verify { display:block; margin-top:.3rem; color:rgba(255,255,255,.55); letter-spacing:.05em; font-size:.55rem; }.booking-section { background:var(--ink); color:white; padding:7.5rem 0; }.booking-section .eyebrow { color:var(--timber); }.booking-wrap { display:grid; grid-template-columns:1.2fr .8fr; gap:5rem; }.booking-wrap > div > p:not(.eyebrow) { max-width:460px; color:rgba(255,255,255,.72); }.booking-actions { align-self:end; display:flex; flex-direction:column; align-items:stretch; gap:.8rem; }.button-light { background:var(--paper); color:var(--ink); border-color:var(--paper); }.button-light:hover { background:var(--timber); border-color:var(--timber); }.button-outline-light { background:transparent; border-color:rgba(255,255,255,.45); }.button-outline-light:hover { background:white; border-color:white; color:var(--ink); }.booking-note { color:rgba(255,255,255,.45); font-size:.7rem; margin:.6rem 0 0; }.takeaway-bar { padding:2.2rem 0; background:var(--paper); }.takeaway-inner { display:flex; justify-content:space-between; align-items:center; gap:1.5rem; }.takeaway-inner p { margin:0; font:600 clamp(1.4rem,2.5vw,2rem)/1.1 var(--display); }.takeaway-mark { color:var(--wine); }.button-wine { background:var(--wine); border-color:var(--wine); }.site-footer { background:#0a0b0b; color:white; padding:3rem 0 1.2rem; }.footer-inner { display:grid; grid-template-columns:1fr 1fr 1fr; align-items:center; gap:2rem; }.footer-brand { justify-self:start; }.footer-inner p { margin:0; font:500 1.35rem/1 var(--display); }.footer-inner > div { display:flex; flex-direction:column; align-items:end; gap:.25rem; font-size:.7rem; color:rgba(255,255,255,.65); }.legal { display:flex; justify-content:space-between; border-top:1px solid rgba(255,255,255,.14); margin-top:2.5rem; padding-top:1rem; color:rgba(255,255,255,.45); font-size:.63rem; text-transform:uppercase; letter-spacing:.08em; }
@media (max-width: 760px) { .section-shell { width:min(100% - 2.25rem,1180px); }.site-header { min-height:4.5rem; padding:0 1.125rem; }.brand, .brand-logo { width:3.5rem; height:3.5rem; }.nav-toggle { display:block; color:var(--ink); position:relative; z-index:2; }.nav-toggle.is-open { color:white; }.primary-nav { visibility:hidden; opacity:0; pointer-events:none; position:fixed; inset:0; background:var(--ink); color:white; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:2rem; font:600 1.25rem var(--display); transition:.25s; }.primary-nav.is-open { visibility:visible; opacity:1; pointer-events:auto; }.primary-nav .button { margin-top:1rem; font-family:var(--sans); }.hero { min-height:720px; display:block; }.hero-image-wrap { height:100%; min-height:0; position:absolute; inset:0; }.hero-image-wrap:after { background:linear-gradient(90deg,rgba(241,235,227,.95) 0%,rgba(241,235,227,.62) 100%); }.hero-copy { padding:9rem 1.125rem 4rem; }.hero h1 { font-size:clamp(4rem, 19vw, 5.7rem); }.hero-note { display:none; }.intro-section { padding:5.5rem 0; }.intro-grid, .about-section, .visit-grid, .booking-wrap { grid-template-columns:1fr; gap:2rem; }.section-heading { display:block; }.section-heading > p { margin-top:1.4rem; }.menu-section, .visit-section, .booking-section { padding:5.5rem 0; }.menu-grid, .visit-details { grid-template-columns:1fr; }.menu-card { padding:1.5rem; }.menu-footer, .takeaway-inner { align-items:flex-start; flex-direction:column; }.about-section { padding:5.5rem 0; }.about-photo { max-width:510px; }.gallery-section { padding-bottom:5.5rem; }.gallery-grid { grid-template-columns:1fr 1fr; width:calc(100% - 2.25rem); }.gallery-large { grid-column:span 2; }.gallery-grid img { min-height:220px; }.gallery-large img { min-height:420px; }.footer-inner { grid-template-columns:1fr; gap:1.4rem; }.footer-inner > div { align-items:start; }.legal { margin-top:2rem; } }
@media (max-width: 420px) { .hero h1 { font-size:3.7rem; }.menu-item { gap:.7rem; }.menu-item h3 { font-size:1rem; }.menu-item p { font-size:.72rem; }.gallery-grid { grid-template-columns:1fr; }.gallery-large { grid-column:span 1; }.gallery-large img { min-height:300px; }.gallery-grid img { min-height:260px; } }