*{margin:0;padding:0;box-sizing:border-box}body{overflow-x:hidden;margin:0;padding:0}html,body{height:100%;margin:0;display:flex;flex-direction:column;font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;background-color:#e2dfdf;color:#333;line-height:1.6}body{flex-grow:1}a{text-decoration:none;color:inherit}main{padding-top:50px;flex-grow:1;padding-bottom:40px}header{position:fixed;top:0;left:0;width:100%;background-color:#35424a;color:#fff;z-index:1000;box-shadow:0 2px 5px rgba(0,0,0,0.1);}.containerh{max-width:1100px;margin:0 auto;padding:10px 20px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}.left{display:flex;align-items:center;gap:15px}.site-title{font-size:clamp(18px,4vw,28px);color:#fff}nav ul{list-style:none;display:flex;gap:20px}nav ul li a{color:#fff;font-weight:bold;padding:10px 15px;border-radius:5px;transition:background-color .3s ease}nav ul li a:hover{background-color:#2a363f}.menu-toggle{display:none;font-size:24px;background:none;border:none;color:#fff;cursor:pointer;transition:transform .3s ease;z-index:1100}.menu-toggle:hover{transform:scale(1.1)}.menu-toggle.animate{animation:pulse .4s ease}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.2)}100%{transform:scale(1)}}.tool-buttons-section{background:linear-gradient(135deg,#565240 0%,#786b3b 100%);padding:60px 20px;text-align:center;border-bottom:2px solid #ddd;transition:background .5s ease}.tool-buttons-section .section-title{font-size:2rem;margin-bottom:30px;color:#333;text-align:center;max-width:90%;margin-left:auto;margin-right:auto;word-wrap:break-word}@media(max-width:768px){.tool-buttons-section .section-title{font-size:1.5rem}}@media(max-width:400px){.tool-buttons-section .section-title{font-size:1.3rem}}.tool-buttons{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;padding:0;margin:0 auto;max-width:1100px}.tool-btn{background:linear-gradient(135deg,#56e1c3 0%,#ece3c2 100%);color:#333;padding:15px 25px;border-radius:12px;font-size:1rem;font-weight:500;text-decoration:none;box-shadow:0 4px 12px rgba(0,0,0,0.1);transition:transform .3s ease,background-color .3s ease,box-shadow .3s ease;min-width:180px;text-align:center}.tool-btn:hover{background-color:#729cbf;color:#73738e;transform:translateY(-3px) scale(1.05);box-shadow:0 6px 18px rgba(84,153,227,0.2)}footer{background-color:#35424a;color:#fff;text-align:center;padding:10px 0;font-size:.95rem;margin-top:auto;box-shadow:0 -2px 5px rgba(0,0,0,0.05);width:100%}footer p{margin:0;line-height:1.5}@media(max-width:768px){nav{position:absolute;top:100%;left:0;width:100%;background-color:#35424a;border-bottom-left-radius:8px;border-bottom-right-radius:8px;padding:0;overflow:hidden;max-height:0;transition:max-height .4s ease-out;z-index:999}.nav-visible{max-height:500px;transition:max-height .4s ease-in}nav ul{flex-direction:column;padding:10px 20px;gap:10px}nav ul li{width:100%}nav ul li a{display:block;width:100%;padding:15px 20px}.menu-toggle{display:block}.site-title{font-size:clamp(18px,5vw,28px)}.tool-buttons{flex-direction:column;gap:15px;align-items:center}.tool-btn{width:80%;min-width:unset;padding:15px 0}.welcome-content{padding:30px 20px;margin:20px 10px}.welcome-content h2{font-size:1.6rem}.welcome-content h3{font-size:1.3rem}.welcome-content p{font-size:.95rem}footer{font-size:.85rem;padding:15px 10px}}footer{background-color:#35424a;color:#fff;text-align:center;padding:20px 10px;font-size:.85rem;margin-top:auto;box-shadow:0 -2px 5px rgba(0,0,0,0.05)}.footer-links{display:flex;flex-direction:column;gap:8px;margin-bottom:20px}.footer-link{color:#fff;text-decoration:underline;font-weight:500;transition:color .3s ease}.footer-link:hover{color:#cce7ff}footer p{margin:0;line-height:1.5}@media(min-width:768px){.footer-links{flex-direction:row;justify-content:center;gap:20px}}@media(max-width:400px){.tool-buttons-section{padding:40px 10px}.tool-buttons-section .section-title{font-size:1.5rem}.tool-btn{font-size:.9rem;padding:12px 0}}.faq-section{padding:60px 20px;font-family:'Segoe UI',sans-serif;border-radius:15px;background:linear-gradient(135deg,#ac92e4 0%,#df74c1 100%)}.faq-section{max-width:800px;margin:50px auto;font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,#bba6ec 0%,#e8a9d6 100%)}.faq-title{text-align:center;font-size:2.5rem;margin-bottom:40px;color:#1e2a78}.faq-container{border-radius:15px;overflow:hidden}.faq-item{background:#eee;margin-bottom:10px;border-radius:12px}.faq-subtitle{font-size:1.5rem;font-weight:600;margin:2rem 0 1rem 0;color:#333;border-left:4px solid #4CAF50;padding-left:.75rem}.faq-question:hover{background-color:#908c8c}@media(max-width:768px){.faq-subtitle{font-size:1.25rem}}@media(max-width:480px){.faq-subtitle{font-size:1.1rem;padding-left:.5rem;margin:1.5rem 0 .75rem 0}}.faq-item{border-bottom:1px solid #ccc;margin-bottom:20px;transition:all .3s ease}.faq-question{background:#fff;color:#1e2a78;font-size:1.2rem;padding:15px 50px 15px 20px;width:100%;text-align:left;border-radius:12px;cursor:pointer;outline:none;position:relative;font-weight:600}.faq-question::after{content:'+';font-size:1.4rem;position:absolute;right:20px;top:16px;transition:transform .3s ease}.faq-question.active::after{transform:rotate(45deg)}.faq-answer{max-height:0;overflow:hidden;background:#f1f2f6;transition:max-height .5s ease;padding:0 20px;border-radius:10px}.faq-answer p{padding:15px 0;margin:0;font-size:1rem;color:#333}
.gradient-letter {
  background: linear-gradient(45deg, #ecf388, #7eb9ec); /* Your gradient */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-weight: bold;
  
  color: transparent;
}
section h1,
article h1,
nav h1,
aside h1 {
  font-size: 2rem;
}

footer {
  background: #62593c;
  color: #fff;
  text-align: center;
  padding: 35px 20px;
  font-size: 16px;
}

.footer-links {
  margin-bottom: 18px;
  display: flex;
  justify-content: center;
  gap: 25px;
  flex-wrap: wrap;
}

.footer-link {
  color: #ddd;
  font-size: 16px;
  text-decoration: none;
  font-weight: 500;
  display: center;
  align-items: center;
  gap: 8px;
  transition: color 0.3s ease;
}

.footer-link i {
  font-size: 18px;
  color: #84e2b2;
}

.footer-link:hover {
  color: #fff;
  text-decoration: underline;
}

.footer-social {
  margin: 20px 0;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 15px;
}

.social-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 15px;
  border-radius: 25px;
  background: #383535;
  color: #ddd;
  font-size: 17px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.social-link i {
  font-size: 18px;
}

.social-link:hover {
  background: #efd879;
  color: #fff;
  transform: translateY(-2px);
}
