/* Small, purposeful movements keep the food and typography in focus. */
:root { --ease-out: cubic-bezier(.16, 1, .3, 1); }
h1 > .hero-line {
  display: block;
  overflow: hidden;
  padding-block: .07em;
  margin-block: -.07em;
  color: inherit;
}
h1 > .hero-line:last-child { color: var(--orange); }
.hero-line > span { display: block; }

@media (prefers-reduced-motion: no-preference) {
  .hero-line > span { animation: headline-in 1.05s var(--ease-out) .12s backwards; }
  .hero-line:nth-child(2) > span { animation-delay: .24s; }
  .hero-line:nth-child(3) > span { animation-delay: .36s; }
  .hero-eyebrow { animation: soft-in .9s var(--ease-out) .05s backwards; }
  .hero-description { animation: soft-in .95s var(--ease-out) .48s backwards; }
  .hero .button { animation: soft-in .95s var(--ease-out) .58s backwards; }
  .hero-origin { animation: soft-in .95s var(--ease-out) .68s backwards; }
  .hero-caption { animation: soft-in 1s var(--ease-out) .75s backwards; }
  .hero-photo img { animation: food-in 1.65s var(--ease-out) .12s backwards; }
  .hero-photo {
    transform: translate3d(var(--hero-x, 0px), var(--hero-y, 0px), 0);
    transition: transform 1s var(--ease-out);
  }
  .hero-stamp {
    animation: stamp-in 1.3s var(--ease-out) .5s backwards;
    transform: translate3d(var(--stamp-x, 0px), var(--stamp-y, 0px), 0) rotate(11deg);
    transition: transform 1.2s var(--ease-out);
  }
  .scroll-motion [data-reveal] {
    transition: opacity .8s var(--ease-out), transform .95s var(--ease-out);
    transition-delay: var(--reveal-delay, 0s);
  }
  .scroll-motion [data-reveal]:not(.is-visible):not(:focus-within) {
    opacity: 0;
    transform: translate3d(0, 28px, 0);
  }
  .food-card:nth-child(2) { --reveal-delay: .1s; }
  .food-card:nth-child(3) { --reveal-delay: .2s; }
  .story-copy, .location-info { --reveal-delay: .12s; }
  .button {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    transition: transform .45s var(--ease-out), background .3s, box-shadow .45s;
  }
  .button::before {
    content: '';
    position: absolute;
    inset: -40% -70%;
    background: linear-gradient(110deg, transparent 42%, #ffffff36 50%, transparent 58%);
    transform: translateX(-55%);
    pointer-events: none;
  }
  .button > span, .text-link > span { transition: transform .4s var(--ease-out); }
  .button:active { transform: translateY(0) scale(.98); }
  .button:focus-visible::before { animation: button-sheen .8s ease-out; }
  .button:focus-visible > span, .text-link:focus-visible > span { transform: translate(3px, -3px); }
  .mobile-nav:not([hidden]) { animation: menu-in .28s var(--ease-out); }
  @media (hover: hover) and (pointer: fine) {
    .button:hover { transform: translateY(-3px); box-shadow: 0 7px 18px #10151012; }
    .button:hover::before { animation: button-sheen .8s ease-out; }
    .button:hover > span, .text-link:hover > span { transform: translate(3px, -3px); }
    .food-image { transition: transform .6s var(--ease-out), box-shadow .6s var(--ease-out); }
    .food-image img { transition: transform .9s var(--ease-out); }
    .food-card:hover .food-image { transform: translateY(-6px); box-shadow: 0 15px 28px #24211b1c; }
    .food-card:hover .food-image img { transform: scale(1.065); }
    .food-note > span, .strip-star { display: inline-block; transition: transform .8s var(--ease-out); }
    .food-card:hover .food-note > span, .flavour-strip:hover .strip-star { transform: rotate(90deg); }
    .story-logo { transition: transform 1s var(--ease-out), box-shadow 1s var(--ease-out); }
    .story-identity:hover .story-logo { transform: translateY(-5px) rotate(-2deg); box-shadow: 10px 13px 0 #c2773426; }
    .brand .logo-crop { transition: transform .6s var(--ease-out); }
    .brand:hover .logo-crop { transform: rotate(-6deg); }
  }
  @media (max-width: 780px) {
    .hero-photo img { animation-duration: 1.25s; }
    .scroll-motion [data-reveal] { transition-duration: .65s; }
  }
  @media (max-width: 520px) { .food-card { --reveal-delay: 0s !important; } }
}
@keyframes headline-in {
  from { opacity: 0; transform: translate3d(0, 105%, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}
@keyframes soft-in {
  from { opacity: 0; transform: translate3d(0, 18px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}
@keyframes food-in {
  from { opacity: 0; transform: translate3d(20px, 12px, 0) scale(1.035); }
  to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}
@keyframes stamp-in {
  from { opacity: 0; transform: translateY(14px) rotate(-12deg) scale(.93); }
  to { opacity: 1; transform: translateY(0) rotate(11deg) scale(1); }
}
@keyframes button-sheen {
  from { transform: translateX(-55%); }
  to { transform: translateX(55%); }
}
@keyframes menu-in {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-photo, .scroll-motion [data-reveal] { transform: none !important; opacity: 1 !important; }
  .hero-stamp { transform: rotate(11deg) !important; }
  .button:hover, .button:active, .food-card:hover .food-image img { transform: none; }
}
@media print {
  .scroll-motion [data-reveal], .hero-line > span { opacity: 1 !important; transform: none !important; }
}