/* ================================================================
   1. FONTES E PALETA
   Edite as variáveis abaixo para trocar rapidamente as cores do site.
================================================================ */
:root {
  --verde: #173f43;       /* Confiança */
  --verde-escuro: #0f3033;
  --terracota: #c57c68;   /* Afetividade */
  --terracota-escuro: #a85f4d;
  --creme: #f5efe8;       /* Acolhimento */
  --branco: #fffdfa;
  --texto: #183235;
  --cinza: #657678;
  --linha: rgba(23, 63, 67, .17);
  --serif: Georgia, "Times New Roman", serif;
  --sans: Arial, Helvetica, sans-serif;
  --sombra: 0 24px 70px rgba(23, 63, 67, .15);
}

/* 2. RESET E CONFIGURAÇÕES GERAIS */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 82px; }
body { margin: 0; background: var(--creme); color: var(--texto); font-family: var(--sans); line-height: 1.65; overflow-x: hidden; }
body.no-scroll { overflow: hidden; }
body.leaving main, body.leaving header, body.leaving footer { opacity: .25; transform: scale(.99); transition: .32s ease; }
img { display: block; width: 100%; }
.fa-solid,.fa-regular,.fa-brands { display: inline-block; width: 1.15em; font-style: normal; text-align: center; }
.fa-calendar-check::before { content: "✓"; }.fa-arrow-down::before { content: "↓"; }.fa-location-dot::before { content: "●"; }
.fa-repeat::before { content: "↻"; }.fa-battery-quarter::before { content: "▰"; }.fa-heart::before { content: "♡"; }.fa-seedling::before { content: "♧"; }
.fa-comments::before { content: "◌"; }.fa-bullseye::before { content: "◎"; }.fa-route::before { content: "↝"; }.fa-building::before { content: "▦"; }
.fa-video::before { content: "▶"; }.fa-arrow-right::before { content: "→"; }.fa-circle-info::before { content: "ⓘ"; }.fa-phone::before { content: "☎"; }
.fa-whatsapp::before { content: "◉"; }.fa-shield-halved::before { content: "◆"; }.fa-plus::before { content: "+"; }.fa-triangle-exclamation::before { content: "⚠"; }
.fa-arrow-up-right-from-square::before { content: "↗"; }.fa-xmark::before { content: "×"; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--serif); line-height: 1.08; font-weight: 500; }
h1 { font-size: clamp(3.3rem, 6.3vw, 6.8rem); letter-spacing: -.045em; }
h2 { font-size: clamp(2.35rem, 4.3vw, 4.8rem); letter-spacing: -.035em; }
h3 { font-size: 1.55rem; }
.section { padding: clamp(5rem, 9vw, 9rem) 6vw; }
.soft { background: var(--branco); }
.eyebrow { color: var(--terracota-escuro); font-size: .72rem; font-weight: 700; letter-spacing: .2em; }
.eyebrow.light { color: #efb4a2; }
.lead { max-width: 650px; color: var(--cinza); font-size: 1.08rem; }
.section-title { max-width: 820px; margin-bottom: 3.5rem; }
.section-title > p:last-child { color: var(--cinza); max-width: 680px; }
.ethical-note { color: var(--cinza); font-size: .78rem; margin: 2rem 0 0; }

/* 3. BOTÕES E LINKS DE AÇÃO */
.button { display: inline-flex; align-items: center; justify-content: center; gap: .65rem; min-height: 54px; border: 0; border-radius: 999px; padding: .85rem 1.45rem; font-weight: 700; cursor: pointer; transition: transform .25s, background .25s, box-shadow .25s; }
.button:hover { transform: translateY(-3px); box-shadow: 0 12px 30px rgba(23, 63, 67, .18); }
.primary { background: var(--terracota); color: white; }
.primary:hover { background: var(--terracota-escuro); }
.full { width: 100%; }
.text-link { display: inline-flex; align-items: center; gap: .5rem; color: var(--verde); font-weight: 700; padding: .8rem; }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin: 2rem 0; }

/* 4. TELA DE ABERTURA */
.intro { position: fixed; inset: 0; z-index: 999; display: grid; place-content: center; justify-items: center; gap: 2rem; background: var(--verde); color: var(--creme); transition: transform .9s cubic-bezier(.76,0,.24,1); }
.intro img { width: 150px; border-radius: 18px; }
.intro span { font-size: .66rem; letter-spacing: .22em; }
.intro.finished { transform: translateY(-105%); pointer-events: none; }

/* 5. CABEÇALHO E MENU */
.header { position: sticky; top: 0; z-index: 100; height: 82px; display: flex; align-items: center; justify-content: space-between; padding: 0 6vw; background: rgba(245,239,232,.93); border-bottom: 1px solid var(--linha); backdrop-filter: blur(14px); }
.brand img { width: 72px; height: 64px; object-fit: contain; object-position: left center; mix-blend-mode: multiply; }
.nav { display: flex; align-items: center; gap: clamp(.9rem, 2vw, 2rem); font-size: .88rem; font-weight: 600; }
.nav > a { transition: color .2s, transform .2s; }
.nav > a:hover { color: var(--terracota-escuro); transform: translateY(-2px); }
.nav .nav-cta { color: var(--creme); background: var(--verde); border-radius: 999px; padding: .72rem 1.15rem; }
.menu-button { display: none; position: relative; z-index: 102; width: 48px; height: 48px; border: 0; background: transparent; cursor: pointer; }
.menu-button span { position: absolute; left: 11px; width: 26px; height: 2px; background: var(--verde); transition: .35s ease; }
.menu-button span:first-child { top: 18px; }.menu-button span:last-child { top: 29px; }
.menu-button.open span:first-child { top: 24px; transform: rotate(45deg); }.menu-button.open span:last-child { top: 24px; transform: rotate(-45deg); }

/* 6. HERO */
.hero { width: min(100%, 1480px); min-height: calc(100vh - 82px); margin: 0 auto; display: grid; grid-template-columns: minmax(0,1.05fr) minmax(320px,.95fr); align-items: center; gap: 5vw; padding-top: 5rem; }
.hero h1 em { color: var(--terracota); font-weight: 500; }
.service { display: flex; gap: .6rem; align-items: center; font-weight: 700; font-size: .92rem; }
.service i { color: var(--terracota); }
.hero-photo { position: relative; isolation: isolate; width: 100%; max-width: 560px; min-width: 0; margin: 0 0 0 auto; }
.hero-photo > img { position: relative; z-index: 1; width: 100%; height: auto; margin-left: auto; border-radius: 46% 46% 18px 18px; box-shadow: 0 30px 75px rgba(23,63,67,.22); }
.hero-photo::before { content: ""; position: absolute; z-index: 0; left: -9%; top: 8%; width: 78%; height: 78%; border-radius: 50% 0 50% 0; background: var(--terracota); transform: translate(-3%,4%); box-shadow: 0 22px 55px rgba(168,95,77,.18); }
.hero-photo figcaption { position: absolute; z-index: 2; right: -2vw; bottom: 3rem; width: min(350px, 78%); padding: 1.4rem 1.7rem; border-radius: 25px 0 0 25px; background: rgba(23,63,67,.95); color: var(--creme); box-shadow: var(--sombra); }
.hero-photo figcaption strong, .hero-photo figcaption span { display: block; }.hero-photo figcaption strong { font: 500 1.7rem var(--serif); }

/* 7. CARDS E SEÇÕES DE CONTEÚDO */
.cards { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: var(--linha); border: 1px solid var(--linha); }
.card { min-height: 310px; padding: 2.3rem 1.8rem; background: var(--branco); transition: background .3s, color .3s, transform .3s; }
.card:hover { z-index: 2; background: var(--verde); color: var(--creme); transform: translateY(-5px); }
.card > i { color: var(--terracota); font-size: 1.5rem; margin-bottom: 3.2rem; }.card p { font-size: .9rem; }
.split { display: grid; grid-template-columns: 1fr 1fr; padding: 0; background: var(--verde); color: var(--creme); }
.split-photo { display: grid; place-items: center; min-width: 0; margin: 0; padding: clamp(2rem,5vw,6rem); background: var(--verde-escuro); }.split-photo img { width: 100%; max-width: 620px; height: auto; border-radius: 26px; box-shadow: var(--sombra); }
.split-copy { padding: 8vw 7vw; }
.feature-list { list-style: none; padding: 0; margin: 3rem 0 0; }
.feature-list li { display: grid; grid-template-columns: 42px 1fr; gap: .8rem; padding: 1.2rem 0; border-top: 1px solid rgba(245,239,232,.18); }
.feature-list i { color: #efb4a2; margin-top: .3rem; }.feature-list strong,.feature-list span { display: block; }.feature-list span { color: rgba(245,239,232,.68); }.feature-list strong { color: var(--creme); }
.steps { display: grid; grid-template-columns: repeat(4,1fr); gap: 1rem; }
.steps article { padding: 2rem; border-top: 1px solid var(--verde); }.steps span { color: var(--terracota); font-weight: 700; }.steps p { color: var(--cinza); }
.modality-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.3rem; }
.modality { min-height: 370px; display: flex; flex-direction: column; align-items: flex-start; padding: 3rem; background: var(--creme); border-radius: 30px; }
.modality > i { font-size: 2rem; color: var(--terracota); }.modality > p:first-of-type { margin-top: 4rem; font-size: .72rem; letter-spacing: .2em; }.modality a { margin-top: auto; font-weight: 700; }
.modality.dark { background: var(--verde); color: var(--creme); }.modality.dark p { color: rgba(245,239,232,.75); }
.about { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: 7vw; }
.about-photo { width: 100%; max-width: 590px; margin: 0 auto; }.about-photo img { width: 100%; height: auto; border-radius: 280px 280px 20px 20px; box-shadow: var(--sombra); }
.about > div > p { color: var(--cinza); }.pending { padding: 1rem; border-left: 3px solid var(--terracota); background: var(--branco); font-size: .83rem; }

/* 8. ÁREA DE AGENDAMENTO E FORMULÁRIO */
.schedule { display: grid; grid-template-columns: .85fr 1.15fr; gap: 6vw; background: var(--verde); color: var(--creme); }
.schedule-copy { align-self: center; }.schedule-copy > p { color: rgba(245,239,232,.72); }.phone { display: inline-flex; gap: .7rem; align-items: center; font-size: 1.25rem; font-weight: 700; }
.contact-form { padding: 2.3rem; background: var(--creme); color: var(--texto); border-radius: 28px; box-shadow: var(--sombra); }
.contact-form label { display: block; margin-bottom: 1rem; font-size: .8rem; font-weight: 700; }
.contact-form input,.contact-form select,.contact-form textarea { width: 100%; min-height: 52px; margin-top: .4rem; padding: .8rem 1rem; border: 1px solid var(--linha); border-radius: 8px; background: var(--branco); color: var(--texto); outline: none; }
.contact-form textarea { min-height: 110px; resize: vertical; }.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus { border-color: var(--terracota); box-shadow: 0 0 0 3px rgba(197,124,104,.18); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.consent { display: flex!important; align-items: flex-start; gap: .7rem; }.consent input { width: 18px; min-height: 18px; margin: .2rem 0 0; }.consent button { padding: 0; border: 0; background: transparent; color: var(--terracota-escuro); text-decoration: underline; cursor: pointer; }
.form-note { margin: 1rem 0 0; color: var(--cinza); font-size: .75rem; text-align: center; }

/* 9. FAQ, EMERGÊNCIA E RODAPÉ */
.faq { max-width: 1100px; margin: auto; }.faq details { border-top: 1px solid var(--linha); }.faq details:last-child { border-bottom: 1px solid var(--linha); }
.faq summary { display: flex; justify-content: space-between; gap: 1rem; padding: 1.5rem 0; font-weight: 700; cursor: pointer; list-style: none; }.faq summary::-webkit-details-marker { display: none; }.faq details[open] summary i { transform: rotate(45deg); }.faq summary i { transition: transform .25s; }.faq details p { max-width: 760px; color: var(--cinza); }
.emergency { display: grid; grid-template-columns: 90px 1fr; gap: 2rem; align-items: center; padding-top: 4rem; padding-bottom: 4rem; background: var(--terracota-escuro); color: white; }.emergency > i { font-size: 3rem; }.emergency h2 { font-size: clamp(2rem,4vw,4rem); }
.footer { display: grid; grid-template-columns: 1.2fr .8fr .8fr; gap: 3rem; padding: 4rem 6vw 7rem; background: var(--verde); color: var(--creme); }.footer > img { width: 150px; padding: .7rem; border-radius: 18px; background: var(--branco); }.footer > div { display: flex; flex-direction: column; gap: .5rem; }.footer > p,.footer > small { grid-column: 1/-1; color: rgba(245,239,232,.65); border-top: 1px solid rgba(245,239,232,.15); padding-top: 1rem; margin: 0; }.kyvion { color: #efb4a2; font-weight: 700; }.mobile-whatsapp { display: none; }

/* 10. MODAL DE PRIVACIDADE */
.modal[hidden] { display: none; }.modal { position: fixed; inset: 0; z-index: 500; display: grid; place-items: center; padding: 1rem; }.modal-overlay { position: absolute; inset: 0; background: rgba(15,48,51,.78); backdrop-filter: blur(8px); }.modal-box { position: relative; z-index: 1; width: min(600px,100%); max-height: 90vh; overflow: auto; padding: 2.5rem; border-radius: 28px; background: var(--creme); box-shadow: var(--sombra); }.modal-box h2 { font-size: clamp(2rem,4vw,3.4rem); }.modal-close { position: absolute; top: 1.2rem; right: 1.2rem; width: 42px; height: 42px; border: 1px solid var(--linha); border-radius: 50%; background: transparent; cursor: pointer; }

/* 11. ANIMAÇÕES DE ROLAGEM */
.reveal { opacity: 1; transform: none; }
.js .reveal { opacity: 0; transform: translateY(38px); transition: opacity .8s ease var(--reveal-delay,0ms), transform .8s cubic-bezier(.22,.61,.36,1) var(--reveal-delay,0ms); }.js .reveal.visible { opacity: 1; transform: none; }
.no-js .intro { display: none; }

/* 12. TABLETS E MENU MOBILE */
@media (max-width: 1050px) {
  .menu-button { display: block; }
  .nav { position: fixed; inset: 0; width: 100%; height: 100dvh; z-index: 101; flex-direction: column; justify-content: center; align-items: flex-start; gap: 1.2rem; padding: 15vh 11vw; background: var(--creme); font: 500 clamp(2rem,5vw,3rem) var(--serif); transform: translateY(-110dvh); transition: transform .6s cubic-bezier(.76,0,.24,1); }
  .nav.open { transform: translateY(0); }.nav .nav-cta { margin-top: 1rem; font: 700 1rem var(--sans); }
  .hero { grid-template-columns: 1fr 1fr; }
  .cards { grid-template-columns: 1fr 1fr; }.steps { grid-template-columns: 1fr 1fr; }
}

/* 13. CELULARES */
@media (max-width: 720px) {
  html { scroll-padding-top: 74px; }.header { height: 74px; padding: 0 1rem; }.brand img { width: 58px; height: 54px; }
  .section { padding: 5rem 1.25rem; }.hero { min-height: auto; grid-template-columns: 1fr; gap: 3rem; padding-top: 4rem; }.hero h1 { font-size: clamp(2.7rem,13vw,4rem); }.actions { flex-direction: column; align-items: stretch; }.text-link { justify-content: center; }.hero-photo { max-width: 480px; margin: 0 auto; }.hero-photo > img { height: auto; min-height: 0; }.hero-photo figcaption { position: relative; right: auto; bottom: auto; width: calc(100% - 1.5rem); margin: -1.5rem 0 0 auto; border-radius: 20px 0 20px 20px; }
  .cards,.steps,.split,.modality-grid,.about,.schedule,.emergency { grid-template-columns: 1fr; }.card { min-height: 250px; }.split-photo { min-height: 0; padding: 2.5rem 1.25rem; }.split-photo img { min-height: 0; }.split-copy { padding: 5rem 1.25rem; }.steps article { padding: 1.5rem 0; }.modality { padding: 2rem 1.4rem; }.about { gap: 3rem; }.about-photo img { max-height: none; }.form-row { grid-template-columns: 1fr; }.contact-form { padding: 1.4rem 1rem; }.emergency { gap: 1rem; }.emergency > i { font-size: 2rem; }
  .footer { grid-template-columns: 1fr; padding: 4rem 1.25rem 7rem; }.footer > img { width: 130px; }.footer > p,.footer > small { grid-column: 1; }.kyvion { display: inline-block; margin-top: .45rem; }
  .mobile-whatsapp { position: fixed; z-index: 90; left: 1rem; right: 1rem; bottom: 1rem; display: flex; align-items: center; justify-content: center; gap: .6rem; min-height: 54px; border-radius: 999px; background: var(--terracota); color: white; font-weight: 700; box-shadow: var(--sombra); }
  .modal-box { padding: 2rem 1.4rem; }
}

/* 14. ACESSIBILIDADE: desativa movimentos se o usuário preferir menos animações */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *,*::before,*::after { animation-duration: .01ms!important; transition-duration: .01ms!important; }
  .intro { display: none; }.reveal { opacity: 1; transform: none; }
}
