/* Dalila Garcez · Psicóloga · Desenvolvimento Feminino
   Conceito "Casa Editorial Terracota": creme quente como papel, terracota da marca
   como tinta, serifa itálica nos títulos (a mesma voz dos posts dela) e DM Sans no
   corpo. Cada produto do Linktree é um "cômodo" da página, na mesma ordem. */

@font-face{font-family:'Playfair Display';src:url('assets/fonts/playfair-var.woff2') format('woff2');font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:'Playfair Display';src:url('assets/fonts/playfair-italic-var.woff2') format('woff2');font-weight:400 700;font-style:italic;font-display:swap}
@font-face{font-family:'DM Sans';src:url('assets/fonts/dmsans-var.woff2') format('woff2');font-weight:300 700;font-style:normal;font-display:swap}

:root{
  --bg:#FBF5EC;--bg-warm:#F5EADB;--paper:#FFFFFF;
  --ink:#2A1A14;--muted:#6F5A50;
  --forest:#98432F;--forest-deep:#6E2E1F;   /* nomes legados: aqui é o terracota da marca */
  --terra:#98432F;--terra-soft:#B8624B;
  --gold:#FFE9B2;--gold-soft:#FFF4DD;      /* creme da marca (fundo do Linktree) */
  --line:rgba(42,26,20,.12);--line-soft:rgba(42,26,20,.07);
  --serif:'Playfair Display',Georgia,'Times New Roman',serif;
  --sans:'DM Sans','Helvetica Neue',Arial,sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
  --radius:22px;
  --shadow:0 30px 60px -30px rgba(42,26,20,.35);
  --nav-h:76px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 12px);-webkit-text-size-adjust:100%;overflow-x:clip}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:var(--sans);font-weight:400;color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.1;margin:0;letter-spacing:-.01em}
h1 em,h2 em,h3 em,.it{font-style:italic;font-weight:400}
p{margin:0}
.wrap{width:min(1180px,calc(100% - 40px));margin:0 auto}
.eyebrow{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--terra);font-weight:600;margin:0 0 14px}
.dark .eyebrow{color:var(--gold)}
.lead{font-size:clamp(17px,1.35vw,19px);color:var(--muted);max-width:56ch}
.dark .lead{color:rgba(255,244,221,.82)}

/* gate anti-flash: só quando o JS está pronto os .anim ficam escondidos, e mesmo
   assim só com motion permitida. Sem JS a página aparece inteira. */
@media (prefers-reduced-motion:no-preference){
  html.js:not(.anim-ready) .anim{visibility:hidden}
}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:14px 26px;border-radius:999px;font-weight:600;font-size:15.5px;text-decoration:none;border:1px solid transparent;transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .3s var(--ease),color .3s var(--ease);cursor:pointer;line-height:1.2}
.btn svg{width:19px;height:19px;flex:none}
.btn:hover{transform:translateY(-2px)}
.btn--solid{background:var(--terra);color:#fff;box-shadow:0 18px 30px -18px rgba(152,67,47,.7)}
.btn--solid:hover{background:var(--forest-deep)}
.btn--gold{background:var(--gold);color:var(--forest-deep)}
.btn--gold:hover{background:#fff}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn--ghost:hover{background:rgba(42,26,20,.05)}
.dark .btn--ghost{color:var(--gold-soft);border-color:rgba(255,233,178,.35)}
.dark .btn--ghost:hover{background:rgba(255,233,178,.1)}
.btn--wa{background:#25D366;color:#0B2D18}
.btn--wa:hover{background:#1fbf5b}

/* ---------- nav ---------- */
.nav{position:fixed;inset:0 0 auto 0;height:var(--nav-h);z-index:50;background:rgba(251,245,236,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line-soft)}
.nav .wrap{height:100%;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{text-decoration:none;display:flex;flex-direction:column;line-height:1.05}
.brand__name{font-family:var(--serif);font-size:22px;font-weight:500;letter-spacing:.01em}
.brand__name em{font-style:italic;font-weight:400}
.brand__sub{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--terra);font-weight:600;margin-top:4px}
.nav__links{display:flex;align-items:center;gap:26px;list-style:none;margin:0;padding:0}
.nav__links a{text-decoration:none;font-size:14.5px;font-weight:500;color:var(--ink);opacity:.82;transition:opacity .2s}
.nav__links a:hover{opacity:1}
.nav__links .btn{min-height:44px;padding:10px 20px;font-size:14px;opacity:1}
.burger{display:none;width:44px;height:44px;border:1px solid var(--line);border-radius:12px;background:transparent;cursor:pointer;place-items:center}
.burger span{display:block;width:20px;height:2px;background:var(--ink);margin:3px 0;transition:transform .3s var(--ease),opacity .3s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(5px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-5px) rotate(-45deg)}

/* ---------- hero ---------- */
.hero{position:relative;padding:calc(var(--nav-h) + 56px) 0 64px;overflow:clip;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(900px 520px at 78% 12%,rgba(152,67,47,.14),transparent 62%),
    radial-gradient(600px 420px at 8% 90%,rgba(255,233,178,.55),transparent 65%),
    linear-gradient(180deg,var(--bg),var(--bg-warm))}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,72px);align-items:center}
.hero h1{font-size:clamp(40px,5.3vw,72px);font-weight:500;letter-spacing:-.02em}
.hero h1 em{color:var(--terra)}
.hero__lead{margin-top:22px}
.hero__act{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.hero__cred{margin-top:26px;font-size:13.5px;color:var(--muted);letter-spacing:.02em}
.hero__cred strong{color:var(--ink);font-weight:600}
.hero__media{position:relative}
.hero__frame{position:relative;aspect-ratio:4/5;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);background:var(--bg-warm)}
.hero__frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%}
.hero__frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(42,26,20,.35))}
.hero__aro{position:absolute;inset:18px -18px -18px 18px;border:1px solid var(--terra);border-radius:var(--radius);opacity:.35;z-index:-1}
.hero__quote{position:absolute;left:-28px;bottom:36px;max-width:250px;background:var(--paper);border-radius:16px;padding:16px 18px;box-shadow:var(--shadow);font-family:var(--serif);font-style:italic;font-size:16px;line-height:1.35;color:var(--forest-deep)}
.hero__quote small{display:block;font-family:var(--sans);font-style:normal;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--terra);margin-top:8px;font-weight:600}

/* ---------- prova: 3 cards na 1ª dobra ---------- */
.proof{padding:0 0 30px}
.proof__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;transform:translateY(0)}
.proof__card{background:var(--paper);border:1px solid var(--line-soft);border-radius:18px;padding:22px 24px;display:flex;gap:16px;align-items:flex-start}
.proof__card svg{width:26px;height:26px;color:var(--terra);flex:none;margin-top:2px}
.proof__card b{display:block;font-family:var(--serif);font-size:22px;font-weight:500;line-height:1.1}
.proof__card span{font-size:14px;color:var(--muted);display:block;margin-top:4px}

/* ---------- seções ---------- */
.sec{padding:clamp(72px,9vw,120px) 0;position:relative}
.sec--tight{padding-top:clamp(48px,6vw,80px)}
.sec h2{font-size:clamp(32px,3.9vw,52px);max-width:22ch}
.sec h2 em{color:var(--terra)}
.dark{background:linear-gradient(180deg,var(--forest),var(--forest-deep));color:var(--gold-soft);isolation:isolate;overflow:clip}
.dark::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(760px 420px at 50% -8%,rgba(255,233,178,.18),transparent 62%)}
.dark h2 em{color:var(--gold)}
.dark .muted,.dark p{color:rgba(255,244,221,.86)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,84px);align-items:center}
.split--rev>.media{order:2}
.media{position:relative}
.media__frame{position:relative;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/5;background:var(--bg-warm)}
.media__frame--wide{aspect-ratio:5/4}
.media__frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 35%}
.media__aro{position:absolute;inset:16px -16px -16px 16px;border:1px solid var(--terra);border-radius:var(--radius);opacity:.35;z-index:-1}
.dark .media__aro{border-color:var(--gold);opacity:.4}
.num{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--terra);letter-spacing:.04em;margin-bottom:12px;display:flex;align-items:center;gap:12px}
.num::after{content:"";height:1px;width:48px;background:currentColor;opacity:.5}
.dark .num{color:var(--gold)}
.copy>p{margin-top:16px}
.copy .act{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.bullets{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:12px}
.bullets li{display:flex;gap:12px;align-items:flex-start;font-size:15.5px}
.bullets svg{width:20px;height:20px;flex:none;color:var(--terra);margin-top:3px}
.dark .bullets svg{color:var(--gold)}
.note{font-size:13px;color:var(--muted);margin-top:14px}
.dark .note{color:rgba(255,244,221,.65)}

/* manifesto / sobre */
.sobre .quote{font-family:var(--serif);font-style:italic;font-size:clamp(22px,2.3vw,30px);line-height:1.3;color:var(--forest-deep);margin-top:26px;padding-left:20px;border-left:2px solid var(--terra)}

/* ---------- Casa Viva: cômodos ---------- */
.rooms{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:36px}
.room{background:rgba(255,244,221,.08);border:1px solid rgba(255,233,178,.22);border-radius:16px;padding:18px 16px;transition:background .3s var(--ease),transform .3s var(--ease)}
.room:hover{background:rgba(255,244,221,.14);transform:translateY(-3px)}
.room b{display:block;font-family:var(--serif);font-size:19px;font-weight:500}
.room span{display:block;font-size:13px;color:var(--gold);letter-spacing:.06em;text-transform:uppercase;margin-top:6px;font-weight:600}
.programs{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.programs li{list-style:none;font-size:13.5px;padding:8px 14px;border-radius:999px;border:1px solid rgba(255,233,178,.3);color:var(--gold-soft)}
.programs{padding:0}
.gallery{display:grid;grid-template-columns:1.2fr .8fr;grid-template-rows:auto auto;gap:14px;margin-top:0}
.gallery .g1{grid-row:span 2}
.gallery .media__frame{aspect-ratio:auto;height:100%;min-height:200px}
.gallery .g2 .media__frame,.gallery .g3 .media__frame{aspect-ratio:5/4}

/* ---------- palestras: trio ---------- */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:40px}
.trio .media__frame{aspect-ratio:4/5}
.trio figcaption{font-size:13px;color:var(--muted);margin-top:10px}
.contexts{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-top:28px}
.ctx{background:var(--paper);border:1px solid var(--line-soft);border-radius:16px;padding:18px 20px}
.ctx b{font-family:var(--serif);font-size:19px;font-weight:500;display:block}
.ctx span{font-size:14px;color:var(--muted);display:block;margin-top:6px}

/* ---------- onde ---------- */
.onde .wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,64px);align-items:stretch}
.onde__info{display:flex;flex-direction:column;justify-content:center}
.addr{margin-top:20px;display:grid;gap:14px}
.addr div{display:flex;gap:12px;align-items:flex-start;font-size:15.5px}
.addr svg{width:20px;height:20px;color:var(--terra);flex:none;margin-top:3px}
.map{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);min-height:380px;background:var(--bg-warm)}
.map iframe{width:100%;height:100%;min-height:380px;border:0;display:block;filter:saturate(.85)}

/* ---------- imersão IPC ---------- */
.ipc .pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:26px}
.ipc .pillar{background:var(--paper);border:1px solid var(--line-soft);border-radius:16px;padding:18px}
.ipc .pillar b{font-family:var(--serif);font-size:22px;display:block;font-weight:500}
.ipc .pillar span{font-size:13.5px;color:var(--muted);display:block;margin-top:6px}
.ipc .pergunta{font-family:var(--serif);font-style:italic;font-size:clamp(20px,2vw,26px);color:var(--forest-deep);margin-top:22px;line-height:1.3}

/* ---------- FAQ ---------- */
.faq__list{margin-top:36px;display:grid;gap:10px;max-width:820px}
.faq details{background:var(--paper);border:1px solid var(--line-soft);border-radius:16px;padding:0 22px}
.faq summary{list-style:none;cursor:pointer;padding:18px 0;font-weight:600;font-size:16.5px;display:flex;justify-content:space-between;gap:16px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--serif);font-size:24px;color:var(--terra);line-height:1;transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 20px;color:var(--muted);font-size:15.5px}

/* ---------- CTA final ---------- */
.cta{text-align:center;padding:clamp(80px,10vw,130px) 0}
.cta::before{background:radial-gradient(760px 460px at 50% 0%,rgba(255,233,178,.22),transparent 62%)}
.cta h2{margin:0 auto;font-size:clamp(34px,4.4vw,58px)}
.cta .lead{margin:18px auto 0}
.cta .act{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:32px}

/* ---------- footer ---------- */
.foot{background:#1F120D;color:rgba(255,244,221,.78);padding:56px 0 28px;font-size:14px}
.foot__top{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:32px}
.foot h4{font-family:var(--serif);font-weight:500;font-size:20px;color:#fff;margin:0 0 10px}
.foot a{color:inherit;text-decoration:none}
.foot a:hover{color:#fff}
.foot ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.foot__legalbar{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:40px;padding-top:20px;border-top:1px solid rgba(255,244,221,.14);font-size:12.5px;color:rgba(255,244,221,.55)}
.foot__legalbar a{text-decoration:underline;text-underline-offset:2px;color:inherit}

/* ---------- WhatsApp flutuante (padrão fixo) ---------- */
.wa-float{position:fixed;right:22px;bottom:22px;width:58px;height:58px;border-radius:50%;background:#25D366;color:#fff;display:grid;place-items:center;z-index:60;box-shadow:0 16px 34px -12px rgba(37,211,102,.65);transition:transform .3s var(--ease)}
.wa-float:hover{transform:scale(1.08)}
.wa-float svg{width:28px;height:28px}

/* ---------- responsivo ---------- */
@media (max-width:1020px){
  .proof__grid{grid-template-columns:1fr 1fr}
  .trio{grid-template-columns:1fr 1fr}
  .foot__top{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  :root{--nav-h:66px}
  .nav__links{position:fixed;inset:var(--nav-h) 0 auto 0;max-height:0;overflow:hidden;visibility:hidden;flex-direction:column;align-items:stretch;gap:0;background:var(--bg);border-bottom:1px solid var(--line-soft);transition:max-height .42s var(--ease),visibility .42s var(--ease)}
  .nav__links.open{max-height:80vh;visibility:visible;box-shadow:var(--shadow)}
  .nav__links li{padding:0 20px}
  .nav__links a{display:block;padding:14px 0;border-bottom:1px solid var(--line-soft);font-size:16px}
  .nav__links .btn{margin:14px 0 18px;justify-content:center}
  .burger{display:grid}
  .hero{padding-top:calc(var(--nav-h) + 28px);padding-bottom:40px}
  /* dobra mobile: título → foto → texto → CTA */
  .hero .wrap{display:contents}
  .hero__text{display:contents}
  .hero h1{order:1;width:min(100%,calc(100% - 40px));margin:0 auto;font-size:clamp(34px,10vw,46px)}
  .hero__media{order:2;width:min(100%,calc(100% - 40px));margin:22px auto 0}
  .hero__lead{order:3;width:min(100%,calc(100% - 40px));margin:22px auto 0}
  .hero__act{order:4;width:min(100%,calc(100% - 40px));margin:22px auto 0}
  .hero__cred{order:5;width:min(100%,calc(100% - 40px));margin:18px auto 0}
  .hero__frame{aspect-ratio:auto;height:min(62svh,520px)}
  .hero__quote{left:14px;bottom:14px;max-width:220px;font-size:14px;padding:12px 14px}
  .hero__aro{display:none}
  .proof{padding-top:36px}
  .proof__grid{grid-template-columns:1fr}
  .split,.split--rev{grid-template-columns:1fr}
  .split--rev>.media{order:0}
  .media__frame{aspect-ratio:auto;height:min(60svh,480px)}
  .media__frame--wide{height:min(46svh,360px)}
  .gallery{grid-template-columns:1fr}
  .gallery .g1{grid-row:auto}
  /* aspect-ratio 5/4 + altura fixa daria 500px de largura e estouraria a coluna */
  .gallery .media__frame,.gallery .g2 .media__frame,.gallery .g3 .media__frame{aspect-ratio:auto;height:min(50svh,400px)}
  .split>*{min-width:0}
  .trio{grid-template-columns:1fr}
  .trio .media__frame{height:min(50svh,380px)}
  .onde .wrap{grid-template-columns:1fr}
  .ipc .pillars{grid-template-columns:1fr}
  .foot__top{grid-template-columns:1fr}
  .btn{width:100%}
  .hero__act .btn,.copy .act .btn,.cta .act .btn{width:100%}
}
@media (max-width:380px){
  .wrap{width:calc(100% - 32px)}
  .hero h1,.hero__media,.hero__lead,.hero__act,.hero__cred{width:calc(100% - 32px)}
}