* {

      margin: 0;

      padding: 0;

      box-sizing: border-box;

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

    }



    body {

      background: #f7f9fc;

      color: #172033;

      line-height: 1.7;

    }



    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: 80px 6%;

    }



    .hero h1 {

      font-size: clamp(38px, 6vw, 60px);

      margin-bottom: 15px;

    }



    .hero h1 span {

      color: #f4c542;

    }



    .hero p {

      max-width: 750px;

      margin: auto;

      color: #dbe7f5;

      font-size: 18px;

    }



    .container {

      max-width: 1050px;

      margin: auto;

      padding: 70px 6%;

    }



    .section {

      background: white;

      padding: 35px;

      margin-bottom: 25px;

      border-radius: 16px;

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

      border: 1px solid #e7ebf1;

    }



    .section h2 {

      color: #071b35;

      font-size: 30px;

      margin-bottom: 15px;

    }



    .section h2 span {

      color: #f4c542;

    }



    .section p {

      color: #5f6d82;

      margin-bottom: 14px;

    }



    .topics {

      display: grid;

      grid-template-columns: repeat(3, 1fr);

      gap: 18px;

      margin-top: 25px;

    }



    .topic {

      background: #f7f9fc;

      padding: 22px;

      border-radius: 12px;

      border: 1px solid #e5eaf1;

    }



    .topic h3 {

      color: #071b35;

      margin-bottom: 8px;

    }



    .topic p {

      font-size: 14px;

      margin: 0;

    }



    .mission {

      background: #071b35;

      color: white;

    }



    .mission h2 {

      color: white;

    }



    .mission p {

      color: #dbe7f5;

    }



    .disclaimer {

      background: #fffaf0;

      border-left: 5px solid #f4c542;

    }



    .disclaimer h2 {

      font-size: 24px;

    }



    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: 60px 5%;

      }



      .container {

        padding: 45px 5%;

      }



      .section {

        padding: 25px;

      }



      .topics {

        grid-template-columns: 1fr;

      }

    }

  

.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;

}

.professional-profile{

    max-width:850px;

    margin:30px auto;

    padding:25px;

    border:1px solid #ddd;

    border-radius:12px;

    background:#fff;

    line-height:1.7;

}

.professional-profile h2,

.professional-profile h3{

    margin-top:20px;

}

.professional-profile ul{

    padding-left:22px;

}

.professional-profile li{

    margin:7px 0;

}

.author-profile{

    max-width:850px;

    margin:30px auto;

    padding:25px;

    border:1px solid #ddd;

    border-radius:12px;

    background:#f8f9fa;

    line-height:1.7;

}

.author-profile h2{

    margin-top:0;

}

.author-profile h3{

    margin-top:25px;

}



/* =========================================================

   ABOUT PAGE — HOME HEADER STYLE

   Isolated header system: wwap-home-style-*

   ========================================================= */



.wwap-home-style-header{

  width:100%;

  background:#1b2b40;

  border-bottom:1px solid rgba(255,255,255,.08);

  position:relative;

  z-index:100;

}



.wwap-home-style-header-inner{

  width:min(100% - 40px, 1180px);

  min-height:66px;

  margin:0 auto;

  display:flex;

  align-items:center;

  justify-content:space-between;

  gap:24px;

}



.wwap-home-style-brand{

  display:flex;

  align-items:center;

  gap:10px;

  flex-shrink:0;

  color:#fff;

  text-decoration:none;

}



.wwap-home-style-mark{

  width:38px;

  height:38px;

  display:grid;

  place-items:center;

  border-radius:11px;

  background:linear-gradient(135deg,#326fbd,#1d4f91);

  color:#fff;

  font-size:19px;

  font-weight:800;

  box-shadow:0 8px 20px rgba(0,0,0,.18);

}



.wwap-home-style-brand-text{

  display:flex;

  flex-direction:column;

  line-height:1.1;

}



.wwap-home-style-brand-text strong{

  color:#fff;

  font-size:15px;

  font-weight:800;

  white-space:nowrap;

}



.wwap-home-style-brand-text small{

  margin-top:4px;

  color:rgba(255,255,255,.65);

  font-size:8px;

  font-weight:700;

  letter-spacing:.6px;

  white-space:nowrap;

}



.wwap-home-style-nav{

  display:flex;

  align-items:center;

  justify-content:center;

  gap:24px;

  margin-left:auto;

}



.wwap-home-style-nav a{

  color:rgba(255,255,255,.78);

  font-size:12px;

  font-weight:700;

  text-decoration:none;

  white-space:nowrap;

  transition:color .2s ease;

}



.wwap-home-style-nav a:hover,

.wwap-home-style-nav a:focus{

  color:#fff;

}



.wwap-home-style-cta{

  display:inline-flex;

  align-items:center;

  justify-content:center;

  gap:8px;

  min-height:38px;

  padding:0 16px;

  border-radius:10px;

  background:linear-gradient(135deg,#2f73c8,#20589f);

  color:#fff;

  font-size:12px;

  font-weight:800;

  text-decoration:none;

  white-space:nowrap;

  box-shadow:0 8px 20px rgba(12,50,100,.22);

}



@media (max-width:1050px){

  .wwap-home-style-header-inner{

    width:min(100% - 28px, 1180px);

  }



  .wwap-home-style-nav{

    gap:16px;

  }



  .wwap-home-style-nav a{

    font-size:11px;

  }

}



@media (max-width:820px){

  .wwap-home-style-header-inner{

    min-height:auto;

    padding:12px 0;

    flex-wrap:wrap;

  }



  .wwap-home-style-nav{

    order:3;

    width:100%;

    margin-left:0;

    justify-content:flex-start;

    overflow-x:auto;

    padding-bottom:2px;

  }



  .wwap-home-style-cta{

    margin-left:auto;

  }

}



@media (max-width:560px){

  .wwap-home-style-header-inner{

    width:min(100% - 24px, 1180px);

    gap:12px;

  }



  .wwap-home-style-brand-text strong{

    font-size:13px;

  }



  .wwap-home-style-brand-text small{

    font-size:7px;

  }



  .wwap-home-style-cta{

    display:none;

  }



  .wwap-home-style-nav{

    gap:18px;

  }

}




/* ===== ABOUT HERO — COMPACT PREMIUM FIX ===== */



.hero{

  padding:52px 6% !important;

}



.hero h1{

  font-size:clamp(32px,4.2vw,48px) !important;

  line-height:1.15 !important;

  margin-bottom:10px !important;

}



.hero p{

  font-size:16px !important;

}



@media (max-width:700px){

  .hero{

    padding:42px 20px !important;

  }



  .hero h1{

    font-size:32px !important;

  }

}