/* HEiM Links — landing (mobile-first, pensada para caber en una pantalla) */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body.hl-body{margin:0;min-height:100vh;min-height:100dvh;font-family:var(--hl-font);color:var(--hl-text);background:var(--hl-fallback);line-height:1.35;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}

/* Densidad: variables de espaciado */
.hl-compact{--g:10px;--pad:12px;--link-h:50px;--link-fs:14.5px}
.hl-comfortable{--g:14px;--pad:16px;--link-h:60px;--link-fs:15px}

/* Fondo */
.hl-bg{position:fixed;inset:0;z-index:0;overflow:hidden;background:var(--hl-fallback)}
.hl-bg-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hl-bg-still{display:none}
.hl-bg-overlay{position:absolute;inset:0;background:var(--hl-overlay)}
@media (prefers-reduced-motion:reduce){
	video.hl-bg-media{display:none}
	.hl-bg-still{display:block}
}

/* Banner de aviso */
.hl-banner{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:8px;padding:8px 8px 8px 14px;background:var(--hl-banner-bg);color:var(--hl-banner-fg);font-size:13.5px;font-weight:700;text-align:center;box-shadow:0 2px 10px rgba(0,0,0,.2)}
.hl-banner-text{flex:1}
.hl-banner-close{flex:none;width:26px;height:26px;border:0;border-radius:50%;background:color-mix(in srgb,currentColor 15%,transparent);color:inherit;font-size:17px;line-height:1;cursor:pointer}

/* Contenedor */
.hl-wrap{position:relative;z-index:1;max-width:560px;margin:0 auto;padding:calc(var(--g) * 1.6) 16px calc(16px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:var(--g)}

/* Cabecera */
.hl-header{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px}
.hl-head-text{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:0}
.hl-logo{width:var(--hl-logo);height:auto;max-height:var(--hl-logo);object-fit:contain}
.hl-logo-circle .hl-logo,.hl-logo-circle_border .hl-logo{height:var(--hl-logo);border-radius:50%;object-fit:cover}
.hl-logo-circle_border .hl-logo{border:3px solid rgba(255,255,255,.9);box-shadow:0 4px 16px rgba(0,0,0,.25)}
.hl-logo-plain .hl-logo{filter:drop-shadow(0 2px 8px rgba(0,0,0,.3))}
.hl-title{margin:0;font-size:21px;font-weight:800;line-height:1.15;letter-spacing:-.01em;text-shadow:0 1px 8px rgba(0,0,0,.35)}
.hl-subtitle{margin:0;font-size:14px;opacity:.92;text-shadow:0 1px 6px rgba(0,0,0,.35)}
.hl-socials{display:flex;flex-wrap:wrap;justify-content:center;gap:2px;margin-top:4px}
.hl-socials a{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;color:var(--hl-text);transition:transform .15s,background .15s}
.hl-socials a:hover,.hl-socials a:focus-visible{background:rgba(255,255,255,.15);transform:translateY(-2px)}
.hl-socials svg{width:24px;height:24px;filter:drop-shadow(0 1px 4px rgba(0,0,0,.35))}

/* Cabecera en horizontal: logo 1/3 · texto 2/3 */
.hl-head-side .hl-header{flex-direction:row;align-items:center;text-align:left;gap:14px}
.hl-head-side .hl-logo-wrap{flex:0 0 32%;display:flex;justify-content:center}
.hl-head-side .hl-logo{width:100%;max-width:var(--hl-logo)}
.hl-head-side .hl-head-text{flex:1;align-items:flex-start}
.hl-head-side .hl-socials{justify-content:flex-start;margin-left:-8px;margin-top:2px}
.hl-head-side .hl-title{font-size:20px}
.hl-head-side .hl-subtitle{font-size:13.5px}

/* Tarjetas */
.hl-card{background:var(--hl-card-bg);color:var(--hl-card-fg);border-radius:var(--hl-radius)}
.hl-shadow .hl-card{box-shadow:0 4px 14px rgba(0,0,0,.18)}
.hl-style-glass .hl-card{-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border:1px solid rgba(255,255,255,.25)}
.hl-style-outline .hl-card{border:2px solid var(--hl-text)}
.hl-style-outline.hl-shadow .hl-card{box-shadow:none}
.hl-muted{opacity:.65;font-weight:400}

/* Enlaces */
.hl-links{display:flex;flex-direction:column;gap:calc(var(--g) * .8)}
.hl-link{position:relative;display:flex;align-items:center;justify-content:center;min-height:var(--link-h);padding:8px 56px;text-decoration:none;text-align:center;font-size:var(--link-fs);font-weight:700;line-height:1.2;transition:transform .15s ease,box-shadow .15s ease}
.hl-link:hover,.hl-link:focus-visible{transform:scale(1.02)}
.hl-link:active{transform:scale(.98)}
.hl-link:focus-visible,.hl-socials a:focus-visible,.hl-btn:focus-visible,.hl-event-sum:focus-visible{outline:3px solid var(--hl-accent);outline-offset:2px}
.hl-link-thumb{position:absolute;left:5px;top:50%;transform:translateY(-50%);width:calc(var(--link-h) - 10px);height:calc(var(--link-h) - 10px);border-radius:calc(var(--hl-radius) * .6);object-fit:cover}
.hl-link-emoji{display:grid;place-items:center;font-size:22px}
.hl-link.is-featured{animation:hl-wobble 5s ease-in-out 1.5s infinite}
@keyframes hl-wobble{
	0%,86%,100%{transform:none}
	88%{transform:rotate(-2deg) scale(1.03)}
	90%{transform:rotate(2deg) scale(1.03)}
	92%{transform:rotate(-1.5deg) scale(1.03)}
	94%{transform:rotate(1deg) scale(1.02)}
	96%{transform:none}
}
@media (prefers-reduced-motion:reduce){.hl-link.is-featured{animation:none}}

/* Horarios (compacto) */
.hl-hours{padding:var(--pad) var(--pad) calc(var(--pad) * .85)}
.hl-hours-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.hl-hours-title{margin:0;font-size:14px;font-weight:800;letter-spacing:.05em}
.hl-status{flex:none;margin:0;padding:3px 8px;border-radius:999px;font-size:11px;font-weight:700;white-space:nowrap;background:color-mix(in srgb,var(--hl-card-fg) 8%,transparent)}
.hl-service{margin:2px 0 0;font-size:11.5px;opacity:.7}
.hl-slots-label{margin:8px 0 0;font-size:11px;text-transform:uppercase;letter-spacing:.05em;opacity:.65;font-weight:600}
.hl-slots{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-wrap:nowrap;gap:6px}
.hl-slot{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:6px 2px;border-radius:10px;background:color-mix(in srgb,var(--hl-accent) 18%,transparent);border:1.5px solid var(--hl-accent)}
.hl-slot-time{font-size:14px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.hl-slot-tag{font-size:9.5px;font-weight:600;opacity:.8;line-height:1.1;text-align:center}
.hl-slots.is-many{flex-wrap:wrap}
.hl-slots.is-many .hl-slot{flex:0 0 calc(25% - 5px)}
.hl-note{margin:7px 0 0;font-size:11px;line-height:1.35;opacity:.7;text-align:center}

/* FAQ */
.hl-faq{align-self:center;margin:calc(var(--g) * -.4) 0;padding:2px 10px;font-size:12.5px;font-weight:500;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.5);text-shadow:0 1px 6px rgba(0,0,0,.4)}

/* Reseñas */
.hl-reviews{padding:calc(var(--pad) * .8) var(--pad);text-align:center}
.hl-reviews-head{display:flex;justify-content:center;align-items:center;gap:5px;font-size:13px}
.hl-g{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#fff;color:#4285f4;font:700 12px/1 Arial,sans-serif;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.hl-stars{color:#fbbc04;letter-spacing:1px}
.hl-stars .off{color:currentColor;opacity:.25}
.hl-stars-sm{font-size:11px;letter-spacing:0}
.hl-reviews-count{opacity:.7;font-size:12px}
.hl-reviews-track{display:grid;margin-top:6px}
.hl-review{grid-area:1/1;margin:0;opacity:0;visibility:hidden;transition:opacity .6s ease,visibility .6s}
.hl-review.is-active{opacity:1;visibility:visible}
.hl-review-text{margin:0 0 4px;font-size:13px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;cursor:pointer}
.hl-review-text.is-open{-webkit-line-clamp:unset}
.hl-review figcaption{font-size:11.5px;font-weight:600}
.hl-dots{display:flex;justify-content:center;gap:0;margin-top:2px}
.hl-dot{width:18px;height:18px;padding:0;border:0;background:none;cursor:pointer;position:relative;color:inherit}
.hl-dot::after{content:"";position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px;border-radius:50%;background:currentColor;opacity:.25;transition:opacity .2s,transform .2s}
.hl-dot.is-active::after{opacity:.85;transform:scale(1.15)}
.hl-reviews-more{font-size:12px;font-weight:600;opacity:.75;text-decoration:none}

/* Eventos (plegables) */
.hl-events{display:flex;flex-direction:column;gap:calc(var(--g) * .8)}
.hl-section-title{margin:2px 0 -2px;text-align:center;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;text-shadow:0 1px 8px rgba(0,0,0,.35)}
.hl-event{overflow:hidden}
.hl-event-sum{display:flex;align-items:center;gap:10px;padding:7px 10px 7px 7px;cursor:pointer;list-style:none}
.hl-event-sum::-webkit-details-marker{display:none}
.hl-event-date{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;width:44px;height:44px;border-radius:calc(var(--hl-radius) * .6);background:var(--hl-accent);color:var(--hl-on-accent);line-height:1}
.hl-event-date .d{font-size:18px;font-weight:800}
.hl-event-date .m{font-size:10px;font-weight:700;text-transform:uppercase;margin-top:2px}
.hl-event-info{min-width:0;flex:1;display:flex;flex-direction:column;gap:2px}
.hl-event-title{font-size:14px;font-weight:700;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hl-event-meta{display:flex;align-items:center;flex-wrap:wrap;gap:5px;font-size:11.5px;opacity:.85}
.hl-chip{display:inline-block;padding:1px 7px;border-radius:999px;font-size:10.5px;font-weight:700}
.hl-chip-price{background:color-mix(in srgb,var(--hl-card-fg) 10%,transparent)}
.hl-chip-count{background:var(--hl-accent);color:var(--hl-on-accent)}
.hl-chev{flex:none;opacity:.5;transition:transform .2s}
.hl-event[open] .hl-chev{transform:rotate(180deg)}
.hl-event-more{padding:0 12px 12px}
.hl-event-img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:calc(var(--hl-radius) * .6);margin-top:2px}
.hl-event-loc{display:flex;align-items:center;gap:4px;margin:8px 0 0;font-size:12.5px}
.hl-event-loc svg{width:15px;height:15px;opacity:.7}
.hl-event-ticket{margin:6px 0 0;font-size:11.5px;line-height:1.4;opacity:.72}
.hl-event-actions{display:flex;gap:8px;margin-top:10px}
.hl-btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:8px 14px;border-radius:calc(var(--hl-radius) * .75);background:var(--hl-accent);color:var(--hl-on-accent);font-size:14px;font-weight:700;text-decoration:none;transition:filter .15s}
.hl-btn:hover{filter:brightness(1.06)}
.hl-btn-ghost{flex:none;background:transparent;color:inherit;border:1.5px solid color-mix(in srgb,var(--hl-card-fg) 25%,transparent)}
.hl-btn-ghost svg{width:18px;height:18px}
.hl-btn-ghost:only-child{flex:1}

/* Pie */
.hl-footer{display:flex;justify-content:center;flex-wrap:wrap;gap:4px 10px;margin-top:4px;font-size:11px;opacity:.7;text-shadow:0 1px 6px rgba(0,0,0,.4)}
.hl-footer a{text-decoration:none}
.hl-credit a{text-decoration:underline;text-underline-offset:2px}

/* Densidad cómoda: algo más de aire */
.hl-comfortable .hl-hours-title{font-size:15px}
.hl-comfortable .hl-slot-time{font-size:15px}
.hl-comfortable .hl-note{font-size:12px}
.hl-comfortable .hl-review-text{-webkit-line-clamp:4;font-size:14px}
.hl-comfortable .hl-title{font-size:22px}

/* Pantallas bajas (móviles pequeños): apretar aún más */
@media (max-height:700px){
	.hl-compact{--g:8px;--link-h:46px}
	.hl-compact .hl-socials a{width:36px;height:36px}
}
@media (min-width:640px){
	.hl-wrap{padding-top:40px}
}
