
:root {
  --cinach-bg: #0b0d12;
  --cinach-panel: #141821;
  --cinach-text: #f6f7fb;
  --cinach-muted: #a8adba;
  --cinach-accent: #e9b44c;
  --cinach-accent-dark: #c78b1b;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 76px; }
body {
  margin: 0;
  background: #0f1219;
  color: var(--cinach-text);
  font-family: 'DM Sans', sans-serif;
}
h1, h2, h3, .navbar-brand { font-family: 'Manrope', sans-serif; }
.cinach-navbar {
  background: rgba(10, 12, 17, .96);
  border-bottom: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(12px);
}
.navbar-brand { letter-spacing: .04em; }
.brand-mark {
  display: inline-grid;
  place-items: center;
  width: 32px;
  height: 32px;
  margin-right: 5px;
  border-radius: 9px;
  background: var(--cinach-accent);
  color: #15120b;
}
.nav-link { color: #d1d4dc; }
.nav-link:hover, .nav-link.active { color: var(--cinach-accent) !important; }
.hero-section {
  min-height: 510px;
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(10,12,17,.98) 0%, rgba(10,12,17,.89) 47%, rgba(10,12,17,.25) 100%),
    radial-gradient(ellipse at 78% 44%, rgba(169, 91, 39, .36), transparent 38%),
    linear-gradient(135deg, #27232a 0%, #11151d 56%, #34251d 100%);
}
.hero-content { position: relative; z-index: 2; padding-top: 76px; padding-bottom: 76px; }
.eyebrow {
  color: var(--cinach-accent);
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .18em;
  margin-bottom: 13px;
}
.hero-section h1 {
  font-size: clamp(2.6rem, 6vw, 4.8rem);
  line-height: 1.06;
  font-weight: 800;
  letter-spacing: -.055em;
}
.hero-section h1 span { color: var(--cinach-accent); }
.hero-description { max-width: 550px; color: #c0c3cc; line-height: 1.8; margin: 22px 0 28px; }
.btn-cinach {
  background: var(--cinach-accent);
  border-color: var(--cinach-accent);
  color: #17130a;
  font-weight: 700;
  padding: 12px 20px;
}
.btn-cinach:hover { background: #f5c968; border-color: #f5c968; color: #17130a; }
.hero-decoration {
  position: absolute;
  right: 9%;
  top: 50%;
  transform: translateY(-50%) rotate(-9deg);
  width: min(31vw, 340px);
  aspect-ratio: 3 / 4;
  display: grid;
  place-items: center;
  border: 1px solid rgba(233,180,76,.42);
  border-radius: 170px 170px 24px 24px;
  background: linear-gradient(155deg, rgba(233,180,76,.12), rgba(255,255,255,.015));
  box-shadow: 0 0 90px rgba(233,180,76,.1), inset 0 0 60px rgba(233,180,76,.06);
}
.hero-decoration span {
  color: rgba(233,180,76,.16);
  font-family: 'Manrope', sans-serif;
  font-size: clamp(8rem, 20vw, 17rem);
  font-weight: 800;
}
.section-space { padding: 76px 0; }
.section-heading h2, .promotion-card h2, .location-section h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 800; letter-spacing: -.04em; }
.muted { color: var(--cinach-muted); }
.filter-wrap { min-width: 205px; }
.form-select {
  background-color: #171b24;
  color: #f5f6f9;
  border-color: #343a46;
}
.form-select:focus { border-color: var(--cinach-accent); box-shadow: 0 0 0 .2rem rgba(233,180,76,.15); }
.movie-card {
  height: 100%;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  background: var(--cinach-panel);
  transition: transform .2s ease, border-color .2s ease;
}
.movie-card:hover { transform: translateY(-5px); border-color: rgba(233,180,76,.55); }
.movie-poster {
  min-height: 265px;
  display: flex;
  align-items: end;
  padding: 20px;
  position: relative;
  overflow: hidden;
  background: linear-gradient(145deg, var(--poster-a), var(--poster-b));
}
.movie-poster::before, .movie-poster::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.22);
}
.movie-poster::before { width: 220px; height: 220px; top: -70px; right: -45px; }
.movie-poster::after { width: 140px; height: 140px; top: 12px; right: -5px; }
.poster-number {
  position: absolute;
  top: 8px;
  left: 17px;
  color: rgba(255,255,255,.23);
  font-size: 5.5rem;
  line-height: 1;
  font-weight: 800;
}
.poster-title {
  position: relative;
  z-index: 1;
  font-family: 'Manrope', sans-serif;
  font-size: 1.7rem;
  font-weight: 800;
  line-height: 1.08;
  text-shadow: 0 2px 15px rgba(0,0,0,.3);
}
.movie-info { padding: 18px; }
.movie-info h3 { font-size: 1.08rem; font-weight: 700; }
.movie-meta { color: var(--cinach-muted); font-size: .86rem; }
.genre-badge {
  background: rgba(233,180,76,.12);
  color: #f1c66f;
  border: 1px solid rgba(233,180,76,.24);
  font-weight: 500;
}
.btn-outline-gold { color: var(--cinach-accent); border: 1px solid var(--cinach-accent); }
.btn-outline-gold:hover { background: var(--cinach-accent); color: #17130a; }
.promotion-section { background: #0b0d12; }
.promotion-card {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 40px;
  align-items: center;
  padding: clamp(26px, 5vw, 54px);
  border: 1px solid rgba(233,180,76,.24);
  border-radius: 22px;
  background: radial-gradient(ellipse at 95% 5%, rgba(233,180,76,.12), transparent 40%), #151922;
}
.promotion-card p:not(.eyebrow) { color: #b7bbc5; line-height: 1.75; }
.promotion-side {
  padding: 26px;
  border-radius: 16px;
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.07);
}
.promotion-side p.fw-semibold { color: #fff !important; }
.promotion-icon { color: var(--cinach-accent); font-size: 2rem; margin-bottom: 10px; }
.location-section { background: #12151c; }
.site-footer { padding: 24px 0; background: #080a0e; color: #b3b7c1; border-top: 1px solid rgba(255,255,255,.07); }
.footer-divider { color: var(--cinach-accent); padding: 0 6px; }
@media (max-width: 767.98px) {
  .hero-section { min-height: 490px; }
  .hero-content { padding-top: 64px; padding-bottom: 64px; }
  .hero-decoration { right: -18%; width: 55vw; opacity: .55; }
  .hero-section h1, .hero-description { position: relative; z-index: 2; }
  .section-space { padding: 54px 0; }
  .promotion-card { grid-template-columns: 1fr; gap: 24px; }
  .movie-poster { min-height: 230px; }
}

/* Póster real cargado desde la web */
.movie-poster.has-image { padding: 0; min-height: 0; aspect-ratio: 2 / 3; background: #0b0d12; }
.movie-poster.has-image::before, .movie-poster.has-image::after { display: none; }
.movie-poster img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Logo en la barra de navegación */
.brand-logo { height: 40px; width: 40px; object-fit: contain; display: block; }

/* Logo como decoración de la portada */
.hero-decoration { aspect-ratio: 1 / 1; border: none; border-radius: 0; background: none; box-shadow: none; transform: translateY(-50%); }
.hero-decoration img { width: 100%; height: 100%; object-fit: contain; opacity: .22; }
/* ---------- Navegación con sesión ---------- */
.nav-user { color: #d1d4dc; font-size: .92rem; }
.cinach-navbar .btn-cinach { padding: .25rem .75rem; font-size: .875rem; }

/* ---------- Cabecera de cartelera ---------- */
.page-header { padding: 64px 0 8px; }
.page-title { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; letter-spacing: -.04em; }

/* ---------- Registro e inicio de sesión ---------- */
.auth-section {
  min-height: calc(100vh - 150px);
  display: flex;
  align-items: center;
  padding: 56px 0;
  background:
    radial-gradient(ellipse at 85% 10%, rgba(233,180,76,.1), transparent 45%),
    #0f1219;
}
.auth-card {
  max-width: 480px;
  margin: 0 auto;
  padding: clamp(24px, 5vw, 40px);
  border: 1px solid rgba(233,180,76,.24);
  border-radius: 22px;
  background: #151922;
}
.auth-logo { height: 64px; width: 64px; object-fit: contain; }
.auth-title { font-size: 1.9rem; font-weight: 800; letter-spacing: -.04em; }
.form-label { color: #d1d4dc; font-size: .9rem; }
.form-control {
  background-color: #171b24;
  color: #f5f6f9;
  border-color: #343a46;
}
.form-control::placeholder { color: #6f7685; }
.form-control:focus {
  background-color: #171b24;
  color: #f5f6f9;
  border-color: var(--cinach-accent);
  box-shadow: 0 0 0 .2rem rgba(233,180,76,.15);
}
.form-text { color: var(--cinach-muted); }
.form-check-input { background-color: #171b24; border-color: #4a5160; }
.form-check-input:checked { background-color: var(--cinach-accent); border-color: var(--cinach-accent); }
.form-check-input:focus { border-color: var(--cinach-accent); box-shadow: 0 0 0 .2rem rgba(233,180,76,.15); }
.link-cinach { color: var(--cinach-accent); }
.link-cinach:hover { color: #f5c968; }

/* Botones de las tarjetas alineados al fondo */
.movie-card { display: flex; flex-direction: column; }
.movie-info { flex: 1; display: flex; flex-direction: column; }
.movie-info .btn-funciones { margin-top: auto; }

/* ================= Acabado profesional (v2) ================= */
:root { --radius: 16px; --shadow: 0 10px 30px rgba(0,0,0,.35); --line: rgba(255,255,255,.08); }
body { -webkit-font-smoothing: antialiased; line-height: 1.65; }
h1, h2, h3 { text-wrap: balance; }
.cinach-navbar { padding: .55rem 0; box-shadow: 0 1px 0 var(--line), 0 8px 24px rgba(0,0,0,.25); }
.nav-link { position: relative; font-weight: 500; padding: .5rem .75rem !important; }
.nav-link::after { content: ""; position: absolute; left: .75rem; right: .75rem; bottom: 2px; height: 2px; background: var(--cinach-accent); transform: scaleX(0); transition: transform .25s; }
.nav-link:hover::after, .nav-link.active::after { transform: scaleX(1); }
.btn { border-radius: 10px; font-weight: 600; transition: transform .15s, box-shadow .2s, background .2s, color .2s; }
.btn-cinach:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(233,180,76,.28); }
.eyebrow { display: inline-flex; align-items: center; gap: .65rem; }
.eyebrow::before { content: ""; width: 28px; height: 2px; background: var(--cinach-accent); }
.text-center .eyebrow::before { display: none; }
.hero-section { min-height: 570px; border-bottom: 1px solid var(--line); }
.section-space { padding: 88px 0; }
.section-heading { margin-bottom: 8px; }
.movie-card { border-radius: var(--radius); box-shadow: var(--shadow); }
.movie-card:hover { box-shadow: 0 18px 40px rgba(0,0,0,.5), 0 0 0 1px rgba(233,180,76,.4); }
.movie-poster img { transition: transform .5s ease; }
.movie-card:hover .movie-poster img { transform: scale(1.05); }
.movie-info { padding: 20px; }
.movie-info h3 { font-size: 1.1rem; margin-bottom: .3rem; }
.genre-badge { text-transform: uppercase; letter-spacing: .06em; font-size: .68rem; }
.promotion-card, .auth-card { box-shadow: var(--shadow); }
.auth-card { border-radius: 24px; }
.form-control, .form-select { border-radius: 10px; padding: .65rem .85rem; }
.site-footer { padding: 34px 0; }
:focus-visible { outline: 2px solid var(--cinach-accent); outline-offset: 3px; }
@keyframes subir { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.hero-content, .movie-card, .auth-card, .promotion-card { animation: subir .6s ease both; }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }


/* ---------- Flujo de compra CINACH ---------- */
.purchase-shell{max-width:1050px}.purchase-steps{display:flex;flex-wrap:wrap;gap:8px;margin:25px 0}.purchase-steps span{padding:8px 12px;border-radius:20px;background:#1b202b;color:#9da4b2;font-size:.8rem}.purchase-steps span.active{background:rgba(233,180,76,.18);color:#f1c66f;border:1px solid rgba(233,180,76,.4)}
.purchase-panel{background:#151a24;border:1px solid rgba(255,255,255,.09);border-radius:18px;padding:clamp(20px,4vw,34px);margin-bottom:20px}.purchase-panel h2{font-size:1.45rem;font-weight:800}.chain-card,.branch-card,.show-card,.purchase-movie{width:100%;height:100%;text-align:left;border:1px solid #353c49;background:#1b202b;color:#f6f7fb;border-radius:14px;padding:22px;transition:.2s}.chain-card:hover,.branch-card:hover,.show-card:hover,.purchase-movie:hover{border-color:var(--cinach-accent);transform:translateY(-2px)}.chain-card{min-height:145px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:12px}.chain-logo{font-size:1.8rem;font-weight:900}.cinepolis{color:#2e9ce5}.cinemex{color:#ed454b}.chain-card small,.branch-card small,.show-card small,.purchase-movie small{display:block;color:#a8adba;margin-top:7px}.branch-card,.show-card{display:flex;flex-direction:column;gap:6px}.purchase-movie{display:flex;align-items:center;gap:14px;min-height:110px}.purchase-movie img{width:62px;height:88px;object-fit:cover;border-radius:7px;background:#0b0d12}.purchase-movie span{display:flex;flex-direction:column}.seat-legend{display:flex;gap:20px;flex-wrap:wrap;color:#b8bdc8;font-size:.85rem;margin:22px 0}.seat-legend span{display:flex;align-items:center;gap:7px}.seat{width:43px;height:37px;border-radius:8px 8px 5px 5px;border:1px solid #5b6575;font-size:.68rem;display:grid;place-items:center}.seat.free{background:#252d3b;color:#e8edf5}.seat.free:hover{border-color:#e9b44c}.seat.selected{background:#e9b44c;color:#17130a;border-color:#e9b44c}.seat.occupied{background:#633d43;color:#c7aeb1;border-color:#633d43;cursor:not-allowed}.seat-map{display:grid;grid-template-columns:repeat(8,minmax(34px,1fr));gap:9px;max-width:500px;margin:25px auto}.screen-label{max-width:500px;margin:30px auto 0;text-align:center;padding:9px;border-radius:50% 50% 8px 8px;background:linear-gradient(180deg,rgba(233,180,76,.35),rgba(233,180,76,.02));color:#e9c77f;letter-spacing:.3em;font-size:.75rem}.demo-warning{border:1px solid rgba(233,180,76,.4);background:rgba(233,180,76,.08);padding:16px;border-radius:12px;color:#f1d69c}.demo-warning p{color:#c7cbd4;margin-top:5px}.order-summary{background:#10141c;border:1px solid #343b48;border-radius:14px;padding:22px}.order-summary h3{font-size:1.1rem}.order-summary p{color:#c4c8d1;font-size:.9rem}.ticket-success{text-align:center;margin-bottom:25px}.success-icon{width:58px;height:58px;display:grid;place-items:center;margin:0 auto 15px;border-radius:50%;background:#244d3b;color:#8ce0ad;font-size:2rem}.digital-ticket{max-width:520px;margin:auto;background:#fff;color:#111;border:1px dashed #444;border-radius:8px;overflow:hidden;box-shadow:0 10px 26px rgba(0,0,0,.25)}.ticket-top{padding:14px 18px;background:#fff;color:#111;display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px dashed #777}.ticket-top strong{font-size:1.2rem;letter-spacing:.08em}.ticket-top span{font-size:.68rem;letter-spacing:.16em;color:#444}.ticket-body{padding:18px 20px;font-family:"Courier New",Courier,monospace}.ticket-body h3{font-weight:700;font-size:1.15rem;margin-bottom:8px}.ticket-body-receipt h3{text-transform:uppercase}.ticket-chain{color:#333;border-bottom:1px dashed #999;padding-bottom:12px;margin-bottom:16px}.ticket-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:18px 0}.ticket-grid small,.ticket-folio small{display:block;color:#555;font-size:.68rem;letter-spacing:.08em}.ticket-grid b{display:block;margin-top:5px;font-size:.96rem}.ticket-folio{text-align:center;padding:14px;background:#f7f7f7;border:1px dashed #999;border-radius:4px}.ticket-folio strong{display:block;font-size:1.3rem;letter-spacing:.14em}.ticket-total-row{display:flex;justify-content:space-between;align-items:center;margin-top:18px;padding-top:14px;border-top:1px dashed #888;font-weight:700}.ticket-note{margin-top:18px;padding-top:14px;border-top:1px dashed #999;color:#333;font-size:.8rem;line-height:1.5}.purchase-panel .form-control{background:#0e1219;color:#fff;border-color:#3c4350}.purchase-panel .form-control:focus{border-color:#e9b44c;box-shadow:0 0 0 .2rem #e9b44c22}@media(max-width:520px){.seat-map{gap:5px}.seat{width:100%;height:34px;font-size:.6rem}.purchase-steps span{font-size:.7rem;padding:6px 9px}.ticket-top{align-items:flex-start;flex-direction:column}.ticket-grid{grid-template-columns:1fr}}

.ticket-qr-wrap{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:18px}.ticket-qr-wrap small{color:#555;font-size:.7rem}.ticket-qr-wrap img,.ticket-qr-wrap canvas{filter:grayscale(1)}

/* CINACH v2 */
[hidden]{display:none!important}.feature-carousel{position:relative;overflow:hidden;border:1px solid #51462f;border-radius:28px;background:radial-gradient(ellipse at 90% 40%,#4e3b20 0,transparent 55%),#141414;padding:64px 6% 32px}.feature-slide{min-height:350px;position:relative}.feature-slide h1{font-size:clamp(2.5rem,5.5vw,5rem);line-height:1.08;font-weight:750;letter-spacing:-.045em;max-width:780px}.feature-slide h1 span{color:#d9b66b}.feature-slide>p:not(.eyebrow){color:#bab4a9;max-width:480px;font-size:1.1rem;margin:25px 0}.film-orbit{position:absolute;right:0;top:20px;display:grid;place-content:center;text-align:center;width:250px;height:250px;border:1px solid #77613a;border-radius:50%;color:#d9b66b;font-size:100px;transform:rotate(-10deg);box-shadow:0 0 0 25px #d9b66b08,0 0 0 50px #d9b66b05}.film-orbit span{font-size:12px;letter-spacing:5px}.carousel-controls{display:flex;align-items:center;gap:22px}.carousel-controls button{background:transparent;color:#d9b66b;border:1px solid #766345;border-radius:50%;width:44px;height:44px}.home-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;padding:35px 0 0}.home-benefits b{color:#d9b66b}.home-benefits p{color:#aaa;margin-top:8px}.admin-shell{max-width:1280px;margin:auto;padding:36px 20px}.admin-tabs{display:flex;gap:10px;flex-wrap:wrap;margin:25px 0}.admin-tabs button{border:1px solid #554831;background:transparent;color:#ddd;border-radius:9px;padding:10px 20px}.admin-tabs button.active{background:#d9b66b;color:#111}.admin-card{background:#191919;border:1px solid #3c3529;padding:24px;border-radius:16px}.admin-table{--bs-table-bg:transparent;--bs-table-color:#eee;--bs-table-border-color:#38332b;vertical-align:middle}.admin-table th{color:#d9b66b}.admin-table td{max-width:300px;overflow-wrap:anywhere}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:20px 0}.metric strong{display:block;font-size:2rem;color:#d9b66b}.metric span{color:#bbb}.bar-track{height:12px;background:#302c25;border-radius:10px;overflow:hidden;margin-top:8px}.bar-track span{display:block;background:#d9b66b;height:100%}.editor{background:#222;border:1px solid #6d5936;border-radius:14px;padding:24px;margin:20px 0}.editor label{display:block;margin-bottom:6px}.editor .form-control,.editor .form-select{background:#111;color:#eee;border-color:#625841}.notice{color:#b9b2a4;font-size:.85rem}.table-toolbar{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;margin-bottom:18px}button:focus-visible,a:focus-visible{outline:3px solid #efd28f;outline-offset:4px}.payment-notice{border-left:3px solid #b18a45;padding:12px 16px;background:#ffffff05}
@media(min-width:1100px){.feature-slide h1{max-width:75%}}@media(max-width:1000px){.film-orbit{display:none}}@media(max-width:600px){.feature-carousel{padding:32px 24px}.feature-slide{min-height:380px}.home-benefits,.stats-grid{grid-template-columns:1fr}.admin-card{padding:15px}.home-benefits{gap:10px}.seat-map{gap:5px}.seat{min-width:0}.feature-slide h1{font-size:2.8rem}}
@media print{nav,.admin-tabs,.table-toolbar,.editor,#adminAlert,.no-print,footer{display:none!important}body,.admin-card{background:white!important;color:black!important}.admin-table{--bs-table-color:black}.metric strong{color:black}.admin-shell{max-width:none;padding:0}}

.home-stage{padding-left:20px;padding-right:20px}.carousel-controls{margin-top:24px}

/* Toque cinematográfico discreto, manteniendo el diseño vertical original. */
#ticketResult .digital-ticket{border:1px solid #222;border-top:3px solid #111;border-bottom:3px solid #111;}
#ticketResult .ticket-top{border-bottom:1px dashed #555;}
#ticketResult .ticket-top strong{letter-spacing:.11em;}
#ticketResult .ticket-top span{font-weight:700;color:#333;}
#ticketResult .ticket-body h3{letter-spacing:.015em;}
#ticketResult .ticket-folio{border-top:1px dashed #999;border-bottom:1px dashed #999;}

/* CINACH 2026-11-08: logo del carrusel anclado a la derecha */
.feature-carousel .feature-slide {
  position: relative;
}
.feature-carousel .feature-slide .feature-brand-mark {
  position: absolute;
  top: 50%;
  right: clamp(12px, 3.5vw, 50px);
  transform: translateY(-50%);
  width: clamp(200px, 23vw, 310px);
  max-width: 28%;
  aspect-ratio: 1 / 1;
  display: grid;
  place-items: center;
  margin: 0;
  z-index: 1;
  pointer-events: none;
  filter: drop-shadow(0 0 20px rgba(217, 182, 107, .14));
}
.feature-carousel .feature-slide .feature-brand-mark img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: contain;
}
@media (max-width: 1050px) {
  .feature-carousel .feature-slide .feature-brand-mark {
    display: none;
  }
}
