/* ==========================================================================
   KAMILA KATZER — PSICÓLOGA · CRP 12/26139
   Conceito: "Um espaço para falar" — sóbrio, editorial, sem romantização.
   Paleta oficial do manual: #293A57 · #546684 · #98A6BD · #F2F2F2
   Conteúdo 100% visível sem JS (html.js ativa aprimoramentos).
   ========================================================================== */

:root{
  --navy:#293A57;
  --navy-deep:#1E2C44;
  --mid:#546684;
  --soft:#98A6BD;
  --ice:#F2F2F2;
  --paper:#F7F6F3;
  --card:#FFFFFF;
  --text:#39455C;
  --muted:#7C8698;
  --line:#DFE2E8;
  --line-dark:rgba(242,242,242,.14);
  --wa:#1FAF57;
  --max:1140px;
  --pad:clamp(20px, 5vw, 44px);
  --serif:'Cormorant Garamond', Georgia, serif;
  --sans:'Montserrat', sans-serif;
}

*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
html, body{ overflow-x:hidden; }
body{
  font-family:var(--sans); background:var(--paper); color:var(--text);
  line-height:1.7; word-break:break-word; -webkit-font-smoothing:antialiased;
  font-size:16px;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul, ol{ list-style:none; }
.container{ max-width:var(--max); margin:0 auto; padding-inline:var(--pad); }
.section{ padding-block:clamp(64px, 10vw, 120px); }

/* etiqueta em caixa alta com tracking largo (assinatura da marca) */
.label{
  font-size:.62rem; font-weight:500; letter-spacing:.38em; text-transform:uppercase;
  color:var(--mid); display:flex; align-items:center; gap:14px;
}
.label::before{ content:""; width:30px; height:1px; background:var(--soft); flex:0 0 auto; }
.label--center{ justify-content:center; }
.label--center::after{ content:""; width:30px; height:1px; background:var(--soft); flex:0 0 auto; }
.label--light{ color:var(--soft); }

/* ---------- header ---------- */
.header{
  position:fixed; top:0; left:0; right:0; z-index:50;
  transition:background .35s ease, box-shadow .35s ease;
}
.header.is-scrolled{
  background:rgba(247,246,243,.95); backdrop-filter:blur(10px);
  box-shadow:0 1px 0 var(--line);
}
.header__inner{
  max-width:var(--max); margin:0 auto; padding:16px var(--pad);
  display:flex; align-items:center; justify-content:space-between; gap:18px;
}
.brand{ display:flex; align-items:center; gap:12px; }
.brand img{ width:38px; height:auto; flex:0 0 auto; }
.brand__text{ line-height:1.25; }
.brand__name{
  font-size:.88rem; font-weight:500; letter-spacing:.26em; text-transform:uppercase;
  color:var(--navy); display:block; white-space:nowrap;
}
.brand__role{
  font-size:.5rem; font-weight:500; letter-spacing:.44em; text-transform:uppercase;
  color:var(--mid); white-space:nowrap;
}
.nav{ display:flex; align-items:center; gap:clamp(14px, 2vw, 28px); }
.nav__link{
  font-size:.78rem; font-weight:500; color:var(--text);
  position:relative; padding:6px 0; white-space:nowrap;
}
.nav__link::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:1.5px;
  background:var(--navy); transition:right .3s ease;
}
.nav__link:hover::after{ right:0; }
@media (max-width:900px){ .nav__link{ display:none; } }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px; white-space:nowrap;
  min-height:50px; padding:14px 26px;
  font-size:.85rem; font-weight:600; letter-spacing:.04em; text-align:center;
  border:0; cursor:pointer;
  transition:transform .22s ease, box-shadow .22s ease, background .25s ease, color .25s ease;
}
.btn--navy{ background:var(--navy); color:#fff; }
.btn--navy:hover{ transform:translateY(-2px); box-shadow:0 12px 30px rgba(41,58,87,.3); background:var(--navy-deep); }
.btn--ghost{ border:1px solid var(--soft); color:var(--navy); background:transparent; }
.btn--ghost:hover{ border-color:var(--navy); transform:translateY(-2px); }
.btn--light{ background:var(--ice); color:var(--navy); }
.btn--light:hover{ transform:translateY(-2px); box-shadow:0 12px 30px rgba(0,0,0,.18); }
.btn--big{ min-height:56px; padding:17px 32px; font-size:.9rem; }
.btn svg{ flex:0 0 auto; }
.header .btn{ min-height:44px; padding:11px 20px; font-size:.78rem; }

/* ---------- hero ---------- */
.hero{
  min-height:100vh; min-height:100dvh;
  display:flex; flex-direction:column; justify-content:center;
  position:relative; overflow:hidden;
  padding:120px var(--pad) 90px;
  background:var(--paper);
}
.hero__mono{
  position:absolute; right:-6%; top:50%; transform:translateY(-50%);
  width:min(52vw, 560px); opacity:.05; pointer-events:none; user-select:none;
}
@media (max-width:760px){ .hero__mono{ width:78vw; right:-24%; opacity:.045; } }
.hero__inner{ max-width:var(--max); margin:0 auto; width:100%; position:relative; z-index:1; }
.hero__label{ margin-bottom:clamp(26px, 4.5vh, 44px); }
.hero__title{
  font-family:var(--serif); font-weight:500; color:var(--navy);
  font-size:clamp(3rem, 9.5vw, 6.8rem); line-height:1.02; letter-spacing:-.01em;
  max-width:9.5em;
}
.hero__title em{ font-style:italic; font-weight:400; color:var(--mid); }
.hero__lead{
  margin-top:clamp(24px, 4vh, 38px); max-width:36em; font-weight:400;
  font-size:clamp(.95rem, 2.1vw, 1.08rem); color:var(--text); line-height:1.85;
}
.hero__actions{ display:flex; flex-wrap:wrap; gap:14px; margin-top:clamp(30px, 5vh, 46px); }
@media (max-width:520px){ .hero__actions .btn{ width:100%; } }
.hero__facts{
  display:flex; flex-wrap:wrap; gap:10px 30px;
  margin-top:clamp(34px, 5.5vh, 52px); padding-top:26px; border-top:1px solid var(--line);
}
.hero__facts li{
  font-size:.68rem; font-weight:500; letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted); display:flex; align-items:center; gap:9px;
}
.hero__facts li::before{ content:""; width:4px; height:4px; background:var(--soft); border-radius:50%; }

/* ---------- a abordagem ---------- */
.abordagem{ background:var(--navy); color:var(--ice); position:relative; overflow:hidden; }
.abordagem::after{
  content:""; position:absolute; left:-120px; bottom:-160px; width:440px; height:440px;
  background:url("../assets/img/monogram-white.png?v=1") center/contain no-repeat;
  opacity:.05; pointer-events:none;
}
.abordagem__grid{
  display:grid; grid-template-columns:1fr; gap:clamp(36px, 6vw, 72px); position:relative; z-index:1;
}
@media (min-width:960px){ .abordagem__grid{ grid-template-columns:.9fr 1.1fr; align-items:start; } }
.abordagem__title{
  font-family:var(--serif); font-weight:500; color:#fff;
  font-size:clamp(2.1rem, 5.4vw, 3.6rem); line-height:1.08; margin-top:20px;
}
.abordagem__title em{ font-style:italic; color:var(--soft); }
.abordagem__text p{
  font-weight:300; font-size:clamp(.95rem, 2vw, 1.04rem); line-height:1.95;
  color:rgba(242,242,242,.85); max-width:36em;
}
.abordagem__text p + p{ margin-top:1.2em; }
.abordagem__text strong{ font-weight:500; color:#fff; }
.abordagem__quote{
  margin-top:2em; padding-left:22px; border-left:1px solid var(--soft);
  font-family:var(--serif); font-style:italic; font-weight:400;
  font-size:clamp(1.15rem, 2.6vw, 1.5rem); line-height:1.5; color:#fff;
  max-width:26em;
}

/* ---------- honestidade ---------- */
.honesto{ background:var(--paper); }
.honesto__wrap{ max-width:820px; margin:0 auto; text-align:center; }
.honesto__title{
  font-family:var(--serif); font-weight:500; color:var(--navy);
  font-size:clamp(1.9rem, 5vw, 3.2rem); line-height:1.12; margin-top:22px;
}
.honesto__text{
  margin-top:22px; font-weight:400; font-size:clamp(.95rem, 2vw, 1.05rem);
  line-height:1.95; color:var(--text);
}
.honesto__text strong{ font-weight:600; color:var(--navy); }
.honesto__sig{
  margin-top:30px; font-size:.62rem; font-weight:500; letter-spacing:.34em;
  text-transform:uppercase; color:var(--muted);
}

/* ---------- demandas / para quem ---------- */
.atendimento{ background:var(--card); border-block:1px solid var(--line); }
.atendimento__grid{ display:grid; grid-template-columns:1fr; gap:clamp(40px, 6vw, 80px); }
@media (min-width:960px){ .atendimento__grid{ grid-template-columns:1fr 1fr; align-items:start; } }
.atendimento h2{
  font-family:var(--serif); font-weight:500; color:var(--navy);
  font-size:clamp(1.9rem, 4.6vw, 2.9rem); line-height:1.1; margin-top:18px; margin-bottom:22px;
}
.atendimento p{ font-weight:400; font-size:.96rem; max-width:34em; }
.demandas{ margin-top:26px; display:grid; grid-template-columns:1fr 1fr; gap:0 26px; }
@media (max-width:480px){ .demandas{ grid-template-columns:1fr; } }
.demandas li{
  padding:12px 2px; border-bottom:1px solid var(--line);
  font-size:.9rem; font-weight:500; color:var(--navy);
  display:flex; align-items:baseline; gap:12px;
}
.demandas li span{
  font-size:.6rem; color:var(--soft); font-weight:500; letter-spacing:.1em;
}
.quem__card{
  background:var(--paper); border:1px solid var(--line);
  padding:clamp(22px, 3.6vw, 32px); margin-top:26px;
}
.quem__card + .quem__card{ margin-top:14px; }
.quem__card h3{
  font-size:.68rem; font-weight:600; letter-spacing:.3em; text-transform:uppercase;
  color:var(--mid); margin-bottom:10px;
}
.quem__card p{ font-size:.92rem; font-weight:400; }
.quem__nota{
  margin-top:18px; font-size:.8rem; font-weight:400; color:var(--muted); line-height:1.8;
  padding-left:16px; border-left:2px solid var(--line);
}

/* ---------- como funciona ---------- */
.processo{ background:var(--paper); }
.processo__head{ max-width:660px; margin-bottom:clamp(38px, 6vw, 64px); }
.processo__head h2{
  font-family:var(--serif); font-weight:500; color:var(--navy);
  font-size:clamp(2rem, 5vw, 3.2rem); line-height:1.1; margin-top:18px;
}
.processo__head p{ margin-top:16px; font-weight:400; color:var(--muted); font-size:.98rem; }
.passos{ display:grid; grid-template-columns:1fr; gap:14px; counter-reset:passo; }
@media (min-width:860px){ .passos{ grid-template-columns:1fr 1fr; } }
.passo{
  background:var(--card); border:1px solid var(--line);
  padding:clamp(24px, 4vw, 36px);
  transition:transform .25s ease, box-shadow .25s ease;
}
.passo:hover{ transform:translateY(-3px); box-shadow:0 16px 40px rgba(41,58,87,.09); }
.passo__num{
  font-family:var(--serif); font-size:2rem; font-weight:400; color:var(--soft);
  line-height:1; display:block; margin-bottom:14px;
}
.passo h3{
  font-family:var(--serif); font-weight:600; font-size:clamp(1.25rem, 2.8vw, 1.55rem);
  color:var(--navy); margin-bottom:10px; line-height:1.25;
}
.passo p{ font-weight:400; font-size:.92rem; }
.combinados{
  margin-top:clamp(34px, 5vw, 52px);
  background:var(--navy); color:var(--ice);
  padding:clamp(26px, 4.4vw, 44px);
  display:grid; grid-template-columns:1fr; gap:18px 40px;
}
@media (min-width:860px){ .combinados{ grid-template-columns:repeat(4, 1fr); } }
.combinado h4{
  font-size:.6rem; font-weight:600; letter-spacing:.3em; text-transform:uppercase;
  color:var(--soft); margin-bottom:8px;
}
.combinado p{ font-size:.9rem; font-weight:400; color:rgba(242,242,242,.92); line-height:1.7; }

/* ---------- sobre ---------- */
.sobre{ background:var(--card); border-block:1px solid var(--line); }
.sobre__grid{ display:grid; grid-template-columns:1fr; gap:clamp(38px, 6vw, 76px); }
@media (min-width:960px){ .sobre__grid{ grid-template-columns:.85fr 1.15fr; align-items:start; } }
.sobre__photo{ position:relative; max-width:440px; }
.sobre__photo img{
  width:100%; aspect-ratio:4/5; object-fit:cover;
  box-shadow:20px 20px 0 -1px var(--ice), 20px 20px 0 0 var(--line);
}
.sobre__photo.is-missing img{ display:none; }
.sobre__photo.is-missing::before{
  content:""; display:block; aspect-ratio:4/5;
  border:1px solid var(--line); background:var(--paper);
}
.sobre__photo.is-missing::after{
  content:""; position:absolute; inset:0; margin:auto; width:120px; height:118px;
  background:url("../assets/img/monogram-navy.png?v=1") center/contain no-repeat; opacity:.16;
}
.sobre__photo figcaption{
  margin-top:16px; font-size:.58rem; font-weight:500; letter-spacing:.3em;
  text-transform:uppercase; color:var(--muted);
}
.sobre__content h2{
  font-family:var(--serif); font-weight:500; color:var(--navy);
  font-size:clamp(2.2rem, 5.4vw, 3.4rem); line-height:1.06; margin-top:18px;
}
.sobre__content > p{
  margin-top:20px; font-weight:400; font-size:.98rem; line-height:1.9; max-width:38em;
}
.cred{ width:100%; border-collapse:collapse; margin-top:30px; }
.cred tr{ border-top:1px solid var(--line); }
.cred tr:last-child{ border-bottom:1px solid var(--line); }
.cred th{
  text-align:left; font-weight:600; font-size:.58rem; letter-spacing:.26em;
  text-transform:uppercase; color:var(--mid);
  padding:16px 18px 16px 0; white-space:nowrap; vertical-align:top; width:1%;
}
.cred td{ padding:15px 0; font-size:.92rem; font-weight:400; color:var(--text); }
.sobre__content .btn{ margin-top:32px; }

/* ---------- contato ---------- */
.contato{ background:var(--navy); color:var(--ice); position:relative; overflow:hidden; }
.contato::before{
  content:""; position:absolute; right:-100px; top:-120px; width:380px; height:380px;
  background:url("../assets/img/monogram-white.png?v=1") center/contain no-repeat;
  opacity:.05; pointer-events:none;
}
.contato__wrap{ position:relative; z-index:1; max-width:760px; }
.contato__title{
  font-family:var(--serif); font-weight:500; color:#fff;
  font-size:clamp(2.4rem, 6.4vw, 4.4rem); line-height:1.05; margin-top:22px;
}
.contato__title em{ font-style:italic; color:var(--soft); }
.contato__sub{
  margin-top:18px; font-weight:300; font-size:clamp(.95rem, 2vw, 1.05rem);
  color:rgba(242,242,242,.8); max-width:34em; line-height:1.9;
}
.contato__actions{ display:flex; flex-wrap:wrap; gap:14px; margin-top:36px; }
@media (max-width:520px){ .contato__actions .btn{ width:100%; } }
.contato__info{
  margin-top:clamp(40px, 6vw, 60px); padding-top:30px; border-top:1px solid var(--line-dark);
  display:grid; grid-template-columns:1fr; gap:22px 40px;
}
@media (min-width:760px){ .contato__info{ grid-template-columns:repeat(3, auto); } }
.cinfo h4{
  font-size:.58rem; font-weight:600; letter-spacing:.32em; text-transform:uppercase;
  color:var(--soft); margin-bottom:8px;
}
.cinfo p, .cinfo a{ font-size:.88rem; font-weight:400; color:rgba(242,242,242,.9); line-height:1.7; }
.cinfo a:hover{ color:#fff; text-decoration:underline; }

/* ---------- footer ---------- */
.footer{ background:var(--navy-deep); color:var(--ice); padding:38px 0 30px; }
.footer__top{
  display:flex; flex-wrap:wrap; gap:18px 30px; align-items:center; justify-content:space-between;
  padding-bottom:24px; border-bottom:1px solid var(--line-dark);
}
.footer .brand__name{ color:#fff; }
.footer .brand__role{ color:var(--soft); }
.footer__compliance{
  margin-top:22px; font-size:.72rem; font-weight:300; color:rgba(242,242,242,.55);
  line-height:1.8; max-width:72em;
}
.footer__base{
  margin-top:16px; display:flex; flex-wrap:wrap; gap:8px 24px;
  justify-content:space-between; align-items:baseline;
}
.footer__copy, .footer__credit{
  font-size:.6rem; font-weight:500; letter-spacing:.22em; text-transform:uppercase;
  color:rgba(242,242,242,.4);
}
.footer__credit strong{ font-weight:600; color:var(--soft); }

/* ---------- whatsapp flutuante ---------- */
.wa-float{
  position:fixed; right:18px; bottom:18px; z-index:55;
  width:56px; height:56px; border-radius:50%;
  background:var(--wa); color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 28px rgba(31,175,87,.4);
  transition:transform .3s ease;
}
.wa-float:hover{ transform:scale(1.08); }

/* ---------- barra de progresso ---------- */
.progress{ position:fixed; top:0; left:0; right:0; height:2px; z-index:60; }
.progress span{ display:block; height:100%; width:0; background:var(--soft); }

/* ---------- reveals (só com html.js) ---------- */
html.js .reveal{
  opacity:0; transform:translateY(24px);
  transition:opacity .8s cubic-bezier(.22,.7,.3,1), transform .8s cubic-bezier(.22,.7,.3,1);
}
html.js .reveal.is-in{ opacity:1; transform:none; }
html.js .hero__label, html.js .hero__title, html.js .hero__lead,
html.js .hero__actions, html.js .hero__facts{
  opacity:0; transform:translateY(20px);
  transition:opacity .9s ease, transform .9s ease;
}
html.js body.is-loaded .hero__label{ opacity:1; transform:none; transition-delay:.1s; }
html.js body.is-loaded .hero__title{ opacity:1; transform:none; transition-delay:.25s; }
html.js body.is-loaded .hero__lead{ opacity:1; transform:none; transition-delay:.45s; }
html.js body.is-loaded .hero__actions{ opacity:1; transform:none; transition-delay:.6s; }
html.js body.is-loaded .hero__facts{ opacity:1; transform:none; transition-delay:.75s; }
@media (prefers-reduced-motion: no-preference){
  html.js .reveal{ animation:forceIn 0s 2.5s forwards; }
}
@keyframes forceIn{ to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce){
  html.js .reveal, html.js .hero__label, html.js .hero__title, html.js .hero__lead,
  html.js .hero__actions, html.js .hero__facts{
    opacity:1 !important; transform:none !important; transition:none !important;
  }
  html{ scroll-behavior:auto; }
}

/* ---------- fotos nos cards de atendimento (v2) ---------- */
.quem__foto{
  width:calc(100% + 2*clamp(22px, 3.6vw, 32px)); max-width:none;
  margin:calc(-1*clamp(22px, 3.6vw, 32px)) calc(-1*clamp(22px, 3.6vw, 32px)) 18px;
  aspect-ratio:16/10; object-fit:cover;
}

/* ---------- correções mobile (v2): topo sobrepondo e etiqueta fora de esquadro ---------- */
@media (max-width:600px){
  .header__inner{ gap:10px; padding-block:12px; }
  .brand{ gap:9px; min-width:0; }
  .brand img{ width:28px; }
  .brand__name{ font-size:.68rem; letter-spacing:.14em; }
  .brand__role{ font-size:.42rem; letter-spacing:.3em; }
  .header .btn{ min-height:42px; padding:10px 13px; font-size:.7rem; flex:0 0 auto; }
  .hero__label{ font-size:.54rem; letter-spacing:.18em; line-height:2.2; }
  .hero__label::before{ display:none; }
  .sobre__photo img{
    width:calc(100% - 14px);
    box-shadow:14px 14px 0 -1px var(--ice), 14px 14px 0 0 var(--line);
  }
  .sobre__photo figcaption{
    margin-top:24px; font-size:.62rem; letter-spacing:.22em; line-height:1.9;
  }
}
