/*----------------------------------------------------
Definicion de fuentes
-----------------------------------------------------*/ 


*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --brand: #1bd4c6;
      --brand-dark: #14a99d;
      --navy: #1a2f47;
      --white: #ffffff;
      --light: #f0f4f8;
      --text: #2d3748;
      --muted: #718096;
    }
    html { scroll-behavior: smooth; }
    body { font-family: 'Montserrat', sans-serif !important; background: #fff; color: var(--text); overflow-x: hidden; font-size: 16px; line-height: 1.6; }

    /* ── NAV ── */
    nav {
      position: fixed; top: 0; left: 0; right: 0; z-index: 100;
      display: flex!important; align-items: center; justify-content: space-between;
      padding: 0 2.5rem; height: 64px;
      background: rgba(255,255,255,0.97);
      backdrop-filter: blur(14px);
      border-bottom: 1px solid rgba(35,65,95,0.10); box-shadow: 0 6px 18px rgba(35,65,95,0.06);
    }
    .nav-logo img { height: 55px; width: auto; display: block;  }
    .nav-links { display: flex; align-items: center; gap: 2.5rem; }
    .nav-links a { font-size: .82rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #5b6f83; text-decoration: none; transition: color .2s; padding-bottom: 2px; position: relative; }
    .nav-links a:hover, .nav-links a.active { color: var(--brand); }
    .nav-links a.active::after { content:''; position:absolute; bottom:-4px; left:0; right:0; height:2px; background:var(--brand); }
    .nav-cta { background: var(--brand); color: #1a2f47; font-weight: 800; font-size:.82rem; letter-spacing:.08em; text-transform:uppercase; padding: .7rem 2rem; text-decoration: none; transition: background .2s; white-space: nowrap; }
    .nav-cta:hover { background: var(--brand-dark); }

    /* ── SOCIAL SIDEBAR ── */
    .social-sidebar { position: fixed; right: 1rem; top: 50%; transform: translateY(-50%); z-index: 99; display: flex; flex-direction: column; gap: .8rem; }
    .social-sidebar a { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: #fff; border: 1px solid rgba(0,0,0,.12); border-radius: 50%; box-shadow: 0 2px 8px rgba(0,0,0,.13); color: var(--navy); text-decoration: none; transition: all .2s; }
    .social-sidebar a:hover { background: var(--brand); border-color: var(--brand); color: #fff; transform: scale(1.1); }
    .social-sidebar svg { width: 15px; height: 15px; fill: currentColor; display: block; }

    /* ── HERO ── */
    #inicio {
      min-height: 70vh; display: flex; align-items: center; padding: 0 3.5rem; padding-top: 0px;
      background: linear-gradient(rgba(8,18,38,.68), rgba(8,18,38,.58)), url('../images/Fondo-cartel.png') center/cover no-repeat;
    }
    .hero-content { max-width: 1200px; }
    .hero-label { display: inline-flex; align-items: center; gap: .8rem; font-size: .84rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--brand); margin-bottom: 2rem; }
    .hero-label::before { content:''; display:block; width:40px; height:2px; background:var(--brand); }
    h1.hero-title { font-size: 40px; font-weight: 900; line-height: 1.05; letter-spacing: -.04em; color: #ffffff; margin-bottom: 1.5rem; }
    .hero-sub { font-size: 1.1rem; color: rgba(255,255,255,.80); line-height: 1.75; margin-bottom: 3rem; }
    .hero-actions { display: flex; gap: 1rem; flex-wrap: wrap; }
    .btn-primary { display: inline-block; background: var(--brand); color: var(--navy); font-family: 'Montserrat', sans-serif; font-size: .88rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: 1rem 2.5rem; border: 2px solid var(--brand); text-decoration: none; transition: all .2s; cursor: pointer; }
    .btn-primary:hover { background: transparent; color: var(--brand); }
    .btn-outline { display: inline-block; background: transparent; color: #ffffff; font-family: 'Montserrat', sans-serif; font-size: .88rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; padding: 1rem 2.5rem; border: 2px solid rgba(255,255,255,.35); text-decoration: none; transition: all .2s; cursor: pointer; }
    .btn-outline:hover { border-color: var(--brand); color: var(--brand); background: rgba(255,255,255,.95); }

    /* ── INFO BAR ── */
    .info-bar { background: #2a4060; border-top: 3px solid var(--brand); }
    .info-bar-inner { max-width: 1340px; margin: 0 auto; display: grid; grid-template-columns: repeat(3,1fr) auto; }
    .info-col { padding: 1.8rem 2.5rem; border-right: 1px solid rgba(255,255,255,.08); }
    .info-col:last-child { border-right: none; }
    .info-col-label { font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: var(--brand); font-weight: 700; margin-bottom: .4rem; }
    .info-col-val { font-size: 1.05rem; font-weight: 700; color: #FFFFFF; line-height: 1.4; }
    .info-col-sub { font-size: .88rem; color: rgba(255,255,255,.55); margin-top: .15rem; }
    .info-col-cta { padding: 1.8rem 2.5rem; display: flex; align-items: center; }

    /* ── SECTIONS ── */
    .section-inner { max-width: 1340px; margin: 0 auto; padding: 3.5rem 2rem; }
    .section-num { font-size: .75rem; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; color: var(--brand); display: flex; align-items: center; gap: .8rem; margin-bottom: 1rem; }
    .section-num::after { content:''; flex:1; max-width:40px; height:2px; background:var(--brand); }
    h2.section-title { font-size: clamp(2rem, 3.5vw, 3.2rem); font-weight: 900; letter-spacing: -.04em; line-height: 1.1; color: var(--navy); }

    /* ── SOBRE ── */
    .sobre-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3.5rem; align-items: center; }
    .sobre-text p { font-size: 1rem; line-height: 1.85; color: #4a5568; margin-bottom: 1.2rem; }
    .sobre-pills { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 2rem; }
    .pill { background: rgba(27,212,198,.1); border: 1px solid rgba(27,212,198,.35); color: var(--navy); font-size: .78rem; font-weight: 700; letter-spacing: .04em; padding: .45rem 1rem; }
    .sobre-img-wrap { position: relative; }
    .sobre-img-wrap img { width: 100%; height: 400px; object-fit: cover; display: block; }
    .sobre-badge { position: absolute; bottom: -1.4rem; left: -1.4rem; background: var(--brand); color: var(--navy); padding: 1.1rem 1.6rem; }
    .sobre-badge .big { font-size: 1.8rem; font-weight: 900; line-height: 1; }
    .sobre-badge .small { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }

    /* ── AGENDA ── */
    #agenda { background: #f7f9fc; }
    #agenda .section-inner { padding-top: 2.5rem; padding-bottom: 2.5rem; }
    .agenda-list { margin-top: 1.2rem; border: 1px solid #e2e8f0; background: #fff; }
    /* ── AGENDA CARDS ── */
    .agenda-list { display: flex; flex-direction: column; gap: .45rem; margin-top: .7rem; border: none; background: transparent; }
    .agenda-row {
      display: grid;
      grid-template-columns: 90px 1px 1fr;
      align-items: center;
      gap: .8rem;
      padding: .55rem .9rem;
      background: #ffffff;
      border: 1px solid #dce8f0;
      border-radius: 6px;
      transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
      cursor: default;
    }
    .agenda-row:hover {
      transform: translateX(5px);
      box-shadow: 0 4px 18px rgba(26,47,71,.10);
      border-color: var(--brand);
      background: #f5fdfb;
    }
    .agenda-row:last-child { border-bottom: 1px solid #dce8f0; }
    .agenda-time { font-size: .8rem; font-weight: 800; color: #23415f; white-space: nowrap; }
    .agenda-divider { width: 1px; height: 18px; background: #c8d8e4; align-self: center; }
    .agenda-title { font-size: .82rem; font-weight: 600; color: #23415f; line-height: 1.25; }
    .agenda-special { }
    .agenda-break { }
    .agenda-end { }

    /* ── PONENTES ── */
    .speakers-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem; margin-top: 2.5rem; }
    .speaker-card {
      background: #fff;
      border: 1px solid #e2e8f0;
      border-radius: 14px;
      padding: 1.6rem;
      display: flex; flex-direction: column;
      position: relative; overflow: hidden;
      transition: box-shadow .25s ease, transform .25s ease, border-color .25s ease;
    }
    .speaker-card::before {
      content: '';
      position: absolute; top: 0; left: 0; right: 0; height: 3px;
      background: linear-gradient(90deg, var(--brand), #2f7cf6);
      opacity: 0; transition: opacity .25s ease;
    }
    .speaker-card:hover { box-shadow: 0 12px 36px rgba(26,47,71,.13); transform: translateY(-5px); border-color: rgba(27,212,198,.35); }
    .speaker-card:hover::before { opacity: 1; }
    .speaker-num { font-size: .6rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--brand); margin-bottom: 1rem; }
    .speaker-avatar {
      width: 68px; height: 68px;
      background: linear-gradient(135deg, #e8f4f8, #d0eaf3);
      border: 2px solid rgba(27,212,198,.22);
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      margin-bottom: 1.1rem; overflow: hidden; flex-shrink: 0;
    }
    .speaker-avatar svg { width: 30px; height: 30px; fill: #7ab5cc; }
    .speaker-name { font-size: 1rem; font-weight: 800; color: var(--navy); margin-bottom: .22rem; line-height: 1.25; }
    .speaker-role { font-size: .78rem; font-weight: 700; color: var(--brand-dark); margin-bottom: .18rem; }
    .speaker-org { font-size: .74rem; color: #94a3b8; font-weight: 500; }
    .speaker-footer {
      margin-top: auto; padding-top: 1rem;
      border-top: 1px solid #e2e8f0;
      display: flex; align-items: center; justify-content: flex-end;
    }
    .speaker-linkedin {
      display: inline-flex; align-items: center; justify-content: center;
      width: 32px; height: 32px;
      color: #0a66c2; text-decoration: none;
      background: rgba(10,102,194,.07);
      border: 1px solid rgba(10,102,194,.20);
      border-radius: 50%;
      transition: background .2s, color .2s, border-color .2s, transform .18s;
    }
    .speaker-linkedin:hover { background: #0a66c2; color: #fff; border-color: #0a66c2; transform: scale(1.12); }
    .speaker-linkedin svg { width: 14px; height: 14px; fill: currentColor; }
    .speaker-num {
      font-size: .6rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase;
      color: var(--brand); margin-bottom: 1rem;
    }
    .speaker-avatar { width: 68px; height: 68px; background: var(--light); display: flex; align-items: center; justify-content: center; font-size: 1.3rem; color: #b0bec5; margin-bottom: 1rem; }
    .speaker-name { font-size: 1rem; font-weight: 800; color: var(--navy); margin-bottom: .2rem; }
    .speaker-role { font-size: .8rem; font-weight: 600; color: var(--brand-dark); margin-bottom: .15rem; }
    .speaker-org { font-size: .76rem; color: var(--muted); }

    /* ── LUGAR ── */
    .lugar-grid { display: grid; grid-template-columns: 1fr 1fr; min-height: 480px; }
    .lugar-map { width: 100%; height: 100%; min-height: 480px; border: 0; display: block; }
    .lugar-info { background: var(--light); padding: 4rem; display: flex; flex-direction: column; justify-content: center; }
    .lugar-title { font-size: 2rem; font-weight: 900; letter-spacing: -.04em; color: var(--navy); margin-bottom: 1.2rem; }
    .lugar-addr { font-size: .88rem; color: var(--brand-dark); font-weight: 700; letter-spacing: .05em; text-transform: uppercase; margin-bottom: 1.5rem; display: flex; align-items: flex-start; gap: .7rem; }
    .lugar-addr::before { content:''; display:block; width:30px; height:2px; background:var(--brand); margin-top:.55rem; flex-shrink:0; }
    .lugar-text { font-size: 1rem; line-height: 1.8; color: #4a5568; margin-bottom: 2rem; }

    /* ── SPONSORS ── */
    .sponsors-bar { background: #eaf9f8; border-top: 2px solid var(--brand); padding: 1.8rem 3rem; }
    .sponsors-inner { max-width: 1340px; margin: 0 auto; display: flex; align-items: center; gap: 3rem; flex-wrap: wrap; justify-content: center; }
    .sponsors-label { font-size: .7rem; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; color: #0a7a73; }
    .sponsor-item { font-weight: 700; font-size: .92rem; color: #0a7a73; }

    /* ── CONTACTO / FORM ── */
    #contacto { background: #f7f9fc; }
    .contact-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 4rem; align-items: start; }
    .contact-info .big-title { font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 900; color: var(--navy); margin-bottom: 1.2rem; letter-spacing: -.04em; }
    .contact-info p { font-size: 1rem; line-height: 1.8; color: #4a5568; margin-bottom: 1.8rem; }
    .contact-meta { display: flex; flex-direction: column; gap: .8rem; margin-bottom: 2rem; }
    .contact-meta-row { display: flex; gap: 1rem; align-items: baseline; }
    .contact-meta-label { font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .14em; color: var(--brand-dark); min-width: 72px; }
    .contact-meta-val { font-size: .92rem; color: #4a5568; }
    .social-row { display: flex; gap: .8rem; flex-wrap: wrap; }
    .social-btn { color: var(--navy); text-decoration: none; font-size: .76rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; display: flex; align-items: center; gap: .45rem; border: 1px solid rgba(26,47,71,.18); background: #fff; padding: .5rem 1rem; transition: all .2s; }
    .social-btn:hover { background: var(--brand); border-color: var(--brand); color: var(--navy); }
    .social-btn svg { width: 13px; height: 13px; fill: currentColor; }

    /* ── FORM CARD ── */
    .form-card { background: #fff; border: 1px solid #e2e8f0; padding: 2.5rem; }
    .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; }
    .form-full { grid-column: 1 / -1; }
    .form-group { display: flex; flex-direction: column; gap: .35rem; }
    .form-label { font-size: .75rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #64748b; }
    .form-input { background: #f8fafc; border: 1px solid #cbd5e1; color: var(--navy); font-family: 'Montserrat', sans-serif; font-size: .95rem; padding: .75rem 1rem; outline: none; width: 100%; transition: border-color .2s, box-shadow .2s; }
    .form-input:focus { border-color: var(--brand-dark); box-shadow: 0 0 0 3px rgba(27,212,198,.15); }
    .form-section-title { font-size: .68rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--brand-dark); border-bottom: 1px solid #e2e8f0; padding-bottom: .6rem; margin: 1.4rem 0 .9rem; grid-column: 1 / -1; }
    .radio-group { display: flex; flex-direction: column; gap: .4rem; }
    .radio-group-label { font-size: .75rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #64748b; margin-bottom: .1rem; }
    .radio-options { display: flex; gap: 1.2rem; background: #f8fafc; border: 1px solid #cbd5e1; padding: .7rem 1rem; }
    .radio-opt { display: flex; align-items: center; gap: .45rem; cursor: pointer; }
    .radio-opt input { accent-color: var(--brand); width: 15px; height: 15px; cursor: pointer; }
    .radio-opt span { font-size: .92rem; font-weight: 600; color: #475569; }
    .privacy-box { background: #f0faf9; border: 1px solid rgba(27,212,198,.25); padding: 1.2rem; margin: 1.4rem 0 1rem; grid-column: 1 / -1; }
    .privacy-box .privacy-title { font-size: .68rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--brand-dark); margin-bottom: .7rem; }
    .privacy-box p { font-size: .78rem; line-height: 1.7; color: #475569; margin-bottom: .25rem; max-width: none; }
    .privacy-box a { color: var(--brand-dark); text-decoration: underline; }
    .checks-group { display: flex; flex-direction: column; gap: .6rem; grid-column: 1 / -1; }
    .check-item { display: flex; align-items: flex-start; gap: .7rem; }
    .check-item input { accent-color: var(--brand); width: 15px; height: 15px; margin-top: .2rem; flex-shrink: 0; cursor: pointer; }
    .check-item span { font-size: .82rem; line-height: 1.65; color: #475569; }
    .check-item span a { color: var(--brand-dark); text-decoration: underline; }
    .btn-submit { width: 100%; background: var(--navy); color: #fff; font-family: 'Montserrat', sans-serif; font-size: .9rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; padding: 1.1rem 2rem; border: none; cursor: pointer; transition: background .2s; margin-top: 1.2rem; }
    .btn-submit:hover { background: var(--brand-dark); }
    #successMsg { display: block; padding: 3rem 0; text-align: center; }

/* Estilos por defecto para los mensajes de error (ocultos) */
.error-msj {
  display: none;
  color: #dc3545;
  font-size: 0.85rem;
  margin-top: 5px;
}

/* --- CUANDO EL FORMULARIO HA SIDO VALIDADO --- */

/* Campos Incorrectos */
.was-validated input:invalid {
  border-color: #dc3545;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://w3.org' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath d='M7.8 4.2l-3.6 3.6m0-3.6l3.6 3.6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right calc(0.375em + 0.1875rem) center;
  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

/* Mostrar mensaje de error solo si el input es inválido */
.was-validated input:invalid ~ .error-msj {
  display: block;
}

/* Oculto por defecto */
.invalid-feedback {
  display: none;
  width: 100%;
  margin-top: 0.25rem;
  font-size: 0.875em;
  color: #dc3545; /* Rojo de Bootstrap */
}

/* Visible solo si el formulario se validó Y el input es inválido */
.was-validated .invalid-feedback {
  display: block;
}
/* Oculta el mensaje si el input de arriba es válido */
.was-validated input:valid ~ .invalid-feedback {
  display: none !important;
}

/* Campos Correctos */
.was-validated input:valid {
  border-color: #198754;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://w3.org' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.73L3.46 6.7c-.3.42-1 .42-1.16 0z'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right calc(0.375em + 0.1875rem) center;
  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}
    /* ── FOOTER ── */
    footer { background: #f5f9fb; border-top: 1px solid rgba(35,65,95,.08); padding: 1.8rem 3rem; }
    .footer-inner { max-width: 1340px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; }
    .footer-logo img { height: 55px; width: auto; display: block; }
    .footer-links { display: flex; gap: 2rem; }
    .footer-links a { font-size: .74rem; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: #5b6f83; text-decoration: none; transition: color .2s; }
    .footer-links a:hover { color: var(--brand); }
    .footer-copy { font-size: .74rem; color: #7b8da0; }

    /* ── ANIMATIONS ── */
    .reveal { opacity: 0; transform: translateY(22px); transition: opacity .6s ease, transform .6s ease; }
    .reveal.visible { opacity: 1; transform: none; }
    .reveal-left { opacity: 0; transform: translateX(-22px); transition: opacity .6s ease, transform .6s ease; }
    .reveal-left.visible { opacity: 1; transform: none; }
    .reveal-right { opacity: 0; transform: translateX(22px); transition: opacity .6s ease, transform .6s ease; }
    .reveal-right.visible { opacity: 1; transform: none; }

    /* ── RESPONSIVE ── */
    @media (max-width: 1100px) {
      .sobre-grid, .contact-grid, .lugar-grid { grid-template-columns: 1fr; }
      .lugar-map { min-height: 340px; height: 340px; }
      .speakers-grid { grid-template-columns: 1fr 1fr; }
      .info-bar-inner { grid-template-columns: 1fr 1fr; }
      .nav-links { display: none; }
      .social-sidebar { display: none; }
    }
    @media (max-width: 640px) {
      .speakers-grid { grid-template-columns: 1fr; }
      .info-bar-inner { grid-template-columns: 1fr; }
      nav { padding: 0 1.5rem; }
      .section-inner { padding: 2.5rem 1.25rem; }
      #inicio { padding: 0 1.5rem; padding-top: 64px; }
      .lugar-info { padding: 2.5rem 1.5rem; }
      .form-grid { grid-template-columns: 1fr; }
      .form-full { grid-column: 1; }
      .form-section-title { grid-column: 1; }
      .privacy-box { grid-column: 1; }
      .checks-group { grid-column: 1; }
    }