.cinema-location { display:flex; align-items:center; gap:7px; font-size:13px; color:var(--vc-muted); }
.cinema-location ion-icon { flex-shrink:0; font-size:18px; color:#337ccb; }
.cinema-notices { display:grid; gap:12px; padding-block:22px 24px; }
.cinema-notice { background:#eaf4ff; border:1px solid #c6dcf3; border-left:4px solid #337ccb; border-radius:12px; padding:12px 18px; }
.cinema-notice summary { display:flex; align-items:center; gap:10px; min-height:28px; font-weight:600; font-size:14px; cursor:pointer; list-style:none; }
.cinema-notice summary::-webkit-details-marker { display:none; }
.cinema-notice summary ion-icon { flex-shrink:0; font-size:20px; color:#2868ac; }
.cinema-notice__toggle { margin-left:auto; font-size:20px; }
.cinema-notice[open] .cinema-notice__toggle { transform:rotate(45deg); }
.cinema-notice__body { display:flex; align-items:center; gap:20px; padding-top:14px; }
.cinema-notice__body>img { width:120px; max-height:160px; object-fit:contain; border-radius:6px; }
.cinema-notice h2 { font-size:18px; margin-bottom:4px; }
.cinema-notice p { white-space:pre-line; font-size:14px; }
.cinema-notice .vc-button { margin-top:12px; }
.cinema-program { padding-block:26px 30px; background:var(--vc-paper); border-block:1px solid var(--vc-line); }
.cinema-count { color:var(--vc-muted); font-size:12px; font-weight:500; white-space:nowrap; }
.cinema-layout { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:24px; align-items:start; }
.cinema-layout--plain { grid-template-columns:minmax(0,1fr); }
.cinema-main { grid-column:1; grid-row:1; min-width:0; scroll-margin-top:calc(var(--vc-header-h) + 12px); }
.cinema-side { grid-column:2; grid-row:1; position:sticky; top:calc(var(--vc-header-h) + 16px); }
.cinema-side__inner { display:grid; gap:16px; padding:16px; border:1px solid var(--vc-line); background:white; border-radius:12px; }
.cinema-side__row { display:grid; justify-items:start; gap:4px; }
.cinema-field { flex:1; width:100%; min-width:0; }
.cinema-field label, .cinema-field__label { display:block; font-size:12px; font-weight:600; margin-bottom:5px; color:var(--vc-muted); }
.cinema-field select { display:block; width:100%; min-height:46px; padding:10px 32px 10px 12px; font-size:14px; color:var(--vc-ink); background:var(--vc-paper); border:1px solid var(--vc-line); border-radius:7px; text-overflow:ellipsis; }
.cinema-reset { display:flex; align-items:center; gap:6px; min-height:46px; padding:8px 10px; color:#265f9e; font-weight:600; font-size:12px; white-space:nowrap; }
.cinema-days { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.cinema-days__all { grid-column:1 / -1; }
.cinema-days button { min-height:44px; padding:9px 10px; border-radius:8px; border:1px solid var(--vc-line); background:white; color:#41516a; font-size:13px; font-weight:600; cursor:pointer; }
.cinema-days button:hover { border-color:#337ccb; }
.cinema-days button[aria-pressed=true] { background:var(--vc-ink); color:white; border-color:var(--vc-ink); }
.cinema-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:20px; align-items:stretch; }
.cinema-film { display:flex; flex-direction:column; min-width:0; border:1px solid var(--vc-line); border-radius:14px; background:white; overflow:hidden; box-shadow:0 3px 6px #00122d03; }
/* Sin subgrid, al menos el boton queda abajo y las tarjetas miden igual. */
.cinema-film .cinema-sessions { flex:1 1 auto; }
/* Con subgrid, ficha, sesiones y boton se alinean en toda la fila: se acaba
   el efecto escalera cuando un titulo ocupa mas lineas que otro. */
@supports (grid-template-rows:subgrid) {
  .cinema-grid { grid-auto-rows:auto; }
  .cinema-film { display:grid; grid-template-rows:subgrid; grid-row:span 3; row-gap:0; }
  .cinema-film--advance { grid-row:span 2; }
}
.cinema-film__summary { display:grid; grid-template-columns:105px minmax(0,1fr); gap:16px; padding:18px; }
.cinema-film__poster { aspect-ratio:2/3; border-radius:8px; overflow:hidden; background:transparent; align-self:start; }
.cinema-film__poster img { width:100%; height:100%; object-fit:cover; color:var(--vc-muted); font-size:12px; }
.cinema-poster-placeholder { background:#e8eef6; height:100%; display:flex; flex-direction:column; gap:10px; align-items:center; justify-content:center; text-align:center; color:#526176; padding:10px; font-size:12px; }
.cinema-poster-placeholder ion-icon { font-size:30px; }
.cinema-film__info { min-width:0; }
.cinema-tag { display:inline-block; padding:3px 7px; border-radius:4px; background:#eef4fb; color:#265f9e; font-size:12px; font-weight:600; }
.cinema-tag--presale { background:#fff0da; color:#875007; }
.cinema-film h3 { font-family:var(--vc-font); font-size:16px; line-height:1.35; font-weight:600; margin:7px 0 9px; overflow-wrap:anywhere; }
.cinema-film h3 a:hover { color:#2868ac; }
.cinema-film__meta { display:flex; flex-wrap:wrap; gap:4px 10px; font-size:12px; color:var(--vc-muted); }
.cinema-film__meta li { display:inline; }
.cinema-film__genres { margin-top:6px; color:var(--vc-muted); font-size:12px; }
.cinema-film__detail { display:inline-flex; gap:5px; align-items:center; min-height:36px; color:#265f9e; font-size:12px; font-weight:600; margin-top:5px; }
.cinema-sessions { padding:0 18px; }
.cinema-session { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:6px 12px; padding:10px 0; border-top:1px solid #e8edf3; }
.cinema-session--offer { padding-inline:10px; margin-inline:-10px; border-radius:9px; background:#f4fcf7; box-shadow:inset 3px 0 0 var(--vc-green); }
.cinema-session__day { flex:1; min-width:0; }
.cinema-session time { display:block; font-size:12px; font-weight:600; text-align:left; }
.cinema-session__flag { display:inline-block; margin-top:4px; font-size:12px; font-weight:600; color:#875007; }
.cinema-session__offer { display:inline-flex; flex-basis:100%; align-self:start; align-items:center; gap:5px; width:fit-content; padding:2px 9px 2px 7px; border:1px solid var(--vc-green-line); border-radius:999px; background:var(--vc-green-soft); color:var(--vc-green-ink); font-size:12px; font-weight:600; line-height:1.6; }
.cinema-session__offer ion-icon { flex-shrink:0; font-size:13px; color:var(--vc-green); }
.cinema-session__times { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:5px; max-width:58%; }
.cinema-time { display:inline-flex; align-items:center; justify-content:center; min-height:32px; min-width:49px; padding:4px 7px; border:1px solid #c9daf0; border-radius:6px; background:#eef5ff; color:var(--vc-ink); font-size:12px; font-weight:600; font-variant-numeric:tabular-nums; }
.cinema-time--past { text-decoration:line-through; background:#f3f5f8; color:#687483; border-color:#e0e5eb; }
.cinema-session--offer .cinema-time { border-color:var(--vc-green-line); background:var(--vc-green-soft); color:var(--vc-green-ink); }
.cinema-session--offer .cinema-time--past { border-color:#dde7e1; background:#f1f5f2; color:#6d7c73; }
.cinema-film__actions { padding:12px 18px 18px; }
.cinema-film__actions .vc-button { width:100%; font-size:12px; }
.cinema-advance { padding-block:34px 0; }
/* Aro ámbar: mismo idioma que la portada para "aún no se estrena". */
.cinema-film--advance { border-color:#f0cf95; box-shadow:0 0 0 1px #f0cf95; }
.cinema-advance .cinema-count { color:#875007; font-weight:700; }
.cinema-promotions { padding-block:36px 0; }
.cinema-promotions__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.cinema-promotion { display:flex; align-items:center; gap:20px; padding:20px; border:1px solid var(--vc-green-line); border-left:4px solid var(--vc-green); border-radius:14px; background:#f8fdfa; }
.cinema-promotion>img { max-width:40%; max-height:180px; object-fit:contain; }
.cinema-promotion h3 { font-size:18px; line-height:1.3; }
.cinema-promotion p { font-size:13px; color:var(--vc-muted); margin-top:6px; }
.cinema-promotion .vc-button { margin-top:14px; }
.cinema-venue { padding-top:40px; }
.cinema-venue__card { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:0; border:1px solid var(--vc-line); border-radius:18px; background:white; overflow:hidden; }
.cinema-venue__photo { grid-row:1 / span 2; margin:0; min-height:100%; }
.cinema-venue__photo img { width:100%; height:100%; min-height:280px; object-fit:cover; }
.cinema-venue__data { padding:26px 28px 20px; }
.cinema-venue h2 { font-family:var(--vc-display); font-size:34px; font-weight:400; letter-spacing:.6px; line-height:1.05; margin:0 0 18px; }
.cinema-venue__facts { display:grid; gap:12px; padding:0; margin:0; list-style:none; }
.cinema-venue__facts li { display:flex; align-items:flex-start; gap:10px; font-size:14px; line-height:1.5; }
.cinema-venue__facts ion-icon { flex-shrink:0; margin-top:2px; font-size:19px; color:#337ccb; }
.cinema-venue__facts b { font-weight:700; }
.cinema-venue__facts a { text-decoration:underline; }
.cinema-venue__map { padding:0 28px 26px; }
.cinema-venue__map iframe { display:block; border:0; border-radius:12px; width:100%; height:230px; }
@media (min-width:1600px) { .cinema-grid { gap:24px; } .cinema-film__summary { grid-template-columns:120px minmax(0,1fr); } }
@media (max-width:1150px) { .cinema-layout { grid-template-columns:minmax(0,1fr) 260px; gap:18px; } }
/* Por debajo de 1024px los filtros pasan a ser una barra fija bajo la cabecera. */
@media (max-width:1023px) {
  .cinema-layout { grid-template-columns:minmax(0,1fr); }
  .cinema-side, .cinema-main { grid-column:1; }
  .cinema-side { grid-row:1; position:sticky; top:var(--vc-header-h); z-index:20; margin-inline:calc(var(--vc-shell-pad) * -1); }
  .cinema-main { grid-row:2; scroll-margin-top:calc(var(--vc-header-h) + 104px); }
  .cinema-side__inner { gap:7px; padding:7px var(--vc-shell-pad) 9px; border:0; border-bottom:1px solid var(--vc-line); border-radius:0; box-shadow:0 6px 12px #00122d0f; }
  .cinema-side__row { display:flex; align-items:center; gap:10px; }
  .cinema-field label, .cinema-field--days .cinema-field__label { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
  .cinema-field select { min-height:40px; padding:6px 30px 6px 10px; font-size:15px; background:white; }
  .cinema-reset { min-height:40px; padding:6px 10px; }
  .cinema-days { display:flex; gap:7px; overflow-x:auto; padding-bottom:2px; scrollbar-width:none; scroll-snap-type:x proximity; }
  .cinema-days::-webkit-scrollbar { display:none; }
  .cinema-days button { flex:0 0 auto; min-height:40px; padding:8px 14px; scroll-snap-align:start; }
}
@media (max-width:680px) {
  .cinema-location { font-size:12px; }
  .cinema-program { padding-block:24px; }
  .cinema-field select { font-size:16px; padding-left:9px; }
  .cinema-reset__text { position:absolute; width:1px; height:1px; margin:-1px; overflow:hidden; clip-path:inset(50%); }
  .cinema-reset span[aria-hidden] { font-size:18px; }
  .cinema-grid { grid-template-columns:1fr; gap:14px; }
  .cinema-film__summary { grid-template-columns:90px minmax(0,1fr); padding:16px; gap:14px; }
  .cinema-film h3 { font-size:16px; }
  .cinema-film__meta,.cinema-film__genres,.cinema-film__detail { font-size:12px; }
  .cinema-session { padding-block:9px; }
  .cinema-time { font-size:13px; }
  .cinema-session time { font-size:13px; }
  .cinema-session__offer { font-size:12px; }
  .cinema-promotions__grid { grid-template-columns:1fr; }
  .cinema-venue__card { grid-template-columns:minmax(0,1fr); }
  .cinema-venue__photo { grid-row:auto; }
  .cinema-venue__photo img { min-height:0; height:190px; }
  .cinema-venue__data { padding:20px 18px 16px; }
  .cinema-venue__map { padding:0 18px 20px; }
  .cinema-venue__map iframe { height:200px; }
  .cinema-promotions { padding-top:28px; }
  .cinema-venue { padding-top:28px; }
  .cinema-venue h2 { font-size:27px; margin-bottom:14px; }
  .cinema-notice { padding:10px 12px; }
  .cinema-notice__body { gap:12px; }
  .cinema-notice__body>img { width:75px; }
  .cinema-notice h2 { font-size:16px; }
  .cinema-notice p { font-size:13px; }
}
