/* =============================================================
   CX Financia — Corporate & Headquartering Services page
   Custom styles for the Gutenberg block layout.
   All selectors are prefixed .cxf- so they never collide with Salient.
   HOW TO INSTALL: paste this whole file into
   WP Admin → Appearance → Customize → Additional CSS
   (or append it to salient-child/style.css)
   ============================================================= */

:root{
  --cxf-navy:#01495b;
  --cxf-navy-deep:#013442;
  --cxf-teal:#006c89;
  --cxf-teal-bright:#0a90b3;
  --cxf-accent:#f5a623;
  --cxf-ink:#12303a;
  --cxf-muted:#5c7480;
  --cxf-line:#e2e9ec;
  --cxf-soft:#f4f7f8;
  --cxf-grey:#eef2f4;
  --cxf-radius:14px;
  --cxf-shadow:0 10px 30px rgba(1,73,91,.10);
}

.cxf-body #breadcrumbs {display: none}
body[data-header-resize="1"].cxf-body .container-wrap, body[data-header-resize="1"].cxf-body .project-title {padding-top: 0}

.editor-styles-wrapper .block-editor-block-list__layout.is-root-container>:where(:not(.alignleft):not(.alignright):not(.alignfull)),
.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
    --wp--style--global--content-size: 1200px;
}

/* generic section spacing for our blocks */
.cxf-section{padding:72px 0}
.cxf-eyebrow{display:inline-block;text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;font-weight:700;color:var(--cxf-teal);margin-bottom:6px}
.cxf-eyebrow.cxf-on-dark{color:var(--cxf-teal-bright)}

/* buttons (override Salient button chrome) */
.cxf-btn .wp-block-button__link,
a.cxf-btn{border-radius:999px !important;font-weight:700 !important;padding:14px 26px !important;border:2px solid transparent !important;transition:.18s}
/* hero buttons ~15% smaller (padding + text), CTA-banner buttons unchanged */
.cxf-hero .cxf-btn .wp-block-button__link{padding:12px 22px !important;font-size:.85em !important}
.cxf-btn-primary .wp-block-button__link{background:var(--cxf-accent) !important;color:#231a00 !important;border-color:var(--cxf-accent) !important}
.cxf-btn-ghost .wp-block-button__link{background:transparent !important;color:#fff !important;border-color:rgba(255,255,255,.55) !important}
.cxf-btn-ghost .wp-block-button__link:hover{background:rgba(255,255,255,.12) !important}
.cxf-btn-teal .wp-block-button__link{background:var(--cxf-teal) !important;color:#fff !important;border-color:var(--cxf-teal) !important}

/* ---------- BLOCK 01 · HERO ---------- */
#top.cxf-hero{width:auto;}
@media(min-width:768px){.cxf-hero{padding:80px 20px}}
.cxf-hero{background:linear-gradient(135deg,var(--cxf-navy),var(--cxf-navy-deep));color:#fff;overflow:hidden;padding:24px 20px}
.cxf-hero h1,.cxf-hero h2{color:#fff}
.cxf-hero .cxf-lead{font-size:1.15rem;color:#cfe0e6;max-width:42ch}
.cxf-hero a{color:#fff}
.cxf-trust{display:flex;gap:26px;flex-wrap:wrap;margin-top:28px;color:#9fc0ca;font-size:.82rem}
.cxf-trust .cxf-stat-num{font-size:1.5rem;font-weight:800;color:#fff;margin:0;line-height:1}
.cxf-trust .cxf-stat-lbl{margin:2px 0 0}
.cxf-hero-img{margin:0}
.cxf-hero-img img{border-radius:18px;box-shadow:var(--cxf-shadow);border:1px solid rgba(255,255,255,.18);
  display:block;width:100%}
/* editor placeholder (before an image is chosen) keeps the framed look */
.cxf-hero-img .components-placeholder,
.cxf-hero-img.wp-block-image.is-empty{border-radius:18px;min-height:260px}

/* ---------- BLOCK 02 · STICKY BAR ---------- */
/* JS-driven sticky (see cxf-sticky.js). CSS position:sticky is unreliable here
   because Salient sets overflow:hidden on ancestor wrappers; the script toggles
   .cxf-stuck (position:fixed) with a live header offset instead. */
.cxf-stickybar{z-index:999;background:rgba(255,255,255,.96);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--cxf-line);padding:10px 0}
.cxf-stickybar.cxf-stuck{position:fixed !important;left:0 !important;right:0 !important;
  width:auto !important;max-width:none !important;margin:0 !important;box-shadow:0 8px 20px rgba(1,73,91,.12)}
.cxf-sticky-placeholder{height:0}
.cxf-stickybar .cxf-navrow{display:flex;gap:6px;flex-wrap:wrap;align-items:center;justify-content:center;padding-bottom:0}
.cxf-stickybar a{color:var(--cxf-ink);font-size:.86rem;font-weight:600;padding:4px 8px;border-radius:8px;text-decoration:none}
.cxf-stickybar a:hover{background:var(--cxf-grey)}

/* ---------- BLOCK 03 · OVERVIEW ---------- */
.cxf-overview{border-left:5px solid var(--cxf-teal);background:var(--cxf-soft);
  padding:32px 38px;border-radius:0 var(--cxf-radius) var(--cxf-radius) 0}
.cxf-overview .cxf-lead{font-size:1.22rem;font-weight:700;color:var(--cxf-navy)}
.cxf-overview ul.cxf-list{list-style:none;margin:14px 0 0;padding:0}
.cxf-overview ul.cxf-list li{position:relative;padding:6px 0 6px 30px;;list-style: none;}
.cxf-overview ul.cxf-list li:before{content:"";position:absolute;left:0;top:18px;width:10px;height:10px;
  background:var(--cxf-teal);border-radius:3px;transform:rotate(45deg)}

/* ---------- BLOCK 04 · SERVICE GRID ---------- */
.cxf-card{border:1px solid var(--cxf-line);border-radius:var(--cxf-radius);padding:26px;background:#fff;
  height:100%;transition:.18s;overflow:hidden}
.cxf-card:hover{box-shadow:var(--cxf-shadow);transform:translateY(-3px)}
.cxf-card h3{margin:0 0 8px;color:var(--cxf-navy);font-size:1.1rem}
.cxf-card p{color:var(--cxf-muted);font-size:.94rem}
.cxf-card ul.cxf-links{list-style:none;margin:12px 0 0;padding:0}
.cxf-card ul.cxf-links li{padding:3px 0;list-style: none;}
.cxf-card ul.cxf-links a{color:var(--cxf-teal);font-weight:600;font-size:.88rem;text-decoration:none}
.cxf-card ul.cxf-links a:after{content:" →"}
/* gap between the two 3-card rows (front end collapses the default block gap) */
#services .wp-block-columns + .wp-block-columns{margin-top:24px !important}

/* ---------- BLOCK 05 · CHECKLIST ---------- */
.cxf-checklist-wrap{background:var(--cxf-grey);border-radius:var(--cxf-radius);padding:40px}
ul.cxf-checklist{list-style:none;margin:18px 0 0;padding:0;
  display:grid;grid-template-columns:1fr 1fr;gap:10px 32px}
ul.cxf-checklist li{position:relative;padding:8px 0 8px 40px;font-weight:600;color:var(--cxf-ink);;list-style: none;}
ul.cxf-checklist li:before{content:"";position:absolute;left:0;top:7px;width:24px;height:24px;
  border-radius:50%;background:var(--cxf-teal)}
ul.cxf-checklist li:after{content:"";position:absolute;left:7px;top:14px;width:9px;height:5px;
  border-left:2.5px solid #fff;border-bottom:2.5px solid #fff;transform:rotate(-45deg)}

/* ---------- BLOCK 06 · COMPARISON MATRIX ---------- */
.cxf-matrix{width:100%;box-shadow:var(--cxf-shadow);border-radius:var(--cxf-radius);overflow:hidden}
.cxf-matrix table{border-collapse:collapse;width:100%}
.cxf-matrix thead th{position:sticky;top:56px;background:var(--cxf-navy);color:#fff;text-align:left;
  padding:15px 18px;font-size:.9rem;z-index:2}
.cxf-matrix td{padding:14px 18px;border-top:1px solid var(--cxf-line);font-size:.94rem}
.cxf-matrix tbody tr:nth-child(even){background:var(--cxf-soft)}
.cxf-matrix td:first-child{font-weight:700;color:var(--cxf-navy)}
.cxf-matrix .cxf-yes{color:var(--cxf-teal);font-weight:800}
.cxf-matrix .cxf-no{color:#b0413b;font-weight:800}

/* ---------- BLOCK 07 · PROCESS SEQUENCE ---------- */
.cxf-step{display:grid !important;grid-template-columns:64px 1fr;gap:48px;align-items:start;
  padding:0 0 30px;margin:0;position:relative}
/* connector line linking the numbered circles (not after the last step) */
.cxf-step:not(:last-child)::before{content:"";position:absolute;left:31px;top:64px;bottom:-6px;
  width:2px;background:var(--cxf-line);z-index:0}
.cxf-step .cxf-num{width:64px;height:64px;border-radius:50%;background:var(--cxf-navy);color:#fff;
  display:flex !important;align-items:center !important;justify-content:center !important;
  font-weight:800;font-size:1.3rem;line-height:1;padding:0;
  position:relative;z-index:1;margin:0;}
/* body column: heading + badge sit inline on one row, description below */
.cxf-step > .wp-block-group{padding-top:4px;text-align:left !important;
  margin-left:0 !important;margin-right:0 !important;max-width:none !important;
  width:auto;justify-self:stretch}
.cxf-step h3{display:inline;margin:0;color:var(--cxf-navy)}
.cxf-step .cxf-badge{display:inline-block;vertical-align:middle;margin:0 0 0 10px;
  background:var(--cxf-grey);color:var(--cxf-teal);font-weight:700;font-size:.7rem;
  letter-spacing:.04em;text-transform:uppercase;padding:4px 11px;border-radius:999px}
.cxf-step > .wp-block-group > p:not(.cxf-badge){margin:8px 0 0;color:var(--cxf-muted);font-size:.95rem}

/* ---------- BLOCK 08 · CASE STUDY ---------- */
.cxf-case{background:var(--cxf-navy);color:#fff;border-radius:20px;padding:44px;overflow:hidden}
.cxf-case h2,.cxf-case h3{color:#fff}
.cxf-case .cxf-quote{font-size:1.1rem;color:#d3e3e8}
.cxf-case .cxf-client{font-weight:700;color:#9fc0ca;font-size:.9rem}
.cxf-case-img{margin:0 0 16px}
.cxf-case-img img{border-radius:14px;display:block;width:100%}
.cxf-case-img .components-placeholder,
.cxf-case-img.wp-block-image.is-empty{border-radius:14px;min-height:220px}
ul.cxf-roi{list-style:none;margin:0;padding:0}
ul.cxf-roi li{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:14px 18px;margin:0 0 12px;list-style: none}
ul.cxf-roi .cxf-big{font-size:1.8rem;font-weight:800;color:#fff;display:inline-block;margin-right:10px}
ul.cxf-roi .cxf-lbl{color:#bcd3da;font-size:.9rem}

/* ---------- BLOCK 09 · AUTHOR E-E-A-T ---------- */
.cxf-author{border:1px solid var(--cxf-line);border-radius:var(--cxf-radius);padding:32px;background:#fff}
.cxf-author .wp-block-media-text__media img{border-radius:12px}
.cxf-author h3{margin:0 0 2px;color:var(--cxf-navy)}
.cxf-author .cxf-role{color:var(--cxf-teal);font-weight:700;margin:0 0 12px}
ul.cxf-creds{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px;padding:0}
ul.cxf-creds li{background:var(--cxf-grey);font-size:.78rem;font-weight:600;padding:5px 12px;border-radius:999px;color:var(--cxf-navy);list-style:none}
.cxf-author .cxf-compliance{font-size:.82rem;color:var(--cxf-muted);border-top:1px solid var(--cxf-line);padding-top:12px}

/* ---------- BLOCK 10 · FAQ ---------- */
.cxf-schema-flag{display:inline-flex;align-items:center;gap:10px;background:#e9f6ee;border:1px solid #bfe3cd;
  color:#1c6b3d;font-size:.8rem;font-weight:600;padding:9px 14px;border-radius:10px;margin-bottom:14px}
.cxf-faq .wp-block-details{border:1px solid var(--cxf-line);border-radius:12px;margin-bottom:12px;
  background:#fff;padding:6px 22px}
.cxf-faq summary{cursor:pointer;padding:14px 0;font-weight:700;color:var(--cxf-navy)}

/* ---------- BLOCK 11 · CTA BANNER ---------- */
.cxf-cta{background:linear-gradient(120deg,var(--cxf-teal),var(--cxf-navy));color:#fff;text-align:center;
  border-radius:20px;padding:60px 40px}
.cxf-cta h2{color:#fff}
.cxf-cta p{color:#d8ebf0;max-width:52ch;margin:0 auto 22px}
.cxf-cta .wp-block-buttons{justify-content:center}

/* ---------- responsive ---------- */
@media(max-width:781px){
  ul.cxf-checklist{grid-template-columns:1fr}
  .cxf-matrix thead th{top:0}
}