:root {
     --navy: #101235;
     --dblack: #190C39;
     --navy-light: #122136;
     --blue: #0063AC;
     --blue-circle: #2761c8;
     --white: #ffffff;
     --purple: #D3CCE5;
     --peach: #EDE4EF;
     --peach-light: #f5f3f7;
     --muted: rgba(255, 255, 255, 0.55);
   }

   @font-face {
     font-family: 'Begum';
     src: url('/assets/fonts/begum-font-family/Begum-Regular.otf') format('opentype');
     font-weight: 400;
     font-style: normal;
   }

   @font-face {
     font-family: 'Begum';
     src: url('/assets/fonts/begum-font-family/Begum-Light.otf') format('opentype');
     font-weight: 100;
     font-style: normal;
   }

   @font-face {
     font-family: 'Begum';
     src: url('/assets/fonts/begum-font-family/Begum-Bold.otf') format('opentype');
     font-weight: 700;
     font-style: normal;
   }

   @font-face {
     font-family: 'Begum';
     src: url('/assets/fonts/begum-font-family/Begum-Italic.otf') format('opentype');
     font-weight: 400;
     font-style: italic;
   }

   @font-face {
     font-family: 'Begum';
     src: url('/assets/fonts/begum-font-family/Begum-BoldItalic.otf') format('opentype');
     font-weight: 700;
     font-style: italic;
   }

   body {
     background-color: #f5f3f7;
     font-family: 'Outfit', sans-serif;
     color: var(--navy);
   }

   h1,
   h2,
   h3 {
     font-family: 'Begum', serif;
     font-weight: 700;
   }

   .header_nav a {
     font-family: 'Outfit';
     font-weight: 500;
     font-style: Medium;
     font-size: 16px;
     color: var(--dblack);
   }



   .text-custom-blue {
     color: var(--blue);
   }

   .big-title {
     font-size: 61px;
     font-weight: 700;
     font-style: Bold;
   }

   .medium-title {
     font-size: 49px;
     font-weight: 700;
     font-style: Bold;
   }

   .semi-title {
     font-weight: 700;
     font-style: Bold;
     font-size: 39px;
   }

   .small-title {
     font-weight: 700;
     font-style: Bold;
     font-size: 31px;
   }

   .section-title {
     margin-bottom: 20px;
   }

   p {
     font-family: 'Outfit';
     font-weight: 400;
     font-style: Regular;
     font-size: 18px;
     color: #8A8794;
   }

   .blue-dot::after {
     color: #0D5AAC;
     content: ".";
   }

   .blue-qoute::before {
     color: #0D5AAC;
     content: "“";
     left: -15px;
     position: absolute;
   }

   .blue-qoute::after {
     color: #0D5AAC;
     content: "”";
   }



   .card-dark {
     background: #0d1b4c;
     color: #fff;
     padding: 30px;
     border-radius: 8px;
     height: 100%;
   }

   .placeholder-img {
     background: #ddd;
     width: 100%;
     height: 200px;
   }

   .placeholder-img.large {
     height: 300px;
   }

   .logo-strip div {
     height: 40px;
     background: #ccc;
   }

   .newsletter {
     background: #e9e6ec;
     padding: 40px;
     border-radius: 8px;
   }

   .cta-section {
     background: #0b5ed7;
     color: #fff;
   }

   .btn {
     background-color: var(--navy);
     padding-top: 12px;
     padding-right: 18px;
     padding-bottom: 12px;
     padding-left: 18px;
     border-radius: 100px;
     gap: 6px;
     display: inline-flex;
   }

   .bg-peach {
     background-color: var(--peach)
   }

   .bg-peach-light {
     background-color: var(--peach-light)
   }

   .bg-peach.btn {
     color: var(--dblack);
   }

   .letter-spacing-20 {
     letter-spacing: 20%;
   }

   .article_box {
     background-color: #F4EFF5;
     overflow: hidden;
     margin-bottom: 40px;
   }

   .case_box {
     background-color: #fff;
   }

   .case_box .link {
     font-family: "Outfit";
     font-weight: 400;
     font-size: 16px;
     line-height: 24px;
     color: #8A8794;
     margin-top: 70px !important;
   }

   .img_box {
     height: 218px;
     /* background-color: #fff; */
     overflow: hidden;
   }

   .article_box .img_box>img {
     /* object-fit: contain; */
     object-position: top;
     min-width: 100%;
     filter: grayscale(100%);
     height: 220px;
     transition: all 0.3s ease;
   }

   .article_box:hover .img_box img {
     filter: grayscale(0%);
     transform: scale(1.1);
   }



   .article_box .inner-box {
     gap: 64px;
     padding: 32px;

     font-family: "Begum";
     font-weight: 600;
     font-style: Semibold;
     font-size: 20px;
   }

   .article_box a {
     text-decoration: none;
     color: var(--dblack);
   }

   .article_box .link {
     font-family: "Outfit";
     font-weight: 500;
     font-style: Medium;
     font-size: 16px;
     line-height: 24px;
     margin-top: 32px;
   }


   /* ── FOOTER WRAPPER ── */
   footer {
     background: var(--navy);
     width: 100%;
     overflow: hidden;
     position: relative;
     background-image: url('/assets/icons/footer-icon.svg');
     background-position: right bottom;
     background-repeat: no-repeat;
     background-size: 650px;
     padding-top: 64px;
     padding-bottom: 48px;
   }



   .clients .swiper-wrapper {
     height: auto !important;
   }

   .clients .swiper-slide {
     height: 70px;
     display: flex;
     /* enable flex layout */
     justify-content: center;
     /* center horizontally */
     align-items: center;
   }

   .clients .swiper-slide img {
     height: 48px;
     max-width: 100%;
     /* responsive width */
     max-height: 100%;
     /* prevent overflow */
     object-fit: contain;
     /* grayscale effect */
     filter: grayscale(100%);
     transition: filter 0.3s ease;
     /* smooth transition on hover */
   }

   /* On hover, remove grayscale */
   .swiper-slide:hover img {
     filter: grayscale(0%);
   }

   /* ── NEWSLETTER SECTION ── */
   .newsletter-section {
     padding-bottom: 80px;
     position: relative;
     z-index: 2;
   }

   .newsletter-section h6 {
     font-weight: 500;
     font-size: 20px;
     color: var(--white);
     margin-bottom: 16px;
     letter-spacing: 0.01em;
   }

   .newsletter-form {
     display: flex;
     gap: 0;
     max-width: 430px;
     background: #FFFFFF1F;
     border-radius: 30px;
     overflow: hidden;
     padding: 0px 0px 0px 18px;
     align-items: center;
   }

   .footer-body {
     max-width: 550px;
   }

   .newsletter-form input {
     background: transparent;
     border: none;
     outline: none;
     color: var(--white);
     font-size: 16px;
     flex: 1;
   }

   .newsletter-form input::placeholder {
     color: var(--muted);
     font-size: 0.78rem;
   }

   .newsletter-form .required-star {
     color: #e05b5b;
     font-size: 0.7rem;
     margin-left: 2px;
   }

   .subscribe-btn {
     background: var(--blue);
     color: #fff !important;
     border: none;
     border-radius: 30px;
     gap: 6px;
     white-space: nowrap;
     transition: background 0.2s;
     flex-shrink: 0;
   }

   .stay_ahead {
     padding: 80px;
     padding-bottom: 0px;
   }

   .stay_ahead .bg-peach-light {
     padding: 64px;
   }

   .stay_ahead .newsletter-form input {
     font-family: "Outfit";
     font-weight: 500;
     font-size: 16px;
     letter-spacing: 0%;
     color: #8A8794 !important;
   }

   /* Placeholder color */
   .stay_ahead .newsletter-form input::placeholder {
     color: #8A8794;
     opacity: 1;
     /* ensures full color visibility */
   }

   /* Optional: for better browser support */
   .stay_ahead .newsletter-form input::-webkit-input-placeholder {
     color: #8A8794;
   }

   .stay_ahead .newsletter-form input:-ms-input-placeholder {
     color: #8A8794;
   }

   .stay_ahead .newsletter-form {

     background: #FFF;
     border: 0.8px solid #CBC6D6;
   }

   .stay_ahead .newsletter-section .subscribe-btn {

     background-color: var(--dblack) !important;
     color: #fff;
   }

   .stay_ahead .newsletter-section h6 {
     display: none;
   }

   .stay_ahead .newsletter-section {
     margin-top: 40px;
     padding-bottom: 0px;
   }


   /* Social icons row */
   footer .social-icons {
     display: flex;
     gap: 32px;
     align-items: center;
   }

   footer .social-icons a {
     color: rgba(255, 255, 255, 0.65);
     font-size: 18px;
     text-decoration: none;
     transition: color 0.2s;
   }

   footer .social-icons img {
     width: 18px;
   }

   footer .social-icons a:hover {
     color: var(--white);
   }

   /* Nav columns */
   footer .nav-columns {
     display: flex;
     gap: 48px;
     flex-wrap: wrap;
     justify-content: space-between;
   }

   .text-underline-f {
     text-decoration: underline !important;
   }

   footer .nav-col h6 {
     font-size: 16px;
     line-height: 20px;
     letter-spacing: 0%;
     color: var(--muted);
   }

   footer .nav-col a,
   footer .nav-col p {
     font-family: Outfit;
     font-weight: 600;
     font-size: 16px;
     margin-bottom: 5px;
     letter-spacing: 0%;
     color: #E4E5EC;
     display: block;
     text-decoration: none;
   }



   .nav-col a:hover {
     color: var(--white);
   }

   .nav-col p {
     color: var(--muted);
     margin-bottom: 4px;
     cursor: default;
   }

   /* ── FOOTER BOTTOM ── */
   .footer-bottom {
     margin-top: 40px;
     padding-top: 20px;
     border-top: 1px solid #1F203D
   }

   .footer-bottom span,
   .footer-bottom a {
     font-size: 16px;
     color: rgba(255, 255, 255, 0.4);
     text-decoration: none;
   }

   .footer-bottom a {
     color: rgba(255, 255, 255, 0.55);
   }

   .footer-bottom a:hover {
     color: var(--white);
   }

   .footer-bottom strong {
     font-weight: 600;
     color: rgba(255, 255, 255, 0.65);
   }

   .bg-dark-blue {
     background-color: var(--navy);
   }

   .what_we_do {
     width: 418;
     height: auto;
     gap: 64px;
     padding: 40px;
     background-color: var(--navy);
     color: var(--white);
   }

   .what_we_do_group {
     gap: 64px;
     display: flex;
     margin-top: 40px;
     margin-bottom: 72px;
     width: 100%;
   }

   .what_we_do h3 {
     margin-top: 64px;
     font-family: 'Begum';
     font-weight: 500;
     font-size: 31px;
     line-height: 114.99999999999999%;
     margin-bottom: 14px;
   }

   .what_we_do p {
     font-family: 'Outfit';
     font-weight: 400;
     font-style: Regular;
     font-size: 16px;
     margin-bottom: 32px;
     color: var(--purple);
   }

   .powering {
     padding: 20px;
     border-top: 1px solid #0063AC;
     padding-top: 60px;
     padding-bottom: 80px;
     position: relative;
   }

   .powering h3 {
     max-width: 800px;
     font-size: 30px;
   }

   .our_impact {
     padding-top: 80px;
     padding-bottom: 30px;
   }

   .stay_ahead .side_iim>svg {
     width: 240px;
   }

   .stay_ahead .side__left {
     max-width: 529px;
   }

   .two_sided_col .sideiim {
     padding-top: 80px;
     padding-right: 64px;
     padding-bottom: 80px;
     padding-left: 64px;
     color: #fff;
     background: #0063AC;
   }

   .two_sided_col .sideiim p {
     color: #D9D5E1;
     margin-top: 12px;
   }

   .two_sided_col {
     padding: 80px;
   }

   .buttons_group {
     display: flex;
     gap: 24px;
     margin-top: 64px;
   }

   .outline-btn {
     /* border: 1px solid #FFFFFF; */
     background-color: transparent;
   }




   .two_sided_col .sideleft {
     max-width: 50%;
   }

   /* Tablet: 2 columns */
   @media (max-width: 800px) {
     .what_we_do {
       width: 100%;
       margin-bottom: 20px;
     }

     .two_sided_col {
       padding: 20px 0;
       padding-top: 0;
     }

     .article_box {
       margin-bottom: 20px;
     }

     .two_sided_col .sideleft {
       max-width: 100%;
     }

     .two_sided_col .sideleft img {
       width: 100%;
     }

     .buttons_group .btn {
       margin-bottom: 20px;
     }

     .buttons_group {
       display: block;
     }

     .two_sided_col .sideiim {
       padding: 20px;
     }



     .what_we_do_group {
       display: block;
     }
   }

   /* Mobile-only: screens smaller than 576px */
   @media (max-width: 575.98px) {

    .subscribe-btn {
        margin-left: -20px;
      }

     .stay_ahead {
       /* margin-left: -50px; */
     }

     .stay_ahead {
       padding: 0;
       padding-top: 20px;
       padding-bottom: 20px;
     }



     .stay_ahead .bg-peach-light {
       padding: 20px;
       padding-top: 40px;
       padding-bottom: 40px;
     }


     .powering h3 {
       font-size: 24px;
     }

     .blue-qoute::before {
       left: 0px;
     }

     .header_nav .btn.bg-peach {
       background-color: transparent;
       padding: 0 !important;
     }

     .big-title {
       font-size: 40px;
       font-weight: 700;
       font-style: Bold;
     }

     .medium-title {
       font-size: 30px;
       font-weight: 700;
       font-style: Bold;
     }

     .small-title {
       font-weight: 700;
       font-style: Bold;
       font-size: 24px;
     }

     .semi-title {
       font-weight: 700;
       font-style: Bold;
       font-size: 29px;
     }

     .logo-social {
       display: block !important;
     }

     .social-icons {
       margin-top: 20px;
     }

     footer .nav-col {
       flex: 1 1 calc(50% - 10px);
     }

     footer .nav-columns {
       gap: 20px;
     }

     footer {
       background-size: 200px;
       padding-top: 30px;
       padding-bottom: 30px;
     }

     .newsletter-section {
       padding-bottom: 40px;
     }
   }

   @media (min-width: 1400px) {

     .container,
     .container-lg,
     .container-md,
     .container-sm,
     .container-xl,
     .container-xxl {
       max-width: 1352px;
       --bs-gutter-x: 0px;
     }


   }