:root{--hiw-purple:#5b18d6;--hiw-purple2:#7b31e8;--hiw-orange:#ff8a00;--hiw-orange2:#ffb21a;--hiw-ink:#151126;--hiw-line:rgba(255,138,0,.42);--hiw-purple-line:rgba(91,24,214,.22)}
*{box-sizing:border-box}.tm-how-page{margin:0;background:#fff;font-family:Inter,Arial,sans-serif;color:var(--hiw-ink);overflow-x:hidden}.hiw-shell{width:calc(100% - 32px);max-width:1280px;margin:12px auto 0}.hiw-card{border:1px solid var(--hiw-orange);border-radius:11px;background:#fff;box-shadow:0 9px 24px rgba(255,138,0,.09),0 2px 8px rgba(91,24,214,.035);overflow:hidden}.hiw-hero{height:338px;position:relative;display:grid;grid-template-columns:36% 64%}.hiw-hero-copy{position:relative;z-index:2;padding:24px 12px 18px 25px;background:linear-gradient(90deg,#fff 0%,#fff 76%,rgba(255,255,255,.96) 87%,rgba(255,255,255,0) 100%)}.hiw-breadcrumb,.hiw-section-title{display:flex;align-items:center}.hiw-breadcrumb{gap:10px;font-size:9px;color:#6f6a7e;margin-bottom:17px}.hiw-breadcrumb a{color:#69647a;text-decoration:none}.hiw-breadcrumb span{color:var(--hiw-orange);font-size:14px}.hiw-breadcrumb b{color:#252033}.hiw-hero h1{margin:0;font:400 46px/.98 Georgia,serif;letter-spacing:-1.2px;color:var(--hiw-purple)}.hiw-hero h1 em{font-style:normal;color:var(--hiw-orange)}.hiw-rule{display:flex;align-items:center;gap:9px;width:220px;margin:15px 0 22px}.hiw-rule i{height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--hiw-orange),transparent)}.hiw-rule b{color:var(--hiw-purple);font:19px/1 Georgia,serif}.hiw-hero p{font-size:12px;line-height:2.15;margin:0;color:#161329}.hiw-hero-art{position:absolute;inset:0 0 0 27%;overflow:hidden}.hiw-hero-art:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.94) 4%,rgba(255,255,255,0) 31%)}.hiw-hero-art img{width:100%;height:100%;object-fit:cover;object-position:center 48%;display:block}.hiw-section{margin-top:0}.hiw-section-title{justify-content:center;gap:10px;height:38px}.hiw-section-title i{width:78px;height:1px;background:linear-gradient(90deg,transparent,var(--hiw-orange));opacity:.75}.hiw-section-title i:last-child{background:linear-gradient(90deg,var(--hiw-orange),transparent)}.hiw-section-title h2{margin:0;font:400 21px/1 Georgia,serif;color:#151126;white-space:nowrap}.hiw-section-title h2 span{color:var(--hiw-orange)}
.hiw-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;padding:0 10px}.hiw-step-card{height:205px;position:relative;border:1px solid rgba(255,138,0,.38);border-radius:9px;background:linear-gradient(180deg,#fff,#fffdfa);box-shadow:0 7px 18px rgba(255,138,0,.08);padding:16px 12px 10px;text-align:center;isolation:isolate;animation:hiwStepFlow 9s ease-in-out infinite;transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease}
.hiw-step-card:nth-child(1){animation-delay:0s}.hiw-step-card:nth-child(2){animation-delay:1.8s}.hiw-step-card:nth-child(3){animation-delay:3.6s}.hiw-step-card:nth-child(4){animation-delay:5.4s}.hiw-step-card:nth-child(5){animation-delay:7.2s}
.hiw-step-card:before{content:"";position:absolute;inset:-2px;border-radius:11px;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 38%,rgba(123,49,232,.22),transparent 58%);filter:blur(7px);z-index:-1;animation:hiwStepAura 9s ease-in-out infinite}
.hiw-step-card:nth-child(1):before{animation-delay:0s}.hiw-step-card:nth-child(2):before{animation-delay:1.8s}.hiw-step-card:nth-child(3):before{animation-delay:3.6s}.hiw-step-card:nth-child(4):before{animation-delay:5.4s}.hiw-step-card:nth-child(5):before{animation-delay:7.2s}.hiw-number{position:absolute;left:8px;top:7px;width:27px;height:27px;border-radius:5px;background:linear-gradient(135deg,#5b18d6,#7b31e8);color:#fff;display:grid;place-items:center;font:700 14px/1 Arial}.hiw-big-icon{width:88px;height:88px;margin:0 auto 10px;border:1px solid #9b61ef;border-radius:50%;display:grid;place-items:center;color:var(--hiw-purple);background:#fff}.hiw-big-icon svg{width:55px;height:55px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.hiw-big-icon svg text{fill:currentColor;stroke:none}.hiw-step-card h3{margin:0;color:#ff5b00;font:600 15px/1.15 Arial,sans-serif}.hiw-step-card p{margin:7px auto 0;max-width:210px;font-size:10px;line-height:1.55;color:#222033}.hiw-mini-rule{position:absolute;bottom:6px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:4px;width:55px}.hiw-mini-rule i{height:1px;flex:1;background:var(--hiw-orange);opacity:.55}.hiw-mini-rule b{font:15px/1 Georgia,serif;color:var(--hiw-orange)}.hiw-arrow{position:absolute;right:-22px;top:77px;width:32px;height:32px;z-index:4;color:#fff;background:var(--hiw-purple);font:38px/22px Arial;text-align:center;clip-path:polygon(0 0,100% 50%,0 100%);padding-left:1px;text-indent:-2px;filter:drop-shadow(0 2px 3px rgba(91,24,214,.15));animation:hiwArrowFlow 9s ease-in-out infinite}
.hiw-step-card:nth-child(1) .hiw-arrow{animation-delay:1.35s}.hiw-step-card:nth-child(2) .hiw-arrow{animation-delay:3.15s}.hiw-step-card:nth-child(3) .hiw-arrow{animation-delay:4.95s}.hiw-step-card:nth-child(4) .hiw-arrow{animation-delay:6.75s}
.hiw-after-grid{position:relative;display:grid;grid-template-columns:repeat(4,1fr);padding:0 42px 4px;gap:0}.hiw-after-grid:before{content:"";position:absolute;left:12%;right:12%;top:37px;height:1px;background:var(--hiw-purple);opacity:.55}.hiw-after-item{position:relative;text-align:center;z-index:1}.hiw-after-icon{width:66px;height:66px;margin:0 auto 10px;border:1px solid #a05af0;border-radius:50%;background:#fff;display:grid;place-items:center;color:var(--hiw-purple)}.hiw-after-icon svg{width:42px;height:42px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.hiw-after-icon svg text{fill:currentColor;stroke:none}.hiw-after-item h3{margin:0;color:#ff5b00;font:600 13px/1.2 Arial}.hiw-after-item p{margin:7px 0 0;font-size:9.5px;line-height:1.55;color:#252033}.hiw-trust-grid{display:grid;grid-template-columns:repeat(6,1fr);border:1px solid rgba(255,138,0,.38);border-radius:9px;overflow:hidden;background:#fff}.hiw-trust-item{min-height:154px;text-align:center;padding:17px 8px 10px;border-right:1px solid rgba(255,138,0,.18)}.hiw-trust-item:last-child{border-right:0}.hiw-trust-icon{height:54px;display:grid;place-items:center;color:var(--hiw-purple);margin-bottom:6px}.hiw-trust-icon svg{width:46px;height:46px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.hiw-trust-icon svg text{fill:currentColor;stroke:none}.hiw-trust-item h3{margin:0;color:#ff5b00;font:600 11px/1.25 Arial}.hiw-trust-item p{margin:7px 0 0;font-size:8.8px;line-height:1.55}.hiw-cta{height:124px;margin-top:12px;position:relative;display:grid;grid-template-columns:20% 55% 25%;align-items:center}.hiw-cta-art{height:100%;overflow:hidden;position:relative}.hiw-cta-art:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 55%,#fff 100%)}.hiw-cta-art img{width:100%;height:100%;object-fit:cover;object-position:left 45%;display:block}.hiw-cta-copy{padding-left:4px;position:relative;z-index:2}.hiw-cta-copy h2{margin:0;font:400 21px/1.15 Georgia,serif;color:var(--hiw-orange)}.hiw-cta-copy h2 em{font-style:normal;color:var(--hiw-purple)}.hiw-cta-copy p{font-size:11px;line-height:1.7;margin:10px 0 0}.hiw-cta-button{justify-self:center;display:inline-flex;align-items:center;justify-content:center;gap:18px;width:175px;height:38px;border-radius:7px;background:linear-gradient(135deg,#ffb31d,#ff8500);border:1px solid #ff9900;color:#fff;text-decoration:none;font:700 11px/1 Arial;box-shadow:0 7px 16px rgba(255,138,0,.22)}.hiw-cta-button span{font-size:24px;line-height:10px}.hiw-cta:after{content:"";position:absolute;right:0;top:0;bottom:0;width:22%;background:url('/frontend/master/assets/images/login-hero-art.jpg') center 45%/cover no-repeat;opacity:.85;mask-image:linear-gradient(90deg,transparent 0,#000 35%);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 35%)}
@keyframes hiwStepFlow{0%,8%{transform:translateY(0) scale(1);border-color:rgba(255,138,0,.42);box-shadow:0 7px 18px rgba(255,138,0,.08),0 0 0 rgba(123,49,232,0)}12%,20%{transform:translateY(-7px) scale(1.025);border-color:#ff9700;box-shadow:0 12px 30px rgba(255,138,0,.22),0 0 30px rgba(123,49,232,.55),inset 0 0 22px rgba(255,178,26,.10)}24%,100%{transform:translateY(0) scale(1);border-color:rgba(255,138,0,.42);box-shadow:0 7px 18px rgba(255,138,0,.08),0 0 0 rgba(123,49,232,0)}}
@keyframes hiwStepAura{0%,8%,24%,100%{opacity:0}12%,20%{opacity:1}}
@keyframes hiwArrowFlow{0%,8%{transform:scale(.82);opacity:.28;filter:drop-shadow(0 0 0 rgba(123,49,232,0))}12%,20%{transform:scale(1.28);opacity:1;filter:drop-shadow(0 0 10px rgba(123,49,232,1)) drop-shadow(0 0 22px rgba(255,138,0,.8))}24%,100%{transform:scale(.82);opacity:.28;filter:drop-shadow(0 0 0 rgba(123,49,232,0))}}
.hiw-big-icon{animation:hiwIconGlow 9s ease-in-out infinite}
.hiw-step-card:nth-child(1) .hiw-big-icon{animation-delay:0s}.hiw-step-card:nth-child(2) .hiw-big-icon{animation-delay:1.8s}.hiw-step-card:nth-child(3) .hiw-big-icon{animation-delay:3.6s}.hiw-step-card:nth-child(4) .hiw-big-icon{animation-delay:5.4s}.hiw-step-card:nth-child(5) .hiw-big-icon{animation-delay:7.2s}
@keyframes hiwIconGlow{0%,8%,24%,100%{box-shadow:0 0 0 rgba(123,49,232,0);border-color:#9b61ef}12%,20%{box-shadow:0 0 24px rgba(123,49,232,.75),0 0 42px rgba(255,138,0,.35);border-color:#7b31e8}}
@media(prefers-reduced-motion:reduce){.hiw-step-card,.hiw-step-card:before,.hiw-arrow,.hiw-big-icon{animation:none!important}}
@media(max-width:900px){.hiw-shell{width:calc(100% - 24px);max-width:none}.hiw-hero{height:310px;grid-template-columns:42% 58%}.hiw-hero-copy{padding-left:18px}.hiw-hero h1{font-size:40px}.hiw-steps{gap:8px;padding-inline:4px}.hiw-step-card{height:190px}.hiw-arrow{right:-18px}.hiw-trust-item{min-height:165px}.hiw-cta{grid-template-columns:22% 53% 25%}}
@media(max-width:700px){.hiw-shell{margin-top:8px}.hiw-hero{height:auto;display:block}.hiw-hero-copy{padding:18px 18px 20px;background:#fff}.hiw-hero-art{position:relative;inset:auto;height:230px}.hiw-hero-art:after{background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,0) 28%)}.hiw-hero h1{font-size:38px}.hiw-hero p{font-size:11px;line-height:1.8}.desktop-only{display:none}.hiw-section-title{height:48px}.hiw-section-title h2{font-size:18px}.hiw-section-title i{width:35px}.hiw-steps{grid-template-columns:1fr 1fr;gap:10px}.hiw-step-card{height:200px}.hiw-arrow{display:none}.hiw-after-grid{grid-template-columns:1fr 1fr;padding-inline:8px;gap:18px 5px}.hiw-after-grid:before{display:none}.hiw-trust-grid{grid-template-columns:1fr 1fr}.hiw-trust-item:nth-child(2n){border-right:0}.hiw-cta{height:auto;min-height:210px;display:flex;flex-direction:column;align-items:stretch}.hiw-cta-art{height:90px}.hiw-cta-copy{padding:15px 18px}.hiw-cta-button{margin:0 auto 16px}.hiw-cta:after{display:none}}
@media(max-width:430px){.hiw-hero h1{font-size:34px}.hiw-steps{grid-template-columns:1fr}.hiw-step-card{height:205px}.hiw-trust-grid{grid-template-columns:1fr}.hiw-trust-item{border-right:0;border-bottom:1px solid rgba(255,138,0,.18)}.hiw-trust-item:last-child{border-bottom:0}.hiw-section-title h2{font-size:16px}}

/* FINAL WORKFLOW CONTROLLER: JS toggles .hiw-active every 1.5s. */
.tm-how-page .hiw-step-card{animation:none !important}
.tm-how-page .hiw-step-card:before{animation:none !important;opacity:0 !important}
.tm-how-page .hiw-step-card .hiw-big-icon{animation:none !important}
.tm-how-page .hiw-step-card .hiw-arrow{animation:none !important}
.tm-how-page .hiw-step-card.hiw-active:before{opacity:1 !important;background:radial-gradient(circle at 50% 38%,rgba(123,49,232,.38),transparent 62%) !important;filter:blur(8px) !important}
