/* ============================================================
   DAIANE RODRIGUES
   DESIGN SYSTEM
============================================================ */

:root {

  --cream:
    #f8f4ee;

  --cream-light:
    #fcfaf7;

  --cream-dark:
    #eee4d8;

  --rose:
    #bd6f67;

  --rose-dark:
    #9e574f;

  --rose-light:
    #ead0cb;

  --rose-soft:
    #f4e3df;

  --olive:
    #74785c;

  --olive-light:
    #a8aa8c;

  --brown:
    #59483f;

  --brown-light:
    #8b776b;

  --text:
    #302f2b;

  --text-soft:
    #68625d;

  --white:
    #ffffff;

  --border:
    rgba(89, 72, 63, 0.12);

  --shadow:
    0 20px 60px rgba(75, 55, 45, 0.08);

  --shadow-card:
    0 14px 40px rgba(75, 55, 45, 0.07);

  --font-title:
    'Playfair Display',
    Georgia,
    serif;

  --font-body:
    'DM Sans',
    Arial,
    sans-serif;

  --container:
    1240px;

  --header-height:
    84px;

}


/* ============================================================
   RESET
============================================================ */

*,
*::before,
*::after {

  box-sizing:
    border-box;

}


html {

  scroll-behavior:
    smooth;

  scroll-padding-top:
    100px;

}


body {

  margin:
    0;

  min-width:
    320px;

  font-family:
    var(--font-body);

  font-size:
    16px;

  line-height:
    1.65;

  color:
    var(--text);

  background:
    var(--cream-light);

  overflow-x:
    hidden;

}


body,
button,
input,
textarea {

  font-family:
    var(--font-body);

}


img {

  max-width:
    100%;

  display:
    block;

}


a {

  color:
    inherit;

  text-decoration:
    none;

}


button {

  border:
    0;

}


::selection {

  background:
    var(--rose-light);

  color:
    var(--brown);

}


/* ============================================================
   CONTAINERS
============================================================ */

.container {

  width:
    min(
      calc(100% - 48px),
      var(--container)
    );

  margin:
    0 auto;

}


.container-small {

  width:
    min(
      calc(100% - 48px),
      900px
    );

  margin:
    0 auto;

}


.section {

  position:
    relative;

  padding:
    110px 0;

}


/* ============================================================
   HEADER
============================================================ */

.site-header {

  position:
    fixed;

  top:
    0;

  left:
    0;

  right:
    0;

  z-index:
    1000;

  height:
    var(--header-height);

  transition:
    background .35s ease,
    box-shadow .35s ease,
    height .35s ease;

}


.site-header.scrolled {

  height:
    72px;

  background:
    rgba(252, 250, 247, .92);

  backdrop-filter:
    blur(18px);

  -webkit-backdrop-filter:
    blur(18px);

  box-shadow:
    0 8px 35px
    rgba(70, 55, 45, .07);

}


.header-container {

  width:
    min(
      calc(100% - 48px),
      1360px
    );

  height:
    100%;

  margin:
    0 auto;

  display:
    flex;

  align-items:
    center;

  gap:
    32px;

}


/* ============================================================
   MARCA
============================================================ */

.brand {

  display:
    flex;

  align-items:
    center;

  gap:
    12px;

  margin-right:
    auto;

  flex-shrink:
    0;

}


.brand-symbol {

  width:
    44px;

  height:
    52px;

}


.brand-symbol svg {

  width:
    100%;

  height:
    100%;

  fill:
    none;

  stroke:
    var(--rose);

  stroke-width:
    1.6;

}


.brand-text {

  display:
    flex;

  flex-direction:
    column;

  line-height:
    1;

}


.brand-text strong {

  font-family:
    var(--font-title);

  font-size:
    22px;

  font-weight:
    500;

  color:
    var(--brown);

}


.brand-text span {

  margin-top:
    7px;

  font-size:
    9px;

  font-weight:
    600;

  letter-spacing:
    5px;

  color:
    var(--brown-light);

}


/* ============================================================
   NAV
============================================================ */

.desktop-nav {

  display:
    flex;

  align-items:
    center;

  gap:
    25px;

}


.desktop-nav a {

  position:
    relative;

  font-size:
    13px;

  font-weight:
    500;

  white-space:
    nowrap;

  color:
    var(--text);

  transition:
    color .25s ease;

}


.desktop-nav a::after {

  content:
    '';

  position:
    absolute;

  left:
    0;

  right:
    100%;

  bottom:
    -7px;

  height:
    1px;

  background:
    var(--rose);

  transition:
    right .25s ease;

}


.desktop-nav a:hover {

  color:
    var(--rose-dark);

}


.desktop-nav a:hover::after {

  right:
    0;

}


/* ============================================================
   BOTÕES
============================================================ */

.button {

  min-height:
    50px;

  padding:
    0 25px;

  border-radius:
    999px;

  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    12px;

  font-size:
    14px;

  font-weight:
    500;

  cursor:
    pointer;

  transition:
    transform .25s ease,
    box-shadow .25s ease,
    background .25s ease,
    color .25s ease;

}


.button:hover {

  transform:
    translateY(-2px);

}


.button-primary {

  color:
    white;

  background:
    linear-gradient(
      135deg,
      var(--rose),
      var(--rose-dark)
    );

  box-shadow:
    0 10px 28px
    rgba(189, 111, 103, .25);

}


.button-primary:hover {

  box-shadow:
    0 15px 35px
    rgba(189, 111, 103, .34);

}


.button-outline {

  border:
    1px solid
    rgba(189, 111, 103, .55);

  color:
    var(--rose-dark);

  background:
    rgba(255,255,255,.25);

}


.button-light {

  background:
    var(--cream-light);

  color:
    var(--rose-dark);

}


.button-arrow {

  font-size:
    19px;

  transition:
    transform .25s ease;

}


.button:hover
.button-arrow {

  transform:
    translateX(4px);

}


.header-cta {

  min-height:
    44px;

  padding:
    0 20px;

  font-size:
    12px;

}


/* ============================================================
   MOBILE MENU
============================================================ */

.mobile-menu-button {

  display:
    none;

  width:
    44px;

  height:
    44px;

  padding:
    10px;

  background:
    transparent;

  cursor:
    pointer;

}


.mobile-menu-button span {

  display:
    block;

  height:
    1px;

  margin:
    6px 0;

  background:
    var(--brown);

  transition:
    .3s ease;

}


.mobile-nav {

  display:
    none;

}


/* ============================================================
   HERO
============================================================ */

.hero {

  position:
    relative;

  min-height:
    720px;

  padding-top:
    var(--header-height);

  display:
    flex;

  align-items:
    stretch;

  overflow:
    hidden;

  background:

    radial-gradient(
      circle at 18% 20%,
      rgba(255,255,255,.9),
      transparent 30%
    ),

    linear-gradient(
      105deg,
      #faf6ef 0%,
      #f6efe5 52%,
      #efe3d6 100%
    );

}


.hero-container {

  width:
    min(
      100%,
      1440px
    );

  margin:
    0 auto;

  display:
    grid;

  grid-template-columns:
    52% 48%;

}


.hero-content {

  position:
    relative;

  z-index:
    5;

  padding:
    95px 50px 70px
    max(
      48px,
      calc(
        (100vw - 1240px) / 2
      )
    );

  display:
    flex;

  flex-direction:
    column;

  justify-content:
    center;

}


.eyebrow,
.section-kicker {

  display:
    block;

  margin-bottom:
    16px;

  font-size:
    11px;

  font-weight:
    600;

  letter-spacing:
    3px;

  color:
    var(--rose-dark);

}


.hero h1 {

  max-width:
    640px;

  margin:
    0;

  font-family:
    var(--font-title);

  font-size:
    clamp(
      48px,
      5vw,
      78px
    );

  line-height:
    .98;

  font-weight:
    500;

  letter-spacing:
    -2.5px;

  color:
    #30332a;

}


.hero h1 span {

  display:
    block;

  margin-top:
    8px;

  color:
    var(--rose);

}


.title-detail {

  width:
    58px;

  height:
    2px;

  margin:
    25px 0;

  background:
    var(--rose);

}


.hero-description {

  max-width:
    560px;

  margin:
    0;

  font-size:
    18px;

  line-height:
    1.55;

  color:
    var(--text-soft);

}


.professional-info {

  margin-top:
    24px;

  display:
    flex;

  flex-direction:
    column;

}


.professional-info strong {

  font-family:
    var(--font-title);

  font-size:
    25px;

  font-weight:
    500;

}


.professional-info span {

  margin-top:
    2px;

  font-size:
    14px;

  color:
    var(--text-soft);

}


.hero-actions {

  margin-top:
    28px;

  display:
    flex;

  gap:
    14px;

  flex-wrap:
    wrap;

}


.hero-features {

  margin-top:
    38px;

  padding-top:
    25px;

  border-top:
    1px solid
    var(--border);

  display:
    flex;

  gap:
    35px;

}


.hero-feature {

  display:
    flex;

  align-items:
    center;

  gap:
    10px;

}


.feature-icon {

  width:
    38px;

  height:
    38px;

  border:
    1px solid
    rgba(158,87,79,.25);

  border-radius:
    50%;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  color:
    var(--rose-dark);

}


.hero-feature span {

  font-size:
    11px;

  line-height:
    1.35;

  color:
    var(--text-soft);

}


/* ============================================================
   HERO PHOTO
============================================================ */

.hero-photo-container {

  position:
    relative;

  min-height:
    635px;

  overflow:
    hidden;

}


.hero-photo {

  position:
    absolute;

  inset:
    0;

}


.hero-photo img {

  position:
    absolute;

  width:
    100%;

  height:
    100%;

  object-fit:
    cover;

  object-position:
    center;

  opacity:
    0;

  transform:
    scale(1.04);

  transition:
    opacity .8s ease,
    transform 1.4s ease;

}


.hero-photo img.loaded {

  opacity:
    1;

  transform:
    scale(1);

}


.photo-placeholder {

  position:
    absolute;

  inset:
    0;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  background:

    radial-gradient(
      circle at 50% 35%,
      #f3ddd5,
      #e4c3b9 70%
    );

  color:
    rgba(89,72,63,.6);

}


.photo-placeholder span {

  padding:
    10px 18px;

  border:
    1px solid
    rgba(89,72,63,.15);

  border-radius:
    30px;

  font-size:
    12px;

}


.hero-photo::after {

  content:
    '';

  position:
    absolute;

  inset:
    0;

  pointer-events:
    none;

  background:
    linear-gradient(
      90deg,
      rgba(248,244,238,.18),
      transparent 25%
    );

}


.photo-message {

  position:
    absolute;

  right:
    28px;

  bottom:
    65px;

  z-index:
    4;

  padding:
    18px;

  font-family:
    var(--font-title);

  font-size:
    18px;

  font-style:
    italic;

  line-height:
    1.35;

  color:
    rgba(89,72,63,.75);

  transform:
    rotate(-5deg);

}


.photo-message span {

  display:
    block;

}


.photo-message small {

  display:
    block;

  margin-top:
    8px;

  text-align:
    center;

  color:
    var(--rose);

}


/* Texto sobre a fotografia principal: contraste reforçado */
.hero-photo-container .photo-message {
  color: #ffffff;
  background: linear-gradient(135deg, rgba(39,35,33,.78), rgba(39,35,33,.52));
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 18px;
  padding: 18px 24px;
  box-shadow: 0 12px 35px rgba(0,0,0,.24);
  text-shadow: 0 2px 8px rgba(0,0,0,.45);
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
  max-width: calc(100% - 36px);
}
.hero-photo-container .photo-message span { color: #ffffff; }
.hero-photo-container .photo-message small { color: #ffe5e0; }
@media (max-width: 520px) {
  .hero-photo-container .photo-message { right: 14px; bottom: 18px; padding: 13px 17px; font-size: 15px; }
}

/* ============================================================
   STATEMENT
============================================================ */

.statement-section {

  padding:
    90px 0;

  text-align:
    center;

  background:
    var(--cream-light);

}


.statement-symbol {

  display:
    block;

  height:
    35px;

  font-family:
    var(--font-title);

  font-size:
    60px;

  line-height:
    1;

  color:
    var(--rose-light);

}


.statement {

  max-width:
    800px;

  margin:
    10px auto 0;

  font-family:
    var(--font-title);

  font-size:
    clamp(
      32px,
      4vw,
      50px
    );

  line-height:
    1.2;

  color:
    var(--brown);

}


/* ============================================================
   HEADINGS
============================================================ */

.section h2,
.center-heading h2 {

  margin:
    0;

  font-family:
    var(--font-title);

  font-size:
    clamp(
      36px,
      4vw,
      52px
    );

  line-height:
    1.12;

  font-weight:
    500;

  letter-spacing:
    -1.5px;

  color:
    #34362f;

}


.center-heading {

  max-width:
    780px;

  margin:
    0 auto 55px;

  text-align:
    center;

}


.center-heading p {

  max-width:
    600px;

  margin:
    18px auto 0;

  color:
    var(--text-soft);

}


/* ============================================================
   PSICOTERAPIA
============================================================ */

.psychotherapy-section {

  background:
    #f3e8df;

}


.two-columns {

  display:
    grid;

  grid-template-columns:
    1fr 1fr;

  gap:
    100px;

  align-items:
    start;

}


.section-heading {

  position:
    sticky;

  top:
    120px;

}


.section-text p {

  margin:
    0 0 25px;

  font-size:
    18px;

  color:
    var(--text-soft);

}


/* ============================================================
   LIFE
============================================================ */

.life-section {

  background:
    var(--cream-light);

}


.life-grid {

  display:
    grid;

  grid-template-columns:
    repeat(4, 1fr);

  gap:
    22px;

}


.life-card {

  position:
    relative;

  min-height:
    280px;

  padding:
    35px 28px;

  border:
    1px solid
    var(--border);

  border-radius:
    26px;

  text-align:
    center;

  background:
    rgba(255,255,255,.68);

  box-shadow:
    var(--shadow-card);

  transition:
    transform .35s ease,
    box-shadow .35s ease;

}


.life-card:hover {

  transform:
    translateY(-8px);

  box-shadow:
    var(--shadow);

}


.life-number {

  position:
    absolute;

  top:
    18px;

  right:
    22px;

  font-family:
    var(--font-title);

  font-size:
    13px;

  color:
    var(--rose);

}


.life-icon {

  width:
    90px;

  height:
    90px;

  margin:
    10px auto 20px;

  border-radius:
    50%;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  font-size:
    42px;

  color:
    var(--olive);

  background:
    var(--rose-soft);

}


.life-card h3 {

  margin:
    0;

  font-family:
    var(--font-title);

  font-size:
    27px;

  font-weight:
    500;

}


.life-card p {

  margin:
    10px 0 0;

  font-size:
    14px;

  line-height:
    1.5;

  color:
    var(--text-soft);

}


/* ============================================================
   PROCESSO
============================================================ */

.process-section {

  overflow:
    hidden;

  background:
    linear-gradient(
      120deg,
      #f5e2dd,
      #fbf7f1
    );

}


.process-intro {

  max-width:
    720px;

  margin-bottom:
    75px;

}


.process-intro p {

  max-width:
    650px;

  margin-top:
    20px;

  color:
    var(--text-soft);

}


.process-wrapper {

  position:
    relative;

  display:
    grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap:
    60px;

}


.process-line {

  position:
    absolute;

  top:
    28px;

  left:
    16.6%;

  right:
    16.6%;

  height:
    1px;

  background:
    rgba(189,111,103,.20);

}


.process-line-progress {

  width:
    0;

  height:
    100%;

  background:
    var(--rose);

}


.process-item {

  position:
    relative;

  z-index:
    2;

  text-align:
    center;

}


.process-number {

  width:
    56px;

  height:
    56px;

  margin:
    0 auto 20px;

  border-radius:
    50%;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  font-family:
    var(--font-title);

  font-size:
    20px;

  color:
    white;

  background:
    var(--rose);

}


.process-icon {

  margin-bottom:
    15px;

  font-size:
    35px;

  color:
    var(--brown-light);

}


.process-item h3 {

  margin:
    0;

  font-family:
    var(--font-title);

  font-size:
    28px;

  font-weight:
    500;

}


.process-item p {

  max-width:
    300px;

  margin:
    12px auto 0;

  color:
    var(--text-soft);

}


/* ============================================================
   EVIDENCE
============================================================ */

.evidence-section {

  background:
    var(--olive);

  color:
    white;

}


.evidence-container {

  display:
    grid;

  grid-template-columns:
    1fr 1fr;

  gap:
    100px;

  align-items:
    center;

}


.evidence-section
.section-kicker {

  color:
    #e7d6ca;

}


.evidence-card h2 {

  color:
    white;

}


.evidence-card p {

  max-width:
    580px;

  color:
    rgba(255,255,255,.78);

}


.evidence-words {

  display:
    flex;

  flex-direction:
    column;

  gap:
    18px;

}


.evidence-words span {

  padding:
    18px 25px;

  border:
    1px solid
    rgba(255,255,255,.15);

  border-radius:
    18px;

  font-family:
    var(--font-title);

  font-size:
    25px;

  background:
    rgba(255,255,255,.05);

}


/* ============================================================
   ABOUT
============================================================ */

.about-section {

  background:
    var(--cream-light);

}


.about-container {

  display:
    grid;

  grid-template-columns:
    .9fr 1.1fr;

  gap:
    90px;

  align-items:
    center;

}


.about-photo-placeholder {

  aspect-ratio:
    4 / 5;

  border-radius:
    45% 45% 25px 25px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  background:
    linear-gradient(
      145deg,
      var(--rose-light),
      var(--cream-dark)
    );

  box-shadow:
    var(--shadow);

}


.about-photo-placeholder span {

  font-family:
    var(--font-title);

  color:
    var(--brown-light);

}


.about-content p {

  max-width:
    600px;

  color:
    var(--text-soft);

}


.about-profession {

  margin:
    12px 0 30px;

  color:
    var(--rose-dark);

}


.qualification {

  margin-top:
    30px;

  padding:
    20px 24px;

  border-left:
    2px solid
    var(--rose);

  display:
    flex;

  flex-direction:
    column;

  background:
    var(--rose-soft);

}


/* ============================================================
   ATENDIMENTO
============================================================ */

.attendance-section {

  background:
    #f4ebe3;

}


.attendance-grid {

  max-width:
    900px;

  margin:
    0 auto;

  display:
    grid;

  grid-template-columns:
    repeat(2, 1fr);

  gap:
    28px;

}


.attendance-card {

  padding:
    42px;

  border-radius:
    28px;

  background:
    rgba(255,255,255,.70);

  box-shadow:
    var(--shadow-card);

}


.attendance-card.featured {

  background:
    var(--rose);

  color:
    white;

}


.attendance-icon {

  font-size:
    32px;

}


.attendance-card h3 {

  margin:
    18px 0 10px;

  font-family:
    var(--font-title);

  font-size:
    32px;

  font-weight:
    500;

}


.attendance-card p {

  color:
    var(--text-soft);

}


.attendance-card.featured p {

  color:
    rgba(255,255,255,.8);

}


.attendance-card a {

  display:
    inline-block;

  margin-top:
    15px;

  font-weight:
    600;

}


.location {

  display:
    block;

  font-size:
    13px;

  opacity:
    .8;

}


/* ============================================================
   FAQ
============================================================ */

.faq-section {

  background:
    var(--cream-light);

}


.faq-container {

  display:
    grid;

  grid-template-columns:
    .8fr 1.2fr;

  gap:
    100px;

}


.faq-heading {

  position:
    sticky;

  top:
    120px;

  align-self:
    start;

}


.faq-heading p {

  color:
    var(--text-soft);

}


.faq-item {

  border-bottom:
    1px solid
    var(--border);

}


.faq-question {

  width:
    100%;

  padding:
    24px 0;

  display:
    flex;

  justify-content:
    space-between;

  align-items:
    center;

  gap:
    20px;

  text-align:
    left;

  font-size:
    17px;

  font-weight:
    500;

  color:
    var(--text);

  background:
    transparent;

  cursor:
    pointer;

}


.faq-question span {

  font-family:
    var(--font-title);

  font-size:
    27px;

  font-weight:
    300;

  color:
    var(--rose);

  transition:
    transform .3s ease;

}


.faq-answer {

  max-height:
    0;

  overflow:
    hidden;

  opacity:
    0;

  transition:
    max-height .4s ease,
    opacity .3s ease;

}


.faq-answer p {

  margin:
    0;

  padding:
    0 50px 25px 0;

  color:
    var(--text-soft);

}


.faq-item.active
.faq-answer {

  max-height:
    250px;

  opacity:
    1;

}


.faq-item.active
.faq-question span {

  transform:
    rotate(45deg);

}


/* ============================================================
   CONTACT
============================================================ */

.contact-section {

  padding:
    90px 24px;

  background:
    var(--cream-light);

}


.contact-container {

  position:
    relative;

  overflow:
    hidden;

  padding:
    80px;

  border-radius:
    38px;

  text-align:
    center;

  color:
    white;

  background:
    linear-gradient(
      135deg,
      var(--rose-dark),
      var(--rose)
    );

  box-shadow:
    var(--shadow);

}


.contact-container
.section-kicker {

  color:
    rgba(255,255,255,.75);

}


.contact-container h2 {

  max-width:
    760px;

  margin:
    0 auto;

  color:
    white;

}


.contact-container p {

  max-width:
    580px;

  margin:
    22px auto 0;

  color:
    rgba(255,255,255,.8);

}


.contact-actions {

  margin-top:
    32px;

  display:
    flex;

  justify-content:
    center;

  align-items:
    center;

  gap:
    25px;

  flex-wrap:
    wrap;

}


.instagram-link {

  border-bottom:
    1px solid
    rgba(255,255,255,.5);

}


/* ============================================================
   FOOTER
============================================================ */

.site-footer {

  padding:
    55px 0 25px;

  background:
    #383c32;

  color:
    rgba(255,255,255,.75);

}


.footer-container {

  display:
    grid;

  grid-template-columns:
    1fr 1fr auto;

  gap:
    40px;

  align-items:
    center;

}


.footer-brand {

  display:
    flex;

  flex-direction:
    column;

}


.footer-brand strong {

  font-family:
    var(--font-title);

  font-size:
    22px;

  color:
    white;

}


.footer-info {

  display:
    flex;

  flex-direction:
    column;

  font-size:
    13px;

}


.footer-social a {

  font-size:
    13px;

}


.footer-bottom {

  width:
    min(
      calc(100% - 48px),
      var(--container)
    );

  margin:
    35px auto 0;

  padding-top:
    20px;

  border-top:
    1px solid
    rgba(255,255,255,.1);

  font-size:
    11px;

  text-align:
    center;

}


/* ============================================================
   REVEAL ANIMATION
============================================================ */

.reveal {

  opacity:
    0;

  transform:
    translateY(28px);

  transition:
    opacity .8s ease,
    transform .8s
    cubic-bezier(.22,1,.36,1);

}


.reveal.visible {

  opacity:
    1;

  transform:
    translateY(0);

}


.reveal-delay-1 {

  transition-delay:
    .10s;

}


.reveal-delay-2 {

  transition-delay:
    .20s;

}


.reveal-delay-3 {

  transition-delay:
    .30s;

}


.reveal-photo {

  opacity:
    0;

  transform:
    scale(1.03);

  transition:
    opacity 1.1s ease,
    transform 1.5s
    cubic-bezier(.22,1,.36,1);

}


.reveal-photo.visible {

  opacity:
    1;

  transform:
    scale(1);

}


/* ============================================================
   MOBILE FLOATING CTA
============================================================ */

.mobile-floating-cta {

  display:
    none;

}


/* ============================================================
   TABLET
============================================================ */

@media
(max-width: 1100px) {

  .desktop-nav {

    display:
      none;

  }


  .header-cta {

    margin-left:
      auto;

  }


  .mobile-menu-button {

    display:
      block;

  }


  .mobile-nav {

    position:
      absolute;

    top:
      100%;

    left:
      20px;

    right:
      20px;

    padding:
      20px;

    border:
      1px solid
      var(--border);

    border-radius:
      20px;

    flex-direction:
      column;

    gap:
      5px;

    background:
      rgba(252,250,247,.98);

    box-shadow:
      var(--shadow);

  }


  .mobile-nav.active {

    display:
      flex;

  }


  .mobile-nav a {

    padding:
      12px 10px;

  }


  .hero-container {

    grid-template-columns:
      55% 45%;

  }


  .hero-content {

    padding-left:
      35px;

  }


  .hero-features {

    gap:
      15px;

  }


  .life-grid {

    grid-template-columns:
      repeat(2, 1fr);

  }

}


/* ============================================================
   MOBILE / TABLET VERTICAL
============================================================ */

@media
(max-width: 820px) {

  :root {

    --header-height:
      72px;

  }


  .container,
  .container-small {

    width:
      min(
        calc(100% - 36px),
        var(--container)
      );

  }


  .section {

    padding:
      78px 0;

  }


  .header-container {

    width:
      calc(100% - 30px);

  }


  .header-cta {

    display:
      none;

  }


  .brand-text strong {

    font-size:
      19px;

  }


  .brand-text span {

    font-size:
      8px;

  }


  /* HERO */

  .hero {

    min-height:
      auto;

  }


  .hero-container {

    display:
      flex;

    flex-direction:
      column;

  }


  .hero-content {

    order:
      2;

    padding:
      45px 22px 55px;

  }


  .hero-photo-container {

    order:
      1;

    min-height:
      520px;

    margin-top:
      var(--header-height);

  }


  .hero h1 {

    font-size:
      clamp(
        45px,
        13vw,
        65px
      );

    letter-spacing:
      -2px;

  }


  .hero-description {

    font-size:
      16px;

  }


  .hero-actions {

    flex-direction:
      column;

  }


  .hero-actions
  .button {

    width:
      100%;

  }


  .hero-features {

    display:
      grid;

    grid-template-columns:
      1fr;

    gap:
      15px;

  }


  .photo-message {

    right:
      18px;

    bottom:
      25px;

    font-size:
      15px;

  }


  /* STATEMENT */

  .statement-section {

    padding:
      70px 0;

  }


  /* COLUNAS */

  .two-columns,
  .evidence-container,
  .about-container,
  .faq-container {

    grid-template-columns:
      1fr;

    gap:
      45px;

  }


  .section-heading,
  .faq-heading {

    position:
      static;

  }


  /* LIFE */

  .life-grid {

    grid-template-columns:
      repeat(2, 1fr);

    gap:
      15px;

  }


  /* PROCESS */

  .process-wrapper {

    grid-template-columns:
      1fr;

    gap:
      55px;

  }


  .process-line {

    display:
      none;

  }


  /* ATTENDANCE */

  .attendance-grid {

    grid-template-columns:
      1fr;

  }


  /* CONTACT */

  .contact-section {

    padding:
      60px 18px;

  }


  .contact-container {

    width:
      100%;

    padding:
      55px 25px;

    border-radius:
      28px;

  }


  /* FOOTER */

  .footer-container {

    grid-template-columns:
      1fr;

    text-align:
      center;

  }


  /* CTA */

  .mobile-floating-cta {

    position:
      fixed;

    left:
      18px;

    right:
      18px;

    bottom:
      max(
        18px,
        env(safe-area-inset-bottom)
      );

    z-index:
      900;

    min-height:
      54px;

    padding:
      0 22px;

    border-radius:
      999px;

    align-items:
      center;

    justify-content:
      space-between;

    color:
      white;

    background:
      var(--rose-dark);

    box-shadow:
      0 15px 40px
      rgba(80,50,45,.28);

    opacity:
      0;

    visibility:
      hidden;

    transform:
      translateY(20px);

    transition:
      .35s ease;

  }


  .mobile-floating-cta.visible {

    display:
      flex;

    opacity:
      1;

    visibility:
      visible;

    transform:
      translateY(0);

  }

}


/* ============================================================
   CELULAR PEQUENO
============================================================ */

@media
(max-width: 520px) {

  body {

    font-size:
      15px;

  }


  .brand-symbol {

    width:
      35px;

    height:
      42px;

  }


  .brand-text strong {

    font-size:
      17px;

  }


  .brand-text span {

    letter-spacing:
      3px;

  }


  .hero-photo-container {

    min-height:
      440px;

  }


  .hero-photo img {

    object-position:
      58% center;

  }


  .hero h1 {

    font-size:
      45px;

  }


  .professional-info strong {

    font-size:
      23px;

  }


  .life-grid {

    grid-template-columns:
      1fr;

  }


  .life-card {

    min-height:
      auto;

  }


  .center-heading {

    margin-bottom:
      40px;

  }


  .section h2,
  .center-heading h2 {

    font-size:
      36px;

  }


  .statement {

    font-size:
      34px;

  }


  .evidence-words span {

    font-size:
      21px;

  }


  .attendance-card {

    padding:
      32px 25px;

  }

}


/* ============================================================
   ACESSIBILIDADE — REDUZIR ANIMAÇÕES
============================================================ */

@media
(prefers-reduced-motion: reduce) {

  html {

    scroll-behavior:
      auto;

  }


  *,
  *::before,
  *::after {

    animation-duration:
      .01ms !important;

    animation-iteration-count:
      1 !important;

    transition-duration:
      .01ms !important;

  }


  .reveal,
  .reveal-photo {

    opacity:
      1;

    transform:
      none;

  }

}


/* FOTOGRAFIAS PROFISSIONAIS — NOVEMBRO 2026 */
.about-photo-frame { position:relative; overflow:hidden; min-height:390px; }
.about-photo-frame img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; object-position:center 25%; }
.about-photo-frame .photo-fallback { display:none; }
.about-photo-frame.photo-unavailable .photo-fallback { display:block; }
.gallery-section { background:var(--cream); }
.professional-gallery { display:grid; grid-template-columns:1.2fr 1fr; grid-template-rows:repeat(2,minmax(230px,300px)); gap:22px; }
.gallery-item { position:relative; margin:0; overflow:hidden; border-radius:28px; background:linear-gradient(140deg,var(--rose-light),var(--cream-dark)); box-shadow:var(--shadow-card); }
.gallery-item-large { grid-row:span 2; }
.gallery-item img { width:100%; height:100%; object-fit:cover; object-position:center; transition:transform .6s ease; }
.gallery-item:hover img { transform:scale(1.035); }
.gallery-item.photo-unavailable img { display:none; }
@media(max-width:820px) { .professional-gallery { grid-template-columns:1fr 1fr; grid-template-rows:320px 210px; gap:14px; } .gallery-item-large { grid-column:span 2; grid-row:span 1; } .gallery-item { border-radius:20px; } }
@media(max-width:520px) { .professional-gallery { grid-template-rows:280px 170px; gap:10px; } .gallery-item { border-radius:16px; } .about-photo-frame { min-height:360px; } }


/* MODAL DE AGENDAMENTO — ETAPA 2 */
.schedule-lock{overflow:hidden}
.schedule-overlay{position:fixed;inset:0;z-index:3000;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(35,34,30,.65);backdrop-filter:blur(8px);opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
.schedule-overlay.is-open{opacity:1;visibility:visible}
.schedule-dialog{position:relative;width:min(100%,530px);max-height:min(92dvh,850px);overflow-y:auto;padding:42px;border-radius:30px;background:var(--cream-light);box-shadow:0 30px 100px rgba(20,20,20,.25);transform:translateY(20px) scale(.98);transition:transform .3s}
.is-open .schedule-dialog{transform:translateY(0) scale(1)}
.schedule-close{position:absolute;top:16px;right:18px;width:38px;height:38px;border-radius:50%;background:var(--rose-soft);color:var(--brown);font-size:27px;cursor:pointer}
.schedule-decoration{font-size:32px;color:var(--rose);margin-bottom:6px}
.schedule-kicker{font-size:10px;letter-spacing:2px;font-weight:700;color:var(--rose-dark)}
.schedule-dialog h2{font-family:var(--font-title);font-size:clamp(28px,4vw,39px);font-weight:500;line-height:1.14;margin:14px 0;color:var(--brown)}
.schedule-dialog>p{color:var(--text-soft);font-size:14px;margin-bottom:20px}
.schedule-form{display:flex;flex-direction:column;gap:9px}
.schedule-form label{font-size:13px;font-weight:600;color:var(--brown);margin-top:7px}
.schedule-form input{width:100%;min-height:50px;padding:12px 16px;border:1px solid rgba(89,72,63,.2);border-radius:13px;background:white;color:var(--text);font-size:16px;outline:none;transition:border-color .2s,box-shadow .2s}
.schedule-form input:focus{border-color:var(--rose);box-shadow:0 0 0 3px rgba(189,111,103,.12)}
.schedule-privacy{font-size:11px;line-height:1.5;color:var(--text-soft);margin:8px 0}
.schedule-error{font-size:13px;color:#a33232;margin:0}
.schedule-submit{width:100%;justify-content:space-between;margin-top:5px}
.schedule-social{display:flex;flex-direction:column;gap:5px;text-align:center;border-top:1px solid var(--border);padding-top:18px;margin-top:22px;font-size:12px;color:var(--text-soft)}
.schedule-social a{font-weight:700;color:var(--rose-dark);text-decoration:underline;text-underline-offset:4px}
.schedule-success{text-align:center;padding:15px 0}
.schedule-success-icon{display:grid;place-items:center;margin:0 auto 12px;width:58px;height:58px;border-radius:50%;background:#e3eddf;color:#476448;font-size:27px}
.schedule-success h3{font-family:var(--font-title);font-size:29px;font-weight:500;color:var(--brown);margin:0 0 10px}
.schedule-success p{font-size:14px;color:var(--text-soft);margin:0 0 20px}
.schedule-success .button{width:100%}
.schedule-overlay [hidden]{display:none!important}
@media(max-width:520px){.schedule-overlay{padding:12px}.schedule-dialog{padding:32px 22px;border-radius:24px;max-height:94dvh}}

/* ===== REFINAMENTO EDITORIAL E MOBILE — NOVEMBRO 2026 ===== */
.therapy-editorial{align-items:center;gap:clamp(28px,6vw,85px)}
.therapy-editorial .section-heading{position:static}
.therapy-illustration{position:relative;display:flex;align-items:center;justify-content:center;height:210px;max-width:370px;margin:0 0 32px;border-radius:110px 110px 28px 28px;background:radial-gradient(circle at 45% 45%,#fffaf5 0%,#ead5cc 72%);overflow:hidden}
.therapy-orbit{position:absolute;width:195px;height:195px;border:1px solid rgba(158,87,79,.35);border-radius:50%;transform:rotate(-25deg) scaleX(.65)}
.orbit-two{transform:rotate(55deg) scaleX(.65);width:170px;height:170px}
.therapy-heart{font:normal 72px Georgia,serif;color:var(--rose-dark);transform:translateY(-13px)}
.therapy-illustration-caption{position:absolute;bottom:17px;left:12px;right:12px;text-align:center;font-size:11px;letter-spacing:.05em;color:var(--brown)}
.editorial-gallery{grid-template-columns:1.18fr 1fr;grid-template-rows:repeat(2,minmax(240px,300px));gap:18px}
.editorial-gallery .gallery-item{isolation:isolate}
.editorial-gallery .gallery-item:after{content:'';position:absolute;inset:42% 0 0;background:linear-gradient(transparent,rgba(27,24,22,.67));pointer-events:none}
.editorial-gallery .gallery-item figcaption{position:absolute;bottom:22px;left:24px;right:20px;z-index:2;color:white;display:grid;gap:3px;text-shadow:0 1px 6px rgba(0,0,0,.25)}
.editorial-gallery .gallery-item figcaption span{font-size:10px;letter-spacing:.18em;font-weight:600;color:#fbe4df}
.editorial-gallery .gallery-item figcaption strong{font-family:var(--font-title);font-size:clamp(19px,2.3vw,29px);font-weight:500;line-height:1.2}
.about-photo-note{display:flex;gap:10px;align-items:center;justify-content:center;padding:15px 8px;font-size:12px;letter-spacing:.06em;color:var(--rose-dark)}
.about-photo-note span{font-size:19px}
.therapy-principles{display:flex;flex-wrap:wrap;gap:12px;margin:-38px 0 44px}
.therapy-principles span{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border:1px solid rgba(189,111,103,.25);border-radius:50px;background:rgba(255,255,255,.5);font-size:13px;color:var(--brown)}
.therapy-principles i{font-style:normal;color:var(--rose-dark);font-size:18px}
@media(max-width:820px){
 .section{padding:62px 0}
 .two-columns,.about-container,.evidence-container,.faq-container{gap:25px}
 .therapy-editorial{gap:22px}
 .therapy-illustration{height:155px;max-width:100%;margin-bottom:25px;border-radius:75px 75px 20px 20px}
 .therapy-heart{font-size:54px}.therapy-orbit{width:145px;height:145px}.orbit-two{width:120px;height:120px}
 .section-text p,.about-content p{font-size:16px;line-height:1.75;margin-bottom:17px}
 .section-text p:last-child,.about-content p:last-of-type{margin-bottom:0}
 .editorial-gallery{grid-template-columns:1fr 1fr;grid-template-rows:300px 190px;gap:12px}
 .editorial-gallery .gallery-item-large{grid-column:span 2;grid-row:span 1}
 .editorial-gallery .gallery-item figcaption{left:15px;bottom:15px;right:12px}
 .editorial-gallery .gallery-item figcaption strong{font-size:19px}
 .about-container .about-visual{max-width:510px;width:100%;margin:auto}
 .about-photo-frame{min-height:0;aspect-ratio:4/4.4}
 .therapy-principles{margin:-20px 0 30px}
}
@media(max-width:520px){
 .section{padding:54px 0}
 .section h2,.center-heading h2{font-size:clamp(30px,8.3vw,36px);line-height:1.15}
 .center-heading{margin-bottom:28px}.center-heading p{font-size:15px;line-height:1.65}
 .editorial-gallery{grid-template-columns:1fr 1fr;grid-template-rows:300px 185px;gap:9px}
 .editorial-gallery .gallery-item{border-radius:18px}
 .editorial-gallery .gallery-item figcaption span{font-size:9px;letter-spacing:.1em}
 .editorial-gallery .gallery-item figcaption strong{font-size:16px}
 .editorial-gallery .gallery-item-large figcaption strong{font-size:25px}
 .about-photo-frame{aspect-ratio:4/4.2;min-height:0}
 .about-content .qualification{margin-top:24px}
 .therapy-principles{gap:8px}.therapy-principles span{padding:8px 11px;font-size:11px}
 .process-intro{margin-bottom:40px}
 .hero-photo-container .photo-message{max-width:calc(100% - 35px)}
}
@media(prefers-reduced-motion:reduce){.editorial-gallery .gallery-item img{transition:none}}

/* FOTO PRINCIPAL CLICÁVEL E AVALIAÇÕES GOOGLE */
.hero-photo-link{position:absolute;inset:0;z-index:3;display:block;cursor:pointer;color:inherit}
.hero-photo-link:focus-visible{outline:4px solid var(--rose-dark);outline-offset:-5px}
.hero-photo-link .hero-photo{position:absolute;inset:0}
.hero-photo-link .photo-message{z-index:2;pointer-events:none}
.hero-photo-hint{position:absolute;left:24px;bottom:25px;z-index:4;max-width:calc(100% - 50px);padding:10px 16px;border-radius:999px;background:rgba(44,37,34,.72);color:white;font-size:12px;font-weight:600;letter-spacing:.02em;backdrop-filter:blur(10px);transition:transform .25s ease,background .25s ease}
.hero-photo-link:hover .hero-photo-hint{transform:translateY(-3px);background:rgba(44,37,34,.9)}
.google-reviews-section{background:#f3e8df}
.google-reviews-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:65px;align-items:center}
.google-reviews-copy p{max-width:580px;color:var(--text-soft);margin:20px 0 28px;line-height:1.75}
.google-reviews-visual{padding:46px;border-radius:32px;background:rgba(255,255,255,.7);box-shadow:var(--shadow-card);border:1px solid var(--border)}
.google-reviews-mark{display:block;font:80px/0.8 var(--font-title);color:var(--rose)}
.google-reviews-visual p{font:clamp(25px,3vw,37px)/1.25 var(--font-title);color:var(--brown);margin:22px 0}
.google-reviews-note{font-size:13px;color:var(--text-soft)}
@media(max-width:820px){.google-reviews-layout{grid-template-columns:1fr;gap:24px}.google-reviews-visual{padding:28px}.hero-photo-hint{left:14px;bottom:14px;font-size:11px}.hero-photo-link .photo-message{bottom:70px}}
@media(max-width:520px){.google-reviews-visual p{font-size:27px}.google-reviews-copy p{font-size:15px}}


/* CONTEÚDOS EDUCATIVOS — SEO E LEITURA MOBILE */
.seo-topics-section{background:#faf6f1}
.seo-topics-section .center-heading{max-width:780px;margin-left:auto;margin-right:auto}
.seo-topics-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:38px}
.seo-topic-card{background:#fff;border:1px solid rgba(119,80,79,.12);border-radius:24px;padding:30px 26px;box-shadow:0 10px 32px rgba(76,53,49,.045);min-width:0}
.seo-topic-symbol{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#f5e6e6;color:#986a71;font-size:23px;margin-bottom:15px}
.seo-topic-card h3{font-family:var(--font-title,serif);font-size:clamp(21px,2.1vw,27px);line-height:1.2;color:var(--brown,#493735);margin:0 0 12px}
.seo-topic-card p{font-size:15px;line-height:1.75;color:var(--text-soft,#665c59);margin:0}
.seo-topics-footer{max-width:800px;margin:28px auto 0;text-align:center}
.seo-topics-footer p{font-size:13px;line-height:1.65;color:var(--text-soft,#665c59);margin-bottom:15px}
.seo-topics-link{display:inline-flex;align-items:center;gap:8px;color:var(--brown,#493735);font-weight:600;text-decoration:underline;text-underline-offset:5px}
@media(max-width:900px){.seo-topics-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.seo-topic-card{padding:23px}}
@media(max-width:600px){.seo-topics-grid{grid-template-columns:1fr;gap:12px;margin-top:24px}.seo-topic-card{padding:20px 22px;border-radius:19px}.seo-topic-card h3{font-size:23px}.seo-topic-card p{font-size:14px;line-height:1.65}.seo-topic-symbol{width:36px;height:36px;font-size:20px;margin-bottom:10px}.seo-topics-footer{margin-top:20px}}

/* Versão estática: elementos permanecem visíveis se JavaScript falhar */
.no-js .reveal,.no-js .reveal-photo{opacity:1;transform:none}