
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --cobalt:#2D2DBE;--cobalt-dark:#1E1E8A;--cobalt-light:#4A4AD4;
  --green:#4A9A5C;--green-light:#5FB874;
  --white:#FFFFFF;--off-white:#F7F8FC;--light-gray:#EEF0F8;
  --text-dark:#0D0D3A;--text-body:#3A3A6E;--text-muted:#7878A8;
  --border:rgba(45,45,190,0.12);
}
html{scroll-behavior:smooth}
body{background:var(--white);color:var(--text-dark);font-family:'DM Sans',sans-serif;font-size:16px;line-height:1.6;overflow-x:hidden}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:.85rem 3rem;background:rgba(255,255,255,.95);backdrop-filter:blur(16px);border-bottom:1px solid var(--border)}
.nav-logo{display:flex;align-items:center;text-decoration:none}
.nav-logo img{height:48px;width:auto}
.nav-links{display:flex;gap:2.5rem;list-style:none}
.nav-links a{text-decoration:none;color:var(--text-body);font-size:.82rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;transition:color .2s}
.nav-links a:hover{color:var(--cobalt)}
.nav-cta{background:var(--cobalt);color:var(--white);border:none;padding:.55rem 1.4rem;font-size:.8rem;font-family:'DM Sans',sans-serif;font-weight:500;cursor:pointer;text-decoration:none;display:inline-block;border-radius:2px;transition:background .2s}
.nav-cta:hover{background:var(--cobalt-dark)}

/* HERO */
.hero {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 7rem 2rem 5rem;
  text-align: center;
  background: linear-gradient(135deg,#f7f8fc 0%,#fff 60%,#f0f0fb 100%);
  gap: 0;
}

/* Orbit wrapper — sits above the text */
.hero-orbit-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 2.5rem;
}

/* Text block — centred below orbit */
.hero-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 680px;
}

.hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  background: rgba(45,45,190,.07);
  border: 1px solid rgba(45,45,190,.15);
  padding: .35rem .9rem;
  border-radius: 100px;
  margin-bottom: 1.5rem;
}
.eyebrow-dot { width:6px;height:6px;border-radius:50%;background:var(--green); }
.eyebrow-text { font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;color:var(--cobalt);font-weight:600; }

.hero h1 {
  font-family: 'DM Serif Display', serif;
  font-size: clamp(2.6rem,5vw,4.2rem);
  font-weight: 400;
  line-height: 1.1;
  color: var(--text-dark);
  margin-bottom: 1.25rem;
}
.hero h1 .you { color: var(--green); font-style: italic; }

.hero-sub {
  font-size: 1.05rem;
  color: var(--text-body);
  font-weight: 300;
  max-width: 560px;
  line-height: 1.8;
  margin-bottom: 2rem;
}
.hero-actions { display:flex;gap:1rem;flex-wrap:wrap;justify-content:center; }

/* Orbit stage */
.orbit-stage { position:relative;width:460px;height:300px; }
.orbit-logo-wrap { position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:2; }
.orbit-logo-wrap img { width:320px;height:auto; }
.ring { position:absolute;inset:0;margin:auto;border-radius:50%;animation:hero-ring-spin linear infinite; }
.ring-1 { width:460px;height:160px;border:2.5px solid rgba(45,45,190,.65);animation-duration:14s; }
.ring-2 { width:360px;height:126px;border:2px dashed rgba(74,154,92,.6);animation-duration:10s;animation-direction:reverse; }
@keyframes hero-ring-spin { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
.orbit-nodes { position:absolute;inset:0;animation:hero-ring-spin 16s linear infinite; }
.o-node { position:absolute;width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.65rem;font-weight:700;color:#fff;animation:hero-ring-spin 16s linear infinite reverse; }
.n1 { background:var(--cobalt);top:-16px;left:50%;transform:translateX(-50%); }
.n2 { background:var(--green);top:50%;right:-16px;transform:translateY(-50%); }
.n3 { background:var(--cobalt-light);bottom:-16px;left:50%;transform:translateX(-50%); }
.n4 { background:#7B7BCC;top:50%;left:-16px;transform:translateY(-50%); }

/* Hero visual (legacy — hidden) */
.hero-visual { display:none; }


/* HERO VISUAL — orbit stage */
.hero-visual{display:flex;align-items:center;justify-content:center}
.orbit-stage{position:relative;width:460px;height:300px}
.orbit-logo-wrap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:2}
.orbit-logo-wrap img{width:340px;height:auto}
.ring{position:absolute;inset:0;margin:auto;border-radius:50%;animation:hero-ring-spin linear infinite}
.ring-1{width:460px;height:160px;border:2.5px solid rgba(45,45,190,.65);animation-duration:14s}
.ring-2{width:360px;height:126px;border:2px dashed rgba(74,154,92,.6);animation-duration:10s;animation-direction:reverse}
@keyframes hero-ring-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.orbit-nodes{position:absolute;inset:0;animation:hero-ring-spin 16s linear infinite}
.o-node{position:absolute;width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.65rem;font-weight:700;color:#fff;animation:hero-ring-spin 16s linear infinite reverse}
.n1{background:var(--cobalt);top:-16px;left:50%;transform:translateX(-50%)}
.n2{background:var(--green);top:50%;right:-16px;transform:translateY(-50%)}
.n3{background:var(--cobalt-light);bottom:-16px;left:50%;transform:translateX(-50%)}
.n4{background:#7B7BCC;top:50%;left:-16px;transform:translateY(-50%)}

.btn-primary{background:var(--cobalt);color:var(--white);border:none;padding:.85rem 2rem;font-size:.85rem;font-family:'DM Sans',sans-serif;font-weight:500;border-radius:2px;cursor:pointer;text-decoration:none;display:inline-block;transition:background .2s,transform .15s}
.btn-primary:hover{background:var(--cobalt-dark);transform:translateY(-1px)}
.btn-outline{background:transparent;color:var(--cobalt);border:1.5px solid var(--cobalt);padding:.85rem 2rem;font-size:.85rem;font-family:'DM Sans',sans-serif;font-weight:500;border-radius:2px;cursor:pointer;text-decoration:none;display:inline-block;transition:background .2s,color .2s}
.btn-outline:hover{background:var(--cobalt);color:var(--white)}

/* ORBIT */
.hero-visual{display:flex;align-items:center;justify-content:center}






@keyframes rspin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}







/* FORMULA */
.formula-strip{background:var(--cobalt);padding:3rem 3rem;display:flex;align-items:center;justify-content:center;gap:2rem;flex-wrap:wrap}
.formula-item{color:rgba(255,255,255,.75);font-size:.88rem}
.formula-item strong{color:#fff;font-weight:600}
.formula-sep{color:rgba(255,255,255,.35);font-size:1.4rem}
.formula-result{color:var(--green-light)!important;font-size:1rem!important;font-weight:700!important}

/* FORMULA HERO — large styled version */
.formula-hero-item{
  font-family:'DM Serif Display',serif;
  font-size:clamp(2rem,4.5vw,3.6rem);
  font-weight:400;
  color:rgba(255,255,255,.9);
  line-height:1.1;
  letter-spacing:-.01em;
}
.formula-hero-item .you{
  color:var(--green-light);
  font-style:italic;
}
.formula-hero-sep{
  font-family:'DM Serif Display',serif;
  font-size:clamp(2rem,4vw,3rem);
  color:rgba(255,255,255,.25);
  font-weight:300;
  padding:0 .5rem;
}
.formula-hero-result{
  color:var(--green-light)!important;
}
.formula-hero-result .you{
  color:#fff;
  font-style:italic;
}

/* SHARED */
.si{max-width:1100px;margin:0 auto}
.lt{display:inline-flex;align-items:center;gap:.5rem;margin-bottom:1rem;justify-content:center}
.lt .bar{width:24px;height:2px;background:var(--green)}
.lt span{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--green);font-weight:600}
.stitle{font-family:'DM Serif Display',serif;font-size:clamp(1.8rem,3.5vw,2.8rem);font-weight:400;line-height:1.2;color:var(--text-dark);margin-bottom:1.5rem;text-align:center}
.stitle em{font-style:italic;color:var(--cobalt)}
.stitle .you{font-style:italic;color:var(--green)}
.bt{color:var(--text-body);font-weight:300;line-height:1.8;margin-bottom:1.25rem;text-align:center}

/* ABOUT */
.about-sec{padding:6rem 3rem;background:var(--off-white);text-align:center}
.about-grid{display:grid;grid-template-columns:1fr;max-width:780px;margin:0 auto;text-align:center}
/* Fade edges */
.ticker-wrap::before,
.ticker-wrap::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  width: 60px;
  z-index: 2;
  pointer-events: none;
}
.ticker-wrap::before {
  left: 0;
  background: linear-gradient(to right, var(--off-white), transparent);
}
.ticker-wrap::after {
  right: 0;
  background: linear-gradient(to left, var(--off-white), transparent);
}
.ticker-track {
  display: flex;
  width: max-content;
  animation: ticker-scroll 32s linear infinite;
}
.ticker-track:hover {
  animation-play-state: paused;
}
@keyframes ticker-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.ticker-item {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  white-space: nowrap;
  padding: 0 2.5rem;
  font-size: .82rem;
  font-weight: 500;
  color: var(--text-body);
  letter-spacing: .04em;
  text-transform: uppercase;
}
.ticker-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
  display: inline-block;
}
.ticker-dot.cobalt { background: var(--cobalt); }
.ticker-dot.green  { background: var(--green); }
.pillars{display:flex;flex-direction:column;gap:1px}
.pillar{background:var(--white);border:1px solid var(--border);padding:1.4rem 1.75rem;display:flex;gap:1.25rem;align-items:flex-start;transition:border-color .2s,box-shadow .2s}
.pillar:hover{border-color:var(--cobalt);box-shadow:0 2px 12px rgba(45,45,190,.08)}
.picon{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:1rem}
.pc{background:rgba(45,45,190,.1)}.pg{background:rgba(74,154,92,.12)}.pm{background:rgba(123,123,204,.15)}
.pillar h4{font-size:.9rem;font-weight:600;color:var(--text-dark);margin-bottom:.2rem}
.pillar p{font-size:.8rem;color:var(--text-muted);font-weight:300;line-height:1.6}

/* SERVICES */
.svc-sec{padding:6rem 3rem}
.svc-accordion{display:none}
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border)}
.svc-grid-wide{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border)}
.sc{background:var(--white);padding:2rem;position:relative;overflow:hidden;transition:background .2s}
.sc::after{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--cobalt);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.sc:hover::after{transform:scaleX(1)}.sc:hover{background:var(--off-white)}
.sc-highlight{background:rgba(45,45,190,.03)}
.sc-icon{font-size:1.75rem;margin-bottom:1rem;display:block}
.sc-num{font-family:'DM Serif Display',serif;font-size:2.5rem;color:rgba(45,45,190,.1);line-height:1;margin-bottom:1rem}
.sc h3{font-family:'DM Serif Display',serif;font-size:1.1rem;font-weight:400;color:var(--text-dark);margin-bottom:.85rem;line-height:1.3}
.sc p{font-size:.85rem;color:var(--text-muted);line-height:1.7;font-weight:300}
.sc-list{list-style:none;margin:0;padding:0}
.sc-list li{font-size:.82rem;color:var(--text-muted);font-weight:300;line-height:1.6;padding:.2rem 0 .2rem 1rem;position:relative}
.sc-list li::before{content:"—";position:absolute;left:0;color:var(--green);font-weight:600}
.sc-tag{display:inline-block;margin-top:1.25rem;padding:.25rem .7rem;background:rgba(45,45,190,.07);color:var(--cobalt);font-size:.68rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;border-radius:2px}

/* EXPERTISE GRID */
.expertise-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;max-width:900px;margin:0 auto}
.exp-chip{padding:.6rem 1.25rem;background:var(--white);border:1px solid var(--border);border-radius:100px;font-size:.85rem;color:var(--text-body);font-weight:400;transition:border-color .2s,color .2s,background .2s}
.exp-chip:hover{border-color:var(--cobalt);color:var(--cobalt);background:rgba(45,45,190,.04)}

/* WHY */
.why-sec{padding:6rem 3rem;background:var(--text-dark)}
.why-sec .lt .bar{background:var(--green)}
.why-sec .lt span{color:var(--green)}
.why-sec .stitle{color:var(--white)}
.why-sec .stitle em{color:var(--green)}
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5px;margin-top:3.5rem}
.wc{background:rgba(255,255,255,.04);padding:2rem 1.75rem;border:1px solid rgba(255,255,255,.06);transition:background .2s}
.wc:hover{background:rgba(255,255,255,.08)}
.wicon{font-size:1.5rem;margin-bottom:1rem;display:block}
.wc h4{font-family:'DM Serif Display',serif;font-size:1.05rem;color:var(--white);margin-bottom:.6rem;font-weight:400}
.wc p{font-size:.82rem;color:rgba(255,255,255,.5);font-weight:300;line-height:1.65}

/* CLIENTS */
.clients-sec{padding:4.5rem 3rem;background:var(--light-gray);text-align:center}
.cl-label{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text-muted);margin-bottom:2rem;font-weight:500}
.cl-wrap{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem}
.chip{padding:.55rem 1.2rem;background:var(--white);border:1px solid var(--border);border-radius:100px;font-size:.82rem;color:var(--text-body);transition:border-color .2s,color .2s}
.chip:hover{border-color:var(--cobalt);color:var(--cobalt)}

/* TEAM */
.team-sec{padding:6rem 3rem}
.team-card{background:var(--off-white);border:1px solid var(--border);display:grid;grid-template-columns:300px 1fr;overflow:hidden;border-radius:4px}
.team-left{background:var(--cobalt);padding:2.5rem 2rem;display:flex;flex-direction:column;justify-content:space-between}
.team-photo{width:200px;height:200px;object-fit:cover;border-radius:50%;display:block;filter:drop-shadow(0 6px 24px rgba(0,0,0,.3));margin:0 auto 1.5rem}
.team-name{font-family:'DM Serif Display',serif;font-size:1.4rem;color:var(--white);line-height:1.2;margin-bottom:.3rem}
.team-role{font-size:.75rem;color:rgba(255,255,255,.6);letter-spacing:.08em}
.dom-label{font-size:.68rem;color:rgba(255,255,255,.45);letter-spacing:.1em;text-transform:uppercase;display:block;margin-top:2rem;margin-bottom:.5rem}
.dom-text{font-size:.82rem;color:rgba(255,255,255,.8);display:block;line-height:2}
.team-right{padding:2.5rem}
.team-right p{color:var(--text-body);font-weight:300;line-height:1.8;margin-bottom:1rem}
.team-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.5rem}
.ttag{padding:.3rem .75rem;border:1px solid var(--border);color:var(--text-muted);font-size:.72rem;font-weight:500;border-radius:2px}

/* CONTACT */
.contact-sec{padding:7rem 3rem;background:var(--off-white)}
.contact-inner{max-width:700px;margin:0 auto;text-align:center}
.contact-sub{font-size:1rem;color:var(--text-body);font-weight:300;max-width:480px;margin:1.25rem auto 2.5rem;line-height:1.75}
.contact-card{background:var(--cobalt);border-radius:12px;padding:3rem 3.5rem;display:inline-block;text-align:left;min-width:360px;box-shadow:0 12px 40px rgba(45,45,190,.3)}
.cc-name{font-family:'DM Serif Display',serif;font-size:1.8rem;color:var(--white);margin-bottom:2rem;font-weight:400}
.cc-line{display:flex;align-items:flex-start;gap:1rem;margin-bottom:1rem}
.ikon{font-size:1.2rem;flex-shrink:0;margin-top:.1rem}
.txt{font-size:1rem;color:rgba(255,255,255,.85);line-height:1.7}
.cc-divider{border:none;border-top:1px solid rgba(255,255,255,.15);margin:1.75rem 0}
.cc-mobile{display:flex;align-items:center;gap:1rem}
.cc-mobile a{font-size:1.1rem;color:var(--green-light);font-weight:600;text-decoration:none;letter-spacing:.02em}
.cc-mobile a:hover{text-decoration:underline}

/* FOOTER */
footer{border-top:1px solid var(--border);padding:1.75rem 3rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;background:var(--white)}
footer img{height:38px;width:auto}
footer p{font-size:.75rem;color:var(--text-muted)}
.footer-links{display:flex;gap:1.5rem}
.footer-links a{font-size:.75rem;color:var(--text-muted);text-decoration:none}
.footer-links a:hover{color:var(--cobalt)}
.footer-sep{color:var(--border);font-size:.75rem}

/* REVEAL */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .55s ease,transform .55s ease}
.reveal.visible{opacity:1;transform:none}

/* RESPONSIVE */



/* ═══════════════════════════════════════════
   SERVICES ORBIT DIAGRAM — ROTATING
═══════════════════════════════════════════ */
.svc-sec { padding: 6rem 3rem; }

.services-orbit {
  position: relative;
  width: 740px;
  height: 740px;
  margin: 0 auto;
  user-select: none;
}

/* Decorative background rings */
.services-orbit::before {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 600px; height: 600px;
  border-radius: 50%;
  border: 2px dashed rgba(45,45,190,0.4);
  pointer-events: none;
  z-index: 0;
}
.services-orbit::after {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 660px; height: 660px;
  border-radius: 50%;
  border: 1.5px solid rgba(74,154,92,0.3);
  pointer-events: none;
  z-index: 0;
}

/* Centre logo — stays perfectly still */
.orbit-centre {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 220px; height: 220px;
  border-radius: 50%;
  background: var(--white);
  border: 2px solid rgba(45,45,190,0.15);
  box-shadow:
    0 0 0 8px rgba(45,45,190,0.04),
    0 8px 48px rgba(45,45,190,0.14);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  transition: z-index 0s;
}
.orbit-centre img {
  width: 175px;
  height: auto;
}

/* The rotating ring that holds all nodes */
.orbit-ring {
  position: absolute;
  inset: 0;
  animation: orbit-spin 28s linear infinite;
  transform-origin: center center;
  z-index: 1;
}

/* Pause rotation when hovering any node */
.orbit-ring:hover {
  animation-play-state: paused;
}

@keyframes orbit-spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* Each node — placed around the ring using CSS custom property */
.orbit-node {
  position: absolute;
  top: 50%; left: 50%;
  --angle: calc(var(--i) * (360deg / 9));
  /* Move to ring position, then counter-rotate so circle stays upright */
  transform:
    translate(-50%, -50%)
    rotate(var(--angle))
    translateY(-300px)
    rotate(calc(-1 * var(--angle)));
  z-index: 2;
  transition: z-index 0s;
}

/* Counter-rotate node contents so they stay upright as ring spins */
.orbit-node .node-circle,
.orbit-node .node-popup {
  animation: orbit-counter 28s linear infinite;
}
.orbit-ring:hover .node-circle,
.orbit-ring:hover .node-popup {
  animation-play-state: paused;
}
@keyframes orbit-counter {
  from { transform: rotate(0deg); }
  to   { transform: rotate(-360deg); }
}

/* The visible circle button */
.node-circle {
  width: 96px; height: 96px;
  border-radius: 50%;
  background: var(--white);
  border: 2px solid rgba(45,45,190,0.18);
  box-shadow: 0 4px 20px rgba(45,45,190,0.1);
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: .3rem;
  cursor: pointer;
  transition: border-color .25s, box-shadow .25s, background .25s;
  text-align: center;
  padding: .6rem;
  /* Override the counter-rotate — handled by animation */
}
.node-icon {
  font-size: 1.55rem;
  line-height: 1;
  display: block;
}
.node-label {
  font-size: .54rem;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  line-height: 1.3;
  text-align: center;
  display: block;
}

/* Circle hover state */
.orbit-node:hover .node-circle {
  border-color: var(--cobalt);
  background: var(--cobalt);
  box-shadow: 0 8px 32px rgba(45,45,190,0.4);
}
.orbit-node:hover .node-icon { filter: brightness(10); }
.orbit-node:hover .node-label { color: rgba(255,255,255,.9); }


/* Boost hovered node above ALL siblings and the ring */
.orbit-node:hover {
  z-index: 9999 !important;
}

/* Popup card */
.node-popup {
  position: absolute;
  /* default position — will be overridden per popup direction */
  bottom: calc(100% + 12px);
  left: 50%;
  transform: translateX(-50%) rotate(0deg) scale(.9);
  width: 270px;
  background: var(--white);
  border: 1px solid var(--border);
  border-top: 3px solid var(--cobalt);
  border-radius: 8px;
  padding: 1.1rem 1.25rem;
  box-shadow: 0 16px 48px rgba(45,45,190,0.2);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
  z-index: 999999;
  /* Always show above everything */
}
.orbit-node:hover .node-popup {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) rotate(0deg) scale(1);
}
.node-popup h4 {
  font-family: 'DM Serif Display', serif;
  font-size: .95rem;
  font-weight: 400;
  color: var(--cobalt);
  margin-bottom: .55rem;
  line-height: 1.3;
}
.popup-sub {
  font-size: .7rem;
  color: var(--green);
  font-weight: 600;
  letter-spacing: .04em;
  margin-bottom: .55rem;
  display: block;
}
.node-popup ul {
  list-style: none;
  padding: 0; margin: 0;
}
.node-popup ul li {
  font-size: .78rem;
  color: var(--text-body);
  font-weight: 300;
  line-height: 1.55;
  padding: .18rem 0 .18rem .9rem;
  position: relative;
}
.node-popup ul li::before {
  content: '—';
  position: absolute; left: 0;
  color: var(--green);
  font-weight: 600;
}

/* ── MOBILE FALLBACK ── */


/* When a service node is hovered, ensure popup clears the logo */
.orbit-ring:has(.orbit-node:hover) ~ .orbit-centre {
  z-index: 0 !important;
}

/* ── HAMBURGER MENU ── */
.nav-hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: .4rem;
  z-index: 200;
}
.nav-hamburger span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--text-dark);
  border-radius: 2px;
  transition: transform .25s ease, opacity .25s ease;
  transform-origin: center;
}
.nav-hamburger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-hamburger.is-open span:nth-child(2) { opacity: 0; }
.nav-hamburger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.nav-cta-mobile { display: none; }

.svc-accordion { display: none; }
@media (max-width: 768px) {
  /* ── Hero ── */
  .hero { padding: 6rem 1.5rem 3.5rem; min-height: auto; }
  .hero-orbit-wrap { margin-bottom: 2rem; }
  .orbit-stage { width: 280px; height: 180px; }
  .ring-1 { width: 280px; height: 100px; }
  .ring-2 { width: 220px; height: 78px; }
  .orbit-logo-wrap img { width: 200px; }
  .o-node { width: 34px; height: 34px; font-size: .55rem; }
  .n1 { top: -12px; } .n2 { right: -12px; } .n3 { bottom: -12px; } .n4 { left: -12px; }
  .hero h1 { font-size: clamp(2rem, 8vw, 2.8rem); }
  .hero-sub { font-size: .95rem; }

  .nav-hamburger { display: flex; }
  .nav-cta-desktop { display: none; }

  /* Full-screen mobile menu */
  .nav-links {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: var(--white);
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2rem;
    z-index: 150;
    opacity: 0;
    pointer-events: none;
    transition: opacity .25s ease;
    display: flex;
  }
  .nav-links.nav-open {
    opacity: 1;
    pointer-events: auto;
  }
  .nav-links a {
    font-size: 1.2rem;
    letter-spacing: .08em;
    color: var(--text-dark);
  }
  .nav-links a:hover { color: var(--cobalt); }

  /* CTA inside mobile menu */
  .nav-cta-mobile {
    display: block;
    margin-top: 1rem;
  }
  .nav-cta-mobile a {
    background: var(--cobalt);
    color: var(--white) !important;
    padding: .75rem 2rem;
    border-radius: 2px;
    font-size: .85rem !important;
    display: inline-block;
  }
}

/* ═══════════════════════════════════════════════════
   RESPONSIVE — TABLET (≤ 1024px)
═══════════════════════════════════════════════════ */
@media (max-width: 1024px) {
  .services-orbit {
    width: 640px;
    height: 640px;
  }
  .services-orbit::before { width: 520px; height: 520px; }
  .services-orbit::after  { width: 580px; height: 580px; }
}

/* ═══════════════════════════════════════════════════
   RESPONSIVE — MOBILE (≤ 768px)
═══════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* ── NAV ── */
  nav {
    padding: .85rem 1.25rem;
  }
  .nav-links { display: none; }
  .nav-logo img { height: 40px; }

  /* ── HERO ── */
  .hero {
    grid-template-columns: 1fr;
    padding: 6rem 1.25rem 3rem;
    gap: 2rem;
    min-height: auto;
  }
  
  .hero h1 { font-size: clamp(2rem, 8vw, 3rem); }
  .hero-sub { font-size: .95rem; max-width: 100%; }
  .hero-actions { flex-direction: column; gap: .75rem; }
  .btn-primary, .btn-outline { text-align: center; padding: .85rem 1.5rem; width: 100%; }

  /* ── FORMULA STRIP ── */
  .formula-strip {
    padding: 2rem 1.25rem;
    gap: 1rem;
    flex-wrap: wrap;
    justify-content: center;
  }
  .formula-hero-item { font-size: clamp(1.4rem, 6vw, 2rem); }
  .formula-hero-sep  { font-size: clamp(1.2rem, 5vw, 1.8rem); padding: 0 .25rem; }

  /* ── TICKER ── */
  .ticker-item { font-size: .72rem; padding: 0 1.5rem; }

  /* ── ABOUT ── */
  .about-sec { padding: 3.5rem 1.25rem; }
  .about-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .stitle { font-size: clamp(1.5rem, 6vw, 2.2rem); }
  .pillars { gap: .75rem; }
  .pillar { padding: 1rem 1.25rem; gap: 1rem; }

  /* ── SERVICES ORBIT → ACCORDION ── */
  .svc-sec { padding: 3.5rem 1.25rem; }

  /* Hide the desktop orbit entirely */
  .services-orbit {
    display: none !important;
  }

  /* Show accordion */
  .svc-accordion {
    display: block;
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
  }
  .acc-item {
    border-bottom: 1px solid var(--border);
  }
  .acc-item:last-child { border-bottom: none; }

  .acc-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    cursor: pointer;
    background: var(--white);
    transition: background .2s;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
  }
  .acc-item.open .acc-header {
    background: rgba(45,45,190,.05);
    border-bottom: 1px solid var(--border);
  }
  .acc-header-left {
    display: flex;
    align-items: center;
    gap: .75rem;
  }
  .acc-icon { font-size: 1.3rem; }
  .acc-label {
    font-size: .9rem;
    font-weight: 600;
    color: var(--text-dark);
    line-height: 1.3;
  }
  .acc-item.open .acc-label { color: var(--cobalt); }
  .acc-chevron {
    font-size: .7rem;
    color: var(--text-muted);
    transition: transform .25s ease;
    flex-shrink: 0;
    margin-left: .5rem;
  }
  .acc-item.open .acc-chevron { transform: rotate(180deg); }

  .acc-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height .35s ease, padding .3s ease;
    padding: 0 1.25rem;
    background: var(--off-white);
    border-left: 3px solid var(--cobalt);
  }
  .acc-item.open .acc-body {
    max-height: 600px;
    padding: 1rem 1.25rem 1.25rem;
  }
  .acc-body h4 {
    font-family: 'DM Serif Display', serif;
    font-size: 1rem;
    font-weight: 400;
    color: var(--cobalt);
    margin-bottom: .6rem;
    line-height: 1.3;
  }
  .acc-body .popup-sub {
    font-size: .72rem;
    color: var(--green);
    font-weight: 600;
    margin-bottom: .6rem;
    display: block;
  }
  .acc-body ul { list-style: none; padding: 0; margin: 0; }
  .acc-body ul li {
    font-size: .82rem;
    color: var(--text-body);
    font-weight: 300;
    line-height: 1.6;
    padding: .2rem 0 .2rem .9rem;
    position: relative;
  }
  .acc-body ul li::before {
    content: '—';
    position: absolute; left: 0;
    color: var(--green);
    font-weight: 600;
  }


  /* ── WHY SECTION ── */
  .why-sec { padding: 3.5rem 1.25rem; }
  .why-grid {
    grid-template-columns: 1fr 1fr;
    gap: 1px;
    margin-top: 2rem;
  }
  .wc { padding: 1.25rem 1rem; }

  /* ── EXPERTISE / CLIENTS ── */
  .clients-sec { padding: 3.5rem 1.25rem; }
  .expertise-grid { gap: .5rem; }
  .exp-chip { font-size: .78rem; padding: .5rem 1rem; }
  .cl-wrap { gap: .5rem; }
  .chip { font-size: .78rem; padding: .45rem 1rem; }

  /* ── TEAM ── */
  .team-sec { padding: 3.5rem 1.25rem; }
  .team-card { grid-template-columns: 1fr; }
  .team-left { padding: 2rem 1.5rem; }
  .team-photo { width: 160px; height: 160px; }
  .team-right { padding: 1.5rem; }
  .team-right p { font-size: .88rem; }
  .team-tags { gap: .4rem; }
  .ttag { font-size: .68rem; }

  /* ── CONTACT ── */
  .contact-sec { padding: 3.5rem 1.25rem; }
  .contact-card {
    min-width: unset;
    width: 100%;
    padding: 2rem 1.5rem;
    border-radius: 8px;
  }
  .cc-name { font-size: 1.4rem; margin-bottom: 1.5rem; }
  .cc-line .txt { font-size: .92rem; }
  .cc-mobile a { font-size: 1rem; }

  /* ── FOOTER ── */
  footer {
    padding: 1.5rem 1.25rem;
    flex-direction: column;
    text-align: center;
    gap: 1rem;
  }
  footer img { height: 32px; }
  .footer-links {
    flex-wrap: wrap;
    justify-content: center;
    gap: .75rem;
  }
  .footer-sep { display: none; }
}

/* ═══════════════════════════════════════════════════
   RESPONSIVE — SMALL MOBILE (≤ 420px)
═══════════════════════════════════════════════════ */
@media (max-width: 420px) {
  .hero h1 { font-size: 1.85rem; }
  .formula-hero-item { font-size: 1.3rem; }
  .formula-hero-sep  { font-size: 1.1rem; }
  .why-grid { grid-template-columns: 1fr; }
  .node-label { font-size: .7rem; }
  .contact-card { padding: 1.5rem 1.25rem; }
  .cc-name { font-size: 1.2rem; }
  .legal-hero { padding: 6rem 1.25rem 2.5rem; }
  .legal-body { padding: 2.5rem 1.25rem 3rem; }
  .legal-body h2 { font-size: 1.1rem; }
}


/* SPLIT CONTRAST BLOCK */
.split-contrast {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid var(--border);
  margin-top: 2.5rem;
}
.split-left {
  background: var(--cobalt);
  padding: 1.75rem 2rem;
}
.split-right {
  background: var(--white);
  padding: 1.75rem 2rem;
  border-left: 1px solid var(--border);
}
.split-eyebrow {
  font-size: .68rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: rgba(255,255,255,.55);
  font-weight: 600;
  margin-bottom: .75rem;
}
.split-eyebrow-green {
  font-size: .68rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--green);
  font-weight: 600;
  margin-bottom: .75rem;
}
.split-text {
  font-family: 'DM Serif Display', serif;
  font-size: 1.35rem;
  color: var(--white);
  line-height: 1.35;
  font-weight: 400;
}
.split-text-cobalt {
  font-family: 'DM Serif Display', serif;
  font-size: 1.35rem;
  color: var(--cobalt);
  line-height: 1.35;
  font-weight: 400;
}
@media (max-width: 600px) {
  .split-contrast { grid-template-columns: 1fr; }
  .split-right { border-left: none; border-top: 1px solid var(--border); }
}

/* FLOATING ATTRIBUTE CARDS */
.attr-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
  margin-top: 2.5rem;
}
.attr-card {
  background: var(--white);
  border-radius: 12px;
  padding: 1.4rem 1.5rem;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  box-shadow: 0 2px 8px rgba(45,45,190,0.06), 0 8px 24px rgba(45,45,190,0.08);
  border: 1px solid rgba(45,45,190,0.07);
  transition: transform .25s ease, box-shadow .25s ease;
}
.attr-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 16px rgba(45,45,190,0.1), 0 16px 40px rgba(45,45,190,0.13);
}
.attr-icon { font-size: 1.6rem; line-height: 1; margin-bottom: .2rem; }
.attr-title { font-family: 'DM Serif Display', serif; font-size: 1rem; font-weight: 400; color: var(--cobalt); line-height: 1.25; }
.attr-desc { font-size: .8rem; color: var(--text-muted); font-weight: 300; line-height: 1.6; }

/* ── GLOBAL CENTRED ALIGNMENT ── */
.si { text-align: center; }
.lt { justify-content: center; }
.stitle { text-align: center; }
.bt { text-align: center; }

/* About */
.about-sec .about-grid { text-align: center; }
.about-sec .split-contrast { text-align: left; }
.about-sec .attr-cards { text-align: left; }

/* Why section */
.why-sec .si { text-align: center; }
.wc { text-align: center; }

/* Team section */
.team-right { text-align: left; }
.team-tags  { justify-content: center; }

/* Contact */
.contact-inner { text-align: center; }
.contact-card  { text-align: left; }

/* Services hint */
.svc-hint { text-align: center; }

/* Clients / expertise */
.clients-sec { text-align: center; }

@media (max-width: 600px) { .attr-cards { grid-template-columns: 1fr; } }

/* Keep card internals left-aligned */
.attr-card { text-align: left; }
.team-right { text-align: left; }
.team-right p { text-align: left; }
.node-popup { text-align: left; }
.acc-body { text-align: left; }
.pillar { text-align: left; }
.split-left, .split-right { text-align: left; }
.contact-card { text-align: left; }

/* Why cards centred */
.wc { text-align: center; }
.wc h4 { text-align: center; }
.wc p  { text-align: center; }

/* Section headers always centred */
.services-header { text-align: center; }
.team-header { text-align: center; }
.why-header { text-align: center; }

/* Buttons centred in hero */
.hero-actions { justify-content: center; }

/* ── FLOATING EXPERTISE CHIPS ── */
@keyframes chip-float {
  0%   { transform: translateY(0px);   box-shadow: 0 4px 12px rgba(45,45,190,0.10); }
  50%  { transform: translateY(-8px);  box-shadow: 0 12px 24px rgba(45,45,190,0.16); }
  100% { transform: translateY(0px);   box-shadow: 0 4px 12px rgba(45,45,190,0.10); }
}

.float-chip {
  animation: chip-float 3.6s ease-in-out infinite;
  animation-delay: var(--d, 0s);
  transition: transform .2s ease, background .2s, color .2s, border-color .2s;
  will-change: transform;
}

.float-chip:hover {
  animation-play-state: paused;
  transform: translateY(-10px) scale(1.06);
  background: var(--cobalt);
  color: var(--white);
  border-color: var(--cobalt);
  box-shadow: 0 14px 32px rgba(45,45,190,0.22);
}

/* Stagger float direction slightly for visual variety */
.float-chip:nth-child(even) {
  animation-name: chip-float-alt;
}

@keyframes chip-float-alt {
  0%   { transform: translateY(0px);   box-shadow: 0 4px 12px rgba(74,154,92,0.10); }
  50%  { transform: translateY(-6px);  box-shadow: 0 10px 20px rgba(74,154,92,0.15); }
  100% { transform: translateY(0px);   box-shadow: 0 4px 12px rgba(74,154,92,0.10); }
}

.float-chip:nth-child(even):hover {
  animation-play-state: paused;
  transform: translateY(-10px) scale(1.06);
  background: var(--cobalt);
  color: var(--white);
  border-color: var(--cobalt);
  box-shadow: 0 14px 32px rgba(45,45,190,0.22);
}

/* ── WHY CHOOSE US — NO DESCRIPTION, FLOAT ANIMATION ── */

/* Compact card without description */
.wc {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2.25rem 1.5rem;
  min-height: 140px;
  cursor: default;
}
.wicon { font-size: 2rem; margin-bottom: .85rem; display: block; }
.wc h4 {
  font-family: 'DM Serif Display', serif;
  font-size: 1rem;
  font-weight: 400;
  color: var(--white);
  text-align: center;
  line-height: 1.35;
  margin: 0;
}
/* Remove old p styling inside wc */
.wc p { display: none; }

/* Float animation */
@keyframes why-float {
  0%   { transform: translateY(0px); }
  50%  { transform: translateY(-10px); }
  100% { transform: translateY(0px); }
}

.why-float {
  animation: why-float 3.2s ease-in-out infinite;
  animation-delay: var(--wd, 0s);
  transition: background .25s, box-shadow .25s;
}

.why-float:hover {
  animation-play-state: paused;
  transform: translateY(-12px);
  background: rgba(255,255,255,0.12);
  box-shadow: 0 16px 40px rgba(0,0,0,0.25);
}

/* Alternating float heights for organic feel */
.why-float:nth-child(even) {
  animation-name: why-float-alt;
}
@keyframes why-float-alt {
  0%   { transform: translateY(0px); }
  50%  { transform: translateY(-7px); }
  100% { transform: translateY(0px); }
}
.why-float:nth-child(even):hover {
  animation-play-state: paused;
  transform: translateY(-12px);
}

/* ══════════════════════════════════════
   CONTACT FORM — Green theme from logo
══════════════════════════════════════ */
.contact-form {
  width: 100%;
  max-width: 680px;
  margin: 0 auto;
  background: var(--white);
  border: 2px solid var(--green);
  border-radius: 10px;
  overflow: hidden;
  text-align: left;
  box-shadow: 0 4px 24px rgba(74,154,92,0.12);
}
.cf-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid rgba(74,154,92,0.2);
}
.cf-row.cf-single {
  grid-template-columns: 1fr;
}
.cf-field {
  padding: 1.1rem 1.5rem;
  border-right: 1px solid rgba(74,154,92,0.2);
}
.cf-field:last-child { border-right: none; }
.cf-field label {
  display: block;
  font-size: .68rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--green);
  font-weight: 600;
  margin-bottom: .4rem;
}
.cf-field input,
.cf-field select,
.cf-field textarea {
  width: 100%;
  background: transparent;
  border: none;
  outline: none;
  color: var(--text-dark);
  font-family: 'DM Sans', sans-serif;
  font-size: .92rem;
  font-weight: 400;
  padding: 0;
  resize: none;
}
.cf-field input:focus,
.cf-field select:focus,
.cf-field textarea:focus {
  outline: none;
}
.cf-field input::placeholder,
.cf-field textarea::placeholder { color: var(--text-muted); font-weight: 300; }
.cf-field select option { background: var(--white); }
.cf-field textarea { min-height: 110px; resize: vertical; }
.cf-submit {
  padding: 1.5rem;
  background: rgba(74,154,92,0.06);
  text-align: center;
  border-top: 2px solid var(--green);
}
.cf-submit .btn-primary {
  background: var(--green);
  color: var(--white);
}
.cf-submit .btn-primary:hover {
  background: #3a7a49;
}
.cf-note {
  font-size: .75rem;
  color: var(--text-muted);
  margin-top: .75rem;
  text-align: center;
}

@media (max-width: 768px) {
  .cf-row { grid-template-columns: 1fr; }
  .cf-field { border-right: none; }
}

/* TM superscript */
sup.tm {
  font-size: .5em;
  vertical-align: super;
  font-weight: 400;
  letter-spacing: 0;
  opacity: .75;
}

/* ── HERO TAGLINE — "your success formula" ── */
.hero-tagline {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 1.5rem;
}
.hero-tagline-img {
  height: 52px;
  width: auto;
  opacity: 0.92;
  filter: drop-shadow(0 2px 8px rgba(45,45,190,0.12));
  animation: tagline-float 4s ease-in-out infinite;
}
@keyframes tagline-float {
  0%, 100% { transform: translateY(0px); }
  50%       { transform: translateY(-5px); }
}
@media (max-width: 768px) {
  .hero-tagline-img { height: 38px; }
}
