/* Antojitos Como En Casa — brand layer (v1.0.0). Ten-Go / D'Poly look:
   charcoal header + dark warm hero, Bebas Neue headlines, Abril Fatface accents (close to the logo),
   chili red + salsa verde on warm cream, red/green triangle border from their printed menu.
   Motion: papel picado, chili drops in and swings, steam from the olla, per-store neon, tortillas on a comal. Loaded last. */

body{background:var(--cream);color:var(--ink)}
a{color:var(--clay-deep)}
.skip-link{position:absolute;left:12px;top:-60px;z-index:300;background:#fff;color:var(--ink);padding:10px 16px;border-radius:8px;font:700 .9rem "DM Sans",sans-serif;text-decoration:none}
.skip-link:focus{top:12px}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}

/* type */
.section-title,.hero-ac h1,.review-band h2,.pickup-strip h2,.drawer-head h2,.order-h{font-family:var(--font-display)!important;font-weight:400!important;letter-spacing:.02em!important;font-variation-settings:normal!important}
.section-title{color:var(--ink);font-size:clamp(2.2rem,5vw,3.4rem);line-height:1}
.section-kicker,.section-eyebrow,.hero .script{font-family:"Caveat",cursive;color:var(--clay);font-size:1.7rem;font-weight:700}
.section-eyebrow{text-align:center}

/* header: charcoal like Ten-Go, logo in cream */
header.site{background:var(--char)!important;color:#fff;border-bottom:0!important;box-shadow:0 4px 18px rgba(0,0,0,.25)}
header.site.scrolled{background:rgba(31,26,23,.96)!important}
.brand-logo-ac{height:58px;width:auto;display:block;transition:height .3s ease}
header.site.scrolled .brand-logo-ac{height:46px}
.brand-text,.brand-logo,.brand-logo-wide,.brand-logo-round{display:none}
nav.main-nav a{color:#f5ecdc!important;opacity:.9;font-family:"DM Sans",sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;text-decoration:none}
nav.main-nav a:hover,nav.main-nav a.active{color:var(--gold)!important;border-bottom-color:var(--gold)!important}
.nav-toggle span{background:#fff!important}
.lang-toggle{border:1px solid rgba(255,255,255,.3);border-radius:999px;overflow:hidden}
.lang-toggle button{color:#fff!important;opacity:.7}
.lang-toggle button.active{background:var(--green)!important;opacity:1}
.cart-btn{background:var(--clay)!important;color:#fff!important;border-radius:8px!important;text-transform:uppercase;letter-spacing:.06em}
.cart-count{background:var(--gold)!important;color:var(--ink)!important}
@media(max-width:860px){nav.main-nav{background:var(--char)!important}}

/* triangle border (from their printed menu) */
.papel-border{position:relative;height:12px;background:transparent;z-index:49}
.papel-border::before{content:"";position:absolute;inset:0;
  background:conic-gradient(from 135deg at 50% 0,var(--clay) 0 90deg,transparent 0) 0 0/28px 12px repeat-x,
             conic-gradient(from 135deg at 50% 0,var(--green) 0 90deg,transparent 0) 14px 0/28px 12px repeat-x}
.papel-border.flip{transform:scaleY(-1)}
.ac-motion2 .papel-border::before{animation:ac-border 6s linear infinite}
@keyframes ac-border{to{background-position:28px 0,42px 0}}

/* ---------- hero ---------- */
.hero-ac{position:relative;overflow:hidden;text-align:left;padding:96px 0 110px;border-bottom:0;color:#fff;
  background:radial-gradient(ellipse 60% 70% at 75% 45%,#4a2a1a 0,#2a1d16 45%,#16110e 100%)!important}
.hero-ac .glow{position:absolute;right:8%;top:22%;width:520px;height:520px;border-radius:50%;z-index:0;pointer-events:none;
  background:radial-gradient(circle,rgba(242,182,50,.28) 0,rgba(212,42,31,.12) 40%,transparent 70%)}
.ac-motion2 .hero-ac .glow{animation:ac-glow 5s ease-in-out infinite}
@keyframes ac-glow{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.12);opacity:1}}
.hero-ac .picado::before{background:rgba(255,255,255,.35)}
.hero-ac .wrap{position:relative;z-index:2}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:28px;align-items:center}
.hero-ac .kicker{font-family:"Caveat",cursive;font-weight:700;font-size:1.8rem;color:var(--gold);margin:6px 0 2px}
.hero-ac h1{margin:0 0 14px;line-height:.92!important}
.hero-ac h1 .h1-a{display:block;font-size:clamp(3rem,8vw,6.2rem);color:#fff}
.hero-ac h1 .h1-b{display:block;font-family:var(--font-serif)!important;font-size:clamp(2.2rem,5.4vw,4.2rem);letter-spacing:0;color:var(--clay);
  background:linear-gradient(100deg,#ff5a3c 0%,#d42a1f 35%,#ffb199 50%,#d42a1f 65%,#ff5a3c 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.ac-motion2 .hero-ac h1 .h1-b{animation:ac-shine 5s linear infinite}
@keyframes ac-shine{to{background-position:-250% 0}}
.ac-motion2 .hero-ac h1 .h1-a{animation:ac-rise .9s cubic-bezier(.2,.8,.2,1) both}
.ac-motion2 .hero-ac h1 .h1-b{animation:ac-rise .9s .15s cubic-bezier(.2,.8,.2,1) both,ac-shine 5s 1s linear infinite}
@keyframes ac-rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.hero-ac .sub{color:#efe3d0;max-width:520px;margin:0 0 22px;font-size:1.08rem}
.hero-ac .hero-ctas{justify-content:flex-start}
.tricolor{display:flex;gap:6px;margin:0 0 18px}
.tricolor span{width:54px;height:6px;border-radius:3px;background:var(--green)}
.tricolor span:nth-child(2){background:#fff}.tricolor span:nth-child(3){background:var(--clay)}
.ac-motion2 .tricolor span{animation:ac-grow .8s cubic-bezier(.2,.8,.2,1) both}
.ac-motion2 .tricolor span:nth-child(2){animation-delay:.12s}.ac-motion2 .tricolor span:nth-child(3){animation-delay:.24s}
@keyframes ac-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* buttons */
.btn{border-radius:6px!important;text-transform:uppercase;letter-spacing:.08em;font-family:"DM Sans",sans-serif!important;font-weight:700!important}
.btn-clay,.full-btn,.foot-btn{background:var(--clay)!important;color:#fff!important;border-color:var(--clay)!important}
.btn-clay:hover,.full-btn:hover,.foot-btn:hover{background:var(--green)!important;border-color:var(--green)!important}
.btn-ghost{color:var(--ink);border:2px solid var(--ink)}
.hero-ac .btn-ghost{color:#fff!important;border-color:rgba(255,255,255,.8)!important;background:transparent!important}
.hero-ac .btn-ghost:hover{background:#fff!important;color:var(--ink)!important}

/* neon per store */
.neon-row{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 10px}
.neon{display:inline-flex;gap:8px;align-items:center;padding:5px 12px;border:2px solid #ff5d4d;border-radius:8px;font:400 1.05rem/1.1 var(--font-display);letter-spacing:.14em;color:#fff;background:rgba(0,0,0,.35);
  box-shadow:0 0 8px #ff5d4d,inset 0 0 8px rgba(255,93,77,.6);text-shadow:0 0 6px #ff9a8f,0 0 14px #ff3b2b}
.neon b{font:700 .72rem/1 "DM Sans",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#f5ecdc;text-shadow:none}
.ac-motion2 .neon:not(.off){animation:ac-neon 4s steps(1,end) infinite}
.ac-motion2 .neon:nth-child(2):not(.off){animation-delay:-1.7s}
@keyframes ac-neon{0%,19%,23%,60%,100%{opacity:1}20%,22%,61%{opacity:.4}}
.neon.off{border-color:#6e625a;box-shadow:none;color:#cfc3b8;text-shadow:none;animation:none!important}
.neon-mini{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:5px;font:400 .82rem/1.3 var(--font-display);letter-spacing:.12em;color:#fff;background:var(--green);vertical-align:middle}
.neon-mini.off{background:#6e625a}

/* logo with the chili dropping in */
.hero-art{position:relative;max-width:500px;width:100%;justify-self:center}
.logo-stage{position:relative;width:100%;aspect-ratio:1000/533;filter:drop-shadow(0 18px 24px rgba(0,0,0,.5))}
.logo-stage .logo-txt{position:absolute;inset:0;width:100%;height:auto}
.logo-stage .logo-chili{position:absolute;left:38.3%;top:24.4%;width:20.9%;height:auto;transform-origin:62% 4%;filter:drop-shadow(0 6px 10px rgba(212,42,31,.45))}
.ac-motion2 .logo-stage .logo-chili{animation:ac-drop 1.1s .35s cubic-bezier(.3,1.5,.5,1) both,ac-swing 3.4s 1.5s ease-in-out infinite}
@keyframes ac-drop{0%{opacity:0;transform:translateY(-140%) rotate(-30deg)}60%{opacity:1}100%{transform:none}}
@keyframes ac-swing{0%,100%{transform:rotate(0)}25%{transform:rotate(6deg)}75%{transform:rotate(-5deg)}}
.ac-motion2 .logo-stage .logo-txt{animation:ac-pop .8s cubic-bezier(.3,1.4,.5,1) both}
@keyframes ac-pop{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:none}}
.spark{position:absolute;width:14px;height:14px;background:var(--gold);clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);opacity:0}
.spark.s1{left:60%;top:18%}.spark.s2{left:34%;top:60%;width:10px;height:10px}.spark.s3{left:56%;top:72%;width:12px;height:12px;background:#fff}
.ac-motion2 .spark{animation:ac-spark 2.6s ease-in-out infinite}
.ac-motion2 .spark.s2{animation-delay:-.9s}.ac-motion2 .spark.s3{animation-delay:-1.7s}
@keyframes ac-spark{0%,100%{opacity:0;transform:scale(.3) rotate(0)}50%{opacity:1;transform:scale(1) rotate(90deg)}}

/* clay olla with steam */
.olla{position:relative;width:190px;margin:-6px 0 0 auto;text-align:center}
.olla-svg{width:100%;height:auto;display:block;filter:drop-shadow(0 10px 14px rgba(0,0,0,.45))}
.olla-tag{display:inline-block;margin-top:4px;font:700 1.35rem/1 "Caveat",cursive;color:var(--gold)}
.steam-up{position:absolute;left:0;right:12%;top:-70px;height:80px;display:flex;justify-content:center;gap:18px;pointer-events:none}
.steam-up span{width:16px;height:70px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.7),rgba(255,255,255,0));filter:blur(5px);opacity:0}
.ac-motion2 .steam-up span{animation:ac-steamup 3.6s ease-in infinite}
.ac-motion2 .steam-up span:nth-child(2){animation-delay:-1.2s}.ac-motion2 .steam-up span:nth-child(3){animation-delay:-2.4s}
@keyframes ac-steamup{0%{opacity:0;transform:translateY(30px) scaleX(.7)}30%{opacity:.85}100%{opacity:0;transform:translateY(-40px) scaleX(1.4) translateX(8px)}}
.hero-edge{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:40px;z-index:2}
.hero-edge path{fill:var(--cream)}

/* marquee */
.marquee{background:var(--clay)!important;color:#fff!important;border-top:5px solid var(--green)!important;border-bottom:5px solid var(--char)!important;transform:rotate(-1deg) scale(1.03)}
.marquee-track{font-family:var(--font-display)!important;font-style:normal!important;font-weight:400!important;letter-spacing:.06em;font-size:1.6rem}
.marquee-track i{font-style:normal}

/* cards / menu */
.loc-card,.item-card,.feat-card,.step-card{border-top:5px solid var(--clay)!important;border-radius:var(--radius);background:var(--paper)}
.step-num{background:var(--clay)!important;color:#fff!important;font-family:var(--font-display)!important;font-weight:400!important}
.price{background:var(--green)!important;color:#fff!important}
.price.ask{background:#fff!important;color:var(--clay-deep)!important;border:1px dashed var(--clay);font-size:.82rem}
.add-btn.call,.mini-btn.call{display:inline-block;text-decoration:none;border:2px solid var(--green)!important;color:var(--green-deep)!important;background:#fff!important}
.add-btn.call:hover,.mini-btn.call:hover{background:var(--green)!important;color:#fff!important}
.tab{border-color:var(--ink)!important;color:var(--ink)!important}
.tab.active{background:var(--ink)!important;border-color:var(--ink)!important;color:#fff!important}
.section-peach{background:var(--tint)!important}
.clay-board{background:var(--cream)!important}
.stats-band{background:var(--char)!important}
.stat-box{background:rgba(255,255,255,.04)!important;border:1px solid rgba(255,255,255,.08);border-bottom:4px solid var(--clay)!important}
.stat-n{color:var(--gold)!important;font-family:var(--font-display)!important;font-weight:400!important}
.stat-l{color:#efe3d0!important}

/* homemade band: tortillas puffing on a comal */
.homemade-band{background:linear-gradient(160deg,var(--green-deep),var(--green))!important;color:#fff;position:relative;overflow:hidden}
.homemade-band cite{display:block;margin-top:12px;opacity:.85}
.comal{position:relative;width:170px;height:70px;margin:0 auto 14px}
.comal::before{content:"";position:absolute;left:0;right:0;bottom:0;height:22px;border-radius:50%;background:#1b1512;box-shadow:inset 0 4px 0 #3a302a}
.tortilla{position:absolute;bottom:12px;width:64px;height:22px;border-radius:50%;background:radial-gradient(circle at 40% 40%,#fff1cf 0,#f1d391 60%,#d9b26a 100%);box-shadow:0 2px 0 rgba(0,0,0,.25)}
.tortilla.t1{left:14px}.tortilla.t2{left:54px;bottom:20px}.tortilla.t3{left:92px}
.tortilla::after{content:"";position:absolute;left:30%;top:30%;width:8px;height:5px;border-radius:50%;background:#b8873f;opacity:.6}
.ac-motion2 .tortilla{animation:ac-puff 2.8s ease-in-out infinite}
.ac-motion2 .tortilla.t2{animation-delay:-1s}.ac-motion2 .tortilla.t3{animation-delay:-1.9s}
@keyframes ac-puff{0%,100%{transform:scaleY(1) translateY(0)}45%{transform:scaleY(1.6) translateY(-6px)}55%{transform:scaleY(1.6) translateY(-6px)}}

/* catering, pickup, footer */
.cater-band{background:var(--cream)}
.cater-band-in{background:repeating-linear-gradient(135deg,rgba(212,42,31,.07) 0 14px,transparent 14px 28px),var(--paper);border:2px dashed rgba(47,143,62,.55)}
.pickup-strip{background:var(--clay)!important}
.pickup-strip .btn{background:#fff!important;color:var(--clay)!important}
.site-footer{background:var(--char)!important;color:#efe3d0;position:relative}
.site-footer .papel-border{position:absolute;left:0;right:0;top:-12px}
.foot-logo-link{display:inline-block;padding:6px 10px}
.foot-logo{height:120px;width:auto}
.foot-thanks{font-family:"Caveat",cursive;color:var(--gold)}
.foot-store .foot-tel,.maloremi-credit a,.foot-legal a,.foot-line a{color:var(--gold)}
.foot-btn.ghost{border-color:var(--gold)!important;color:var(--gold)!important;background:transparent!important}
.foot-stores{grid-template-columns:repeat(auto-fit,minmax(240px,320px))!important;justify-content:center}
.foot-small{max-width:640px;margin:8px auto 0;font:400 .8rem/1.5 "DM Sans",sans-serif;opacity:.75;text-align:center}
.legal-note{margin:10px 0 0;font:400 .8rem/1.5 "DM Sans",sans-serif;color:#6b5f56}
.legal-note a{color:var(--clay-deep)}
.ac-progress{background:linear-gradient(90deg,var(--green),#fff,var(--clay))!important}

/* about + legal */
.about-badge img{width:min(380px,85%);height:auto}
.claim-icon{width:26px;height:auto;flex:none;margin-right:8px}
.pull{font-family:var(--font-serif)!important;color:var(--clay)!important}
.menu-photo{max-width:420px;margin:24px auto;text-align:center}
.menu-photo img{width:100%;height:auto;border-radius:10px;box-shadow:var(--shadow);transform:rotate(-1.5deg)}
.menu-photo figcaption{font:400 .85rem "DM Sans",sans-serif;opacity:.75;margin-top:8px}
.legal-page .legal-doc{max-width:780px;margin:0 auto}
.legal-page .legal-doc h3{font-family:"DM Sans",sans-serif;font-size:1.08rem;margin:22px 0 6px;color:var(--ink)}
.legal-page .legal-doc p{margin:0 0 10px}
.legal-updated{text-align:center}

/* phones */
@media(max-width:860px){
  .hero-ac{text-align:center;padding:84px 0 90px}
  .hero-grid{grid-template-columns:1fr;gap:6px}
  .hero-art{order:-1;max-width:330px}
  .olla{display:none}
  .hero-ac .hero-ctas{justify-content:center}
  .hero-ac .sub{margin:0 auto 20px}
  .tricolor,.neon-row{justify-content:center}
  .hero-ac .glow{right:-30%;top:0}
}
@media(max-width:420px){.brand-logo-ac{height:46px}.hero-art{max-width:270px}.marquee-track{font-size:1.3rem}}
@media (prefers-reduced-motion: reduce){
  .logo-chili,.logo-txt,.spark,.steam-up span,.neon,.tortilla,.tricolor span,.hero-ac h1 span,.glow,.papel-border::before{animation:none!important}
  .spark,.steam-up{display:none}
}

/* fixes after first render */
a,.foot-lang{text-decoration:none!important}
.foot-logo-link{overflow:visible!important;border-radius:0!important;background:none!important;box-shadow:none!important;padding:0!important;width:auto!important;height:auto!important}
.foot-logo{height:120px!important;width:auto!important;max-width:none!important;border-radius:0!important;object-fit:contain!important}
.step-card h3,.loc-card h3{font-family:var(--font-display)!important;font-weight:400!important;font-size:1.6rem!important;letter-spacing:.04em!important}
.feat-card h4,.item-card h4,.dish h3{font-family:var(--font-display)!important;font-weight:400!important;font-size:1.5rem!important;letter-spacing:.03em!important}
.about-badge{text-align:center}.about-badge img{display:inline-block}