/* assets/css/styles.css: all styling. Colors and fonts come from tokens.css only. */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{margin:0;font-family:var(--font-body);font-size:1rem;line-height:1.65;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--highlight);outline-offset:3px}
h1,h2,h3{font-family:var(--font-display);font-weight:600;line-height:1.05;margin:0 0 .6em;letter-spacing:.01em}
h2{font-size:clamp(2.2rem,5vw,3.6rem)}
h3{font-size:1.6rem}
p{margin:0 0 1em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 clamp(1.1rem,4vw,2.5rem)}
.section{padding:clamp(4rem,9vw,7rem) 0}
.section--soft{background:var(--bg-soft)}
.lead{font-size:1.15rem;color:var(--ink-soft);max-width:60ch}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Draft notes: everything waiting on Cadejo. Remove before launch. */
.draft-note{border:2px dashed var(--blonde);color:var(--blonde);background:rgba(246,174,15,.07);padding:.7rem 1rem;border-radius:var(--radius);font-size:.9rem;margin:1rem 0;max-width:70ch}
.draft-note strong{font-weight:700}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 1.4rem;border-radius:999px;font-weight:600;text-decoration:none;font-size:.95rem;border:2px solid transparent;cursor:pointer;font-family:var(--font-body)}
.btn--cta{background:var(--cta);color:var(--cta-ink)}
.btn--cta:hover{filter:brightness(1.18)}
.btn--ghost{border-color:var(--line);color:var(--ink);background:transparent}
.btn--ghost:hover{border-color:var(--ink)}
.btn--sm{padding:.5rem .95rem;font-size:.85rem}

/* Header */
.site-header{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .3s}
.site-header.is-solid{background:rgba(18,19,18,.94);backdrop-filter:blur(6px)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:72px}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none}
.brand img{width:46px;height:46px}
.brand span{font-family:var(--font-display);font-size:1.35rem;letter-spacing:.04em}
.nav{display:flex;gap:1.4rem;align-items:center;font-size:.9rem}
.nav a{text-decoration:none;color:var(--ink-soft)}
.nav a:hover{color:var(--ink)}
.lang{font-size:.85rem;color:var(--ink-soft)}
.lang .active{color:var(--ink);font-weight:700}
.lang a{text-decoration:none}
@media (max-width:860px){.nav .nav__link{display:none}}

/* Hero: stand-in for the 30 s video. Fast cuts between locations. */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;isolation:isolate}
.hero__reel{position:absolute;inset:0;z-index:-2}
.hero__reel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.04)}
.hero__reel img.is-on{opacity:1;transform:scale(1);transition:opacity .35s ease,transform 6s linear}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(18,19,18,.78) 0%,rgba(18,19,18,.45) 45%,rgba(18,19,18,0) 75%),linear-gradient(180deg,rgba(18,19,18,.45) 0%,rgba(18,19,18,.1) 35%,rgba(18,19,18,.9) 92%)}
@media (max-width:700px){.hero::after{background:linear-gradient(180deg,rgba(18,19,18,.5) 0%,rgba(18,19,18,.55) 40%,rgba(18,19,18,.92) 85%)}}
.hero__content{padding-top:110px;padding-bottom:clamp(3rem,8vw,6rem);width:100%}
.hero__claim{font-family:var(--font-display);font-weight:600;font-size:clamp(2.9rem,6.2vw,5.6rem);line-height:.98;margin:0 0 1.1rem;max-width:15ch}
.hero__place{display:block;font-family:var(--font-body);font-size:1rem;color:var(--highlight);font-weight:600;margin-bottom:1rem;min-height:1.6em}
.hero h1{font-family:var(--font-body);font-weight:500;font-size:1rem;line-height:1.5;color:var(--ink-soft);max-width:52ch;margin:0 0 1.6rem}
.hero__actions{display:flex;flex-wrap:wrap;gap:.8rem}

/* Moments: why Cadejo */
.moments{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0;border-top:1px solid var(--line);margin-top:2.5rem}
.moment{padding:1.4rem 1.2rem 1.4rem 0;border-bottom:1px solid var(--line)}
.moment b{display:block;font-family:var(--font-display);font-size:1.6rem;font-weight:600;line-height:1.1;margin-bottom:.3rem}
.moment span{color:var(--ink-soft);font-size:.95rem}

/* Experience finder: the one bold element */
.finder{background:var(--bg) url(../images/branches/montana-huizucar/cadejo-montana-huizucar-terrace-breakfast-cervezacadejo.com.webp) 40% 45%/cover no-repeat;color:var(--ink)}
.finder h2{color:var(--ink-dark);max-width:16ch}
.finder .lead{color:rgba(18,19,18,.85)}
.finder__q{margin:2.2rem 0 0}
.finder__q legend{font-family:var(--font-display);font-size:1.5rem;font-weight:600;margin-bottom:.8rem;padding:0}
.finder__q legend small{font-family:var(--font-body);font-size:.85rem;font-weight:600;opacity:.6;margin-right:.6rem}
.finder fieldset{border:0;margin:0;padding:0}
.chips{display:flex;flex-wrap:wrap;gap:.6rem}
.chip input{position:absolute;opacity:0;pointer-events:none}
.chip span{display:inline-block;padding:.7rem 1.15rem;border:2px solid var(--ink-dark);border-radius:999px;font-weight:600;cursor:pointer;font-size:.95rem;transition:background .15s,color .15s}
.chip input:checked+span{background:var(--ink-dark);color:var(--ink)}
.chip input:focus-visible+span{outline:3px solid var(--ink-dark);outline-offset:3px}
.finder__results{margin-top:2.8rem}
.finder__results h3{color:var(--ink-dark)}
.finder__results[hidden]{display:none}
.finder .results-grid .branch{background:var(--bg);color:var(--ink)}

/* Branches */
.group-title{font-family:var(--font-display);font-size:1.9rem;margin:3rem 0 .4rem}
.group-sub{color:var(--ink-soft);margin:0 0 1.4rem;max-width:60ch}
.branch-grid,.results-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:1.4rem}
.branch{background:var(--bg-soft);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}
.branch img{width:100%;aspect-ratio:4/3;object-fit:cover}
.branch__body{padding:1.2rem 1.2rem 1.4rem;display:flex;flex-direction:column;gap:.55rem;flex:1}
.branch h3{margin:0;font-size:1.75rem}
.branch__where{color:var(--highlight);font-weight:600;font-size:.9rem;margin:0}
.branch p{font-size:.93rem;margin:0}
.tags{display:flex;flex-wrap:wrap;gap:.4rem;list-style:none;margin:.2rem 0 0;padding:0}
.tags li{font-size:.78rem;border:1px solid var(--line);border-radius:999px;padding:.2rem .65rem;color:var(--ink-soft)}
.status{font-size:.82rem;font-weight:600;color:var(--ink-soft);min-height:1.3em}
.status.is-open{color:#7BD88F}
.status.is-closed{color:var(--accent)}
.branch__go{display:flex;gap:.5rem;margin-top:auto;padding-top:.5rem;flex-wrap:wrap}
.branch__go a{font-size:.82rem;font-weight:600;text-decoration:none;padding:.45rem .9rem;border-radius:999px;border:1px solid var(--line)}
.branch__go a:hover{border-color:var(--ink)}

/* Beers: horizontal scroll */
.beer{flex:0 0 260px;background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem;display:flex;flex-direction:column;gap:.8rem}
.beer img{height:110px;width:100%;object-fit:contain}
.beer h3{font-size:1.35rem;margin:0}
.beer p{font-size:.9rem;color:var(--ink-soft);margin:0}
.beer__style{color:var(--blonde)!important;font-weight:600}
.seasonal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem 2.5rem;align-items:center;justify-items:center;max-width:960px;margin-top:1.8rem}
.seasonal img{height:72px;width:100%;max-width:280px;object-fit:contain;opacity:.9}
@media (max-width:600px){.seasonal{gap:1.4rem 1rem}.seasonal img{height:44px}}

/* Legend */
.legend{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center}
.legend img{max-height:380px;margin:0 auto;opacity:.9}
@media (max-width:760px){.legend{grid-template-columns:1fr}}

/* Events + B2B */
.split{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.split img{border-radius:var(--radius);aspect-ratio:4/3;object-fit:cover;width:100%}
@media (max-width:760px){.split{grid-template-columns:1fr}}
.b2b{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:2.2rem 0}
.b2b .wrap{display:flex;flex-wrap:wrap;gap:1.2rem 2rem;align-items:center;justify-content:space-between}
.b2b p{margin:0;max-width:52ch}
.b2b p>strong{font-family:var(--font-display);font-size:1.6rem;font-weight:600;display:block}
.b2b .draft-note strong{font-family:var(--font-body);font-size:inherit;display:inline}

/* FAQ */
.faq{max-width:820px}
.faq details{border-bottom:1px solid var(--line);padding:1.1rem 0}
.faq summary{cursor:pointer;font-weight:600;font-size:1.05rem;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.faq summary::after{content:"+";font-size:1.4rem;line-height:1;color:var(--highlight)}
.faq details[open] summary::after{content:"−"}
.faq details p{color:var(--ink-soft);margin:.8rem 0 0;max-width:68ch}

/* Footer */
.site-footer{background:var(--footer-bg);color:var(--footer-fg);padding:4rem 0 2.5rem;font-size:.9rem}
.footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:2.5rem}
.site-footer h4{font-family:var(--font-display);font-size:1.3rem;font-weight:600;margin:0 0 .8rem}
.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:.35rem;color:var(--ink-soft)}
.site-footer a{text-decoration:none}
.site-footer a:hover{text-decoration:underline}
.footer-bottom{margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;color:var(--ink-soft)}
@media (max-width:760px){.footer-grid{grid-template-columns:1fr}}

/* EKY credit (see website-build references/footer-credit.md) */
.eky-credit{display:inline-flex;align-items:center;gap:.5rem;text-decoration:none;font-family:var(--font-body);font-size:.85rem;color:var(--footer-fg);opacity:.9}
.eky-credit:hover{opacity:1;text-decoration:none!important}
.eky-credit__text{color:var(--footer-fg)}
.eky-credit svg{--eky-bg:var(--footer-bg);height:18px;width:auto;display:block}

/* Subpages: location, legend, events */
.page-hero{position:relative;min-height:78svh;display:flex;align-items:flex-end;isolation:isolate;overflow:hidden}
.page-hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.page-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(18,19,18,.82) 0%,rgba(18,19,18,.45) 50%,rgba(18,19,18,.1) 80%),linear-gradient(180deg,rgba(18,19,18,.5) 0%,rgba(18,19,18,0) 30%,rgba(18,19,18,.9) 95%)}
.page-hero--plain{min-height:auto;padding-top:72px}
.page-hero--plain::after{display:none}
.page-hero__content{padding-top:110px;padding-bottom:clamp(2.5rem,6vw,4.5rem);width:100%}
.page-hero h1{font-family:var(--font-display);font-size:clamp(3rem,7vw,6rem);line-height:.95;margin:0 0 1rem;color:var(--ink)}
.page-hero--bar h1{font-family:var(--font-display-loud);font-weight:400;letter-spacing:.02em;filter:url(#rough)}
.page-hero__area{display:block;font-family:var(--font-body);font-size:1.05rem;font-weight:600;color:var(--highlight);letter-spacing:0;margin-top:.6rem;filter:none}
.page-hero__lede{font-size:1.1rem;max-width:56ch;color:var(--ink);margin-bottom:1rem}
.page-hero .status{margin-bottom:1.2rem}
.crumb{font-size:.85rem;color:var(--ink-soft);margin-bottom:1rem}
.crumb a{color:var(--ink-soft)}
@media (max-width:700px){.page-hero::after{background:linear-gradient(180deg,rgba(18,19,18,.55) 0%,rgba(18,19,18,.6) 40%,rgba(18,19,18,.94) 85%)}}

.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem}
@media (max-width:860px){.facts{grid-template-columns:1fr}}
.fact h2{font-size:1.6rem;margin-bottom:.7rem}
.fact__h2b{margin-top:1.6rem}
.fact__links{font-weight:600}
.fact__links a{color:var(--highlight)}
.fact__kids{color:var(--ink-soft);font-size:.9rem;margin-top:.8rem}
.hours{border-collapse:collapse;width:100%;font-size:.95rem}
.hours th{text-align:left;font-weight:500;color:var(--ink-soft);padding:.45rem 1rem .45rem 0;border-bottom:1px solid var(--line)}
.hours td{padding:.45rem 0;border-bottom:1px solid var(--line);font-weight:600}
.tags--big li{font-size:.85rem;padding:.3rem .8rem}
.tags li.is-main{border-color:var(--highlight);color:var(--highlight)}
.prose > *{max-width:760px}
.prose p{color:var(--ink-soft);font-size:1.05rem}

.menu{columns:3 280px;column-gap:3rem;margin-top:1.5rem}
.menu__sec{break-inside:avoid;margin-bottom:2rem}
.menu__sec h3{font-size:1.5rem;color:var(--highlight);border-bottom:1px solid var(--line);padding-bottom:.4rem;margin-bottom:.6rem}
.menu__sec ul{list-style:none;margin:0;padding:0}
.menu__sec li{display:flex;justify-content:space-between;gap:1rem;padding:.3rem 0;font-size:.93rem}
.menu__price{color:var(--ink-soft);white-space:nowrap;font-variant-numeric:tabular-nums}
.menu__pdfs{font-size:.9rem;color:var(--ink-soft)}
.menu__pdfs a{color:var(--highlight)}

.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.8rem;margin-top:1.5rem}
.gallery img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--radius)}

.others{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1rem}
.other{display:flex;flex-direction:column;padding:.8rem 1.1rem;border:1px solid var(--line);border-radius:var(--radius);text-decoration:none;font-family:var(--font-display);font-size:1.3rem;line-height:1.1}
.other small{font-family:var(--font-body);font-size:.78rem;color:var(--ink-soft);margin-top:.25rem}
.other:hover{border-color:var(--highlight)}

.ev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem}
@media (max-width:860px){.ev-grid{grid-template-columns:1fr}}
.ev h2{font-size:1.8rem}
.ev p{color:var(--ink-soft)}
.ev a{color:var(--highlight)}
.branch__go a.branch__page{background:var(--cta);color:var(--cta-ink);border-color:var(--cta)}

/* ===== Motion layer (only when JS adds .motion; nothing moves for reduced-motion visitors) ===== */
.motion .rv{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--rv-delay,0ms)}
.motion .rv.is-in{opacity:1;transform:none}
.motion .section h2.rv{transform:translateY(34px) skewY(2deg);transform-origin:left}
.motion .section h2.rv.is-in{transform:none}

/* first screen: one load sequence */
.motion .hero__place,.motion .hero__claim,.motion .hero h1,.motion .hero__actions,.motion .hero .draft-note,
.motion .page-hero__content > *{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.motion.is-loaded .hero__place,.motion.is-loaded .page-hero__content > *:nth-child(1){transition-delay:.1s}
.motion.is-loaded .hero__claim,.motion.is-loaded .page-hero__content > *:nth-child(2){transition-delay:.25s}
.motion.is-loaded .hero h1,.motion.is-loaded .page-hero__content > *:nth-child(3){transition-delay:.55s}
.motion.is-loaded .hero__actions,.motion.is-loaded .page-hero__content > *:nth-child(4){transition-delay:.75s}
.motion.is-loaded .hero .draft-note,.motion.is-loaded .page-hero__content > *:nth-child(n+5){transition-delay:.9s}
.motion.is-loaded .hero__place,.motion.is-loaded .hero__claim,.motion.is-loaded .hero h1,.motion.is-loaded .hero__actions,.motion.is-loaded .hero .draft-note,
.motion.is-loaded .page-hero__content > *{opacity:1;transform:none}
.hero__reel,.page-hero__img{will-change:transform}
.page-hero{overflow:hidden}

/* header slides away on the way down */
.site-header{transition:background .3s,transform .35s ease}
.site-header.is-hidden{transform:translateY(-100%)}

/* the cadejo that walks beside you */
.runner{position:fixed;left:clamp(1rem,4vw,2.5rem);right:clamp(1rem,4vw,2.5rem);bottom:14px;height:34px;z-index:40;pointer-events:none;opacity:0;transform:translateY(12px);transition:opacity .4s,transform .4s}
.runner.is-on{opacity:.9;transform:none}
.runner__track{position:absolute;left:0;right:0;bottom:3px;height:2px;background:rgba(245,242,236,.12);border-radius:2px;overflow:hidden}
.runner__trail{position:absolute;inset:0;background:linear-gradient(90deg,transparent,var(--blonde));transform-origin:left;transform:scaleX(0)}
.runner__dog{position:absolute;left:0;bottom:4px;height:30px;width:auto;filter:drop-shadow(0 2px 6px rgba(0,0,0,.6))}
.runner__dog{transition:none}
.runner.is-running .runner__dog{animation:trot .32s steps(2) infinite}
@keyframes trot{0%{margin-bottom:0}50%{margin-bottom:4px}100%{margin-bottom:0}}
@media (max-width:600px){.runner{bottom:10px;height:28px}.runner__dog{height:24px}}

/* photos: hover lift on cards, parallax inside frames */
.branch img{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.branch{transition:transform .35s ease,box-shadow .35s ease}
.branch:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(0,0,0,.45)}
.branch:hover img{transform:scale(1.05)}
.branch{overflow:hidden}
.motion .branch.rv.is-in:hover{transform:translateY(-4px)}
.gallery img{transition:transform .5s cubic-bezier(.2,.7,.2,1),filter .5s}
.gallery img:hover{transform:scale(1.03);filter:brightness(1.08)}

.beer{transition:transform .35s ease,border-color .35s}
.beer:hover{transform:translateY(-6px);border-color:var(--blonde)}

/* finder chip feedback */
.chip span.pop{animation:pop .35s cubic-bezier(.3,1.6,.5,1)}
@keyframes pop{0%{transform:scale(.92)}100%{transform:scale(1)}}
.chip span:hover{transform:translateY(-2px)}
.chip span{transition:background .15s,color .15s,transform .2s}

/* legend illustration breathes */
.motion .legend img.is-in{animation:prowl 6s ease-in-out infinite}
@keyframes prowl{0%,100%{transform:translateX(0)}50%{transform:translateX(-12px)}}

/* ===== v3 look: texture, pint, beer fill, running cadejos ===== */
/* concrete-like grain over the dark background, like Cadejo's current site and posts */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
body{background:radial-gradient(ellipse at 20% 0%,#1b1c1b 0%,var(--bg) 55%) fixed,var(--bg)}
.section--soft{background:rgba(28,27,25,.82)}
section{position:relative}

/* runner now runs toward the pint */
.runner{right:calc(clamp(1rem,4vw,2.5rem) + 64px)}
.runner__trail{background:linear-gradient(90deg,transparent,var(--amber),var(--blonde))}

/* the pint */
.pint{position:fixed;right:clamp(1rem,4vw,2.5rem);bottom:12px;z-index:41;width:44px;height:92px;pointer-events:none;opacity:0;transform:translateY(16px) rotate(-4deg);transition:opacity .4s,transform .5s cubic-bezier(.3,1.4,.5,1)}
.pint.is-on{opacity:1;transform:none}
@media (max-width:600px){.pint{width:34px;height:70px;bottom:8px}.runner{right:calc(1rem + 48px)}}

/* beer rising in the beer section */
#beers.has-fill,#cervezas.has-fill{overflow:hidden}
#beers > .wrap,#cervezas > .wrap{position:relative;z-index:2}
.beer-fill{position:absolute;left:0;right:0;bottom:0;height:62%;z-index:0;pointer-events:none;transform:translate3d(0,calc(100% + 60px),0);will-change:transform}
@keyframes waves{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.beer-fill__body i{position:absolute;bottom:-10px;width:7px;height:7px;border-radius:50%;background:rgba(255,250,230,.6);animation:rise 4s linear infinite}
.beer-fill__body i:nth-child(1){left:6%}.beer-fill__body i:nth-child(2){left:19%;animation-delay:1.1s;width:5px;height:5px}
.beer-fill__body i:nth-child(3){left:33%;animation-delay:2.3s}.beer-fill__body i:nth-child(4){left:47%;animation-delay:.5s;width:4px;height:4px}
.beer-fill__body i:nth-child(5){left:61%;animation-delay:1.8s}.beer-fill__body i:nth-child(6){left:72%;animation-delay:3s;width:5px;height:5px}
.beer-fill__body i:nth-child(7){left:84%;animation-delay:.9s}.beer-fill__body i:nth-child(8){left:94%;animation-delay:2.6s;width:4px;height:4px}
@keyframes rise{0%{transform:translateY(0);opacity:0}10%{opacity:1}100%{transform:translateY(-60vh);opacity:0}}
/* beer cards: bottle + logo */
.beer{flex:0 0 280px;align-items:center;text-align:center;background:rgba(18,19,18,.94)}
.beer__bottle{height:230px!important;width:auto!important;object-fit:contain;filter:drop-shadow(0 18px 18px rgba(0,0,0,.55));transition:transform .5s cubic-bezier(.3,1.4,.5,1)}
.beer:hover .beer__bottle{transform:rotate(-6deg) translateY(-6px)}
.beer__logo{height:56px!important;width:100%;object-fit:contain;margin-top:-.2rem}
.beer h3{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* big gray cadejos running through sections */
.has-runner,.legend-band,.page-hero--legend{overflow:hidden}
.big-cadejo{position:absolute;left:0;bottom:6%;height:min(34vw,300px);width:auto;opacity:.07;pointer-events:none;z-index:0;will-change:transform}
.has-runner > .wrap{position:relative;z-index:1}
.legend-band{padding:clamp(6rem,14vw,10rem) 0}
.legend-band .wrap{position:relative;z-index:1;max-width:820px;text-align:center}
.legend-band .lead{margin:0 auto 1.6rem;max-width:62ch;color:var(--ink);font-size:1.2rem}
.legend-pair{position:absolute;inset:0;pointer-events:none;z-index:0}
.legend-pair img{position:absolute;left:0;height:min(30vw,260px);width:auto;will-change:transform}
.legend-pair__white{top:6%;opacity:.38}
.legend-pair__black{bottom:4%;opacity:1;filter:brightness(0) drop-shadow(0 0 1px rgba(245,242,236,.35)) drop-shadow(0 0 14px rgba(0,0,0,.6))}
.page-hero--legend{min-height:auto;padding-bottom:3rem}
.page-hero--legend .page-hero__content{position:relative;z-index:1}
.legend-text p{font-size:1.15rem;max-width:62ch;color:var(--ink)}

/* jobs + events extras */
.jobs-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:3rem;align-items:start}
@media (max-width:860px){.jobs-grid{grid-template-columns:1fr}}
.jobs{list-style:none;margin:1rem 0 0;padding:0}
.job{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.9rem 0;border-bottom:1px solid var(--line)}
.job__name{font-family:var(--font-display);font-size:1.4rem}
.job__soon{font-size:.85rem;color:var(--ink-soft)}
.ev-types{margin-top:1rem}

/* ===== v4: full-bleed carousels, food gallery, foam, teeter, finder steps ===== */
/* carousels run edge to edge; JS turns them into endless, draggable strips */
.marquee{position:relative;margin-top:1.4rem;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:var(--line) transparent;outline:none}
.marquee.is-live::-webkit-scrollbar{display:none}
.marquee__track{display:flex;align-items:center;gap:clamp(.75rem,1.4vw,1.2rem);width:max-content;padding:1.3rem clamp(.75rem,1.4vw,1.2rem) 1.7rem}
.marquee.is-live{overflow:hidden;scrollbar-width:none;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.marquee.is-live .marquee__track{will-change:transform}
.marquee.is-dragging{cursor:grabbing}
.marquee.is-dragging .marquee__track *{pointer-events:none}
.marquee:focus-visible{box-shadow:inset 0 0 0 2px var(--highlight)}
.marquee img{-webkit-user-drag:none;user-select:none}
#beers > .marquee,#cervezas > .marquee{z-index:2}
.marquee.beers .beer{align-self:stretch}

/* food gallery */
.food{overflow:hidden}
.marquee--food + .marquee--food{margin-top:-.6rem}
.marquee--tall{--dish-h:clamp(250px,29vw,390px)}
.marquee--short{--dish-h:clamp(190px,21vw,280px)}
.dish{position:relative;flex:0 0 auto;margin:0;height:var(--dish-h,300px);border-radius:var(--radius);overflow:hidden;background:var(--bg-soft);
  box-shadow:0 14px 30px rgba(0,0,0,.45);transform:translateY(var(--dy,0)) rotate(var(--tilt,0deg));transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s}
.dish:nth-child(4n+1){--tilt:-1.6deg;--dy:6px}
.dish:nth-child(4n+2){--tilt:1.1deg;--dy:-8px}
.dish:nth-child(4n+3){--tilt:-.7deg;--dy:10px}
.dish:nth-child(4n){--tilt:1.7deg;--dy:-3px}
.dish img{display:block;height:100%;width:auto;transition:transform .9s cubic-bezier(.2,.7,.2,1),filter .5s}
.dish:hover{transform:translateY(-6px) rotate(0deg) scale(1.03);z-index:2;box-shadow:0 24px 44px rgba(0,0,0,.6)}
.dish:hover img{transform:scale(1.07);filter:saturate(1.12) brightness(1.05)}
.dish figcaption{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:.15rem;padding:2.4rem .9rem .8rem;line-height:1.15;
  background:linear-gradient(0deg,rgba(12,13,12,.92),rgba(12,13,12,0))}
.dish figcaption b{font-family:var(--font-display-loud);font-weight:400;font-size:clamp(1.15rem,1.5vw,1.45rem);letter-spacing:.03em;color:var(--ink)}
.dish figcaption small{font-size:.66rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--highlight)}
.marquee--short .dish figcaption{padding:1.8rem .75rem .65rem}
.food__more{margin:1.4rem 0 0;color:var(--ink-soft)}
.food__more a{color:var(--highlight);font-weight:600}
.dish-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,300px));gap:1.2rem;margin-top:1.5rem}
.dish-grid .dish{height:auto}
.dish-grid .dish img{width:100%;height:auto;aspect-ratio:2/3;object-fit:cover}

/* foam rides in front of the beer */
.beer-fill__body{position:absolute;inset:24px 0 0 0;z-index:0;background:linear-gradient(180deg,rgba(246,174,15,.92) 0%,rgba(232,146,12,.9) 40%,rgba(191,63,32,.92) 100%);overflow:hidden}
.beer-fill__foam{position:absolute;left:0;right:0;top:-16px;height:56px;z-index:2;overflow:hidden;pointer-events:none}
.beer-fill__wave{position:absolute;left:0;top:0;width:200%;height:100%;animation:waves 6s linear infinite;will-change:transform}
.beer-fill__wave--back{top:-7px;fill:rgba(250,244,232,.85);animation-duration:9s;animation-direction:reverse}
.beer-fill__wave--front{}

/* cadejos teeter while they run (rotation added in JS) */
.runner__dog,.big-cadejo,.legend-pair img{transform-origin:50% 72%}

/* finder: one question at a time */
.finder__q.is-waiting{display:none}
.finder__q.is-arriving{animation:qIn .6s cubic-bezier(.2,.7,.2,1) both}
@keyframes qIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.finder__q.is-done legend small::after{content:" ✓";opacity:1}
.finder fieldset + fieldset{margin-top:2rem}
@media (max-width:600px){.marquee--short .dish figcaption small{display:none}.dish figcaption{padding:2rem .7rem .7rem}}
@media (max-width:600px){.dish-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}}

/* menus as text */
.menu-tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.6rem 0 .4rem}
.menu-tabs[hidden]{display:none}
.menu-tabs button{font:inherit;font-weight:600;font-size:.92rem;padding:.6rem 1.15rem;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--ink);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.menu-tabs button:hover{border-color:var(--highlight)}
.menu-tabs button[aria-selected="true"]{background:var(--cta);border-color:var(--cta);color:var(--cta-ink)}
.menu-book{margin-top:2rem}
.menu-book[hidden]{display:none}
.has-tabs .menu-book__title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.menu-book__title{font-size:1.6rem;margin:0 0 .6rem}
.menu-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem 2.4rem;align-items:start;margin-top:1rem}
@media (max-width:760px){.menu-grid{grid-template-columns:1fr}}
.menu__sec{border-bottom:1px solid var(--line);margin:0}
.menu__sec summary{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;cursor:pointer;list-style:none;padding:.9rem 0}
.menu__sec summary::-webkit-details-marker{display:none}
.menu__sec-name{font-family:var(--font-display);font-size:1.35rem;font-weight:600;color:var(--highlight)}
.menu__sec summary::after{content:"+";font-size:1.4rem;line-height:1;color:var(--ink-soft);transition:transform .25s}
.menu__sec[open] summary::after{transform:rotate(45deg)}
.menu__count{margin-left:auto;font-size:.75rem;color:var(--ink-soft);font-variant-numeric:tabular-nums}
.menu__sec ul{list-style:none;margin:0 0 1rem;padding:0}
.mi{padding:.45rem 0;border-top:1px dashed rgba(62,57,53,.7)}
.mi:first-child{border-top:0}
.mi__row{display:flex;justify-content:space-between;align-items:baseline;gap:1rem}
.mi__name{font-weight:600;font-size:.95rem}
.mi__price{color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums;font-size:.92rem;text-align:right}
.mi__desc{margin:.15rem 0 0;font-size:.85rem;line-height:1.45;color:var(--ink-soft);max-width:60ch}
.mi__tag{display:inline-block;margin-left:.5rem;padding:.05rem .45rem;border-radius:999px;border:1px solid var(--accent);color:var(--accent);font-size:.66rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;vertical-align:middle}
.menu__note{font-size:.85rem;color:var(--ink-soft);margin:.2rem 0 .6rem}
.menu__sec li.mi{display:block;font-size:inherit}
.mi__opts{margin:.2rem 0 0;font-size:.82rem;color:var(--highlight);font-variant-numeric:tabular-nums}
.mi__opts--all{margin:0 0 .5rem}

/* hero: the Cadejo badge, big, next to the claim */
.hero__brand{display:flex;align-items:center;gap:clamp(1rem,2.6vw,2.2rem);margin:0 0 1.1rem}
.hero__brand .hero__claim{margin:0}
.hero__logo{flex:0 0 auto;width:clamp(115px,18vw,276px);height:auto;filter:drop-shadow(0 10px 30px rgba(0,0,0,.55))}
@media (max-width:600px){.hero__brand{flex-direction:column;align-items:flex-start;gap:1rem}.hero__logo{width:125px}}
.motion .hero__logo{opacity:0;transform:scale(.82) rotate(-8deg);transition:opacity .8s ease,transform 1s cubic-bezier(.3,1.4,.5,1);transition-delay:.15s}
.motion.is-loaded .hero__logo{opacity:1;transform:none}
.is-scrolling .marquee .beer:hover{transform:none;border-color:var(--line)}

/* location cards: photo and name open the location page; directions on one row, the page button on its own row */
.branch__photo{display:block;overflow:hidden}
.branch h3 a{color:inherit;text-decoration:none}
.branch h3 a:hover{color:var(--highlight)}
.branch__go{flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:.55rem}
.branch__nav{display:flex;gap:.5rem;flex:0 0 auto}
.branch__nav a{flex:1 1 0;text-align:center;display:flex;align-items:center;justify-content:center}
.branch__go a.branch__page{text-align:center}
.finder .results-grid .branch h3,.finder .results-grid .branch h3 a{color:var(--ink)}

/* all titles in Bebas Neue (one weight): no faux bold, a little air between lines so accents never touch */
h1,h2,h3,h4,.hero__claim,.moment b,.finder__q legend,.group-title,.b2b p>strong,.site-footer h4,.menu__sec-name,.other,.job__name,.brand span,.dish figcaption b{font-family:var(--font-display);font-weight:400;letter-spacing:.02em}
h1,h2,h3{line-height:1.1}
.hero__claim{font-size:clamp(3.4rem,7.4vw,6.8rem);line-height:1.08;max-width:20ch}
.page-hero h1{line-height:1.05}
.hero h1{font-family:var(--font-body);font-weight:500;letter-spacing:0;line-height:1.5}
.brand img{width:auto;height:36px}
@media (max-width:600px){.brand img{height:auto;width:min(250px,60vw)}}
.hero__logo{border-radius:50%}

/* opening title in Bodoni Moda Regular (homepage only) */
.hero__claim{font-family:'Bodoni Moda',Georgia,serif;font-weight:400;letter-spacing:0;font-size:clamp(2.7rem,5.6vw,5.2rem);line-height:1.12;max-width:17ch}
/* finder: Montaña terrace photo, darkened on the text side */
.finder{position:relative;isolation:isolate}
.finder::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(12,13,12,.9) 0%,rgba(12,13,12,.78) 45%,rgba(12,13,12,.35) 80%,rgba(12,13,12,.15) 100%)}
@media (max-width:760px){.finder{background-position:38% 50%}.finder::before{background:rgba(12,13,12,.74)}}
@media (max-width:760px){.finder{background-image:url(../images/branches/montana-huizucar/cadejo-montana-huizucar-terrace-breakfast-sm-cervezacadejo.com.webp)}}
.finder h2,.finder__q legend,.finder__results h3{color:var(--ink)}
.finder .lead{color:var(--ink-soft)}
.finder__q legend small{color:var(--ink-soft);opacity:1}
.chip span{border-color:rgba(245,242,236,.75);color:var(--ink);background:rgba(12,13,12,.35)}
.chip input:checked+span{background:var(--ink);color:var(--ink-dark);border-color:var(--ink)}
.chip input:focus-visible+span{outline-color:var(--ink)}

/* bottom runner: gray vector run cycle (4 frames from Cadejo's dog animation), plays only while the page scrolls */
.runner__dog{display:block;width:51px;height:30px;background:url(../images/illustrations/cadejo-run-cycle-gray-cervezacadejo.com.svg) 0 0/400% 100% no-repeat;animation:dogrun .36s steps(4) infinite;animation-play-state:paused;filter:none}
.runner.is-running .runner__dog{animation:dogrun .36s steps(4) infinite;animation-play-state:running}
@keyframes dogrun{from{background-position:0 0}to{background-position:133.333% 0}}
@media (max-width:600px){.runner__dog{width:41px;height:24px}}

/* buttons: square with lightly rounded corners (Oct 27) */
.btn,.chip span,.branch__go a,.menu-tabs button{border-radius:6px}

/* location pages: main title in Bodoni Moda Regular */
.page-hero--branch h1,.page-hero--branch.page-hero--bar h1{font-family:'Bodoni Moda',Georgia,serif;font-weight:400;letter-spacing:0;line-height:1.08;filter:none;font-size:clamp(2.8rem,6vw,5.4rem)}

/* hero without buttons: big official logo on the left, claim and intro aligned on one left edge */
.hero__brand{display:flex;flex-direction:row;align-items:center;gap:clamp(1.5rem,3.5vw,3.5rem);margin:0}
.hero__text{display:flex;flex-direction:column;min-width:0}
.hero__text .hero__claim{margin:0 0 1.2rem}
.hero__text h1{margin:0;max-width:56ch}
.hero__logo{width:clamp(145px,23vw,357px);margin-top:-2.2rem}
@media (max-width:700px){.hero__brand{flex-direction:column;align-items:flex-start;gap:1.2rem}.hero__logo{width:min(48vw,195px);margin-top:0}}
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* "One name, a different plan" section: two howling cadejos rise from the bottom corners */
.has-risers{overflow:hidden;position:relative}
.has-risers > .wrap{position:relative;z-index:1}
.riser{position:absolute;bottom:-4%;height:min(46vw,460px);width:auto;pointer-events:none;z-index:0;opacity:0;will-change:transform,opacity;transform:translate3d(0,75%,0)}
.riser--left{left:-5%;transform:translate3d(-30%,75%,0) scaleX(-1)}
.riser--right{right:-5%}
@media (max-width:700px){.riser{height:53vw;bottom:-2%}}

/* finder answers: no outline, same Bebas font as the question titles */
.chip span{border:0;font-family:var(--font-display);font-weight:400;font-size:1.3rem;letter-spacing:.03em;line-height:1;padding:.7rem 1rem .6rem;background:rgba(12,13,12,.55);color:var(--ink)}
.chip span:hover{background:rgba(12,13,12,.8)}
.chip input:checked+span{background:var(--ink);color:var(--ink-dark)}
.chips{gap:.5rem}
@media (max-width:600px){.chip span{font-size:1.15rem;padding:.6rem .8rem .5rem}.chips{gap:.4rem}}

/* seasonal beers: centered title and logos */
#beers .group-title,#cervezas .group-title{text-align:center}
.seasonal{margin-left:auto;margin-right:auto}

/* finder hint: one answer at a time gets a white outline and lifts, following the scroll */
.chip span{transition:background .25s,color .25s,transform .35s cubic-bezier(.3,1.4,.5,1),box-shadow .35s}
.chip span.is-hint,.chip span:hover{box-shadow:inset 0 0 0 2px var(--ink);transform:translateY(-3px)}
.chip input:checked+span{box-shadow:none;transform:none}
@media (prefers-reduced-motion:reduce){.chip span.is-hint{transform:none}}

/* Cadejo's slogan: same Bodoni Moda as the opening title, a size smaller */
h2.slogan{font-family:'Bodoni Moda',Georgia,serif;font-weight:400;letter-spacing:0;text-transform:none;line-height:1.1;font-size:clamp(2.3rem,4.4vw,4rem)}

/* ===== beers v5: real beer video with a wavy foam edge ===== */
.beer-fill{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 48' preserveAspectRatio='none'%3E%3Cpath d='M0 22 Q 80 6 160 22 T 320 22 T 480 22 T 640 22 V48 H0Z'/%3E%3C/svg%3E") 0 0/640px 48px repeat-x,linear-gradient(#000,#000) 0 46px/100% calc(100% - 46px) no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 48' preserveAspectRatio='none'%3E%3Cpath d='M0 22 Q 80 6 160 22 T 320 22 T 480 22 T 640 22 V48 H0Z'/%3E%3C/svg%3E") 0 0/640px 48px repeat-x,linear-gradient(#000,#000) 0 46px/100% calc(100% - 46px) no-repeat;
  animation:foamwave 6s linear infinite}
@keyframes foamwave{to{-webkit-mask-position:-640px 0,0 46px;mask-position:-640px 0,0 46px}}
.beer-fill__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0}
.beer-fill::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,19,18,0) 30%,rgba(18,19,18,.35) 100%);pointer-events:none}

/* beer cards: logo on top, bottle stepping out of a rounded panel, ABV and IBU badge */
.brew{flex:0 0 280px;display:flex;flex-direction:column;align-items:center;position:relative}
.brew__logo{display:block;height:64px;width:230px;object-fit:contain;margin:0 0 .6rem;filter:drop-shadow(0 2px 6px rgba(0,0,0,.55))}
.brew__bottle{display:block;height:250px;width:auto;position:relative;z-index:2;margin-bottom:-96px;filter:drop-shadow(0 18px 16px rgba(0,0,0,.55));transition:transform .5s cubic-bezier(.3,1.4,.5,1)}
.brew:hover .brew__bottle{transform:rotate(-5deg) translateY(-8px)}
.brew__panel{position:relative;width:100%;flex:1;padding:108px 1.25rem 1.4rem;border-radius:20px;background:linear-gradient(180deg,rgba(32,31,29,.97),rgba(16,17,16,.97));border:1px solid rgba(245,242,236,.09);box-shadow:0 18px 40px rgba(0,0,0,.45)}
.brew__style{margin:0 0 .45rem;font-family:var(--font-display);font-size:1.25rem;letter-spacing:.05em;color:var(--blonde);line-height:1.1}
.brew__desc{margin:0;font-size:.86rem;line-height:1.55;color:var(--ink-soft)}
.brew__badge{position:absolute;top:16px;right:14px;width:72px;height:72px;border-radius:50%;background:#0d0d0c;box-shadow:0 0 0 3px #b8955a,0 0 0 5px #0d0d0c,0 6px 14px rgba(0,0,0,.5);color:#f5f2ec;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;text-align:center}
.brew__badge small{font-size:.42rem;font-weight:700;letter-spacing:.08em;color:#cdb68a;white-space:nowrap}
.brew__badge b{font-family:var(--font-display);font-weight:400;font-size:1.15rem;letter-spacing:.02em;margin:1px 0}
.brew__badge span{display:block;width:62%;height:1px;background:#b8955a;margin:1px 0}
.marquee.beers .marquee__track{align-items:stretch;padding-top:1.6rem}
/* seasonal: same panels without bottles, three in a row */
.brews-seasonal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem;max-width:1000px;margin:1.6rem auto 0;align-items:stretch}
.brew--seasonal .brew__logo{height:96px;width:100%;margin-bottom:-26px;position:relative;z-index:2}
.brew--seasonal .brew__panel{padding-top:42px;padding-right:96px}
@media (max-width:860px){.brews-seasonal{grid-template-columns:1fr;max-width:420px}}

/* adaptive hero video: the sharper version fades in over the light one */
.hero__video--next{opacity:0;transition:opacity .8s ease}
.hero__video--next.is-on{opacity:1}

/* legend band: text and the "Leyenda del Cadejo" arch side by side (test, Oct 27) */
.legend-band .wrap.legend-split{max-width:var(--max);display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,5rem);align-items:center;text-align:left}
.legend-split__text .lead{margin:0 0 1.8rem;max-width:56ch}
.legend-arch{margin:0;position:relative;justify-self:center;width:min(100%,460px)}
.legend-arch::before{content:"";position:absolute;left:30%;right:30%;top:30%;bottom:16%;border-radius:45% 45% 8px 8px;background:radial-gradient(ellipse at 50% 60%,rgba(246,174,15,.22),rgba(246,174,15,0) 70%);pointer-events:none}
.legend-arch img{position:relative;display:block;width:100%;height:auto;filter:drop-shadow(0 20px 40px rgba(0,0,0,.45))}
@media (max-width:860px){.legend-band .wrap.legend-split{grid-template-columns:1fr;text-align:left}.legend-arch{width:min(80vw,380px);order:-1}}
/* buttons in the legend and events sections use the same Bebas font as the finder answers */
.btn--display{font-family:var(--font-display);font-weight:400;font-size:1.35rem;letter-spacing:.04em;line-height:1;padding:.85rem 1.4rem .75rem}

/* the pint: Cadejo's real 16 oz glass, filling as you scroll */
.pint{width:46px;height:131px;bottom:10px}
.pint__empty,.pint__logo{position:absolute;inset:0;width:100%;height:100%}
.pint__liquid{position:absolute;left:0;right:0;bottom:0;height:0;overflow:hidden;transition:height .25s ease-out}
.pint__liquid img{position:absolute;left:0;bottom:0;width:46px;height:131px;max-width:none}
.pint__foam{position:absolute;left:0;right:0;top:0;height:0;background-size:100% 100%;transition:opacity .3s,top .25s ease-out,height .25s ease-out}
.pint{filter:drop-shadow(0 6px 10px rgba(0,0,0,.55))}
@media (max-width:600px){.pint{width:36px;height:103px;bottom:8px}.pint__liquid img{width:36px;height:103px}}

/* legend arch v2: big, cut by the section, rising as you scroll to reveal the rest */
.legend-band{position:relative;overflow:hidden;min-height:min(86vh,860px);display:flex;align-items:center}
.legend-band .wrap.legend-split{display:block;width:100%}
.legend-split__text{max-width:min(46%,560px);position:relative;z-index:2}
.legend-band > .legend-arch{position:absolute;top:0;bottom:0;right:max(1rem,calc((100vw - var(--max)) / 2));width:min(48vw,720px);z-index:1;margin:0;overflow:hidden;justify-self:auto}
.legend-band > .legend-arch img{width:100%;height:auto;will-change:transform;filter:none;margin-top:clamp(2rem,5vw,4rem)}
.legend-band > .legend-arch::before{top:22%;bottom:auto;height:60%}
@media (max-width:860px){
  .legend-band{display:block;min-height:0;padding-top:0}
  .legend-band > .legend-arch{position:relative;right:auto;width:100%;height:min(105vw,620px);top:auto;bottom:auto}
  .legend-band > .legend-arch img{width:min(100%,520px);margin:0 auto}
  .legend-split__text{max-width:none}
}

/* legend v3: the two pillars of the legend frame the text from the sides; cut at the bottom, rising as you scroll */
.legend-band > .legend-arch{display:none}
.legend-band{min-height:min(90vh,860px)}
.legend-pillars{position:absolute;inset:0;pointer-events:none;z-index:1}
.legend-pillar{position:absolute;top:clamp(2.5rem,6vw,5.5rem);bottom:0;width:min(28vw,420px);overflow:hidden}
.legend-pillar--left{left:max(.5rem,3vw)}
.legend-pillar--right{right:max(.5rem,3vw)}
.legend-pillar img{display:block;width:100%;height:auto;will-change:transform}
.legend-band .wrap.legend-split{position:relative;z-index:2}
.legend-split__text{max-width:min(480px,36vw);margin:0 auto}
@media (max-width:860px){
  .legend-band{display:block;min-height:0;padding-top:0}
  .legend-pillars{position:relative;inset:auto;height:calc(2.5rem + 66vw);display:flex;justify-content:space-between;padding:2.5rem 4vw 0}
  .legend-pillar{position:relative;top:auto;bottom:auto;left:auto;right:auto;width:43vw;height:100%}
  .legend-split__text{max-width:none}
}
/* phones: legend text first, pillars below it, cut by the bottom of the section */
@media (max-width:860px){
  .legend-band{display:flex;flex-direction:column;padding-top:clamp(3.5rem,10vw,5rem);padding-bottom:0}
  .legend-band .wrap.legend-split{order:1}
  .legend-pillars{order:2;margin-top:1.5rem}
}

/* location pages: each location's own logo above the name */
.page-hero__logo{display:block;width:auto;height:auto;max-height:clamp(84px,11vw,130px);max-width:min(78vw,420px);margin:.4rem 0 1.1rem;filter:drop-shadow(0 4px 16px rgba(0,0,0,.6))}

/* ===== batch 1 (Oct 29): events slideshow, talent band, social band, history and values ===== */
.ev-slides{position:relative;aspect-ratio:4/3;border-radius:var(--radius);overflow:hidden;background:var(--bg-soft)}
.ev-slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.04);transition:opacity 1s ease,transform 6s linear}
.ev-slides img.is-on{opacity:1;transform:scale(1)}
.talent .split{align-items:center}
.talent img{border-radius:var(--radius);aspect-ratio:4/3;object-fit:cover;width:100%}
.talent .lead{margin-bottom:1.6rem}
.social-band{position:relative;overflow:hidden;padding:clamp(3.5rem,8vw,6rem) 0;background:#151614;border-top:1px solid var(--line)}
.social-band__logo{position:absolute;left:max(-90px,calc(50% - 760px));top:50%;width:min(44vw,380px);transform:translateY(-50%);opacity:.07;pointer-events:none}
.social-band__inner{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:2rem}
.social-band h2{font-size:clamp(2.6rem,6vw,4.6rem);margin:0 0 .5rem}
.social-band p{margin:0;color:var(--ink-soft)}
.social-band__icons{display:flex;gap:1rem}
.social-band__icons a{display:flex;align-items:center;justify-content:center;width:58px;height:58px;border-radius:50%;border:1px solid rgba(245,242,236,.25);color:var(--ink);transition:background .25s,transform .25s}
.social-band__icons a:hover{background:rgba(245,242,236,.12);transform:translateY(-3px)}
.social-band__icons svg{width:26px;height:26px;fill:currentColor}
.history h3{font-family:var(--font-display);font-weight:400;font-size:1.7rem;letter-spacing:.03em;margin:2rem 0 .4rem}
.history__kicker{color:var(--ink);font-size:1.25rem}
.mvv__top{display:grid;grid-template-columns:1fr 1.4fr;gap:1.2rem;margin-top:1.8rem}
.mvv__card{border-radius:18px;padding:1.6rem 1.7rem;background:linear-gradient(160deg,#2a2622,#1a1918);border:1px solid rgba(245,242,236,.08)}
.mvv__card h3{font-family:var(--font-display);font-weight:400;font-size:1.9rem;letter-spacing:.04em;margin:0 0 .5rem}
.mvv__card p{margin:0;font-size:1.02rem;line-height:1.6}
.mvv__card--mission{background:linear-gradient(160deg,#f2a93b,#d98a1c);color:#1a1310}
.mvv__card--vision{background:linear-gradient(160deg,#df7f1b,#b85e10);color:#1a1310}
.mvv__values-title{font-family:var(--font-display);font-weight:400;font-size:2rem;letter-spacing:.04em;margin:2.6rem 0 1rem}
.mvv__values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem}
.mvv__card--value{background:linear-gradient(160deg,#9a5d14,#7a470d);color:#f8efe2}
@media (max-width:760px){.mvv__top,.mvv__values{grid-template-columns:1fr}.social-band__logo{opacity:.06;width:80vw;left:auto;right:-20vw}}

/* jobs page: keep the apply button on one line */
.job .btn{white-space:nowrap;flex-shrink:0}

/* legend page: top section gets the two howling cadejos (like "Distintos lugares"); they rise in on load */
.page-hero--legend.has-risers{min-height:min(92vh,820px);padding-bottom:clamp(6rem,14vw,11rem)}
.page-hero--legend .riser{transition:transform 1.6s cubic-bezier(.2,.7,.2,1),opacity 1.6s ease}
.page-hero--legend .legend-text{max-width:min(620px,52vw);margin:0 auto}
.page-hero--legend .page-hero__content{text-align:center}
.page-hero--legend .legend-text p{text-align:left}
@media (max-width:860px){.page-hero--legend .legend-text{max-width:none}.page-hero--legend.has-risers{padding-bottom:58vw}}
/* legend page: "Nuestra historia" uses the legend pillars; text in the middle column */
.legend-band.history .legend-split__text{max-width:min(520px,38vw)}
.legend-band.history h3{text-align:left}
@media (max-width:860px){.legend-band.history .legend-split__text{max-width:none}}
/* mission, vision and values in grays */
.mvv__card--mission{background:linear-gradient(160deg,#5B5652,#47433F);color:var(--ink)}
.mvv__card--vision{background:linear-gradient(160deg,#4A4643,#373431);color:var(--ink)}
.mvv__card--value{background:linear-gradient(160deg,#2E2C2A,#232120);color:var(--ink);border:1px solid rgba(245,242,236,.1)}