/* Shift Flow — capa de marca sobre Bootstrap 6 (alpha). El layout lo resuelve Bootstrap. */
:root{
  --sf-ink:#0F1330; --sf-indigo:#4F46E5; --sf-violet:#7C3AED; --sf-amber:#FFB547;
  --sf-bg:#F7F7FB; --sf-muted:#5B607F; --sf-line:#E4E5F0;
  --sf-display:'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;
}
body{font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;background:var(--sf-bg);color:var(--sf-ink);line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--sf-display);letter-spacing:-.02em;line-height:1.1;margin:0}
img{max-width:100%}

/* Botones (variables propias de Bootstrap 6) */
.sf-btn-amber{--bs-btn-bg:var(--sf-amber);--bs-btn-color:var(--sf-ink);--bs-btn-border-color:var(--sf-amber);
  --bs-btn-hover-bg:#FFC36B;--bs-btn-hover-color:var(--sf-ink);--bs-btn-hover-border-color:#FFC36B;
  --bs-btn-active-bg:#F5A524;--bs-btn-active-color:var(--sf-ink);--bs-btn-active-border-color:#F5A524;
  --bs-btn-font-weight:600;--bs-btn-border-radius:12px}
.sf-btn-ghost{--bs-btn-bg:transparent;--bs-btn-color:#fff;--bs-btn-border-color:rgba(255,255,255,.3);
  --bs-btn-hover-bg:rgba(255,255,255,.1);--bs-btn-hover-color:#fff;--bs-btn-hover-border-color:rgba(255,255,255,.5);
  --bs-btn-active-bg:rgba(255,255,255,.15);--bs-btn-active-color:#fff;--bs-btn-active-border-color:rgba(255,255,255,.5);
  --bs-btn-font-weight:600;--bs-btn-border-radius:12px}

/* Header */
.sf-header{position:absolute;inset:0 0 auto 0;z-index:5}
.sf-nav{height:76px}
.sf-brand{font-family:var(--sf-display);font-weight:800;font-size:22px;color:#fff}
.sf-brand em{font-style:normal;font-weight:500;color:#A5A8FF}
.sf-links a{color:#C9CBEA;text-decoration:none;font-size:15px}
.sf-links a:hover{color:#fff}

/* Hero */
.sf-hero{background:radial-gradient(900px 500px at 85% 20%,rgba(124,58,237,.45),transparent 60%),radial-gradient(700px 400px at 0% 100%,rgba(79,70,229,.35),transparent 60%),var(--sf-ink);color:#fff;padding:150px 0 100px;overflow:hidden}
.sf-eyebrow{display:inline-block;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--sf-indigo);margin-bottom:16px}
.sf-eyebrow-amber{color:var(--sf-amber)}
.sf-h1{font-size:clamp(38px,5.4vw,64px);font-weight:800}
.sf-h1 em{font-style:normal;color:var(--sf-amber)}
.sf-lead{font-size:19px;color:#C9CBEA;margin:22px 0 32px;max-width:520px}

/* Escena TV + ticket */
.sf-scene{position:relative;padding-bottom:40px}
.sf-tv{background:#0A0D26;border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:18px;box-shadow:0 40px 80px -30px rgba(0,0,0,.7)}
.sf-tv-top{font-size:12px;color:#8E92C4;margin-bottom:12px}
.sf-tv-now{display:grid;grid-template-columns:1fr auto;align-items:center;background:linear-gradient(135deg,var(--sf-indigo),var(--sf-violet));border-radius:14px;padding:18px 22px}
.sf-tv-now small{display:block;font-size:12px;opacity:.8;text-transform:uppercase;letter-spacing:.08em}
.sf-tv-now b{font-family:var(--sf-display);font-size:56px;line-height:1;font-weight:800}
.sf-tv-box{text-align:right}
.sf-tv-box b{font-size:36px;color:var(--sf-amber)}
.sf-tv-list{margin-top:12px;display:grid;gap:8px}
.sf-tv-list div{display:flex;justify-content:space-between;padding:10px 16px;border-radius:10px;background:rgba(255,255,255,.06);font-size:15px;color:#C9CBEA}
.sf-tv-list b{font-family:var(--sf-display);color:#fff;font-size:18px}
.sf-ticket{position:absolute;right:-8px;bottom:-6px;width:150px;background:#fff;color:var(--sf-ink);padding:16px 14px 18px;text-align:center;border-radius:6px;transform:rotate(5deg);box-shadow:0 24px 50px -16px rgba(0,0,0,.6);
  -webkit-mask:radial-gradient(circle 7px at 0 55%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 7px at 100% 55%,#0000 98%,#000) right/51% 100% no-repeat;
  mask:radial-gradient(circle 7px at 0 55%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 7px at 100% 55%,#0000 98%,#000) right/51% 100% no-repeat}
.sf-ticket small{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--sf-muted)}
.sf-ticket b{display:block;white-space:nowrap;font-family:var(--sf-display);font-size:34px;line-height:1.1;font-weight:800;color:var(--sf-indigo)}
.sf-ticket i{display:block;font-style:normal;font-size:11px;color:var(--sf-muted);border-top:1px dashed var(--sf-line);margin-top:8px;padding-top:8px}

/* Secciones */
.sf-section{padding:88px 0}
.sf-section.pt-0{padding-top:0}
.sf-alt{background:#fff;border-block:1px solid var(--sf-line)}
.sf-head{max-width:640px;margin-bottom:48px}
.sf-head h2{font-size:clamp(30px,4vw,44px);font-weight:800}
.sf-head p{color:var(--sf-muted);font-size:18px;margin:14px 0 0}

.sf-card{border:1px solid var(--sf-line);border-radius:18px;padding:26px;background:#fff;box-shadow:none}
.sf-card h3{font-size:20px;margin-bottom:8px}
.sf-card p{color:var(--sf-muted);font-size:15px;margin:0}
.sf-ic{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,var(--sf-indigo),var(--sf-violet));margin-bottom:18px}
.sf-ic svg{width:24px;height:24px;stroke:#fff;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

.sf-step{position:relative;padding-top:68px}
.sf-step::before{content:attr(data-n);position:absolute;top:0;left:0;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:var(--sf-ink);color:var(--sf-amber);font-family:var(--sf-display);font-weight:800;font-size:26px}
.sf-step h3{font-size:22px;margin-bottom:8px}
.sf-step p{color:var(--sf-muted);margin:0}

.sf-bullets li{display:flex;gap:12px;align-items:flex-start}
.sf-bullets li::before{content:"";flex:none;width:22px;height:22px;margin-top:2px;border-radius:50%;background:var(--sf-indigo) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12l4 4 8-8'/%3E%3C/svg%3E") center/14px no-repeat}
.sf-bullets b{display:block}
.sf-bullets span{color:var(--sf-muted);font-size:15px}

.sf-cta{background:linear-gradient(135deg,var(--sf-indigo),var(--sf-violet));color:#fff;border-radius:28px;padding:64px 40px}
.sf-cta h2{font-size:clamp(28px,4vw,42px);font-weight:800}
.sf-cta p{margin:14px auto 28px;max-width:520px;color:#E3E2FF;font-size:18px}

.sf-footer{padding:40px 0 56px;color:var(--sf-muted);font-size:14px}

@media(max-width:767px){
  .sf-hero{padding:120px 0 80px}
  .sf-section{padding:68px 0}
}
@media(max-width:520px){
  .sf-ticket{width:128px;right:0}
  .sf-tv-now b{font-size:44px}
  .sf-cta{padding:48px 22px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Selector de idioma */
.sf-lang{color:#C9CBEA;font-size:13px;font-weight:600;letter-spacing:.06em;text-decoration:none;padding:6px 10px;border:1px solid rgba(255,255,255,.25);border-radius:8px}
.sf-lang:hover{color:#fff;border-color:rgba(255,255,255,.5)}