/*
Welcome to Custom CSS!

To learn how this works, see http://wp.me/PEmnE-Bt
*/
/*
.site-branding.has-header {
	height: 120px;
}

.header-image {
	max-height: px;
}


.main-navigation.has-header {
	background-color: #1f567d;
}

.header-image {
	background-size: contain;
	background-position: center center;
	max-height: 180px;
}
*/
.site-branding.has-header {
	height: 200px;
	margin: inherit;
}







/* --- FIX FOR SERVICE PAGES (IDs: 12140, 12214, 12223, 12226, 12231, 12229, 12236) --- */

/* 1. Override the theme's 700px max-width to allow full width on these specific pages */
.post-12140.hentry, .page-id-12140 .hentry,
.post-12214.hentry, .page-id-12214 .hentry,
.post-12223.hentry, .page-id-12223 .hentry,
.post-12226.hentry, .page-id-12226 .hentry,
.post-12231.hentry, .page-id-12231 .hentry,
.post-12229.hentry, .page-id-12229 .hentry,
.post-12236.hentry, .page-id-12236 .hentry {
  max-width: none !important;
  margin: 0 auto !important;
  width: 100% !important;
}

/* 1a. Remove padding/margin from .article-wrapper, .primary, and .entry-content on these pages */
.post-12140 .article-wrapper, .page-id-12140 .article-wrapper,
.post-12214 .article-wrapper, .page-id-12214 .article-wrapper,
.post-12223 .article-wrapper, .page-id-12223 .article-wrapper,
.post-12226 .article-wrapper, .page-id-12226 .article-wrapper,
.post-12231 .article-wrapper, .page-id-12231 .article-wrapper,
.post-12229 .article-wrapper, .page-id-12229 .article-wrapper,
.post-12236 .article-wrapper, .page-id-12236 .article-wrapper,
.post-12140 #page .primary, .page-id-12140 #page .primary,
.post-12214 #page .primary, .page-id-12214 #page .primary,
.post-12223 #page .primary, .page-id-12223 #page .primary,
.post-12226 #page .primary, .page-id-12226 #page .primary,
.post-12231 #page .primary, .page-id-12231 #page .primary,
.post-12229 #page .primary, .page-id-12229 #page .primary,
.post-12236 #page .primary, .page-id-12236 #page .primary {
  padding: 0 !important;
}
.post-12140 .entry-content, .page-id-12140 .entry-content,
.post-12214 .entry-content, .page-id-12214 .entry-content,
.post-12223 .entry-content, .page-id-12223 .entry-content,
.post-12226 .entry-content, .page-id-12226 .entry-content,
.post-12231 .entry-content, .page-id-12231 .entry-content,
.post-12229 .entry-content, .page-id-12229 .entry-content,
.post-12236 .entry-content, .page-id-12236 .entry-content,
.post-12140 .article-wrapper, .page-id-12140 .article-wrapper,
.post-12214 .article-wrapper, .page-id-12214 .article-wrapper,
.post-12223 .article-wrapper, .page-id-12223 .article-wrapper,
.post-12226 .article-wrapper, .page-id-12226 .article-wrapper,
.post-12231 .article-wrapper, .page-id-12231 .article-wrapper,
.post-12229 .article-wrapper, .page-id-12229 .article-wrapper,
.post-12236 .article-wrapper, .page-id-12236 .article-wrapper {
  margin: 0 !important;
}

/* 1b. Force full width on site-content, navigation, and footer on these pages */
.post-12140 .site-content, .page-id-12140 .site-content,
.post-12214 .site-content, .page-id-12214 .site-content,
.post-12223 .site-content, .page-id-12223 .site-content,
.post-12226 .site-content, .page-id-12226 .site-content,
.post-12231 .site-content, .page-id-12231 .site-content,
.post-12229 .site-content, .page-id-12229 .site-content,
.post-12236 .site-content, .page-id-12236 .site-content,
.post-12140 .main-navigation > ul, .page-id-12140 .main-navigation > ul,
.post-12214 .main-navigation > ul, .page-id-12214 .main-navigation > ul,
.post-12223 .main-navigation > ul, .page-id-12223 .main-navigation > ul,
.post-12226 .main-navigation > ul, .page-id-12226 .main-navigation > ul,
.post-12231 .main-navigation > ul, .page-id-12231 .main-navigation > ul,
.post-12229 .main-navigation > ul, .page-id-12229 .main-navigation > ul,
.post-12236 .main-navigation > ul, .page-id-12236 .main-navigation > ul,
.post-12140 .main-navigation > div > ul, .page-id-12140 .main-navigation > div > ul,
.post-12214 .main-navigation > div > ul, .page-id-12214 .main-navigation > div > ul,
.post-12223 .main-navigation > div > ul, .page-id-12223 .main-navigation > div > ul,
.post-12226 .main-navigation > div > ul, .page-id-12226 .main-navigation > div > ul,
.post-12231 .main-navigation > div > ul, .page-id-12231 .main-navigation > div > ul,
.post-12229 .main-navigation > div > ul, .page-id-12229 .main-navigation > div > ul,
.post-12236 .main-navigation > div > ul, .page-id-12236 .main-navigation > div > ul,
.post-12140 .site-footer-wrapper, .page-id-12140 .site-footer-wrapper,
.post-12214 .site-footer-wrapper, .page-id-12214 .site-footer-wrapper,
.post-12223 .site-footer-wrapper, .page-id-12223 .site-footer-wrapper,
.post-12226 .site-footer-wrapper, .page-id-12226 .site-footer-wrapper,
.post-12231 .site-footer-wrapper, .page-id-12231 .site-footer-wrapper,
.post-12229 .site-footer-wrapper, .page-id-12229 .site-footer-wrapper,
.post-12236 .site-footer-wrapper, .page-id-12236 .site-footer-wrapper {
  max-width: none !important;
  width: 100% !important;
}

/* 1c. Hide the default WordPress page title header, breadcrumbs, entry-meta, and sharedaddy blocks on these pages */
.post-12140 .entry-header, .page-id-12140 .entry-header,
.post-12214 .entry-header, .page-id-12214 .entry-header,
.post-12223 .entry-header, .page-id-12223 .entry-header,
.post-12226 .entry-header, .page-id-12226 .entry-header,
.post-12231 .entry-header, .page-id-12231 .entry-header,
.post-12229 .entry-header, .page-id-12229 .entry-header,
.post-12236 .entry-header, .page-id-12236 .entry-header,
.post-12140 .breadcrumbs, .page-id-12140 .breadcrumbs,
.post-12214 .breadcrumbs, .page-id-12214 .breadcrumbs,
.post-12223 .breadcrumbs, .page-id-12223 .breadcrumbs,
.post-12226 .breadcrumbs, .page-id-12226 .breadcrumbs,
.post-12231 .breadcrumbs, .page-id-12231 .breadcrumbs,
.post-12229 .breadcrumbs, .page-id-12229 .breadcrumbs,
.post-12236 .breadcrumbs, .page-id-12236 .breadcrumbs,
.post-12140 .entry-meta, .page-id-12140 .entry-meta,
.post-12214 .entry-meta, .page-id-12214 .entry-meta,
.post-12223 .entry-meta, .page-id-12223 .entry-meta,
.post-12226 .entry-meta, .page-id-12226 .entry-meta,
.post-12231 .entry-meta, .page-id-12231 .entry-meta,
.post-12229 .entry-meta, .page-id-12229 .entry-meta,
.post-12236 .entry-meta, .page-id-12236 .entry-meta,
.post-12140 .sharedaddy, .page-id-12140 .sharedaddy,
.post-12214 .sharedaddy, .page-id-12214 .sharedaddy,
.post-12223 .sharedaddy, .page-id-12223 .sharedaddy,
.post-12226 .sharedaddy, .page-id-12226 .sharedaddy,
.post-12231 .sharedaddy, .page-id-12231 .sharedaddy,
.post-12229 .sharedaddy, .page-id-12229 .sharedaddy,
.post-12236 .sharedaddy, .page-id-12236 .sharedaddy {
  display: none !important;
}

/* 2. Force Open Sans/Poppins font on all headings and text to override the theme */
.co-wm-page h1,
.co-wm-page h2,
.co-wm-page h3,
.co-wm-page h4,
.co-wm-page h5,
.co-wm-page p,
.co-wm-page span,
.co-wm-page a,
.co-wm-page li,
.co-wm-page div {
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

:root {
  --navy-950: #081221 !important;
  --navy-900: #0b1a30;
  --navy-800: #0f2340;
  --blue-600: #2b7fe0;
  --blue-500: #3b93f0;
  --blue-100: #eaf3fd;
  --blue-050: #f2f8fe;
  --text-body: #5c6b7c;
  --text-body-light: #b7c3d6;
  --grey-bg: #eef1f5;
  --white: #ffffff;
  --radius-lg: 14px;
  --radius-md: 10px;
  --radius-sm: 6px;
}




.co-wm-page {
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  color: var(--text-body) !important;
  background: var(--white) !important;
  line-height: 1.5 !important;
  overflow-x: hidden !important;
}

.co-wm-page a {
  text-decoration: none !important;
  color: inherit !important;
}

.co-wm-page ul {
  list-style: none !important;
}

.co-wm-page img {
  max-width: 100% !important;
  display: block !important;
}

.co-wm-page .wrap {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 40px !important;
}

/* ---------- HERO ---------- */
.co-wm-page .hero {
  background: linear-gradient(180deg, var(--navy-950) 0%, var(--navy-900) 100%) !important;
  padding: 40px 0 !important;
  position: relative !important;
  z-index: 1 !important;
}

.co-wm-page .hero::before {
  content: "" !important;
  position: absolute !important;
  top: -120px !important;
  right: -120px !important;
  width: 420px !important;
  height: 420px !important;
  background: radial-gradient(circle, rgba(59, 147, 240, .18) 0%, transparent 70%) !important;
  pointer-events: none !important;
  border-radius: 50% !important;
}

.co-wm-page .eyebrow {
  color: var(--blue-500) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: .5px !important;
  margin-bottom: 14px !important;
}

.co-wm-page .hero h1 {
  color: var(--white) !important;
  font-size: 46px !important;
  font-weight: 800 !important;
  letter-spacing: .2px !important;
  margin-bottom: 18px !important;
}

.co-wm-page .hero p {
  color: var(--text-body-light) !important;
  font-size: 16px !important;
  max-width: 560px !important;
}

/* ---------- SERVICE SECTION ---------- */
.co-wm-page .service-section {
  padding: 70px 0 40px !important;
  position: relative !important;
  z-index: 2 !important;
}

.co-wm-page .service-grid {
  display: grid !important;
  grid-template-columns: 1.28fr 1fr !important;
  gap: 68px !important;
  align-items: start !important;
}

.co-wm-page .platforms-line {
  color: var(--blue-600) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  margin-bottom: 14px !important;
}

.co-wm-page .service-grid h2 {
  color: var(--navy-800) !important;
  font-size: 32px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  margin-bottom: 20px !important;
}

.co-wm-page .service-grid>.left-col>p {
  font-size: 15px !important;
  color: var(--text-body) !important;
  max-width: 480px !important;
  margin-bottom: 14px !important;
}

.co-wm-page .features-row {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  column-gap: 20px !important;
  row-gap: 22px !important;
  padding-top: 4px !important;
}

.co-wm-page .feature {
  text-align: left !important;
  padding: 14px 10px 12px !important;
  border-radius: 12px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  transition: background .25s ease, border-color .25s ease, box-shadow .25s ease, transform .25s ease !important;
}

.co-wm-page .feature:hover {
  background: var(--grey-bg) !important;
  border-color: #e4eaf1 !important;
  box-shadow: 0 8px 24px -8px rgba(43, 127, 224, .18) !important;
  transform: translateY(-4px) !important;
}

.co-wm-page .feature-icon {
  width: 38px !important;
  height: 38px !important;
  border-radius: 50% !important;
  background: linear-gradient(160deg, var(--blue-500), var(--blue-600)) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 10px !important;
  transition: transform .3s cubic-bezier(.34, 1.56, .64, 1), box-shadow .3s ease !important;
}

.co-wm-page .feature:hover .feature-icon {
  transform: scale(1.12) rotate(-4deg) !important;
  box-shadow: 0 10px 20px rgba(43, 127, 224, .3) !important;
}

.co-wm-page .feature-icon svg {
  width: 17px !important;
  height: 17px !important;
  stroke: #fff !important;
}

.co-wm-page .feature h4 {
  color: var(--navy-800) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  margin-bottom: 6px !important;
  transition: color .2s ease !important;
}

.co-wm-page .feature:hover h4 {
  color: var(--blue-600) !important;
}

.co-wm-page .feature p {
  font-size: 11.5px !important;
  color: var(--text-body) !important;
  line-height: 1.5 !important;
}

/* CTA banner */
.co-wm-page .cta-banner {
  margin-top: 40px !important;
  background: var(--blue-050) !important;
  border: 1px solid #dbe9fb !important;
  border-radius: var(--radius-lg) !important;
  padding: 22px 30px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  max-width: 100% !important;
}

.co-wm-page .cta-left {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  flex: 1 !important;
  min-width: 0 !important;
}

.co-wm-page .cta-icon {
  width: 46px !important;
  height: 46px !important;
  border-radius: 50% !important;
  background: var(--blue-600) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

.co-wm-page .cta-icon svg {
  width: 20px !important;
  height: 20px !important;
  stroke: #fff !important;
}

.co-wm-page .cta-left h4 {
  color: var(--navy-800) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  margin-bottom: 4px !important;
}

.co-wm-page .cta-left p {
  color: var(--text-body) !important;
  font-size: 13px !important;
}

.co-wm-page .btn-consult {
  display: inline-block !important;
  text-align: center !important;
  text-decoration: none !important;
  position: relative !important;
  overflow: hidden !important;
  background: var(--blue-600) !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .3px !important;
  padding: 14px 26px !important;
  border-radius: 8px !important;
  border: none !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  transition: background .25s ease, transform .2s ease, box-shadow .25s ease !important;
}

.co-wm-page .btn-consult::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: -75% !important;
  width: 50% !important;
  height: 100% !important;
  background: linear-gradient(120deg, transparent, rgba(255, 255, 255, .28), transparent) !important;
  transform: skewX(-20deg) !important;
  transition: left .5s ease !important;
}

.co-wm-page .btn-consult:hover::before {
  left: 150% !important;
}

.co-wm-page .btn-consult:hover {
  background: #1f6fcf !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 18px rgba(43, 127, 224, .35) !important;
}

.co-wm-page .btn-consult:active {
  transform: translateY(0) !important;
  box-shadow: 0 2px 8px -2px rgba(43, 127, 224, .4) !important;
}

/* ---------- BROCHURE IMAGE PLACEHOLDER ---------- */
.co-wm-page .brochure-col {
  display: flex !important;
  justify-content: center !important;
  align-items: flex-start !important;
  margin-top: -190px !important;
  position: relative !important;
  z-index: 3 !important;
}

.co-wm-page .brochure-frame {
  width: 100% !important;
  max-width: 520px !important;
  aspect-ratio: 454/694 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 30px 60px -20px rgba(8, 18, 33, .35) !important;
  position: relative !important;
  background: #f4f7fb !important;
  border: 1px solid #e4eaf1 !important;
  transition: transform .35s ease, box-shadow .35s ease !important;
}

/* This img fills the frame exactly - just drop a src on it */
.co-wm-page .brochure-frame img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  display: block !important;
}

/* Placeholder content shown only when no image is present */
.co-wm-page .brochure-placeholder {
  position: absolute !important;
  inset: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  color: #9aa9bd !important;
  text-align: center !important;
  padding: 30px !important;
}

.co-wm-page .brochure-placeholder svg {
  width: 46px !important;
  height: 46px !important;
  stroke: #b7c3d6 !important;
}

.co-wm-page .brochure-placeholder span {
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .3px !important;
}

.co-wm-page .brochure-placeholder small {
  font-size: 11.5px !important;
  color: #b3c0d1 !important;
  max-width: 260px !important;
}

/* ---------- TRUST BAR ---------- */
.co-wm-page .trust-bar {
  background: var(--grey-bg) !important;
  padding: 44px 0 !important;
  margin-top: 60px !important;
}

.co-wm-page .trust-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 36px !important;
}

.co-wm-page .trust-item {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}

.co-wm-page .trust-icon {
  width: 52px !important;
  height: 52px !important;
  border-radius: 50% !important;
  background: #dbe7f8 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  transition: background .25s ease, transform .3s ease !important;
}

.co-wm-page .trust-item:hover .trust-icon {
  background: var(--blue-500) !important;
  transform: scale(1.06) !important;
}

.co-wm-page .trust-item:hover .trust-icon svg {
  stroke: #fff !important;
}

.co-wm-page .trust-icon svg {
  width: 22px !important;
  height: 22px !important;
  stroke: var(--blue-600) !important;
  transition: stroke .25s ease !important;
}

.co-wm-page .trust-item h5 {
  color: var(--navy-800) !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  margin-bottom: 6px !important;
}

.co-wm-page .trust-item p {
  font-size: 12.5px !important;
  color: var(--text-body) !important;
}

/* =====================================================
     RESPONSIVE
     Breakpoints:
       - Laptop / small desktop:  <=1180px
       - Tablet:                  <=960px
       - Large phone:              <=600px
       - Small phone:               <=420px
  ===================================================== */

/* ---- Laptop / small desktop ---- */
@media (max-width:1180px) {
  .co-wm-page .wrap {
    padding: 0 32px !important;
  }

  .co-wm-page .hero h1 {
    font-size: 40px !important;
  }

  .co-wm-page .service-grid {
    gap: 44px !important;
  }

  .co-wm-page .cta-banner {
    width: 100% !important;
  }
}

/* ---- Tablet ---- */
@media (max-width:960px) {
  .co-wm-page .wrap {
    padding: 0 28px !important;
  }

  .co-wm-page .hero {
    padding: 52px 0 90px !important;
  }

  .co-wm-page .hero h1 {
    font-size: 34px !important;
  }

  .co-wm-page .hero p {
    font-size: 15px !important;
  }

  .co-wm-page .service-section {
    padding: 0 0 30px !important;
  }

  .co-wm-page .service-grid {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }

  .co-wm-page .brochure-col {
    order: -1 !important;
    margin-top: 28px !important;
    margin-bottom: 32px !important;
  }

  .co-wm-page .brochure-frame {
    max-width: 440px !important;
  }

  .co-wm-page .service-grid h2 {
    font-size: 27px !important;
  }

  .co-wm-page .features-row {
    grid-template-columns: repeat(3, 1fr) !important;
    column-gap: 18px !important;
    row-gap: 26px !important;
  }

  .co-wm-page .cta-banner {
    width: 100% !important;
    margin-top: 36px !important;
  }

  .co-wm-page .trust-grid {
    grid-template-columns: 1fr !important;
    gap: 26px !important;
  }
}

/* ---- Large phone ---- */
@media (max-width:600px) {
  .co-wm-page .wrap {
    padding: 0 20px !important;
  }

  .co-wm-page .hero {
    padding: 44px 0 76px !important;
  }

  .co-wm-page .hero h1 {
    font-size: 28px !important;
  }

  .co-wm-page .hero p {
    font-size: 14px !important;
  }

  .co-wm-page .service-section {
    padding: 0 0 24px !important;
  }

  .co-wm-page .brochure-frame {
    max-width: 360px !important;
  }

  .co-wm-page .service-grid h2 {
    font-size: 23px !important;
  }

  .co-wm-page .service-grid>.left-col>p {
    font-size: 14px !important;
  }

  .co-wm-page .features-row {
    grid-template-columns: repeat(2, 1fr) !important;
    column-gap: 16px !important;
    row-gap: 24px !important;
  }

  .co-wm-page .cta-banner {
    flex-direction: column !important;
    align-items: flex-start !important;
    width: 100% !important;
    padding: 20px !important;
  }

  .co-wm-page .cta-left {
    width: 100% !important;
  }

  .co-wm-page .btn-consult {
    width: 100% !important;
  }

  .co-wm-page .trust-bar {
    padding: 36px 0 !important;
  }
}

/* ---- Small phone ---- */
@media (max-width:420px) {
  .co-wm-page .hero h1 {
    font-size: 24px !important;
  }

  .co-wm-page .brochure-frame {
    max-width: 300px !important;
  }

  .co-wm-page .features-row {
    grid-template-columns: 1fr !important;
  }

  .co-wm-page .cta-left {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}