/* ============================================================
   Sobre mim — estilos exclusivos desta página
   Linguagem visual editorial/clean, inspirada na referência
   enviada pelo usuário (headline grande + foto limpa à direita).
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,600;1,9..144,500&display=swap');

/* ---------- hero editorial ---------- */
.sobre-hero{ padding:24px 0 72px; }
.sobre-hero .breadcrumbs{ margin-bottom:1.6rem; }
.sobre-hero-grid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:4rem;
  align-items:start;
}
.sobre-hero-copy{ padding-top:1.4rem; }
.sobre-hero-title{
  font-size:clamp(2.1rem, 1.5rem + 2.6vw, 3.6rem);
  line-height:1.04;
  letter-spacing:-.03em;
  margin:.45em 0 1.6rem;
}

/* faixa de "credenciais" — ecoa a fileira de avatares da referência */
.sobre-credentials{ display:flex; align-items:center; gap:1rem; flex-wrap:wrap; margin-bottom:2.4rem; }
.sobre-avatar-row{ display:flex; flex:none; }
.sobre-avatar-dot{
  width:36px; height:36px; border-radius:50%; flex:none;
  display:flex; align-items:center; justify-content:center;
  background:var(--terracotta); color:var(--cream);
  border:2.5px solid var(--paper);
  margin-left:-11px;
}
.sobre-avatar-dot:first-child{ margin-left:0; }
.sobre-avatar-dot:nth-child(2){ background:var(--ink); }
.sobre-avatar-dot:nth-child(3){ background:var(--sand-deep); }
.sobre-avatar-dot svg{ width:15px; height:15px; }
.sobre-credentials-text{ font-size:.84rem; color:var(--ink-soft); margin:0; max-width:16em; line-height:1.4; }

.sobre-hero-quote{ max-width:30em; margin-bottom:1.7rem; }
.sobre-hero-quote p{
  font-family:var(--f-body); font-style:italic; font-weight:400;
  font-size:.98rem; color:var(--ink-soft); line-height:1.6; margin-bottom:1.2em;
}
.sobre-readmore{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  min-height:44px;
  font-family:var(--f-display); font-weight:600; font-size:.8rem;
  color:var(--ink); background:var(--paper);
  border:1.5px solid var(--ink); border-radius:999px;
  padding:.68em 1.4em;
  transition:background .18s var(--ease), color .18s var(--ease), transform .18s var(--ease);
}
.sobre-readmore:hover{ background:var(--ink); color:var(--cream); transform:translateY(-2px); }
.sobre-readmore .arrow{ display:inline-block; transition:transform .18s var(--ease); }
.sobre-readmore:hover .arrow{ transform:translateX(3px); }

.sobre-hero-photo-col{ width:100%; }
.sobre-hero-photo{
  position:relative; width:100%;
  border-radius:16px; overflow:hidden;
  aspect-ratio:4/5;
  background:var(--ink);
  box-shadow:8px 8px 0 var(--terracotta);
}
.sobre-hero-photo img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  filter:saturate(1.08) contrast(1.05);
}
.sobre-hero-caption{
  position:absolute; left:0; right:0; bottom:0; z-index:1;
  padding:1.4rem 1.2rem 1.1rem;
  background:linear-gradient(0deg, rgba(11,0,0,.92) 0%, rgba(11,0,0,.55) 55%, transparent 100%);
}
.sobre-hero-caption strong{ display:block; font-family:var(--f-display); font-weight:700; font-size:1rem; color:#fff; }
.sobre-hero-caption span{ display:block; font-size:.78rem; letter-spacing:.03em; color:var(--sand); margin-top:.25em; }

@media (max-width:900px){
  .sobre-hero{ padding-bottom:48px; }
  .sobre-hero-grid{ grid-template-columns:1fr; gap:2.4rem; }
  .sobre-hero-photo-col{ max-width:420px; margin:0 auto; }
  .sobre-hero-title{ font-size:clamp(1.9rem, 1.5rem + 3vw, 2.6rem); }
}

/* ---------- badges de ícone — versão circular e discreta em toda a página ---------- */
.abordagem-bg .icon-badge,
.fora-consultorio-bg .icon-badge,
.sobre-espaco .icon-badge{
  clip-path:none; border-radius:50%;
}

/* ---------- "minha abordagem" — hierarquia coerente com o hero, elementos mais leves ---------- */
.abordagem-bg h2{
  font-size:clamp(1.9rem, 1.5rem + 1.6vw, 2.6rem);
  letter-spacing:-.03em;
}
.abordagem-bg .sobre-pill{
  display:inline-flex; align-items:center; gap:.8em;
  padding:.8em 1.3em; border-radius:999px; margin-top:1.5em;
  background:var(--cream); border:1.5px solid var(--ink);
}
.abordagem-bg .sobre-pill svg{ width:20px; height:20px; color:var(--terracotta); flex:none; }
.abordagem-bg .sobre-pill span{ font-size:.88rem; color:var(--ink); font-weight:600; font-family:var(--f-display); }
.abordagem-bg ul{ list-style:none; padding:0; margin-top:1.6em; display:flex; flex-direction:column; gap:.5em; }
.abordagem-bg ul li{
  color:var(--ink-soft); font-size:.92rem; padding-left:1.3em; position:relative;
}
.abordagem-bg ul li::before{
  content:""; position:absolute; left:0; top:.55em; width:6px; height:6px; border-radius:50%; background:var(--terracotta);
}

/* ---------- "fora do consultório" — headline no mesmo peso do hero ---------- */
.fora-consultorio-bg h2{ letter-spacing:-.03em; }

/* ---------- "o espaço de escuta" — texto alinhado ao container, foto em bleed total ---------- */
.sobre-espaco{ overflow:hidden; }
.sobre-espaco-grid{ display:grid; grid-template-columns:1fr 1fr; align-items:stretch; min-height:600px; }
.sobre-espaco-text{
  display:flex; flex-direction:column; justify-content:center;
  padding:4rem clamp(24px, 4vw, 64px) 4rem max(24px, calc((100vw - 1180px) / 2 + 24px));
}
.sobre-espaco-photo-bg{
  background-image:url('../img/foto-consultorio-sartre.jpg');
  background-size:100% 100%; background-position:center;
  filter:saturate(1.05) contrast(1.03);
}
@media (max-width:900px){
  .sobre-espaco-grid{ grid-template-columns:1fr; }
  .sobre-espaco-photo-bg{ min-height:320px; order:-1; }
  .sobre-espaco-text{ padding:3rem 24px; }
}
.sobre-quote{ max-width:30em; padding-top:1.6rem; margin-top:1.6rem; border-top:1.5px solid var(--sand-deep); }
.sobre-quote p{
  font-family:var(--f-body); font-style:italic; font-weight:400;
  font-size:1.02rem; color:var(--ink-soft); line-height:1.6; margin:0;
}
@media (max-width:900px){
  .sobre-photo-card{ max-width:420px; margin:0 auto; }
}

/* ---------- "leituras" — referências filosóficas, seção editorial escura ---------- */
.sobre-leituras{
  position:relative; overflow:hidden;
  padding:104px 0 112px;
  background-color:#1c130c;
  background-image:linear-gradient(180deg, rgba(11,4,0,.88) 0%, rgba(11,4,0,.93) 100%), url('../img/foto-estante-livros-cafe.jpg');
  background-size:cover; background-position:center 30%; background-repeat:no-repeat;
}
.sobre-leituras-icon{
  position:absolute; z-index:0; pointer-events:none;
  right:-30px; top:56px; width:280px; height:210px;
  color:var(--sand); opacity:.09;
}
.sobre-leituras-inner{ position:relative; z-index:1; max-width:860px; margin:0 auto; }
.sobre-leituras-head{ max-width:620px; margin-bottom:3.4rem; }
.sobre-leituras .eyebrow{ color:var(--sand); }
.sobre-leituras-head h2{
  font-family:'Fraunces', serif; font-weight:600; font-style:normal;
  font-size:clamp(1.6rem, 1.25rem + 1.7vw, 2.5rem);
  line-height:1.22; letter-spacing:-.01em; color:#FBF7F0; margin:.45em 0 .65em;
}
.sobre-leituras-lede{
  font-family:'Fraunces', serif; font-style:italic; font-weight:400;
  font-size:1.12rem; line-height:1.65; color:rgba(251,247,240,.76); max-width:36em;
}
.sobre-leituras-list{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:1fr 1fr; gap:0 3.2rem;
}
.sobre-leituras-list li{
  padding:1.35rem 0; border-top:1px solid rgba(199,183,167,.24);
  display:flex; flex-direction:column; gap:.4em;
}
.sobre-leituras-list strong{
  font-family:'Fraunces', serif; font-weight:600; font-style:italic; font-size:1.3rem; color:var(--sand);
  letter-spacing:.01em;
}
.sobre-leituras-list span{
  font-family:var(--f-body); font-size:.92rem; line-height:1.5; color:rgba(251,247,240,.66);
}
@media (max-width:700px){
  .sobre-leituras{ padding:72px 0 80px; }
  .sobre-leituras-icon{ width:170px; height:128px; right:-25px; top:24px; }
  .sobre-leituras-list{ grid-template-columns:1fr; }
}

/* ---------- citação de encerramento — ilustração como peça própria + citação espaçosa ---------- */
.sobre-closing{
  position:relative; overflow:hidden;
  padding:96px 0 104px;
  background-color:var(--paper-deep);
  background-image:
    radial-gradient(ellipse at center, rgba(238,226,208,.97) 0%, rgba(238,226,208,.92) 42%, rgba(238,226,208,.6) 70%, rgba(238,226,208,.28) 100%),
    url('../img/foto-ipe-por-do-sol.jpg');
  background-size:cover; background-position:center;
  text-align:center;
}
.sobre-closing-art{
  max-width:480px; margin:0 auto 2.8rem;
}
.sobre-closing-art img{
  width:100%; height:auto; display:block;
}
.sobre-closing-inner{
  position:relative; max-width:640px; margin:0 auto;
}
.sobre-closing-inner .quote-mark-bg{
  position:absolute; top:-3.4rem; left:50%; transform:translateX(-50%);
  z-index:0; pointer-events:none;
  width:96px; height:72px; fill:var(--terracotta); opacity:.2;
}
.sobre-closing-inner p{
  position:relative; z-index:1;
  font-family:var(--f-display); font-weight:700; font-style:normal;
  font-size:clamp(1.3rem, 1rem + 1.4vw, 1.85rem);
  line-height:1.42; letter-spacing:-.02em; color:var(--ink); margin:0;
}
@media (max-width:640px){
  .sobre-closing{ padding:72px 0 80px; }
  .sobre-closing-art{ max-width:320px; margin-bottom:2.6rem; }
}
