.hero{position:relative;min-height:100vh;display:flex;align-items:center;background:var(--gradient-primary);overflow:hidden}.hero-background{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0}.hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 50%,rgba(201,168,112,.1) 0%,transparent 50%),radial-gradient(circle at 80% 50%,rgba(201,168,112,.08) 0%,transparent 50%);z-index:1;pointer-events:none}.hero:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:600px;height:600px;background:url(/justice_overlay.webp) no-repeat center;background-size:contain;opacity:.05;z-index:1;pointer-events:none}.hero-overlay{position:absolute;inset:0;background:linear-gradient(135deg,#3d4f5ceb,#2a3942e0,#3d4f5ceb);z-index:1}.hero-content{position:relative;z-index:2;padding:var(--spacing-xl) 0}.hero-text{max-width:900px;margin:0 auto;text-align:center;color:var(--bg-white)}.hero-text h1{font-size:var(--font-size-4xl);color:var(--bg-white);margin-bottom:var(--spacing-sm);font-weight:900;text-shadow:2px 2px 8px rgba(0,0,0,.4);position:relative;display:inline-block}.hero-text h1:after{content:"";position:absolute;bottom:-15px;left:50%;transform:translate(-50%);width:120px;height:4px;background:var(--gradient-gold);border-radius:2px}.hero-text h2{font-size:var(--font-size-xl);color:var(--primary-gold);margin-bottom:var(--spacing-md);margin-top:var(--spacing-md);font-weight:600;text-shadow:1px 1px 4px rgba(0,0,0,.3)}.hero-subtitle{font-size:var(--font-size-lg);color:#fffffff2;margin-bottom:var(--spacing-lg);line-height:1.8;max-width:700px;margin-left:auto;margin-right:auto}.hero-stats{display:flex;justify-content:center;gap:var(--spacing-lg);margin:var(--spacing-lg) 0;flex-wrap:wrap}.stat-item{text-align:center;padding:var(--spacing-md);background:#ffffff1f;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-radius:var(--radius-md);border:1px solid rgba(201,168,112,.3);min-width:150px;transition:all var(--transition-base);position:relative;overflow:hidden}.stat-item:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--gradient-gold);transform:scaleX(0);transition:transform var(--transition-base)}.stat-item:hover{transform:translateY(-5px);background:#ffffff2e;border-color:var(--primary-gold);box-shadow:0 8px 25px #c9a87033}.stat-item:hover:before{transform:scaleX(1)}.stat-item h3{font-size:var(--font-size-2xl);color:var(--primary-gold);margin-bottom:var(--spacing-xs);font-weight:900;text-shadow:1px 1px 3px rgba(0,0,0,.3)}.stat-item p{font-size:var(--font-size-sm);color:#fffffff2;margin:0;font-weight:500}.hero-buttons{display:flex;gap:var(--spacing-md);justify-content:center;flex-wrap:wrap;margin-top:var(--spacing-lg)}.hero-buttons .btn{min-width:200px;box-shadow:0 4px 15px #0000004d}.hero-buttons .btn-primary{background:var(--gradient-gold);color:var(--primary-dark)}.hero-buttons .btn-primary:hover{transform:translateY(-3px);box-shadow:0 6px 25px #c9a87080}.hero-buttons .btn-outline{background:transparent;color:var(--bg-white);border:2px solid var(--bg-white)}.hero-buttons .btn-outline:hover{background:var(--bg-white);color:var(--primary-dark);transform:translateY(-3px);box-shadow:0 6px 25px #ffffff4d}.hero-content:before{content:"⚖";position:absolute;top:10%;right:5%;font-size:120px;color:#c9a87014;z-index:-1;animation:float 6s ease-in-out infinite}.hero-content:after{content:"⚖";position:absolute;bottom:10%;left:5%;font-size:100px;color:#c9a8700f;z-index:-1;animation:float 8s ease-in-out infinite reverse}@media(max-width:768px){.hero{min-height:90vh}.hero:after{width:400px;height:400px}.hero-text h1{font-size:var(--font-size-3xl)}.hero-text h1:after{width:80px;height:3px}.hero-text h2{font-size:var(--font-size-lg)}.hero-subtitle{font-size:var(--font-size-md)}.hero-stats{gap:var(--spacing-sm)}.stat-item{min-width:120px;padding:var(--spacing-sm)}.stat-item h3{font-size:var(--font-size-xl)}.hero-buttons .btn{min-width:160px;padding:.875rem 1.5rem}.hero-content:before,.hero-content:after{display:none}}@media(max-width:480px){.hero:after{width:300px;height:300px}.hero-buttons{flex-direction:column;align-items:stretch}.hero-buttons .btn{width:100%}}
