/* Portada horizontal y compacta. El MP4 ya tiene formato 16:9. */
.topbar{position:relative;min-height:58px;padding:calc(12px + env(safe-area-inset-top)) clamp(16px,5vw,70px) 12px;background:#14110f;border-bottom:1px solid #ddb5741c}
.hero{height:clamp(180px,56.25vw,500px);min-height:0;background-position:center}
.hero-content{position:absolute;top:50%;left:50%;width:92%;max-width:720px;padding:10px 12px;transform:translate(-50%,-50%);transition:opacity .8s ease,transform 1s ease;pointer-events:none}
.hero.video-visible .hero-content{opacity:0;transform:translate(-50%,-46%)}
.hero h1{font-size:clamp(34px,6.8vw,76px)}
.hero-location{margin-bottom:8px;font-size:9px;letter-spacing:3px}
.hero-description{margin-top:12px;font-size:13px}
.hero-small{margin-top:9px;font-size:9px}
.hero-arrow{margin-top:10px;font-size:20px}
.portada-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;opacity:0;z-index:2;transition:opacity 1.15s ease;pointer-events:none;background:#14110f}
.hero.video-visible .portada-video{opacity:1}
.portada-sombra{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(transparent,rgba(14,8,5,.55));transition:opacity 1s ease}
.hero:after{z-index:1}
.portada-pausa{position:absolute;right:12px;bottom:12px;z-index:4;padding:7px 12px;border:1px solid #ddb57460;border-radius:20px;background:#14110fbf;color:#fff;font-size:11px;cursor:pointer;backdrop-filter:blur(10px)}
.contact-panel{margin-top:14px}
.estado-conexion{position:fixed;top:0;left:0;right:0;z-index:6000;margin:0;padding:10px 14px;background:#523314;color:#fff;text-align:center;font-size:13px}
.instalar-contenedor{text-align:center;background:#14110f}
#instalar-app{margin:15px;padding:12px 20px;border:1px solid #ddb574;border-radius:24px;color:#edbd72;background:transparent;cursor:pointer}
[hidden]{display:none!important}
/* Detalles al recorrer la carta, sin modificar el desplazamiento nativo. */
.lectura-progreso{position:fixed;inset:0 0 auto;height:3px;z-index:7000;pointer-events:none;background:linear-gradient(90deg,#a56833,#f3d8a3);transform:scaleX(0);transform-origin:left}
.menu-nav{transition:box-shadow .35s ease,background .35s ease;border-top:1px solid transparent}
.menu-nav.nav-elevada{box-shadow:0 9px 28px #0005;border-top-color:#ddb5742b;backdrop-filter:blur(16px)}
.section-header{position:relative}
.section-header:after{content:'';position:absolute;left:3px;bottom:-1px;width:60px;height:2px;background:linear-gradient(90deg,#ddb574,transparent);border-radius:2px}
.contact-action,.dish-card{transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}
@media(hover:hover){.dish-card:hover{transform:translateY(-5px);border-color:#ddb57480;box-shadow:0 14px 32px #0004}.contact-action:hover{border-color:#ddb57470}}
@media(max-width:600px){
  .hero-content{padding:6px 8px}
  .hero h1{font-size:clamp(31px,8.7vw,48px);line-height:.96}
  .hero-location{font-size:7px;letter-spacing:2px;margin-bottom:6px}
  .hero-description{max-width:310px;font-size:10px;line-height:1.3;margin-top:8px}
  .hero-small{font-size:7px;letter-spacing:1px;margin-top:6px}
  .hero-arrow{font-size:15px;margin-top:6px}
  .portada-pausa{font-size:10px;padding:6px 10px;bottom:9px;right:9px}
  .contact-panel{margin-top:12px}
}
@media(prefers-reduced-motion:reduce){
  .portada-video,.hero-content,.menu-nav,.contact-action,.dish-card{transition:none}
  .lectura-progreso{display:none}
}
