/*
 * TAVERNA SPELL — EDITORIAL MOTION SYSTEM V4
 * CSS-first enhancements. Visuals are available without JS; reduced-motion is respected.
 * No third-party animation library, no canvases, no network-dependent effects.
 */
:root {
  --spell-ease: cubic-bezier(.19,1,.22,1);
  --spell-amber: #e7bb7e;
  --spell-pale: #fff2da;
  --spell-soft-line: rgba(219,170,107,.34);
}
html { scroll-padding-top: 104px; }
:where(a,button,input,select,textarea,summary):focus-visible {
  outline: 2px solid #f4ce94;
  outline-offset: 4px;
}
[hidden] { display: none !important; }

/* ═══ 01 — The atmosphere: alive, but never theatrical clutter ═══ */
.spell-cover-v3 { --hero-light-x: 68%; --hero-light-y: 40%; }
.spell-cover-v3 .cover-ambient {
  background: radial-gradient(ellipse 560px 490px at var(--hero-light-x) var(--hero-light-y),rgba(185,117,48,.105),transparent 79%),
              repeating-linear-gradient(90deg,transparent 0 170px,#dec08404 171px,transparent 174px);
}
.spell-cover-v3 .ambient-glow { animation: spellGlow 10s ease-in-out infinite alternate; }
@keyframes spellGlow {
  from { opacity: .5; transform: translate3d(-12px,6px,0) scale(.97); }
  to { opacity: 1; transform: translate3d(18px,-8px,0) scale(1.035); }
}
.cover-visual { perspective: 900px; }
.hero-main-photo img {
  transform: translate3d(var(--hero-move-x,0px),var(--hero-move-y,0px),0) scale(1.07);
  transition: transform 950ms var(--spell-ease), filter 950ms var(--spell-ease);
  will-change: auto;
}
.cover-visual:hover .hero-main-photo img { filter: saturate(.85) contrast(1.06) brightness(.93); }
.hero-inset-photo {
  transform: translate3d(var(--inset-move-x,0px),var(--inset-move-y,0px),0);
  transition: transform 1.1s var(--spell-ease), box-shadow .4s ease;
}
.cover-visual:hover .hero-inset-photo { box-shadow: 0 25px 65px #000d; }
.hero-halo {
  position:absolute; z-index:-1; width:83%; aspect-ratio:1; top:-8%; right:-5%;
  border-radius:50%; pointer-events:none; border: 1px solid rgba(214,161,88,.14);
  transform:rotate(-12deg);
}
.hero-halo:before {
  content:'';position:absolute;inset:13px;border:1px dashed rgba(214,161,88,.15);border-radius:50%;
}
.hero-halo:after { content:'';position:absolute;width:7px;height:7px;top:8%;left:20%;background:#b7874c;border-radius:50%;box-shadow:0 0 18px #deab5b8c; }
.hero-halo i {
  display:block;position:absolute;inset:-7px;border-radius:50%;border:1px solid transparent;
  border-top-color:rgba(233,184,115,.27);border-right-color:rgba(233,184,115,.07);
  animation:spellOrbit 50s linear infinite;
}
.hero-halo span {position:absolute;right:6%;bottom:26%;color:#d7a369a1;font:23px/1 var(--serif);}
@keyframes spellOrbit { to { transform:rotate(360deg); } }

/* Meaningful stagger at first visit, using composited transforms only */
@media(prefers-reduced-motion:no-preference){
  .ux-motion-ready .cover-kicker{animation:spellArrive .85s .02s var(--spell-ease) both}
  .ux-motion-ready .hero-small-mark{animation:spellArrive .85s .12s var(--spell-ease) both}
  .ux-motion-ready #cover-title{animation:spellArrive 1s .19s var(--spell-ease) both}
  .ux-motion-ready .cover-description{animation:spellArrive .9s .35s var(--spell-ease) both}
  .ux-motion-ready .cover-links{animation:spellArrive .95s .48s var(--spell-ease) both}
  .ux-motion-ready .cover-location{animation:spellArrive .9s .6s var(--spell-ease) both}
  .ux-motion-ready .cover-visual{animation:spellArrivePhoto 1.2s .16s var(--spell-ease) both}
  .ux-motion-ready .cover-floor{animation:spellFloor .9s .72s var(--spell-ease) both}
}
@keyframes spellArrive { from{opacity:0;transform:translate3d(0,28px,0)}to{opacity:1;transform:translate3d(0,0,0)} }
@keyframes spellArrivePhoto {from{opacity:0;transform:translate3d(24px,14px,0) scale(.97)}to{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@keyframes spellFloor {from{opacity:0}to{opacity:1}}

/* ═══ 02 — Scroll storytelling: applied only with working IntersectionObserver ═══ */
@media(prefers-reduced-motion:no-preference) {
 .ux-motion-ready [data-ux-reveal] {
   opacity:0;
   transform:translate3d(0,35px,0);
   transition:opacity .95s var(--spell-ease),transform .95s var(--spell-ease);
   transition-delay:var(--ux-delay,0ms);
 }
 .ux-motion-ready [data-ux-reveal="photo"] {transform:translate3d(0,23px,0) scale(.978);}
 .ux-motion-ready [data-ux-reveal].ux-visible { opacity:1;transform:translate3d(0,0,0) scale(1); }
 .ux-motion-ready [data-ux-reveal="heading"]{transform:translate3d(0,22px,0);}
 .ux-motion-ready [data-ux-reveal="heading"].ux-visible{transform:none;}
}

/* ═══ 03 — The menu knows where the reader is ═══ */
.site-header .desktop-nav a {position:relative;transition:color .22s ease;}
.site-header .desktop-nav a:after {
  content:'';position:absolute;bottom:-14px;left:0;right:100%;height:1px;
  background:linear-gradient(90deg,#ad783f,#f6d59f);transition:right .45s var(--spell-ease);
}
.site-header .desktop-nav a:hover:after,.site-header .desktop-nav a.ux-current:after{right:0;}
.site-header .desktop-nav a.ux-current{color:var(--spell-amber);}
.site-header .nav-book {position:relative;overflow:hidden;isolation:isolate;transition:background .26s,box-shadow .32s, transform .42s var(--spell-ease);}
.site-header .nav-book:before,.medieval-button.solid:before,.btn-gold:before {
  content:'';position:absolute;top:-110%;left:-75%;width:45%;height:320%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.39),transparent);
  transform:rotate(24deg) translate3d(0,0,0);pointer-events:none;
}
.site-header .nav-book:hover:before,.medieval-button.solid:hover:before,.btn-gold:hover:before {
  animation:spellShine .8s ease-out both;
}
@keyframes spellShine {to{left:160%;}}
.site-header .nav-book:hover {box-shadow:0 10px 28px rgba(205,144,63,.17);}
.medieval-button.solid,.btn-gold {position:relative;overflow:hidden;isolation:isolate;transition:transform .35s var(--spell-ease),box-shadow .35s var(--spell-ease),background .3s ease;}
.medieval-button.solid:hover,.btn-gold:hover{box-shadow:0 13px 42px rgba(211,146,70,.25);transform:translateY(-2px)}
.medieval-button span:last-child,.banquet-action span:last-child,.cover-discover span {transition:transform .35s var(--spell-ease)}
.medieval-button:hover span:last-child,.banquet-action:hover span:last-child,.cover-discover:hover span {transform:translate3d(4px,-1px,0)}

/* ═══ 04 — Candlelight follows the pointer over photograph cards ═══ */
.experience-tile,.royal-feasts .banquet-card,.story-photographs-grid figure {position:relative;isolation:isolate;}
.experience-tile:after,.royal-feasts .banquet-card:after {
  content:'';display:block;position:absolute;inset:0;z-index:2;pointer-events:none;
  background:radial-gradient(420px circle at var(--card-x,50%) var(--card-y,50%),rgba(245,189,114,.14),transparent 55%);
  opacity:0;transition:opacity .4s ease;
}
.experience-tile:hover:after,.royal-feasts .banquet-card:hover:after{opacity:1;}
.experience-tile:after{border:1px solid transparent;}
.tile-image{overflow:hidden;}
.tile-image img{transition:transform 1.1s var(--spell-ease),filter .7s ease;}
.experience-tile:hover .tile-image img{transform:scale(1.065);filter:saturate(1.03) contrast(1.035) brightness(.96);}
.royal-feasts .banquet-card{transition:transform .44s var(--spell-ease), border-color .35s ease,box-shadow .35s ease;}
.royal-feasts .banquet-card:hover{transform:translate3d(0,-7px,0);box-shadow:0 26px 65px #0009;border-color:#bb8e56;}
.story-photographs-grid figure:before{
  content:'+';position:absolute;right:17px;top:17px;width:40px;height:40px;border:1px solid rgba(245,209,163,.5);
  background:rgba(17,9,6,.68);z-index:4;color:#ffe1b6;font:32px/37px var(--serif);text-align:center;
  pointer-events:none;opacity:0;transform:scale(.8);transition:opacity .4s,transform .45s var(--spell-ease);
}
.story-photographs-grid figure:hover:before{opacity:1;transform:scale(1);}
.story-photographs-grid img{transition:transform 1.2s var(--spell-ease),filter .5s ease;}
.story-photographs-grid figure:hover img{transform:scale(1.07);filter:brightness(1.05)}

/* Individual menu lines bloom, rather than whole-page movement */
.dish-item {transition:background .32s ease,box-shadow .32s ease;}
.dish-item:hover{background:rgba(133,83,35,.08);box-shadow:inset 3px 0 0 rgba(135,83,42,.38)}
.dish-item .dish-icon{transition:transform .5s var(--spell-ease)}
.dish-item:hover .dish-icon{transform:rotate(-15deg) scale(1.15)}
.questions-list details[open]{background:linear-gradient(90deg,rgba(214,159,90,.055),transparent 84%)}
.questions-list summary{transition:color .25s ease,padding-left .3s var(--spell-ease)}
.questions-list summary:hover{color:#ffc990;padding-left:8px}
.questions-list details[open] summary{color:#ecc28e}
@media(prefers-reduced-motion:no-preference) {
  .questions-list details[open] p{animation:spellFaq .4s var(--spell-ease) both}
}
@keyframes spellFaq {from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}

/* ═══ 05 — Reservation flow as a journey, not a generic form ═══ */
#booking-view .stepper{position:relative;isolation:isolate;}
#booking-view .stepper:after {
  content:'';position:absolute;left:0;right:0;bottom:-2px;height:2px;
  background:linear-gradient(90deg,#dcac74,#f1d2a3) left / var(--ux-progress,0%) 100% no-repeat;
  pointer-events:none;transition:background-size .7s var(--spell-ease);
}
#booking-view .stepper .step {transition:color .3s,opacity .3s;}
#booking-view .stepper .step.ux-complete{color:#ddbc91;opacity:.89;}
#booking-view .stepper .step.ux-complete b{border-color:#9e7a4d;background:#4d331c;color:#ffe0b5;}
#booking-view .stepper .step.ux-complete b:after{content:'✓';font:600 9px var(--sans);margin-left:5px;}
#booking-view .choice-card{position:relative;overflow:hidden;transition:background .3s,border-color .3s,transform .42s var(--spell-ease),box-shadow .3s;}
#booking-view .choice-card:after {
  content:'';position:absolute;inset:0;opacity:0;pointer-events:none;
  background:radial-gradient(circle at var(--card-x,50%) var(--card-y,50%),rgba(220,168,100,.11),transparent 62%);
  transition:opacity .3s;
}
#booking-view .choice-card:hover{transform:translateY(-3px);box-shadow:0 16px 35px #0005;}
#booking-view .choice-card:hover:after{opacity:1;}
#booking-view .choice-card.selected{box-shadow:0 0 0 1px rgba(239,192,130,.21),0 11px 29px #0005;}
#booking-view .form-step.ux-step-enter{animation:spellStep .6s var(--spell-ease) both;}
@keyframes spellStep{from{opacity:0;transform:translate3d(0,15px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
#booking-view .time-slot{position:relative;overflow:hidden;transition:transform .27s var(--spell-ease),background .25s,border-color .25s,color .25s,box-shadow .3s;}
#booking-view .time-slot:not(:disabled):hover{transform:translateY(-3px);box-shadow:0 9px 18px rgba(0,0,0,.25);}
#booking-view .time-slot.selected{box-shadow:0 0 0 2px rgba(236,190,122,.42),0 8px 18px rgba(0,0,0,.18)}
#booking-view .time-slot.selected:after{content:'✓';position:absolute;top:4px;right:7px;color:inherit;font:700 11px var(--sans);}
.ux-slot-selection {
  display:flex;align-items:center;gap:10px;padding:13px 16px 13px 14px;
  font:500 12px/1.55 var(--sans);color:#b8a08a;border:1px solid rgba(203,157,101,.21);
  background:linear-gradient(90deg,rgba(101,65,33,.18),transparent);margin:18px 0 4px;
  transition:background .35s,border-color .35s,color .35s;
}
.ux-slot-selection>span:first-child{font:21px/1 var(--serif);color:#b88f60;}
.ux-slot-selection.ux-picked{color:#e8c99b;background:rgba(132,84,40,.17);border-color:rgba(220,172,108,.5)}
.ux-slot-selection.ux-picked>span:first-child{color:#f3c689;}
#booking-view .input:focus {border-color:#c39864;box-shadow:0 0 0 3px rgba(218,162,93,.12);outline:none;transition:border-color .2s,box-shadow .2s;}
#booking-view .booking-review{position:relative;overflow:hidden;}
#booking-view .booking-review:before{content:'';position:absolute;top:0;bottom:0;left:0;width:2px;background:linear-gradient(#e3bc88,#ac7440);}
#booking-view .success-panel .success-symbol {display:block;animation:spellSuccess 1s var(--spell-ease) both;}
@keyframes spellSuccess{from{opacity:0;transform:scale(.7) rotate(-30deg)}to{opacity:1;transform:scale(1) rotate(0)}}

/* ═══ 06 — Better photograph lightbox ═══ */
.spell-photo-dialog{border-color:#c09a6a;border-radius:3px;overflow:visible;}
.spell-photo-dialog[open]{animation:spellDialog .36s var(--spell-ease) both;}
@keyframes spellDialog{from{opacity:0;transform:translateY(13px) scale(.975)}to{opacity:1;transform:translateY(0) scale(1)}}
.spell-photo-dialog img{border:1px solid #77533437;touch-action:pan-y;max-height:calc(72dvh - 50px);}
.ux-gallery-toolbar {display:grid;grid-template-columns:48px minmax(0,1fr) 48px;align-items:center;gap:11px;margin:14px 5px 0;}
.ux-gallery-arrow{width:45px;height:45px;border:1px solid #997046a3;background:#291a12;color:#f7d5a7;font:22px/1 var(--serif);transition:background .2s,transform .2s;cursor:pointer;}
.ux-gallery-arrow:hover{background:#50351d;transform:translateY(-2px)}
.ux-gallery-meta{text-align:center;min-width:0;}
.ux-gallery-meta>span{font:700 9px/1.5 var(--sans);letter-spacing:.2em;color:#c79e6b}
.ux-gallery-meta p{margin:2px 0 0;font-size:18px}

/* ═══ 07 — Mobile navigation gets a soft backdrop and directional movement ═══ */
.ux-mobile-scrim {position:fixed;inset:0;z-index:95;background:rgba(7,4,3,.6);backdrop-filter:blur(3px);border:0;cursor:default;}
.ux-menu-open{overflow:hidden;}
@media (max-width: 930px){
  .site-header .mobile-nav:not([hidden]){animation:spellMenu .35s var(--spell-ease) both;}
  .site-header .mobile-nav:not([hidden]) a{animation:spellMenuLink .38s var(--spell-ease) both;animation-delay:calc(var(--link-i,0) * 45ms)}
}
@keyframes spellMenu{from{opacity:0;transform:translateY(-9px)}to{opacity:1;transform:none}}
@keyframes spellMenuLink{from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:translateX(0)}}
/* Never let a mobile shortcut obscure the form or the open menu. */
.ux-menu-open .mobile-quick-book{opacity:0!important;pointer-events:none!important;}
body[data-page="/reservar"] .mobile-quick-book,body[data-page="/admin"] .mobile-quick-book,body[data-page="/privacidade"] .mobile-quick-book{display:none!important}

@media (max-width: 690px) {
  .hero-halo{width:94%;right:-3%;top:-3%;}
  .spell-cover-v3 .cover-description{letter-spacing:.003em}
  .site-header .desktop-nav a:after{display:none}
  .ux-gallery-toolbar{grid-template-columns:40px minmax(0,1fr) 40px;gap:5px;margin:9px 0 0}
  .ux-gallery-arrow{width:39px;height:39px}
  .ux-gallery-meta p{font-size:16px}
  .story-photographs-grid figure:before{opacity:1;transform:scale(1);width:31px;height:31px;line-height:29px;font-size:24px}
  #booking-view .choice-card:hover{transform:none}
}
@media (hover:none) {
  .experience-tile:hover,.royal-feasts .banquet-card:hover,.medieval-button.solid:hover {transform:none;}
  .experience-tile:after,.royal-feasts .banquet-card:after{display:none;}
}
@media (prefers-reduced-motion:reduce) {
  html{scroll-behavior:auto!important}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .ux-motion-ready [data-ux-reveal]{opacity:1!important;transform:none!important}
  .hero-main-photo img,.hero-inset-photo{transform:none!important}
  .ambient-glow,.hero-halo i{animation:none!important}
}
@media print{
  [data-ux-reveal]{opacity:1!important;transform:none!important}
  .mobile-quick-book,.ux-mobile-scrim{display:none!important}
}