@import url(https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap);*{margin:0;padding:0;box-sizing:border-box}:root{--primary-color:#561f9b;--secondary-color:#f5f5f5;--text-color:#333333;--border-color:#e0e0e0;--success-color:#4caf50;--shadow-color:rgba(0, 0, 0, 0.1)}body{font-family:Inter,"Segoe UI",Roboto,-apple-system,BlinkMacSystemFont,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif;line-height:1.6;color:var(--text-color);background-color:#f9f9f9}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 20px}h1,h2,h3,h4{line-height:1.2;margin-bottom:.5em}header{background-color:#fff;box-shadow:0 2px 5px var(--shadow-color);position:sticky;top:0;z-index:100;height:auto}header .container{display:flex;justify-content:space-between;align-items:center;padding:10px 20px;max-width:1000px}header .logo img{height:32px;width:auto}.logo h1{font-size:1.8rem;font-weight:700;color:var(--primary-color);margin:0}.logo-text{font-size:1.8rem;font-weight:700;color:var(--primary-color);letter-spacing:.5px;text-transform:uppercase}nav ul{display:flex;list-style:none}nav ul li{margin-left:20px}nav ul li a{text-decoration:none;color:var(--text-color);font-weight:500;transition:color .2s}nav ul li a:hover{color:var(--primary-color)}section{padding:40px 0}.generator-section{padding-top:40px;padding-bottom:60px}.generator-section .container{max-width:900px;padding:0 40px}.generator-heading{text-align:center;margin-bottom:30px}.generator-heading h1{font-size:2.4rem;color:var(--text-color);margin-bottom:10px;line-height:1.2}.generator-heading p{font-size:1.1rem;color:#666;max-width:700px;margin:0 auto}.password-strength-container{width:100%;margin-top:5px;margin-bottom:15px}.password-strength-meter{height:8px;width:100%;border-radius:4px;background-color:#e0e0e0;position:relative;overflow:hidden;transition:all .3s ease}.strength-very-weak{background-color:#ff4d4d;width:20%}.strength-weak{background-color:#ffa64d;width:40%}.strength-medium{background-color:#ffff4d;width:60%}.strength-strong{background-color:#4dff4d;width:80%}.strength-very-strong{background-color:#0c0;width:100%}.password-box{background-color:#fff;border-radius:8px;box-shadow:0 4px 10px var(--shadow-color);margin-bottom:30px;overflow:hidden;border:1px solid var(--border-color)}.password-display{display:flex;justify-content:space-between;align-items:center;padding:20px 30px;position:relative;font-size:1.5rem;min-height:70px}#password-text{font-family:"Courier New",monospace;word-break:break-all;flex-grow:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:10px}.password-actions{display:flex;gap:10px;flex-shrink:0}.password-actions button{background:0 0;border:none;cursor:pointer;font-size:1.25rem;opacity:.7;transition:opacity .2s}.password-actions button:hover{opacity:1}.customize-box{background-color:#fff;border-radius:8px;box-shadow:0 4px 10px var(--shadow-color);padding:25px 30px;margin-bottom:30px}.customize-box h2{margin-bottom:20px;font-size:1.5rem;font-weight:600}.option-row{display:flex;flex-direction:column;margin-bottom:20px}.length-control{display:flex;align-items:center;gap:15px}#password-length{width:70px;padding:10px 12px;border:1px solid var(--border-color);border-radius:6px;font-size:1rem;font-weight:500;color:var(--primary-color);box-shadow:0 1px 3px rgba(0,0,0,.05);transition:all .2s ease;text-align:center;font-family:Inter,sans-serif}#password-length:focus{outline:0;box-shadow:0 2px 8px rgba(86,31,155,.15)}#length-slider{flex-grow:1;-webkit-appearance:none;appearance:none;height:8px;background:#e0e0e0;border-radius:4px;outline:0;position:relative}#length-slider::-webkit-slider-runnable-track{height:8px;border-radius:4px}#length-slider{background:linear-gradient(to right,var(--primary-color) 0,var(--primary-color) 50%,#e0e0e0 50%,#e0e0e0 100%)}#length-slider::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;background:var(--primary-color);border-radius:50%;cursor:pointer;margin-top:-10px;border:none;box-shadow:0 2px 4px rgba(0,0,0,.2)}#length-slider::-moz-range-thumb{width:28px;height:28px;background:var(--primary-color);border-radius:50%;cursor:pointer;border:none;box-shadow:0 2px 4px rgba(0,0,0,.2)}#length-slider::-moz-range-progress{background-color:var(--primary-color);height:8px;border-radius:4px}.options-grid{display:flex;flex-direction:column;gap:20px}.options-container{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-start}.option-group{display:flex;flex-wrap:wrap;gap:15px}.option-group-vertical{display:flex;flex-direction:column;gap:10px;min-width:180px}.option-group-horizontal{display:flex;flex-wrap:wrap;gap:15px}.option-label{font-weight:600;font-size:.95rem;color:#555;margin-bottom:8px;display:block}.option{display:flex;align-items:center;gap:4px;margin-bottom:0;min-width:80px}.option label{font-size:1rem;cursor:pointer;font-weight:500;line-height:1}.option input[type=checkbox],.option input[type=radio]{position:relative;-webkit-appearance:none;-moz-appearance:none;appearance:none;width:22px;height:22px;border:2px solid var(--border-color);outline:0;cursor:pointer;margin-right:10px;background-color:#fff;transition:all .2s ease;flex-shrink:0;display:flex;align-items:center;justify-content:center}.option input[type=checkbox]{border-radius:4px}.option input[type=radio]{border-radius:50%}.option input[type=checkbox]:checked,.option input[type=radio]:checked{background-color:var(--primary-color);border-color:var(--primary-color)}.option input[type=checkbox]:checked::after{content:"";display:block;width:6px;height:10px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg);position:absolute;top:50%;left:50%;margin-top:-7px;margin-left:-3px}.option input[type=radio]:checked::after{content:"";display:block;width:10px;height:10px;border-radius:50%;background-color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.option input[type=checkbox]:focus,.option input[type=radio]:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(86,31,155,.15)}.action-box{display:flex;justify-content:center}#generate-btn{background-color:var(--primary-color);color:#fff;border:none;padding:12px 30px;font-size:1rem;font-weight:600;border-radius:4px;cursor:pointer;transition:background-color .2s}#generate-btn:hover{background-color:#441785}.blog-section{background-color:#fff;padding:40px 0 60px}.blog-section article{max-width:800px;margin:0 auto;line-height:1.7}.blog-section h2{margin-bottom:25px;font-size:1.8rem;color:var(--text-color);text-align:center;font-weight:600}.blog-section h3{margin-top:30px;margin-bottom:15px;font-size:1.4rem;color:var(--text-color);font-weight:600}.blog-section p{margin-bottom:18px;text-align:justify}.blog-section ul{margin:0 0 20px 25px;list-style-type:none}.blog-section li{margin-bottom:10px;position:relative;padding-left:18px}.blog-section li::before{content:"•";color:var(--primary-color);font-weight:700;position:absolute;left:0;top:0}@media (max-width:768px){.blog-section article{padding:0 15px}.blog-section h2{font-size:1.6rem;text-align:left;line-height:1.3}.blog-section p{text-align:left}.blog-section ul{margin-left:15px}.blog-section h3{font-size:1.3rem}}@media (max-width:480px){header{max-height:75px;overflow:hidden}header .container{padding:6px 15px;flex-direction:row;flex-wrap:wrap;gap:0}header .logo{width:100%;margin-bottom:2px;display:flex;justify-content:center}header .logo img{height:25px}nav{width:100%;display:flex;justify-content:center}nav ul{margin-top:0;padding:0;justify-content:center}nav ul li{margin:0 10px}nav ul li a{font-size:.9rem}.generator-heading h1{font-size:1.8rem}.password-display{padding:15px;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center}.password-actions{gap:5px;position:relative;right:0}#password-text{font-size:1.1rem;max-width:70%}.blog-section h2{font-size:1.4rem}.blog-section h3{font-size:1.2rem}}footer{background-color:#333;color:#fff;padding:20px 0;text-align:center}@media (max-width:768px){.options-grid{grid-template-columns:1fr}.password-display{font-size:1.2rem;padding:15px 20px}.customize-box{padding:20px 25px}.option-row{margin-bottom:20px}.generator-section .container{padding:0 20px}.generator-heading h1{font-size:2.1rem}}@media (max-width:480px){header .container{padding:6px 15px}header .logo img{height:25px}nav ul{margin-top:5px}nav ul li{margin-left:15px}nav ul li a{font-size:.9rem}.generator-heading h1{font-size:1.8rem}.password-display{padding:15px;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center}.password-actions{gap:5px;position:relative;right:0}#password-text{font-size:1.1rem;max-width:70%}.blog-section h2{font-size:1.4rem}.blog-section h3{font-size:1.2rem}}.password-actions button{background:0 0;border:none;cursor:pointer;font-size:1.25rem;opacity:.8;transition:opacity .2s,transform .2s;display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:0 0}.password-actions button:hover{opacity:1;transform:scale(1.1);background:0 0}.password-actions .icon{width:22px;height:22px;display:flex;align-items:center;justify-content:center;color:var(--primary-color)}.password-actions .icon svg{stroke:var(--primary-color)}.faq-section{background-color:var(--secondary-color)}.faq-items{display:flex;flex-direction:column;gap:15px}.faq-item{background-color:#fff;border-radius:8px;box-shadow:0 2px 5px var(--shadow-color);overflow:hidden}.faq-question{padding:18px 20px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;transition:all .1s ease-out}.faq-question h3{margin:0;font-size:1.1rem;color:var(--text-color);font-weight:600}.faq-toggle{width:24px;height:24px;border-radius:50%;background-color:var(--primary-color);display:flex;align-items:center;justify-content:center;position:relative;transition:all .2s ease-out;flex-shrink:0;min-width:24px}.faq-toggle::after,.faq-toggle::before{content:"";position:absolute;background-color:#fff;transition:all .2s ease-out}.faq-toggle::before{width:2px;height:12px;transform:translateX(0)}.faq-toggle::after{width:12px;height:2px}.faq-answer{max-height:0;overflow:hidden;transition:max-height .25s ease-out,opacity .25s ease-out,padding .25s ease-out;padding:0 20px;opacity:0;will-change:max-height,opacity,padding;visibility:visible}.faq-item.active .faq-answer{max-height:1000px;padding:0 20px 20px;opacity:1;visibility:visible}.faq-item.active .faq-toggle{transform:rotate(180deg);background-color:var(--text-color);transition:all .2s ease-out}.faq-item.active .faq-toggle::before{transform:rotate(90deg)}.faq-item.active .faq-question{border-bottom:1px solid #eee;transition:all .2s ease-out}@media (max-width:768px){.faq-question h3{font-size:1rem}}@media (max-width:768px){.customize-box{padding:20px 25px}.options-container{flex-direction:column;gap:15px}}@media (max-width:480px){.customize-box{padding:15px 20px}.option-group-horizontal{flex-wrap:wrap}.option{min-width:70px}}html{scroll-behavior:smooth}section[id]{scroll-margin-top:80px}