/*
Theme Name: Twenty Twenty-Four
Theme URI: https://wordpress.org/themes/twentytwentyfour/
Author: the WordPress team
Author URI: https://wordpress.org
Description: Twenty Twenty-Four is designed to be flexible, versatile and applicable to any website. Its collection of templates and patterns tailor to different needs, such as presenting a business, blogging and writing or showcasing work. A multitude of possibilities open up with just a few adjustments to color and typography. Twenty Twenty-Four comes with style variations and full page designs to help speed up the site building process, is fully compatible with the site editor, and takes advantage of new design tools introduced in WordPress 6.4.
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 7.0
Version: 1.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyfour
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/


/* Removes the outline from all interactive elements when focused */
*:focus {
  outline: none;
}

/* Removes the outline specifically from input fields when focused */
input:focus {
  outline: none;
}

/* Removes the outline specifically from buttons when focused */
button:focus {
  outline: none;
}

a {
  text-decoration: none
}

.taxonomy-category a,
.taxonomy-categories a {
  border: 1px solid #838C97;
  font-size: 0.75rem;
  padding: 0.6rem;
}

.taxonomy-category a:hover,
.taxonomy-categories a:hover {
  text-decoration: none
}

.taxonomy-category .wp-block-post-terms__separator,
.taxonomy-categories .wp-block-post-terms__separator {
  opacity: 0
}

/*Show right arrow in the text*/
.right-arrow {
  position: relative;
  display: inline-block;
  /* Keeps text centered properly */
  text-align: center;
  padding-right: 30px;
}

.right-arrow::after {
  position: absolute;
  content: "";
  display: inline-block;
  width: 30px;
  height: 27px;
  background-image: url('assets/icons/right-arrow-red.svg');
  background-size: 16px 22px;
  background-repeat: no-repeat;
  background-position: center;
}

.centeralign .right-arrow {
    display: block;
}

/*desktop min width 75%*/
.dsk-mnwd-75 {
  max-width: 75%;
}

.dsk-mnwd-85 {
  max-width: 85%;
}

.breadcrumb p a {
  color: #DC1207
}

.news-page {}

.news-article .entry-content {
  padding: 0 0
}

.wp-block-query-pagination {
  padding: 0.5rem
}

.wp-block-query-pagination-numbers .current {
  padding: 0.5rem 1rem;
  background: #2C3A4C;
  color: white;
  font-weight: 700
}

.wp-block-query-pagination-numbers .page-numbers {
  padding: 0.5rem 1rem;
}


.case-studies .case_study .minH-500 {
  min-height: 500px !important;
  max-height: 500px !important;
}

@media (max-width: 768px) {
  .dsk-mnwd-75 {
    max-width: 96%;
  }

  .dsk-mnwd-85 {
    max-width: 96%;
  }

  .gap-min .wp-block-post .is-layout-flex {
    gap: 0.7rem;
  }

  .case-studies .case_study .minH-500 {
    min-height: 450px !important;
    max-height: 450px !important;
  }

  .homepage-cards {
    gap: 1.8rem
  }

  .homepage-qualitysection {
    padding-top: 2.3rem !important;
    padding-bottom: 2.4rem !important
  }

  .pt-m-1 {
    padding-top: 0.8rem
  }

  .breadcrumb {
    padding: 1rem 0;
    border-bottom: 2px solid #EEF8FF
  }

  .breadcrumb p {
    width: 120px;
  }


  .home-hero>.has-global-padding,
  .home-hero-wrapper {
    padding-left: 0 !important;
    padding-right: 0 !important
  }

  .the-code-section {
    gap: 0;

  }
	.the-code-section .wp-block-column {
		  		padding-top: 1.6rem 0 !important;
	}
	.explore-case-studies, .latest-news{
		  		padding-top: 1.6rem !important;
				  		padding-bottom: 1.6rem !important;
	}
	
	.am-i-covered-spacer {
		height: 1px !important
	}

}

.fw-400 {
  font-weight: 400
}

/* Home icon for plots */
.nhqb-fee-icon-home {
    background: no-repeat;
    width: 20px;
    height: 20px;
  background-image: url(assets/icons/house_icon.svg);
}
/* Chevron icon added via CSS */
.nhqb-fee-icon-chevron {
  width: 16px;
  height: 10px;
  background-repeat: no-repeat;
  background-size: 14px auto;
  background-image: url(assets/icons/grey-chevron.svg); /* ▼ placeholder */
  pointer-events: none;
}
.nhqb-fee-icon-chevron-blue {
  width: 16px;
  height: 10px;
  background-repeat: no-repeat;
  background-size: 14px auto;
  background-image: url(assets/icons/chevron-blue.svg); /* ▼ placeholder */
  pointer-events: none;
}
/* Main container */
.case-study-row {
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
  padding: 20px 0;
}

/* Each card */
.case-card {
  background: #fff;
  border: 1px solid #d6e4f0;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  padding: 20px;
  flex: 1 1 30%;
  min-width: 280px;
  max-width: 340px;
  transition: transform 0.2s ease;
  display: flex;
  align-items: flex-start;
  gap: 15px;
}

.case-card:hover {
  transform: translateY(-4px);
  border-color: #0073e6;
}

/* Icon styling */
.case-card img,
.case-card svg {
  width: 38px;
  height: 38px;
  flex-shrink: 0;
  margin-top: 4px;
}

/* Text content */
.case-card h3 {
  font-size: 1.1rem;
  margin: 0 0 8px;
  color: #0b2e4e;
}

.case-card p {
  font-size: 0.95rem;
  line-height: 1.4;
  color: #333;
  margin: 0;
}

/* reduce the gap inside row between 2 blocks inside */
.rowBlockGap12 {
  gap: 0.5rem;
}

.padding0 .wp-block-media-text__content {
  padding: 0px 4%;
}

.padding0 .wp-block-media-text__content p strong {
  font-weight: 600;
}

/* Mobile view — stack vertically */
@media (max-width: 768px) {

  .case-study-row {
    flex-direction: column;
    align-items: stretch;
  }

  .case-card {
    flex-direction: row;
    max-width: 100%;
  }

  .padding0 .wp-block-media-text__content {
    padding: 0px;
  }

  .padding0 .wp-block-media-text__content p {
    text-align: center;
  }

  .smallwidth {
    width: 72px;
  }

  /* reduce the gap inside row between 2 blocks inside*/
  .rowBlockGap12 {
    gap: 0.75rem;
  }


}

/* Contact Line Style */
.contact-line {
  padding: 10px 0;
  text-align: left;
  display: flex;
  justify-content: flex-start;
  gap: 6px;
}

/* Text styling */
.contact-line p {
  margin: 0;
  font-size: 1.125rem;
  color: #2C3A4C;
}

/* Bold intro text */
.contact-line strong {
  color: #2C3A4C;
  font-size: 1.125rem;
  font-weight: 600;
  margin-right: 5px !important
}

/* Link styling */
.contact-line a {
  color: #E9473F;
  text-decoration: none;
  font-weight: 400;
  font-size: 1rem;
  margin-block-start: 0rem !important;
}

@media (max-width: 768px) {
  .contact-line {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .contact-line p {
    font-size: 1rem;
  }
}

/* Desktop flow */
.process-flow {
  display: flex;
  justify-content: felx-start;
  align-items: center;
  flex-wrap: wrap;
  flex-direction: row;
  text-align: center;
}

.process-flow .step {
  background: #EEF8FF;
  border: 2px solid #2C3A4C;
  border-radius: 6px;
  padding: 18px 42px;
  color: #2C3A4C;
  font-weight: 400;
  font-size: 1rem;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
}

.process-flow .step.active {
  background: #303E51;
  color: #fff;
}

/* Arrow image */
.process-flow .arrow {
  width: 24px;
  height: auto;
  vertical-align: middle;
  margin-right: 0.75rem;
  margin-left: 0.75rem;
}
@media (max-width: 1024px) {
	.process-flow{
		gap: 0.5rem !important;
	}
}
/* Mobile version */
@media (max-width: 768px) {
  .process-flow {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .process-flow .step {
    width: 78%;
    padding: 12px 42px;
  }

  .process-flow .arrow {
    transform: rotate(90deg);
    /* makes arrow point down */
    margin: 0.1rem 0;
  }
}


.ol-list-type-circle-number {
  list-style-type: none;
  /* remove default numbering + dot */
  counter-reset: custom-counter;
  /* create custom counter */
  margin: 0;
  padding: 0;
}

.ol-list-type-circle-number li::marker {
  color: white;
}


.ol-list-type-circle-number li {
  counter-increment: custom-counter;
  position: relative;
}

.ol-list-type-circle-number li:before {
  content: counter(custom-counter);
  /* adds number only */
  position: absolute;
  left: -27px;
  font-weight: 600;
  font-size: 22px;
  display: block;
  width: 37px;
  height: 37px;
  background: #2C3A4C;
  border-radius: 50%;
  color: white;
  top: 21px;
  text-align: center;
}

/* how to apply screen css */
.info-card-container {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  justify-items: start;
  align-items: start;
  width: 93%;

}

.info-card {
  display: flex;
  align-items: center;
  background: #ffffff;
  border: 1px solid #e1e7ef;
  padding: 0px 16px;
  min-height: 60px;
  width: 87% !important;
}


.info-icon {
  width: 24px;
  height: 24px;
  margin-right: 10px;
  object-fit: contain;
}

.info-card span {
  font-size: 14px;
  font-weight: 600;
  color: #2C3A4C;
  line-height: 1;
}

/* Responsive for mobile */
@media (max-width: 768px) {
  .info-card-container {
    grid-template-columns: repeat(2, 1fr);
    width: 100%
  }

  .info-card {
    min-height: 60px;
    width: 89% !important;
    padding: 6px 14px;
  }


  .ol-list-type-circle-number li:before {
    content: counter(custom-counter);
    /* adds number only */
    position: absolute;
    left: -12px;
    font-weight: 600;
    font-size: 15px;
    width: 24px;
    height: 24px;
  }
}


/* HEADER STYLES */
p.primary_link a,
.faq-answer a {
  color: #E9473F;
	font-size: inherit
}

.wp-block-group,
.wp-block-cover,
.wp-block-template-part {
  margin-block-start: 0
}



.header-email-icon {}

.header-login-buttons {
  gap: 0
}

.login-button a {
  background-color: white;
  color: #2C3A4C;
  background-image: url(assets/icons/login_icon.svg);
  background-repeat: no-repeat;
  background-position: 10px 10px;
  padding-left: 40px
}

@media (max-width: 768px) {
  .login-button a {

    padding-left: 24px;
    margin-top: 7px;
    padding-bottom: 32px
  }

  .login-button a span {
    display: none
  }

}

span.icon {
  display: inline-block;
  width: 32px;
  height: 32px;
}

span.email-icon {
  background: url(assets/icons/contact_icon.svg) no-repeat;
}

span.search-icon {
  background: url(assets/icons/search_icon.svg) no-repeat;
}

span.download-icon {
  background: url(assets/icons/download_icon_orange.svg) no-repeat;
}

span.linkedin-icon {
  background: url(assets/icons/linkedin_icon.svg) no-repeat;
}

/* HEADER STYLES */


/* how to apply dropdown / selection list */
.process-container {
  display: flex;
  gap: 30px;
  align-items: flex-start;
  margin-bottom: 2rem;
}

.process-left {
  flex: 1;
  max-width: 22%;
  padding-top: 8rem;
}

.process-menu {
  list-style: none;
  margin: 0;
  padding: 0;

}

.process-menu li {
  padding: 12px 16px;
  border-left: 4px solid transparent;
  cursor: pointer;
  color: #2C3A4C;
  transition: all 0.3s ease;
  font-weight: 400;
  font-size: 15px;
}

.process-menu li span {
  color: #2C3A4C;
  font-weight: 400;
  font-size: 16px
}

.process-menu li.active {
  border-bottom: 1px solid #D8D8D8;
  background: #EEF8FF;
  font-weight: 600;
  font-size: 15px;
}

.process-menu li.active span {
  color: #2C3A4C;
  font-weight: 600;
  font-size: 18px;
}

.process-content {
  flex: 3;
}

.step-content {
  display: none;
}

.step-content.active {
  display: block;
  width: 85%;
  color: #2C3A4C;
}

.step-content h1,
.step-content h2,
.step-content p,
.step-content ul,
.step-content ul li {
  color: #2c3a4c !important;
}

.description-w {
  padding-right: 20%;
}

/* --- Custom styled dropdown --- */
.process-dropdown {
  position: relative;
  width: 100%;
  background: #eaf4ff;
  border-radius: 2px;
  padding: 12px 16px;
  cursor: pointer;
  display: none;
  /* hidden on desktop */
  justify-content: center;
}

.dropdown-selected {
  display: flex;
  flex-direction: column;
  position: relative;
  padding: 12px 5px;
}

.dropdown-step {
  font-weight: 700;
  font-size: 18px;
  color: #2C3A4C;
}

.dropdown-subtitle {
  font-size: 18px;
  font-weight: 700;
  color: #2C3A4C;
  margin-top: 4px;
}

.dropdown-arrow {
  position: absolute;
  right: 10px;
  margin-top: 5%;
  height: 10px;
  align-self: center;
  justify-content: center;
}

/* Dropdown options (hidden initially) */
.dropdown-options {
  display: none;
  list-style: none;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  background: white;
  border-radius: 2px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  margin-top: 4px;
  z-index: 99;
  padding-inline-start: 0px !important;
}

.dropdown-options li {
  padding: 10px 16px;
  cursor: pointer;
  border-bottom: 1px solid #eee;
  color: #2C3A4C;
}

.dropdown-options li:hover {
  background: #f0f7ff;
}

/* Active option highlight */
.dropdown-options li.active {
  background: #eaf4ff;
  font-weight: 700 !important;
  color: #2C3A4C !important;
  font-size: 18px;
}

.step-navigation {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.5rem;
  margin-top: 1rem;
  width: 100%;
}

/* Buttons */
.step-btn {
  flex: 1;
  background-color: #E9473F;
  color: #fff;
  border: none;
  padding: 12px 20px;
  border-radius: 4px;
  cursor: pointer;
  font-weight: 700;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: opacity 0.3s ease, transform 0.2s ease;
  margin-bottom: 1rem;
}

.step-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.step-btn:hover:not(:disabled) {
  transform: translateY(-2px);
}

.step-btn .arrow {
  font-size: 18px;
  font-weight: 500;
}

/* Show only on mobile */
.mobile-only {
  display: none;
}

/* Responsive - Mobile View */
@media (max-width: 768px) {
  .description-w {
    padding-right: 5%;
  }

  .step-content.active {
    width: 95%;
  }

  .process-container {
    flex-direction: column;
  }

  .process-left {
    width: 100% !important;
    max-width: 90% !important;
    padding-top: 1rem;
    padding: 8px 16px 8px 0px;
  }

  .process-menu {
    display: none;
  }

  .process-dropdown {
    display: block;
  }

  .process-content {
    margin-top: 20px;
  }

  .mobile-only {
    display: flex;
  }

}

/* Equal height cards styling */
.equal-height-cards .wp-block-column {
  display: flex;
  flex-direction: column;
}

/* Apply equal height to inner cards */
.equal-height-cards .wp-block-column>.wp-block-columns>.wp-block-column {
  background-color: #EEF8FF;
  /* your light blue background */
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  padding-top: 1.8rem;
  padding-bottom: 1.8rem;
  height: 285px;
  /* Desktop fixed height */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-sizing: border-box;
}

/* Ensure paragraphs and buttons fit nicely */
.equal-height-cards p {
  margin-bottom: 10px;
}

/* Make button fixed at bottom if needed */
.equal-height-cards>.wp-block-button {
  margin-top: 2rem;

}

/* Mobile adjustments */
@media (max-width: 768px) {
  .equal-height-cards .wp-block-columns .wp-block-column {
    padding: 0.5rem !important;
  }

  .equal-height-cards .wp-block-column>.wp-block-columns>.wp-block-column {
    height: 266px;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    padding-top: 1.2rem !important;
    padding-bottom: 1.2rem !important;
    /* Mobile fixed height */
  }

}


.newsletter-signup input,
.developer-search input {
  margin-top: 1rem;
  background: transparent;
  border: 1px solid white;
  padding: 0.8rem;
  color: white;
  display: block;
  font-size: 1.2rem;
  font-weight: 400;
  width: 100%;
  box-sizing: border-box;
}

.developer-search input {
  border: 2px solid #2C3A4C;
  width: 100%;
  color: #838C97;
  padding: 0.8rem 1rem 0.8rem 3.4rem;
  background-image: url(assets/icons/search-icon-dark.svg);
  background-repeat: no-repeat;
  background-position: 0.8rem 50%;
  font-size: 1.2rem;
  background-size: 24px 26px
}

.newsletter-signup input {
  font-size: 0.9rem;
  font-weight: 400;
}

.newsletter-signup input::placeholder {
  color: white;
  font-weight: 400;

}

@media (max-width: 768px) {
  .developer-search input {
    width: 100% !important;
    padding: 0.8rem 1rem 0.8rem 3rem;
  }


  .search-title {
    font-size: 1.10rem
  }
}
.minw-310{
   width: 310px;
}
.minw-150 {
  width: 310px;
}


.minw-222 {
  min-width: 222px
}

.border-width-2-blue {
  color: transparent;
  border: 1px solid #eef8ff
}

.right-arrow-button a {
  padding-right: 50px;
  position: relative;

}

.right-arrow-button a:after {
  content: "";
  display: block;
  position: absolute;
  background-image: url(assets/icons/arrow_icon.svg);
  background-repeat: no-repeat;
  background-position: 90% 50%;
  padding-right: 100px;
  right: 0;
  top: 0;
  bottom: 0
}


.right-download-button a {
  padding-right: 50px;
  position: relative;
}

.right-download-button a:after {
  content: "";
  display: block;
  position: absolute;
  background-image: url(assets/icons/download_icon.svg);
  background-repeat: no-repeat;
  background-position: 89% 43%;
  background-size: 22px;
  padding-right: 100px;
  right: 0;
  top: 0;
  bottom: 0
}


.right-external-link-button a {
  padding-right: 100px;
  position: relative;

}

.right-external-link-button a:after {
  content: "";
  display: block;
  position: absolute;
  background-image: url(assets/icons/external_link_icon.svg);
  background-repeat: no-repeat;
  background-position: 90% 50%;
  padding-right: 100px;
  right: 0;
  top: 0;
  bottom: 0
}

.mt-0 {
  margin-block-start: 0
}
.calc-img-fees{
    align-self: flex-start;
	width: 46px;
}

/*Developer overview calc img css*/
@media (max-width: 768px) {
  .calc-img {
    width: 56px;
    margin-bottom: 1rem !important;
  }

  .minw-310 {
    min-width: 100%
  }

  .minw-150 {
    max-width: 56% !important;
  }

  .minw-222 {
    width: 100%
  }

  /*its beign remove to avoid the padding inconsistency issues on mobile.*/
  /*   .entry-content>.wp-block-group>.wp-block-columns>.wp-block-column {
    padding: 1.5rem 0 !important
  } */
  .entry-content>.wp-block-cover {
    min-height: 330px;
  }
}

/* FAQ Screen Css change*/
.faq-wrapper {
  margin-top: 2rem;
  font-family: 'Inter', sans-serif;
  color: #222;
}

/* Top section layout */
.faq-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  /* Allows stacking on mobile */
  gap: 10px;
  margin-bottom: 20px;
}

/* Tabs */
.faq-tabs {
  display: flex;
  gap: 10px;
  background-color: #2C3A4C;
  padding: 5px;
}

.faq-tab {
  flex: 1;
  padding: 0.65rem 1.5rem;
  background: #2C3A4C;
  border: none;
  border-radius: 2px;
  font-family: 'Inter' !important;
  font-weight: 500;
  font-size: 20px;
  cursor: pointer;
  transition: all 0.3s ease;
  color: #CBCFD3;
  text-align: center;
  white-space: nowrap;
  /* ⭐ stops wrapping on desktop */
}

.faq-tab.active {
  background: #E9473F;
  color: #fff;
  font-weight: 700;
  font-size: 20px;
}

/* Search */
.faq-search {
  flex: 1;
  display: flex;
  justify-content: flex-end;

}

.faq-search input {
  width: 100%;
  max-width: 400px;
  border-radius: 2px;
  border: 1px solid #2C3A4C;
  font-size: 1rem;
  padding: 0.8rem 1rem 0.8rem 2.8rem;
  background-image: url(assets/icons/search-dark-blue.svg);
  background-repeat: no-repeat;
  background-position: 0.8rem 50%;
  background-size: 18px 18px;
  font-weight: 400;
  color: #ACB2B9;
}

/* Categories */
.faq-category {
  font-size: 22px;
  font-weight: 600;
  margin: 2rem 0 2rem;
  padding-left: 10px;
  color: #2C3A4C;
}

/* Accordion items */
.faq-item {
  background-color: #EEF8FF;
  padding: 23px 26px;
  margin-bottom: 24px;
}

.faq-question {
  font-family: 'Inter';
  font-size: 18px;
  font-weight: 600;
  color: #2C3A4C;
  cursor: pointer;
  position: relative;
  padding-right: 30px;
}

.faq-question::after {
  position: absolute;
  align-self: center;
  right: 0px;
  content: "";
  display: inline-block;
  width: 20px;
  height: 12px;
  background-image: url('assets/icons/uparrow-blue.svg');
  background-size: 16px 12px;
  background-repeat: no-repeat;
  background-position: center;
  transform: rotate(180deg);
  /* ⬇️ Down arrow */
  transition: transform 0.25s ease;
}

.faq-item.active {
  border: 1px solid #2c3a4c;
}

.faq-item.active .faq-question::after {

  background-image: url('assets/icons/uparrow-blue.svg');
  background-size: 16px 12px;
  background-repeat: no-repeat;
  background-position: center;
  transform: rotate(0);

}

.faq-answer {
  display: none;
  padding-top: 8px;
  font-family: 'Inter';
  font-size: 16px;
  font-weight: 400;
  color: #2C3A4C;
  line-height: 1.6;
}

.faq-answer a {
  text-decoration: underline !important;
}

.faq-item.active .faq-answer {
  display: block;
}

/* Hide inactive group */
.faq-group {
  display: none;
}

.faq-group.active {
  display: block;
}

/* Responsive */
@media (max-width: 768px) {
  .faq-top {
    flex-direction: column-reverse;
    align-items: stretch;
  }

  .faq-search {
    margin-bottom: 1rem;
  }

  .faq-tab {
    padding: 0.65rem 0rem;
    font-size: 16px;
  }

  .faq-tab.active {
    font-size: 16px;
  }

  .faq-search {
    justify-content: flex-start;
  }

  .faq-search input {
    background-size: 18px 18px;
  }

}

/*why joi section css for mobile view*/
/* Target only the Why Join section */
.why-join-section {
  text-align: center;
}

/* Desktop remains as is */
.why-join-section .wp-block-columns.is-layout-flex {
  justify-content: space-between;
}

/* --- Mobile view tweaks --- */
@media (max-width: 768px) {
  .why-join-section {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
    width: 100%;
  }

  /* Make 2 cards per row */
  .why-join-section .wp-block-columns .is-layout-flex {
    flex-wrap: wrap !important;
    justify-content: center;
  }

  .why-join-section .wp-block-column {
    flex: 0 0 48% !important;
    margin-bottom: 20px;
  }

  /* Reduce icon/image size */
  .why-join-section .wp-block-column img {
    width: 95px !important;
    height: 95px !important;
  }

  /* Title font size smaller */
  .why-join-section .wp-block-column h3,
  .why-join-section .wp-block-column h4 {
    font-size: 16px !important;
    line-height: 1.3em !important;
  }
}

/* Optional: stack 1 column per row below 480px */
@media (max-width: 480px) {
  .why-join-section {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
    width: 100%;
  }

  .why-join-section .wp-block-column img {
    width: 90px !important;
    height: 90px !important;
  }

  .why-join-section .wp-block-column h3,
  .why-join-section .wp-block-column h4 {
    font-size: 16px !important;
  }
}




@media (max-width: 768px) {
  .nhqb-logo {
    width: 60px
  }


  .quote {
    padding-left: 1.0rem !important
  }

  /* homepage	 */
  .settings-two-sections {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
  }

  .settings-two-sections p:first-child {
    font-size: 1.1rem !important;
  }
 .settings-two-sections p {
    font-size: 1rem !important;
  }
  .settings-two-sections h3 {
    padding-top: 0.8rem;
    font-size: 1.1rem !important;
  }
	
	.mobile-fs-18 {
		font-size: 1.1rem  !important;
	}
}


header #modal-1 {
  background: #2C3A4C
}

.quote {
  border-left: 3px solid #2C3A4C;
}

/* News card */
.news-column .wp-block-post .wp-block-columns.has-background {
  padding: 0rem !important
}

/* Desktop version visible by default */
.excerpt-desktop {
  display: block;
}

.excerpt-mobile {
  display: none;
}

/* Scoped only to Featured News section */
.featured-news-section .news-column {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  /* optional spacing */
}

.featured-news-section .news-column .wp-block-post .wp-block-columns {

  box-sizing: border-box;
  padding: 20px;
  height: 294px;
  /* as per design */
  justify-content: space-between;
  background-color: #f0f8ff;
  /* optional for visual uniformity */
}

/* Force image to fill column height */
.featured-news-section .news-column .wp-post-image {
  object-fit: cover;
  object-position: center;
  display: block;
  height: 294px !important;
}

news-column .wp-block-image img [Attributes style] {
  height: 294px !important;
}

/* Make content align well inside */
.featured-news-section .news-column .wp-block-post .wp-block-columns>* {
  margin-bottom: auto;
}

/* Mobile view adjustments */
@media (max-width: 768px) {
  .featured-news-section .news-column .wp-block-post .wp-block-columns {
    flex: 0 0 100%;
    max-width: 100%;
    height: 240px;
    /* scaled height for mobile view */
  }

  .excerpt-desktop {
    display: none;
  }

  .excerpt-mobile {
    display: block;
  }

  .featured-news-section .news-column img {
    height: 100%;
  }
}

.case-study-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 20px;
}

.case-study-filter .filter-btn {
  border: none;
  background: #e0f0ff;
  color: #004c8c;
  padding: 8px 16px;
  border-radius: 6px;
  cursor: pointer;
  font-weight: 500;
  transition: all 0.3s;
}

.case-study-filter .filter-btn.active,
.case-study-filter .filter-btn:hover {
  background: #004c8c;
  color: #fff;
}

@media (max-width: 768px) {
  .case-study-filter {
    justify-content: center;
  }
}

/*Download button width for mobile view*/
@media (max-width: 768px) {
  .button-fullwidth {
    justify-content: space-between;
    align-items: center;
    width: 100% !important;
    text-align: left !important;
  }

  .button-fullwidth .wp-block-button__link {
    display: flex;
    justify-content: space-between;
    /* text left, icon right */
    align-items: center;
    width: 100%;
    text-align: left;
  }

  .button-fullwidth .wp-block-button__link img {
    margin-left: 0 !important;
  }
}

/*A tag center align on mobile view*/
.view-others-link a {
  text-decoration: none !important;
}

.view-others-link {
  padding-left: 2rem;
  padding-right: 2rem;
  padding-top: 0.3rem;
  padding-bottom: 0.3rem;
}

@media (max-width: 768px) {

  .view-others-link .primary_link {
    text-align: center;
  }

  .view-others-link {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  header .header-border {
    padding-left: 20px;
    padding-right: 20px
  }
}

.nhqb-homepage .header-border {
  border-bottom: none;
}

.header-border {
  border-bottom: 1px solid #838C97
}

ul.wp-block-categories {
  display: inline-flex;
  gap: 10px
}

.news-categories li.cat-item {
  display: inline-flex;

  border: 1px solid #2C3A4C;
  text-decoration: none;
}

.news-categories li.cat-item a {
  text-decoration: none;
  padding: 0.8rem 1.4rem;
}


.footer-hr {
  border-top: 2px solid
}

/*News categroy ui */
/* .news-filter-tabs {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 25px;
}

.news-tab-btn {
  padding: 8px 18px;
  background: #EFEFEF;
  border: 1px solid #2C3A4C;
  font-size: 14px;
  text-decoration: none;
  color: #2C3A4C;
  transition: 0.2s;
}

.news-tab-btn.active {
  background: #2C3A4C;
  color: #fff;
} */
/* ----------- Base Styles ----------- */
.news-tabs-wrapper {
  position: relative;

}

.news-filter-tabs {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  margin-bottom: 2rem;
}

/* Desktop Tab Buttons */
.news-tab-btn {
  width: 150px;
  background: #ffffff;
  border: 1px solid #2C3A4C;
  padding: 8px 16px;
  border-radius: 2px;
  font-weight: 400;
  cursor: pointer;
  color: #2C3A4C;
  font-size: 1rem;
  margin-right: 0.5rem;
}

.news-tab-btn.active {
  background: #2C3A4C;
  color: #fff;
}

.news-tabs-mobile-toggle {
  display: none;
}

/* ---------- Mobile Only ---------- */
@media (max-width: 768px) {

  /* Hide tabs until dropdown is opened */
  .news-filter-tabs {
    display: none;
    flex-direction: column;
    background: #ffffff;
    padding: 10px;
    border-radius: 10px;
    margin-top: 8px;
  }

  .news-tabs-wrapper.open .news-filter-tabs {
    display: flex;
  }

  /* Mobile dropdown button */
  .news-tabs-mobile-toggle {
    width: 100%;
    padding: 10px 16px;
    background: #2C3A4C;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    border-radius: 2px;
    border: 1px solid #2C3A4C;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
  }

  .news-tabs-mobile-toggle:after {
    content: "";
    padding-right: 1rem;
    background-image: url(assets/icons/chevron.svg);
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    width: 14px;
    height: 14px;
    right: 0
  }


  .dropdown-arrow {
    font-size: 20px;
    transition: transform 0.2s ease;
  }

  .news-tabs-wrapper.open .dropdown-arrow {
    transform: rotate(180deg);
  }

  /* Inner buttons (dropdown items) */
  .news-filter-tabs .news-tab-btn {
    width: auto;
    background: transparent;
    text-align: left;
    padding: 10px;
    color: #2C3A4C;
    border: 0px;
    border-bottom: 1px solid #2C3A4C;
    border-radius: 0;
  }

  .news-filter-tabs .news-tab-btn.active {
    color: #2C3A4C;
    font-weight: 700;
  }
}





/* MEGA MENU */

.nav-mobile-menu ul.wp-block-navigation__submenu-container {
  display: none;
  margin: 0;
  padding: 0
}

.mm-link {
  position: relative;

}

.mm-link a {
  padding-right: 20px
}

.mm-link:after {
  content: "";
  background-image: url(assets/icons/chevron.svg);
  background-repeat: no-repeat;
  background-position: center center;
  position: absolute;
  width: 14px;
  height: 14px;
  right: 0
}

.wp-block-navigation-item a {
  font-weight: normal
}

.current-menu-item a {
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-decoration-style: solid;
  font-weight: bold
}

.current-menu-item a:hover {
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-decoration-style: solid
}

.mega-menu {
  border-top: 1px solid #0000004D;
  position: absolute;
  display: none;
  left: 0;
  right: 0;
  z-index: 9999;
  opacity: 0;
  transition: opacity .15s ease, transform .15s ease;
  transform: translateY(6px);
  margin-top: -1px
}

/* optional site-level backdrop class so you can dim the page */
.site-has-mega-open .site-content,
.site-has-mega-open .wp-site-blocks {
  /* example */
  /* pointer-events: none; */
}

/* visible when JS adds is-open */
.mm-nav-wrapper li {}

.mega-menu.is-open {
  display: block;
  opacity: 1;
  transform: translateY(0);
}

.mega-menu .navigation-section .navigation-section-title {
  color: #8F9BA8
}

.mega-menu .navigation-section .navigation-list {
  list-style: none;
  color: #8F9BA8;
  padding: 0;
  margin: 0;
}

.mega-menu .navigation-section .navigation-list li {
  margin: 1rem 0
}

.mega-menu .navigation-section .navigation-list li a {
  color: #fff;
  font-weight: bold
}

.mm-faq-list {
  margin-block-start: 0.9rem
}

.mm-faq-list ul {}

.mm-faq-list ul li {
  border-bottom: 1px solid rgba(255, 255, 255, 0.29);
  margin-block-start: 0;
  margin-block-end: 0;
}

.mm-faq-list ul li h6 {
  padding: 0.6rem 0 !important;
  font-weight: normal;
  margin-block-start: 0;
  margin-block-end: 0;

}

.mm-helpful-wrapper {
  font-weight: bold;
  font-size: 13px;
  color: white
}

.mm-helpful-title {
  font-weight: normal;
  font-size: 0.894rem;
  color: #8f9ba8
}

.mm-helpful-links a {
  font-weight: bold;
  font-size: 0.814rem;
  color: white
}

.mm-helpful-links {
  padding: 0 1rem
}

.the-process .wp-block-column {
  position: relative;
}

.the-process .linked-next:after,
.the-process .linked-next:before {
  content: "";
  border: 2px solid #2C3A4C;
  position: absolute;
  top: 30px;
  left: 100px;
  width: calc(100% - 107px);
}

.the-process .linked-next figure:after {
  content: "";
  background: url('assets/icons/arrow head.svg') no-repeat right top;
  position: absolute;
  top: 21px;
  right: 0;
  height: 30px;
  width: 30px
}

.the-process .linked-next figure:before {
  content: "";
  background: url('assets/icons/arrow head.svg') no-repeat right top;
  position: absolute;
  top: 41px;
  right: -111%;
  height: 30px;
  width: 30px
}

.the-process .linked-next-first:before,
.the-process .linked-next-first figure:before {
  display: none
}



.the-process .linked-next-first:after {}

.the-process .linked-next-third:before {
  top: 30px;
  width: calc(211% - 107px)
}

.the-process .linked-next-fourth:before {
  top: 50px;
}





@media (max-width: 768px) {

  .the-process .wp-block-column .wp-block-image {
    width: 70px !important;
    padding-right: 1rem
  }

  .the-process .linked-next:after,
  .the-process .linked-next:before {
    width: 0;
    left: 20px;
    top: 48px;
    border: 1px solid #2C3A4C
  }

  .the-process .linked-next-first:after {
    height: calc(100% - 36px)
  }

  .the-process .linked-next-third:after {
    height: calc(100% - 36px);
    left: 16px
  }

  .the-process .linked-next-fourth:before {
    top: 50px;
    height: calc(220% - 36px);
    left: 26px
  }

  .the-process .linked-next figure:after,
  .the-process .linked-next figure:before {
    content: "";
    background: url('assets/icons/arrow head.svg') no-repeat right top;
    background-size: 8px;
    position: absolute;
    transform: rotate(90deg);
    height: 18px;
    width: 10px;

  }

  .the-process .linked-next figure:after {
    top: 101%;
    left: 14px;
    right: auto;
  }

  .the-process .linked-next-third figure:after {
    top: calc(103%);
    left: 10px;
    right: auto;
  }


  .the-process .linked-next-fourth figure:before {
    top: calc(224%);
    left: 20px;
    right: auto;
  }

  .the-process .wp-block-column {
    display: flex;
    align-items: flex-start;

  }


  .the-process .wp-block-column p {
    margin-block-start: 0;
    width: calc(100% - -100px)
  }

  .the-process .wp-block-column p,
  .the-process .wp-block-column p a {
    font-size: 0.9rem
  }
	
	.hide-in-mobile {
		display: none
	}
	.how-i-am-protected {
		padding: 1.6rem 0 !important
	}
	
	
.the-code-hero-background {
background-size: 45%;
	padding-bottom: 3rem !important
}
	.the-code-hero-subtitle, .the-code-hero-title{
			font-size: 1.3rem !important;
		margin: 0
	}

	.the-code-download-section {
		grid-template-columns: repeat(1, minmax(0, 1fr)) !important
	}
}




.the-code-hero-background {
	  background-image: url('assets/icons/the-code-header.svg');
  background-repeat: no-repeat;
  background-position: bottom right;
}


.the-code-list-of-topics {
	position: absolute
	
}


.tc-glossary-table table{
	
}
.tc-glossary-table table tr:nth-child(odd){
	background: #fff !important
}
.tc-glossary-table table tr:nth-child(odd){
	background: #eef8ff	!important
}
.tc-glossary-table table tr td:first-child{
	background: #E9473F	!important;
	color: #fff
}

.the-code-list li {
	margin-block-start: 0
}

.the-code-list .wp-block-post-title {
	background: white;
	border-bottom: 1px solid #D8D8D8;
	margin: 0
}
.the-code-list li.is-active .wp-block-post-title{
background: #303E51
}
.the-code-list li.is-active .wp-block-post-title a{
	color: white;
	font-weight:700
}
.the-code-list .wp-block-post-title a {
		padding: 1rem;
	display: block
}


.float-left {
	float: left
}
.float-right {
	float: right
}

@media (max-width: 768px) {
.float-mobile-clear {
	clear: both
}
}