/* ===============================
   COBERTURA TOTAL SEGUROS
   Estilo corporativo limpio + responsive
   =============================== */

:root{
  --cts-primary:#2563eb;
  --cts-dark:#0f172a;
  --cts-gray:#64748b;
  --cts-bg:#f8fafc;
}

html, body{height:100%;}
body{
  font-family: "Open Sans", Arial, sans-serif;
  background: linear-gradient(180deg,#f8fafc 0%,#eef2ff 100%);
  color:#0b1220;
}

a{color:var(--cts-primary);}
a:hover{color:#1d4ed8; text-decoration:none;}

.corporate-header{
  background: linear-gradient(135deg,#0f172a 0%,#1e3a8a 50%,#2563eb 100%);
  box-shadow: 0 4px 25px rgba(0,0,0,0.18);
}
.logo-ct{
  height:65px;
  border-radius:12px;
  background: rgba(255,255,255,0.08);
  padding:8px;
}
.logo-ct-sm{height:42px;border-radius:10px;padding:6px;}

.navbar-light .navbar-nav .nav-link{color:#0b1220; font-weight:600;}
.navbar-light .navbar-nav .nav-link:hover{color:var(--cts-primary);}

.page-header{
  background: linear-gradient(135deg, rgba(37,99,235,.90) 0%, rgba(15,23,42,.85) 100%);
  color:#fff;
}

.section-title h6{letter-spacing:2px; font-weight:700;}
.section-title h1{font-weight:800;}

.courses-list-item, .courses-item, .service-item{
  border-radius: 16px;
  overflow:hidden;
  box-shadow: 0 10px 30px rgba(2,6,23,.08);
}

footer{
  background: var(--cts-dark);
  color:#cbd5e1;
}
footer p{max-width:720px; margin:auto; text-align:center; font-size:16px; line-height:1.8;}

/* ===== Responsive tweaks ===== */
@media (max-width: 991.98px){
  .container, .container-fluid{padding-left:16px; padding-right:16px;}
  h1.display-4{font-size:2rem;}
}
@media (max-width: 575.98px){
  h1.display-4{font-size:1.75rem;}
  .btn{padding:.6rem 1rem;}
}


/* ===== Typewriter (máquina de escribir) ===== */
.texto-dinamico{ color:#000 !important; font-weight:800; }
#typeword{ color:#2563eb; }
.cursor{
  display:inline-block;
  margin-left:6px;
  color:#2563eb;
  animation: blink 0.9s infinite;
}
@keyframes blink{ 0%,49%{opacity:1;} 50%,100%{opacity:0;} }

/* ===== Cards de Seguros ===== */
.cts-card{
  background:#ffffff;
  border:1px solid rgba(15,23,42,.06);
  border-radius:18px;
  box-shadow: 0 10px 30px rgba(2,6,23,.06);
  transition: transform .2s ease, box-shadow .2s ease;
}
.cts-card h5{ font-weight:800; color:#0b1220; }
.cts-card p{ color:#64748b; }
.cts-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(2,6,23,.10);
}
.cts-icon{
  width:48px; height:48px;
  display:flex; align-items:center; justify-content:center;
  border-radius:14px;
  background: rgba(37,99,235,.10);
  color:#2563eb;
  font-size:20px;
  margin-bottom:14px;
}



/* ===============================
   Ajustes visuales (modo cómodo)
   Menos blanco + mejor mobile
   =============================== */

:root{
  --cts-bg-dark:#0b1220;
  --cts-surface:#0f172a;
  --cts-surface-2:#111c34;
  --cts-text:#e5e7eb;
  --cts-muted:#a3aed0;
  --cts-border: rgba(148,163,184,.18);
}

/* Fondo general más suave para los ojos */
body{
  background: radial-gradient(1200px 600px at 20% 0%, rgba(37,99,235,.25) 0%, rgba(11,18,32,0) 60%),
              radial-gradient(900px 500px at 90% 10%, rgba(99,102,241,.18) 0%, rgba(11,18,32,0) 60%),
              linear-gradient(180deg, var(--cts-bg-dark) 0%, #060a16 100%) !important;
  color: var(--cts-text) !important;
}

/* Secciones: evita fondos blancos por defecto */
.container-fluid, .container{
  color: inherit;
}
.bg-white, .bg-light, .bg-secondary, .bg-primary{
  background: transparent !important;
}

/* Tarjetas / superficies */
.card, .cts-card, .service-item, .courses-item, .courses-list-item, .bg-white.p-5, .bg-light.p-5{
  background: linear-gradient(180deg, var(--cts-surface) 0%, var(--cts-surface-2) 100%) !important;
  border: 1px solid var(--cts-border) !important;
  color: var(--cts-text) !important;
}

.card p, .cts-card p, .service-item p, .courses-item p{ color: var(--cts-muted) !important; }

/* Títulos */
h1, h2, h3, h4, h5, h6{ color: var(--cts-text) !important; }
.section-title h6{ color: #93c5fd !important; }
.section-title p{ color: var(--cts-muted) !important; }

/* Navbar más premium */
.navbar{
  background: rgba(6,10,22,.82) !important;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--cts-border);
}
.navbar-light .navbar-nav .nav-link{
  color: var(--cts-text) !important;
  opacity:.95;
}
.navbar-light .navbar-nav .nav-link:hover{
  color:#93c5fd !important;
}

/* Header/Hero */
.page-header, .corporate-header{
  background: radial-gradient(700px 260px at 50% 20%, rgba(37,99,235,.35) 0%, rgba(15,23,42,.15) 70%),
              linear-gradient(135deg, rgba(15,23,42,.92) 0%, rgba(37,99,235,.55) 100%) !important;
}

/* Inputs */
.form-control, .custom-select{
  background: rgba(255,255,255,.06) !important;
  border: 1px solid var(--cts-border) !important;
  color: var(--cts-text) !important;
}
.form-control::placeholder{ color: rgba(229,231,235,.65) !important; }

/* Botones */
.btn-primary{
  background: #2563eb !important;
  border-color: #2563eb !important;
}
.btn-primary:hover{
  background:#1d4ed8 !important;
  border-color:#1d4ed8 !important;
}

/* Footer */
footer{
  background: #050816 !important;
  border-top: 1px solid var(--cts-border);
}

/* ===== Responsive (teléfono/tableta) ===== */
@media (max-width: 991.98px){
  .logo-ct{height:52px !important;}
  .navbar-brand span{font-size:14px !important; letter-spacing:.3px;}
  .navbar-nav{padding-top:10px;}
  .navbar-nav .nav-link{padding:10px 14px !important; font-size:16px !important;}
}

@media (max-width: 575.98px){
  body{font-size:16px;}
  h1.display-4{font-size:1.85rem !important; line-height:1.15;}
  .section-title h1{font-size:1.6rem !important;}
  .container, .container-fluid{padding-left:14px !important; padding-right:14px !important;}
  .btn{width:100%;}
}

/* ===============================
   Cursor dot (solo escritorio)
   =============================== */
#cursor-dot{
  position: fixed;
  top: 0;
  left: 0;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: rgba(148,163,184,.55);
  box-shadow: 0 0 0 6px rgba(148,163,184,.10);
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 99999;
  mix-blend-mode: normal;
  opacity: 0;
  transition: opacity .15s ease;
}

@media (hover: none){
  #cursor-dot{display:none;}
}


/* ===== Fix: evita "rebote" del título typewriter =====
   El rebote ocurre porque la palabra cambia de ancho ("vida" vs "situación"),
   y el layout se recalcula. Reservamos espacio fijo para la palabra.
*/
#typeword{
  display:inline-block;
  min-width: 14ch;          /* espacio para la palabra más larga */
  white-space: nowrap;
}



/* ===============================
   Glow corporativo (sutil y premium)
   =============================== */
:root{
  --glow-a: rgba(37,99,235,.28);   /* azul corporativo */
  --glow-b: rgba(99,102,241,.18);  /* índigo */
  --glow-c: rgba(14,165,233,.14);  /* cian */
}

/* Animación de halo */
@keyframes ctsGlowPulse {
  0%   { filter: drop-shadow(0 0 0px var(--glow-a)); }
  50%  { filter: drop-shadow(0 0 14px var(--glow-a)) drop-shadow(0 0 26px var(--glow-b)); }
  100% { filter: drop-shadow(0 0 0px var(--glow-a)); }
}

/* Halo tipo "aura" (box-shadow) */
@keyframes ctsAura {
  0%   { box-shadow: 0 0 0 rgba(37,99,235,0), 0 0 0 rgba(99,102,241,0); }
  50%  { box-shadow: 0 0 18px rgba(37,99,235,.22), 0 0 40px rgba(99,102,241,.14); }
  100% { box-shadow: 0 0 0 rgba(37,99,235,0), 0 0 0 rgba(99,102,241,0); }
}

/* Aplica glow al título del hero */
.cts-hero-title,
.hero-header h1,
.page-header h1{
  text-shadow: 0 0 16px rgba(37,99,235,.22);
}

/* Si el typewriter usa #typeword, le damos un glow leve */
#typeword{
  text-shadow: 0 0 16px rgba(59,130,246,.25);
  animation: ctsGlowPulse 4.2s ease-in-out infinite;
}

/* Botón principal con aura */
.btn-primary{
  position: relative;
  overflow: visible;
  animation: ctsAura 5.5s ease-in-out infinite;
}
.btn-primary:focus, .btn-primary:hover{
  box-shadow: 0 0 18px rgba(37,99,235,.28), 0 0 48px rgba(99,102,241,.16) !important;
}

/* Barra de búsqueda / grupo (si existe) */
.input-group, .search-box, .hero-search, .form-row{
  border-radius: 14px;
}

/* Inputs con glow al focus */
.form-control:focus, .custom-select:focus{
  box-shadow: 0 0 0 .2rem rgba(37,99,235,.18) !important;
  border-color: rgba(37,99,235,.55) !important;
}

/* Logo con halo (sutil) */
.logo-ct{
  filter: drop-shadow(0 0 10px rgba(37,99,235,.22));
}
.logo-ct:hover{
  filter: drop-shadow(0 0 14px rgba(37,99,235,.30)) drop-shadow(0 0 26px rgba(99,102,241,.16));
}

/* Respeta accesibilidad: reduce animación si el usuario lo pide */
@media (prefers-reduced-motion: reduce){
  #typeword, .btn-primary{ animation: none !important; }
}



/* ===============================
   Hero azul marino + shaders
   =============================== */
.hero-header, .page-header, .corporate-header, .header-carousel, .carousel-item, .owl-carousel-item{
  position: relative;
  background: linear-gradient(135deg, #071026 0%, #0b1b3a 45%, #0a2a5a 100%) !important;
  color: #e5e7eb !important;
}

.hero-header::before,
.page-header::before,
.corporate-header::before,
.header-carousel::before,
.carousel-item::before,
.owl-carousel-item::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  /* "shaders": capas de luz suave */
  background:
    radial-gradient(900px 420px at 18% 22%, rgba(59,130,246,.35) 0%, rgba(59,130,246,0) 60%),
    radial-gradient(700px 360px at 85% 18%, rgba(99,102,241,.25) 0%, rgba(99,102,241,0) 62%),
    radial-gradient(800px 500px at 55% 78%, rgba(14,165,233,.16) 0%, rgba(14,165,233,0) 65%),
    linear-gradient(180deg, rgba(2,6,23,.10) 0%, rgba(2,6,23,.55) 100%);
  mix-blend-mode: screen;
  opacity: .85;
}

.hero-header::after,
.page-header::after,
.corporate-header::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  /* viñeta suave */
  background: radial-gradient(circle at center, rgba(0,0,0,0) 0%, rgba(0,0,0,.35) 70%, rgba(0,0,0,.55) 100%);
  opacity:.55;
}

/* Asegura que el contenido esté arriba de los shaders */
.hero-header > *,
.page-header > *,
.corporate-header > *,
.header-carousel > *,
.carousel-item > *,
.owl-carousel-item > *{
  position: relative;
  z-index: 1;
}

/* Texto del hero */
.hero-header h1, .page-header h1, .corporate-header h1{
  color:#f1f5f9 !important;
}
.hero-header p, .page-header p, .corporate-header p,
.hero-header span, .page-header span, .corporate-header span{
  color: rgba(241,245,249,.78) !important;
}


/* ==========================================
   FIX MOBILE LAYOUT - COBERTURA TOTAL
   ========================================== */

.cts-brand-text{
  display:inline-block;
  max-width:100%;
}

@media (min-width: 992px){
  .cts-brand-text{
    white-space:nowrap;
  }
}

@media (max-width: 991.98px){
  .container,
  .container-fluid{
    padding-left:16px !important;
    padding-right:16px !important;
  }

  .corporate-header.py-2.d-lg-none .d-flex{
    flex-direction:column;
    align-items:flex-start !important;
    justify-content:flex-start !important;
    gap:8px;
  }

  .corporate-header.py-2.d-lg-none a{
    width:100%;
  }

  .corporate-header.py-2.d-lg-none .text-right{
    text-align:left !important;
    font-size:11px !important;
    line-height:1.4 !important;
    word-break:break-word;
    overflow-wrap:anywhere;
  }

  .logo-ct-sm{
    height:38px !important;
    width:auto;
  }

  .navbar{
    padding:10px 14px !important;
  }

  .navbar-brand{
    display:flex !important;
    align-items:center !important;
    max-width:calc(100% - 58px);
    min-width:0;
    margin-right:8px;
  }

  .navbar-brand .logo-ct{
    height:42px !important;
    width:auto;
    flex-shrink:0;
    padding:5px !important;
    border-radius:10px;
  }

  .navbar-brand .cts-brand-text{
    font-size:13px !important;
    line-height:1.15 !important;
    white-space:normal !important;
    word-break:break-word;
    overflow-wrap:anywhere;
  }

  .navbar-toggler{
    margin-left:auto;
    flex-shrink:0;
    padding:.25rem .5rem;
  }

  .navbar-collapse{
    margin-top:12px;
  }

  .navbar-nav{
    padding-top:8px;
  }

  .navbar-nav .nav-link{
    padding:10px 0 !important;
    font-size:15px !important;
  }

  .dropdown-menu{
    border:none;
    box-shadow:none;
    padding-left:10px;
  }

  .page-header{
    padding-top:48px !important;
    padding-bottom:48px !important;
    margin-bottom:40px !important;
  }

  .page-header .container{
    padding-left:0 !important;
    padding-right:0 !important;
  }

  .page-header h1.display-1,
  .page-header h1.display-4{
    font-size:2rem !important;
    line-height:1.15 !important;
    word-break:break-word;
    overflow-wrap:anywhere;
  }

  .section-title h1{
    line-height:1.2 !important;
    word-break:break-word;
  }

  h1.display-4{
    font-size:2rem !important;
  }

  .page-header .input-group{
    display:flex;
    flex-direction:column;
    width:100%;
  }

  .page-header .input-group-prepend,
  .page-header .input-group-append{
    display:block;
    width:100%;
  }

  .page-header .input-group .dropdown-toggle,
  .page-header .input-group .form-control,
  .page-header .input-group .btn{
    width:100% !important;
    margin:0 0 10px 0 !important;
    border-radius:.35rem !important;
  }

  .page-header .input-group .form-control{
    height:auto !important;
    padding:16px 14px !important;
  }

  .page-header .mx-auto{
    max-width:100% !important;
  }

  .courses-item,
  .courses-list-item,
  .service-item,
  .cts-card{
    margin-bottom:20px;
  }

  footer p{
    font-size:14px;
    line-height:1.7;
  }
}

@media (max-width: 575.98px){
  .logo-ct-sm{
    height:36px !important;
  }

  .navbar-brand .logo-ct{
    height:38px !important;
  }

  .navbar-brand .cts-brand-text{
    font-size:12px !important;
  }

  .page-header h1.display-1,
  .page-header h1.display-4,
  h1.display-4{
    font-size:1.7rem !important;
  }

  .btn{
    padding:.6rem 1rem;
  }
}


/* ==========================================
   FIX EXTRA MOBILE - HERO HOME
   ========================================== */
.cts-home-hero{
  background: linear-gradient(135deg, #071026 0%, #0b1b3a 45%, #0a2a5a 100%) !important;
  color:#e5e7eb;
  overflow:hidden;
}

.cts-home-hero::before,
.cts-home-hero::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}

.cts-home-hero::before{
  background:
    radial-gradient(900px 420px at 18% 22%, rgba(59,130,246,.35) 0%, rgba(59,130,246,0) 60%),
    radial-gradient(700px 360px at 85% 18%, rgba(99,102,241,.25) 0%, rgba(99,102,241,0) 62%),
    radial-gradient(800px 500px at 55% 78%, rgba(14,165,233,.16) 0%, rgba(14,165,233,0) 65%),
    linear-gradient(180deg, rgba(2,6,23,.10) 0%, rgba(2,6,23,.55) 100%);
  mix-blend-mode: screen;
  opacity:.85;
}

.cts-home-hero::after{
  background: radial-gradient(circle at center, rgba(0,0,0,0) 0%, rgba(0,0,0,.35) 70%, rgba(0,0,0,.55) 100%);
  opacity:.55;
}

.cts-home-hero > *{
  position:relative;
  z-index:1;
}

.cts-home-hero .container{
  max-width: 1100px;
}

.cts-home-hero h1,
.cts-home-hero span{
  color:#f1f5f9 !important;
}

.cts-home-hero #typeword{
  color:#93c5fd !important;
}

@media (max-width: 991.98px){
  .cts-home-hero{
    margin-bottom:40px !important;
  }

  .cts-home-hero .container{
    padding-top: 18px !important;
    padding-bottom: 18px !important;
  }

  .cts-home-hero h1:first-child{
    margin-top:0 !important;
    margin-bottom:14px !important;
    font-size:1.25rem !important;
    line-height:1.25 !important;
  }

  .cts-home-hero h1.display-4,
  .cts-home-hero .display-4{
    font-size:2.1rem !important;
    line-height:1.15 !important;
    margin-bottom:24px !important;
    word-break:normal !important;
    overflow-wrap:anywhere;
  }

  .cts-home-hero .mx-auto{
    width:100% !important;
    max-width:100% !important;
  }

  .cts-home-hero .input-group{
    display:flex;
    flex-direction:column;
    width:100%;
  }

  .cts-home-hero .input-group-prepend,
  .cts-home-hero .input-group-append{
    display:block;
    width:100%;
    margin:0;
  }

  .cts-home-hero .input-group .dropdown-toggle,
  .cts-home-hero .input-group .form-control,
  .cts-home-hero .input-group .btn{
    width:100% !important;
    margin:0 0 10px 0 !important;
    border-radius:.35rem !important;
  }

  .cts-home-hero .input-group .form-control{
    height:auto !important;
    padding:16px 14px !important;
  }
}

@media (max-width: 575.98px){
  .cts-home-hero .container{
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }

  .cts-home-hero h1:first-child{
    font-size:1.05rem !important;
  }

  .cts-home-hero h1.display-4,
  .cts-home-hero .display-4{
    font-size:1.75rem !important;
    line-height:1.12 !important;
  }

  .cts-home-hero #typeword{
    display:block;
    min-width:0;
    margin-top:6px;
  }

  .cts-home-hero .cursor{
    display:none;
  }
}


/* ==========================================
   FIX V2 - assets + home hero + mobile nav
   ========================================== */

body{
  overflow-x:hidden;
}

img{
  max-width:100%;
  height:auto;
}

.navbar-brand{
  min-width:0;
}

.navbar-brand img{
  display:block;
}

@media (max-width: 991.98px){
  .navbar .container,
  .navbar .container-fluid{
    padding-left:0 !important;
    padding-right:0 !important;
  }
}

/* Home hero fallback */
.jumbotron.cts-home-hero,
.jumbotron.position-relative.overlay-bottom{
  position:relative;
  overflow:hidden;
  background: linear-gradient(135deg, #071026 0%, #0b1b3a 45%, #0a2a5a 100%) !important;
  color:#f1f5f9 !important;
}

.jumbotron.cts-home-hero .container,
.jumbotron.position-relative.overlay-bottom .container{
  position:relative;
  z-index:2;
}

.jumbotron.cts-home-hero h1,
.jumbotron.position-relative.overlay-bottom h1{
  color:#f1f5f9 !important;
}

@media (max-width: 991.98px){
  .jumbotron.cts-home-hero{
    margin-bottom:40px !important;
  }

  .jumbotron.cts-home-hero .container{
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  .jumbotron.cts-home-hero h1:first-child{
    font-size:1.15rem !important;
    line-height:1.2 !important;
    margin-top:0 !important;
    margin-bottom:0.75rem !important;
  }

  .jumbotron.cts-home-hero .display-4,
  .jumbotron.cts-home-hero .display-1,
  .jumbotron.position-relative.overlay-bottom .display-4,
  .jumbotron.position-relative.overlay-bottom .display-1{
    font-size:2rem !important;
    line-height:1.15 !important;
    margin-bottom:1.25rem !important;
    word-break:normal !important;
    overflow-wrap:anywhere;
  }

  .jumbotron.cts-home-hero .mx-auto{
    max-width:100% !important;
  }

  .jumbotron.cts-home-hero .input-group,
  .jumbotron.position-relative.overlay-bottom .input-group{
    display:flex !important;
    flex-direction:column !important;
    width:100% !important;
  }

  .jumbotron.cts-home-hero .input-group-prepend,
  .jumbotron.cts-home-hero .input-group-append,
  .jumbotron.position-relative.overlay-bottom .input-group-prepend,
  .jumbotron.position-relative.overlay-bottom .input-group-append{
    display:block !important;
    width:100% !important;
    margin:0 !important;
  }

  .jumbotron.cts-home-hero .dropdown-toggle,
  .jumbotron.cts-home-hero .form-control,
  .jumbotron.cts-home-hero .input-group .btn,
  .jumbotron.position-relative.overlay-bottom .dropdown-toggle,
  .jumbotron.position-relative.overlay-bottom .form-control,
  .jumbotron.position-relative.overlay-bottom .input-group .btn{
    width:100% !important;
    margin:0 0 10px 0 !important;
    border-radius:.35rem !important;
  }

  .jumbotron.cts-home-hero .form-control,
  .jumbotron.position-relative.overlay-bottom .form-control{
    height:auto !important;
    padding:16px 14px !important;
  }
}

@media (max-width: 575.98px){
  .jumbotron.cts-home-hero .display-4,
  .jumbotron.cts-home-hero .display-1,
  .jumbotron.position-relative.overlay-bottom .display-4,
  .jumbotron.position-relative.overlay-bottom .display-1{
    font-size:1.65rem !important;
  }

  .jumbotron.cts-home-hero #typeword{
    display:block;
    min-width:0;
    margin-top:6px;
  }

  .jumbotron.cts-home-hero .cursor{
    display:none;
  }
}

/* ==========================================
   FIX V3 - typewriter estable en móvil
   Evita que el alto del hero cambie cuando la palabra se borra
   ========================================== */
@media (max-width: 575.98px){
  .cts-home-hero .cts-hero-title{
    min-height: 2.8em;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
  }

  .cts-home-hero #typeword{
    display:block;
    width:10ch;
    min-width:10ch;
    min-height:1.2em;
    margin:6px auto 0;
    text-align:center;
    white-space:nowrap;
  }
}