/* ==========================================================================
   AVM Arquitetura · estados iniciais das transições cinematográficas
   Tudo depende de html.has-motion (posta no <head> só se o visitante não pediu
   "reduzir movimento" e as animações estão ligadas no Customizer). Sem a classe,
   o conteúdo é estático e completo.
   ========================================================================== */

/* Hero ---------------------------------------------------------------------- */
html.has-motion .hero__curtain { display: block; }
html.has-motion .hero__cotas { display: block; }
html.has-motion [data-hero-media] { clip-path: inset(50% 0 50% 0); }
html.has-motion [data-hero-zoom] { transform: scale(1.12); will-change: transform; }
html.has-motion [data-hero-title] .line__in { transform: translateY(110%); }
html.has-motion [data-hero-fade] { opacity: 0; transform: translateY(16px); }
html.has-motion .hero__cotas-txt { opacity: 0; }

/* Manifesto ----------------------------------------------------------------- */
html.has-motion .manifesto__text .w { opacity: .22; }

/* Projetos ------------------------------------------------------------------ */
html.has-motion [data-card] .card__media { clip-path: inset(100% 0 0 0); }
html.has-motion [data-card] .card__meta { opacity: 0; transform: translateY(16px); }
html.has-motion [data-card-img] { inset: -8% 0; }

/* Da planta à realidade: a planta e o render ocupam o mesmo quadro --------------- */
html.has-motion .plant__track { height: 260vh; padding-bottom: 0; }
@media (max-width: 767px) { html.has-motion .plant__track { height: 190vh; } }
html.has-motion .plant__sticky { position: sticky; top: 0; height: 100vh; height: 100svh; display: flex; align-items: center; }
html.has-motion .plant__sticky > .wrap { width: 100%; }
html.has-motion .plant__fig { margin: 0 auto; width: min(100%, calc((100svh - 190px) * 1.5)); }
html.has-motion .plant__stage { display: block; position: relative; aspect-ratio: 3 / 2; }
html.has-motion .plant__pane { position: absolute; inset: 0; aspect-ratio: auto; }
html.has-motion .plant__pane--render { opacity: 0; filter: blur(14px); }
html.has-motion .plant__pane--plan svg [class^="p-"] > * { stroke-dasharray: var(--len, 4000); stroke-dashoffset: var(--len, 4000); }

/* Serviços ------------------------------------------------------------------ */
html.has-motion [data-svc-rule] { transform: scaleX(0); }
html.has-motion [data-svc] .svc__head > * { opacity: 0; transform: translateY(14px); }
html.has-motion [data-svc-img] { clip-path: inset(0 100% 0 0); }

/* Processo ------------------------------------------------------------------ */
html.has-motion [data-timeline-fill] { transform: scaleY(0); }
@media (min-width: 1024px) { html.has-motion [data-timeline-fill] { transform: scaleX(0); } }
html.has-motion [data-step] .step__n,
html.has-motion [data-step] .step__t,
html.has-motion [data-step] .step__d { opacity: .4; transition: opacity 1.2s cubic-bezier(0.22, 1, 0.36, 1); }
html.has-motion [data-step] .step__icon { color: var(--c-line); }
html.has-motion [data-step] .icon-line * { stroke-dasharray: 220; stroke-dashoffset: 220; transition: stroke-dashoffset 1.6s cubic-bezier(0.22, 1, 0.36, 1); }
html.has-motion [data-step].is-lit .step__n,
html.has-motion [data-step].is-lit .step__t,
html.has-motion [data-step].is-lit .step__d { opacity: 1; }
html.has-motion [data-step].is-lit .step__icon { color: var(--c-terra); box-shadow: inset 0 0 0 1px var(--c-terra); }
html.has-motion [data-step].is-lit .icon-line * { stroke-dashoffset: 0; }

/* Sobre --------------------------------------------------------------------- */
html.has-motion [data-about-frame] { clip-path: inset(0 50% 0 50%); }
html.has-motion [data-about-frame] img { transform: scale(1.15); }

/* Avaliações ---------------------------------------------------------------- */
html.has-motion [data-quote-mark] path { stroke-dasharray: 400; stroke-dashoffset: 400; }

/* CTA ----------------------------------------------------------------------- */
html.has-motion [data-cta-content] { opacity: 0; transform: translateY(80px); }
html.has-motion [data-cta-media] img { transform: scale(1.12); }

/* Página de projeto ---------------------------------------------------------- */
html.has-motion [data-g] .g-img { clip-path: inset(100% 0 0 0); }
html.has-motion [data-g-img] img { transform: scale(1.14); }
html.has-motion [data-pnav-name] { transform: scale(.55); }

/* Celular: sem máscaras pesadas nos cards e na galeria (só fade + deslocamento) */
@media (max-width: 767px) {
  html.has-motion [data-card] .card__media,
  html.has-motion [data-g] .g-img { clip-path: none; opacity: 0; transform: translateY(32px); }
  html.has-motion [data-about-frame] { clip-path: none; opacity: 0; }
}

/* Fallback sem GSAP (IntersectionObserver + CSS) ------------------------------ */
html.mo-fallback [data-hero-media] { animation: mo-blind 1.8s .5s cubic-bezier(0.22, 1, 0.36, 1) forwards; }
html.mo-fallback [data-hero-zoom] { animation: mo-kb 2.4s .5s cubic-bezier(0.22, 1, 0.36, 1) forwards; }
html.mo-fallback .hero__curtain { animation: mo-out .8s 1.6s forwards; }
html.mo-fallback [data-hero-title] .line__in { animation: mo-up 1.4s calc(1.6s + var(--i, 0) * .35s) cubic-bezier(0.22, 1, 0.36, 1) forwards; }
html.mo-fallback [data-hero-fade] { animation: mo-fade 1.2s 2.4s cubic-bezier(0.22, 1, 0.36, 1) forwards; }
html.mo-fallback .hero__cotas { display: none; }
@keyframes mo-blind { to { clip-path: inset(0 0 0 0); } }
@keyframes mo-kb { to { transform: scale(1); } }
@keyframes mo-out { to { opacity: 0; visibility: hidden; } }
@keyframes mo-up { to { transform: none; } }
@keyframes mo-fade { to { opacity: 1; transform: none; } }

html.mo-fallback .manifesto__text .w { transition: opacity 1.2s cubic-bezier(0.22, 1, 0.36, 1); }
html.mo-fallback .manifesto__text.is-in .w { opacity: 1; }
html.mo-fallback [data-card] .card__media,
html.mo-fallback [data-card] .card__meta,
html.mo-fallback [data-svc] .svc__head > *,
html.mo-fallback [data-svc-rule],
html.mo-fallback [data-about-frame],
html.mo-fallback [data-cta-content],
html.mo-fallback [data-g] .g-img { transition: clip-path 1.6s cubic-bezier(0.22, 1, 0.36, 1), opacity 1.4s cubic-bezier(0.22, 1, 0.36, 1), transform 1.4s cubic-bezier(0.22, 1, 0.36, 1); }
html.mo-fallback .is-in[data-card] .card__media,
html.mo-fallback .is-in[data-g] .g-img { clip-path: inset(0); opacity: 1; transform: none; }
html.mo-fallback .is-in[data-card] .card__meta,
html.mo-fallback .is-in[data-svc] .svc__head > *,
html.mo-fallback .is-in[data-cta-content] { opacity: 1; transform: none; }
html.mo-fallback .is-in[data-svc-rule], html.mo-fallback .is-in > [data-svc-rule] { transform: none; }
html.mo-fallback .is-in[data-about-frame] { clip-path: inset(0); opacity: 1; }
html.mo-fallback [data-about-frame] img, html.mo-fallback [data-g-img] img, html.mo-fallback [data-cta-media] img { transform: none; }
html.mo-fallback [data-timeline-fill] { transform: none; }
html.mo-fallback [data-svc-img] { clip-path: none; }
html.mo-fallback [data-step] .step__n, html.mo-fallback [data-step] .step__t, html.mo-fallback [data-step] .step__d { opacity: 1; }
html.mo-fallback [data-step] .step__icon { color: var(--c-terra); }
html.mo-fallback [data-step] .icon-line * { stroke-dashoffset: 0; }
html.mo-fallback [data-quote-mark] path { stroke-dashoffset: 0; }
html.mo-fallback [data-pnav-name] { transform: none; }
html.mo-fallback .plant__pane--render { transition: opacity 1.8s 2.2s cubic-bezier(0.22, 1, 0.36, 1), filter 1.8s 2.2s cubic-bezier(0.22, 1, 0.36, 1); }
html.mo-fallback .plant__pane--plan svg [class^="p-"] > * { transition: stroke-dashoffset 2.4s cubic-bezier(0.22, 1, 0.36, 1); }
html.mo-fallback .plant__track { height: auto; padding-bottom: var(--sec); }
html.mo-fallback .plant__sticky { position: static; height: auto; }
html.mo-fallback .is-in .plant__pane--render { opacity: 1; filter: none; }
html.mo-fallback .is-in .plant__pane--plan svg [class^="p-"] > * { stroke-dashoffset: 0; }
