/* =====================================================================
   ESTILOS — colores y tipografía de la portada
   Para cambiar el rojo de toda la web, cambia --rojo.
   ===================================================================== */
:root{
  --rojo:#D40000;
  --rojo-claro:#FF2A2A;
  --negro:#111111;
  --gris-texto:#333333;
  --gris-suave:#555555;
  --fondo-gris:#F4F4F4;
  --borde:#ECECEC;
  --titular:'Anton', Impact, sans-serif;
  --texto:'Montserrat', 'Helvetica Neue', Arial, sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--negro);font-family:var(--texto);font-size:17px;line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:var(--negro)}a:hover{color:#C80000}
.contenedor{max-width:1200px;margin:0 auto;padding:0 24px}
.seccion{padding:104px 0}
.gris{background:var(--fondo-gris)}
.negro{background:var(--negro);color:#fff}
.etiqueta{margin:0;font-size:14px;font-weight:800;letter-spacing:4px;text-transform:uppercase;color:var(--rojo)}
.h2{margin:0;font-family:var(--titular);font-weight:400;font-size:clamp(40px,6vw,64px);line-height:1.02}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:14px 28px;border-radius:6px;font-weight:800;font-size:16px;text-transform:uppercase;letter-spacing:1px;text-decoration:none;border:2px solid transparent;cursor:pointer;font-family:inherit}
.btn-rojo{background:var(--rojo);color:#fff}.btn-rojo:hover{background:#B00000;color:#fff}
.btn-borde{border-color:var(--negro);color:var(--negro);background:transparent}
.btn-negro{background:var(--negro);color:#fff}.btn-negro:hover{background:#333;color:#fff}

/* NAV */
.nav{border-bottom:1px solid var(--borde);background:#fff;position:sticky;top:0;z-index:10}
.nav .contenedor{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-top:14px;padding-bottom:14px}
.marca{text-decoration:none;font-size:15px;font-weight:500;letter-spacing:4px;text-transform:uppercase}
.menu{display:flex;flex-wrap:wrap;align-items:center;gap:24px;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:1px}
.menu a{text-decoration:none}
.menu .btn{padding:10px 20px;font-size:14px;min-height:44px}

/* HERO */
.hero .contenedor{display:flex;flex-wrap:wrap;align-items:center;gap:64px;padding-top:72px;padding-bottom:88px}
.hero-texto{flex:999 1 520px;min-width:0;display:flex;flex-direction:column;gap:22px}
.t-como{margin:0;font-size:clamp(30px,4vw,46px);font-weight:800;letter-spacing:10px;line-height:1.1}
.t-desactivar{margin:0;font-family:var(--titular);font-size:clamp(64px,10vw,112px);line-height:.98;color:var(--rojo)}
.t-crisis{margin:0;font-family:var(--titular);font-size:clamp(88px,13vw,150px);line-height:.95}
.t-matri{margin:0;font-family:var(--titular);font-size:clamp(38px,5.8vw,66px);line-height:1.05;letter-spacing:1px}
.hero-sub{margin:0;max-width:560px;font-size:19px;font-weight:600;line-height:1.5;text-transform:uppercase}
.hero-sub span{color:var(--rojo)}
.botones{display:flex;flex-wrap:wrap;gap:14px}
.nota{margin:0;font-size:14px;font-weight:500;color:var(--gris-suave)}
.hero-portada{flex:1 1 320px;min-width:0;display:flex;justify-content:center}
.hero-portada img{width:380px;border-radius:4px;box-shadow:0 30px 60px rgba(0,0,0,.22),0 0 0 1px #E6E6E6}

/* FRANJA */
.franja .contenedor{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:28px;padding-top:40px;padding-bottom:40px;text-align:center}
.reloj{font-family:'Share Tech Mono',monospace;font-size:44px;line-height:1;color:var(--rojo-claro);background:#000;border:2px solid #333;border-radius:8px;padding:10px 18px}
.franja p{margin:0;font-family:var(--titular);font-size:clamp(26px,3.4vw,38px);line-height:1.15}
.franja p span{color:var(--rojo-claro)}

/* LIBRO */
.libro-cab{display:flex;flex-wrap:wrap;gap:48px;align-items:flex-end;margin-bottom:56px}
.libro-cab > div{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:12px}
.libro-cab > p{flex:999 1 460px;min-width:0;margin:0;font-size:18px;line-height:1.7;color:var(--gris-texto)}
.tarjetas{display:flex;flex-wrap:wrap;gap:24px}
.tarjeta{flex:1 1 280px;min-width:0;border:2px solid var(--negro);border-radius:10px;padding:32px 28px;display:flex;flex-direction:column;gap:14px}
.tarjeta p{margin:0;color:var(--gris-texto)}
.tarjeta .mini{font-size:13px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:var(--rojo)}
.tarjeta h3{margin:0;font-family:var(--titular);font-weight:400;font-size:30px;line-height:1.1}
.tarjeta .cierre{font-weight:700;color:var(--negro)}
.ficha{display:flex;flex-wrap:wrap;gap:12px 40px;font-size:15px;color:var(--gris-suave);border-top:1px solid var(--borde);padding-top:24px;margin-top:56px}
.ficha strong{color:var(--negro)}

/* AUTORA */
.autora .contenedor{display:flex;flex-wrap:wrap;align-items:center;gap:64px}
.autora img{flex:0 1 380px;min-width:0;width:380px;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:center top;border-radius:10px;box-shadow:0 24px 48px rgba(0,0,0,.18)}
.autora-texto{flex:999 1 460px;min-width:0;display:flex;flex-direction:column;gap:18px}
.autora-texto p{margin:0;font-size:18px;line-height:1.7;color:var(--gris-texto)}
.autora-texto strong{color:var(--negro)}
.autora-texto .destacado{padding-left:20px;border-left:4px solid var(--rojo);font-size:19px;font-weight:600;color:var(--negro)}

/* COMPRAR */
.comprar-cab{display:flex;flex-direction:column;gap:12px;max-width:760px;margin-bottom:48px}
.comprar-cab p{margin:0;color:var(--gris-texto)}
.compra{display:flex;flex-wrap:wrap;gap:40px;align-items:flex-start}
.opciones{flex:999 1 520px;min-width:0;display:flex;flex-direction:column;gap:16px;border:none;margin:0;padding:0}
.opciones legend{padding:0;margin-bottom:14px;font-size:15px;font-weight:800;text-transform:uppercase;letter-spacing:2px}
.opcion{display:flex;gap:16px;align-items:flex-start;border:2px solid #D0D0D0;border-radius:10px;padding:22px;cursor:pointer}
.opcion:has(input:checked){border-color:var(--rojo)}
.opcion input{width:22px;height:22px;margin:2px 0 0;accent-color:#C80000;flex:0 0 22px}
.opcion span{display:flex;flex-direction:column;gap:4px}
.opcion b{font-size:18px}
.opcion small{font-size:15px;color:var(--gris-suave)}
.opcion .precio{font-weight:800;color:var(--rojo)}
.aviso{margin:0;font-size:14px;color:var(--gris-texto);background:#FFF1F1;border-radius:8px;padding:12px 16px}
.resumen{flex:1 1 320px;min-width:0;background:var(--negro);color:#fff;border-radius:12px;padding:32px;display:flex;flex-direction:column;gap:18px}
.resumen-libro{display:flex;gap:16px;align-items:center}
.resumen-libro img{width:64px;border-radius:2px}
.resumen-libro b{font-family:var(--titular);font-weight:400;font-size:20px;line-height:1.2;display:block}
.resumen-libro small{font-size:14px;color:#BDBDBD}
.linea{height:1px;background:#333}
.fila{display:flex;justify-content:space-between;gap:12px}
.total{align-items:baseline}
.total span:first-child{font-weight:800;text-transform:uppercase;letter-spacing:1px}
.total span:last-child{font-family:var(--titular);font-size:44px;line-height:1;color:#FF3B3B}
.resumen .btn{min-height:56px;font-size:17px}
.seguro{margin:0;display:flex;gap:10px;align-items:center;font-size:13px;color:#BDBDBD}
.error{margin:0;font-size:14px;color:#FFB3B3}

/* OPINIONES */
.opiniones-lista{display:flex;flex-wrap:wrap;gap:24px;margin:48px 0}
.opinion{flex:1 1 280px;min-width:0;margin:0;background:#fff;border-radius:10px;padding:28px;display:flex;flex-direction:column;gap:14px}
.opinion .estrellas{font-size:20px;letter-spacing:3px;color:var(--rojo)}
.opinion blockquote{margin:0;font-size:17px;line-height:1.6;color:#222}
.opinion figcaption{font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:1px;color:var(--gris-suave)}
.sin-opiniones{margin:0;font-size:18px;color:var(--gris-texto)}
.form-opinion{background:#fff;border:2px solid var(--negro);border-radius:12px;padding:36px;display:flex;flex-direction:column;gap:20px}
.form-opinion h3{margin:0;font-family:var(--titular);font-weight:400;font-size:34px;line-height:1.1}
.campos{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.campo{display:flex;flex-direction:column;gap:6px}
.campo label,.campo legend{font-size:14px;font-weight:700;padding:0}
.campo input,.campo textarea{font-family:inherit;font-size:16px;padding:13px 16px;border:1.5px solid #8A8A8A;border-radius:8px;min-height:48px}
.estrellas-input{display:flex;gap:4px;border:none;margin:0;padding:0}
.estrellas-input button{width:44px;height:44px;border:none;background:none;padding:0;cursor:pointer;font-size:32px;line-height:1;color:#C4C4C4}
.estrellas-input button.on{color:var(--rojo)}
.form-opinion .btn{align-self:flex-start}
.mensaje{margin:0;font-size:15px;font-weight:600}

/* FOOTER */
.pie .contenedor{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding-top:40px;padding-bottom:40px;font-size:14px;color:#BDBDBD}
.pie p{margin:0}
.pie .marca{color:#fff;letter-spacing:3px}
.pie nav{display:flex;flex-wrap:wrap;gap:24px}
.pie nav a{text-decoration:none;color:#BDBDBD}.pie nav a:hover{color:#fff}

@media (max-width:640px){
  .seccion{padding:72px 0}
  .menu{gap:16px}
  .menu a:not(.btn){display:none}
}