* {

      margin: 0;

      padding: 0;

      box-sizing: border-box;

      font-family: Arial, Helvetica, sans-serif;

    }



    body {

      background: #f7f9fc;

      color: #172033;

      line-height: 1.75;

    }



    header {

      background: #071b35;

      color: white;

      padding: 18px 6%;

      display: flex;

      align-items: center;

      justify-content: space-between;

    }



    .logo {

      font-size: 21px;

      font-weight: 800;

    }



    .logo span {

      color: #f4c542;

    }



    nav a {

      color: white;

      text-decoration: none;

      margin-left: 24px;

      font-size: 15px;

      font-weight: 600;

    }



    nav a:hover {

      color: #f4c542;

    }



    .hero {

      background: linear-gradient(135deg, #071b35, #0d3b66);

      color: white;

      text-align: center;

      padding: 70px 6%;

    }



    .hero h1 {

      font-size: clamp(36px, 6vw, 58px);

      margin-bottom: 12px;

    }



    .hero h1 span {

      color: #f4c542;

    }



    .hero p {

      color: #dbe7f5;

      font-size: 17px;

    }



    .container {

      max-width: 1000px;

      margin: auto;

      padding: 60px 6%;

    }



    .section {

      background: white;

      padding: 38px;

      margin-bottom: 22px;

      border-radius: 16px;

      border: 1px solid #e5eaf1;

      box-shadow: 0 7px 25px rgba(0,0,0,.05);

    }



    .section h2 {

      color: #071b35;

      font-size: 27px;

      margin-bottom: 14px;

    }



    .section h2 span {

      color: #f4c542;

    }



    .section p {

      color: #5f6d82;

      margin-bottom: 14px;

    }



    .section ul {

      color: #5f6d82;

      margin: 10px 0 18px 22px;

    }



    .section li {

      margin-bottom: 8px;

    }



    .important {

      background: #fffaf0;

      border-left: 5px solid #f4c542;

    }



    .email {

      color: #0d3b66;

      font-weight: 700;

      text-decoration: none;

    }



    footer {

      background: #041225;

      color: #b9c5d6;

      text-align: center;

      padding: 30px 6%;

      font-size: 14px;

    }



    footer strong {

      color: white;

    }



    @media (max-width: 700px) {

      header {

        padding: 15px 5%;

      }



      nav {

        display: none;

      }



      .hero {

        padding: 55px 5%;

      }



      .container {

        padding: 40px 5%;

      }



      .section {

        padding: 25px;

      }

    }

  

.site-footer {

  background:#041225;

  color:#b9c5d6;

  padding:55px 6% 20px;

  margin-top:40px;

}

.footer-container {

  max-width:1200px;

  margin:auto;

  display:grid;

  grid-template-columns:2fr 1fr 1fr 1.4fr;

  gap:45px;

}

.footer-logo {

  color:white;

  font-size:21px;

  font-weight:800;

  margin-bottom:12px;

}

.footer-logo span { color:#f4c542; }

.footer-brand p { margin-bottom:10px; }

.footer-column h3 {

  color:white;

  font-size:17px;

  margin-bottom:16px;

}

.footer-column a {

  display:block;

  color:#b9c5d6;

  text-decoration:none;

  margin-bottom:10px;

  font-size:14px;

}

.footer-column a:hover { color:#f4c542; }

.footer-bottom {

  max-width:1200px;

  margin:40px auto 0;

  padding-top:20px;

  border-top:1px solid rgba(255,255,255,.12);

  text-align:center;

  font-size:13px;

}

.footer-bottom strong { color:white; }

@media(max-width:750px) {

  .footer-container { grid-template-columns:1fr 1fr; }

}

@media(max-width:500px) {

  .footer-container { grid-template-columns:1fr; }

}

.wa-float {

  position: fixed;

  right: 22px;

  bottom: 22px;

  z-index: 99999;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 10px;

  min-height: 52px;

  padding: 0 20px 0 14px;

  background: #25D366;

  color: #ffffff;

  text-decoration: none;

  border-radius: 999px;

  box-shadow: 0 7px 22px rgba(0,0,0,.20);

  font-size: 15px;

  font-weight: 800;

  line-height: 1;

  letter-spacing: .1px;

  white-space: nowrap;

  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;

}



.wa-float:hover {

  transform: translateY(-2px);

  background: #20c863;

  box-shadow: 0 11px 28px rgba(0,0,0,.25);

}



.wa-float:active {

  transform: translateY(0);

}



.wa-icon {

  width: 30px;

  height: 30px;

  flex: 0 0 30px;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  background: #ffffff;

  color: #25D366;

  border-radius: 50%;

}



.wa-icon svg {

  width: 19px;

  height: 19px;

  display: block;

}



@media (max-width: 600px) {

  .wa-float {

    right: 15px;

    bottom: 15px;

    min-height: 48px;

    padding: 0 15px 0 11px;

    gap: 8px;

    font-size: 14px;

  }



  .wa-icon {

    width: 28px;

    height: 28px;

    flex-basis: 28px;

  }



  .wa-icon svg {

    width: 18px;

    height: 18px;

  }

}

.author-box{

    margin:30px 0;

    padding:20px;

    border:1px solid #ddd;

    border-radius:10px;

    background:#f8f9fa;

}

.author-box strong{

    display:block;

    font-size:18px;

    margin-bottom:5px;

}

.author-box span{

    display:block;

    font-size:14px;

    margin-bottom:12px;

    color:#555;

}

.author-box p{

    margin:0;

    line-height:1.6;

}
