/* TOASTED: the parts every page shares, from the Hero kit. Black bar with the marigold TOASTED wordmark,
   flat square blocks for buttons, heavy uppercase Archivo Black headings like their menu posters, black footer. */
:root{--head-h:56px}
@media (min-width:900px){:root{--head-h:64px}}
body{font-size:17px}
h1,h2{text-transform:uppercase;letter-spacing:-.02em;line-height:.96}
h3{font-family:var(--body);font-weight:700;letter-spacing:0}

/* Header: the black bar, wordmark left */
.site-head{background:var(--ink);color:#fff}
.site-head.scrolled{box-shadow:none}
.site-head .wrap{max-width:none;height:var(--head-h);padding-inline:20px}
.brand{font-family:var(--display);font-size:26px;letter-spacing:-.01em;color:var(--gold);line-height:1}
.site-head nav{gap:22px;font-weight:600}
.site-head nav a[aria-current]{text-decoration:underline;text-underline-offset:.3em}
@media (min-width:900px){.site-head .wrap{padding-inline:48px}.brand{font-size:30px}}

/* Buttons: flat square blocks in condensed caps */
.btn{min-height:52px;padding:0 24px;font:700 15px/1 var(--body);font-stretch:80%;letter-spacing:.08em;text-transform:uppercase}
.btn.sm{min-height:40px;padding:0 16px;font-size:13px}
.btn-gold{background:var(--gold);color:var(--ink)}
.btn-white{background:#fff;color:var(--ink)}
.site-head .btn{background:var(--gold);color:var(--ink)}
.alt{font-weight:600;font-size:15px;text-underline-offset:3px}
.act{display:flex;align-items:center;gap:12px 20px;flex-wrap:wrap}

/* Specials banner: one marigold line over the bar */
.special{background:var(--gold);color:var(--ink)}

/* Footer: black, the wordmark big, like the letters on the counter */
.site-foot{background:var(--ink);color:rgba(255,255,255,.78);padding-block:56px 40px}
.site-foot .wrap{display:grid;gap:28px}
.foot-mark{font:400 clamp(56px,17.4vw,200px)/.8 var(--display);color:var(--gold);text-decoration:none;letter-spacing:-.03em}
.foot-links{display:flex;flex-wrap:wrap;gap:4px 22px;font-weight:600;color:#fff}
.foot-links a{min-height:44px;display:inline-flex;align-items:center;text-decoration:none}
.foot-links a:hover{text-decoration:underline}
.foot-small{font-size:14px}
@media (min-width:900px){.site-foot .wrap{max-width:1920px;padding-inline:48px;grid-template-columns:1fr auto;align-items:end}}
@media (min-width:721px){.site-head .show-sm{display:none}}
input,select,textarea,button{font-family:var(--body)}
@media (max-width:720px){body{padding-bottom:0}}
