/* Emil design engineering: playful ambient scenes, quick functional feedback. */
:root {
  --ease-out: cubic-bezier(.23,1,.32,1);
  --ease-drawer: cubic-bezier(.32,.72,0,1);
  --ease-float: cubic-bezier(.45,0,.55,1);
}

/* Continuous motion belongs to decorative layers. Reading and CTA positions stay still. */
.ambient-motion { animation-play-state:paused !important; }
html[data-motion="running"]:not([data-page-hidden="true"]) [data-motion-scene][data-in-view="true"] .ambient-motion {
  animation-play-state:running !important;
}
.waffle-stamp { position:absolute;right:56px;bottom:90px;width:152px;height:152px;pointer-events:none;color:var(--ink); }
@media (min-width:1024px) {
  .waffle-stamp { top:calc(var(--header-height) + 24px);right:56px;bottom:auto; }
}
.stamp-float { width:100%;height:100%;position:relative;border-radius:50%;background:var(--pink);box-shadow:0 6px 0 rgba(53,33,45,.2);animation:stamp-float 6s var(--ease-float) infinite; }
.stamp-ring { width:100%;height:100%;display:block;animation:turn 32s linear infinite; }
.stamp-ring text { fill:currentColor;font-size:12px;font-weight:600;letter-spacing:1.5px; }
.stamp-waffle { position:absolute;inset:27%;width:46%;height:46%; }
.hero-scroll>span { display:block; }
.brand-ribbon { overflow:hidden;background:var(--pink);color:var(--ink);padding-block:12px;border-block:1px solid rgba(53,33,45,.14); }
.ribbon-track { display:flex;width:max-content;animation:ribbon-flow 32s linear infinite; }
.ribbon-group { display:flex;align-items:center;flex-shrink:0;gap:24px;padding-right:24px; }
.ribbon-group span { font-size:clamp(22px,2vw,32px);line-height:1.15;font-weight:600;letter-spacing:-.04em;white-space:nowrap; }
.ribbon-group i { font-size:28px;line-height:1;font-style:normal;color:var(--berry); }
.cafe-moment { display:flex;align-items:center;gap:16px;margin-bottom:24px;color:var(--berry); }
.cafe-moment>svg { width:70px;height:64px;overflow:visible; }
.cafe-moment>span { font-size:11px;letter-spacing:.1em;text-transform:uppercase;line-height:1.5;font-weight:600; }
.steam-wisp { animation:steam-rise 3.6s var(--ease-float) infinite; }
.steam-wisp:nth-child(2) { animation-delay:-1.2s; }
.steam-wisp:nth-child(3) { animation-delay:-2.4s; }
.signature-section { position:relative;isolation:isolate;overflow:hidden; }
.signature { position:relative;z-index:1; }
.signature-atmosphere { position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden; }
.berry-glow { position:absolute;left:-15%;top:10%;width:85%;height:110%;background:radial-gradient(ellipse,rgba(208,86,141,.23),transparent 65%);animation:berry-drift 13s var(--ease-float) infinite alternate; }
.waffle-outline { position:absolute;width:310px;height:310px;left:-155px;bottom:-70px;border:2px solid var(--pink);border-radius:32px;opacity:.16;background:repeating-linear-gradient(90deg,transparent 0 45px,var(--pink) 45px 47px),repeating-linear-gradient(0deg,transparent 0 45px,var(--pink) 45px 47px);animation:waffle-drift 16s var(--ease-float) infinite alternate; }
.signature-spark { position:absolute;color:var(--pink);display:block; }
.signature-spark svg { width:100%;height:100%;display:block; }
.spark-one { width:92px;height:92px;left:46%;top:34px;opacity:.6;animation:turn 24s linear infinite; }
.spark-two { width:52px;height:52px;left:43%;bottom:28px;opacity:.8;animation:spark-drift 7s var(--ease-float) infinite; }
.footer-wordmark>.wordmark-main { font-size:1em;letter-spacing:inherit;white-space:nowrap; }
.brand-letter { display:inline-block;font-style:normal;animation:letter-wave 4.8s var(--ease-float) infinite;animation-delay:calc(var(--letter) * -130ms); }

/* Keep long-running decoration optional, including without an OS preference. */
.site-header::before { content:"";position:absolute;inset:0;box-shadow:0 5px 20px rgba(53,33,45,.08);opacity:0;pointer-events:none;transition:opacity 180ms ease; }
.site-header[data-scrolled="true"]::before { opacity:1; }
.desktop-nav a[aria-current="location"]::after { transform:scaleX(1); }
.button,.text-link,.social-link,.close-button,.nav-toggle,.lightbox-prev,.lightbox-next,.menu-tabs button,.mobile-quickbar button,.mobile-quickbar a {
  transition:transform 160ms var(--ease-out),background-color 180ms ease,color 180ms ease;
  touch-action:manipulation;
}
.button span,.text-link span,.back-top span { display:inline-block;transition:transform 220ms var(--ease-out); }
.desktop-nav a::after { transition:transform 220ms var(--ease-out); }
.gallery-item img,.menu-photo img { transition:transform 550ms var(--ease-out); }
.enlarge { transition:transform 220ms var(--ease-out),background-color 180ms ease; }
.gallery-item { overflow:hidden; }
.menu-card { position:relative; }
.nav-toggle[aria-expanded="true"] span:first-child { transform:translateY(4px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:last-child { transform:translateY(-4px) rotate(-45deg); }
.nav-toggle span { transition:transform 180ms var(--ease-out); }
html:not([data-input="keyboard"]) :is(.button,.text-link,.social-link,.close-button,.nav-toggle,.lightbox-prev,.lightbox-next,.menu-tabs button,.mobile-quickbar button,.mobile-quickbar a):active { transform:scale(.97); }
.lightbox figure>img { touch-action:pan-y pinch-zoom;user-select:none;-webkit-user-drag:none; }
.lightbox[aria-busy="true"] .image-counter::after { content:" · Loading…"; }
.lightbox figure>img[data-dragging="true"] { cursor:grabbing; }
@media (hover:hover) and (pointer:fine) {
  .button:hover { transform:translateY(-3px); }
  .button:hover span,.text-link:hover span { transform:translate(3px,-3px); }
  .button-pink:hover { background:#f6bad9; }
  .button-light:hover { background:var(--blush); }
  .button-dark:hover { background:var(--berry); }
  .social-link:hover { transform:translateY(-3px) rotate(-5deg); }
  .desktop-nav a:hover::after { transform:scaleX(1); }
  .gallery-item:hover img,.menu-card:hover .menu-photo img { transform:scale(1.04); }
  .gallery-item:hover .enlarge { transform:rotate(-7deg) scale(1.1);background:var(--pink); }
  .back-top:hover span { transform:translateY(-4px); }
  .lightbox-prev:hover { transform:translateX(-3px);background:#48313e; }
  .lightbox-next:hover { transform:translateX(3px);background:#48313e; }
}
@media (max-width:767px) {
  .waffle-stamp { width:108px;height:108px;right:24px;top:calc(var(--header-height) + 42px);bottom:auto; }
  .brand-ribbon { padding-block:17px; }
  .ribbon-group { gap:24px;padding-right:24px; }
  .ribbon-group span { font-size:30px; }
  .ribbon-group i { font-size:30px; }
  .ribbon-track { animation-duration:29s; }
  .cafe-moment { margin-bottom:20px;gap:12px; }
  .cafe-moment>svg { width:60px;height:56px; }
  .spark-one { width:64px;height:64px;left:auto;right:14px;top:22px;opacity:.38; }
  .spark-two { left:auto;right:12px;bottom:14px;width:38px;height:38px; }
  .waffle-outline { width:220px;height:220px;left:-120px;bottom:38%; }
  .brand-letter { animation-name:letter-wave-mobile; }
}
@media (max-height:650px) and (max-width:767px) {
  .hero-content { padding-bottom:205px; }
  .waffle-stamp { width:92px;height:92px;top:calc(var(--header-height) + 20px);right:20px;bottom:auto;left:auto; }
}
@keyframes turn { to { transform:rotate(360deg); } }
@keyframes stamp-float { 0%,100% { transform:translateY(0) rotate(-8deg); } 50% { transform:translateY(-12px) rotate(-3deg); } }
@keyframes ribbon-flow { to { transform:translateX(-50%); } }
@keyframes steam-rise { 0% { transform:translateY(5px);opacity:0; } 25%,55% { opacity:.85; } 100% { transform:translateY(-13px);opacity:0; } }
@keyframes berry-drift { from { transform:translate(-8%,5%) scale(.92); } to { transform:translate(30%,-10%) scale(1.12); } }
@keyframes waffle-drift { from { transform:translateY(15px) rotate(-24deg); } to { transform:translateY(-12px) rotate(8deg); } }
@keyframes spark-drift { 0%,100% { transform:translateY(0) rotate(0); } 50% { transform:translateY(-18px) rotate(35deg); } }
@keyframes letter-wave { 0%,55%,100% { transform:translateY(0); } 25% { transform:translateY(-10px); } }
@keyframes letter-wave-mobile { 0%,55%,100% { transform:translateY(0); } 25% { transform:translateY(-5px); } }
html[data-input="keyboard"] { scroll-behavior:auto; }
html[data-input="keyboard"] *,html[data-input="keyboard"] *::after { transition-duration:0s !important; }
html[data-motion="paused"] { scroll-behavior:auto; }
html[data-motion="paused"] *,html[data-motion="paused"] *::after { transition:none !important; }
html[data-motion="paused"] :is(.button,.text-link,.social-link,.close-button,.nav-toggle,.lightbox-prev,.lightbox-next,.menu-tabs button,.mobile-quickbar button,.mobile-quickbar a,.gallery-item img,.menu-photo img,.enlarge):is(:hover,:active),
html[data-motion="paused"] :is(.button,.text-link,.back-top):hover span { transform:none; }
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .ambient-motion { animation:none !important; }
  .steam-wisp { opacity:.75; }
  .stamp-float { transform:rotate(-8deg); }
  .waffle-outline { transform:rotate(-12deg); }
  .ribbon-track { transform:none; }
  :is(.button,.text-link,.social-link,.lightbox-prev,.lightbox-next,.gallery-item img,.menu-photo img,.enlarge):hover,
  :is(.button,.text-link,.back-top):hover span { transform:none; }
  html:not([data-input="keyboard"]) :is(.button,.text-link,.social-link,.close-button,.nav-toggle,.lightbox-prev,.lightbox-next,.menu-tabs button,.mobile-quickbar button,.mobile-quickbar a):active { transform:none; }
}
