html.wow-photo-pending .hero .photo{opacity:0}
.hero .photo{position:relative;z-index:2}
.tf-asm{position:absolute;z-index:3;pointer-events:none;clip-path:polygon(25% 3%,75% 3%,100% 50%,75% 97%,25% 97%,0 50%);
 background:radial-gradient(circle,#fff 0,#c9a8ff 40%,#7b3fc4 100%)}
.tf-asm i{position:absolute;display:block;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);background-repeat:no-repeat;will-change:transform}
.tf-asm::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 18px 4px rgba(190,150,255,.9)}
.tf-vig{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .2s;background:radial-gradient(420px circle at var(--cx) var(--cy),transparent 38%,rgba(20,8,40,.62) 100%)}
.tf-vig.on{opacity:1}
.tf-burst,.tf-streak,.tf-ring{position:absolute;z-index:1;pointer-events:none;transform:translate(-50%,-50%)}
.tf-burst{width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,1) 0,rgba(220,200,255,.85) 22%,rgba(123,63,196,.35) 45%,transparent 68%);animation:tfBurst 1.1s ease-out forwards}
@keyframes tfBurst{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}15%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) scale(1.4)}}
.tf-streak{width:1300px;height:6px;border-radius:3px;background:linear-gradient(90deg,transparent,rgba(190,150,255,.6) 30%,#fff 50%,rgba(190,150,255,.6) 70%,transparent);box-shadow:0 0 18px 4px rgba(200,170,255,.8);animation:tfStreak .9s ease-out forwards}
@keyframes tfStreak{0%{opacity:0;transform:translate(-50%,-50%) scaleX(.1)}20%{opacity:1;transform:translate(-50%,-50%) scaleX(1)}100%{opacity:0;transform:translate(-50%,-50%) scaleX(1.2) scaleY(.3)}}
.tf-ring{width:160px;height:160px;border-radius:50%;border:4px solid rgba(157,116,209,.95);box-shadow:0 0 24px 6px rgba(123,63,196,.7),inset 0 0 18px rgba(200,170,255,.8);z-index:4;animation:tfRing 1.1s cubic-bezier(.1,.6,.3,1) forwards}
.tf-ring2{animation-delay:.18s;opacity:0;border-width:2px}
@keyframes tfRing{0%{opacity:1;transform:translate(-50%,-50%) scale(.6)}100%{opacity:0;transform:translate(-50%,-50%) scale(7)}}
.tf-rim{position:absolute;z-index:1;pointer-events:none;clip-path:polygon(25% 3%,75% 3%,100% 50%,75% 97%,25% 97%,0 50%);transform:scale(1.07);
 background:conic-gradient(from 200deg,#fff,#c9a8ff,#7b3fc4,#fff,#c9a8ff,#fff);animation:tfRim 1.2s ease-out .15s both}
@keyframes tfRim{0%{opacity:0}30%{opacity:1}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.tf-asm,.tf-vig,.tf-burst,.tf-streak,.tf-ring,.tf-rim{display:none}}
