@font-face{font-family:"GFS Didot";src:url(../fonts/gfs-didot.woff) format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"Jost";src:url(../fonts/jost-var.woff2) format("woff2");font-weight:300 700;font-display:swap}

:root{
  --awning:#1762C4;--trim:#0D2C5E;--wall:#F3F5F4;--wall-2:#E4E9EA;--ink:#101B2C;--lemon:#F5C92E;
  --board:#17191B;--chalk:#EEF1F0;--frame:#A9743F;
  --pad:clamp(20px,3.4vw,48px);
  --nav-h:72px;
  --settle:cubic-bezier(.22,1,.36,1);
  --step-small:clamp(.875rem,.84rem + .15vw,.9375rem);
  --step-body:clamp(1.0625rem,1rem + .25vw,1.1875rem);
  --step-lead:clamp(1.3rem,1.15rem + .7vw,1.75rem);
  --step-head:clamp(3rem,1.6rem + 5.4vw,6rem);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--nav-h);background:var(--wall)}
html[data-motion=off]{scroll-behavior:auto}
body{margin:0;background:var(--wall);color:var(--ink);font:400 var(--step-body)/1.55 Jost,system-ui,sans-serif;overflow-x:clip}
img,svg{display:block;max-width:100%;height:auto}
h1,h2,h3,h4,p,ul,figure,blockquote{margin:0;padding:0}
ul{list-style:none}
h1,h2,h3,.foot__name,.tonight__street{font-family:"GFS Didot",Georgia,serif;font-weight:400;letter-spacing:-.02em;line-height:1}
h2{font-size:var(--step-head);text-wrap:balance}
a{color:inherit;text-underline-offset:.2em}
address{font-style:normal}
cite{font-style:normal}
::selection{background:var(--lemon);color:var(--ink)}
:focus-visible{outline:3px solid var(--lemon);outline-offset:3px;box-shadow:0 0 0 3px var(--ink)} /* taste-skill-ignore: focus ring, not a resting shadow */
[hidden]{display:none!important}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:fixed;left:12px;top:-60px;z-index:60;padding:12px 16px;background:var(--lemon);color:var(--ink)}
.skip:focus{top:12px}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:10px 24px;border-radius:999px;font-weight:500;text-decoration:none;white-space:nowrap;border:0;font-size:var(--step-body);transition:transform 160ms ease-out,background-color 200ms ease,color 200ms ease}
.btn:active{transform:scale(.97)}
.btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}
.btn--lemon{background:var(--lemon);color:var(--ink)}
.btn--ink{background:var(--trim);color:#fff}
.btn--ghost{background:#fff;color:var(--trim)}
@media (hover:hover) and (pointer:fine){
  .btn--lemon:hover{background:#FFD84A}
  .btn--ink:hover{background:var(--awning)}
  .btn--ghost:hover{background:var(--lemon);color:var(--ink)}
}

/* Nav */
.nav{position:fixed;inset:0 0 auto;z-index:40;display:flex;align-items:center;gap:clamp(12px,2vw,28px);height:var(--nav-h);padding:0 var(--pad);color:#fff;transition:background-color 300ms ease,color 300ms ease}
.nav.is-solid{background:var(--wall);color:var(--ink)}
.nav__name{font:400 clamp(1.5rem,1.3rem + .8vw,2rem)/1 "GFS Didot",Georgia,serif;text-decoration:none;margin-right:auto;letter-spacing:-.01em}
.nav__links{display:flex;gap:clamp(16px,2vw,32px)}
.nav__links a{text-decoration:none;padding:12px 2px;font-weight:500}
@media (hover:hover) and (pointer:fine){.nav__links a:hover{text-decoration:underline}.nav__motion:hover{text-decoration:underline}}
.nav__motion{background:none;border:0;color:inherit;font:inherit;font-weight:500;padding:12px 2px;min-height:44px;cursor:pointer}
.nav__call{min-height:44px;padding:8px 20px}
.nav__call-short{display:none}

/* Hero */
.hero{position:relative;height:100svh;min-height:600px;overflow:hidden;background:var(--trim);color:#fff;display:flex;align-items:flex-end}
.hero__pic,.hero__pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.js:not([data-motion=off]) .hero__pic img{animation:settle 1400ms var(--settle) both}
@keyframes settle{from{transform:scale(1.04)}to{transform:none}}
.hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(13,44,94,.88) 0,rgba(13,44,94,.62) 26%,rgba(13,44,94,0) 52%),linear-gradient(to bottom,rgba(13,44,94,.72) 0,rgba(13,44,94,.5) 8%,rgba(13,44,94,0) 20%)} /* taste-skill-ignore: scrim over the photo */
.hero__body{position:relative;z-index:2;width:100%;padding:0 var(--pad) clamp(24px,4vh,44px);display:flex;align-items:flex-end;justify-content:space-between;gap:32px}
.hero__name{font-size:clamp(4rem,11vw,11.25rem);line-height:.92;letter-spacing:-.03em;white-space:nowrap}
.hero__line{font-size:var(--step-lead);line-height:1.25;margin-top:.5em;max-width:34ch}
.hero__facts{margin-top:.6em;display:flex;flex-wrap:wrap;gap:0 1.2em;font-weight:500}
.hero__cta{display:flex;flex-direction:column;gap:12px;flex:none}

/* Ribbon under the awning */
.ribbon{background:var(--awning);color:#fff;overflow:hidden;padding:16px 0 26px;border-radius:0 0 50% 50%/0 0 26px 26px;position:relative;z-index:2}
.ribbon__run{display:flex;width:max-content;font:400 clamp(1.5rem,1.2rem + 1.4vw,2.5rem)/1.1 "GFS Didot",Georgia,serif}
.ribbon__run span{padding-right:3em}
.js:not([data-motion=off]) .ribbon__run{animation:run 64s linear infinite}
.ribbon__run.is-paused{animation-play-state:paused}
@keyframes run{to{transform:translateX(-50%)}}

section{position:relative}

/* For Elias */
.elias{display:grid;grid-template-columns:7fr 5fr;gap:clamp(32px,5vw,80px);padding:clamp(88px,12vw,180px) var(--pad);align-items:center}
.elias__pic img{width:100%}
figcaption{margin-top:10px;font-size:var(--step-small)}
.elias__text>*+*{margin-top:1.1em}
.elias__quote{font:400 clamp(1.75rem,1.4rem + 1.2vw,2.25rem)/1.15 "GFS Didot",Georgia,serif;color:var(--awning)}

/* For fish */
.fish{background:var(--wall-2);padding:clamp(80px,10vw,150px) 0}
.fish__head{display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:clamp(20px,4vw,64px);padding:0 var(--pad);margin-bottom:clamp(28px,4vw,56px)}
.fish__head p{max-width:32ch}
.fish__ctl{display:flex;align-items:center;gap:12px;font-variant-numeric:tabular-nums;font-weight:500}
.fish__ctl button{width:48px;height:48px;border-radius:50%;border:0;background:var(--trim);color:#fff;display:grid;place-items:center;cursor:pointer;transition:transform 160ms ease-out,background-color 200ms ease}
.fish__ctl button:active{transform:scale(.95)}
.fish__ctl svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2}
.rail{display:flex;gap:clamp(12px,1.6vw,24px);overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--pad) 6px;scroll-padding:0 var(--pad);scrollbar-width:thin;scrollbar-color:var(--trim) transparent;overscroll-behavior-x:contain}
.plate{flex:0 0 clamp(290px,38vw,560px);scroll-snap-align:start}
.plate img{width:100%;aspect-ratio:4/3;object-fit:cover}
.plate__text{display:grid;grid-template-columns:1fr auto;column-gap:16px;padding-top:14px;align-items:baseline}
.plate h3{font-size:clamp(1.9rem,1.5rem + 1.3vw,2.75rem)}
.plate__price{font:400 clamp(1.9rem,1.5rem + 1.3vw,2.75rem)/1 "GFS Didot",Georgia,serif;color:var(--awning)}
.plate__text p:last-child{grid-column:1/-1;margin-top:6px;max-width:38ch}

/* Statement */
.say{background:var(--trim);color:#fff;padding:clamp(90px,14vw,200px) var(--pad)}
.say__line{font-size:clamp(1.65rem,6.4vw,6.25rem);line-height:1.04;letter-spacing:-.025em}
.say__line>span{display:block;white-space:nowrap}
.say__line i{font-style:normal;transition:opacity 300ms linear}
.js:not([data-motion=off]) .say__line i{opacity:.26}
.js:not([data-motion=off]) .say__line i.on{opacity:1}

/* Boards */
.boards{background:var(--board);color:var(--chalk);padding:clamp(80px,10vw,150px) var(--pad)}
.boards__head{display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,5vw,80px);align-items:end;margin-bottom:clamp(32px,4vw,64px)}
.boards__head p{max-width:42ch}
.boards__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(280px,.9fr);gap:clamp(14px,1.4vw,22px);align-items:start}
.board{background:#0F1112;border:8px solid var(--frame);padding:clamp(18px,1.8vw,28px)}
.board h3{font-size:clamp(2rem,1.6rem + 1.3vw,3rem);margin-bottom:.35em}
.board__sub{margin-top:.8em}
.board h4{margin:1.2em 0 .25em;font:500 var(--step-body)/1.2 Jost,sans-serif;color:var(--lemon)}
.board h3+h4{margin-top:0}
.board button{display:flex;width:100%;justify-content:space-between;gap:12px;align-items:baseline;background:none;border:0;color:inherit;font:inherit;text-align:left;padding:8px 6px;min-height:44px;margin-inline:-6px;width:calc(100% + 12px);cursor:pointer;transition:background-color 180ms ease,color 180ms ease}
.board button b{font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap}
.board button[data-n] span::before{content:attr(data-count);color:var(--board);background:var(--lemon);display:inline-block;min-width:1.5em;text-align:center;margin-right:.5em;font-weight:600}
.board button:active{background:#2A2D30}
@media (hover:hover) and (pointer:fine){.board button:hover{background:#2A2D30}}
.board__note{margin-top:1em;font-size:var(--step-small)}
.ticket{position:sticky;top:calc(var(--nav-h) + 16px);background:var(--wall);color:var(--ink);padding:clamp(18px,1.8vw,28px);display:flex;flex-direction:column;gap:14px}
.ticket h3{font-size:clamp(2rem,1.6rem + 1.3vw,3rem)}
.ticket__lines{display:flex;flex-direction:column;gap:6px;max-height:40vh;overflow:auto}
.ticket__lines li{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:8px}
.ticket__lines button{width:44px;height:44px;border:0;background:var(--wall-2);color:var(--ink);font:inherit;font-weight:600;cursor:pointer;transition:transform 140ms ease-out}
.ticket__lines button:active{transform:scale(.95)}
.ticket__lines .qty{display:flex;align-items:center;gap:4px;font-variant-numeric:tabular-nums}
.ticket__lines .qty span{min-width:1.4em;text-align:center}
.ticket__lines .amt{min-width:3em;text-align:right;font-variant-numeric:tabular-nums}
.ticket__total{display:flex;justify-content:space-between;align-items:baseline;gap:12px;background:var(--trim);color:#fff;padding:12px 14px}
.ticket__total strong{font:400 clamp(2rem,1.6rem + 1.3vw,3rem)/1 "GFS Didot",Georgia,serif;color:var(--lemon);font-variant-numeric:tabular-nums}
.ticket__clear{align-self:flex-start;background:none;border:0;font:inherit;text-decoration:underline;text-underline-offset:.2em;padding:10px 0;min-height:44px;color:inherit;cursor:pointer}
.ticket__note{font-size:var(--step-small)}
.ticket .btn{width:100%;white-space:normal}

/* For pointing at */
.point{padding:clamp(88px,12vw,180px) var(--pad)}
.point__head{display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,6vw,100px);align-items:end;margin-bottom:clamp(32px,4vw,64px)}
.point__head blockquote p{font:400 var(--step-lead)/1.2 "GFS Didot",Georgia,serif;max-width:30ch;color:var(--awning)}
.point__head cite{display:block;margin-top:6px;font-size:var(--step-small)}
.point__trip{display:grid;grid-template-columns:5fr 4fr 5fr;gap:clamp(12px,1.6vw,24px);align-items:start}
.point__trip img{width:100%;object-fit:cover}
.point__trip figure:nth-child(1){margin-top:clamp(100px,16vw,240px)}
.point__trip figure:nth-child(2) img{aspect-ratio:3/5}
.point__trip figure:nth-child(3){margin-top:clamp(30px,4.5vw,70px)}
.point__trip figure:nth-child(3) img{aspect-ratio:1/1}

/* Guests */
.guests{color:#fff;background:var(--trim);overflow:hidden}
.guests__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 60%}
.guests::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(13,44,94,.94) 0,rgba(13,44,94,.86) 46%,rgba(13,44,94,.06) 74%)} /* taste-skill-ignore: scrim over the photo */
.guests__body{position:relative;z-index:2;padding:clamp(88px,11vw,160px) var(--pad);max-width:min(860px,100%)}
.guests__big{margin-top:.8em}
.guests__big p{font:400 clamp(1.75rem,1.4rem + 1.2vw,2.25rem)/1.15 "GFS Didot",Georgia,serif}
.guests cite{display:block;margin-top:8px;font-size:var(--step-small)}
.guests__more{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,40px);margin-top:clamp(28px,3vw,44px)}
.guests__cap{margin-top:clamp(28px,3vw,44px)}

/* For tonight */
.tonight{background:var(--wall);padding:clamp(72px,8vw,120px) 0 clamp(88px,10vw,150px);overflow:hidden}
.tonight__street{font-size:clamp(3rem,15.2vw,15rem);line-height:.95;letter-spacing:-.03em;white-space:nowrap;margin:0;padding:0 var(--pad);color:var(--awning)}
.tonight__grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(32px,5vw,80px);padding:clamp(36px,5vw,72px) var(--pad) 0;align-items:start}
.tonight__text>*+*{margin-top:18px}
.tonight__status{font:400 var(--step-lead)/1.2 "GFS Didot",Georgia,serif;color:var(--trim)}
.tonight__hours li{display:flex;justify-content:space-between;gap:16px;padding:5px 8px;margin-inline:-8px;max-width:360px;font-variant-numeric:tabular-nums}
.tonight__hours li.is-today{background:var(--lemon);font-weight:500}
.tonight__cta{display:flex;flex-wrap:wrap;gap:12px}
.tonight__pic img{width:100%}

/* Footer */
.foot{background:var(--awning);color:#fff;padding:clamp(56px,7vw,100px) var(--pad) clamp(20px,3vw,32px);border-radius:50% 50% 0 0/44px 44px 0 0;overflow:hidden}
.foot__top{display:grid;grid-template-columns:minmax(150px,240px) 1fr;gap:clamp(24px,5vw,80px);align-items:end}
.foot__draw img{width:100%}
.foot__links{display:flex;flex-wrap:wrap;gap:clamp(24px,5vw,80px);justify-content:flex-end}
.foot__links a{display:inline-block;padding:6px 0}
.foot__name{margin:clamp(20px,3vw,40px) 0 0;font-size:clamp(5rem,27vw,27.5rem);line-height:.86;letter-spacing:-.03em;white-space:nowrap}
.foot__note{margin-top:clamp(16px,2vw,28px);font-size:var(--step-small);max-width:70ch}

/* Phone bar */
.bar{position:fixed;left:0;right:0;bottom:0;z-index:35;padding:8px 12px calc(8px + env(safe-area-inset-bottom));background:var(--wall);display:none;flex-direction:column;gap:6px;transition:transform 240ms var(--settle)}
.bar.is-away{transform:translateY(110%)}
.bar__row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bar__sum{display:block;text-align:center;font-weight:500;padding:6px;min-height:36px;text-decoration:none;background:var(--trim);color:#fff}

/* Entrances */
.js:not([data-motion=off]) .rise{opacity:0;transform:translateY(22px);transition:opacity 800ms var(--settle),transform 900ms var(--settle)}
.js:not([data-motion=off]) .rise.in{opacity:1;transform:none}

/* Tablet */
@media (max-width:1180px){
  .boards__grid{grid-template-columns:1fr 1fr}
  .ticket{grid-column:1/-1;position:static}
  .ticket__lines{max-height:none}
}
/* Phone */
@media (max-width:760px){
  :root{--nav-h:60px}
  .nav__links{display:none}
  .nav__call-long{display:none}.nav__call-short{display:inline}
  .bar{display:flex}
  body{padding-bottom:0}
  .hero__body{flex-direction:column;align-items:flex-start;gap:16px;padding-bottom:calc(84px + env(safe-area-inset-bottom))}
  .hero__name{font-size:clamp(3.25rem,17.4vw,6rem)}
  .hero__cta{flex-direction:row}
  .hero__cta .btn{padding:10px 18px}
  .hero__cta .btn--lemon{display:none}
  .hero__pic img{object-position:50% 30%}
  .hero::before{background:linear-gradient(to top,rgba(13,44,94,.9) 0,rgba(13,44,94,.72) 34%,rgba(13,44,94,0) 58%),linear-gradient(to bottom,rgba(13,44,94,.5) 0,rgba(13,44,94,0) 14%)} /* taste-skill-ignore: scrim over the photo */
  .elias{grid-template-columns:1fr}
  .elias__pic{order:2}
  .elias__quote p,.guests__big p{font-size:1.5rem}
  .guests__big p{line-height:1.2}
  .fish__head{grid-template-columns:1fr auto}
  .fish__head h2{grid-column:1/-1}
  .plate{flex-basis:84vw}
  .boards__head,.point__head{grid-template-columns:1fr}
  .boards__grid{grid-template-columns:1fr}
  .point__trip{grid-template-columns:1fr 1fr}
  .point__trip figure:nth-child(1){grid-column:1/-1;margin-top:0}
    .point__trip figure:nth-child(2) img{aspect-ratio:4/5}
  .point__trip figure:nth-child(3){margin-top:36px}
  .point__trip figure:nth-child(3) img{aspect-ratio:4/5}
  .guests::before{background:rgba(13,44,94,.8)}
  .guests__more{grid-template-columns:1fr}
  .tonight__grid{grid-template-columns:1fr}
  .tonight__street{font-size:15.4vw}
    .foot{padding-bottom:calc(84px + env(safe-area-inset-bottom));border-radius:50% 50% 0 0/28px 28px 0 0}
  .foot__links{justify-content:flex-start}
  .foot__top{grid-template-columns:1fr}
  .foot__draw{max-width:190px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .ribbon__run,.hero__pic img{animation:none!important}
  .rise{opacity:1!important;transform:none!important;transition:none!important}
  .say__line i{opacity:1!important}
}