  :root{
    --green:#5CFF39;
    --green-2:#3BEA22;
    --navy:#0b1930;
    --navy-2:#071526;
    --white:#ffffff;
    --muted:rgba(255,255,255,.78);
  }

  /* Responsivo */
  @media (max-width: 920px){
    .speaker{ padding: 64px 0; }
    .speaker__grid{
      grid-template-columns: 1fr;
      gap: 20px;
    }
    .speaker__photo{
      max-width: 420px; /* evita ficar gigante */
    }
  }

*{ box-sizing:border-box; }
html,body{
  height:100%;
  width:100%;
  max-width:100%;
  overflow-x: clip;
}

  body{
    margin:0;
    font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
    color:var(--white);
    background:#03070d;
    overflow-x:hidden;
  }

  /* ===== HERO ===== */
  .hero{
    position:relative;
    padding-top: 40px;
    min-height:100vh;
    display:flex;
    align-items:center;
    isolation:isolate;
    /* Fundo estático de reserva: aparece se o vídeo estiver escondido/carregando (nunca fica preto) */
    background: #03070d url("hero-bg.jpg") center/cover no-repeat;
  }

  /* Triângulos */
  .top-triangle{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:38px; /* mais fino */
    background: #a0e712;
    z-index: 4;

    /* bico menor */
    clip-path: polygon(
      0% 0%,
      100% 0%,
      100% 70%,
      50% 100%,
      0% 70%
    );
  }

  .top-triangle::after{
    content:"";
    position:absolute;
    inset:0;
    clip-path: polygon(50% 0%, 100% 0%, 100% 70%, 50% 100%);
    background: rgba(0,0,0,.07);
  }

  .logo {
    width: 200px;
    height:auto;      
    display: block;
  }

  /* Vídeo de fundo */
  .bg-video{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    z-index:-3;
    filter:saturate(1.05) contrast(1.05);
  }

  /* Overlay escuro + gradiente */
  .overlay{
    position:absolute;
    inset:0;
    z-index:-2;
    background:
      linear-gradient(90deg,
        rgba(7,21,38,.92) 0%,
        rgba(7,21,38,.88) 40%,
        rgba(7,21,38,.55) 65%,
        rgba(7,21,38,.12) 100%
      );
  }

  /* Layout */
  .wrap{
    width:min(1180px, calc(100% - 48px));
    margin-inline:auto;
    display:grid;
    grid-template-columns: 1.2fr .8fr;
    gap:32px;
    align-items:center;
    padding:72px 0;
  }

  @media (max-width: 900px){
    .wrap{ grid-template-columns:1fr; padding:56px 0; }
    .hero::before,.hero::after{ height:52px; }
  }

  /* ===== ESQUERDA ===== */
  .brand-row{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    margin-top: -15px;
    margin-bottom:18px;
  }

  .tagline{
    font-weight:900;
    color:rgb(160, 231, 24);
    letter-spacing:.6px;
    font-size:15px;
  }

  /* Kicker */
  .kicker{
    display:inline-block;
    margin: 8px 0 10px;
    padding:8px 12px;
    border-radius:10px;
    font-family: "Montserrat", sans-serif;
    color:#ffffff;
    letter-spacing:.4px;
    text-transform:uppercase;
  }

  h1{
    margin:0 0 18px;
    line-height:1.02;
    font-size: clamp(34px, 4.6vw, 58px);
    letter-spacing:-.6px;
    font-weight: 700;
    font-family: "REM", sans-serif;
    text-transform:uppercase;
    padding-bottom: 10px;
  }

  .accent{
    color:#a0e712;
    text-shadow: 0 0 26px rgba(160, 231, 18, .35); /* brilho verde da marca (#a0e712) */
    font-weight: 800;
  }

  .sub{
    width:min(560px, 100%);
    padding:14px 16px;
    margin:0 0 20px;
    margin-bottom: 35px;
    font-size: clamp(16px, 1.6vw, 18px);
    line-height:1.45;
    color:var(--muted);
    font-family: "Montserrat", sans-serif;
    background:rgba(0,0,0,.20);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    border:2px solid rgba(160, 231, 24);
    border-radius:14px;
    box-shadow: 0 10px 30px rgba(0,0,0,.25);
  }

  .green{
    color:#a0e712; font-weight:900;}

  /* Botões */
  .actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:18px;
  }

  .btn{
    appearance:none;
    border:none;
    border-radius:12px;
    padding:12px 16px;
    font-weight:900;
    cursor:pointer;
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    gap:10px;
    transition: transform .12s ease, filter .12s ease, background .12s ease;
    user-select:none;
  }

  .btn__icon{
    flex: 0 0 auto;
    display: block;
  }

  .btn__icon--whatsapp{
    width: 24px;
    height: 24px;
  }

  .btn:active{ transform: translateY(1px); }

  .btn-primary{
    background: linear-gradient(90deg, #a0e712, #A0e712);
    color:#1c3144;
    box-shadow: 0 12px 28px rgba(50, 255, 4, 0.18);
  }

  .btn-primary:hover{
    filter:brightness(1.03);
    transform: translateY(-1px);
  }

  .btn-ghost{
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.18);
    color: var(--white);
  }

  .btn-ghost:hover{
    background: rgba(255,255,255,.12);
    transform: translateY(-1px);
  }

  /* ===== DIREITA ===== */
  .right{
    display:flex;
    justify-content:flex-end;
    align-items:center;
  }

  /* Acessibilidade */
  @media (prefers-reduced-motion: reduce){
    .bg-video{ display:none; }
    .btn{ transition:none; }
  }

  /* ===== SECTION: PALESTRANTE ===== */
    .speaker{
    position: relative;
    overflow: hidden;
    background-image: url(Backgrounds/bg-palestrante.jpeg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding-top: 90px; /* seu conteúdo desce; a faixa fica colada no topo */
    padding-bottom: 50px;
  }


  /* textura/efeito leve por cima (sem centralizar a composição) */
  .speaker::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background: linear-gradient(90deg,
      rgba(7,21,38,.92) 0%,
      rgba(7,21,38,.88) 45%,
      rgba(7,21,38,.65) 70%,
      rgba(7,21,38,.35) 100%
    );
    z-index: 0;
  }

  .speaker__wrap{   
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto;
    position: relative;
    padding-top: 0;
    z-index: 1;
  }

  .speaker__header{
    /* alinhado à esquerda (não centralizado) */
    max-width: 720px;
    margin-bottom: 26px;
  }

  .speaker__title{
    margin: 0;
    font-size: clamp(24px, 2.2vw, 34px);
    font-weight: 900;
    letter-spacing: -0.4px;
    color: #a0e712;
  }

  .speaker__subtitle{
    margin: 6px 0 0;
    font-size: 15px;
    font-weight: 700;
    color: rgba(255,255,255,.86);
  }

  .speaker__grid{
    display: grid;
    grid-template-columns: 320px 1fr; /* foto + conteúdo */
    gap: 34px;
    align-items: start;
  }

  /* FOTO */
  .speaker__photo{
    margin: 0;
    border-radius: 18px;
    padding: 10px;
    background: rgba(0,0,0,.18);
    border: 1px solid rgba(255,255,255,.14);
    box-shadow: 0 18px 45px rgba(0,0,0,.35);
  }

  .speaker__photo img{
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: 14px;
    border: 2px solid #a0e712;
  }

  /* LISTA */
  .speaker__content{
    padding-top: 6px;
  }

  .speaker__list{
    list-style: none;
    margin: 0;
    padding: 0;
    max-width: 760px;
    font-family: "Montserrat", sans-serif;
  }

  .speaker__list li{
    position: relative;
    padding-left: 18px;
    margin: 10px 0;
    color: rgba(255,255,255,.84);
    line-height: 1.5;
    font-size: 14.5px;
  }

  /* bullet “verde” */
  .speaker__list li::before{
    content:"";
    position:absolute;
    left: 0;
    top: 10px;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #a0e712;
    box-shadow: 0 0 18px rgba(92,255,57,.25);
  }

  /* Rodapé da seção */
  .speaker__footer{
    margin-top: 24px;
    padding-top: 14px;
    display: flex;
    gap: 10px;
    align-items: baseline;
    flex-wrap: wrap;
    font-family: "Montserrat", sans-serif;
  }

  .speaker__role{ 
    font-size: 12px;
    letter-spacing: .2px;
    color: rgba(92,255,57,.85);
    text-transform: uppercase;
  }

  .speaker__name{
    font-size: 14px;
    font-weight: 900;
    color: rgba(255,255,255,.92);
  }

  /* Triângulo superior (faixa inclinada com vinco no meio) */
  .corner-triangle{
    position: absolute;
    top: 0;
    left: 0;
    width: 700px;   /* comprimento */
    height: 50px;   /* espessura (fino) */
    background: linear-gradient(90deg, #a0e712, #a0e712);
    z-index: 5;

    /* triângulo apontando para a direita */
    clip-path: polygon(
      0% 0%,
      100% 0%,
      0% 100%
    );
  }

  /* opcional: vinco/sombra leve (bem sutil) */
  .corner-triangle::after{
    content:"";
    position:absolute;
    inset:0;
    background: rgba(0,0,0,.08);
    clip-path: polygon(55% 0%, 100% 0%, 0% 100%);
  }

  /* ===== SECTION: TEORIA E BASE ===== */
  .phase{
    position: relative;
    padding: 140px 24px;
    overflow: hidden;
    background:url(Backgrounds/Azul.png);
  }

  /* textura/iluminação sutil */
.phase::before{
  content:"";
  position:absolute;
  inset:-80px;
  /* iluminação/vinheta sutil sobre o fundo (navy #1c3144 = rgb(28,49,68)) */
  background:
  radial-gradient(45% 55% at 50% 40%, rgba(28,49,68,.30), transparent 70%),
  linear-gradient(180deg, rgba(28,49,68,.45), transparent 45%, rgba(28,49,68,.45));
  pointer-events:none;
  z-index:0;
}

.phase__wrap{
  width:min(1180px, calc(100% - 48px));
  margin:0 auto;
  position:relative;
  z-index:1;
  display:flex;
  justify-content:center;
}

  /* GLASS CARD */
.phase__card{
    width: min(900px, 100%);
    padding: 64px 56px;
    border-radius: 28px;
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.10);
    box-shadow:
    0 26px 70px rgba(0,0,0,.45),
    inset 0 1px 0 rgba(255,255,255,.06);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    position: relative;
    overflow: hidden;
}

  .phase__card::after{
    content:"";
  position:absolute;
  inset:-140px;
  background: radial-gradient(45% 45% at 30% 25%, rgba(160,231,18,.18), transparent 60%);
  pointer-events:none;
}

  /* brilho interno verde (bem sutil) */
.phase__content{
  position:relative;
  z-index:1;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap: 18px;
}

/* TITLE */
.phase__title{
  margin:0;
  font-size: clamp(38px, 4.2vw, 64px);
  font-weight: 900;
  letter-spacing: -0.9px;
  color: #a0e712;
  text-transform: uppercase;
}

/* CHIPS */
.phase__chips{ display:flex; justify-content:center; }

.chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 14px 28px;
  border-radius: 999px;
  font-weight: 900;
  letter-spacing: .2px;
  font-family: "Montserrat", sans-serif;
  font-size: 16px;
  line-height: 1;
  white-space: nowrap;
}

.chip--outline{
  background: rgba(0,0,0,.22);
  color: rgba(255,255,255,.92);
  border: 2px solid rgba(160,231,18,.75);
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
}

/* COPY */
.phase__copy{
  font-family: "Montserrat", sans-serif;
  margin: 10px 0 0;
  font-size: clamp(16px, 1.6vw, 18px);
  line-height: 1.55;
  color: rgba(255,255,255,.86);
}

.phase__copy-strong{
  color: #a0e712;
  font-weight: 900;
}

/* RESPONSIVO */
@media (max-width: 720px){
  .phase{ padding: 110px 18px; }
  .phase__card{ padding: 46px 22px; }
  .chip{ white-space: normal; text-align:center; }
}

.corner-triangle-right{
  position: absolute;
  top: 0;
  right: 0;
  width: 700px;
  height: 50px;

  background: linear-gradient(90deg, #a0e712, #a0e712);

  z-index: 5;

  /* espelhado */
  clip-path: polygon(
    0% 0%,
    100% 0%,
    100% 100%
  );
}

/* vinco opcional */
.corner-triangle-right::after{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.08);

  clip-path: polygon(
    0% 0%,
    45% 0%,
    100% 100%
  );
}

/* ===== SECTION: VARIAÇÃO (Phase 2) ===== */
.phase2{
  position: relative;
  overflow: hidden;
  padding: 190px 0 170px;
  background-image: url("Backgrounds/bg-fase2.jpg");
  background-size: 100% auto;
  background-position: center top;
  background-repeat: no-repeat;
}

.phase2::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:5;

  background: 
    /* barra de cima (direita) */
    linear-gradient(#a0e712, #a0e712) top right / 1500px 10px no-repeat;
}


.phase2::before{
  content:"";
  position:absolute;
  inset:-60px;  
  pointer-events:none;
  z-index:0;
}

.phase2__wrap{
  width:min(1180px, calc(100% - 48px));
  margin:0 auto;
  position:relative;
  z-index:1;
  display:flex;
  justify-content:center;
}

.phase2__wrap::after{
  content:"";
  position:absolute;
  bottom:0px;   /* controla a distância do fundo da section */
  right:0;        /* fica do lado direito */
}

.phase2__card{
  width: min(980px, 100%);
  border-radius: 26px;
  padding: 54px;
  margin-bottom: 140PX;
  margin-top: -0PX;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 26px 70px rgba(0,0,0,.42);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);

  position: relative;
  overflow:hidden;
}

.phase2__card::before{
  content:"";
  position:absolute;
  inset:-120px;
  background: radial-gradient(40% 40% at 25% 30%, rgba(92,255,57,.16), transparent 60%);
  pointer-events:none;
}

.phase2__grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 28px;
  align-items: center;
}

.phase2__title{
  margin:0;
  font-size: clamp(30px, 3.2vw, 46px);
  font-weight: 900;
  letter-spacing: -.8px;
  color: #a0e712;
  text-transform: uppercase;
}

.phase2__eyebrow{
  margin: 0 0 1px;
  color: rgba(255,255,255,.72);
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
}

.phase2__sub{
  margin: 10px 0 18px;
  color: rgba(255,255,255,.78);
  font-family: "Montserrat", sans-serif;
  line-height: 1.5;
  max-width: 38ch;
}

/* mini glass do lado direito */
.phase2__mini{
  padding: 16px 18px;
  border-radius: 18px;
  background: rgba(0,0,0,.18);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
  margin-bottom: 14px;
}

.phase2__miniTitle{
  margin:0 0 10px;
  font-weight: 900;
  color: rgba(255,255,255,.88);
  font-family: "Montserrat", sans-serif;
}

.phase2__list{
  margin:0;
  padding-left: 18px;
  color: rgba(255,255,255,.82);
  font-family: "Montserrat", sans-serif;
  line-height: 1.6;
}

.phase2__list li::marker{
  color:#a0e712;
}

/* chips usando o mesmo estilo do seu */
.phase2__chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 12px 18px;
  border-radius: 999px;
  font-weight: 900;
  font-family: "Montserrat", sans-serif;
  letter-spacing:.2px;
  width: fit-content;
}

/* reaproveita sua linguagem */
.phase2 .chip-solid{
  background: linear-gradient(90deg, #a0e712, #a0e712);
  color:#1c3144;
  box-shadow: 0 12px 28px rgba(50, 255, 4, 0.18);
  border: none;
}

.phase2 .chip-outline{
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.18);
  color: rgba(255,255,255,.92);
}

/* responsivo */
@media (max-width: 920px){
  .phase2__card{ padding: 38px 26px; }
  .phase2__grid{ grid-template-columns: 1fr; }
}

.phase3{
  position: relative;
  overflow: hidden;
  padding: 130px 0;
  font-family: "Montserrat", sans-serif;
  /* mesmo “tom” do bg anterior */
  background: url(Backgrounds/coffee_bg.jpeg);
}

.phase3__wrap{
  width:min(1180px, calc(100% - 48px));
  margin:0 auto;
  position:relative;
  display:flex;
  justify-content:flex-start; /* <- muda o comportamento */
}

.phase3__card{
  width: min(820px, 100%);
  border-radius: 26px;
  padding: 50px 56px;
  position: relative;
  overflow:hidden;

  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 26px 70px rgba(0,0,0,.42);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

/* “assinatura” dessa seção: rail vertical */
.phase3__rail{
  position:absolute;
  top:18px;
  bottom:18px;
  left:18px;
  width:10px;
  border-radius: 999px;
  background: linear-gradient(180deg, #a0e712, rgba(160,231,18,.25));
  box-shadow: 0 18px 40px rgba(92,255,57,.22);
}

.phase3__content{
  padding-left: 22px; /* espaço por causa do rail */
}

.phase3__title{
  margin:0;
  font-size: clamp(28px, 3vw, 44px);
  font-weight: 900;
  letter-spacing: -.6px;
  color: #a0e712;
  text-transform: uppercase;
}

/* chip em estilo “pill”, menor e elegante */
.phase3__chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top: 14px;
  padding: 10px 18px;
  border-radius: 999px;

  background: rgba(0,0,0,.22);
  border: 1px solid rgba(160,231,18,.55);
  color: rgba(255,255,255,.92);
  font-weight: 900;
  font-family: "Montserrat", sans-serif;
}

.phase3__text{
  margin: 18px 0 0;
  max-width: 46ch;
  line-height: 1.55;
  color: rgba(255,255,255,.78);
  font-family: "Montserrat", sans-serif;
  font-size: 16px;
}

/* Lista de certificações (Fase 3) */
.phase3__list{
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
  font-family: "Montserrat", sans-serif;
  color: rgba(255,255,255,.88);
  font-size: 15px;
}

.phase3__list li{
  position: relative;
  padding-left: 20px;
}

.phase3__list li::before{
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #a0e712;
  box-shadow: 0 0 16px rgba(160,231,18,.35);
}

.phase3__list b{ color: #a0e712; }

/* =========================================
   RÓTULO DE FASE (Fase 1 / Fase 2 / Fase 3)
   Usado nas 3 seções da jornada de aprendizado.
========================================= */
.fase-tag{
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  margin-bottom: 6px;
  padding: 6px 16px;
  border-radius: 999px;
  background: rgba(160,231,18,.14);
  border: 1px solid rgba(160,231,18,.55);
  color: #a0e712;
  font-family: "Montserrat", sans-serif;
  font-weight: 900;
  font-size: 13px;
  letter-spacing: .18em;
  text-transform: uppercase;
  white-space: nowrap;
}

/* =========================================
   FAIXA "JÁ INCLUSO" — comodidades.
   Visual propositalmente DIFERENTE dos cards de fase
   (faixa verde clara) para não parecer uma etapa do curso.
========================================= */
.incluso{
  background: linear-gradient(90deg, #a0e712, #5CFF39);
  padding: 20px 0;
}

.incluso__wrap{
  width: min(1180px, calc(100% - 48px));
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 14px 28px;
  font-family: "Montserrat", sans-serif;
}

.incluso__label{
  padding: 6px 14px;
  border-radius: 999px;
  background: rgba(11,25,48,.16);
  color: #0b1930;
  font-weight: 900;
  font-size: 13px;
  letter-spacing: .18em;
  text-transform: uppercase;
  white-space: nowrap;
}

.incluso__list{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px 28px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.incluso__list li{
  position: relative;
  padding-left: 20px;
  color: #0b1930;
  font-weight: 800;
  font-size: 15px;
}

.incluso__list li::before{
  content: "✓";
  position: absolute;
  left: 0;
  font-weight: 900;
}

.end{
  position: relative;
  overflow: hidden;
  padding: 110px 0;
  font-family: "Montserrat", sans-serif;
  background: url("Backgrounds/bg-end.jpg") center/cover no-repeat;
}

.end__wrap{
  width:min(1180px, calc(100% - 48px));
  margin:0 auto;
}

/* título e subtítulo na direita */
.end__header{
  max-width: 720px;
  margin: 0 auto 26px;
  text-align: center;
}

.end__title{
  margin:0;
  font-size: clamp(26px, 2.8vw, 40px);
  font-weight: 900;
  color: #a0e712;
  letter-spacing: -.3px;
}

.end__subtitle{
  margin: 8px 0 0;
  color: rgba(255,255,255,.78);
  line-height: 1.4;
}

/* foto + card + rail, centralizado (desktop).
   IMPORTANTE: esta regra precisa vir ANTES da @media abaixo, senão a versão
   mobile/tablet (1 coluna) é sobrescrita e nunca funciona. */
.end__grid{
  display: grid;
  grid-template-columns: minmax(260px, 360px) minmax(420px, 620px) 14px; /* foto + card + rail */
  gap: 24px;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  max-width: 1020px;
}

/* CARD */
.end__card{
  border-radius: 22px;
  padding: 22px 22px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 26px 70px rgba(0,0,0,.42);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

/* LISTA */
.end__list{
  margin: 0;
  padding-left: 18px;
  color: rgba(255,255,255,.88);
  line-height: 1.55;
}

.end__list li::marker{
  color: #a0e712;
}

/* RAIL do lado direito */
.end__rail{
  width: 10px;
  border-radius: 999px;
  background: linear-gradient(180deg, #a0e712, rgba(160,231,18,.12));
  box-shadow: 0 18px 40px rgba(92,255,57,.18);
}

/* responsivo */
@media (max-width: 920px){
  .end__header{ text-align: center; margin-left: auto; margin-right: auto; }
  .end__grid{
    grid-template-columns: 1fr;
    max-width: 100%;
  }
  .end__rail{ display: none; }
}



/* =========================
   AREAS – CARDS (seus 4)
========================= */
.areas {
  position: relative;
  padding: 110px 0;
  font-family: "Montserrat", sans-serif;
  background: url(Backgrounds/bg.jpg.jpeg);
}

/* Centraliza título e subtítulo da section Áreas */
.areas__header{
  text-align: center;
  margin: 0 auto 40px auto;
}

.areas__title{
  margin: 0 0 12px 0;
   font-size: clamp(26px, 2.8vw, 40px);
  font-weight: 900;
  color: #a0e712;
  letter-spacing: -.3px;
}

.areas__subtitle{
  margin: 0 auto;
  color: rgba(255,255,255,.78);
  line-height: 1.4;
  max-width: 600px; /* evita linha muito longa */
}

.areas__list {
  color: rgba(11,25,48,.90);
  font-family: "Montserrat", sans-serif;

}

.areas__list li{
  list-style: none;
}


.card_mecanica,
.card_civil,
.card_eletrica,
.card_multi{
  position: relative;   /* <-- ESSENCIAL */

  border-radius: 22px;

  background: linear-gradient(180deg, rgba(160,231,18,.92), rgba(160,231,18,.82)) !important;

  padding: 62px 28px 22px; 
  padding-bottom: 34px;
  min-height: auto;

  box-shadow:
    0 22px 52px rgba(0,0,0,.42),
    inset 0 1px 0 rgba(255,255,255,.16);
}


/* O card "Multidisciplinares" tem mais conteúdo no topo, então precisa de mais respiro.
   O !important É NECESSÁRIO: sem ele, a media query de celular (que define
   "padding: 60px 18px 22px" nos cards) sobrescreveria este padding-top. */
.card_multi{
  padding-top: 78px !important;
}


/* hover com “sazón” */
.card_mecanica:hover,
.card_civil:hover,
.card_eletrica:hover,
.card_multi:hover{
  transform: translateY(-2px);
  filter: brightness(1.02);
  box-shadow:
    0 36px 86px rgba(0,0,0,.52),
    inset 0 1px 0 rgba(255,255,255,.18);
}

/* textura */
.card_mecanica::before,
.card_civil::before,
.card_eletrica::before,
.card_multi::before{
  content:"";
  position:absolute;
  inset:-80px;
  background:
    repeating-linear-gradient(
      135deg,
      rgba(11,25,48,.06) 0px,
      rgba(11,25,48,.06) 10px,
      transparent 10px,
      transparent 22px
    );
  opacity:.35;
  pointer-events:none;
  z-index:0;
}

/* variações (se quiser diferenciar sutil) */
.card_civil{ background: linear-gradient(180deg, rgba(160,231,18,.88), rgba(160,231,18,.78)); }
.card_eletrica{ background: linear-gradient(180deg, rgba(160,231,18,.90), rgba(160,231,18,.80)); }

/* =========================
   TAG (chip) – centralizada
========================= */

.areas__tag{
  position:absolute;
  top: 14px;
  left: 50%;
  transform: translateX(-50%);
  z-index:2;

  display:inline-flex;
  align-items:center;
  gap: 10px;

  padding: 10px 18px;
  border-radius: 999px;

  background: rgba(11,25,48,.16);
  border: 1px solid rgba(11,25,48,.22);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  font-family: "Montserrat", sans-serif;
  font-weight: 900;
  letter-spacing: .4px;
  text-transform: uppercase;
  color: rgba(11,25,48,.95);

  box-shadow: 0 14px 26px rgba(0,0,0,.22);
  user-select:none;
}

/* Ícone redondinho (emoji ou img) */
.areas__icon{
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  background: rgba(11,25,48,.18);
  border: 1px solid rgba(255,255,255,.14);
  line-height: 1;
}

.areas__icon img{
  width: 14px;
  height: 14px;
  display:block;
  filter: brightness(0) saturate(100%) invert(10%);
  opacity: .95;
}

/* =========================
   CONTEÚDOS EXTRAS DO MULTI
========================= */

.areas__meta,
.areas__lead{
  position:relative;
  z-index:1;
  width: min(520px, 100%);
  margin: 0 auto;
  text-align: center;
  font-family: "Montserrat", sans-serif;
  color: rgba(11,25,48,.90);
}

.areas__meta{
  margin-top: 8px;
  font-weight: 800;
  opacity: .75;
}

.areas__lead{
  margin-top: 14px;
  font-weight: 900;
}

/* =========================
   LISTA – COLAPSÁVEL
========================= */


/* bullets */
.card_mecanica .areas__list li,
.card_civil .areas__list li,
.card_eletrica .areas__list li,
.card_multi .areas__list li{
  position:relative;
  padding-left: 18px;
}

.card_mecanica .areas__list li::before,
.card_civil .areas__list li::before,
.card_eletrica .areas__list li::before,
.card_multi .areas__list li::before{
  content:"";
  position:absolute;
  left: 0;
  top: 9px;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: rgba(11,25,48,.88);
  box-shadow: 0 0 0 4px rgba(11,25,48,.12);
}

.areas__wrap{
  width: min(1180px, calc(100% - 96px)); /* antes 48px */
  margin: 0 auto;
}

.areas__grid{
  width: min(980px, 100%); /* controla o tamanho total do conjunto */
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
  align-items: stretch;
}

/* ===== SPEAKERS ===== */
.speakers{
  position: relative;
  overflow: hidden;
  padding: 110px 0;
  background: url(Backgrounds/bg.jpg.jpeg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  font-family: "Montserrat", sans-serif;
}

/* FAIXA INFERIOR */
.speakers::before{
  content:"";
  position:absolute;
  top:0;                   /* encostado no topo */
  left:50%;
  transform:translateX(-50%);
  width:500px;             /* controla largura */
  height:10px;             /* controla altura */
  background:#a0e712;
  z-index:1;
}

/* FAIXA INFERIOR */
.speakers::after{
  content:"";
  position:absolute;
  bottom:0;                /* encostado no fundo */
  left:50%;
  transform:translateX(-50%);
  width:500px;
  height:10px;
  background:#a0e712;
  z-index:1;
}
.speakers__wrap{
  width: min(1180px, calc(100% - 96px));
  margin: 0 auto;
}

.speakers__title{
  margin: 0 0 34px;
  text-align: center;
  font-size: clamp(18px, 2.2vw, 26px);
  font-weight: 900;
  color: #a0e712;
  letter-spacing: -.3px;
}

/* GRID */
.speakers__grid{
  width: min(980px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
  align-items: start;
}

/* CARD */
.speakerCard{
  border-radius: 18px;
  padding: 10px;
  background: rgba(0,0,0,.10);
  border: 2px solid rgba(160,231,18,.90);
  box-shadow: 0 22px 52px rgba(0,0,0,.35);
  transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
}

.speakerCard:hover{
  transform: translateY(-2px);
  filter: brightness(1.02);
  box-shadow: 0 30px 70px rgba(0,0,0,.45);
}

.speakerCard__photo{
  margin: 0;
  border-radius: 14px;
  overflow: hidden;
  background: rgba(0,0,0,.18);
}

.speakerCard__photo img{
  display: block;
  width: 100%;
  height: 190px;            /* mantém padrão igual */
  object-fit: cover;
  object-position: center;
}

/* Reenquadra apenas o Carlos para evitar corte no topo do rosto */
.speakerCard__img--carlos{
  object-position: center 22%;
}

.speakerCard__body{
  padding: 10px 6px 4px;
}

.speakerCard__name{
  margin: 0;
  font-size: 14px;
  font-weight: 900;
  color: #a0e712;
  letter-spacing: -.2px;
}

.speakerCard__role{
  margin: 4px 0 0;
  font-size: 11.5px;
  line-height: 1.25;
  color: rgba(255,255,255,.85);
  font-weight: 700;
}

/* RESPONSIVO */
@media (max-width: 980px){
  .speakers__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .speakerCard__photo img{ height: 200px; }
}

@media (max-width: 560px){
  .speakers__wrap{ width: min(1180px, calc(100% - 44px)); }
  .speakers__grid{ grid-template-columns: 1fr; }
  .speakerCard__photo img{ height: 230px; }
}

.sponsors{
  position: relative;
  overflow: hidden;
  padding: 110px 0 130px; /* espaçamento da seção (antes sobrava um vazio enorme embaixo) */

  background: url(Backgrounds/bg.jpg.jpeg);
  text-align: center;
}

.sponsors__wrap{
  width:min(1180px, calc(100% - 48px));
  margin:0 auto;
}

.sponsors__title{
   margin: 0 0 60px;
   font-size: clamp(26px, 2.8vw, 40px);
  font-weight: 900;
  color: #a0e712;
  text-align: center;
  letter-spacing: -.3px;
  font-family:"Montserrat", sans-serif;
}

/* 🤝 GRADE DE PATROCINADORES
   Cada logo ocupa uma CÉLULA do mesmo tamanho e se ajusta dentro dela
   (object-fit: contain). Isso equilibra os logos automaticamente, sem
   precisar de altura individual pra cada um.
   ⚠️ Os arquivos foram recortados (sem margem transparente) — se trocar um
   logo, recorte a margem também, senão ele renderiza pequeno. */
.sponsors__grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  align-items: center;
  justify-items: center;
  gap: 36px 28px;
  width: min(1000px, 100%);
  margin: 0 auto;
}

.sponsors__grid img{
  width: 100%;
  max-width: 190px;
  height: 62px;          /* mesma célula para todos */
  object-fit: contain;   /* o logo se encaixa dentro sem distorcer */
  opacity: .92;
  transition: opacity .25s ease, transform .25s ease;
}

.sponsors__grid img:hover{
  opacity: 1;
  transform: translateY(-3px);
}


.corner-triangle-bottom{
  position: absolute;
  bottom: 0;
  left: 0;

  width: 700px;   /* comprimento */
  height: 50px;   /* espessura */
  background: linear-gradient(90deg, #a0e712, #a0e712);
  z-index: 5;

  /* triângulo apontando pra cima (canto inferior esquerdo) */
  clip-path: polygon(
    0% 0%,
    101% 100%,
    0% 100%
  );
}

/* vinco/sombra opcional (igual ao de cima) */
.corner-triangle-bottom::after{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.08);

  clip-path: polygon(
    0% 0%,
    55% 100%,
    0% 100%
  );
}

.cta-final{
  position: relative;
  overflow: hidden;
  padding: 140px 0;
  background: url(Backgrounds/bg.jpg.jpeg); /* ou seu fundo */
  font-family: "Montserrat", sans-serif;
}


/* faixa verde superior */
.cta-final__triTop{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:70px;
  background:#a0e712;
  clip-path: polygon(0 0, 100% 0, 100% 65%, 0 100%);
  z-index:2;
  opacity:.98;
}

/* faixa verde inferior */
.cta-final__triBottom{
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:70px;
  background:#a0e712;
  clip-path: polygon(0 35%, 100% 0, 100% 100%, 0 100%);
  z-index:2;
  opacity:.98;
}

/* conteúdo central */
.cta-final__wrap{
  position: relative;
  z-index:3;
  width: min(980px, calc(100% - 64px));
  margin: 0 auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap: 18px;
}

/* pill principal */
.cta-final__pill{
  border-radius: 16px;
  padding: 16px 22px;
  border: 2px solid rgba(160,231,18,.85);
  background: rgba(0,0,0,.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 22px 60px rgba(0,0,0,.35);
}

.cta-final__pill p{
  margin:0;
  font-weight: 900;
  color: rgba(255,255,255,.92);
  font-size: clamp(16px, 1.8vw, 22px);
  line-height: 1.25;
}

.cta-final__pill span{
  color:#a0e712;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 6px;
}

/* texto de instrução */
.cta-final__hint{
  margin: 0;
  font-weight: 800;
  color: rgba(255,255,255,.86);
  font-size: 14px;
  letter-spacing: .2px;
}

/* botão */
.cta-final__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 10px 18px;
  border-radius: 999px;
  background: linear-gradient(90deg, #a0e712, #a0e712);
  color: #0b1930;
  font-weight: 900;
  text-decoration:none;
  box-shadow: 0 18px 50px rgba(0,0,0,.35);
  transition: transform .12s ease, filter .12s ease;
}

.cta-final__btn:hover{
  transform: translateY(-1px);
  filter: brightness(1.03);
}

.faq{
  position: relative;
  padding: 110px 0 90px;
  background:
    radial-gradient(1200px 420px at 10% 0%, rgba(160,231,18,.14), transparent 60%),
    radial-gradient(800px 320px at 100% 100%, rgba(92,255,57,.10), transparent 62%),
    linear-gradient(180deg, #081426 0%, #061020 100%);
}

.faq__wrap{
  width: min(980px, calc(100% - 64px));
  margin: 0 auto;
  text-align: center;
}

.faq__kicker{
  margin: 0 0 10px;
  color: #a0e712;
  letter-spacing: .12em;
  font-weight: 800;
  font-size: 12px;
}

.faq__title{
  margin: 0;
  font-size: clamp(30px, 4.6vw, 54px);
  line-height: 1;
  color: #fff;
  text-transform: uppercase;
}

.faq__intro{
  margin: 12px 0 28px;
  color: rgba(255,255,255,.82);
  max-width: 62ch;
  margin-left: auto;
  margin-right: auto;
  font-size: clamp(14px, 1.7vw, 18px);
}

.faq__list{
  display: grid;
  gap: 12px;
  max-width: 820px;
  margin: 0 auto;
  text-align: left;
}

.faq__item{
  border: 1.5px solid rgba(160,231,18,.35);
  border-radius: 14px;
  background: rgba(255,255,255,.03);
  overflow: hidden;
  box-shadow: 0 12px 30px rgba(0,0,0,.22);
}

.faq__item summary{
  list-style: none;
  cursor: pointer;
  padding: 16px 20px;
  font-weight: 800;
  color: #fff;
  position: relative;
  padding-right: 46px;
}

.faq__item summary::-webkit-details-marker{
  display:none;
}

.faq__item summary::after{
  content:"+";
  position:absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  color:#a0e712;
  font-size: 26px;
  line-height: 1;
  transition: transform .2s ease;
}

.faq__item[open] summary::after{
  content:"-";
}

.faq__item p{
  margin: 0;
  padding: 0 20px 18px;
  color: rgba(255,255,255,.86);
  line-height: 1.55;
  font-size: 15px;
}

.site-footer{
  position: relative;
  padding: 100px 0 0;
  background:
    linear-gradient(180deg, #050b15 0%, #03070d 100%);
  border-top: 1px solid rgba(160,231,18,.25);
}

.site-footer__wrap{
  width: min(980px, calc(100% - 64px));
  margin: 0 auto;
  text-align: center;
}

.site-footer__title{
  margin: 0;
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.05;
  color: #fff;
}

.site-footer__text{
  margin: 12px auto 24px;
  max-width: 62ch;
  color: rgba(255,255,255,.82);
}

.site-footer__form{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  max-width: 820px;
  margin: 0 auto;
  text-align: left;
}

.site-footer__field{
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.site-footer__field--full{
  grid-column: 1 / -1;
}

.site-footer__label{
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: rgba(255,255,255,.78);
}

.site-footer__input{
  width: 100%;
  min-height: 50px;
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 14px;
  background: rgba(255,255,255,.06);
  color: #fff;
  outline: none;
  transition: border-color .12s ease, background-color .12s ease, box-shadow .12s ease;
}

.site-footer__input::placeholder{
  color: rgba(255,255,255,.42);
}

.site-footer__input:focus{
  border-color: rgba(160,231,18,.72);
  background: rgba(255,255,255,.1);
  box-shadow: 0 0 0 4px rgba(160,231,18,.12);
}

.site-footer__submit{
  grid-column: 1 / -1;
  justify-self: end;
  min-height: 48px;
  padding: 12px 30px;
  border: 2px solid #a0e712;
  border-radius: 14px;
  background: #a0e712;
  color: #081426;
  font-weight: 800;
  cursor: pointer;
  transition: transform .12s ease, filter .12s ease;
}

.site-footer__submit:hover{
  transform: translateY(-1px);
  filter: brightness(1.04);
}

/* LGPD: caixa de consentimento (usada no modal e no rodapé) */
.site-footer__consentLabel{
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
  font-size: 13px;
  line-height: 1.4;
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
  color: rgba(255,255,255,.72);
}

.site-footer__consentLabel input[type="checkbox"]{
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  margin-top: 2px;
  accent-color: #a0e712;
  cursor: pointer;
}

.site-footer__consentLabel a{
  color: #a0e712;
  text-decoration: underline;
}

  .site-footer__copy{
  margin: 100px 0 0;
  margin-bottom: -150px;
  padding-bottom: 0;
  color: rgba(255,255,255,.58);
  font-size: 13px;
}

  .site-footer__copy a{
  color: #a0e712;
  text-decoration: none;
}

  .site-footer__copy a:hover{
  text-decoration: underline;
}

#whatsappIcon .whatsapp-button{
  position: fixed;
  right: 45px;
  bottom: 110px;
  width: 64px;
  height: 64px;
  background: #25d366;
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  box-shadow: 0 12px 28px rgba(37, 211, 102, 0.35);
  z-index: 1001;
  transition: 0.3s ease;
  cursor: pointer;
  border: none;   /* reset: agora é <button> */
  padding: 0;
  font: inherit;
}

#whatsappIcon .whatsapp-button:hover{
  transform: scale(1.08);
}

#whatsappIcon .whatsapp-button img{
  width: 60%;
  height: auto;
  display: block;
}

.whatsapp-modal-overlay{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.whatsapp-modal-overlay.active{
  display: flex;
  opacity: 1;
}

.whatsapp-popup{
  background: white;
  border-radius: 12px;
  width: 90%;
  max-width: 450px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
  overflow: hidden;
  transform: scale(0.8);
  opacity: 0;
  transition: all 0.3s ease;
  z-index: 1001;
}

.whatsapp-modal-overlay.active .whatsapp-popup{
  transform: scale(1);
  opacity: 1;
}

.popup-header{
  background: linear-gradient(135deg, #25d366 0%, #20ba5a 100%);
  color: white;
  padding: 20px;
  display: flex;
  align-items: center;
  gap: 15px;
}

.popup-header-icon{
  width: 50px;
  height: 50px;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.popup-header-icon svg{
  width: 28px;
  height: 28px;
  fill: white;
}

.popup-header-info h3{
  margin: 0 0 4px;
  font-size: 18px;
  font-weight: 700;
}

.popup-header-info p{
  margin: 0 0 8px;
  font-size: 13px;
  opacity: 0.9;
}

.online-status{
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
}

.status-dot{
  width: 8px;
  height: 8px;
  background: #fff;
  border-radius: 50%;
}

.popup-body{
  padding: 20px;
}

.popup-message{
  display: inline-block;
  margin: 0 0 18px;
  padding: 8px 14px;
  background: #f0f2f5;
  border-radius: 18px;
  color: #4a4a4a;
  font-size: 14px;
}

.popup-form{
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* LGPD: consentimento no popup do WhatsApp */
.popup-consent{
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12px;
  line-height: 1.35;
  color: #4a4a4a;
  cursor: pointer;
}

.popup-consent input[type="checkbox"]{
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  margin-top: 1px;
  accent-color: #25d366;
  cursor: pointer;
}

.popup-consent a{
  color: #20ba5a;
  text-decoration: underline;
}

.form-group{
  position: relative;
}

.form-group svg{
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  fill: #25d366;
}

.form-group input{
  width: 100%;
  padding: 12px 14px 12px 42px;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  font-size: 14px;
  outline: none;
  transition: border-color 0.3s ease;
}

.form-group input:focus{
  border-color: #25d366;
}

.send-btn{
  background: linear-gradient(135deg, #25d366 0%, #20ba5a 100%);
  color: white;
  border: none;
  border-radius: 8px;
  padding: 12px 24px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.send-btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 6px 15px rgba(37, 211, 102, 0.3);
}

.send-btn svg{
  width: 18px;
  height: 18px;
  fill: white;
}

#whatsappCloseBtn{
  position: fixed;
  top: calc(50% - 250px);
  right: calc(50% - 245px);
  width: 42px;
  height: 42px;
  border: none;
  border-radius: 999px;
  background: rgba(255,255,255,.15);
  color: #fff;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  z-index: 1002;
}

@media (max-width: 600px){
  #whatsappIcon .whatsapp-button{
    right: 20px;
    bottom: 20px;
    width: 56px;
    height: 56px;
  }

  #whatsappIcon .whatsapp-button img{
    width: 60%;
  }

  .whatsapp-popup{
    width: 95%;
    max-width: 100%;
  }

  .popup-header{
    padding: 15px;
  }

  .popup-header-icon{
    width: 45px;
    height: 45px;
  }

  .popup-header-icon svg{
    width: 24px;
    height: 24px;
  }

  .popup-header-info h3{
    font-size: 16px;
  }

  .popup-body{
    padding: 15px;
  }

  .popup-message{
    font-size: 13px;
  }

  .form-group input{
    font-size: 16px;
    padding: 11px 12px 11px 38px;
  }

  .send-btn{
    font-size: 13px;
    padding: 11px 18px;
  }

  #whatsappCloseBtn{
    top: 16px;
    right: 16px;
  }
}

.modal-open{
  overflow: hidden;
}

.modal-overlay{
  position: fixed;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(3,7,13,.78);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .18s ease, visibility .18s ease;
  z-index: 50;
}

.modal-overlay.is-open{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.modal-card{
  position: relative;
  width: min(760px, 100%);
  max-height: min(90vh, 920px);
  overflow: auto;
  padding: 32px;
  border: 1px solid rgba(160,231,18,.24);
  border-radius: 28px;
  background: linear-gradient(180deg, rgba(12,23,41,.98) 0%, rgba(5,11,21,.98) 100%);
  box-shadow: 0 28px 80px rgba(0,0,0,.38);
}

.modal-close{
  position: absolute;
  top: 14px;
  right: 14px;
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  color: #fff;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}

.modal-title{
  margin: 0;
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.05;
  color: #fff;
}

.modal-text{
  margin: 10px 0 24px;
  color: rgba(255,255,255,.78);
}

.modal-form{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

/* ===== RESPONSIVO GLOBAL ===== */
@media (max-width: 1200px){
  .corner-triangle,.corner-triangle-right,.corner-triangle-bottom{
    width: min(700px, 72vw);
    height: 42px;
  }
}

@media (max-width: 980px){
  .speaker{
    padding-top: 72px;
    padding-bottom: 40px;
  }

  .speaker__grid{
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .speaker__photo{
    width: min(420px, 100%);
    margin: 0 auto;
  }

  .phase{
    padding: 110px 18px;
  }

  .phase__card,
  .phase2__card,
  .phase3__card{
    padding: 36px 24px;
  }

  .areas{
    padding: 90px 0;
  }
  .areas__wrap,.speakers__wrap{
    width: min(1180px, calc(100% - 44px));
  }

  .areas__grid{
    grid-template-columns: 1fr;
    width: min(760px, 100%);
  }

  .speakers::before,
  .speakers::after{
    width: min(500px, calc(100% - 44px));
  }

  .sponsors{
    padding: 110px 0 130px;
  }
}

@media (max-width: 768px){
  .hero{
    min-height: auto;
    padding-top: 36px;
  }

  .wrap{
    width: min(1180px, calc(100% - 36px));
    padding: 44px 0;
    gap: 22px;
  }
  .phase2,.phase3,.end,.speakers,.faq,.site-footer,.cta-final{
    padding-top: 84px;
    padding-bottom: 0;
  }

  .speaker{
    padding-top: 72px;
    padding-bottom: 40px;
  }

  .speaker__wrap,
  .phase__wrap,
  .phase2__wrap,
  .phase3__wrap,
  .end__wrap,
  .areas__wrap,
  .speakers__wrap,
  .sponsors__wrap,
  .faq__wrap,
  .site-footer__wrap,
  .cta-final__wrap{
    width: min(1180px, calc(100% - 36px));
  }

  .end__grid{
    grid-template-columns: 1fr;
    max-width: 100%;
  }

  .end__rail{
    display: none;
  }

  /* Patrocinadores: 2 colunas no celular/tablet */
  .sponsors__grid{
    grid-template-columns: repeat(2, 1fr);
    gap: 30px 20px;
  }

  .cta-final__triTop,
  .cta-final__triBottom{
    height: 52px;
  }

  .cta-final__pill{
    padding: 14px 14px;
  }

  .cta-final__btn{
    width: 100%;
    max-width: 420px;
    text-align: center;
  }

  .site-footer__form{
    grid-template-columns: 1fr;
  }

  .site-footer__field--full{
    grid-column: auto;
  }

  .site-footer__submit{
    width: 100%;
  }

  .modal-card{
    padding: 24px 18px;
    border-radius: 22px;
  }

  .modal-form{
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px){
  .wrap{
    width: min(1180px, calc(100% - 52px));
    gap: 18px;
  }
  .sub{
    padding: 12px 14px;
  }

  .actions{
    gap: 10px;
  }

  .actions .btn{
    width: 100%;
    justify-content: center;
  }

  .speaker{
    overflow-x: clip;
  }

  .speaker__wrap{
    width: min(1180px, calc(100% - 52px));
    padding-left: 0;
    padding-right: 0;
  }

  .speaker__grid > *{
    min-width: 0;
  }

  .speaker__header,
  .speaker__content,
  .speaker__photo{
    max-width: 100%;
  }

  .brand-row{
    margin-top: 0;
  }

  .phase__title{
    font-size: clamp(30px, 8vw, 44px);
  }

  .phase2__title,
  .phase3__title,
  .end__title,
  .areas__title,
  .sponsors__title{
    font-size: clamp(24px, 7.2vw, 34px);
  }

  .phase2__chip,
  .chip{
    width: 100%;
    text-align: center;
    white-space: normal;
  }

  .card_mecanica,
  .card_civil,
  .card_eletrica,
  .card_multi{
    padding: 60px 18px 22px;
  }

  .speakerCard__photo img{
    height: auto;
    aspect-ratio: 4/3;
  }
  .corner-triangle,.corner-triangle-right,.corner-triangle-bottom{
    width: min(700px, 88vw);
    height: 32px;
  }
}
