/* MONTANI Premium 3D Motion System */
:root {
  --3d-perspective: 1200px;
  --3d-distance: 40px;
  --3d-ease: cubic-bezier(0.32, 0.72, 0, 1);
  --3d-soft: cubic-bezier(0.22, 1, 0.36, 1);
}

html { perspective: var(--3d-perspective); }

.hero { perspective: var(--3d-perspective); position: relative; overflow: hidden; }
.hero-grid > div:first-child { transform-style: preserve-3d; transform: translate3d(0, 0, 0); transition: transform 0.8s var(--3d-ease); }
.hero-card { perspective: var(--3d-perspective); transform-style: preserve-3d; position: relative; }
.hero-card-inner { transform-style: preserve-3d; transition: transform 0.75s var(--3d-soft); }

@media (hover: hover) and (pointer: fine) {
  .hero-card:hover .hero-card-inner { transform: rotateY(2deg) rotateX(1deg) translateZ(12px); }
  .hero-card:hover .portrait { transform: scale(1.025) translateZ(8px); filter: grayscale(0%) saturate(1.1); }
}

.problem, .pillar, .case, .journey-step, .diff-item, .faq details, .method-audit {
  perspective: var(--3d-perspective);
  transform-style: preserve-3d;
  transition: all 0.65s var(--3d-soft);
  position: relative;
}

@media (hover: hover) and (pointer: fine) {
  .problem:hover, .pillar:hover, .case:hover, .journey-step:hover, .diff-item:hover, .faq details:hover {
    transform: translateY(-6px) translateZ(20px) rotateX(1deg);
    box-shadow: 0 25px 60px rgba(0, 31, 82, 0.15);
  }
  .case:hover { transform: translateY(-6px) translateZ(20px) rotateX(1.2deg); }
}

.scroll-reveal {
  opacity: 0;
  transform: translate3d(0, 24px, -60px) rotateX(8deg);
  filter: blur(1px);
  transition: all 0.9s var(--3d-ease);
}

.scroll-reveal.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0) rotateX(0deg);
  filter: blur(0);
}

.problem-grid .problem, .method-grid .pillar, .case-grid .case {
  opacity: 0;
  transform: translate3d(0, 20px, -40px) rotateX(6deg);
  filter: blur(1px);
}

.problem-grid .problem.is-visible, .method-grid .pillar.is-visible, .case-grid .case.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0) rotateX(0deg);
  filter: blur(0);
  transition: all 0.8s var(--3d-ease);
}

.problem-grid .problem:nth-child(1), .method-grid .pillar:nth-child(1), .case-grid .case:nth-child(1) { transition-delay: 0ms; }
.problem-grid .problem:nth-child(2), .method-grid .pillar:nth-child(2), .case-grid .case:nth-child(2) { transition-delay: 80ms; }
.problem-grid .problem:nth-child(3), .method-grid .pillar:nth-child(3), .case-grid .case:nth-child(3) { transition-delay: 160ms; }
.problem-grid .problem:nth-child(4) { transition-delay: 240ms; }

.journey-step { perspective: var(--3d-perspective); }

@media (min-width: 1021px) {
  .journey-step { opacity: 0; transform: translate3d(0, 16px, -30px) rotateY(-4deg); filter: blur(0.5px); }
  .journey-step.is-visible { opacity: 1; transform: translate3d(0, 0, 0) rotateY(0deg); filter: blur(0); transition: all 0.8s var(--3d-ease); }
  .journey-step:nth-child(1) { transition-delay: 0ms; }
  .journey-step:nth-child(2) { transition-delay: 100ms; }
  .journey-step:nth-child(3) { transition-delay: 200ms; }
  .journey-step:nth-child(4) { transition-delay: 300ms; }
  .journey-step:nth-child(5) { transition-delay: 400ms; }
}

.sec-h { opacity: 0; transform: translate3d(0, 18px, -40px); filter: blur(1px); animation: none; }
.sec-head.is-visible .sec-h { opacity: 1; transform: translate3d(0, 0, 0); filter: blur(0); transition: all 0.85s var(--3d-ease); }

.parallax-element { transform: translate3d(0, var(--parallax-offset, 0px), 0); will-change: transform; }

.authority-item { opacity: 0; transform: translate3d(0, 12px, -20px); filter: blur(0.8px); }
.authority-item.is-visible { opacity: 1; transform: translate3d(0, 0, 0); filter: blur(0); transition: all 0.7s var(--3d-ease); }
.authority-item:nth-child(1) { transition-delay: 0ms; }
.authority-item:nth-child(2) { transition-delay: 120ms; }
.authority-item:nth-child(3) { transition-delay: 240ms; }

.diagnostic-band { perspective: var(--3d-perspective); transform-style: preserve-3d; }
.diag-left, .diag-right { opacity: 0; transform: translate3d(0, 20px, -35px); filter: blur(1px); }
.diagnostic-band.is-visible .diag-left { opacity: 1; transform: translate3d(0, 0, 0); filter: blur(0); transition: all 0.85s var(--3d-ease) 0ms; }
.diagnostic-band.is-visible .diag-right { opacity: 1; transform: translate3d(0, 0, 0); filter: blur(0); transition: all 0.85s var(--3d-ease) 120ms; }

.leadmagnet { perspective: var(--3d-perspective); transform-style: preserve-3d; }
.leadmagnet > div:first-child, .lead-list { opacity: 0; transform: translate3d(0, 16px, -25px); filter: blur(0.8px); }
.leadmagnet.is-visible > div:first-child { opacity: 1; transform: translate3d(0, 0, 0); filter: blur(0); transition: all 0.8s var(--3d-ease) 0ms; }
.leadmagnet.is-visible .lead-list { opacity: 1; transform: translate3d(0, 0, 0); filter: blur(0); transition: all 0.8s var(--3d-ease) 100ms; }

.faq details { perspective: var(--3d-perspective); transform-style: preserve-3d; opacity: 0; transform: translate3d(0, 12px, -20px); filter: blur(0.6px); }
.faq details.is-visible { opacity: 1; transform: translate3d(0, 0, 0); filter: blur(0); transition: all 0.75s var(--3d-ease); }
.faq details:nth-child(1) { transition-delay: 0ms; }
.faq details:nth-child(2) { transition-delay: 80ms; }
.faq details:nth-child(3) { transition-delay: 160ms; }
.faq details:nth-child(4) { transition-delay: 240ms; }
.faq details:nth-child(5) { transition-delay: 320ms; }

@media (hover: hover) and (pointer: fine) {
  .faq details:hover { transform: translateY(-2px) translateZ(12px) rotateX(0.5deg); }
}

.final-cta { perspective: var(--3d-perspective); opacity: 0; transform: translate3d(0, 24px, -50px) rotateX(4deg); filter: blur(1.2px); }
.final-cta.is-visible { opacity: 1; transform: translate3d(0, 0, 0) rotateX(0deg); filter: blur(0); transition: all 0.9s var(--3d-ease); }

.btn { perspective: var(--3d-perspective); transform-style: preserve-3d; transition: all 0.4s var(--3d-soft); position: relative; }

@media (hover: hover) and (pointer: fine) {
  .btn:hover { transform: translateY(-3px) translateZ(8px); box-shadow: 0 18px 42px rgba(0, 74, 173, 0.28); }
  .btn:active { transform: translateY(0px) translateZ(2px) scale(0.98); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    perspective: none !important;
    transform-style: flat !important;
    animation-duration: 0.01ms !important;
    animation-delay: 0ms !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0ms !important;
  }
  .scroll-reveal, .problem, .pillar, .case, .journey-step, .diff-item, .faq details, .final-cta, .diag-left, .diag-right, .leadmagnet > div:first-child, .lead-list, .authority-item, .sec-h {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
  }
}

@media (max-width: 1020px) {
  :root {
    --3d-perspective: 900px;
    --3d-distance: 25px;
  }
  .hero-card-inner { transform: none; }
  .problem:hover, .pillar:hover, .case:hover, .journey-step:hover, .diff-item:hover, .faq details:hover {
    transform: translateY(-4px) translateZ(10px) !important;
    box-shadow: 0 16px 40px rgba(0, 31, 82, 0.12) !important;
  }
  .btn:hover { transform: translateY(-2px) translateZ(4px); box-shadow: 0 12px 28px rgba(0, 74, 173, 0.2); }
}

@media (max-width: 640px) {
  :root {
    --3d-perspective: 800px;
    --3d-distance: 15px;
  }
  .scroll-reveal { transform: translate3d(0, 16px, 0) !important; }
  .scroll-reveal.is-visible { transform: translate3d(0, 0, 0) !important; }
  .problem, .pillar, .case { transform: none !important; }
  .problem.is-visible, .pillar.is-visible, .case.is-visible { transform: none !important; }
  .problem:hover, .pillar:hover, .case:hover { transform: translateY(-2px) !important; }
  .btn:hover { transform: translateY(-1px); }
}
