/* Hero de la web México (Anexo E): una sola pieza para la home (/mx) y las páginas de categoría (/mx/tours/…).
   Partial: resources/views/client/mx/_hero.blade.php. Cargado con ?v=filemtime desde ambas plantillas. */
.kvmx-hero{background:linear-gradient(135deg,#1d3557 0%,#457b9d 100%);color:#fff;padding:52px 0 44px;margin-bottom:26px;position:relative;z-index:5}
.kvmx-hero .container{position:relative}
.kvmx-hero h1{position:static!important;top:auto!important;left:auto!important;transform:none!important;width:auto!important;max-width:820px;text-align:left!important;text-transform:none!important;letter-spacing:0!important;text-shadow:none!important;font-size:34px!important;font-weight:700;line-height:1.2;margin:0 0 10px!important;padding:0!important;color:#fff!important}
.kvmx-hero h1 .kvmx-h1-sub{display:block;font-size:.55em;font-weight:500;letter-spacing:0;opacity:.92;margin-top:6px}
.kvmx-hero p{font-size:17px;max-width:760px;margin:0 0 22px;color:#fff!important;opacity:.95}
.kvmx-hero .kvmx-datos{font-size:16px;margin:0 0 20px}
.kvmx-hero .kvmx-datos b{color:#ffb703;font-weight:700}
.kvmx-hero.con-foto{background:linear-gradient(90deg,rgba(20,38,66,.86) 0%,rgba(20,38,66,.62) 55%,rgba(20,38,66,.25) 100%),var(--hero) center/cover no-repeat;padding:76px 0 64px}
.kvmx-hero.con-foto.oscura{background-image:linear-gradient(90deg,rgba(20,38,66,.92) 0%,rgba(20,38,66,.8) 60%,rgba(20,38,66,.55) 100%),var(--hero);background-position:center 35%}
/* Categorías: menos alto que la home (en móvil los tours tienen que asomar sobre el pliegue) */
.kvmx-hero.compacto,.kvmx-hero.compacto.con-foto{padding:40px 0 34px;margin-bottom:18px}
.kvmx-hero.compacto h1{font-size:30px!important}
.kvmx-badge{display:inline-block;background:#ff7300;color:#fff;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:5px 10px;border-radius:4px;margin-bottom:12px}
.kvmx-hero .kvmx-promo{font-size:16px;max-width:760px;margin:-6px 0 20px}
.kvmx-hero .kvmx-promo strong{color:#ffb703;font-size:18px}
.kvmx-cta{display:inline-block;margin:0 0 18px;padding:11px 20px;background:#fff;color:#1d3557!important;border-radius:6px;font-weight:700;text-decoration:none!important}
.kvmx-cta:hover{background:#fff4ea}
.kvmx-buscar{display:flex;gap:0;max-width:640px;width:100%}
.kvmx-buscar input{flex:1 1 auto;min-width:0;width:100%;box-sizing:border-box;height:48px;border:0;border-radius:6px 0 0 6px;padding:0 16px;font-size:16px;color:#1d3557}
.kvmx-buscar button{height:48px;border:0;border-radius:0 6px 6px 0;padding:0 22px;white-space:nowrap;flex:0 0 auto;background:#ff7300;color:#fff;font-weight:700;font-size:15px;cursor:pointer}
.kvmx-top{position:absolute;z-index:30;left:15px;right:15px;max-width:640px;margin-top:6px;background:#fff;color:#1d3557;border-radius:10px;box-shadow:0 14px 40px rgba(0,0,0,.28);padding:16px 18px 10px}
.kvmx-hero .kvmx-top-titulo{margin:0 0 8px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#ff7300!important;opacity:1}
.kvmx-top ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:2px 14px;max-height:300px;overflow:auto}
.kvmx-top li a{display:block;padding:7px 4px;border-radius:6px;text-decoration:none!important;color:#1d3557!important;line-height:1.25}
.kvmx-top li a:hover{background:#fff4ea}
.kvmx-top li a b{display:block;font-size:15px}
.kvmx-top li a small{display:block;font-size:12px;color:#6b7683}
.kvmx-hero .kvmx-top-vacio{margin:6px 0 4px;font-size:13px;color:#6b7683!important;opacity:1}
.kvmx-claves{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:22px;font-size:14px}
.kvmx-claves span::before{content:"✓ ";color:#ffb703;font-weight:700}
/* Miga encima del hero (categorías) y chips de páginas relacionadas debajo */
.kvmx-miga{font-size:13px;color:#5a6472;padding:10px 15px 8px;margin:0 auto;background:transparent}
.kvmx-miga a{color:#1d3557;text-decoration:none}
.kvmx-miga a:hover{text-decoration:underline}
.kvmx-miga .sep{margin:0 6px;color:#9aa3ad}
.kvmx-miga li{display:inline}
.kvmx-miga ol{list-style:none;margin:0;padding:0}
.kvmx-relacionados{display:flex;flex-wrap:wrap;gap:8px;margin:-4px auto 14px}
.kvmx-relacionados a,.kvmx-relacionados span{cursor:pointer;display:inline-block;padding:6px 12px;border:1px solid #d9dee5;border-radius:999px;font-size:13px;color:#1d3557!important;background:#fff;text-decoration:none!important;white-space:nowrap}
.kvmx-relacionados a:hover,.kvmx-relacionados span:hover{border-color:#ff7300;color:#ff7300!important}
@media (max-width:767px){
  .kvmx-hero{padding:34px 0 30px}
  .kvmx-hero h1{font-size:24px!important}
  .kvmx-hero p{font-size:15.5px}
  .kvmx-hero .kvmx-datos{font-size:14.5px}
  .kvmx-hero.con-foto{background-image:linear-gradient(180deg,rgba(20,38,66,.55) 0%,rgba(20,38,66,.85) 100%),var(--hero-m);padding:44px 0 34px}
  .kvmx-hero.con-foto.oscura{background-image:linear-gradient(180deg,rgba(20,38,66,.75) 0%,rgba(20,38,66,.92) 100%),var(--hero-m)}
  .kvmx-hero.compacto,.kvmx-hero.compacto.con-foto{padding:26px 0 24px}
  .kvmx-hero.compacto h1{font-size:22px!important}
  .kvmx-hero.compacto .kvmx-claves{display:none}   /* en móvil los tours tienen que asomar sobre el pliegue */
  .kvmx-hero.compacto .kvmx-cta{margin-bottom:12px;padding:9px 16px}
  .kvmx-hero.compacto .kvmx-datos{margin-bottom:14px}
  .kvmx-buscar{flex-direction:column;gap:8px;max-width:100%}
  .kvmx-buscar input,.kvmx-buscar button{border-radius:6px;width:100%;box-sizing:border-box}
  .kvmx-top{left:15px;right:15px;padding:12px 12px 6px}
  .kvmx-top ul{grid-template-columns:repeat(2,1fr);max-height:260px}
  .kvmx-claves{gap:6px 18px;font-size:13.5px;margin-top:16px}
  .kvmx-hero .kvmx-promo{font-size:15px}
  .kvmx-hero .kvmx-promo strong{font-size:16px}
  .kvmx-miga{white-space:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .kvmx-relacionados{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;-webkit-overflow-scrolling:touch}
}
