:root { --mensual-rojo: var(--marca-rojo, #e92123); --mensual-rojo-fuerte: var(--marca-rojo-fuerte, #b91517); }
.pagina-mensual { background:#111; color:#fff; }
.mensual-ancho { width:min(1180px, calc(100% - 48px)); margin:0 auto; }
.mensual-hero { position:relative; overflow:hidden; padding:150px 0 90px; background:linear-gradient(90deg,rgba(7,7,7,.94),rgba(12,12,12,.68)),url('../images/hero.jpg') center/cover; }
.mensual-hero::after { content:""; position:absolute; width:380px; height:380px; right:-120px; top:80px; border-radius:50%; background:rgba(233,33,35,.17); filter:blur(12px); }
.mensual-hero-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr); gap:70px; align-items:center; position:relative; z-index:1; }
.mensual-migas { display:flex; gap:9px; align-items:center; color:#bdbdbd; font:500 .82rem 'DM Sans',sans-serif; margin-bottom:24px; }
.mensual-migas a { color:#fff; text-decoration:none; }
.mensual-kicker { margin:0 0 12px; color:#ff6264; font:800 .78rem 'Outfit',sans-serif; letter-spacing:.13em; text-transform:uppercase; }
.mensual-hero h1 { margin:0; max-width:780px; font:800 clamp(2.45rem,5vw,4.7rem)/1.02 'Outfit',sans-serif; letter-spacing:-.04em; }
.mensual-reclamo { display:inline-block; margin:26px 0 16px; padding:10px 14px; border:1px solid rgba(255,255,255,.18); border-radius:999px; background:rgba(233,33,35,.16); color:#fff; font:800 clamp(1.1rem,2vw,1.45rem) 'Outfit',sans-serif; }
.mensual-hero-texto { max-width:720px; margin:0; color:#d1d1d1; font:400 1.02rem/1.78 'DM Sans',sans-serif; }
.mensual-acciones { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
.mensual-btn-secundario { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 24px; border:1px solid rgba(255,255,255,.4); border-radius:8px; color:#fff; text-decoration:none; font:700 .95rem 'Outfit',sans-serif; }
.mensual-btn-secundario:hover { border-color:#fff; background:rgba(255,255,255,.08); }
.mensual-nota-precio { max-width:760px; margin:18px 0 0; color:#aaa; font:400 .78rem/1.55 'DM Sans',sans-serif; }
.mensual-hero-panel { padding:34px; border:1px solid rgba(255,255,255,.15); border-radius:22px; background:rgba(19,19,19,.83); backdrop-filter:blur(12px); box-shadow:0 22px 70px rgba(0,0,0,.35); }
.mensual-precio-grande { display:flex; align-items:flex-end; gap:10px; padding-bottom:24px; border-bottom:1px solid rgba(255,255,255,.12); }
.mensual-precio-grande span { color:#fff; font:800 4.7rem/.9 'Outfit',sans-serif; letter-spacing:-.06em; }
.mensual-precio-grande small { padding-bottom:7px; color:#bbb; font:700 .95rem 'Outfit',sans-serif; }
.mensual-beneficio { display:flex; gap:13px; align-items:center; padding-top:20px; color:#e6e6e6; font:600 .92rem 'DM Sans',sans-serif; }
.mensual-beneficio i { width:24px; color:#ff4548; text-align:center; }
.mensual-seccion { padding:88px 0; }
.mensual-clara { background:#f7f7f7; color:#1b1b1b; }
.mensual-oscura { background:#171717; color:#fff; }
.mensual-encabezado-seccion { max-width:790px; margin-bottom:42px; }
.mensual-encabezado-seccion h2,.mensual-final h2 { margin:0 0 14px; font:800 clamp(2rem,3.5vw,3rem)/1.08 'Outfit',sans-serif; letter-spacing:-.03em; }
.mensual-encabezado-seccion > p:not(.mensual-kicker) { margin:0; color:#666; font:400 1rem/1.8 'DM Sans',sans-serif; }
.mensual-oscura .mensual-encabezado-seccion > p:not(.mensual-kicker) { color:#b5b5b5; }
.mensual-pasos { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.mensual-paso,.mensual-tres-columnas article { position:relative; padding:30px; border-radius:18px; background:#fff; border:1px solid #e7e7e7; box-shadow:0 12px 35px rgba(0,0,0,.06); }
.mensual-numero { position:absolute; top:18px; right:22px; color:rgba(233,33,35,.12); font:800 3.4rem 'Outfit',sans-serif; }
.mensual-paso h3,.mensual-tres-columnas h3 { position:relative; margin:38px 0 12px; font:800 1.22rem 'Outfit',sans-serif; }
.mensual-paso p,.mensual-tres-columnas p { margin:0; color:#666; font:400 .94rem/1.7 'DM Sans',sans-serif; }
.mensual-tabla-wrap { overflow-x:auto; border:1px solid #333; border-radius:18px; }
.mensual-tabla { width:100%; min-width:690px; border-collapse:collapse; background:#1d1d1d; }
.mensual-tabla th,.mensual-tabla td { padding:20px 24px; border-bottom:1px solid #333; text-align:left; font:500 .95rem 'DM Sans',sans-serif; }
.mensual-tabla thead th { background:#222; color:#fff; font-weight:800; }
.mensual-tabla tbody th { color:#ddd; font-weight:700; }
.mensual-tabla tbody td:nth-child(2) { color:#fff; background:rgba(233,33,35,.08); font-weight:700; }
.mensual-tabla tbody td:last-child { color:#aaa; }
.mensual-tres-columnas { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.mensual-tres-columnas article > i { display:grid; place-items:center; width:50px; height:50px; border-radius:14px; background:rgba(233,33,35,.1); color:var(--mensual-rojo); font-size:1.2rem; }
.mensual-tres-columnas h3 { margin-top:22px; }
.mensual-requisitos-grid { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; }
.mensual-requisitos-grid .mensual-encabezado-seccion { margin-bottom:0; }
.mensual-requisitos-lista { list-style:none; margin:0; padding:0; display:grid; gap:14px; }
.mensual-requisitos-lista li { display:flex; gap:14px; align-items:flex-start; padding:18px 20px; border:1px solid #333; border-radius:12px; background:#1e1e1e; color:#eee; font:500 .95rem/1.55 'DM Sans',sans-serif; }
.mensual-requisitos-lista i { color:#ff4548; margin-top:3px; }
.mensual-flota { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.mensual-cargando { grid-column:1/-1; color:#666; font:500 .95rem 'DM Sans',sans-serif; }
.mensual-coche { overflow:hidden; border-radius:16px; border:1px solid #e1e1e1; background:#fff; box-shadow:0 10px 28px rgba(0,0,0,.06); }
.mensual-coche img { width:100%; aspect-ratio:16/10; object-fit:cover; display:block; }
.mensual-coche-cuerpo { padding:20px; }
.mensual-coche-kicker { color:#888; font:600 .72rem 'DM Sans',sans-serif; text-transform:uppercase; letter-spacing:.07em; }
.mensual-coche h3 { margin:5px 0 18px; color:#222; font:800 1.2rem 'Outfit',sans-serif; }
.mensual-coche a { display:inline-flex; min-height:42px; align-items:center; justify-content:center; padding:0 16px; border-radius:8px; background:var(--mensual-rojo); color:#fff; text-decoration:none; font:700 .86rem 'Outfit',sans-serif; }
.mensual-faq { display:grid; gap:10px; max-width:920px; }
.mensual-faq-item { border:1px solid #333; border-radius:12px; background:#1e1e1e; overflow:hidden; }
.mensual-faq-item summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; gap:20px; align-items:center; padding:20px 22px; color:#fff; font:700 .98rem 'Outfit',sans-serif; }
.mensual-faq-item summary::-webkit-details-marker { display:none; }
.mensual-faq-item summary i { color:#ff4548; transition:transform .2s; }
.mensual-faq-item[open] summary i { transform:rotate(180deg); }
.mensual-faq-item p { margin:0; padding:0 22px 22px; color:#b5b5b5; font:400 .94rem/1.72 'DM Sans',sans-serif; }
.mensual-final { padding:90px 0; background:linear-gradient(100deg,rgba(9,9,9,.96),rgba(70,6,7,.86)),url('../images/footer.jpg') center/cover; }
.mensual-final-contenido { max-width:820px; margin-left:auto; margin-right:auto; text-align:center; }
.mensual-final-contenido > p:not(.mensual-kicker) { color:#d1d1d1; font:400 1rem/1.75 'DM Sans',sans-serif; }
.mensual-final .btn-principal { margin-top:18px; }
.mensual-final small { display:block; margin-top:14px; color:#aaa; font:400 .8rem 'DM Sans',sans-serif; }
@media (max-width:900px) { .mensual-hero-grid,.mensual-requisitos-grid { grid-template-columns:1fr; gap:38px; } .mensual-hero-panel { max-width:520px; } .mensual-pasos,.mensual-tres-columnas,.mensual-flota { grid-template-columns:1fr 1fr; } }
@media (max-width:620px) { .mensual-ancho { width:min(100% - 32px,1180px); } .mensual-hero { padding:75px 0 58px; } .mensual-seccion,.mensual-final { padding:60px 0; } .mensual-hero h1 { font-size:2.3rem; } .mensual-precio-grande span { font-size:3.8rem; } .mensual-pasos,.mensual-tres-columnas,.mensual-flota { grid-template-columns:1fr; } .mensual-paso,.mensual-tres-columnas article { padding:24px; } .mensual-acciones a { width:100%; } }