body a{
  color: #fffff;
}
.eyebrow {
  font-size: 16px;
  color: #00A9DB;
}

/* 1. Design tokens from theme settings
Variable names are the design's palette; the comment shows the setting. */

:root {
  --navy: #030063;               /* Global colors > Secondary */
  --navy-hover: #0a0a8a;   /* Global colors > Secondary hover */
  --blue: #00A9DB;                  /* Global colors > Accent */
  --blue-dark: #00709B;        /* Global colors > Accent dark */
  --orange: #EE7A1E;               /* Global colors > Primary */
  --orange-hover: #d96c14;   /* Global colors > Primary hover */
  --grey: #DDD8D5;                  /* Global colors > Border */
  --page: #FAFAF9;         /* Global colors > Page background */
  --box: #D7EEF8;                  /* Global colors > Light surface */
  --text: #30354A;                      /* Text > Body (inherits Global colors > Text) */
  --link: #007da3;                      /* Text > Links */
  --link-hover: #004f6e;        /* Global colors > Link hover */
  --font-body: Poppins, sans-serif;       /* Global fonts > Primary */
  --font-heading: Poppins, sans-serif; /* Global fonts > Secondary */
  --content-width: 1341px; /* Spacing > Maximum content width */
  --section-spacing: 64px;  
  --section-spacing-mobile: 30px;  /* Spacing > Vertical spacing */
  --white: #ffffff;
  --link-text: #005E7C;
}

/* Typography (Text settings) */

body {
  font-family: Poppins, sans-serif; font-style: normal; font-weight: normal; text-decoration: none;
  color: var(--text);
  font-size: 18px;
}











body {
  font-family: Poppins, sans-serif; font-style: normal; font-weight: normal; text-decoration: none;
  color: #30354A;
  font-size: 18px;
}



h1 {
  font-weight: 700; text-decoration: none; font-family: Poppins, sans-serif; font-style: normal;
  color: #030063;
  font-size: 56px;
  text-transform: none;
}


h2 {
  font-weight: 700; text-decoration: none; font-family: Poppins, sans-serif; font-style: normal;
  color: #030063;
  font-size: 40px;
  text-transform: none;
}


h3 {
  font-weight: 700; text-decoration: none; font-family: Poppins, sans-serif; font-style: normal;
  color: #030063;
  font-size: 28px;
  text-transform: none;
}


h4 {
  font-weight: 700; text-decoration: none; font-family: Poppins, sans-serif; font-style: normal;
  color: #030063;
  font-size: 22px;
  text-transform: none;
}


h5 {
  font-weight: 700; text-decoration: none; font-family: Poppins, sans-serif; font-style: normal;
  color: #030063;
  font-size: 16px;
  text-transform: none;
}


h6 {
  font-weight: 700; text-decoration: none; font-family: Poppins, sans-serif; font-style: normal;
  color: #030063;
  font-size: 14px;
  text-transform: none;
}



@media (min-width: 768px) and (max-width: 1024px) {
  body {
    font-size: 17px;
    line-height: 1.6;
  }

  h1 {
    font-size: 44px;
    line-height: 1.1;
  }

  h2 {
    font-size: 36px;
    line-height: 1.15;
  }

  h3 {
    font-size: 26px;
    line-height: 1.3;
  }

  h4 {
    font-size: 20px;
    line-height: 1.3;
  }

  h5 {
    font-size: 16px;
    line-height: 1.4;
  }

  h6 {
    font-size: 14px;
    line-height: 1.4;
  }

}


@media (max-width: 767px) {
  body {
    font-size: 16px;
    line-height: 1.6;
  }

  h1 {
    font-size: 36px;
    line-height: 1.15;
  }

  h2 {
    font-size: 30px;
    line-height: 1.2;
  }

  h3 {
    font-size: 24px;
    line-height: 1.3;
  }

  h4 {
    font-size: 20px;
    line-height: 1.35;
  }

  h5 {
    font-size: 18px;
    line-height: 1.4;
  }

  h6 {
    font-size: 16px;
    line-height: 1.4;
  }

}


:where(.hs_cos_wrapper_type_rich_text, .blog-post__body) a {
  font-family: Poppins, sans-serif; font-style: normal; font-weight: normal; text-decoration: underline;
}

/* 2. Containers / dnd areas */

.content-wrapper,
.dnd-section > .row-fluid {
  max-width: var(--content-width);
}

.dnd-section,
.content-wrapper--vertical-spacing {
  padding: var(--section-spacing) 1rem;
}
:where(section.fc-section) {
  padding: var(--section-spacing) 0;
}
/* 3. Buttons (boilerplate button module, forms, blog listing) */

.button,
.hs-button,
.hs-blog-post-listing__post-button {
  padding: 14px 28px;
  border: 2px solid transparent;
  border-radius: 4px;
  background-color: var(--orange);
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  color: var(--navy);
}

.button:hover,
.button:focus,
.hs-button:hover,
.hs-button:focus,
.hs-blog-post-listing__post-button:hover,
.hs-blog-post-listing__post-button:focus {
  background-color: var(--orange-hover);
  color: var(--navy);
}

.btn {
  display: inline-block;
  padding: 14px 28px;
  border: 2px solid transparent;
  border-radius: 4px;
  font-family: inherit;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  transition: background .15s, transform .15s;
}

.primary-btn, .cta-primary {
  display: inline-block;
  font-family: Poppins;
  font-size: 16px;
  color: #030063;
  text-transform: none;
  background-color: rgba(
    238, 122, 30,
    1.0
  );
  
  border: 1px
    solid
    rgba(
      238, 122, 30,
      0.0
    );
  
  border-radius: 4px;
  padding:
    14px
    28px
    14px
    28px;
}



.primary-btn:hover,.cta-primary:hover {
  transform: translateY(-1px);
  color: rgba(
    3, 0, 99,
    1.0
  );
  background-color: rgba(
    217, 108, 20,
    1.0
  );
  border-top-color: rgba(
    26, 51, 78,
    0.0
  );
  border-right-color: rgba(
    26, 51, 78,
    0.0
  );
  border-bottom-color: rgba(
    26, 51, 78,
    0.0
  );
  border-left-color: rgba(
    26, 51, 78,
    0.0
  );
  border-radius: 4px;
}


.secondary-btn {
  display: inline-block;
  font-family: Poppins;
  font-size: 16px;
  color: #ffffff;
  text-transform: none;
  background-color: #030063;
  border: 2px
    solid
    #030063;
  border-radius: 4px;
  padding:
    14px
    28px
    14px
    28px;
}

.secondary-btn:hover {
  color: #ffffff;
  background-color: #0a0a8a;
  border-top-color: #0a0a8a;
  border-right-color: #0a0a8a;
  border-bottom-color: #0a0a8a;
  border-left-color: #0a0a8a;
  border-radius: 4px;
}



.tertiary,.bff-link {
  align-self: flex-start;
  transition: background .2s;
  display: inline-block;
  font-family: Poppins;
  font-size: 16px;
  color: #030063;
  text-transform: none;
  background-color: #00A9DB;
  border: 0px
    solid
    #EE7A1E;
  border-radius: 4px;
  padding:
    14px
    28px
    14px
    28px;
}

.tertiary:hover, .bff-link:hover {
  color: #030063;
  background-color: #33bbe5;
  border-top-color: #33bbe5;
  border-right-color: #33bbe5;
  border-bottom-color: #33bbe5;
  border-left-color: #33bbe5;
  border-radius: 4px;
}

.btn-ghost {
  display: inline-block;
  font-family: Poppins;
  font-size: 16px;
  color: #ffffff;
  text-transform: none;
  background-color: rgba(
    255, 255, 255,
    0.0
  );
  border: 1px
    solid
    #ffffff;
  border-radius: 4px;
  padding:
    14px
    28px
    14px
    28px;
}

.btn-ghost:hover {
  color: #ffffff;
  background-color: rgba(
    255, 255, 255,
    0.0);
  border-top-color: #FFFFFF;
  border-right-color: #FFFFFF;
  border-bottom-color: #FFFFFF;
  border-left-color: #FFFFFF;
  border-radius: 4px;
}


.link, .link-btn {
  border-bottom: 2px solid var(--blue);
  color: var(--link-text);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  
  display: inline-block;
  font-family: Poppins;
  font-size: 16px;
  color: #007da3;
  text-transform: none;
    background-color: rgba(
    255, 255, 255,
    0.0
  );

  padding:
    
    
    
    ;
}

.link:hover,.link-btn:hover {
  color: #fffff;
  background-color: ;
}

.gray-btn {
  transition: background .15s, transform .15s;
  display: inline-flex;
  align-items: center;
  font-family: Poppins;
  font-size: 16px;
  color: #030063;
  text-transform: none;
  background-color: rgba(
    255, 255, 255,
    0.55);
  
  
  border: 1px
    solid
    #030063;
  border-radius: 4px;
  padding:
    14px
    28px
    14px
    28px;
}

.gray-btn:hover {
  color: #030063;
  background-color: #ffffff;
  border-top-color: #ffffff;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
  border-left-color: #ffffff;
  border-radius: 4px;
  transform: translateY(-2px);
}



.gray-btn{
  background: hsla(0, 0%, 100%, .55);
  border: 1.5px solid rgba(3, 0, 99, .25);
}


.addtional-button {
  margin: 30px auto 10px auto;
  text-align:center;
  justify-content:center;
}
/* 4. Forms */

form label {
  color: var(--navy);
  font-weight: 500;
}

form legend {
  color: var(--text);
}

form input[type=text],
form input[type=search],
form input[type=email],
form input[type=password],
form input[type=tel],
form input[type=number],
form input[type=file],
form select,
form textarea {
  border: 1px solid var(--grey);
  border-radius: 4px;
  background-color: var(--white);
  font-family: inherit;
  color: var(--text);
}

form input:focus,
form select:focus,
form textarea:focus {
  outline: 2px solid var(--blue);
  outline-offset: 0;
}

::placeholder {
  color: #6b7084;
}

.fn-date-picker td.is-selected .pika-button,
.fn-date-picker td .pika-button:hover {
  background: var(--navy) !important;
}

.fn-date-picker td.is-today .pika-button {
  color: var(--navy);
}

/* 5. Tables (editor content only, so the product mockups in modules keep their own table styles) */

:where(.hs_cos_wrapper_type_rich_text, .blog-post__body) table {
  border: 1px solid var(--grey);
  background-color: var(--white);
}

:where(.hs_cos_wrapper_type_rich_text, .blog-post__body) :is(td, th) {
  padding: 0.7rem;
  border: 1px solid var(--grey);
  color: var(--text);
}

:where(.hs_cos_wrapper_type_rich_text, .blog-post__body) thead th {
  background-color: var(--box);
  color: var(--navy);
}

/* 6. Blog */

.blog-post,
.blog-header__inner,
.blog-related-posts {
  padding: var(--section-spacing) 0;
}

.blog-post__meta a,
.blog-post__tag-link,
.hs-blog-post-listing__post-tag,
.hs-blog-post-listing__post-author-name,
.hs-pagination__link-text,
.hs-pagination__link--number {
  color: var(--text);
}

.blog-related-posts__title-link,
.hs-blog-post-listing__post-title-link,
.hs-search-results__title {
  color: var(--navy);
  font-weight: 700;
}

.blog-post__tag-link:hover,
.blog-related-posts__title-link:hover,
.hs-blog-post-listing__post-title-link:hover {
  color: var(--link-hover);
}

.blog-comments {
  margin-bottom: var(--section-spacing);
}

#comments-listing .comment-reply-to {
  color: var(--link);
}

.hs-pagination__link-icon svg {
  fill: var(--text);
}

/* 7. Sample modules */

.card__price {
  font-size: 24px;
  font-weight: 700;
  color: var(--navy);
}

.card__body svg {
  fill: var(--navy);
}

.social-links__icon {
  background-color: var(--navy);
}

.social-links__icon:hover,
.social-links__icon:focus {
  background-color: var(--navy-hover);
}
.dnd-section, .content-wrapper--vertical-spacing{padding:0;}



/* Buttons */

.cta-primary {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  background: var(--orange);
  font-size: 17px;
  font-weight: 700;
  color: var(--navy);
  transition: background .15s, transform .15s;
}

.cta-primary {
  align-items: center;
  background: hsla(0, 0%, 100%, .55);
  border: 1.5px solid rgba(3, 0, 99, .25);
  color: var(--navy);
  display: inline-flex;
  font-size: 17px;
  font-weight: 500;
  transition: background .15s, transform .15s;

}
 
 /* ==========================================================================
   12. WEBSITE HEADER (theme settings → header module)
   Linked: Background (solid/gradient), Menu text, Drop downs, CTA, Feature card
   ========================================================================== */


















 
/* ---- Variables (dusre rules aur module yahi use karte hain) ---- */
:root {
  --hdr-menu-text:    #ffffff;
  --hdr-dd-text:      #30354A;
  --hdr-dd-heading:   #00A9DB;
  --hdr-dd-hover:     #030063;
  --hdr-dd-rich:      #030063;
  --hdr-dd-bg:        #FFFFFF;
  --hdr-cta-bg:       ;
  --hdr-cta-text:     ;
  --hdr-cta-bg-hover: ;
}

/* Feature card colors (module ke fallback ko override karta hai) */
:root .fch {
  --fcard-bg-start: #030063;
  --fcard-bg-end:   #060a3d;
  --fcard-tag:      #8fe6ff;
  --fcard-title:    #ffffff;
  --fcard-text:     #cdd6ef;
  --fcard-link:     #ffffff;
}

/* ---- Bar background: Solid ya Gradient ---- */
.fch .fch__bar {
  
  background: linear-gradient(
    115deg,
    #030063 0%,
    #030063 35%,
    #00A9DB 115%
  );
  
}

/* ---- Menu text (labels, underline, hamburger) ---- */
.fch .fch__label,
.fch .fch__label:hover,
.fch .fch__item.is-open > .fch__label {
  color: #ffffff;
}
.fch .fch__label::after { background: #ffffff; }
.fch .fch__chevron { stroke: currentColor; }

.fch .fch__toggle-bars,
.fch .fch__toggle-bars::before,
.fch .fch__toggle-bars::after {
  background: #ffffff;
}
.fch.is-menu-open .fch__toggle-bars { background: transparent; }

.fch .fch__toggle:focus-visible,
.fch .fch__label:focus-visible {
  outline-color: #ffffff;
}

/* ---- Drop down panel ---- */
.fch .fch__panel {
  background: var(--hdr-dd-bg);
  border-top:    1px none #DDD8D5;
  border-right:  1px none #DDD8D5;
  border-bottom: 1px none #DDD8D5;
  border-left:   1px none #DDD8D5;
}

/* ---- Drop down text, headings, links ---- */
.fch .fch__heading { color: var(--hdr-dd-heading); }

.fch .fch__link,
.fch .fch__rich-text {
  color: var(--hdr-dd-text);
}
.fch .fch__link:hover { color: var(--hdr-dd-hover); }

.fch .fch__rich-title,
.fch .fch__more {
  color: var(--hdr-dd-rich);
}
.fch .fch__rich-icon { background: {color=#D7EEF8, opacity=null, rgba=rgba(215, 238, 248, 1), rgb=rgb(215, 238, 248), hex=#D7EEF8, css=#D7EEF8}; }

/* ---- Site search inside panel ---- */
.fch .fcs { --fcs-text: var(--hdr-dd-text); }

/* ---- Mobile: accordion panel par border hata do ---- */
@media (max-width: 960px) {
  :where(section.fc-section) {
  padding: var(--section-spacing-mobile) 0;
}
  .dnd-section,
.content-wrapper--vertical-spacing {
  padding: var(--section-spacing-mobile) 1rem;
}
  /* 6. Blog */

.blog-post,
.blog-header__inner,
.blog-related-posts {
  padding: var(--section-spacing-mobile) 0;
}
  .fch .fch__panel {
    border: 0;
    background: var(--hdr-dd-bg);
  }
}