.shield-layout{display:flex;align-items:center;gap:48px}.shield-visual{flex:0 0 280px;display:flex;align-items:center;justify-content:center;position:relative}.shield-visual:before,.shield-visual:after{content:"";position:absolute;border-radius:50%;pointer-events:none;z-index:0}.shield-visual:before{width:220px;height:220px;top:10%;left:-10%;background:radial-gradient(circle,#fbbf24 0%,#f59e0b 60%,transparent 100%);opacity:.15;filter:blur(80px);animation:blob-drift 8s ease-in-out infinite alternate}.shield-visual:after{width:180px;height:180px;bottom:5%;right:-5%;background:radial-gradient(circle,#f97316 0%,#ea580c 60%,transparent 100%);opacity:.12;filter:blur(80px);animation:blob-drift 10s ease-in-out infinite alternate-reverse}@keyframes blob-drift{0%{transform:translate(0) scale(1)}to{transform:translate(12px,-8px) scale(1.08)}}.shield-content{flex:1;min-width:0}.shield-container{position:relative;width:240px;height:280px;display:flex;align-items:center;justify-content:center;z-index:1}.shield-outline{opacity:0;transition:opacity .3s ease}.shield-outline.is-drawing{opacity:1;filter:drop-shadow(0 0 8px rgba(245,158,11,.5));animation:metallic-draw 2s cubic-bezier(.4,0,.2,1) forwards;transition:opacity .3s ease,filter .6s ease}@keyframes metallic-draw{0%{filter:drop-shadow(0 0 4px rgba(245,158,11,.8)) brightness(2)}50%{filter:drop-shadow(0 0 16px rgba(245,158,11,.4)) brightness(1)}to{filter:drop-shadow(0 0 8px rgba(245,158,11,.5))}}.shield-particle{position:absolute;width:4px;height:4px;background:#fbbf24;border-radius:50%;filter:drop-shadow(0 0 4px #fbbf24) drop-shadow(0 0 10px #f59e0b);opacity:0;pointer-events:none;z-index:0;animation:particle-float 3s ease-in-out infinite}@keyframes particle-float{0%{transform:translateY(0) scale(.5);opacity:0}30%{opacity:.8}70%{opacity:.8}to{transform:translateY(-60px) scale(1.5);opacity:0}}.shield-core{opacity:0;transition:opacity .8s ease}.shield-core.is-filled{opacity:1;fill:url(#core-gradient-fill);background:radial-gradient(circle at 50% 40%,#fbbf24,#f59e0b 70%,#d97706)}.shield-core.is-pulsing{animation:core-pulse 2.5s ease-in-out infinite}@keyframes core-pulse{0%,to{opacity:.88;filter:brightness(1);transform:scale(1)}50%{opacity:1;filter:brightness(1.08);transform:scale(1.015)}}.shield-ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(.5);opacity:0;transition:opacity .6s ease,transform .6s cubic-bezier(.22,1,.36,1)}.shield-ring circle,.shield-ring ellipse,.shield-ring path{stroke-dasharray:6 4}.shield-ring.is-visible{opacity:1;transform:translate(-50%,-50%) scale(1);filter:drop-shadow(0 0 6px rgba(245,158,11,.35))}.shield-ring-1.is-visible{animation:ring-rotate 20s linear infinite}.shield-ring-2.is-visible{animation:ring-rotate-reverse 25s linear infinite}@keyframes ring-rotate{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes ring-rotate-reverse{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(-360deg)}}.shield-check{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);opacity:0;transition:opacity .3s ease}.shield-check.is-drawn{opacity:1;filter:drop-shadow(0 0 12px rgba(34,197,94,.6)) drop-shadow(0 0 4px rgba(34,197,94,.3))}.shield-check.flash{animation:check-flash .3s ease-out}@keyframes check-flash{0%{filter:drop-shadow(0 0 12px rgba(34,197,94,.6)) drop-shadow(0 0 4px rgba(34,197,94,.3))}40%{filter:drop-shadow(0 0 30px rgba(34,197,94,.9)) drop-shadow(0 0 60px rgba(34,197,94,.5)) drop-shadow(0 0 6px rgba(255,255,255,.8))}to{filter:drop-shadow(0 0 12px rgba(34,197,94,.6)) drop-shadow(0 0 4px rgba(34,197,94,.3))}}.shield-container.is-glowing{animation:shield-glow 2.5s ease-in-out infinite}@keyframes shield-glow{0%,to{filter:drop-shadow(0 0 16px rgba(245,158,11,.4)) drop-shadow(0 0 4px rgba(245,158,11,.2))}50%{filter:drop-shadow(0 0 40px rgba(245,158,11,.7)) drop-shadow(0 0 12px rgba(245,158,11,.4))}}.shield-container.is-floating{animation:shield-float 3s ease-in-out infinite,shield-glow 2.5s ease-in-out infinite}@keyframes shield-float{0%,to{transform:translateY(6px)}50%{transform:translateY(-6px)}}.shield-labels{display:flex;flex-direction:column;gap:12px;margin-top:8px}.shield-label{display:inline-flex;align-items:center;gap:10px;padding:10px 16px;background:#ffffffb3;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-radius:12px;border:1px solid rgba(255,255,255,.3);border-left:3px solid #f59e0b;box-shadow:0 4px 16px #0000000f,0 1px 3px #0000000a,inset 0 1px #ffffff80;font-size:.95rem;font-weight:600;color:#1a1a2e;opacity:0;transition:opacity .5s ease,transform .5s ease,box-shadow .3s ease;cursor:default}.shield-label:nth-child(odd){transform:translate(-30px)}.shield-label:nth-child(2n){transform:translate(30px)}.shield-label.is-visible{opacity:1;transform:translate(0);transition:opacity .6s cubic-bezier(.34,1.56,.64,1),transform .6s cubic-bezier(.34,1.56,.64,1),box-shadow .3s ease}.shield-label:hover{transform:translateY(-2px);box-shadow:0 8px 24px #f59e0b1f,0 4px 12px #0000000f,inset 0 1px #fff9}.shield-label-icon{font-size:1.25rem;flex-shrink:0}.shield-label-text{color:#64748b;font-weight:500}.shield-tagline{text-align:center;margin-top:24px;font-size:1.125rem;font-weight:700;background:linear-gradient(135deg,#f59e0b,#d97706 40%,#fbbf24);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;opacity:0;transform:translateY(12px);transition:opacity .6s ease,transform .6s ease}.shield-tagline.is-visible{opacity:1;transform:translateY(0)}@media(max-width:768px){.shield-layout{flex-direction:column;gap:32px;text-align:center}.shield-visual{flex:none}.shield-visual:before{width:160px;height:160px}.shield-visual:after{width:130px;height:130px}.shield-labels{align-items:center}}@media(max-width:480px){.shield-container{width:200px;height:240px}.shield-label{padding:8px 12px;font-size:.85rem}.shield-visual:before,.shield-visual:after{filter:blur(60px)}.shield-tagline{font-size:1rem}}@media(prefers-reduced-motion:reduce){.shield-outline-path{transition:none;stroke-dashoffset:0}.shield-core{transition:none;opacity:1}.shield-core.is-pulsing{animation:none}.shield-ring{transition:none;opacity:1;transform:translate(-50%,-50%) scale(1)}.shield-ring-1.is-visible,.shield-ring-2.is-visible{animation:none}.shield-check-path{transition:none;stroke-dashoffset:0}.shield-check.flash{animation:none}.shield-container.is-glowing{animation:none;filter:drop-shadow(0 0 8px rgba(245,158,11,.3))}.shield-container.is-floating{animation:none;transform:none}.shield-label,.shield-tagline{transition:none;opacity:1;transform:none}.shield-visual:before,.shield-visual:after{animation:none}.shield-outline.is-drawing{filter:none}}
