/* Homepage hero inspired by the supplied reference, built with HTML/CSS rather than using the image. */
.hero{min-height:650px;padding:65px 9vw 55px;display:flex;position:relative;align-items:center;gap:30px;overflow:hidden;background:linear-gradient(120deg,#ffad08 0%,#ffc62a 54%,#ffe5a3 100%);border-radius:0 0 12px 12px}
.hero:before{content:"";position:absolute;inset:18px 6vw 26px;border:1px solid rgba(255,255,255,.35);border-radius:26px;pointer-events:none}
.hero-copy{display:block;position:relative;z-index:2;max-width:510px;padding-left:2vw;animation:heroCopyIn .8s ease both}
.hero-copy .eyebrow{display:inline-block;padding:10px 17px;margin-bottom:23px;background:#e9341c;color:#ffe18a}
.hero-copy h1{font-size:clamp(56px,7vw,96px);font-weight:700;line-height:.87;letter-spacing:-.09em;text-transform:uppercase;color:#16100d}
.hero-copy h1 em{color:#a30e18}
.hero-copy .intro{color:#4e2b1d;font-size:14px;max-width:350px}
.hero-art{display:grid;position:relative;z-index:1;width:49%;height:500px;overflow:hidden;border-radius:0 26px 26px 0;background:#a30e18;place-items:center;animation:heroArtIn .9s .12s ease both}
.hero-art:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 25% 30%,#ffbb18 0 4px,transparent 5px),radial-gradient(circle at 65% 20%,#ffc42c 0 5px,transparent 6px),radial-gradient(circle at 75% 72%,#ff9810 0 4px,transparent 5px);background-size:68px 74px,90px 92px,74px 80px;opacity:.8}
.hero-art .plate{display:grid;position:relative;z-index:2;width:auto;height:auto;background:none;box-shadow:none;font-size:clamp(150px,19vw,235px);filter:drop-shadow(0 20px 0 rgba(67,4,7,.35));place-items:center}
.hero-art .burst{z-index:3;top:45px;left:25px;background:#ffcf32;color:#781118}
.hero-art .food-orbit{z-index:3}
.site-header{position:absolute;z-index:6;top:22px;left:6vw;right:6vw;color:#17100d}
.site-header .brand-mark{background:#a30e18;color:#ffd778}
.site-header nav a{border-color:transparent}.site-header nav a.active{border-color:#17100d}
@keyframes heroCopyIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes heroArtIn{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}
@media(max-width:700px){.site-header{position:absolute;top:18px;left:5vw;right:5vw}.hero{min-height:720px;padding:105px 7vw 45px;display:block}.hero-copy{padding-left:0}.hero-copy h1{font-size:60px}.hero-art{width:100%;height:320px;margin-top:30px;border-radius:18px}.hero-art .plate{font-size:150px}}