/* A single illustrated entrance. The menu is never gated by the animation. */
section.hero.hero-studio{position:relative;display:block;isolation:isolate;height:auto;min-height:0;max-height:none;padding:150px 0 58px;overflow:hidden;background:#e5e5e0!important;color:#33363a}
.hero-studio::before,.hero-studio::after{display:none}
body:has(.hero-studio) .top:not(.scrolled){background:#e5e5e0!important;color:#33363a;box-shadow:none}
body:has(.hero-studio) .top:not(.scrolled) .topnav a{color:#33363a!important;text-shadow:none!important}
body:has(.hero-studio) .top:not(.scrolled) .brand .logo-dark{display:flex!important}
body:has(.hero-studio) .top:not(.scrolled) .brand .logo-light{display:none!important}
.hero-layout{width:min(1180px,calc(100% - 88px));margin:auto}
.hero-location{margin:0;font:500 11px/1.5 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:#616560}
.hero-location span{margin:0 12px;color:#8b8f88}
.hero-scene{position:relative;height:306px}
.hero-headline{position:absolute;inset:0;display:flex;align-items:center;pointer-events:none;z-index:2}
.hero-studio .hero-title{font:500 clamp(52px,6vw,76px)/1.1 var(--sans);letter-spacing:-.055em;margin:0;color:#33363a}
.hero-title>span{color:#94191e}
.hero-signature{position:absolute;right:16%;top:112px;width:84px;z-index:1}
.hero-signature .lobster{display:block;width:100%;height:auto;aspect-ratio:1430/1461}
.hero-ingredient{position:absolute;pointer-events:none;aspect-ratio:1;z-index:0}
.ingredient-drift,.ingredient-art{display:block;width:100%;height:100%}
.ingredient-drift{transition:transform 450ms cubic-bezier(.16,1,.3,1)}
.ingredient-art{background-image:url('/img/art/hero-ingredients-comic-color-hellgruen-web.webp');background-size:200% 200%;background-repeat:no-repeat}
.ingredient-tomato{width:150px;left:36%;top:12px;--enter-x:-76px;--enter-y:36px;--delay:80ms}
.ingredient-tomato .ingredient-art{background-position:0 0}
.ingredient-carrot{width:186px;right:20%;top:-24px;--enter-x:60px;--enter-y:-68px;--delay:220ms}
.ingredient-carrot .ingredient-art{background-position:100% 0}
.ingredient-mushroom{width:138px;left:48%;bottom:-10px;--enter-x:-32px;--enter-y:70px;--delay:360ms}
.ingredient-mushroom .ingredient-art{background-position:0 100%}
.ingredient-parsley{width:156px;right:0;bottom:4px;--enter-x:78px;--enter-y:44px;--delay:500ms}
.ingredient-parsley .ingredient-art{background-position:100% 100%}
@media(prefers-reduced-motion:no-preference){
  .hero-title{animation:hero-word-enter 950ms cubic-bezier(.16,1,.3,1) 120ms both}
  .hero-ingredient{animation:ingredient-enter 1400ms cubic-bezier(.16,1,.3,1) var(--delay) both}
  .hero-signature{animation:hero-sign-enter 1000ms cubic-bezier(.16,1,.3,1) 180ms both}
  .hero-signature .lobster-claw-left,.hero-signature .lobster-claw-right{transform-box:fill-box;transform-origin:50% 100%;animation:claw-greet 1300ms ease-in-out 240ms both}
  .hero-signature .lobster-claw-right{--greet-angle:8deg}
  .hero-signature .lobster-claw-left{--greet-angle:-8deg}
}
@keyframes ingredient-enter{from{opacity:0;transform:translate(var(--enter-x),var(--enter-y))}to{opacity:1;transform:translate(0,0)}}
@keyframes hero-word-enter{from{opacity:0;clip-path:inset(0 0 100% 0);transform:translateY(18px)}to{opacity:1;clip-path:inset(0);transform:translateY(0)}}
@keyframes hero-sign-enter{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
@keyframes claw-greet{0%,100%{transform:rotate(0)}45%{transform:rotate(var(--greet-angle))}}
@media(max-width:1000px){
  section.hero.hero-studio{padding-top:148px}
  .hero-layout{width:calc(100% - 64px)}
  .hero-scene{height:250px}
  .hero-studio .hero-title{font-size:clamp(42px,6vw,60px)}
  .hero-signature{right:13%;top:108px;width:62px}
  .ingredient-tomato{width:116px;left:34%;top:10px}
  .ingredient-carrot{width:148px;right:17%;top:-12px}
  .ingredient-mushroom{width:110px;left:43%;bottom:-6px}
  .ingredient-parsley{width:112px;right:0;bottom:-4px}
}
@media(max-width:640px){
  section.hero.hero-studio{padding:220px 0 42px}
  .hero-layout{width:calc(100% - 40px)}
  .hero-location{font-size:10px;letter-spacing:.07em}
  .hero-location span{margin:0 7px}
  .hero-scene{height:244px;margin-top:10px}
  .hero-headline{align-items:flex-start;padding-top:12px}
  .hero-studio .hero-title{font-size:clamp(40px,10.5vw,52px)}
  .hero-signature{width:48px;top:auto;right:34%;bottom:28px}
  .ingredient-tomato{width:94px;left:0;top:74px;--enter-x:-32px;--enter-y:18px}
  .ingredient-carrot{width:124px;right:2%;top:16px;--enter-x:30px;--enter-y:-28px}
  .ingredient-mushroom{width:90px;left:17%;bottom:-10px;--enter-x:-20px;--enter-y:28px}
  .ingredient-parsley{width:90px;right:-3px;bottom:-1px;--enter-x:32px;--enter-y:22px}
}
@media(prefers-reduced-motion:reduce){
  .hero-studio *, .hero-studio *::before,.hero-studio *::after{animation:none!important;transition:none!important}
  .ingredient-drift{transform:none!important}
}

/* The underline is sized by its wording, including future replacement copy. */
.hero-heading{position:relative;display:inline-block;max-width:36%;padding-bottom:23px}
.hero-underline{position:absolute;left:0;bottom:0;width:100%;height:20px;overflow:visible;color:#94191e}
.hero-underline path{fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;stroke-dasharray:100;stroke-dashoffset:0}
.ingredient-onion .ingredient-art,.ingredient-broccoli .ingredient-art,.ingredient-pepper .ingredient-art,.ingredient-aubergine .ingredient-art{background-image:url('/img/art/hero-ingredients-extra.webp')}
.ingredient-onion .ingredient-art{background-position:0 0}
.ingredient-broccoli .ingredient-art{background-position:100% 0}
.ingredient-pepper .ingredient-art{background-position:0 100%}
.ingredient-aubergine .ingredient-art{background-position:100% 100%}
/* Whole ingredients circle the original mark, then become prep on the board. */
.welcome-intro{display:none;position:fixed;inset:0;z-index:1000;pointer-events:none;align-items:center;justify-content:center}
.welcome-intro::before{content:"";position:absolute;inset:0;background:#e5e5e0;opacity:1;transition:opacity 900ms ease}
.intro-playing .welcome-intro{display:flex}
.welcome-intro.is-landing::before{opacity:0}
.intro-orbit{position:relative;width:280px;height:280px;animation:vegetable-orbit 3400ms linear both}
.intro-slot{position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px;transform:rotate(var(--angle)) translateY(-112px)}
.intro-icon{display:block;width:100%;height:100%;transform:rotate(calc(-1 * var(--angle)))}
.intro-mascot{position:absolute;width:66px;height:70px;z-index:1}
.intro-mascot .lobster{width:100%;height:100%}
.intro-mascot .lobster-claw-left,.intro-mascot .lobster-claw-right{transform-box:fill-box;transform-origin:50% 100%;animation:intro-claws 1700ms ease-in-out infinite alternate}
.intro-mascot .lobster-claw-right{animation-direction:alternate-reverse}
.intro-covering .hero-studio *,.intro-covering .top .brand-mark *{animation-play-state:paused!important}
.intro-flyer{position:fixed;pointer-events:none;z-index:1001}
.intro-flyer .ingredient-art{position:absolute;inset:0}
.intro-flyer .ingredient-cut{background-image:url('/img/art/hero-ingredients-cut-hellgruen-web.webp');opacity:0}
@keyframes vegetable-orbit{from{transform:rotate(-70deg)}to{transform:rotate(290deg)}}
@keyframes intro-claws{from{transform:rotate(-7deg)}to{transform:rotate(7deg)}}
@keyframes underline-write{0%,8%{stroke-dashoffset:100;opacity:1}30%,78%{stroke-dashoffset:0;opacity:1}90%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes spoon-write{0%,27%{stroke-dashoffset:100;opacity:1}43%,78%{stroke-dashoffset:0;opacity:1}90%,100%{stroke-dashoffset:0;opacity:0}}
@media(prefers-reduced-motion:no-preference){.hero-underline .underline-stroke{animation:underline-write 6500ms ease 600ms infinite}.hero-underline .underline-spoon{animation:spoon-write 6500ms ease 600ms infinite}}
@media(prefers-reduced-motion:reduce){.welcome-intro{display:none!important}.hero-underline path{animation:none;stroke-dashoffset:0}}

/* A kitchen scene gives the ingredients a destination and the greeting a purpose. */
.hero-scene{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:52px;height:auto;min-height:340px;margin-top:28px}
.hero-copy{position:relative;z-index:2}
.hero-studio .hero-title{font-size:clamp(30px,3.7vw,48px);line-height:1.2;letter-spacing:-.045em}
.hero-studio .hero-title>span{color:inherit}
.hero-studio .hero-heading{display:inline-block;position:relative;max-width:none;padding-bottom:36px;white-space:nowrap}
.hero-dot{color:#94191e}
.hero-underline{bottom:-2px;height:45px}
.hero-description{font-size:15px;line-height:1.8;color:#616560;margin:24px 0 18px}
.hero-menu-link{display:inline-flex;align-items:center;gap:22px;font-size:12px;letter-spacing:.04em;text-decoration:none;padding:8px 0;border-bottom:1px solid #a0a39b}
.hero-menu-link:hover{color:#94191e;border-color:#94191e}
.hero-kitchen{position:relative;width:100%;align-self:center}
.hero-kitchen img{width:100%;height:auto;display:block}
@media(prefers-reduced-motion:no-preference){.hero-kitchen{animation:kitchen-enter 1100ms cubic-bezier(.16,1,.3,1) both}}
@keyframes kitchen-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1000px){.hero-scene{gap:24px;min-height:300px}.hero-studio .hero-title{font-size:clamp(28px,3.7vw,38px)}}
@media(max-width:760px){section.hero.hero-studio{padding-top:200px;padding-bottom:40px}.hero-scene{grid-template-columns:1fr;gap:28px;margin-top:26px;min-height:0}.hero-copy{max-width:440px}.hero-studio .hero-title{font-size:clamp(28px,7.6vw,40px)}.hero-description{margin-top:18px;font-size:14px}.hero-kitchen{width:min(100%,400px);justify-self:center}.hero-layout{width:calc(100% - 40px)}}
@media(prefers-reduced-motion:reduce){.intro-mascot *{animation:none!important}.hero-underline path{opacity:1!important;stroke-dashoffset:0!important}}

@font-face{font-family:WiesmeierScript;src:url('/fonts/Allura-Regular.ttf') format('truetype');font-display:swap;font-weight:400}
.hero-studio .hero-heading{padding-bottom:94px}
.hero-autograph{position:absolute;left:0;bottom:0;width:330px;max-width:100%;height:84px;overflow:visible;color:#94191e}
.signature-name text{font:400 90px WiesmeierScript,cursive;fill:currentColor;letter-spacing:0}
.signature-spoon,.signature-bowl{fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:100;stroke-dashoffset:0}
.signature-bowl{stroke-width:2}
@keyframes signature-write{0%{clip-path:inset(0 100% 0 0);opacity:1}22%,86%{clip-path:inset(0);opacity:1}94%,100%{clip-path:inset(0);opacity:0}}
@keyframes signature-spoon{0%,21%{stroke-dashoffset:100;opacity:1}36%,86%{stroke-dashoffset:0;opacity:1}94%,100%{stroke-dashoffset:0;opacity:0}}
@media(prefers-reduced-motion:no-preference){.signature-name{animation:signature-write 8000ms linear 200ms infinite}.signature-spoon,.signature-bowl{animation:signature-spoon 8000ms ease 200ms infinite}}
@media(max-width:760px){.hero-studio .hero-heading{padding-bottom:82px}.hero-autograph{width:280px;height:72px}}
@media(prefers-reduced-motion:reduce){.hero-autograph *{animation:none!important;opacity:1!important;clip-path:none!important;stroke-dashoffset:0!important}}

/* The kitchen illustration carries the story; no decorative signature below the title. */
.hero-studio .hero-heading{padding-bottom:0}

/* Exact illustrated cutting-board surface, relative to the uncropped artwork. */
.hero-prep-target{position:absolute;left:17%;top:87%;width:17%;height:7%;pointer-events:none}

/* These exact nodes fly onto the board and remain there as the final artwork. */
.hero-kitchen{animation:none!important}
.hero-kitchen .prep-piece{position:absolute;display:block;width:9%;height:auto;aspect-ratio:1;top:auto;right:auto;z-index:2;pointer-events:none}
.hero-kitchen .prep-tomato{left:16.5%;bottom:6.5%}
.hero-kitchen .prep-carrot{left:26%;bottom:6.5%}
.hero-kitchen .prep-mushroom{left:21.5%;bottom:5.5%;z-index:3}
.hero-kitchen .prep-parsley{left:22%;bottom:11%;width:7%;z-index:1}
.prep-piece .ingredient-art{position:absolute;inset:0}
.prep-piece .ingredient-cut{background-image:url('/img/art/hero-ingredients-cut-hellgruen-web.webp');opacity:1}
.prep-piece .prep-whole{opacity:0}
.intro-playing .prep-piece{visibility:hidden}
.intro-playing .hero-kitchen.is-preparing .prep-piece{visibility:visible}

/* During the handoff, ingredients remain above the fading curtain. */
.intro-playing section.hero.hero-studio{isolation:auto;overflow:visible}
.hero-kitchen.is-preparing .prep-piece{z-index:1001}

.ingredient-story{padding:96px 0;background:#f0f0e9}
.ingredient-story-layout{display:grid;grid-template-columns:1.25fr 1fr;gap:72px;align-items:center}
.ingredient-story-photo{display:block;width:100%;height:370px;object-fit:cover}
.ingredient-story-copy h2{font-size:clamp(28px,3vw,42px);line-height:1.2;margin:20px 0}
.ingredient-story-copy>p:not(.caps){max-width:34ch;line-height:1.8;color:#616560;margin-bottom:28px}
@media(max-width:760px){.ingredient-story{padding:48px 0}.ingredient-story-layout{grid-template-columns:1fr;gap:28px}.ingredient-story-photo{height:230px}}

.ingredient-asparagus .ingredient-art{background-image:url('/img/art/hero-asparagus-hellgruen-web.webp');background-size:200% 100%;background-position:0 0}
.ingredient-asparagus .ingredient-cut{background-image:url('/img/art/hero-asparagus-hellgruen-web.webp');background-position:100% 0}
.hero-kitchen .prep-asparagus{left:23%;bottom:2.7%;width:10%;z-index:4}

/* Keep the original red drawn line, without the rejected autograph. */
.hero-studio .hero-heading{padding-bottom:26px}
.hero-studio .hero-underline{height:24px;bottom:-2px}
.intro-loading .intro-orbit{visibility:hidden}
.intro-loading .prep-piece{visibility:hidden!important}
.intro-loading .intro-mascot{visibility:hidden}
/* Moving ingredients live in the fixed intro layer until they reach the board. */
.welcome-intro>.prep-piece .ingredient-art{position:absolute;inset:0}
.welcome-intro>.prep-piece .ingredient-cut{background-image:url('/img/art/hero-ingredients-cut-hellgruen-web.webp')}
.welcome-intro>.ingredient-asparagus .ingredient-art{background-image:url('/img/art/hero-asparagus-hellgruen-web.webp');background-size:200% 100%}
.welcome-intro>.ingredient-asparagus .prep-whole{background-position:0 0}
.welcome-intro>.ingredient-asparagus .ingredient-cut{background-position:100% 0}

/* Separate steam strokes rise continuously; the cook and pot stay still. */
.hero-kitchen .kitchen-steam{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;overflow:visible}
.kitchen-steam path{transform-box:fill-box;transform-origin:center bottom;animation:kitchen-steam-rise 3.8s ease-in-out infinite;opacity:0}
.kitchen-steam path:nth-child(2){animation-delay:-1.3s;animation-duration:4.2s}
.kitchen-steam path:nth-child(3){animation-delay:-2.6s;animation-duration:3.6s}
@keyframes kitchen-steam-rise{0%{opacity:0;transform:translate(0,18px) scale(.8,.65)}25%{opacity:.85}65%{opacity:.7}100%{opacity:0;transform:translate(8px,-38px) scale(1.12,1.04)}}
@media(prefers-reduced-motion:reduce){.kitchen-steam path{animation:none;opacity:.7}}
/* Reuse the approved cutout silhouette, including its exact transparent edge. */
.hero-kitchen>img{mask-image:url('/img/art/hero-kitchen-cutout-web.webp');mask-size:100% 100%;mask-repeat:no-repeat}
.ingredient-story-photo{height:auto;object-fit:contain;}