@font-face{font-family:'DM Sans';font-style:normal;font-weight:100 1000;font-display:swap;src:url('fonts/dm-sans-latin-wght-normal.woff2') format('woff2')}/* styles.css */
:root{--ink:#18252a;--cream:#f2ede4;--paper:#fff;--rust:#a94729;--gold:#d4a14c;--line:rgba(24,37,42,.2);--max:1240px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--cream);font-family:'DM Sans',sans-serif;font-size:16px;line-height:1.55}a{color:inherit;text-decoration:none}button{font:inherit}.site-header{align-items:center;background:#fff;display:flex;height:144px;justify-content:space-between;padding:0 max(7vw,32px);position:relative;z-index:30}.brand img{display:block;height:92px;width:92px;object-fit:contain}.menu-toggle{background:none;border:0;cursor:pointer;display:grid;gap:6px;padding:12px;position:relative;width:52px;z-index:35}.menu-toggle span{background:#40515a;display:block;height:3px;transition:.25s;width:36px}.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(9px) rotate(45deg)}.menu-toggle[aria-expanded=true] span:nth-child(2){opacity:0}.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-9px) rotate(-45deg)}.mobile-nav{align-content:center;background:var(--ink);color:#fff;display:grid;gap:20px;height:100vh;justify-items:start;opacity:0;padding:144px max(7vw,52px) 80px;pointer-events:none;position:fixed;right:0;top:0;transform:translateX(100%);transition:transform .4s cubic-bezier(.76,0,.24,1),opacity .25s;width:min(500px,100vw);z-index:25}.mobile-nav:before{color:var(--gold);content:'Grupo aquí es Oaxaca';font-size:11px;font-weight:700;left:max(7vw,52px);letter-spacing:.18em;position:absolute;text-transform:uppercase;top:150px}.mobile-nav.is-open{opacity:1;pointer-events:auto;transform:translateX(0)}.mobile-nav a{border-bottom:1px solid rgba(255,255,255,.25);font-size:clamp(2.8rem,6vw,4.7rem);font-weight:500;letter-spacing:-.05em;line-height:1.05;padding:12px 0 20px;width:100%}.mobile-nav a:after{color:var(--gold);content:'→';float:right;font-size:1.7rem;margin-top:.18em}.mobile-nav a:hover{color:var(--gold)}.outline-button{border:1px solid currentColor;display:inline-block;font-size:12px;font-weight:700;letter-spacing:.14em;padding:16px 24px;text-transform:uppercase;transition:.2s}.outline-button:hover{background:#fff;color:var(--ink)}.section-shell{margin:0 auto;max-width:var(--max);padding:clamp(88px,11vw,160px) max(5vw,28px)}.story{align-items:center;display:grid;gap:clamp(42px,8vw,130px);grid-template-columns:1fr 1fr}.eyebrow,.card-kicker{font-size:11px;font-weight:700;letter-spacing:.18em;margin:0 0 18px;text-transform:uppercase}.story h2,.section-heading h2,.shop h2{font-size:clamp(2.5rem,5vw,5.5rem);letter-spacing:-.05em;line-height:1.02;margin:0 0 30px}.story-copy>p:not(.eyebrow){max-width:580px}.story-image{aspect-ratio:4/5;background:linear-gradient(0deg,rgba(0,0,0,.12),transparent),url('nuestrahistoria-web.jpg') center/cover}.text-link{border-bottom:1px solid currentColor;display:inline-block;font-size:12px;font-weight:700;letter-spacing:.13em;margin-top:18px;padding-bottom:8px;text-transform:uppercase}.text-link span,.card-link span{font-size:18px;margin-left:7px}.spaces{padding-top:0}.section-heading{align-items:end;display:flex;justify-content:space-between;margin-bottom:42px}.section-heading h2{margin:0}.card-bottom{align-items:end;display:flex;justify-content:space-between}.socials,.footer-socials{display:flex;gap:14px}.socials a,.footer-socials a{align-items:center;border:1px solid currentColor;border-radius:50%;display:flex;font-size:15px;height:31px;justify-content:center;width:31px}.card-link{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.shop{align-items:start;background:var(--paper);display:grid;gap:clamp(45px,8vw,130px);grid-template-columns:.75fr 1.25fr;max-width:none;padding-left:max(7vw,32px);padding-right:max(7vw,32px)}.shop-intro{max-width:440px}.shop h2{font-size:clamp(2.5rem,4vw,4.7rem)}.shop-intro>p:not(.eyebrow){margin-bottom:34px}.outline-button--dark:hover{background:var(--ink);color:#fff}.product-grid{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}.product-card{align-items:flex-end;background-position:center;background-size:cover;color:#fff;display:flex;min-height:330px;padding:28px;position:relative}.product-card:before{background:linear-gradient(0deg,rgba(0,0,0,.7),transparent 62%);content:'';inset:0;position:absolute}.product-card>div{position:relative}.product-card--mole{background-image:url('platillos/tlayuda-doblada-grande.jpg')}.product-card span{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.product-card h3{font-size:clamp(1.8rem,3vw,3rem);letter-spacing:-.05em;line-height:1;margin:7px 0}.product-card p{margin:0}.site-footer{align-items:center;background:#1d2f33;color:#fff;display:grid;gap:28px;grid-template-columns:1fr 1fr 1fr;padding:65px max(7vw,32px)}.footer-brand img{filter:grayscale(1) brightness(0) invert(1);height:63px;width:63px}.site-footer nav{display:flex;gap:25px}.site-footer nav a{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.site-footer>p{font-size:12px;grid-column:1/-1;margin:12px 0 0;opacity:.7}.footer-socials{justify-content:end}@media(max-width:800px){.site-header{height:105px}.brand img{height:70px;width:70px}.mobile-nav{padding-left:32px;padding-right:32px}.mobile-nav:before{left:32px;top:112px}.story,.shop{grid-template-columns:1fr}.story-image{max-width:600px}.section-heading{display:block}.product-grid{grid-template-columns:1fr}.site-footer{grid-template-columns:1fr 1fr}.footer-socials{justify-content:start}}/* nav-overrides.css */
/* Floating navigation inspired by the Irish Cafe reference layout. */
.site-header{
  align-items: center;
  background: #fff9f5;
  border: 1px solid rgba(66, 42, 34, .12);
  border-radius: 24px;
  box-shadow: 0 16px 42px rgba(28, 14, 9, .22);
  height: 76px;
  left: 50%;
  padding: 0 24px;
  position: fixed;
  top: 24px;
  transform: translateX(-50%);
  width: min(1100px, calc(100% - 48px));
  z-index: 40;
}.site-header .brand{
  order: 1;
}.site-header .brand img{
  height: 56px;
  width: 56px;
}.site-header .menu-toggle{
  display: none;
}.mobile-nav{
  align-items: center;
  background: transparent;
  color: #422a22;
  display: flex;
  gap: clamp(18px, 3vw, 42px);
  height: auto;
  justify-content: center;
  left: auto;
  opacity: 1;
  order: 2;
  padding: 0;
  pointer-events: auto;
  position: static;
  transform: none;
  width: auto;
}.mobile-nav:before,
.mobile-nav a:after{
  display: none;
}.mobile-nav a{
  border: 0;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .12em;
  line-height: 1;
  padding: 10px 0;
  text-transform: uppercase;
  width: auto;
}.mobile-nav a:hover{
  color: #a94729;
}.contact-button{
  align-items: center;
  background: #2A0E04;
  border-radius: 999px;
  color: #fff9f5;
  display: inline-flex;
  font-size: 11px;
  font-weight: 700;
  gap: 12px;
  justify-content: center;
  letter-spacing: .1em;
  order: 3;
  padding: 14px 18px;
  text-transform: uppercase;
  transition: background .2s, color .2s;
  white-space: nowrap;
}.contact-button:hover{
  background: #422a22;
}.contact-button span{
  font-size: 17px;
  line-height: 0;
}.site-header{
  transition: height .45s cubic-bezier(.22, 1, .36, 1),
    padding .45s cubic-bezier(.22, 1, .36, 1),
    top .45s cubic-bezier(.22, 1, .36, 1),
    width .45s cubic-bezier(.22, 1, .36, 1),
    box-shadow .45s ease;
}.site-header .brand img,
.site-header .menu-toggle,
.site-header .menu-toggle span,
.mobile-nav,
.mobile-nav a,
.contact-button{
  transition: all .45s cubic-bezier(.22, 1, .36, 1);
}.site-header.is-scrolled{
  box-shadow: 0 10px 28px rgba(28, 14, 9, .16);
  height: 62px;
  padding-left: 18px;
  padding-right: 18px;
  top: 14px;
  width: min(720px, calc(100% - 48px));
}.site-header.is-scrolled .brand img{
  height: 44px;
  width: 44px;
}.site-header.is-scrolled .mobile-nav{
  gap: 18px;
}.site-header.is-scrolled .contact-button{
  padding: 10px 13px;
}@media (max-width: 800px){.site-header{
    border-radius: 18px;
    height: 72px;
    top: 18px;
    width: calc(100% - 36px);
  }.site-header.is-scrolled{
    height: 62px;
    top: 10px;
    width: calc(100% - 48px);
  }.site-header .brand img{
    height: 54px;
    width: 54px;
  }.site-header .menu-toggle{
    align-items: center;
    border: 0;
    border-radius: 0;
    display: flex;
    flex-direction: column;
    gap: 7px;
    height: 50px;
    justify-content: center;
    order: 3;
    padding: 0;
    width: 58px;
  }.site-header .menu-toggle span{
    background: #422a22;
    height: 3px;
    width: 44px;
  }.site-header .menu-toggle[aria-expanded=true] span:first-child{
    transform: translateY(6px) rotate(45deg);
  }.site-header .menu-toggle[aria-expanded=true] span:last-child{
    transform: translateY(-6px) rotate(-45deg);
  }.mobile-nav{
    align-content: center;
    background: #fff9f5;
    display: grid;
    gap: 20px;
    height: 100vh;
    justify-items: start;
    left: auto;
    opacity: 0;
    order: initial;
    padding: 144px 32px 80px;
    pointer-events: none;
    position: fixed;
    right: 0;
    top: 0;
    transform: translateX(100%);
    width: min(500px, 100vw);
    z-index: 35;
  }.mobile-nav:before{
    color: #e1b75d;
    display: block;
    left: 32px;
    top: 112px;
  }.mobile-nav.is-open{
    opacity: 1;
    pointer-events: auto;
    transform: translateX(0);
  }.mobile-nav a{
    border-bottom: 1px solid rgba(66, 42, 34, .25);
    font-size: clamp(2.8rem, 6vw, 4.7rem);
    font-weight: 500;
    letter-spacing: -.05em;
    line-height: 1.05;
    padding: 12px 0 20px;
    text-transform: none;
    width: 100%;
  }.mobile-nav a:after{
    color: #e1b75d;
    display: block;
  }.contact-button{
    display: none;
  }
}/* intro-loader.css */
:root{--loader-brown:#2A0E04;--loader-cream:#fff9f5}.site-loader{align-items:center;background:transparent;color:var(--loader-cream);display:flex;inset:0;justify-content:center;overflow:hidden;position:fixed;transition:visibility 0s linear 1s;z-index:100}.site-loader:before,.site-loader:after{background:var(--loader-brown);content:'';height:50%;left:0;position:absolute;right:0;transition:transform 1s cubic-bezier(.76,0,.24,1)}.site-loader:before{top:0}.site-loader:after{bottom:0}.site-loader.is-hidden{clip-path:none;visibility:hidden}.site-loader.is-hidden:before{transform:translateY(-100%)}.site-loader.is-hidden:after{transform:translateY(100%)}.site-loader.is-hidden .loader-mark{opacity:0;transform:translateY(0) scale(.97);transition:opacity .65s ease,transform .65s ease}.loader-mark{align-items:center;display:flex;flex-direction:column;gap:20px;opacity:0;position:relative;transform:translateY(18px);z-index:1;animation:loader-mark-in .8s .1s forwards}.loader-mark img{height:96px;object-fit:contain;width:96px}.loader-mark span:not(.loader-line){font-size:clamp(1.25rem,3vw,2rem);font-weight:600;letter-spacing:.08em;text-align:center;text-transform:uppercase}.loader-line{background:var(--loader-cream);display:block;height:2px;margin-top:-8px;position:static;transform:scaleX(0);transform-origin:center;width:min(220px,40vw);animation:loader-line-in 1.1s .15s forwards}@keyframes loader-mark-in{to{opacity:1;transform:translateY(0)}}@keyframes loader-line-in{to{transform:scaleX(1)}}@media(prefers-reduced-motion:reduce){.site-loader{transition:none}.loader-mark{animation:none;opacity:1;transform:none}.loader-line{animation:none;transform:none}}/* intro-loader-effects.css */
.loader-mark img,.loader-mark span:not(.loader-line),.loader-line{transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1),filter .7s cubic-bezier(.22,1,.36,1),letter-spacing .7s cubic-bezier(.22,1,.36,1)}.site-loader.is-hidden .loader-mark{opacity:1;transform:none}.site-loader.is-hidden .loader-mark img{filter:blur(5px);opacity:0;transform:translateY(-24px) scale(1.08) rotate(-2deg)}.site-loader.is-hidden .loader-mark span:not(.loader-line){letter-spacing:.18em;opacity:0;transform:translateY(18px) scale(.94)}.site-loader.is-hidden .loader-line{opacity:0;transform:scaleX(0)}@media(prefers-reduced-motion:reduce){.loader-mark img,.loader-mark span:not(.loader-line),.loader-line{transition:none}.site-loader.is-hidden .loader-mark img,.site-loader.is-hidden .loader-mark span:not(.loader-line),.site-loader.is-hidden .loader-line{filter:none;opacity:0;transform:none}}/* story-section.css */
.story{align-items:center;background:#fff9f5;gap:clamp(48px,8vw,128px);grid-template-columns:minmax(280px,.9fr) minmax(320px,1.1fr);max-width:none;padding-left:max(8vw,32px);padding-right:max(8vw,32px)}.story-image{aspect-ratio:4/5;max-height:680px;position:relative}.story-image:after{display:none}.story-copy{max-width:680px}.story-copy h2{max-width:620px}.story-copy>p:not(.eyebrow){max-width:610px}.story-stats{border-bottom:1px solid rgba(24,37,42,.2);border-top:1px solid rgba(24,37,42,.2);display:grid;gap:20px;grid-template-columns:repeat(3,1fr);margin:42px 0 28px;padding:22px 0}.story-stats div{display:flex;flex-direction:column;gap:5px}.story-stats strong{color:#9a5e2e;font-size:clamp(1.8rem,3vw,3rem);font-weight:500;letter-spacing:-.06em;line-height:1}.story-stats span{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}@media(max-width:800px){.story{gap:42px;grid-template-columns:1fr}.story-image{max-height:none;order:1}.story-copy{order:2}.story-stats{gap:12px}.story-stats strong{font-size:1.8rem}.story-stats span{font-size:9px}}/* story-effects.css */
.story{overflow:hidden}.story-image{clip-path:inset(0 100% 0 0);opacity:0;transform:scale(1.08);transition:clip-path 1.1s cubic-bezier(.76,0,.24,1),opacity .6s ease,transform 1.4s cubic-bezier(.22,1,.36,1)}.story-image:after{opacity:0;transform:scale(1.08);transition:opacity .8s .35s ease,transform 1.2s .35s cubic-bezier(.22,1,.36,1)}.story-copy>*{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1)}.story-copy .eyebrow{transition-delay:.15s}.story-copy h2{transition-delay:.25s}.story-copy>p:not(.eyebrow){transition-delay:.35s}.story-copy .story-stats{transition-delay:.45s}.story-copy .text-link{transition-delay:.6s}.story.is-visible .story-image{clip-path:inset(0);opacity:1;transform:scale(1)}.story.is-visible .story-image:after{opacity:1;transform:scale(1)}.story.is-visible .story-copy>*{opacity:1;transform:translateY(0)}@media(prefers-reduced-motion:reduce){.story-image,.story-image:after,.story-copy>*{clip-path:none;opacity:1;transform:none;transition:none}}/* story-image-asset.css */
.story-image{background-image:url('nuestrahistoria-web.jpg')}/* story-image-framing.css */
.story-image{aspect-ratio:937/1024;background-color:#e6d8c8;background-position:center;background-repeat:no-repeat;background-size:contain}/* title-colors.css */
h1,h2,h3,h4,h5,h6{color:#9a5e2e}.story h2,.section-heading h2,.shop h2{font-size:min(clamp(2.5rem,5vw,5.5rem),58px)}.product-card h3{font-size:min(clamp(1.8rem,3vw,3rem),58px)}.featured-product{background:#fff9f5;display:grid;gap:clamp(36px,7vw,110px);grid-template-columns:.75fr 1.25fr;max-width:none;padding-left:max(8vw,32px);padding-right:max(8vw,32px)}.featured-heading{align-self:center;max-width:390px}.featured-heading h2{font-size:min(clamp(2.4rem,4.5vw,4.8rem),58px);line-height:1.02;margin:0 0 24px}.featured-heading>p:last-child{max-width:320px}.featured-card{align-items:flex-end;background:linear-gradient(0deg,rgba(42,14,4,.86),rgba(42,14,4,.08) 70%),url('platillos/tlayuda-doblada-grande.jpg') center/cover;display:flex;min-height:500px;overflow:hidden;padding:clamp(28px,4vw,58px);position:relative}.featured-card:after{border:1px solid rgba(255,249,245,.35);content:'';inset:16px;pointer-events:none;position:absolute}.featured-card-copy{color:#fff9f5;max-width:360px;position:relative;z-index:1}.featured-card-copy>span{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}.featured-card-copy h3{color:#fff9f5;font-size:min(clamp(2.3rem,4vw,4rem),58px);letter-spacing:-.05em;line-height:1;margin:10px 0 14px}.featured-card-copy p{margin:0 0 20px}.featured-card-copy strong{display:block;font-size:22px;font-weight:500;margin-bottom:24px}.featured-link{border-bottom:1px solid currentColor;display:inline-block;font-size:11px;font-weight:700;letter-spacing:.14em;padding-bottom:8px;text-transform:uppercase}.featured-link span{font-size:17px;margin-left:7px}@media(max-width:800px){.featured-product{grid-template-columns:1fr}.featured-card{min-height:420px}.featured-heading{max-width:500px}}/* scroll-showcase.css */
.scroll-showcase{background:#0b0b0b;height:185vh;position:relative}.scroll-showcase-stage{height:100vh;overflow:hidden;position:sticky;top:0}.scroll-showcase-image{background:linear-gradient(90deg,rgba(42,14,4,.35),rgba(42,14,4,.08)),url('platillos/tlayuda-doblada-grande.jpg') center/cover;border-radius:20px;inset:10vh 10vw;position:absolute;transform:scale(.2);transform-origin:center;will-change:transform}.scroll-showcase-label{color:#fff9f5;font-size:clamp(1.8rem,4vw,4.5rem);font-weight:700;letter-spacing:-.06em;line-height:1;margin:0;position:absolute;top:50%;transform:translate(-50%,-50%);will-change:transform;z-index:2}.scroll-showcase-label--left{left:50%}.scroll-showcase-label--right{left:50%}.scroll-showcase-dot{background:#c7e6ee;border-radius:50%;height:17px;position:absolute;right:17%;top:68%;width:17px;z-index:2}@media(max-width:800px){.scroll-showcase{height:155vh}.scroll-showcase-image{inset:18vh 6vw;border-radius:14px}.scroll-showcase-label{font-size:clamp(1.5rem,8vw,2.8rem)}.scroll-showcase-dot{height:11px;right:15%;width:11px}}/* scroll-showcase-background.css */
.scroll-showcase{background:#fff9f5}.scroll-showcase-label{color:#2A0E04}/* scroll-showcase-dot.css */
.scroll-showcase-dot{display:none}/* product-cards.css */
.shop{display:block;padding-bottom:clamp(90px,10vw,150px)}.shop-intro{margin-bottom:52px;max-width:620px}.shop-intro h2{margin-bottom:20px}.product-grid{display:grid;gap:24px;grid-template-columns:repeat(4,1fr)}.product-card{background:#fff9f5;border:1px solid rgba(154,94,46,.12);border-radius:14px;color:#18252a;display:block;min-height:0;overflow:hidden;padding:0;position:relative;transition:transform .3s ease,box-shadow .3s ease}.product-card:hover{box-shadow:0 16px 30px rgba(42,14,4,.12);transform:translateY(-8px)}.product-card:before{display:none}.product-image{background-position:center;background-repeat:no-repeat;background-size:contain;height:210px;margin:16px 16px 0}.product-card--mole .product-image{background-image:url('platillos/tlayuda-doblada-grande.jpg')}.product-card-content{padding:0 24px 24px;text-align:center}.product-rating{color:#f2b300;font-size:19px;letter-spacing:2px;line-height:1;margin:10px 0 16px}.product-rating span{color:#fff9f5;text-shadow:0 0 0 #f2b300}.product-card h3{color:#9a5e2e;font-size:22px;letter-spacing:-.03em;line-height:1.1;margin:0 0 18px;text-transform:uppercase}.product-price{color:#9a5e2e;font-size:22px;font-weight:700;margin:0 0 28px}.product-price small{font-size:13px;font-weight:500}.product-button{align-items:center;background:#97223f;border-radius:12px;color:#fff9f5;display:flex;font-size:14px;font-weight:700;justify-content:center;letter-spacing:.03em;min-height:54px;text-transform:uppercase;transition:background .2s,transform .2s}.product-button:hover{background:#2a0e04;transform:translateY(-2px)}.product-button span{font-size:26px;font-weight:400;margin-left:18px}@media(max-width:1050px){.product-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:800px){.shop-intro{margin-bottom:36px}.product-grid{gap:16px;grid-template-columns:1fr 1fr}.product-card-content{padding-left:16px;padding-right:16px}.product-image{height:180px;margin-left:10px;margin-right:10px}.product-card h3{font-size:18px}.product-price{font-size:19px}.product-button{font-size:11px;min-height:48px}.product-button span{font-size:21px;margin-left:8px}}@media(max-width:480px){.product-grid{grid-template-columns:1fr}.product-image{height:220px}}/* product-assets.css */
.product-image--enchilada{background-image:none}.product-image--tasajo{background-image:none}.product-image--mamon{background-image:none}.product-image--cocada{background-image:none}/* Respaldo: si el loader no se oculta por JS (script bloqueado o con error), se oculta solo */
.site-loader{animation:loader-failsafe 0s 5s forwards}@keyframes loader-failsafe{to{visibility:hidden;pointer-events:none}}/* Sin JavaScript: mostrar todo el contenido sin animaciones de entrada */
html:not(.js) .site-loader{display:none}.site-footer>p a{text-decoration:underline;text-underline-offset:3px}/* hero (estilo referencia: texto a la izquierda, imagen difuminada a la derecha, 3 tarjetas) */
.hero{background:var(--cream);overflow:hidden;padding:clamp(126px,15vh,184px) 0 clamp(56px,7vw,104px);position:relative}.hero-inner{margin:0;max-width:none;padding:0 max(8vw,32px);position:relative;width:100%}.hero-content{max-width:760px;position:relative;z-index:2}.hero-eyebrow{align-items:center;color:var(--rust);display:flex;font-size:11px;font-weight:700;gap:14px;letter-spacing:.2em;margin:0 0 26px;text-transform:uppercase}.hero-eyebrow-line{background:currentColor;display:block;height:1px;width:38px}.hero h1{color:var(--ink);font-size:clamp(2.7rem,6.4vw,5.6rem);font-weight:500;letter-spacing:-.05em;line-height:1.02;margin:0 0 26px;max-width:14ch}.hero-subtitle{color:rgba(24,37,42,.72);font-size:clamp(1rem,1.5vw,1.25rem);line-height:1.5;margin:0 0 34px;max-width:32ch}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:clamp(44px,6vw,76px)}.btn{align-items:center;border:1px solid transparent;border-radius:999px;display:inline-flex;font-size:14px;font-weight:600;gap:10px;min-height:52px;padding:15px 26px;transition:background .2s,color .2s,border-color .2s,transform .2s}.btn span{font-size:16px}.btn:hover{transform:translateY(-2px)}.btn:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.btn--solid{background:#2a0e04;color:#fff9f5}.btn--solid:hover{background:var(--rust)}.btn--ghost{background:var(--paper);border-color:rgba(24,37,42,.16);color:var(--ink)}.btn--ghost:hover{border-color:var(--ink)}.hero-cards{display:grid;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr));list-style:none;margin:0;max-width:740px;padding:0}.hero-card{background:var(--paper);border:1px solid rgba(24,37,42,.07);border-radius:16px;box-shadow:0 18px 44px rgba(24,37,42,.1);padding:22px 22px 20px}.hero-card-icon{color:var(--rust);height:28px;margin-bottom:24px;width:28px}.hero-card-value{color:var(--ink);font-size:clamp(1.25rem,1.8vw,1.55rem);font-weight:500;letter-spacing:-.03em;line-height:1.1;margin:0 0 6px}.hero-card-label{color:var(--rust);font-size:11px;font-weight:700;letter-spacing:.14em;margin:0 0 16px;text-transform:uppercase}.hero-card-note{border-top:1px solid rgba(24,37,42,.1);color:rgba(24,37,42,.55);font-size:12px;line-height:1.4;margin:0;padding-top:14px}.hero-media{background:url('platillos/tlayuda-doblada-grande.jpg') center/cover;border-radius:18px;margin-top:38px;min-height:280px;position:relative}@media(min-width:1001px){.hero{align-items:center;display:flex;min-height:min(86vh,880px)}.hero-inner{position:static}.hero-media{border-radius:0;inset:0 0 0 46%;margin:0;position:absolute;z-index:1;-webkit-mask-image:linear-gradient(90deg,transparent,rgba(0,0,0,.72) 19%,#000 42%);mask-image:linear-gradient(90deg,transparent,rgba(0,0,0,.72) 19%,#000 42%)}.hero-media:after{background:linear-gradient(180deg,var(--cream),transparent 26%,transparent 72%,var(--cream));content:'';inset:0;position:absolute}
}@media(max-width:1000px){.hero-cards{gap:12px;grid-template-columns:1fr}.hero-card{align-items:baseline;display:flex;flex-wrap:wrap;gap:0 14px}.hero-card-icon{margin-bottom:0}.hero-card-value{flex:0 0 auto;margin:0}.hero-card-label{flex:1;margin:0}.hero-card-note{border:0;flex:1 0 100%;padding-top:6px}}/* entrada del hero */
.hero-eyebrow,.hero-subtitle,.hero-actions,.hero-card,.hero-media{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1)}.hero h1 .gradual-word{display:inline-block}.hero h1 .gradual-word span{display:inline-block;opacity:0;transform:translateY(24px)}.hero-ready .hero h1 .gradual-word span{animation:hero-char-in .6s cubic-bezier(.22,1,.36,1) var(--char-delay) forwards}@keyframes hero-char-in{to{opacity:1;transform:translateY(0)}}.hero-ready .hero-eyebrow,.hero-ready .hero-subtitle,.hero-ready .hero-actions,.hero-ready .hero-card,.hero-ready .hero-media{opacity:1;transform:translateY(0)}.hero-ready .hero-subtitle{transition-delay:.5s}.hero-ready .hero-actions{transition-delay:.62s}.hero-ready .hero-media{transition-delay:.2s}.hero-ready .hero-card:nth-child(1){transition-delay:.74s}.hero-ready .hero-card:nth-child(2){transition-delay:.82s}.hero-ready .hero-card:nth-child(3){transition-delay:.9s}@media(prefers-reduced-motion:reduce){.hero-eyebrow,.hero-subtitle,.hero-actions,.hero-card,.hero-media,.hero h1 .gradual-word span{animation:none!important;opacity:1;transform:none;transition:none}}html:not(.js) .hero-eyebrow,html:not(.js) .hero-subtitle,html:not(.js) .hero-actions,html:not(.js) .hero-card,html:not(.js) .hero-media,html:not(.js) .hero h1 .gradual-word span{animation:none!important;opacity:1!important;transform:none!important}@media(forced-colors:active){.hero-card{border-color:CanvasText}.btn--solid{background:ButtonFace;color:ButtonText;border-color:ButtonText}}/* aparición gradual del título en la cortinilla de entrada */
.loader-title .gradual-word{display:inline-block}.loader-title .gradual-word span{animation:gradual-char-in .5s ease-out var(--char-delay) both;display:inline-block}@keyframes gradual-char-in{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}@media(prefers-reduced-motion:reduce){.loader-title .gradual-word span{animation:none;opacity:1;transform:none}}/* ===== hero oscuro (café casi negro) — bloque independiente, fácil de quitar ===== */
:root{--hero-dark:#1b0a04}.hero{background:var(--hero-dark)}.hero-eyebrow{color:var(--gold)}.hero h1{color:#fff9f5}.hero-subtitle{color:rgba(255,249,245,.8)}.btn--solid{background:#fff9f5;color:#2a0e04}.btn--solid:hover{background:var(--gold);color:#2a0e04}.btn--ghost{background:transparent;border-color:rgba(255,249,245,.42);color:#fff9f5}.btn--ghost:hover{background:rgba(255,249,245,.1);border-color:#fff9f5}.hero-card{background:rgba(18,7,2,.66);border-color:rgba(255,249,245,.18);box-shadow:0 20px 44px rgba(0,0,0,.35);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.hero-card-icon{color:var(--gold)}.hero-card-value{color:#fff9f5}.hero-card-label{color:var(--gold)}.hero-card-note{border-top-color:rgba(255,249,245,.2);color:rgba(255,249,245,.72)}.hero-media{box-shadow:none}@media(min-width:1001px){.hero-media:after{background:linear-gradient(180deg,var(--hero-dark),transparent 18%,transparent 82%,var(--hero-dark)),linear-gradient(90deg,var(--hero-dark),rgba(27,10,4,.42) 15%,transparent 36%)}
}@media(max-width:1000px){.hero-media{margin-top:34px}}/* barra superior más baja (tipografías sin cambios) */
.site-header{height:64px;padding:0 20px;top:20px}.site-header .brand img{height:46px;width:46px}.site-header.is-scrolled{height:54px;top:12px}.site-header.is-scrolled .brand img{height:38px;width:38px}.hero{padding-top:clamp(140px,17vh,196px)}@media(max-width:800px){.site-header{height:60px;top:14px}.site-header .brand img{height:44px;width:44px}.site-header.is-scrolled{height:54px;top:10px}.site-header .menu-toggle{height:40px}
}/* barra superior: arriba alineada al margen del hero, al bajar se compacta */
.site-header{left:50%;padding:0 16px;right:auto;transform:translateX(-50%);width:calc(100% - 2*max(8vw,32px))}.site-header.is-scrolled{width:min(720px,calc(100% - 48px))}@media(max-width:800px){.site-header{width:calc(100% - 2*max(8vw,32px))}.site-header.is-scrolled{width:calc(100% - 2*max(8vw,32px) - 28px)}
}/* sin botones en el hero: el subtítulo toma la separación que daban */
.hero-subtitle{margin-bottom:clamp(44px,6vw,76px)}/* tarjetas de producto con la paleta y el estilo gráfico del sitio */
.product-card{background:var(--paper);border:1px solid rgba(24,37,42,.08);border-radius:16px}.product-card:hover{box-shadow:0 18px 40px rgba(24,37,42,.14)}.product-rating{color:var(--gold);font-size:17px;letter-spacing:3px}.product-rating span{color:rgba(24,37,42,.18);text-shadow:none}.product-card h3{color:var(--ink);font-size:clamp(1.15rem,1.6vw,1.4rem);font-weight:500;letter-spacing:-.03em;margin-bottom:10px;text-transform:none}.product-price{color:var(--rust);font-size:19px;font-weight:600;letter-spacing:-.02em;margin-bottom:24px}.product-price small{color:rgba(24,37,42,.55);font-weight:500}.product-button{background:#2a0e04;border-radius:999px;color:#fff9f5;font-size:11px;font-weight:700;letter-spacing:.12em;min-height:52px}.product-button:hover{background:var(--rust)}.product-button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.product-button span{font-size:16px;margin-left:10px}@media(max-width:800px){.product-button{font-size:10px;min-height:46px}.product-button span{font-size:14px;margin-left:8px}}.shop .outline-button{border-radius:999px;border-width:1px;min-height:52px;padding:16px 28px}.shop .outline-button--dark:hover{background:#2a0e04;border-color:#2a0e04;color:#fff9f5}/* footer centrado: logo, menú, redes, línea divisoria y derechos */
.site-footer{align-items:center;background:#2a0e04;color:#fff9f5;display:flex;flex-direction:column;gap:0;padding:clamp(56px,7vw,84px) max(8vw,32px) clamp(40px,5vw,56px);text-align:center}.footer-brand{display:block;margin-bottom:26px}.footer-brand img{filter:none;height:72px;width:72px}.footer-nav{display:flex;flex-wrap:wrap;gap:clamp(18px,3vw,38px);justify-content:center;margin-bottom:30px}.footer-nav a{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;transition:color .2s}.footer-nav a:hover,.footer-nav a:focus-visible{color:var(--gold)}.site-footer .footer-socials{display:flex;gap:16px;justify-content:center;margin-bottom:30px}.site-footer .footer-socials a{align-items:center;border:0;border-radius:50%;color:#fff9f5;display:flex;height:34px;justify-content:center;transition:color .2s,transform .2s;width:34px}.site-footer .footer-socials a:hover{color:var(--gold);transform:translateY(-2px)}.site-footer .footer-socials svg{height:21px;width:21px}.footer-divider{background:rgba(255,249,245,.22);display:block;height:1px;margin-bottom:26px;width:clamp(56px,8vw,96px)}.footer-legal{font-size:13px;margin:0;opacity:.72}.footer-legal a{text-decoration:underline;text-underline-offset:3px}.footer-legal a:hover{color:var(--gold)}/* footer más compacto (~70% del alto anterior) */
.site-footer{padding:clamp(34px,4vw,50px) max(8vw,32px) clamp(24px,3vw,34px)}.footer-brand{margin-bottom:16px}.footer-brand img{height:54px;width:54px}.footer-nav{margin-bottom:18px}.site-footer .footer-socials{margin-bottom:18px}.site-footer .footer-socials a{height:28px;width:28px}.site-footer .footer-socials svg{height:19px;width:19px}.footer-divider{margin-bottom:16px}.footer-legal{font-size:12.5px}/* showreel: imagen a todo lo ancho, fondo oscuro y textos en blanco */
.scroll-showcase{background:#1b0a04}.scroll-showcase-image{background:linear-gradient(90deg,rgba(27,10,4,.55),rgba(27,10,4,.3)),url('platillos/tlayuda-doblada-grande.jpg') center/cover;border-radius:0;inset:12vh 0}.scroll-showcase-label{color:#fff9f5;text-shadow:0 2px 20px rgba(0,0,0,.5)}@media(max-width:800px){.scroll-showcase-image{border-radius:0;inset:20vh 0}}.scroll-showcase-label--left{padding-right:.4em}.scroll-showcase-label--right{padding-left:.4em}/* showreel: fondo claro otra vez; el texto se invierte según lo que tenga detrás */
.scroll-showcase{background:#fff9f5}.scroll-showcase-label{-webkit-text-stroke:1.5px rgba(42,14,4,.9);color:#fff9f5;paint-order:stroke fill;text-shadow:0 2px 24px rgba(42,14,4,.35)}@media(max-width:800px){.scroll-showcase-label{-webkit-text-stroke-width:1px}}/* ===== nuestros espacios ===== */
.spaces .section-heading{align-items:flex-start;display:block;margin-bottom:clamp(32px,4vw,52px)}.spaces .section-heading h2{margin:0 0 18px;max-width:16ch}.spaces-intro{color:rgba(24,37,42,.75);font-size:clamp(1rem,1.3vw,1.12rem);line-height:1.55;margin:0;max-width:60ch}/* mismo fondo y ancho que "nuestra historia" */
.spaces{background:#fff9f5;max-width:none;padding-left:max(8vw,32px);padding-right:max(8vw,32px)}/* títulos de sección con aparición gradual letra por letra */
.gradual-title .gradual-word{display:inline-block}.gradual-title .gradual-word span{display:inline-block;opacity:0;transform:translateX(-20px)}.gradual-title.is-revealed .gradual-word span{animation:gradual-char-in .5s ease-out var(--char-delay) both}@media(prefers-reduced-motion:reduce){.gradual-title .gradual-word span{animation:none!important;opacity:1;transform:none}}html:not(.js) .gradual-title .gradual-word span{opacity:1;transform:none}/* vuelve el botón al hero: el subtítulo recupera su separación normal */
.hero-subtitle{margin-bottom:34px}/* menos aire entre el botón y las tarjetas del hero */
.hero-actions{margin-bottom:clamp(28px,3.4vw,46px)}/* ===== tienda: rejilla de productos ===== */
.shop-intro{margin-bottom:clamp(34px,4vw,54px);max-width:640px}.shop-intro h2{margin-bottom:18px}.shop-intro>p:not(.eyebrow){color:rgba(24,37,42,.75);font-size:clamp(1rem,1.3vw,1.12rem);line-height:1.55;margin:0;max-width:56ch}.product-grid{gap:20px}.product-card{align-items:stretch;border-radius:16px;display:flex;flex-direction:column;overflow:hidden;position:relative;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}.product-card:hover{border-color:rgba(24,37,42,.16);box-shadow:0 20px 42px rgba(24,37,42,.13);transform:translateY(-6px)}.product-card:focus-within{border-color:var(--gold);box-shadow:0 0 0 3px rgba(212,161,76,.45)}.product-image{background-color:#f6f1e8;border-radius:12px;height:200px;margin:14px 14px 0;transition:transform .5s cubic-bezier(.22,1,.36,1)}.product-card:hover .product-image{transform:scale(1.04)}.product-card-content{display:flex;flex-direction:column;flex:1;padding:18px 20px 20px;text-align:left}.product-tag{color:var(--rust);font-size:10px;font-weight:700;letter-spacing:.16em;margin:0 0 8px;text-transform:uppercase}.product-card h3{margin:0 0 6px}.product-card h3 a{color:var(--ink);text-decoration:none}.product-card h3 a:after{content:'';inset:0;position:absolute}.product-card h3 a:focus-visible{outline:none}.product-desc{color:rgba(24,37,42,.66);font-size:13.5px;line-height:1.45;margin:0 0 14px}.product-price{color:var(--ink);font-size:20px;font-weight:600;letter-spacing:-.02em;margin:0 0 16px}.product-price small{color:rgba(24,37,42,.55);font-size:13px;font-weight:500}.product-cta{align-items:center;color:var(--rust);display:flex;font-size:11px;font-weight:700;gap:8px;letter-spacing:.12em;margin-top:auto;text-transform:uppercase}.product-cta span{font-size:15px;transition:transform .25s ease}.product-card:hover .product-cta span{transform:translateX(4px)}.shop-footer{align-items:center;display:flex;flex-direction:column;gap:12px;margin-top:clamp(36px,4vw,54px);text-align:center}.btn--shop{background:#2a0e04;color:#fff9f5;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.btn--shop:hover{background:var(--rust)}.shop-note{color:rgba(24,37,42,.6);font-size:12.5px;margin:0}@media(max-width:1050px){.product-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.product-grid{grid-template-columns:1fr}.product-image{height:220px}}/* mismo crema en toda la parte baja del sitio: sin línea entre el showreel y la tienda */
.shop{background:#fff9f5}.product-card{background:var(--paper)}/* vuelve el botón: el subtítulo recupera su separación corta */
.hero-subtitle{margin-bottom:34px}/* ===== adaptación a tablet y móvil ===== */
/* el encabezado flotante tapaba el inicio de la sección al llegar por un enlace */
main[id],section[id]{scroll-margin-top:104px}@media(max-width:800px){main[id],section[id]{scroll-margin-top:88px}}/* espacios: 3 columnas sólo cuando hay lugar; 2 en tablet; 1 en móvil */
@media(max-width:1100px){
  .space-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .space-card h3{font-size:clamp(1.6rem,3.2vw,2.2rem)}
  .space-card .card-link{white-space:nowrap}
}/* tarjetas del hero: se mantienen en 3 columnas en tablet */
@media(min-width:701px) and (max-width:1000px){
  .hero-cards{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hero-card{display:block}
  .hero-card-icon{margin-bottom:18px}
  .hero-card-value{margin:0 0 6px}
  .hero-card-label{margin:0 0 14px}
  .hero-card-note{border-top:1px solid rgba(255,249,245,.2);flex:none;padding-top:14px}
}/* áreas táctiles cómodas en tablet y móvil: 44px en las acciones principales */
@media(max-width:1100px){
  .space-card .socials a,.site-footer .footer-socials a{height:44px;width:44px}
  .space-card-meta a{display:inline-block;padding:6px 0}
  .space-card .card-link,.product-cta,.footer-nav a,.btn,.contact-button,.outline-button{align-items:center;display:inline-flex;min-height:44px}
  .site-header .menu-toggle{height:48px;width:48px}
  .site-header .mobile-nav a{align-items:center;display:inline-flex;min-height:44px;padding:0}
}/* sin cursor no hay hover: que no se queden estados pegados al tocar */
@media(hover:none){
  .space-card:hover,.product-card:hover,.hero-card:hover{box-shadow:none;transform:none}
  .space-card:hover .space-card-photo,.product-card:hover .product-image{transform:none}
}/* la barra del navegador móvil cambia de alto: usar la unidad que la considera */
@supports(height:100svh){
  .scroll-showcase-stage{height:100svh}
}@supports(height:100svh){@media(max-width:800px){.mobile-nav{height:100svh}}}@media(max-width:800px){.scroll-showcase{height:130vh}.shop-intro{margin-bottom:28px}.footer-nav{gap:14px 20px}
}@supports(height:100svh){@media(max-width:800px){.scroll-showcase{height:130svh}}}/* móvil: la etiqueta entra en el flujo para que no se encime con el título */
@media(max-width:700px){
  .space-card-tag{align-self:flex-start;left:auto;margin-bottom:14px;position:static;top:auto}
  .space-card{min-height:320px;padding-top:120px}
  .space-card-foot{flex-wrap:nowrap}
  .space-card .card-link{font-size:10px}
}/* tablet: la tercera tarjeta ocupa el ancho completo en vez de dejar un hueco */
@media(min-width:701px) and (max-width:1100px){
  .space-card:last-child{grid-column:1/-1;min-height:320px}
}/* ===== Cinzel en los títulos ===== */
@font-face{font-family:'Cinzel';font-style:normal;font-weight:400 900;font-display:swap;src:url('fonts/cinzel-latin-wght-normal.woff2') format('woff2')}.hero h1,.story-copy h2,.spaces .section-heading h2,.shop-headline h2{font-family:'Cinzel',Georgia,'Times New Roman',serif;font-weight:600}/* Cinzel es una serif de capitales: necesita más aire entre letras y líneas */
.hero h1{letter-spacing:.005em;line-height:1.08}.story-copy h2,.spaces .section-heading h2,.shop-headline h2{letter-spacing:.01em;line-height:1.12}/* "Nuestros productos oaxaqueños" en dos líneas */
.shop-intro{max-width:740px}.shop-headline h2{font-size:min(clamp(2.1rem,4vw,3.2rem),52px)}/* showreel también en Cinzel */
.scroll-showcase-label{font-family:'Cinzel',Georgia,'Times New Roman',serif;font-weight:600;letter-spacing:.01em}/* Cinzel también en la cortinilla de entrada */
.loader-title{font-family:'Cinzel',Georgia,'Times New Roman',serif;font-weight:600;letter-spacing:.06em}/* showreel sin contorno */
.scroll-showcase-label{-webkit-text-stroke:0;text-shadow:0 2px 24px rgba(42,14,4,.45)}.hero-card-value{line-height:1.15}.product-card h3{font-size:clamp(1.05rem,1.4vw,1.25rem);line-height:1.2}/* títulos de las tarjetas del hero un poco más chicos */
.hero-card-value{font-size:clamp(1.05rem,1.45vw,1.28rem)}/* redes del pie: etiquetadas, porque dos iconos sueltos no dicen de qué marca son */
.footer-social{display:flex;flex-direction:column;gap:12px;margin-bottom:22px}.footer-social-title{color:rgba(255,249,245,.6);font-size:10px;font-weight:700;letter-spacing:.16em;margin:0;text-transform:uppercase}.footer-social-links{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.footer-social-links a{align-items:center;border:1px solid rgba(255,249,245,.25);border-radius:999px;color:#fff9f5;display:inline-flex;font-size:12px;font-weight:600;gap:8px;min-height:40px;padding:9px 16px;transition:background .2s,border-color .2s,color .2s}.footer-social-links a:hover{background:rgba(255,249,245,.1);border-color:#fff9f5;color:var(--gold)}.footer-social-links a:focus-visible{outline:2px solid var(--gold);outline-offset:3px}.footer-social-links svg{flex:0 0 auto;height:17px;width:17px}@media(max-width:1100px){.footer-social-links a{min-height:44px}}/* datos de la tienda física junto a la presentación */
.shop-lead strong{font-weight:600}.shop-facts{display:flex;flex-wrap:wrap;gap:10px 28px;list-style:none;margin:18px 0 0;padding:0}.shop-facts li{align-items:center;color:rgba(24,37,42,.7);display:flex;font-size:13.5px;gap:8px;line-height:1.4}.shop-facts svg{color:var(--rust);flex:0 0 auto;height:16px;width:16px}.shop-facts a{text-decoration:underline;text-decoration-color:rgba(24,37,42,.3);text-underline-offset:3px}.shop-facts a:hover{color:var(--rust);text-decoration-color:currentColor}@media(max-width:1100px){.shop-facts a{display:inline-block;padding:5px 0}}/* encabezado de la tienda: presentación a la izquierda, logo de la marca a la derecha */
.shop-header{align-items:center;display:flex;gap:clamp(28px,5vw,72px);justify-content:space-between;margin-bottom:clamp(34px,4vw,54px)}.shop-header .shop-intro{margin-bottom:0}.shop-brand-logo{flex:0 0 auto;height:auto;width:clamp(150px,15vw,220px)}@media(max-width:900px){.shop-header{align-items:flex-start;flex-direction:column;gap:24px}.shop-brand-logo{width:clamp(130px,26vw,170px)}
}/* logo de la tienda más grande */
.shop-brand-logo{width:clamp(220px,26vw,380px)}@media(max-width:900px){.shop-brand-logo{width:clamp(200px,42vw,280px)}}/* ajustes finos de la sección de tienda */
/* los precios se alinean entre tarjetas aunque las descripciones midan distinto */
.product-desc{flex:1}/* el logo lleva a la tienda en línea */
.shop-brand{border-radius:12px;display:block;flex:0 0 auto;transition:opacity .2s,transform .25s ease}.shop-brand:hover{opacity:.85;transform:translateY(-3px)}.shop-brand:focus-visible{outline:3px solid var(--gold);outline-offset:6px}.shop-brand-logo{display:block}@media(max-width:900px){/* en móvil la marca se presenta antes que el título, no perdida entre el texto y los productos */
  .shop-brand{order:-1}.shop-header{gap:20px}
}/* encabezado de tienda en rejilla: título, texto y logo se recolocan por ancho */
.shop-header{display:grid;gap:clamp(20px,3vw,40px) clamp(28px,5vw,64px);margin-bottom:clamp(34px,4vw,54px)}.shop-headline{grid-area:titulo}.shop-lead{grid-area:texto}.shop-brand{grid-area:marca}.shop-headline .eyebrow{margin-bottom:14px}.shop-headline h2{margin:0;max-width:18ch}.shop-lead>p{color:rgba(24,37,42,.75);font-size:clamp(1rem,1.3vw,1.12rem);line-height:1.55;margin:0;max-width:56ch}.shop-lead .shop-facts{margin-top:16px}/* escritorio: título y texto a la izquierda, logo a la derecha */
@media(min-width:1101px){
  .shop-header{align-items:center;grid-template-areas:'titulo marca' 'texto marca';grid-template-columns:minmax(0,1fr) auto}
}/* tablet: el título ocupa todo el ancho; abajo, texto y logo al 50% */
@media(min-width:701px) and (max-width:1100px){
  .shop-header{align-items:center;grid-template-areas:'titulo titulo' 'texto marca';grid-template-columns:1fr 1fr}
  .shop-headline h2{max-width:none}
  .shop-brand{justify-self:center}
  .shop-brand-logo{width:min(100%,300px)}
}/* móvil: todo apilado, la marca primero */
@media(max-width:700px){
  .shop-header{grid-template-areas:'marca' 'titulo' 'texto';justify-items:start}
}/* en escritorio el título usa todo el ancho de su columna */
@media(min-width:1101px){.shop-headline h2{max-width:none}}/* ===== restaurantes ===== */
.restaurants{background:#fff9f5;max-width:none;padding-left:max(8vw,32px);padding-right:max(8vw,32px);padding-top:0}.restaurants-header{margin-bottom:clamp(30px,4vw,48px);max-width:740px}.restaurants-header .eyebrow{margin-bottom:14px}.restaurants-header h2{font-family:'Cinzel',Georgia,'Times New Roman',serif;font-size:min(clamp(2.1rem,4vw,3.2rem),52px);font-weight:600;letter-spacing:.01em;line-height:1.12;margin:0 0 18px}.restaurants-lead{color:rgba(24,37,42,.75);font-size:clamp(1rem,1.3vw,1.12rem);line-height:1.55;margin:0;max-width:60ch}.restaurants-lead strong{font-weight:600}

/* ===== índice de marcas: foto de fondo, logo en placa e info corta ===== */
.spaces .section-heading{display:block;margin-bottom:clamp(28px,3.5vw,44px)}
.spaces-intro{color:rgba(24,37,42,.75);font-size:clamp(1rem,1.3vw,1.12rem);line-height:1.55;margin:16px 0 0;max-width:52ch}
.brand-index{display:grid;gap:20px;grid-template-columns:repeat(3,minmax(0,1fr));list-style:none;margin:0;padding:0}
.brand-item a{border-radius:18px;color:#fff9f5;display:flex;flex-direction:column;height:100%;isolation:isolate;justify-content:flex-end;min-height:clamp(340px,34vw,420px);overflow:hidden;padding:clamp(22px,2.4vw,30px);position:relative;transition:transform .3s ease,box-shadow .3s ease}
.brand-item a:hover{box-shadow:0 24px 48px rgba(24,37,42,.24);transform:translateY(-6px)}
.brand-item a:focus-visible{outline:3px solid var(--gold);outline-offset:4px}
.brand-photo{background-position:center;background-repeat:no-repeat;background-size:cover;inset:0;position:absolute;transition:transform .7s cubic-bezier(.22,1,.36,1);z-index:-2}
.brand-item a:hover .brand-photo{transform:scale(1.07)}
.brand-item a:after{content:'';inset:0;position:absolute;z-index:-1}
.brand-item--tienda .brand-photo{background-image:none;background-position:center 45%}
.brand-item--tienda a:after{background:linear-gradient(180deg,rgba(28,12,4,.34),rgba(24,10,3,.12) 34%,rgba(18,7,2,.92))}
.brand-item--nela .brand-photo{background-image:none;background-position:center 60%}
.brand-item--nela a:after{background:linear-gradient(180deg,rgba(70,20,7,.34),rgba(56,16,6,.12) 34%,rgba(30,9,3,.93))}
.brand-item--oaxacaqui .brand-photo{background-image:url('cards/oaxacaqui-web.webp');background-position:center 55%}
.brand-item--oaxacaqui a:after{background:linear-gradient(180deg,rgba(60,38,8,.34),rgba(48,28,6,.12) 34%,rgba(24,14,2,.93))}
/* placa clara: los logos traen colores oscuros que se perderían sobre la foto */
.brand-plate{align-items:center;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:rgba(255,249,245,.94);border-radius:14px;display:flex;justify-content:center;left:clamp(22px,2.4vw,30px);padding:12px 16px;position:absolute;top:clamp(22px,2.4vw,30px)}
.brand-logo{display:block;height:clamp(46px,4.6vw,58px);object-fit:contain;width:auto}
.brand-body{display:flex;flex-direction:column;position:relative}
.brand-tag{color:var(--gold);font-size:10px;font-weight:700;letter-spacing:.16em;margin-bottom:10px;text-transform:uppercase}
.brand-line{color:rgba(255,249,245,.9);font-size:15px;line-height:1.5;margin-bottom:18px;max-width:26ch}
.brand-cta{align-items:center;border-top:1px solid rgba(255,249,245,.22);color:#fff9f5;display:inline-flex;font-size:11px;font-weight:700;gap:8px;letter-spacing:.12em;padding-top:16px;text-transform:uppercase}
.brand-cta span{font-size:15px;transition:transform .25s ease}
.brand-item a:hover .brand-cta{color:var(--gold)}
.brand-item a:hover .brand-cta span{transform:translateX(4px)}
@media(max-width:1100px){.brand-index{grid-template-columns:repeat(2,minmax(0,1fr))}.brand-item:last-child{grid-column:1/-1}.brand-item:last-child a{min-height:300px}}
@media(max-width:700px){.brand-index{grid-template-columns:1fr}.brand-item a,.brand-item:last-child a{min-height:300px}}
}
/* botones de la ficha de restaurante */
.btn--solid-dark{background:#2a0e04;color:#fff9f5;font-size:12px;font-weight:700;letter-spacing:.1em;min-height:48px;text-transform:uppercase}
.btn--solid-dark:hover{background:var(--rust)}
.btn--ghost-line{background:transparent;border-color:rgba(24,37,42,.22);color:var(--ink);font-size:12px;font-weight:700;letter-spacing:.1em;min-height:48px;text-transform:uppercase}
.btn--ghost-line:hover{border-color:var(--ink)}
/* ===== tarjetas de restaurante ===== */
.restaurant-grid{display:grid;gap:24px}
.resto-card{background:var(--paper);border:1px solid rgba(24,37,42,.08);border-radius:20px;display:grid;grid-template-columns:minmax(0,.58fr) minmax(0,1fr);overflow:hidden;transition:box-shadow .3s ease}
.resto-card:hover{box-shadow:0 24px 50px rgba(24,37,42,.14)}
.resto-photo{background-position:center;background-repeat:no-repeat;background-size:cover;min-height:clamp(230px,22vw,300px)}
.resto-photo--nela{background-image:none;background-position:center 66%}
.resto-photo--oaxacaqui{background-position:center 62%}
.resto-body{display:flex;flex-direction:column;padding:clamp(22px,2.6vw,34px)}
.resto-top{align-items:flex-start;display:flex;gap:20px;justify-content:space-between;margin-bottom:16px}
.resto-headline{min-width:0}
.resto-logo{flex:0 0 auto;height:clamp(58px,6vw,78px);object-fit:contain;object-position:right top;width:auto}
.resto-status{align-items:center;align-self:flex-start;background:rgba(24,37,42,.06);border-radius:999px;color:rgba(24,37,42,.7);display:inline-flex;font-size:12px;font-weight:600;gap:8px;margin:0 0 12px;padding:7px 14px}
.resto-status:before{background:rgba(24,37,42,.35);border-radius:50%;content:'';height:7px;width:7px}
.resto-status.is-open{background:rgba(58,125,68,.12);color:#2f6b3a}
.resto-status.is-open:before{background:#3a9150}
.resto-status.is-closed{background:rgba(169,71,41,.1);color:#8d3b21}
.resto-status.is-closed:before{background:#a94729}
.resto-card h3{color:var(--ink);font-family:'Cinzel',Georgia,'Times New Roman',serif;font-size:clamp(1.6rem,2.4vw,2.2rem);font-weight:600;letter-spacing:.01em;line-height:1.1;margin:0 0 8px}
.resto-zone{align-items:center;color:var(--rust);display:flex;font-size:12px;font-weight:700;gap:7px;letter-spacing:.1em;margin:0;text-transform:uppercase}
.resto-zone svg{flex:0 0 auto;height:15px;width:15px}
.resto-desc{color:rgba(24,37,42,.72);font-size:15px;line-height:1.55;margin:0 0 20px;max-width:52ch}
/* menú en movimiento continuo */
.resto-menu{margin-bottom:22px}
.resto-menu-title{color:rgba(24,37,42,.45);font-size:10px;font-weight:700;letter-spacing:.16em;margin:0 0 10px;text-transform:uppercase}
.resto-marquee{-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);display:flex;gap:8px;overflow:hidden}
.resto-track{animation:resto-slide 26s linear infinite;display:flex;flex:0 0 auto;gap:8px;list-style:none;margin:0;padding:0}
.resto-marquee:hover .resto-track,.resto-marquee:focus-within .resto-track{animation-play-state:paused}
.resto-track li{background:rgba(212,161,76,.16);border-radius:999px;color:#7a4a18;font-size:12.5px;font-weight:600;padding:7px 14px;white-space:nowrap}
@keyframes resto-slide{from{transform:translateX(0)}to{transform:translateX(calc(-100% - 8px))}}
@media(prefers-reduced-motion:reduce){
  .resto-track{animation:none}
  .resto-marquee{flex-wrap:wrap;mask-image:none;-webkit-mask-image:none;overflow:visible}
  .resto-track{flex-wrap:wrap}
  .resto-track[aria-hidden]{display:none}
}
.resto-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto}
.btn--icon{border:1px solid rgba(24,37,42,.2);color:var(--ink);justify-content:center;min-height:48px;padding:0;width:48px}
.btn--icon:hover{border-color:var(--ink)}
.btn--icon svg{height:19px;width:19px}
.resto-address{color:rgba(24,37,42,.5);font-size:12.5px;margin:14px 0 0}
@media(max-width:900px){
  .resto-card{grid-template-columns:1fr}
  .resto-photo{min-height:200px}
  .resto-logo{height:56px}
}
@media(max-width:560px){
  .resto-top{gap:14px}
  .resto-logo{height:48px}
  .resto-actions .btn--solid-dark,.resto-actions .btn--ghost-line{flex:1 1 auto;justify-content:center}
}
/* botones de la ficha de restaurante */
.btn--solid-dark{background:#2a0e04;color:#fff9f5;font-size:12px;font-weight:700;letter-spacing:.1em;min-height:48px;text-transform:uppercase}
.btn--solid-dark:hover{background:var(--rust)}
.btn--ghost-line{background:transparent;border-color:rgba(24,37,42,.22);color:var(--ink);font-size:12px;font-weight:700;letter-spacing:.1em;min-height:48px;text-transform:uppercase}
.btn--ghost-line:hover{border-color:var(--ink)}
/* la columna de texto debe poder encogerse: si no, las etiquetas en una línea desbordan la tarjeta */
.resto-body{min-width:0}
.resto-card{grid-template-columns:minmax(0,.58fr) minmax(0,1fr)}
@media(max-width:900px){.resto-card{grid-template-columns:minmax(0,1fr)}}
/* el difuminado sólo del lado por donde salen las etiquetas */
.resto-marquee{-webkit-mask-image:linear-gradient(90deg,#000 0,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 0,#000 88%,transparent)}
/* logo de la ficha de restaurante más grande */
.resto-logo{height:clamp(84px,9vw,120px)}
@media(max-width:900px){.resto-logo{height:82px}}
@media(max-width:560px){.resto-logo{height:68px}}
/* las secciones del menú pasan debajo de los botones; el logo gana espacio */
.resto-top{order:0}
.resto-desc{order:1}
.resto-actions{order:2}
.resto-menu{margin:20px 0 0;order:3}
.resto-address{order:4}
.resto-logo{height:clamp(110px,12.5vw,168px)}
@media(max-width:900px){.resto-logo{height:100px}}
@media(max-width:560px){.resto-logo{height:78px}}
/* la dirección es el enlace a Google Maps */
.resto-address a{align-items:center;color:rgba(24,37,42,.62);display:inline-flex;gap:6px;text-decoration:underline;text-decoration-color:rgba(24,37,42,.28);text-underline-offset:3px;transition:color .2s}
.resto-address svg{flex:0 0 auto;height:14px;opacity:.7;width:14px}
.resto-address a:hover{color:var(--rust);text-decoration-color:currentColor}
.resto-address a:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
@media(max-width:1100px){.resto-address a{padding:6px 0}}
/* el párrafo se queda en la mitad izquierda para no competir con el logo */
@media(min-width:901px){.resto-desc{max-width:min(50%,46ch)}}
/* showreel estilo "cortina": la foto llena la pantalla, se aleja de 1.2 a 1 al entrar,
   se queda fija y la sección de la tienda sube por encima */
.scroll-showcase{background:#1b0a04;height:200vh}
.scroll-showcase-image{border-radius:0;inset:0;transform:scale(1.2)}
.shop{margin-top:-100vh;position:relative;z-index:2}
@supports(height:100svh){.scroll-showcase{height:200svh}.shop{margin-top:-100svh}}
@media(max-width:800px){.scroll-showcase{height:200vh}.scroll-showcase-image{border-radius:0;inset:0}}
@supports(height:100svh){@media(max-width:800px){.scroll-showcase{height:200svh}}}
@media(prefers-reduced-motion:reduce){.scroll-showcase-image{transform:none!important}}
/* showreel adaptable: el texto siempre cabe, se lee sin apagar toda la foto
   y en pantallas verticales las palabras se apilan */
.scroll-showcase-image{background:radial-gradient(ellipse 58% 42% at 50% 50%,rgba(27,10,4,.62),rgba(27,10,4,.28) 55%,rgba(27,10,4,0) 80%),linear-gradient(180deg,rgba(27,10,4,.38),rgba(27,10,4,.08) 28%,rgba(27,10,4,.08) 72%,rgba(27,10,4,.42)),url('platillos/tlayuda-doblada-grande.jpg') center/cover}
.scroll-showcase-label{font-size:clamp(2rem,min(6.2vw,12vh),6rem);line-height:1;padding:0;text-shadow:0 2px 28px rgba(27,10,4,.55);white-space:nowrap}
.scroll-showcase-label--left{padding-right:.22em;transform:translate(calc(-100% - var(--travel,0px)),-50%)}
.scroll-showcase-label--right{padding-left:.22em;transform:translate(var(--travel,0px),-50%)}
@media(max-width:600px),(max-aspect-ratio:4/5){
  .scroll-showcase-image{background:radial-gradient(ellipse 80% 30% at 50% 50%,rgba(27,10,4,.66),rgba(27,10,4,.3) 55%,rgba(27,10,4,0) 85%),linear-gradient(180deg,rgba(27,10,4,.4),rgba(27,10,4,.1) 25%,rgba(27,10,4,.1) 75%,rgba(27,10,4,.45)),url('platillos/tlayuda-doblada-grande.jpg') 58% center/cover}
  .scroll-showcase-label{font-size:clamp(2.3rem,12vw,5.5rem);line-height:1.08}
  .scroll-showcase-label--left{padding:0;transform:translate(calc(-50% - var(--travel,0px)),-100%)}
  .scroll-showcase-label--right{padding:0;transform:translate(calc(-50% + var(--travel,0px)),0)}
}
/* ===== pulido responsivo de todo el sitio ===== */
/* anclas: el título de cada sección no queda debajo de la barra fija */
section[id]{scroll-margin-top:92px}
/* barra: centrada sin transform, para que el menú móvil (fixed) se mida contra la pantalla */
.site-header{left:0;margin-inline:auto;right:0;transform:none}
.mobile-nav-contact{display:none}
@media(max-width:800px){
  .site-header,.site-header.is-scrolled{gap:10px;justify-content:flex-start;padding:0 10px 0 12px;width:calc(100% - 32px)}
  .site-header .brand{flex:0 0 auto;order:0}
  .site-header .contact-button{display:inline-flex;margin-left:auto;order:1}
  .site-header .menu-toggle{flex:0 0 auto;order:2}
  .site-header .brand img{height:44px;width:44px}
  html.menu-open{overflow:hidden}
  .mobile-nav{inset:0;width:100vw}
  .site-header .mobile-nav .mobile-nav-contact{align-items:center;background:#2a0e04;border:0;border-radius:999px;color:#fff9f5;display:inline-flex;font-size:14px;font-weight:700;justify-content:center;letter-spacing:.14em;margin-top:18px;min-height:52px;padding:0 28px;text-transform:uppercase;width:auto}
  .mobile-nav .mobile-nav-contact:after{content:'→';float:none;font-size:18px;margin:0 0 0 12px}
}
@media(max-width:480px){
  /* en pantallas angostas el contacto vive dentro del menú */
  .site-header .contact-button{display:none}
  .site-header .menu-toggle{margin-left:auto}
  .site-header,.site-header.is-scrolled{width:calc(100% - 24px)}
}
/* textos mínimos legibles y zonas táctiles cómodas */
.story-stats span,.product-tag,.brand-tag,.resto-menu-title,.footer-social-title,.space-card .card-link{font-size:11px}
.footer-legal a,.resto-address a,.shop-facts a{display:inline-flex;min-height:44px;align-items:center}
.brand{align-items:center;display:inline-flex;min-height:44px;min-width:44px}
/* tienda en móvil: tarjeta horizontal, cuatro productos sin scroll infinito */
@media(max-width:560px){
  .product-grid{gap:12px}
  .product-card{display:grid;grid-template-columns:minmax(108px,38%) 1fr;align-items:stretch}
  .product-image{background-size:cover;border-radius:10px;height:auto;margin:10px 0 10px 10px;min-height:132px}
  .product-card-content{padding:14px 14px 12px 16px}
  .product-card h3{font-size:1.1rem;margin:0 0 4px}
  .product-desc{font-size:13px;line-height:1.4;margin:0 0 8px}
  .product-price{font-size:17px;margin:0 0 4px}
  .product-cta{min-height:36px}
}
/* restaurantes en móvil: logo arriba, título y zona a todo lo ancho, estado sin partirse */
.resto-status{white-space:nowrap}
@media(max-width:560px){
  .resto-top{align-items:flex-start;flex-direction:column;gap:12px}
  .resto-logo{height:64px;object-position:left center;order:-1}
  .resto-card h3{font-size:clamp(1.7rem,8vw,2.1rem)}
  .resto-zone{letter-spacing:.08em}
  .resto-actions .btn--solid-dark{flex:1 1 100%;justify-content:center}
  .resto-actions .btn--ghost-line{flex:1 1 auto;justify-content:center}
}
/* pie en móvil: navegación más compacta */
@media(max-width:560px){
  .footer-nav{gap:0 22px;max-width:320px}
}
/* la zona roja con icono es ahora la única dirección y abre Google Maps */
.resto-zone a{align-items:flex-start;color:inherit;display:inline-flex;gap:7px;line-height:1.35;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:4px;transition:color .2s,text-decoration-color .2s}
.resto-zone a svg{flex:0 0 auto;height:15px;margin-top:1px;width:15px}
.resto-zone a:hover{color:#8d3b21;text-decoration-color:currentColor}
.resto-zone a:focus-visible{border-radius:4px;outline:2px solid var(--gold);outline-offset:3px}
@media(max-width:1100px){.resto-zone a{min-height:44px;padding:4px 0}}
/* escritorio: el logo grande ya no empuja la descripción hacia abajo;
   baja por la columna derecha, que está libre porque el párrafo ocupa sólo la mitad izquierda */
@media(min-width:901px){.resto-logo{margin-bottom:-200px;position:relative;z-index:0}}
/* "Escríbenos" sólo existe dentro del menú móvil; en la barra de escritorio ya está "Contáctanos" */
@media(min-width:801px){.site-header .mobile-nav .mobile-nav-contact{display:none}}
/* párrafos: cada renglón sube desde detrás de una máscara */
.rl-mask{display:inline-block;margin-bottom:-.18em;overflow:hidden;padding-bottom:.18em;vertical-align:top}
.rl-word{display:inline-block}
html.js .reveal-lines .rl-word{opacity:0;transform:translateY(105%) rotate(3deg);transform-origin:0 100%;transition:transform 1s cubic-bezier(.19,1,.22,1) var(--line-delay,.3s),opacity .7s ease var(--line-delay,.3s)}
html.js .reveal-lines.is-revealed .rl-word{opacity:1;transform:none}
/* listas (datos, dirección y horario): suben y aparecen, sin desenfoque */
html.js .reveal-text{opacity:0;transform:translateY(22px);transition:opacity .9s ease var(--reveal-delay,.3s),transform 1s cubic-bezier(.19,1,.22,1) var(--reveal-delay,.3s)}
html.js .reveal-text.is-revealed{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){html.js .reveal-lines .rl-word,html.js .reveal-text{opacity:1;transform:none;transition:none}}
/* ===== accesibilidad (WCAG 2.2 AA) ===== */
/* saltar al contenido: invisible hasta que se navega con teclado */
.skip-link{background:#2a0e04;border-radius:0 0 12px 12px;color:#fff9f5;font-size:14px;font-weight:700;left:16px;padding:12px 20px;position:fixed;top:0;transform:translateY(-120%);transition:transform .2s;z-index:200}
.skip-link:focus{outline:3px solid var(--gold);outline-offset:2px;transform:translateY(0)}
#contenido{display:block;height:0;outline:none}
/* foco visible en todos los enlaces y botones */
a:focus-visible,button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
/* menú móvil cerrado: fuera del orden de tabulación y de los lectores de pantalla */
@media(max-width:800px){.mobile-nav{visibility:hidden}.mobile-nav.is-open{visibility:visible}}
/* contraste mínimo 4.5:1 en textos pequeños */
.product-price small{color:rgba(24,37,42,.72)}
.shop-note{color:rgba(24,37,42,.78)}
.resto-menu-title{color:rgba(24,37,42,.66)}
/* tablet: la foto del hero vuelve a ser fondo a sangre completa, como en escritorio.
   Un velo oscuro más denso del lado del texto mantiene el contraste del h1 y el subtítulo */
@media(max-width:1000px){
  .hero{isolation:isolate;min-height:min(92svh,980px);display:flex;align-items:center}
  .hero-media{background-position:72% center;border-radius:0;inset:0;margin:0;min-height:0;position:absolute;z-index:0}
  .hero-media:after{background:linear-gradient(90deg,rgba(27,10,4,.86) 0%,rgba(27,10,4,.66) 48%,rgba(27,10,4,.34) 100%),linear-gradient(180deg,rgba(27,10,4,.55),transparent 22%,transparent 70%,rgba(27,10,4,.7));content:'';inset:0;position:absolute}
  .hero-inner{position:static}
  .hero-content{position:relative;z-index:1}
}
/* celular: la foto también es fondo. El texto ocupa todo el ancho, así que el velo va de arriba
   (muy oscuro, detrás del h1 y el subtítulo) hacia abajo (más ligero detrás de las tarjetas,
   que ya tienen su propio fondo oscuro), para que la foto se note */
@media(max-width:600px){
  .hero{min-height:100svh}
  .hero-media{background-position:62% center}
  .hero-media:after{background:linear-gradient(180deg,rgba(27,10,4,.84) 0%,rgba(27,10,4,.74) 38%,rgba(27,10,4,.5) 62%,rgba(27,10,4,.42) 82%,rgba(27,10,4,.8) 100%)}
}

/* =====================================================================
   ===== Oaxacaquí: ajustes sobre el diseño de Grupo aquí es Oaxaca =====
   ===================================================================== */
/* el logo de Oaxacaquí es horizontal: se ajusta por alto, no en cuadro */
.mobile-nav:before{content:'Oaxacaquí'}
.site-header .brand img{height:40px;object-fit:contain;width:auto}
.site-header.is-scrolled .brand img{height:34px;width:auto}
@media(max-width:800px){.site-header .brand img,.site-header.is-scrolled .brand img{height:36px;width:auto}}
/* sobre fondo café el gris del logo no se lee: va sobre una placa crema */
.loader-mark img{background:#fff9f5;border-radius:18px;height:112px;padding:14px 22px;width:auto}
.footer-brand img{background:#fff9f5;border-radius:12px;height:62px;padding:8px 14px;width:auto}
/* fotos propias de Oaxacaquí */
.hero-media{background-image:url('cards/oaxacaqui-web.webp');background-position:center 55%}
.story-image{aspect-ratio:847/1024;background-color:#e6d8c8;background-position:center;background-size:cover}
.scroll-showcase-image{background:radial-gradient(ellipse 58% 42% at 50% 50%,rgba(27,10,4,.62),rgba(27,10,4,.28) 55%,rgba(27,10,4,0) 80%),linear-gradient(180deg,rgba(27,10,4,.38),rgba(27,10,4,.08) 28%,rgba(27,10,4,.08) 72%,rgba(27,10,4,.42)),url('platillos/tlayuda-doblada-grande.jpg') center/cover}
@media(max-width:600px),(max-aspect-ratio:4/5){
  .scroll-showcase-image{background:radial-gradient(ellipse 80% 30% at 50% 50%,rgba(27,10,4,.66),rgba(27,10,4,.3) 55%,rgba(27,10,4,0) 85%),linear-gradient(180deg,rgba(27,10,4,.4),rgba(27,10,4,.1) 25%,rgba(27,10,4,.1) 75%,rgba(27,10,4,.45)),url('platillos/tlayuda-doblada-grande.jpg') center/cover}
}
.resto-photo--oaxacaqui{background-image:url('historia/oaxacaqui-fachada.jpg');background-position:center 60%}
.text-link{color:var(--rust)}

/* ===== línea del tiempo ===== */
.timeline{background:#fff9f5;max-width:none;overflow:hidden;padding-left:max(8vw,32px);padding-right:max(8vw,32px);padding-top:0}
.timeline-head{align-items:flex-end;display:flex;gap:24px;justify-content:space-between;margin-bottom:clamp(26px,3.5vw,42px)}
.timeline-head .eyebrow{margin-bottom:14px}
.timeline-head h2,.carta-header h2,.feed-intro h2,.contact-intro h2{font-family:'Cinzel',Georgia,'Times New Roman',serif;font-size:min(clamp(2.1rem,4vw,3.2rem),52px);font-weight:600;letter-spacing:.01em;line-height:1.12;margin:0}
.timeline-controls{display:flex;flex:0 0 auto;gap:10px}
.timeline-controls .btn{background:var(--paper);cursor:pointer}
.timeline-controls .btn:disabled{cursor:default;opacity:.35;transform:none}
.timeline-track{display:grid;gap:20px;grid-auto-columns:clamp(260px,27vw,350px);grid-auto-flow:column;list-style:none;margin:0 calc(-1 * max(8vw,32px));overflow-x:auto;padding:6px max(8vw,32px) 22px;scroll-behavior:smooth;scroll-padding-inline:max(8vw,32px);scroll-snap-type:x mandatory;scrollbar-color:rgba(154,94,46,.4) transparent;scrollbar-width:thin}
.timeline-track:focus-visible{outline:3px solid var(--gold);outline-offset:-3px}
.timeline-item{background:var(--paper);border:1px solid rgba(24,37,42,.08);border-radius:18px;display:flex;flex-direction:column;overflow:hidden;position:relative;scroll-snap-align:start}
.timeline-item img{aspect-ratio:3/2;display:block;height:auto;object-fit:cover;width:100%}
/* foto vertical: se encuadra desde arriba para que se vean los letreros */
.timeline-item img.timeline-photo--top{object-position:center 12%}
.timeline-body{padding:20px 22px 24px;position:relative}
.timeline-body:before{background:var(--gold);border:3px solid var(--paper);border-radius:50%;content:'';height:16px;left:22px;position:absolute;top:-9px;width:16px}
.timeline-year{color:#9a5e2e;font-family:'Cinzel',Georgia,'Times New Roman',serif;font-size:clamp(1.5rem,2.2vw,1.9rem);font-weight:600;line-height:1.1;margin:0 0 10px}
.timeline-body p:not(.timeline-year){color:rgba(24,37,42,.74);font-size:14.5px;line-height:1.55;margin:0}
.timeline-item--now{background:#2a0e04;border-color:#2a0e04}
.timeline-now-mark{align-items:center;aspect-ratio:3/2;background:#f2ede4;display:flex;justify-content:center}
.timeline-now-mark img{aspect-ratio:auto;height:auto;object-fit:contain;width:62%}
.timeline-item--now .timeline-body:before{border-color:#2a0e04}
.timeline-item--now .timeline-year{color:var(--gold)}
.timeline-item--now .timeline-body p:not(.timeline-year){color:rgba(255,249,245,.82)}
@media(max-width:700px){.timeline-head{align-items:flex-start;flex-direction:column}.timeline-track{grid-auto-columns:min(82vw,320px)}}

/* ===== favoritos de la casa: carrusel 3D (coverflow) =====
   Mismo lenguaje que el hero: café casi negro, dorado y Cinzel. La tarjeta central
   muestra el texto; las laterales giran hacia atrás y sólo dejan ver la foto. */
.dish-carousel{--card-w:clamp(250px,24vw,320px);background:var(--hero-dark);border-radius:24px;color:#fff9f5;isolation:isolate;overflow:hidden;padding:clamp(30px,4vw,48px) 0 clamp(26px,3vw,36px);position:relative}
.dish-ambient{inset:0;pointer-events:none;position:absolute;z-index:-1}
.dish-ambient img{filter:brightness(.34) blur(34px) saturate(1.15);height:100%;inset:0;object-fit:cover;opacity:0;position:absolute;transform:scale(1.2);transition:opacity 1s ease;width:100%}
.dish-ambient img.is-active{opacity:1}
.dish-ambient:after{background:radial-gradient(ellipse at center,rgba(27,10,4,.2) 0%,rgba(27,10,4,.9) 100%);content:'';inset:0;position:absolute}
.dish-label{align-items:center;color:var(--gold);display:flex;font-size:11px;font-weight:700;gap:14px;justify-content:center;letter-spacing:.24em;margin:0 0 clamp(18px,2.4vw,28px);text-transform:uppercase}
.dish-label span{background:linear-gradient(90deg,transparent,var(--gold));display:block;height:1px;width:38px}
.dish-label span:last-child{background:linear-gradient(90deg,var(--gold),transparent)}
.dish-stage{height:calc(var(--card-w) * 1.5 + 12px);perspective:1400px;position:relative;touch-action:pan-y}
.dish-card{aspect-ratio:2/3;background:#2a0e04;border:1px solid rgba(255,249,245,.14);border-radius:18px;box-shadow:0 16px 36px rgba(0,0,0,.45);cursor:pointer;left:50%;margin-left:calc(var(--card-w) / -2);opacity:0;overflow:hidden;position:absolute;top:6px;transform:scale(.4);width:var(--card-w)}
/* las transiciones se activan después de la primera colocación, para que no "crezcan" al cargar */
.dish-carousel.is-ready .dish-card{transition:transform .8s cubic-bezier(.25,1,.5,1),opacity .8s cubic-bezier(.25,1,.5,1),filter .8s ease,box-shadow .8s ease}
.dish-photo{height:100%;inset:0;object-fit:cover;position:absolute;width:100%}
.dish-card:after{background:linear-gradient(180deg,rgba(27,10,4,.42) 0%,rgba(27,10,4,.06) 24%,rgba(27,10,4,.62) 56%,rgba(27,10,4,.96) 100%);content:'';inset:0;pointer-events:none;position:absolute}
.dish-content{display:flex;flex-direction:column;height:100%;justify-content:space-between;opacity:0;padding:18px 20px 22px;position:relative;text-align:center;transform:translateY(16px);z-index:1}
.dish-carousel.is-ready .dish-content{transition:opacity .5s ease,transform .5s ease}
.dish-tag{align-self:flex-start;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:rgba(27,10,4,.55);border:1px solid rgba(212,161,76,.4);border-radius:999px;color:var(--gold);font-size:10px;font-weight:700;letter-spacing:.16em;margin:0;padding:6px 12px;text-transform:uppercase}
.dish-body{align-items:center;display:flex;flex-direction:column}
.dish-title{color:#fff9f5;font-family:'Cinzel',Georgia,'Times New Roman',serif;font-size:clamp(1.3rem,1.9vw,1.6rem);font-weight:600;letter-spacing:.01em;line-height:1.15;margin:0;text-shadow:0 3px 12px rgba(0,0,0,.7)}
.dish-rule{background:var(--gold);border-radius:2px;display:block;height:2px;margin:12px auto 10px;width:34px}
.dish-desc{color:rgba(255,249,245,.86);font-size:13.5px;line-height:1.45;margin:0 0 10px;max-width:30ch}
.dish-price{color:var(--gold);font-size:19px;font-weight:700;letter-spacing:-.01em;margin:0 0 14px}
.dish-cta{align-items:center;background:#fff9f5;border-radius:999px;color:#2a0e04;display:inline-flex;font-size:11px;font-weight:700;gap:8px;letter-spacing:.12em;min-height:44px;padding:0 20px;text-transform:uppercase;transition:background .2s,transform .2s}
.dish-cta span{font-size:15px}
.dish-cta:hover{background:var(--gold);transform:translateY(-2px)}
/* posiciones: 0 al centro, ±1 y ±2 a los lados */
.dish-card[data-pos="0"]{box-shadow:0 26px 60px rgba(0,0,0,.6),0 0 0 1px rgba(212,161,76,.35),0 0 36px rgba(212,161,76,.18);cursor:default;opacity:1;transform:none;z-index:3}
.dish-card[data-pos="0"] .dish-content{opacity:1;transform:none}
.dish-card[data-pos="1"],.dish-card[data-pos="-1"]{filter:brightness(.62);opacity:.8;z-index:2}
.dish-card[data-pos="1"]{transform:translateX(calc(var(--card-w) * .88)) scale(.84) rotateY(-24deg)}
.dish-card[data-pos="-1"]{transform:translateX(calc(var(--card-w) * -.88)) scale(.84) rotateY(24deg)}
.dish-card[data-pos="2"],.dish-card[data-pos="-2"]{filter:brightness(.45);opacity:.45;z-index:1}
.dish-card[data-pos="2"]{transform:translateX(calc(var(--card-w) * 1.58)) scale(.68) rotateY(-38deg)}
.dish-card[data-pos="-2"]{transform:translateX(calc(var(--card-w) * -1.58)) scale(.68) rotateY(38deg)}
.dish-card[data-pos="1"]:hover,.dish-card[data-pos="-1"]:hover{filter:brightness(.8)}
.dish-controls{align-items:center;display:flex;gap:14px;justify-content:center;margin-top:clamp(16px,2vw,24px);padding:0 16px;position:relative}
.dish-arrow,.dish-pause{align-items:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:rgba(27,10,4,.55);border:1px solid rgba(255,249,245,.24);border-radius:50%;color:#fff9f5;cursor:pointer;display:inline-flex;height:46px;justify-content:center;padding:0;transition:background .2s,border-color .2s,color .2s;width:46px}
.dish-arrow:hover,.dish-pause:hover{border-color:var(--gold);color:var(--gold)}
.dish-arrow svg{height:20px;width:20px}
.dish-pause{height:40px;position:absolute;right:clamp(16px,3vw,32px);width:40px}
.dish-pause svg{height:15px;width:15px}
.dish-pause .icon-play,.dish-carousel.is-paused .dish-pause .icon-pause{display:none}
.dish-carousel.is-paused .dish-pause .icon-play{display:block}
.dish-dots{align-items:center;display:flex;gap:4px}
.dish-dot{align-items:center;background:none;border:0;cursor:pointer;display:inline-flex;height:44px;justify-content:center;padding:0;width:22px}
.dish-dot:before{background:rgba(255,249,245,.3);border-radius:999px;content:'';display:block;height:8px;transition:width .3s ease,background .3s ease;width:8px}
.dish-dot[aria-current=true]{width:36px}
.dish-dot[aria-current=true]:before{background:var(--gold);box-shadow:0 0 10px rgba(212,161,76,.6);width:28px}
.dish-live{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}
.dish-carousel :focus-visible{outline:3px solid var(--gold);outline-offset:3px}
/* celular: la tarjeta central ocupa casi todo; asoma sólo una a cada lado */
@media(max-width:700px){
  .dish-carousel{--card-w:min(70vw,290px);border-radius:18px;margin-inline:calc(-1 * max(8vw,32px) + 12px)}
  .dish-card[data-pos="1"]{transform:translateX(calc(var(--card-w) * .72)) scale(.8) rotateY(-24deg)}
  .dish-card[data-pos="-1"]{transform:translateX(calc(var(--card-w) * -.72)) scale(.8) rotateY(24deg)}
  .dish-card[data-pos="2"],.dish-card[data-pos="-2"]{opacity:0}
  .dish-pause{position:static}
}
@media(prefers-reduced-motion:reduce){.dish-carousel.is-ready .dish-card,.dish-carousel.is-ready .dish-content,.dish-ambient img{transition:none}}
/* sin JavaScript: las tarjetas en fila, se recorren deslizando */
html:not(.js) .dish-stage{display:flex;gap:16px;height:auto;overflow-x:auto;padding:6px 24px;perspective:none;scroll-snap-type:x mandatory}
html:not(.js) .dish-card{flex:0 0 var(--card-w);margin:0;opacity:1;position:relative;scroll-snap-align:center;top:0;transform:none}
html:not(.js) .dish-content{opacity:1;transform:none}
html:not(.js) .dish-controls,html:not(.js) .dish-ambient img:not(.is-active){display:none}
@media(forced-colors:active){.dish-card{border-color:CanvasText}.dish-dot:before{background:CanvasText}}

/* variante clara del carrusel: sin panel café, sobre el crema de la sección.
   Se activa agregando la clase dish-carousel--light al contenedor. */
/* ocupa todo el ancho de la pantalla para que las tarjetas laterales se corten en el borde, no en el margen del texto */
.dish-carousel--light{background:transparent;border-radius:0;color:var(--ink);margin-inline:calc(-1 * max(8vw,32px));overflow:visible;overflow-x:clip;padding-top:clamp(10px,2vw,20px)}
.dish-carousel--light .dish-pause{right:max(8vw,32px)}
.dish-carousel--light .dish-ambient{display:none}
.dish-carousel--light .dish-stage:before{background:radial-gradient(ellipse at center,rgba(212,161,76,.22),rgba(212,161,76,0) 62%);content:'';inset:-6% 18%;pointer-events:none;position:absolute}
.dish-carousel--light .dish-label{color:var(--rust)}
.dish-carousel--light .dish-label span{background:linear-gradient(90deg,transparent,var(--rust))}
.dish-carousel--light .dish-label span:last-child{background:linear-gradient(90deg,var(--rust),transparent)}
.dish-carousel--light .dish-card{border-color:rgba(24,37,42,.1);box-shadow:0 18px 40px rgba(42,14,4,.16)}
.dish-carousel--light .dish-card[data-pos="0"]{box-shadow:0 28px 60px rgba(42,14,4,.28),0 0 0 1px rgba(212,161,76,.5)}
.dish-carousel--light .dish-card[data-pos="1"],.dish-carousel--light .dish-card[data-pos="-1"]{filter:brightness(.9) saturate(.85);opacity:1}
.dish-carousel--light .dish-card[data-pos="2"],.dish-carousel--light .dish-card[data-pos="-2"]{filter:brightness(.82) saturate(.7);opacity:.6}
.dish-carousel--light .dish-card[data-pos="1"]:hover,.dish-carousel--light .dish-card[data-pos="-1"]:hover{filter:none}
.dish-carousel--light .dish-arrow,.dish-carousel--light .dish-pause{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--paper);border-color:rgba(24,37,42,.16);color:var(--ink)}
.dish-carousel--light .dish-arrow:hover,.dish-carousel--light .dish-pause:hover{border-color:var(--ink);color:var(--rust)}
.dish-carousel--light .dish-dot:before{background:rgba(24,37,42,.22)}
.dish-carousel--light .dish-dot[aria-current=true]:before{background:var(--rust);box-shadow:none}
@media(max-width:700px){.dish-carousel--light{margin-inline:calc(-1 * max(8vw,32px))}.dish-carousel--light .dish-stage:before{display:none}}
@media(forced-colors:active){.dish-carousel--light .dish-dot:before{background:CanvasText}}

/* ===== menú completo ===== */
.carta{background:#fff9f5;max-width:none;padding-left:max(8vw,32px);padding-right:max(8vw,32px);padding-top:0;position:relative;z-index:2}
.carta-header{margin-bottom:clamp(26px,3.5vw,40px);max-width:740px}
.carta-header .eyebrow{margin-bottom:14px}
.carta-lead{color:rgba(24,37,42,.75);font-size:clamp(1rem,1.3vw,1.12rem);line-height:1.55;margin:18px 0 0;max-width:60ch}
.carta-tabs{display:flex;gap:8px;margin:0 calc(-1 * max(8vw,32px)) 22px;overflow-x:auto;padding:4px max(8vw,32px) 8px;scrollbar-width:none}
.carta-tabs::-webkit-scrollbar{display:none}
.carta-tab{background:var(--paper);border:1px solid rgba(24,37,42,.16);border-radius:999px;color:var(--ink);cursor:pointer;flex:0 0 auto;font-size:13px;font-weight:600;min-height:44px;padding:10px 18px;transition:background .2s,border-color .2s,color .2s;white-space:nowrap}
.carta-tab:hover{border-color:var(--ink)}
.carta-tab[aria-selected=true]{background:#2a0e04;border-color:#2a0e04;color:#fff9f5}
.carta-panel{background:var(--paper);border:1px solid rgba(24,37,42,.08);border-radius:20px;padding:clamp(22px,3.2vw,44px)}
html:not(.js) .carta-tabs{display:none}
html:not(.js) .carta-panel+.carta-panel{margin-top:20px}
html.js .carta-panel.is-entering{animation:carta-in .45s cubic-bezier(.22,1,.36,1)}
@keyframes carta-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.carta-title{font-family:'Cinzel',Georgia,'Times New Roman',serif;font-size:clamp(1.5rem,2.4vw,2rem);font-weight:600;letter-spacing:.01em;line-height:1.15;margin:0 0 6px}
.carta-note{color:var(--rust);font-size:13px;font-weight:600;margin:0 0 6px}
.carta-list{column-gap:clamp(32px,5vw,72px);columns:2;list-style:none;margin:14px 0 0;padding:0}
.carta-item{border-bottom:1px solid rgba(24,37,42,.08);break-inside:avoid;padding:15px 0}
.carta-row{align-items:baseline;display:flex;gap:10px;margin:0}
.carta-name{color:var(--ink);font-size:16px;font-weight:600;line-height:1.35}
.carta-dots{border-bottom:1px dotted rgba(24,37,42,.32);flex:1;min-width:14px;transform:translateY(-4px)}
.carta-price{color:var(--rust);flex:0 0 auto;font-size:16px;font-weight:700}
.carta-badge{background:rgba(169,71,41,.1);border-radius:999px;color:#8d3b21;display:inline-block;font-size:11px;font-weight:700;letter-spacing:.08em;margin:6px 0 0;padding:4px 10px;text-transform:uppercase}
.carta-desc{color:rgba(24,37,42,.7);font-size:14px;line-height:1.45;margin:4px 0 0;max-width:52ch}
.carta-options{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:10px 0 0;padding:0}
.carta-options li{background:rgba(212,161,76,.16);border-radius:999px;color:#6b3f12;font-size:12.5px;font-weight:600;padding:6px 12px}
.carta-options strong{color:var(--rust);font-weight:700;margin-left:4px}
@media(max-width:800px){.carta-list{columns:1}}
@media(prefers-reduced-motion:reduce){html.js .carta-panel.is-entering{animation:none}}

/* ===== instagram ===== */
.feed{align-items:start;background:#2a0e04;color:#fff9f5;display:grid;gap:clamp(36px,6vw,96px);grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);max-width:none;padding-left:max(8vw,32px);padding-right:max(8vw,32px)}
.feed .eyebrow{color:var(--gold);margin-bottom:14px}
.feed-intro h2{color:#fff9f5}
.feed-lead{color:rgba(255,249,245,.8);font-size:clamp(1rem,1.3vw,1.12rem);margin:18px 0 26px}
.feed-profile{border-bottom:1px solid rgba(255,249,245,.18);border-top:1px solid rgba(255,249,245,.18);margin-bottom:28px;padding:18px 0}
.feed-handle{color:var(--gold);font-size:14px;font-weight:700;letter-spacing:.06em;margin:0 0 10px}
.feed-bio{display:grid;gap:6px;list-style:none;margin:0;padding:0}
.feed-bio li{color:rgba(255,249,245,.82);font-size:14.5px;padding-left:18px;position:relative}
.feed-bio li:before{background:var(--gold);border-radius:50%;content:'';height:6px;left:0;position:absolute;top:.62em;width:6px}
.feed-posts{display:grid;gap:12px;list-style:none;margin:0;padding:0}
.feed-post a{align-items:center;border:1px solid rgba(255,249,245,.18);border-radius:16px;display:flex;gap:18px;justify-content:space-between;min-height:76px;padding:18px 22px;transition:background .2s,border-color .2s,transform .2s}
.feed-post a:hover{background:rgba(255,249,245,.06);border-color:rgba(255,249,245,.5);transform:translateX(4px)}
.feed-post-text{font-family:'Cinzel',Georgia,'Times New Roman',serif;font-size:clamp(1rem,1.4vw,1.15rem);font-weight:600;line-height:1.3}
.feed-post-cta{color:var(--gold);flex:0 0 auto;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.feed-post-cta span{font-size:15px;margin-left:4px}
@media(max-width:900px){.feed{grid-template-columns:1fr}}
@media(max-width:480px){.feed-post a{align-items:flex-start;flex-direction:column;gap:10px}}
@media(hover:none){.feed-post a:hover{transform:none}}

/* ===== contacto ===== */
.contact{align-items:start;background:#fff9f5;display:grid;gap:clamp(36px,6vw,96px);grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);max-width:none;padding-left:max(8vw,32px);padding-right:max(8vw,32px)}
.contact-intro .eyebrow{margin-bottom:14px}
.contact-lead{color:rgba(24,37,42,.75);font-size:clamp(1rem,1.3vw,1.12rem);margin:18px 0 0;max-width:44ch}
.contact-facts{flex-direction:column;gap:4px}
.contact-form{background:var(--paper);border:1px solid rgba(24,37,42,.08);border-radius:20px;display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));padding:clamp(22px,3vw,40px)}
.field{display:flex;flex-direction:column;gap:8px}
.field--full{grid-column:1/-1}
.field label{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.field label span{color:var(--rust)}
.field input,.field textarea{background:#fff9f5;border:1px solid rgba(24,37,42,.2);border-radius:12px;color:var(--ink);font:inherit;font-size:16px;min-height:50px;padding:12px 14px;transition:border-color .2s,box-shadow .2s;width:100%}
.field textarea{min-height:140px;resize:vertical}
.field input:focus,.field textarea:focus{border-color:#2a0e04;box-shadow:0 0 0 3px rgba(212,161,76,.45);outline:none}
.field input[aria-invalid=true]{border-color:var(--rust)}
.form-error{color:#8d3b21;font-size:14px;font-weight:600;grid-column:1/-1;margin:0}
.form-actions{align-items:center;display:flex;flex-wrap:wrap;gap:12px 20px}
.form-actions .btn{cursor:pointer}
.form-note{color:rgba(24,37,42,.66);font-size:13px;margin:0}
@media(max-width:900px){.contact{grid-template-columns:1fr}}
@media(max-width:560px){.contact-form{grid-template-columns:1fr}.form-actions .btn{justify-content:center;width:100%}}

/* ===== alineación: todas las secciones con el mismo margen lateral ===== */
/* la sección del menú heredaba 7vw de la tienda del grupo; el resto del sitio usa 8vw */
.shop{padding-left:max(8vw,32px);padding-right:max(8vw,32px)}
/* ningún elemento puede ensanchar la página y provocar que se mueva de lado
   (clip no crea contenedor de scroll, así que el showreel "sticky" sigue funcionando) */
html,body{overflow-x:clip}

/* ===== fotos de los platillos en el menú completo ===== */
.carta-item--foto{align-items:start;display:grid;gap:14px;grid-template-columns:72px minmax(0,1fr)}
.carta-thumb{aspect-ratio:1;border-radius:12px;box-shadow:0 4px 12px rgba(42,14,4,.12);display:block;height:auto;object-fit:cover;width:72px}
.carta-text{min-width:0}
@media(max-width:560px){.carta-item--foto{gap:12px;grid-template-columns:60px minmax(0,1fr)}.carta-thumb{width:60px}}

/* ===== carrusel: foto arriba y texto abajo =====
   Las fotos de platillos son cuadradas y el plato queda en la mitad de abajo; con el texto
   encima de la foto se tapaba justo el platillo. Ahora la foto ocupa la parte de arriba
   completa y el texto va debajo, sobre fondo liso. */
.dish-carousel{--card-h:calc(var(--card-w) * 1.62)}
.dish-stage{height:calc(var(--card-h) + 16px)}
.dish-card{aspect-ratio:auto;display:flex;flex-direction:column;height:var(--card-h)}
.dish-card:after{display:none}
.dish-photo{aspect-ratio:1/1.02;flex:0 0 auto;height:auto;inset:auto;object-fit:cover;object-position:center 70%;position:relative;width:100%}
.dish-content{flex:1;height:auto;inset:0;justify-content:flex-end;opacity:1;padding:0;position:absolute;text-align:left;transform:none}
.dish-tag{left:14px;position:absolute;top:14px}
.dish-body{align-items:stretch;background:#2a0e04;display:flex;flex-direction:column;gap:6px;height:calc(var(--card-h) - var(--card-w) * 1.02);padding:16px 18px 18px}
.dish-body{position:relative}
.dish-body:before{background:linear-gradient(180deg,rgba(42,14,4,0),#2a0e04);content:'';height:36px;left:0;pointer-events:none;position:absolute;right:0;top:-36px}
.dish-title{font-size:clamp(1.15rem,1.6vw,1.35rem);text-shadow:none}
.dish-rule{display:none}
.dish-desc{-webkit-box-orient:vertical;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;margin:0;max-width:none;overflow:hidden}
.dish-foot{align-items:center;display:flex;gap:12px;justify-content:space-between;margin-top:auto}
.dish-price{margin:0}
.dish-cta{min-height:40px;padding:0 16px}
/* las tarjetas de los lados enseñan su texto, pero atenuado */
.dish-card .dish-content{transition:none}
.dish-card:not([data-pos="0"]) .dish-foot{visibility:hidden}
/* versión clara: cuerpo blanco como las tarjetas del resto del sitio */
.dish-carousel--light .dish-card{background:var(--paper)}
.dish-carousel--light .dish-body{background:var(--paper)}
.dish-carousel--light .dish-body:before{background:linear-gradient(180deg,rgba(255,255,255,0),var(--paper))}
.dish-carousel--light .dish-title{color:var(--ink)}
.dish-carousel--light .dish-desc{color:rgba(24,37,42,.72)}
.dish-carousel--light .dish-price{color:var(--rust)}
.dish-carousel--light .dish-cta{background:#2a0e04;color:#fff9f5}
.dish-carousel--light .dish-cta:hover{background:var(--rust);color:#fff9f5}
@media(max-width:700px){.dish-carousel{--card-h:calc(var(--card-w) * 1.7)}}

/* ===== orden nuevo: favoritos y menú completo justo después del hero ===== */
/* el menú ya no sube encima del showreel; ese efecto de "cortina" ahora lo hace "Visítanos" */
.shop.menu-featured{margin-top:0}
.restaurants{margin-top:-100vh;padding-top:clamp(88px,11vw,160px);position:relative;z-index:2}
@supports(height:100svh){.shop.menu-featured{margin-top:0}.restaurants{margin-top:-100svh}}
/* la historia ahora viene después del menú (mismo crema): separación normal arriba */
.carta{padding-bottom:clamp(88px,11vw,160px)}


/* hero a pantalla completa en todos los tamaños, con el texto centrado en vertical.
   El relleno de arriba deja libre la barra flotante; el de abajo lo equilibra. */
.hero{align-items:center;display:flex;min-height:100vh;padding-bottom:clamp(48px,8vh,96px);padding-top:clamp(120px,16vh,180px)}
@supports(height:100svh){.hero{min-height:100svh}}
@media(max-width:1000px){.hero{min-height:100vh}}
@supports(height:100svh){@media(max-width:1000px){.hero{min-height:100svh}}}

/* título de "Favoritos de la casa": mismo estilo que los demás encabezados de sección */
.menu-header{margin-bottom:clamp(26px,3.5vw,40px);max-width:740px}
.menu-header .eyebrow{margin-bottom:14px}
.menu-header h2{font-family:'Cinzel',Georgia,'Times New Roman',serif;font-size:min(clamp(2.1rem,4vw,3.2rem),52px);font-weight:600;letter-spacing:.01em;line-height:1.12;margin:0}
.dish-carousel--light{padding-top:0}

/* ===== Instagram: galería con las publicaciones recientes =====
   Fondo crema un tono más oscuro que las secciones vecinas, para separarla sin cortar el ritmo. */
.feed{background:#fff9f5;color:var(--ink);display:block}
.feed .eyebrow{color:var(--ink)}
.feed-intro h2{color:#9a5e2e}
.feed-lead{color:rgba(24,37,42,.75);margin:18px 0 0;max-width:52ch}
.feed-head{align-items:flex-end;display:flex;gap:24px 40px;justify-content:space-between;margin-bottom:clamp(26px,3.5vw,40px)}
.feed-intro .eyebrow{margin-bottom:14px}
/* tarjeta de perfil: se reconoce de inmediato como la cuenta y lleva a seguirla */
.feed-profile{align-items:center;background:var(--paper);margin:0;border:1px solid rgba(24,37,42,.1);border-radius:999px;display:flex;flex:0 0 auto;gap:14px;padding:8px 8px 8px 10px;transition:border-color .2s,box-shadow .2s,transform .2s}
.feed-profile:hover{border-color:rgba(24,37,42,.22);box-shadow:0 12px 28px rgba(42,14,4,.1);transform:translateY(-2px)}
.feed-avatar{align-items:center;background:#fff9f5;border:2px solid transparent;border-radius:50%;box-shadow:0 0 0 2px var(--rust);display:flex;height:52px;justify-content:center;overflow:hidden;width:52px}
.feed-avatar img{height:auto;width:84%}
.feed-profile-text{display:flex;flex-direction:column;gap:2px;line-height:1.25}
.feed-profile-text strong{font-size:15px}
.feed-profile-text span{color:rgba(24,37,42,.66);font-size:12.5px}
.feed-follow{align-items:center;background:#2a0e04;border-radius:999px;color:#fff9f5;display:inline-flex;font-size:12px;font-weight:700;gap:8px;letter-spacing:.1em;min-height:44px;padding:0 18px;text-transform:uppercase;transition:background .2s}
.feed-follow svg{height:17px;width:17px}
.feed-profile:hover .feed-follow{background:var(--rust)}
/* rejilla: 6 columnas en escritorio (5 publicaciones + "ver todo") */
.feed-grid{display:grid;gap:14px;grid-template-columns:repeat(6,minmax(0,1fr));list-style:none;margin:0;padding:0}
.feed-tile a{aspect-ratio:3/4;border-radius:16px;display:block;isolation:isolate;overflow:hidden;position:relative}
.feed-tile img{height:100%;inset:0;object-fit:cover;position:absolute;transition:transform .6s cubic-bezier(.22,1,.36,1);width:100%}
.feed-tile a:hover img,.feed-tile a:focus-visible img{transform:scale(1.05)}
.feed-badge{align-items:center;background:rgba(27,10,4,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:50%;color:#fff9f5;display:flex;height:30px;justify-content:center;position:absolute;right:10px;top:10px;width:30px;z-index:2}
.feed-badge svg{height:14px;margin-left:2px;width:14px}
.feed-overlay{background:linear-gradient(180deg,rgba(27,10,4,0) 30%,rgba(27,10,4,.88));color:#fff9f5;display:flex;flex-direction:column;gap:6px;inset:0;justify-content:flex-end;opacity:0;padding:16px;position:absolute;transition:opacity .3s ease;z-index:1}
.feed-tile a:hover .feed-overlay,.feed-tile a:focus-visible .feed-overlay{opacity:1}
.feed-dish{color:var(--gold);font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.feed-caption{-webkit-box-orient:vertical;display:-webkit-box;font-size:13.5px;line-height:1.4;-webkit-line-clamp:4;line-clamp:4;overflow:hidden}
.feed-cta{font-size:11px;font-weight:700;letter-spacing:.12em;margin-top:4px;text-transform:uppercase}
.feed-tile a:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
/* última casilla: invita a ver el perfil completo */
.feed-tile--more a{align-items:center;background:#2a0e04;color:#fff9f5;display:flex;flex-direction:column;gap:8px;justify-content:center;padding:18px;text-align:center;transition:background .2s}
.feed-tile--more a:hover{background:var(--rust)}
.feed-more-icon{align-items:center;border:1px solid rgba(255,249,245,.35);border-radius:50%;display:flex;height:56px;justify-content:center;margin-bottom:6px;width:56px}
.feed-more-icon svg{height:26px;width:26px}
.feed-more-title{font-family:'Cinzel',Georgia,'Times New Roman',serif;font-size:clamp(1.05rem,1.4vw,1.25rem);font-weight:600;line-height:1.2}
.feed-more-handle{color:var(--gold);font-size:13px;font-weight:600}
/* pantallas táctiles: sin hover, el texto va siempre visible pero discreto */
@media(hover:none){
  .feed-overlay{background:linear-gradient(180deg,rgba(27,10,4,0) 55%,rgba(27,10,4,.82));opacity:1}
  .feed-caption,.feed-cta{display:none}
}
/* tablet: 3 columnas, dos filas completas */
@media(max-width:1100px){.feed-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* celular: fila que se desliza de lado y deja asomar la siguiente */
@media(max-width:700px){
  .feed-head{align-items:flex-start;flex-direction:column}
  .feed-profile{align-self:stretch}
  .feed-profile-text{flex:1;min-width:0}
  .feed-profile-text span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .feed-grid{display:flex;gap:12px;margin-inline:calc(-1 * max(8vw,32px));overflow-x:auto;padding:0 max(8vw,32px) 6px;scroll-padding-inline:max(8vw,32px);scroll-snap-type:x mandatory;scrollbar-width:none}
  .feed-grid::-webkit-scrollbar{display:none}
  .feed-tile{flex:0 0 62%;scroll-snap-align:start}
}
@media(max-width:420px){.feed-profile-text span{display:none}}
@media(prefers-reduced-motion:reduce){.feed-tile img,.feed-overlay,.feed-profile{transition:none}.feed-tile a:hover img{transform:none}}

/* ===== Instagram en mosaico: la publicación más reciente en grande =====
   Escritorio: la destacada ocupa una columna doble y dos filas; alrededor, 4 publicaciones
   y la casilla "Ver todo". Todas las casillas conservan la proporción 3:4 de Instagram. */
.feed-grid{grid-template-columns:2fr repeat(3,minmax(0,1fr))}
.feed-tile--featured{grid-row:span 2}
.feed-tile--featured a{aspect-ratio:auto;height:100%;min-height:100%}
.feed-tile--featured .feed-overlay{background:linear-gradient(180deg,rgba(27,10,4,0) 45%,rgba(27,10,4,.9));opacity:1;padding:clamp(18px,2vw,28px)}
.feed-tile--featured .feed-caption{font-family:'Cinzel',Georgia,'Times New Roman',serif;font-size:clamp(1.1rem,1.6vw,1.45rem);font-weight:600;line-height:1.3}
.feed-new{align-self:flex-start;background:var(--gold);border-radius:999px;color:#2a0e04;font-size:10.5px;font-weight:700;letter-spacing:.12em;margin-bottom:4px;padding:5px 11px;text-transform:uppercase}
/* fecha: siempre visible, discreta, en la esquina superior izquierda */
.feed-date{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:rgba(27,10,4,.55);border-radius:999px;color:#fff9f5;font-size:11px;font-weight:600;left:10px;padding:5px 10px;position:absolute;top:10px;z-index:2}
/* tablet: la destacada ocupa 2 de 3 columnas; 3 filas completas */
@media(max-width:1100px){
  .feed-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .feed-tile--featured{grid-column:span 2}
}
/* celular: la destacada un poco más ancha al inicio de la fila deslizable */
@media(max-width:700px){
  .feed-tile--featured{flex-basis:78%}
  .feed-tile--featured a{aspect-ratio:3/4;height:auto}
}
@media(hover:none){.feed-tile--featured .feed-caption{display:-webkit-box}}
/* escritorio: "Ver todo" ocupa las dos casillas que quedan en la segunda fila, sin hueco */
@media(min-width:1101px){
  .feed-tile--more{grid-column:span 2}
  .feed-tile--more a{aspect-ratio:auto;flex-direction:row;gap:18px;height:100%;justify-content:center;text-align:left}
  .feed-tile--more .feed-more-icon{flex:0 0 auto;margin:0}
  .feed-more-text{display:flex;flex-direction:column;gap:6px}
}
/* celular: más contraste detrás del texto de la destacada y letra un poco menor */
@media(max-width:700px){
  .feed-tile--featured .feed-overlay{background:linear-gradient(180deg,rgba(27,10,4,0) 25%,rgba(27,10,4,.92) 75%)}
  .feed-tile--featured .feed-caption{font-size:1.02rem}
}
.feed-more-text{display:flex;flex-direction:column;gap:6px}

/* =====================================================================
   ===== Línea del tiempo: barra de años + un capítulo a la vez =====
   ===================================================================== */
.tl-counter{color:rgba(24,37,42,.5);flex:0 0 auto;font-size:14px;font-variant-numeric:tabular-nums;font-weight:600;letter-spacing:.08em;margin:0}
.tl-counter-current{color:#9a5e2e;font-family:'Cinzel',Georgia,'Times New Roman',serif;font-size:1.9rem;font-weight:600;letter-spacing:0}
/* barra de años: línea con puntos; lo recorrido se pinta en terracota */
.tl-rail{margin:0 0 clamp(22px,3vw,34px);position:relative}
.tl-line{background:rgba(24,37,42,.14);border-radius:2px;height:2px;left:0;position:absolute;right:0;top:21px}
.tl-progress{background:linear-gradient(90deg,var(--rust),var(--gold));border-radius:2px;display:block;height:100%;transition:width .6s cubic-bezier(.22,1,.36,1);width:0}
.tl-years{display:flex;justify-content:space-between;position:relative}
.tl-year{align-items:center;background:none;border:0;color:rgba(24,37,42,.55);cursor:pointer;display:flex;flex:0 0 auto;flex-direction:column;font:inherit;gap:10px;min-height:44px;min-width:44px;padding:12px 4px 4px;position:relative;transition:color .2s}
.tl-dot{background:#fff9f5;border:2px solid rgba(24,37,42,.28);border-radius:50%;height:16px;transition:background .3s,border-color .3s,box-shadow .3s,transform .3s;width:16px}
.tl-year-label{font-size:13px;font-weight:700;letter-spacing:.04em;white-space:nowrap}
.tl-year:hover{color:var(--ink)}
.tl-year:hover .tl-dot{border-color:var(--rust)}
.tl-year.is-past .tl-dot{background:var(--rust);border-color:var(--rust)}
.tl-year[aria-selected=true]{color:#9a5e2e}
.tl-year[aria-selected=true] .tl-dot{background:var(--gold);border-color:var(--gold);box-shadow:0 0 0 6px rgba(212,161,76,.25);transform:scale(1.25)}
.tl-year-badge{background:rgba(169,71,41,.1);border-radius:999px;color:#8d3b21;font-size:10px;font-weight:700;letter-spacing:.08em;padding:3px 8px;text-transform:uppercase}
.tl-year--key .tl-dot{border-color:var(--rust)}
/* capítulo: foto grande y texto al lado */
.tl-panel{align-items:center;background:var(--paper);border:1px solid rgba(24,37,42,.08);border-radius:20px;display:grid;gap:clamp(24px,4vw,56px);grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);padding:clamp(14px,1.6vw,20px) clamp(22px,4vw,56px) clamp(14px,1.6vw,20px) clamp(14px,1.6vw,20px)}
.tl-panel--key{border-color:rgba(169,71,41,.35);box-shadow:0 20px 44px rgba(169,71,41,.1)}
.tl-photo{aspect-ratio:3/2;background:#f2ede4;border-radius:14px;margin:0;overflow:hidden}
.tl-photo img{display:block;height:100%;object-fit:cover;width:100%}
.tl-photo img.timeline-photo--top{object-position:center 12%}
.tl-photo--logo{align-items:center;background:#2a0e04;display:flex;justify-content:center}
.tl-photo--logo img{background:#fff9f5;border-radius:16px;height:auto;padding:18px 24px;width:min(60%,320px)}
.tl-copy{display:flex;flex-direction:column;padding:clamp(6px,1vw,14px) 0}
.tl-panel-year{color:#9a5e2e;font-family:'Cinzel',Georgia,'Times New Roman',serif;font-size:clamp(2.6rem,5vw,4.2rem);font-weight:600;letter-spacing:.01em;line-height:1;margin:0 0 12px}
.tl-key-badge{align-self:flex-start;background:var(--rust);border-radius:999px;color:#fff9f5;font-size:11px;font-weight:700;letter-spacing:.12em;margin:0 0 14px;padding:6px 12px;text-transform:uppercase}
.tl-title{color:var(--ink);font-family:'Cinzel',Georgia,'Times New Roman',serif;font-size:clamp(1.3rem,2vw,1.7rem);font-weight:600;letter-spacing:.01em;line-height:1.2;margin:0 0 14px}
.tl-text{color:rgba(24,37,42,.76);font-size:clamp(1rem,1.2vw,1.08rem);line-height:1.6;margin:0 0 26px;max-width:48ch}
.tl-nav{align-items:center;display:flex;flex-wrap:wrap;gap:12px 18px;justify-content:space-between;margin-top:auto}
.tl-prev{align-items:center;background:none;border:0;color:rgba(24,37,42,.66);cursor:pointer;display:inline-flex;font:inherit;font-size:13px;font-weight:700;gap:8px;letter-spacing:.06em;min-height:44px;padding:0;transition:color .2s}
.tl-prev:hover{color:var(--rust)}
.tl-next{cursor:pointer}
/* entrada de cada capítulo */
html.js .tl-panel.is-entering .tl-photo img{animation:tl-photo-in .7s cubic-bezier(.22,1,.36,1)}
html.js .tl-panel.is-entering .tl-copy>*{animation:tl-copy-in .6s cubic-bezier(.22,1,.36,1) both}
html.js .tl-panel.is-entering .tl-copy>*:nth-child(2){animation-delay:.05s}
html.js .tl-panel.is-entering .tl-copy>*:nth-child(3){animation-delay:.1s}
html.js .tl-panel.is-entering .tl-copy>*:nth-child(4){animation-delay:.15s}
html.js .tl-panel.is-entering .tl-copy>*:nth-child(5){animation-delay:.2s}
@keyframes tl-photo-in{from{opacity:.4;transform:scale(1.06)}to{opacity:1;transform:none}}
@keyframes tl-copy-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){html.js .tl-panel.is-entering .tl-photo img,html.js .tl-panel.is-entering .tl-copy>*{animation:none}.tl-progress,.tl-dot{transition:none}}
/* sin JavaScript: todos los capítulos en lista */
html:not(.js) .tl-rail,html:not(.js) .tl-counter,html:not(.js) .tl-nav{display:none}
html:not(.js) .tl-panel+.tl-panel{margin-top:16px}
/* tablet */
@media(max-width:1000px){
  .tl-panel{grid-template-columns:1fr;padding:14px 14px clamp(22px,4vw,30px)}
  .tl-copy{padding:4px clamp(8px,2vw,16px) 0}
}
/* celular: la barra de años se desliza y centra el año activo */
@media(max-width:800px){
  .tl-rail{margin-inline:calc(-1 * max(8vw,32px))}
  .tl-years{gap:22px;justify-content:flex-start;overflow-x:auto;padding:0 max(8vw,32px);scroll-padding-inline:max(8vw,32px);scrollbar-width:none}
  .tl-years::-webkit-scrollbar{display:none}
  .tl-line{left:max(8vw,32px);right:max(8vw,32px)}
  .tl-counter-current{font-size:1.5rem}
}
@media(max-width:560px){
  .tl-nav{flex-direction:column-reverse;align-items:stretch}
  .tl-nav .tl-next{justify-content:center}
  .tl-prev{justify-content:center}
}
@media(max-width:800px){
  .tl-line{display:none}
  .tl-years{background:linear-gradient(rgba(24,37,42,.14),rgba(24,37,42,.14)) 0 21px/100% 2px no-repeat;background-attachment:local}
}
.tl-panel[hidden]{display:none}

/* =====================================================================
   ===== Menú completo: buscador, barra fija de categorías y lista =====
   ===================================================================== */
.visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}
.carta-item[hidden],.carta-panel[hidden]{display:none!important}
/* buscador */
.carta-search{align-items:center;background:var(--paper);border:1px solid rgba(24,37,42,.16);border-radius:999px;display:flex;gap:10px;margin:0 0 10px;max-width:520px;min-height:52px;padding:0 8px 0 18px;transition:border-color .2s,box-shadow .2s}
.carta-search:focus-within{border-color:#2a0e04;box-shadow:0 0 0 3px rgba(212,161,76,.45)}
.carta-search>svg{color:rgba(24,37,42,.5);flex:0 0 auto;height:20px;width:20px}
.carta-search input{background:none;border:0;color:var(--ink);flex:1;font:inherit;font-size:16px;min-width:0;outline:none;padding:12px 0}
.carta-search input::placeholder{color:rgba(24,37,42,.5)}
.carta-search input::-webkit-search-cancel-button{display:none}
.carta-clear{align-items:center;background:rgba(24,37,42,.06);border:0;border-radius:50%;color:var(--ink);cursor:pointer;display:flex;flex:0 0 auto;height:36px;justify-content:center;width:36px}
.carta-clear:hover{background:rgba(24,37,42,.12)}
.carta-clear svg{height:16px;width:16px}
.carta-status{color:rgba(24,37,42,.66);font-size:13px;font-weight:600;margin:0 0 14px;min-height:1.2em}
html:not(.js) .carta-search,html:not(.js) .carta-status{display:none}
/* barra de categorías: se queda fija debajo de la barra de navegación al bajar por el menú */
.carta-nav{background:#fff9f5;margin:0 calc(-1 * max(8vw,32px)) 20px;padding:10px 0;position:sticky;top:74px;transition:box-shadow .25s;z-index:5}
.carta-nav.is-stuck{box-shadow:0 10px 18px -12px rgba(42,14,4,.28)}
.carta-nav .carta-tabs{margin:0;padding:2px max(8vw,32px);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 max(8vw,32px),#000 calc(100% - max(8vw,32px)),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 max(8vw,32px),#000 calc(100% - max(8vw,32px)),transparent 100%)}
.carta-tab{align-items:center;display:inline-flex;gap:8px}
.carta-tab-count{background:rgba(24,37,42,.07);border-radius:999px;color:rgba(24,37,42,.6);font-size:11px;font-variant-numeric:tabular-nums;font-weight:700;line-height:1;padding:4px 7px}
.carta-tab[aria-selected=true] .carta-tab-count{background:rgba(255,249,245,.18);color:#fff9f5}
.carta.is-searching .carta-tab{opacity:.45}
.carta.is-searching .carta-tab[aria-selected=true]{background:var(--paper);border-color:rgba(24,37,42,.16);color:var(--ink)}
.carta.is-searching .carta-tab[aria-selected=true] .carta-tab-count{background:rgba(24,37,42,.07);color:rgba(24,37,42,.6)}
@media(max-width:800px){.carta-nav{top:70px}}
html:not(.js) .carta-nav{display:none}
/* encabezado de cada categoría */
.carta-panel-head{align-items:baseline;display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:space-between;margin-bottom:4px}
.carta-panel-head .carta-title{margin:0}
.carta-panel-count{color:rgba(24,37,42,.55);font-size:13px;font-variant-numeric:tabular-nums;font-weight:600;margin:0}
.carta-note{align-items:flex-start;background:rgba(212,161,76,.14);border-radius:12px;color:#6b3f12;display:flex;font-size:14px;font-weight:500;gap:10px;line-height:1.45;margin:14px 0 4px;max-width:720px;padding:12px 14px}
.carta-note svg{flex:0 0 auto;height:18px;margin-top:1px;width:18px}
/* platillos */
.carta-item{border-bottom:1px solid rgba(24,37,42,.08);padding:16px 0;scroll-margin-top:180px}
.carta-item--foto{grid-template-columns:76px minmax(0,1fr)}
.carta-thumb{border-radius:14px;width:76px}
.carta-name{font-size:16.5px}
.carta-price{font-size:16.5px;font-variant-numeric:tabular-nums;white-space:nowrap}
.carta-price small{color:rgba(24,37,42,.55);font-size:12px;font-weight:600;margin-right:2px}
.carta-badge{margin:8px 0 0}
.carta-badge+.carta-desc{margin-top:6px}
/* platillo al que se llega desde "Ver en el menú": se resalta un momento */
.carta-item.is-highlight{animation:carta-highlight 2.4s ease}
@keyframes carta-highlight{0%,35%{background:rgba(212,161,76,.24);box-shadow:0 0 0 10px rgba(212,161,76,.24)}100%{background:transparent;box-shadow:0 0 0 10px transparent}}
@media(prefers-reduced-motion:reduce){.carta-item.is-highlight{animation:none;background:rgba(212,161,76,.2)}}
/* búsqueda: las categorías con resultados se muestran juntas, con aire entre ellas */
.carta.is-searching .carta-panel:not([hidden])~.carta-panel:not([hidden]){margin-top:18px}
/* sin resultados */
.carta-empty{background:var(--paper);border:1px dashed rgba(24,37,42,.2);border-radius:20px;padding:clamp(28px,4vw,44px);text-align:center}
.carta-empty-title{font-family:'Cinzel',Georgia,'Times New Roman',serif;font-size:1.3rem;font-weight:600;margin:0 0 8px}
.carta-empty-text{color:rgba(24,37,42,.72);margin:0}
.carta-empty-text button{background:none;border:0;color:var(--rust);cursor:pointer;font:inherit;font-weight:700;padding:0;text-decoration:underline;text-underline-offset:3px}
@media(max-width:560px){
  .carta-item--foto{grid-template-columns:64px minmax(0,1fr)}
  .carta-thumb{width:64px}
  .carta-search{max-width:none}
}
.carta-clear[hidden]{display:none}
.tl-photo img.tl-photo--kiosco{object-position:center 35%}

/* =====================================================================
   ===== Botón flotante de contacto (esquina inferior derecha) =====
   ===================================================================== */
.fab{align-items:flex-end;bottom:max(20px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:12px;opacity:0;pointer-events:none;position:fixed;right:max(20px,env(safe-area-inset-right));transform:translateY(16px);transition:opacity .3s ease,transform .3s ease;z-index:60}
/* aparece después del hero, para no competir con sus botones */
.fab.is-visible{opacity:1;pointer-events:auto;transform:none}
html:not(.js) .fab{display:none}
.fab-toggle{align-items:center;background:#2a0e04;border:0;border-radius:50%;box-shadow:0 12px 28px rgba(42,14,4,.35),0 0 0 3px rgba(212,161,76,.55);color:#fff9f5;cursor:pointer;display:flex;height:60px;justify-content:center;padding:0;position:relative;transition:background .2s,transform .2s;width:60px}
.fab-toggle:hover{background:var(--rust);transform:scale(1.05)}
.fab-toggle svg{height:26px;position:absolute;transition:opacity .2s,transform .25s;width:26px}
.fab-close{opacity:0;transform:rotate(-90deg)}
.fab.is-open .fab-open{opacity:0;transform:rotate(90deg)}
.fab.is-open .fab-close{opacity:1;transform:none}
.fab-menu{display:flex;flex-direction:column;gap:10px;list-style:none;margin:0;padding:0}
.fab-menu[hidden],.fab-item[hidden]{display:none}
.fab-item a{align-items:center;display:flex;gap:10px;justify-content:flex-end}
.fab-label{background:var(--paper);border-radius:999px;box-shadow:0 6px 18px rgba(42,14,4,.16);color:var(--ink);font-size:13px;font-weight:700;padding:8px 14px;white-space:nowrap}
.fab-icon{align-items:center;background:var(--paper);border-radius:50%;box-shadow:0 6px 18px rgba(42,14,4,.18);color:#2a0e04;display:flex;height:48px;justify-content:center;transition:background .2s,color .2s,transform .2s;width:48px}
.fab-icon svg{height:22px;width:22px}
.fab-item a:hover .fab-icon,.fab-item a:focus-visible .fab-icon{background:#2a0e04;color:#fff9f5;transform:scale(1.06)}
.fab-item--whatsapp .fab-icon{background:#25d366;color:#fff}
.fab-item--whatsapp a:hover .fab-icon,.fab-item--whatsapp a:focus-visible .fab-icon{background:#1ebe5b;color:#fff}
.fab-item a:focus-visible{outline:none}
.fab-item a:focus-visible .fab-icon{box-shadow:0 0 0 3px var(--gold)}
/* las opciones entran una tras otra desde abajo */
.fab.is-open .fab-item{animation:fab-in .28s cubic-bezier(.22,1,.36,1) both}
.fab.is-open .fab-item:nth-last-child(2){animation-delay:.04s}
.fab.is-open .fab-item:nth-last-child(3){animation-delay:.08s}
.fab.is-open .fab-item:nth-last-child(4){animation-delay:.12s}
@keyframes fab-in{from{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}
@media(max-width:560px){.fab{bottom:max(16px,env(safe-area-inset-bottom));right:16px}.fab-toggle{height:56px;width:56px}}
@media(prefers-reduced-motion:reduce){.fab,.fab-toggle svg,.fab-icon{transition:none}.fab.is-open .fab-item{animation:none}}

/* ===== formulario de contacto: envío directo y confirmación ===== */
.form-trap{height:1px;left:-9999px;overflow:hidden;position:absolute;width:1px}
.contact-form .field[hidden],.contact-form .form-actions[hidden]{display:none}
.form-actions .btn:disabled{cursor:wait;opacity:.7;transform:none}
.form-error a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.form-success{align-items:center;display:flex;flex-direction:column;grid-column:1/-1;outline:none;padding:clamp(20px,4vw,40px) 10px;text-align:center}
.form-success[hidden]{display:none}
.form-success-icon{align-items:center;background:rgba(58,145,80,.14);border-radius:50%;color:#2f6b3a;display:flex;height:64px;justify-content:center;margin-bottom:16px;width:64px}
.form-success-icon svg{height:30px;width:30px}
.form-success-title{color:var(--ink);font-family:'Cinzel',Georgia,'Times New Roman',serif;font-size:clamp(1.3rem,2vw,1.6rem);font-weight:600;margin:0 0 8px}
.form-success-text{color:rgba(24,37,42,.72);margin:0 0 20px}
.form-again{background:none;border:0;color:var(--rust);cursor:pointer;font:inherit;font-size:14px;font-weight:700;min-height:44px;text-decoration:underline;text-underline-offset:3px}