:root{
  --hkb-rojo:#ef2436;
  --hkb-rojo2:#ff5968;
  --hkb-fondo:#060607;
  --hkb-texto:rgba(255,255,255,.67);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body.pagina-historia-kb{margin:0;background:var(--hkb-fondo);color:#fff;font-family:Arial,Helvetica,sans-serif}
body.pagina-historia-kb a{text-decoration:none;color:inherit}
.hkb-contenedor{width:min(1180px,calc(100% - 40px));margin:auto}

.hkb-header{position:fixed;inset:0 0 auto;z-index:1000;height:78px;background:rgba(5,5,6,.86);border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(16px)}
.hkb-header-inner{width:min(1240px,calc(100% - 34px));height:100%;margin:auto;display:flex;align-items:center;gap:26px}
.hkb-logo img{width:84px;max-height:54px;object-fit:contain}
.hkb-nav{display:flex;gap:22px;margin-left:auto}
.hkb-nav a{font-size:10px;font-weight:900;letter-spacing:.8px;text-transform:uppercase;color:rgba(255,255,255,.62)}
.hkb-nav a:hover{color:#fff}
.hkb-cta,.hkb-boton{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 22px;border-radius:999px;background:var(--hkb-rojo);color:#fff!important;font-size:10px;font-weight:900;letter-spacing:.8px;text-transform:uppercase;box-shadow:0 14px 34px rgba(239,36,54,.22)}

.hkb-hero{position:relative;min-height:92vh;padding:145px 0 75px;display:flex;align-items:center;overflow:hidden;background:radial-gradient(circle at 78% 44%,rgba(239,36,54,.18),transparent 29%),linear-gradient(180deg,#050506,#14090b 64%,#060607)}
.hkb-hero::after{content:"HISTORIA";position:absolute;top:11%;left:2.8vw;color:rgba(255,255,255,.04);font-size:clamp(98px,13vw,205px);font-weight:900;line-height:.82;letter-spacing:-9px;white-space:nowrap;pointer-events:none}
.hkb-trama{position:absolute;inset:0;opacity:.13;background:linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px);background-size:74px 74px}
.hkb-hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.15fr .85fr;gap:82px;align-items:center}
.hkb-etiqueta{display:block;margin-bottom:18px;color:var(--hkb-rojo2);font-size:10px;font-weight:900;letter-spacing:2px;text-transform:uppercase}
.hkb-hero h1,.hkb-seccion h2,.hkb-final h2{margin:0;text-transform:uppercase;line-height:.88;letter-spacing:-4px}
.hkb-hero h1{font-size:clamp(62px,7.6vw,122px)}
.hkb-hero h1 strong{display:block;color:var(--hkb-rojo);white-space:nowrap}
.hkb-hero p{max-width:690px;margin:30px 0 26px;color:var(--hkb-texto);font-size:18px;line-height:1.76}
.hkb-sello{width:min(100%,440px);aspect-ratio:1;margin-left:auto;border:1px solid rgba(239,36,54,.27);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 0 70px rgba(239,36,54,.12),inset 0 0 65px rgba(239,36,54,.04)}
.hkb-sello strong{color:var(--hkb-rojo);font-size:clamp(82px,10vw,145px);line-height:.8}
.hkb-sello span{margin-top:22px;font-size:9px;font-weight:900;letter-spacing:2px}

.hkb-seccion{padding:120px 0;scroll-margin-top:82px}
.hkb-seccion h2,.hkb-final h2{font-size:clamp(46px,5.7vw,84px)}
.hkb-dos-columnas{display:grid;grid-template-columns:.92fr 1.08fr;gap:90px}
.hkb-texto p{color:var(--hkb-texto);font-size:17px;line-height:1.82}
.hkb-texto .hkb-destacado{margin-top:0;color:#fff;font-size:24px;line-height:1.48}

.hkb-cronologia{background:#0b0b0d}
.hkb-cabecera{max-width:820px;margin-bottom:56px}
.hkb-cabecera>p{color:var(--hkb-texto);font-size:17px;line-height:1.7}
.hkb-linea{position:relative;border-top:1px solid rgba(255,255,255,.1)}
.hkb-linea::before{content:"";position:absolute;left:178px;top:0;bottom:0;width:1px;background:rgba(239,36,54,.22)}
.hkb-linea article{display:grid;grid-template-columns:150px 1fr;gap:56px;padding:38px 0;border-bottom:1px solid rgba(255,255,255,.09)}
.hkb-fecha{color:var(--hkb-rojo);font-size:28px;font-weight:900;letter-spacing:-1px}
.hkb-linea h3{margin:0 0 12px;font-size:32px;text-transform:uppercase;letter-spacing:-1px}
.hkb-linea p{max-width:760px;margin:0;color:var(--hkb-texto);font-size:16px;line-height:1.75}

.hkb-valores{background:#070708}
.hkb-valores-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.hkb-valores-grid article{min-height:265px;padding:28px;border:1px solid rgba(255,255,255,.08);border-radius:19px;background:linear-gradient(145deg,rgba(239,36,54,.05),rgba(255,255,255,.012));transition:.28s}
.hkb-valores-grid article:hover{transform:translateY(-5px);border-color:rgba(239,36,54,.35);box-shadow:0 20px 50px rgba(0,0,0,.3)}
.hkb-valores-grid span{color:rgba(239,36,54,.5);font-size:42px;font-weight:900}
.hkb-valores-grid h3{margin:54px 0 13px;font-size:26px;text-transform:uppercase}
.hkb-valores-grid p{margin:0;color:var(--hkb-texto);font-size:14px;line-height:1.7}

.hkb-djik{background:#10090b}
.hkb-final{padding:120px 0;text-align:center;background:radial-gradient(circle,rgba(239,36,54,.15),transparent 38%),#15090b}
.hkb-final h2{max-width:900px;margin:auto}
.hkb-final p{color:var(--hkb-texto);font-size:17px;line-height:1.7}
.hkb-final .hkb-boton{margin-top:28px}

@media(max-width:1000px){
  .hkb-nav{display:none}
  .hkb-hero-grid,.hkb-dos-columnas{grid-template-columns:1fr}
  .hkb-sello{margin:auto}
  .hkb-valores-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:680px){
  .hkb-contenedor{width:min(100% - 28px,1180px)}
  .hkb-header{height:68px}.hkb-cta{font-size:8px;padding:0 13px}
  .hkb-hero{min-height:auto;padding:112px 0 70px}
  .hkb-hero h1{font-size:clamp(48px,13vw,70px);letter-spacing:-3px}
  .hkb-hero h1 strong{white-space:normal}
  .hkb-hero::after{top:11%;left:4vw;font-size:clamp(58px,18vw,92px);letter-spacing:-5px}
  .hkb-seccion{padding:86px 0}
  .hkb-seccion h2,.hkb-final h2{font-size:clamp(39px,12vw,60px);letter-spacing:-2px}
  .hkb-linea::before{display:none}
  .hkb-linea article{grid-template-columns:1fr;gap:14px}
  .hkb-valores-grid{grid-template-columns:1fr}
}

.hkb-reveal{opacity:0;transform:translateY(22px);transition:opacity .65s ease,transform .65s ease}.hkb-reveal.visible{opacity:1;transform:none}@media(prefers-reduced-motion:reduce){.hkb-reveal{opacity:1;transform:none}}

/* =========================================================
   RETOQUES FINALES — HISTORIA DEL KICKBOXING
========================================================= */

/* Palabra HISTORIA un poco más arriba */
.hkb-hero::after {
  top: 5.8% !important;
}

/* Más presencia para el sello 1960s */
.hkb-sello {
  border-color: rgba(239,36,54,.42) !important;
  box-shadow:
    0 0 92px rgba(239,36,54,.20),
    inset 0 0 75px rgba(239,36,54,.07) !important;
}

.hkb-sello strong {
  text-shadow: 0 0 24px rgba(239,36,54,.32) !important;
}

/* Texto editorial algo más estrecho para mejorar lectura */
.hkb-texto {
  max-width: 760px !important;
}

/* Cronología con años más destacados */
.hkb-fecha {
  font-size: 34px !important;
  letter-spacing: -1.5px !important;
}

/* Interacción suave en cada hito */
.hkb-linea article {
  transition: background .28s ease, transform .28s ease, box-shadow .28s ease !important;
  border-radius: 14px !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.hkb-linea article:hover {
  background: linear-gradient(90deg, rgba(239,36,54,.055), transparent 75%) !important;
  transform: translateX(6px) !important;
  box-shadow: inset 3px 0 0 rgba(239,36,54,.42) !important;
}

/* Más aire entre título y texto en Kickboxing en DJIK */
.hkb-djik .hkb-dos-columnas {
  gap: 110px !important;
}

/* Cierre con más fuerza */
.hkb-final-frase {
  margin-top: 6px !important;
  color: #fff !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  letter-spacing: .2px !important;
}

@media (max-width: 1000px) {
  .hkb-djik .hkb-dos-columnas {
    gap: 52px !important;
  }
}

@media (max-width: 680px) {
  .hkb-hero::after {
    top: 7% !important;
  }

  .hkb-linea article {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .hkb-linea article:hover {
    transform: none !important;
    box-shadow: none !important;
  }
}


/* Ajustes finales Historia KB */
.hkb-hero::after{
  top:4.8%!important;
}

.hkb-linea article{
  padding-top:52px!important;
  padding-bottom:52px!important;
}

.hkb-texto .hkb-destacado{
  font-size:26px!important;
  font-weight:700!important;
  line-height:1.55!important;
}


/* =========================================================
   CORRECCIÓN REAL — BAJAR HISTORIA EN KICKBOXING
========================================================= */
.hkb-hero::after {
  top: 9.5% !important;
}


/* Ajuste palabra HISTORIA */
.hkb-hero::after{top:9.8%!important;}


/* ===== Igualar tamaño visual del emblema derecho ===== */
.hkb-hero-grid {
  grid-template-columns: minmax(0, 1fr) minmax(380px, 520px) !important;
  align-items: center !important;
}

.hkb-sello {
  width: min(100%, 500px) !important;
  aspect-ratio: 1 !important;
  margin-left: auto !important;
}

@media (max-width: 1000px) {
  .hkb-hero-grid {
    grid-template-columns: 1fr !important;
  }
  .hkb-sello {
    margin: auto !important;
  }
}


/* ===== Ajuste final: evitar que el sello invada el título ===== */
.hkb-hero::after{
  content:"HISTORIA" !important;
  top:7.4% !important;
  left:2.6vw !important;
  font-size:clamp(92px,11.5vw,180px) !important;
  letter-spacing:-7px !important;
}
.hkb-hero-grid{
  grid-template-columns:minmax(0,1fr) minmax(360px,500px) !important;
  gap:110px !important;
  align-items:center !important;
}
.hkb-hero-grid > div:first-child{
  max-width:720px !important;
}
.hkb-sello{
  width:min(100%,460px) !important;
  margin-left:auto !important;
}
@media (max-width:1200px){
  .hkb-hero-grid{gap:88px !important;}
}
@media (max-width:1000px){
  .hkb-hero::after{content:"HISTORIA" !important; top:8.6% !important;}
  .hkb-hero-grid{grid-template-columns:1fr !important; gap:36px !important;}
  .hkb-sello{width:min(100%,420px) !important; margin:auto !important;}
}
@media (max-width:680px){
  .hkb-hero::after{font-size:clamp(56px,16vw,86px) !important; letter-spacing:-4px !important;}
  .hkb-sello{width:min(100%,340px) !important;}
}


/* Ajuste final unificado de títulos */
.hkb-hero h1{font-size:clamp(58px,6.9vw,104px)!important;line-height:.9!important;letter-spacing:-3px!important;}
.hkb-hero h1 strong{display:block!important;white-space:nowrap!important;}
@media (max-width: 900px){.hkb-hero h1{font-size:clamp(46px,12vw,70px)!important;}}