/* App 2 · Vitrina: oscura con amarillo. Portada a pantalla completa que pasa sola, categorías tipo historias
   y tarjetas grandes donde la foto es la protagonista y el nombre va encima. */
.a2{
  --bg:#0E0E10;--sup:#18181C;--sup2:#222228;--tinta:#F5F2EA;--suave:#A6A29A;--linea:#2C2C33;--linea-fuerte:#45454E;
  --acento:#FFD23F;--sobre-acento:#141210;--acento-tx:#FFD23F;--wa:#1FA35B;
  --abierto-tx:#5BE38F;--cerrado-tx:#A6A29A;
  --cab-bg:rgba(14,14,16,.82);--tab-bg:rgba(18,18,22,.9);
  --busca-bg:#1C1C21;--busca-borde:#2C2C33;--busca-sombra:none;--radio-busca:999px;
  --chip-bg:#18181C;--chip-borde:#2C2C33;
  --oscuro:#FFD23F;--sobre-oscuro:#141210;--tinta-oscuro:#FFD23F;--pie-bg:#08080A;--pie-tx:#F5F2EA;
  --f-display:"Archivo",system-ui,sans-serif;--f-texto:"Archivo",system-ui,sans-serif;
  --peso-display:850;--peso-nombre:750;--track:-.02em;--track-s:-.005em;
  --radio:18px;--radio-btn:999px;--radio-ficha:24px;
  --sombra:none;--sombra-alta:0 20px 40px -18px rgba(0,0,0,.8);
  color-scheme:dark;
}
.a2 .sec__t,.a2 .vitrina__t,.a2 .ficha__t,.a2 .catcab__t,.a2 .raiz__t{font-stretch:112%;text-transform:uppercase;letter-spacing:-.01em}
.a2 .chip.on{background:var(--acento);border-color:var(--acento);color:var(--sobre-acento)}
.a2 .ins--dest{background:var(--acento);color:var(--sobre-acento)}
.a2 .ins--demo{background:#fff;color:#111}
.a2 .dueno .btn--claro,.a2 .promo .btn--claro{background:#141210;color:#FFD23F}

/* portada */
.a2 .vitrina{position:relative}
.a2 .vitrina__top{max-width:var(--ancho);margin:0 auto;padding:16px var(--gut) 20px}
.a2 .vitrina__top .micro{color:var(--acento)}
.a2 .vitrina__t{margin:0 0 16px;font:850 clamp(34px,9vw,80px)/.95 var(--f-display);font-stretch:118%}
.a2 .slides{margin:0;padding:0;gap:0;scroll-padding:0}
.a2 .slide{position:relative;flex:0 0 100%;height:min(68svh,620px);display:flex;align-items:flex-end;text-decoration:none;color:#fff;overflow:hidden}
.a2 .slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.a2 .slide::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(8,8,10,.92) 8%,rgba(8,8,10,.15) 60%)}
.a2 .slide__txt{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;gap:8px;width:100%;max-width:var(--ancho);margin:0 auto;padding:24px var(--gut) 44px}
.a2 .slide__t{font:850 clamp(40px,11vw,96px)/.92 var(--f-display);font-stretch:120%;text-transform:uppercase;letter-spacing:-.01em}
.a2 .slide--negocio .slide__t{font-size:clamp(32px,8.6vw,96px)}  /* «Tu restaurante, aquí arriba»: palabra larga, no debe cortarse en celular */
.a2 .slide__txt small{font-size:17px;opacity:.88;max-width:40ch}
.a2 .slide__txt .micro{color:var(--acento);margin:0}
.a2 .slide__cta{display:inline-flex;align-items:center;gap:8px;margin-top:6px;min-height:48px;padding:0 20px;border-radius:999px;background:var(--acento);color:var(--sobre-acento);font-weight:700}
.a2 .puntos{position:absolute;left:0;right:0;bottom:18px;display:flex;justify-content:center;gap:6px;pointer-events:none}
.a2 .puntos i{width:6px;height:6px;border-radius:3px;background:rgba(255,255,255,.4);transition:width .4s var(--ease),background-color .3s}
.a2 .puntos i.on{width:22px;background:var(--acento)}

/* historias */
.a2 .sec--hist{padding-top:24px}
.a2 .hists{gap:14px}
.a2 .hist{display:flex;flex-direction:column;align-items:center;gap:8px;width:80px;text-decoration:none}
.a2 .hist__aro{padding:3px;border-radius:50%;background:conic-gradient(from 200deg,#FFD23F,#FF7A1A,#FFD23F)}
.a2 .hist__img{display:block;width:72px;height:72px;border-radius:50%;overflow:hidden;border:3px solid var(--bg)}
.a2 .hist__img img{width:100%;height:100%;object-fit:cover}
.a2 .hist__t{font-size:12.5px;font-weight:600;text-align:center;line-height:1.2}

/* tarjetas: la foto manda y el nombre va encima */
.a2 .riel .tj{width:min(64vw,260px)}
.a2 .tj{background:var(--sup);border-radius:var(--radio)}
.a2 .tj--feed,.a2 .riel .tj{display:block;aspect-ratio:4/5}
.a2 .tj--feed .tj__foto,.a2 .riel .tj .tj__foto{position:absolute;inset:0;aspect-ratio:auto}
.a2 .tj--feed .tj__foto::after,.a2 .riel .tj .tj__foto::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(8,8,10,.94) 12%,rgba(8,8,10,.05) 62%)}
.a2 .tj--feed .tj__txt,.a2 .riel .tj .tj__txt{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:16px 18px 18px;color:#fff}
.a2 .tj--feed .tj__nombre{font:850 clamp(24px,6.4vw,32px)/1 var(--f-display);font-stretch:112%;text-transform:uppercase}
.a2 .riel .tj .tj__nombre{font:850 21px/1.02 var(--f-display);font-stretch:110%;text-transform:uppercase}
.a2 .tj--feed .tj__cats,.a2 .riel .tj .tj__cats{color:rgba(255,255,255,.78)}
.a2 .tj--feed .tj__dir{color:rgba(255,255,255,.7)}
.a2 .tj .ilus{top:12px;bottom:auto;right:auto;left:auto;right:64px}
.a2 .riel .tj .ilus{right:10px;top:auto;bottom:auto;display:none}
.a2 .tj__wa{right:12px;top:12px;width:44px;height:44px}
.a2 .tj__foto .ilus{z-index:1}
.a2 .lista--feed{grid-template-columns:1fr;gap:14px}
@media (min-width:700px){.a2 .lista--feed{grid-template-columns:repeat(2,1fr)}.a2 .lista--feed>.tj:first-child{grid-column:1 / -1;aspect-ratio:16/8}}
@media (min-width:1100px){.a2 .lista--feed{grid-template-columns:repeat(3,1fr)}.a2 .lista--feed>.tj:first-child{grid-column:span 2;aspect-ratio:auto}}
.a2 .tj--feed .tj__ins{z-index:1}

/* para restaurantes */
.a2 .promo{max-width:calc(var(--ancho) - var(--gut) * 2);margin:40px var(--gut) 0;padding:28px;border-radius:var(--radio);background:var(--acento);color:var(--sobre-acento)}
@media (min-width:1304px){.a2 .promo{margin-inline:auto}}
.a2 .promo .micro{color:inherit;opacity:.7}
.a2 .promo__t{margin:0 0 8px;font:850 clamp(26px,6vw,40px)/1 var(--f-display);font-stretch:115%;text-transform:uppercase}
.a2 .promo p{margin:0 0 18px;max-width:46ch}
.a2 .catcab{min-height:360px}
.a2 .ficha__card{background:var(--bg)}
.a2 .flot{background:rgba(14,14,16,.7);color:#fff;backdrop-filter:blur(8px)}
.a2 .flot--marca{background:none}
