/* ==========================================================================
   VQC Global Design System — shared across all 4 templates
   Scoped under .vqc__page — all rules use !important to win over Elementor
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Manrope:wght@300;400;500;600;700;800&display=swap');

/* --------------------------------------------------------------------------
   TOKENS
-------------------------------------------------------------------------- */
.vqc__page {
  --vqc-bg:          #dff5f5;
  --vqc-navy:        #0d1b3e;
  --vqc-cyan:        #15a6e0;
  --vqc-cyan-dark:   #1090c8;
  --vqc-cyan-pale:   rgba(21,166,224,0.10);
  --vqc-cyan-mid:    rgba(21,166,224,0.25);
  --vqc-text:        #2c3e5e;
  --vqc-muted:       rgba(13,27,62,0.48);
  --vqc-border:      rgba(21,166,224,0.22);
  --vqc-card-bg:     #ffffff;
  --vqc-white:       #ffffff;
  --vqc-font-display: 'Bebas Neue', sans-serif;
  --vqc-font-body:    'Manrope', sans-serif;
  --vqc-max-w:       1200px;
  --vqc-gutter:      clamp(1.25rem, 4vw, 3rem);
  --vqc-section-y:   clamp(60px, 9vw, 96px);
  --vqc-radius:      16px;
  --vqc-radius-sm:   10px;
  --vqc-ease:        cubic-bezier(0.16, 1, 0.3, 1);
}

/* --------------------------------------------------------------------------
   BASE RESET
-------------------------------------------------------------------------- */
.vqc__page *,
.vqc__page *::before,
.vqc__page *::after {
  box-sizing: border-box !important;
}

.vqc__page {
  font-family: var(--vqc-font-body) !important;
  color: var(--vqc-text) !important;
  line-height: 1.65 !important;
  background: var(--vqc-white) !important;
  overflow-x: hidden !important;
  width: 100% !important;
  display: block !important;
}

.vqc__page a { text-decoration: none !important; color: inherit !important; }
.vqc__page img { display: block !important; max-width: 100% !important; height: auto !important; }
.vqc__page ul, .vqc__page ol { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.vqc__page h1, .vqc__page h2, .vqc__page h3,
.vqc__page h4, .vqc__page h5, .vqc__page h6 {
  margin: 0 !important; padding: 0 !important;
  font-weight: inherit !important; line-height: inherit !important;
  color: inherit !important; border: none !important; background: none !important;
}
.vqc__page p {
  margin: 0 !important;
  padding: 0 !important;
  font-family: Manrope, sans-serif !important;
  font-style: normal !important;
  font-weight: 400 !important;
  color: rgb(2, 1, 1) !important;
  font-size: 18px !important;
  line-height: 29px !important;
}

/* --------------------------------------------------------------------------
   SHELL
-------------------------------------------------------------------------- */
.vqc__page .vqc__shell {
  width: 100% !important;
  max-width: var(--vqc-max-w) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--vqc-gutter) !important;
  padding-right: var(--vqc-gutter) !important;
}

/* --------------------------------------------------------------------------
   SECTIONS
-------------------------------------------------------------------------- */
.vqc__page .vqc__section {
  position: relative !important;
  overflow: hidden !important;
  background: var(--vqc-bg) !important;
  padding-top: var(--vqc-section-y) !important;
  padding-bottom: var(--vqc-section-y) !important;
  margin: 0 !important;
  width: 100% !important;
  display: block !important;
}

.vqc__page .vqc__section--white  { background: var(--vqc-white) !important; }
.vqc__page .vqc__section--dark   { background: var(--vqc-navy) !important; }
.vqc__page .vqc__section--light  { background: #f0fafa !important; }

/* Aurora animated background — white & light sections */
@keyframes vqcAurora {
  0%,100% { transform: translate(0,0) scale(1); }
  30%  { transform: translate(28px,-18px) scale(1.06); }
  60%  { transform: translate(-18px,22px) scale(0.96); }
}
@keyframes vqcAurora2 {
  0%,100% { transform: translate(0,0) scale(1); }
  40%  { transform: translate(-22px,16px) scale(1.08); }
  70%  { transform: translate(20px,-20px) scale(0.94); }
}
.vqc__page .vqc__section--white::before,
.vqc__page .vqc__section--light::before,
.vqc__page .vqc__section--bordered::before {
  content:'' !important; position:absolute !important; inset:0 !important;
  z-index:0 !important; pointer-events:none !important;
  background:
    radial-gradient(ellipse 65% 55% at 8% 18%, rgba(21,166,224,0.09) 0%, transparent 60%),
    radial-gradient(ellipse 55% 65% at 92% 82%, rgba(21,166,224,0.07) 0%, transparent 60%),
    radial-gradient(ellipse 45% 45% at 50% 55%, rgba(21,166,224,0.04) 0%, transparent 70%) !important;
  animation: vqcAurora 14s ease-in-out infinite !important;
}
.vqc__page .vqc__section--white::after,
.vqc__page .vqc__section--light::after,
.vqc__page .vqc__section--bordered::after {
  content:'' !important; position:absolute !important; inset:0 !important;
  z-index:0 !important; pointer-events:none !important;
  background-image:
    linear-gradient(rgba(21,166,224,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(21,166,224,0.035) 1px, transparent 1px) !important;
  background-size:55px 55px !important;
  mask-image: radial-gradient(ellipse 85% 85% at 50% 50%, black 20%, transparent 100%) !important;
  animation: vqcAurora2 18s ease-in-out infinite !important;
}

/* Aurora clip for bordered sections — pseudo-elements must follow the card radius */
.vqc__page .vqc__section--bordered::before,
.vqc__page .vqc__section--bordered::after {
  border-radius: var(--vqc-radius) !important;
  overflow: hidden !important;
}

/* Bordered section — used for odd numbered content sections */
.vqc__page .vqc__section--bordered {
  width: auto !important;
  margin: 0 clamp(12px, 2.5vw, 40px) !important;
  border: 1.5px solid rgba(21,166,224,0.28) !important;
  border-radius: var(--vqc-radius) !important;
  background: var(--vqc-white) !important;
  overflow: visible !important;
}

.vqc__page .vqc__section--bordered + .vqc__section--bordered {
  margin-top: 24px !important;
}

.vqc__page .vqc__inner {
  position: relative !important;
  z-index: 2 !important;
}

/* --------------------------------------------------------------------------
   BACKGROUND DECORATIONS
-------------------------------------------------------------------------- */
.vqc__page .vqc__mesh {
  position: absolute !important; inset: 0 !important;
  z-index: 0 !important; pointer-events: none !important;
  background:
    radial-gradient(ellipse 70% 60% at 10% 20%, rgba(21,166,224,0.12) 0%, transparent 60%),
    radial-gradient(ellipse 60% 50% at 90% 80%, rgba(21,166,224,0.09) 0%, transparent 60%) !important;
}

.vqc__page .vqc__section--dark .vqc__mesh {
  background:
    radial-gradient(ellipse 60% 50% at 20% 30%, rgba(21,166,224,0.14) 0%, transparent 60%),
    radial-gradient(ellipse 40% 50% at 80% 70%, rgba(21,166,224,0.08) 0%, transparent 60%) !important;
}

.vqc__page .vqc__grid-bg {
  position: absolute !important; inset: 0 !important;
  z-index: 0 !important; pointer-events: none !important;
  background-image:
    linear-gradient(rgba(21,166,224,0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(21,166,224,0.06) 1px, transparent 1px) !important;
  background-size: 55px 55px !important;
  mask-image: radial-gradient(ellipse 90% 90% at 50% 50%, black 30%, transparent 100%) !important;
}

.vqc__page .vqc__blob {
  position: absolute !important; border-radius: 50% !important;
  background: rgba(21,166,224,0.07) !important;
  filter: blur(55px) !important; pointer-events: none !important;
  margin: 0 !important; padding: 0 !important;
}
.vqc__page .vqc__blob--1 { width:360px !important; height:360px !important; top:-100px !important; right:-80px !important; }
.vqc__page .vqc__blob--2 { width:260px !important; height:260px !important; bottom:-80px !important; left:-60px !important; opacity:0.6 !important; }

/* --------------------------------------------------------------------------
   SECTION HEADING BLOCK — matches the provided design pattern
-------------------------------------------------------------------------- */
.vqc__page .vqc__heading-block {
  text-align: center !important;
  padding: 0 !important;
  margin-bottom: clamp(40px, 6vw, 64px) !important;
}

.vqc__page .vqc__heading-block .vqc__separator-wrap {
  display: block !important;
  margin-bottom: 6px !important;
}

.vqc__page .vqc__heading-block .vqc__separator-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 14px !important;
  font-family: var(--vqc-font-display) !important;
  font-size: clamp(16px, 2.5vw, 28px) !important;
  letter-spacing: 4px !important;
  color: var(--vqc-navy) !important;
  white-space: nowrap !important;
  font-weight: 400 !important;
}

.vqc__page .vqc__heading-block .vqc__separator-label::before,
.vqc__page .vqc__heading-block .vqc__separator-label::after {
  content: '' !important;
  display: block !important;
  height: 2px !important;
  width: 50px !important;
  border-radius: 2px !important;
}
.vqc__page .vqc__heading-block .vqc__separator-label::before {
  background: linear-gradient(90deg, transparent, var(--vqc-cyan)) !important;
}
.vqc__page .vqc__heading-block .vqc__separator-label::after {
  background: linear-gradient(90deg, var(--vqc-cyan), transparent) !important;
}

.vqc__page .vqc__section--dark .vqc__heading-block .vqc__separator-label {
  color: rgba(255,255,255,0.7) !important;
}

.vqc__page .vqc__heading-block .vqc__flow {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  margin: 0 !important;
  padding: 0 !important;
}

.vqc__page .vqc__heading-block .vqc__flow-word {
  font-family: var(--vqc-font-display) !important;
  font-size: clamp(32px, 5.5vw, 68px) !important;
  letter-spacing: 3px !important;
  color: var(--vqc-navy) !important;
  line-height: 1 !important;
  font-weight: 400 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.vqc__page .vqc__heading-block .vqc__flow-word.hl {
  color: var(--vqc-cyan) !important;
}

.vqc__page .vqc__section--dark .vqc__heading-block .vqc__flow-word {
  color: var(--vqc-white) !important;
}
.vqc__page .vqc__section--dark .vqc__heading-block .vqc__flow-word.hl {
  color: var(--vqc-cyan) !important;
}

/* Left-aligned heading block variant */
.vqc__page .vqc__heading-block--left {
  text-align: left !important;
}
.vqc__page .vqc__heading-block--left .vqc__flow {
  justify-content: flex-start !important;
}
.vqc__page .vqc__heading-block--left .vqc__separator-label {
  padding-left: 0 !important;
}
.vqc__page .vqc__heading-block--left .vqc__separator-label::before {
  display: none !important;
}

/* Subheading below flow */
.vqc__page .vqc__heading-sub {
  font-family: Manrope, sans-serif !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  color: rgb(2, 1, 1) !important;
  line-height: 29px !important;
  max-width: 640px !important;
  margin: 16px auto 0 !important;
  padding: 0 !important;
  text-align: center !important;
}

.vqc__page .vqc__heading-block--left .vqc__heading-sub {
  margin-left: 0 !important;
  text-align: left !important;
}

.vqc__page .vqc__section--dark .vqc__heading-sub {
  color: rgba(255,255,255,0.6) !important;
}

/* --------------------------------------------------------------------------
   EYEBROW (small page-level labels, not section headings)
-------------------------------------------------------------------------- */
.vqc__page .vqc__eyebrow {
  display: inline-block !important;
  font-family: var(--vqc-font-body) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  color: var(--vqc-cyan) !important;
  margin-bottom: 14px !important;
  line-height: 1.4 !important;
}

/* --------------------------------------------------------------------------
   BUTTONS
-------------------------------------------------------------------------- */
.vqc__page .vqc__btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  font-family: var(--vqc-font-body) !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  letter-spacing: 0.5px !important;
  text-decoration: none !important;
  cursor: pointer !important;
  padding: 12px 24px !important;
  border-radius: 50px !important;
  transition: all 0.3s var(--vqc-ease) !important;
  white-space: nowrap !important;
  line-height: 1 !important;
  background-image: none !important;
  text-transform: none !important;
  margin: 0 !important;
}

.vqc__page .vqc__btn--primary {
  background-color: var(--vqc-cyan) !important;
  color: #fff !important;
  border: 2px solid var(--vqc-cyan) !important;
  box-shadow: 0 6px 20px rgba(21,166,224,0.35) !important;
}
.vqc__page .vqc__btn--primary:hover {
  background-color: var(--vqc-cyan-dark) !important;
  border-color: var(--vqc-cyan-dark) !important;
  transform: translateY(-2px) !important;
  color: #fff !important;
}

.vqc__page .vqc__btn--outline {
  background-color: transparent !important;
  color: var(--vqc-cyan) !important;
  border: 2px solid var(--vqc-cyan) !important;
}
.vqc__page .vqc__btn--outline:hover {
  background-color: var(--vqc-cyan) !important;
  color: #fff !important;
  transform: translateY(-2px) !important;
}

.vqc__page .vqc__btn--outline-white {
  background-color: transparent !important;
  color: #fff !important;
  border: 2px solid rgba(255,255,255,0.5) !important;
}
.vqc__page .vqc__btn--outline-white:hover {
  background-color: rgba(255,255,255,0.12) !important;
  border-color: #fff !important;
  color: #fff !important;
}

.vqc__page .vqc__btn--navy {
  background-color: var(--vqc-navy) !important;
  color: #fff !important;
  border: 2px solid var(--vqc-navy) !important;
}
.vqc__page .vqc__btn--navy:hover {
  background-color: #0a1428 !important;
  border-color: #0a1428 !important;
  color: #fff !important;
}

.vqc__page .vqc__btn--lg {
  font-size: 15px !important;
  padding: 14px 28px !important;
}

.vqc__page .vqc__btn .vqc__btn-arr {
  transition: transform 0.3s !important;
  display: inline-block !important;
  margin: 0 !important;
}
.vqc__page .vqc__btn:hover .vqc__btn-arr { transform: translateX(3px) !important; }

/* Size all inline SVGs inside buttons consistently */
.vqc__page .vqc__btn svg {
  width: 20px !important;
  height: 20px !important;
  display: inline-block !important;
  vertical-align: middle !important;
  flex-shrink: 0 !important;
}
.vqc__page .vqc__btn-arr svg {
  width: 20px !important;
  height: 20px !important;
  display: block !important;
}

.vqc__page .vqc__btn-group {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  align-items: center !important;
  margin-top: 28px !important;
}

/* --------------------------------------------------------------------------
   CHECKLIST
-------------------------------------------------------------------------- */
.vqc__page .vqc__checklist {
  display: flex !important; flex-direction: column !important;
  gap: 10px !important; list-style: none !important;
  margin: 0 !important; padding: 0 !important;
}

.vqc__page .vqc__checklist li {
  display: flex !important; align-items: flex-start !important;
  gap: 10px !important;
  font-family: var(--vqc-font-body) !important;
  font-size: 13.5px !important; font-weight: 600 !important;
  color: var(--vqc-text) !important; line-height: 1.55 !important;
  margin: 0 !important; padding: 0 !important; list-style: none !important;
}

.vqc__page .vqc__checklist li::before,
.vqc__page .vqc__checklist li::after { display: none !important; content: none !important; }

.vqc__page .vqc__chk {
  flex-shrink: 0 !important;
  width: 20px !important; height: 20px !important; min-width: 20px !important;
  border-radius: 50% !important;
  background: var(--vqc-cyan-pale) !important;
  border: 1.5px solid var(--vqc-cyan-mid) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  margin-top: 1px !important; padding: 0 !important;
  transition: background 0.25s, transform 0.25s !important;
}
.vqc__page .vqc__checklist li:hover .vqc__chk {
  background: var(--vqc-cyan) !important; transform: scale(1.1) !important;
}
.vqc__page .vqc__chk svg {
  width: 9px !important; height: 9px !important;
  stroke: var(--vqc-cyan) !important; stroke-width: 3 !important;
  fill: none !important; display: block !important;
  transition: stroke 0.25s !important;
}
.vqc__page .vqc__checklist li:hover .vqc__chk svg { stroke: #fff !important; }

/* Dark section checklist */
.vqc__page .vqc__section--dark .vqc__checklist li { color: rgba(255,255,255,0.85) !important; }

/* --------------------------------------------------------------------------
   FAQ ACCORDION
-------------------------------------------------------------------------- */
.vqc__page .vqc__faq-list {
  display: flex !important; flex-direction: column !important;
  gap: 12px !important; margin: 0 !important; padding: 0 !important;
}

.vqc__page .vqc__faq-item {
  background: var(--vqc-card-bg) !important;
  border: 2px solid var(--vqc-border) !important;
  border-radius: var(--vqc-radius-sm) !important;
  overflow: hidden !important;
  transition: border-color 0.3s !important;
  margin: 0 !important; padding: 0 !important;
}

.vqc__page .vqc__faq-item.is-open { border-color: var(--vqc-cyan) !important; }

.vqc__page .vqc__faq-trigger {
  width: 100% !important;
  display: flex !important; align-items: center !important;
  justify-content: space-between !important; gap: 16px !important;
  padding: 20px 22px !important;
  background: none !important; background-color: transparent !important;
  border: none !important; border-radius: 0 !important; cursor: pointer !important;
  font-family: var(--vqc-font-body) !important;
  font-size: 14.5px !important; font-weight: 700 !important;
  color: var(--vqc-navy) !important; text-align: left !important;
  transition: color 0.25s !important; box-shadow: none !important;
  outline: none !important; line-height: 1.4 !important;
  text-transform: none !important; letter-spacing: normal !important;
  white-space: normal !important; word-wrap: break-word !important; word-break: break-word !important;
}
.vqc__page .vqc__faq-trigger:hover { color: var(--vqc-cyan) !important; }
.vqc__page .vqc__faq-item.is-open .vqc__faq-trigger { color: var(--vqc-cyan) !important; }

.vqc__page .vqc__faq-icon {
  width: 28px !important; height: 28px !important; min-width: 28px !important;
  flex-shrink: 0 !important; border-radius: 50% !important;
  background: var(--vqc-cyan-pale) !important; border: 1.5px solid var(--vqc-cyan-mid) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  transition: transform 0.35s var(--vqc-ease), background 0.25s !important;
  padding: 0 !important; margin: 0 !important;
}
.vqc__page .vqc__faq-item.is-open .vqc__faq-icon {
  transform: rotate(45deg) !important; background: var(--vqc-cyan) !important;
}
.vqc__page .vqc__faq-icon svg {
  width: 12px !important; height: 12px !important;
  stroke: var(--vqc-cyan) !important; stroke-width: 2.5 !important;
  fill: none !important; display: block !important; transition: stroke 0.25s !important;
}
.vqc__page .vqc__faq-item.is-open .vqc__faq-icon svg { stroke: #fff !important; }

.vqc__page .vqc__faq-body {
  max-height: 0 !important; overflow: hidden !important;
  transition: max-height 0.4s ease !important;
}
.vqc__page .vqc__faq-item.is-open .vqc__faq-body { max-height: 400px !important; }

.vqc__page .vqc__faq-answer {
  padding: 16px 22px 20px !important;
  font-family: Manrope, sans-serif !important;
  font-size: 18px !important; font-weight: 400 !important;
  color: rgb(2, 1, 1) !important; line-height: 29px !important;
  border-top: 1px solid var(--vqc-border) !important;
  margin: 0 !important;
}

/* FAQ grid */
.vqc__page .vqc__faq-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
  margin-bottom: clamp(48px, 7vw, 80px) !important;
}

/* --------------------------------------------------------------------------
   ICON BOX (small icon + label combos)
-------------------------------------------------------------------------- */
.vqc__page .vqc__icon-box {
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
  margin: 0 !important; padding: 0 !important;
}

.vqc__page .vqc__icon-wrap {
  width: 48px !important; height: 48px !important; min-width: 48px !important;
  border-radius: 12px !important;
  background: var(--vqc-cyan-pale) !important;
  border: 1.5px solid var(--vqc-cyan-mid) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  flex-shrink: 0 !important; margin: 0 !important; padding: 0 !important;
  transition: background 0.3s, transform 0.3s !important;
}
.vqc__page .vqc__icon-box:hover .vqc__icon-wrap {
  background: var(--vqc-cyan) !important; transform: scale(1.08) !important;
}
.vqc__page .vqc__icon-wrap svg {
  width: 22px !important; height: 22px !important;
  stroke: var(--vqc-cyan) !important; fill: none !important;
  stroke-width: 1.8 !important; display: block !important;
  transition: stroke 0.3s !important;
}
.vqc__page .vqc__icon-box:hover .vqc__icon-wrap svg { stroke: #fff !important; }

.vqc__page .vqc__icon-box-title {
  font-family: var(--vqc-font-body) !important;
  font-size: 18px !important; font-weight: 700 !important;
  color: var(--vqc-navy) !important; margin-bottom: 6px !important;
  display: block !important; line-height: 1.3 !important;
}

.vqc__page .vqc__icon-box-text {
  font-family: Manrope, sans-serif !important;
  font-size: 18px !important; font-weight: 400 !important;
  color: rgb(2, 1, 1) !important; line-height: 29px !important;
  margin: 0 !important;
}

.vqc__page .vqc__section--dark .vqc__icon-box-title { color: var(--vqc-white) !important; }
.vqc__page .vqc__section--dark .vqc__icon-box-text  { color: rgba(255,255,255,0.6) !important; }

/* --------------------------------------------------------------------------
   CARD BASE
-------------------------------------------------------------------------- */
.vqc__page .vqc__card {
  background: var(--vqc-card-bg) !important;
  border: 2px solid var(--vqc-border) !important;
  border-radius: var(--vqc-radius) !important;
  overflow: hidden !important;
  transition: transform 0.35s var(--vqc-ease), box-shadow 0.35s var(--vqc-ease), border-color 0.3s !important;
  margin: 0 !important;
}

.vqc__page .vqc__card:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 20px 48px rgba(21,166,224,0.15) !important;
  border-color: var(--vqc-cyan) !important;
}

.vqc__page .vqc__card::before {
  content: '' !important; display: block !important; height: 3px !important;
  background: linear-gradient(90deg, var(--vqc-cyan), var(--vqc-cyan-dark)) !important;
  flex-shrink: 0 !important;
}

.vqc__page .vqc__card-body {
  padding: 28px !important;
}

.vqc__page .vqc__card-title {
  font-family: var(--vqc-font-display) !important;
  font-size: 28px !important; letter-spacing: 2px !important;
  color: var(--vqc-navy) !important; line-height: 1 !important;
  font-weight: 400 !important; margin-bottom: 8px !important;
}

.vqc__page .vqc__card-sub {
  font-family: var(--vqc-font-body) !important;
  font-size: 12px !important; font-weight: 600 !important;
  color: var(--vqc-cyan) !important; text-transform: uppercase !important;
  letter-spacing: 2px !important; margin-bottom: 16px !important;
  display: block !important;
}

.vqc__page .vqc__card-text {
  font-family: Manrope, sans-serif !important;
  font-size: 18px !important; font-weight: 400 !important;
  color: rgb(2, 1, 1) !important; line-height: 29px !important;
  margin: 0 !important;
}

/* --------------------------------------------------------------------------
   STAT ROW (counters bar)
-------------------------------------------------------------------------- */
.vqc__page .vqc__stat-row {
  display: flex !important;
  border: 1.5px solid var(--vqc-border) !important;
  border-radius: var(--vqc-radius-sm) !important;
  overflow: hidden !important;
  margin: 0 !important; padding: 0 !important;
}

.vqc__page .vqc__stat-cell {
  flex: 1 !important; padding: 20px 16px !important;
  text-align: center !important;
  border-right: 1px solid var(--vqc-border) !important;
}
.vqc__page .vqc__stat-cell:last-child { border-right: none !important; }

.vqc__page .vqc__stat-num {
  font-family: var(--vqc-font-display) !important;
  font-size: 36px !important; letter-spacing: 1px !important;
  color: var(--vqc-cyan) !important; line-height: 1 !important;
  display: block !important; font-weight: 400 !important;
  margin: 0 !important; padding: 0 !important;
}

.vqc__page .vqc__stat-lbl {
  font-family: var(--vqc-font-body) !important;
  font-size: 10px !important; font-weight: 700 !important;
  text-transform: uppercase !important; letter-spacing: 1px !important;
  color: var(--vqc-muted) !important;
  margin-top: 6px !important; display: block !important;
  line-height: 1.4 !important;
}

.vqc__page .vqc__section--dark .vqc__stat-lbl { color: rgba(255,255,255,0.5) !important; }

/* --------------------------------------------------------------------------
   TRUST BAR
-------------------------------------------------------------------------- */
.vqc__page .vqc__trust-bar {
  display: flex !important; align-items: center !important;
  flex-wrap: wrap !important; gap: 10px 24px !important;
  padding-top: 24px !important;
  border-top: 1px solid rgba(21,166,224,0.22) !important;
  margin-top: 32px !important;
}

.vqc__page .vqc__trust-item {
  display: flex !important; align-items: center !important; gap: 8px !important;
  font-family: var(--vqc-font-body) !important;
  font-size: 12px !important; font-weight: 700 !important;
  color: rgba(255,255,255,0.65) !important;
  margin: 0 !important; padding: 0 !important;
}

.vqc__page .vqc__trust-item svg {
  width: 14px !important; height: 14px !important;
  stroke: var(--vqc-cyan) !important; fill: none !important;
  flex-shrink: 0 !important;
}

/* --------------------------------------------------------------------------
   IMAGE GRID / MOSAIC
-------------------------------------------------------------------------- */
.vqc__page .vqc__img-mosaic {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  grid-template-rows: auto auto !important;
  gap: 12px !important;
  border-radius: var(--vqc-radius) !important;
  overflow: hidden !important;
}

.vqc__page .vqc__img-mosaic img {
  width: 100% !important; height: 240px !important;
  object-fit: cover !important; display: block !important;
  transition: transform 0.5s var(--vqc-ease) !important;
}

.vqc__page .vqc__img-mosaic img:hover { transform: scale(1.04) !important; }

.vqc__page .vqc__img-mosaic .vqc__img-tall {
  grid-row: span 2 !important;
  height: 100% !important; min-height: 480px !important;
}

/* Full-width image */
.vqc__page .vqc__img-full {
  width: 100% !important;
  aspect-ratio: 16/5 !important;
  object-fit: cover !important;
  display: block !important;
  border-radius: var(--vqc-radius) !important;
}

/* Section image (half width) */
.vqc__page .vqc__img-half {
  width: 100% !important; height: 100% !important;
  min-height: 360px !important;
  object-fit: cover !important; display: block !important;
  border-radius: var(--vqc-radius) !important;
}

/* --------------------------------------------------------------------------
   REVIEW / TESTIMONIAL CARD
-------------------------------------------------------------------------- */
.vqc__page .vqc__reviews-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 20px !important;
}

.vqc__page .vqc__review-card {
  background: var(--vqc-card-bg) !important;
  border: 1.5px solid var(--vqc-border) !important;
  border-radius: var(--vqc-radius) !important;
  padding: 28px !important;
  position: relative !important;
  transition: transform 0.3s var(--vqc-ease), box-shadow 0.3s !important;
  margin: 0 !important;
}

.vqc__page .vqc__review-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 16px 40px rgba(21,166,224,0.12) !important;
}

.vqc__page .vqc__review-card::before {
  content: '' !important;
  position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important;
  height: 3px !important;
  background: linear-gradient(90deg, var(--vqc-cyan), var(--vqc-cyan-dark)) !important;
  border-radius: var(--vqc-radius) var(--vqc-radius) 0 0 !important;
}

.vqc__page .vqc__review-stars {
  display: flex !important; gap: 3px !important;
  margin-bottom: 14px !important;
}

.vqc__page .vqc__review-stars svg {
  width: 16px !important; height: 16px !important;
  fill: #f59e0b !important; stroke: none !important;
}

.vqc__page .vqc__review-text {
  font-family: var(--vqc-font-body) !important;
  font-size: 13.5px !important; font-weight: 500 !important;
  color: var(--vqc-text) !important; line-height: 1.75 !important;
  font-style: italic !important; margin-bottom: 20px !important;
}

.vqc__page .vqc__review-author {
  display: flex !important; align-items: center !important; gap: 12px !important;
}

.vqc__page .vqc__review-avatar {
  width: 40px !important; height: 40px !important;
  border-radius: 50% !important; background: var(--vqc-cyan-pale) !important;
  border: 2px solid var(--vqc-cyan-mid) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-family: var(--vqc-font-display) !important;
  font-size: 18px !important; color: var(--vqc-cyan) !important;
  flex-shrink: 0 !important;
  overflow: hidden !important;
}

.vqc__page .vqc__review-avatar img {
  width: 100% !important; height: 100% !important; object-fit: cover !important;
}

.vqc__page .vqc__review-name {
  font-family: var(--vqc-font-body) !important;
  font-size: 16px !important; font-weight: 800 !important;
  color: var(--vqc-navy) !important; display: block !important;
}

.vqc__page .vqc__review-meta {
  font-size: 11px !important; font-weight: 600 !important;
  color: var(--vqc-muted) !important; display: block !important;
}

/* --------------------------------------------------------------------------
   CALLOUT / HIGHLIGHT BOX
-------------------------------------------------------------------------- */
.vqc__page .vqc__callout {
  background: var(--vqc-cyan-pale) !important;
  border: 1.5px solid var(--vqc-border) !important;
  border-radius: var(--vqc-radius) !important;
  padding: 36px !important;
  margin: 0 !important;
}

.vqc__page .vqc__callout--navy {
  background: rgba(13,27,62,0.06) !important;
  border-color: rgba(13,27,62,0.15) !important;
}

.vqc__page .vqc__callout-eyebrow {
  font-family: var(--vqc-font-body) !important;
  font-size: 10px !important; font-weight: 800 !important;
  letter-spacing: 3px !important; text-transform: uppercase !important;
  color: var(--vqc-cyan) !important;
  margin-bottom: 10px !important; display: block !important;
}

.vqc__page .vqc__callout-heading {
  font-family: var(--vqc-font-display) !important;
  font-size: clamp(26px, 3vw, 38px) !important;
  letter-spacing: 2px !important; color: var(--vqc-navy) !important;
  line-height: 1.05 !important; font-weight: 400 !important;
  margin-bottom: 12px !important;
}

.vqc__page .vqc__callout-text {
  font-family: var(--vqc-font-body) !important;
  font-size: 16px !important; font-weight: 500 !important;
  color: var(--vqc-text) !important; line-height: 1.7 !important;
  margin-bottom: 24px !important;
}

/* --------------------------------------------------------------------------
   HR DIVIDER
-------------------------------------------------------------------------- */
.vqc__page .vqc__hr {
  height: 1.5px !important;
  background: linear-gradient(90deg, var(--vqc-cyan), rgba(21,166,224,0.08)) !important;
  border: none !important; border-radius: 2px !important;
  margin: 20px 0 !important; display: block !important; padding: 0 !important;
}

/* --------------------------------------------------------------------------
   REVEAL ANIMATIONS
-------------------------------------------------------------------------- */
.vqc__page .vqc__reveal {
  opacity: 0 !important;
  transform: translateY(24px) !important;
  transition: opacity 0.65s var(--vqc-ease), transform 0.65s var(--vqc-ease) !important;
  animation: vqcRevealFallback 0s 3.5s forwards !important;
}
.vqc__page .vqc__reveal.is-visible {
  opacity: 1 !important; transform: translateY(0) !important;
  animation: none !important;
}
@keyframes vqcRevealFallback {
  to { opacity: 1; transform: translateY(0); }
}
.vqc__page .vqc__d1 { transition-delay: 0.08s !important; }
.vqc__page .vqc__d2 { transition-delay: 0.16s !important; }
.vqc__page .vqc__d3 { transition-delay: 0.24s !important; }
.vqc__page .vqc__d4 { transition-delay: 0.32s !important; }

/* --------------------------------------------------------------------------
   RESPONSIVE
-------------------------------------------------------------------------- */
@media (max-width: 1024px) {
  .vqc__page .vqc__faq-grid { grid-template-columns: 1fr !important; }
  .vqc__page .vqc__reviews-grid { grid-template-columns: 1fr 1fr !important; }
}

@media (max-width: 768px) {
  .vqc__page .vqc__reviews-grid { grid-template-columns: 1fr !important; }
  .vqc__page .vqc__section--bordered { margin: 0 8px !important; }
  .vqc__page .vqc__stat-row { flex-wrap: wrap !important; }
  .vqc__page .vqc__stat-cell { flex: 0 0 50% !important; border-right: none !important; border-bottom: 1px solid var(--vqc-border) !important; }
  .vqc__page .vqc__btn {
    white-space: normal !important;
    word-break: break-word !important;
    text-align: center !important;
    line-height: 1.3 !important;
  }
}

@media (max-width: 600px) {
  .vqc__page .vqc__btn-group { flex-direction: column !important; align-items: flex-start !important; }
  .vqc__page .vqc__trust-bar { flex-direction: column !important; align-items: flex-start !important; }
  .vqc__page .vqc__img-mosaic { grid-template-columns: 1fr !important; }
  .vqc__page .vqc__img-mosaic .vqc__img-tall { min-height: 260px !important; }
}
/* ==========================================================================
   VQC Hero — shared hero section styles used by all 4 templates
   Appended to vqc-global.css
   ========================================================================== */

/* --------------------------------------------------------------------------
   HERO BASE
-------------------------------------------------------------------------- */
.vqc__page .vqc__hero {
  background: var(--vqc-navy) !important;
  padding-top: clamp(80px, 13vw, 130px) !important;
  padding-bottom: clamp(80px, 13vw, 130px) !important;
  overflow: hidden !important; position: relative !important;
  margin: 0 !important; width: 100% !important; display: block !important;
}

.vqc__page .vqc__hero-mesh,
.vqc__page .vqc__hero-grid-bg {
  position: absolute !important; inset: 0 !important;
  z-index: 0 !important; pointer-events: none !important;
}

.vqc__page .vqc__hero-mesh {
  background:
    radial-gradient(ellipse 55% 70% at 0% 50%, rgba(21,166,224,0.16) 0%, transparent 55%),
    radial-gradient(ellipse 40% 50% at 100% 20%, rgba(21,166,224,0.10) 0%, transparent 55%) !important;
}

.vqc__page .vqc__hero-grid-bg {
  background-image:
    linear-gradient(rgba(21,166,224,0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(21,166,224,0.06) 1px, transparent 1px) !important;
  background-size: 55px 55px !important;
  mask-image: radial-gradient(ellipse 80% 80% at 50% 50%, black 20%, transparent 100%) !important;
}

.vqc__page .vqc__hero-inner { position: relative !important; z-index: 2 !important; }

.vqc__page .vqc__hero-split {
  display: grid !important;
  grid-template-columns: 1fr 1.1fr !important;
  gap: clamp(2rem, 5vw, 4rem) !important;
  align-items: center !important;
}

.vqc__page .vqc__hero-eyebrow {
  display: inline-flex !important; align-items: center !important;
  gap: 10px !important;
  font-family: var(--vqc-font-body) !important;
  font-size: 11px !important; font-weight: 800 !important;
  letter-spacing: 3px !important; text-transform: uppercase !important;
  color: var(--vqc-cyan) !important; margin-bottom: 18px !important; margin-top: 0 !important;
}
.vqc__page .vqc__hero-eyebrow::before {
  content: '' !important; display: block !important;
  width: 28px !important; height: 2px !important;
  background: var(--vqc-cyan) !important; border-radius: 2px !important;
}

.vqc__page .vqc__hero-headline {
  font-family: var(--vqc-font-display) !important;
  font-size: clamp(48px, 7vw, 96px) !important;
  line-height: 0.92 !important; letter-spacing: 2px !important;
  color: #fff !important; margin-bottom: 20px !important; font-weight: 400 !important;
}
.vqc__page .vqc__hero-headline em { font-style: normal !important; color: var(--vqc-cyan) !important; }

.vqc__page .vqc__hero-sub {
  font-family: Manrope, sans-serif !important;
  font-size: 18px !important; font-weight: 400 !important;
  line-height: 29px !important; color: rgba(255,255,255,0.65) !important;
  max-width: 520px !important; margin-bottom: 32px !important; margin-top: 0 !important;
}

/* Hero image panel */
.vqc__page .vqc__hero-img-panel {
  position: relative !important;
}

.vqc__page .vqc__hero-img-wrap {
  border-radius: var(--vqc-radius) !important; overflow: hidden !important;
  aspect-ratio: 4/5 !important;
  box-shadow: 0 24px 60px rgba(0,0,0,0.45) !important;
  border: 1.5px solid rgba(21,166,224,0.25) !important;
  position: relative !important;
}

.vqc__page .vqc__hero-img-wrap img {
  width: 100% !important; height: 100% !important;
  object-fit: cover !important; display: block !important;
}

.vqc__page .vqc__hero-img-overlay {
  position: absolute !important; inset: 0 !important;
  background: linear-gradient(to top, rgba(13,27,62,0.65) 0%, transparent 55%) !important;
}

.vqc__page .vqc__hero-badge {
  position: absolute !important; bottom: 18px !important; left: 18px !important;
  display: flex !important; gap: 8px !important; flex-wrap: wrap !important;
}

.vqc__page .vqc__badge {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  background: rgba(21,166,224,0.88) !important; backdrop-filter: blur(8px) !important;
  border-radius: 50px !important; padding: 7px 14px !important;
  font-family: var(--vqc-font-body) !important;
  font-size: 11px !important; font-weight: 700 !important;
  letter-spacing: 0.5px !important; text-transform: uppercase !important;
  color: #fff !important; white-space: nowrap !important; margin: 0 !important;
}

.vqc__page .vqc__badge-dot {
  width: 6px !important; height: 6px !important;
  border-radius: 50% !important; background: #fff !important;
  animation: vqcPulse 2s infinite !important;
}
@keyframes vqcPulse {
  0%,100%{transform:scale(1);opacity:.5;} 50%{transform:scale(1.7);opacity:1;}
}

/* CTA strip at bottom of dark sections */
.vqc__page .vqc__cta-strip {
  background: var(--vqc-navy) !important;
  overflow: hidden !important; position: relative !important;
  padding-top: clamp(60px, 9vw, 90px) !important;
  padding-bottom: clamp(60px, 9vw, 90px) !important;
  margin: 0 !important; display: block !important; width: 100% !important;
}

.vqc__page .vqc__cta-strip-mesh {
  position: absolute !important; inset: 0 !important; z-index: 0 !important;
  pointer-events: none !important;
  background:
    radial-gradient(ellipse 50% 80% at 0% 50%, rgba(21,166,224,0.14) 0%, transparent 55%),
    radial-gradient(ellipse 40% 60% at 100% 50%, rgba(21,166,224,0.10) 0%, transparent 55%) !important;
}

.vqc__page .vqc__cta-strip-inner {
  position: relative !important; z-index: 2 !important;
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  align-items: center !important; gap: 48px !important;
}

.vqc__page .vqc__cta-strip h2 {
  font-family: var(--vqc-font-display) !important;
  font-size: clamp(34px, 5vw, 60px) !important;
  letter-spacing: 2px !important; line-height: 0.95 !important;
  color: #fff !important; font-weight: 400 !important;
  margin: 0 !important; padding: 0 !important;
}
.vqc__page .vqc__cta-strip h2 em { font-style: normal !important; color: var(--vqc-cyan) !important; }

.vqc__page .vqc__cta-strip p {
  font-family: Manrope, sans-serif !important;
  font-size: 18px !important; font-weight: 400 !important;
  color: rgba(255,255,255,0.6) !important; line-height: 29px !important;
  margin-top: 12px !important; margin-bottom: 0 !important; max-width: 520px !important;
}

.vqc__page .vqc__cta-strip-actions {
  display: flex !important; flex-direction: column !important;
  gap: 12px !important; align-items: flex-end !important; flex-shrink: 0 !important;
}

@media (max-width: 1024px) {
  .vqc__page .vqc__hero-split { grid-template-columns: 1fr !important; }
  .vqc__page .vqc__hero-img-panel { display: none !important; }
  .vqc__page .vqc__cta-strip-inner { grid-template-columns: 1fr !important; }
  .vqc__page .vqc__cta-strip-actions { align-items: flex-start !important; flex-direction: row !important; flex-wrap: wrap !important; }
}