/* =====================================================================
   About-Us · scoped page CSS
   Loaded only on /about-us. Uses tokens from globalist-theme.css :root.
   All classes namespaced with .au- to avoid Webflow legacy conflicts.

   Sections:
     1. .au-hero        — cinematic hero w/ breathing Logo Ball + dot grid
     2. .au-manifesto   — editorial 2-col "Das ist Globalist"
     3. .au-bento       — varied 12-col bento for resources/touchpoints
     4. .au-drive       — asymmetric "Was uns antreibt" w/ pulse bg
     5. .au-values      — 6 core-values cards w/ numeral watermarks
   ===================================================================== */

/* ----- shared utilities ----- */
.au-page{
  position:relative;
  background:transparent;
  color:var(--fg);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  overflow-x:hidden;
}
.au-page *{ box-sizing:border-box; }

/* Globalist-theme.css line ~71 forces every h1/h2/h3 to weight 900,
   uppercase, -.02em, white with !important. Reset that for everything
   under .au-page so the about-us editorial style (light Inter, no
   uppercase) actually applies. Color stays white via globalist-theme,
   which is what we want anyway. */
.au-page h1,
.au-page h2,
.au-page h3,
.au-page h4,
.au-page h5{
  font-family:'Inter',sans-serif !important;
  font-weight:300 !important;
  text-transform:none !important;
  letter-spacing:-.02em !important;
  line-height:1.05 !important;
}

.au-section{
  position:relative;
  padding-block:clamp(72px, 9vw, 140px);
  padding-inline:clamp(20px, 4vw, 56px);
  isolation:isolate;
}
.au-container{
  max-width:1280px;
  margin:0 auto;
  position:relative;
}

/* dotted grid bg, drifts very slowly */
.au-grid-bg{
  position:absolute; inset:0;
  background-image:
    radial-gradient(circle at 1px 1px, rgba(0,237,179,.10) 1px, transparent 0);
  background-size:32px 32px;
  -webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 50%, #000 0%, transparent 100%);
          mask-image:radial-gradient(ellipse 80% 70% at 50% 50%, #000 0%, transparent 100%);
  animation:au-grid-drift 60s linear infinite;
  pointer-events:none;
  z-index:0;
}
@keyframes au-grid-drift{
  to{ background-position:128px 128px; }
}

/* atmospheric mint glow blob */
.au-glow{
  position:absolute;
  width:clamp(360px, 60vw, 800px);
  aspect-ratio:1;
  background:radial-gradient(circle at center, rgba(0,237,179,.18), rgba(0,237,179,.06) 35%, transparent 65%);
  filter:blur(60px);
  pointer-events:none;
  z-index:0;
}

/* scroll-reveal */
.au-reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .8s var(--ease), transform .8s var(--ease);
}
.au-reveal.is-in{
  opacity:1;
  transform:translateY(0);
}
.au-reveal[data-stagger]{ transition-delay:calc(var(--i, 0) * 80ms); }

/* eyebrow tag (used sparingly — small, mono-ish) */
.au-eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-size:11px;font-weight:600;letter-spacing:.32em;text-transform:uppercase;
  color:var(--primary);
  margin:0 0 18px;
}
.au-eyebrow::before{
  content:""; width:24px; height:1px;
  background:var(--primary);
  display:inline-block;
}

/* generic logo-ball motif — wireframe globe with breathing + spin */
.au-orb{
  display:inline-block;
  color:var(--primary);
  filter:drop-shadow(0 0 24px rgba(0,237,179,.35));
  animation:au-orb-breath 6s ease-in-out infinite;
  pointer-events:none;
  will-change:transform;
}
.au-orb svg{
  width:100%; height:100%; display:block;
  animation:au-orb-spin 60s linear infinite;
}
@keyframes au-orb-breath{
  0%, 100%{ transform:scale(1); }
  50%    { transform:scale(1.045); }
}
@keyframes au-orb-spin{
  to{ transform:rotate(360deg); }
}

/* =====================================================================
   1. HERO — drifting mint aurora background + classic Inter 600
   No typewriter. No editorial-thin. Three blurred mint blobs drift
   on long, offset loops; headline is plain Inter 600 readable from
   first paint. Background does the work — type stays calm.
   ===================================================================== */
@keyframes au-fade-in{ to{ opacity:1; transform:none; } }
@keyframes au-spin{ to{ transform:rotate(360deg); } }

.au-hero{
  min-height:min(680px, 88svh);
  display:grid;
  place-items:center;
  padding-block:clamp(110px, 13vw, 180px) clamp(72px, 8vw, 110px);
  overflow:hidden;
  isolation:isolate;
  background:#020c09;
}

/* ---- Aurora: three mint blobs, big, blurred, slow drift ---- */
.au-hero__aurora{
  position:absolute; inset:-15%;
  z-index:0;
  pointer-events:none;
  filter:blur(90px) saturate(140%);
}
.au-hero__blob{
  position:absolute;
  border-radius:50%;
  mix-blend-mode:screen;
  will-change:transform;
}
.au-hero__blob--a{
  width:62%; aspect-ratio:1;
  top:-8%; left:-12%;
  background:radial-gradient(circle, rgba(0,237,179,.55) 0%, rgba(0,237,179,.18) 40%, transparent 70%);
  animation:au-aurora-a 28s ease-in-out infinite;
}
.au-hero__blob--b{
  width:54%; aspect-ratio:1;
  bottom:-12%; right:-8%;
  background:radial-gradient(circle, rgba(0,237,179,.32) 0%, rgba(0,237,179,.12) 45%, transparent 72%);
  animation:au-aurora-b 34s ease-in-out infinite;
}
.au-hero__blob--c{
  width:46%; aspect-ratio:1;
  top:32%; left:48%;
  background:radial-gradient(circle, rgba(0,237,179,.22) 0%, rgba(0,237,179,.08) 50%, transparent 72%);
  animation:au-aurora-c 22s ease-in-out infinite;
}
@keyframes au-aurora-a{
  0%, 100%{ transform:translate(0,0) scale(1); }
  33%    { transform:translate(8%, 14%) scale(1.08); }
  66%    { transform:translate(-4%, 6%) scale(.96); }
}
@keyframes au-aurora-b{
  0%, 100%{ transform:translate(0,0) scale(1); }
  40%    { transform:translate(-12%, -10%) scale(1.12); }
  70%    { transform:translate(4%, -4%) scale(.94); }
}
@keyframes au-aurora-c{
  0%, 100%{ transform:translate(-50%, -50%) scale(.95); }
  50%    { transform:translate(-58%, -42%) scale(1.18); }
}

/* Vignette — keeps the edges dark so the type plate stays calm */
.au-hero__vignette{
  position:absolute; inset:0;
  z-index:1;
  pointer-events:none;
  background:
    radial-gradient(ellipse 70% 65% at 50% 50%, transparent 0%, rgba(2,12,9,.55) 75%, rgba(2,12,9,.85) 100%);
}

/* Grid sits above aurora to give it texture, below content */
.au-hero .au-grid-bg{ z-index:1; opacity:.6; }

.au-hero__content{
  position:relative;
  z-index:3;
  text-align:center;
  max-width:1080px;
  padding:0 16px;
}

.au-hero__eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  margin:0 0 24px;
  font-size:11px; font-weight:600;
  letter-spacing:.32em; text-transform:uppercase;
  color:var(--primary);
  opacity:0; transform:translateY(8px);
  animation:au-fade-in .7s var(--ease) .1s forwards;
}
.au-hero__eyebrow::before{
  content:""; width:6px; height:6px; border-radius:50%;
  background:var(--primary);
  box-shadow:0 0 14px rgba(0,237,179,.7);
}

/* Override globalist-theme.css h1 force (900/uppercase/!important).
   Classic display: Inter 600, mixed case, tight tracking. Readable
   from the first paint — no per-line animation, no fade-by-char. */
.au-hero__headline{
  margin:0;
  font-family:'Inter',sans-serif !important;
  font-size:clamp(40px, 6.6vw, 92px);
  font-weight:600 !important;
  line-height:1.05 !important;
  letter-spacing:-.022em !important;
  text-transform:none !important;
  color:#fff !important;
  text-wrap:balance;
  text-shadow:0 2px 30px rgba(0,0,0,.35);
  opacity:0; transform:translateY(10px);
  animation:au-fade-in .8s var(--ease) .25s forwards;
}
.au-hero__headline em{
  font-style:normal;
  font-weight:600 !important;
  color:var(--primary) !important;
  text-transform:none !important;
}

.au-hero__sub{
  margin:28px auto 0;
  max-width:640px;
  font-size:clamp(15px, 1.2vw, 18px);
  font-weight:400; line-height:1.6;
  color:rgba(235,242,240,.85);
  text-shadow:0 1px 20px rgba(0,0,0,.4);
  opacity:0; transform:translateY(10px);
  animation:au-fade-in .8s var(--ease) .45s forwards;
}
.au-hero__sub strong{ color:#fff; font-weight:500; }

.au-hero__cue{
  position:absolute; bottom:34px; left:50%;
  transform:translateX(-50%);
  display:inline-flex; flex-direction:column; align-items:center;
  gap:8px;
  font-size:10px; letter-spacing:.32em; text-transform:uppercase;
  color:rgba(255,255,255,.5);
  z-index:3;
  opacity:0;
  animation:au-fade-in 1s ease 1.1s forwards;
}
.au-hero__cue::after{
  content:""; width:1px; height:36px;
  background:linear-gradient(to bottom, var(--primary), transparent);
  animation:au-cue-pulse 2.4s ease-in-out infinite;
  transform-origin:top;
}
@keyframes au-cue-pulse{
  0%, 100%{ transform:scaleY(.4); opacity:.4; }
  50%    { transform:scaleY(1);   opacity:1; }
}

/* =====================================================================
   1.5  STATS — "Nicht Berater. Operator." identity card
   Pulled from /globalist-os: 80 Mio. spend, 270 Mio. revenue, 300+
   engagements, since 2018.
   ===================================================================== */
.au-stats{
  padding-block:clamp(80px, 10vw, 140px);
  background:linear-gradient(180deg, var(--bg) 0%, #03110d 100%);
  position:relative; overflow:hidden;
}
.au-stats__inner{
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:clamp(40px, 6vw, 88px);
  align-items:end;
  position:relative; z-index:2;
}
.au-stats__heading{
  margin:0 0 22px;
  font-size:clamp(40px, 6vw, 88px);
  font-weight:200;
  line-height:1.0;
  letter-spacing:-.025em;
  color:#fff;
  text-wrap:balance;
}
.au-stats__heading strong{
  font-weight:600;
  color:var(--primary);
}
.au-stats__lede{
  margin:0;
  font-size:clamp(15px, 1.15vw, 17px);
  line-height:1.65;
  color:rgba(235,242,240,.78);
}
.au-stats__lede em{
  font-style:normal; color:#fff; font-weight:500;
}
.au-stats__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  background:rgba(0,237,179,.18);
  border:1px solid rgba(0,237,179,.18);
  border-radius:18px;
  overflow:hidden;
}
.au-stat{
  padding:clamp(20px, 2.2vw, 30px);
  background:linear-gradient(160deg, rgba(7,31,25,.55) 0%, rgba(2,12,9,.85) 100%);
  display:flex; flex-direction:column; gap:8px;
}
.au-stat__num{
  font-family:'Inter',sans-serif;
  font-size:clamp(34px, 4.4vw, 56px);
  font-weight:300;
  line-height:1;
  letter-spacing:-.025em;
  color:#fff;
}
.au-stat__num .unit{
  font-size:.55em; font-weight:400;
  color:var(--primary);
  margin-left:6px;
  letter-spacing:0;
}
.au-stat__lbl{
  font-size:11px; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase;
  color:rgba(235,242,240,.55);
  line-height:1.45;
}
.au-stats__sig{
  margin-top:32px;
  padding-top:22px;
  border-top:1px solid rgba(255,255,255,.08);
  font-size:11px; font-weight:600;
  letter-spacing:.32em; text-transform:uppercase;
  color:rgba(235,242,240,.5);
}
.au-stats__sig::before{
  content:"— ";
  color:var(--primary);
}

/* =====================================================================
   1.6  OS — Internal-Document-Feel for /globalist-os teaser
   ===================================================================== */
.au-os{
  padding-block:clamp(80px, 10vw, 140px);
  background:#03110d;
  position:relative; overflow:hidden;
}
.au-os__bg{
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 20% 100%, rgba(0,237,179,.10), transparent 55%),
    radial-gradient(circle at 90% 0%, rgba(0,237,179,.06), transparent 55%);
  pointer-events:none; z-index:0;
}
.au-os__inner{
  display:grid;
  grid-template-columns:1fr 1.4fr;
  gap:clamp(40px, 6vw, 96px);
  align-items:center;
  position:relative; z-index:2;
}
.au-os__seal{
  position:relative;
  aspect-ratio:1;
  max-width:340px;
  margin:0 auto;
  width:100%;
  display:grid; place-items:center;
}
.au-os__seal::before{
  content:""; position:absolute; inset:0;
  border:1px dashed rgba(0,237,179,.32);
  border-radius:50%;
  animation:au-spin 80s linear infinite;
}
.au-os__seal::after{
  content:""; position:absolute; inset:8%;
  border:1px solid rgba(0,237,179,.16);
  border-radius:50%;
}
.au-os__seal-inner{
  position:relative;
  width:62%; aspect-ratio:1;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:6px;
  background:radial-gradient(circle at 50% 35%, #062019, #02100c 60%, #000a07 100%);
  border:1px solid rgba(0,237,179,.40);
  border-radius:50%;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 30px 60px -20px rgba(0,0,0,.6);
}
.au-os__monogram{
  font-family:'Inter',sans-serif;
  font-size:clamp(28px, 4vw, 48px);
  font-weight:300;
  letter-spacing:.04em;
  color:#fff;
  line-height:1;
}
.au-os__est{
  font-size:9px; font-weight:600;
  letter-spacing:.32em; text-transform:uppercase;
  color:rgba(0,237,179,.7);
}
.au-os__lock{
  position:absolute; bottom:14%;
  width:24px; height:auto;
  color:rgba(0,237,179,.6);
}
.au-os__doctag{
  display:inline-flex; align-items:center; gap:10px;
  margin-bottom:14px;
  font-size:10px; font-weight:600;
  letter-spacing:.32em; text-transform:uppercase;
  color:var(--primary);
}
.au-os__doctag::before{
  content:""; width:6px; height:6px; border-radius:50%;
  background:var(--primary);
  box-shadow:0 0 12px rgba(0,237,179,.7);
}
.au-os__heading{
  margin:0 0 22px;
  font-size:clamp(40px, 5.4vw, 76px);
  font-weight:200; line-height:1.0;
  letter-spacing:-.025em;
  color:#fff;
}
.au-os__heading strong{
  font-weight:500;
  color:var(--primary);
  letter-spacing:.04em;
}
.au-os__lede{
  margin:0 0 24px;
  font-size:clamp(15px, 1.15vw, 17px);
  line-height:1.65;
  color:rgba(235,242,240,.78);
}
.au-os__meta{
  display:flex; flex-wrap:wrap; gap:18px;
  margin:24px 0;
  padding:14px 18px;
  background:rgba(0,237,179,.04);
  border:1px solid rgba(0,237,179,.14);
  border-radius:10px;
  font-size:10px; font-weight:600;
  letter-spacing:.24em; text-transform:uppercase;
  color:rgba(235,242,240,.55);
}
.au-os__meta span strong{
  color:var(--primary);
  font-weight:600;
}
.au-os__cta{
  display:inline-flex; align-items:center; gap:10px;
  padding:13px 22px;
  background:var(--primary);
  color:#011d17;
  border-radius:999px;
  font-size:13px; font-weight:700; letter-spacing:.01em;
  text-decoration:none;
  box-shadow:0 8px 32px -10px var(--primary-glow);
  transition:transform .25s var(--ease), background .25s var(--ease), box-shadow .25s var(--ease);
}
.au-os__cta:hover{
  transform:translateY(-2px);
  background:var(--primary-600);
  box-shadow:0 14px 40px -10px var(--primary-glow);
}
.au-os__cta-meta{
  display:block;
  margin-top:14px;
  font-size:11px; font-weight:500;
  letter-spacing:.04em;
  color:rgba(235,242,240,.5);
}

/* =====================================================================
   2. MANIFESTO — editorial 2-col "Das ist Globalist"
   ===================================================================== */
.au-manifesto{
  padding-block:clamp(80px, 10vw, 160px);
  background:linear-gradient(180deg, var(--bg) 0%, #03110d 100%);
}
.au-manifesto__inner{
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:clamp(40px, 6vw, 96px);
  align-items:center;
  position:relative;
  z-index:2;
}
.au-manifesto__heading{
  margin:0;
  font-family:'Inter',sans-serif;
  font-size:clamp(40px, 6vw, 84px);
  font-weight:200;
  line-height:1.02;
  letter-spacing:-.025em;
  color:#fff;
  text-wrap:balance;
}
.au-manifesto__heading strong{
  font-weight:600;
  color:var(--primary);
}
.au-manifesto__text{
  margin:0;
  font-size:clamp(15px, 1.15vw, 17px);
  line-height:1.65;
  color:rgba(235,242,240,.78);
  font-weight:400;
}
.au-manifesto__text p + p{ margin-top:1em; }

.au-manifesto__claim{
  position:relative;
  margin-top:48px;
  padding:18px 22px;
  background:rgba(0,237,179,.04);
  border:1px solid rgba(0,237,179,.16);
  border-radius:12px;
  font-family:'Inter',sans-serif;
  font-size:13px; letter-spacing:.04em;
  color:var(--primary);
  font-weight:500;
}
.au-manifesto__claim::before{
  content:"// claim";
  position:absolute; top:-9px; left:18px;
  padding:1px 8px;
  background:var(--bg);
  font-size:9px; font-weight:700;
  letter-spacing:.24em; text-transform:uppercase;
  color:rgba(255,255,255,.5);
}
.au-manifesto__orb-bg{
  position:absolute;
  top:-20%; right:-12%;
  width:clamp(220px, 30vw, 380px); aspect-ratio:1;
  opacity:.18;
  z-index:0;
}

/* =====================================================================
   3. BENTO — touchpoints / resources grid
   ===================================================================== */
.au-bento{
  padding-block:clamp(80px, 10vw, 160px);
  background:#03110d;
}
.au-bento__head{
  text-align:center;
  max-width:780px;
  margin:0 auto clamp(40px, 5vw, 72px);
  position:relative; z-index:2;
}
.au-bento__head h2{
  margin:0 0 18px;
  font-size:clamp(32px, 4.6vw, 56px);
  font-weight:300;
  letter-spacing:-.02em;
  color:#fff;
  line-height:1.05;
}
.au-bento__head p{
  margin:0;
  font-size:clamp(14px, 1.05vw, 16px);
  line-height:1.6;
  color:rgba(235,242,240,.7);
}

.au-bento__grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  grid-auto-rows:minmax(220px, auto);
  gap:16px;
  position:relative; z-index:2;
}
.au-tile{
  position:relative;
  padding:clamp(20px, 2.4vw, 32px);
  border-radius:18px;
  background:linear-gradient(160deg, rgba(7,31,25,.55) 0%, rgba(2,12,9,.78) 100%);
  border:1px solid rgba(255,255,255,.06);
  display:flex; flex-direction:column;
  gap:14px;
  text-decoration:none;
  color:inherit;
  overflow:hidden;
  isolation:isolate;
  transition:transform .4s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease), background .35s var(--ease);
}
.au-tile::before{
  content:""; position:absolute; inset:-1px;
  border-radius:inherit;
  background:linear-gradient(135deg, rgba(0,237,179,.0) 0%, rgba(0,237,179,.18) 100%);
  opacity:0;
  transition:opacity .4s var(--ease);
  z-index:-1;
}
.au-tile:hover{
  transform:translateY(-3px);
  border-color:rgba(0,237,179,.28);
  box-shadow:0 24px 60px -22px rgba(0,237,179,.22);
}
.au-tile:hover::before{ opacity:1; }
.au-tile:focus-visible{
  outline:2px solid var(--primary);
  outline-offset:3px;
}

.au-tile__eyebrow{
  font-size:10px; font-weight:700; letter-spacing:.32em; text-transform:uppercase;
  color:var(--primary);
}
.au-tile__title{
  margin:0;
  font-family:'Inter',sans-serif;
  font-weight:400;
  letter-spacing:-.015em;
  line-height:1.05;
  color:#fff;
}
.au-tile__sub{
  margin:0;
  font-size:14px; line-height:1.55;
  color:rgba(235,242,240,.65);
}
.au-tile__cta{
  margin-top:auto;
  display:inline-flex;align-items:center;gap:8px;
  padding-top:16px;
  font-size:13px; font-weight:600;
  color:var(--primary);
  text-decoration:none;
  transition:gap .25s var(--ease);
}
.au-tile:hover .au-tile__cta{ gap:14px; }
.au-tile__cta--soft{ color:rgba(255,255,255,.55); }

/* All tiles share one size in the 2x2 grid — visual symmetry over hierarchy. */
.au-tile .au-tile__title{
  font-size:clamp(24px, 2.4vw, 32px);
}

/* podcast — subtle mint accent in the background corner */
.au-tile--podcast{
  background:
    radial-gradient(80% 100% at 100% 0%, rgba(0,237,179,.10), transparent 65%),
    linear-gradient(180deg, rgba(7,31,25,.6) 0%, rgba(2,12,9,.88) 100%);
}
.au-tile__spotify{
  display:inline-flex;align-items:center;gap:10px;
  margin-top:auto; padding-top:18px;
  font-size:13px; font-weight:600;
  color:var(--primary);
  text-decoration:none;
}
.au-tile__spotify svg{
  width:22px; height:22px; flex-shrink:0;
  transition:transform .3s var(--ease);
}
.au-tile__spotify:hover svg{ transform:scale(1.12); }

/* =====================================================================
   4. DRIVE — "Was uns antreibt"
   ===================================================================== */
.au-drive{
  padding-block:clamp(80px, 10vw, 160px);
  background:linear-gradient(180deg, #03110d 0%, var(--bg) 100%);
  overflow:hidden;
}
.au-drive__inner{
  display:grid;
  grid-template-columns:1fr 1.1fr;
  gap:clamp(40px, 6vw, 96px);
  align-items:center;
  position:relative; z-index:2;
}
.au-drive__visual{
  position:relative;
  display:grid;
  place-items:center;
  aspect-ratio:1;
  max-width:560px;
  margin:0 auto;
  width:100%;
}
.au-drive__visual::before,
.au-drive__visual::after{
  content:""; position:absolute; inset:0;
  border-radius:50%;
  border:1px solid rgba(0,237,179,.12);
  pointer-events:none;
}
.au-drive__visual::before{
  inset:6%;
  animation:au-spin 70s linear infinite;
  border-style:dashed;
}
.au-drive__visual::after{
  inset:-8%;
  background:radial-gradient(circle at center, rgba(0,237,179,.10), transparent 65%);
  animation:au-pulse 4.5s ease-in-out infinite;
  border:0;
}
@keyframes au-pulse{
  0%, 100%{ opacity:.6; transform:scale(.98); }
  50%    { opacity:1;  transform:scale(1.04); }
}
.au-drive__img{
  position:relative;
  z-index:2;
  width:78%; height:auto;
  filter:drop-shadow(0 30px 60px rgba(0,0,0,.4));
  animation:au-float 7s ease-in-out infinite;
}
@keyframes au-float{
  0%, 100%{ transform:translateY(0); }
  50%    { transform:translateY(-10px); }
}

.au-drive__heading{
  margin:0 0 18px;
  font-size:clamp(36px, 5.4vw, 76px);
  font-weight:200;
  line-height:1.02;
  letter-spacing:-.025em;
  color:#fff;
  text-wrap:balance;
}
.au-drive__heading strong{
  font-weight:600;
  color:var(--primary);
}
.au-drive__text{
  margin:0;
  font-size:clamp(15px, 1.15vw, 17px);
  line-height:1.65;
  color:rgba(235,242,240,.78);
}
.au-drive__text strong{
  color:#fff; font-weight:600;
}
.au-drive__cta{
  display:inline-flex; align-items:center; gap:8px;
  margin-top:30px;
  padding:13px 22px;
  background:var(--primary);
  color:#011d17;
  border-radius:999px;
  font-size:13px; font-weight:700; letter-spacing:.01em;
  text-decoration:none;
  box-shadow:0 8px 32px -10px var(--primary-glow);
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease);
}
.au-drive__cta:hover{
  transform:translateY(-2px);
  background:var(--primary-600);
  box-shadow:0 14px 40px -10px var(--primary-glow);
}

/* =====================================================================
   5. VALUES — Globalist Core Values
   ===================================================================== */
.au-values{
  padding-block:clamp(80px, 10vw, 160px);
  position:relative;
  overflow:hidden;
}
.au-values__head{
  text-align:center;
  max-width:780px;
  margin:0 auto clamp(50px, 6vw, 90px);
  position:relative; z-index:2;
}
.au-values__head h2{
  margin:0 0 18px;
  font-size:clamp(32px, 4.6vw, 56px);
  font-weight:300;
  letter-spacing:-.02em;
  color:#fff;
  line-height:1.05;
}
.au-values__head p{
  margin:0;
  font-size:clamp(14px, 1.05vw, 16px);
  line-height:1.6;
  color:rgba(235,242,240,.7);
}

.au-values__grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:18px;
  position:relative; z-index:2;
}

.au-value{
  position:relative;
  padding:clamp(28px, 3vw, 44px);
  background:linear-gradient(160deg, rgba(7,31,25,.5) 0%, rgba(2,12,9,.78) 100%);
  border:1px solid rgba(255,255,255,.06);
  border-radius:20px;
  overflow:hidden;
  isolation:isolate;
  min-height:260px;
  display:flex; flex-direction:column; justify-content:flex-end;
  gap:14px;
  transition:transform .4s var(--ease), border-color .35s var(--ease), background .4s var(--ease);
}
.au-value:hover{
  transform:translateY(-3px);
  border-color:rgba(0,237,179,.28);
  background:linear-gradient(160deg, rgba(7,31,25,.75) 0%, rgba(0,237,179,.05) 100%);
}
.au-value__num{
  position:absolute;
  top:clamp(14px, 1.4vw, 22px);
  right:clamp(14px, 1.4vw, 22px);
  font-family:'Inter',sans-serif;
  font-size:clamp(64px, 7vw, 110px);
  font-weight:200;
  line-height:1;
  letter-spacing:-.04em;
  color:rgba(0,237,179,.10);
  z-index:0;
  transition:color .4s var(--ease);
  pointer-events:none;
}
.au-value:hover .au-value__num{
  color:rgba(0,237,179,.22);
}
.au-value__title{
  margin:0;
  font-family:'Inter',sans-serif;
  font-size:clamp(22px, 2vw, 30px);
  font-weight:500;
  letter-spacing:-.01em;
  line-height:1.1;
  color:#fff;
  position:relative; z-index:2;
}
.au-value__title::after{
  content:""; display:block;
  width:32px; height:1px;
  margin-top:14px;
  background:var(--primary);
  transform-origin:left;
  transform:scaleX(.5);
  transition:transform .4s var(--ease);
}
.au-value:hover .au-value__title::after{
  transform:scaleX(1);
}
.au-value__desc{
  margin:0;
  font-size:14px; line-height:1.55;
  color:rgba(235,242,240,.65);
  position:relative; z-index:2;
}

/* drifting orbs in the background of the values section */
.au-values__orbs{
  position:absolute; inset:0;
  pointer-events:none;
  z-index:0;
}
.au-values__orbs .au-orb{
  position:absolute;
  width:80px; height:80px;
  opacity:.06;
  filter:none;
}
.au-values__orbs .au-orb:nth-child(1){ top:8%;  left:6%;  animation-duration:8s; }
.au-values__orbs .au-orb:nth-child(2){ top:38%; left:88%; animation-duration:7s; animation-delay:-2s; }
.au-values__orbs .au-orb:nth-child(3){ top:72%; left:12%; animation-duration:9s; animation-delay:-1s; }
.au-values__orbs .au-orb:nth-child(4){ top:18%; left:62%; animation-duration:6s; }
.au-values__orbs .au-orb:nth-child(5){ top:82%; left:78%; animation-duration:8s; animation-delay:-3s; }

/* =====================================================================
   Responsive — locked breakpoints (1199 / 991 / 767 / 480)
   ===================================================================== */
@media (max-width:1199px){
  .au-bento__grid{ gap:14px; }
  .au-stats__inner{ gap:48px; }
  .au-os__inner{ gap:60px; }
}
@media (max-width:991px){
  .au-manifesto__inner,
  .au-drive__inner,
  .au-stats__inner,
  .au-os__inner{
    grid-template-columns:1fr;
    gap:40px;
    align-items:start;
  }
  .au-drive__visual{ max-width:420px; }
  .au-os__seal{ max-width:240px; }

  /* 2x2 stays on tablet — same grid-template, just tighter gap */
  .au-bento__grid{ gap:12px; }

  .au-stats__grid{ grid-template-columns:1fr 1fr; }

  .au-values__grid{ grid-template-columns:repeat(2, 1fr); }

  .au-hero__cue{ display:none; }
  /* Aurora a bit tighter on tablet so it stays atmospheric, not busy */
  .au-hero__aurora{ filter:blur(70px) saturate(140%); }
}
@media (max-width:767px){
  .au-section{ padding-inline:18px; }
  .au-bento__grid{ grid-template-columns:1fr; }

  .au-values__grid{ grid-template-columns:1fr; }
  .au-value{ min-height:220px; }

  .au-stats__grid{ grid-template-columns:1fr; }

  .au-hero{
    min-height:auto;
    padding-block:96px 64px;
  }
  .au-hero__headline{
    font-size:clamp(34px, 9.5vw, 60px) !important;
  }
  .au-hero__sub{
    font-size:15px;
    margin-top:22px;
    padding:0 4px;
  }
  .au-hero__eyebrow{ margin-bottom:18px; }
  .au-hero__aurora{ filter:blur(56px) saturate(135%); }
  /* Slow the aurora a touch on mobile to be battery-kind */
  .au-hero__blob--a{ animation-duration:36s; }
  .au-hero__blob--b{ animation-duration:42s; }
  .au-hero__blob--c{ animation-duration:30s; }
}
@media (max-width:480px){
  .au-hero{
    padding-block:88px 56px;
  }
  .au-hero__headline{
    font-size:clamp(32px, 9vw, 46px) !important;
    line-height:1.08 !important;
  }
  .au-hero__eyebrow{
    font-size:10px;
    letter-spacing:.28em;
  }
  .au-tile{ padding:22px; }
  .au-value{ padding:24px; min-height:200px; }
  .au-value__num{ font-size:72px; }
}

/* Touch — defang hover transforms that linger awkwardly on tap */
@media (hover:none){
  .au-tile:hover{ transform:none; }
  .au-value:hover{ transform:none; }
}

/* prefers-reduced-motion — kill motion, freeze aurora, force visibility */
@media (prefers-reduced-motion: reduce){
  .au-page *,
  .au-page *::before,
  .au-page *::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .au-hero__eyebrow,
  .au-hero__headline,
  .au-hero__sub,
  .au-hero__cue{
    opacity:1 !important;
    transform:none !important;
  }
}
