/* Mantra Rooftop · Café — hoja de estilos única */
@font-face{font-family:'Malvery';src:url('../assets/fuentes/Malvery-Regular.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Malvery';src:url('../assets/fuentes/Malvery-Italic.otf') format('opentype');font-weight:400;font-style:italic;font-display:swap}

:root{
  /* Color */
  --negro:#140c06; --noche-2:#26170c; --ambar:#b6803e; --ambar-osc:#8a5a24;
  --arena:#f5dabb; --arena-suave:#faecd9; --papel:#eccba3; --arcilla:#a17850;
  --tinta-cafe:#3a2314; --tinta-2:#6e4f30;
  --linea-oscura:rgba(182,128,62,.55); --linea-clara:var(--arcilla);
  --tx-oscuro:rgba(182,128,62,.16); --tx-claro:rgba(138,90,36,.13);
  /* Tipografía */
  --fuente:'Malvery',serif;
  --t-h1:clamp(26px,3.8vw,46px); --t-h2:clamp(24px,3.2vw,40px); --t-sub:20px; --t-cuerpo:16px; --t-chico:14px; --t-boton:13px;
  --ls-titulo:.14em; --ls-sub:.06em; --ls-boton:.16em;
  /* Espaciado */
  --margen:22px; --seccion:72px; --max:1200px; --col:680px; --gap-split:32px 56px;
  --radio:6px; --radio-foto:4px; --boton-h:52px; --header-h:60px; --franja-h:34px;
  /* Texturas de grano */
  --grano-noche:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .96  0 0 0 0 .85  0 0 0 0 .73  0 0 0 .07 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  --grano-dia:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .4  0 0 0 0 .25  0 0 0 0 .1  0 0 0 .09 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--fuente);font-synthesis:none;font-size:var(--t-cuerpo);line-height:1.6;background:var(--negro);color:var(--arena);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--acc,var(--ambar))} a:hover{color:var(--fg,var(--arena))}
h1,h2,h3{font-weight:400;margin:0;text-transform:uppercase;letter-spacing:var(--ls-titulo);line-height:1.2}
p{margin:0;text-wrap:pretty}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* Temas de sección */
.s-negro,.s-noche,.s-arena,.s-papel{background-color:var(--bg);color:var(--fg)}
.s-negro{--bg:var(--negro);--fg:var(--arena);--acc:var(--ambar);--linea:var(--linea-oscura);--tx:var(--tx-oscuro);--suave:rgba(245,218,187,.78);background-image:var(--grano-noche)}
.s-noche{--bg:var(--noche-2);--fg:var(--arena);--acc:var(--ambar);--linea:var(--linea-oscura);--tx:var(--tx-oscuro);--suave:rgba(245,218,187,.78);background-image:var(--grano-noche)}
.s-arena{--bg:var(--arena);--fg:var(--tinta-cafe);--acc:var(--ambar-osc);--linea:var(--linea-clara);--tx:var(--tx-claro);--suave:var(--tinta-2);background-image:var(--grano-dia)}
.s-papel{--bg:var(--papel);--fg:var(--tinta-cafe);--acc:var(--ambar-osc);--linea:var(--linea-clara);--tx:var(--tx-claro);--suave:var(--tinta-2);background-image:var(--grano-dia)}

/* Texturas de marca (máscara tintada) */
.tx{position:relative;isolation:isolate}
.tx::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-color:var(--tx);-webkit-mask:var(--tx-img) center/cover no-repeat;mask:var(--tx-img) center/cover no-repeat}
.tx-palmas{--tx-img:url(../assets/texturas/palmas.webp)}
.tx-tronco{--tx-img:url(../assets/texturas/tronco.webp)}
.tx.continua::before{bottom:calc(-1 * var(--pie-h,0px))}
.continua{overflow:visible}

/* Secciones */
.seccion{padding:var(--seccion) var(--margen)}
.seccion--sigue{padding-top:48px}
.seccion--sin-pie{padding-bottom:0}
.col{max-width:var(--col);margin:0 auto;display:flex;flex-direction:column;gap:16px}
.col--centro{align-items:center;text-align:center}
.h2{font-size:var(--t-h2);color:var(--acc)}
.s-arena .h2,.s-papel .h2{color:var(--fg)}
.sub{font-style:italic;text-transform:uppercase;letter-spacing:var(--ls-sub);font-size:var(--t-sub);line-height:1.4;color:var(--acc)}
.nota{font-size:var(--t-chico);line-height:1.5;padding-top:12px;border-top:1px solid var(--linea)}

/* Foto + texto */
.split{max-width:var(--max);margin:0 auto;display:flex;flex-wrap:wrap;gap:var(--gap-split);align-items:center}
.split--rev{flex-direction:row-reverse}
.split__foto{position:relative;flex:1 1 320px;max-width:560px;aspect-ratio:4/5;border-radius:var(--radio-foto);overflow:hidden}
.split__foto img,.foto-cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.split__texto{flex:1 1 320px;max-width:var(--col);display:flex;flex-direction:column;gap:16px}

/* Ícono junto al título */
.titulo-ico{display:flex;align-items:center;gap:20px}
.titulo-ico__textos{display:flex;flex-direction:column;gap:8px;min-width:0}
.ico{flex:none;width:var(--w);height:var(--h);background-color:var(--acc);-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}

/* Botones */
.botones{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.btn{box-sizing:border-box;flex:1 1 150px;min-height:var(--boton-h);padding:10px 14px;display:inline-flex;align-items:center;justify-content:center;text-align:center;line-height:1.3;border-radius:var(--radio);font-family:var(--fuente);text-transform:uppercase;letter-spacing:var(--ls-boton);font-size:var(--t-boton);text-decoration:none;cursor:pointer;border:1px solid transparent;background:none;color:inherit}
.btn--pri{background:var(--ambar);color:var(--negro)}
.s-arena .btn--pri,.s-papel .btn--pri{color:var(--tinta-cafe)}
.btn--sec{border-color:var(--ambar);color:var(--fg)}
.s-arena .btn--sec,.s-papel .btn--sec{border-color:var(--ambar-osc)}
.btn:hover{filter:brightness(1.06);color:inherit}
.btn--ancho{flex-basis:100%}
.btn--solo{flex:none;width:100%;max-width:360px}
.btn--centro{align-self:center;min-width:240px;max-width:320px}

/* Portadas */
.portada{position:relative;height:clamp(640px,88vh,940px);overflow:hidden;background:var(--negro);color:var(--arena)}
.portada>img,.portada>picture>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.portada__velo{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 80% 38% at 50% 48%,rgba(10,6,3,.62) 0%,rgba(10,6,3,.3) 55%,rgba(10,6,3,0) 100%),radial-gradient(ellipse 130% 85% at 50% 45%,rgba(10,6,3,0) 55%,rgba(10,6,3,.3) 100%),linear-gradient(180deg,rgba(10,6,3,.6) 0%,rgba(10,6,3,.15) 16%,rgba(10,6,3,.12) 50%,rgba(10,6,3,.22) 100%)}
.portada--halo .portada__velo{background:linear-gradient(180deg,rgba(20,12,6,.4),rgba(20,12,6,0) 14%),radial-gradient(ellipse 75% 33% at 50% 57%,rgba(29,17,8,.8) 0%,rgba(29,17,8,.58) 40%,rgba(29,17,8,0) 100%)}
.portada__contenido{position:absolute;inset:0;padding:calc(var(--header-h) + 8px) var(--margen) 72px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.portada__mandala{width:64px;margin-bottom:18px}
.portada h1{font-size:var(--t-h1);letter-spacing:.06em;line-height:1.15;max-width:560px;color:var(--ambar);text-wrap:balance;text-shadow:0 1px 18px rgba(10,6,3,.6)}
.portada .sub{color:var(--arena);font-size:clamp(15px,1.6vw,18px);margin-top:14px;text-shadow:0 1px 2px rgba(20,12,6,.55)}
.portada .botones{width:100%;max-width:360px;margin-top:22px}
.portada .btn--sec{border-color:var(--ambar);color:var(--arena)}
.portada--halo .btn--pri{color:var(--tinta-cafe)}
.portada--halo .btn--sec{border-color:var(--arena);background:rgba(20,12,6,.18)}
.portada__menus{display:flex;flex-wrap:wrap;gap:10px;width:100%;max-width:440px;margin-top:10px}
.portada__menus[hidden]{display:none}

/* Eventos (foto a sangre) */
.foto-sangre{position:relative;min-height:clamp(600px,82vh,860px);display:flex;align-items:flex-end;overflow:hidden}
.foto-sangre::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,12,6,0) 30%,rgba(20,12,6,.88) 72%,var(--negro) 100%)}
.foto-sangre>.col{position:relative;z-index:1;width:100%;padding:0 var(--margen) var(--seccion)}

/* Carruseles */
.carrusel{display:flex;gap:12px;overflow-x:auto;padding:36px var(--margen) 0;scroll-snap-type:x mandatory;scrollbar-width:none;max-width:var(--max);margin:0 auto;list-style:none}
.carrusel li{position:relative;flex:0 0 min(78%,320px);aspect-ratio:4/5;scroll-snap-align:start;border-radius:var(--radio-foto);overflow:hidden}
.carrusel--doble{display:grid;grid-auto-flow:column;grid-template-rows:auto auto;grid-auto-columns:min(70%,300px);padding:28px var(--margen)}
.carrusel--doble li{flex:none}

/* Preguntas frecuentes */
.faq{border-top:1px solid var(--linea)}
.faq details{border-bottom:1px solid var(--linea)}
.faq summary{list-style:none;cursor:pointer;min-height:56px;padding:14px 0;display:flex;justify-content:space-between;align-items:center;gap:16px;line-height:1.4}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:22px;line-height:1;color:var(--acc)}
.faq details[open] summary::after{content:"−"}
.faq details p{padding:0 0 18px}

/* Horario */
.horario{list-style:none;margin:0;padding:0}
.horario li{display:flex;justify-content:space-between;gap:16px;padding:12px 12px 12px 14px;border-bottom:1px solid var(--linea);border-left:2px solid transparent;font-size:15px}
.horario li.hoy{border-left-color:var(--ambar);background:rgba(182,128,62,.14)}
.horario li span:last-child{text-align:right}
.mapa{width:100%;border-radius:2px}

/* Agenda semanal */
.agenda{list-style:none;margin:0;padding:0;border-top:1px solid var(--linea)}
.agenda li{display:flex;flex-wrap:wrap;gap:4px 20px;padding:16px 0;border-bottom:1px solid var(--linea)}
.agenda b{flex:0 0 170px;font-weight:400;text-transform:uppercase;letter-spacing:var(--ls-titulo);font-size:var(--t-chico);color:var(--acc)}
.agenda span{flex:1 1 240px}

/* Franja de domicilios */
.franja-linea{max-width:var(--col);margin:0 auto;padding:32px 0;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea);display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between}
.franja-linea .btn{flex:0 1 240px}

/* Tarjetas */
.cruzada{max-width:var(--max);margin:0 auto;border-radius:var(--radio);overflow:hidden;display:flex;flex-wrap:wrap}
.cruzada__foto{position:relative;flex:1 1 300px;min-height:300px;aspect-ratio:4/5;max-height:560px}
.cruzada__texto{flex:1 1 300px;padding:28px 22px 30px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:14px}
.cruzada__texto h2{font-size:24px}
.tarjetas{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:16px;align-items:stretch;width:100%}
.tarjeta{display:flex;flex-direction:column;border:1px solid var(--borde,var(--ambar));border-radius:var(--radio);overflow:hidden;text-decoration:none}
.tarjeta__foto{position:relative;aspect-ratio:16/9}
.tarjeta__cuerpo{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:22px 20px}
.tarjeta__cuerpo h2{font-size:20px;letter-spacing:.16em;color:var(--acc)}
.tarjeta__cuerpo .btn{margin-top:auto;flex:none;width:100%}
.tarjeta--rooftop{--bg:var(--negro);--fg:var(--arena);--acc:var(--ambar);--borde:var(--ambar);background:var(--negro);color:var(--arena)}
.tarjeta--cafe{--bg:var(--arena-suave);--fg:var(--tinta-cafe);--acc:var(--ambar-osc);--borde:rgba(138,90,36,.45);background:var(--arena-suave);color:var(--tinta-cafe)}
.tarjeta--cafe .btn--pri{color:var(--tinta-cafe)}
.tarjeta--menu .tarjeta__cuerpo{flex-direction:row;justify-content:space-between;text-align:left;align-items:center}
.flecha{flex:none;width:44px;height:44px;border:1px solid var(--acc);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--acc)}

/* Bitácora */
.bitacora{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:28px}
.bitacora article{display:flex;flex-direction:column;gap:10px}
.bitacora figure{margin:0;position:relative;aspect-ratio:4/3;border-radius:var(--radio-foto);overflow:hidden}
.bitacora .meta{font-style:italic;text-transform:uppercase;letter-spacing:var(--ls-sub);font-size:13px;color:var(--suave)}
.bitacora h3{font-size:18px;letter-spacing:.12em;line-height:1.3}

/* Menú */
.menu-cab{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;margin-bottom:28px}
.menu-cab h1{font-size:28px;letter-spacing:.16em;color:var(--acc)}
.menu-cab .sub{font-size:14px;color:var(--suave)}
.categorias{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.categorias a{min-height:var(--boton-h);padding:0 20px;display:flex;align-items:center;justify-content:center;text-align:center;border:1px solid var(--acc);border-radius:var(--radio);background:var(--tarjeta-bg);color:var(--acc);text-decoration:none;text-transform:uppercase;letter-spacing:var(--ls-boton);font-size:14px}
.s-negro{--tarjeta-bg:rgba(182,128,62,.06)} .s-arena,.s-papel{--tarjeta-bg:var(--arena-suave)}
.cat-ico{width:120px;height:96px}
.promo{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:22px 20px;margin-bottom:28px;border:1px solid var(--acc);border-radius:var(--radio);background:var(--tarjeta-bg)}
.promo small{text-transform:uppercase;letter-spacing:.2em;font-size:11px;color:var(--acc)}
.promo strong{font-weight:400;text-transform:uppercase;letter-spacing:.14em;font-size:18px;line-height:1.3}
.platos{list-style:none;margin:0;padding:0;border-top:1px solid var(--linea-menu)}
.s-negro{--linea-menu:rgba(182,128,62,.32)} .s-arena,.s-papel{--linea-menu:rgba(138,90,36,.32)}
.platos li{display:flex;gap:14px;align-items:flex-start;padding:20px 0;border-bottom:1px solid var(--linea-menu)}
.plato__info{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.plato__fila{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.plato__nombre{text-transform:uppercase;letter-spacing:.12em;font-size:15px;line-height:1.35}
.plato__precio{font-size:15px;white-space:nowrap;color:var(--acc)}
.plato__desc{font-size:14px;line-height:1.55;color:var(--suave)}
.plato__foto{flex:none;width:72px;height:72px;border-radius:var(--radio-foto);object-fit:cover}

/* Formularios */
.formulario{max-width:520px;margin:0 auto;display:flex;flex-direction:column;gap:22px}
.formulario label{display:flex;flex-direction:column;gap:6px;text-transform:uppercase;letter-spacing:var(--ls-titulo);font-size:12px}
.formulario input,.formulario textarea{width:100%;min-height:48px;padding:0 2px;border:0;border-bottom:1px solid var(--linea);background:transparent;color:var(--fg);font-family:var(--fuente);font-size:16px;letter-spacing:0;text-transform:none;border-radius:0}
.formulario textarea{min-height:96px;padding:10px 2px;resize:vertical}
.formulario input:focus,.formulario textarea:focus{outline:none;border-bottom-color:var(--acc)}
.formulario .btn{flex:none;width:100%;margin-top:8px}

/* Encabezado */
.site-header{position:sticky;top:0;z-index:30;height:var(--header-h);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 10px;background:var(--head-bg);color:var(--head-fg);transition:background .3s ease}
.con-portada .site-header{margin-bottom:calc(var(--header-h) * -1)}
.con-portada .site-header:not(.is-scrolled){background:transparent}
.site-header__izq{display:flex;align-items:center;gap:2px}
.site-header__logo{justify-self:center}
.site-header__logo img{height:42px;width:auto}
.site-header__idioma{justify-self:end;padding-right:6px;font-size:13px;letter-spacing:.06em}
.icon-btn{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:none;border:0;color:inherit;cursor:pointer;padding:0}
.hamburguesa{flex-direction:column;gap:6px}
.hamburguesa svg{display:block;flex:none}
.volver{display:flex;align-items:center;gap:6px;height:44px;padding:0 6px;color:inherit;text-decoration:none;font-size:13px}
body.tema-noche{--head-bg:var(--negro);--head-fg:var(--ambar);background-image:var(--grano-noche)}
body.tema-dia{--head-bg:var(--arena);--head-fg:var(--ambar-osc);background:var(--arena) var(--grano-dia)}
body.tema-papel{--head-bg:var(--papel);--head-fg:var(--ambar-osc);background:var(--papel) var(--grano-dia)}

/* Franja de avisos */
.franja{position:sticky;top:var(--header-h);z-index:29;height:var(--franja-h);display:flex;align-items:center;overflow:hidden;background:var(--noche-2);color:var(--ambar)}
.franja--cafe{background:var(--papel);color:var(--tinta-2)}
.con-portada .franja{margin-bottom:calc(var(--franja-h) * -1)}
.franja[hidden]{display:none}
.franja__pista{flex:1;overflow:hidden;min-width:0}
.franja__texto{display:flex;width:max-content;white-space:nowrap;animation:franja 32s linear infinite;font-style:italic;text-transform:uppercase;letter-spacing:.08em;font-size:13px;padding-left:16px}
.franja__texto span{display:inline-flex;align-items:center;gap:40px;padding-right:40px}
.franja__texto span::after{content:"";width:4px;height:4px;border-radius:2px;background:currentColor;opacity:.7}
.franja .icon-btn{width:34px;height:34px;flex:none;background:inherit}
@keyframes franja{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.franja__texto{animation:none}}

/* Menú desplegable */
.panel{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;overflow-y:auto;background-color:var(--negro);background-image:var(--grano-noche);color:var(--arena)}
.panel[hidden]{display:none}
.panel:not([hidden]){animation:aparecer .2s ease}
.panel__top{height:var(--header-h);flex:none;display:flex;justify-content:space-between;align-items:center;padding:0 10px 0 16px}
.panel__top img{height:22px;width:auto}
.panel nav{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px 28px;max-width:420px;width:100%;margin:0 auto}
.panel nav a{width:100%;min-height:56px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid rgba(182,128,62,.5);text-transform:uppercase;letter-spacing:.2em;font-size:16px;color:var(--arena);text-decoration:none}
.panel__pie{flex:none;padding:16px 28px 28px;max-width:420px;width:100%;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:16px}
.panel__pie .botones{width:100%;margin:0}
@keyframes aparecer{from{opacity:0}to{opacity:1}}

/* Ventana de avisos */
.aviso{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;justify-content:flex-end}
.aviso[hidden]{display:none}
.aviso__fondo{position:absolute;inset:0;background:rgba(20,12,6,.62)}
.aviso__hoja{position:relative;width:100%;max-width:520px;margin:0 auto;max-height:70vh;overflow-y:auto;background:var(--arena);color:var(--negro);border-radius:20px 20px 0 0;padding:10px 20px 24px;display:flex;flex-direction:column;gap:12px;animation:subir .35s cubic-bezier(.2,.8,.2,1)}
.aviso__asa{align-self:center;width:60px;height:16px;display:flex;align-items:center;justify-content:center;background:none;border:0;cursor:pointer}
.aviso__asa span{width:40px;height:4px;border-radius:2px;background:var(--arcilla)}
.aviso__hoja img{height:120px;width:100%;object-fit:cover;border-radius:10px}
.aviso__hoja h2{font-size:20px}
.aviso__hoja .btn{background:var(--negro);color:var(--arena);flex:none}
@keyframes subir{from{transform:translateY(100%)}to{transform:translateY(0)}}

/* Pie */
.site-footer{position:relative;z-index:1;padding:var(--seccion) var(--margen) 28px}
.site-footer--transparente{background:transparent!important;background-image:none!important}
.site-footer__in{max-width:var(--max);margin:0 auto;display:flex;flex-direction:column;align-items:center;text-align:center;gap:24px}
.site-footer__logo{width:180px}
.site-footer__horarios{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 20px;font-size:12.5px;line-height:1.45;width:100%;max-width:480px}
.site-footer__horarios div{display:flex;flex-direction:column;gap:3px}
.site-footer__horarios strong{font-weight:400;text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:var(--acc)}
.site-footer__raya{width:40px;height:1px;background:var(--acc)}
.site-footer address{font-style:normal;text-transform:uppercase;letter-spacing:.16em;font-size:10px;line-height:1.6;opacity:.85}
.site-footer__marca{text-transform:uppercase;letter-spacing:.26em;font-size:8px;margin-top:-12px;padding-left:.26em;color:var(--acc)}
.redes{display:flex;gap:8px;list-style:none;margin:0;padding:0}
.redes a{width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:inherit}
.redes svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linejoin:round;stroke-linecap:round}

/* Escritorio */
@media (min-width:900px){
  :root{--margen:40px}
}

/* Anclas (#brunch, #golden-hour...): la cabecera y la franja no tapan el titulo */
[id]{scroll-margin-top:calc(var(--header-h) + var(--franja-h) + 12px)}

/* Las imagenes llevan width/height para reservar su espacio al cargar; el alto
   real sale de la proporcion (las fotos de portada y tarjetas fijan el suyo) */
img{height:auto}

/* Modales (SweetAlert2) con el sistema visual de la casa */
.swal2-container.swal2-backdrop-show{background:rgba(20,12,6,.72)}
.mantra-swal{background:var(--negro) var(--grano-noche)!important;color:var(--arena)!important;border:1px solid var(--linea-oscura);border-radius:var(--radio)!important;font-family:var(--fuente)!important;padding:34px 26px 28px!important;width:min(92vw,480px)!important}
.mantra-swal .mantra-swal__titulo{font-family:var(--fuente);font-weight:400;text-transform:uppercase;letter-spacing:var(--ls-titulo);font-size:22px;line-height:1.25;color:var(--ambar);padding:0 8px}
.mantra-swal .mantra-swal__texto{font-size:15px;line-height:1.6;color:rgba(245,218,187,.88);text-align:center;margin-top:14px}
.mantra-swal .mantra-swal__texto p+p{margin-top:12px}
.mantra-swal .swal2-actions{margin-top:22px;width:100%}
.mantra-swal .swal2-actions .btn{flex:none;min-width:220px}
.mantra-swal .mantra-swal__cerrar{color:var(--ambar);font-size:28px}
.mantra-swal .mantra-swal__cerrar:hover{color:var(--arena)}
.mantra-swal .mantra-swal__cerrar:focus{box-shadow:none}
.mantra-swal .btn:focus,.mantra-swal .btn:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(182,128,62,.35)}

/* Fotos ampliables (galerias y platos del menu) */
.carrusel img,.plato__foto{cursor:zoom-in}
.carrusel img:focus-visible,.plato__foto:focus-visible{outline:2px solid var(--ambar);outline-offset:-2px}
.mantra-swal--foto{width:auto!important;max-width:min(94vw,1100px)!important;padding:14px!important;position:relative}
.mantra-swal--foto .mantra-swal__foto{margin:0!important;padding:0!important;overflow:visible}
.foto-modal{margin:0;display:flex;flex-direction:column;align-items:center;gap:12px}
.foto-modal img{display:block;max-width:100%;max-height:78vh;width:auto;height:auto;object-fit:contain;border-radius:var(--radio-foto)}
.foto-modal figcaption{font-style:italic;text-transform:uppercase;letter-spacing:var(--ls-sub);font-size:14px;color:var(--ambar);text-align:center;padding:0 40px}
.foto-modal__nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:1px solid var(--linea-oscura);background:rgba(20,12,6,.72);color:var(--arena);font-size:28px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0 0 4px}
.foto-modal__nav:hover{background:var(--ambar);color:var(--negro)}
.foto-modal__nav--prev{left:22px}
.foto-modal__nav--next{right:22px}
.mantra-swal--foto .mantra-swal__cerrar{position:absolute;top:18px;right:18px;z-index:2;background:rgba(20,12,6,.72);border-radius:50%;width:40px;height:40px}

/* Menu: platos en tarjetas con foto (estructura del menu anterior, estilos de la casa) */
.platos-zona{max-width:var(--max);margin:28px auto 0}
.platos-zona__titulo{font-size:20px;letter-spacing:var(--ls-titulo);color:var(--acc);text-align:center;margin:12px 0 18px}
.platos-zona__nota{text-align:center;font-style:italic;font-size:14px;color:var(--suave);max-width:560px;margin:8px auto 0}
.platos-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:36px}
.plato-card{display:flex;flex-direction:column;background:var(--tarjeta-bg);border:1px solid var(--linea-menu);border-radius:var(--radio);overflow:hidden;cursor:pointer;transition:transform .25s ease,border-color .25s ease}
.plato-card:hover{transform:translateY(-3px);border-color:var(--acc)}
.plato-card:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.plato-card__foto{display:block;width:100%;aspect-ratio:4/3;height:auto;object-fit:cover}
.plato-card__foto--vacia{display:flex;align-items:center;justify-content:center;background:rgba(182,128,62,.08)}
.plato-card__foto--vacia img{width:56px;height:auto;opacity:.35}
.plato-card__cuerpo{flex:1;display:flex;flex-direction:column;gap:6px;padding:12px}
.plato-card__nombre{font-size:13px;letter-spacing:.1em;line-height:1.35;color:var(--acc)}
.plato-card__desc{font-size:12px;line-height:1.5;color:var(--suave);flex:1}
.plato-card__precio{font-size:15px;color:var(--acc);margin-top:auto}
.plato-card__variaciones{margin-top:auto;display:flex;flex-direction:column}
.plato-card__variaciones div{display:flex;justify-content:space-between;gap:8px;padding:4px 0;border-bottom:1px dotted var(--linea-menu);font-size:12px}
.plato-card__variaciones div:last-child{border-bottom:0}
.plato-card__variaciones span:first-child{color:var(--suave)}
.plato-card__variaciones span:last-child{color:var(--acc);white-space:nowrap}
@media (min-width:768px){
  .platos-grid{gap:20px}
  .plato-card__cuerpo{padding:18px 18px 20px;gap:8px}
  .plato-card__nombre{font-size:16px}
  .plato-card__desc{font-size:14px}
  .plato-card__precio{font-size:18px}
  .plato-card__variaciones div{font-size:14px}
}
@media (min-width:1024px){.platos-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}}

/* Detalle del plato (SweetAlert): foto arriba, nombre, descripcion y precio */
.mantra-swal--plato{padding:0!important;overflow:hidden;width:min(94vw,560px)!important}
.mantra-swal--plato .mantra-swal__plato{margin:0!important;padding:0!important;text-align:left}
.plato-modal__foto{display:block;width:100%;max-height:380px;height:auto;object-fit:cover}
.plato-modal__cuerpo{padding:24px 26px 28px;display:flex;flex-direction:column;gap:12px}
.plato-modal__nombre{font-size:22px;letter-spacing:var(--ls-titulo);line-height:1.3;color:var(--ambar)}
.plato-modal__desc{font-size:15px;line-height:1.6;color:rgba(245,218,187,.88)}
.plato-modal__precio{font-size:24px;color:var(--ambar)}
.plato-modal__variaciones div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px dotted var(--linea-oscura);font-size:15px}
.plato-modal__variaciones div:last-child{border-bottom:0}
.plato-modal__variaciones span:last-child{color:var(--ambar);white-space:nowrap}
.mantra-swal--plato .mantra-swal__cerrar{position:absolute;top:12px;right:12px;z-index:2;width:40px;height:40px;border-radius:50%;background:rgba(20,12,6,.72)}
/* Version clara para el Cafe */
.mantra-swal--claro{background:var(--arena) var(--grano-dia)!important;color:var(--tinta-cafe)!important;border-color:var(--linea-clara)}
.mantra-swal--claro .plato-modal__nombre,.mantra-swal--claro .plato-modal__precio,.mantra-swal--claro .plato-modal__variaciones span:last-child{color:var(--ambar-osc)}
.mantra-swal--claro .plato-modal__desc{color:var(--tinta-2)}
.mantra-swal--claro .plato-modal__variaciones div{border-bottom-color:var(--linea-clara)}
.mantra-swal--claro .mantra-swal__cerrar{background:rgba(245,218,187,.85);color:var(--ambar-osc)}

/* Encabezado: al pasar el mouse los enlaces conservan el color del encabezado
   (la regla general a:hover los volvia arena e invisibles sobre el header del Cafe) */
.site-header a:hover,.site-header a:focus-visible{color:inherit;opacity:.72}

/* Ventana de avisos (pop-up): en celular sube desde abajo (diseno original);
   en escritorio la misma hoja aparece centrada en la pantalla */
.aviso{z-index:70}
.aviso:not([hidden]) .aviso__fondo{animation:aparecer .25s ease}
.aviso__hoja{touch-action:pan-y}
.aviso__hoja .btn:hover{color:var(--arena)}
@media (min-width:900px){
  .aviso{justify-content:center;align-items:center;padding:24px}
  .aviso__hoja{border-radius:20px;max-height:86vh;padding:10px 26px 28px;animation:aviso-centro .3s cubic-bezier(.2,.8,.2,1)}
  .aviso__hoja img{height:220px}
}
@keyframes aviso-centro{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.aviso__hoja,.aviso__fondo{animation:none!important}}
.aviso__hoja:focus{outline:none}

/* Cambio de idioma en dos botones (forma del sitio actual, colores de la casa) */
.site-header__idioma{display:flex;align-items:center;gap:6px;padding-right:4px}
.idioma-btn{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:30px;padding:0 10px;border:1px solid currentColor;border-radius:var(--radio);font-size:12px;letter-spacing:.12em;line-height:1;text-decoration:none;color:inherit}
.idioma-btn--activo{background:var(--head-fg);border-color:var(--head-fg);color:var(--head-bg)}
.con-portada .site-header:not(.is-scrolled) .idioma-btn--activo{color:var(--negro)}

/* Paginas largas del menu: la textura queda fija al tamano de la pantalla y el
   contenido corre encima. Con "cover" sobre toda la pagina (3.000+ px de alto) la
   textura de 460 px se agrandaba de mas y se veia estirada. */
.tx--fija::before{position:fixed;inset:0;bottom:0}

/* Credito de desarrollo (regla en todos los sitios de IAsas) */
.site-footer__credito{text-transform:uppercase;letter-spacing:.16em;font-size:10px;line-height:1.6;opacity:.7;margin-top:-6px}
.site-footer__credito a{color:var(--acc);text-decoration:none}
.site-footer__credito a:hover{color:inherit;text-decoration:underline;text-underline-offset:3px}
.site-footer__credito a{text-transform:none;letter-spacing:.08em;font-size:11px}

/* Nuestros menus: en pantallas bajas la foto se encoge, pero el texto de la
   tarjeta nunca se corta (si no alcanza, la pagina hace scroll). La foto lleva
   su propio recorte redondeado para que la tarjeta no esconda su contenido. */
.menu-qr .tarjeta--menu{overflow:visible;min-height:auto}
.menu-qr .tarjeta--menu .tarjeta__foto{border-radius:var(--radio) var(--radio) 0 0;overflow:hidden}
.menu-qr .tarjeta--menu .tarjeta__cuerpo{border-radius:0 0 var(--radio) var(--radio)}
.credito--menu{text-align:center;margin:28px 0 0;color:var(--fg)}

/* Botones centrados dentro de columnas: el flex-basis de 150px del .btn base se
   volvia alto y los dejaba como cajas altas (Abrir en Google Maps, Eventos...) */
.btn--centro{flex:none}

/* Boton compacto: se ajusta al texto y queda centrado, sin bloque ancho/alto */
.btn--compacto{flex:none;align-self:center;width:auto;min-width:0;max-width:none}

/* Formatos de eventos como lista de bullets compactos (en vez de 3 tarjetas) */
.formatos-lista{list-style:none;margin:0;padding:0;max-width:var(--col);display:flex;flex-direction:column;gap:14px}
.formatos-lista li{position:relative;padding-left:22px;line-height:1.6}
.formatos-lista li::before{content:"";position:absolute;left:2px;top:11px;width:7px;height:7px;border-radius:50%;background:var(--acc,var(--ambar))}
.formatos-lista strong{color:var(--acc,var(--ambar));font-weight:400;text-transform:uppercase;letter-spacing:.08em;font-size:15px;margin-right:4px}


/* Casilla de aceptacion en el formulario de reservas */
.formulario .acepto{flex-direction:row;align-items:flex-start;gap:10px;text-transform:none;letter-spacing:0;font-size:13.5px;line-height:1.5;cursor:pointer}
.formulario .acepto input{flex:none;width:18px;min-height:0;height:18px;margin-top:2px;accent-color:var(--ambar);cursor:pointer}
.formulario .acepto span{color:var(--suave)}
.formulario .acepto a{color:var(--acc);text-decoration:underline;text-underline-offset:2px}
.formulario .btn:disabled{opacity:.45;cursor:not-allowed;filter:none}
.site-footer__contacto{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 18px;font-size:12px;letter-spacing:.06em;margin-top:-10px}
.site-footer__contacto a{color:inherit;text-decoration:none;opacity:.85}
.site-footer__contacto a:hover{color:var(--acc);opacity:1}

/* Imagenes del admin con version mobile: el <picture> no altera el maquetado */
picture{display:contents}
