/* =========================================================
   Account Caddie — stylesheet
   Design tokens sourced from the New Generation Group
   Brand Identity Guidelines (2026): Badlands Orange primary,
   Cool Gray secondary, Navy accent. Montserrat + Poppins.
   ========================================================= */

:root{
  /* --- New Generation Group CI palette --- */
  --orange-500:#f5831f;   /* Badlands Orange — primary/main */
  --orange-600:#e97b26;   /* Marigold */
  --orange-700:#d76027;   /* 717 C */

  --gray-100:#c2c2c2;     /* Cool Gray 8 C */
  --gray-300:#9da4b0;     /* Cool Gray 7 C */
  --gray-500:#818181;     /* Cool Gray 11 C — main grey */

  --navy-900:#0d1527;     /* 296 C — darkest */
  --navy-800:#13274b;     /* 540 C — main navy */
  --navy-700:#162847;     /* 648 C */

  --paper:#f7f7f8;
  --paper-dim:#eeeef0;
  --ink:#1b1d22;
  --white:#ffffff;

  /* glass */
  --glass-fill-dark: rgba(255,255,255,0.08);
  --glass-fill-dark-strong: rgba(255,255,255,0.14);
  --glass-border-dark: rgba(255,255,255,0.20);
  --glass-fill-light: rgba(255,255,255,0.6);
  --glass-border-light: rgba(255,255,255,0.8);

  /* semantic tokens — flipped by [data-theme="dark"] below.
     Fixed-dark sections (hero/process/group/cta/footer) use the
     raw --navy-* / --glass-*-dark tokens directly and are
     intentionally unaffected by the theme switch. */
  --surface: var(--paper);
  --surface-dim: var(--paper-dim);
  --text-ink: var(--ink);
  --text-strong: var(--navy-800);
  --text-muted: var(--gray-500);
  --card-bg: var(--glass-fill-light);
  --card-border: var(--glass-border-light);
  --card-border-strong: rgba(13,21,39,.1);

  /* type — per CI guide: Montserrat primary, Poppins secondary */
  --font-display:'Montserrat', 'Segoe UI', sans-serif;
  --font-body:'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  --radius-lg: 26px;
  --radius-md: 18px;
  --radius-sm: 10px;

  --ease: cubic-bezier(.22,.9,.32,1);
}

/* =============== dark mode =============== */
:root[data-theme="dark"]{
  --surface:#0f1420;
  --surface-dim:#141a29;
  --text-ink:#e9eaed;
  --text-strong:#f3f4f6;
  --text-muted:#a7acb8;
  --card-bg: rgba(255,255,255,0.055);
  --card-border: rgba(255,255,255,0.14);
  --card-border-strong: rgba(255,255,255,0.14);
}

.theme-toggle{
  width:38px; height:38px;
  border-radius:50%;
  border:1px solid var(--glass-border-dark);
  background:var(--glass-fill-dark);
  color:var(--white);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  flex-shrink:0;
  transition:background .3s;
}
.theme-toggle:hover{ background:var(--glass-fill-dark-strong); }
.theme-toggle svg{ width:18px; height:18px; }
.theme-toggle .icon-moon{ display:none; }
:root[data-theme="dark"] .theme-toggle .icon-sun{ display:none; }
:root[data-theme="dark"] .theme-toggle .icon-moon{ display:block; }

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}

body{
  margin:0;
  font-family:var(--font-body);
  color:var(--text-ink);
  background:var(--surface);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{ max-width:100%; display:block; }
a{ color:inherit; }
h1,h2,h3,h4{ font-family:var(--font-display); margin:0; line-height:1.08; font-weight:700; }
p{ margin:0; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family:inherit; }

:focus-visible{
  outline:3px solid var(--orange-500);
  outline-offset:3px;
  border-radius:6px;
}

.container{
  width:100%;
  max-width:1240px;
  margin-inline:auto;
  padding-inline:24px;
}

.eyebrow{
  font-family:var(--font-body);
  font-size:12.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:600;
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.eyebrow::before{
  content:'';
  width:7px;height:7px;border-radius:50%;
  background:var(--orange-500);
  box-shadow:0 0 0 4px rgba(245,131,31,0.2);
}

/* =============== glass utility =============== */
.glass-dark{
  background:var(--glass-fill-dark);
  border:1px solid var(--glass-border-dark);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
}
.glass-light{
  background:var(--glass-fill-light);
  border:1px solid var(--glass-border-light);
  backdrop-filter: blur(20px) saturate(160%);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
}

/* =============== buttons =============== */
.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:14px 26px;
  border-radius:999px;
  font-weight:600;
  font-size:15px;
  cursor:pointer;
  border:1px solid transparent;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), background .3s;
  text-decoration:none;
  white-space:nowrap;
}
.btn:hover{ transform:translateY(-2px); }
.btn-orange{
  background:linear-gradient(135deg,var(--orange-500),var(--orange-700));
  color:var(--white);
  box-shadow:0 10px 30px -10px rgba(245,131,31,.55);
}
.btn-orange:hover{ box-shadow:0 16px 34px -10px rgba(245,131,31,.7); }
.btn-ghost-dark{
  color:var(--white);
  background:var(--glass-fill-dark);
  border-color:var(--glass-border-dark);
  backdrop-filter: blur(14px);
}
.btn-ghost-dark:hover{ background:var(--glass-fill-dark-strong); }
.btn-ghost-light{
  color:var(--navy-800);
  background:var(--glass-fill-light);
  border-color:rgba(13,21,39,.16);
}
.btn-ghost-light:hover{ background:#fff; }
.btn svg{ width:16px;height:16px; transition:transform .35s var(--ease); }
.btn:hover svg{ transform:translate(3px,-2px); }

/* =============== nav =============== */
.site-nav{
  position:fixed; top:16px; left:0; right:0; z-index:100;
  display:flex; justify-content:center;
}
.nav-inner{
  width:min(1160px, calc(100% - 32px));
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 14px 10px 20px;
  border-radius:999px;
  color:var(--white);
  transition:background .3s, box-shadow .3s;
}
.nav-brand{
  display:flex; align-items:center; gap:10px;
  font-family:var(--font-display); font-weight:700; font-size:19px;
  letter-spacing:.005em;
  text-decoration:none;
  color:var(--white);
}
.logo-img{
  display:block;
  height:64px;
  width:auto;
}
.nav-links{
  display:flex; align-items:center; gap:28px;
  font-size:14.5px; font-weight:500;
}
.nav-links a{
  text-decoration:none; opacity:.85; transition:opacity .25s;
  position:relative;
}
.nav-links a:hover{ opacity:1; }
.nav-cta{ display:flex; align-items:center; gap:14px; }
.nav-toggle{
  display:none;
  background:none;border:none;color:var(--white);
  width:40px;height:40px;border-radius:50%;
  align-items:center;justify-content:center;
  cursor:pointer;
}

/* =============== hero =============== */
.hero{
  position:relative;
  min-height:100vh;
  display:flex; align-items:center;
  padding-top:120px; padding-bottom:90px;
  background:
    radial-gradient(ellipse 85% 60% at 12% -8%, rgba(245,131,31,.32), transparent 60%),
    radial-gradient(ellipse 65% 55% at 100% 8%, rgba(245,131,31,.18), transparent 55%),
    linear-gradient(160deg, var(--navy-900) 0%, var(--navy-800) 55%, var(--navy-700) 100%);
  color:var(--white);
  overflow:hidden;
  isolation:isolate;
}
.hero::before{
  content:'';
  position:absolute; inset:0;
  background-image:radial-gradient(rgba(255,255,255,.14) 1px, transparent 1.4px);
  background-size:26px 26px;
  mask-image:radial-gradient(ellipse 65% 55% at 78% 35%, black 0%, transparent 72%);
  -webkit-mask-image:radial-gradient(ellipse 65% 55% at 78% 35%, black 0%, transparent 72%);
  opacity:.7;
  z-index:1;
  pointer-events:none;
}

/* hero background video — faded into the navy/orange wash, not a flat
   overlay: a diagonal mask keeps it clear of the headline on the left
   and a screen blend lets the brand gradient tint it rather than sit
   on top of it. */
.hero-video-wrap{
  position:absolute; inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
}
.hero-video{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  opacity:.55;
  mix-blend-mode:screen;
  filter:saturate(1.15);
  mask-image:
    linear-gradient(115deg, transparent 2%, black 42%, black 100%),
    linear-gradient(to bottom, transparent 0%, black 18%, black 82%, transparent 100%);
  -webkit-mask-image:
    linear-gradient(115deg, transparent 2%, black 42%, black 100%),
    linear-gradient(to bottom, transparent 0%, black 18%, black 82%, transparent 100%);
  mask-composite:intersect;
  -webkit-mask-composite:source-in;
}
.hero-video-wrap::after{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(100deg, var(--navy-900) 0%, rgba(13,21,39,.75) 30%, rgba(13,21,39,.15) 55%, transparent 75%);
}
@media (max-width:860px), (prefers-reduced-motion: reduce){
  .hero-video{ display:none; }
}

.hero .container{
  position:relative; z-index:2;
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:56px;
  align-items:center;
}
.hero-copy .eyebrow{ color:var(--orange-500); margin-bottom:22px; }
.hero-copy h1{
  font-size:clamp(2.5rem, 4.3vw, 4.1rem);
  letter-spacing:-.015em;
  color:var(--white);
}
.hero-copy h1 span{
  color:var(--orange-500);
}
.hero-copy .lede{
  margin-top:24px;
  font-size:18px;
  line-height:1.65;
  max-width:46ch;
  color:rgba(255,255,255,.78);
}
.hero-actions{
  display:flex; align-items:center; gap:16px; flex-wrap:wrap;
  margin-top:38px;
}
.hero-proof{
  margin-top:46px;
  display:flex; gap:36px; flex-wrap:wrap;
}
.hero-proof div{ display:flex; flex-direction:column; gap:4px; }
.hero-proof strong{
  font-family:var(--font-mono); font-size:26px; color:var(--white);
}
.hero-proof span{
  font-size:12.5px; color:rgba(255,255,255,.55); text-transform:uppercase; letter-spacing:.08em;
}

/* floating interactive globe — no card, no backdrop: just the globe,
   sized deliberately larger than its grid column so it reads as an
   object floating over the layout rather than boxed content. */
.hero-globe{
  position:relative;
  width:100%;
  max-width:840px;
  height:840px;
  margin-inline:auto;
  pointer-events:auto;
  animation: float 7s ease-in-out infinite;
}
@keyframes float{
  0%,100%{ transform:translateY(0px) rotate(-.4deg); }
  50%{ transform:translateY(-14px) rotate(.4deg); }
}
.hero-globe-frame{
  position:absolute; inset:0;
  width:100%; height:100%;
  border:0;
  display:block;
  background:transparent;
}
@media (prefers-reduced-motion: reduce){
  .hero-globe{ animation:none; }
}
@media (max-width:1180px){
  .hero-globe{ max-width:680px; height:680px; }
}
@media (max-width:860px){
  .hero-globe{ max-width:540px; height:540px; }
}
@media (max-width:640px){
  .hero-globe{ max-width:450px; height:450px; }
}

/* =============== section shell =============== */
section{ position:relative; }
.section-pad{ padding-block:120px; }
.section-head{
  max-width:640px;
  margin-bottom:60px;
}
.section-head .eyebrow{ color:var(--orange-600); margin-bottom:16px; }
.section-head h2{
  font-size:clamp(2rem,3.4vw,3rem);
  letter-spacing:-.01em;
  color:var(--text-strong);
}
.section-head p{
  margin-top:18px; font-size:17px; line-height:1.65; color:var(--text-muted);
}
.on-dark .section-head h2{ color:var(--white); }
.on-dark .section-head p{ color:rgba(255,255,255,.7); }
.on-dark .section-head .eyebrow{ color:var(--orange-500); }

/* =============== services =============== */
/* =============== works-with logo marquee =============== */
/* Fixed white band on purpose -- stays white regardless of the site's
   light/dark toggle, so full-colour logo files always sit on the
   background they were designed for. */
.marquee-section{
  background:#ffffff;
  padding-block:48px 54px;
  border-bottom:1px solid rgba(13,21,39,.08);
}
.marquee-label{
  text-align:center;
  font-size:12.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  color:#8a8f98;
  margin-bottom:30px;
}
.marquee-track-wrap{
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg, transparent 0, black 8%, black 92%, transparent 100%);
  mask-image:linear-gradient(90deg, transparent 0, black 8%, black 92%, transparent 100%);
}
.marquee-track{
  display:flex;
  width:max-content;
  animation:marquee-scroll 32s linear infinite;
}
.marquee-track:hover{ animation-play-state:paused; }
.marquee-group{
  display:flex;
  align-items:center;
  gap:88px;
  padding-right:88px;
}
.brand-logo{
  display:flex; align-items:center; justify-content:center;
  height:50px;
}
.brand-logo img{ height:100%; width:auto; display:block; }
@keyframes marquee-scroll{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}
@media (prefers-reduced-motion: reduce){
  .marquee-track{ animation:none; flex-wrap:wrap; justify-content:center; row-gap:24px; }
  .marquee-group:last-child{ display:none; }
}
@media (max-width:640px){
  .marquee-group{ gap:40px; padding-right:40px; }
  .brand-logo{ height:34px; }
}

.services{
  background:var(--surface);
}
.service-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:22px;
}
#values .service-grid{ grid-template-columns:repeat(4, 1fr); }
@media (max-width:1080px){
  #values .service-grid{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width:640px){
  #values .service-grid{ grid-template-columns:1fr; }
}
.service-card{
  position:relative;
  border-radius:var(--radius-md);
  padding:30px 26px 28px;
  background:var(--card-bg);
  border:1px solid var(--card-border-strong);
  backdrop-filter: blur(16px);
  box-shadow:0 18px 40px -26px rgba(13,21,39,.3);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s;
  opacity:0; transform:translateY(26px);
}
.service-card.is-visible{ opacity:1; transform:translateY(0); }
.service-card:hover{
  transform:translateY(-8px);
  box-shadow:0 30px 60px -24px rgba(13,21,39,.32);
  border-color:rgba(245,131,31,.5);
}
.service-card .service-tag{
  font-family:var(--font-body); font-size:11.5px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--orange-600); font-weight:700;
}
.service-card .service-icon{
  width:44px;height:44px; margin-block:16px 18px;
  color:var(--text-strong);
}
.service-card h3{
  font-size:21px; color:var(--text-strong); margin-bottom:10px;
}
.service-card p{ font-size:15px; line-height:1.6; color:var(--text-muted); }

/* =============== how it works =============== */
.process{
  background:linear-gradient(180deg, var(--navy-900), var(--navy-800) 60%, var(--navy-700));
  color:var(--white);
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.process-video-wrap{
  position:absolute; inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
}
.process-video-wrap video,
.process-video-wrap img{
  position:absolute; top:-8%; left:0;
  width:100%; height:116%;
  object-fit:cover;
  opacity:.28;
  will-change:transform;
}
.process-video-wrap::after{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(180deg, var(--navy-900) 0%, rgba(13,21,39,.88) 40%, rgba(19,39,75,.9) 100%);
}
@media (prefers-reduced-motion: reduce){
  .process-video-wrap video{ display:none; }
}
.process > .container{ position:relative; z-index:1; }
.steps{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
  position:relative;
}
.steps::before{
  content:'';
  position:absolute; top:34px; left:6%; right:6%; height:2px;
  background:repeating-linear-gradient(90deg, rgba(255,255,255,.28) 0 10px, transparent 10px 20px);
  z-index:0;
}
.step{
  position:relative; z-index:1;
  padding:0 6px;
  opacity:0; transform:translateY(20px);
  transition:opacity .6s var(--ease), transform .6s var(--ease);
}
.step.is-visible{ opacity:1; transform:translateY(0); }
.step-num{
  width:68px;height:68px;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-mono); font-size:22px; font-weight:600;
  margin-bottom:22px;
  color:var(--navy-900);
  background:linear-gradient(135deg,var(--orange-500),var(--orange-700));
  box-shadow:0 0 0 6px var(--navy-800), 0 12px 26px -8px rgba(245,131,31,.5);
}
.step h3{ font-size:19px; margin-bottom:10px; color:var(--white); }
.step p{ font-size:14.5px; line-height:1.6; color:rgba(255,255,255,.68); }
.step .meta{
  display:inline-block; margin-top:14px;
  font-family:var(--font-mono); font-size:11.5px; letter-spacing:.08em;
  color:var(--orange-500); text-transform:uppercase;
}

/* =============== why us / stats strip =============== */
.stats{
  background:var(--surface-dim);
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.stats-media{
  position:absolute; inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
}
.stats-media img{
  position:absolute; top:-10%; left:0;
  width:100%; height:120%;
  object-fit:cover;
  opacity:.16;
  filter:grayscale(1) contrast(1.05);
  will-change:transform;
}
.stats-media::after{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(180deg, var(--surface-dim) 0%, rgba(0,0,0,0) 45%, rgba(0,0,0,0) 55%, var(--surface-dim) 100%);
}
.stats > .container{ position:relative; z-index:1; }
.stats-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
}
.stat-card{
  border-radius:var(--radius-md);
  padding:28px 24px;
  background:var(--card-bg);
  border:1px solid var(--card-border-strong);
  backdrop-filter: blur(14px);
}
.stat-card strong{
  display:block;
  font-family:var(--font-mono);
  font-size:clamp(28px,3vw,38px);
  color:var(--orange-600);
}
.stat-card span{
  display:block; margin-top:8px;
  font-size:14px; color:var(--text-muted); line-height:1.5;
}

/* =============== about: story + team =============== */
.story-grid{
  display:grid;
  grid-template-columns:1.3fr 1fr;
  gap:56px;
  align-items:start;
}
.story-facts{
  display:flex; flex-direction:column; gap:16px;
}
.story-facts .stat-card{ padding:22px 22px; }
@media (max-width:960px){
  .story-grid{ grid-template-columns:1fr; }
}

.leadership{ background:var(--surface); }

.leader-featured{
  display:grid;
  grid-template-columns:380px 1fr;
  gap:44px;
  align-items:center;
  padding:40px;
  border-radius:var(--radius-lg);
  background:var(--card-bg);
  border:1px solid var(--card-border-strong);
}
.leader-featured .leader-info{
  display:flex; flex-direction:column; justify-content:center;
}
.leader-featured .leader-info h3{ font-size:28px; }
.leader-featured .leader-info .leader-role{ font-size:15px; }
.leader-featured .leader-info p{ font-size:16px; line-height:1.7; max-width:60ch; }
.leader-featured .leader-info p + p{ margin-top:16px; }
.leader-photo.leader-photo-featured{
  width:100%; height:auto;
  aspect-ratio:1 / 1;
}
@media (max-width:900px){
  .leader-featured{ grid-template-columns:300px 1fr; gap:32px; }
}
@media (max-width:640px){
  .leader-featured{ grid-template-columns:1fr; padding:26px; }
  .leader-photo.leader-photo-featured{ width:100%; height:auto; aspect-ratio:1 / 1; }
}

.leader-photo{
  flex:none;
  width:150px; height:175px;
  border-radius:14px;
  overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,var(--orange-500),var(--navy-700));
  color:#fff; font-family:var(--font-mono); font-size:30px; font-weight:600;
}
.leader-photo img{
  width:100%; height:100%;
  object-fit:cover;
  display:block;
}
.leader-info h3{ font-size:20px; color:var(--text-strong); margin-bottom:5px; }
.leader-info .leader-role{
  display:block; font-size:13.5px; font-weight:700; letter-spacing:.04em;
  color:var(--orange-600); margin-bottom:10px;
}
.leader-info p{ font-size:14px; line-height:1.65; color:var(--text-muted); }

/* =============== parallax banner (standalone media moment) =============== */
.parallax-banner{
  position:relative;
  min-height:480px;
  display:flex;
  align-items:center;
  overflow:hidden;
  isolation:isolate;
  color:var(--white);
}
.parallax-media{
  position:absolute; inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
}
.parallax-media img{
  position:absolute; top:-15%; left:0;
  width:100%; height:130%;
  object-fit:cover;
  will-change:transform;
}
.parallax-media::after{
  content:'';
  position:absolute; inset:0;
  background:
    linear-gradient(100deg, rgba(13,21,39,.92) 0%, rgba(13,21,39,.62) 45%, rgba(245,131,31,.28) 100%),
    linear-gradient(0deg, rgba(13,21,39,.55), rgba(13,21,39,.55));
}
.parallax-banner .container{
  position:relative; z-index:1;
}
.parallax-banner .eyebrow{ color:var(--orange-500); margin-bottom:18px; }
.parallax-banner h2{
  font-size:clamp(1.9rem,3.4vw,3rem);
  max-width:18ch;
  color:var(--white);
}
.parallax-banner p{
  margin-top:18px; font-size:16.5px; line-height:1.65;
  max-width:48ch; color:rgba(255,255,255,.8);
}
@media (max-width:640px){
  .parallax-banner{ min-height:420px; }
}

/* =============== group affiliation =============== */
.group-band{
  background:
    radial-gradient(ellipse 70% 90% at 90% 20%, rgba(245,131,31,.22), transparent 60%),
    var(--navy-900);
  color:var(--white);
}
.group-card{
  border-radius:var(--radius-lg);
  padding:52px;
  display:grid;
  grid-template-columns:1fr auto;
  gap:40px;
  align-items:center;
}
.group-card .lede{ font-size:16.5px; line-height:1.7; color:rgba(255,255,255,.76); max-width:56ch; margin-top:16px; }
.group-logo-link{
  display:inline-block;
  margin-top:8px;
  opacity:.92;
  transition:opacity .25s, transform .25s;
}
.group-logo-link:hover{ opacity:1; transform:translateY(-2px); }
.group-logo{
  height:46px;
  width:auto;
  display:block;
}
.group-card .group-badge-line{
  display:flex; align-items:center; gap:14px;
  font-family:var(--font-body); font-size:12.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--orange-500); font-weight:600;
}
.group-facts{ display:flex; flex-direction:column; gap:18px; min-width:210px; }
.group-facts div{
  border-left:2px solid var(--orange-500);
  padding-left:14px;
}
.group-facts strong{ display:block; font-family:var(--font-mono); font-size:20px; }
.group-facts span{ font-size:12.5px; color:rgba(255,255,255,.55); }

/* =============== testimonials =============== */
.clients{ background:var(--surface); }
.quote-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}
.quote-card{
  border-radius:var(--radius-md);
  padding:30px 26px;
  background:var(--card-bg);
  border:1px solid var(--card-border-strong);
  backdrop-filter: blur(16px);
}
.quote-card .stars{ color:var(--orange-500); letter-spacing:2px; font-size:14px; margin-bottom:16px; }
.quote-card p.quote{
  font-family:var(--font-display); font-size:17px; font-weight:500; line-height:1.5; color:var(--text-strong);
}
.quote-card .who{
  margin-top:20px; display:flex; align-items:center; gap:12px;
}
.quote-card .avatar{
  width:38px;height:38px;border-radius:50%;
  object-fit:cover;
  flex:none;
}
.quote-card .who strong{ display:block; font-size:14px; color:var(--text-strong); }
.quote-card .who span{ font-size:12.5px; color:var(--text-muted); }

/* =============== CTA band =============== */
.cta-band{
  background:
    radial-gradient(ellipse 80% 80% at 50% 0%, rgba(245,131,31,.24), transparent 60%),
    linear-gradient(160deg, var(--navy-800), var(--navy-900));
  color:var(--white);
}
.cta-panel{
  border-radius:var(--radius-lg);
  padding:60px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:50px;
}
.cta-panel h2{ font-size:clamp(1.9rem,3vw,2.6rem); color:var(--white); }
.cta-panel .lede{ margin-top:16px; font-size:16px; line-height:1.65; color:rgba(255,255,255,.75); max-width:44ch; }
.cta-form{ display:flex; flex-direction:column; gap:14px; }
.cta-form .row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.cta-form input, .cta-form select, .cta-form textarea{
  width:100%;
  padding:14px 16px;
  border-radius:var(--radius-sm);
  border:1px solid rgba(255,255,255,.22);
  background:rgba(255,255,255,.08);
  color:var(--white);
  font-family:var(--font-body);
  font-size:14.5px;
  backdrop-filter: blur(10px);
}
.cta-form input::placeholder, .cta-form textarea::placeholder{ color:rgba(255,255,255,.45); }
.cta-form label{
  font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,.55);
  margin-bottom:-6px;
}
.cta-form button{ margin-top:8px; align-self:flex-start; }
.form-note{ font-size:12.5px; color:rgba(255,255,255,.5); margin-top:2px; }

/* =============== footer =============== */
.site-footer{
  background:var(--navy-900);
  color:rgba(255,255,255,.68);
  padding-block:64px 30px;
}
.footer-grid{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;
  gap:40px;
}
.footer-brand{
  display:flex; align-items:center;
  margin-bottom:14px;
}
.logo-img-footer{ height:80px; }
.site-footer p{ font-size:14px; line-height:1.6; max-width:32ch; }
.site-footer h4{
  font-family:var(--font-body); font-size:11.5px; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(255,255,255,.5); margin-bottom:16px; font-weight:600;
}
.site-footer ul li{ margin-bottom:10px; }
.site-footer a{ text-decoration:none; font-size:14.5px; color:rgba(255,255,255,.8); transition:color .25s; }
.site-footer a:hover{ color:var(--orange-500); }
.footer-bottom{
  margin-top:56px; padding-top:26px;
  border-top:1px solid rgba(255,255,255,.08);
  display:flex; justify-content:space-between; align-items:center;
  font-size:12.5px; color:rgba(255,255,255,.4);
  flex-wrap:wrap; gap:12px;
}
.footer-partner-badge{
  display:inline-block;
  margin-bottom:22px;
  border-radius:8px;
  overflow:hidden;
  line-height:0;
  transition:opacity .25s;
}
.footer-partner-badge:hover{ opacity:.85; }
.footer-partner-badge img{ width:100%; max-width:168px; height:auto; display:block; }
.footer-social{ display:flex; gap:10px; }
.footer-social a{
  display:flex; align-items:center; justify-content:center;
  width:36px; height:36px;
  border-radius:50%;
  background:rgba(255,255,255,.08);
  color:rgba(255,255,255,.8);
  transition:background .25s, color .25s;
}
.footer-social a:hover{ background:var(--orange-500); color:#0d1527; }
.footer-social svg{ width:16px; height:16px; }

/* =============== reveal-on-scroll base =============== */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-visible{ opacity:1; transform:translateY(0); }

/* =============== responsive =============== */
@media (max-width:1080px){
  .service-grid{ grid-template-columns:repeat(2,1fr); }
  .stats-grid{ grid-template-columns:repeat(2,1fr); }
  .quote-grid{ grid-template-columns:repeat(2,1fr); }
  .steps{ grid-template-columns:repeat(2,1fr); row-gap:40px; }
  .steps::before{ display:none; }
  .group-card{ grid-template-columns:1fr; }
  .cta-panel{ grid-template-columns:1fr; padding:44px 32px; }
  .footer-grid{ grid-template-columns:1fr 1fr; row-gap:36px; }
  .footer-grid > div:first-child{ grid-column:1 / -1; }
}

@media (max-width:860px){
  .nav-links{ display:none; }
  .nav-cta .btn-orange{ display:none; }
  .nav-toggle{ display:flex; }
  .logo-img{ height:46px; }
  .hero .container{ grid-template-columns:1fr; }
  .hero-copy .lede{ max-width:none; }
  .dash-panel{ max-width:380px; }
}

@media (max-width:640px){
  .section-pad{ padding-block:80px; }
  .service-grid{ grid-template-columns:1fr; }
  .stats-grid{ grid-template-columns:1fr 1fr; }
  .quote-grid{ grid-template-columns:1fr; }
  .steps{ grid-template-columns:1fr; }
  .group-card{ padding:34px 26px; }
  .cta-form .row{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr; }
  .hero-proof{ gap:24px; }
}

/* nav scrolled state (js toggles) */
.site-nav.scrolled .nav-inner{
  background:rgba(13,21,39,.78);
  border:1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(18px) saturate(160%);
  box-shadow:0 14px 40px -18px rgba(0,0,0,.5);
}

/* mobile menu panel */
.mobile-menu{
  position:fixed; inset:0; z-index:99;
  background:rgba(13,21,39,.97);
  backdrop-filter: blur(20px);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:28px;
  opacity:0; pointer-events:none;
  transition:opacity .35s var(--ease);
}
.mobile-menu.is-open{ opacity:1; pointer-events:auto; }
.mobile-menu a{
  font-family:var(--font-display); font-weight:600; font-size:26px; color:var(--white); text-decoration:none;
}
.mobile-menu .btn{ margin-top:10px; }

/* =========================================================
   Pricing page
   ========================================================= */
.pricing-hero{
  min-height:auto;
  padding-top:150px;
  padding-bottom:70px;
}
.pricing-hero .pricing-hero-inner{
  text-align:center;
  display:flex; flex-direction:column; align-items:center;
  position:relative; z-index:1;
}
.pricing-hero-inner .eyebrow{ color:var(--orange-500); margin-bottom:20px; justify-content:center; }
.pricing-hero-inner h1{
  font-size:clamp(2.3rem,4.2vw,3.6rem);
  letter-spacing:-.015em;
  color:var(--white);
}
.pricing-hero-inner .lede{
  margin-top:22px; font-size:17.5px; line-height:1.65;
  max-width:56ch; color:rgba(255,255,255,.78);
}

.currency-switch{
  margin-top:38px;
  display:inline-flex; gap:4px;
  padding:5px;
  border-radius:999px;
}
.currency-btn{
  font-family:var(--font-body); font-weight:600; font-size:13.5px;
  color:rgba(255,255,255,.7);
  background:transparent; border:none; border-radius:999px;
  padding:9px 18px;
  cursor:pointer;
  transition:background .25s, color .25s;
}
.currency-btn:hover{ color:var(--white); }
.currency-btn.is-active{
  background:linear-gradient(135deg,var(--orange-500),var(--orange-700));
  color:var(--white);
}
.fx-note{
  margin-top:16px; font-size:12.5px; color:rgba(255,255,255,.5);
  max-width:52ch;
}

.tiers{ background:var(--surface); }

.pricing-layout{
  display:grid;
  grid-template-columns:280px 1fr;
  gap:44px;
  align-items:start;
}
.pricing-sidebar h2{
  font-size:32px; letter-spacing:-.01em; color:var(--text-strong);
}
.pricing-sidebar-label{
  display:block;
  margin-top:28px; padding-top:22px;
  border-top:1px solid var(--card-border-strong);
  font-family:var(--font-body); font-size:11.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--text-muted);
}
.pricing-defaults{
  margin-top:20px;
  display:flex; flex-direction:column;
}
.pricing-defaults li{
  display:flex; gap:14px; align-items:flex-start;
  padding-block:18px;
  border-bottom:1px solid var(--card-border-strong);
}
.pricing-defaults li:first-child{ padding-top:0; }
.pricing-defaults li:last-child{ border-bottom:none; padding-bottom:0; }
.pricing-defaults-icon{
  flex:none;
  width:38px; height:38px; padding:9px;
  border-radius:10px;
  background:rgba(245,131,31,.12);
  color:var(--orange-600);
}
.pricing-defaults-icon svg{ width:100%; height:100%; }
.pricing-defaults p{ font-size:14px; line-height:1.5; color:var(--text-muted); }

.tier-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
  align-items:start;
}
.tier-stack{
  position:relative;
  display:flex; flex-direction:column; gap:10px;
  opacity:0; transform:translateY(24px);
  transition:opacity .6s var(--ease), transform .6s var(--ease);
}
.tier-stack.is-visible{ opacity:1; transform:translateY(0); }
.tier-badge{
  position:absolute; top:-13px; left:24px; z-index:1;
  background:linear-gradient(135deg,var(--orange-500),var(--orange-700));
  color:var(--white);
  font-size:11.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  padding:6px 14px; border-radius:999px;
}
.tier-block{
  border-radius:var(--radius-sm);
  padding:20px 22px;
  background:var(--card-bg);
  border:1px solid var(--card-border-strong);
  backdrop-filter: blur(16px);
}
.tier-block-head .service-tag{
  font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; font-weight:700; color:var(--orange-600);
}
.tier-block-head h3{
  margin-top:8px; font-size:17px; font-weight:600; color:var(--text-strong); line-height:1.35;
}
.tier-block-price{ display:flex; flex-direction:column; gap:4px; }
.tier-block-price .amount{
  font-family:var(--font-mono); font-size:32px; font-weight:600; color:var(--text-strong);
}
.tier-block-price .period{ font-size:13px; color:var(--text-muted); }
.tier-start{
  display:flex; align-items:center; justify-content:center; gap:8px;
  width:100%;
  padding:16px 22px;
  border-radius:var(--radius-sm);
  border:1px solid var(--card-border-strong);
  background:var(--card-bg);
  font-family:var(--font-body); font-weight:600; font-size:14.5px;
  color:var(--text-strong);
  text-decoration:none;
  cursor:pointer;
  transition:background .25s, color .25s, border-color .25s;
}
.tier-start svg{ width:16px; height:16px; }
.tier-start-featured{
  background:linear-gradient(135deg,var(--orange-500),var(--orange-700));
  border-color:transparent;
  color:var(--white);
}
.tier-start:not(.tier-start-featured):hover{ border-color:rgba(245,131,31,.5); color:var(--orange-600); }
.tier-block-check{
  display:flex; align-items:center; gap:12px;
  font-size:14px; line-height:1.4; color:var(--text-ink);
}
.tier-stack-featured .tier-block{ border-color:rgba(245,131,31,.35); }
.tier-block-check svg{
  flex:none;
  width:16px; height:16px; padding:3px;
  border-radius:50%;
  background:rgba(245,131,31,.15);
  color:var(--orange-600);
}

.tier-enterprise{
  margin-top:26px;
  border-radius:var(--radius-lg);
  padding:40px 44px;
  display:flex; align-items:center; justify-content:space-between; gap:32px;
  flex-wrap:wrap;
  background:linear-gradient(160deg, var(--navy-900), var(--navy-800) 60%, var(--navy-700));
  border-color:transparent;
}

.terms{ background:var(--surface-dim); }
.terms-note{
  margin-top:-8px; margin-bottom:32px;
  font-size:14px; line-height:1.6; color:var(--text-muted);
  max-width:70ch;
}
.terms-table-wrap{
  overflow-x:auto;
  border-radius:var(--radius-md);
  border:1px solid var(--card-border-strong);
  -webkit-overflow-scrolling:touch;
}
table.terms-table{
  width:100%;
  border-collapse:collapse;
  min-width:640px;
  background:var(--card-bg);
}
.terms-table caption{ display:none; }
.terms-table th, .terms-table td{
  padding:16px 22px;
  text-align:left;
  font-size:14px;
  border-bottom:1px solid var(--card-border-strong);
}
.terms-table thead th{
  font-family:var(--font-body); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase;
  font-weight:700; color:var(--text-muted);
  background:transparent;
}
.terms-table tbody th{
  font-weight:600; color:var(--text-strong);
  white-space:nowrap;
}
.terms-table td{ color:var(--text-ink); }
.terms-table tbody tr:last-child th, .terms-table tbody tr:last-child td{ border-bottom:none; }
.terms-footnote{
  margin-top:18px; font-size:13px; line-height:1.6; color:var(--text-muted);
}

.addons{ background:var(--surface-dim); }
.addon-table{
  border-radius:var(--radius-md);
  overflow:hidden;
  border:1px solid var(--card-border-strong);
}
.addon-row{
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 26px;
  background:var(--card-bg);
  border-bottom:1px solid var(--card-border-strong);
  font-size:14.5px; color:var(--text-ink);
}
.addon-row:last-child{ border-bottom:none; }
.addon-row.addon-head{
  font-family:var(--font-body); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase;
  font-weight:700; color:var(--text-muted);
  background:transparent;
}
.addon-row .amount{ font-family:var(--font-mono); font-weight:600; color:var(--orange-600); }
.addon-row .unit{ font-size:12.5px; color:var(--text-muted); }

.faq{
  background:linear-gradient(180deg, var(--navy-900), var(--navy-800) 60%, var(--navy-700));
  color:var(--white);
}
.faq-list{
  display:flex; flex-direction:column; gap:14px;
  max-width:820px;
}
.faq-item{
  border-radius:var(--radius-md);
  padding:22px 26px;
  background:var(--glass-fill-dark);
  border:1px solid var(--glass-border-dark);
  opacity:0; transform:translateY(20px);
  transition:opacity .6s var(--ease), transform .6s var(--ease);
}
.faq-item.is-visible{ opacity:1; transform:translateY(0); }
.faq-item summary{
  cursor:pointer;
  font-family:var(--font-display); font-weight:600; font-size:16px;
  color:var(--white);
  list-style:none;
  display:flex; align-items:center; justify-content:space-between;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{
  content:'+';
  font-size:22px; font-weight:400; color:var(--orange-500);
  transition:transform .3s var(--ease);
  flex-shrink:0; margin-left:16px;
}
.faq-item[open] summary::after{ transform:rotate(45deg); }
.faq-item p{
  margin-top:14px; font-size:14.5px; line-height:1.65; color:rgba(255,255,255,.7);
}

@media (max-width:1080px){
  .pricing-layout{ grid-template-columns:1fr; gap:36px; }
  .pricing-sidebar{ max-width:520px; }
  .tier-enterprise{ flex-direction:column; align-items:flex-start; }
}
@media (max-width:760px){
  .tier-grid{ grid-template-columns:1fr; max-width:440px; }
}
@media (max-width:640px){
  .currency-switch{ flex-wrap:wrap; justify-content:center; }
  .addon-row{ flex-direction:column; align-items:flex-start; gap:6px; }
}

/* =============== get started modal =============== */
.modal-overlay{
  position:fixed; inset:0; z-index:200;
  display:flex; align-items:center; justify-content:center;
  padding:24px;
  background:rgba(13,21,39,.64);
  backdrop-filter: blur(6px);
  opacity:0; visibility:hidden;
  transition:opacity .3s var(--ease), visibility .3s;
}
.modal-overlay.is-open{ opacity:1; visibility:visible; }
.modal-panel{
  position:relative;
  width:100%; max-width:560px;
  max-height:88vh; overflow-y:auto;
  border-radius:var(--radius-lg);
  padding:44px 40px;
  transform:translateY(16px);
  transition:transform .3s var(--ease);
}
.modal-overlay.is-open .modal-panel{ transform:translateY(0); }
.modal-panel h2{ margin-top:14px; font-size:24px; color:var(--white); }
.modal-panel .lede{ margin-top:10px; font-size:14.5px; line-height:1.6; color:rgba(255,255,255,.75); }
.modal-panel .cta-form{ margin-top:26px; }
.modal-close{
  position:absolute; top:20px; right:20px;
  width:34px; height:34px;
  display:flex; align-items:center; justify-content:center;
  border-radius:50%;
  background:rgba(255,255,255,.08);
  color:var(--white);
  border:none; cursor:pointer;
  transition:background .25s;
}
.modal-close svg{ width:16px; height:16px; }
.modal-close:hover{ background:rgba(255,255,255,.18); }
@media (max-width:640px){
  .modal-panel{ padding:34px 24px; }
}

/* =============== region / country modal =============== */
.region-modal-panel{ max-width:480px; }
.region-modal-panel .lede{ margin-top:10px; }
.region-grid{
  margin-top:28px;
  display:grid; grid-template-columns:1fr 1fr; gap:14px;
}
.region-option{
  display:flex; flex-direction:column; align-items:center; gap:8px;
  padding:24px 16px;
  border-radius:var(--radius-md);
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.05);
  color:var(--white);
  font-family:var(--font-body);
  cursor:pointer;
  transition:background .25s, border-color .25s, transform .25s;
}
.region-option:hover{ background:rgba(255,255,255,.1); border-color:rgba(245,131,31,.5); transform:translateY(-2px); }
.region-option.is-selected{ border-color:var(--orange-500); background:rgba(245,131,31,.14); }
.region-flag{ font-size:34px; line-height:1; }
.region-name{ font-size:14.5px; font-weight:600; }

.region-badge{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.04);
  color:rgba(255,255,255,.55);
  font-family:var(--font-body);
  font-size:12.5px; font-weight:600;
  cursor:pointer;
  transition:background .25s, color .25s;
}
.region-badge:hover{ background:rgba(255,255,255,.09); color:var(--white); }
.region-badge-flag{ font-size:15px; }
.region-badge-change{ color:var(--orange-500); text-decoration:underline; margin-left:2px; }