/* TAN V12 — rustige premium motion; progressive enhancement */
:root{--motion-ease:cubic-bezier(.22,1,.36,1)}
.hero{position:relative;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse 55% 70% at 92% 18%,rgba(139,205,126,.16),transparent 72%);animation:tanAmbient 13s ease-in-out infinite alternate}
@keyframes tanAmbient{from{opacity:.5;transform:translate3d(0,0,0)}to{opacity:1;transform:translate3d(-3%,2%,0)}}
.hero .eyebrow{display:inline-flex;align-items:center;gap:12px}
.hero .eyebrow::before{content:"";width:28px;height:2px;background:#a2d969;transform-origin:left;animation:tanLineIn 1s var(--motion-ease) both}
@keyframes tanLineIn{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.hero .hero-topic{position:relative;overflow:hidden;transition:background .35s ease,padding-left .35s ease}
.hero .hero-topic:hover{background:rgba(255,255,255,.065);padding-left:11px}
.hero .btn,.wizard-controls .btn{position:relative;overflow:hidden;isolation:isolate}
.hero .btn::after,.wizard-controls .btn::after{content:"";position:absolute;inset:-40% auto -40% -60%;width:35%;transform:skewX(-22deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.24),transparent);pointer-events:none;transition:left .7s ease}
.hero .btn:hover::after,.wizard-controls .btn:hover::after{left:125%}
.tan-reveal{opacity:0;transform:translate3d(0,27px,0);transition:opacity .85s var(--motion-ease),transform .85s var(--motion-ease)}
.tan-reveal.from-left{transform:translate3d(-28px,0,0)}
.tan-reveal.from-right{transform:translate3d(28px,0,0)}
.tan-reveal.is-visible{opacity:1;transform:translate3d(0,0,0)}
.tan-reveal:nth-child(2){transition-delay:.08s}.tan-reveal:nth-child(3){transition-delay:.15s}
.tan-sweep{position:relative;overflow:hidden}
.tan-sweep::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;background:linear-gradient(90deg,#77b63a,#b8e989);transform-origin:left;transform:scaleX(0);transition:transform 1.1s var(--motion-ease)}
.tan-sweep.is-visible::after{transform:scaleX(1)}
.step-grid>div,.cards .tile{transition:transform .35s var(--motion-ease),box-shadow .35s ease,border-color .35s ease}
.step-grid>div:hover,.cards .tile:hover{transform:translateY(-4px);border-color:#c6ddc4;box-shadow:0 15px 35px rgba(17,46,55,.075)}
#scan .formbox{transition:box-shadow .5s ease,border-color .5s ease}
#scan .formbox:focus-within{border-color:#a5c89b!important;box-shadow:0 26px 75px rgba(7,25,38,.16)!important}
#scan .progress-track{position:relative}
#scan .progress-track::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.48),transparent 65%);transform:translateX(-100%);animation:tanProgressLight 4s ease-in-out infinite;pointer-events:none}
@keyframes tanProgressLight{0%,30%{transform:translateX(-110%)}75%,100%{transform:translateX(110%)}}
#scan .wizard-step:not([hidden]){animation:tanPanelEnter .55s var(--motion-ease) both}
@keyframes tanPanelEnter{from{opacity:0;transform:translateY(18px);filter:blur(3px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
details[open] p{animation:tanPanelEnter .35s ease both}
@media(max-width:760px){.tan-reveal.from-left,.tan-reveal.from-right,.tan-reveal{transform:translateY(16px)}.tan-reveal.is-visible{transform:none}.hero::before{animation:none}}
@media(prefers-reduced-motion:reduce){.hero::before,.hero .eyebrow::before,.hero .btn::after,.wizard-controls .btn::after,#scan .progress-track::after{animation:none!important;transition:none!important}.tan-reveal{opacity:1!important;transform:none!important;transition:none!important}.tan-sweep::after{transform:scaleX(1)!important;transition:none!important}#scan .wizard-step:not([hidden]){animation:none!important}}