:root{
    --bg-negro:#0a0907;
    --dorado:#d8b25c;
    --dorado-claro:#ecd189;
    --texto:#f4f0e6;
    --texto-muted:rgba(244,240,230,.68);
    --tarjeta-bg:rgba(13,37,16,.92);
    --tarjeta-borde:rgba(216,178,92,.28);
    --campo-bg:rgba(255,255,255,.07);
    --campo-borde:rgba(255,255,255,.16);
    --campo-borde-focus:var(--dorado);
    --error:#ff8a80;
    --muted-boton:#5a5244;
  }
  *{ box-sizing:border-box; }
  html, body{
    margin:0;
    min-height:100%;
    background:var(--bg-negro);
  }
  body{
    min-height:100vh;
    display:flex;
    flex-direction:column;
    background-image:
      linear-gradient(rgba(6,5,3,.45), rgba(6,5,3,.65)),
      url('../2026/img/fondoexpoemprende.jpg');
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    background-color: var(--bg-negro);
    color: var(--texto);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    font-size:14px;
    line-height:1.5;
  }

  .banner-superior,
  .banner-inferior{
    display:block;
    width:100%;
    height:auto;
  }

  .evento-page{
    flex:1 1 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:40px 20px;
  }

  .evento-card{
    width:100%;
    min-width:0;
    max-width:520px;
    background:var(--tarjeta-bg);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
    border:1px solid var(--tarjeta-borde);
    border-radius:18px;
    padding:36px 30px;
    box-shadow:0 24px 64px rgba(0,0,0,.55);
  }

  .evento-fecha{
    color:var(--dorado-claro);
    font-weight:700;
    font-size:12px;
    letter-spacing:.08em;
    text-transform:uppercase;
    margin:0 0 8px;
  }
  .evento-titulo{
    color:var(--texto);
    font-size:23px;
    font-weight:700;
    line-height:1.25;
    margin:0 0 8px;
  }
  .evento-lugar{
    color:var(--texto-muted);
    font-size:13px;
    margin:0 0 22px;
  }

  h2{
    color:var(--dorado-claro);
    font-size:15px;
    font-weight:700;
    letter-spacing:.02em;
    margin:0 0 10px;
  }
  .intro{
    color:var(--texto-muted);
    margin:0 0 22px;
  }

  .field{ margin-bottom:16px; }
  .field label.control-label{
    display:block;
    font-size:12px;
    font-weight:700;
    color:var(--dorado-claro);
    margin-bottom:6px;
  }
  .req{ color:var(--dorado); }
  .field .hint{
    font-size:11px;
    color:var(--texto-muted);
    margin:6px 0 0;
  }

  input[type=text],
  input[type=email],
  input[type=tel],
  select{
    width:100%;
    padding:11px 13px;
    border:1px solid var(--campo-borde);
    border-radius:9px;
    font:inherit;
    color:var(--texto);
    background:var(--campo-bg);
    outline:none;
  }
  input::placeholder{ color:rgba(244,240,230,.4); }
  input:focus,
  select:focus{
    border-color:var(--campo-borde-focus);
    box-shadow:0 0 0 3px rgba(216,178,92,.18);
  }
  select{
    appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23d8b25c'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 14px center;
    padding-right:34px;
  }
  select option{ color:#1a1a1a; } /* el navegador pinta el desplegable con fondo claro, sin importar el fondo del <select> */

  .check{
    display:flex;
    align-items:flex-start;
    gap:9px;
    margin:20px 0 6px;
    font-size:12.5px;
    color:var(--texto-muted);
  }
  .check input[type=checkbox]{ accent-color:var(--dorado); margin-top:2px; }
  .check a{ color:var(--dorado-claro); }

  .field-error{
    color:var(--error);
    font-size:12px;
    margin-top:6px;
  }
  .is-invalid input[type=text],
  .is-invalid input[type=email],
  .is-invalid input[type=tel],
  .is-invalid select,
  input.is-invalid,
  select.is-invalid{
    border-color:var(--error);
  }

  .recaptcha-wrap{ margin:20px 0 6px; transform-origin:0 0; }

  .actions{ margin-top:22px; }
  .btn-submit{
    width:100%;
    appearance:none;
    border:0;
    background:linear-gradient(180deg, var(--dorado-claro), var(--dorado));
    color:#20180a;
    font:inherit;
    font-weight:700;
    padding:13px 26px;
    border-radius:10px;
    cursor:pointer;
  }
  .btn-submit:hover{ filter:brightness(1.06); }
  .btn-submit:disabled{
    background:var(--muted-boton);
    color:rgba(244,240,230,.6);
    cursor:not-allowed;
    filter:none;
  }

  .btn-spinner{
    display:none;
    width:15px;
    height:15px;
    border:2px solid rgba(32,24,10,.35);
    border-top-color:#20180a;
    border-radius:50%;
    vertical-align:middle;
    margin-right:8px;
    animation:girar-spinner .7s linear infinite;
  }
  @keyframes girar-spinner{ to{ transform:rotate(360deg); } }

  .overlay-envio{
    display:none;
    position:fixed;
    inset:0;
    background:rgba(6,5,3,.88);
    z-index:1000;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:16px;
    text-align:center;
    padding:24px;
  }
  .overlay-envio.is-visible{ display:flex; }
  .overlay-envio .spinner-grande{
    width:46px;
    height:46px;
    border:4px solid rgba(255,255,255,.12);
    border-top-color:var(--dorado);
    border-radius:50%;
    animation:girar-spinner .8s linear infinite;
  }
  .overlay-envio p{ margin:0; font-weight:700; color:var(--dorado-claro); }
  .overlay-envio small{ color:var(--texto-muted); max-width:320px; }

  .logos-pie{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:24px;
    padding-bottom:15px;
  }
  .logos-pie img{ width:50%;max-width:250px; }

  @media (max-width:480px){
    .evento-page{ padding:28px 16px; }
    .evento-card{ padding:28px 22px; border-radius:14px; }
    .logos-pie{ flex-direction:column; gap:16px; }
    .logos-pie img{ width:80%;max-width:250px; }
  }