/* Blog da Anseio — leitura premium */ :root{ --azul:#4880C0; --azul-2:#3A6CA8; --azul-claro:#83AEDF; --noite:#0A1830; --noite-2:#11264A; --papel:#F5F8FC; --papel-2:#EAF2FB; --tinta:#16263F; --cinza:#5A6B82; --linha:#E6EDF6; --whats:#22C786; --radius:20px; --display:'Bricolage Grotesque',sans-serif; --body:'Albert Sans',sans-serif; --mono:'Spline Sans Mono',monospace; } *{margin:0;padding:0;box-sizing:border-box} html{scroll-behavior:smooth} body{font-family:var(--body);color:var(--tinta);background:#fff;line-height:1.75;-webkit-font-smoothing:antialiased; /* cor da editoria — definida inline no de cada artigo */ --cor-ed:var(--azul);--cor-ed-bg:var(--papel-2)} a{color:var(--azul)} ::selection{background:var(--cor-ed);color:#fff} /* barra de progresso de leitura (artigo) */ .progresso{position:fixed;top:0;left:0;height:3px;width:0;z-index:60;background:linear-gradient(90deg,var(--cor-ed),var(--azul-claro));border-radius:0 3px 3px 0} /* pill de editoria (colorida) */ .pill{display:inline-block;font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:var(--cor-ed);background:var(--cor-ed-bg);border-radius:999px;padding:6px 14px} /* barra topo */ .top{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.86);backdrop-filter:blur(12px);border-bottom:1px solid var(--linha)} .top .in{max-width:760px;margin:0 auto;padding:15px 24px;display:flex;align-items:center;justify-content:space-between} .top .marca{display:inline-flex;align-items:center;gap:2px;text-decoration:none} .top .marca img{height:26px;width:auto;display:block} .top .voltar{font-size:.9rem;color:var(--cinza);text-decoration:none;font-weight:500;display:inline-flex;align-items:center;gap:6px} .top .voltar:hover{color:var(--azul)} /* hero do artigo — ganha o tom da editoria */ .hero{background:linear-gradient(180deg,var(--cor-ed-bg),#fff);border-bottom:1px solid var(--linha)} .hero .in{max-width:720px;margin:0 auto;padding:56px 24px 40px} .hero .tag{font-family:var(--mono);font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--azul)} .hero h1{font-family:var(--display);font-size:clamp(2rem,5vw,3rem);font-weight:600;line-height:1.1;letter-spacing:-.025em;margin:16px 0 18px} .hero .lead{font-size:1.2rem;color:var(--cinza);max-width:640px} .hero .meta{margin-top:22px;font-family:var(--mono);font-size:.76rem;letter-spacing:.06em;color:var(--cinza);display:flex;gap:16px;flex-wrap:wrap} .hero .meta span{display:inline-flex;align-items:center;gap:7px} /* corpo */ article{max-width:680px;margin:0 auto;padding:44px 24px 20px} article h2{font-family:var(--display);font-size:clamp(1.35rem,3.2vw,1.7rem);font-weight:600;letter-spacing:-.015em;margin:44px 0 14px;line-height:1.2} article h2::before{content:"";display:block;width:34px;height:3px;border-radius:2px;background:var(--cor-ed);margin-bottom:12px} .fecho h2::before{display:none} article h3{font-family:var(--display);font-size:1.18rem;font-weight:600;margin:30px 0 10px} article p{margin:0 0 20px;font-size:1.08rem} article ul,article ol{margin:0 0 20px 4px;padding-left:22px} article li{margin-bottom:11px;font-size:1.08rem} article li::marker{color:var(--cor-ed)} article strong{color:var(--tinta);font-weight:600} article a{text-decoration:underline;text-underline-offset:3px} /* citação de destaque */ .pull{position:relative;margin:38px 0;padding:10px 0 10px 30px;border-left:3px solid var(--cor-ed);font-family:var(--display);font-size:1.35rem;font-weight:500;line-height:1.35;color:var(--tinta);letter-spacing:-.01em} .pull::before{content:"\201C";position:absolute;left:26px;top:-24px;font-size:3.4rem;line-height:1;color:var(--cor-ed);opacity:.22;font-family:Georgia,serif} /* caixa de nota */ .nota{background:var(--papel);border:1px solid var(--linha);border-left:4px solid var(--cor-ed);border-radius:var(--radius);padding:22px 24px;margin:30px 0;font-size:1.02rem;color:var(--tinta)} .nota b{color:var(--cor-ed)} /* imagens no corpo do texto */ .ilustra{margin:34px 0} .ilustra img{width:100%;height:auto;max-height:420px;object-fit:cover;border-radius:18px;display:block;box-shadow:0 16px 40px rgba(12,27,51,.12)} .ilustra figcaption{font-family:var(--mono);font-size:.74rem;letter-spacing:.04em;color:var(--cinza);margin-top:11px;text-align:center} /* seção "importância da psicoterapia" + CTA */ .fecho{max-width:680px;margin:10px auto 0;padding:0 24px} .fecho .selo{font-family:var(--mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cor-ed)} .fecho h2{margin-top:12px} .cta{max-width:680px;margin:40px auto 0;padding:0 24px 60px} .cta .box{background:radial-gradient(120% 120% at 85% 0%,var(--noite-2),var(--noite));color:#fff;border-radius:24px;padding:40px 34px;text-align:center;position:relative;overflow:hidden} .cta .box::after{content:"";position:absolute;top:-50px;right:-30px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(131,174,223,.3),transparent 70%)} .cta h3{font-family:var(--display);font-size:clamp(1.4rem,3.5vw,1.9rem);font-weight:600;line-height:1.18;position:relative} .cta p{color:rgba(198,220,244,.85);margin:14px auto 26px;max-width:460px;position:relative;font-size:1.04rem} .btn-whats{position:relative;display:inline-flex;align-items:center;gap:11px;background:var(--whats);color:#04251A;font-weight:600;text-decoration:none;border-radius:999px;padding:16px 34px;font-size:1.06rem;box-shadow:0 12px 30px rgba(34,199,134,.32);transition:transform .25s} .btn-whats:hover{transform:translateY(-2px) scale(1.02)} .btn-whats svg{width:21px;height:21px;fill:currentColor} footer{border-top:1px solid var(--linha);color:var(--cinza);font-size:.9rem} footer .in{max-width:680px;margin:0 auto;padding:28px 24px 56px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap} footer a{color:var(--cinza);text-decoration:none} footer a:hover{color:var(--azul)} /* "Leia também" — links internos no fim do artigo */ .relacionados{border-top:1px solid var(--linha);margin-top:46px} .relacionados .in{max-width:960px;margin:0 auto;padding:40px 24px 6px} .relacionados h2{font-family:var(--display);font-size:1.3rem;font-weight:600;letter-spacing:-.015em;margin:0 0 20px} .rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px} .rel-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--linha);border-radius:var(--radius);overflow:hidden;text-decoration:none;color:var(--tinta);transition:border-color .2s,transform .2s,box-shadow .2s} .rel-card:hover{border-color:var(--azul-claro);transform:translateY(-2px);box-shadow:0 10px 30px rgba(22,38,63,.07)} .rel-card img,.rel-semfoto{width:100%;aspect-ratio:16/9;object-fit:cover;display:block} .rel-semfoto{background:radial-gradient(120% 130% at 80% 10%,var(--papel-2),var(--azul-claro) 160%)} .rel-card .rel-tag{font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--azul);padding:16px 18px 0} .rel-card strong{font-family:var(--display);font-size:1.02rem;font-weight:600;line-height:1.28;letter-spacing:-.01em;padding:7px 18px 18px} @media(max-width:700px){.rel-grid{grid-template-columns:1fr}} /* capa (foto) do artigo */ .cover{max-width:960px;margin:0 auto;padding:26px 24px 0} .cover img{width:100%;height:clamp(220px,42vw,400px);object-fit:cover;border-radius:22px;display:block;box-shadow:0 24px 60px rgba(12,27,51,.14)}