/* Ferdowsi Home — base layer (fonts, scoping, theme-reset) */
@font-face{font-family:'Vazirmatn';font-style:normal;font-weight:100 900;font-display:swap;src:url('../fonts/Vazirmatn-Variable.woff2') format('woff2')}

.fa-home{display:block;direction:rtl;text-align:right;font-family:'Vazirmatn',Tahoma,sans-serif;color:#161922;line-height:1.8;-webkit-font-smoothing:antialiased;overflow-x:clip}
.fa-home.fa-bleed{width:calc(100vw - var(--fa-sbw,0px));max-width:none;margin-inline:calc(50% - 50vw + var(--fa-sbw,0px) / 2)}
.fa-home *,.fa-home *::before,.fa-home *::after{box-sizing:border-box}
.fa-home.fa-no-header .fa-hdr{display:none}
.fa-home.fa-no-footer .fa-ftr{display:none}

/* keep theme heading/paragraph/button rules from leaking in (zero-specificity :where, still beats theme tag rules) */
.fa-home :where(h1,h2,h3,h4,h5,h6){font-family:inherit;color:inherit;letter-spacing:normal;text-transform:none;padding:0}
.fa-home :where(p,span,strong,li,button,label){font-family:inherit;letter-spacing:normal;text-transform:none}
.fa-home :where(button){margin:0;border-radius:0;box-shadow:none;text-shadow:none}
.fa-home :where(a){text-decoration:none;border:0}
.fa-home img{max-width:100%;border:0;box-shadow:none;border-radius:0}
.fa-home svg{max-width:none}
.fa-home a:focus-visible,.fa-home button:focus-visible{outline:3px solid #ffcb05;outline-offset:3px}

/* ===== design motion layer ===== */
@keyframes fz-in{from{opacity:0;transform:translate(-40px,40px)}to{opacity:1;transform:none}}
@keyframes fz-in2{from{opacity:0;transform:translate(-40px,40px)}to{opacity:1;transform:none}}
@keyframes fz-grow0{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes fz-grow1{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.fz-fill0{transform-origin:right center;animation:fz-grow0 6s linear both}
.fz-fill1{transform-origin:right center;animation:fz-grow1 6s linear both}
@keyframes fz-marquee{from{transform:translateX(0)}to{transform:translateX(50%)}}
.fz-marquee{animation:fz-marquee 40s linear infinite}
@media (prefers-reduced-motion: reduce){.fz-fill0,.fz-fill1,.fz-marquee{animation:none}}
.fa-home a{color:#161922}.fa-home a:hover{color:#000000}
@keyframes fz-icp{from{opacity:0;transform:scale(.6) rotate(-8deg)}to{opacity:1;transform:none}}
@keyframes fz-icq{from{opacity:0;transform:scale(.6) rotate(-8deg)}to{opacity:1;transform:none}}
.fz-ica{animation:fz-icp .6s cubic-bezier(.2,.8,.2,1) both}
.fz-icb{animation:fz-icq .6s cubic-bezier(.2,.8,.2,1) both}
@media (prefers-reduced-motion: reduce){.fz-ica,.fz-icb{animation:none !important}}

@keyframes fz-pop{0%{opacity:0;transform:translateY(18px) scale(.92)}100%{opacity:1;transform:none}}
@keyframes fz-pop-c{0%{opacity:0;transform:translate(-50%,-50%) scale(.85)}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.fz-pop{animation:fz-pop .6s cubic-bezier(.2,.8,.2,1) both}
@media (prefers-reduced-motion: reduce){.fz-pop{animation:none !important}}
/* ===== Motion layer (copy only) ===== */
.fz-count{--n: var(--to)}
.fz-count::after{counter-reset: fzn var(--n); content: counter(fzn, persian)}
.fz-ticket{transition: transform .35s cubic-bezier(.2,.8,.2,1)}
.fz-ticket:hover{transform: rotate(-1.5deg) translateY(-6px)}
.fz-card{transition: translate .35s cubic-bezier(.2,.8,.2,1)}
.fz-card:hover{translate: -6px -6px}
@property --n{syntax:'<integer>';inherits:false;initial-value:0}
@media (prefers-reduced-motion: no-preference){
  @keyframes fz-kb{from{transform:scale(1)}to{transform:scale(1.12) translate(-8px,6px)}}
  @keyframes fz-bar-in{from{opacity:0;transform:translate(-120px,120px)}to{opacity:1;transform:none}}
  .fz-kenburns{transform-box:fill-box;transform-origin:center;animation:fz-kb 14s ease-in-out infinite alternate}
  .fz-bar-a{animation:fz-bar-in .9s cubic-bezier(.2,.8,.2,1) .3s both}
  .fz-bar-b{animation:fz-bar-in .9s cubic-bezier(.2,.8,.2,1) .5s both}
  @supports (animation-timeline: view()){
    @keyframes fz-rise{from{opacity:0;transform:translate(-40px,40px)}to{opacity:1;transform:none}}
    @keyframes fz-fade{from{opacity:0}to{opacity:1}}
    @keyframes fz-draw-x{from{transform:scaleX(0)}to{transform:scaleX(1)}}
    @keyframes fz-grow-y{from{transform:scaleY(0)}to{transform:scaleY(1)}}
    @keyframes fz-funnel{from{transform:scaleX(.05);opacity:.2}to{transform:scaleX(1);opacity:1}}
    @keyframes fz-drop{0%{opacity:0;transform:translateY(-60px) skewX(-45deg)}70%{opacity:1;transform:translateY(6px) skewX(-45deg)}100%{transform:translateY(0) skewX(-45deg)}}
    @keyframes fz-node{from{opacity:0;transform:translate(-50%,-50%) scale(.3)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
    @keyframes fz-stamp{0%{opacity:0;transform:scale(2.6) rotate(-40deg)}75%{opacity:1;transform:scale(.92) rotate(-10deg)}100%{transform:scale(1) rotate(-12deg)}}
    @keyframes fz-slide{from{transform:translateX(-35%)}to{transform:translateX(0)}}
    @keyframes fz-count{from{--n:0}to{--n:var(--to)}}
    .fz-rise{animation:fz-rise linear both;animation-timeline:view();animation-range:entry 0% cover 28%}
    .fz-fade{animation:fz-fade linear both;animation-timeline:view();animation-range:entry 10% cover 40%}
    .fz-draw-x{transform-origin:right center;animation:fz-draw-x linear both;animation-timeline:view();animation-range:entry 40% cover 55%}
    .fz-stair{transform-origin:bottom center;animation:fz-grow-y linear both;animation-timeline:view();animation-range:entry 20% cover 45%}
    .fz-funnel{transform-origin:center;animation:fz-funnel linear both;animation-timeline:view();animation-range:entry 30% cover 45%}
    .fz-drop{animation:fz-drop linear both;animation-timeline:view();animation-range:entry 60% cover 50%}
    .fz-node{animation:fz-node linear both;animation-timeline:view();animation-range:entry 40% cover 45%}
    .fz-stamp{animation:fz-stamp linear both;animation-timeline:view();animation-range:cover 30% cover 48%}
    .fz-slide-in{animation:fz-slide linear both;animation-timeline:view();animation-range:entry 0% cover 60%}
    .fz-count{animation:fz-count linear both;animation-timeline:view();animation-range:entry 30% cover 45%}
    .fz-st:nth-child(2),.fz-st:nth-child(2) .fz-funnel{animation-range:entry 8% cover 34%}
    .fz-st:nth-child(3),.fz-st:nth-child(3) .fz-funnel{animation-range:entry 16% cover 40%}
    .fz-st:nth-child(4),.fz-st:nth-child(4) .fz-funnel{animation-range:entry 24% cover 46%}
    .fz-st:nth-child(5),.fz-st:nth-child(5) .fz-funnel{animation-range:entry 32% cover 52%}
    .fz-st:nth-child(6),.fz-st:nth-child(6) .fz-funnel{animation-range:entry 40% cover 58%}
    .fz-d2{animation-range:entry 15% cover 38%}
    .fz-d3{animation-range:entry 30% cover 48%}
    .fz-node:nth-of-type(2){animation-range:entry 48% cover 50%}
    .fz-node:nth-of-type(3){animation-range:entry 56% cover 55%}
    .fz-node:nth-of-type(4){animation-range:entry 64% cover 60%}
    .fz-node:nth-of-type(5){animation-range:entry 72% cover 65%}
    .fz-node:nth-of-type(6){animation-range:entry 80% cover 70%}

    @keyframes fz-pulse{0%{transform:scale(.7);opacity:.9}100%{transform:scale(1.5);opacity:0}}
    .fz-sb-pulse{transform-box:fill-box;transform-origin:center;animation:fz-pulse 2.4s ease-out infinite}
  }
}
