/* ================= RESET ================= */
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* ================= DESIGN SYSTEM ================= */
:root {
  /* Font sizes */
  --fs-h1: clamp(30px, 4vw, 36px);
  --fs-h2: clamp(26px, 3vw, 30px);
  --fs-h3: 10px;
  --fs-h4: 18px;

  --fs-body: 16px;
  --fs-small: 14px;
  --fs-xs: 12px;

  /* Line heights */
  --lh-tight: 1.1;
  --lh-normal: 1.55;
  --lh-loose: 1.7;

  /* Colors */
  --bg-dark: #0c0c0c;
  --bg-card: #141414;
  --text-main: #ffffff;
  --text-muted: #b5b5b5;
  --red: #ff3b3b;
  --blue: #1d3e6f;
}

/* ================= BASE ================= */
html, body {
  width: 100%;
  overflow-x: hidden;
  font-family: 'Inter', sans-serif;
  font-size: var(--fs-body);
  line-height: var(--lh-normal);
  background: #000;
  color: var(--text-main);
}

.container {
  max-width: 1800px;
  margin: 0 auto;
  padding: 0 1px;
}
/* ================= HEADER ================= */

header{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  padding:14px 40px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  z-index:999;
}

header::before{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(12,12,12,.85);
  backdrop-filter:blur(12px);
  z-index:-1;
}

/* logo */
.logo{
  display:flex;
  align-items:center;
  gap:10px;
}

/* menu */
header nav{
  display:flex;
  align-items:center;
}

header nav a{
  color:#cfcfcf;
  margin:0 16px;
  text-decoration:none;
  font-size:14px;
  transition:.25s;
}

header nav a:hover{
  color:#fff;
}

/* botão */
.btn-header{
  padding:8px 18px;
  font-size:13px;
  border-radius:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:1.2;
  text-align:center;

  border:1px solid rgba(255,60,60,.9);
  background:rgba(255,0,0,.08);
  color:#fff;
  text-decoration:none;

  box-shadow:
  0 0 10px rgba(255,0,0,.5),
  inset 0 0 10px rgba(255,0,0,.25);
}

.btn-header:hover{
  background:rgba(255,0,0,.18);
}
/* ================= HEADER RESPONSIVO ================= */

/* Tablet */
@media (max-width:900px){

  header{
    padding:12px 25px;
  }

  header nav{
    display:none; /* esconde menu */
  }

}

/* Mobile */
@media (max-width:480px){

  header{
    padding:10px 18px;
  }

  .btn-header{
    font-size:13px;
    padding:8px 16px;
  }

}
/* ================= HERO ================= */
.hero {
  display: flex;
  justify-content: space-between;
  padding: 30px 70px 10px;
  margin-top: 50px;
  background: linear-gradient(270deg, #E0E0E0, #F7F7F7);
  color: #111;
}

.hero-left {
  width: 50%;
}

.hero-left h1 {
  font-family: 'Playfair Display', serif;
  font-size: var(--fs-h1);
  line-height: var(--lh-tight);
  margin-bottom: 30px;
  letter-spacing: -0.02em;
}

.hero-left p {
  margin-bottom: 20px;
  color: #444;
}

.hero-left ul {
  list-style: none;
  margin-top: 20px;
}

.hero-left li {
  font-size: var(--fs-body);
  margin-bottom: 14px;
  color: #111;
}
/* ================= FORM ================= */
.form-box {
  transform: scale(0.87) translateY(-10px);
  transform-origin: top right;
  width: 35%;
  max-width: 380px;
  margin-bottom: 0px;
  padding: 15px 20px 20px;
  border-radius: 20px;
  background: linear-gradient(#fff, #fff) padding-box,
              linear-gradient(to top, rgba(255,59,59), rgba(255,247,247,0.6)) border-box;
  border: 1px solid transparent;
  box-shadow: 0 10px 25px rgba(0,0,0,0.08),
              0 30px 60px rgba(0,0,0,0.15);
  text-align: center;
}

.form-box input,
.form-box select,
.form-box .custom-select,
.phone-field,
.select-wrapper,
.terms-box {
  text-align: left;
}

.form-tag {
  display: block;
  width: fit-content;
  margin: 0 auto 8px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: #111;
  padding: 6px 10px;
}

/* Campos padrão */
.form-box input,
.form-box select,
.form-box .custom-select {
  width: 100%;
  padding: 15px;
  margin-bottom: 10px;
  border-radius: 10px;
  border: none;
  background: #f1f1f1;
  font-family: var(--fs-body);
  font-size: 15px;
  box-sizing: border-box;
}

.form-box select {
  appearance: none;
  cursor: pointer;
  background-image: url("data:image/svg+xml;utf8,<svg fill='%23555' height='20' viewBox='0 0 24 24' width='20' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");
  background-repeat: no-repeat;
  background-position: right 15px center;
  background-size: 16px;
}

/* Botão */
.form-box button {
  width: 100%;
  padding: 16px;
  border: none;
  border-radius: 10px;
  background: linear-gradient(180deg, #173a67, #0f2747);
  color: #fff;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.25s ease;
  box-shadow: 0 8px 18px rgba(15,39,71,0.35),
              inset 0 -3px 6px rgba(0,0,0,0.25);
}

.form-box button:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 28px rgba(15,39,71,0.45),
              inset 0 -3px 6px rgba(0,0,0,0.25);
}

.form-box button:active {
  transform: translateY(1px);
  box-shadow: 0 4px 10px rgba(15,39,71,0.35),
              inset 0 3px 6px rgba(0,0,0,0.35);
}

.form-box button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  box-shadow: none;
}
/* ================= RESPONSIVO ================= */

@media (max-width: 1100px){

  .hero{
    flex-direction: column;
    align-items: center;
    padding: 40px 30px;
    gap:40px;
  }

  .hero-left{
    width:100%;
    text-align:center;
  }

  .form-box{
    width:100%;
    max-width:420px;
    margin:0 auto;
    transform:none;
  }

}

/* Tablet */
@media (max-width:768px){

  header{
    padding:14px 20px;
  }

  header nav{
    display:none; /* evita quebrar menu */
  }

  .hero{
    margin-top:70px;
  }

  .form-box{
    width:100%;
    max-width:420px;
    padding:20px;
  }

}

/* Mobile */
@media (max-width:480px){

  .hero{
    padding:30px 20px;
  }

  .hero-left h1{
    font-size:26px;
  }

  .form-box{
    width:100%;
    max-width:100%;
    border-radius:18px;
    padding:18px;
  }

  .form-box input,
  .form-box select{
    padding:14px;
    font-size:14px;
  }

  .form-box button{
    padding:16px;
    font-size:15px;
  }

}
/* ================= CHECKBOX ================= */
.terms-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  line-height: 1.3;
  cursor: pointer;
}

.terms-label input[type="checkbox"] {
  width: 14px;
  height: 14px;
  accent-color: #173a67;
  cursor: pointer;
}

.terms-label input[type="checkbox"]:hover {
  box-shadow: 0 0 0 1.5px #173a67;
}

.terms-label a {
  color: #173a67;
  font-weight: 600;
  text-decoration: none;
}

.terms-label a:hover {
  text-decoration: underline;
}


/* ================= TELEFONE COM PAÍS ================= */

.phone-field{
  display:grid;
  grid-template-columns:90px 1fr;
  gap:10px;
  margin-bottom:10px;
}


/* Garante padrão visual idêntico */
.phone-field select,
.phone-field input{
  margin-bottom:0; /* remove o gap duplo */
}

/* Remove estilo nativo feio do select */
.phone-field select{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  background:#f1f1f1;
  cursor:pointer;

  background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 fill=%22%23666%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M7 10l5 5 5-5%22/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 12px center;
  background-size:14px;
}

/* Ajuste mobile */
@media (max-width: 600px){
  .phone-field{
    grid-template-columns:80px 1fr;
  }
}
/* ===== BANDEIRAS ===== */

.country-select.flag-br{
  background-image:
    url("https://flagcdn.com/w20/br.png"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23666' viewBox='0 0 24 24'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E");
}

.country-select.flag-us{
  background-image:
    url("https://flagcdn.com/w20/us.png"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23666' viewBox='0 0 24 24'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E");
}

.country-select.flag-pt{
  background-image:
    url("https://flagcdn.com/w20/pt.png"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23666' viewBox='0 0 24 24'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E");
}
/* espaço para a bandeira antes do DDI */
/* força a bandeira ANTES do +DDI */
.country-select.flag-br,
.country-select.flag-us,
.country-select.flag-pt{
  background-repeat:no-repeat;
  background-position:
    10px center,        /* bandeira */
    right 10px center; /* seta */
  background-size:
    17px;

  padding-left:30px; /* espaço da bandeira */
}

/* ================= MULTIPLO SELECT ================= */
.select-wrapper{
  position:relative;
  width:100%;
  margin-bottom:18px;
}

/* Copia exatamente o padrão do select */
.custom-select{
  position:relative;
}

.custom-select::after{
  content:"";
  position:absolute;
  right:15px;
  top:50%;
  width:14px;
  height:14px;
  transform:translateY(-50%);
  pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='%23666' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E") no-repeat center;
  background-size:18px;
}

.custom-select:hover{
  border-color:#173a67;
}

/* Dropdown */
.custom-options{
  position:absolute;
  top:100%;
  left:0;
  width:100%;
  background:#fff;
  border:1px solid #d9d9d9;
  border-radius:8px;
  margin-top:5px;
  padding:8px 0;
  display:none;
  box-shadow:0 8px 20px rgba(0,0,0,0.06);
  z-index:100;
}

/* Alinhamento correto */
.custom-options label{
  display:flex;
  align-items:center;       /* centraliza verticalmente */
  gap:12px;
  padding:12px 16px;
  cursor:pointer;
  font-size:14px;
  line-height:1;            /* remove altura extra do texto */
}

/* Hover elegante */
.custom-options label:hover{
  background:#f3f4f6;
}

/* Checkbox alinhado e padronizado */
.custom-options input[type="checkbox"]{
  width:16px;
  height:16px;
  accent-color:#173a67;
  margin:0;
  transform: translateY(-1px); /* 🔥 ajuste fino visual */
}

/* Texto ocupa o resto */
.custom-options label span{
  flex:1;
}
.custom-options input:checked + span{
  font-weight:600;
  color:#173a67;
}
/* ================= SECTIONS ================= */
section{
  padding:clamp(80px,10vw,120px) 80px;
}

.dark-section,
.strategy-results{
  background:radial-gradient(circle at center,#1a1a1a,#0b0b0b);
}

.logo {
  width: 150px;   /* ajuste aqui */
  height: auto;   /* mantém proporção */

  display:block;
  margin:0;
}

.logos{
    margin-top:-10px;
    background: linear-gradient(270deg,#E0E0E0,#E0E0E0);;
    text-align:center;
    padding:50px 80px;
    color:#555;
    border-top:1px solid rgba(0,0,0,0.1);
    border-bottom:1px solid rgba(0,0,0,0.1);
}

.logos h4{
font-weight:500;
margin-bottom:25px;
font-size:var(--fs-h4);
letter-spacing:.3px;
}

/* LINHA ENTRE TEXTO E LOGOS */
.logos-divider{
    height:2px;
    width:100%;
    max-width:900px;
    margin:0 auto 30px auto;
    background:linear-gradient(to right,
    transparent,
    rgba(0,0,0,0.4),
    transparent);
}

.logo-row{
    display:flex;
    justify-content:center;
    gap:70px;
    font-weight:600;
    opacity:.7;
    font-size:var(--fs-h3);
}

/* ================= TEXT ================= */
p{
  font-size:var(--fs-body);
  line-height:var(--lh-loose);
  color:#C4C4C4;
}

small{
  font-size:var(--fs-xs);
  color:#9a9a9a;
}

/* ================= LINHA DIVISÓRIA ESCURA (IMAGEM 3) ================= */

.divider-dark{
    height:1px;
    background:linear-gradient(to right, transparent, rgba(255,255,255,.15), transparent);
    margin:0;
}

/* ================= DARK SECTIONS ================= */

.dark-section{
    background:radial-gradient(circle at center,#1a1a1a,#0b0b0b);
    padding:10px 80px;
}

.dark-section.tight-top{
  padding-top:40px; /* ajuste fino */
}
.split{
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.split-text{
    width:48%;
}

.split-text h2{
    font-family:'Playfair Display',serif;
    font-size:36px;
    margin-bottom:25px;
}

.split-text p{
    color:#bbb;
    margin-bottom:14px;
}

.case-box{
    width:45%;
    background:#141414;
    border:1px solid rgba(255,59,59,.6);
    border-radius:20px;
    padding:30px;
    box-shadow:0 0 40px rgba(255,59,59,.25);
}

.dark-section > h3{
  text-align:center;
  max-width:700px;
  margin:0 auto 60px;
  font-weight:400;
  opacity:.75;
}


/* ================= RESULTS CARDS Meta Ads - Campanha Conversão ROAS 4.2x================= */
.results-wrapper{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
}

/* ================= RESULTS CARDS BOTÕES LATERAIS ================ */

.results-slider-wrapper{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center; /* centraliza */
    margin-top:40px;
}
/* ================= RESULTS CARDS carrossel================= */

/* Container dos cards */
.results-cards {
  display: flex;
  gap: 10px;
  transition: transform .30s ease;
  will-change: transform;
  align-items: center; /* 👈 importante */
}

/* Card base */
.result-card {
  flex: 0 0 170px;
  height: 300px;
  border-radius: 18px;
  overflow: hidden;
  opacity: .3;
  transform: scale(.80);
  transition: transform .5s ease, opacity .5s ease;
  border:1px solid rgba(255,59,59,.8);
  box-shadow:0 0 15px rgba(255,59,59,.35);
  transform-origin: center center;
}

#resultsSlider{
  width: calc((170px * 3) + (10px * 2));
  overflow: hidden;
  margin: 0 auto;
  position: relative;
  padding: 50px 20px;
}

/* CARD ATIVO (meio) */
.result-card.active{
    opacity:1;
    transform: scale(1);
    z-index: 2;
}

/* IMAGEM */
.result-card img{
    width:100%;
    height:100%;
    object-fit:cover;
    filter:brightness(.75);
}

/* OVERLAY texto */
.result-content{
    position:absolute;
    bottom:0;
    left:0;
    padding:20px;
    color:#fff;
    z-index:2;
}

.result-content h4{
    font-size:14px;
    margin-bottom:6px;
    letter-spacing:.5px;
}

.result-content p{
    font-size:13px;
    opacity:.9;
}

.result-card:hover{
    transform: translateY(-1px) scale(1.05);
    box-shadow:0 0 30px rgba(255,59,59,.6);
}

.result-content h4{
    font-size:14px;
    margin-bottom:6px;
    letter-spacing:.5px;
}

.result-content p{
    font-size:13px;
    opacity:.9;
    color: #E0E0E0;
}

@media (max-width:768px){

  #resultsSlider{
    width:220px;        /* card + pequeno peek */
    margin:0 auto;
    padding:50px 20px;  /* respiro dos dois lados */
    box-sizing:content-box;
  }

  .results-cards{
    justify-content:flex-start; /* deixa o JS controlar a posição */
  }

}
}
/* ================= COLUNA ESQUERDA ================= */

.strategy-left{
    position:relative;
}

.strategy-left h2{.strategy-grid{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
}
    font-family:'Playfair Display',serif;
    font-size:var(--fs-h2)
    margin-bottom:25px;
}

.strategy-left ul{
    list-style:none;
}

.strategy-left li{
    margin-bottom:14px;
    color:#bbb;
}

/* ================= COLUNA DIREITA ================= */

.results-right{
    width:50%;
    padding-left:60px;
    border-left:1px solid rgba(255,255,255,0.15);
}

.results-right h2{
    font-family:'Playfair Display',serif;
    font-size:var(--fs-h2)
    margin-bottom:30px;
}

/* BOTÕES LATERAIS */

.slider-btn{
position:absolute;
width:45px;
height:45px;
border-radius:50%;
border:1px solid rgba(255,59,59,.9);
background:rgba(255,0,0,0.08);
color:#fff;
font-size:22px;
cursor:pointer;
display:flex;
align-items:center;
justify-content:center;
z-index:5;

box-shadow:
0 0 15px rgba(255,0,0,.5),
inset 0 0 10px rgba(255,0,0,.3);

transition:.3s;
}

.slider-btn:hover{
background:rgba(255,0,0,0.18);
box-shadow:
0 0 25px rgba(255,0,0,.8),
inset 0 0 12px rgba(255,0,0,.4);
}

.slider-btn.left{
left:-5px;
}

.slider-btn.right{
right:-5px;
}

/* ================= ICONE 1 ================= */
.bullet{
  position:relative;
  padding-left:32px;
  margin-bottom:10px;
  color:#ddd;
  line-height:1.45;
}
.bullet--alert:last-of-type {
  margin-bottom: 60px; /* controla o espaço aqui */
}

.bullet--alert::before{
  content:"";
  position:absolute;
  left:0;
  top:3px;
  width:20px;
  height:20px;

  background-repeat:no-repeat;
  background-size:contain;
  background-image:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
<circle cx='12' cy='12' r='10.5' fill='none' stroke='%23ff3b3b' stroke-width='1.8'/>\
<line x1='12' y1='7.2' x2='12' y2='12.8' stroke='%23ff3b3b' stroke-width='2' stroke-linecap='round'/>\
<circle cx='12' cy='16.8' r='1.3' fill='%23ff3b3b'/>\
</svg>");

  filter:
    drop-shadow(0 0 6px rgba(255,59,59,.45))
    drop-shadow(0 0 14px rgba(255,59,59,.25));
}

.bullet--success::before{
  content:"";
  position:absolute;
  left:0;
  top:3px;
  width:20px;
  height:20px;
  background-repeat:no-repeat;
  background-size:contain;
  background-image:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
<circle cx='12' cy='12' r='11' fill='%231d3e6f'/>\
<path d='M7 12.5l3 3 7-7' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/>\
</svg>");
filter:
    drop-shadow(0 0 6px rgba(29,62,111,.45))
    drop-shadow(0 0 14px rgba(29,62,111,.25));
}

/* ================ SETA LADO DO VIDEO ===================*/

/* CONTAINER DO TEXTO */
.arrow1{
  position:relative;
  padding-left:5px;
  margin-bottom:10px;
  color:#ddd;
  line-height:1.45;
}

body{
  background:#000;
}

.neon-arrows{
  width:220px;
  margin:40px auto;
}

.neon-arrows svg{
  width:100%;
  height:auto;
  overflow:visible;
}

.arrow polyline{
  fill:none;
  stroke:#ff1f1f;
  stroke-width:10;
  stroke-linecap:round;
  stroke-linejoin:round;

  /* Glow pesado igual da imagem */
  filter:
    drop-shadow(0 0 6px rgba(255,0,0,.9))
    drop-shadow(0 0 20px rgba(255,0,0,.8))
    drop-shadow(0 0 40px rgba(255,0,0,.6))
    drop-shadow(0 0 70px rgba(255,0,0,.4));
}

/* Aura difusa atrás (camada extra) */
.neon-arrows::after{
  content:"";
  position:absolute;
  inset:0;
  filter:blur(40px);
  background:radial-gradient(circle at center, rgba(255,0,0,.35), transparent 70%);
  z-index:-1;
}
/* ================= VIDEO RESPONSIVO DENTO DO CASE BOX ================= */

/* Vídeo responsivo no case-box */
.case-box-video{
  width:50%;
  padding-left:60px;
  flex:1;
  min-width:0; /* evita ser espremido */

  max-width:700px; /* opcional: controla o tamanho máximo */
  margin:0 auto;
  padding:0;
  border:none;
  box-shadow:none;
}

.video-wrapper{
  border:2px solid rgba(255,59,59,.7);
  box-shadow:0 0 25px rgba(255,59,59,.25);
  position:relative;
  width:100%;
  padding-bottom:56.25%; /* 16:9 */
  overflow:hidden;
  border-radius:20px;
}

.video-wrapper iframe{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}

/* ================= TITULO ================= */
.section-title{
  grid-column:1 / -1;
  text-align:center;
  max-width:900px;
  margin:0 auto 80px;
  font-family:'Playfair Display', serif;
  font-size:34px;
}

.strategy-left h3{
  margin-bottom:24px;
}

.results-right h3{
  margin-bottom:24px;
}
.results-right ul{
  list-style:none;
  padding-left:0;
}

/* ================= PROVA VISUAL TRAFEGO ================= */

.proof-box{
  background:#141414;
  border:1px solid rgba(255,59,59,.7);
  border-radius:14px;
  padding:10px 10px;
  box-shadow:0 0 40px rgba(255,59,59,.25);
}

.proof-print{
  background:linear-gradient(180deg,#1b1b1b,#101010);
  border-radius:14px;
  padding:7px;
  margin-bottom:15px;
  border:1px solid rgba(255,255,255,.05);
}
.proof-print h3{
  margin: 0 0 2px 0; /* topo | direita | baixo | esquerda */
}

.proof-print p{
  margin: 4px 0;
}
.proof-metrics{
  display:flex;
  margin-top:20px;
  gap:15px;
}

.metric{
  flex:1;
  background:#111;
  border:1px solid rgba(255,0,0,0.4);
  border-radius:15px;
  padding:18px 15px;
  text-align:center;
  transition:0.3s;
}

.metric:hover{
  transform:translateY(-3px);
  box-shadow:0 0 25px rgba(255,0,0,0.15);
}

.metric h4{
  color:#ff2a2a;
  font-size:26px;
  margin-bottom:8px;
}

.metric p{
  font-size:14px;
  color:#bbb;
}
@media (max-width:768px){

  .proof-box{
    padding:24px 18px;   /* reduz respiro lateral */
    max-width:100%;
    box-sizing:border-box;
  }

  .proof-print{
    padding:16px;
  }

  .proof-metrics{
    flex-direction:column;
    width:100%;
  }

  .metric{
    width:100%;
    box-sizing:border-box;
  }

}
/* ================= REDES VISUAL ================= */

.social-proof{
  width:100%;
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:24px;
}

.social-card{
  padding:28px;
  min-height:160px;
  background:#141414;
  border:1px solid rgba(255,59,59,.6);
  border-radius:18px;
  padding:22px;
  box-shadow:0 0 25px rgba(255,59,59,.25);
  transition:.3s;
}

.social-card:hover{
  transform:translateY(-5px);
  box-shadow:0 0 45px rgba(255,59,59,.5);
}

.social-card h4{
  margin-bottom:8px;
  font-size:15px;
  letter-spacing:.5px;
}

.social-card p{
  font-size:13px;
  color:#bbb;
}

.social-number{
  font-size:22px;
  color:#ff3b3b;
  font-weight:600;
  margin-bottom:6px;
}

/* ================= HERO STEP ================= */

.hero-step{
  display:flex;
  align-items:flex-start;
  gap:18px;
  margin:30px 0 35px;
  padding:18px 22px;
  background:rgba(0,0,0,0.05);
  border-left:3px solid #1d3e6f;
  border-radius:10px;
}

.step-icon{
  min-width:38px;
  height:38px;
  border-radius:50%;
  background:linear-gradient(180deg,#2e5b9a,#1d3e6f);
  display:flex;
  align-items:center;
  justify-content:center;
}

.step-content h4{
  font-size:15px;
  margin-bottom:4px;
  color:#111;
}

.step-content p{
  font-size:14px;
  margin-bottom:4px;
  color:#222;
}

.step-content small{
  font-size:12px;
  color:#555;
}

/* ================= CTA ================= */
.cta-inline .cta-action small {
  display: block;      /* garante que ocupe linha própria */
  margin-top: 10px;   /* distância do botão */
  margin-bottom: 20px;    /* remove espaço extra abaixo */
  line-height: 1.2;    /* opcional: reduz altura da linha */
}
.cta{
text-align:center;
padding:120px 80px;
background:linear-gradient(180deg,#141414,#0c0c0c);
}

.cta h2{
margin-bottom:32px;
}

.cta button{
  padding:18px 48px;
  border:none;
  border-radius:50px;
  background:linear-gradient(180deg,#2e5b9a,#1d3e6f);
  color:#fff;
  font-weight:600;
  box-shadow:0 0 25px rgba(46,91,154,.6);
  transition:.3s;
}

.cta button:hover{
  transform:translateY(-2px);
  box-shadow:0 0 40px rgba(46,91,154,.85);
}

.cta-action{
  margin-top: 24px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
}

.cta-action small{
  font-size:15px;
  color:#b5b5b5;
  opacity:.85;
}

/* CTA INTEGRADO AO BLOCO */
.cta-inline{
    padding-bottom: 5px; /* antes estava maior? diminua para 0 ou 20px */
   margin-top: 40px;
  padding-top: 20px;
  border-top: none;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}

.cta-inline h3{
  font-family:'Playfair Display', serif;
  font-size:10px;
  max-width:720px;
  margin-bottom:28px;
}

.cta-inline .cta-action{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
}

.cta-inline button{
  padding:18px 46px;
  border:none;
  border-radius:50px;

  background:linear-gradient(180deg,#2e5b9a,#1d3e6f);
  color:#fff;
  font-weight:600;

  box-shadow:0 0 25px rgba(46,91,154,.6);
  cursor:pointer;
  transition:.3s;
}

.cta-inline button:hover{
  transform:translateY(-2px);
  box-shadow:0 0 40px rgba(46,91,154,.85);
}

.cta-inline small{
  font-size:13px;
  color:#b5b5b5;
  opacity:.85;
}

.cta-action .btn-header{
  background: linear-gradient(180deg,#173a67,#0f2747);
  color:#fff;
  display:inline-block;
  padding:16px;
  border-radius:10px;
  font-weight:600;
  text-decoration:none;
}

/* ================= RESPONSIVO ================= */

@media(max-width:1000px){

.hero{
flex-direction:column;

}

.hero-left{
width:100%;
margin-bottom:60px;
}

.split{
flex-direction:column;
}

.split-text,
.case-box{
width:100%;
margin-bottom:40px;
}

.results{
flex-direction:column;
}

.logo-row{
flex-direction:column;
gap:20px;
}
}

/* ================= FAQ ACCORDION ================= */

.faq-accordion{
  max-width: 900px;
  margin: 60px auto 0; /* centraliza a caixa */
}

.faq-item{
  background:#141414;
  border:1px solid rgba(255,59,59,.65);
  border-radius:18px;
  padding:26px 32px;
  margin-bottom:18px;

  box-shadow:
    0 0 25px rgba(255,59,59,.25);

  transition:.3s;
}

.faq-item[open]{
  box-shadow:
    0 0 45px rgba(255,59,59,.45);
}

/* HEADER CLICÁVEL */
.faq-item summary{
  cursor:pointer;
  font-size:18px;
  font-weight:600;
  list-style:none;

  display:flex;
  justify-content:space-between;
  align-items:center;
}

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

/* ÍCONE + / – */
.faq-item summary::after{
  content:"+";
  font-size:26px;
  color:#ff3b3b;
  transition:.3s;
}

.faq-item[open] summary::after{
  content:"–";
}

/* CONTEÚDO */
.faq-content{
  margin-top:18px;
  font-size:15px;
  line-height:1.6;
  color:#cfcfcf;
}

.faq-content ul{
  margin:12px 0 16px;
  padding-left:20px;
}

.faq-content li{
  margin-bottom:8px;
}

/* ================= DIVISOR FOOTER ================= */

.footer-divider{
height:1px;
background:linear-gradient(to right, transparent, rgba(255,255,255,.15), transparent);
}

/* ================= FOOTER ================= */

footer{
  background:radial-gradient(circle at top,#151515,#0b0b0b);
  padding:40px 32px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:var(--fs-xs);
  color:#9a9a9a;
  position:relative;
}


.footer-links{
  display:flex;
  gap:30px;
  justify-content:center;
  flex:1;
  transform:translateX(-5%);
}

.footer-left{
display:flex;
align-items:center;
gap:25px;
}

.footer-logo{
font-weight:600;
letter-spacing:1px;
color:#fff;
}

.footer-links a{
color:#9a9a9a;
text-decoration:none;
transition:.2s;
}

.footer-links a:hover{
color:#fff;
}

.footer-right{
display:flex;
gap:18px;
font-size:16px;
}

.footer-right a{
color:#9a9a9a;
text-decoration:none;
transition:.3s;
}

.footer-right a:hover{
color:#fff;
}


.footer-links a:not(:last-child)::after{
  content:"|";
  margin-left:30px;
  color:#444;
}
/* RESPONSIVO */
@media(max-width:900px){

    footer{
    flex-direction:column;
    gap:20px;
    text-align:center;
    }

    .footer-left{
    flex-direction:column;
    gap:10px;
    }
}

.footer-right a{
  color:#9a9a9a;
  transition:.3s;
  display:flex;
  align-items:center;
}

.footer-right a:hover{
  color:#ff3b3b;
  transform:translateY(-2px);
}

/* LOGO ITEM */
.logo-item{
  display:flex;
  flex-direction: column;
  align-items:center;
  gap:10px;
  text-decoration:none;
  color:#555;
  font-weight:600;
  transition:.3s;
}

.logo-item img{
  height:60px;
  width:auto;
  transition: .3s ease;
  object-fit:contain;
  filter:grayscale(100%);
  opacity:.8;
  transition: .3s ease;
}

.logo-item:hover{
  transform: scale(1.08);
  color:#000;
}

.logo-item:hover img{
  filter:grayscale(0%);
  opacity:1;
}

/* ================= COLUNA ESQUERDA ================= */

.strategy-left{
  position:relative;
  flex:0 0 50%;
  color:#fff;
  flex:1;
  min-width:46%;
  padding-right:35px;

}

.strategy-left h2{
  font-size:42px;
  line-height:1.2;
  margin-bottom:20px;
}

.strategy-left p{
  font-size:20px;
  opacity:.8;
}

/* ================= COLUNA DIREITA ================= */

.case-box{
  flex:1;
  position:relative;
  z-index:2;
}

.case-box video{
  width:100%;
  border-radius:30px;
}


/* ================= SETAS DECORATIVAS ================= */

.arrow{
  position:absolute;
  top:70%;
  transform:translateY(-50%);
  right:-120px; /* força sair pra fora */
  width:260px;
  height:260px;
  pointer-events:none;
  z-index:0;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'><polyline points='30,40 120,100 30,160' fill='none' stroke='%23ff1f1f' stroke-width='18' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat center/contain;

  filter:
    drop-shadow(0 0 20px rgba(255,0,0,.6))
    drop-shadow(0 0 60px rgba(255,0,0,.35));
}

/* posições para profundidade */
.arrow-1{
  right:100px;
  opacity:.35;
  animation:pulseArrow 4s ease-in-out infinite;
}

.arrow-2{
  right:50px;
  transform:translateY(-50%) scale(.8);
  opacity:.22;
}

.arrow-3{
  right:10px;
  transform:translateY(-50%) scale(.6);
  opacity:.15;
}

@keyframes pulseArrow{
  0%{opacity:.25;}
  50%{opacity:.4;}
  100%{opacity:.25;}
}

/* ================= RESPONSIVO ================= */

@media(max-width:1000px){

  .split{
    flex-direction:column;
  }

  .arrow{
    display:none;
  }

}

.results-right{
width:50%;
padding-left:60px;
border-left:1px solid rgba(255,255,255,0.15);
}


/* ================= BOTÕES ACIMA ================= */

.services-row .proof-print{
  flex: 0 0 32%; /* largura fixa */
  padding: 5px 10px;
  border-radius: 12px;
  transition: all .3s ease;
  cursor: pointer;
}

.services-row{
  display:flex;
  gap:20px;

   margin: 10px 0 10px 0; /* 👈 aumenta espaço embaixo */
   justify-content:center; /* centraliza */
}

.services-row .proof-print:hover{
  transform: translateY(-4px);
  border: 1px solid #ff2a2a;
  box-shadow:
    0 0 20px rgba(255,0,0,.25),
    0 10px 25px rgba(0,0,0,.4);
}

.services-row .proof-print h3{
  font-size: 18px;
  margin-bottom: 1px;
}

.services-row .proof-print p{
  font-size: 13px;
}

/* ===== FIX DEFINITIVO MOBILE OVERFLOW ===== */
@media (max-width: 768px){

  html, body{
    width:100%;
    max-width:100%;
    overflow-x:hidden;
  }
  /* SEÇÕES GRANDES */
 .dark-section,
 .strategy-results,
 .results-wrapper,
 .cta,
  footer{
    padding-left:16px !important;
    padding-right:16px !important;
    max-width:100%;
  }

  /* COLUNAS */
  .split,
  .strategy-grid,
  .results-wrapper{
    flex-direction:column;
  }

  .results-left,
  .results-right,
  .strategy-left,
  .case-box{
    width:100%;
    padding:0;
    border:none;
  }

  /* SETAS / DECORATIVOS */
  .arrow,
  .neon-arrows{
    display:none !important;
  }

  /* SERVICES */
  .services-row{
    flex-direction:column;
    width:100%;
  }

  .services-row .proof-print{
    width:100%;
  }
}



/* ================= CHECKBOX TERMO E POLITICAS ================= */

.terms-box{
  margin:6px;
  text-align:left;
}

.terms-label{
  display:flex;
  align-items:center; /* 👈 centraliza verticalmente */
  gap:8px;
  font-size:14px;
  line-height:1.4;
  cursor:pointer;
}

.terms-label a{
  color:#173a67;
  font-weight:600;
  text-decoration:none;
}

.terms-label a:hover{
  text-decoration:underline;
}

/* BOTÃO DESABILITADO */
.form-box button:disabled{
  opacity:0.5;
  cursor:not-allowed;
  box-shadow:none;
}
.terms-label{
  display: flex !important;
  align-items: center !important;
  gap: 8px;
}

.terms-label input{
  margin: 0;
  transform: translateY(0);
}

.terms-label span{
  display: inline;
}

/* ================= CUPOM BOX ================= */

.cupom-box{
  margin:15px 0;
}

.cupom-input{
  display:none;
  margin-top:10px;
  animation: fadeIn 0.3s ease;
}

.cupom-input input[type="text"]{
  width:100%;
  padding:14px;
  border-radius:10px;
  border:1px solid #ccc;
}

@keyframes fadeIn{
  from{opacity:0; transform:translateY(-5px);}
  to{opacity:1; transform:translateY(0);}
}

/* ================= CHECKBOX NATIVO COM HOVER PRECISO ================= */

.terms-label{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:14px;
  line-height:1.3;
  cursor:pointer;
}

.terms-label input[type="checkbox"]{
  width:14px;
  height:14px;
  accent-color:#173a67;
  cursor:pointer;
}

/* Hover com contorno exato */
.terms-label input[type="checkbox"]:hover{
  box-shadow: 0 0 0 1.5px #173a67;
}


/* ================= PAGINA DE POLITICAS ================= */


.legal-container h1{
    color:#173a67 !important;
  font-weight:600;
}
.legal-container h2{
   color:#173a67 !important;
   font-weight:600;
}

.legal-container ul{
  padding-left: 20px;   /* controla distância da bolinha */
  margin-left: 0;
}

.legal-container li{
  margin-bottom: 8px;
}


/* ÁREA CENTRAL */
.legal-page{
  background:linear-gradient(270deg,#E0E0E0,#F7F7F7);
  margin:0;
  padding:80px 20px 80px;
  display:flex;
  justify-content:center;
}

/* CARD ESTILO FORM */
.legal-page .legal-container{
  width:100%;
  max-width:900px;
  padding:60px;
  border-radius:20px;
  background:#fff;
  border:1px solid transparent;
  background:
    linear-gradient(#fff,#fff) padding-box,
    linear-gradient(to top,rgba(255,59,59),rgba(255,247,247,.6)) border-box;
  box-shadow:
    0 10px 25px rgba(0,0,0,.08),
    0 30px 60px rgba(0,0,0,.12);
}

/* TIPOGRAFIA */
.legal-container h1{
  margin-bottom:20px;
}

.legal-container h2{
  margin-top:30px;
}

.legal-container p,
.legal-container li{
  line-height:1.7;
  color:#222;
}

.legal-page{
  padding: 30px 20px;
  background: #f8f9fb;
}

.legal-container{
  max-width: 900px;      /* controla largura do texto */
  margin: 0 auto;        /* centraliza */
  text-align: left;      /* mantém leitura profissional */
  line-height: 1.7;
  color: #1c1c1c;
}

/* Títulos */

.legal-container h1{
  font-size: 42px;
  margin-bottom: 25px;
  font-weight: 700;
}

.legal-container h2{
  font-size: 24px;
  margin-top: 60px;
  margin-bottom: 20px;
  font-weight: 600;
  color: #173a67; /* azul da sua identidade */
}

/* Parágrafos */

.legal-container p{
  margin-bottom: 18px;
  font-size: 17px;
}

/* Listas */

.legal-container ul,
.legal-container ol{
  margin-left: 20px;
  margin-bottom: 25px;
}

.legal-container li{
  margin-bottom: 10px;
  font-size: 16px;
}

/* Linha divisória */

.legal-container hr{
  border: none;
  height: 1px;
  background: #e1e5ea;
}

/* CTA */

.cta-inline{
  text-align: center;
}

.cta-action button{
  padding: 16px 28px;
  border: none;
  border-radius: 10px;
  background: linear-gradient(180deg,#173a67,#0f2747);
  color: #fff;
  font-weight: 600;
  cursor: pointer;
  transition: 0.3s ease;
}

.cta-action button:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 25px rgba(23,58,103,0.25);
}

.cta-action small{
  display: block;
  margin-top: 10px;
  color: #6c757d;
}


.institutional-hero{
  padding:120px 20px 80px;
  text-align:center;
  background:#0f1722;
  color:#fff;
}

.institutional-inner{
  max-width:900px;
  margin:0 auto;
}

.institutional-hero h1{
  font-size:48px;
  font-weight:700;
  margin-bottom:20px;
}

.institutional-hero p{
  font-size:20px;
  opacity:.8;
}

/* ================= PAGINA PREMIUM (A HURACAN ================= */
.institutional-hero{
  padding:80px 20px 30px;
  text-align:center;
  background:linear-gradient(180deg,#0f1722,#0c1a2b);
  color:#fff;
}

.institutional-inner{
  max-width:800px;
  margin:0 auto;
}

.institutional-hero h1{
  font-size:38px;
  font-weight:600;
  margin-bottom:15px;
}

.institutional-hero p{
  font-size:17px;
  opacity:.75;
}
/* ================= CSS CTA PAGINA (A HURACAN) ================= */
.closing-block{
  text-align:center;
  margin:80px 0 40px;
}

.closing-text{
  font-size:18px;
  opacity:.7;
}

.closing-block h3{
  font-size:28px;
  margin-top:10px;
}

/* ================= PORTFÓLIO ================= */

.portfolio-section{
  padding-top:10px;
}

.portfolio-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:30px;
  width:100%;
  max-width:1200px;
  margin:0 auto;
}

/* CARD */
.portfolio-card{
  background:#141414;
  border:1px solid rgba(255,59,59,.65);
  border-radius:20px;
  overflow:hidden;
  cursor:pointer;

  box-shadow:
    0 0 25px rgba(255,59,59,.25);

  transition:.35s ease;
}

.portfolio-card:hover{
  transform:translateY(-6px);
  box-shadow:
    0 0 45px rgba(255,59,59,.45);
}

/* IMAGEM */
.portfolio-card img{
  width:100%;
  height:200px;
  object-fit:cover;
  filter:brightness(.75);
}

/* TEXTO */
.portfolio-info{
  padding:22px;
}

.portfolio-info h4{
  font-size:16px;
  margin-bottom:6px;
  letter-spacing:.5px;
}

.portfolio-info p{
  font-size:14px;
  color:#cfcfcf;
  line-height:1.5;
}

/* RESPONSIVO */
@media(max-width:768px){
  .portfolio-card img{
    height:180px;
  }
}

/* ================= PORTFÓLIO ================= */

.portfolio-hero{
  text-align:center;
  padding:10px 10px 10px;
}

.portfolio-hero h1{
  font-size:var(--fs-h1);
  line-height:var(--lh-tight);
  margin-bottom:10px;
}

.portfolio-hero p{
  color:var(--text-muted);
  font-size:var(--fs-small);
}

/* GRID */

.portfolio-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 240px));
  gap:16px;
  justify-content:center;
  padding:50px 0 50px;
}

/* CARD */

.portfolio-card{
  background:var(--bg-card);
  border-radius:18px;
  overflow:hidden;
  transition:.35s ease;
  border:1px solid rgba(255,255,255,0.04);

}

.portfolio-card:hover{
  transform:translateY(-6px);
  box-shadow:0 20px 50px rgba(0,0,0,.6);
}

.portfolio-card img{
  width:100%;
  height:180px;
  object-fit:cover;
}

.portfolio-info{
  padding:18px;
}

.portfolio-info h3{
  font-size:var(--fs-h4);
  margin-bottom:6px;
}

.portfolio-info span{
  font-size:var(--fs-xs);
  color:var(--text-muted);
}

/* CTA */

.portfolio-cta{
  text-align:center;
  padding:80px 20px;
  background:#000;
  );
}

.portfolio-cta h2{
  font-size:var(--fs-h2);
  margin-bottom:10px;
}

.portfolio-cta p{
  color:var(--text-muted);
  margin-bottom:26px;
}

/* ================= MODAL ================= */

.portfolio-modal .modal-box{
position:relative;
width:90%;
max-width:680px;
max-height:85vh;
overflow-y:auto;
background:#0e0e0e;
border:1px solid #1f1f1f;
border-radius:18px;
padding:42px 38px;
box-shadow:0 30px 80px rgba(0,0,0,.8);
}


.portfolio-modal{
position:fixed;
inset:0;
display:flex;
align-items:center;
justify-content:center;
z-index:9999;
opacity:0;
pointer-events:none;
transition:.35s ease;
}

.portfolio-modal.active{
opacity:1;
pointer-events:auto;
}

/* overlay */
.modal-overlay{
position:absolute;
inset:0;
background:rgba(0,0,0,.7);
backdrop-filter:blur(6px);
}


/* botão fechar */

.modal-close{
position:absolute;
top:18px;
right:18px;
width:36px;
height:36px;
border-radius:50%;
border:1px solid #2a2a2a;
background:#141414;
color:#aaa;
font-size:18px;
cursor:pointer;
display:flex;
align-items:center;
justify-content:center;
transition:all .25s ease;
}

.modal-close:hover{
background:#1f1f1f;
color:#fff;
border-color:#3a3a3a;
transform:scale(1.05);
}

/* meta */

.case-meta{
font-size:11px;
letter-spacing:.14em;
text-transform:uppercase;
color:#8a8a8a;
margin-bottom:10px;
font-weight:500;
}

/* título */

.modal-box h2{
font-size:20px;
font-weight:600;
margin-bottom:32px;
color:#fff;
}

/* seções */

.case-section{
margin-bottom:26px;
padding-bottom:22px;
border-bottom:1px solid rgba(255,255,255,0.05);
}

.case-section:last-of-type{
border-bottom:none;
}

/* label */

.case-label{
display:block;
font-size:13px;
letter-spacing:.05em;
text-transform:uppercase;
margin-bottom:8px;
color:#8a8a8a;
font-weight:500;
}

/* texto */

.case-section p{
color:#d6d6d6;
line-height:1.6;
font-size:15px;
}

/* listas */

.case-section ul{
margin-top:8px;
padding-left:18px;
}

.case-section li{
margin-bottom:6px;
color:#d6d6d6;
font-size:15px;
}

/* scrollbar elegante */

.modal-box::-webkit-scrollbar{
width:6px;
}

.modal-box::-webkit-scrollbar-track{
background:transparent;
}

.modal-box::-webkit-scrollbar-thumb{
background:#2a2a2a;
border-radius:20px;
}

.modal-box::-webkit-scrollbar-thumb:hover{
background:#3a3a3a;
}