/* Molduras elegantes, efeitos do autismo, areas de atuacao e fontes maiores */

/* ===== Molduras: cantos dourados que desenham, luz que atravessa a foto ===== */
.moldura-ativa { position: relative; }
.mc {
  position: absolute; z-index: 6; width: 26px; height: 26px; pointer-events: none;
  border: 0 solid var(--ouro-claro);
  opacity: 0; transform: scale(0.4);
  transition: opacity 0.9s var(--ease), transform 0.9s var(--ease), width 0.7s var(--ease), height 0.7s var(--ease), border-color 0.5s;
  filter: drop-shadow(0 0 4px rgba(13, 29, 22, 0.55));
}
.mc.tl { top: 12px; left: 12px; border-top-width: 1.5px; border-left-width: 1.5px; transform-origin: 0 0; }
.mc.tr { top: 12px; right: 12px; border-top-width: 1.5px; border-right-width: 1.5px; transform-origin: 100% 0; }
.mc.bl { bottom: 12px; left: 12px; border-bottom-width: 1.5px; border-left-width: 1.5px; transform-origin: 0 100%; }
.mc.br { bottom: 12px; right: 12px; border-bottom-width: 1.5px; border-right-width: 1.5px; transform-origin: 100% 100%; }
.moldura-pronta .mc { opacity: 1; transform: none; }
.moldura-pronta:hover .mc { width: 46px; height: 46px; border-color: #fff; }
.moldura-pronta .mc.tr { transition-delay: 0.1s, 0.1s, 0s, 0s, 0s; }
.moldura-pronta .mc.br { transition-delay: 0.2s, 0.2s, 0s, 0s, 0s; }
.moldura-pronta .mc.bl { transition-delay: 0.3s, 0.3s, 0s, 0s, 0s; }
.moldura-pronta:hover .mc { transition-delay: 0s; }

.m-luz { position: absolute; inset: 0; z-index: 5; overflow: hidden; pointer-events: none; border-radius: inherit; }
.m-luz::before {
  content: ""; position: absolute; top: -20%; bottom: -20%; left: -60%; width: 38%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.34), rgba(241, 223, 176, 0.18), transparent);
  transform: skewX(-20deg);
  animation: luz-foto 9s var(--ease) infinite; animation-delay: var(--atraso, 2s);
}
.moldura-pronta:hover .m-luz::before { animation-duration: 1.6s; animation-delay: 0s; }
@keyframes luz-foto { 0%, 55% { left: -60%; } 100% { left: 130%; } }
.moldura-ativa:not(.arco) { box-shadow: 0 0 0 1px rgba(241, 223, 176, 0.35), 0 40px 70px -36px rgba(13, 29, 22, 0.7); }
.moldura-ativa.arco::after { pointer-events: none; }

/* anel de brilho suave nos arcos */
.arco .m-luz { border-radius: inherit; }

/* ===== Efeitos do autismo: pecas de quebra-cabeca e fita ===== */
.pecas { position: absolute; inset: 0; z-index: 4; overflow: hidden; pointer-events: none; border-radius: inherit; }
.peca { position: absolute; width: 26px; height: 26px; fill: rgba(241, 223, 176, 0.2); stroke: #f1dfb0; stroke-width: 1.3; stroke-linejoin: round; opacity: 0; animation: sobe-peca 10s linear infinite; filter: drop-shadow(0 0 6px rgba(241, 223, 176, 0.55)); }
.peca.p1 { left: 10%; bottom: 8%; }
.peca.p2 { left: 72%; bottom: 2%; width: 18px; height: 18px; stroke: #9fc3d6; fill: rgba(159, 195, 214, 0.2); animation-delay: 3s; animation-duration: 12s; }
.peca.p3 { left: 42%; bottom: 14%; width: 22px; height: 22px; stroke: #b8cfb4; fill: rgba(184, 207, 180, 0.2); animation-delay: 6s; }
.peca.p4 { left: 86%; bottom: 18%; width: 20px; height: 20px; stroke: #e8b9a3; fill: rgba(232, 185, 163, 0.2); animation-delay: 1.5s; animation-duration: 11s; }
@keyframes sobe-peca {
  0% { transform: translateY(30px) rotate(0deg) scale(0.8); opacity: 0; }
  15% { opacity: 0.95; }
  80% { opacity: 0.8; }
  100% { transform: translateY(-260px) rotate(200deg) scale(1.1); opacity: 0; }
}
.fita-selo { position: absolute; z-index: 7; top: 12px; right: 14px; width: 40px; height: 56px; color: #f1dfb0; transform-origin: 50% 0; animation: balanco-fita 5s ease-in-out infinite alternate; filter: drop-shadow(0 0 8px rgba(241, 223, 176, 0.65)); pointer-events: none; }
.fita-flutua { position: absolute; z-index: 7; right: -16px; top: -26px; width: 64px; height: 90px; color: #c9a568; transform-origin: 50% 0; animation: balanco-fita 6s ease-in-out infinite alternate; filter: drop-shadow(0 8px 14px rgba(13, 29, 22, 0.35)); pointer-events: none; }
@keyframes balanco-fita { from { transform: rotate(-7deg) translateY(0); } to { transform: rotate(7deg) translateY(4px); } }
.fita-brilho { animation: corre-brilho 3s linear infinite; }
@keyframes corre-brilho { to { stroke-dashoffset: -24; } }
.esp-foto.tea .m-luz::before { background: linear-gradient(100deg, transparent, rgba(159, 195, 214, 0.35), rgba(241, 223, 176, 0.25), transparent); }

/* aura pulsante no cartaz da areas de atuacao */
.efeito-tea::before { content: ""; position: absolute; inset: -12px; z-index: -1; border-radius: 6px; border: 1px solid rgba(183, 138, 67, 0.7); animation: aura 4.5s ease-out infinite; pointer-events: none; }
.efeito-tea::after { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 4px; box-shadow: 0 0 70px rgba(159, 195, 214, 0.35), 0 0 120px rgba(224, 199, 145, 0.22); animation: respira-aura 6s ease-in-out infinite alternate; pointer-events: none; }
@keyframes aura { from { transform: scale(0.98); opacity: 0.75; } to { transform: scale(1.07); opacity: 0; } }
@keyframes respira-aura { from { opacity: 0.55; } to { opacity: 1; } }

/* ===== Areas de atuacao ===== */
.areas { background: linear-gradient(180deg, var(--creme), var(--creme-2)); }
.areas-grade { display: grid; grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr); gap: clamp(36px, 7vw, 110px); align-items: center; }
.areas-arte { position: relative; margin: 0 22px 22px 0; max-width: 470px; justify-self: center; width: 100%; isolation: isolate; }
.areas-arte::after { content: ""; position: absolute; inset: 22px -22px -22px 22px; border: 1px solid var(--ouro); z-index: -2; }
.areas-moldura { position: relative; border-radius: 4px; }
.areas-moldura img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 4px; box-shadow: 0 40px 70px -36px rgba(13, 29, 22, 0.8); }
.areas-texto h2 { font-size: clamp(2.2rem, 4vw, 3.4rem); margin-bottom: 12px; }
.areas-lead { font: italic 400 1.35rem / 1.5 var(--serif); color: var(--ouro-escuro); margin-bottom: 28px; max-width: 34rem; }
.areas-lista { list-style: none; margin: 0 0 34px; padding: 0; border-top: 1px solid rgba(183, 138, 67, 0.35); }
.areas-lista li { display: flex; gap: 18px; align-items: center; padding: 16px 6px; border-bottom: 1px solid rgba(183, 138, 67, 0.35); transition: padding-left 0.6s var(--ease), background-color 0.6s; }
.areas-lista li:hover { padding-left: 16px; background: rgba(224, 199, 145, 0.14); }
.areas-lista .ai { width: 54px; height: 54px; flex: none; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--ouro); background: var(--papel); color: var(--verde); transition: background-color 0.5s, color 0.5s, transform 0.7s var(--ease); }
.areas-lista li:hover .ai { background: var(--verde-fundo); color: var(--ouro-claro); transform: rotate(-8deg) scale(1.06); }
.areas-lista .ai .ico { width: 26px; height: 26px; stroke-width: 1.2; }
.areas-lista b { display: block; font: 500 1.4rem / 1.25 var(--serif); color: var(--verde); }
.areas-lista div > span { display: block; font-size: 1rem; line-height: 1.55; color: var(--suave); margin-top: 3px; }
@media (max-width: 900px) { .areas-grade { grid-template-columns: 1fr; } }

/* ===== Textos maiores: especialidades e acompanhamento ===== */
.esp-corpo h3 { font-size: 2.1rem; }
.esp-corpo p { font-size: 1.12rem; line-height: 1.75; color: #4d5a53; }
.esp-corpo .link-seta { font-size: 0.8rem; }
.sobre-texto .espec { font: italic 400 1.3rem / 1.4 var(--serif); color: var(--verde); margin: -10px 0 20px; }

.acomp h2 { font-size: clamp(2.4rem, 4.4vw, 3.8rem); }
.intro-acomp { max-width: 52rem; }
.intro-acomp p:last-child { font-size: 1.32rem; line-height: 1.7; }
.plano-tempo { font-size: 0.78rem; }
.plano h3 { font-size: clamp(2.2rem, 3.4vw, 2.9rem); }
.plano-frase { font-size: 1.45rem; }
.plano li { font-size: 1.1rem; padding-block: 13px; }
.plano .btn { font-size: 0.8rem; }
.acomp-pag { font-size: 1.05rem; }
.inclui h3 { font-size: clamp(2rem, 3.2vw, 2.8rem); }
.inclui-lista li { padding: 30px 26px 30px 66px; }
.inclui-lista b { font-size: 1.35rem; }
.inclui-lista span { font-size: 1.04rem; line-height: 1.65; }
.inclui-lista li::before { font-size: 1.7rem; }
.kit-texto h3 { font-size: clamp(2.1rem, 3.5vw, 3rem); }
.kit-texto p { font-size: 1.14rem; line-height: 1.75; }
.acomp-fim h3 { font-size: clamp(1.8rem, 2.8vw, 2.4rem); }
.acomp-fim p { font-size: 1.1rem; }
.acomp-end { font-size: 1.1rem; }

.esp-badge { z-index: 8; }
.esp-foto.tea .fita-selo { top: 14px; right: 16px; }

/* ===== Molduras modernas: borda dourada giratoria, camadas e vidro ===== */
@property --ang { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
.m-borda {
  position: absolute; inset: 0; z-index: 7; border-radius: inherit; padding: 2.5px; pointer-events: none;
  background: conic-gradient(from var(--ang), transparent 0deg, #f1dfb0 38deg, #b78a43 78deg, transparent 135deg, transparent 215deg, #f1dfb0 268deg, #fff3d0 288deg, transparent 335deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  animation: gira-borda var(--vel, 7s) linear infinite;
  filter: drop-shadow(0 0 5px rgba(241, 223, 176, 0.55));
}
@keyframes gira-borda { to { --ang: 360deg; } }
.esp-foto { border-radius: 3px 3px 0 0; }
.esp-foto::before { content: ""; position: absolute; inset: 10px; z-index: 6; border: 1px solid rgba(255, 255, 255, 0.5); border-radius: 2px; pointer-events: none; opacity: 0; transition: opacity 0.7s var(--ease), inset 0.7s var(--ease); }
.esp:hover .esp-foto::before { opacity: 1; inset: 16px; }

/* camadas atras da foto da abertura e do "Sobre mim" */
.camada { position: absolute; z-index: -1; pointer-events: none; }
.hero-foto .camada.c1 { left: 6%; right: -7%; top: 5%; bottom: -3%; border-radius: 280px 280px 0 0; background: linear-gradient(160deg, rgba(155, 178, 153, 0.55), rgba(224, 199, 145, 0.4)); animation: flutua-camada 9s ease-in-out infinite alternate; }
.hero-foto .camada.c2 { left: -9%; right: 9%; top: -3%; bottom: 6%; border-radius: 280px 280px 0 0; border: 1px dashed rgba(183, 138, 67, 0.65); animation: flutua-camada 11s ease-in-out infinite alternate-reverse; }
.sa-arco .camada.c1 { left: 7%; right: -8%; top: 5%; bottom: -3%; border-radius: 999px 999px 6px 6px; background: linear-gradient(160deg, rgba(155, 178, 153, 0.5), rgba(224, 199, 145, 0.42)); animation: flutua-camada 10s ease-in-out infinite alternate; }
@keyframes flutua-camada { from { transform: translate(0, 0); } to { transform: translate(10px, -10px); } }
.hero-foto::before { z-index: 8; }

/* ===== Folhas caindo devagar no inicio ===== */
.folhas-caindo { position: absolute; inset: 0; z-index: 2; overflow: hidden; pointer-events: none; }
.folha-cai { position: absolute; top: -60px; width: var(--tam); height: var(--tam); color: var(--cor); animation: cai var(--dur) linear infinite; animation-delay: var(--atraso); will-change: transform; }
.folha-cai svg { display: block; width: 100%; height: 100%; animation: balanca var(--giro) ease-in-out infinite alternate; filter: drop-shadow(0 6px 6px rgba(20, 40, 31, 0.18)); transform: rotate(var(--rot)); }
@keyframes cai { from { transform: translate3d(0, -60px, 0); } to { transform: translate3d(0, calc(100vh + 120px), 0); } }
@keyframes balanca {
  0% { transform: translateX(calc(var(--bal) * -1)) rotate(var(--rot)) rotateY(0deg); }
  100% { transform: translateX(var(--bal)) rotate(calc(var(--rot) + 70deg)) rotateY(180deg); }
}
.folhas-caindo.pausada .folha-cai, .folhas-caindo.pausada .folha-cai svg { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .folhas-caindo, .m-borda { display: none; } }
/* ===== Sobre mim: moldura organica (blob) ===== */
.sa-arco::before, .sa-arco::after { display: none; }
.sa-arco { filter: drop-shadow(0 28px 34px rgba(13, 29, 22, 0.3)); }
.sa-janela { aspect-ratio: 1 / 1.14; border-radius: 0; clip-path: url(#blob-sobre); box-shadow: none; background: #1f5a63; }
.sa-janela img { object-position: 50% 42%; }
.sa-janela::after { background: none; }
.sa-arco .camada.c1 { border-radius: 0; clip-path: url(#blob-sobre); left: 10%; right: -10%; top: 7%; bottom: -7%; background: linear-gradient(160deg, rgba(155, 178, 153, 0.7), rgba(224, 199, 145, 0.6)); animation: flutua-camada 10s ease-in-out infinite alternate; }

/* ===== Especialidades e areas: textos maiores ===== */
.areas-lista b { font-size: 1.55rem; }
.areas-lista div > span { font-size: 1.12rem; line-height: 1.6; }
.areas-lead { font-size: 1.45rem; }
.sa-badge { top: auto; bottom: 8%; left: -10px; }