/* ============================================================
   ursula.css — sistema de design da LP Ribeirao (formato aprovado).
   Fonte unica da verdade: LP e paginas novas linkam este arquivo;
   o brandbook tambem o consome. Legado antigo: css/styles.css.
   ============================================================ */
    /* ============================================================
       LP Ribeirão Preto — conversão 1:1 do bundle para HTML puro.
       Valores idênticos aos inline do bundle, organizados em classes
       para permitir edição de layout aos poucos.
       ============================================================ */
    * { margin: 0; padding: 0; box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    html.nav-open { overflow: hidden; }
    /* overflow-x: clip contém o painel off-canvas (translateX 100%) sem virar
       container de scroll, então não quebra os position: sticky da página. */
    body { font-family: 'Montserrat', sans-serif; background: #FFFFFF; color: #382E2C; -webkit-font-smoothing: antialiased; overflow-x: clip; }
    a { color: #E4A03D; text-decoration: none; }
    a:hover { color: #c9861f; }
    img { display: block; max-width: 100%; }
    section[id], header[id] { scroll-margin-top: 80px; }

    /* ===== TOKENS DE LAYOUT ================================================
       Um lugar só para a largura do conteúdo, o respiro lateral e o ritmo
       vertical das seções. Mudar aqui muda a página inteira. Em páginas novas,
       use .container como a caixa padrão de conteúdo. */
    :root { --container: 1240px; --gutter: clamp(20px, 4vw, 40px); --section-y: clamp(60px, 10vw, 120px); }

    .container { max-width: var(--container); margin: 0 auto; padding-inline: var(--gutter); }
    .kicker { color: #E4A03D; font-size: 14px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; }
    /* Kicker de seção NÃO centralizada: cristal à esquerda do texto (padrão do Sinais) */
    .kicker--crystal { display: inline-flex; align-items: center; gap: 8px; }
    .kicker--crystal .diamond { margin-right: 10px; }
    .sec-head { text-align: center; max-width: 780px; margin: 0 auto; display: flex; flex-direction: column; gap: 20px; }
    /* ===== TÍTULO DE SEÇÃO PADRONIZADO =====================================
       Uma classe única para TODOS os títulos de seção: mesma fonte, tamanho,
       peso, linha e espaçamento. Ajuste aqui e muda o site inteiro de uma vez.
       Cor: uma só por título (grafite no fundo claro; branco no fundo escuro).
       Modificador --bordered adiciona o traço dourado à esquerda (bio, sinais). */
    .section-title { font-weight: 300; font-size: clamp(30px, 3.6vw, 44px); line-height: 1.2; letter-spacing: 0; color: #382E2C; text-wrap: pretty; }
    .bg-dark .section-title, .bg-mauve .section-title, .cta-final .section-title { color: #FFFFFF; }
    /* Traço à esquerda com fade tipo .cta-ornament: de baixo pra cima (fraco embaixo, sólido no topo) */
    .section-title--bordered { position: relative; padding-left: 22px; }
    .section-title--bordered::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 2px; border-radius: 2px; background: linear-gradient(to top, rgba(228, 160, 61, .15), #E4A03D); }
    /* ===== DESCRIÇÃO DE SEÇÃO PADRONIZADA =================================
       O parágrafo de apoio logo após o título: mesma fonte, tamanho (18px) e
       espaçamento em todas as seções. Ajuste aqui e muda o site inteiro.
       Cor: grafite-suave no fundo claro; creme no fundo escuro. */
    .section-desc { font-weight: 400; font-size: 18px; line-height: 1.7; letter-spacing: 0; color: #857874; text-wrap: pretty; }
    .bg-dark .section-desc, .bg-mauve .section-desc, .cta-final .section-desc { color: #e3d7cb; }

    /* Botões */
    .btn-wa { display: inline-flex; align-items: center; gap: 10px; background: #25D366; color: #FFFFFF; font-weight: 600; font-size: 15px; padding: 16px 30px; border-radius: 999px; transition: background .2s, transform .2s; }
    .btn-wa:hover { background: #1EBE57; color: #FFFFFF; transform: translateY(-2px); }
    .btn-wa--lg { font-size: 16px; padding: 18px 34px; gap: 12px; box-shadow: 0 10px 30px rgba(37, 211, 102, .25); }
    .btn-wa--xl { font-size: 17px; padding: 20px 40px; gap: 12px; box-shadow: 0 12px 34px rgba(37, 211, 102, .3); }
    .btn-gold { display: inline-flex; align-items: center; gap: 10px; background: #E4A03D; color: #382E2C; font-weight: 600; font-size: 15px; padding: 16px 30px; border-radius: 999px; transition: background .2s, transform .2s; }
    .btn-gold:hover { background: #d18f2d; color: #382E2C; transform: translateY(-2px); }
    .btn-wa svg, .btn-gold svg { flex: 0 0 auto; }
    /* No mobile, todo botao de WhatsApp fica centralizado no seu container */
    @media (max-width: 899px) {
      .btn-wa:not(.btn-wa--block) { display: flex; width: fit-content; max-width: 100%; margin-left: auto; margin-right: auto; }
    }

    /* Losango decorativo */
    .diamond { width: 10px; height: 10px; background: #E4A03D; border-radius: 2px; transform: rotate(45deg); flex: 0 0 auto; }
    .diamond--sm { width: 6px; height: 6px; border-radius: 1px; }

    /* Fade-up (só esconde com JS ativo; sem JS, tudo visível) */
    @keyframes fadeUp { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
    html.js [data-fade] { opacity: 0; }
    html.js [data-fade].is-in { animation: fadeUp .7s ease both; }
    @media (prefers-reduced-motion: reduce) { html.js [data-fade] { opacity: 1; } html.js [data-fade].is-in { animation: none; } }

    /* ---------- Nav ---------- */
    .nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; background: rgba(56, 46, 44, .55); box-shadow: none; transition: background .3s ease, box-shadow .3s ease; }
    /* Vidro fosco da barra num pseudo, para a .nav NAO virar containing block do painel fixed (mobile) */
    .nav::before { content: ""; position: absolute; inset: 0; z-index: -1; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); pointer-events: none; }
    .nav.is-scrolled { background: rgba(56, 46, 44, .92); box-shadow: 0 4px 24px rgba(0, 0, 0, .25); }
    .nav__inner { max-width: var(--container); margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 14px var(--gutter); }
    .nav__logo img { height: 46px; width: auto; }
    .nav__links { display: flex; gap: clamp(16px, 3vw, 36px); align-items: center; flex-wrap: nowrap; justify-content: center; }
    .nav__links a { color: #e3d7cb; font-size: 13px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }
    .nav__links a:hover { color: #E4A03D; }
    /* Dropdowns da arquitetura (Especialidades, Tratamentos) */
    .nav__item { position: relative; }
    .nav__top { display: inline-flex; align-items: center; gap: 5px; padding: 0; background: none; border: 0; cursor: pointer; font-family: inherit; color: #e3d7cb; font-size: 13px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }
    .nav__top svg { width: 11px; height: 11px; transition: transform .2s; }
    .nav__item:hover .nav__top, .nav__item:focus-within .nav__top { color: #E4A03D; }
    .nav__item:hover .nav__top svg, .nav__item:focus-within .nav__top svg { transform: rotate(180deg); }
    .nav__drop { position: absolute; top: calc(100% + 20px); left: 50%; transform: translateX(-50%) translateY(6px); min-width: 210px; background: rgba(40, 32, 29, .98); backdrop-filter: blur(10px); border: 1px solid rgba(228, 160, 61, .2); border-radius: 12px; padding: 8px; display: flex; flex-direction: column; gap: 2px; opacity: 0; visibility: hidden; transition: opacity .2s, transform .2s, visibility .2s; box-shadow: 0 18px 44px rgba(0, 0, 0, .4); z-index: 60; }
    .nav__drop::before { content: ""; position: absolute; left: 0; right: 0; top: -20px; height: 20px; }
    .nav__item:hover .nav__drop, .nav__item:focus-within .nav__drop { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
    .nav__drop a { color: #e3d7cb; font-size: 12.5px; font-weight: 500; letter-spacing: .03em; text-transform: none; padding: 9px 14px; border-radius: 8px; white-space: nowrap; }
    .nav__drop a:hover { background: rgba(228, 160, 61, .12); color: #E4A03D; }
    .nav__cta { display: inline-flex; align-items: center; gap: 8px; background: #25D366; color: #FFFFFF; font-weight: 600; font-size: 13px; letter-spacing: .03em; padding: 11px 20px; border-radius: 999px; transition: background .2s, transform .2s; }
    .nav__cta:hover { background: #1EBE57; color: #FFFFFF; transform: translateY(-1px); }

    /* Hambúrguer: só aparece no mobile (o painel abre por cima) */
    .nav__toggle { display: none; }
    @media (max-width: 899px) {
      /* Botão hambúrguer -> vira X quando aberto */
      .nav__toggle { display: inline-flex; flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 44px; padding: 0 10px; background: none; border: 0; cursor: pointer; z-index: 130; }
      .nav__toggle span { display: block; width: 24px; height: 2px; border-radius: 2px; background: #EDE3D3; transition: transform .3s ease, opacity .2s ease; }
      .nav.is-open .nav__toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
      .nav.is-open .nav__toggle span:nth-child(2) { opacity: 0; }
      .nav.is-open .nav__toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

      /* CTA inline some no mobile: o botão flutuante já cobre a conversão */
      .nav__cta { display: none; }

      /* Barra combina com o painel enquanto o menu está aberto */
      .nav.is-open { background: rgba(34, 27, 24, .98); }

      /* Painel deslizante à direita */
      .nav__links { position: fixed; top: 0; right: 0; bottom: 0; width: min(84vw, 350px); flex-direction: column; align-items: stretch; justify-content: flex-start; flex-wrap: nowrap; gap: 0; padding: 88px 24px 40px; background: rgba(34, 27, 24, .98); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: -24px 0 60px rgba(0, 0, 0, .45); transform: translateX(100%); transition: transform .34s cubic-bezier(.4, 0, .2, 1); overflow-y: auto; -webkit-overflow-scrolling: touch; z-index: 120; }
      .nav.is-open .nav__links { transform: translateX(0); }

      /* Overlay escuro atrás do painel (pseudo da .nav, que não é transformada) */
      .nav::after { content: ""; position: fixed; inset: 0; background: rgba(0, 0, 0, .5); opacity: 0; visibility: hidden; transition: opacity .34s ease, visibility .34s ease; z-index: -1; }
      .nav.is-open::after { opacity: 1; visibility: visible; }
      /* Botao flutuante do WhatsApp nao pode ficar sobre o painel do menu */
      html.nav-open .wa-float { opacity: 0; visibility: hidden; pointer-events: none; }

      /* Itens do painel: largura cheia, alvos de toque maiores, divisórias sutis */
      .nav__item { width: 100%; }
      .nav__links > a, .nav__top { width: 100%; font-size: 15px; padding: 16px 4px; letter-spacing: .05em; border-bottom: 1px solid rgba(228, 160, 61, .14); }
      .nav__top { justify-content: space-between; }
      .nav__top svg { width: 14px; height: 14px; }
      .nav__item.is-open .nav__top svg { transform: rotate(180deg); }

      /* Dropdowns viram acordeão inline (toque não tem hover) */
      .nav__item:hover .nav__drop, .nav__item:focus-within .nav__drop { transform: none; }
      .nav__drop { position: static; transform: none; visibility: visible; opacity: 1; min-width: 0; background: none; border: 0; box-shadow: none; padding: 0; margin: 0; display: block; overflow: hidden; max-height: 0; transition: max-height .32s ease; }
      .nav__item.is-open .nav__drop { max-height: 460px; }
      .nav__drop::before { display: none; }
      .nav__drop a { display: block; white-space: normal; font-size: 13.5px; padding: 12px 4px 12px 18px; border-bottom: 1px solid rgba(228, 160, 61, .08); }
    }

    /* ---------- Hero ---------- */
    .hero { position: relative; overflow: hidden; background: radial-gradient(135% 130% at 10% 20%, #4a3a30 0%, #382E2C 55%, #2b221f 100%); }
    .hero__inner { position: relative; z-index: 2; max-width: var(--container); margin: 0 auto; width: 100%; padding: clamp(110px, 15vh, 170px) var(--gutter) clamp(56px, 8vh, 90px); }
    .hero__content { max-width: 580px; display: flex; flex-direction: column; gap: 26px; }
    .hero__content h1 { color: #FFFFFF; font-weight: 300; font-size: clamp(30px, 3.8vw, 48px); line-height: 1.16; text-wrap: pretty; }
    .hero__lead { color: #e3d7cb; font-weight: 400; font-size: clamp(16px, 1.5vw, 19px); line-height: 1.7; max-width: 540px; text-wrap: pretty; }
    .hero__cta-wrap { display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }
    .hero__trust { color: #cfbfb0; font-size: 13px; font-weight: 400; letter-spacing: .04em; }
    .hero__auth { margin: 10px 0 0; max-width: 620px; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); }
    .hero__auth-track { display: flex; width: max-content; animation: heroAuthMarquee 26s linear infinite; }
    .hero__auth:hover .hero__auth-track { animation-play-state: paused; }
    .hero__auth-item { display: inline-flex; align-items: center; gap: 9px; color: #d9cabb; font-size: 12.5px; line-height: 1.4; white-space: nowrap; padding-right: 40px; }
    @keyframes heroAuthMarquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
    @media (prefers-reduced-motion: reduce) { .hero__auth-track { animation: none; } }
    /* Foto destacada à direita, recortada com clip-path no desktop */
    .hero__media { position: relative; }
    .hero__media img, .hero__media video { display: block; width: 100%; object-fit: cover; object-position: right top; }
    @media (min-width: 900px) {
      .hero { min-height: 92vh; display: flex; align-items: center; }
      .hero__media { position: absolute; top: 0; right: 0; bottom: 0; width: 60%; z-index: 1; clip-path: ellipse(82% 100% at 100% 44%); background: #E4A03D; }
      .hero__media img, .hero__media video { height: 100%; clip-path: ellipse(calc(82% - 4px) 100% at 100% 44%); }
      .hero__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(56, 46, 44, .92) 0%, rgba(56, 46, 44, 0) 34%); clip-path: ellipse(calc(82% - 4px) 100% at 100% 44%); }
    }
    @media (max-width: 899px) {
      .hero__media { margin-top: 94px; padding: 0 clamp(16px, 4vw, 24px); }
      .hero__media img, .hero__media video { aspect-ratio: 4 / 3; border-radius: 20px; border: 5px solid #FFFFFF; box-shadow: 0 16px 36px rgba(56, 46, 44, .22); }
      .hero__inner { padding-top: 34px; }
    }

    /* ---------- Seções ---------- */
    .section { padding: var(--section-y) var(--gutter); }
    .section__inner { max-width: var(--container); margin: 0 auto; display: flex; flex-direction: column; gap: 56px; }
    .bg-off { background: #F6F6F3; }
    .bg-off2 { background: #F2F2EE; }
    .bg-dark { background: #382E2C; }
    .bg-mauve { background: #857874; }

    /* ---------- Sinais (design da referência aprovada, 24/07) ---------- */
    .cards-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 24px; }
    .bg-warm { background: #F6F0E7; }

    /* Topo em 2 colunas: texto | colagem de fotos */
    .sinais__top { display: grid; gap: 44px; align-items: center; }
    /* Texto gruda ao rolar (só no desktop, onde há coluna alta ao lado).
       align-self: start dá o percurso; sem ele o align-items:center prende no meio.
       top: 90px libera o nav fixo (~74px). */
    .sinais__text { align-self: start; }
    @media (min-width: 900px) {
      .sinais__top { grid-template-columns: 1fr 1.05fr; gap: 56px; }
      .sinais__text { position: sticky; top: 90px; }
    }
    /* Fonte da marca (Montserrat 300), como o hero e as demais seções. */
    /* Só o espaçamento próprio do sinais; tipografia e borda vêm de .section-title(--bordered) */
    .sinais__title { margin: 18px 0 26px; }
    /* Só o limite de largura próprio do sinais; tipografia vem de .section-desc */
    .sinais__text > p { max-width: 52ch; }

    /* Placeholder de foto (até as fotos reais chegarem) */
    .photo-ph { display: grid; place-content: center; justify-items: center; gap: 10px; color: #B39A72; background: linear-gradient(145deg, #EFE3CE, #E2D0B4); }
    .photo-ph svg { width: 44px; height: 44px; opacity: .8; }
    .photo-ph span { font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
    .sinais__media { position: relative; }
    .photo-ph--main { width: 100%; aspect-ratio: 4 / 5; border-radius: 28px; object-fit: cover; display: block; border: 5px solid #FFFFFF; box-shadow: 0 16px 36px rgba(56, 46, 44, .22); }
    /* Selo vira um quadro de foto vertical, sobreposto ao canto da foto principal */
    .sinais__badge { position: absolute; right: 0; bottom: -30px; width: 250px; aspect-ratio: 3 / 4; border-radius: 18px; overflow: hidden; border: 5px solid #FFFFFF; box-shadow: 0 16px 36px rgba(56, 46, 44, .22); background: linear-gradient(145deg, #EFE3CE, #E2D0B4); }
    .sinais__badge img { width: 100%; height: 100%; object-fit: cover; display: block; }
    @media (max-width: 899px) { .sinais__badge { right: 6px; bottom: -18px; width: 200px; } }

    /* Grade dos sinais: 3 colunas no desktop, 2 no mobile (só desta seção). */
    .sinais__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
    @media (min-width: 900px) { .sinais__grid { grid-template-columns: repeat(3, 1fr); gap: 24px; } }

    /* Cards horizontais: ícone em círculo creme + título + tracinho + texto */
    .card-sinal { background: #FFFFFF; border-radius: 16px; padding: 26px; box-shadow: 0 4px 20px rgba(56, 46, 44, .06); display: flex; gap: 20px; align-items: flex-start; transition: transform .25s, box-shadow .25s; }
    .card-sinal:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(56, 46, 44, .1); }
    .card-sinal__icon { flex: 0 0 auto; width: 84px; height: 84px; border-radius: 50%; background: #F4EADB; display: grid; place-items: center; color: #C9861F; }
    .card-sinal__icon svg { width: 40px; height: 40px; }
    .card-sinal h3 { font-weight: 600; font-size: 17px; color: #382E2C; line-height: 1.35; }
    .card-sinal .dash { display: block; width: 26px; height: 3px; border-radius: 3px; background: #D9A144; margin: 10px 0 12px; }
    .card-sinal p { color: #857874; font-weight: 400; font-size: 14.5px; line-height: 1.7; }
    /* Mobile: card em coluna (ícone no topo, título, descrição). */
    @media (max-width: 899px) {
      .card-sinal { flex-direction: column; gap: 12px; padding: 20px 18px; }
      .card-sinal__icon { width: 60px; height: 60px; }
      .card-sinal__icon svg { width: 30px; height: 30px; }
      .card-sinal h3 { font-size: 15.5px; }
      .card-sinal p { font-size: 13.5px; }
    }

    /* CTA WhatsApp (igual ao hero) flanqueado por linhas com losango */
    .sinais__cta { display: flex; align-items: center; gap: 18px; }
    .sinais__cta .rule { flex: 1; height: 1px; background: #D9B27A; position: relative; }
    .sinais__cta .rule::after { content: ""; position: absolute; top: -3px; width: 7px; height: 7px; background: #D9A144; border-radius: 1px; transform: rotate(45deg); }
    .rule--l::after { right: 0; }
    .rule--r::after { left: 0; }
    .section__cta { text-align: center; }


    /* Diagrama de convergência: 3 especialidades -> saúde integrada.
       Cores da marca (ouro #E4A03D / #C9861F sobre o grafite). Linhas em
       SVG com vector-effect:non-scaling-stroke, então preserveAspectRatio
       "none" estica só a geometria e o traço fica sempre fino (1px). */
    .integra { max-width: 640px; margin: 0 auto; width: 100%; }
    .integra__nodes { display: grid; grid-template-columns: repeat(3, 1fr); }
    .integra__node { display: flex; flex-direction: column; align-items: center; gap: 12px; }
    .integra__dia { width: 14px; height: 14px; border: 1.5px solid #E4A03D; border-radius: 3px; transform: rotate(45deg); }
    .integra__label { font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: #E4A03D; }
    .integra__lines-wrap { position: relative; }
    .integra__lines { display: block; width: 100%; height: 74px; }
    .integra__lines path { fill: none; stroke: #C9861F; stroke-width: 1; vector-effect: non-scaling-stroke; }
    .integra__line { opacity: .45; }
    /* Energia fluindo de cada nó até o centro (brilho que desce pela linha) */
    .integra__flow { stroke: #F2C879; stroke-width: 1.4; stroke-linecap: round; opacity: .9; stroke-dasharray: 2 96; animation: integraFlow 2.2s linear infinite; }
    @keyframes integraFlow { from { stroke-dashoffset: 0; } to { stroke-dashoffset: -98; } }
    /* Aura + órbitas pulsando no ponto de convergência */
    .integra__aura { position: absolute; left: 50%; bottom: 0; transform: translate(-50%, 50%); width: 0; height: 0; pointer-events: none; }
    .integra__ring { position: absolute; left: 50%; top: 50%; border: 1px solid rgba(228, 160, 61, .4); border-radius: 50%; transform: translate(-50%, -50%); }
    .integra__ring:nth-child(1) { width: 96px; height: 32px; animation: integraAura 2.4s ease-in-out infinite; }
    .integra__ring:nth-child(2) { width: 150px; height: 50px; animation: integraAura 2.4s ease-in-out infinite .35s; }
    .integra__spark { position: absolute; left: 50%; top: 50%; width: 14px; height: 14px; border-radius: 50%; transform: translate(-50%, -50%); background: radial-gradient(circle, rgba(246, 210, 140, .95), rgba(228, 160, 61, .3) 55%, transparent 70%); animation: integraSpark 2.2s ease-in-out infinite; }
    @keyframes integraAura { 0%, 100% { opacity: .22; transform: translate(-50%, -50%) scale(1); } 50% { opacity: .6; transform: translate(-50%, -50%) scale(1.14); } }
    @keyframes integraSpark { 0%, 100% { opacity: .55; transform: translate(-50%, -50%) scale(1); } 50% { opacity: 1; transform: translate(-50%, -50%) scale(1.35); } }
    @media (prefers-reduced-motion: reduce) { .integra__flow { animation: none; opacity: 0; } .integra__ring, .integra__spark { animation: none; } }
    /* Telas estreitas: rótulos menores para não estourar as 3 colunas do diagrama */
    @media (max-width: 480px) { .integra__label { font-size: 10px; letter-spacing: .08em; } .integra__lines { height: 56px; } }
    .integra__base { position: relative; z-index: 2; display: inline-flex; align-items: center; margin: 0 auto; padding: 10px 22px; background: #382E2C; border: 1px solid rgba(228, 160, 61, .35); border-radius: 999px; font-size: 12px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: #E4A03D; }
    .integra__base-wrap { text-align: center; }

    /* Pilares abertos (sem card), divididos por linhas finas */
    .pilares { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(228, 160, 61, .26); }
    .pilar { position: relative; text-align: center; padding: 46px 30px 6px; display: flex; flex-direction: column; align-items: center; gap: 18px; }
    .pilar + .pilar { border-left: 1px solid rgba(228, 160, 61, .16); }
    .pilar__mark { position: absolute; top: -5.5px; left: 50%; width: 9px; height: 9px; background: #E4A03D; border-radius: 2px; transform: translateX(-50%) rotate(45deg); }
    .pilar__badge { width: 62px; height: 62px; border: 1.5px solid rgba(228, 160, 61, .5); border-radius: 8px; transform: rotate(45deg); display: grid; place-items: center; }
    .pilar__badge svg { width: 26px; height: 26px; color: #E4A03D; transform: rotate(-45deg); }
    .pilar h3 { font-weight: 500; font-size: 19px; color: #FFFFFF; letter-spacing: .01em; }
    .pilar p { color: #D7D2CB; font-weight: 300; font-size: 14.5px; line-height: 1.75; }
    @media (max-width: 780px) {
      .pilares { grid-template-columns: 1fr; }
      .pilar + .pilar { border-left: 0; border-top: 1px solid rgba(228, 160, 61, .16); }
      .pilar__mark { display: none; }
    }

    .quote-line { text-align: center; font-style: italic; font-weight: 300; font-size: clamp(19px, 2vw, 24px); color: #e3d7cb; letter-spacing: .02em; }

    /* Bio (fundo mauve) */
    .bio__inner { max-width: var(--container); margin: 0 auto; display: flex; flex-wrap: wrap; gap: clamp(32px, 5vw, 72px); align-items: flex-start; }
    .bio__media { flex: 1 1 340px; min-width: 280px; display: flex; flex-direction: column; gap: 16px; }

    /* Fachada de vídeo VERTICAL. O link chega depois: basta colar em data-src
       (no HTML) que o clique/Enter injeta o <video> e toca. Sem link, o play
       fica como cartaz decorativo sobre o retrato. */
    .bio__video { position: relative; width: 100%; aspect-ratio: 4 / 5; border-radius: 16px; overflow: hidden; background: #2b2320; box-shadow: 0 20px 50px rgba(56, 46, 44, .35); cursor: pointer; border: 5px solid #FFFFFF; }
    .bio__video img, .bio__video video { width: 100%; height: 100%; object-fit: cover; display: block; }
    .bio__play { position: absolute; inset: 0; margin: auto; width: 78px; height: 78px; border-radius: 50%; border: 1.5px solid rgba(228, 160, 61, .75); background: rgba(56, 46, 44, .42); display: grid; place-items: center; transition: transform .2s, background .2s; }
    .bio__video:hover .bio__play { transform: scale(1.06); background: rgba(56, 46, 44, .58); }
    .bio__play svg { width: 26px; height: 26px; color: #F2E4CB; margin-left: 3px; }
    .bio__video.is-playing .bio__play, .endereco__thumb--video.is-playing .endereco__play { display: none; }
    .bio__slides { position: relative; width: 100%; aspect-ratio: 4 / 5; border-radius: 16px; overflow: hidden; background: #2b2320; box-shadow: 0 20px 50px rgba(56, 46, 44, .35); border: 5px solid #FFFFFF; }
    .bio__slides img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 1s ease; }
    .bio__slides img.is-active { opacity: 1; }

    /* Selos abaixo do vídeo, 50/50 (saíram de cima da imagem para não cobrir o play) */
    .bio__stats { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
    .bio__stat { background: #FFFFFF; border: 1px solid rgba(56, 46, 44, .08); border-radius: 12px; padding: 20px 18px; display: flex; flex-direction: column; gap: 8px; box-shadow: 0 10px 26px rgba(56, 46, 44, .10); }
    .bio__stat svg { width: 22px; height: 22px; color: #C9861F; }
    .bio__stat strong { font-weight: 600; font-size: 22px; color: #382E2C; line-height: 1; }
    .bio__stat span { font-weight: 400; font-size: 13px; color: #57493f; line-height: 1.4; }

    .bio__body { flex: 1.4 1 440px; display: flex; flex-direction: column; gap: 22px; }


    /* Credenciais: mais respiro, fonte um pouco maior e linha embaixo de cada item */
    .bio__creds { display: flex; flex-direction: column; }
    .bio__cred { display: flex; align-items: baseline; gap: 14px; color: #F2F2EE; font-size: 15px; font-weight: 400; line-height: 1.5; padding: 14px 2px; border-bottom: 1px solid rgba(228, 160, 61, .16); }
    .bio__cred .diamond--sm { transform: rotate(45deg) translateY(-1px); }
    @media (max-width: 560px) { .bio__stats { grid-template-columns: 1fr; } }
    /* Vídeo + selos grudam enquanto a coluna de texto (mais alta) rola.
       Só no desktop, onde as colunas ficam lado a lado; empilhado não faz sentido.
       align-self:flex-start impede o item flex de esticar e dá percurso à sticky. */
    @media (min-width: 900px) { .bio__media { position: sticky; top: 90px; align-self: flex-start; } }

    /* Depoimentos */
    /* Card de depoimento (só o LAYOUT da referência, tipografia da marca):
       creme arredondado, aspas grandes no topo, citação em Montserrat itálico,
       nome com traço dourado. */
    .card-depo { position: relative; background: #FBFAF7; border: 1px solid rgba(56, 46, 44, .07); border-radius: 20px; padding: 32px 32px 30px; display: flex; flex-direction: column; gap: 20px; }
    .card-depo__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
    .card-depo__stars { color: #E4A03D; font-size: 15px; letter-spacing: 3px; line-height: 1; }
    .card-depo__tag { background: #F1EBE1; color: #9A8B80; font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; padding: 7px 14px; border-radius: 999px; }
    .card-depo__qm { font-weight: 700; font-size: 60px; line-height: .8; color: #E7DDCB; flex: 0 0 auto; user-select: none; }
    .card-depo blockquote { font-style: italic; color: #382E2C; font-weight: 400; font-size: 15.5px; line-height: 1.8; }
    .card-depo figcaption { display: flex; align-items: center; gap: 12px; margin-top: auto; color: #382E2C; font-weight: 600; font-size: 14px; letter-spacing: .03em; }
    .card-depo figcaption::before { content: ""; width: 22px; height: 2px; background: #C9861F; flex: 0 0 auto; }
    /* Limita a altura do depoimento; botao "Ver mais" injetado via JS quando o texto estoura */
    .card-depo:not(.is-expanded) blockquote { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
    .card-depo__more { align-self: flex-start; margin-top: -8px; background: none; border: 0; padding: 0; font-family: inherit; font-size: 13px; font-weight: 600; letter-spacing: .02em; color: #C9861F; cursor: pointer; transition: color .2s; }
    .card-depo__more:hover { color: #E4A03D; }
    /* 3 col no desktop, 2 no mobile; 1 col só em telas bem estreitas (texto longo). */
    /* Swiper de depoimentos: setas + marquee (auto-scroll leve). Sem
       scroll-behavior:smooth no CSS (senão o auto-scroll trava); as setas usam
       scrollBy suave via JS. */
    .depo-swiper { position: relative; }
    .depo-track { display: flex; gap: 24px; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; padding: 6px 2px; }
    .depo-track::-webkit-scrollbar { display: none; }
    .depo-track .card-depo { flex: 0 0 calc(66.666% - 12px); }
    @media (min-width: 640px) { .depo-track .card-depo { flex-basis: calc(40% - 15px); } }
    .depo-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(56, 46, 44, .1); background: #FFFFFF; color: #C9861F; display: grid; place-items: center; cursor: pointer; box-shadow: 0 8px 22px rgba(56, 46, 44, .14); transition: background .2s, transform .2s; }
    .depo-arrow:hover { background: #F4EADB; transform: translateY(-50%) scale(1.06); }
    .depo-arrow svg { width: 20px; height: 20px; }
    .depo-arrow--prev { left: -4px; }
    .depo-arrow--next { right: -4px; }
    @media (max-width: 620px) { .depo-arrow { display: none; } }

    /* Como funciona: 4 cards com badge numerado no topo */
    .etapas { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 48px 24px; padding-top: 32px; }
    .etapa { position: relative; background: #FBFAF7; border: 1px solid rgba(56, 46, 44, .07); border-radius: 20px; padding: 46px 26px 30px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 16px; box-shadow: 0 10px 30px rgba(56, 46, 44, .06); }
    .etapa__num { position: absolute; top: -32px; left: 50%; transform: translateX(-50%); width: 56px; height: 56px; border: 2px solid #E4A03D; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #FFFFFF; color: #C9861F; font-weight: 600; font-size: 18px; box-shadow: 0 0 0 6px #FFFFFF, 0 6px 16px rgba(201, 134, 31, .18); }
    .etapa__icon { width: 64px; height: 64px; border-radius: 50%; background: #F4EADB; display: grid; place-items: center; color: #C9861F; margin-top: 4px; }
    .etapa__icon svg { width: 28px; height: 28px; }
    .etapa h3 { display: flex; flex-direction: column; align-items: center; gap: 14px; font-weight: 600; font-size: 17px; color: #382E2C; letter-spacing: .01em; }
    .etapa h3::after { content: ""; width: 40px; height: 1px; background: rgba(228, 160, 61, .45); }
    .etapa p { color: #857874; font-weight: 400; font-size: 14.5px; line-height: 1.7; }
    @media (max-width: 899px) { .etapas { grid-template-columns: repeat(2, 1fr); } }
    @media (max-width: 560px) { .etapas { grid-template-columns: 1fr; } }
    .cta-stack { display: flex; flex-direction: column; gap: 24px; align-items: center; }
    /* Selo de retorno em pill, com "30 dias" em destaque dourado */
    .badge-retorno { display: inline-flex; align-items: center; gap: 12px; background: #F4EADB; color: #382E2C; font-weight: 400; font-size: 15px; padding: 16px 26px; border-radius: 999px; text-align: center; }
    .badge-retorno svg { width: 20px; height: 20px; color: #C9861F; flex: 0 0 auto; }
    .badge-retorno strong { font-weight: 700; color: #C9861F; }
    .cta-note { display: inline-flex; align-items: center; gap: 10px; color: #857874; font-size: 13px; }
    .cta-note svg { width: 16px; height: 16px; padding: 7px; border: 1.5px solid rgba(228, 160, 61, .55); border-radius: 50%; color: #E4A03D; box-sizing: content-box; flex: 0 0 auto; }

    /* Endereço */
    .endereco__inner { max-width: var(--container); margin: 0 auto; display: flex; flex-wrap: wrap; gap: clamp(32px, 5vw, 64px); align-items: flex-start; }
    /* Coluna de mídia: mapa + galeria de 3 miniaturas + legenda */
    .endereco__media { flex: 1 1 460px; min-width: 300px; display: flex; flex-direction: column; gap: 18px; }
    .endereco__map { position: relative; }
    .endereco__map iframe, .endereco__map img { border: 0; border-radius: 16px; display: block; box-shadow: 0 12px 34px rgba(56, 46, 44, .12); width: 100%; height: 480px; object-fit: cover; }
    /* Borda branca interna para destacar o mapa (pointer-events none: mapa segue usável) */
    .endereco__map::after { content: ""; position: absolute; inset: 0; border: 6px solid rgba(255, 255, 255, .9); border-radius: 16px; pointer-events: none; }
    /* Galeria (placeholders até as fotos reais chegarem) */
    /* Galeria em swiper (setas + swipe), pronta para várias imagens */
    .endereco__gallery-swiper { position: relative; }
    .endereco__gallery { display: flex; gap: 12px; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; }
    .endereco__gallery::-webkit-scrollbar { display: none; }
    .endereco__thumb { position: relative; flex: 0 0 clamp(150px, 46%, 190px); aspect-ratio: 4 / 3; border-radius: 12px; background: #E7DDCB; overflow: hidden; border: 5px solid #FFFFFF; }
    .gal-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(56, 46, 44, .1); background: #FFFFFF; color: #C9861F; display: grid; place-items: center; cursor: pointer; box-shadow: 0 6px 18px rgba(56, 46, 44, .16); }
    .gal-arrow:hover { background: #F4EADB; }
    .gal-arrow svg { width: 18px; height: 18px; }
    .gal-arrow--prev { left: -6px; }
    .gal-arrow--next { right: -6px; }
    .endereco__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .endereco__thumb--photo { display: grid; place-items: center; color: rgba(56, 46, 44, .3); }
    .endereco__thumb--photo svg { width: 30px; height: 30px; }
    .endereco__thumb--video { background: #2b2320; cursor: pointer; }
    .endereco__thumb--video img, .endereco__thumb--video video { width: 100%; height: 100%; object-fit: cover; display: block; }
    .endereco__play { position: absolute; inset: 0; margin: auto; width: 48px; height: 48px; border-radius: 50%; border: 1.5px solid rgba(255, 255, 255, .85); background: rgba(56, 46, 44, .4); display: grid; place-items: center; }
    .endereco__play svg { width: 18px; height: 18px; color: #FFFFFF; margin-left: 2px; }
    .endereco__tourlabel { position: absolute; left: 12px; bottom: 10px; right: 12px; color: #FFFFFF; }
    .endereco__tourlabel strong { display: block; font-weight: 600; font-size: 12.5px; }
    .endereco__tourlabel span { font-size: 11px; color: rgba(255, 255, 255, .8); }
    .endereco__dur { position: absolute; right: 10px; top: 10px; background: rgba(0, 0, 0, .55); color: #FFFFFF; font-size: 11px; font-weight: 500; padding: 3px 8px; border-radius: 6px; }
    /* Legenda sob a galeria */
    .endereco__caption { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding-top: 2px; }
    .endereco__caption-title { display: inline-flex; align-items: center; gap: 8px; color: #C9861F; font-weight: 600; font-size: 14px; }
    .endereco__caption-title svg { width: 18px; height: 18px; }
    .endereco__caption > span:last-child { color: #857874; font-size: 13.5px; }
    /* Corpo */
    .endereco__body { flex: 1 1 380px; display: flex; flex-direction: column; gap: 22px; }
    .endereco__infos { display: flex; flex-direction: column; gap: 22px; border-top: 1px solid #D7D2CB; padding-top: 26px; }
    .endereco__info { display: flex; gap: 16px; align-items: flex-start; }
    .endereco__info-icon { width: 54px; height: 54px; border-radius: 50%; border: 1.5px solid rgba(228, 160, 61, .55); color: #C9861F; display: grid; place-items: center; flex: 0 0 auto; }
    .endereco__info-icon svg { width: 27px; height: 27px; }
    .endereco__info h3 { font-weight: 600; font-size: 13px; color: #382E2C; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 5px; }
    .endereco__info-text > div { color: #857874; font-size: 14.5px; line-height: 1.6; }
    .endereco__note { display: inline-flex; align-items: center; gap: 10px; color: #857874; font-size: 13px; }
    .endereco__note svg { width: 16px; height: 16px; padding: 7px; border: 1.5px solid rgba(228, 160, 61, .55); border-radius: 50%; color: #E4A03D; box-sizing: content-box; flex: 0 0 auto; }
    .btn-wa--block { width: 100%; justify-content: center; }
    @media (max-width: 560px) { .endereco__thumb { flex-basis: 62%; } }
    /* Galeria do endereço: hover "+" e lightbox fullscreen */
    .endereco__thumb:has(img) { cursor: zoom-in; }
    .endereco__thumb:has(img)::before { content: ""; position: absolute; inset: 0; background: rgba(56, 46, 44, .34); opacity: 0; transition: opacity .25s; z-index: 1; pointer-events: none; }
    .endereco__thumb:has(img)::after { content: "+"; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; color: #fff; font-size: 40px; font-weight: 200; line-height: 1; opacity: 0; transition: opacity .25s; pointer-events: none; }
    .endereco__thumb:has(img):hover::before, .endereco__thumb:has(img):hover::after { opacity: 1; }
    .lightbox { position: fixed; inset: 0; z-index: 300; background: rgba(20, 15, 13, .93); display: none; align-items: center; justify-content: center; padding: clamp(16px, 4vw, 48px); }
    .lightbox.is-open { display: flex; }
    .lightbox__img { max-width: 92vw; max-height: 88vh; border-radius: 8px; box-shadow: 0 24px 70px rgba(0, 0, 0, .55); object-fit: contain; }
    .lightbox__btn { position: absolute; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .25); color: #fff; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; cursor: pointer; transition: background .2s; }
    .lightbox__btn:hover { background: rgba(255, 255, 255, .24); }
    .lightbox__btn svg { width: 22px; height: 22px; }
    .lightbox__close { top: 20px; right: 22px; }
    .lightbox__nav--prev { left: 20px; top: 50%; transform: translateY(-50%); }
    .lightbox__nav--next { right: 20px; top: 50%; transform: translateY(-50%); }
    @media (max-width: 560px) { .lightbox__nav--prev { left: 8px; } .lightbox__nav--next { right: 8px; } .lightbox__btn { width: 40px; height: 40px; } }
    @media (max-width: 700px) { .endereco__map iframe, .endereco__map img { height: 340px; } }

    /* FAQ */
    .faq-wrap { max-width: 1180px; margin: 0 auto; display: flex; flex-direction: column; gap: 48px; }
    /* Duas colunas: aside de ajuda | accordion */
    .faq-cols { display: grid; grid-template-columns: 300px 1fr; gap: 24px; align-items: start; }
    /* Aside (card branco com sub-card de privacidade) */
    .faq-aside { background: #FFFFFF; border: 1px solid rgba(56, 46, 44, .07); border-radius: 20px; box-shadow: 0 10px 30px rgba(56, 46, 44, .06); padding: 36px 26px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 16px; }
    .faq-help__icon { width: 68px; height: 68px; border-radius: 50%; border: 1.5px solid rgba(228, 160, 61, .55); color: #C9861F; display: grid; place-items: center; }
    .faq-help__icon svg { width: 34px; height: 34px; }
    .faq-aside h3 { font-weight: 600; font-size: 19px; color: #382E2C; line-height: 1.3; }
    .faq-aside > p { color: #857874; font-weight: 400; font-size: 14px; line-height: 1.7; }
    @media (min-width: 860px) { .faq-aside { position: sticky; top: 90px; } }
    .faq-help__rule { width: 40px; height: 1px; background: rgba(228, 160, 61, .5); margin: 2px 0; }
    .faq-privacy { margin-top: 6px; width: 100%; background: #F4EADB; border-radius: 14px; padding: 22px 20px; display: flex; flex-direction: column; align-items: center; gap: 8px; }
    .faq-privacy__icon { width: 44px; height: 44px; border-radius: 50%; border: 1.5px solid rgba(201, 134, 31, .5); color: #C9861F; display: grid; place-items: center; }
    .faq-privacy__icon svg { width: 24px; height: 24px; color: #C9861F; }
    .faq-privacy strong { font-weight: 600; font-size: 15px; color: #382E2C; line-height: 1.3; }
    .faq-privacy span { color: #857874; font-size: 13px; line-height: 1.6; }
    /* Accordion com badge numerado e toggle +/- */
    .faq-list { display: flex; flex-direction: column; gap: 14px; }
    .faq-list details { background: #FFFFFF; border: 1px solid rgba(56, 46, 44, .06); border-radius: 16px; box-shadow: 0 6px 20px rgba(56, 46, 44, .05); overflow: hidden; }
    .faq-list summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 16px; padding: 20px 26px; color: #382E2C; font-weight: 500; font-size: 15.5px; line-height: 1.5; }
    .faq-list summary::-webkit-details-marker { display: none; }
    .faq-num { flex: 0 0 auto; width: 38px; height: 38px; border-radius: 50%; border: 1.5px solid rgba(228, 160, 61, .6); color: #C9861F; display: grid; place-items: center; font-size: 13px; font-weight: 600; }
    .faq-q { flex: 1; }
    .faq-list summary::after { content: "+"; color: #C9861F; font-size: 24px; font-weight: 300; line-height: 1; flex: 0 0 auto; }
    .faq-list details[open] summary::after { content: "\2212"; }
    .faq-list details[open] summary { border-bottom: 1px solid rgba(56, 46, 44, .08); }
    .faq-list details p { padding: 18px 26px 24px 80px; color: #857874; font-weight: 400; font-size: 14.5px; line-height: 1.8; }
    @media (max-width: 860px) { .faq-cols { grid-template-columns: 1fr; } .faq-list details p { padding-left: 26px; } }

    /* CTA final */
    .cta-final { position: relative; overflow: hidden; background: radial-gradient(120% 90% at 50% 0%, #4a3a30 0%, #382E2C 55%, #2b221f 100%); padding: clamp(80px, 12vw, 140px) var(--gutter); }
    .cta-final__inner { position: relative; max-width: 820px; margin: 0 auto; text-align: center; display: flex; flex-direction: column; gap: 22px; align-items: center; }
    .cta-ornament { display: flex; align-items: center; justify-content: center; gap: 16px; }
    .cta-ornament__line { width: 70px; height: 1px; background: linear-gradient(90deg, transparent, rgba(228, 160, 61, .6)); }
    .cta-ornament__line--r { background: linear-gradient(90deg, rgba(228, 160, 61, .6), transparent); }
    .cta-ornament__dot { width: 8px; height: 8px; background: #E4A03D; border-radius: 2px; transform: rotate(45deg); }
    .cta-final__rule { position: relative; width: 130px; height: 1px; background: linear-gradient(90deg, transparent, rgba(228, 160, 61, .5), transparent); margin: 2px 0; }
    .cta-final__rule::before { content: ""; position: absolute; left: 50%; top: 50%; width: 5px; height: 5px; background: #E4A03D; border-radius: 1px; transform: translate(-50%, -50%) rotate(45deg); }
    .cta-final__btn { box-shadow: none; }
    .cta-final__note { display: inline-flex; align-items: center; gap: 8px; color: #cfbfb0; font-size: 13px; font-weight: 400; letter-spacing: .04em; }
    .cta-final__note svg { width: 15px; height: 15px; color: #C9861F; flex: 0 0 auto; }

    /* Footer */
    .footer { background: #382E2C; padding: clamp(48px, 7vw, 80px) var(--gutter) 32px; }
    .footer__inner { max-width: var(--container); margin: 0 auto; display: flex; flex-direction: column; gap: 44px; }
    .footer__grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 40px; }
    .footer__nav { display: flex; flex-direction: column; gap: 9px; }
    .footer__nav a { color: #D7D2CB; font-size: 13.5px; font-weight: 300; }
    .footer__nav a:hover { color: #E4A03D; }
    @media (max-width: 980px) { .footer__grid { grid-template-columns: 1fr 1fr; } }
    .footer__col { display: flex; flex-direction: column; gap: 14px; }
    .footer__col .kicker { letter-spacing: .18em; }
    .footer__wordmark { font-weight: 600; font-size: 16px; letter-spacing: .16em; text-transform: uppercase; color: #EDE3D3; }
    .footer__tagline { font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; color: #a99a8e; margin-top: -6px; }
    .footer__sparkle { width: 46px; height: 1px; background: linear-gradient(90deg, rgba(228, 160, 61, .6), transparent); margin: 2px 0; }
    .footer__text { color: #D7D2CB; font-size: 13.5px; line-height: 1.8; font-weight: 300; }
    .footer__row { display: flex; align-items: flex-start; gap: 12px; color: #D7D2CB; font-size: 13.5px; font-weight: 300; line-height: 1.7; }
    .footer__ico { flex: 0 0 auto; color: #C9861F; margin-top: 1px; }
    .footer__ico svg { width: 17px; height: 17px; display: block; }
    a.footer__row:hover, a.footer__row:hover .footer__ico { color: #E4A03D; }
    .footer__social { display: flex; gap: 12px; margin-top: 4px; }
    .footer__social a { width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(228, 160, 61, .4); color: #C9861F; display: grid; place-items: center; transition: background .2s, color .2s; }
    .footer__social a:hover { background: rgba(228, 160, 61, .15); color: #E4A03D; }
    .footer__social svg { width: 17px; height: 17px; }
    .footer__divider { height: 1px; background: rgba(215, 210, 203, .15); }
    .footer__legal { text-align: center; color: #a89b8f; font-size: 11.5px; font-weight: 400; letter-spacing: .06em; line-height: 1.7; }
    .footer__logo img { height: 56px; width: auto; display: block; }
    @media (max-width: 720px) {
      .footer__grid { grid-template-columns: 1fr; justify-items: center; }
      .footer__col { align-items: center; text-align: center; }
      .footer__nav { align-items: center; }
      .footer__row { justify-content: center; }
      .footer__social { justify-content: center; }
    }

    /* WhatsApp flutuante */
    @keyframes waPulse { 0% { box-shadow: 0 6px 24px rgba(37,211,102,.35), 0 0 0 0 rgba(37,211,102,.45); } 25% { box-shadow: 0 6px 24px rgba(37,211,102,.35), 0 0 0 18px rgba(37,211,102,0); } 100% { box-shadow: 0 6px 24px rgba(37,211,102,.35), 0 0 0 0 rgba(37,211,102,0); } }
    .wa-float { position: fixed; right: 24px; bottom: 24px; z-index: 200; width: 64px; height: 64px; background: #25D366; border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 24px rgba(37, 211, 102, .35); animation: waPulse 4s ease-out infinite; transition: background .2s, transform .2s; }
    .wa-float:hover { background: #1EBE57; transform: scale(1.06); }
    @media (prefers-reduced-motion: reduce) { .wa-float { animation: none; } }

    /* ===== Card de post (blog): grade responsiva de artigos ===================
       Segue a superfície de card do brandbook (branco/creme, raio 20, sombra suave). */
    .post-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; }
    .post-card { display: flex; flex-direction: column; background: #FBFAF7; border: 1px solid rgba(56, 46, 44, .07); border-radius: 20px; overflow: hidden; box-shadow: 0 10px 30px rgba(56, 46, 44, .06); transition: transform .25s, box-shadow .25s; }
    .post-card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(56, 46, 44, .1); }
    .post-card__media { aspect-ratio: 16 / 10; overflow: hidden; }
    .post-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s; }
    .post-card:hover .post-card__media img { transform: scale(1.04); }
    .post-card__body { display: flex; flex-direction: column; gap: 10px; padding: 24px 24px 26px; flex: 1; }
    .post-card__meta { color: #C9861F; font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
    .post-card__body h3 { font-weight: 600; font-size: 17px; line-height: 1.35; color: #382E2C; }
    .post-card__body p { color: #857874; font-size: 14.5px; line-height: 1.7; }
    .post-card__link { margin-top: auto; padding-top: 6px; display: inline-flex; align-items: center; gap: 8px; color: #C9861F; font-size: 13.5px; font-weight: 600; }
    .post-card__link::after { content: "\2192"; transition: transform .2s; }
    .post-card:hover .post-card__link::after { transform: translateX(4px); }

    /* Link com seta dentro de um card de sinal/área (usado na home) */
    .card-sinal__link { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; color: #C9861F; font-size: 13px; font-weight: 600; }
    .card-sinal__link::after { content: "\2192"; transition: transform .2s; }
    a.card-sinal { text-decoration: none; }
    a.card-sinal:hover .card-sinal__link::after { transform: translateX(4px); }

    /* ============================================================
       LANDING (páginas de condição/tratamento) — componentes reusáveis.
       O tipo "landing" é consistente entre si de propósito (padrão de SEO).
       ============================================================ */
    /* Breadcrumb */
    .crumbs { position: relative; max-width: var(--container); margin: 0 auto; padding: 16px var(--gutter) 0; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 13px; color: #857874; }
    .crumbs::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; transform: translateX(-50%); width: 100vw; background: #F6F0E7; z-index: -1; }
    .crumbs a { color: #C9861F; }
    .crumbs .sep { color: rgba(133, 120, 116, .5); }
    /* "Você se identifica?" — checklist de sintomas em 2 colunas */
    .checklist { display: grid; grid-template-columns: 1fr; gap: 12px; max-width: 880px; margin: 4px auto 0; }
    .checklist__item { display: flex; gap: 14px; align-items: flex-start; background: #FFFFFF; border: 1px solid rgba(56, 46, 44, .07); border-radius: 14px; padding: 18px 20px; box-shadow: 0 6px 18px rgba(56, 46, 44, .05); }
    .checklist__mark { flex: 0 0 auto; width: 26px; height: 26px; border-radius: 50%; background: #F4EADB; color: #C9861F; display: grid; place-items: center; margin-top: 1px; }
    .checklist__mark svg { width: 15px; height: 15px; }
    .checklist__item p { color: #57493f; font-size: 14.5px; line-height: 1.55; }
    @media (min-width: 720px) { .checklist { grid-template-columns: 1fr 1fr; gap: 14px 18px; } }
    /* "Como funciona" da landing — passos horizontais numerados */
    .land-steps { display: grid; grid-template-columns: 1fr; gap: 22px; max-width: 960px; margin: 4px auto 0; }
    .land-step { display: flex; gap: 18px; align-items: flex-start; }
    .land-step__num { flex: 0 0 auto; width: 46px; height: 46px; border-radius: 50%; border: 1.5px solid rgba(228, 160, 61, .5); color: #C9861F; display: grid; place-items: center; font-weight: 600; font-size: 16px; }
    .land-step h3 { font-weight: 600; font-size: 16.5px; color: #382E2C; margin-bottom: 6px; }
    .land-step p { color: #857874; font-size: 14.5px; line-height: 1.7; }
    @media (min-width: 780px) { .land-steps { grid-template-columns: repeat(3, 1fr); gap: 30px; } .land-step { flex-direction: column; } }
    /* "Quem trata" — faixa de autoria com retrato + credenciais */
    .quemtrata { display: grid; grid-template-columns: 1fr; gap: clamp(28px, 4vw, 48px); align-items: center; max-width: 1040px; margin: 0 auto; }
    .quemtrata__figure img { width: 100%; max-width: 340px; aspect-ratio: 1; object-fit: cover; border-radius: 20px; border: 5px solid #FFFFFF; box-shadow: 0 16px 40px rgba(56, 46, 44, .2); display: block; }
    .quemtrata__body { display: flex; flex-direction: column; gap: 16px; }
    .quemtrata__creds { display: flex; flex-direction: column; gap: 9px; margin-top: 2px; }
    .quemtrata__cred { display: flex; gap: 11px; align-items: baseline; color: #F2F2EE; font-size: 14px; line-height: 1.5; }
    .quemtrata__cred .diamond { transform: rotate(45deg) translateY(-1px); }
    @media (min-width: 800px) { .quemtrata { grid-template-columns: auto 1fr; } }
    /* FAQ acordeão centrado em coluna única (compartilhado home + landings) */
    .faq2 { max-width: 780px; margin: 6px auto 0; display: flex; flex-direction: column; gap: 12px; }
    .faq2 details { background: #FFFFFF; border: 1px solid rgba(56, 46, 44, .08); border-radius: 14px; box-shadow: 0 6px 20px rgba(56, 46, 44, .05); overflow: hidden; }
    .faq2 summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 16px; padding: 20px 22px; font-weight: 500; font-size: 15.5px; line-height: 1.4; color: #382E2C; }
    .faq2 summary::-webkit-details-marker { display: none; }
    .faq2 summary::after { content: "+"; margin-left: auto; width: 30px; height: 30px; flex: 0 0 auto; border-radius: 50%; border: 1.5px solid rgba(228, 160, 61, .55); color: #C9861F; display: grid; place-items: center; font-size: 20px; font-weight: 300; line-height: 1; transition: background .2s; }
    .faq2 details[open] summary::after { content: "\2212"; background: rgba(228, 160, 61, .12); }
    .faq2 details p { padding: 0 22px 22px; color: #857874; font-size: 14.5px; line-height: 1.75; }