/* HubEngage-WPBakery-Blocks-Clde: base. Colors come from Appearance > Customize > HubEngage brand colors.
   Headings, body text and Total buttons are NOT styled here: they follow Total's Customizer. */
:root{--he-navy:#0E456A;--he-lime:#D5DB26;--he-comms:#1E96FF;--he-ops:#19C99A;--he-know:#FF9F1C;--he-eng:#FF4D5E;--he-violet:#6B46FF;--he-ink:#151A24}

/* ---------- utility classes for native Total / WPBakery elements (add in "Extra class name") ---------- */
.he-hl{background:linear-gradient(transparent 58%,var(--he-lime) 58%,var(--he-lime) 92%,transparent 92%);padding:0 .08em}
.he-hl--violet{color:var(--he-violet)}
.he-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;letter-spacing:.02em;color:var(--he-navy);padding:4px 14px;border-radius:100px;background:#fff;border:1px solid #dedede}
.he-eyebrow img{display:inline-block}
.he-pill{display:inline-block;padding:3px 12px;border-radius:100px;font-size:13px;font-weight:600}
.he-pill--comms{background:#E8F4FF;color:#056CC7}.he-pill--ops{background:#E3F8F1;color:#137C60}
.he-pill--know{background:#FFF5E8;color:#9F5E04}.he-pill--eng{background:#FFE8EA;color:#C42D3C}
.he-pill--intel{background:#EFEAFF;color:#5A32EE}
.he-bg-navy{background:var(--he-navy)!important;color:#fff}
.he-bg-lime{background:var(--he-lime)!important}
.he-bg-intel{background:linear-gradient(180deg,#EFEAFF,#E2D9FF)!important}

/* the approved CTA pair, for places Total's button element is not used */
.he-btns{display:flex;flex-wrap:wrap;gap:10px}
.he-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:100px;font-weight:600;font-size:16px;text-decoration:none!important;transition:filter .2s}
.he-btn:hover{filter:brightness(.95)}
.he-btn--lime{background:var(--he-lime);color:var(--he-ink)!important}
.he-btn--navy{background:var(--he-navy);color:#fff!important}

/* ---------- stage sections (canvas design at 1728px, zoomed to the screen by he-runtime.js) ---------- */
.he-stage-wrap{width:100%;overflow-x:clip;position:relative}
.he-stage{width:1728px;position:relative}
/* sticky pinning needs ancestors that do not clip vertically */
html:has(.he-stage-wrap),body.he-has-stage{overflow-x:clip}
.vc_row.he-stage-row,.vc_row.he-stage-row>.vc_column_container,.vc_row.he-stage-row .vc_column-inner,.vc_row.he-stage-row .wpb_wrapper{overflow:visible!important}

/* ---------- hero, phones ---------- */
.he-hero-m{display:none}
@media (max-width:767px){
  .he-hero .he-stage{display:none}
  .he-hero-m{display:block;padding:40px 16px 48px;background:linear-gradient(180deg,#F4F9FD 0%,#fff 80%);font-family:"DM Sans",system-ui,sans-serif;color:var(--he-ink)}
  .he-hero-m__title{font-family:Inter,system-ui,sans-serif;font-size:34px;line-height:1.15;font-weight:600;letter-spacing:-.02em;margin:18px 0 14px}
  .he-hero-m__intro{font-size:16px;line-height:1.5;color:#3A4150;margin:0 0 22px}
  .he-hero-m .he-btn{flex:1 1 140px}
  .he-trust{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13px;color:#3A4150}
  .he-hero-m__hubs{margin-top:36px;display:grid;gap:12px}
  .he-hero-m__hubs .he-eyebrow{justify-self:start;margin:0 0 4px}
  .he-hubcard{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid rgba(14,19,32,.08);border-left:0;border-radius:16px;padding:12px;box-shadow:0 6px 18px rgba(14,69,106,.06)}
  .he-hubcard img{width:56px;height:56px;border-radius:14px;object-fit:cover;object-position:50% 15%;background:var(--hc);flex:none}
  .he-hubcard b{display:block;font-family:Inter,system-ui,sans-serif;color:var(--he-ink);font-size:16px}
  .he-hubcard span{display:block;font-size:14px;line-height:1.4;color:#3A4150}
  .he-hubcard b::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--hc);margin-right:8px;vertical-align:middle}
}
@media (prefers-reduced-motion:reduce){.he-hl{transition:none}}

/* ---------- native Total / WPBakery sections (classes go in the row's "Extra class name") ---------- */
/* he-sec: a section. he-sec--head: its heading row (less space below). he-sec--body: the content row under a heading. */
.he-sec{padding-top:112px;padding-bottom:112px}
.he-sec.he-sec--head{padding-bottom:40px}
.he-sec--body{padding-bottom:112px}
.he-sec .wpb_text_column:last-child,.he-sec--body .wpb_text_column:last-child{margin-bottom:0}
.he-sec h2{margin-top:18px;margin-bottom:16px}
.he-sec--head p{max-width:640px;margin-left:auto;margin-right:auto}
.he-center{text-align:center}
/* full-width tinted backgrounds, as on the canvas */
.he-bg-soft{background:#F1F7FC!important}
.he-bg-gray{background:#F6F7F9!important}
/* cards: every text block inside a he-cards row becomes a card */
.he-cards .wpb_text_column{background:#fff;border:1px solid rgba(14,19,32,.08);border-radius:20px;padding:28px 28px 26px;box-shadow:0 8px 24px rgba(14,69,106,.06);margin-bottom:24px}
.he-cards .wpb_text_column h3{font-size:20px;line-height:1.3;margin:0 0 10px}
.he-cards .wpb_text_column p{margin:0;color:#3A4150}
.he-cards .wpb_text_column p+p,.he-cards .wpb_text_column ul{margin-top:12px}
.he-card-icon{display:inline-flex;width:44px;height:44px;border-radius:12px;align-items:center;justify-content:center;background:#E3EEF6;color:var(--he-navy);margin-bottom:16px}
.he-card-icon svg{width:22px;height:22px}
/* pricing */
.he-price .vc_column-inner{height:100%}
.he-price .wpb_text_column{min-height:100%;margin-bottom:16px}
.he-price .he-feature .wpb_text_column{border:2px solid var(--he-navy)}
.he-price-num{font-family:Inter,system-ui,sans-serif;font-size:44px;font-weight:600;letter-spacing:-.02em;color:var(--he-ink);display:block;margin:6px 0 4px}
/* stats and quotes on navy */
.he-bg-navy h2,.he-bg-navy h3,.he-bg-navy p,.he-bg-navy li{color:#fff}
.he-bg-navy .he-eyebrow{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);color:#fff}
.he-stat{font-family:Inter,system-ui,sans-serif;font-size:56px;font-weight:600;letter-spacing:-.03em;color:var(--he-lime)!important;margin:0!important;line-height:1}
.he-bg-navy.he-cards .wpb_text_column{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);box-shadow:none}
/* lime CTA panel */
.he-bg-lime h2,.he-bg-lime p{color:var(--he-ink)}
/* placeholders for work still to come: compact, clearly marked */
.he-ph-row{padding:24px 0}
.he-ph{border:2px dashed rgba(14,69,106,.25);border-radius:16px;padding:20px 24px;text-align:center;color:#5A6272;font-size:15px;background:#FAFCFE}
.he-ph strong{display:block;color:var(--he-navy);font-size:17px;margin-bottom:4px}
@media (max-width:767px){
  .he-sec{padding-top:64px;padding-bottom:64px}
  .he-sec.he-sec--head{padding-bottom:28px}
  .he-sec--body{padding-bottom:64px}
}

/* ---------- Four Hubs, phones ---------- */
.he-hubs-m{display:none}
@media (max-width:767px){
  .he-hubs .he-stage{display:none}
  .he-hubs-m{display:block;padding:56px 16px;background:#F6F7F9;font-family:"DM Sans",system-ui,sans-serif;color:var(--he-ink)}
  .he-hubs-m__title{font-family:Inter,system-ui,sans-serif;font-size:30px;line-height:1.15;font-weight:600;letter-spacing:-.02em;margin:16px 0 12px}
  .he-hubs-m__intro{font-size:16px;line-height:1.5;color:#3A4150;margin:0 0 24px}
  .he-hubs-m__card{background:#fff;border:1px solid rgba(14,19,32,.08);border-radius:20px;padding:20px;margin-bottom:12px;box-shadow:0 6px 18px rgba(14,69,106,.06)}
  .he-hubs-m__card h3{display:flex;align-items:center;gap:10px;font-family:Inter,system-ui,sans-serif;font-size:20px;font-weight:600;margin:0 0 8px;color:var(--he-ink)}
  .he-hubs-m__card h3 i{width:12px;height:12px;border-radius:4px;background:var(--hc)}
  .he-hubs-m__card p{font-size:15px;line-height:1.5;color:#3A4150;margin:0 0 12px}
  .he-hubs-m__pills{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
  .he-hubs-m__pills span{background:var(--ht);color:var(--hd);font-size:13px;font-weight:600;padding:4px 10px;border-radius:100px}
  .he-hubs-m__card a{font-weight:600;color:var(--hd);text-decoration:none}
}