:root{
  --negro:#0A0A0A; --negro-2:#1C1C1C; --negro-3:#2A2A2A;
  --blanco:#fff; --hueso:#F5F4F1; --gris:#6B6966; --linea:#DCDAD6; --linea-osc:#3A3A3A;
  --naranja:#F25C19;
  --serif:"Bodoni Moda",Didot,"Bodoni 72",Georgia,serif;
  --sans:"Archivo",system-ui,sans-serif;
  --m:clamp(20px,4.2vw,64px);
  --ease:cubic-bezier(.23,1,.32,1);
  --ease-io:cubic-bezier(.77,0,.175,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--blanco);color:var(--negro);font:400 17px/1.55 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:clip}
img,svg{display:block;max-width:100%}
h1,h2,h3,p,ul,ol,figure{margin:0}
ul,ol{list-style:none;padding:0}
a{color:inherit}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
:focus-visible{outline:2px solid var(--naranja);outline-offset:3px}
::selection{background:var(--negro);color:var(--blanco)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px;top:8px;z-index:60;background:var(--blanco);padding:10px 14px}
.skip:focus{left:8px}
section[id]{scroll-margin-top:70px}

/* tipografía: serif fina en mayúsculas + palo seco muy pesado, como la referencia */
.serif-xl{font:400 clamp(3.2rem,7.4vw,7.6rem)/.92 var(--serif);text-transform:uppercase;letter-spacing:-.02em}
.serif-l{font:400 clamp(2.4rem,4.6vw,4.6rem)/.95 var(--serif);text-transform:uppercase;letter-spacing:-.015em}
.mix{font-size:clamp(2.7rem,6.6vw,6.8rem);line-height:.9;text-transform:uppercase}
.mix .s{display:block;font:400 1em/.92 var(--serif);letter-spacing:-.02em}
.mix .g{display:block;font:900 1em/.9 var(--sans);letter-spacing:-.035em;color:#4A4A4A}
.mix-dark .g{color:var(--blanco)}
.caps{font:600 .82rem/1.9 var(--sans);letter-spacing:.32em;text-transform:uppercase}

/* botones */
.pill{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 28px;border-radius:999px;font:800 .74rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;
  transition:background-color 220ms ease,color 220ms ease,border-color 220ms ease,transform 140ms var(--ease)}
.pill:active{transform:scale(.97)}
.pill-light{background:var(--blanco);color:var(--negro)}
.pill-light:hover{background:var(--naranja);color:var(--negro)}
.pill-dark{background:var(--negro-3);color:var(--blanco)}
.pill-dark:hover{background:var(--negro)}
.pill-dark[disabled]{background:var(--linea);color:var(--gris);cursor:not-allowed}
.pill-line{border:1.5px solid currentColor;min-height:34px;padding:0 16px;font-size:.68rem}
.pill-line:hover{background:var(--blanco);color:var(--negro)}
.redondo{width:48px;height:48px;border-radius:50%;background:var(--blanco);display:grid;place-items:center;box-shadow:0 4px 18px rgba(0,0,0,.12);transition:transform 160ms var(--ease),background-color 200ms ease,opacity 200ms ease}
.redondo svg{width:20px;height:20px}
.redondo:hover{transform:scale(1.06)}
.redondo:active{transform:scale(.95)}
.redondo[disabled]{opacity:.35;cursor:default;transform:none}
.redondo.dark{background:transparent;color:var(--blanco);box-shadow:inset 0 0 0 1.5px var(--linea-osc)}
.redondo.dark:hover{background:var(--blanco);color:var(--negro)}
.link{font:500 .95rem var(--sans);text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.cuenta{display:flex;align-items:center;gap:12px;font:600 .8rem var(--sans);font-variant-numeric:tabular-nums}
.cuenta i{width:34px;height:1px;background:currentColor;opacity:.6}

/* barra */
.bar{position:fixed;inset:0 0 auto 0;z-index:40;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:18px var(--m);color:var(--blanco);
  transition:background-color 300ms ease,padding 300ms var(--ease),transform 400ms var(--ease)}
.bar.solida{background:var(--negro);padding-block:12px}
.bar.oculta{transform:translateY(-100%)}
.burger{width:44px;height:44px;display:grid;align-content:center;gap:7px;justify-items:start}
.burger span:not(.sr){display:block;width:28px;height:1.5px;background:currentColor;transition:transform 300ms var(--ease)}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(4.25px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){transform:translateY(-4.25px) rotate(-45deg)}
.marca{display:flex;align-items:center;gap:12px;text-decoration:none;font:300 1.05rem var(--sans);letter-spacing:.42em;padding-left:.42em;opacity:0;transform:translateY(-6px);transition:opacity 300ms ease,transform 300ms var(--ease)}
.bar.solida .marca{opacity:1;transform:none}
.mk{height:26px;width:auto;fill:currentColor}
.bar .pill-line{justify-self:end}

/* menú a pantalla completa */
.menu{position:fixed;inset:0;z-index:35;background:var(--negro);color:var(--blanco);display:flex;flex-direction:column;justify-content:space-between;padding:110px var(--m) 40px;
  clip-path:inset(0 0 100% 0);transition:clip-path 600ms var(--ease-io)}
.menu.abierto{clip-path:inset(0)}
.menu nav{display:grid;gap:4px}
.menu nav a{font:400 clamp(2.6rem,7vw,5.6rem)/1.02 var(--serif);text-transform:uppercase;text-decoration:none;width:fit-content;opacity:0;transform:translateY(30px);
  transition:opacity 500ms var(--ease),transform 600ms var(--ease),color 200ms ease;transition-delay:calc(200ms + var(--i) * 60ms)}
.menu.abierto nav a{opacity:1;transform:none}
.menu nav a:hover{color:var(--naranja)}
.menu-pie{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;color:#BDBAB4;font-size:.92rem}
.menu-pie a{color:var(--blanco)}

/* hero */
.hero{position:relative;height:100svh;min-height:560px;background:var(--negro);color:var(--blanco);overflow:hidden}
.slides,.slide{position:absolute;inset:0}
.slide{opacity:0;transition:opacity 1400ms ease}
.slide.on{opacity:1}
.slide img{width:100%;height:100%;object-fit:cover;transform:scale(1.1);transition:transform 7s linear}
.slide.on img{transform:scale(1)}
.hero::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.34)}
.hero-txt{position:absolute;z-index:2;left:var(--m);right:var(--m);bottom:clamp(88px,13vh,140px)}
h1{font:400 clamp(2.9rem,7.6vw,8rem)/.9 var(--serif);text-transform:uppercase;letter-spacing:-.025em;max-width:13ch}
.ln{display:block;overflow:hidden;padding-bottom:.06em}
.ln>span{display:block}
.sub{margin-top:26px;font:600 .8rem/1.7 var(--sans);letter-spacing:.3em;text-transform:uppercase}
.hero-ctrl{position:absolute;z-index:2;left:var(--m);right:var(--m);bottom:30px;display:flex;justify-content:space-between;align-items:center}
.pausa{width:40px;height:40px;display:grid;place-items:center;margin-left:-10px}
.pausa svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6}
.pausa .i-play{display:none;fill:currentColor;stroke:none}
.pausa[aria-pressed="true"] .i-play{display:block}
.pausa[aria-pressed="true"] .i-pausa{display:none}

/* maestro */
.maestro{background:var(--negro);color:var(--blanco);display:grid;grid-template-columns:1fr 1fr;align-items:end;min-height:92svh;overflow:hidden}
.maestro-txt{padding:clamp(80px,10vw,150px) var(--m)}
.maestro-txt p{max-width:44ch;margin:34px 0 38px;color:#D6D3CE;font-size:1.06rem}
.maestro-img{height:100%;min-height:520px;overflow:hidden}
.maestro-img img{width:100%;height:100%;object-fit:cover}

/* sabores */
.sabores{position:relative;padding:clamp(96px,11vw,170px) 0 clamp(80px,9vw,140px);background:var(--blanco)}
.guias{position:absolute;inset:0 var(--m);display:grid;grid-template-columns:repeat(4,1fr);pointer-events:none}
.guias i{border-left:1px solid var(--linea)}
.guias i:last-child{border-right:1px solid var(--linea)}
.guias i:nth-child(3){grid-column:4}
.sab-head,.potes-head{position:relative;display:grid;grid-template-columns:1fr auto;align-items:end;gap:32px;padding:0 var(--m) 0 calc(var(--m) + 24px)}
.sab-head p,.potes-head p{max-width:30ch;color:var(--gris);padding-bottom:12px}
.tabs{position:relative;display:flex;gap:6px;flex-wrap:wrap;padding:56px var(--m) 0 calc(var(--m) + 24px)}
.tabs button{padding:10px 18px;border-radius:999px;font:700 .78rem var(--sans);letter-spacing:.1em;text-transform:uppercase;background:var(--hueso);transition:background-color 220ms ease,color 220ms ease}
.tabs button:hover{background:var(--linea)}
.tabs button[aria-selected="true"]{background:var(--negro);color:var(--blanco)}
.tabs sup{font-size:.62rem;margin-left:5px;opacity:.6}
.carrusel{position:relative;margin-top:28px}
.track{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--m);padding:20px var(--m) 30px;scrollbar-width:none;overscroll-behavior-x:contain}
.track::-webkit-scrollbar{display:none}
.track li{flex:0 0 clamp(150px,15.5vw,230px);scroll-snap-align:start}
.sabor{width:100%;display:grid;justify-items:center;gap:14px;padding:18px 10px 20px;border-radius:18px;text-align:center;font:600 .98rem/1.25 var(--sans);transition:background-color 220ms ease}
.sabor:hover{background:var(--hueso)}
.bocha{width:82%;overflow:visible;transition:transform 500ms var(--ease)}
.bocha .sombra{fill:#000;opacity:.09;transition:opacity 400ms ease,transform 500ms var(--ease);transform-origin:60px 99px}
.bocha .brillo{fill:#fff;opacity:.45}
.sabor:hover .bocha{transform:translateY(-8px) rotate(-3deg)}
.sabor:hover .sombra{transform:scaleX(.82);opacity:.06}
.sabor span{min-height:2.5em}
.sabor[aria-pressed="true"]{background:var(--negro);color:var(--blanco)}
.sabor[aria-pressed="true"] .bocha{transform:translateY(-6px) scale(1.04)}
.sabor[aria-pressed="true"] .sombra{opacity:0}
.lleno .sabor[aria-pressed="false"]{opacity:.4}
.carrusel .redondo{position:absolute;top:calc(50% - 40px);z-index:2}
.carrusel .prev{left:calc(var(--m) - 24px)}
.carrusel .next{right:calc(var(--m) - 24px)}

/* potes */
.potes{background:var(--hueso);padding:clamp(96px,11vw,170px) 0}
.potes-grid{display:grid;grid-template-columns:5fr 4fr 4fr;gap:clamp(12px,1.6vw,24px);padding:56px var(--m) 0;align-items:start}
.potes-grid figure{overflow:hidden;border-radius:4px}
.potes-grid img{width:100%;aspect-ratio:1/1.1;object-fit:cover;transition:transform 900ms var(--ease)}
.potes-grid figure:hover img{transform:scale(1.04)}
.pg-b{margin-top:clamp(40px,7vw,110px)}
.armador{background:var(--blanco);padding:clamp(24px,2.6vw,38px);border-radius:4px;align-self:stretch;display:flex;flex-direction:column}
.armador h3{font:400 clamp(2rem,2.8vw,2.8rem)/1 var(--serif);text-transform:uppercase}
.sizes{display:flex;gap:6px;margin:24px 0 20px}
.sizes button{flex:1;min-height:44px;border-radius:999px;font:700 .82rem var(--sans);background:var(--hueso);transition:background-color 200ms ease,color 200ms ease,transform 140ms var(--ease)}
.sizes button:active{transform:scale(.97)}
.sizes button[aria-checked="true"]{background:var(--negro);color:var(--blanco)}
.elegidos{display:grid;gap:4px}
.elegidos li{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid var(--linea);font-weight:600;animation:entra 420ms var(--ease) both}
.elegidos i{flex:none;width:18px;height:18px;border-radius:50%}
.elegidos button{margin-left:auto;font-size:.8rem;color:var(--gris);text-decoration:underline;text-underline-offset:3px;padding:6px 0 6px 10px}
.elegidos button:hover{color:var(--negro)}
@keyframes entra{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.vacio{color:var(--gris);font-size:.95rem}
.armador-pie{margin-top:auto;padding-top:24px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.nota{font-size:.85rem;color:var(--gris);margin-top:12px;min-height:1.3em}

/* elaboración */
.elab{background:var(--negro);color:var(--blanco);padding:clamp(96px,11vw,170px) var(--m)}
.elab-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end}
.elab-head p{max-width:46ch;color:#D6D3CE;justify-self:end}
.termo{margin-top:clamp(56px,6vw,90px);border-top:1px solid var(--linea-osc);border-bottom:1px solid var(--linea-osc);padding:36px 0 18px}
.termo-plot{position:relative;height:clamp(200px,24vw,320px)}
.termo-plot svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.t-guia{stroke:var(--linea-osc);stroke-width:1;stroke-dasharray:3 6;fill:none;vector-effect:non-scaling-stroke}
.t-linea{fill:none;stroke:var(--naranja);stroke-width:2.5;stroke-linecap:round}
.js .t-linea{stroke-dasharray:var(--len,2000);stroke-dashoffset:calc(var(--len,2000) * (1 - var(--p,0)))}
.pluma{display:none;position:absolute;left:0;top:0;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--blanco);transform:translate(var(--px,0),var(--py,0))}
.js .pluma{display:block}
.pluma b{position:absolute;left:18px;top:-30px;font:400 1.4rem var(--serif);white-space:nowrap}
.pluma.fin b{left:auto;right:18px}
.eje{position:absolute;right:0;font:600 .75rem var(--sans);letter-spacing:.2em;color:#8E8B86}
.e85{top:15%;transform:translateY(-150%)}
.e4{top:96%;transform:translateY(-150%)}
.termo figcaption{display:flex;justify-content:space-between;gap:12px;padding-top:16px;font:600 .72rem var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#8E8B86}
.pasos{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,32px);margin-top:clamp(64px,7vw,110px)}
.pasos figure{overflow:hidden;border-radius:4px;margin-bottom:22px}
.pasos img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform 900ms var(--ease)}
.pasos article:hover img{transform:scale(1.04)}
.pasos h3{font:400 1.9rem/1 var(--serif);text-transform:uppercase;margin-bottom:10px}
.pasos p{color:#BDBAB4;max-width:34ch}

/* sucursales */
.locales{background:var(--negro-2);color:var(--blanco);padding:clamp(96px,11vw,170px) 0}
.loc-head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:32px;padding:0 var(--m)}
.loc-head .caps{color:#BDBAB4;padding-bottom:14px;max-width:32ch}
.loc-head .mix{text-align:right}
.loc-slider{margin-top:56px;padding:0 var(--m)}
.loc-track{display:grid}
.loc{grid-area:1/1;display:grid;grid-template-columns:7fr 4fr;gap:clamp(24px,4vw,64px);align-items:end;visibility:hidden}
.loc.on{visibility:visible}
.loc figure{overflow:hidden;border-radius:4px;aspect-ratio:16/8.6;background:var(--negro-3)}
.loc img{width:100%;height:100%;object-fit:cover;clip-path:inset(0 0 0 100%);transform:scale(1.08);transition:clip-path 900ms var(--ease-io),transform 1400ms var(--ease)}
.loc.on img{clip-path:inset(0);transform:none}
.loc-txt>*{opacity:0;transform:translateY(20px);transition:opacity 500ms ease,transform 700ms var(--ease)}
.loc.on .loc-txt>*{opacity:1;transform:none}
.loc.on .loc-txt>:nth-child(2){transition-delay:80ms}
.loc.on .loc-txt>:nth-child(3){transition-delay:160ms}
.loc.on .loc-txt>:nth-child(4){transition-delay:240ms}
.loc h3{font:400 clamp(3rem,5.4vw,5.4rem)/.9 var(--serif);text-transform:uppercase}
.dir{font:800 1.15rem var(--sans);margin:18px 0 10px;letter-spacing:-.01em}
.loc-txt p:not(.dir){color:#BDBAB4;margin-bottom:28px;max-width:30ch}
.loc-ctrl{display:flex;align-items:center;gap:18px;margin-top:32px;padding-top:24px;border-top:1px solid var(--linea-osc)}
.loc-ctrl .cuenta{color:#BDBAB4}

/* historia */
.historia{display:grid;grid-template-columns:auto 1fr;gap:clamp(24px,5vw,80px);padding:clamp(96px,11vw,170px) var(--m);background:var(--blanco)}
.vertical{position:sticky;top:90px;align-self:start;writing-mode:vertical-rl;transform:rotate(180deg);font:400 clamp(4rem,9vw,9rem)/.82 var(--serif);text-transform:uppercase;letter-spacing:-.02em;color:var(--negro);height:fit-content}
.his-body{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,80px);align-items:start}
.his-intro p{margin-top:28px;max-width:46ch;font-size:1.06rem}
.his-foto{justify-self:end;max-width:360px}
.his-foto img{width:100%;filter:grayscale(1) contrast(1.05)}
.his-foto figcaption{font-size:.85rem;color:var(--gris);margin-top:12px}
.linea{grid-column:1/-1;border-top:1px solid var(--linea)}
.linea li{display:grid;grid-template-columns:minmax(120px,1fr) 3fr;align-items:baseline;gap:24px;padding:20px 0;border-bottom:1px solid var(--linea)}
.linea b{font:400 clamp(2rem,3.4vw,3.2rem)/1 var(--serif);font-variant-numeric:lining-nums}
.linea span{font-size:1.05rem}
.linea li:nth-child(3) b,.linea li:nth-child(5) b{color:var(--naranja)}

/* equipo */
.equipo{position:relative;height:clamp(560px,92svh,980px);overflow:hidden;background:var(--negro);color:var(--blanco)}
.equipo figure{position:absolute;inset:-8% 0}
.equipo img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;transform:translateY(calc((var(--p,.5) - .5) * -10%))}
.equipo::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.28)}
.equipo-txt{position:absolute;z-index:2;right:var(--m);bottom:clamp(48px,8vw,110px);max-width:440px}
.equipo-txt p{margin-top:20px;font-size:1.06rem}

/* redes */
.redes{background:var(--blanco);padding:clamp(80px,9vw,130px) 0 0;overflow:hidden}
.marquee{overflow:hidden;border-block:1px solid var(--linea);padding:18px 0}
.marquee div{display:flex;width:max-content;animation:marq 32s linear infinite}
.marquee span{font-size:clamp(2.6rem,6vw,6rem);line-height:1;padding-right:.5em;text-transform:uppercase;white-space:nowrap}
.marquee .g{font:900 1em var(--sans);letter-spacing:-.03em}
.marquee .s{font:400 1em var(--serif)}
@keyframes marq{to{transform:translateX(-50%)}}
.ig{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;padding:4px}
.ig a{display:block;overflow:hidden;aspect-ratio:1}
.ig img{width:100%;height:100%;object-fit:cover;transition:transform 900ms var(--ease),opacity 300ms ease}
.ig a:hover img{transform:scale(1.05);opacity:.86}

/* pie */
.pie{background:var(--negro-2);color:var(--blanco);padding:clamp(64px,7vw,100px) var(--m) 32px}
.pie-top{display:grid;grid-template-columns:1fr 1fr 1.6fr 2.6fr;gap:32px;border-top:1px solid var(--linea-osc);padding-top:28px}
.pie li{padding:4px 0;color:#D6D3CE}
.pie a{text-decoration:none;transition:color 200ms ease}
.pie a:hover{color:var(--naranja)}
.pie-seg{display:flex;align-items:center;gap:24px;justify-self:end}
.pie-seg .caps{color:#BDBAB4;font-size:.72rem;max-width:12ch;line-height:1.6}
.g-xl{font:900 clamp(3rem,6.4vw,6.6rem)/.85 var(--sans);letter-spacing:-.04em}
.pie-redes{display:flex;justify-content:center;gap:36px;flex-wrap:wrap;margin-top:72px;padding:20px 0;border-block:1px solid var(--linea-osc);font-weight:500}
.legal{margin-top:24px;font-size:.8rem;color:#8E8B86}

/* pote flotante */
.pote-flot{position:fixed;z-index:30;right:var(--m);bottom:calc(20px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:18px;padding:0 10px 0 22px;min-height:56px;border-radius:999px;background:var(--negro);color:var(--blanco);font:600 .9rem var(--sans);
  box-shadow:0 10px 30px rgba(0,0,0,.25);transform:translateY(160%);transition:transform 420ms var(--ease)}
.pote-flot b{background:var(--naranja);color:var(--negro);border-radius:999px;padding:11px 16px;font:800 .72rem var(--sans);letter-spacing:.1em;text-transform:uppercase}
.pote-flot.on{transform:none}
.pote-flot[hidden]{display:none}

/* movimiento */
.js [data-rise]>*{opacity:0;transform:translateY(28px);transition:opacity 700ms var(--ease),transform 900ms var(--ease);transition-delay:calc(var(--i,0) * 90ms)}
.js [data-rise].in>*{opacity:1;transform:none}
.js li[data-rise]{opacity:1}
.js [data-reveal]{clip-path:inset(12% 0 12% 0);transition:clip-path 1200ms var(--ease-io)}
.js [data-reveal] img{transform:scale(1.18);transition:transform 1600ms var(--ease)}
.js [data-reveal].in{clip-path:inset(0)}
.js [data-reveal].in img{transform:none}
.js .ln>span{transform:translateY(105%);transition:transform 1100ms var(--ease)}
.js .ln+.ln>span{transition-delay:110ms}
.js .sub,.js .hero-ctrl{opacity:0;transition:opacity 900ms ease 700ms}
.js.listo .ln>span{transform:none}
.js.listo .sub,.js.listo .hero-ctrl{opacity:1}
.js .fam:not([hidden]) .track li{animation:sube 600ms var(--ease) both;animation-delay:calc(var(--n,0) * 45ms)}
@keyframes sube{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

@media (max-width:1000px){
  .maestro{grid-template-columns:1fr}
  .maestro-img{min-height:0;aspect-ratio:1}
  .potes-grid{grid-template-columns:1fr 1fr}
  .armador{grid-column:1/-1}
  .pg-b{margin-top:48px}
  .elab-head{grid-template-columns:1fr}
  .elab-head p{justify-self:start}
  .loc{grid-template-columns:1fr}
  .his-body{grid-template-columns:1fr}
  .his-foto{justify-self:start}
  .pie-top{grid-template-columns:1fr 1fr}
  .pie-seg{grid-column:1/-1;justify-self:start;margin-top:24px}
}
@media (max-width:700px){
  body{font-size:16px}
  .bar{padding:12px 16px}
  .marca{font-size:.9rem;letter-spacing:.34em}
  .hero-txt{bottom:96px}
  .sub{letter-spacing:.2em;font-size:.72rem}
  .guias{grid-template-columns:repeat(2,1fr)}
  .guias i:nth-child(3){display:none}
  .sab-head,.potes-head,.loc-head{grid-template-columns:1fr;padding-left:var(--m)}
  .tabs{padding-left:var(--m);gap:6px}
  .tabs button{padding:9px 14px;font-size:.7rem}
  .track li{flex-basis:44vw}
  .carrusel .redondo{display:none}
  .loc-head .mix{text-align:left}
  .pasos{grid-template-columns:1fr;gap:48px}
  .historia{grid-template-columns:1fr}
  .vertical{position:static;writing-mode:horizontal-tb;transform:none;font-size:3.4rem;line-height:.9}
  .linea li{grid-template-columns:90px 1fr;gap:14px}
  .equipo-txt{left:var(--m)}
  .ig{grid-template-columns:repeat(2,1fr)}
  .ig li:nth-child(n+7){display:none}
  .pote-flot{left:16px;right:16px;justify-content:space-between}
  .termo figcaption span:nth-child(odd){display:none}
}
@media (prefers-reduced-motion:reduce){
  .js [data-rise]>*,.js .ln>span,.js .sub,.js .hero-ctrl{opacity:1;transform:none;transition:none}
  .js [data-reveal],.js [data-reveal] img{clip-path:none;transform:none;transition:none}
  .slide img,.equipo img{transform:none;transition:none}
  .marquee div,.js .fam .track li{animation:none}
  .js .t-linea{stroke-dashoffset:0}
  .js .pluma{display:none}
}

/* ajustes de la primera mirada */
.ln{padding-top:.14em;margin-top:-.14em}
h1{max-width:none;font-size:clamp(2.6rem,7vw,7.4rem)}
.hero::after{background:linear-gradient(90deg,rgba(0,0,0,.62) 0%,rgba(0,0,0,.28) 55%,rgba(0,0,0,.18) 100%)}
.pill{font-size:13px;letter-spacing:.1em}
.pill-line{font-size:13px}
.caps,.sub{font-size:13px}
.termo figcaption,.eje{font-size:13px;letter-spacing:.14em}
.tabs button{font-size:13px}
.tabs sup{font-size:11px}
.sabores{padding-bottom:clamp(56px,6vw,96px)}
.track li{flex-basis:clamp(160px,16.5vw,250px)}
.bocha{width:90%}
.pasos img{aspect-ratio:4/3}
.slots{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:6px 0 18px}
.slots li{aspect-ratio:1;border-radius:50%;border:1.5px dashed var(--linea);display:grid;place-items:center;transition:background-color 400ms var(--ease),border-color 300ms ease,transform 400ms var(--ease)}
.slots li.lleno{border-style:solid;border-color:transparent;transform:scale(1.04)}
.slots li.off{opacity:.25}
.slots svg{width:82%;overflow:visible}
@media (max-width:700px){
  h1{font-size:clamp(2.3rem,10.6vw,3.6rem)}
  .ln>span{white-space:normal}
}
.mix{font-size:clamp(2rem,6.6vw,6.8rem)}
@media (max-width:700px){ h1{font-size:9.6vw} .mix{font-size:8.6vw} }
.pill-dark[disabled]{color:#55534F}
h1{font-size:clamp(2.6rem,6.1vw,6.6rem)}
.js .ln:nth-child(3)>span{transition-delay:220ms}
.hero::after{background:linear-gradient(90deg,rgba(0,0,0,.66) 0%,rgba(0,0,0,.4) 45%,rgba(0,0,0,.12) 75%)}
@media (max-width:700px){ h1{font-size:12vw} .hero::after{background:linear-gradient(0deg,rgba(0,0,0,.7) 0%,rgba(0,0,0,.25) 60%,rgba(0,0,0,.15) 100%)} }
.armador{align-self:start}
.bar{grid-template-columns:auto 1fr auto}
.marca{justify-self:center}
@media (max-width:700px){ h1{font-size:10.2vw} .marca span{display:none} .pill-line{padding:0 14px} }
img{height:auto}
[data-reveal]{overflow:hidden}
html{overflow-x:clip}