/*
 SABORES DE DOÑA LILIAN · CINEMATIC 2026
 Progressive enhancement: content stays visible without JavaScript.
 All continuous effects pause on reduced motion, hidden tabs, or offscreen.
*/
:root{--cinema-ease:cubic-bezier(.19,1,.22,1);--cinema-gold:#e7b884}
/* Overture: the page arrives like an editorial film */
body.motion-enhanced .hero__copy>.eyebrow{animation:cinemaFade .85s .12s both}
body.motion-enhanced .hero h1>span,body.motion-enhanced .hero h1>em{display:block;animation:cinemaTitle 1.15s both;transform-origin:left bottom}
body.motion-enhanced .hero h1>span:nth-child(1){animation-delay:.20s}
body.motion-enhanced .hero h1>span:nth-child(2){animation-delay:.33s}
body.motion-enhanced .hero h1>em{animation-delay:.48s}
body.motion-enhanced .hero__intro{animation:cinemaFade 1s .66s both}
body.motion-enhanced .hero__buttons{animation:cinemaFade 1s .79s both}
body.motion-enhanced .hero__ministats{animation:cinemaFade .9s 1s both}
body.motion-enhanced .hero__arch{animation:cinemaArch 1.8s .22s both}
body.motion-enhanced .hero__book-mini{animation:cinemaBook 1.35s .72s backwards}
body.motion-enhanced .hero__seal{animation:cinemaSeal 1.2s 1.03s backwards}
body.motion-enhanced .hero__visual-caption{animation:cinemaFade 1.05s 1s both}
@keyframes cinemaTitle{from{opacity:0;transform:translate3d(0,70px,0) skewY(5deg);filter:blur(11px)}to{opacity:1;transform:translate3d(0,0,0) skewY(0);filter:blur(0)}}
@keyframes cinemaFade{from{opacity:0;transform:translateY(22px);filter:blur(5px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
@keyframes cinemaArch{from{opacity:0;transform:translateY(68px) scale(.89);filter:blur(16px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}
@keyframes cinemaBook{from{opacity:0;transform:rotate(-24deg) translate(-42px,75px) scale(.84)}to{opacity:1;transform:rotate(-10deg) translate(0,0) scale(1)}}
@keyframes cinemaSeal{from{opacity:0;transform:rotate(-44deg) scale(.6)}to{opacity:1;transform:rotate(13deg) scale(1)}}
/* Atmosphere: GPU-friendly stars and delicate botanical orbits */
.mood-canvas{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none;z-index:7;opacity:.84;mix-blend-mode:screen}
.hero__visual{transform:translate3d(var(--hover-x,0px),var(--hover-y,0px),0);transition:transform .55s var(--cinema-ease)}
.hero__orbit{position:absolute;pointer-events:none;z-index:3;border:1px solid rgba(237,210,154,.35);border-top-color:rgba(255,242,210,.75);border-radius:50%;animation:cinemaOrbit 32s linear infinite}
.hero__orbit::before{content:"";position:absolute;width:8px;height:8px;border-radius:100%;background:#f1ba7b;top:18%;left:13%;box-shadow:0 0 0 7px rgba(231,184,132,.08),0 0 25px 8px rgba(231,184,132,.3)}
.hero__orbit--one{width:125%;height:91%;top:1%;left:-8%;transform:rotate(-20deg)}
.hero__orbit--two{width:86%;height:69%;top:9%;left:13%;animation-duration:43s;animation-direction:reverse;border-color:rgba(249,228,185,.16)}
.hero__orbit--two::before{width:5px;height:5px;top:62%;left:8%}
@keyframes cinemaOrbit{from{rotate:0deg}to{rotate:360deg}}
.hero__halo{animation:haloBreathe 8s ease-in-out infinite alternate}
@keyframes haloBreathe{from{opacity:.55;scale:.93}to{opacity:1;scale:1.06}}
.hero__seal>span{display:inline-block;animation:sealPulse 7s ease-in-out infinite alternate}
@keyframes sealPulse{from{rotate:-8deg}to{rotate:20deg}}
/* Headline reveal with staggered ink rising from the page */
.ink-word{display:inline-block;overflow:hidden;vertical-align:baseline;padding-bottom:.11em;margin-bottom:-.11em}
.ink-word__inner{display:inline-block;transform:translate3d(0,112%,0) rotate(2deg);opacity:.07;will-change:transform}
.ink-visible .ink-word__inner{animation:inkRise 1.08s var(--cinema-ease) both;animation-delay:calc(min(var(--word-i),12) * 75ms)}
@keyframes inkRise{from{opacity:.08;transform:translate3d(0,110%,0) rotate(3deg)}to{opacity:1;transform:translate3d(0,0,0) rotate(0)}}
.ink-flourish{display:block;overflow:visible;width:clamp(145px,23vw,290px);height:23px;margin:5px 0 0 auto;color:#b67b52}
.ink-flourish path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.75s 0.55s var(--cinema-ease)}
.ink-visible .ink-flourish path{stroke-dashoffset:0}
/* Editorial photo reveal: curtain unveils real family imagery */
.film-reveal{position:relative;isolation:isolate}
.film-curtain{position:absolute;inset:-1px;z-index:11;pointer-events:none;background:var(--film-color,#c7a279);transition:transform 1.28s var(--cinema-ease);transform-origin:top}
.film-reveal.film-shown .film-curtain{transform:translate3d(0,-102%,0)}
.film-reveal:not(.film-shown){filter:saturate(.88)}
.film-reveal.film-shown{filter:none;transition:filter 1s}
/* recipe cards: low-angle levitation + carefully eased entrance */
body.motion-enhanced .recipe-card:not(.card-ready){opacity:0;transform:translate3d(0,50px,0) scale(.965)}
body.motion-enhanced .recipe-card.card-ready{animation:cardRise .85s var(--cinema-ease) backwards;animation-delay:var(--stagger,0ms)}
@keyframes cardRise{from{opacity:0;transform:translate3d(0,52px,0) scale(.96)}to{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@media(hover:hover) and (pointer:fine){
 .recipe-card{transition:transform .45s var(--cinema-ease)}
 .recipe-card:hover{transform:translateY(-8px)}
 .recipe-card__image{isolation:isolate;transform-style:preserve-3d;transition:transform .42s var(--cinema-ease),box-shadow .5s}
 .recipe-card__image.is-tilting{transform:perspective(950px) rotateX(var(--card-rx,0deg)) rotateY(var(--card-ry,0deg));box-shadow:0 24px 46px rgba(40,35,22,.17)}
 .recipe-card__image::before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:radial-gradient(circle at var(--light-x,50%) var(--light-y,50%),rgba(255,247,204,.24),transparent 48%);opacity:0;transition:opacity .45s}
 .recipe-card__image:hover::before{opacity:1}
 .recipe-card__image:active{transform:perspective(950px) scale(.975)}
}
/* Visual depth without hijacking clicks or layout */
.cinema-depth{overflow:hidden}
.cinema-depth>img{transform:translate3d(0,var(--cinema-shift,0px),0) scale(1.10);transition:filter .7s}
.cinema-depth.gallery__photo:hover>img{transform:translate3d(0,var(--cinema-shift,0px),0) scale(1.17)}
.cinema-depth.season__image>img{position:absolute}
/* Chapter transitions and reactions */
.section-rule{width:68px;height:1px;background:var(--clay);transform:scaleX(0);transform-origin:left;transition:transform 1.3s .3s var(--cinema-ease);margin:0 0 15px}
.section-rule.is-drawn{transform:scaleX(1)}
.eyebrow__dot{animation:dotBreath 3s ease-in-out infinite}
@keyframes dotBreath{0%,100%{box-shadow:0 0 0 0 rgba(205,115,63,.32)}50%{box-shadow:0 0 0 6px rgba(205,115,63,0)}}
/* Re-energize daily ritual and book reveal */
.daily__ticket{animation:ticketFloat 5.8s ease-in-out infinite alternate}
@keyframes ticketFloat{from{transform:rotate(-6deg) translateY(0)}to{transform:rotate(-4deg) translateY(-12px)}}
.book__circle{animation:bookHalo 20s linear infinite}
@keyframes bookHalo{from{rotate:0deg}to{rotate:360deg}}
.book__mockup:after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(105deg,transparent 24%,rgba(255,247,223,.27) 43%,transparent 59%);transform:translateX(-155%);transition:transform 1.65s .45s var(--cinema-ease)}
.book__visual.book-lit .book__mockup:after{transform:translateX(155%)}
/* Tactile action feedback */
.btn,.nav-buy,.text-link,.mobile-nav__buy{position:relative;isolation:isolate;overflow:hidden}
.cinema-ripple{position:absolute;z-index:-1;pointer-events:none;border-radius:100%;width:24px;height:24px;left:var(--ripple-x,50%);top:var(--ripple-y,50%);margin:-12px 0 0 -12px;background:rgba(255,255,255,.28);transform:scale(0);animation:rippleOut .7s ease-out forwards}
@keyframes rippleOut{to{transform:scale(22);opacity:0}}
/* A charming little scroll progress bloom */
.top-progress{background:linear-gradient(90deg,#a96a42,#f3cba0 60%,#d3844b);box-shadow:0 0 12px rgba(255,187,116,.5)}
.motion-control{position:fixed;bottom:22px;left:22px;z-index:145;display:flex;gap:9px;align-items:center;padding:11px 13px;border-radius:40px;background:rgba(16,33,25,.89);border:1px solid rgba(240,223,183,.37);color:#f9eed7;font-size:10px;letter-spacing:.11em;font-weight:700;box-shadow:0 10px 32px rgba(0,0,0,.14);backdrop-filter:blur(12px);transition:transform .35s,background .35s;cursor:pointer}
.motion-control:hover{transform:translateY(-3px);background:#283e32}
.motion-control .motion-indicator{width:9px;height:9px;border-radius:50%;background:#d7a06a;box-shadow:0 0 0 3px rgba(215,160,106,.14)}
.motion-control[aria-pressed="true"] .motion-indicator{background:#7ad9a0;box-shadow:0 0 0 3px rgba(122,217,160,.14)}
.motion-control:focus-visible{outline:3px solid #eba361;outline-offset:3px}
/* Override all JS-driven enhancements when motion disabled */
body.motion-off .mood-canvas,body.motion-off .hero__orbit{display:none}
body.motion-off .hero__visual{transform:none!important}
body.motion-off .film-curtain{display:none}
body.motion-off .ink-word__inner{transform:none!important;opacity:1!important;animation:none!important}
body.motion-off .recipe-card{opacity:1!important;transform:none!important;animation:none!important}
body.motion-off .cinema-depth>img{transform:none!important}
body.motion-off .section-rule{transform:scaleX(1)!important}
body.motion-off .ink-flourish path{stroke-dashoffset:0!important}
body.motion-off .daily__ticket,body.motion-off .hero__dish,body.motion-off .ticker__track,body.motion-off .hero__halo,body.motion-off .hero__seal>span,body.motion-off .book__circle{animation:none!important}
body.motion-off .hero__copy *,body.motion-off .hero__arch,body.motion-off .hero__book-mini,body.motion-off .hero__seal{animation:none!important}
body.motion-off .eyebrow__dot{animation:none}
@media(max-width:760px){
 .mood-canvas{opacity:.52}
 .hero__orbit--one{left:-4%;width:97%;height:84%;top:3%}
 .hero__orbit--two{left:16%;width:73%;height:65%}
 .motion-control{bottom:79px;left:12px;padding:8px 10px;font-size:9px;box-shadow:0 3px 15px rgba(0,0,0,.12)}
 body.motion-enhanced .hero h1>span,body.motion-enhanced .hero h1>em{animation-duration:.9s}
 .cinema-depth>img{transform:translate3d(0,var(--cinema-shift,0px),0) scale(1.08)}
 .film-curtain{transition-duration:.9s}
}
@media(max-width:375px){.motion-control{bottom:70px;left:7px;font-size:8px;letter-spacing:0}}
@media(prefers-reduced-motion:reduce){
 .mood-canvas,.hero__orbit{display:none!important}
 body.motion-enhanced *,body.motion-enhanced *::before,body.motion-enhanced *::after{animation:none!important;transition-duration:0.01ms!important}
 .ink-word__inner{transform:none!important;opacity:1!important}
 .film-curtain{display:none!important}
 .recipe-card{opacity:1!important;transform:none!important}
 .cinema-depth>img{transform:none!important}
 .ink-flourish path{stroke-dashoffset:0!important}
}