@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.webp') 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('mole_web_optimized.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.webp')}/* 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('mole_web_optimized.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('Nuestrosproductos-web.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('mole_web_optimized.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:url('Products/enchilada-web.webp')}.product-image--tasajo{background-image:url('Products/tasajo-web.webp')}.product-image--mamon{background-image:url('Products/mamon-web.webp')}.product-image--cocada{background-image:url('Products/cocada-web.webp')}/* 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('mole_web_optimized.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('Nuestrosproductos-web.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:url('cards/aquiesoaxaca-web.webp');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:url('cards/casanela_web.jpg');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:url('cards/casanelacard2-web.webp');background-position:center 66%}
.resto-photo--oaxacaqui{background-image:url('cards/oaxacaqui-card2-web.webp');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('Nuestrosproductos-web.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('Nuestrosproductos-web.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%)}
}