:root{
  /* Colors */
  --navy: #034C9B;
  --navy-deep: #043A75;
  --blue: #015CC7;
  --blue-dk: #01449E;
  --teal: #019C96;
  --teal-deep: #017E79;
  --teal-dk: #017E79;
  --band: #E4F3FA;
  --paper: #F9F8FF;
  --white: #FFFFFF;
  --ink: #122B45;
  --body: #54637A;
  --muted: #5B6470;
  --muted-2: #7C8794;
  --faint: #8593A6;
  --line: #E7ECF3;
  --line-navy: rgba(255,255,255,.14);

  /* Fonts */
  --text: Roboto, Oxygen-Sans, "Helvetica Neue", sans-serif;
  --f-head: Roboto, Oxygen-Sans, "Helvetica Neue", sans-serif;
  --f-body: Roboto, Oxygen-Sans, "Helvetica Neue", sans-serif;

  /* Layout */
  --wrap: 1180px;

  /* Spacing */
  --s1: 8px;
  --s2: 16px;
  --s3: 24px;
  --s4: 32px;
  --s5: 48px;
  --s6: 64px;
  --s7: 96px;

  /* Border Radius */
  --r: 14px;
  --r-pill: 999px;
  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 24px;

  /* Shadows */
  --shadow: 0 2px 6px rgba(3,76,155,.06), 0 14px 34px rgba(3,76,155,.08);
  --shadow-sm: 0 1px 3px rgba(3,76,155,.07);
  --shadow-1: 0 1px 2px rgba(18,43,69,.05);
  --shadow-2: 0 2px 4px rgba(18,43,69,.04), 0 12px 32px rgba(18,43,69,.08);
  --shadow-navy: 0 24px 64px rgba(4,58,117,.35);

  /* Motion */
  --ease: cubic-bezier(.2,.7,.3,1);
  --t: .22s;
}


/* ---------- reset / base ---------- */
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{font-family:var(--text);font-size:16px;line-height:1.65;color:var(--body);background:#fff;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--display);color:var(--ink);line-height:1.18;/*letter-spacing:-.015em;*/font-weight:600}

a{color:inherit;text-decoration:none}
button{font:inherit}
::selection{background:var(--teal);color:#fff}
:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:4px}
section{scroll-margin-top:96px}

.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:28px}
.sec{padding-block:var(--s7)}
.sec-tight{padding-block:var(--s6)}
@media (max-width:720px){.sec{padding-block:var(--s6)}.sec-tight{padding-block:var(--s5)}}
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
  body{font-family: Roboto, Oxygen-Sans, Helvetica Neue, sans-serif !important;margin:0;font-family:var(--f-body);color:var(--muted);background:var(--paper);line-height:1.65;-webkit-font-smoothing:antialiased}
  h1,h2,h3,h4{font-family:var(--f-head);color:var(--navy);font-weight:700;line-height:1.2;margin:0}
  p{margin:0}
  a{color:inherit;text-decoration:none}
  img{max-width:100%;display:block}
  ::selection{background:var(--teal);color:#fff}
  .wrap{max-width:var(--wrap);margin:0 auto;padding:0 26px}
  .section{padding:88px 0}
  @media (max-width:720px){.section{padding:60px 0}.hero{ background-image: url(https://exordiumnetworks.com/wp-content/themes/astra-child/assets/images/mobile-bnr.webp)!important; }
  }
  .eyebrow{font-family:var(--f-head);font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--teal)}
  .h-sec{font-size:clamp(26px,3.2vw,38px);margin-top:10px;color:var(--navy);
    font-weight: 700;}
.h-sec.wide {
    margin-left: auto;
    margin-right: auto;
    /*text-transform: capitalize;*/
    font-weight: 700;
}
/* ---------- section header pattern (single source of truth) ---------- */
.kicker{display:inline-flex;align-items:center;gap:10px;font-family:var(--display);font-size:12.5px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--teal)}
.kicker::before{content:"";width:20px;height:2px;border-radius:2px;background:var(--teal)}
.on-navy .kicker{color:#7BDAD5}
.on-navy .kicker::before{background:#7BDAD5}
h1.display{font-size:clamp(34px,4.6vw,54px);font-weight:700;letter-spacing:-.02em;line-height:1.08}
h2.title{font-size:clamp(26px,3vw,38px);font-weight:600;margin-top:14px;text-wrap:balance}
.lede{font-size:17px;line-height:1.7;margin-top:18px;/*max-width:58ch*/}
.lede + .lede{margin-top:14px}
.centered{text-align:center}
.centered h2.title,.centered .lede{margin-inline:auto}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--display);font-weight:600;
  font-size:15px;padding:15px 28px;border-radius:var(--r-sm);border:1.5px solid transparent;cursor:pointer;white-space:nowrap;
  transition:transform var(--t) var(--ease),box-shadow var(--t) var(--ease),background var(--t) var(--ease),border-color var(--t) var(--ease)}
@media (max-width:680px){.btn{white-space:normal}.hero-actions .btn,.final-actions .btn{width:100%}}
.btn svg{width:16px;height:16px;flex:none;transition:transform var(--t) var(--ease)}
.btn:hover svg{transform:translateX(3px)}
.btn-primary{background:var(--teal);color:#fff;box-shadow:0 10px 24px rgba(1,156,150,.30)}
.btn-primary:hover{background:var(--teal-deep);transform:translateY(-2px)}
.btn-header{background:var(--blue);color:#fff;box-shadow:0 8px 20px rgba(1,92,199,.25)}
.btn-header:hover{background:#0148A3;transform:translateY(-2px)}
.btn-ghost{color:#fff;border-color:rgba(255,255,255,.5)}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.08)}
/* ---------- card language (one system, used everywhere) ---------- */
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-1);
  transition:transform var(--t) var(--ease),box-shadow var(--t) var(--ease),border-color var(--t) var(--ease)}
.card.lift:hover{transform:translateY(-4px);box-shadow:var(--shadow-2);border-color:#D5DDEA}

/* single icon treatment */
.ic{width:44px;height:44px;flex:none;border-radius:12px;background:var(--band);color:var(--navy);display:grid;place-items:center}
.ic svg{width:22px;height:22px;stroke-width:1.8}

/* check treatment */
.chk{width:22px;height:22px;flex:none;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center;margin-top:2px}
.chk svg{width:11px;height:11px}

/* stat treatment (proof bar + at-a-glance share this) */
.figure{font-weight:700;color:var(--navy);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
  
  .lead{font-size:16px;color:var(--muted);margin-top:14px;}
  .center{text-align:center}
  .center .lead{margin-left:auto;margin-right:auto}

  .btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--f-head);font-weight:600;font-size:15px;
    padding:14px 26px;border-radius:9px;cursor:pointer;border:1.5px solid transparent;white-space:nowrap;
    transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s ease,color .16s ease}
  .btn svg{width:16px;height:16px}
  .btn-blue{background:var(--blue);color:#fff;box-shadow:0 8px 20px rgba(1,92,199,.28)}
  .btn-blue:hover{background:var(--blue-dk);transform:translateY(-2px)}
  .btn-teal{background:var(--teal);color:#fff;box-shadow:0 8px 20px rgba(1,156,150,.32)}
  .btn-teal:hover{background:var(--teal-dk);transform:translateY(-2px)}
  .btn-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
  .btn-outline:hover{background:rgba(255,255,255,.12);border-color:#fff}
  .btn-outline-navy{background:transparent;color:var(--navy);border-color:var(--line)}
  .btn-outline-navy:hover{border-color:var(--navy)}
  .btn:focus-visible{outline:3px solid var(--teal);outline-offset:2px}


  /* ===== Hero ===== */
  .hero-image{
    display:flex;
    align-items:center;
    justify-content:center;
}

.hero-image img{
    width:100%;
    height:auto;
    display:block;
    object-fit:contain;
}
  /* hero css new */    .hero{ background-image: url(https://exordiumnetworks.com/wp-content/themes/astra-child/assets/images/artboard-bnr.webp);   background-repeat: no-repeat;    background-position: center center;    background-size: cover;    min-height: 600px;    display: flex;    align-items: center;    position: relative;}.hero .wrapper{    width: 100%;	padding: 0 20px;}.hero-content{    max-width: 560px;    color: #fff;}.hero-content h1{    font-size: 40px;    margin-bottom: 25px;    color: #fff;    font-weight: 600;    line-height: 1.2em;}.hero-content p{    font-size: 22px;    line-height: 1.6;    color: #fff;    margin-bottom: 35px;}.hero-btn{    display: inline-block;    transition: .3s;    background-color: #009C95;    font-family: "Roboto", Sans-serif;    font-size: 16px;    font-weight: 400;    border-radius: 5px 5px 5px 5px;    padding: 8px 25px 8px 25px;    color: #fff;}.hero-btn:hover{    background: #43a63c;    color: #fff;}.hero-support{    margin-top: 18px;    color: #fff;    font-size: 16px;}@media (max-width:991px){    .hero{        min-height: auto;        padding: 80px 0;        background-position: right center;    }    .hero-content{        max-width: 100%;    }    .hero-content h1{        font-size: 38px;    }    .hero-content p{        font-size: 18px;    }    .hero-btn{        width: 100%;        text-align: center;        font-size: 14px;         padding: 10px;   }}

  .hero::after{content:"";position:absolute;inset:0;background:
    radial-gradient(560px 420px at 96% 8%, rgba(1,156,150,.25), transparent 60%),
    radial-gradient(700px 500px at -10% 100%, rgba(255,255,255,.06), transparent 60%);pointer-events:none}
  .hero-grid{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center;padding:72px 0 78px}
  .hero .sub{color:#EAF2FF;font-size:17px;margin-top:18px;max-width:46ch;font-weight:500}
  .hero .supp{color:#C9DCF5;font-size:15px;margin-top:12px;max-width:48ch}
  .hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
  @media (max-width:900px){.hero-grid{grid-template-columns:1fr;padding:52px 10px 60px}}

  /* hero visual: stylized capability tiles standing in for office/team photography */
  .collage{position:relative;height:400px}
  .tile{position:absolute;border-radius:16px;box-shadow:0 20px 40px rgba(0,20,50,.35);overflow:hidden;
    display:flex;align-items:flex-end;padding:16px;color:#fff}
  .tile .tlabel{font-family:var(--f-head);font-weight:600;font-size:13.5px;position:relative;z-index:1}
  .tile svg{position:absolute;opacity:.9}
  .tile-a{width:230px;height:170px;left:0;top:10px;background:linear-gradient(150deg,#0662BE,#034C9B);transform:rotate(-4deg)}
  .tile-b{width:190px;height:150px;right:10px;top:0;background:linear-gradient(150deg,#019C96,#017E79);transform:rotate(3deg)}
  .tile-c{width:210px;height:160px;left:40px;bottom:0;background:linear-gradient(150deg,#1665C4,#083E82);transform:rotate(2deg)}
  .tile-d{width:180px;height:150px;right:0;bottom:20px;background:linear-gradient(150deg,#0AA7A0,#036F6A);transform:rotate(-3deg)}
  .loc-pin{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);background:#fff;color:var(--navy);
    font-family:var(--f-head);font-weight:600;font-size:12.5px;padding:9px 16px;border-radius:30px;
    box-shadow:0 10px 26px rgba(0,20,50,.3);display:flex;align-items:center;gap:7px;z-index:2;white-space:nowrap}
  .loc-pin .dot{width:7px;height:7px;border-radius:50%;background:var(--teal)}
  @media (max-width:900px){.collage{height:340px;max-width:460px;margin:0 auto}}
  @media (max-width:480px){.collage{height:300px}.tile-a{width:180px;height:140px}.tile-b{width:150px;height:120px}.tile-c{width:170px;height:130px}.tile-d{width:145px;height:120px} .tile svg{width:50px; height:50px;}}


  /* ==========================================================================
   PROOF BAR
   ========================================================================== */
.proof{border-bottom:1px solid var(--line);background:#fff}
.proof-row{display:grid;grid-template-columns:repeat(5,1fr);padding-block:26px}
.proof-cell{padding-inline:24px;border-left:1px solid var(--line)}
.proof-cell:first-child{border-left:0;padding-left:0}
.proof-cell .figure{font-size:21px;line-height:1.2;white-space:nowrap}
.proof-cell span{display:block;font-size:12.5px;color:var(--faint);margin-top:2px}
@media (max-width:960px){
  .proof-row{grid-template-columns:repeat(2,1fr);gap:20px 0}
  .proof-cell:nth-child(odd){border-left:0;padding-left:0}
  .proof-cell:last-child{grid-column:1/-1;border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:18px}
}

/* ==========================================================================
   GAP  (15 / 85)
   ========================================================================== */
.gap-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
@media (max-width:920px){.gap-grid{grid-template-columns:1fr;gap:48px}}
.ratio-card{padding:40px}
.ratio-figures{display:flex;align-items:flex-end;gap:40px}
.ratio-figures .f15 .figure{font-size:clamp(34px,3.4vw,44px);color:var(--faint)}
.ratio-figures .f85 .figure{font-size:clamp(56px,6vw,76px);color:var(--teal);line-height:1}
.ratio-figures small{display:block;font-family:var(--display);font-weight:600;font-size:13px;color:var(--ink);margin-top:6px}
.ratio-bar{display:flex;height:12px;border-radius:var(--r-pill);overflow:hidden;margin-top:28px}
.ratio-bar i{display:block}
.ratio-bar .r15{width:15%;background:#C2D4EA}
.ratio-bar .r85{width:85%;background:var(--teal)}
.ratio-legend{display:flex;justify-content:space-between;margin-top:10px;font-size:12px;color:var(--faint)}
.ratio-caption{font-size:14px;line-height:1.65;margin-top:22px;color:var(--body)}
.ratio-kicker{font-family:var(--display);font-weight:600;font-size:16px;color:var(--navy);margin-top:12px}



/* ==========================================================================
   FIT  (band section)
   ========================================================================== */
.fit{background:var(--band)}
.fit-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:72px;align-items:start}
@media (max-width:880px){.fit-grid{grid-template-columns:1fr;gap:40px}}
.fit-list{display:grid;gap:12px}
.fit-item{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid rgba(3,76,155,.08);
  border-radius:var(--r-sm);padding:16px 20px}
.fit-item p{font-family:var(--display);font-weight:500;font-size:15px;color:var(--ink);line-height:1.5}
.fit-close{font-family:var(--display);font-weight:600;font-size:17px;line-height:1.55;color:var(--navy);
  margin-top:26px;max-width:36ch}


  /* ===== Service cards (matches "Our Key Services" pattern) ===== */
  .svc-head{text-align:center;margin-bottom:44px}
  .svc-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:22px}
  .svc-card{background:#fff;border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-sm);border:1px solid var(--line);
    transition:transform .2s ease,box-shadow .2s ease}
  .svc-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
  .svc-top{height:120px;display:grid;place-items:center;position:relative;overflow:hidden}
  .svc-top svg{width:60px;height:60px;color:#fff;position:relative;z-index:1}
  .svc-top::before{content:"";position:absolute;inset:0;opacity:.5;background-image:radial-gradient(circle,rgba(255,255,255,.35) 1px,transparent 1.4px);background-size:14px 14px}
  .svc-body{padding:20px 20px 22px}
  .svc-body h3{font-size:16.5px;margin-bottom:10px;letter-spacing:-.01em}
  .svc-body ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px}
  .svc-body li{position:relative;padding-left:16px;font-size:13.5px;color:var(--muted);line-height:1.45}
  .svc-body li::before{content:"";position:absolute;left:0;top:7px;width:5px;height:5px;border-radius:50%;background:var(--teal)}
  @media (max-width:1000px){.svc-grid{grid-template-columns:1fr 1fr}}
  @media (max-width:560px){.svc-grid{grid-template-columns:1fr}}


  /* ==========================================================================
   OPTIONS  (three ways to start)
   ========================================================================== */
.opt-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:52px}
@media (max-width:920px){.opt-grid{grid-template-columns:1fr;max-width:540px;margin-inline:auto}}
.opt{display:flex;flex-direction:column;padding:0;overflow:hidden}
.opt-head{padding:26px 28px 22px;border-bottom:1px solid var(--line)}
.opt-label{font-family:var(--display);font-weight:600;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.opt-scale{font-family:var(--display);font-weight:700;font-size:30px;letter-spacing:-.02em;color:var(--navy);margin-top:10px;line-height:1.1}
.opt-scale small{display:block;font-size:12.5px;font-weight:600;letter-spacing:.02em;color:var(--teal);margin-top:4px;text-transform:uppercase}
.opt-body{padding:22px 28px;flex:1;display:flex;flex-direction:column}
.opt h3{font-size:19px}
.opt-body > p{font-size:14px;line-height:1.65;margin-top:12px;flex:1}
.opt-best{margin-top:22px;padding:16px 18px;background:var(--paper);border-radius:var(--r-sm)}
.opt-best b{display:block;font-family:var(--display);font-weight:600;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);margin-bottom:5px}
.opt-best span{font-size:13.5px;line-height:1.55;color:var(--body)}
.opt-promise{margin:44px auto 0;max-width:62ch;text-align:center;font-family:var(--display);font-weight:500;
  font-size:16px;line-height:1.7;color:var(--ink)}
.opt-promise strong{color:var(--teal);font-weight:600}


/* ==========================================================================
   WHY EXORDIUM
   ========================================================================== */
.quote{margin:40px 0 48px}
.quote p{font-family:var(--display);font-weight:600;font-size:clamp(22px,2.6vw,30px);line-height:1.4;
  letter-spacing:-.015em;color:var(--navy);text-wrap:balance;/*max-width:26ch*/}
.quote p em{font-style:normal;color:var(--teal)}
.quote-rule{width:52px;height:3px;border-radius:2px;background:var(--teal);margin-bottom:22px}
.pillar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
@media (max-width:960px){.pillar-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.pillar-grid{grid-template-columns:1fr}}
.pillar{padding:26px}
.pillar h3{font-size:16px;margin-top:18px}
.pillar p{font-size:13.5px;line-height:1.6;margin-top:9px}


/* ==========================================================================
   AI  (navy)
   ========================================================================== */
.ai{background:linear-gradient(178deg,var(--navy) 0%,var(--navy-deep) 100%);position:relative;overflow:hidden}
.ai .hero-glow{background:radial-gradient(620px 460px at 100% 100%,rgba(1,156,150,.24),transparent 60%)}
.ai-grid{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:72px;align-items:center}
@media (max-width:920px){.ai-grid{grid-template-columns:1fr;gap:44px}}
.ai h2.title{color:#fff}
.ai .foundation{font-family:var(--display);font-weight:600;font-size:18px;color:#7BDAD5;margin-top:18px}
.ai .lede{color:#C7DAF3}
.ai-panel{background:rgba(255,255,255,.05);border:1px solid var(--line-navy);border-radius:var(--r-lg);padding:30px;display:grid;gap:20px}
.ai-row{display:flex;gap:14px;align-items:flex-start}
.ai-row p{font-size:14.5px;line-height:1.6;color:#C7DAF3}
.ai-row b{color:#fff;font-family:var(--display);font-weight:600}


/* ==========================================================================
   PHILOSOPHY
   ========================================================================== */
.philo{max-width:780px;margin-inline:auto;text-align:center}
.equation{font-family:var(--display);font-weight:700;font-size:clamp(30px,4.4vw,50px);letter-spacing:-.02em;line-height:1.15;color:var(--ink)}
.equation .eq-h{color:var(--navy)}
.equation .eq-a{color:var(--teal)}
.philo-lead{font-family:var(--display);font-weight:600;font-size:clamp(17px,2vw,20px);color:var(--ink);margin-top:28px}
.philo-body{font-size:15.5px;line-height:1.75;margin-top:14px}
.philo-close{font-family:var(--display);font-weight:600;font-size:14.5px;color:var(--teal-deep);margin-top:22px}


/* ==========================================================================
   FRAMEWORK  (horizontal spine, same node language as hero path)
   ========================================================================== */
.frame-panel{margin-top:52px;background:var(--band);border-radius:var(--r-lg);padding:52px 44px}
.spine{position:relative;display:grid;grid-template-columns:repeat(5,1fr)}
.spine::before{content:"";position:absolute;left:10%;right:10%;top:20px;height:2px;background:rgba(3,76,155,.22)}
.phase{position:relative;text-align:center;padding-inline:12px}
.phase-node{position:relative;z-index:1;width:40px;height:40px;margin:0 auto;border-radius:50%;background:#fff;
  border:2px solid var(--navy);color:var(--navy);display:grid;place-items:center;
  font-family:var(--display);font-weight:600;font-size:13.5px;transition:background var(--t),color var(--t),transform var(--t) var(--ease)}
.phase:hover .phase-node{background:var(--navy);color:#fff;transform:translateY(-3px)}
.phase:last-child .phase-node{border-color:var(--teal);color:var(--teal)}
.phase:last-child:hover .phase-node{background:var(--teal);color:#fff}
.phase h4{font-size:15.5px;color:var(--navy);margin-top:16px}
.phase p{font-size:13px;line-height:1.55;margin-top:6px;max-width:22ch;margin-inline:auto}
@media (max-width:880px){
  .frame-panel{padding:36px 28px}
  .spine{grid-template-columns:1fr}
  .spine::before{left:19px;right:auto;top:20px;bottom:20px;width:2px;height:auto}
  .phase{display:grid;grid-template-columns:40px 1fr;gap:18px;text-align:left;padding:0 0 26px}
  .phase-node{margin:0}
  .phase h4{margin-top:0}
  .phase p{margin-inline:0;max-width:none}
}

/* ==========================================================================
   AT A GLANCE  (band)
   ========================================================================== */
.glance{background:var(--band)}
.glance-row{display:grid;grid-template-columns:repeat(4,1fr);margin-top:48px}
.glance-cell{padding-inline:28px;border-left:1px solid rgba(3,76,155,.16)}
.glance-cell:first-child{border-left:0;padding-left:0}
.glance-cell .figure{font-size:clamp(30px,3vw,38px);line-height:1.1;white-space:nowrap}
.glance-cell b{display:block;font-family:var(--display);font-weight:600;font-size:14.5px;color:var(--ink);margin-top:8px}
.glance-cell p{font-size:13px;line-height:1.55;margin-top:6px;max-width:24ch}
@media (max-width:880px){
  .glance-row{grid-template-columns:1fr 1fr;gap:32px 0}
  .glance-cell:nth-child(odd){border-left:0;padding-left:0}
}
@media (max-width:520px){
  .glance-row{grid-template-columns:1fr;gap:26px}
  .glance-cell{border-left:0;padding-left:0}
}

/* ==========================================================================
   INDUSTRIES
   ========================================================================== */
.ind-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:52px}
@media (max-width:960px){.ind-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.ind-grid{grid-template-columns:1fr}}
.ind{padding:26px}
.ind h3{font-size:16px;margin-top:18px}
.ind p{font-size:13.5px;line-height:1.6;margin-top:9px}
.ind-note{display:block;font-size:12.5px;font-weight:500;color:var(--teal-deep);margin-top:10px}

/* ==========================================================================
   ECOSYSTEM
   ========================================================================== */
.eco-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:44px}
.chip{ font-weight: 600;font-size: 16px; color: var(--navy);border: 1px solid var(--line); transition: border-color var(--t), color var(--t);
    border-radius: 20px; box-shadow: 0 2px 8px rgba(0, 0, 0, .06);padding: 15px;}

.chip-logo {
   
    justify-content: center;
    align-items: center;
    background: #fff;
  
}
    .chip:hover{border-color:var(--navy);color:var(--navy)}
.eco-caption{font-size:12.5px;color:var(--faint);text-align:center;margin-top:28px;max-width:58ch;margin-inline:auto}
.chip img {
    width: 100px;
    animation: auto;
}
/* ==========================================================================
   BRIDGE + WHY NOW  (statement sections)
   ========================================================================== */
.statement{margin-inline:auto;text-align:center}
.statement h2.title{max-width:none}
.statement .lede{max-width:none}
.statement-close{font-family:var(--display);font-weight:600;font-size:16.5px;color:var(--navy);margin-top:24px}
.now-punch{margin-top:34px}
.now-punch .quiet{font-family:var(--display);font-weight:500;font-size:16.5px;color:var(--faint)}
.now-punch .loud{font-family:var(--display);font-weight:700;font-size:clamp(24px,3vw,34px);letter-spacing:-.02em;color:var(--teal);margin-top:6px}

/* ==========================================================================
   FAQ
   ========================================================================== */
.faq{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.faq-list{max-width:820px;margin:48px auto 0;display:grid;gap:12px}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);transition:border-color var(--t)}
.faq-item[open]{border-color:#C9D5E6}
.faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:18px;padding:22px 26px;
  font-family:var(--display);font-weight:600;font-size:16px;color:var(--ink)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item[open] summary{color:var(--navy)}
.faq-q{flex:1}
.faq-toggle{width:26px;height:26px;flex:none;border-radius:50%;border:1.5px solid var(--line);position:relative;color:var(--teal);transition:all var(--t)}
.faq-toggle::before,.faq-toggle::after{content:"";position:absolute;top:50%;left:50%;translate:-50% -50%;background:currentColor;border-radius:2px}
.faq-toggle::before{width:10px;height:2px}
.faq-toggle::after{width:2px;height:10px;transition:transform var(--t)}
.faq-item[open] .faq-toggle{background:var(--teal);border-color:var(--teal);color:#fff}
.faq-item[open] .faq-toggle::after{transform:scaleY(0)}
.faq-a{padding:0 26px 24px;font-size:14.5px;line-height:1.7;max-width:66ch}

/* ==========================================================================
   FINAL CTA
   ========================================================================== */
.final-card{position:relative;overflow:hidden;border-radius:var(--r-lg);background:linear-gradient(140deg,var(--navy) 0%,var(--navy-deep) 100%);box-shadow:var(--shadow-navy)}
.final-grid{position:relative;display:grid;grid-template-columns:1fr 1fr}
@media (max-width:920px){.final-grid{grid-template-columns:1fr;display: block;}}
.final-copy{padding:56px 52px;display:flex;flex-direction:column;justify-content:center}
.final-copy h2{color:#fff;font-size:clamp(24px,2.8vw,32px);margin-top:14px;text-wrap:balance}
.final-copy .lede{color:#C7DAF3;font-size:15.5px;max-width:44ch}
.final-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.final-form{background:#fff;padding:48px 44px;margin:8px;border-radius:calc(var(--r-lg) - 6px)}
@media (max-width:920px){.final-copy{padding:44px 32px}.final-form{padding:36px 28px}}
.final-form h3{font-size:19px;color:var(--navy)}
.final-form .form-sub{font-size:13.5px;margin-top:6px;margin-bottom:22px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:520px){.form-row{grid-template-columns:1fr}}
.field{width:100%;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:13px 15px;font-family:var(--text);
  font-size:14.5px;color:var(--ink);background:#FBFCFE;margin-bottom:12px;transition:border-color var(--t);     height: 50px;}
.field:focus{outline:none;border-color:var(--blue)}
.field::placeholder{color:var(--faint)}
select.field{appearance:none;background:#FBFCFE url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%238593A6" stroke-width="2"><path d="M6 9l6 6 6-6"/></svg>') no-repeat right 14px center;background-size:16px}
textarea.field{resize:vertical;min-height:92px}
.form-submit{width:100%}

  /* ===== Engagement model (testimonial-card pattern, real sequence) ===== */
  .engage-card{background:var(--band);border-radius:20px;padding:48px 40px;margin-top:56px}
  .spine{display:grid;grid-template-columns:repeat(5,1fr);gap:0;position:relative}
  .spine::before{content:"";position:absolute;left:9%;right:9%;top:26px;height:2px;background:var(--navy);opacity:.25;z-index:0}
  .stage{position:relative;text-align:center;padding:0 10px}
  .stage .snode{    position: relative;
    z-index: 1;
    width: 110px;
    height: 50px;
    margin: 0 auto 18px;
    border-radius: 20px;
    background: #fff;
    border: 2px solid var(--navy);
    display: grid;
    place-items: center;
    font-family: var(--f-head);
    font-weight: 700;
    font-size: 16px;
    color: var(--navy);
    transition: transform .2s ease, background .2s ease, color .2s ease;
    padding: 15px 0;}
  .stage:hover .snode{background:var(--navy);color:#fff;transform:translateY(-3px)}
  .stage:hover .snode h4 {
    color: #fff;
}
  .stage h4{font-size:16px;margin-bottom:6px;color:var(--navy)}
  .stage p{font-size:13px;color:var(--muted);max-width:30ch;margin:0 auto}
  @media (max-width:820px){
    .engage-card{padding:34px 14px}
    .spine{grid-template-columns:1fr;gap:0}
    .spine::before{left:25px;right:auto;top:26px;bottom:26px;width:2px;height:auto}
    .stage{display:grid;grid-template-columns:52px 1fr;gap:0 10px;text-align:left;padding:0 0 28px;align-items:start}
    .stage .snode{margin:0}.stage p{width: 250px; margin-left: 50px; margin-top: 0;max-width: 190px;}
	.stage .snode{width: 100px;}
    .stage h4 {
    margin-bottom: 6px;
    margin-top: 0px;
}.news-form input{min-width: 120px !important;}
  }


/* ==========================================================================
   NEWSLETTER + FOOTER
   ========================================================================== */
.news{background:var(--navy)}
.news-row{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;padding-block:36px}
.news-row h3{color:#fff;font-size:22px;max-width:38ch;font-weight:600}
.news-row p{color:#9FBDE4;font-size:13.5px;margin-top:5px}
.news-form{display:flex;gap:10px;}
.news-form input{border:0;border-radius:var(--r-sm);padding:26px 18px;font-family:var(--text);font-size:14px;min-width:240px}
.news-form input:focus{outline:2px solid var(--teal)}

 .page-template-gcc-landing-page .elementor-element.elementor-element-c768384.e-flex.e-con-boxed.e-con.e-child {
    display: none;
}

 

  .js .reveal{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease}
  .js .reveal.in{opacity:1;transform:none}
  @media (prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none;transition:none}}