.password-hero-section {background: linear-gradient(135deg,#f8f9fa 0%,#e9ecef 100%);}
.password-hero-section .card {border-radius: 1rem;overflow: hidden;border: none;box-shadow: 0 10px 30px rgba(0,0,0,.1) !important;}
.password-hero-section h1 {font-size: 2.5rem;}
@media (max-width: 767.98px) {.password-hero-section h1 {font-size: 1.8rem;}}
.password-hero-section .lead {font-size: 1.1rem;color: #4a5568;}
@media (max-width: 767.98px) {.password-hero-section .lead {font-size: 1rem;}}
.password-hero-section #passwordResult {font-family: monospace;font-size: 1.1rem;letter-spacing: .5px;background-color: #f8f9fa !important;}
.password-hero-section .input-group .btn {padding: .75rem 1rem;}
.password-hero-section .input-group .btn i {font-size: 1.1rem;}
.password-hero-section .input-group .btn-outline-primary {border-color: #dee2e6;border-left: none;}
@media (hover: hover) {.password-hero-section .input-group .btn-outline-primary:hover {background-color: #0d6efd;border-color: #0d6efd;color: white;}}
.password-hero-section .input-group .btn-outline-secondary {border-color: #dee2e6;border-left: none;}
@media (hover: hover) {.password-hero-section .input-group .btn-outline-secondary:hover {background-color: #6c757d;border-color: #6c757d;color: white;}}
.password-hero-section .form-range {width: 100%;height: .5rem;background-color: #e2e8f0;border-radius: .5rem;}
.password-hero-section .form-range::-webkit-slider-thumb {width: 1rem;height: 1rem;background-color: #0d6efd;border: none;border-radius: 50%;cursor: pointer;transition: transform .2s ease;}
@media (hover: hover) {.password-hero-section .form-range::-webkit-slider-thumb:hover {transform: scale(1.2);}}
.password-hero-section .form-range:focus {outline: none;}
.password-hero-section #lengthValue {font-size: .9rem;padding: .25rem .5rem;background-color: #0d6efd;color: white;border-radius: 20px;}
.password-hero-section .form-check {margin-bottom: .75rem;}
.password-hero-section .form-check .form-check-input {width: 1.1rem;height: 1.1rem;margin-top: .15rem;cursor: pointer;border: 2px solid #cbd5e1;}
.password-hero-section .form-check .form-check-input:checked {background-color: #0d6efd;border-color: #0d6efd;}
.password-hero-section .form-check .form-check-input:focus {box-shadow: 0 0 0 .2rem rgba(13,110,253,.15);}
.password-hero-section .form-check .form-check-label {cursor: pointer;color: #1e293b;}
.password-hero-section .form-check .form-check-label i {color: #64748b;width: 1.2rem;}
.password-hero-section .progress {background-color: #e2e8f0;border-radius: .5rem;overflow: hidden;}
.password-hero-section .progress .progress-bar {transition: width .3s ease,background-color .3s ease;}
.password-hero-section .progress .progress-bar.bg-weak {background-color: #dc2626 !important;}
.password-hero-section .progress .progress-bar.bg-fair {background-color: #f59e0b !important;}
.password-hero-section .progress .progress-bar.bg-good {background-color: #10b981 !important;}
.password-hero-section .progress .progress-bar.bg-strong {background-color: #059669 !important;}
.password-hero-section #strengthText {transition: color .3s ease;}
.password-hero-section #strengthText.text-weak {color: #dc2626 !important;}
.password-hero-section #strengthText.text-fair {color: #f59e0b !important;}
.password-hero-section #strengthText.text-good {color: #10b981 !important;}
.password-hero-section #strengthText.text-strong {color: #059669 !important;}
.password-hero-section .btn-primary {padding: .75rem 2rem;transition: all .2s ease;}
@media (hover: hover) {.password-hero-section .btn-primary:hover {transform: translateY(-2px);box-shadow: 0 5px 15px rgba(13,110,253,.3);}}
.password-hero-section .alert-light {background-color: #f8fafc;border: 1px solid #e2e8f0;border-radius: .75rem;}
.password-hero-section .alert-light i {font-size: 1.1rem;}
.password-tips-section .card {transition: all .3s ease;border-radius: 1rem;}
@media (hover: hover) {.password-tips-section .card:hover {transform: translateY(-4px);box-shadow: 0 10px 25px rgba(0,0,0,.1) !important;}}
.password-tips-section .card .bg-opacity-10 {width: 56px;height: 56px;display: inline-flex;align-items: center;justify-content: center;border-radius: 1rem !important;}
.password-tips-section .card .card-title {font-size: 1.1rem;font-weight: 600;color: #1e293b;}
.password-tips-section .card .card-text {font-size: .9rem;line-height: 1.5;color: #4a5568;}
@media (max-width: 767.98px) {.password-hero-section h1 {font-size: 2rem;}
	.password-hero-section .lead {font-size: 1rem;}
	.password-hero-section .input-group .btn {padding: .5rem .75rem;}
	.password-hero-section .form-check {margin-bottom: .5rem;}
	.password-hero-section .btn-primary {width: 100%;}
	.password-tips-section .col-md-4 {margin-bottom: 1rem;}}
@keyframes fadeInUp {from {opacity: 0;transform: translateY(20px);}
	to {opacity: 1;transform: translateY(0);}}
.password-hero-section .card {animation: fadeInUp .5s ease-out;}