:root{
  --navy:#0B1F3A;
  --navy-2:#071827;
  --teal:#0F766E;
  --teal-soft:#DDEFEA;
  --beige:#F6F1EA;
  --warm:#FFFDF8;
  --gold:#C8A45D;
  --ink:#102033;
  --muted:#5F6B7A;
  --line:#E5E7EB;
  --shadow:0 18px 50px rgba(11,31,58,.10);
  --radius:24px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color:var(--ink);
  background:var(--warm);
  line-height:1.6;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

.container{
  width:min(1160px, calc(100% - 40px));
  margin-inline:auto;
}

.topbar{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(255,253,248,.92);
  backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(11,31,58,.08);
}

.header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 0;
  gap:24px;
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  font-weight:800;
  letter-spacing:.02em;
  color:var(--navy);
}
.brand img{
  width:54px;
  height:54px;
  object-fit:contain;
}
.brand span{
  display:block;
  line-height:1.05;
  font-size:1.05rem;
  text-transform:uppercase;
}

.nav{
  display:flex;
  align-items:center;
  gap:24px;
  font-size:.95rem;
  color:#1F2D3D;
}
.nav a{
  opacity:.82;
  transition:.2s ease;
}
.nav a:hover{
  color:var(--teal);
  opacity:1;
}
.nav .cta{
  padding:10px 16px;
  border:1px solid var(--teal);
  border-radius:999px;
  color:var(--teal);
  font-weight:700;
  opacity:1;
}

.hero{
  min-height:700px;
  background-image:
    linear-gradient(90deg, rgba(7,24,39,.94) 0%, rgba(11,31,58,.88) 33%, rgba(11,31,58,.58) 53%, rgba(11,31,58,.20) 72%, rgba(11,31,58,.05) 100%),
    url("assets/hero-bombordo-care.jpg");
  background-size:cover;
  background-position:62% center;
  color:white;
  display:flex;
  align-items:center;
  position:relative;
  overflow:hidden;
}
.hero::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(200,164,93,.75), transparent);
}
.hero-content{
  position:relative;
  z-index:2;
  max-width:610px;
  padding:92px 0;
}

/* V5: regra específica para impedir que o container cole o texto à margem esquerda */
.hero > .container.hero-content{
  width:min(610px, calc(100% - 180px));
  max-width:610px;
  margin-left:clamp(82px, 8vw, 150px);
  margin-right:0;
}
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:#BEE5DF;
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  margin-bottom:22px;
}
.eyebrow::before{
  content:"";
  width:38px;
  height:1px;
  background:var(--gold);
}
h1,h2,h3{
  margin:0;
  color:inherit;
  line-height:1.08;
}
h1{
  font-size:clamp(2.45rem, 4.8vw, 4.55rem);
  letter-spacing:-.055em;
  max-width:610px;
}
.hero p{
  margin:24px 0 32px;
  max-width:560px;
  color:rgba(255,255,255,.88);
  font-size:1.08rem;
}
.actions{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:48px;
  padding:13px 22px;
  border-radius:999px;
  background:var(--teal);
  color:white;
  font-weight:800;
  border:1px solid transparent;
  transition:.2s ease;
}
.button:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(15,118,110,.24)}
.button.secondary{
  background:rgba(255,255,255,.10);
  border-color:rgba(255,255,255,.30);
  color:white;
}

.section{
  padding:92px 0;
}
.section.alt{
  background:var(--beige);
}
.section.dark{
  background:linear-gradient(135deg, var(--navy), var(--navy-2));
  color:white;
}
.section-head{
  max-width:760px;
  margin:0 auto 46px;
  text-align:center;
}
.section-head.left{
  margin:0 0 42px;
  text-align:left;
}
.kicker{
  color:var(--teal);
  font-size:.82rem;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
  margin-bottom:12px;
}
.section.dark .kicker{color:#A7E1DA}
h2{
  font-size:clamp(2rem, 4vw, 3.6rem);
  letter-spacing:-.045em;
}
.section-head p{
  color:var(--muted);
  font-size:1.08rem;
}
.section.dark .section-head p,
.section.dark p{color:rgba(255,255,255,.78)}

.problem-grid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:42px;
  align-items:center;
}
.card{
  background:white;
  border:1px solid rgba(11,31,58,.08);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.problem-card{
  padding:36px;
}
.problem-list{
  display:grid;
  gap:18px;
  margin-top:26px;
}
.mini{
  display:flex;
  gap:16px;
  align-items:flex-start;
}
.icon{
  width:42px;
  height:42px;
  border-radius:14px;
  background:var(--teal-soft);
  color:var(--teal);
  display:grid;
  place-items:center;
  font-weight:900;
  flex:0 0 auto;
}
.mini h3{font-size:1.1rem;color:var(--navy);margin-bottom:3px}
.mini p{margin:0;color:var(--muted)}
.quote-card{
  padding:38px;
  background:linear-gradient(160deg, var(--navy), #123A4E);
  color:white;
}
.quote-card p{
  font-size:1.35rem;
  line-height:1.45;
  margin:0;
}
.quote-card strong{color:#BEE5DF}

.steps{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}
.step{
  padding:28px;
  border-radius:22px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.12);
}
.step-number{
  width:38px;
  height:38px;
  border-radius:999px;
  background:rgba(167,225,218,.16);
  color:#A7E1DA;
  display:grid;
  place-items:center;
  font-weight:900;
  margin-bottom:18px;
}
.step h3{font-size:1.22rem;margin-bottom:8px}
.step p{margin:0;font-size:.96rem}

.services{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}
.service{
  padding:30px;
  min-height:260px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.service h3{
  color:var(--navy);
  font-size:1.35rem;
  margin-bottom:12px;
}
.service p{
  color:var(--muted);
  margin:0;
}
.service .tag{
  align-self:flex-start;
  margin-top:24px;
  padding:7px 11px;
  border-radius:999px;
  background:var(--teal-soft);
  color:var(--teal);
  font-weight:800;
  font-size:.8rem;
}
.service.featured{
  background:linear-gradient(150deg, var(--navy), #123A4E);
  color:white;
}
.service.featured h3{color:white}
.service.featured p{color:rgba(255,255,255,.78)}
.service.featured .tag{background:rgba(167,225,218,.16);color:#A7E1DA}

.audience{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.audience-item{
  padding:24px;
  border-radius:20px;
  background:white;
  border:1px solid rgba(11,31,58,.08);
}
.audience-item h3{
  color:var(--navy);
  font-size:1.16rem;
  margin-bottom:8px;
}
.audience-item p{
  color:var(--muted);
  margin:0;
}

.split{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:48px;
  align-items:start;
}
.contact-panel{
  padding:34px;
  background:white;
  color:var(--ink);
}
.contact-panel h3{
  color:var(--navy);
  font-size:1.5rem;
  margin-bottom:12px;
}
.contact-details{
  margin-top:26px;
  display:grid;
  gap:12px;
  color:var(--muted);
}
form{
  display:grid;
  gap:16px;
}
label{
  font-weight:800;
  color:var(--navy);
  font-size:.92rem;
}
input,textarea{
  width:100%;
  margin-top:7px;
  border:1px solid rgba(11,31,58,.15);
  border-radius:14px;
  padding:14px 15px;
  font:inherit;
  background:#fff;
  color:var(--ink);
}
textarea{min-height:132px;resize:vertical}
.check{
  display:flex;
  gap:10px;
  align-items:flex-start;
  color:var(--muted);
  font-size:.92rem;
}
.check input{
  width:auto;
  margin-top:6px;
}
.legal{
  margin-top:28px;
  padding:18px;
  border-radius:18px;
  background:rgba(15,118,110,.08);
  color:#38515B;
  font-size:.94rem;
}

.footer{
  background:#071827;
  color:white;
  padding:42px 0;
}
.footer-grid{
  display:grid;
  grid-template-columns:1.4fr .8fr .8fr;
  gap:32px;
  align-items:start;
}
.footer p, .footer a{
  color:rgba(255,255,255,.72);
}
.footer h3{
  font-size:1.05rem;
  margin-bottom:12px;
}
.footer-brand{
  display:flex;
  gap:12px;
  align-items:center;
  margin-bottom:14px;
}
.footer-brand img{width:44px;height:44px;object-fit:contain}
.footer-brand strong{text-transform:uppercase;letter-spacing:.03em}
.copyright{
  margin-top:32px;
  padding-top:24px;
  border-top:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.54);
  font-size:.9rem;
}

.privacy-page{
  padding:82px 0;
}
.privacy-content{
  max-width:860px;
  margin:auto;
  background:white;
  padding:42px;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.privacy-content h1{
  color:var(--navy);
  font-size:clamp(2.2rem, 5vw, 4rem);
}
.privacy-content h2{
  color:var(--navy);
  font-size:1.55rem;
  margin-top:30px;
}
.privacy-content p, .privacy-content li{color:var(--muted)}

.success{
  min-height:70vh;
  display:grid;
  place-items:center;
  padding:80px 0;
}
.success-card{
  max-width:720px;
  text-align:center;
  padding:46px;
}

@media (max-width: 900px){
  .nav{
    gap:14px;
    font-size:.86rem;
    flex-wrap:wrap;
    justify-content:flex-end;
  }
  .hero{
    min-height:640px;
    background-position:66% center;
  }
  .hero > .container.hero-content{
    width:min(560px, calc(100% - 84px));
    max-width:560px;
    margin-left:42px;
    margin-right:0;
  }
  h1{
    max-width:560px;
  }
  .problem-grid,.split{
    grid-template-columns:1fr;
  }
  .steps,.services,.audience{
    grid-template-columns:1fr 1fr;
  }
  .footer-grid{
    grid-template-columns:1fr;
  }
}
@media (max-width: 640px){
  .container{width:min(100% - 28px, 1160px)}
  .header{
    align-items:flex-start;
    flex-direction:column;
  }
  .brand img{width:48px;height:48px}
  .nav{
    width:100%;
    justify-content:flex-start;
    gap:12px 16px;
  }
  .nav .cta{display:none}
  .hero{
    min-height:620px;
    background-image:linear-gradient(90deg, rgba(7,24,39,.94) 0%, rgba(11,31,58,.82) 72%, rgba(11,31,58,.58) 100%), url("assets/hero-bombordo-care.jpg");
    background-position:68% center;
  }
  .hero > .container.hero-content{
    width:calc(100% - 48px);
    max-width:calc(100% - 48px);
    margin-left:24px;
    margin-right:24px;
  }
  .hero-content{
    padding:68px 0;
  }
  h1{
    max-width:100%;
  }
  .actions{flex-direction:column;align-items:flex-start}
  .button{width:100%}
  .section{padding:68px 0}
  .steps,.services,.audience{
    grid-template-columns:1fr;
  }
  .privacy-content{padding:28px}
}


/* V5 refinement */
.hero .actions{
  max-width:560px;
}

.form-note{
  margin-top:-6px;
  font-size:.9rem;
  color:#6A7888;
}


/* V8: mensagens elegantes do formulário */
.success-message,
.error-message{
  display:grid;
  gap:6px;
  margin:18px 0 20px;
  padding:18px 18px;
  border-radius:18px;
  border:1px solid rgba(15,118,110,.22);
  background:rgba(15,118,110,.09);
  color:#123A4E;
}

.success-message strong,
.error-message strong{
  color:#0B1F3A;
  font-size:1.02rem;
}

.success-message span,
.error-message span{
  color:#4B5B6B;
  font-size:.95rem;
  line-height:1.5;
}

.error-message{
  border-color:rgba(180,70,70,.25);
  background:rgba(180,70,70,.08);
}

button[disabled]{
  opacity:.7;
  cursor:not-allowed;
}


/* V9: corrige mensagens do formulário a aparecerem antes do envio */
.success-message[hidden],
.error-message[hidden]{
  display:none !important;
}

.success-message:not([hidden]),
.error-message:not([hidden]){
  display:grid;
}