@charset "UTF-8";
/* ==========================================================================
   Hoozhaan — انیمیشن‌ها
   همهٔ حرکت‌ها فقط با transform/opacity اجرا می‌شوند تا روی موبایل هم روان باشد.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1) آشکارسازی هنگام اسکرول
   -------------------------------------------------------------------------- */
.hz-js [data-reveal] {
  opacity: 0;
  will-change: transform, opacity;
  transition:
    opacity var(--hz-rv-dur, .85s) var(--hz-ease) var(--hz-rv-delay, 0s),
    transform var(--hz-rv-dur, .85s) var(--hz-ease) var(--hz-rv-delay, 0s),
    filter var(--hz-rv-dur, .85s) var(--hz-ease) var(--hz-rv-delay, 0s),
    clip-path var(--hz-rv-dur, .85s) var(--hz-ease) var(--hz-rv-delay, 0s);
}
.hz-js [data-reveal="up"]      { transform: translate3d(0, 34px, 0); }
.hz-js [data-reveal="down"]    { transform: translate3d(0, -28px, 0); }
.hz-js [data-reveal="start"]   { transform: translate3d(46px, 0, 0); }   /* از سمت شروع خط (راست در RTL) */
.hz-js [data-reveal="end"]     { transform: translate3d(-46px, 0, 0); }
.hz-js [data-reveal="scale"]   { transform: scale(.93); }
.hz-js [data-reveal="rise"]    { transform: translate3d(0, 54px, 0) scale(.97); }
.hz-js [data-reveal="blur"]    { filter: blur(14px); transform: translate3d(0, 20px, 0); }
.hz-js [data-reveal="clip"]    { clip-path: inset(0 0 0 100%); }
.hz-js [data-reveal="fade"]    { transform: none; }
.hz-js [data-reveal="tilt"]    { transform: perspective(1200px) rotateX(9deg) translate3d(0, 40px, 0); transform-origin: 50% 100%; }

.hz-js [dir="ltr"] [data-reveal="start"] { transform: translate3d(-46px, 0, 0); }
.hz-js [dir="ltr"] [data-reveal="end"]   { transform: translate3d(46px, 0, 0); }
.hz-js [dir="ltr"] [data-reveal="clip"]  { clip-path: inset(0 100% 0 0); }

[data-reveal].is-revealed {
  opacity: 1;
  transform: none;
  filter: none;
  clip-path: inset(0 0 0 0);
}

/* گروه پلکانی */
.hz-js [data-reveal-group] > * { opacity: 0; transform: translate3d(0, 30px, 0); }
.hz-js [data-reveal-group].is-revealed > * {
  opacity: 1; transform: none;
  transition: opacity .8s var(--hz-ease), transform .8s var(--hz-ease);
}
.hz-js [data-reveal-group].is-revealed > *:nth-child(1) { transition-delay: .00s; }
.hz-js [data-reveal-group].is-revealed > *:nth-child(2) { transition-delay: .08s; }
.hz-js [data-reveal-group].is-revealed > *:nth-child(3) { transition-delay: .16s; }
.hz-js [data-reveal-group].is-revealed > *:nth-child(4) { transition-delay: .24s; }
.hz-js [data-reveal-group].is-revealed > *:nth-child(5) { transition-delay: .32s; }
.hz-js [data-reveal-group].is-revealed > *:nth-child(6) { transition-delay: .40s; }
.hz-js [data-reveal-group].is-revealed > *:nth-child(7) { transition-delay: .48s; }
.hz-js [data-reveal-group].is-revealed > *:nth-child(8) { transition-delay: .56s; }
.hz-js [data-reveal-group].is-revealed > *:nth-child(n+9) { transition-delay: .62s; }

/* --------------------------------------------------------------------------
   2) آشکارسازی واژه‌به‌واژهٔ عنوان
   -------------------------------------------------------------------------- */
.hz-split-line { display: block; overflow: hidden; padding-block: .06em; }
.hz-js .hz-split-word {
  display: inline-block;
  transform: translate3d(0, 110%, 0) rotate(2.5deg);
  opacity: 0;
  transition: transform .85s var(--hz-ease), opacity .6s var(--hz-ease);
  transition-delay: calc(var(--i, 0) * 34ms);
  will-change: transform;
}
.hz-js .is-revealed .hz-split-word { transform: none; opacity: 1; }

/* --------------------------------------------------------------------------
   3) کلیدفریم‌ها
   -------------------------------------------------------------------------- */
@keyframes hz-spin { to { transform: rotate(360deg); } }

@keyframes hz-ping {
  0%   { transform: scale(1);   opacity: .85; }
  70%  { transform: scale(3.2); opacity: 0; }
  100% { transform: scale(3.2); opacity: 0; }
}

@keyframes hz-pop {
  0%   { transform: scale(.94); opacity: 0; }
  100% { transform: scale(1);   opacity: 1; }
}

@keyframes hz-log-in {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}

@keyframes hz-scroll-run {
  0%   { transform: translateY(-100%); }
  100% { transform: translateY(280%); }
}

@keyframes hz-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(50%); }
}
[dir="ltr"] .hz-marquee__track { animation-name: hz-marquee-ltr; }
@keyframes hz-marquee-ltr {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

@keyframes hz-float-1 {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  33%      { transform: translate3d(-4%, 6%, 0) scale(1.08); }
  66%      { transform: translate3d(5%, -4%, 0) scale(.95); }
}
@keyframes hz-float-2 {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  40%      { transform: translate3d(6%, -5%, 0) scale(1.1); }
  75%      { transform: translate3d(-5%, 4%, 0) scale(.94); }
}
@keyframes hz-float-3 {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  50%      { transform: translate3d(-7%, -6%, 0) scale(1.12); }
}
.hz-orb--1 { animation: hz-float-1 22s var(--hz-ease-in-out) infinite; }
.hz-orb--2 { animation: hz-float-2 27s var(--hz-ease-in-out) infinite; }
.hz-orb--3 { animation: hz-float-3 19s var(--hz-ease-in-out) infinite; }

@keyframes hz-shimmer {
  0%   { background-position: 200% 50%; }
  100% { background-position: -60% 50%; }
}
.hz-shimmer {
  background-size: 220% 100%;
  animation: hz-shimmer 7s linear infinite;
}

@keyframes hz-draw {
  from { stroke-dashoffset: var(--len, 1200); }
  to   { stroke-dashoffset: 0; }
}
.hz-js .hz-draw path, .hz-js .hz-draw line, .hz-draw circle, .hz-draw polygon {
  stroke-dasharray: var(--len, 1200);
  stroke-dashoffset: var(--len, 1200);
}
.hz-js .hz-draw.is-revealed path,
.hz-js .hz-draw.is-revealed line,
.hz-js .hz-draw.is-revealed circle,
.hz-js .hz-draw.is-revealed polygon {
  animation: hz-draw 2.6s var(--hz-ease) forwards;
}
.hz-draw.is-revealed :nth-child(2) { animation-delay: .12s; }
.hz-draw.is-revealed :nth-child(3) { animation-delay: .24s; }
.hz-draw.is-revealed :nth-child(4) { animation-delay: .36s; }
.hz-draw.is-revealed :nth-child(5) { animation-delay: .48s; }
.hz-draw.is-revealed :nth-child(6) { animation-delay: .60s; }

@keyframes hz-pulse-soft {
  0%, 100% { opacity: .55; }
  50%      { opacity: 1; }
}

@keyframes hz-rotate-slow { to { transform: rotate(360deg); } }
.hz-rotate-slow { animation: hz-rotate-slow 46s linear infinite; transform-origin: 50% 50%; }

@keyframes hz-bar-grow {
  from { transform: scaleY(0); }
  to   { transform: scaleY(1); }
}

/* --------------------------------------------------------------------------
   4) کج‌شدن سه‌بعدی کارت
   -------------------------------------------------------------------------- */
.hz-tilt { transform-style: preserve-3d; transition: transform .35s var(--hz-ease); }
.hz-tilt__inner { transform: translateZ(0); }
.hz-tilt.is-tilting { transition: transform .08s linear; }

/* --------------------------------------------------------------------------
   5) پردهٔ ورود صفحه
   -------------------------------------------------------------------------- */
.hz-boot {
  position: fixed; inset: 0; z-index: 9999;
  display: grid; place-items: center;
  background: var(--hz-deep);
  transition: opacity .6s var(--hz-ease), visibility .6s;
}
.hz-boot.is-done { opacity: 0; visibility: hidden; }
.hz-boot__mark { width: min(240px, 46vw); opacity: 0; transform: scale(.94); animation: hz-boot-in 1s var(--hz-ease) forwards; }
@keyframes hz-boot-in {
  0%   { opacity: 0; transform: scale(.94) translateY(10px); }
  100% { opacity: 1; transform: none; }
}
.hz-boot__bar { position: absolute; inset-block-end: 0; inset-inline: 0; height: 2px; background: rgba(255,255,255,.08); }
.hz-boot__bar span { display: block; height: 100%; width: 0; background: var(--hz-grad-brand-soft); transition: width .4s var(--hz-ease); }

/* --------------------------------------------------------------------------
   6) پارالاکس سبک
   -------------------------------------------------------------------------- */
[data-parallax] { will-change: transform; }

/* --------------------------------------------------------------------------
   7) خط زیر منو (اشاره‌گر لغزان)
   -------------------------------------------------------------------------- */
.hz-nav__marker {
  position: absolute; inset-block-end: 2px; inset-inline-start: 0;
  height: 2px; border-radius: 2px;
  background: var(--hz-grad-brand-soft);
  opacity: 0;
  transform: translateX(var(--x, 0)) ;
  width: var(--w, 0);
  transition: transform .45s var(--hz-ease), width .45s var(--hz-ease), opacity .25s var(--hz-ease);
  pointer-events: none;
}
.hz-nav:hover .hz-nav__marker { opacity: 1; }