@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;700&family=Manrope:wght@200..800&display=swap");

:root {
  --primary: #0080c8;
  --secondary: #092032;
  --light: #ffffff;
  --dark: #000000;
  --divider: #dadada;
  --main-font: "DM Sans", sans-serif;
  --sub-font: "Manrope", sans-serif;
  --medium: 16px;
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box !important;
}

body {
  font-family: var(--sub-font);
  position: relative !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--main-font);
}

::-webkit-scrollbar {
  display: none;
}

.navbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 !important;
}

.logo {
  width: 132px !important;
  height: auto;
}

.nav-links,
ul,
li,
a {
  display: flex;
  align-items: center;
  color: var(--light);
  gap: 32px;
  text-decoration: none;
  font-size: var(--medium);
  transition: color 0.3s;
}

.nav-links {
  display: flex !important;
  align-items: center !important;
}
.nav-links ul,
li,
a:hover {
  text-decoration: none;
  color: var(--light);
}

.gradient-text {
  background: linear-gradient(
    93.95deg,
    #092032 -2.47%,
    #86825d 23.94%,
    #0181c9 67.34%
  );
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 600;
  font-size: 64px ;
  display: inline-block;
  background-size: 100% 100%;
}
.sub-title {
  font-weight: 600;
  color: var(--secondary);
}

.button-link {
  color: var(--light);
  padding: 10px 20px !important;
  border: 1px solid var(--light);
  border-radius: 80px;
  transition: background-color 0.3s;
  display: flex;
  justify-content: center;
  align-items: center;
}

.button-link:hover {
  color: #f7f7f7;
  transition: color 0.3s;
  background-color: #003B5F;
}


.close-btn{
  display: none !important;
}
.burger {
  display: none;
  cursor: pointer;
  flex-direction: column;
  gap: 5px;
}

.header{
  display: none;
}

.burger span {
  width: 25px;
  height: 3px;
  background-color: #333;
  border-radius: 2px;
}

.hero-section{
  display: flex;
  flex-direction: column;
  padding-inline: 80px;
  padding-block: 30px;
}
.hero {
  padding-top:210px ;
  height:100%;
  flex:1;
  padding-bottom: 80px;
  
}

.hero  h1 {
  font-size: 70px;
  font-weight: 500;
  color: var(--light);
  margin-bottom: 24px;
  max-width: 20ch;

}

.hero  p {
  width: 50%;
  font-size: 18px;
  font-weight: 500;
  line-height: 25px;
  color: var(--light);
  margin-bottom: 48px;
  max-width: 45ch;
}
.primary-button {
  color: var(--light);
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px 20px !important;
  border: 1px solid var(--primary);
  border-radius: 80px;
  background-color: var(--primary);
  transition: background-color 0.3s;
}

.primary-button:hover {
  background-color: #006aa1; 
  cursor: pointer; 
}

.create-campaingn-btn {
  max-width: 12rem;
}
.launch-button {
  width: max-content;
}

.primary-button :hover {
  color: #f7f7f7;
  transition: color 0.3s;
}
.section-title {
  color: #005a8c;
  font-size: 15px;
  font-weight: 700;
}

.sections-container{
  padding-top: 120px;
}

/* Region section */
.regions-coverage{
padding-inline: 80px;
}

.regions-content {
  margin: 0 auto;
  text-align: start;
}

.regions-title {
  margin-bottom: 12px;
}
.regions-heading{
  max-width:36ch;
}
.regions-description {
  font-size: 16px;
  margin-bottom: 24px;
  max-width:56ch;

}

/* statistice  */

.statistics-container {
  display: flex;
  column-gap: 60px;
  margin-bottom: 40px;
  padding-inline: 80px !important;
  padding-top: 56px;
}
.stat-value {
  font-size: 2rem;
  font-weight: bold;
  margin-bottom: 8px;
  color: var(--dark) !important;
}

.stat-label {
  display: flex;
  align-items: center;
  font-size: 0.875rem;
  color: #4b5563;
}

.dot {
  width: 8px;
  height: 8px;
  background-color: #fda555;
  border-radius: 50%;
  margin-right: 8px;
}

.divider {
  width: 1px;
  background-color: var(--divider);
}
.map {

  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 100px !important;
  max-width: 880px;
  margin-inline: auto;
  margin-bottom:75px;

}

/* Our advertisers */
.our-advertisers{
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 60px;
  margin-bottom:60px;
}


.map-images-container{
  margin-inline: auto;
 display: grid;
 grid-template-columns: repeat(7,1fr);
 column-gap: 3rem;
 row-gap: 3rem;
 max-width: 70%;
 margin-bottom: 8rem;
}


.map-images-container img {
  max-width: 6rem;  
}

.campaign-section{
  padding-inline: 80px;
}

.methodology-section-container{
  padding-inline: 80px;

}

/* venues & displays */

.venues-displays-container {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 75px;
}
.venues-displays {
  width: 40%;
  display: flex;
  text-align: center;
  gap: 60px;
}

.display-images-container {
  overflow: hidden;
  overflow-y: visible;
  height: max-content;
  width: 100%;
  position: relative;
  padding-block: 1rem;
}

.display-images {
  display: flex;
  gap: 15px;
  white-space: nowrap;
  animation: scroll 20s linear infinite 5s;
}

.display-images img:nth-child(even) {
  margin-top: 45px;
  min-height: auto;
}

.display-images img {
  height: 100%;
  flex-shrink: 0;
  transition: transform 0.3s ease;
}

.display-images img:hover {
  transform: scale(1.05);
  transition-duration: 0.5s;
  cursor: pointer;
}

@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

.tags-section-wrapper {
  display: flex;
  justify-content: space-between;
  margin-top: 30px;
  margin-bottom: 60px;
  padding-top: 62px;
  max-width: 85vw;
  margin: auto;
  padding-inline: 80px !important;
}

.tags-group h3 {
  font-size: 1em;
  margin-bottom: 10px;
}

.tags {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: start;
  margin-bottom: 20px;
}

.tag {
  padding: 8px 12px;
  background-color: #fff8f2;
  color: #783900;
  border: 1px solid #eee0d3;
  border-radius: 23px;
  font-size: 16px;
  font-weight: 600px;
  gap: 10px;
}

/* launch a campaign */

.launch-campaign {
  display: flex;
  justify-content: center;
  text-align: center;
  gap: 60px;
  margin-bottom: 75px;
}
.launch-campaign-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-top: 60px;
}
.launch-campaign-heading{
  max-width: 42ch;
}
.launch-campaign-description{
  max-width: 62ch;
}
.launch-campaign-button {
  width: max-content;
  margin-top: 15px;
}

.campaign-dashboard-image {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 72px;
}

.ssp-section {
  display: flex;
  gap: 15px;
  margin-bottom: 80px;
}
.ssp-title {
  font-size: 24px;
  font-weight: 600;
  max-width:32ch;
}
.ssp-header {
  padding-right: 40px;
}
.ssp-description {
  font-size: 18px;
  max-width:34ch;
}

.ssp-desc-image-container {
  height: max-content; 
  margin-top: auto;
  border-left: 1px solid var(--divider);
  padding-left: 40px;
  overflow: auto;
  max-width: 100%; 

  display: flex; 
  gap: 15px;
  justify-content: flex-start; 
  align-items: center; 
}

.ssp-desc-image-container img {
  max-width: 200px;
  height: 45px; 
  object-fit: contain; 
  
  margin: 0; 
  transition: transform 0.3s ease; 
}

/* .ssp-desc-image-container img:hover {
  transform: scale(1.1); 
  cursor: pointer;
} */

/* methodology */
.methodology {
  margin-bottom: 75px;
}
.methodology-features {
  display: flex;
  gap: 8rem;
  margin-bottom: 100px;
}
.methodology-feature {
  display: grid;
}

.methodology-title {
  font-size: 24px;
  max-width:36ch;
}
.methodology-heading{
  max-width:32ch;
}
.methodology-description {
  font-size: 18px;
  max-width:50ch;

}
.methodology-icon {
  margin-bottom: 40px;
}
.methodology-details {
  display: flex;
  align-items: start;
  gap: 2px;
  max-width:38ch;
}

/* elevate your brand */
.elevate-your-brand {
  margin-bottom: 85px;
  border-radius: 40px;
  overflow: hidden;
}

.elevate-your-brand-image{

  min-height: 60vh;
  display: flex;
  align-items: center;
}
.elevate-your-brand-container {
  
display: flex;
justify-content: center;
align-items: center;
height: 100%;
flex-wrap: wrap;
width: max-content;
margin-left: auto;
margin-right: 12%;
}
.elevate-your-brand-content {
  width: max-content;

}
.elevate-your-brand-heading{
  max-width:32ch;
}
.elevate-your-brand-description{
  max-width:56ch;
} .want-to-talk-heading{
  max-width:28ch;
}
.want-to-talk-description{
  max-width:56ch;
}
/* fom section  */

.form-section {
  display: flex;
  max-width: 100%;
}

.form-content {
  text-align: left;
}

.form-container {
  flex: 1;
  max-width: 25%;
  padding: 20px 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #f1f1f1;
  border-radius: 20px;
  margin-inline: auto;
  row-gap: 20px;
  background-color: #f8f8f8;
  margin-top: 40px;
}

/* style for wp-form-7 */

.wpcf7 form {
  width: 100%;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
  width: 100%;
  margin-bottom: 20px;
  padding: 10px;
  border: none;
  outline: none;
  background-color: #f8f8f8;
  border-bottom: 1px solid var(--divider);
  resize: none;
  min-height: 50px;
}

.wpcf7 input::placeholder,
.wpcf7 textarea::placeholder {
  color: var(--secondary);
  font-weight: 600;
  font-size: 16px;
}

.wpcf7 input:focus,
.wpcf7 textarea:focus {
  outline: none;
  border-bottom: 1px solid var(--primary);
}

.wpcf7 select {
  width: 100%;
  margin-bottom: 20px;
  padding: 6px;
  border: none;
  outline: none;
  background-color: #f8f8f8;
  border-bottom: 1px solid var(--divider);
  font-size: 14.5px;
  font-weight:500;
  /* appearance: none;  */
  cursor: pointer;
}
.wpcf7 select:focus {
  border-bottom: 1px solid var(--primary);
  outline: none;
}
.wpcf7 select option {
  color: #333;
  line-height: 2; 
}

.wpcf7-submit {
  color: var(--light);
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px 20px !important;
  border: 1px solid var(--primary);
  background-color: var(--primary);
  border-radius: 80px;
}

.wpcf7-submit:hover {
  cursor: pointer;
  background-color: #006aa1; 
}

/* .wpcf7-validation-errors {
  color: #d9534f !important; 
  border: 1px solid #d9534f !important;
  font-size: 16px;
  margin-bottom: 10px;
}

.wpcf7-not-valid-tip {
  color: #d9534f !important;
  font-size: 16px;
  margin-top: 5px;
} 

.wpcf7-mail-sent-ok {
  color: #28a745 !important; 
  border: 1px solid #28a745 !important; 
  font-size: 16px;
}  */

/* FAQ section */

.faq-section {
  max-width: 100%;
  margin: auto;
  margin-bottom: 100px;
}

.accordion-item {
  border-bottom: 1px solid #ccc;
}

.accordion-button {
  background: none !important;
  border: none;
  outline: none;
  padding: 15px;
  font-size: 20px;
  font-weight: 600;
  color: var(--secondary);
  display: flex;
  cursor: pointer;
}

.accordion-button:focus {
  box-shadow: none;
}

.accordion-button::after {
  content: none;
}

.accordion-button.collapsed {
  width: 1000%;
  color: var(--secondary);
}

.accordion-body {
  padding: 15px;
  font-size: 16px;
}

.accordion-body p {
  margin: 0;
}

.accordion-header {
  display: flex;
  justify-content: space-between;
  cursor: pointer;
}

.icon {
  margin-left: auto;
}

/* Footer */

.footer {
  width: 100%;
  background-color: #00588a;
  padding-top: 58px;
  color: var(--light);
  text-align: center;
}

.footer-logo {
  margin-bottom: 10px;
}

.footer-logo img {
  height: 50px;
  width: 140px;
}

.footer-tagline {
  font-size: 20px;
  margin-bottom: 20px;
}

.social-icons {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-bottom: 20px;
}

.footer-links {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 40px 40px;
  margin-bottom: 20px;
}
.links-container {
  display: flex;
  width: max-content;
  gap: 10vw;
}

.footer-links div {
  text-align: left;
  min-width: 150px;
  font-size: 16px;
}

.footer-links div a {
  display: block;
  text-decoration: none;
  margin-bottom: 8px;
  transition: color 0.3s ease;
}

.footer-contact p {
  max-width: 28ch;
}
.footer-contact a {
  text-decoration: none;
  color: #5ac8ff;
}


.footer-bottom {
  margin-top: 30px;
  font-size: 16px;
  color: #b1daf2;
  border: 0.83px solid #337fab;
  padding-top: 20px;
  padding-bottom: 20px;
}

/* styles for PAGES */
.page-hero-section {
  background: #00588a;
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 10;
}
.page-container{
  flex: 1;
  overflow-y: auto;
  margin-top: 100px;
  padding:60px 80px; 
  height: auto; 
  overflow: hidden;
}
.page-footer{
  bottom: 0; 
  width: 100%;
}

/* Contact page style */
.contact-us-container h1{
margin-bottom: 20px;
}

.contact-us-top{
  display:flex;
  gap:120px;
}
.contact-us-text{
  max-width: 50%;
  margin-top: 100px;
}
.page-form{
  margin-top: 100px;
}
.page-form-title{
  text-align: center;

}
.contact-us-bottom{
  display: flex; 
  gap: 20px; 
  align-items: flex-start; 
  padding: 20px; 
  background-color: #f8f8f8; 
  border-radius: 10px; 
  margin-top:100px;
}
.contact-us-bottom-container{
  flex: 1; 
  position: relative; 
  border-radius: 10px; 
  overflow: hidden;
}
.contact-us-bottom-image{
  width: 100%; 
  height: 100%; 
  object-fit: cover; 
  opacity: 0.9;
}
.contact-us-bottom-content{
  position: absolute; 
  top: 50%; 
  left: 50%; 
  transform: translate(-50%, -50%); 
  color: var(--light);
  text-align: center; 
  padding: 10px; 
  border-radius: 10px;
}
.contact-us-bottom-content h1{
  font-size: 24px; 
  font-weight: bold; 
  margin: 0;
}
.contact-us-bottom-content p{
  font-size: 14px; 
  margin-top: 5px;
}
.contact-bottom-right{
  flex: 1; 
  padding:20px; 
  display:flex;
  flex-direction:column; 
  row-gap:1.5rem;
}
.contact-bottom-right p{
  display: flex; 
  align-items: center; 
  margin-bottom: 10px;
}
.contact-bottom-right img{
  width: 2.5rem; 
  margin-right: 10px;
}

.contact-bottom-right a{
  text-decoration: none; 
  color: inherit;
}

.contact-bottom-right-social {
  display: flex; 
  justify-content: center;
  align-items: center; 
  column-gap: 2rem; 
  margin-top: 10px; 
}

.contact-bottom-right-social a {
  text-decoration: none; 
  display: flex; 
  justify-content: center; 
  align-items: center; 
}

.contact-bottom-right-social img {
  width: 2.5rem;
  height: auto; 
}

/* Terms page style */
.terms h1{
  font-size: 40px;
  line-height:2rem;
  margin-bottom: 34px;
  }

.terms h3{
  font-size: 22px;
  line-height:1.6rem;
  margin-bottom: 14px;
}
.terms p{
  font-size: 14px;
  line-height:1.4rem;
  margin-bottom: 10px;
}

/* Privacy policy page style */
.privacy-policy h1{
  font-size: 40px;
  line-height:2rem;
  margin-bottom: 34px;

}
.privacy-policy h3{
  font-size: 22px;
  line-height:1.6rem;
  margin-bottom: 14px;
}
.privacy-policy p{
  font-size: 14px;
  line-height:1.4rem;
  margin-bottom: 10px;
} 

/* RESPONSIVE STYLES */

@media (min-width: 1280px) {
  .gradient-text{
    font-size:52px;
  }

  .stat-value {
    font-size: 1.8rem;
  }
  .stat-label {
    font-size: 0.8rem;
  }

  /* .venues-displays */

  .venues-displays {
    width: 35%; 
    gap: 50px; 
  }
  .tags-section {
    max-width: 80vw;
  }

  /* launch campaign */

  .launch-campaign {
    gap: 50px; 
  }

  .launch-campaign-content {
    margin-top: 50px; 
  }

  .ssp-section {
    gap: 20px; 
  }

  .ssp-title {
    font-size: 26px;
  }

  .ssp-description {
    font-size: 20px; 
  }

  .ssp-desc-image-container {
    padding-left: 60px;
  }
  /* methodology */


  .methodology-title {
    font-size: 22px;
  }

  .methodology-description {
    font-size: 16px;
  }

  /* elevate-your-brand */

  .elevate-your-brand-content {
    flex-direction: column;
  }

  .form-container {
    max-width: 25%;
    padding: 15px;
  }

  .wpcf7 input::placeholder,
  .wpcf7 textarea::placeholder {
    font-size: 15px;
  }

  .wpcf7-submit {
    padding: 12px 18px !important;
  }

  /* FAQ */
  .accordion-button {
    font-size: 18px; 
    padding: 12px;  
  }

  .accordion-body {
    font-size: 15px;
    padding: 12px; 
  }

  .faq-section {
    margin-bottom: 80px; 
  }

  /* footer */
}

@media (min-width: 1024px) {
  .gradient-text{
    font-size:56px;
  }

  .stat-value {
    font-size: 1.8rem;
  }
  .stat-label {
    font-size: 0.8rem;
  }

  /* .venues-displays */

  .venues-displays {
    width: 50%;
    gap: 40px; 
  }
  .tags-section {
    max-width: 75vw; 
  }

  /* launch campaign */

  .launch-campaign {
    gap: 40px; 
  }

  .launch-campaign-content {
    margin-top: 40px; 
  }

  .ssp-section {
    gap: 25px; 
  }

  .ssp-title {
    font-size: 24px; 
  }

  .ssp-description {
    font-size: 18px; 
  }

  .ssp-desc-image-container {
    padding-left: 50px; 
  }
  /* methodology */

  .methodology-title {
    font-size: 20px;
  }

  .methodology-description {
    font-size: 16px;
  }

  /* elevate your brand */
  .elevate-your-brand-content {
    flex-direction: column;
    align-items: center;
  }

  .form-container {
    max-width: 40% ;
    padding: 15px;
  }

  .wpcf7 input::placeholder,
  .wpcf7 textarea::placeholder {
    font-size: 14px;
  }

  .wpcf7-submit {
    padding: 12px 16px !important;
  }

  /* FAQ */

  .accordion-button {
    font-size: 16px; 
    padding: 10px;  
  }

  .accordion-body {
    font-size: 14px;
    padding: 10px; 
  }

  .faq-section {
    margin-bottom: 60px;
  }

  /* footer */

}

@media (max-width: 768px) {

  .gradient-text{
    font-size:37px;
  }
  .our-advertisers {
    flex-direction: column; 
  }
  .map-images-container {
    grid-template-columns: repeat(2, minmax(80px, 1fr));
  }
  
  .statistics-container {
    flex-direction: column;
    gap: 20px;
    padding: 15px !important;
    margin-bottom: 30px;
  }
  .stat-value {
    font-size: 1.5rem;
  }
  .stat-label {
    font-size: 0.75rem;
  }

  /* .venues-displays */

  .venues-displays-container {
    flex-direction: column; 
    margin-bottom: 50px; 
  }
  .venues-displays {
    width: 90%; 
    gap: 30px; 
  }
  .display-images {
    animation: scroll 15s linear infinite 5s; /
  }
  .tags-section {
    flex-direction: column; 
    justify-content: center;
    max-width: 100vw; 
  }
  .tag {
    font-size: 14px;
    padding: 6px 10px; 
  }

  /* launch campaign */

  .launch-campaign {
    flex-direction: column; 
    gap: 20px; 
    margin-bottom: 50px; 
  }

  .launch-campaign-content {
    margin-top: 30px; 
  }

  .launch-campaign-button {
    margin-top: 10px;
  }

  .campaign-dashboard-image {
    margin-bottom: 40px; 
  }

  .ssp-section {
    flex-direction: column; 
    gap: 30px; 
    margin-bottom: 60px; 
  }

  .ssp-title {
    font-size: 20px; 
  }

  .ssp-description {
    font-size: 16px; 
  }

  .ssp-desc-image-container {
    padding-left: 20px; 
    border-left: none; 
  }

  /* methodology */

  .methodology-features {
    flex-direction: column;
    gap: 2rem;
    margin-bottom: 60px;
  }

  .methodology-title {
    font-size: 18px;
  }

  .methodology-description {
    font-size: 14px;
  }

  .elevate-your-brand {
    margin-bottom: 60px;
  }

  .elevate-your-brand-container {
    max-width: 100%;
    justify-content: center;
  }

  .elevate-your-brand-content {
    flex-direction: column;
    align-items: center;
    padding: 20px;
  }

  /* elevate your brand  */

  .form-section {
    flex-direction: column;
    align-items: center;
  }

  .elevate-your-brand-container {
    max-width: 100%;
    justify-content: center;
  }

  .form-container {
    max-width: 100%;
    padding: 10px;
    margin-top: 20px;
  }

  .wpcf7 input::placeholder,
  .wpcf7 textarea::placeholder {
    font-size: 14px;
  }

  .wpcf7-submit {
    padding: 12px 14px !important;
  }

  /* FAQ */
  .faq-section {
    margin-top: 60px;
  }
  .accordion-button {
    font-size: 16px;
    text-align: start;
  }

  /* footer */

  .footer-logo img {
    height: 35px;
    width: 100px;
  }

  .footer-tagline {
    font-size: 14px; 
    margin-bottom: 10px;
    padding:0px 1px;
  }

  .social-icons {
    gap: 10px;
    margin-bottom: 15px;
  }

  .links-container {
    flex-direction: column; 
    gap: 20px;
  }

  .footer-links {
    padding: 15px 10px; 
  }

  .footer-links div {
    font-size: 13px; 
    text-align: center;
  }

  .footer-bottom {
    font-size: 12px; 
    margin-top: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .footer-contact p {
    font-size: 16px;
  }
}

@media (max-width: 768px) {


#navLinks{
display: flex;
flex-direction: column;
background-color: var(--dark);
position: absolute;

align-items: start;
height: 100svh;
right: 0;
left: 0;
top: 0;
padding-inline: 24px !important;
padding-top: 28px !important;
padding-bottom: 40px !important;
}
#navLinks ul{
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: start;
  flex:1;
  margin-top: 40px;
  width: 100%;
  row-gap: 7%;
}
#navLinks li{
  width: 100%;
}
.launch-btn {
  margin-top: auto !important;
}
.launch-btn a{
  width:100%;
}
.close-btn{
  display: block !important;
  position: absolute;
  right: 30px;
  top: 30px;
  color: var(--light);
  font-size: 25px;
}
.show {
  display: flex !important;
}

.hidden {
  display: none !important;
}
.header{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#burgerIcon{
  color: white !important;
}
.hero-section{
  padding-inline: 30px;
}
.hero-content h1{
  max-width: none !important;
  font-size: clamp(35px,7vw,70px) !important;
}
.hero-content p{
  max-width: none !important;
  width: 100%;
}
.sections-container{
  padding-top: 80px;
}
.regions-coverage{
  padding-inline: 30px;
  }
  .regions-heading{
    display: flex;
    flex-wrap: wrap;
  }
  .gradient-text{
    font-size:clamp(27px,7vw,64px) !important ;
    display: inline-block;
  }
  .line-break{
    display: none !important;
  }
  .statistics-container{
    padding-inline: 30px !important;
    padding-top: 56px !important;
  }
  .map {
    padding-top: 20px !important;
    overflow: hidden !important;
  }
  .map-image{
    width: 95% !important;
    height: 100% !important;
    object-fit: contain !important;
  }
  .map-images-wrapper{
    display: block !important;
  }
 
  .tags-section-wrapper {
 
    padding-inline: 30px !important;
    margin: none !important;
    width: 100%;
  }
  .tags-section-container{
    flex-direction: column;
    row-gap: 20px;
  }
  .tags-container{
    display: flex;
    flex-direction: column;
    row-gap: 20px;
  }
  .campaign-section{
    padding-inline: 30px;
  }
  .methodology-section-container{
    padding-inline: 30px !important;
    
  }
  .elevate-your-brand-image{
background-image: none !important;
  }
  .elevate-your-brand-image{
    height:10px !important;
    display: flex;
    align-items: center;
    background: linear-gradient(135deg, rgba(226, 197, 255, 1), rgba(255, 255, 255, 1) 50%, rgba(173, 216, 230, 1)) !important;
  }
  .footer-menu .menu-item a{
    width: 100%;
    text-align: center;
  }

  /* style for pages */
.page-container{
  padding: 40px 40px;
}
/* style for contct page */

 .contact-us-top{
  display:flex;
  flex-direction: column;
}
.contact-us-text{
  max-width:100%;
  margin-top:40px;
}
.contact-us-image {
  text-align: center; 
} 
.contact-us-image img {
  max-width: 100%;
  height: auto; 
}

.contact-us-bottom {
  flex-direction: column; 
  gap: 20px; 
  padding: 15px; 
  margin-top: 50px; 
}

.contact-us-bottom-container,
.contact-bottom-right {
  flex: none; 
  width: 100%; 
}

.contact-us-bottom-content {
  top: 50%; 
  left: 50%; 
  transform: translate(-50%, -50%); 
  text-align: center; 
}

.contact-us-bottom-content h1 {
  font-size: 18px;
  align-items: flex-start;
}

.contact-us-bottom-content p {
  font-size: 12px; 
  align-items: flex-start;
}

.contact-bottom-right {
  padding: 10px; 
  row-gap: 1rem; 
}

.contact-bottom-right p {
  align-items: flex-start;
  margin-bottom: 15px; 
  font-size:14px;
}

.contact-bottom-right img {
  width: 2rem;
  margin-bottom: 5px;
}

.contact-bottom-right a {
  font-size: 14px; 
}

.contact-bottom-right-social {
  justify-content: center; 
  column-gap: 1rem;
  margin-top: 15px; 
}

.contact-bottom-right-social img {
  width: 2rem; 
}

}

@media (min-width: 769px) and (max-width: 1024px) {
  .contact-us-bottom{
    flex-direction: column;
  }
  .form-container {
    max-width: 100%;
    padding: 10px;
    margin-top: 20px;
  }
}

@media (max-width: 475px) {
  .contact-us-bottom-content {
    padding: 12px; 
    width: 90%; 
    max-width: 360px; 
    font-size: 14px; 
  }
}


@media (max-width:600px){

  .our-advertisers{
    text-align: center;
    width: 100%;
    margin-bottom: 2.5rem;
    margin-top: 0;
  }
  .map-images-container{
    grid-template-columns: repeat(2,1fr);
    min-width: 100% !important;
    padding-inline: .5rem;
  }
  .img-box{
    display: flex;
    justify-content: center;
    align-items: center;
  }
}


@media (min-width:600px) and (max-width:768px){

  .our-advertisers{
    text-align: center;
    width: 100%;
    margin-block: 3rem;
  }
  .map-images-container{
    grid-template-columns: repeat(3,1fr);
    min-width: 100% !important;
    padding-inline: 1rem;
  }
  .img-box{
    display: flex;
    justify-content: center;
    align-items: center;
  }
}



@media  (min-width:768px) and (max-width:1024px){

 
  .map-images-container{
    grid-template-columns: repeat(4,1fr);
    min-width: 100% !important;
    padding-inline: 2rem;
  }
  .img-box{
    display: flex;
    justify-content: center;
    align-items: center;
  }
}