/* Base */
body {
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, sans-serif; 
  color: #444444;
  background-color: #F6F7F9;
}

:root { --heading-font: "Marcellus", ui-serif, Georgia, serif; }

h1, h2, h3, .display-5, .about-title, .b-title, .v-head h2, .hero-title{
  font-family: var(--heading-font);
  font-weight: 400;                 /* é single-weight, já é fininha */
  letter-spacing: 0;                /* mantém postura “clássica” */
  line-height: 1.12;
  color:#2b3f46;
}



/* ajustes finos por tamanho (opcional) */
.display-5, .hero-title { 
  font-weight: 800; 
  line-height: 1.1;
}
.about-title, .b-title, .v-head h2 { 
  font-weight: 700; 
  line-height: 1.15;
}

/* Scroll suave global (fallback caso JS não corra) */
html { scroll-behavior: smooth; }

/* ===== NAVBAR ===== */
#mainNav{
  background: linear-gradient(180deg, #ffffff 0%, #F8FBFA 100%); /* gradiente suave */
  box-shadow: 0 6px 20px rgba(0,0,0,.06);
  padding: clamp(16px, 2vw, 26px) 0; /* mais alto */
  transition: all .3s ease;
  z-index: 1030;
}

/* quando faz scroll: encolhe e sombra mais marcada */
#mainNav.nav-scrolled{
  padding: 10px 0;
  box-shadow: 0 4px 16px rgba(0,0,0,.08);
  background: #fff; /* fundo sólido ao descer */
}

/* logo maior */
#mainNav .navbar-brand img{
  height: 64px; /* antes 44px */
  width: auto;
  transition: height .3s ease;
}
#mainNav.nav-scrolled .navbar-brand img{
  height: 54px;
}

/* links */
#mainNav .nav-link{
  font-size: 1.05rem;
  font-weight: 600;
  color:#2b3f46;
  padding: .9rem 1.1rem !important; /* mais espaço */
  transition: color .25s ease;
}
#mainNav .nav-link:hover,
#mainNav .nav-link:focus{
  color:#215642;
}

/* botão de ação (Agendar Piloto) */
#mainNav .btn{
  font-weight:700;
  padding:.65rem 1.3rem;
  border-radius:12px;
}


/* --------------- HERO ------------------- */
.hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  overflow-x: visible;   /* deixa a imagem “sangrar” um pouco p/ a direita */
  padding-top: 120px;
  padding-bottom: 80px;
  background: #F6F7F9;
}

/* Camada de fundo do hero */
.hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    radial-gradient(1200px 600px at 80% 10%, rgba(126,200,168,.18), transparent 60%),
    radial-gradient(900px 500px at 10% 20%, rgba(74,101,114,.15), transparent 65%),
    linear-gradient(180deg, #FFFFFF 0%, #F6F7F9 100%);
}

/* Grão suave por cima do fundo (mas ainda por baixo do conteúdo) */
.hero-bg::after {
  content: "";
  position: absolute; inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/><feComponentTransfer><feFuncA type='table' tableValues='0 0 0 0 .04'/></feComponentTransfer></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  opacity: .35;
  pointer-events: none;
  z-index: 0;
}

/* Garante que o conteúdo fica no topo */
.hero .container {
  position: relative;
  z-index: 2;
}
.hero .col-lg-6:last-child{ position: static; }

/* Título e destaques */
.hero-title { line-height: 1.15; color: #4A6572; }
.hero-title .highlight {
  background: linear-gradient(90deg, #7EC8A8 0%, #B7E3D1 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.hero-sub { color: #5b6970; }

/* Badge */
.hero-badge {
  background: #EFF8F3;
  color: #3d6a57;
  font-weight: 600;
  letter-spacing: .2px;
  border: 1px solid #DCEFE6;
}

/* ===== HERO IMG — lado-a-lado e grande (sem position:absolute) ===== */

/* Base (mobile/tablet) */
.hero-img{
  position: static;
  display: block;
  max-width: 100%;
  width: min(88vw, 560px);
  height: auto;
  margin: 24px auto 0 auto;       /* centra por baixo do texto em mobile */
  animation: floaty 6s ease-in-out infinite;
}

/* Desktop ≥992px: fica ao lado do texto e pode “sangrar” ligeiro */
@media (min-width: 992px){
  .hero .row > div:last-child{ overflow: visible; }
  .hero-img{
    position: static !important;
    max-width: none !important;   /* ignora .img-fluid do Bootstrap */
    width: clamp(560px, 50vw, 900px);
    height: auto;
    margin: 0;
    transform: translateX(4vw);   /* empurra um pouco para a direita */
    animation: none;              /* evita conflito com transform */
  }
}

@keyframes floaty {
  0%,100% { transform: translateY(0); }
  50%     { transform: translateY(-10px); }
}

/* Blobs decorativos (ficam atrás) */
.blob { 
  position: absolute; 
  filter: blur(10px); 
  pointer-events: none;
  z-index: 1;
}
.blob-1 { width: 460px; right: -120px; top: -80px; }
.blob-2 { width: 380px; left: -100px; bottom: -60px; }

/* Botões (paleta pastel) */
.btn-success { background-color: #7EC8A8 !important; border-color: #7EC8A8 !important; color: #fff !important; }
.btn-primary { background-color: #4A6572 !important; border-color: #4A6572 !important; color: #fff !important; }
.btn-success:hover, .btn-success:focus, .btn-success:active { background-color: #6fb99a !important; border-color: #6fb99a !important; color: #fff !important; }
.btn-primary:hover, .btn-primary:focus, .btn-primary:active { background-color: #405a66 !important; border-color: #405a66 !important; color: #fff !important; }

/* Indicador “scroll” (opcional) */
.scroll-cue {
  position: absolute; left: 50%; bottom: -70px; transform: translateX(-50%);
  width: 26px; height: 42px; border: 2px solid #4A6572; border-radius: 20px; opacity: .55;
}
.scroll-cue span {
  position: absolute; left: 50%; top: 8px; transform: translateX(-50%);
  width: 4px; height: 8px; background: #4A6572; border-radius: 2px;
  animation: drop 1.4s infinite;
}
@keyframes drop {
  0% { transform: translate(-50%, 0); opacity: 1; }
  100% { transform: translate(-50%, 12px); opacity: 0; }
}


/* --------------- RESPONSIVO -------------- */
@media (max-width: 992px){
  .hero { text-align: center; }
  .hero-img { max-height: 300px; margin-top: 20px; }
}
@media (max-width: 576px){
  .blob-1, .blob-2 { display:none; }
  .display-5 { font-size: 1.9rem; }
}

/* Espaço para não esconder o topo das secções ao ancorar manualmente */
section { scroll-margin-top: 140px; }

/* =================== MÓDULOS (COM IMG REAL + ANIMAÇÃO) =================== */

#modulos { position: relative; }

/* Cartão base */
.mod-card {
  --radius: 22px;
  --shadow: 0 10px 30px rgba(0,0,0,.08);
  --overlay: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(3,16,12,.0) 40%, rgba(9,25,20,.55) 75%, rgba(9,25,20,.85) 100%);
  display: block;
  position: relative;
  border-radius: var(--radius);
  overflow: clip;
  aspect-ratio: 16 / 9;
  background: #E9F5EF;
  box-shadow: var(--shadow);
  isolation: isolate;
  transform: translateZ(0);
  text-decoration: none;
}

/* Media layer c/ imagem real */
.mod-media{ position:absolute; inset:0; }
.mod-img {
  width:100%; height:100%;
  display:block;
  object-fit: contain;      /* mostra tudo */
  object-position: center;
  background:#fff;          /* evita barras pretas */
}


/* Borda energética (ativa no hover) */
.mod-card::before{
  content:"";
  position:absolute; inset:0;
  border-radius: inherit;
  padding: 1px;
  background: conic-gradient(from 0deg, #7EC8A8, #4A6572, #B7E3D1, #7EC8A8);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  opacity: 0;
  animation: spin 6s linear infinite;
  animation-play-state: paused;
  pointer-events: none;
}
@keyframes spin { to { transform: rotate(1turn); } }
.mod-card:hover::before{ opacity: .9; animation-play-state: running; }

/* Sheen diagonal subtil no hover */
.mod-card::after{
  content:"";
  position:absolute; inset:-20%;
  background: linear-gradient(60deg, transparent 35%, rgba(255,255,255,.08) 50%, transparent 65%);
  transform: translateX(-40%);
  transition: transform .9s ease;
  pointer-events: none;
}
.mod-card:hover::after{ transform: translateX(40%); }

/* Tag num canto */
.mod-tag{
  position:absolute; top:14px; left:14px;
  background: rgba(255,255,255,.85);
  color:#2b434b;
  font-weight:700;
  font-size:.85rem;
  padding:.35rem .6rem;
  border-radius: 999px;
  box-shadow: 0 4px 10px rgba(0,0,0,.08);
  z-index: 3;
}

/* Seta minimal ao fundo (visível sem hover) */
.mod-arrow{
  --size: 44px;
  position:absolute; left:50%; bottom:14px; transform: translateX(-50%);
  width: var(--size); height: var(--size);
  border: 2px solid rgba(255,255,255,.9);
  border-radius: 999px;
  display:grid; place-items:center;
  z-index: 3;
  backdrop-filter: blur(4px);
  background: rgba(0,0,0,.15);
}
.mod-arrow::before{
  content:"";
  width: 12px; height: 12px;
  border-right: 2px solid #fff; 
  border-bottom: 2px solid #fff;
  transform: rotate(45deg) translateY(-1px);
  transform-origin: center;
  opacity:.95;
}
@keyframes breathe {
  0%,100% { transform: translateX(-50%) translateY(0); opacity: .9; }
  50%     { transform: translateX(-50%) translateY(-4px); opacity: 1; }
}
.mod-arrow { animation: breathe 1.8s ease-in-out infinite; }
.mod-card:hover .mod-arrow { animation: none; opacity: 0; transition: opacity .3s; }

/* Overlay de info */
.mod-info{
  position:absolute; inset:0;
  display:flex; flex-direction:column; justify-content:flex-end; gap:.6rem;
  padding: 24px;
  color:#fff;
  background: var(--overlay);
  backdrop-filter: blur(3px);
  z-index: 2;

  clip-path: circle(0% at 50% 92%);
  transition: clip-path .65s cubic-bezier(.2,.9,.2,1), opacity .2s;
  opacity: 0;
}
.mod-card:hover .mod-info{
  clip-path: circle(140% at 50% 92%);
  opacity: 1;
}

/* Tipografia dentro do overlay */
.mod-info h3{ margin:0; font-size: clamp(1.1rem, 1.2rem + .3vw, 1.5rem); color: rgba(255,255,255,.95); font-weight: 800; letter-spacing:.2px; }
.mod-info p{ margin:0 0 .4rem 0; color: rgba(255,255,255,.95); }
.mod-info .btn{ align-self: flex-start; border-color: rgba(255,255,255,.85) !important; color:#fff !important; }
.mod-info .btn:hover{ background-color: rgba(255,255,255,.15) !important; color:#fff !important; }

/* ===== Aparecer ao fazer scroll (stagger + suavidade) para os MÓDULOS ===== */
.mod-card { opacity: 1; transform: none; filter: none; } /* no-JS */
.mod-card.will-reveal{ opacity: 0; transform: translateY(var(--reveal-ty, 24px)) scale(.985); filter: saturate(.9) blur(.6px); }
.mod-card.is-in{
  opacity: 1; transform: none; filter: none;
  transition: transform .70s cubic-bezier(.2,.9,.2,1), opacity .55s ease, filter .55s ease;
  transition-delay: var(--d, 0ms); will-change: transform, opacity, filter;
}

/* =================== REVEAL GLOBAL (textos/imagens) =================== */
.reveal{ opacity: 0; transform: translateY(24px); filter: blur(4px);
  transition: transform .70s cubic-bezier(.2,.9,.2,1), opacity .55s ease, filter .55s ease; transition-delay: var(--d, 0ms); will-change: transform, opacity, filter; }
.reveal[data-reveal="fade-right"]{ transform: translateX(28px); }
.reveal[data-reveal="fade-left"]{ transform: translateX(-28px); }
.reveal[data-reveal="fade-in"]{ transform: none; filter: blur(4px); }
.reveal.show{ opacity: 1; transform: none; filter: none; }

/* =================== SPLIT TEXT =================== */
.split-chars{ display:inline-block; word-break: keep-all; }
.split-chars .char{ display:inline-block; opacity:0; transform: translateY(.6em);
  transition: transform .6s cubic-bezier(.2,.9,.2,1), opacity .6s ease;
  transition-delay: calc(var(--i, 0) * var(--split-stagger, 24ms)); will-change: transform, opacity; }
.split-chars.split-in .char{ opacity:1; transform:none; }

.split-words{ display:inline-block; word-break: normal; }
.split-words .word{ display:inline-block; white-space: nowrap; opacity:0; transform: translateY(.7em);
  transition: transform .6s cubic-bezier(.2,.9,.2,1), opacity .6s ease;
  transition-delay: calc(var(--i, 0) * var(--split-stagger, 38ms)); }
.split-words.split-in .word{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  .mod-card, .mod-card.will-reveal, .mod-card.is-in, .reveal, .split-chars .char, .split-words .word{
    opacity: 1 !important; transform: none !important; filter: none !important; transition: none !important;
  }
  .mod-card::before, .mod-card::after, .mod-arrow, .mod-info{ animation: none !important; transition: none !important; }
  .mod-info{ clip-path: none; opacity: 1; background: linear-gradient(180deg, rgba(0,0,0,.0) 0%, rgba(9,25,20,.85) 100%); }
  .mod-arrow{ display:none; }
}

/* (Antigos) Cards bootstrap genéricos */
.card { border: 1px solid #EDEDED; transition: transform .2s, box-shadow .2s; }
.card:hover { transform: translateY(-4px); box-shadow: 0 8px 20px rgba(0,0,0,0.05); }

/* Secções alternadas */
.bg-light { background-color: #F6F7F9 !important; }

/* Footer (mantém contraste) */
footer { background-color: #1f2937; color: #ffffff; }
footer a { color: #ffffff; text-decoration: none; }
footer a:hover { text-decoration: underline; }

/* H1 do hero responsivo */
.hero .display-5 { font-size: clamp(2.2rem, 3.2vw + 1rem, 3.8rem); line-height: 1.1; text-wrap: balance; }

/* Split por PALAVRAS */
.split-words .word { white-space: nowrap; opacity: 0; transform: translateY(.7em);
  transition: transform .6s cubic-bezier(.2,.9,.2,1), opacity .6s ease;
  transition-delay: calc(var(--i, 0) * var(--split-stagger, 38ms)); }
.split-words.split-in .word { opacity: 1; transform: none; }

/* =============== BENEFÍCIOS — fundo pastel mais escuro (apenas o fundo) =============== */
.b-surface{
  position: relative;
  border-radius: 34px;
  padding: clamp(24px, 3vw, 36px);
  background:
    /* mancha verde no topo-esquerda */
    radial-gradient(1200px 900px at 12% -10%,
      rgba(126,200,168,.38) 0%,
      rgba(126,200,168,.16) 40%,
      transparent 70%
    ),
    /* mancha azul-esverdeada em baixo-direita */
    radial-gradient(1100px 900px at 95% 120%,
      rgba(74,101,114,.25) 0%,
      rgba(74,101,114,.12) 45%,
      transparent 72%
    ),
    /* lâmina base (um tom acima do branco) */
    linear-gradient(180deg, #E6F2ED 0%, #D9ECE3 100%);
  box-shadow: 0 24px 70px rgba(21,45,53,.12), inset 0 0 0 1px rgba(20,40,48,.08);
}


/* título e kicker ajustados para o novo fundo */
.b-kicker{ color:#5e6f76; }
.b-title{ color:#243a31; }

/* (resto mantém) */
.b-header{ margin-bottom: clamp(8px, 2vw, 16px); }
.b-grid{ margin-top: clamp(12px, 2vw, 22px); }
.b-row-gap{ margin-top: clamp(16px, 3.2vw, 36px); padding-top: clamp(4px, 1vw, 10px); }

/* cartões continuam brancos — bom contraste no fundo mais escuro */
.b-card{
  --mx: 50%; --my: 50%; --bg:#fff; --ink:#eaf6f0; --bd:#e1e8ec;
  position: relative; isolation: isolate; height: 100%;
  border-radius: 22px; background: var(--bg);
  border: 1px solid var(--bd);
  box-shadow: 0 10px 35px rgba(24,38,46,.07);
  padding: 22px; overflow: clip;
  transition: transform .35s cubic-bezier(.2,.9,.2,1), border-color .35s ease, box-shadow .35s ease;
}
.b-card:hover{
  transform: translateY(-6px);
  border-color: rgba(126,200,168,.6);
  box-shadow: 0 18px 48px rgba(24,38,46,.12);
}

/* ícone mantém o pastel */
.b-ico{ background:#E8F3EE; }
.b-ico svg{ stroke:#6BB79D; }

/* ---- FIX dos ícones dos benefícios ---- */
#beneficios .b-ico{
  width:48px; height:48px;
  display:grid; place-items:center;
  background:#EEF7F3; border-radius:12px; margin-bottom:14px;
  flex:0 0 48px;          /* impede esticar */
}

#beneficios .b-ico svg{
  display:block;
  width:26px !important;
  height:26px !important;
}

/* garante contorno verde e sem preenchimento preto */
#beneficios .b-ico svg,
#beneficios .b-ico svg *{
  fill:none !important;
  stroke:#6BB79D !important;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect: non-scaling-stroke;
}


/* ==================== ABOUT — NOVO VISUAL ==================== */
.about-surface{
  position: relative;
  border-radius: 28px;
  padding: clamp(24px, 3vw, 36px);
  background:
    radial-gradient(900px 600px at 85% -10%, rgba(126,200,168,.22), transparent 60%),
    radial-gradient(800px 500px at -10% 110%, rgba(74,101,114,.20), transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #F8FBFA 100%);
  box-shadow: 0 20px 60px rgba(21,45,53,.08), inset 0 0 0 1px rgba(20,40,48,.06);
}

.about-title{
  position:relative;
  font-weight: 900;
  color:#2c3f46;
  line-height:1.15;
}
.about-title::after{
  content:"";
  position:absolute; left:0; bottom:-6px;
  width: clamp(120px, 35%, 220px); height: 8px;
  background: linear-gradient(90deg, #BEE7D4 0%, #7EC8A8 60%, rgba(126,200,168,0) 100%);
  border-radius: 8px;
  opacity:.9;
}

.about-list li{
  display:flex; align-items:flex-start; gap:.6rem;
  padding:.45rem 0;
  color:#4a5a61;
  font-weight:600;
}
.chk{
  width:22px; height:22px; flex:0 0 22px; border-radius:999px;
  background: linear-gradient(180deg, #7EC8A8, #9ED9C1);
  box-shadow: 0 4px 10px rgba(0,0,0,.08), inset 0 0 0 1px rgba(255,255,255,.45);
  position:relative; margin-top:2px;
}
.chk::after{
  content:""; position:absolute;
  left:6px; top:9px; width:7px; height:4px;
  border-left:2px solid #fff; border-bottom:2px solid #fff;
  transform: rotate(-45deg);
}

/* Visual do about (cartão com moldura e chips) */
.about-visual{ position:relative; min-height: 360px; }
.about-card{
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  aspect-ratio: 4 / 3;
  background:#f3f7f6;
  box-shadow: 0 20px 50px rgba(22,35,42,.12);
  transform: perspective(900px) rotateX(3deg) rotateY(-6deg);
  animation: aboutFloat 7s ease-in-out infinite;
}
.about-card::before{
  content:"";
  position:absolute; inset:0;
  padding:1px; border-radius:inherit;
  background: linear-gradient(135deg, rgba(126,200,168,.6), rgba(74,101,114,.35));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  pointer-events:none; opacity:.7;
}
.about-card img{ width:100%; height:100%; object-fit:cover; }

@keyframes aboutFloat{
  0%,100%{ transform: perspective(900px) rotateX(3deg) rotateY(-6deg) translateY(0); }
  50%{    transform: perspective(900px) rotateX(2deg) rotateY(-4deg) translateY(-8px); }
}
/* cartão do visual */
.about-card{
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  aspect-ratio: 16 / 9;      /* mantém proporção bonita */
  background:#fff;           /* para as “barras” quando a imagem não preencher */
  box-shadow: 0 20px 50px rgba(22,35,42,.12);
  transform: perspective(900px) rotateX(3deg) rotateY(-6deg);
  animation: aboutFloat 7s ease-in-out infinite;
}
.about-card img{
  width:100%;
  height:100%;
  object-fit: contain;       /* <-- deixa de cortar a imagem */
  object-position: center;   /* centra */
  display:block;
  background:#fff;
}

/* Chips */
.about-chip{
  position:absolute; display:inline-flex; align-items:center; gap:.45rem;
  padding:.4rem .6rem; border-radius:12px;
  background:#ffffff; border:1px solid #E6F0EB;
  box-shadow: 0 10px 24px rgba(20,40,48,.10);
  font-weight:800; color:#2b3f46;
}
.about-chip svg{ width:16px; height:16px; stroke:#6BB79D; stroke-width:1.8; fill:none; }
.about-chip.c1{ left: -8px; top: 14px; }
.about-chip.c2{ right: -8px; bottom: 18px; }

/* Blobs/waves atrás do visual */
.about-wave{
  position:absolute; filter: blur(16px); z-index:-1; border-radius:50%;
}
.about-wave.w1{ width:240px; height:240px; right:-40px; top:-30px; background: rgba(126,200,168,.22); }
.about-wave.w2{ width:280px; height:200px; left:-30px; bottom:-20px; background: rgba(74,101,114,.18); }

/* Responsivo do about */
@media (max-width: 992px){
  .about-card{ aspect-ratio: 16/10; }
  .about-chip.c1{ left: 0; top: -8px; }
  .about-chip.c2{ right: 0; bottom: -8px; }
}

/* Remove as sombras/blobs atrás da imagem apenas no mobile */
@media (max-width: 767.98px){
  .about-wave{ display:none; }
}

/* ==================== VANTAGENS — “PILLS ORGÂNICAS” ==================== */
.v-section{ position:relative; }
.v-surface{
  position:relative; border-radius:34px; padding:clamp(26px,3.2vw,38px);
  background:
    radial-gradient(1200px 700px at 10% -10%, rgba(126,200,168,.18), transparent 60%),
    radial-gradient(1100px 700px at 95% 120%, rgba(74,101,114,.18), transparent 65%),
    linear-gradient(180deg,#ffffff 0%,#F7FAF8 100%);
  box-shadow:0 20px 60px rgba(21,45,53,.08), inset 0 0 0 1px rgba(20,40,48,.06);
}

/* —— header: força o kicker ACIMA do título —— */
.v-head{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.35rem;           /* espaço entre kicker e h2 */
  margin:0 0 .5rem 0;
}
.v-head .v-kicker{
  order:0;              /* vem primeiro */
  display:inline-block;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#6b7b83;
  font-size:.8rem;
}
.v-head h2{
  order:1;              /* vem depois */
  margin:0;
}

/* grid + itens */
.v-grid{
  margin-top:clamp(16px,2.4vw,28px);
  display:flex; flex-wrap:wrap; gap:18px 22px; justify-content:center;
}
.v-item{
  --ink:#EAF6F0;
  position:relative; display:flex; align-items:center; gap:14px;
  padding:14px 18px 14px 14px;
  background:#fff; border:1px solid #E6EEF1; border-radius:999px;
  box-shadow:0 10px 28px rgba(20,40,48,.06);
  min-width:300px; max-width:520px; flex:1 1 30%;
  transition:transform .35s cubic-bezier(.2,.9,.2,1), box-shadow .35s ease, border-color .35s ease;
  isolation:isolate; overflow:hidden;
}
.v-item::before{
  content:""; position:absolute; inset:-1px; z-index:0;
  background:radial-gradient(180px 180px at 64px 50%, var(--ink), transparent 62%);
  clip-path:circle(0 at 64px 50%); transition:clip-path .6s cubic-bezier(.2,.9,.2,1);
}
.v-item > *{ position:relative; z-index:1; }
.v-item:hover{ transform:translateY(-5px); border-color:rgba(126,200,168,.55); box-shadow:0 16px 44px rgba(24,38,46,.10); }
.v-item:hover::before{ clip-path:circle(160% at 64px 50%); }

.v-ico{
  width:54px; height:54px; border-radius:999px; display:grid; place-items:center;
  background:#EEF7F3; flex:0 0 54px;
  box-shadow: inset 0 0 0 1px rgba(109,183,157,.25);
}
.v-ico svg{ width:28px; height:28px; stroke:#6BB79D; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; fill:none; }
.v-ico svg path, .v-ico svg circle{ vector-effect: non-scaling-stroke; }

.v-title{
  margin:0; font-size:1.05rem; line-height:1.35; font-weight:800; color:#2b3f46;
}

/* 3 em cima + 2 centrados em baixo */
@media (min-width: 992px){
  .v-item{ flex-basis: 31%; }
  .v-grid > .v-item:nth-child(n+4){ flex-basis: 38%; }
}

/* acessibilidade */
@media (prefers-reduced-motion:reduce){
  .v-item, .v-item::before{ transition:none!important; }
}

/* ===== CREDIBILIDADE — SURFACE ===== */
.cred-section{ position:relative; }
.cred-surface{
  position:relative; border-radius:34px; padding:clamp(24px,3vw,38px);
  background:
    radial-gradient(1100px 700px at 15% -10%, rgba(126,200,168,.22), transparent 60%),
    radial-gradient(1000px 650px at 95% 120%, rgba(74,101,114,.18), transparent 62%),
    linear-gradient(180deg, #ffffff 0%, #F7FBF9 100%);
  box-shadow:0 20px 60px rgba(21,45,53,.08), inset 0 0 0 1px rgba(20,40,48,.06);
}
.cred-kicker{
  display:inline-block; margin-bottom:.5rem; padding:.35rem .7rem;
  font-size:.8rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  color:#3a5b50; background:#E9F6F0; border:1px solid #D5EBE2; border-radius:999px;
}
.cred-title{ margin:0 0 .75rem 0; }

/* ===== CREDIBILIDADE — FIGURA + CURTAIN ===== */
/* Hover especial da imagem de Credibilidade */
.cred-figure {
  position: relative;
  overflow: hidden;
  border-radius: 22px;
  aspect-ratio: 16 / 10;
  box-shadow: 0 22px 60px rgba(21,45,53,.12), inset 0 0 0 1px rgba(20,40,48,.06);
}

.cred-figure .cred-photo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .9s cubic-bezier(.2,.9,.2,1), 
              filter .9s ease;
}

/* O “thcaran” */
.cred-figure:hover .cred-photo {
  transform: scale(1.06);                  /* zoom suave */
  filter: brightness(1.08) contrast(1.03); /* leve brilho */
}

/* Sheen diagonal (reflexo rápido no hover) */
.cred-figure::after {
  content: "";
  position: absolute; inset: -40%;
  background: linear-gradient(75deg, rgba(255,255,255,.0) 45%, rgba(255,255,255,.25) 50%, rgba(255,255,255,.0) 55%);
  transform: translateX(-120%) rotate(20deg);
  transition: transform .8s ease;
  pointer-events: none;
}

.cred-figure:hover::after {
  transform: translateX(120%) rotate(20deg); /* passa de um lado ao outro */
}

/* ===== CREDIBILIDADE — LISTA À DIREITA (linhas entre itens) ===== */
.cred-col-right{ display:flex; align-items:center; margin-top: 100px;}
.cred-content{ width:100%; max-width:720px; margin-inline:auto; }

.cred-list{ list-style:none; padding:0; margin:.25rem 0 0; }
.cred-item{
  display:grid; grid-template-columns:64px 1fr; gap:16px;
  align-items:center; padding:18px 0;
}
/* só entre itens */
.cred-item + .cred-item{ border-top:1px solid rgba(20,40,48,.10); }

.cred-ico{
  width:64px; height:64px; border-radius:14px; display:grid; place-items:center;
  background:#EEF7F3; box-shadow: inset 0 0 0 1px rgba(109,183,157,.25);
}
.cred-ico svg{
  width:30px; height:30px; stroke:#6BB79D; stroke-width:1.8; fill:none;
  stroke-linecap:round; stroke-linejoin:round;
}
.cred-item p{ margin:0; color:#2e3f45; }
/* ===== TESTEMUNHOS — grid com bottom fixo ===== */
.hb-testimonials{
  margin: 24px;
  padding: 96px 104px;
background:
    radial-gradient(1200px 700px at 10% -10%, rgba(126,200,168,.18), transparent 60%),
    radial-gradient(1100px 700px at 95% 120%, rgba(74,101,114,.18), transparent 65%),
    linear-gradient(180deg,#ffffff 0%,#F7FAF8 100%);  border-radius: 36px;
  overflow: hidden;
  color: var(--ink, #1E2A32);
}

/* 12 colunas */
.hb-testimonials .hb-wrap{
  max-width: 1280px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 72px;
}

/* ===== Coluna Esquerda ===== */
.hb-testimonials .hb-col-left{
  grid-column: 1 / span 7;  /* 7/5 */
  min-width: 0;
}

.hb-testimonials .hb-kicker{
  text-transform: uppercase;
  letter-spacing: .2em;
  font-weight: 700;
  font-size: 12px;
  color: var(--muted, #5E6B75);
  margin: 0 0 12px;
}
.hb-testimonials .hb-title{
  font-family: "Marcellus", serif;
  font-size: 42px;
  line-height: 1.14;
  max-width: 18ch;
  margin: 0 0 18px;
}

/* lista + imagem lado a lado (50/50) */
.hb-testimonials .hb-features-wrap{
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 28px;
}

.hb-testimonials .hb-features{
  list-style: none; margin: 0; padding: 0;
  max-width: 520px;
}
.hb-testimonials .hb-feature{
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 12px;
  margin-bottom: 22px;
}
.hb-testimonials .hb-ftext h3{
  margin: 0 0 6px; font-size: 18px; font-weight: 700;
}
.hb-testimonials .hb-ftext p{
  margin: 0; font-size: 15.5px; line-height: 1.7; color: var(--muted, #5E6B75);
}
.hb-testimonials .hb-div{ height:1px; background: var(--border, rgba(0,0,0,.08)); margin: 16px 0 20px; }

.hb-testimonials .hb-ico{
  width: 24px; height: 24px; border-radius: 999px;
  border: 1.5px solid var(--accent, #7EC8A8);
  display:grid; place-items:center;
}
.hb-testimonials .hb-ico svg{
  width: 18px; height: 18px; stroke: var(--accent, #7EC8A8); stroke-width:2; fill:none;
}

/* imagem quadrada, perto do texto */
.hb-testimonials .hb-doctor{
  max-width: 220px;
  aspect-ratio: 1 / 1;
  border-radius: 18px;
  overflow: hidden;
  background:#fff;
  box-shadow: inset 0 0 0 1px rgba(20,40,48,.06), 0 8px 20px rgba(0,0,0,.08);
  justify-self: start;
  margin-left: 8px;
}
.hb-testimonials .hb-doctor img{ width:100%; height:100%; object-fit: cover; display:block; }

/* ===== Coluna Direita: 3 linhas (auto 1fr auto) ===== */
.hb-testimonials .hb-col-right {
  grid-column: 8 / -1;
  min-width: 0;
  display: grid;
  grid-template-rows: auto 1fr;   /* topo (auto) + resto (1fr) */
  min-height: 360px;
  position: relative;             /* <<< IMPORTANTE! referência para .hb-bottom */
}

/* topo ocupa as 2 primeiras linhas (auto + 1fr) */
.hb-testimonials .hb-top{
  grid-row: 1 / 3;
}

.hb-testimonials .hb-stars{ display:flex; gap:6px; color: var(--accent, #7EC8A8); margin: 4px 0 12px; }
.hb-testimonials .hb-stars svg{ width:20px; height:20px; fill:currentColor; }
.hb-testimonials .hb-quote{
  font-family: "Marcellus", serif;
  font-size: 28px; line-height: 1.3; margin: 0 0 14px;
}
.hb-testimonials .hb-body{
  color: var(--muted, #5E6B75); font-size: 16.5px; line-height: 1.75; margin: 0;
}

.hb-testimonials .hb-bottom {
  position: absolute;
  left: 0; 
  right: 0; 
  bottom: 15px;   /* <<< controla o quanto sobes */
  display: flex;
  flex-direction: column;
  gap: 14px;
}


.hb-testimonials .hb-author{
  display:flex; align-items:center; gap:16px;
}
.hb-testimonials .hb-avatar{
  width:56px; height:56px; border-radius:999px; object-fit:cover;
  transition: filter .3s ease;
}
/* Tons por testemunho — mesma foto (pfp.png), cor diferente por pessoa */
.hb-testimonials .hb-avatar.tone-black{  filter: grayscale(1) contrast(1.1); }
.hb-testimonials .hb-avatar.tone-blue{   filter: brightness(0) invert(1) sepia(1) saturate(9) hue-rotate(155deg) brightness(0.4); }
.hb-testimonials .hb-avatar.tone-green{  filter: brightness(0) invert(1) sepia(1) saturate(2) hue-rotate(70deg) brightness(0.95); }
.hb-testimonials .hb-avatar.tone-yellow{ filter: brightness(0) invert(1) sepia(1) saturate(10) hue-rotate(-15deg) brightness(0.82); }
.hb-testimonials .hb-name{ font-weight:700; font-size:18px; }
.hb-testimonials .hb-role{ color: var(--muted, #5E6B75); font-size:14px; }

.hb-testimonials .hb-nav{ display:flex; gap:12px; }
.hb-testimonials .hb-btn{
  width:46px; height:46px; border-radius:999px;
  border:1.5px solid color-mix(in srgb, var(--accent, #7EC8A8) 70%, white);
  background:transparent; color: var(--accent, #7EC8A8);
  display:grid; place-items:center; cursor:pointer;
  transition: background .25s ease, transform .06s ease;
}
.hb-testimonials .hb-btn:hover{ background: color-mix(in srgb, var(--accent, #7EC8A8) 10%, transparent); }
.hb-testimonials .hb-btn:active{ transform: translateY(1px); }
.hb-testimonials .hb-btn svg{ width:18px; height:18px; stroke:currentColor; stroke-width:2; fill:none; }

/* ===== Responsivo ===== */
@media (max-width: 1199px){
  .hb-testimonials .hb-wrap{ gap:56px; }
  .hb-testimonials .hb-title{ font-size: 38px; }
}
@media (max-width: 991px){
  .hb-testimonials{ padding: 72px 32px 80px; }
  .hb-testimonials .hb-wrap{
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .hb-testimonials .hb-col-left{ grid-column: 1; }
  .hb-testimonials .hb-col-right{
    grid-column: 1;
    min-height: 520px;
  }
  .hb-testimonials .hb-features-wrap{
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .hb-testimonials .hb-doctor{ max-width: 320px; margin-left: 0; }
}
@media (max-width: 480px){
  .hb-testimonials{ padding: 56px 20px 64px; margin: 16px; }
  .hb-testimonials .hb-title{ font-size: 32px; }
  .hb-testimonials .hb-btn{ width: 40px; height: 40px; }
}


/* ===== CONTACTO ===== */
.contact-section{
  position: relative;
  padding: 100px 20px;
  background: transparent; /* usa o fundo global do body */
}

.contact-wrap{
  display: grid;
  grid-template-columns: 1fr 0.9fr; /* esquerda + direita */
  gap: 60px;
  align-items: center;
  max-width: 1180px;
  margin-inline: auto;
}

/* ESQUERDA */
.contact-left{
  max-width: 520px;
}
.contact-title{
  font-family: "Marcellus", serif;
  font-size: 40px;
  color: #2b3f46;
  margin-bottom: 18px;
}
.contact-sub{
  font-size: 1.05rem;
  color: #5E6B75;
  margin-bottom: 22px;
}
.contact-benefits{
  list-style: none;
  padding: 0;
  margin: 0;
  font-weight: 600;
  color: #37474F;
}
.contact-benefits li{ margin-bottom: 10px; }

/* DIREITA */
.contact-right{
  background: #fff;
  border-radius: 24px;
  padding: 36px 32px;
  box-shadow: 0 14px 38px rgba(22,35,42,.08);
}
.contact-form .form-group{
  margin-bottom: 18px;
}
.contact-form .form-control{
  width: 100%;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid #DCE6ED;
  font-size: .95rem;
  color: #2b3f46;
  transition: border-color .25s ease, box-shadow .25s ease;
}
.contact-form .form-control:focus{
  border-color: #7EC8A8;
  box-shadow: 0 0 0 4px rgba(126,200,168,.15);
  outline: none;
}
.contact-form textarea.form-control{ resize: vertical; }

.form-actions{
  text-align: right;
}
.contact-form .btn{
  padding: 12px 28px;
  border-radius: 14px;
  font-weight: 700;
  font-size: 1rem;
}
.form-feedback{
  margin: 10px 0 0;
  font-size: .9rem;
  text-align: right;
  min-height: 1.2em;
}
.form-feedback.is-ok{ color: #2f7a4f; }
.form-feedback.is-error{ color: #c0392b; }

/* Responsivo */
@media (max-width: 991px){
  .contact-wrap{
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .contact-right{ max-width: 100%; }
}
/* ===== Footer ===== */
.site-footer{
  position: relative;
  color:#2b3f46;
  margin-top: clamp(56px, 8vw, 96px);
  padding-top: clamp(48px, 6vw, 72px);
  overflow: clip;
  isolation: isolate;
  --accent:#7EC8A8;
  --ink:#2b3f46;
  background:
    radial-gradient(900px 600px at 10% 20%, rgba(126,200,168,.18), transparent 70%),
    radial-gradient(700px 500px at 85% 90%, rgba(74,101,114,.15), transparent 70%),
    linear-gradient(180deg, #ffffff 0%, #F8FBFA 100%);
}

/* brilho/gradiente no topo */
.site-footer .footer-sheen{
  position:absolute; inset:auto 0 100% 0; height:12px;
  background: linear-gradient(90deg, #BEE7D4, #7EC8A8 35%, #4A6572 65%, #BEE7D4);
  opacity:.5; filter: blur(1px);
}

/* grid das colunas */
.footer-grid{
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr 1.2fr;
  gap: clamp(18px, 3vw, 40px);
  align-items: start;
}

.f-col .f-head{
  margin: .25rem 0 .75rem; 
  font-family: var(--heading-font, "Marcellus", serif);
  font-size: clamp(1.05rem, .9rem + .4vw, 1.2rem);
  color:#243a31;
}

.f-brand{ display:inline-flex; align-items:center; gap:.6rem; margin-bottom:.35rem; }
.f-logo{ height: 44px; filter: drop-shadow(0 3px 8px rgba(0,0,0,.1)); }
.f-tagline{ margin:.4rem 0 1rem; color:#4d5b61; max-width: 36ch; }

/* links */
.f-links{ list-style:none; margin:0; padding:0; display:grid; gap:.5rem; }
.f-links a{
  color:#41545c; text-decoration:none; position:relative; display:inline-block;
  transition:color .25s ease;
}
.f-links a::after{
  content:""; position:absolute; left:0; bottom:-2px; width:0; height:2px;
  background: linear-gradient(90deg, var(--accent), #bfe8d5);
  transition: width .28s cubic-bezier(.2,.9,.2,1);
}
.f-links a:hover{ color:#215642; }
.f-links a:hover::after{ width:100%; }

/* social */
.f-social{ display:flex; gap:.6rem; margin-top:.5rem; }
.f-social-link{
  width:40px; height:40px; border-radius:999px; display:grid; place-items:center;
  color:#41545c; background: rgba(255,255,255,.6);
  border:1px solid rgba(20,40,48,.1);
  transition: transform .2s, background .25s, border-color .25s, color .25s;
}
.f-social-link:hover{
  transform: translateY(-2px);
  color:#215642; background: rgba(126,200,168,.18); border-color: rgba(126,200,168,.45);
}
.f-social-link svg{ width:18px; height:18px; fill: currentColor; }

/* formulário newsletter */
.f-note{ color:#5a6a72; margin:0 0 .6rem; }
.f-form{
  position: relative; display:flex; gap:.5rem; align-items:center; flex-wrap:wrap;
}
.f-input{
  flex: 1 1 240px; min-width: 0;
  background: #fff;
  border: 1px solid rgba(20,40,48,.15);
  color:#2b3f46; border-radius: 12px; padding:.6rem .8rem;
  outline: none;
}
.f-input::placeholder{ color:#7c8b92; }
.f-btn{ border-radius: 12px; padding:.6rem 1rem; font-weight:600; }
.f-ok{
  position:absolute; right:0; top:100%; transform: translateY(8px);
  font-weight:700; color: var(--accent); opacity:0; pointer-events:none;
  transition: opacity .25s;
}
.f-form.sent .f-ok{ opacity:1; }

/* legal bar */
.footer-legal{
  margin-top: clamp(20px, 4vw, 32px);
  border-top: 1px solid rgba(20,40,48,.08);
  background: linear-gradient(180deg, rgba(255,255,255,.8), rgba(255,255,255,.6));
}
.legal-inner{
  display:flex; align-items:center; justify-content:space-between;
  gap: 16px; padding: 14px 0;
}
.legal-copy{ margin:0; color:#5a6a72; }
.legal-links{ margin:0; display:flex; gap:.6rem; align-items:center; }
.legal-links a{ color:#41545c; text-decoration:none; }
.legal-links a:hover{ color:#215642; text-decoration:underline; }

/* helpers */
.visually-hidden{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }

/* ===== Responsivo do footer ===== */
@media (max-width: 992px){
  .footer-grid{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 576px){
  .footer-grid{ grid-template-columns: 1fr; }
  .f-col:not(:first-child){ border-top:1px dashed rgba(20,40,48,.12); padding-top:16px; }
  .legal-inner{ flex-direction:column; text-align:center; }
}