/* premium.css — Tier R$10k · Christiana de Oliveira */

/* ── Thread visual (continuidade hero → dor) ── */
.tier-premium .scroll-thread {
  position: fixed;
  left: clamp(0.5rem, 1.8vw, 1.25rem);
  top: 0;
  bottom: 0;
  width: 1px;
  background: linear-gradient(
    180deg,
    transparent 0%,
    rgba(28, 29, 49, 0.1) 8%,
    rgba(46, 155, 74, 0.32) 35%,
    rgba(46, 155, 74, 0.32) 62%,
    rgba(28, 29, 49, 0.06) 88%,
    transparent 100%
  );
  z-index: 2;
  pointer-events: none;
  opacity: 0;
  transform-origin: top center;
  transition: opacity 0.5s ease;
}

html.motion-active.tier-premium .scroll-thread {
  opacity: 1;
}

.tier-premium .scroll-thread.is-faded {
  opacity: 0;
}

@media (max-width: 768px) {
  .tier-premium .scroll-thread {
    display: none;
  }

  .tier-premium .hero__stats {
    margin-top: var(--space-md);
    padding-bottom: var(--space-md);
  }
}

/* ── Hero cinematográfico ── */
.tier-premium .hero--premium {
  position: relative;
  overflow: clip;
}

.tier-premium .hero__visual {
  perspective: 1200px;
}

.tier-premium .hero__frame--reveal {
  transform-style: preserve-3d;
  will-change: transform, clip-path;
}

html:not(.motion-active) .tier-premium .hero__frame--reveal {
  opacity: 0;
  clip-path: inset(55% 10% 0 10% round 120px 120px 16px 16px);
  transform: scale(1.03);
}

@keyframes heroMaskReveal {
  from {
    opacity: 0;
    clip-path: inset(48% 6% 0 6% round 120px 120px 16px 16px);
    transform: scale(1.04) translateY(12px);
  }
  to {
    opacity: 1;
    clip-path: inset(0 0 0 0 round 120px 120px 16px 16px);
    transform: scale(1) translateY(0);
  }
}

html.motion-active.tier-premium .hero__frame--reveal {
  animation: heroMaskReveal 1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s both;
}

html.motion-active.tier-premium .hero__visual {
  animation: none;
  opacity: 1;
}

.tier-premium .hero__visual-decor [data-parallax] {
  will-change: transform;
  transition: transform 0.1s linear;
}

@media (hover: hover) and (pointer: fine) {
  .tier-premium .hero__frame[data-tilt]:hover {
    box-shadow: 0 32px 72px rgba(92, 107, 74, 0.32);
  }
}

/* ── Stats dentro do hero — faixa clean ── */
.tier-premium .hero__stats .stats-strip {
  border-top-color: rgba(28, 29, 49, 0.12);
}

html.motion-active.tier-premium .hero__stats .stats-strip__item {
  animation: statFloatIn 0.65s cubic-bezier(0.22, 1, 0.36, 1) both;
}

html.motion-active.tier-premium .hero__stats .stats-strip__item:nth-child(1) { animation-delay: 0.35s; }
html.motion-active.tier-premium .hero__stats .stats-strip__item:nth-child(2) { animation-delay: 0.42s; }
html.motion-active.tier-premium .hero__stats .stats-strip__item:nth-child(3) { animation-delay: 0.49s; }
html.motion-active.tier-premium .hero__stats .stats-strip__item:nth-child(4) { animation-delay: 0.56s; }

@keyframes statFloatIn {
  from {
    opacity: 0;
    transform: translateY(28px) scale(0.96);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* ── Quote reveal ── */
.tier-premium .quote-banner--reveal blockquote {
  overflow: hidden;
}

.tier-premium .quote-banner--reveal .quote-line {
  display: block;
  opacity: 0;
  transform: translateY(1.25rem);
  transition:
    opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

.tier-premium .quote-banner--reveal.is-revealed .quote-line {
  opacity: 1;
  transform: translateY(0);
}

.tier-premium .quote-banner--reveal.is-revealed .quote-line:nth-child(2) {
  transition-delay: 0.12s;
}

/* ── Método pinned (sticky stack desktop) ── */
@media (min-width: 1024px) {
  .tier-premium .method-pinned {
    position: relative;
  }

  .tier-premium .method-pinned .method-grid {
    display: block;
    max-width: 36rem;
    margin-inline: auto;
  }

  .tier-premium .method-pinned .method-card {
    position: sticky;
    top: calc(5.5rem + var(--course-bar-offset, 0px));
    margin-bottom: min(38vh, 18rem);
    box-shadow: 0 24px 56px rgba(45, 52, 38, 0.12);
    transform-origin: center top;
    transition:
      transform 0.45s cubic-bezier(0.22, 1, 0.36, 1),
      box-shadow 0.45s ease,
      opacity 0.45s ease;
  }

  .tier-premium .method-pinned .method-card.is-behind {
    transform: scale(0.94) translateY(-8px);
    opacity: 0.55;
    box-shadow: 0 8px 24px rgba(45, 52, 38, 0.06);
  }

  .tier-premium .method-pinned .method-card:last-child {
    margin-bottom: 4rem;
  }
}

/* ── Depoimentos depth ── */
.tier-premium #depoimentos {
  position: relative;
  overflow: clip;
}

.tier-premium .section-decor-ellipse {
  position: absolute;
  top: -8%;
  right: -12%;
  width: min(55vw, 28rem);
  height: min(55vw, 28rem);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(92, 107, 74, 0.09) 0%, transparent 68%);
  pointer-events: none;
  z-index: 0;
}

.tier-premium #depoimentos .container {
  position: relative;
  z-index: 1;
}

.tier-premium .depoimentos-wrap {
  mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}

/* ── Premium blur-fade timing ── */
.tier-premium .blur-fade {
  --bf-blur: 8px;
  --bf-duration: 0.55s;
  --bf-y: 10px;
}

.tier-premium .course-section .blur-fade {
  --bf-blur: 10px;
  --bf-duration: 0.6s;
}

.tier-premium .course-hero__poster.blur-fade {
  --bf-delay: 0.14s;
  --bf-duration: 0.7s;
}

.tier-premium .logo-cloud.blur-fade {
  --bf-duration: 0.65s;
}

.tier-premium .scroll-velocity-band.blur-fade,
.tier-premium .scrolling-text-band.blur-fade {
  --bf-blur: 4px;
  --bf-duration: 0.5s;
}

.tier-premium .contact-card {
  transition:
    transform 0.35s var(--ease-out-soft),
    box-shadow 0.35s var(--ease-out-soft);
}

@media (hover: hover) {
  .tier-premium .contact-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(45, 52, 38, 0.1);
  }
}

.tier-premium .footer__content.blur-fade {
  --bf-duration: 0.6s;
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  .tier-premium .hero__frame--reveal,
  html.motion-active.tier-premium .hero__frame--reveal {
    animation: none;
    opacity: 1;
    clip-path: none;
    transform: none;
  }

  .tier-premium .scroll-thread,
  .tier-premium .section-decor-ellipse[data-parallax] {
    display: none;
  }

  .tier-premium .hero__stats .stats-strip__item {
    animation: none;
  }

  .tier-premium .quote-banner--reveal .quote-line {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .tier-premium .method-pinned .method-card {
    position: static;
    margin-bottom: var(--space-sm);
    transform: none !important;
    opacity: 1 !important;
  }
}