/* =========================
       Tokens de cor (Roxo/Azul/Branco/Azul-claro)
    ==========================*/
    :root{
      --brand-purple: #6c5ce7;    /* roxo */
      --brand-blue:   #2563eb;    /* azul */
      --brand-sky:    #93c5fd;    /* azul claro */
      --brand-white:  #ffffff;    /* branco */

      --roxo--claro: #a194ff;    /* roxo */

      --bg-grad-1: #eef2ff;       /* base fria */
      --bg-grad-2: #e0e7ff;
      --card-bg: rgba(255,255,255,0.78);
      --card-border: rgba(255,255,255,0.6);
      --text-1: #0f172a;
      --text-2: #475569;

      --accent: var(--brand-purple);
      --accent-strong: #5b4bf0;
      --accent-soft: rgba(108, 92, 231, 0.15);

      --radius-xl: 18px;
      --radius-sm: 12px;
      --shadow-lg: 0 20px 40px rgba(31, 41, 55, 0.15);
      --shadow-md: 0 10px 24px rgba(31, 41, 55, 0.12);
      --gap: 16px;
      --field-h: 56px;
      --font: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    }


    *{box-sizing:border-box}
    html,body{height:100%}
    body{
      margin:0;
      font-family: 'Poppins', sans-serif;
      color:var(--text-1);
      background:
        radial-gradient(1100px 700px at 10% -10%, rgba(147,197,253,.35), transparent 70%),
        radial-gradient(900px 600px at 100% 0%, rgba(108,92,231,.22), transparent 60%),
        linear-gradient(180deg, var(--bg-grad-1), var(--bg-grad-2));
      display:flex; flex-direction:column; min-height:100vh; animation: opac 1s;
    }


    @keyframes opac{

    0%{
       opacity: 0;
    }
    100%{
        opacity: 1;
    }
  }


     /* ====== Header ====== */
    .header-evento,
    .navigation_header{
      font-family: var(--font);
      display: flex;
      flex-direction: row;
      align-items: center;
      z-index: 10;
    }

    .header-evento{
    background-image: linear-gradient(to bottom, var(--brand-purple),
     var(--bg-grad-1), var(--brand-purple));
    justify-content: space-between;
    padding: 5px 10%;
    width: 100%;
    height: 80px;
    color: #FFF;
    }

    .header-evento .logo{
        width: 30%;
    }

    .esquerda header{
    font-family: var(--font);
}

    .btn_icon_header{
        display: none;
        background-color: transparent;
        border: none;
        color: var(--text-1);
        cursor: pointer;
    }

    .logo-header{
        display: flex;
        flex-direction: row;
        gap: 20px;
        padding: 20px;
        align-items: center;
    }

    .navigation_header a{
      font-family: var(--font);
      text-decoration: none;
      color: var(--text-1);
      transition: 0.5s;
      /*text-shadow: 1px 1px 2px #000;*/
    }
    .navigation_header a:hover{

        background-color: var(--brand-purple);
        padding: 10px;
        border-radius: 6px;
        color: var(--text-1);
        /*text-shadow: 2px 2px 2px #000;*/   
    }
    /* ====== Header ====== */



    .password-toggle{
      position:absolute; right:10px; top:50%; transform:translateY(-50%);
      border:1px solid #e5e7eb; background:#fff; border-radius:10px; padding:6px 8px;
      font-size:12px; font-weight:600; cursor:pointer;
    }
    .password-toggle:focus-visible{ outline:3px solid var(--accent-soft); outline-offset:2px; }





    .menu-header{
      display: flex;
      flex-direction: row;
      gap: 20px;
    }


    .page{
      flex:1;
      display:flex; align-items:center; justify-content:center;
      padding:24px;
    }
    .shell{
      width:100%;
      max-width: 900px;
      backdrop-filter: blur(8px);
      background: var(--card-bg);
      border: 1px solid var(--card-border);
      border-radius: var(--radius-xl);
      box-shadow: var(--shadow-lg);
      overflow:hidden;
    }
    .header{
      padding: 28px 28px 12px;
      background:
        linear-gradient(180deg, rgba(147,197,253,.25), transparent 40%),
        linear-gradient(90deg, rgba(108,92,231,.25), transparent 60%);
    }
    .title{
      margin:0;
      font-size: clamp(20px, 2.4vw, 28px);
      letter-spacing: -0.01em;
      color: #000;
    }
    .subtitle{
      margin:6px 0 0;
      color: var(--text-2);
      font-size: 14px;
    }
    .divider{ height:1px; background: #eef2ff; margin: 8px 20px 0; }

    .form{ padding: 8px 20px 22px; }
    .grid{
      display:grid;
      gap: var(--gap);
      grid-template-columns: 1fr;
    }
    @media (min-width: 720px){
      .grid{ grid-template-columns: 1fr 1fr; }
      .grid .col-span-2{ grid-column: span 2; }
    }

    @media screen and (max-width: 768px){
    .btn_icon_header{
        display: block;
    }

    .navigation_header{
        position: absolute;
        flex-direction: column;
        top: 0;
        background-color: var(--brand-blue);
        height: 100%;
        width: 45vw;
        padding: 16px;
        animation-duration: 0.7s;
        margin-left: -100vw;
    }

    .menu-header{
      margin-top: 20px;
      display: flex;
      flex-direction: column;
      gap: 10px;     
    }
}

    /* ====== Campos (label flutuante) ====== */
    .field{ position: relative; }
    .control{
      height: var(--field-h);
      width:100%;
      padding: 22px 14px 8px;
      border: 1px solid #e5e7eb;
      border-radius: var(--radius-sm);
      background: #fff;
      outline: none;
      font-size: 16px;
      transition: border-color .2s, box-shadow .2s, background-color .2s;
      box-shadow: 0 1px 0 rgba(0,0,0,0.02);
    }
    .control:hover{ border-color:#d6d8dd; }
    .field:focus-within .control{
      border-color: var(--accent);
      box-shadow: 0 0 0 4px var(--accent-soft);
    }
    .label{
      position: absolute; top:50%; left:14px; transform:translateY(-50%);
      color: var(--text-2); pointer-events:none; transition: all .18s ease;
      background: transparent; padding: 0 6px;
    }
    .control::placeholder{ color: transparent; }
    .control:focus + .label,
    .control:not(:placeholder-shown) + .label{
      top: 8px; transform:none; font-size:12px; color: var(--accent-strong);
      background:#fff; border-radius:6px;
    }

    /* Select com seta */
    .select{
      appearance:none;
      background-image: linear-gradient(45deg, transparent 50%, #9ca3af 50%),
                        linear-gradient(135deg, #9ca3af 50%, transparent 50%);
      background-position: calc(100% - 18px) 48%, calc(100% - 12px) 48%;
      background-size: 6px 6px, 6px 6px;
      background-repeat:no-repeat;
      padding-right:44px;
    }

    .hint{ margin-top:6px; font-size:12px; color: var(--text-2); }

    /* ====== Botões ====== */
    
    .actions{ display:flex; gap:12px; flex-wrap: wrap; margin-top: 10px; }
    .btn{
      flex:1; height:52px; border:0; border-radius:var(--radius-sm);
      font-weight:600; font-size:16px; cursor:pointer;
      transition: transform .05s ease, box-shadow .2s ease, background .2s ease, filter .2s;
    }
    .btn:focus-visible{ outline:3px solid var(--accent-soft); outline-offset:2px; }
    .btn:active{ transform: translateY(1px); }
    .btn-ghost{
      background: #ffffff;
      border: 1px solid #e5e7eb;
      color: var(--text-1);
    }
    .btn-primary{
      background: linear-gradient(90deg, var(--brand-purple), var(--brand-blue));
      color:#fff; box-shadow: var(--shadow-md);
    }
    .btn-primary:hover{ filter: brightness(1.03); }

    /* ====== Footer (seção fixa da página) ====== */
    footer{
      background:
        linear-gradient(180deg, rgba(37,99,235,.08), rgba(108,92,231,.08));
      color:#0b1020;
      border-top: 3px solid;
      border-image: linear-gradient(90deg, var(--brand-purple), var(--brand-blue), var(--brand-sky)) 1;
    }
    .footer-content{
      max-width: 1100px; margin: 0 auto; padding: 28px 20px 8px;
      display:flex; align-items:center; justify-content:center; gap:24px; flex-wrap:wrap;
    }
    .footer-content .titulo_logo img{
      display:block; height:auto; max-width: 100px; filter: drop-shadow(0 4px 10px rgba(37,99,235,.18));
    }
    .footer-bottom{
      text-align:center; padding: 8px 20px 24px;
    }
    .footer-bottom p{
      margin:0 0 8px; font-size: 13px; color:#1f2a44;
    }
    .footer-bottom a{
      color:#0b3bff; text-decoration:none; font-size:13px;
    }
    .footer-bottom a:hover{ text-decoration:underline; }

    /* ====== Acessibilidade ====== */
    .btn, .control { -webkit-tap-highlight-color: transparent; }


    



     /* ====== Opt-in Revista Digital ====== */
    .container-rec-patr{
      grid-column: 1 / -1; /* ocupar a largura total */
      border: 1px dashed var(--brand-sky);
      background: linear-gradient(180deg, rgba(147,197,253,.20), rgba(108,92,231,.10));
      border-radius: 14px; padding: 16px 16px 12px;
    }
    .container-rec-patr .optin-title{
      color: var(--brand-blue);
      font-weight: 700;
      font-size: 14px;
      margin: 0 0 12px 0;
      line-height: 1.35;
    }
    .optin-inline{
      display:flex; align-items:center; gap:10px; flex-wrap:wrap;
    }
    #c_e_r_c_d_patro{
      width: 22px; height: 22px;
      accent-color: var(--brand-purple); /* cor do checkbox */
      cursor: pointer;
    }

    .txt-info-rev-dig{
        font-size: 13px;
    }
    

    /* legal Block */
    .legal-block{
        grid-column: 1 / -1;
        border: 1px solid rgba(99,102,241,.20);
        background: linear-gradient(180deg, rgba(147,197,253,.15), rgba(108,92,231,.08));
        border-radius: 14px;
        padding: 14px 16px;
        display: grid;
        gap: 10px;
  }
  .legal-inline{ display:flex; align-items:flex-start; gap:12px; }
        #ck-terms{ width:22px; height:22px; accent-color:#6c5ce7; margin-top:2px; cursor:pointer; }
        .legal-text{ font-size:14px; line-height:1.45; color:#1f2a44; }
        .legal-text a{ color:#2563eb; text-decoration:none; }
        .legal-text a:hover{ text-decoration:underline; }
        .legal-note{ font-size:12px; color:#475569; }
        .error-msg{ font-size:13px; color:#e11d48; display:none; }
        .btn[disabled]{ opacity:.6; cursor:not-allowed; }
    /* legal Block */



    /* aviso sobre dados */
        .notice-banner{
        display:flex; align-items:flex-start; gap:12px;
        background: linear-gradient(180deg, rgba(147,197,253,.16), rgba(108,92,231,.10));
        border:1px solid rgba(99,102,241,.22);
        border-radius:14px; padding:14px 16px; margin: 14px 0 10px;
        box-shadow: 0 6px 18px rgba(31,41,55,0.08);
    }
  /* se estiver dentro da grid, faz ocupar largura total */
        .notice-banner.col-span-2{ grid-column: 1 / -1; }

        .notice-icon{ line-height:0; margin-top:2px; }
        .notice-body{ flex:1; font-size:14px; color:#1f2a44; }
        .notice-body strong{ font-weight:700; }
        .notice-body a{ color: var(--brand-blue); text-decoration:none; }
        .notice-body a:hover{ text-decoration:underline; }
        .notice-points{ margin:8px 0 0; padding-left:18px; color:#334155; }
        .notice-points li{ margin:4px 0; }

    .notice-close{
        border:1px solid #e5e7eb; background:#fff; color:#111827;
        border-radius:10px; padding:8px 12px; font-weight:600; font-size:13px;
        cursor:pointer; white-space:nowrap;
        transition: background .2s, filter .2s, transform .05s;
    }
        .notice-close:hover{ filter:brightness(1.03); }
        .notice-close:active{ transform: translateY(1px); }
        .notice-close:focus-visible{ outline:3px solid rgba(108,92,231,.18); outline-offset:2px; }
        /* aviso sobre dados */


         


  @keyframes showSideBar{

    from{
        margin-left: -100vw;
    }
    top{
        margin-left: -10vw;
    }

}

@keyframes showSideBarBack{
    from{
        margin-left: -10vw;}
    top{
        margin-left: -100vw;}

}



.cont-reemv-canc{
    display: flex;
    text-align: center;
    flex-wrap: wrap;
    gap: 20px;
    padding: 20px;
    display: none;
}






/* SPINNER */
/* SPINNER */
/* SPINNER */
/* SPINNER */
/* SPINNER */
:root{
  --ld-accent: #2563eb;
  --ld-text: #0f172a;
}

.ld-modal{
  position: fixed; inset: 0;
  display: none;            /* escondido por padrão */
  align-items: center; justify-content: center;
  z-index: 9999;
}

.ld-modal.is-open{ display: flex; }

.ld-backdrop{
  position: absolute; inset: 0;
  background: rgba(0,0,0,.55);   /* sem blur = mais leve */
}

.ld-card{
  position: relative;
  width: min(360px, 92vw);
  padding: 20px 18px 18px;
  border-radius: 16px;
  background: #fff;              /* sem sombra pesada */
  text-align: center;
  opacity: 0; transform: translateY(6px) scale(.98);
  transition: transform .18s ease-out, opacity .18s ease-out; /* leve */
}

.is-open .ld-card{ opacity: 1; transform: translateY(0) scale(1); }

.ld-logo{
  width: 170px; height: 50px; object-fit: contain;
  margin: 0 auto 12px;
}

.ld-text{
  margin-top: 10px;
  font: 600 1rem/1.3 system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial;
  color: var(--ld-text);
}

/* Spinner leve: só border + rotate (GPU) */
.ld-spinner{
  --size: 56px;
  width: var(--size); height: var(--size);
  margin: 0 auto;
  border-radius: 50%;
  border: 4px solid transparent;
  border-top-color: var(--ld-accent);
  border-left-color: var(--ld-accent);
  animation: ld-rot .7s linear infinite;
  will-change: transform; /* ok aqui */
}

@keyframes ld-rot { to { transform: rotate(360deg); } }

/* acessibilidade */
@media (prefers-reduced-motion: reduce){
  .ld-card, .ld-spinner{ animation: none; transition: none; }
}
.no-scroll{ overflow: hidden; touch-action: none; }
/* SPINNER */
/* SPINNER */
/* SPINNER */
/* SPINNER */
/* SPINNER */