/* mastercat-style.css: estilos para la promoción Mastercat (responsive) */

#mc-promo-wrap { font-family: "Georgia", serif; color: #fff; }

/* Layout general de tabs */
.mc-tabs { width:100%; max-width:1200px; margin:0 auto; position:relative; overflow:hidden; }
.mc-tab { min-height: 600px; background-size:cover; background-position:center; display:none; }
.mc-tab .mc-overlay { background: rgba(0,0,0,0.15); padding:30px 20px; min-height:600px; box-sizing:border-box; }

/* Mostrar la primera tab por defecto */
.mc-tab[data-tab="code"] { display:block; }

/* Centro superior */
.mc-top-center { text-align:center; padding-top:20px; }
.mc-logo { max-width:160px; display:inline-block; margin-bottom:8px; }
.mc-title { font-size:36px; color:#fff; margin:0; line-height:1.1; letter-spacing:2px; }
.mc-sub { font-size:22px; display:block; color:#ffd800; }

/* Instrucción */
.mc-instruction { color:#ffd800; font-weight:700; margin-top:8px; font-size:18px; }

/* Código input */
.mc-code-input-wrap { margin:40px auto 20px; display:flex; justify-content:center; align-items:center; gap:12px; max-width:640px; }
#mc-code-input { flex:1; padding:20px 24px; border-radius:40px; border: none; font-size:34px; text-align:center; width:100%; box-shadow: 0 4px 12px rgba(0,0,0,0.3); }
.mc-arrow-btn { width:64px; height:64px; border-radius:50%; border:3px solid #fff; background:rgba(255,255,255,0.0); color:#fff; font-size:28px; cursor:pointer; }

/* Sello */
.mc-sello { position:absolute; left:50%; transform:translateX(-50%); bottom:50px; }
.mc-sello img { max-width:140px; }

/* --- Form tab styles --- */
.mc-form-container { max-width:900px; margin:30px auto; background: rgba(0,0,0,0.18); padding:28px; border-radius:12px; box-shadow: 0 6px 18px rgba(0,0,0,0.5); }
.mc-logo-small { max-width:120px; display:block; margin:0 auto 6px; }
.mc-form-title { text-align:center; font-size:36px; color:#ffd800; margin:4px 0 18px; }

/* Campos estilo pill */
.mc-field { display:block; margin:10px 20px; }
.mc-field label { display:block; color:#ffd800; font-weight:700; margin-bottom:6px; font-size:18px; }
.mc-field input { width:100%; padding:16px 20px; border-radius:40px; border:none; font-size:18px; box-shadow: 0 3px 10px rgba(0,0,0,0.4); }

/* Botón */
.mc-submit-wrap { text-align:center; margin-top:18px; }
.mc-submit-btn { background: #ffd800; color:#1b1b1b; font-weight:800; padding:14px 38px; border-radius:40px; border: none; font-size:20px; cursor:pointer; box-shadow:0 6px 12px rgba(0,0,0,0.25); }

/* Mensaje final abajo */
.mc-thanks { display:none; text-align:center; margin-top:26px; color:#ffd800; font-weight:700; font-size:20px; }

/* Responsive */
@media (max-width: 900px) {
    .mc-tab { min-height: 720px; }
    #mc-code-input { font-size:26px; padding:14px 18px; }
    .mc-title { font-size:28px; }
    .mc-form-container { padding:18px; }
}

@media (max-width: 480px) {
    .mc-tabs { padding:0 8px; }
    .mc-tab { min-height: 760px; background-position: center top; }
    .mc-title { font-size:20px; }
    #mc-code-input { font-size:22px; padding:12px; }
    .mc-arrow-btn { width:52px; height:52px; font-size:20px; }
    .mc-field input { padding:12px; font-size:16px; }
    .mc-form-title { font-size:24px; }
    .mc-submit-btn { padding:12px 22px; font-size:16px; }
    .mc-sello img { max-width:110px; }
    .mc-overlay { padding:14px; }
}