/* Poppins 100 */
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/poppins@5.0.8/files/poppins-latin-100-normal.woff2") format("woff2");
}

/* Poppins 200 */
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/poppins@5.0.8/files/poppins-latin-200-normal.woff2") format("woff2");
}

/* Poppins 300 */
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/poppins@5.0.8/files/poppins-latin-300-normal.woff2") format("woff2");
}

/* 400 (regular) */
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/poppins@5.0.8/files/poppins-latin-400-normal.woff2") format("woff2");
}

/* 500 */
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/poppins@5.0.8/files/poppins-latin-500-normal.woff2") format("woff2");
}

/* 600 */
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/poppins@5.0.8/files/poppins-latin-600-normal.woff2") format("woff2");
}

/* 700 */
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/poppins@5.0.8/files/poppins-latin-700-normal.woff2") format("woff2");
}

/* 800 */
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/poppins@5.0.8/files/poppins-latin-800-normal.woff2") format("woff2");
}

/* 900 */
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/poppins@5.0.8/files/poppins-latin-900-normal.woff2") format("woff2");
}



/* Variáveis e base */
:root{
  --font-primary: "Poppins", sans-serif;
  --fw-thin: 100;
}
html, body{
  font-family: var(--font-primary);
   color: var(--gray-500);
   margin: 0!important;
   padding:0 !important;
}


/* =================================================================
   TOKENS / FOUNDATIONS
   ================================================================= */
:root{
  /* Fonts */ 
  --heading-weight: 100;
  --display-weight: 100;
  --menu-weight:    100;
  --body-weight:    100;

  --thin :100;
  --light : 300; 
  --reg    : 400; 
  --med    : 500; 
  --semib  : 600; 
  --bold   : 700; 
  --black  : 900; 

  /* Bootstrap vars */
  --bs-font-sans-serif:  var(--font-secondary);
  --bs-body-font-family: var(--font-secondary);
  --bs-body-font-weight: var(--body-weight);


/* Icons */

  --icon-arrow: url("../img/icons/arrow-right.svg");
  --icon-star:  url("../img/icons/star.svg");

/* Colors */
  
  --light:#fff;
  --dark:#000;

  --gray-500: #58595C;
  
  --green-50: #F2FAF4;
  --green-100: #DFE9E4;
  --green-300: #4B936F;
  --green-600: #246946;
  --green-900: #0B3E24;

 
  --yellow-400: #FFCF6C;


  /*Tokens Colors*/

	  /* Brand */
	  --brand-primary: var(--yellow-400);
    --brand-secondary: var(--green-900); 


	  /* Surfaces */
	  --surface-primary:var(--light);
	  --surface-footer:var(--green-50);
	  --surface-box-primary:var(--green-100);
    --surface-box-secondary:var(--blue-50);

	  /* Border */
	  --border-primary:var(--blue-50);
	  --border-secondary: var(--gray-300);

	  /* Font */
	  --font-size-sm:1rem; /*16px*/
	  --font-size-m:1.2rem; 
	  --font-size-l:1.4rem;
	  --font-size-xl:2rem;
	  --font-size-xxl:3rem;
    --font-size-xxxl:4rem;

	  /* Padding */
  	--p-s:30px;
  	--p-m:60px;


/* Borders / Radius */

	--bd: 2px;
	--radius-md:10px;
  --radius-s: 10px;
	--pill:999px;

/* btn */
  --btn-bg: transparent;
  --btn-icon: var(--icon-arrow);
  --btn-icon-size: 1rem;
}
/* =================================================================
   GLOBAL TYPE & BODY
   ================================================================= */
body{
  font-family: var(--font-primary);
  font-weight: var(--body-weight)!important;
  color: var(--gray-50);
  font-size: var(--font-size-sm);
}
.entry-content { 
  line-height:30px;
}

.single .entry-content { 
  line-height:46px;
  font-size:1.4em;
  letter-spacing: -2%;
}

h1,h2,h3,h4,h5,h6{
  font-family: var(--font-primary);
  font-weight:100!important ;
  color: var(--brand-secondary);
  
}

h2{
  font-size: var(--font-size-xxl)!important;
}

.black {
  font-weight:600 !important;
}
.green {
  color: var(--green-300);
}

h4{
  font-size: var(--font-size-l);
}

/* variantes claras */
h1.txt-light, h2.txt-light, h3.txt-light, h4.txt-light , p.txt-light{ color: var(--light) !important; }
/* =================================================================
   BUTTONS
   ================================================================= */
.btn-theme{
  display:inline-flex;
  gap:var(--btn-gap);
  border-radius:var(--pill);
  background:var(--brand-primary);
  color:var(--brand-secondary); 
  text-decoration:none;
  align-items:center;
  padding:var(--btn-py) var(--btn-px);
  font-weight: 200;
  justify-content: space-between;
  font-family: var(--font-primary)!important;
}

.btn-theme--100{ 

	min-width:100%!important;
 
}

.btn-theme--lg{ 
  --btn-py:0.6rem;
  --btn-px:1.75rem;
  --btn-icon-size:1.125rem;
  font-size:var(--font-size-sm); 
  min-width:250px;
    justify-content: space-between;
}

.btn-theme--icon::after{
  content:""; inline-size:var(--btn-icon-size); block-size:var(--btn-icon-size);
  background: var(--btn-icon) center/contain no-repeat;
}

.read-more-link{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  font-family: var(--font-primary);
  color: var(--green-300);
  text-decoration: none;
  font-weight: 300;
  font-size:0.8rem;
  text-transform: uppercase; 
  width: 100%!important;
  justify-content: space-between;         
}

.read-more-link::after{
  content:"";
  inline-size: var(--btn-icon-size);
  block-size: var(--btn-icon-size);
  background: var(--btn-icon) center/contain no-repeat;
  transition: transform .2s ease;
  margin: 4px 0 0 12px;
}

a {
  color: var(--green-900)!important;
  text-decoration: none!important;
}

.pb-8 {padding-bottom: 80px}

/* =================================================================
   HERO
   ================================================================= */
.hero--bg{
  position: relative;
  min-height: 100vh;          /* ocupa a tela toda */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

}

.hero__overlay{
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.3);
  z-index: 1;
  backdrop-filter: blur(0.4px);
  filter: blur(0.2rem);
}
.hero-title{ font-size:4.6rem!important;  margin-top:40px; line-height: 3.6rem!important}
.hero-sub{ font-size: 4.6rem!important; font-weight: 300; }

/* Mobile: até 767px (Bootstrap md breakpoint) */
@media (max-width: 767.98px) {
  .hero-title{
    font-size: 3.2rem!important;
    line-height: 3rem!important; /* ajusta se precisar */
  }

  .hero-sub{
    font-size: 3.2rem!important;
    line-height: 3rem!important; /* ajusta se precisar */
  }
}

.hero-rotator{
  display:inline-block;
  min-width: 8ch;                /* evita “pulo” enquanto troca */
  bor
  padding-right: .2ch;
  white-space: nowrap;
  transition: opacity .25s ease;
}

.parallax-fixed{
  background-image: var(--hero-bg);   /* veremos isso abaixo */
  background-size: cover;
  background-position: center;
  background-attachment: fixed;       /* parallax puramente CSS */
  position: relative;
  overflow: hidden;
}

/* iOS costuma ignorar 'fixed'; então usa fallback “normal” no mobile */
@supports (-webkit-touch-callout: none) {
  .parallax-fixed{
    background-attachment: scroll;
  }
}


/* =================================================================
   Box
   ================================================================= */

.box-primary{
	border: var(--bd) solid var(--border-primary);
	background: var(--surface-box-primary);
	border-radius: var(--radius-md);
	padding: var(--p-m) var(--p-m);
}

.box-secondary{
   background: rgba(139,189,180,.1);
  backdrop-filter: blur(40px);
  border-color: rgba(255,255,255,.02);
  border-radius: var(--radius-md);
  overflow: auto;
}


.box-tertiary{
  border: 1px solid var(--green-100);
  background:;
  border-radius: var(--radius-md);
  padding: var(--p-m) var(--p-m);
}


/* =================================================================
   Sections
   ================================================================= */

   .section-bg-cover {
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: #fff;

}

.section-bg-cover .section-overlay {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.2); /* ajuste conforme o design */
  z-index: 1;
  backdrop-filter: blur(0.5px);
  filter: blur(0.2rem);
}

.section-bg-cover .container,
.section-bg-cover > * {
  position: relative;
  z-index: 2;
}

/* =================================================================
   Who we are
   ================================================================= */
/* =========================================================
   WHO WE ARE  (layout 2 | 1+foto+1 | 2)
   ========================================================= */

/* Palco geral: mantém espaço vertical para a foto absoluta */
.who-rows .who-stage{
  position: relative;
  padding-block: 96px;                 /* evita corte da foto no desktop */
}

/* espaçamento entre as linhas */
.who-rows .who-row{
  margin-bottom: 36px;
}

/* ------------------ FOTO CENTRAL ------------------ */
/* menor, sem sombra/background/aro; absoluta no desktop */
.who-rows .who-photo-wrap{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  z-index: 0;                          /* fica atrás do conteúdo */
  inline-size: min(28vw, 420px);       /* ajuste fino do tamanho da "bolha" */
  aspect-ratio: 1 / 1;
  background: none !important;
  box-shadow: none !important;
}
.who-rows .who-photo{
  width: 100%;
  height:auto;
  display: block;
}

/* ------------------ ITENS (ÍCONE + TÍTULO + TEXTO) ------------------ */

/* Ícones limpos: sem bg/borda/sombra, só a imagem */
.who-rows .icon-badge{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;

  display: inline-block;
  inline-size: auto;
  block-size: auto;
  padding: 0;
  margin-bottom: 10px;                 /* respiro antes do título */
}
.who-rows .icon-badge__icon{
  width: 56px;                         /* ajuste 48–64px conforme preferir */
  height: 56px;
  object-fit: contain;
  display: block;
}



/* leve curva das linhas 1 e 3 para “abraçar” a foto */
@media (min-width: 992px){
  .who-rows .who-row-1 .who-feature{ transform: translateY(14px); }
  .who-rows .who-row-3 .who-feature{ transform: translateY(-10px); }
}

/* ------------------ RESPONSIVO ------------------ */
/* No mobile a foto entra no fluxo e reduz; respiros menores */
@media (max-width: 991.98px){
  .who-rows .who-stage{ padding-block: 0; }

  .who-rows .who-photo-wrap{
    position: static;
    transform: none;
    inline-size: min(60vw, 360px);
    margin: 8px auto 24px;
  }

  .who-rows .who-row{ margin-bottom: 28px; }
  .who-rows .icon-badge__icon{ width: 48px; height: 48px; }
}


/* =================================================================
   Blog
   ================================================================= */


.img-blog{
  border-radius: var(--radius-s)  var(--radius-s) 0 0;
}

.date-badge {
  left: 20px; 
  bottom:-50px;
  color: var(--brand-tertiary);
  font-family: var(--font-primary);
  font-weight: 600;
  text-align: center;
  padding: 5px 8px;
}
.date-badge .day {
  font-size: var(--font-size-l);
}

.date-badge .month {
  font-size: var(--font-size-m);
}






/* =================================================================
   Service
   ================================================================= */
/* Cards de serviço */

.service-thumb{ display:block; margin-bottom: 30px; }

.service-mini-ico{ 
    flex: 0 0 auto;
    margin-left: -40px;
    background: #fff;
    padding: 12px;
    margin-top: -65px;
    border-radius: 30px;
  }
.service-mini-ico__img{ width: 38px; height: 38px; object-fit: contain; display:block; }



/* =================================================================
   Advantages
   ================================================================= */

.big-numbers {
  color: var(--hightlight);
  font-size: var(--font-size-xl);
  font-family: var(--font-primary);
  font-weight: 900;
}


/* =================================================================
   Faq
   ================================================================= */


/* ===== FAQ accordion - estilo base ===== */
.faq-pill .accordion-button.faq-btn{
  /* estado fechado (colapsado) */
  background: transparent;
  color: var(--green-900);
  border: var(--bd,1px) solid var(--green-100);
  border-radius: var(--radius-md, 16px);
  padding: var(--p-s, 0.9rem) var(--p-s, 1.1rem);
  box-shadow: none;
  font-weight: 300;
}

/* remove qualquer override anterior que escondia a seta */
.faq-pill .accordion-button.faq-btn::after{
  display: block;           /* volta a seta padrão do Bootstrap */
}

/* não precisamos de um ícone extra; esconda o span auxiliar, se existir */
.faq-pill .faq-toggle-ico{ display:none; }

/* foco/hover - mantém o visual contido */
.faq-pill .accordion-button.faq-btn:focus{
  box-shadow: none;
  border-color: var(--green-100);
}

/* ===== Estado ATIVO (aberto) – aplica o visual .box-primary ===== */
.faq-pill .accordion-button.faq-btn:not(.collapsed),
.faq-pill .accordion-button.faq-btn[aria-expanded="true"]{
  border: var(--bd,1px) solid var(--green-100);
  background: var(--green-50);
  border-radius: var(--radius-md, 16px);
  color: var(--green-900);
  font-weight: 300;
}

/* corpo da resposta combinando com o box, sem cantos pill */
.faq-pill .accordion-body{
  border-radius: var(--radius-md, 16px);
  padding: var(--p-s, 0.9rem) var(--p-s, 1.1rem);
}

/* zera o estilo default azulado do Bootstrap quando fechado/hover */
.faq-pill .accordion-button.faq-btn.collapsed{
  background: transparent;
}

/* (opcional) borda superior do painel aberto, para “fundir” com o cabeçalho */
.faq-pill .accordion-collapse.show .accordion-body{
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}


/* =================================================================
   footer
   ================================================================= */
footer.site-footer{ background: var(--surface-footer); }
footer.site-footer a,
footer.site-footer p,
footer.site-footer li{
  color: var(--gray-500);
  text-decoration: none;
  font-size: 12px;
  margin-bottom:20px;
}
footer.site-footer h6{
  color: var(--gray-300);
  font-size: 14px;
  margin: 0 0 .75rem 0;
  font-weight: var(--reg);
}

/* Menus do footer */
.footer-menu li + li{ margin-top: .35rem; }

/* Area Coverage: duas colunas */
.footer-two-cols{
  column-count: 2;
  column-gap: 2rem;
}
.footer-two-cols > li{
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
}

/* Lista de contato com ícones via mask */
.contact-list{
  list-style:none; margin:0; padding:0; color:#EBEBEB;
}


/* Redes sociais (ícones via mask com URL inline) */
.footer-social .soc{
  inline-size: 28px;
  block-size: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--light);
  opacity: .9;
  transition: opacity .2s ease, transform .2s ease;
}
.footer-social .soc:hover{ opacity: 1; transform: translateY(-1px); }
.footer-social .soc::before{
  content: "";
  inline-size: 100%;
  block-size: 100%;
  background-color: currentColor;
  -webkit-mask-image: var(--icon); mask-image: var(--icon); /* vem inline no HTML */
  -webkit-mask-size: contain;      mask-size: contain;
  -webkit-mask-repeat: no-repeat;  mask-repeat: no-repeat;
  -webkit-mask-position: center;   mask-position: center;
  display: block;
}



/* =================================================================
   Header
   ================================================================= */

/* ===== NAVBAR base + efeito ao rolar ===== */
.nav-theme{
  background: transparent;
  transition: all .3s ease;
  border-bottom: 1px solid rgba(255,255,255,.08);
  backdrop-filter: none;
}
.nav-theme.nav-scrolled{
  background: rgba(139,189,180,.1);
  backdrop-filter: blur(20px);
  border-color: rgba(255,255,255,.02);
}

/* ===== LOGO ===== */
.navbar-logo{ height:54px; width:auto; display:block; margin-top:8px }
@media (max-width: 991.98px){ .navbar-logo{ height:30px; } }

/* ===== HAMBURGER à direita ===== */
.navbar-toggler{
  border:0;
  background:transparent;
  padding:.5rem;
  z-index:1200;
}

/* padrão: fundo escuro/foto → linhas brancas */
.hamburger-line{
  display:block;
  width:26px; height:2px;
  background-color:#fff;          /* branco por padrão */
  margin:5px 0;
  transition: background-color .25s ease, transform .3s ease, opacity .25s ease;
}

/* quando o header detectar fundo CLARO → linhas verdes */
header.light-header .hamburger-line{
  background-color:#4B936F;       /* verde da marca */
}

/* estados de animação já existentes */
.navbar-toggler.active .hamburger-line:nth-child(1){ transform: rotate(45deg) translateY(7px); }
.navbar-toggler.active .hamburger-line:nth-child(2){ opacity:0; }
.navbar-toggler.active .hamburger-line:nth-child(3){ transform: rotate(-45deg) translateY(-7px); }

/* opcional: pequeno feedback ao passar o mouse */
.navbar-toggler:hover .hamburger-line{
  opacity:.9;
}
/* ===== LOGO: crossfade suave entre branco e verde ===== */
.navbar-brand { position: relative; display: inline-block;   height: 54px;           /* mesma altura da logo desktop */
  min-width: 220px;       /* reserva espaço p/ largura da logo */
  line-height: 0;         /* evita espaço extra */
  z-index: 1201;          /* garante clique acima de bg/efeitos */
}
.logo-stack    { position: relative; display: inline-block; }

.navbar-logo {
  position: absolute;
  inset: 0 auto auto 0;   /* cola no canto esquerdo-topo */
  height: 80%;
  width: auto;
  opacity: 0;
  transition: opacity .25s ease; /* fade suave */
  pointer-events: none;   
}

/* estado padrão: fundo escuro/foto → logo branca visível */
.navbar-logo.logo-on-dark { opacity: 1; }

/* quando o header descobrir fundo claro → logo verde visível */
header.light-header .navbar-logo.logo-on-dark  { opacity: 0; }
header.light-header .navbar-logo.logo-on-light { opacity: 1; }

/* garante que o botão fique acima do overlay */
.navbar-toggler { z-index: 1201; }


/* ===== OVERLAY FULLSCREEN ===== */
.menu-overlay{
  position:fixed; inset:0;
  background: rgba(139,189,180,.8);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none;
  transition: opacity .35s ease;
  z-index:1100;
}
.menu-overlay.open{ opacity:1; pointer-events:auto; }

.menu-overlay-inner{ width:100%; max-width:720px; padding:3rem; }
.nav-overlay-list li{ border-bottom:1px solid rgba(255,255,255,.14); }
.nav-overlay-list li:first-child{ border-top:1px solid rgba(255,255,255,.14); }
.nav-overlay-list a{
  display:block; padding:1.4rem 0;
  font-size:1.3rem;
  color:#fff; text-decoration:none;
  transition: color .2s ease;
}
.nav-overlay-list a:hover{ color: var(--brand-primary, #FFCF6C); }

/* trava scroll quando overlay aberto */
body.menu-open{ overflow:hidden; }

.menu-close{
  position: fixed;
  top: 18px; right: 24px;
  width: 42px; height: 42px;
  border: 0; background: transparent;
  color: #fff;
  z-index: 1202;
  cursor: pointer;
}
.menu-close::before,
.menu-close::after{
  content: "";
  position: absolute;
  left: 9px; right: 9px; top: 50%;
  height: 2px;
  background: currentColor;
}
.menu-close::before{ transform: translateY(-50%) rotate(45deg); }
.menu-close::after{  transform: translateY(-50%) rotate(-45deg); }

/* ===== CTA BUTTON (reaproveita esquema do tema) ===== */
.btn-theme{
  display:inline-flex; align-items:center; justify-content:space-between;
  gap:.5rem; border-radius:999px;
  background: var(--brand-primary, #FFCF6C);
  color: var(--brand-secondary, #0B3E24);
  border:none; padding:.6rem 1.2rem; font-weight:300;
  transition: filter .2s ease, transform .06s ease;
}
.btn-theme:hover{ filter:brightness(1.02); }
.btn-theme--sm{ padding:.45rem 1rem; font-size:.95rem; }

/* ============ Team ============ */


/* Team avatars centralizados */
.team-avatar {
    display: block;
    margin-inline: auto;
    width: 220px;
    height: auto;
    object-fit: cover;
    object-position: center;
    border-radius: 0%;
    box-shadow: none;
}


/* ====== CONTACT FORM – BASE ====== */
.contact-form .wpcf7 {
  --gap: var(--p-m, 16px);
}

.contact-form .form-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: var(--gap);
}
@media (min-width: 768px){
  .contact-form .form-grid{
    grid-template-columns: repeat(2, 1fr);
  }
}
.contact-form .span-2{ grid-column: 1 / -1; } /* textarea, botão etc. */

/* Inputs / Select / Textarea (exceto submit) */
.contact-form .wpcf7-form-control:not([type="submit"]){
  display:block;
  width:100%;
  padding:16px;
  border: var(--bd,1px) solid var(--border-primary, rgba(10,16,29,.12));
  border-radius: var(--radius-md, 14px);
  background: var(--surface-field, #fff);
  color: var(--gray-900, #1a2433);
  line-height: 1.35;
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}

.contact-form .wpcf7-form-control::placeholder{
  color: var(--gray-500, #94a3b8);
  opacity: .9;
}

.contact-form .wpcf7-form-control:focus{
  outline: none;
  border-color: var(--blue-300, #66a3d2);
  box-shadow: 0 0 0 3px rgba(30,94,145,.15);
}

/* Textarea */
.contact-form textarea.wpcf7-form-control{
  min-height: 160px;
  resize: vertical;
}

/* Select */
.contact-form select.wpcf7-form-control{
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, #7c8aa5 50%),
                    linear-gradient(135deg, #7c8aa5 50%, transparent 50%),
                    linear-gradient(to right, transparent, transparent);
  background-position: calc(100% - 18px) calc(1em + 2px),
                       calc(100% - 13px) calc(1em + 2px),
                       calc(100% - 2.5rem) 0.5rem;
  background-size: 5px 5px, 5px 5px, 1px 2.2rem;
  background-repeat: no-repeat;
}

/* Checkboxes / Radios (linha simples) */
.contact-form .wpcf7-list-item{
  display:flex; align-items:center; gap:.5rem;
  margin-bottom: 30px;
}
.contact-form .wpcf7-list-item input{
  inline-size:1.1rem; block-size:1.1rem;
}

/* Mensagens de erro do CF7 */
.contact-form .wpcf7-not-valid{
  border-color: var(--danger-400, #f87171) !important;
  background-color: rgba(248,113,113,.04);
}
.contact-form .wpcf7-not-valid-tip{
  color: var(--danger-600, #dc2626);
  font-size: .825rem;
  margin-top: .35rem;
}

/* Mensagens de status */
.contact-form .wpcf7-response-output{
  margin-top: 1rem;
  border-radius: var(--radius-md, 14px);
  padding: .75rem 1rem;
  border: var(--bd,1px) solid var(--border-primary, rgba(10,16,29,.12));
}
.contact-form .form-1 p{
  margin: 20px 0 !impo;
}
.contact-form .wpcf7-mail-sent-ok{
  border-color: #22c55e; color:#14532d; background: #ecfdf5;
}
.contact-form .wpcf7-validation-errors,
.contact-form .wpcf7-acceptance-missing{
  border-color:#f59e0b; color:#7c2d12; background:#fffbeb;
}

/* ====== BOTÃO ENVIAR ======
   Opção A (recomendada): adicione classes do seu botão no shortcode do CF7 (ver abaixo).
   Opção B (fallback): estilizar .wpcf7-submit para parecer com .btn-theme.
*/
.contact-form .wpcf7-submit{
  display:inline-flex;
  min-width: 100%;
  padding: var(--btn-py, .6rem) var(--btn-px, 1.75rem);
  transition: transform .06s ease, box-shadow .2s ease, filter .2s ease;
    display:inline-flex;
  gap:var(--btn-gap);
  border:0;
  border-radius:var(--pill);
  background:var(--brand-primary);
  color:var(--brand-secondary); 
  text-decoration:none;
  align-items:center;
  padding:var(--btn-py) var(--btn-px);
  font-weight: 300;
  justify-content: space-between;
  margin-top: 30px !important ;
  min-height: 40px!important;
}
.contact-form .wpcf7-submit::after{
  content:"";
  inline-size: var(--btn-icon-size, 1.125rem);
  block-size: var(--btn-icon-size, 1.125rem);
  background: var(--btn-icon, url("/_assets/img/icons/arrow-right.svg")) center/contain no-repeat;
}
.contact-form .wpcf7-submit:hover{ filter: brightness(1.02); }
.contact-form .wpcf7-submit:active{ transform: translateY(1px); }


/* === Testimonials === */
.ts-card {
  max-width: 980px;
  margin: 0 auto;
  text-align: center;
}

.ts-avatar-ring {
  display: inline-grid;
  place-items: center;
  width: 160px;
  height: 160px;
  margin-bottom: 1rem;
  border-radius: 50%;
  border: 10px solid var(--green-100);
}

.ts-avatar {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  object-fit: cover;
}

.ts-name {
  font-weight: 400;
  color: var(--green-400);
  margin-top: 0.5rem;
}

.ts-role {
  font-size: 0.95rem;
  font-weight: 300;
  color: var(--gray-400);
  margin-bottom: 1.5rem;
}

.ts-quote {
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  font-weight: 300;
  line-height: 1.4;
  color: var(--gray-500);
  max-width: 900px;
  margin: 0 auto;
}


/* ===== CASES – lista vertical + scroll horizontal no desktop ===== */

/* MOBILE (default) – um embaixo do outro */
.cases-list{
  display: flex;
  flex-direction: column;
  gap: 32px;
}

/* cada case */
.case-item{
  width: 100%;
}

.case-item__inner{
  display: flex;
  flex-direction: column; /* mobile: foto em cima, texto embaixo */
  gap: 0;
  border-radius: var(--radius-s, 20px);
  overflow: hidden;
}

/* imagem */
.case-item__media{
  width: 100%;
  overflow: hidden;
}
.case-item__img{
  width: 100%;
  height: auto;
  max-height: 70vh;
  object-fit: cover;
  display: block;
}

/* box de texto */
.case-item__copy{
  padding: 40px 32px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* metrics */
.metrics-inline{
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.metric-line{
  display: flex;
  align-items: baseline;
  gap: 10px;
  border-top: 1px solid #C4DDD5;
  padding-top: 10px;
}
.metric-line:first-child{
  border-top: none;
}
.metric-num{
  font-weight: 300;
  font-size: 1rem;
  padding: 8px 0;
}
.metric-label{
  color: var(--gray-700);
}

/* DESKTOP – scroll horizontal: cards lado a lado */
@media (min-width: 992px){
  .cases-list{
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: min(50vw, 1120px); /* largura de cada card */
    gap: 32px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    padding-inline: clamp(12px, 3vw, 24px);
  }

  .case-item{
    scroll-snap-align: start;
  }

  .case-item__inner{
    flex-direction: row; /* imagem esquerda / texto direita */
  }

  .case-item__media{
    flex: 1 1 50%;
  }

  .case-item__copy{
    flex: 1 1 50%;
    padding: 60px;
    border-radius: 0 var(--radius-s, 20px) var(--radius-s, 20px) 0;
  }

  .case-item__img{
    height: 100%;
    max-height: none;
    object-fit: cover;
  }
}