/* =============================================
   Dr. João Zanirati — estilos compartilhados
   ============================================= */
:root {
    --lilac: #C2ACD1;
    --lilac-soft: #d8cce2;
    --lilac-glow: rgba(194, 172, 209, .35);
    --purple: #866E99;
    --purple-deep: #6b5880;
    --purple-dark: #4a3660;
    --cream: #EDE5DF;
    --cream-warm: #f7f3ef;
    --sage: #D5E0AF;
    --white: #fff;
    --off-white: #faf8fc;
    --text: #2a2233;
    --text-soft: #5c5066;
    --text-muted: #8a8294;
    --border: rgba(194, 172, 209, .22);
    --border-solid: #e4dcea;
    --wa: #25D366;
    --shadow-sm: 0 2px 12px rgba(134, 110, 153, .06);
    --shadow-md: 0 8px 32px rgba(134, 110, 153, .10);
    --shadow-lg: 0 20px 60px rgba(134, 110, 153, .14);
    --r: 16px;
    --r-lg: 24px;
    --r-xl: 32px;
    --ease: cubic-bezier(.16, 1, .3, 1);
    --hdr-h: 72px;
}

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--hdr-h) + 16px); }
body {
    font-family: 'Poppins', sans-serif;
    background: var(--white);
    color: var(--text);
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    line-height: 1.6;
}
::selection { background: var(--lilac); color: var(--white); }
img, video { max-width: 100%; display: block; }
a { text-decoration: none; color: inherit; }
button { font-family: inherit; cursor: pointer; }
:focus-visible { outline: 2px solid var(--purple); outline-offset: 3px; }

.container { max-width: 1200px; margin: 0 auto; padding: 0 28px; }
@media(max-width:480px){ .container, .hdr-inner { padding-left: 20px; padding-right: 20px; } }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- animations ---------- */
@keyframes float     { 0%,100%{ transform: translateY(0) rotate(0deg); }  50%{ transform: translateY(-18px) rotate(2deg); } }
@keyframes floatSlow { 0%,100%{ transform: translateY(0) rotate(0deg); }  50%{ transform: translateY(-10px) rotate(-1.5deg); } }
@keyframes spin      { to { transform: rotate(360deg); } }
@keyframes shimmer   { from { transform: translateX(-100%) skewX(-18deg); } to { transform: translateX(200%) skewX(-18deg); } }
@keyframes morph {
    0%,100% { border-radius: 42% 58% 70% 30% / 45% 45% 55% 55%; }
    25%     { border-radius: 73% 27% 26% 74% / 54% 43% 57% 46%; }
    50%     { border-radius: 28% 72% 44% 56% / 49% 60% 40% 51%; }
    75%     { border-radius: 40% 60% 67% 33% / 37% 65% 35% 63%; }
}
@keyframes fadeUp {
    from { opacity:0; transform:translateY(36px); filter:blur(6px); }
    to   { opacity:1; transform:translateY(0);    filter:blur(0); }
}
@keyframes marquee { 0%{ transform:translateX(0); } 100%{ transform:translateX(-50%); } }
@keyframes gradient { 0%{background-position:0% 50%;} 50%{background-position:100% 50%;} 100%{background-position:0% 50%;} }

.rv {
    opacity: 0; transform: translateY(36px); filter: blur(6px);
    transition: opacity .9s var(--ease), transform .9s var(--ease), filter .9s var(--ease);
}
.rv.on { opacity: 1; transform: translateY(0); filter: blur(0); }
.d1{transition-delay:.1s} .d2{transition-delay:.2s} .d3{transition-delay:.3s}
.d4{transition-delay:.4s} .d5{transition-delay:.5s} .d6{transition-delay:.6s}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
    .rv { opacity: 1; transform: none; filter: none; }
    html { scroll-behavior: auto; }
}

/* ---------- decorative shapes ---------- */
.deco { position: absolute; pointer-events: none; z-index: 0; }
.deco-blob { border-radius: 50%; filter: blur(80px); opacity: .18; animation: morph 18s ease-in-out infinite; }
.deco-ring { border: 1.5px solid var(--lilac-soft); border-radius: 50%; opacity: .12; animation: float 20s ease-in-out infinite; }
.deco-diamond { width: 18px; height: 18px; border: 1.5px solid var(--lilac-soft); transform: rotate(45deg); opacity: .14; animation: floatSlow 16s ease-in-out infinite; }

/* =============================================
   HEADER
   ============================================= */
.hdr {
    position: fixed; top: 0; left: 0; right: 0; z-index: 200;
    background: rgba(255,255,255,.86);
    backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
    border-bottom: 1px solid var(--border);
    transition: background .4s var(--ease), box-shadow .4s var(--ease);
}
.hdr.scrolled { background: rgba(255,255,255,.97); box-shadow: var(--shadow-sm); }
.hdr-inner {
    max-width: 1200px; margin: 0 auto; padding: 0 28px;
    height: var(--hdr-h);
    display: flex; align-items: center; justify-content: space-between; gap: 24px;
}
.hdr-logo { display: flex; align-items: center; flex-shrink: 0; }
.hdr-logo img { height: 46px; width: auto; transition: transform .4s var(--ease); }
.hdr-logo:hover img { transform: scale(1.03); }

.hdr-nav { display: flex; align-items: center; gap: 26px; }
.hdr-nav a {
    font-size: 13.5px; font-weight: 500; color: var(--text-soft);
    position: relative; transition: color .3s; white-space: nowrap;
}
.hdr-nav a:not(.hdr-cta)::after {
    content:''; position:absolute; left:0; bottom:-4px;
    width:0; height:1.5px; background:var(--purple);
    transition: width .3s var(--ease);
}
.hdr-nav a:hover, .hdr-nav a[aria-current="page"] { color: var(--purple); }
.hdr-nav a:hover::after, .hdr-nav a[aria-current="page"]::after { width: 100%; }

.hdr-cta {
    padding: 10px 24px;
    background: var(--purple) !important;
    color: var(--white) !important;
    font-size: 13.5px; font-weight: 600;
    border: none; border-radius: 100px;
    position: relative; overflow: hidden;
    transition: background .3s, transform .3s, box-shadow .3s;
}
.hdr-cta:hover { background: var(--purple-deep) !important; transform: translateY(-1px); box-shadow: 0 6px 20px rgba(134,110,153,.25); }

.hdr-toggle { display: none; background: none; border: none; color: var(--text); padding: 6px; }

.mob-menu {
    display:none; position:fixed; inset:0; z-index:199;
    background: rgba(255,255,255,.97); backdrop-filter:blur(20px);
    flex-direction: column; align-items: center; justify-content: center; gap: 26px;
}
.mob-menu.open { display:flex; }
.mob-menu a { font-size: 20px; font-weight: 500; color: var(--text); }
.mob-close { position:absolute; top:18px; right:18px; background:none; border:none; color:var(--text); }

@media(max-width:900px){
    .hdr-nav { display:none; }
    .hdr-toggle { display:block; }
}

/* =============================================
   SECTION HELPERS & BUTTONS
   ============================================= */
.sec-label {
    display: inline-flex; align-items: center; gap: 10px;
    font-family:'Kanit',sans-serif; font-size:12px; font-weight:400;
    text-transform: uppercase; letter-spacing:.18em;
    color: var(--purple); margin-bottom: 18px;
}
.sec-label-line { width: 32px; height: 1.5px; background: linear-gradient(90deg, var(--lilac), var(--purple)); }
.sec-title { font-size: clamp(30px, 4.2vw, 48px); font-weight: 600; line-height: 1.15; letter-spacing:-.025em; margin-bottom: 18px; }
.sec-title em {
    font-style: normal;
    background: linear-gradient(135deg, var(--purple), var(--lilac));
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.sec-sub { font-size: 16px; color: var(--text-soft); line-height: 1.75; max-width: 560px; }
.sec-center { text-align: center; }
.sec-center .sec-sub { margin: 0 auto; }

.btn-primary {
    display: inline-flex; align-items: center; gap: 10px;
    padding: 16px 38px;
    background: var(--purple); color: var(--white);
    font-size: 15px; font-weight: 600;
    border: none; border-radius: 100px;
    position: relative; overflow: hidden;
    transition: all .35s var(--ease);
}
.btn-primary:hover { background:var(--purple-deep); transform:translateY(-3px); box-shadow: 0 12px 40px rgba(134,110,153,.3); }
.btn-primary i { transition: transform .3s var(--ease); }
.btn-primary:hover i { transform: translateX(4px); }

.btn-ghost {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 14px 28px;
    background: transparent; color: var(--purple);
    font-size: 14px; font-weight: 500;
    border: 1.5px solid var(--border-solid); border-radius: 100px;
    transition: all .3s var(--ease);
}
.btn-ghost:hover { border-color: var(--purple); background: rgba(194,172,209,.08); transform: translateY(-2px); }

.btn-wa {
    display:inline-flex; align-items:center; justify-content:center; gap:10px;
    padding:16px 36px;
    background:var(--wa); color:var(--white);
    font-size:15px; font-weight:600;
    border:none; border-radius:100px;
    transition: all .35s var(--ease);
}
.btn-wa:hover { background:#1EB954; transform:translateY(-2px); box-shadow:0 8px 28px rgba(37,211,102,.35); }
.btn-wa svg { width:20px; height:20px; flex-shrink:0; }

/* =============================================
   PROCEDURES GRID
   ============================================= */
.procs { position:relative; padding:120px 0; background:var(--white); overflow:hidden; }
.procs-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:56px; }
.proc-card {
    position:relative; padding:32px 28px;
    background:var(--cream-warm); border:1px solid var(--border);
    border-radius:var(--r-lg);
    transition: all .35s var(--ease);
    display:flex; flex-direction:column; gap:12px;
}
.proc-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-md); border-color:var(--lilac-soft); background:var(--white); }
.proc-card-icon {
    width:50px; height:50px; border-radius:14px;
    background: linear-gradient(135deg, var(--lilac), var(--purple));
    display:flex; align-items:center; justify-content:center; color:var(--white);
}
.proc-card-icon i { width:22px; height:22px; }
.proc-card h3 { font-size:18px; font-weight:600; letter-spacing:-.01em; }
.proc-card p { font-size:14px; color:var(--text-soft); line-height:1.65; flex:1; }
.proc-card a { font-size:13.5px; font-weight:600; color:var(--purple); display:inline-flex; align-items:center; gap:6px; }
.proc-card a i { width:16px; height:16px; transition: transform .3s var(--ease); }
.proc-card a:hover i { transform: translateX(4px); }
@media(max-width:900px){ .procs-grid { grid-template-columns:repeat(2,1fr); } }
@media(max-width:600px){ .procs-grid { grid-template-columns:1fr; } }

/* =============================================
   FAQ
   ============================================= */
.faq { position:relative; padding:120px 0; background:linear-gradient(180deg, var(--cream-warm), var(--cream) 50%, var(--cream-warm)); overflow:hidden; }
.faq-list { max-width:820px; margin:48px auto 0; display:flex; flex-direction:column; gap:12px; }
.faq-item {
    background:var(--white); border:1px solid var(--border); border-radius:var(--r);
    transition: box-shadow .3s var(--ease), border-color .3s;
}
.faq-item[open] { box-shadow:var(--shadow-md); border-color:var(--lilac-soft); }
.faq-item summary {
    list-style:none; cursor:pointer;
    padding:20px 24px; display:flex; align-items:center; justify-content:space-between; gap:16px;
    font-size:16px; font-weight:600;
}
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::after {
    content:'+'; flex-shrink:0;
    width:28px; height:28px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    background:var(--cream); color:var(--purple); font-weight:500;
    transition: transform .3s var(--ease);
}
.faq-item[open] summary::after { transform: rotate(45deg); }
.faq-item p { padding:0 24px 22px; font-size:15px; color:var(--text-soft); line-height:1.75; }

/* =============================================
   CONTACT / LOCATION
   ============================================= */
.contact { position:relative; padding:120px 0; background:var(--white); overflow:hidden; }
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start; }
.contact-list { display:flex; flex-direction:column; gap:20px; margin-top:36px; }
.contact-item { display:flex; gap:16px; align-items:flex-start; }
.contact-item-icon {
    width:44px; height:44px; border-radius:12px; flex-shrink:0;
    background:var(--cream); border:1px solid var(--border);
    display:flex; align-items:center; justify-content:center; color:var(--purple);
}
.contact-item-icon i { width:20px; height:20px; }
.contact-item h4 { font-size:15px; font-weight:600; margin-bottom:2px; }
.contact-item p, .contact-item a { font-size:14.5px; color:var(--text-soft); line-height:1.6; }
.contact-item a:hover { color:var(--purple); }
.contact-actions { display:flex; gap:14px; flex-wrap:wrap; margin-top:32px; }
.contact-map {
    border-radius:var(--r-xl); overflow:hidden;
    border:1px solid var(--border-solid); box-shadow:var(--shadow-lg);
    background:var(--cream); aspect-ratio: 4/3;
}
.contact-map iframe { width:100%; height:100%; border:0; display:block; }
@media(max-width:860px){ .contact-grid { grid-template-columns:1fr; gap:40px; } }

/* =============================================
   FOOTER
   ============================================= */
.ftr { padding:72px 0 36px; background:var(--cream); border-top:1px solid var(--border-solid); }
.ftr-grid { display:grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap:48px; margin-bottom:48px; }
.ftr-logo img { height:52px; width:auto; margin-bottom:18px; }
.ftr-about { font-size:14px; color:var(--text-soft); line-height:1.7; max-width:340px; }
.ftr h4 { font-family:'Kanit',sans-serif; font-size:12px; font-weight:500; text-transform:uppercase; letter-spacing:.16em; color:var(--purple); margin-bottom:18px; }
.ftr ul { list-style:none; display:flex; flex-direction:column; gap:10px; }
.ftr li a, .ftr address { font-size:14px; color:var(--text-soft); font-style:normal; line-height:1.7; transition:color .3s; }
.ftr li a:hover { color:var(--purple); }
.ftr-social { display:flex; gap:10px; margin-top:16px; }
.ftr-social a {
    width:40px; height:40px; border-radius:50%;
    background:var(--white); border:1px solid var(--border-solid);
    display:flex; align-items:center; justify-content:center; color:var(--purple);
    transition: all .3s var(--ease);
}
.ftr-social a:hover { background:var(--purple); color:var(--white); transform:translateY(-2px); }
.ftr-social i { width:18px; height:18px; }
.ftr-bottom { border-top:1px solid var(--border-solid); padding-top:24px; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:12.5px; color:var(--text-muted); }
.ftr-bottom p { max-width:720px; line-height:1.6; }
@media(max-width:900px){ .ftr-grid { grid-template-columns:1fr 1fr; gap:36px; } }
@media(max-width:560px){ .ftr-grid { grid-template-columns:1fr; } }

/* floating WhatsApp */
.wa-float {
    position:fixed; right:22px; bottom:22px; z-index:150;
    width:58px; height:58px; border-radius:50%;
    background:var(--wa); color:var(--white);
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 10px 30px rgba(37,211,102,.4);
    transition: transform .3s var(--ease);
}
.wa-float:hover { transform:scale(1.08); }
.wa-float svg { width:28px; height:28px; }

/* =============================================
   PAGE HERO (blog / inner pages)
   ============================================= */
.page-hero {
    padding: calc(var(--hdr-h) + 72px) 0 64px;
    background: linear-gradient(168deg, var(--white) 0%, var(--cream-warm) 60%, var(--cream) 100%);
    position:relative; overflow:hidden;
}
.page-hero .deco-blob-1 { width:520px; height:520px; top:-30%; right:-10%; background: radial-gradient(circle, var(--lilac) 0%, transparent 70%); }
.page-hero h1 { font-size: clamp(32px, 4.6vw, 52px); font-weight:600; line-height:1.12; letter-spacing:-.03em; max-width:820px; }
.page-hero .sec-sub { margin-top:16px; max-width:640px; }
.crumbs { display:flex; gap:8px; flex-wrap:wrap; font-size:13px; color:var(--text-muted); margin-bottom:22px; }
.crumbs a:hover { color:var(--purple); }
.crumbs li { list-style:none; display:flex; gap:8px; }
.crumbs li + li::before { content:'/'; opacity:.5; }

/* =============================================
   BLOG LIST
   ============================================= */
.blog-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; padding:72px 0 120px; }
.post-card {
    display:flex; flex-direction:column;
    background:var(--white); border:1px solid var(--border); border-radius:var(--r-lg);
    overflow:hidden; transition: all .35s var(--ease);
}
.post-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-md); border-color:var(--lilac-soft); }
.post-card-cover {
    aspect-ratio: 16/10; display:flex; align-items:flex-end; padding:22px;
    background: linear-gradient(135deg, var(--purple-deep), var(--purple) 55%, var(--lilac));
    position:relative; overflow:hidden;
}
.post-card-cover::after {
    content:''; position:absolute; width:260px; height:260px; right:-80px; top:-100px;
    background:url('/assets/img/brand/symbol-512.png') center/contain no-repeat; opacity:.12;
}
.post-card-cover span {
    font-family:'Kanit',sans-serif; font-size:11px; letter-spacing:.16em; text-transform:uppercase;
    color:var(--white); background:rgba(255,255,255,.18); padding:6px 12px; border-radius:100px; position:relative; z-index:1;
}
.post-card-body { padding:24px; display:flex; flex-direction:column; gap:10px; flex:1; }
.post-card h2 { font-size:18px; font-weight:600; line-height:1.35; letter-spacing:-.01em; }
.post-card p { font-size:14px; color:var(--text-soft); line-height:1.65; flex:1; }
.post-card time { font-size:12.5px; color:var(--text-muted); }
@media(max-width:900px){ .blog-grid { grid-template-columns:repeat(2,1fr); } }
@media(max-width:600px){ .blog-grid { grid-template-columns:1fr; } }

/* =============================================
   ARTICLE
   ============================================= */
.article-wrap { display:grid; grid-template-columns: minmax(0, 720px) 300px; gap:64px; justify-content:center; padding:64px 0 120px; }
.article { font-size:16.5px; line-height:1.8; color:var(--text-soft); }
.article > * + * { margin-top: 1.2em; }
.article h2 { font-size:clamp(24px, 3vw, 30px); font-weight:600; line-height:1.25; letter-spacing:-.02em; color:var(--text); margin-top:2em; }
.article h3 { font-size:20px; font-weight:600; color:var(--text); margin-top:1.6em; }
.article p strong { color:var(--text); font-weight:600; }
.article ul, .article ol { padding-left:1.3em; }
.article li + li { margin-top:.5em; }
.article a { color:var(--purple); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--lilac); }
.article a:hover { text-decoration-color: var(--purple); }
.article .lead { font-size:19px; color:var(--text); line-height:1.7; }
.article .callout {
    background:var(--cream-warm); border-left:3px solid var(--purple); border-radius:0 var(--r) var(--r) 0;
    padding:20px 24px; font-size:15.5px;
}
.article .callout strong { color:var(--purple-dark); }
.article table { width:100%; border-collapse:collapse; font-size:14.5px; }
.article th, .article td { text-align:left; padding:12px 14px; border-bottom:1px solid var(--border-solid); vertical-align:top; }
.article th { font-weight:600; color:var(--text); background:var(--cream-warm); }
.article-meta { display:flex; flex-wrap:wrap; gap:8px 20px; font-size:13.5px; color:var(--text-muted); margin-top:20px; }
.article-meta strong { color:var(--text-soft); font-weight:500; }
.article-faq details { border:1px solid var(--border-solid); border-radius:var(--r); margin-top:10px; background:var(--white); }
.article-faq summary { cursor:pointer; padding:16px 20px; font-weight:600; color:var(--text); font-size:15.5px; list-style:none; display:flex; justify-content:space-between; gap:12px; }
.article-faq summary::-webkit-details-marker { display:none; }
.article-faq summary::after { content:'+'; color:var(--purple); }
.article-faq details[open] summary::after { content:'–'; }
.article-faq details p { padding:0 20px 18px; font-size:15px; margin:0; }
.article-cta {
    margin-top:48px; padding:36px; border-radius:var(--r-lg); text-align:center;
    background: linear-gradient(135deg, var(--purple-deep), var(--purple));
    color:var(--white);
}
.article-cta h3 { font-size:22px; font-weight:600; color:var(--white); margin:0 0 8px; }
.article-cta p { color:rgba(255,255,255,.85); font-size:15px; margin:0 0 22px; }
.article-cta .btn-wa { background:var(--white); color:var(--purple-dark); }
.article-cta .btn-wa:hover { background:var(--cream); }
.article-disclaimer { margin-top:40px; font-size:13px; color:var(--text-muted); line-height:1.6; border-top:1px solid var(--border-solid); padding-top:20px; }

.aside { position:sticky; top:calc(var(--hdr-h) + 24px); display:flex; flex-direction:column; gap:24px; }
.aside-card { background:var(--cream-warm); border:1px solid var(--border); border-radius:var(--r-lg); padding:26px; }
.aside-card h4 { font-family:'Kanit',sans-serif; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--purple); margin-bottom:14px; }
.aside-card ul { list-style:none; display:flex; flex-direction:column; gap:10px; }
.aside-card li a { font-size:14px; color:var(--text-soft); line-height:1.45; display:block; transition:color .3s; }
.aside-card li a:hover { color:var(--purple); }
.aside-author { display:flex; gap:14px; align-items:center; }
.aside-author img { width:64px; height:64px; border-radius:50%; object-fit:cover; object-position:top; }
.aside-author strong { display:block; font-size:15px; color:var(--text); }
.aside-author span { font-size:13px; color:var(--text-muted); }
.aside-card .btn-wa { width:100%; margin-top:16px; padding:13px 20px; font-size:14px; }
@media(max-width:960px){ .article-wrap { grid-template-columns:minmax(0,1fr); gap:40px; } .aside { position:static; } }

/* Blog: figuras e capas */
.article figure { margin: 1.8em 0 0; }
.article figure img { width:100%; height:auto; border-radius:var(--r-lg); border:1px solid var(--border-solid); background:var(--cream-warm); }
.article figure.photo img { aspect-ratio:16/10; object-fit:cover; object-position:center 20%; }
.article figure.ba { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.article figure.ba img { aspect-ratio:1; object-fit:cover; }
.article figure.ba figcaption { grid-column:1 / -1; }
.article figcaption { font-size:13.5px; color:var(--text-muted); line-height:1.55; margin-top:12px; }
.post-card-cover img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 20%; }
.post-card-cover::after { display:none; }
.post-card-cover span { background:rgba(74,54,96,.72); backdrop-filter:blur(4px); }