/* ==========================================================
   Parvaz V9.8 — Premium interaction layer
   Designed to stay compositor-friendly on mobile.
   IMPORTANT: mobile drawer/menu mechanics are intentionally untouched.
   ========================================================== */

:root{
  --pv-pro-ease:cubic-bezier(.22,1,.36,1);
  --pv-pro-fast:cubic-bezier(.2,.8,.2,1);
  --pv-pro-line:rgba(18,38,63,.10);
  --pv-pro-glow:rgba(0,158,255,.18);
}

/* crisp progress indicator */
.progress,.v5-progress{
  height:3px!important;
  transform-origin:right center;
  box-shadow:0 0 12px rgba(0,163,255,.24);
}

/* Header gains a clear scrolled state without expensive backdrop filters. */
.site-header,.sub-header{
  transition:transform .35s var(--pv-pro-ease),box-shadow .35s ease,
             background-color .35s ease,border-color .35s ease!important;
}
body.pv-pro-scrolled .site-header,
body.pv-pro-scrolled .sub-header{
  box-shadow:0 12px 34px rgba(10,28,48,.10);
  border-color:rgba(21,67,104,.10)!important;
}

/* Navigation underline: quiet, precise, premium. */
.site-header nav a,.sub-header nav a,.header-nav a{
  position:relative;
}
.site-header nav a::after,.sub-header nav a::after,.header-nav a::after{
  content:"";
  position:absolute;
  right:50%;left:50%;bottom:-7px;
  height:2px;border-radius:3px;
  background:currentColor;
  opacity:.55;
  transition:right .28s var(--pv-pro-ease),left .28s var(--pv-pro-ease),opacity .28s ease;
}
@media(hover:hover) and (pointer:fine){
  .site-header nav a:hover::after,.sub-header nav a:hover::after,.header-nav a:hover::after,
  .site-header nav a[aria-current="page"]::after,.sub-header nav a[aria-current="page"]::after{
    right:12%;left:12%;opacity:.9;
  }
}

/* Hero gets subtle cinematic depth. No blur/filter animations. */
.hero,.marketer-main-hero,.sub-page-hero,.about-hero,.plans-hero{
  position:relative;
  isolation:isolate;
}
.hero::after,.marketer-main-hero::after,.sub-page-hero::after,.about-hero::after,.plans-hero::after{
  content:"";
  position:absolute;
  width:440px;height:440px;
  left:var(--pv-spot-x,72%);top:var(--pv-spot-y,28%);
  transform:translate(-50%,-50%);
  border-radius:50%;pointer-events:none;z-index:-1;
  background:radial-gradient(circle,rgba(37,171,255,.12) 0,rgba(37,171,255,.045) 34%,transparent 70%);
  opacity:.72;
  transition:opacity .35s ease;
}
.hero-stage,.dashboard-card,[data-v5-tilt]{
  transform-style:preserve-3d;
  backface-visibility:hidden;
}

/* Better first impression: copy and visual arrive as a composed sequence. */
body.pv-pro-ready .hero-copy > *,
body.pv-pro-ready .marketer-hero-copy > *,
body.pv-pro-ready .sub-page-hero > *,
body.pv-pro-ready .about-hero > *,
body.pv-pro-ready .plans-hero > *{
  animation:pvProHeroIn .78s var(--pv-pro-ease) both;
}
body.pv-pro-ready .hero-copy > *:nth-child(2),
body.pv-pro-ready .marketer-hero-copy > *:nth-child(2),
body.pv-pro-ready .sub-page-hero > *:nth-child(2),
body.pv-pro-ready .about-hero > *:nth-child(2),
body.pv-pro-ready .plans-hero > *:nth-child(2){animation-delay:.07s}
body.pv-pro-ready .hero-copy > *:nth-child(3),
body.pv-pro-ready .marketer-hero-copy > *:nth-child(3),
body.pv-pro-ready .sub-page-hero > *:nth-child(3),
body.pv-pro-ready .about-hero > *:nth-child(3),
body.pv-pro-ready .plans-hero > *:nth-child(3){animation-delay:.14s}
body.pv-pro-ready .hero-copy > *:nth-child(n+4),
body.pv-pro-ready .marketer-hero-copy > *:nth-child(n+4){animation-delay:.20s}
@keyframes pvProHeroIn{
  from{opacity:0;transform:translate3d(0,22px,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}

/* Reveal direction is assigned by JS so sections feel choreographed, not repetitive. */
.reveal.pv-reveal-left,.pv-motion-item.pv-reveal-left{transform:translate3d(34px,18px,0) scale(.988)}
.reveal.pv-reveal-right,.pv-motion-item.pv-reveal-right{transform:translate3d(-34px,18px,0) scale(.988)}
.reveal.pv-reveal-up,.pv-motion-item.pv-reveal-up{transform:translate3d(0,34px,0) scale(.988)}
.reveal.visible.pv-reveal-left,.reveal.visible.pv-reveal-right,.reveal.visible.pv-reveal-up,
.pv-motion-item.pv-motion-in.pv-reveal-left,.pv-motion-item.pv-motion-in.pv-reveal-right,.pv-motion-item.pv-motion-in.pv-reveal-up{
  transform:translate3d(0,0,0) scale(1);
}

/* Cards: border lighting + restrained depth. */
.flow-step,.audience-card,.story-card,.trust-card,.plan,.marketer-card,.company-mark,
.app-download-card,.tool-grid article,.marketer-flow-grid article,.install-steps article,
.value-card,.about-stat,.about-card,.plan-card,.faq-item,.dashboard-card{
  position:relative;
  isolation:isolate;
}
.flow-step::before,.audience-card::before,.story-card::before,.trust-card::before,.plan::before,.marketer-card::before,
.app-download-card::before,.tool-grid article::before,.marketer-flow-grid article::before,.install-steps article::before,
.value-card::before,.about-stat::before,.about-card::before,.plan-card::before,.faq-item::before,.dashboard-card::before{
  content:"";
  position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:3;
  border:1px solid transparent;
  background:linear-gradient(135deg,rgba(255,255,255,.34),rgba(25,166,255,.20),transparent 45%) border-box;
  -webkit-mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  opacity:0;
  transition:opacity .34s ease;
}

/* Pointer-follow glow is desktop-only and local to hovered cards. */
.pv-pro-card::after{
  content:"";
  position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;
  background:radial-gradient(280px circle at var(--pv-card-x,50%) var(--pv-card-y,50%),rgba(18,167,255,.11),transparent 62%);
  opacity:0;transition:opacity .28s ease;
}
@media(hover:hover) and (pointer:fine){
  .pv-pro-card:hover::before,.pv-pro-card:hover::after{opacity:1}
  .pv-pro-card:hover{box-shadow:0 20px 52px rgba(8,31,51,.12)!important}
}

/* Buttons feel tactile and intentional. */
.btn,.button,.header-cta,.instagram-link,.v5-mobile-fab{
  transition:transform .26s var(--pv-pro-ease),box-shadow .26s ease,background-color .26s ease,border-color .26s ease!important;
  transform:translate3d(0,0,0);
}
@media(hover:hover) and (pointer:fine){
  .btn:hover,.button:hover,.header-cta:hover{box-shadow:0 12px 28px rgba(7,58,97,.15)}
  .pv-magnetic,.pv-magnetic:hover{transform:translate3d(var(--pv-mx,0),var(--pv-my,0),0)!important}
}
.btn:active,.button:active,.header-cta:active,.v5-mobile-fab:active{transform:scale(.975)!important}

/* Tiny premium motion cues. */
.section-label,.section-kicker,.kicker{letter-spacing:.01em}
.section-head h2,.section-heading-row h2,.marketer-position h2,.network-copy h2,.install-guide h2{
  text-wrap:balance;
}
.hero h1,.marketer-main-hero h1,.sub-page-hero h1,.about-hero h1,.plans-hero h1{text-wrap:balance}

/* Desktop-only ambient scroll depth on large sections. */
@media(min-width:1051px){
  .pv-scroll-depth{transform:translate3d(0,var(--pv-scroll-y,0px),0);transition:transform .08s linear}
  .hero::after,.marketer-main-hero::after{opacity:.92}
}

/* Mobile: keep the polish, cut expensive continuous work. */
@media(max-width:1050px){
  .hero::after,.marketer-main-hero::after,.sub-page-hero::after,.about-hero::after,.plans-hero::after{
    width:300px;height:300px;left:76%;top:22%;opacity:.45;
  }
  .reveal.pv-reveal-left,.pv-motion-item.pv-reveal-left,
  .reveal.pv-reveal-right,.pv-motion-item.pv-reveal-right,
  .reveal.pv-reveal-up,.pv-motion-item.pv-reveal-up{
    transform:translate3d(0,18px,0) scale(.995);
  }
  .reveal.visible.pv-reveal-left,.reveal.visible.pv-reveal-right,.reveal.visible.pv-reveal-up,
  .pv-motion-item.pv-motion-in.pv-reveal-left,.pv-motion-item.pv-motion-in.pv-reveal-right,.pv-motion-item.pv-motion-in.pv-reveal-up{
    transform:none;
  }
  .pv-pro-card::after{display:none}
  .flow-step::before,.audience-card::before,.story-card::before,.trust-card::before,.plan::before,.marketer-card::before,
  .app-download-card::before,.tool-grid article::before,.marketer-flow-grid article::before,.install-steps article::before,
  .value-card::before,.about-stat::before,.about-card::before,.plan-card::before,.faq-item::before,.dashboard-card::before{display:none}
  body.pv-pro-ready .hero-copy > *,body.pv-pro-ready .marketer-hero-copy > *,
  body.pv-pro-ready .sub-page-hero > *,body.pv-pro-ready .about-hero > *,body.pv-pro-ready .plans-hero > *{
    animation-duration:.58s;
  }
}

.low-power .hero::after,.low-power .marketer-main-hero::after,.low-power .sub-page-hero::after,
.low-power .about-hero::after,.low-power .plans-hero::after{display:none}
.low-power .pv-pro-card::after{display:none}

@media(prefers-reduced-motion:reduce){
  body.pv-pro-ready .hero-copy > *,body.pv-pro-ready .marketer-hero-copy > *,
  body.pv-pro-ready .sub-page-hero > *,body.pv-pro-ready .about-hero > *,body.pv-pro-ready .plans-hero > *{
    animation:none!important;opacity:1!important;transform:none!important;
  }
  .pv-scroll-depth,.pv-magnetic{transform:none!important}
}