/* ==========================================================================
   Insemina Pet — base + seção 01 (header + hero)
   Tokens conforme identidade/design-guide.md
   ========================================================================== */

:root{
  /* cores */
  --verde-escuro:  #0F3D2E;
  --verde-profundo:#14513C;
  --verde-limao:   #82CA63;
  --menta:         #6FDBCB;
  --creme:         #F7F6F1;
  --branco:        #FFFFFF;
  --tinta:         #12201B;
  --tinta-suave:   #4E6C63;
  --creme-suave:   #B6D8CB;

  /* layout */
  --maxw: 1240px;
  --gutter: clamp(20px, 5vw, 56px);
  --radius-card: 24px;
  --radius-pill: 999px;

  /* tipografia */
  --font: "Outfit", system-ui, -apple-system, "Segoe UI", sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }

body{
  margin:0;
  font-family:var(--font);
  font-weight:400;
  line-height:1.6;
  color:var(--tinta);
  background:var(--creme);
  -webkit-font-smoothing:antialiased;
}

img{ display:block; max-width:100%; }
a{ color:inherit; }

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

.skip-link{
  position:absolute; left:50%; top:-100px; transform:translateX(-50%);
  z-index:100; padding:12px 22px; border-radius:var(--radius-pill);
  background:var(--verde-limao); color:var(--verde-escuro);
  font-weight:600; text-decoration:none; transition:top .2s ease;
}
.skip-link:focus{ top:16px; }

:focus-visible{
  outline:2px solid var(--verde-limao);
  outline-offset:3px;
  border-radius:4px;
}

/* --------------------------------------------------------------------------
   Botões
   Regra dura do design-guide: fundo verde-limão SEMPRE com texto verde-escuro.
   -------------------------------------------------------------------------- */

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:44px; padding:11px 22px;
  border:0; border-radius:var(--radius-pill);
  font-family:var(--font); font-size:.95rem; font-weight:600;
  line-height:1.2; text-decoration:none; white-space:nowrap;
  cursor:pointer;
  transition:background-color .22s ease, border-color .22s ease, color .22s ease, transform .18s ease;
}
.btn:active{ transform:translateY(1px); }

.btn-primary{ background:var(--verde-limao); color:var(--verde-escuro); }
.btn-primary:hover{ background:#94D978; }

.btn-ghost{
  background:rgba(255,255,255,.10);
  color:var(--branco);
  border:1.5px solid rgba(255,255,255,.45);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
.btn-ghost:hover{ background:rgba(255,255,255,.18); border-color:rgba(255,255,255,.75); }

.btn-lg{ min-height:52px; padding:15px 30px; font-size:1rem; }

/* --------------------------------------------------------------------------
   Header flutuante
   -------------------------------------------------------------------------- */

.site-header{
  position:fixed; top:0; left:0; right:0; z-index:50;
  padding:14px var(--gutter);
  /* transform em vez de padding: o navegador anima sem refazer layout */
  transform:translateY(0);
  transition:transform .4s cubic-bezier(.4,0,.2,1);
  will-change:transform;
}

.header-inner{
  position:relative;
  max-width:var(--maxw); margin:0 auto;
  display:flex; align-items:center; gap:clamp(16px,2.2vw,34px);
  padding:8px 8px 8px 13px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:var(--radius-pill);
  background:rgba(15,61,46,.68);
  backdrop-filter:blur(14px) saturate(1.1);
  -webkit-backdrop-filter:blur(14px) saturate(1.1);
  transition:background-color .4s cubic-bezier(.4,0,.2,1),
             border-color .4s cubic-bezier(.4,0,.2,1);
}

/* estado rolado: deixa de ser transparente */
.site-header.is-scrolled{ transform:translateY(-4px); }
.site-header.is-scrolled .header-inner{
  background:var(--verde-escuro);
  border-color:rgba(255,255,255,.14);
}

.brand{ display:flex; align-items:center; gap:11px; text-decoration:none; flex-shrink:0; }
.brand-mark{ width:40px; height:40px; border-radius:50%; }
.brand-word{
  color:var(--branco); font-size:1.02rem;
  letter-spacing:.11em; text-transform:uppercase; line-height:1;
}
.brand-word-light{ font-weight:200; }
.brand-word-bold{ font-weight:600; }

.nav{ margin-left:auto; }
.nav-list{
  display:flex; align-items:center; gap:clamp(14px,1.8vw,28px);
  margin:0; padding:0; list-style:none;
}
.nav-list a{
  position:relative;
  display:inline-block; padding:6px 2px;
  color:rgba(255,255,255,.88); font-size:.95rem; font-weight:400;
  text-decoration:none; transition:color .2s ease;
}
.nav-list a:hover{ color:var(--verde-limao); }

/* secao em que a pessoa esta */
.nav-list a.is-active{ color:var(--verde-limao); }
.nav-list a::after{
  content:"";
  position:absolute; left:2px; right:2px; bottom:0;
  height:2px; border-radius:2px;
  background:var(--verde-limao);
  transform:scaleX(0); transform-origin:left center;
  transition:transform .32s cubic-bezier(.4,0,.2,1);
}
.nav-list a.is-active::after{ transform:scaleX(1); }

.nav-cta{ flex-shrink:0; }
.nav-cta-mobile{ display:none; }

.nav-toggle{
  display:none; align-items:center; justify-content:center;
  width:46px; height:46px; margin-left:auto;
  background:transparent; border:1px solid rgba(255,255,255,.28);
  border-radius:var(--radius-pill); cursor:pointer;
}
.nav-toggle-bars{ display:block; width:20px; }
.nav-toggle-bars i{
  display:block; height:1.5px; background:var(--branco); border-radius:2px;
  transition:transform .25s ease, opacity .2s ease;
}
.nav-toggle-bars i + i{ margin-top:5px; }
.nav-toggle[aria-expanded="true"] .nav-toggle-bars i:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle-bars i:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] .nav-toggle-bars i:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */

.hero{
  position:relative;
  min-height:100svh;
  display:flex; align-items:center;
  overflow:hidden;
  background:var(--verde-escuro);
}

.hero-media{
  position:absolute; inset:0;
}
.hero-media img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  object-position:center center;
}

/* véu: garante contraste do texto sobre a foto */
.hero-veil{
  position:absolute; inset:0;
  background:
    linear-gradient(95deg,
      rgba(15,61,46,.88) 0%,
      rgba(15,61,46,.80) 30%,
      rgba(15,61,46,.64) 47%,
      rgba(15,61,46,.22) 64%,
      rgba(15,61,46,0)   82%);
}

.hero-inner{
  position:relative;
  width:100%; max-width:var(--maxw);
  margin:0 auto;
  padding:150px var(--gutter) 90px;
}

.hero-content{ max-width:640px; }

.eyebrow{
  margin:0 0 22px;
  display:inline-flex; align-items:center;
  padding:7px 16px;
  border:1px solid rgba(111,219,203,.45);
  border-radius:var(--radius-pill);
  /* fundo proprio: no vertical o selo cai sobre area clara da foto */
  background:rgba(15,61,46,.55);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  color:var(--menta);
  font-size:.78rem; font-weight:400;
  text-transform:uppercase; letter-spacing:.12em;
}

.hero-title{
  margin:0 0 24px;
  font-size:clamp(2.35rem, 5vw, 4.25rem);
  line-height:1.07;
  letter-spacing:-.02em;
  color:var(--branco);
  text-wrap:balance;
}
.hero-title .t-light{ display:block; font-weight:200; }
.hero-title .t-bold{ display:block; font-weight:600; }

.hero-sub{
  margin:0 0 34px;
  max-width:540px;
  font-size:clamp(1rem, 1.2vw, 1.12rem);
  line-height:1.65;
  color:rgba(255,255,255,.90);
}

.hero-actions{ display:flex; flex-wrap:wrap; gap:14px; margin-bottom:30px; }

/* lista em flex: a quebra acontece entre itens, nunca no meio de um */
.hero-facts{
  display:flex; flex-wrap:wrap; align-items:center;
  gap:4px 0;
  margin:0; padding:0; list-style:none;
  font-size:.83rem;
  color:rgba(255,255,255,.78);
}
.hero-facts li{ white-space:nowrap; }
.hero-facts li::before{
  content:"•";
  margin:0 9px;
  color:var(--verde-limao);
}
.hero-facts li:first-child::before{ content:none; }

/* --------------------------------------------------------------------------
   Responsivo
   -------------------------------------------------------------------------- */

@media (max-width:1080px){
  .nav-list{ gap:16px; }
  .nav-list a{ font-size:.9rem; }
  .brand-word{ display:none; }
}

@media (max-width:900px){
  .nav-cta{ display:none; }
  .nav-toggle{ display:inline-flex; }

  .nav{
    display:none;
    position:absolute; top:calc(100% + 12px); left:0; right:0;
    margin-left:0;
    padding:20px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:var(--radius-card);
    background:var(--verde-escuro);
  }
  .nav.is-open{ display:block; }

  .nav-list{ flex-direction:column; align-items:stretch; gap:0; }
  .nav-list li + li{ border-top:1px solid rgba(255,255,255,.10); }
  .nav-list a{ padding:14px 4px 14px 14px; font-size:1rem; }
  .nav-list a::after{
    left:0; right:auto; top:14px; bottom:14px;
    width:2px; height:auto;
    transform:scaleY(0); transform-origin:center top;
  }
  .nav-list a.is-active::after{ transform:scaleY(1); }

  .nav-cta-mobile{ display:flex; width:100%; margin-top:18px; }

  .brand-word{ display:block; }
}

@media (max-width:820px){
  .hero{ align-items:flex-end; }

  .hero-media,
  .hero-media img{ object-position:center center; }

  /* no vertical o rosto fica no topo e o texto embaixo:
     o véu escurece forte a partir da metade para o texto passar em contraste */
  .hero-veil{
    background:
      linear-gradient(180deg,
        rgba(15,61,46,.62) 0%,
        rgba(15,61,46,.12) 20%,
        rgba(15,61,46,.35) 38%,
        rgba(15,61,46,.80) 52%,
        rgba(15,61,46,.94) 68%,
        rgba(15,61,46,1)   100%);
  }

  .hero-inner{ padding:120px var(--gutter) 48px; }
  .hero-content{ max-width:none; }
  /* menos texto sobre a foto: o veterinario precisa aparecer */
  .so-desktop{ display:none; }
  .hero-facts{ display:none; }
  .hero-title{ margin-bottom:18px; }
  .hero-sub{ margin-bottom:26px; font-size:.98rem; }
  .hero-actions{ margin-bottom:0; }
  .hero-sub{ max-width:none; }
  .hero-actions{ gap:12px; }
  .hero-actions .btn{ flex:1 1 220px; }
}

@media (max-width:480px){
  .header-inner{ padding:8px 8px 8px 12px; }
  .brand-mark{ width:40px; height:40px; }
  .brand-word{ font-size:.92rem; }
  .hero-title{ font-size:clamp(2rem, 8.4vw, 2.6rem); }
  .hero-facts{ font-size:.82rem; line-height:1.9; }
}

/* tela estreita: os fatos viram lista empilhada, um marcador por linha */
@media (max-width:560px){
  .hero-facts{ flex-direction:column; align-items:flex-start; gap:8px; }
  .hero-facts li{ position:relative; padding-left:18px; white-space:normal; }
  .hero-facts li::before,
  .hero-facts li:first-child::before{
    content:"•";
    position:absolute; left:0; margin:0;
    color:var(--verde-limao);
  }
}

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ transition-duration:.01ms !important; animation-duration:.01ms !important; }
}


/* --------------------------------------------------------------------------
   Secao 02 - Servicos
   -------------------------------------------------------------------------- */

section[id], .card[id]{ scroll-margin-top:100px; }

.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 var(--gutter); }

.services{
  background:var(--creme);
  padding:clamp(72px,9vw,130px) 0;
}

/* bloco de abertura: titulo a esquerda, texto e dados a direita */
.services-intro{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:clamp(28px,4vw,64px);
  align-items:start;
}

.section-title{
  margin:0;
  font-size:clamp(1.9rem,3.3vw,2.9rem);
  line-height:1.12; letter-spacing:-.02em;
  color:var(--tinta);
}
.section-title .t-light{ display:block; font-weight:200; }
.section-title .t-bold{ display:block; font-weight:600; }

.services-intro-side p{
  margin:0 0 20px;
  font-size:1rem; line-height:1.7;
  color:var(--tinta-suave);
}

.meta{
  display:flex; flex-wrap:wrap; gap:10px 22px;
  margin:0; padding:0; list-style:none;
  font-size:.86rem; color:var(--tinta-suave);
}
.meta li{ display:inline-flex; align-items:center; gap:7px; }
.meta svg{ width:17px; height:17px; flex-shrink:0; color:var(--verde-escuro); }

.services-head{
  margin:clamp(56px,7vw,96px) 0 clamp(28px,3.5vw,44px);
  text-align:center;
}
.services-head h3{
  margin:0 0 12px;
  font-size:clamp(1.5rem,2.5vw,2.15rem);
  font-weight:200; line-height:1.2; letter-spacing:-.015em;
  color:var(--tinta);
}
.services-head h3 strong{ font-weight:600; }
.services-head p{
  margin:0 auto; max-width:540px;
  font-size:1rem; line-height:1.65;
  color:var(--tinta-suave);
}

/* grade de cards */
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }

.card{
  display:flex; flex-direction:column;
  background:var(--branco);
  border:1px solid rgba(18,32,27,.10);
  border-radius:var(--radius-card);
  overflow:hidden;
}

.card-media{ display:block; }
.card-media img{ width:100%; aspect-ratio:5/4; object-fit:cover; }

.card-body{ display:flex; flex-direction:column; flex:1; padding:26px 26px 28px; }
.card h4{ margin:0 0 10px; font-size:1.2rem; font-weight:600; line-height:1.25; color:var(--tinta); }
.card p{ margin:0 0 20px; font-size:.95rem; line-height:1.62; color:var(--tinta-suave); }

.card-link{
  margin-top:auto; align-self:flex-start;
  display:inline-flex; align-items:center; gap:8px;
  font-size:.92rem; font-weight:600;
  color:var(--verde-escuro); text-decoration:none;
}
.card-link span{ transition:transform .2s ease; }
.card-link:hover span{ transform:translateX(4px); }

.icon-circle{
  display:inline-grid; place-items:center;
  width:52px; height:52px; margin-bottom:18px;
  border:1px solid rgba(18,32,27,.14); border-radius:50%;
  color:var(--verde-escuro);
}
.icon-circle svg{ width:24px; height:24px; }

/* card de destaque: a frente pioneira ocupa duas colunas */
.card-highlight{
  grid-column:span 2;
  flex-direction:row; gap:clamp(20px,3vw,40px);
  padding:clamp(26px,3vw,38px);
  background:var(--verde-escuro);
  border-color:transparent;
}
.card-highlight-aside{
  display:flex; flex-direction:column; align-items:flex-start; gap:14px;
  flex-shrink:0;
}
.card-highlight .icon-circle{
  width:58px; height:58px; margin-bottom:0;
  border-color:rgba(255,255,255,.28);
  color:var(--menta);
}
.card-highlight .tag{
  display:inline-flex; padding:6px 14px;
  border:1px solid rgba(111,219,203,.45);
  border-radius:var(--radius-pill);
  background:rgba(255,255,255,.06);
  color:var(--menta);
  font-size:.72rem; text-transform:uppercase; letter-spacing:.11em;
  white-space:nowrap;
}
.card-highlight .card-body{ padding:0; }
.card-highlight h4{ margin-bottom:12px; font-size:clamp(1.35rem,2vw,1.7rem); color:var(--branco); }
.card-highlight p{ max-width:62ch; font-size:1rem; color:rgba(255,255,255,.86); }
.card-highlight .card-note{
  margin-bottom:22px; padding-left:14px;
  border-left:2px solid var(--verde-limao);
  font-size:.88rem; color:var(--creme-suave);
}
.card-highlight .card-link{ color:var(--verde-limao); }

@media (max-width:980px){
  .services-intro{ grid-template-columns:1fr; }
  .cards{ grid-template-columns:repeat(2,1fr); }
  /* em duas colunas o destaque vai para o fim, senao abre buraco na grade */
  .card-highlight{ grid-column:1 / -1; order:1; }
}

@media (max-width:640px){
  .cards{ grid-template-columns:1fr; }
  .card-highlight{ grid-column:1; order:0; flex-direction:column; }
  .card-highlight-aside{ flex-direction:row; align-items:center; }
  .card-body{ padding:22px 22px 24px; }
}


/* --------------------------------------------------------------------------
   Secoes 03 e 05 - blocos em duas colunas (texto + foto organica)
   -------------------------------------------------------------------------- */

.sobre{ background:var(--branco); padding:clamp(72px,9vw,130px) 0; }
.estrutura{ background:var(--creme); padding:clamp(72px,9vw,130px) 0; }

.split{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:clamp(36px,6vw,88px);
  align-items:center;
}
.split-invertido{ grid-template-columns:1.1fr .9fr; }

.split-text > p{
  margin:0 0 18px;
  font-size:1rem; line-height:1.72;
  color:var(--tinta-suave);
}
.split-text > p strong{ font-weight:600; color:var(--tinta); }
.split-text .section-title{ margin-bottom:26px; }
.split-text .meta{ margin:26px 0 0; }
.split-text .btn{ margin-top:30px; }

/* foto em forma organica, com contorno deslocado */
.blob{ position:relative; }
.blob img{
  display:block; width:100%;
  aspect-ratio:4/5; object-fit:cover;
  border-radius:64% 36% 52% 48% / 38% 58% 42% 62%;
}
.blob::before{
  content:"";
  position:absolute; inset:-18px;
  border:2px solid var(--verde-limao);
  border-radius:64% 36% 52% 48% / 38% 58% 42% 62%;
  pointer-events:none;
}

/* a fachada e uma foto larga com informacao ate a borda:
   mascara oval cortaria o letreiro, entao usa moldura em folha */
.blob-larga img{
  aspect-ratio:16/9;
  border-radius:110px 26px 110px 26px;
}
.blob-larga::before{
  inset:-14px;
  border-radius:120px 32px 120px 32px;
}

.btn-zap{ gap:10px; }
.btn-zap svg{ width:20px; height:20px; }

/* tres pilares */
.pillars{
  display:grid; grid-template-columns:repeat(3,1fr); gap:20px;
  margin-top:clamp(56px,7vw,96px);
}
.pillar{
  padding:30px 28px 32px;
  background:var(--creme);
  border:1px solid rgba(18,32,27,.10);
  border-radius:var(--radius-card);
  text-align:center;
}
.pillar .icon-circle{ margin:0 auto 16px; }
.pillar h3{ margin:0 0 10px; font-size:1.15rem; font-weight:600; color:var(--tinta); }
.pillar p{ margin:0; font-size:.94rem; line-height:1.62; color:var(--tinta-suave); }

/* --------------------------------------------------------------------------
   Carrossel de avaliacoes
   -------------------------------------------------------------------------- */

.reviews-head{ margin:clamp(56px,7vw,96px) 0 clamp(24px,3vw,36px); text-align:center; }
.reviews-head h3{
  margin:0;
  font-size:clamp(1.5rem,2.5vw,2.15rem);
  font-weight:200; line-height:1.2; letter-spacing:-.015em;
  color:var(--tinta);
}
.reviews-head h3 strong{ font-weight:600; }
.reviews-nota{
  display:inline-flex; align-items:baseline; gap:7px;
  margin:14px 0 0;
  font-size:.92rem; color:var(--tinta-suave);
}
.reviews-nota-valor{
  font-size:1.35rem; font-weight:600; color:var(--verde-escuro);
}
.reviews-nota span[aria-hidden]{ color:var(--verde-limao); }

.carousel{ position:relative; }

.carousel-track{
  display:flex; gap:20px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-padding-left:0;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  padding-bottom:4px;
}
.carousel-track::-webkit-scrollbar{ display:none; }

.review{
  flex:0 0 calc((100% - 40px) / 3);
  scroll-snap-align:start;
  display:flex; flex-direction:column;
  padding:24px 24px 26px;
  background:var(--branco);
  border:1px solid rgba(18,32,27,.10);
  border-radius:var(--radius-card);
}

.review-head{ display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.review-avatar{
  display:grid; place-items:center;
  width:42px; height:42px; flex-shrink:0;
  border-radius:50%;
  background:var(--verde-escuro); color:var(--menta);
  font-size:1rem; font-weight:600;
}
.review:nth-child(even) .review-avatar{ background:var(--verde-profundo); }
.review-who{ display:flex; flex-direction:column; line-height:1.3; }
.review-who strong{ font-size:.95rem; font-weight:600; color:var(--tinta); }
.review-who span{ font-size:.78rem; color:var(--tinta-suave); }

.review-stars{ display:flex; gap:3px; margin-bottom:12px; color:#F0A93B; }
.review-stars svg{ width:16px; height:16px; }

.review p{
  margin:0;
  font-size:.94rem; line-height:1.62;
  color:var(--tinta-suave);
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:6;
  overflow:hidden;
}

.carousel-controls{
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  margin-top:26px;
}
.carousel-dots{ display:flex; gap:8px; }
.carousel-dot{
  width:8px; height:8px; padding:0;
  border:0; border-radius:50%;
  background:rgba(18,32,27,.20);
  cursor:pointer;
  transition:background-color .2s ease, width .2s ease;
}
.carousel-dot.is-active{ width:22px; border-radius:999px; background:var(--verde-escuro); }

.carousel-arrows{ display:flex; gap:10px; }

/* botao de pausa: mostra um icone por vez */
.carousel-arrow[data-play] .ico-play{ display:none; }
.carousel.is-paused .carousel-arrow[data-play] .ico-pause{ display:none; }
.carousel.is-paused .carousel-arrow[data-play] .ico-play{ display:block; }
.carousel-arrow{
  display:grid; place-items:center;
  width:44px; height:44px;
  border:1px solid rgba(18,32,27,.16); border-radius:50%;
  background:transparent; color:var(--verde-escuro);
  cursor:pointer;
  transition:background-color .2s ease, border-color .2s ease, opacity .2s ease;
}
.carousel-arrow svg{ width:20px; height:20px; }
.carousel-arrow:hover:not(:disabled){ background:var(--verde-escuro); border-color:var(--verde-escuro); color:var(--branco); }
.carousel-arrow:disabled{ opacity:.32; cursor:default; }
/* no automatico as setas nunca ficam travadas nas pontas */
.carousel[data-autoplay] .carousel-arrow:disabled{ opacity:1; cursor:pointer; }

.reviews-link{ margin:22px 0 0; text-align:center; }
.reviews-link a{
  display:inline-flex; align-items:center; gap:8px;
  font-size:.92rem; font-weight:600;
  color:var(--verde-escuro); text-decoration:none;
  border-bottom:1px solid rgba(15,61,46,.28);
  padding-bottom:2px;
}
.reviews-link a:hover{ border-bottom-color:var(--verde-escuro); }
.reviews-link span{ transition:transform .2s ease; }
.reviews-link a:hover span{ transform:translateX(4px); }

/* --------------------------------------------------------------------------
   Responsivo das secoes 03 e 05
   -------------------------------------------------------------------------- */

@media (max-width:980px){
  .split,
  .split-invertido{ grid-template-columns:1fr; gap:40px; }
  /* no empilhado a foto vem sempre depois do texto */
  .split .blob{ order:2; max-width:460px; }
  .split .blob-larga{ max-width:none; }
  .split-text{ order:1; }
  .pillars{ grid-template-columns:1fr; }
  .pillar{ text-align:left; }
  .pillar .icon-circle{ margin:0 0 14px; }
  .review{ flex:0 0 calc((100% - 20px) / 2); }
}

@media (max-width:640px){
  .review{ flex:0 0 86%; }
  .carousel-controls{ justify-content:space-between; }
  .carousel-arrow[data-prev],
  .carousel-arrow[data-next]{ display:none; }
  .blob::before{ inset:-12px; }
}


/* --------------------------------------------------------------------------
   Secao 06 - Contato e mapa
   -------------------------------------------------------------------------- */

.contato{ background:var(--branco); padding:clamp(72px,9vw,130px) 0; }

.contato-head{ max-width:640px; margin:0 auto clamp(40px,5vw,64px); text-align:center; }
.contato-head .section-title{ margin-bottom:18px; }
.contato-head > p{
  margin:0 auto;
  max-width:520px;
  font-size:1rem; line-height:1.7;
  color:var(--tinta-suave);
}
.contato-head .btn{ margin-top:28px; }

.contato-cards{
  display:grid; grid-template-columns:repeat(3,1fr); gap:20px;
  margin-bottom:clamp(36px,4.5vw,56px);
}
.contato-card{
  padding:30px 28px 32px;
  background:var(--creme);
  border:1px solid rgba(18,32,27,.10);
  border-radius:var(--radius-card);
  text-align:center;
}
.contato-card .icon-circle{ margin:0 auto 16px; }
.contato-card h3{ margin:0 0 10px; font-size:1.1rem; font-weight:600; color:var(--tinta); }
.contato-card p{ margin:0; font-size:.98rem; line-height:1.75; color:var(--tinta-suave); }
.contato-card a{ color:var(--verde-escuro); font-weight:600; text-decoration:none; }
.contato-card a:hover{ text-decoration:underline; }
.contato-nota{
  display:inline-block; margin-top:6px;
  font-size:.84rem; color:var(--verde-escuro);
}

/* mapa incorporado */
.mapa{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(18,32,27,.10);
  border-radius:var(--radius-card);
  background:var(--creme);
  aspect-ratio:21/9;
}
.mapa iframe{
  display:block;
  width:100%; height:100%;
  border:0;
}

.mapa-link{ margin:18px 0 0; text-align:center; }
.mapa-link a{
  display:inline-flex; align-items:center; gap:8px;
  font-size:.92rem; font-weight:600;
  color:var(--verde-escuro); text-decoration:none;
  border-bottom:1px solid rgba(15,61,46,.28); padding-bottom:2px;
}
.mapa-link a:hover{ border-bottom-color:var(--verde-escuro); }
.mapa-link span{ transition:transform .2s ease; }
.mapa-link a:hover span{ transform:translateX(4px); }

/* --------------------------------------------------------------------------
   Rodape
   -------------------------------------------------------------------------- */

.rodape{
  background:var(--verde-escuro);
  color:var(--creme-suave);
  padding:clamp(56px,7vw,88px) 0 0;
}

.rodape-topo{
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1.2fr;
  gap:clamp(28px,4vw,56px);
  padding-bottom:clamp(40px,5vw,64px);
}

.rodape-marca img{ width:230px; height:auto; margin-bottom:20px; }
.rodape-marca p{
  margin:0 0 22px;
  max-width:320px;
  font-size:.94rem; line-height:1.7;
  color:var(--creme-suave);
}

.rodape-social{ display:flex; gap:12px; }
.rodape-social a{
  display:grid; place-items:center;
  width:42px; height:42px;
  border:1px solid rgba(255,255,255,.22); border-radius:50%;
  color:var(--branco);
  transition:background-color .2s ease, border-color .2s ease, color .2s ease;
}
.rodape-social svg{ width:19px; height:19px; }
.rodape-social a:hover{
  background:var(--verde-limao);
  border-color:var(--verde-limao);
  color:var(--verde-escuro);
}

.rodape-col h2{
  margin:0 0 16px;
  font-size:.78rem; font-weight:600;
  text-transform:uppercase; letter-spacing:.12em;
  color:var(--menta);
}
.rodape-col ul{ margin:0; padding:0; list-style:none; }
.rodape-col li{
  margin-bottom:11px;
  font-size:.94rem; line-height:1.55;
  color:var(--creme-suave);
}
.rodape-col a{ color:var(--creme-suave); text-decoration:none; transition:color .2s ease; }
.rodape-col a:hover{ color:var(--verde-limao); }

.rodape-base{
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px 24px;
  padding:22px 0 26px;
  border-top:1px solid rgba(255,255,255,.14);
}
.rodape-base p{
  margin:0;
  font-size:.84rem;
  color:rgba(255,255,255,.62);
}

@media (max-width:980px){
  .contato-cards{ grid-template-columns:1fr; }
  .mapa{ aspect-ratio:4/3; }
  .rodape-topo{ grid-template-columns:1fr 1fr; }
  .rodape-marca{ grid-column:1 / -1; }
}

@media (max-width:640px){
  .rodape-topo{ grid-template-columns:1fr; gap:34px; }
  .mapa{ aspect-ratio:1/1; }
  .rodape-base{ flex-direction:column; }
}