/* v4 — Segmentado primero + Home card a no segmentado + portal no segmentado más profesional */

:root{
  --evt-nav: #0B1320;
  --evt-nav-2: #0A0F1A;
  --evt-bg: #F3F5FA;
  --evt-card: #FFFFFF;
  --evt-text: #111827;

  --evt-accent: #5B5BEA;
  --evt-accent-2: #7B4AA8;
  --evt-muted: rgba(255,255,255,.72);
}

body{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
  color: var(--evt-text);
  background: var(--evt-bg);
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.skip-link{
  position:absolute; left:-999px; top:auto; width:1px; height:1px; overflow:hidden;
}
.skip-link:focus{
  left: 1rem; top: 1rem; width:auto; height:auto;
  padding:.5rem .75rem;
  background:#fff; border:2px solid var(--evt-accent);
  border-radius:.5rem;
  z-index: 9999;
}

.evt-header{ background: var(--evt-nav); color:#fff; }
.evt-logo{ width: 240px; height: auto; border-radius: 8px; background:#fff; padding:6px; }
.evt-org{ font-weight: 900; letter-spacing: .3px; line-height: 1.05; font-size: .95rem; }
.evt-sub{ font-size: .7rem; letter-spacing: .6px; opacity: .8; }
.evt-section-title{ font-weight: 900; letter-spacing: .7px; text-transform: uppercase; font-size: 1.15rem; }

.evt-link{ color:#fff; text-decoration:none; font-weight:800; font-size:.9rem; }
.evt-link:hover{ text-decoration:underline; text-underline-offset: 3px; color:#fff; }

.evt-btn-light{
  background: rgba(255,255,255,.92);
  border-color: transparent;
  font-weight: 900;
}
.evt-btn-light:hover{ filter: brightness(.96); }

.evt-menu{
  background: var(--evt-nav-2);
  border-top: 1px solid rgba(255,255,255,.08);
}

.navbar-toggler{
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.2);
  padding: .5rem .75rem;
  border-radius: .375rem;
}
.navbar-toggler:hover{
  background: rgba(255,255,255,.15);
}

#menuContainer{
  justify-content: flex-end;
}

#menuContainer .nav-link{
  color: var(--evt-muted);
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  padding: .35rem .7rem;
  font-weight: 900;
  font-size: .85rem;
}
#menuContainer .nav-link:hover{ color:#fff; background: rgba(255,255,255,.10); }
#menuContainer .nav-link.active{ color:#fff; background: rgba(91,91,234,.22); border-color: rgba(91,91,234,.35); }

@media (max-width: 991.98px) {
  #menuCollapse{
    margin-top: 1rem;
  }
  #menuContainer{
    width: 100%;
  }
  #menuContainer .nav-link{
    width: 100%;
    text-align: left;
  }
}

.evt-banner{ background:#0A0F1A; }
.evt-banner .carousel-item{ height: var(--evt-banner-h, 420px); min-height: 320px; }
.evt-banner .carousel-item img{ object-fit: cover; width:100%; height:100%; }
.evt-banner .evt-banner-overlay{ position:absolute; inset:0; background: linear-gradient(90deg, rgba(11,19,32,.88), rgba(11,19,32,.30), rgba(11,19,32,.12)); pointer-events: none; }
.evt-banner .evt-banner-overlay.opacity-low{ background: transparent; }
.evt-banner .carousel-caption{ text-align:left; left:15%; right:25%; bottom:18%; pointer-events: none; }
.evt-banner .carousel-caption h1{ font-weight: 900; letter-spacing: .4px; text-transform: uppercase; }
.evt-banner .carousel-caption p{ font-size: 1.05rem; opacity: .95; }

.evt-main{ flex: 1; }

/* Surface card (soft) */
.surface{
  background: var(--evt-card);
  border-radius: 14px;
  box-shadow: 0 10px 40px rgba(0,0,0,.08);
  border: 1px solid rgba(0,0,0,.05);
}

/* Segmented tiles - big */
.tile{
  background: linear-gradient(135deg, #004080 0%, #0066cc 100%);
  border-radius: 12px;
  border: none;
  box-shadow: 0 6px 20px rgba(0,51,102,.2);
  padding: 2rem 1.5rem;
  height: 100%;
  transition: transform .3s ease, box-shadow .3s ease;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  text-align: center;
  min-height: 220px;
  overflow: hidden;
}
.tile::before{
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,.1) 0%, rgba(255,255,255,0) 100%);
  opacity: 0;
  transition: opacity .3s ease;
}
.tile:hover{ 
  transform: translateY(-8px); 
  box-shadow: 0 12px 40px rgba(0,51,102,.35);
}
.tile:hover::before{
  opacity: 1;
}

/* Gradientes específicos por card */
.col-12:nth-child(1) .tile{ background: linear-gradient(135deg, #1e40af 0%, #3b82f6 100%) !important; } /* Azul brillante */
.col-12:nth-child(2) .tile{ background: linear-gradient(135deg, #047857 0%, #10b981 100%) !important; } /* Verde esmeralda */
.col-12:nth-child(3) .tile{ background: linear-gradient(135deg, #7c3aed 0%, #a78bfa 100%) !important; } /* Púrpura vibrante */
.col-12:nth-child(4) .tile{ background: linear-gradient(135deg, #dc2626 0%, #f87171 100%) !important; } /* Rojo coral */
.col-12:nth-child(5) .tile{ background: linear-gradient(135deg, #0891b2 0%, #22d3ee 100%) !important; } /* Cian luminoso */
.col-12:nth-child(6) .tile{ background: linear-gradient(135deg, #d97706 0%, #fbbf24 100%) !important; } /* Ámbar dorado */
.col-12:nth-child(7) .tile{ background: linear-gradient(135deg, #db2777 0%, #f472b6 100%) !important; } /* Rosa fucsia */
.col-12:nth-child(8) .tile{ background: linear-gradient(135deg, #0d9488 0%, #5eead4 100%) !important; } /* Turquesa claro */
.col-12:nth-child(9) .tile{ background: linear-gradient(135deg, #4338ca 0%, #818cf8 100%) !important; } /* Índigo suave */
.col-12:nth-child(10) .tile{ background: linear-gradient(135deg, #475569 0%, #94a3b8 100%) !important; } /* Gris plateado */

.tile-icon{
  width: 80px; 
  height: 80px;
  border-radius: 50%;
  display: flex; 
  align-items: center; 
  justify-content: center;
  background: rgba(255,255,255,.2);
  backdrop-filter: blur(10px);
  border: 2px solid rgba(255,255,255,.3);
  font-size: 3rem;
  color: #ffffff;
  flex: 0 0 auto;
  margin-bottom: 1.5rem;
  transition: all .3s ease;
}
.tile:hover .tile-icon{
  transform: scale(1.1);
  background: rgba(255,255,255,.3);
  border-color: rgba(255,255,255,.5);
}
.tile-title{ 
  font-weight: 700;
  font-size: 1.35rem;
  letter-spacing: 0.5px;
  color: #ffffff;
  line-height: 1.3;
  text-transform: uppercase;
  margin-top: auto;
  text-shadow: 0 2px 4px rgba(0,0,0,.2);
}

/* Portal (no segmentado) */
.portal-hero{
  position: relative;
  overflow: hidden;
}
.portal-hero:before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 12% 22%, rgba(91,91,234,.20), transparent 45%),
    radial-gradient(circle at 80% 20%, rgba(123,74,168,.18), transparent 45%);
  pointer-events:none;
}
.portal-hero .inner{ position:relative; }
.kpi{
  background: rgba(11,19,32,.04);
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 14px;
  padding: .9rem 1rem;
}
.kpi .num{ font-weight: 950; font-size: 1.25rem; }
.kpi .lbl{ color: rgba(17,24,39,.70); font-size: .9rem; }

.quick-link{
  background: #fff;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 14px;
  padding: .9rem 1rem;
  text-decoration:none;
  color: inherit;
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: .75rem;
}
.quick-link:hover{ box-shadow: 0 12px 40px rgba(0,0,0,.09); transform: translateY(-2px); }
.quick-link .qicon{
  width: 44px; height: 44px;
  border-radius: 14px;
  display:flex; align-items:center; justify-content:center;
  background: rgba(91,91,234,.12);
  border: 1px solid rgba(91,91,234,.22);
  color: #2b2d5a;
  flex: 0 0 auto;
}
.quick-link .qtitle{ font-weight: 900; }

.searchbox input{
  border-radius: 999px;
  padding-left: 2.5rem;
}
.searchbox .bi-search{
  position:absolute;
  left: .95rem;
  top: 50%;
  transform: translateY(-50%);
  color: rgba(17,24,39,.55);
}

.result-item{
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 14px;
  padding: .85rem 1rem;
  background: #fff;
}
.result-item a{ color: var(--evt-accent); font-weight: 900; text-decoration:none; }
.result-item a:hover{ text-decoration: underline; text-underline-offset: 3px; }

.evt-breadcrumb a{ color: var(--evt-accent); text-decoration:none; font-weight:900; }
.evt-breadcrumb a:hover{ text-decoration:underline; }

.evt-footer{
  background: var(--evt-nav);
  color:#fff;
  border-top: 1px solid rgba(255,255,255,.08);
}
.evt-footer-title{ font-weight: 900; letter-spacing: .5px; font-size: 1rem; margin-bottom: .75rem; }
.evt-footer-link{ color:#fff; text-decoration:none; font-size: .95rem; }
.evt-footer-link:hover{ text-decoration:underline; text-underline-offset: 3px; }
.evt-footer .small{ font-size: .9rem !important; }

.evt-social{
  width: 40px; height: 40px;
  border-radius: 999px;
  display:flex; align-items:center; justify-content:center;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  color: #fff;
  text-decoration:none;
}
.evt-social:hover{ background: rgba(255,255,255,.12); color:#fff; }

:focus-visible{
  outline: 3px solid rgba(91,91,234,.55);
  outline-offset: 2px;
  border-radius: 10px;
}
.btnBanner{
    position: relative;
    z-index: 999999;
    margin-top: 3%;
}
