/* ============================================================
   Brand New Edge — Website tokens (Brief v2)
   Dark-first. True-neutral light mode. Plus Jakarta / DM Sans / DM Mono.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@600;700;800&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700&family=DM+Mono:wght@400;500&display=swap');

:root {
  /* ---- Purple scale (the "voice" — CTAs, eyebrows, signature sections) ---- */
  --purple-50:  #F5EEFC;
  --purple-100: #E7D6F6;
  --purple-200: #CBA9EC;
  --purple-300: #AE7CE2;
  --purple-soft: #9B55D6;   /* eyebrows · stats · secondary badges */
  --purple-core: #7B2FBE;   /* CTAs · active tabs · badges · mark satellite */
  --purple-600: #6322A0;
  --purple-700: #4D1A7C;
  --purple-800: #3D1A6E;
  --purple-deep: #2A0F4F;   /* footer · Why Brazil · mark ring */
  /* legacy aliases */
  --purple-400:   #9B55D6;
  --purple-500:   #7B2FBE;
  --purple-900:   #2A0F4F;
  --purple-mid:   #3D1A6E;
  --purple-vivid: #7B2FBE;
  --purple-light: #9B55D6;

  --ink:          #0A0A0A;
  --paper:        #FFFFFF;

  /* ---- Navy surface scale (the "stage" — silent, deep, layered) ---- */
  --navy-50:  #F4F1F9;   /* light-bg (warm purple tint) */
  --navy-100: #EDE8F5;   /* light-raised */
  --navy-200: #D8D0E6;
  --navy-300: #9AA6C4;
  --navy-400: #4A5B82;
  --navy-500: #1A2E5A;   /* hover */
  --navy-600: #132248;   /* raised · elevated cards · stat cards */
  --navy-700: #0C1835;   /* card · secondary sections */
  --navy-800: #060D1F;   /* hero bg · primary dark sections */
  --navy-900: #04080F;   /* deepest */
  --navy-950: #04080F;

  --light-bg:     #F4F1F9;
  --light-raised: #EDE8F5;

  --footer-bg:    #2A0F4F;   /* signature purple-deep (per DS) */

  /* ---- True neutrals ---- */
  --gray-50:   #F6F7F9;
  --gray-100:  #E7EAEF;
  --gray-200:  #D6DAE1;
  --gray-400:  #9CA3AF;
  --gray-600:  #5E6470;

  /* ---- Semantic ---- */
  --ok:    #1E9E7A;
  --warn:  #C8881A;
  --error: #C8385A;

  /* ---- Type ---- */
  --font-display: "Plus Jakarta Sans", system-ui, sans-serif;
  --font-body:    "DM Sans", system-ui, sans-serif;
  --font-mono:    "DM Mono", ui-monospace, monospace;

  /* ---- Radii ---- */
  --r-btn:  6px;
  --r-card: 14px;
  --r-xl:   20px;
  --r-pill: 999px;

  /* ---- Shadows / glow ---- */
  --shadow-sm: 0 1px 2px rgba(4,8,15,.10);
  --shadow-md: 0 14px 38px rgba(4,8,15,.14);
  --shadow-lg: 0 30px 70px rgba(4,8,15,.22);
  --glow:      0 14px 34px rgba(123,47,190,.18);

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(.22,.61,.36,1);
  --dur: .25s;

  /* ---- Layout ---- */
  --maxw: 1200px;
}

/* ============================ DARK (default) ============================ */
[data-theme="dark"] {
  --app-bg:       #060D1F;   /* navy hero bg / primary dark */
  --section-alt:  #0C1835;   /* navy card / secondary sections */
  --section-deep: #0C1835;   /* navy (purple-deep reserved for Why Brazil + footer) */
  --deep-bg:      #060D1F;   /* dark navy for hero/CTA/contact bands */
  --deep-bg-2:    #0C1835;   /* slightly lifted navy band */
  --card-bg:      #0C1835;
  --card-raised:  #132248;
  --glass-bg:     rgba(6,13,31,.72);
  --nav-bg:       rgba(6,13,31,.82);

  --text-1: #FFFFFF;
  --text-2: rgba(255,255,255,.72);
  --text-3: rgba(255,255,255,.50);
  --border-1: rgba(255,255,255,.10);
  --border-2: rgba(255,255,255,.18);
  --accent:   #9B55D6;
  --accent-strong: #7B2FBE;
  --eyebrow:  #9B55D6;

  /* solid CTA on dark = white pill, navy text */
  --cta-bg: #FFFFFF;
  --cta-fg: #060D1F;

  --client-filter: none;      /* logos are white — perfect on dark */
  --deep-glow: rgba(123,47,190,.16);
  --hairline-glow: rgba(123,47,190,.14);

  /* deep band = dark navy in dark mode */
  --navy-feature: #060D1F;        /* always-dark feature bands (hero, globe) */
  --on-deep-1: #FFFFFF;
  --on-deep-2: rgba(255,255,255,.74);
  --on-deep-3: rgba(255,255,255,.54);
  --deep-card: rgba(255,255,255,.05);
  --deep-border: rgba(255,255,255,.12);
  --deep-chip: rgba(255,255,255,.08);
  --deep-eyebrow: #9B55D6;
  --deep-input: rgba(255,255,255,.06);
  --deep-client-filter: none;

  /* hero (dark in dark mode) */
  --hero-bg: #060D1F;
  --hero-video-opacity: .45;
  --hero-scrim-1: rgba(6,13,31,.88);
  --hero-scrim-2: rgba(6,13,31,.42);
  --hero-card-bg: rgba(15,24,43,.92);
  --hero-card-border: rgba(255,255,255,.14);
  --hero-card-shadow: 0 18px 50px rgba(0,0,0,.45);
  --hero-grid: rgba(255,255,255,.05);
}

/* ============================ LIGHT (toggle) ============================ */
[data-theme="light"] {
  --app-bg:       #FFFFFF;
  --section-alt:  #F4F1F9;   /* light-bg warm purple tint */
  --section-deep: #EDE8F5;   /* light-raised */
  --deep-bg:      #EDE8F5;   /* light surface for deep bands in bright mode */
  --deep-bg-2:    #F4F1F9;
  --card-bg:      #FFFFFF;
  --card-raised:  #FFFFFF;
  --glass-bg:     rgba(255,255,255,.82);
  --nav-bg:       rgba(255,255,255,.86);

  --text-1: #0A0A0A;
  --text-2: #353A42;
  --text-3: #5E6470;
  --border-1: rgba(4,8,15,.10);
  --border-2: rgba(4,8,15,.18);
  --accent:   #7B2FBE;
  --accent-strong: #7B2FBE;
  --eyebrow:  #7B2FBE;

  /* solid CTA on light = navy pill, white text (purple reserved for accents) */
  --cta-bg: #04080F;
  --cta-fg: #FFFFFF;

  --client-filter: invert(1) brightness(.14);  /* white svg → near-black */
  --deep-glow: rgba(123,47,190,.10);
  --hairline-glow: rgba(123,47,190,.10);

  /* deep band = LIGHT warm-purple-tint with dark text in bright mode */
  --navy-feature: #060D1F;        /* hero + globe stay dark navy in both themes */
  --on-deep-1: #0A0A0A;
  --on-deep-2: #353A42;
  --on-deep-3: #5E6470;
  --deep-card: #FFFFFF;
  --deep-border: rgba(4,8,15,.10);
  --deep-chip: rgba(123,47,190,.10);
  --deep-eyebrow: #7B2FBE;
  --deep-input: #FFFFFF;
  --deep-client-filter: invert(1) brightness(.14);

  /* hero (WHITE in bright mode) */
  --hero-bg: #FFFFFF;
  --hero-video-opacity: .5;
  --hero-scrim-1: rgba(255,255,255,.92);
  --hero-scrim-2: rgba(255,255,255,.42);
  --hero-card-bg: #FFFFFF;
  --hero-card-border: rgba(4,8,15,.10);
  --hero-card-shadow: 0 18px 50px rgba(4,8,15,.12);
  --hero-grid: rgba(4,8,15,.045);
}

/* ---- Type scale (theme-independent) ---- */
.t-display { font-family:var(--font-display); font-weight:800; font-size:clamp(44px,6.5vw,96px); letter-spacing:-.03em; line-height:1.02; }
.t-h1 { font-family:var(--font-display); font-weight:800; font-size:clamp(36px,4.6vw,64px); letter-spacing:-.02em; line-height:1.05; }
.t-h2 { font-family:var(--font-display); font-weight:800; font-size:clamp(28px,3.2vw,44px); letter-spacing:-.02em; line-height:1.1; }
.t-h3 { font-family:var(--font-display); font-weight:700; font-size:26px; letter-spacing:-.01em; line-height:1.15; }
.t-h4 { font-family:var(--font-display); font-weight:700; font-size:20px; line-height:1.25; }
.t-lead { font-family:var(--font-body); font-weight:400; font-size:clamp(18px,1.5vw,21px); line-height:1.55; }
.t-body { font-family:var(--font-body); font-weight:400; font-size:17px; line-height:1.6; }
.t-small { font-family:var(--font-body); font-weight:400; font-size:14px; line-height:1.5; }
.t-eyebrow { font-family:var(--font-mono); font-weight:500; font-size:12px; text-transform:uppercase; letter-spacing:.18em; color:var(--eyebrow); }
.t-caption { font-family:var(--font-body); font-weight:400; font-size:13px; }

/* Hero title: hold each title segment on its own line on desktop */
.bne-hero-title { white-space: nowrap; }
@media (max-width: 860px){ .bne-hero-title { white-space: normal; } }

/* How it works: sticky intro on desktop only */
@media (max-width: 980px){ .bne-how-sticky { position: static !important; } }

/* Floating cropped globe (Global network section) */
.bne-globe-float { position:absolute; top:50%; right:-90px; transform:translateY(-50%); width:850px; height:850px; z-index:1; }
@media (max-width: 1180px){ .bne-globe-float{ right:-150px; width:740px; height:740px; } }
@media (max-width: 980px){ .bne-globe-float{ right:-200px; width:640px; height:640px; opacity:.5; } }
@media (max-width: 760px){ .bne-globe-float{ display:none; } }

@media (prefers-reduced-motion: reduce){ .bne-hero-video { display:none; } }

/* Mega menu entrance + responsive grid */
@keyframes bneMegaIn { from { opacity:0; transform:translateY(-8px); } to { opacity:1; transform:none; } }
@media (max-width: 1180px){ .bne-mega-grid { grid-template-columns:repeat(3,1fr) !important; } }
@media (prefers-reduced-motion: reduce){ [style*="bneMegaIn"]{ animation:none !important; } }
