/* ==========================================================
   Investor Pointe Utility Classes
   Purpose: Lightweight styling layer for existing HubSpot theme modules
   Usage: Add these classes to module / section wrapper CSS class fields
   ========================================================== */

:root {
  --ip-blue: #0C1B73;
  --ip-orange: #FF7300;
  --ip-text: #212121;
  --ip-light-grey: #ECECE9;
  --ip-light-blue: #5BC0FF;
  --ip-teal: #00A7A7;
  --ip-dark-navy: #000047;
  --ip-white: #FFFFFF;
  --ip-gris: #5B6778;

  --ip-max-width: 1180px;
  --ip-radius-sm: 0px;
  --ip-radius-md: 0px;
  --ip-radius-lg: 0px;
  --ip-transition: all 0.2s ease-in-out;
}

/* ==========================================================
   Base Helpers
   ========================================================== */


h1{
font-family: "Noto serif", serif !important;
  font-size:60px;
  line-height:1.1;
  padding-bottom:26px;
}

h2{
font-family: "Noto serif", serif !important;
  font-size:48px;
  font-weight:400;
}

h3{
font-family: "Noto serif", serif !important;
  font-size:60px;
}

.subtitle{
font-family: "Noto serif", serif !important;
  font-size:40px;
  font-weight:600;
  padding-bottom:20px;
  line-height:1.2;
  
}

.ip-container {
  max-width: var(--ip-max-width);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
}

.ip-text-blue { color: var(--ip-blue) !important; }
.ip-text-navy { color: var(--ip-dark-navy) !important; }
.ip-text-orange { color: var(--ip-orange) !important; }
.ip-text-teal { color: var(--ip-teal) !important; }
.ip-text-white { color: var(--ip-white) !important; }
.ip-text-dark { color: var(--ip-text) !important; }

.ip-center { text-align: center; }
.ip-left { text-align: left; }
.ip-right { text-align: right; }

.ip-no-margin { margin: 0 !important; }
.ip-no-padding { padding: 0 !important; }

.ip-padding-sm { padding-top: 32px !important; padding-bottom: 32px !important; }
.ip-padding-md { padding-top: 56px !important; padding-bottom: 56px !important; }
.ip-padding-lg { padding-top: 80px !important; padding-bottom: 80px !important; }
.ip-padding-xl { padding-top: 112px !important; padding-bottom: 112px !important; }

/* ==========================================================
   Section Backgrounds
   ========================================================== */

.ip-section-hero,
.ip-gradient-hero {
  background: radial-gradient(circle at 82% 28%, rgba(91, 192, 255, 0.18) 0%, rgba(91, 192, 255, 0.04) 28%, transparent 52%),
              linear-gradient(180deg, var(--ip-blue) 0%, var(--ip-dark-navy) 100%);
  color: var(--ip-white);
}

.ip-gradient-top {
  background: linear-gradient(180deg, var(--ip-blue) 0%, var(--ip-dark-navy) 100%);
  color: var(--ip-white);
}

.ip-gradient-bottom {
  background: linear-gradient(180deg, var(--ip-dark-navy) 0%, var(--ip-blue) 100%);
  color: var(--ip-white);
}

.ip-section-blue,
.ip-bg-blue {
  background: var(--ip-blue);
  color: var(--ip-white);
}

.ip-section-navy,
.ip-bg-navy {
  background: var(--ip-dark-navy);
  color: var(--ip-white);
}

.ip-section-grey,
.ip-bg-grey {
  background: var(--ip-light-grey);
  color: var(--ip-blue);
}

.ip-section-white,
.ip-bg-white {
  background: var(--ip-white);
  color: var(--ip-text);
}
.ip-section-lightblue,
.ip-bg-lightblue {
  background: #f5faff;
  color: var(--ip-text);
}
.ip-section-white h1,
.ip-section-white h2,
.ip-section-white h3,
.ip-section-white h4,
.ip-bg-white h1,
.ip-bg-white h2,
.ip-bg-white h3,
.ip-bg-white h4,
.ip-section-grey h1,
.ip-section-grey h2,
.ip-section-grey h3,
.ip-section-grey h4,
.ip-bg-grey h1,
.ip-bg-grey h2,
.ip-bg-grey h3,
.ip-bg-grey h4 {
  color: var(--ip-blue);
}

.ip-section-hero h1,
.ip-section-hero h2,
.ip-section-hero h3,
.ip-gradient-hero h1,
.ip-gradient-hero h2,
.ip-gradient-hero h3,
.ip-gradient-top h1,
.ip-gradient-top h2,
.ip-gradient-top h3,
.ip-gradient-bottom h1,
.ip-gradient-bottom h2,
.ip-gradient-bottom h3,
.ip-section-blue h1,
.ip-section-blue h2,
.ip-section-blue h3,
.ip-bg-blue h1,
.ip-bg-blue h2,
.ip-bg-blue h3,
.ip-section-navy h1,
.ip-section-navy h2,
.ip-section-navy h3,
.ip-bg-navy h1,
.ip-bg-navy h2,
.ip-bg-navy h3 {
  color: var(--ip-white);
}

/* Optional image background hero. Add inline background-image or extra class from HubSpot. */
.ip-hero-image {
  position: relative;
  background-size: cover;
  background-position: center;
  color: var(--ip-white);
}

.ip-hero-image::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0, 0, 71, 0.88) 0%, rgba(12, 27, 115, 0.74) 55%, rgba(0, 0, 71, 0.35) 100%);
  z-index: 0;
}

.ip-hero-image > * {
  position: relative;
  z-index: 1;
}

/* ==========================================================
   Buttons
   Apply to button/link module wrapper OR directly to link/button where possible
   ========================================================== */

.ip-btn-orange a,
a.ip-btn-orange,
button.ip-btn-orange,
.ip-btn-orange button,
.ip-btn-orange .hs-button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--ip-orange) !important;
  color: white !important;
  border: 1px solid var(--ip-white) !important;
  border-radius: var(--ip-radius-sm);
  padding: 13px 22px;
  font-weight: 300;
  line-height: 1;
  text-decoration: none !important;
  transition: var(--ip-transition);
}

.ip-btn-orange a::after,
a.ip-btn-orange::after,
button.ip-btn-orange::after,
.ip-btn-orange button::after,
.ip-btn-orange .hs-button::after {
  content: "→";
  font-weight: 300;
  line-height: 1;
}

.ip-btn-orange a:hover,
a.ip-btn-orange:hover,
button.ip-btn-orange:hover,
.ip-btn-orange button:hover,
.ip-btn-orange .hs-button:hover {
  background: #D95F00 !important;
  color: white !important;
  transform: translateY(-1px);
}

.ip-btn-transparent a,
a.ip-btn-transparent,
button.ip-btn-transparent,
.ip-btn-transparent button,
.ip-btn-transparent .hs-button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: transparent !important;
  color: var(--ip-white) !important;
  border: 1px solid var(--ip-white) !important;
  border-radius: var(--ip-radius-sm);
  padding: 13px 22px;
  font-weight: 300;
  line-height: 1;
  text-decoration: none !important;
  transition: var(--ip-transition);
}

.ip-btn-transparent a:hover,
a.ip-btn-transparent:hover,
button.ip-btn-transparent:hover,
.ip-btn-transparent button:hover,
.ip-btn-transparent .hs-button:hover {
  background: rgba(255, 255, 255, 0.12) !important;
  color: var(--ip-white) !important;
  transform: translateY(-1px);
}

.ip-btn-teal a,
a.ip-btn-teal,
button.ip-btn-teal,
.ip-btn-teal button,
.ip-btn-teal .hs-button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--ip-teal) !important;
  color: var(--ip-white) !important;
  border: 1px solid var(--ip-white) !important;
  border-radius: var(--ip-radius-sm);
  padding: 13px 22px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none !important;
  transition: var(--ip-transition);
}

.ip-btn-teal a::after,
a.ip-btn-teal::after,
button.ip-btn-teal::after,
.ip-btn-teal button::after,
.ip-btn-teal .hs-button::after {
  content: "→";
  font-weight: 300;
  line-height: 1;
}

.ip-btn-teal a:hover,
a.ip-btn-teal:hover,
button.ip-btn-teal:hover,
.ip-btn-teal button:hover,
.ip-btn-teal .hs-button:hover {
  background: #008787 !important;
  color: var(--ip-white) !important;
  transform: translateY(-1px);
}

.ip-btn-teal-outline a,
a.ip-btn-teal-outline,
button.ip-btn-teal-outline,
.ip-btn-teal-outline button,
.ip-btn-teal-outline .hs-button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: transparent !important;
  color: var(--ip-teal) !important;
  border: 1px solid var(--ip-teal) !important;
  border-radius: var(--ip-radius-sm);
  padding: 13px 22px;
  font-weight: 300;
  line-height: 1;
  text-decoration: none !important;
  transition: var(--ip-transition);
}

.ip-btn-teal-outline a::after,
a.ip-btn-teal-outline::after,
button.ip-btn-teal-outline::after,
.ip-btn-teal-outline button::after,
.ip-btn-teal-outline .hs-button::after {
  content: "→";
  font-weight: 300;
  line-height: 1;
}

.ip-btn-teal-outline a:hover,
a.ip-btn-teal-outline:hover,
button.ip-btn-teal-outline:hover,
.ip-btn-teal-outline button:hover,
.ip-btn-teal-outline .hs-button:hover {
  background: var(--ip-teal) !important;
  color: var(--ip-white) !important;
  transform: translateY(-1px);
}

.ip-btn-orange-outline a,
a.ip-btn-orange-outline,
button.ip-btn-orange-outline,
.ip-btn-orange-outline button,
.ip-btn-orange-outline .hs-button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: transparent !important;
  color: var(--ip-orange) !important;
  border: 1px solid var(--ip-orange) !important;
  border-radius: var(--ip-radius-sm);
  padding: 13px 22px;
  font-weight: 300;
  line-height: 1;
  text-decoration: none !important;
  transition: var(--ip-transition);
}

.ip-btn-orange-outline a::after,
a.ip-btn-orange-outline::after,
button.ip-btn-orange-outline::after,
.ip-btn-orange-outline button::after,
.ip-btn-orange-outline .hs-button::after {
  content: "→";
  font-weight: 300;
  line-height: 1;
}

.ip-btn-orange-outline a:hover,
a.ip-btn-orange-outline:hover,
button.ip-btn-orange-outline:hover,
.ip-btn-orange-outline button:hover,
.ip-btn-orange-outline .hs-button:hover {
  background: var(--ip-orange) !important;
  color: var(--ip-white) !important;
  transform: translateY(-1px);
}

/* ==========================================================
   Blue Buttons
   ========================================================== */

.ip-btn-blue a,
a.ip-btn-blue,
button.ip-btn-blue,
.ip-btn-blue button,
.ip-btn-blue .hs-button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--ip-blue) !important;
  color: var(--ip-white) !important;
  border: 1px solid var(--ip-blue) !important;
  border-radius: var(--ip-radius-sm);
  padding: 13px 22px;
  font-weight: 300;
  line-height: 1;
  text-decoration: none !important;
  transition: var(--ip-transition);
}

.ip-btn-blue a::after,
a.ip-btn-blue::after,
button.ip-btn-blue::after,
.ip-btn-blue button::after,
.ip-btn-blue .hs-button::after {
  content: "→";
  font-weight: 300;
  line-height: 1;
}

.ip-btn-blue a:hover,
a.ip-btn-blue:hover,
button.ip-btn-blue:hover,
.ip-btn-blue button:hover,
.ip-btn-blue .hs-button:hover {
  background: var(--ip-dark-navy) !important;
  border-color: var(--ip-dark-navy) !important;
  color: var(--ip-white) !important;
  transform: translateY(-1px);
}


/* ==========================================================
   Blue Outline Buttons
   ========================================================== */

.ip-btn-blue-outline a,
a.ip-btn-blue-outline,
button.ip-btn-blue-outline,
.ip-btn-blue-outline button,
.ip-btn-blue-outline .hs-button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: transparent !important;
  color: var(--ip-blue) !important;
  border: 1px solid var(--ip-blue) !important;
  border-radius: var(--ip-radius-sm);
  padding: 13px 22px;
  font-weight: 300;
  line-height: 1;
  text-decoration: none !important;
  transition: var(--ip-transition);
}

.ip-btn-blue-outline a::after,
a.ip-btn-blue-outline::after,
button.ip-btn-blue-outline::after,
.ip-btn-blue-outline button::after,
.ip-btn-blue-outline .hs-button::after {
  content: "→";
  font-weight: 300;
  line-height: 1;
}

.ip-btn-blue-outline a:hover,
a.ip-btn-blue-outline:hover,
button.ip-btn-blue-outline:hover,
.ip-btn-blue-outline button:hover,
.ip-btn-blue-outline .hs-button:hover {
  background: var(--ip-blue) !important;
  color: var(--ip-white) !important;
  transform: translateY(-1px);
}


/* ==========================================================
   White Filled Buttons
   ========================================================== */

.ip-btn-white a,
a.ip-btn-white,
button.ip-btn-white,
.ip-btn-white button,
.ip-btn-white .hs-button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--ip-white) !important;
  color: var(--ip-blue) !important;
  border: 1px solid var(--ip-white) !important;
  border-radius: var(--ip-radius-sm);
  padding: 13px 22px;
  font-weight: 300;
  line-height: 1;
  text-decoration: none !important;
  transition: var(--ip-transition);
}

.ip-btn-white a::after,
a.ip-btn-white::after,
button.ip-btn-white::after,
.ip-btn-white button::after,
.ip-btn-white .hs-button::after {
  content: "→";
  font-weight: 300;
  line-height: 1;
}

.ip-btn-white a:hover,
a.ip-btn-white:hover,
button.ip-btn-white:hover,
.ip-btn-white button:hover,
.ip-btn-white .hs-button:hover {
  background: rgba(255,255,255,0.92) !important;
  color: var(--ip-dark-navy) !important;
  transform: translateY(-1px);
}

/* Button grouping */
.ip-btn-row,
.ip-button-row {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: center;
}

/* ==========================================================
   Borders / Dividers
   ========================================================== */

.ip-border-left { border-left: 2px solid var(--ip-light-grey) !important; }
.ip-border-right { border-right: 2px solid var(--ip-light-grey) !important; }
.ip-border-top { border-top: 2px solid var(--ip-light-grey) !important; }
.ip-border-bottom { border-bottom: 2px solid var(--ip-light-grey) !important; }

.ip-border-left-pad { border-left: 2px solid var(--ip-light-grey) !important; padding-left: 28px !important; }
.ip-border-right-pad { border-right: 2px solid var(--ip-light-grey) !important; padding-right: 28px !important; }
.ip-border-top-pad { border-top: 2px solid var(--ip-light-grey) !important; padding-top: 28px !important; }
.ip-border-bottom-pad { border-bottom: 2px solid var(--ip-light-grey) !important; padding-bottom: 28px !important; }

.ip-divider-light { border-color: var(--ip-light-grey) !important; }
.ip-divider-blue { border-color: rgba(12, 27, 115, 0.18) !important; }
.ip-divider-white { border-color: rgba(255, 255, 255, 0.22) !important; }

/* ==========================================================
   Section Header / Eyebrow
   ========================================================== */

.ip-section-header,
.ip-eyebrow {
  position: relative;
  display: inline-block;
  padding-left: 14px;
  margin-bottom: 18px;
  color: #5B6778;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.18em;
  line-height: 1.2;
  text-transform: uppercase;
}

.ip-section-header::before,
.ip-eyebrow::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.05em;
  bottom: 0.05em;
  width: 4px;
  background: var(--ip-orange);
}




/* ==========================================================
   Cards / Module Polish
   ========================================================== */

.ip-card {
  background: var(--ip-white);
  border: 1px solid rgba(12, 27, 115, 0.12);
  border-radius: var(--ip-radius-md);
  padding: 28px;
  color: var(--ip-text);
}

.ip-card h1,
.ip-card h2,
.ip-card h3,
.ip-card h4 {
  color: var(--ip-blue);
}

.ip-card-shadow {
  box-shadow: 0 14px 36px rgba(0, 0, 71, 0.08);
}

.ip-card-hover {
  transition: var(--ip-transition);
}

.ip-card-hover:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 44px rgba(0, 0, 71, 0.12);
}

.ip-card-dark {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: var(--ip-white);
}

.ip-card-dark h1,
.ip-card-dark h2,
.ip-card-dark h3,
.ip-card-dark h4 {
  color: var(--ip-white);
}

/* Number/icon circles used in lifecycle cards */
.ip-number-badge,
.ip-icon-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  background: var(--ip-teal);
  color: var(--ip-white);
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
}

/* ==========================================================
   Homepage-Specific Utility Hooks
   ========================================================== */

.ip-logo-strip {
  background: var(--ip-white);
  padding: 32px 0;
}

.ip-logo-strip img {
  max-height: 44px;
  width: auto;
  opacity: 0.78;
}

.ip-testimonial-band {
  background: var(--ip-light-grey);
  color: var(--ip-blue);
  padding: 48px 0;
}

.ip-testimonial-band blockquote {
  margin: 0;
  color: var(--ip-blue);
  font-size: clamp(24px, 3vw, 36px);
  font-style: italic;
  line-height: 1.18;
}

.ip-quote-mark {
  color: var(--ip-orange);
  font-size: 64px;
  line-height: 0.8;
  font-weight: 700;
}

.ip-cta-band {
  background: linear-gradient(180deg, var(--ip-blue) 0%, var(--ip-dark-navy) 100%);
  color: var(--ip-white);
  text-align: center;
  padding: 72px 24px;
}

.ip-cta-band h1,
.ip-cta-band h2,
.ip-cta-band h3,
.ip-cta-band p {
  color: var(--ip-white);
}

.ip-news-card {
  border-left: 1px solid var(--ip-light-grey);
  padding-left: 28px;
}

.ip-news-meta {
  color: var(--ip-orange);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* ==========================================================
   Forms
   ========================================================== */

.ip-form-light input,
.ip-form-light textarea,
.ip-form-light select {
  border: 1px solid rgba(12, 27, 115, 0.18) !important;
  border-radius: var(--ip-radius-sm) !important;
  color: var(--ip-text) !important;
}

.ip-form-dark input,
.ip-form-dark textarea,
.ip-form-dark select {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.34) !important;
  border-radius: var(--ip-radius-sm) !important;
  color: var(--ip-white) !important;
}

.ip-form-dark input::placeholder,
.ip-form-dark textarea::placeholder {
  color: rgba(255, 255, 255, 0.68) !important;
}

/* ==========================================================
   Responsive
   ========================================================== */



/* Tablet / small desktop section padding */
@media (min-width: 768px) and (max-width: 1199px) {
  .ip-section-shell,
  .ip-section-shell[class*="row"][class*="p-"] {
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
}


  .ip-padding-lg { padding-top: 56px !important; padding-bottom: 56px !important; }
  .ip-padding-xl { padding-top: 72px !important; padding-bottom: 72px !important; }

  .ip-border-left,
  .ip-border-left-pad,
  .ip-border-right,
  .ip-border-right-pad {
    border-left: 0 !important;
    border-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .ip-mobile-border-top {
    border-top: 2px solid var(--ip-light-grey) !important;
    padding-top: 24px !important;
  }

  .ip-btn-row,
  .ip-button-row {
    flex-direction: column;
    align-items: stretch;
  }

  .ip-btn-row a,
  .ip-button-row a,
  .ip-btn-row button,
  .ip-button-row button {
    justify-content: center;
    width: 100%;
  }

@media (max-width: 767px) {
  .ip-section-shell,
  .ip-section-shell[class*="row"][class*="p-"] {
    padding-left: 28px !important;
    padding-right: 28px !important;
  }}

  .ip-section-shell .row-fluid,
  .ip-section-shell .span12,
  .ip-section-shell .widget-span {
    box-sizing: border-box;
  }
}
@media (max-width: 767px) {

  h1 {
    font-size: 48px !important;
    line-height: 1.1 !important;
  }

  h2 {
    font-size: 38px !important;
    line-height: 1.15 !important;
  }

  .subtitle {
    font-size: 28px !important;
  }

}

@media (max-width: 767px) {
  .hs-richtext br {
    display: none;
  }
}
/* ==========================================================
   Investor Pointe HubSpot Section Compatibility Addendum
   Use this if HubSpot/theme section wrappers swallow standard classes.
   ========================================================== */

.ip-section-shell {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.ip-section-shell > .row-fluid,
.ip-section-shell .row-fluid,
.ip-section-shell .dnd-column,
.ip-section-inner {
  position: relative;
  z-index: 1;
}

.ip-section-inner {
  max-width: var(--ip-max-width, 1180px);
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
  box-sizing: border-box;
}

.ip-section-standard-spacing .ip-section-inner {
  padding-top: 80px !important;
  padding-bottom: 80px !important;
}

.ip-section-hero-spacing .ip-section-inner {
  padding-top: 120px !important;
  padding-bottom: 96px !important;
}

.ip-section-cta-spacing .ip-section-inner {
  padding-top: 88px !important;
  padding-bottom: 88px !important;
}

.ip-section-dark,
.ip-section-dark h1,
.ip-section-dark h2,
.ip-section-dark h3,
.ip-section-dark h4,
.ip-section-dark h5,
.ip-section-dark h6,
.ip-section-dark p,
.ip-section-dark li {
  color: var(--ip-white, #FFFFFF);
}

.ip-section-light h1,
.ip-section-light h2,
.ip-section-light h3,
.ip-section-light h4,
.ip-section-light h5,
.ip-section-light h6 {
  color: var(--ip-blue, #0C1B73);
}

.ip-section-light p,
.ip-section-light li {
  color: var(--ip-text, #212121);
}

@media (max-width: 767px) {
  .ip-section-inner {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .ip-section-standard-spacing .ip-section-inner,
  .ip-section-cta-spacing .ip-section-inner {
    padding-top: 56px !important;
    padding-bottom: 56px !important;
  }

  .ip-section-hero-spacing .ip-section-inner {
    padding-top: 88px !important;
    padding-bottom: 72px !important;
  }
}

/*hero image*/
.ip-section-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 650px;
  padding-top:76px;
}

.ip-section-hero::before {
  content: "";
  position: absolute;
padding-top:76px!important;
  width: 1100px;
  height: 1100px;

  top: 100px;
  left:48vw;

  background-image: url("https://144732994.fs1.hubspotusercontent-eu1.net/hubfs/144732994/ip_logo_mark_ko-2.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;

  opacity: 0.14;



  pointer-events: none;
  z-index: 0;
}

.ip-section-hero2::before {
  content: "";
  position: absolute;
padding-top:76px!important;
  width: 1100px;
  height: 1100px;

  top: 100px;
  left:45vw;

  background-image: url("https://144732994.fs1.hubspotusercontent-eu1.net/hubfs/144732994/ip_logo_mark_ko-2.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;

  opacity: 0.14;



  pointer-events: none;
  z-index: 0;
}

.ip-section-hero > .row-fluid,
.ip-section-hero .ip-section-inner {
  position: relative;
  z-index: 1;
  padding-top:76px!important;
}

/* =========================================================
   INVESTORPOINTE FOOTER
========================================================= */

.ip-footer-section {
  background:
    radial-gradient(circle at 18% 0%, rgba(91, 192, 255, 0.16) 0%, transparent 34%),
    linear-gradient(180deg, var(--ip-blue) 0%, var(--ip-dark-navy) 100%) !important;

  color: #fff;
  position: relative;
  overflow: hidden;
}

.ip-footer-section .wrapper {
  max-width: 1200px;
  margin: 0 auto;
}

/* Headings */
.ip-footer h5 {
  color: var(--ip-orange);
  font-family: var(--ip-font-heading, inherit);
  font-weight: 400;
    font-family:"Noto serif", serif;
}

/* Footer links */
.ip-footer .footer-menu a {
  color: rgba(255,255,255,0.78);
  text-decoration: none;
  font-size: 14px;

}

.ip-footer .footer-menu a:hover {
  color: #ff7a2f;
}

/* Bottom area */
.ip-footer .bottom-footer {
  border-top: 1px solid rgba(255,255,255,0.14);
}

.ip-footer .copyright,
.ip-footer .copyright p,
.ip-footer .text,
.ip-footer .text p {
  color: rgba(255,255,255,0.72);
}

/* Footer ghost compass */
.ip-footer-section::before {
  content: "";
  position: absolute;
  width: 760px;
  height: 760px;

  right: -220px;
  bottom: -160px;

  background-image: url("https://144732994.fs1.hubspotusercontent-eu1.net/hubfs/144732994/ip_logo_mark_ko-2.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;

  opacity: 0.10;
  pointer-events: none;
  z-index: 0;
}

.ip-footer-section .wrapper,
.ip-footer-section .ip-footer {
  position: relative;
  z-index: 1;
}

@media (max-width: 767px) {
  .ip-footer-section::before {
    width: 420px;
    height: 420px;
    right: -180px;
    bottom: -140px;
    opacity: 0.08;
  }
}

/* Social icons */
.ip-footer .social a {
  color: #fff;
}

.ip-footer .social a:hover {
  color: #ff7a2f;
}

.ip-footer-intro{
padding-right:75px;
}

/* Hide HubSpot meetings promo link */
div[data-application-name="embedded-viral-link-ui"] {
  display: none !important;
}
/* =========================================================
   Investor Pointe Blog Post Template
   ========================================================= */

/* Overall page wrapper */
.body-container-wrapper {
  width: 100%;
}

/* ---------------------------------------------------------
   Hero section
   --------------------------------------------------------- */

.ip-hero.ip-section-hero2.ip-gradient-hero {
  padding-top: 180px;
  padding-bottom: 90px;
}

.ip-search-hero {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.ip-search-hero .blog-post {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}

.ip-search-hero h1 {
  margin: 0 0 24px;
  color: #ffffff;
}

.ip-search-hero .blog-post__meta {
  color: rgba(255, 255, 255, 0.85);
}

.ip-search-hero .tag {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  color: rgba(255, 255, 255, 0.85);
}

.ip-search-hero .tag a {
  color: #ffffff;
  text-decoration: none;
}

.ip-search-hero .tag a:hover {
  color: var(--ip-orange, #FF7300);
}


/* ---------------------------------------------------------
   Main blog post container
   --------------------------------------------------------- */

.body-container--blog-post {
  width: 100%;
  padding: 80px 32px 0;
  box-sizing: border-box;
}

.body-container--blog-post .content-wrapper {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.body-container--blog-post > .content-wrapper > .blog-post {
  max-width: 900px;
  margin: 0 auto;
}


/* ---------------------------------------------------------
   Author / share row
   --------------------------------------------------------- */

.user_social {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  margin-bottom: 48px;
}

.post_user {
  display: flex;
  align-items: center;
  gap: 14px;
}

.post_user .img {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  overflow: hidden;
  flex: 0 0 48px;
}

.post_user .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.admin_text a {
  color: var(--ip-blue, #0C1B73);
  font-weight: 600;
  text-decoration: none;
}

.admin_text a:hover {
  color: var(--ip-orange, #FF7300);
}

.post_social {
  display: flex;
  align-items: center;
  gap: 14px;
}

.post_social span {
  color: #5B6778;
  font-size: 14px;
}

.post_social ul {
  display: flex;
  align-items: center;
  gap: 14px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.post_social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ip-blue, #0C1B73);
  text-decoration: none;
}

.post_social a:hover svg path {
  fill: var(--ip-orange, #FF7300);
}


/* ---------------------------------------------------------
   Featured image
   --------------------------------------------------------- */

.blog-posts__image {
  display: block;
  width: 100%;
  height: auto;
  max-height: 560px;
  object-fit: cover;
  border-radius: 0;
  margin: 0 0 64px;
}


/* ---------------------------------------------------------
   Blog body
   --------------------------------------------------------- */

.blog-post__body {
  max-width: 820px;
  margin: 0 auto;
  color: #27303F;
}

.blog-post__body p,
.blog-post__body li {
  color: #27303F;
  line-height: 1.75;
}

.blog-post__body p {
  margin: 0 0 24px;
}

.blog-post__body h2,
.blog-post__body h3,
.blog-post__body h4 {
  color: var(--ip-blue, #0C1B73);
  margin-top: 56px;
  margin-bottom: 20px;
}

.blog-post__body h2:first-child,
.blog-post__body h3:first-child {
  margin-top: 0;
}

.blog-post__body img {
  max-width: 100%;
  height: auto;
}

.blog-post__body a {
  color: var(--ip-orange, #FF7300);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.blog-post__body blockquote {
  margin: 48px 0;
  padding-left: 28px;
  border-left: 4px solid var(--ip-orange, #FF7300);
  color: #5B6778;
  font-size: 1.15em;
  line-height: 1.6;
}


/* ---------------------------------------------------------
   Related posts
   --------------------------------------------------------- */

.blog-related-posts {
  width: 100%;
  padding: 90px 32px 80px;
  box-sizing: border-box;
}

.blog-related-posts .wrapper {
  max-width: 1200px;
  margin: 0 auto;
}

.blog-related-posts h2 {
  margin: 0 0 40px;
  color: var(--ip-blue, #0C1B73);
  text-align: center;
}

.blog_list {
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
  width: 100%;
}

.blog_box {
  box-sizing: border-box;
  flex: 0 0 calc((100% - 64px) / 3);
  max-width: calc((100% - 64px) / 3);
  min-width: 0;
}

.blog_box .blog_img {
  display: block;
  width: 100%;
  height: 220px;
  object-fit: cover;
  margin-bottom: 24px;
}

.blog_box .tag {
  margin-bottom: 14px;
  color: #5B6778;
  font-size: 14px;
}

.blog_box .tag a {
  color: var(--ip-orange, #FF7300);
  text-decoration: none;
}

.blog_box h3 {
  margin: 0 0 14px;
}

.blog_box h3 a {
  color: var(--ip-blue, #0C1B73);
  text-decoration: none;
}

.blog_box h3 a:hover {
  color: var(--ip-orange, #FF7300);
}

.blog_box .date {
  margin-bottom: 16px;
  color: #5B6778;
  font-size: 14px;
}

.blog_box .content {
  color: #27303F;
  line-height: 1.6;
  margin-bottom: 22px;
}

.blog_box .arrow_btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--ip-orange, #FF7300);
  text-decoration: none;
  font-weight: 600;
}

.blog_box .arrow_btn:hover {
  gap: 14px;
}


/* ---------------------------------------------------------
   Tablet
   --------------------------------------------------------- */

@media (max-width: 1199px) {
  .ip-hero.ip-section-hero2.ip-gradient-hero {
    padding-top: 160px;
    padding-bottom: 80px;
  }

  .body-container--blog-post {
    padding-left: 40px;
    padding-right: 40px;
  }

  .blog-related-posts {
    padding-left: 40px;
    padding-right: 40px;
  }

  .blog_box {
    flex: 0 0 calc((100% - 32px) / 2);
    max-width: calc((100% - 32px) / 2);
  }
}


/* ---------------------------------------------------------
   Mobile
   --------------------------------------------------------- */

@media (max-width: 767px) {
  .ip-hero.ip-section-hero2.ip-gradient-hero {
    padding-top: 130px;
    padding-bottom: 64px;
  }

  .body-container--blog-post {
    padding: 56px 20px 0;
  }

  .user_social {
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 36px;
  }

  .post_social {
    width: 100%;
    justify-content: space-between;
  }

  .blog-posts__image {
    margin-bottom: 44px;
  }

  .blog-post__body h2,
  .blog-post__body h3,
  .blog-post__body h4 {
    margin-top: 40px;
  }

  .blog-related-posts {
    padding: 70px 20px 60px;
  }

  .blog_list {
    gap: 40px;
  }

  .blog_box {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .blog_box .blog_img {
    height: auto;
  }
}