/* ============================================================
   ARGENTINA-ITALIA 2026 — Paneles Sectoriales y Rondas de Negocios
   Paleta institucional provista por el cliente
   ============================================================ */

:root{
  /* Neutrales — Cream & Ink */
  --cream-050:#faf6ef;
  --cream-100:#f3ecdf;
  --ink-900:#201c16;
  --ink-700:#403a30;
  --ink-600:#5c5648;
  --ink-400:#8a8477;
  --ink-200:#c9c3b5;

  /* Primarios — Navy & Terracotta */
  --navy-900:#0f1f38;
  --navy-800:#1a3a63;
  --navy-700:#25497d;
  --navy-500:#4a72ab;
  --terracotta-700:#9c4423;
  --terracotta-500:#c1592f;
  --terracotta-300:#e3a37e;

  /* Semánticos */
  --success:#0c7a52;
  --success-bg:#e5f3ec;
  --danger:#b8342a;
  --danger-bg:#fbe9e6;
  --info:#25497d;
  --info-bg:#e7edf5;

  --font-display:'Source Serif 4','Georgia',serif;
  /*--font-body:'Inter',system-ui,-apple-system,sans-serif;*/
  --font-body:'Arial', Helvetica, sans-serif;
  
  --radius:10px;
}

*{box-sizing:border-box;}
body{
  font-family:var(--font-body);
  color:var(--ink-900);
  background:var(--cream-050);
  margin:0;
}

h1,h2,h3,.font-display{font-family:var(--font-display);}

/* Franja bandera IT/AR — firma visual heredada del flyer y del mail */
.flag-stripe{display:flex;height:6px;width:100%;}
.flag-stripe span{flex:1;}
.flag-stripe span:nth-child(1){background:var(--success);}
.flag-stripe span:nth-child(2){background:var(--cream-050);}
.flag-stripe span:nth-child(3){background:var(--danger);}
.flag-stripe span:nth-child(4){background:var(--navy-500);}
.flag-stripe span:nth-child(5){background:var(--cream-050);}
.flag-stripe span:nth-child(6){background:var(--navy-500);}

/* Header con logos institucionales — plano, sin degradé, como en la pieza real del cliente */
.header-logos{
  background:#fff;
  padding:26px 24px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:44px;
  flex-wrap:wrap;
  border-bottom:1px solid var(--cream-100);
}
.header-logos img{height:56px;width:auto;object-fit:contain;}

@media (max-width:576px){
  .header-logos img{height:28px;}
}

/* Hero (ahora contiene también el formulario, a dos columnas) */
.hero{
  background:var(--navy-900);
  color:#fff;
  padding:40px 24px;
}
.hero .eyebrow{
  color:var(--terracotta-300);
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:.78rem;
  font-weight:600;
}
.hero h1{
  font-size:clamp(2rem,4.2vw,2.9rem);
  margin:.3rem 0 1rem;
  line-height:1.1;
}
.hero h1 em{color:var(--terracotta-300);font-style:normal;}
.hero .meta{color:#c4d3e6;font-size:1rem;margin-bottom:.3rem;}
.hero .meta strong{color:#fff;}

/* Sectores dentro del hero (fondo oscuro) */
.sector-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 0;
}
.sector-item .icon{
  width:34px;height:34px;border-radius:50%;
  background:rgba(255,255,255,.08);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
  font-size:.95rem;
}
.sector-item--dark span.label{font-weight:500;color:var(--cream-100);font-size:.88rem;}

.hero-copy{
  color:var(--cream-100);
  opacity:.85;
  font-size:.92rem;
  line-height:1.55;
  margin-top:1.4rem;
}

/* Formulario / wizard */
.form-wrap{width:100%;margin:0 auto;}
.steps-indicator{
  display:flex;gap:8px;justify-content:center;margin-bottom:32px;
}
.steps-indicator .step-dot{
  flex:1;max-width:120px;height:6px;border-radius:4px;background:var(--ink-200);
}
.steps-indicator .step-dot.active{background:var(--terracotta-500);}
.steps-indicator .step-dot.done{background:var(--navy-700);}

.form-card{
  background:#fff;
  border-radius:var(--radius);
  padding:36px 32px;
  box-shadow:0 1px 3px rgba(32,28,22,.08), 0 8px 24px rgba(32,28,22,.06);
}
.form-card h2{font-size:1.5rem;margin-bottom:.3rem;color:#000}
.form-card .step-desc{color:var(--ink-600);margin-bottom:1.6rem;font-size:.95rem;}

.form-label{font-weight:600;color:var(--ink-700);font-size:.9rem;}
.form-control,.form-select{
  border:1px solid var(--ink-200);
  border-radius:8px;
  padding:.6rem .8rem;
}
.form-control:focus,.form-select:focus{
  border-color:var(--navy-700);
  box-shadow:0 0 0 3px var(--info-bg);
}

/* Opciones tipo tarjeta (participación) */
.option-card{
  border:1px solid var(--ink-200);
  border-radius:var(--radius);
  padding:16px 18px;
  cursor:pointer;
  background:var(--cream-100);
  transition:border-color .15s ease, background .15s ease, box-shadow .15s ease;
  height:100%;
}
.option-card:hover{border-color:var(--navy-500);background:#fff;}
.opt-row{display:flex;align-items:flex-start;gap:10px;}
.option-card input{margin-top:3px;flex-shrink:0;accent-color:var(--terracotta-500);}
.opt-text{display:flex;flex-direction:column;gap:2px;}
.option-card.selected{
  border-color:var(--terracotta-500);
  background:#fff;
  box-shadow:0 0 0 2px var(--terracotta-500);
}
.option-card .opt-title{font-weight:700;color:var(--ink-900);}
.option-card .opt-sub{font-size:.85rem;color:var(--ink-600);}

/* Botones */
.btn-cta{
  background:var(--terracotta-500);
  border:none;
  color:#fff;
  font-weight:700;
  padding:.75rem 1.6rem;
  border-radius:50px;
  transition:background .15s ease, transform .15s ease;
}
.btn-cta:hover{background:var(--terracotta-700);color:#fff;transform:translateY(-1px);}
.btn-outline-nav{
  background:transparent;
  border:1px solid var(--ink-200);
  color:var(--ink-700);
  font-weight:600;
  padding:.75rem 1.4rem;
  border-radius:50px;
}
.btn-outline-nav:hover{border-color:var(--navy-700);color:var(--navy-700);}

/* Footer */
.site-footer{
  background:var(--navy-900);
  color:var(--cream-100);
  text-align:center;
  padding:28px 24px;
  font-size:.85rem;
}
.site-footer a{color:var(--terracotta-300);}

/* Accesibilidad: foco visible */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:3px solid var(--navy-500);
  outline-offset:2px;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  *{transition:none !important;animation:none !important;}
}

@media (max-width:576px){
  .hero{padding:48px 20px 40px;}
  .form-card{padding:26px 20px;}
}

/* ============ Página 2: catálogo de reuniones ============ */
.mode-tabs{
  display:flex;
  gap:8px;
  margin-bottom:1.4rem;
  flex-wrap:wrap;
}
.mode-tab{
  background:var(--cream-100);
  border:1px solid var(--ink-200);
  color:var(--ink-700);
  font-size:.85rem;
  font-weight:600;
  padding:.5rem 1rem;
  border-radius:50px;
  cursor:pointer;
}
.mode-tab.active{
  background:var(--navy-900);
  border-color:var(--navy-900);
  color:#fff;
}

.badge-counter{
  font-size:.8rem;
  font-weight:700;
  color:var(--navy-700);
  background:var(--info-bg);
  padding:.25rem .7rem;
  border-radius:50px;
}
.badge-counter.limite{
  color:var(--danger);
  background:var(--danger-bg);
}

.empresas-list{
  max-height:360px;
  overflow-y:auto;
  border:1px solid var(--ink-200);
  border-radius:var(--radius);
  padding:6px;
}
.empresa-item{
  display:flex;
  gap:12px;
  padding:12px;
  border-bottom:1px solid var(--cream-100);
}
.empresa-item:last-child{border-bottom:none;}
.empresa-item input[type="checkbox"]{margin-top:4px;flex-shrink:0;}
.empresa-item .empresa-nombre{font-weight:700;color:var(--ink-900);font-size:.92rem;}
.empresa-item .empresa-web{font-size:.78rem;color:var(--navy-700);text-decoration:none;}
.empresa-item .empresa-web:hover{text-decoration:underline;}
.empresa-item .ver-detalle-btn{
  display:inline-flex;
  align-items:center;
  gap:4px;
  background:var(--info-bg);
  border:none;
  padding:3px 10px 3px 12px;
  border-radius:50px;
  margin-top:6px;
  font-size:.72rem;
  font-weight:600;
  color:var(--navy-700);
  cursor:pointer;
  transition:background .15s ease, color .15s ease;
}
.empresa-item .ver-detalle-btn:hover{background:var(--navy-900);color:#fff;}
.empresa-item .empresa-desc{font-size:.82rem;color:var(--ink-600);margin-top:6px;line-height:1.45;}
.empresa-item.disabled{opacity:.4;}

#step3Resumen ul{padding-left:1.1rem;font-size:.9rem;color:var(--ink-700);}
#step3Resumen .resumen-evento{
  background:var(--cream-100);
  border-radius:var(--radius);
  padding:14px 18px;
  font-size:.9rem;
  color:var(--ink-700);
  margin-top:1rem;
}

/* ============ Pantalla de éxito ============ */
.success-icon{
  width:60px;
  height:60px;
  border-radius:50%;
  background:var(--success-bg);
  color:var(--success);
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 18px;
}
#successResumen ul{padding-left:1.1rem;font-size:.9rem;color:var(--ink-700);}
#successResumen .resumen-evento{
  background:var(--cream-100);
  border-radius:var(--radius);
  padding:14px 18px;
  font-size:.9rem;
  color:var(--ink-700);
  margin-top:1rem;
}


.form-check-input:checked {
    background-color: var(--terracotta-500);
    border-color: var(--terracotta-500);
}