/* ============================================================
   REFINAMIENTO — de «vitrina» a restaurante elegante
   Misma tipografía y misma paleta. Cambia el lenguaje de formas:
   líneas finas, sin sombras duras, más aire, fotos limpias.
   Se carga después de rediseno.css.
   ============================================================ */
:root {
  --borde: 1px solid var(--tinta);
  --sombra: 0 0 0 transparent;
  --sombra-s: 0 0 0 transparent;
  --linea: 1px solid rgba(26,22,19,.28);
}
body { font-size: 17px; line-height: 1.65; }

/* títulos: mismo tipo, más sereno */
h1, h2, h3, .sub-tit, .gc-v, .grupo-t, .det-nombre, .cat2-t, .paso .hora { font-weight: 700; letter-spacing: -.025em; }
h1 { font-weight: 600; letter-spacing: -.04em; }
h2 { font-size: clamp(32px, 4.2vw, 56px); line-height: 1.05; font-weight: 600; }

/* rótulos: texto fino con una línea, sin cajitas de color */
.etq, .s-etq, .sub, .nov span {
  background: none !important; border: 0; padding: 0 0 0 38px; position: relative; font-size: 11.5px; letter-spacing: .26em; font-weight: 600; margin-bottom: 20px;
}
.etq::before, .s-etq::before, .nov span::before { content: ""; position: absolute; left: 0; top: 50%; width: 28px; height: 1px; background: currentColor; }
.s-etq { margin-bottom: 10px; }
.panel-donde .etq { color: var(--rosa); }
.pie h4 { background: none; padding: 0; margin-bottom: 20px; color: var(--rosa); }
.encabezado { margin-bottom: 52px; }

/* botones: sobrios, sin relieve */
.boton, .menu .cta, .ver-todas {
  border-radius: 0; box-shadow: none !important; font-weight: 600; font-size: 12.5px; letter-spacing: .18em; padding: 16px 30px; transform: none !important;
  transition: background .25s, color .25s, border-color .25s;
}
.boton:hover, .menu .cta:hover { background: var(--rosa); color: var(--tinta); }
.boton.claro { background: transparent; color: var(--tinta); border: var(--borde); }
.boton.claro:hover { background: var(--tinta); color: var(--crema); }

/* navegación: crema, línea fina, delicada */
.barra { background: rgba(255,246,229,.96); backdrop-filter: blur(8px); border-bottom: var(--linea); }
.barra-in { height: 76px; }
.menu a { font-weight: 500; font-size: 12px; letter-spacing: .2em; padding: 28px 15px; }
.menu a:not(.cta):hover, .menu a[aria-current="page"]:not(.cta) { background: none; color: var(--tinta); }
.menu a:not(.cta)::after { content: ""; position: absolute; left: 15px; right: 15px; bottom: 22px; height: 1px; background: var(--tinta); transform: scaleX(0); transform-origin: left; transition: transform .3s; }
.menu a:not(.cta):hover::after, .menu a[aria-current="page"]:not(.cta)::after { transform: scaleX(1); }
.menu .cta { margin-left: 18px; background: var(--tinta); color: var(--crema); padding: 13px 22px; }
.menu .cta:hover { background: var(--rosa); color: var(--tinta); }
.sub-lista { box-shadow: 0 18px 40px -20px rgba(26,22,19,.35); border: var(--linea); }
.sub-lista a { border-bottom: var(--linea); padding: 14px 20px; }
.sub-lista a:hover { background: var(--rosa-claro) !important; color: var(--tinta) !important; }
.progreso { top: 76px; height: 2px; background: var(--tinta); border: 0; }
main > .seccion:first-child { padding-top: calc(76px + 64px); }

/* portada: franja de texto serena, datos como líneas */
@media (min-width: 861px) {
  section.hero-local { padding-top: 76px; }
  section.hero-local .portada { border-top: var(--linea); padding: 34px max(28px, 5vw) 30px; }
  section.hero-local .portada > .etq { background: none; margin-bottom: 14px; }
  section.hero-local .portada h1 { font-weight: 600; letter-spacing: -.045em; }
  section.hero-local .datos-rapidos { gap: 0; padding-left: 60px; }
  section.hero-local .dato, section.hero-local .dato:nth-child(2), section.hero-local .dato:nth-child(3) {
    background: transparent; color: var(--tinta); border: 0; border-top: var(--linea); box-shadow: none; padding: 16px 0; font-size: 20px; font-weight: 600;
  }
  section.hero-local .dato:last-child { border-bottom: var(--linea); }
  section.hero-local .dato b { color: var(--tinta); opacity: .6; font-weight: 600; letter-spacing: .24em; }
  section.hero-local .boton:not(.claro) { background: var(--tinta); border: var(--borde); }
  section.hero-local .boton.claro { background: transparent; border: var(--borde); }
  section.hero-local .boton.claro:hover { background: var(--tinta); color: var(--crema); }
}

/* secciones: sin bordes gruesos, más aire */
.seccion { border-top: 0; padding: clamp(72px, 10vw, 140px) max(24px, 6vw); }
#destacados { background: var(--rosa-claro); }

/* tarjetas: planas, línea fina, sin sombra */
.tarjeta, .seccion:not(#nosotros) > .ancho .tarjeta { border: var(--linea) !important; box-shadow: none !important; background: var(--crema); }
.banda { background: transparent !important; color: var(--tinta) !important; border-bottom: var(--linea); font-weight: 600; letter-spacing: .26em; padding: 18px 30px; font-size: 11.5px; }
.cuerpo { padding: 32px 30px 36px; }
.lista li { border-bottom: 1px solid rgba(26,22,19,.18); }
.chip { border: 1px solid var(--tinta); background: transparent; }
.canales { gap: 0; }
.canales div { background: transparent; border: 0; border-top: var(--linea); border-radius: 0; box-shadow: none; padding: 18px 0; }
.canales div:last-child { border-bottom: var(--linea); }

/* carrusel: fotos grandes y limpias */
.pistas { gap: 28px; padding: 4px 0 34px; }
.slide { border: 0; box-shadow: none; background: transparent; transition: none; }
.slide:hover { transform: none; box-shadow: none; }
.slide img { border: 0; aspect-ratio: 4 / 4.6; transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.slide { overflow: hidden; }
.slide:hover img { transform: scale(1.03); }
.s-txt { padding: 20px 0 0; }
.s-txt h3 { font-size: 26px; font-weight: 600; }
.s-txt p { color: var(--tinta); opacity: .8; }
.s-link { border-top: 0; padding-top: 14px; margin-top: auto; font-weight: 600; letter-spacing: .2em; font-size: 11.5px; text-transform: uppercase; }
.car-dots i { width: 6px; height: 6px; border: 0; border-radius: 50%; background: rgba(26,22,19,.3); }
.car-dots i.on { width: 6px; background: var(--tinta); transform: scale(1.4); }
.car-flechas button { border: var(--borde); background: transparent; box-shadow: none !important; border-radius: 50%; width: 46px; height: 46px; }
.car-flechas button:hover { background: var(--tinta); color: var(--crema); transform: none; }

/* galería: grilla limpia, sin giros */
.galeria { gap: 16px; padding: 0; grid-auto-rows: 240px; }
.galeria img, .galeria img.g1, .galeria img.g2, .galeria img.g3, .galeria img.g4, .galeria img.g5, .galeria img.g6, .galeria img.g7 { border: 0; box-shadow: none; transform: none; border-radius: 0; }
.galeria img:hover { transform: none; }

/* teaser de la carta */
.tile img { border: 0; box-shadow: none; transition: opacity .4s; }
.tile:hover img { transform: none; box-shadow: none; opacity: .88; }
.tile span { font-weight: 600; letter-spacing: .16em; font-size: 11px; }

/* nosotros */
.nos > img { border: 0; box-shadow: none; }

/* dónde estamos */
.pd-chips span, .pd-chips a { background: transparent; color: var(--crema); border: 1px solid rgba(255,246,229,.5); font-weight: 500; letter-spacing: .04em; }
.pd-chips a:hover { background: var(--rosa); color: var(--tinta); border-color: var(--rosa); }
.panel-donde .boton { background: var(--crema); color: var(--tinta); border: 1px solid var(--crema); box-shadow: none !important; }
.panel-donde .boton:hover { background: var(--rosa); border-color: var(--rosa); }
.panel-donde .boton.claro { background: transparent; color: var(--crema); border: 1px solid var(--crema); }
.panel-donde .boton.claro:hover { background: var(--crema); color: var(--tinta); }
.pd-campana .pd-mapa { border: 0; box-shadow: none; border-radius: 0; }
.marcador-logo { border: 0; }
.pd-dir { font-weight: 500; }

/* pie */
.pie { border-top: 0; }
.legal { border-top: 1px solid rgba(255,246,229,.3); }

/* WhatsApp y burbujas */
.wsp { border: 0; border-radius: 50%; box-shadow: 0 10px 24px -8px rgba(26,22,19,.4) !important; }
.wsp:hover { transform: scale(1.06); box-shadow: 0 14px 28px -8px rgba(26,22,19,.45) !important; }
.wsp svg path { fill: #fff; }
.burbuja, .globo-movil, .parada .globo { border: var(--linea); box-shadow: none; }

/* carta */
.mb { border-bottom: 0; }
.mb-t { font-weight: 600; text-transform: none; color: var(--crema); letter-spacing: -.03em !important; }
.carta2 .rail-cats, .carta2 .cat2 { border: 0; box-shadow: none; margin: 0 auto; width: min(var(--max), calc(100% - 48px)); }
.carta2 .rail-cats { background: transparent; padding: 40px 0 30px; border-bottom: var(--linea); }
.carta2 .cat2 { background: transparent; padding: 56px 0 36px; border-bottom: var(--linea); }
.cat-thumb { border: 0; box-shadow: none; border-radius: 50%; }
.cat-item:hover .cat-thumb { transform: none; box-shadow: 0 0 0 3px var(--crema), 0 0 0 4px var(--tinta); }
.cat-item.on .cat-thumb { background: none; box-shadow: 0 0 0 3px var(--crema), 0 0 0 4.5px var(--tinta); }
.cat-label { font-weight: 600; letter-spacing: .12em; font-size: 10.5px; }
.sec-t { font-weight: 600; letter-spacing: .26em; font-size: 11.5px; }
.rail-arrow { border: var(--borde); border-radius: 50%; box-shadow: none; background: var(--crema); }
.cat2-cab { background: transparent !important; border-bottom: 0; padding-top: 0; }
.cat2-t { font-weight: 600; font-size: clamp(30px, 3.4vw, 46px); text-transform: none; letter-spacing: -.03em; }
.cat2-cab::after { content: ""; display: block; width: 56px; height: 4px; margin-top: 14px; background: var(--cat, var(--rosa)); }
.cat2-nota { opacity: .8; }
.grupo2-t, .grupo-t { font-weight: 600; letter-spacing: .22em; font-size: 11.5px; }
.prod-card { border: 0; box-shadow: none; background: transparent; transition: none; }
.prod-card:hover, .prod-card:focus-visible { transform: none; box-shadow: none; }
.prod-thumb { border: 0; }
.prod-thumb img { transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.prod-body { padding: 14px 0 6px; gap: 6px; }
.prod-nombre { font-weight: 600; font-size: 14.5px; }
.prod-precio { background: none; border: 0; padding: 0; font-weight: 500; font-size: 15px; letter-spacing: .02em; }
.ver-todas { box-shadow: none; padding: 9px 16px; font-size: 11px; }
.det-caja { border: 0; box-shadow: 0 30px 80px -20px rgba(26,22,19,.5); }
.det-volver { border: var(--borde); background: transparent; border-radius: 50%; }
.det-foto { border: 0; }
.carta-aviso { border: var(--linea); background: var(--rosa-claro); }
.buscar { border: var(--borde); box-shadow: none; }
.chips-nav::before { border-bottom: var(--linea); }
.chips-in { border: 0; }
.chips-in a { font-weight: 600; letter-spacing: .14em; font-size: 11.5px; }
.chips-in a.on { background: none; color: var(--tinta); box-shadow: inset 0 -2px 0 var(--tinta); }
.sin-res { border: var(--linea); box-shadow: none; }

/* regalos y demás páginas */
.rg-foto { border: 0; box-shadow: none; }
.rg-sello { border: 0; background: var(--crema); left: 20px; bottom: 20px; font-weight: 600; letter-spacing: .2em; }
.gc { border: 0; box-shadow: 0 24px 40px -26px rgba(26,22,19,.55); }
.gc:hover { transform: translateY(-4px); }
.bx { border: 0; box-shadow: none; background: transparent; }
.bx img { border: 0; }
.bx-cuerpo { padding: 18px 0 8px; }
.bx-precio { font-weight: 500; font-size: 20px; }
.servicio, .paso { border: 0; border-top: var(--linea); box-shadow: none; background: transparent; padding-left: 0; padding-right: 0; }
.nov { border: 0; box-shadow: none; background: transparent; padding: 0; }
.nov:hover { transform: none; box-shadow: none; }
.nov img { border: 0; }
.nov div { padding-left: 0; padding-right: 0; }
.video { border: 0; box-shadow: none; }
.video .play { border: 0; border-radius: 50%; background: var(--crema); }
.loc-foto { border: 0; }
.loc-aviso { background: none; border: 1px solid var(--tinta); }
.subnav a { border: var(--linea); box-shadow: none; background: transparent; font-weight: 600; letter-spacing: .16em; font-size: 11.5px; }
.subnav a:hover, .subnav a:focus-visible { background: var(--tinta); color: var(--crema); }

@media (max-width: 860px) {
  .barra-in { height: 62px; }
  .progreso { top: 62px; }
  .menu { top: 62px; border: 0; border-top: var(--linea); border-bottom: var(--linea); }
  .menu a { border-bottom: var(--linea); letter-spacing: .16em; }
  .menu a::after { display: none; }
  .menu .cta { border: 0; }
  main > .seccion:first-child { padding-top: calc(62px + 44px); }
  .seccion { padding: 64px 22px; }
  .hero-local .etq { background: none; color: var(--crema); }
  .hero-local .boton:not(.claro) { background: var(--crema); color: var(--tinta); border: 0; }
  .hero-local .boton.claro { background: transparent; color: var(--crema); border: 1px solid var(--crema); }
  .carta2 .rail-cats, .carta2 .cat2 { margin: 0 auto; width: calc(100% - 36px); }
  .pistas { gap: 16px; }
}

/* sin la línea de progreso (quedaba sola al esconderse el menú) */
.progreso { display: none !important; }

/* portada: foto del frente de Ayulem, enfocada en el cartel con el nombre */
.hero-pc { display: none; }
@media (min-width: 861px) {
  .hero-fondo { display: none; }
  .hero-pc { display: block; position: absolute; z-index: 0; left: 0; right: 0; top: 76px; bottom: 300px; width: 100%; height: calc(100% - 376px); object-fit: cover; object-position: 50% 0%; }
}

/* menú transparente: deja ver la foto y las secciones por detrás */
.barra { background: transparent !important; border-bottom: 0 !important; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
@media (min-width: 861px) {
  /* la foto de la portada sube hasta detrás del menú; el cartel queda justo debajo */
  .hero-pc { top: 50px; bottom: auto; height: auto; min-height: 0; object-fit: initial; }
}
@media (max-width: 860px) { .menu { background: var(--crema); } }

/* franja detrás del menú: la misma foto reflejada, así se une sin corte con la portada */
@media (min-width: 861px) {
  section.hero-local::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 50px; z-index: 0; background: url('img/hero/portada-ayulem.jpg') 0 0 / 100% auto no-repeat; transform: scaleY(-1); }
}

/* menú 100 % transparente: sin desenfoque */
.barra { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }

/* letras del menú legibles sobre cualquier fondo: halo claro, sin tocar el fondo */
.menu a:not(.cta) { font-weight: 700; color: var(--tinta); text-shadow: 0 0 3px var(--crema), 0 0 7px var(--crema), 0 0 12px var(--crema); }
.logo img { filter: brightness(0) drop-shadow(0 0 3px var(--crema)) drop-shadow(0 0 7px var(--crema)); }

/* vuelve el menú con fondo (el transparente no se leía) */
.barra { background: rgba(255,246,229,.96) !important; border-bottom: var(--linea) !important; }
.menu a:not(.cta) { font-weight: 500; text-shadow: none; }
.logo img { filter: brightness(0); }
@media (min-width: 861px) {
  .hero-pc { top: 76px; bottom: 300px; height: calc(100% - 376px); object-fit: cover; object-position: 50% 0%; }
  section.hero-local::after { display: none; }
}

/* ============================================================
   CARTA: cada sección en su tarjeta, con el encabezado de su color
   (el estilo que ya tenía la carta de Ayulem)
   ============================================================ */
.carta2 .rail-cats, .carta2 .cat2 {
  background: #FFFBF3; border: 1px solid rgba(26,22,19,.14); border-radius: 28px; overflow: hidden;
  box-shadow: 0 18px 50px -28px rgba(26,22,19,.4); width: min(var(--max), calc(100% - 40px)); margin: 28px auto;
}
.carta2 .rail-cats { padding: 26px 0 18px; border-bottom: 1px solid rgba(26,22,19,.14); }
.carta2 .cat2 { padding: 0 0 26px; border-bottom: 1px solid rgba(26,22,19,.14); }
.cat2-cab { background: var(--cat, var(--rosa)) !important; padding: 26px var(--pad) 20px; margin-bottom: 24px; border-radius: 0; }
.cat2-cab::after { display: none; }
.cat2-t { font-size: clamp(24px, 2.6vw, 36px); }
.cat2-nota { opacity: .85; color: var(--tinta); }
.prod-card { background: #fff; border: 1px solid rgba(26,22,19,.12); border-radius: 18px; overflow: hidden; }
.prod-body { padding: 12px 14px 14px; }
.prod-thumb { background: var(--rosa-claro); }
.grupo2-t { margin-top: 20px; }
@media (max-width: 860px) { .carta2 .rail-cats, .carta2 .cat2 { width: calc(100% - 24px); margin: 18px auto; border-radius: 22px; } }