/* ===========================================================================
   VFO — JOIN OUR TEAM · NETLIFY DESKTOP · PRODUCTION
   ===========================================================================
   v5 is a TYPOGRAPHY + FLOW pass on top of the v4 structure. Nothing was
   restructured. The problem v5 fixes is that almost every section was
   shouting at hero volume, so nothing read as more important than anything
   else.

   THE TYPE SCALE — a visible step down at every level
       Hero H1 .................. 51px max
       Feature statement ........ 36px max   (PPF · Isn't For Everyone)
       Primary section header ... 34px max   (.h-sec)
       Feature panel header ..... 32px max   (Get In · Pay)
       Quiet section header ..... 30px max   (.h-sec.h-quiet — Core Values)
       Subsection header ........ 23–27px    (Mission/Vision, Push/Support…)
       Card / panel header ...... 20–21px    (values, paths, tracks, duo)
       Body ..................... 15.5–16.5px
       Eyebrow .................. 12px
       Final CTA ................ 52px max   (the crescendo, not a new hero)

   Weight came down from 800 to 700 on every display line, negative letter
   spacing was relaxed roughly 40%, and line-height opened up across the
   board. Vertical spacing was retuned to the smaller type so the page does
   not leave 46px-headline holes around 30px headlines.

   v4 was the DESIGN CORRECTION that pulled the page back onto the
   established VFO website system.

   REMOVED IN v4
     · the numbered hero rail (01 PEOPLE … 05 RESULTS) and all its CSS/JS
     · the floating phrases inside the hero animation
     · the giant outlined 01 / 02 behind Mission and Vision
     · the outlined numerals on all seven Core Values
     · the portrait overlapping the recruitment video
     · the six animated growth progress bars
     · every decorative glow layer
     · per-photograph bespoke treatments, tags and captions
     · gradient "signature" panels on Ownership, Get In and Isn't For Everyone

   WHAT STAYS
     the hero animation, the PPF interaction, the push/support scale, and the
     approved chrome — nav, footer, buttons, eyebrows, Poppins, the palette,
     1280px max width and the site's section-padding discipline.

   COLOUR DISCIPLINE (carried from v3). One job per accent:
       RED     standards · urgency · ownership · the recruiting CTA
       TEAL    team · support · the corporate path · what we owe you
       GOLD    PPF · opportunity · aspiration
       ORANGE  the field · movement · deployment
   =========================================================================== */

/* ══════════════════ TOKENS ══════════════════ */
:root{
  --red:#EC1B33;
  --teal:#0FA8B9;
  --gold:#F8AE32;
  --orange:#F07521;
  --offwhite:#F7F1EB;
  --black:#090909;

  /* Three grounds, not five. Quiet alternation, no gradient transitions. */
  --ink-900:#050506;   /* hero, video, final close */
  --ink-800:#08080A;   /* primary section ground */
  --ink-700:#0D0D11;   /* alternate section ground */
  --ink-600:#131318;   /* panel / card surface */
  --ink-500:#1A1A20;   /* panel hover */

  --line:rgba(247,241,235,.10);
  --line-2:rgba(247,241,235,.17);
  --body:#C2C0BD;
  --muted:#8A8885;
  --dim:#666462;

  --maxw:1280px;
  --pad:48px;
}

/* ══════════════════ RESET / BASE ══════════════════ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:16px;font-weight:400;line-height:1.75;
  background:var(--ink-800);color:var(--offwhite);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;}
h1,h2,h3,h4{font-weight:700;line-height:1.1;letter-spacing:-0.02em;}
em{font-style:normal;}
figure{margin:0;}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;}
.skip{
  position:absolute;left:-9999px;top:0;z-index:200;
  background:var(--gold);color:var(--black);padding:12px 20px;
  font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
}
.skip:focus{left:0;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad);}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

/* ── Shared type primitives — the site's, unchanged ── */
.eyebrow{
  display:flex;align-items:center;gap:11px;
  font-size:12px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;
  line-height:1.4;color:var(--muted);
}
.eyebrow .sq{width:9px;height:9px;flex:0 0 9px;background:var(--red);}
.eyebrow .sq.t{background:var(--teal);}
.eyebrow .sq.g{background:var(--gold);}
.eyebrow .sq.o{background:var(--orange);}
.h-sec{
  font-size:clamp(28px,2.35vw,34px);
  font-weight:700;line-height:1.14;letter-spacing:-0.022em;
  text-transform:uppercase;margin-top:16px;color:#fff;
}
/* Quieter variant for the sections that should NOT announce themselves:
   Core Values and Meaningful Work sit a step below the others. */
.h-sec.h-quiet{font-size:clamp(25px,2.05vw,30px);}
.lede{font-size:16.5px;line-height:1.8;max-width:660px;margin-top:18px;color:var(--body);}
.lede + .lede{margin-top:16px;}
.lede strong{color:#fff;font-weight:600;}
.sec-head{display:grid;grid-template-columns:1.08fr 1fr;gap:0 72px;align-items:end;}
.sec-head .head-l{grid-column:1;}
.sec-head .head-r{grid-column:2;padding-bottom:8px;}
.sec-head .head-r .lede{max-width:none;margin-top:0;}

/* ── Buttons — approved system ── */
.btn{
  display:inline-flex;align-items:center;gap:9px;
  font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  padding:17px 32px;border:1.5px solid transparent;line-height:1;
  transition:background-color .22s,color .22s,border-color .22s,transform .22s;
}
.btn-red{background:var(--red);color:#fff;border-color:var(--red);}
.btn-red:hover{background:#C9142A;border-color:#C9142A;transform:translateY(-2px);}
.btn-ghost{border-color:rgba(247,241,235,.34);color:var(--offwhite);}
.btn-ghost:hover{border-color:var(--offwhite);background:rgba(247,241,235,.07);}
.btn-lg{font-size:14px;padding:21px 40px;letter-spacing:.15em;}
.tlink{
  display:inline-flex;align-items:center;gap:8px;
  font-size:13px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  padding-bottom:6px;border-bottom:2px solid currentColor;transition:gap .22s;
}
.tlink:hover{gap:15px;}

/* ══════════════════ NAV — approved chrome ══════════════════ */
.nav{
  position:sticky;top:0;z-index:100;background:rgba(5,5,6,.90);
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
}
.nav-in{
  max-width:var(--maxw);margin:0 auto;padding:0 var(--pad);
  height:96px;display:flex;align-items:center;justify-content:space-between;gap:40px;
}
.nav-logo img{height:34px;width:auto;}
.nav-links{display:flex;align-items:center;gap:34px;}
.nav-links a{
  font-size:13.5px;font-weight:500;letter-spacing:.06em;
  color:var(--body);transition:color .2s;position:relative;padding:6px 0;
}
.nav-links a::after{
  content:'';position:absolute;left:0;bottom:0;height:2px;width:0;
  background:var(--red);transition:width .25s;
}
.nav-links a:hover{color:#fff;}
.nav-links a:hover::after{width:100%;}
.nav-links a.btn{
  font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  padding:17px 32px;color:#fff;
}
.nav-links a.btn::after{content:none;}
.nav-links a.btn:hover{color:#fff;}

/* ── Current page ─────────────────────────────────────────────────────────
      ABOUT VFO and JOIN OUR TEAM are top-level links now, so the whole ABOUT
      disclosure component — wrapper, toggle, caret, pointer bridge, panel and
      its current-state rules — has been DELETED from this stylesheet rather
      than hidden. What remains is the current-page treatment for a top-level
      item: white label, full-width teal rule, the same language the rest of
      the VFO header system uses. ─────────────────────────────────────────── */
.nav-links a.current{color:#fff;}
.nav-links a.current::after{width:100%;background:var(--teal);}

/* ══════════════════ SECTION GROUNDS — quiet alternation ══════════════════ */
section{position:relative;}
.pad{padding:88px 0;}
.pad-s{padding:72px 0;}
[id]{scroll-margin-top:112px;}
.g-deep{background:var(--ink-900);}
.g-base{background:var(--ink-800);}
.g-panel{background:var(--ink-700);}
.rule-top::before{
  content:'';position:absolute;left:0;right:0;top:0;height:1px;background:var(--line);
}

/* The one panel treatment used across the page — the site's card. */
.panel{background:var(--ink-600);border:1px solid var(--line);}
.panel-red{border-top:2px solid var(--red);}
.panel-teal{border-top:2px solid var(--teal);}
.panel-gold{border-top:2px solid var(--gold);}
.panel-orange{border-top:2px solid var(--orange);}

/* ═══════════════════════════════════════════════════════════════════════════
   1 · HERO — short. The visitor reaches the video almost immediately.
   ═══════════════════════════════════════════════════════════════════════════ */
.hero{position:relative;background:var(--ink-900);overflow:hidden;min-height:620px;}
.hero-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;}
.hero-scrim{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(96deg,
    rgba(5,5,6,.97) 0%,rgba(5,5,6,.90) 24%,rgba(5,5,6,.62) 38%,
    rgba(5,5,6,.22) 52%,rgba(5,5,6,0) 68%);
}
.hero-scrim-y{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(5,5,6,.66) 0%,rgba(5,5,6,0) 24%,rgba(5,5,6,0) 64%,rgba(5,5,6,.90) 92%,var(--ink-900) 100%);
}
.hero-in{position:relative;max-width:var(--maxw);margin:0 auto;padding:90px var(--pad) 98px;}
.hero-copy{position:relative;max-width:840px;}
.hero h1{
  font-size:clamp(38px,3.5vw,51px);
  line-height:1.08;letter-spacing:-0.032em;color:#fff;
  margin-top:18px;text-transform:uppercase;
  text-shadow:0 2px 30px rgba(5,5,6,.9);
}
.hero h1 .b{display:block;}
.hero h1 em{color:var(--gold);}
.hero .lede{font-size:16.5px;max-width:560px;margin-top:20px;text-shadow:0 2px 22px rgba(5,5,6,.92);}

/* BUILD. GROW. WIN. — kept exactly */
.anchor{display:inline-flex;flex-direction:column;gap:12px;margin-top:26px;}
.anchor .words{
  display:flex;gap:22px;font-size:19px;font-weight:700;letter-spacing:.10em;
  text-transform:uppercase;line-height:1;
}
.anchor .aw1{color:var(--red);} .anchor .aw2{color:var(--teal);} .anchor .aw3{color:var(--gold);}
.anchor .rule{height:3px;width:100%;background:linear-gradient(90deg,var(--red) 0 33.3%,var(--teal) 33.3% 66.6%,var(--gold) 66.6% 100%);}
.hero-ctas{display:flex;gap:26px;align-items:center;margin-top:30px;flex-wrap:wrap;}
.hero-ctas .tlink{color:var(--muted);border-bottom-color:rgba(247,241,235,.24);}
.hero-ctas .tlink:hover{color:var(--offwhite);border-bottom-color:var(--offwhite);}

/* ═══════════════════════════════════════════════════════════════════════════
   2 · RECRUITMENT VIDEO — featured editorial, not full-screen cinema
   ═══════════════════════════════════════════════════════════════════════════ */
.vid{background:var(--ink-900);padding:68px 0 76px;}
.vid-head{max-width:760px;}
.vid-head .h-sec{margin-top:14px;}
.vid-stage{max-width:960px;margin:38px auto 0;}
.vid-frame{
  position:relative;aspect-ratio:16/9;background:#000;overflow:hidden;
  border:1px solid var(--line);
}
.vid-frame video{width:100%;height:100%;display:block;object-fit:cover;background:#000;}
video,video *{font-family:'Poppins',-apple-system,sans-serif;color:var(--body);}
.vid-play{
  position:absolute;inset:0;width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
  background:rgba(5,5,6,.26);border:0;cursor:pointer;font-family:inherit;color:#fff;
  transition:opacity .35s ease,background-color .35s ease;
}
.vid-play .ring{
  width:88px;height:88px;border-radius:50%;border:2px solid rgba(247,241,235,.9);
  display:flex;align-items:center;justify-content:center;background:rgba(5,5,6,.28);
  transition:transform .3s cubic-bezier(.22,.61,.36,1),background-color .3s,border-color .3s;
}
.vid-play .tri{
  width:0;height:0;margin-left:6px;
  border-left:21px solid #fff;border-top:13px solid transparent;border-bottom:13px solid transparent;
}
.vid-play:hover .ring{transform:scale(1.07);background:var(--red);border-color:var(--red);}
.vid-play.gone{opacity:0;pointer-events:none;}
/* The one line that stays with the video. No duration, no sound note. */
.vid-note{
  max-width:960px;margin:16px auto 0;text-align:right;
  font-size:11.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);
}

/* ══════════════════ CTA STRIP ══════════════════ */
.ctastrip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--ink-700);}
.ctastrip-in{
  max-width:var(--maxw);margin:0 auto;padding:28px var(--pad);
  display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap;
}
.ctastrip .msg{
  font-size:17px;font-weight:700;letter-spacing:-0.008em;text-transform:uppercase;
  color:#fff;line-height:1.4;max-width:800px;
}
.ctastrip .msg em{color:var(--gold);}

/* ═══════════════════════════════════════════════════════════════════════════
   3 · MISSION + VISION — the site's own editorial treatment
   ═══════════════════════════════════════════════════════════════════════════ */
.mv{display:grid;grid-template-columns:180px 1fr;gap:0 56px;align-items:start;}
.mv + .mv{margin-top:44px;padding-top:44px;border-top:1px solid var(--line);}
.mv .lab{
  font-size:12px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;
  padding-top:12px;position:relative;color:var(--muted);
}
.mv .lab::before{content:'';display:block;width:34px;height:3px;margin-bottom:16px;}
.mv-mission .lab::before{background:var(--red);}
.mv-vision .lab::before{background:var(--teal);}
.mv .stmt{
  font-size:clamp(24px,2.05vw,30px);font-weight:700;line-height:1.26;
  letter-spacing:-0.02em;text-transform:uppercase;color:#fff;max-width:940px;
}
.mv-vision .stmt{font-size:clamp(21px,1.8vw,26px);line-height:1.3;}
/* §15 — this line must hold on ONE line at desktop widths */
.mv .note{
  margin-top:18px;font-size:15.5px;line-height:1.75;color:var(--body);
  max-width:none;padding-left:24px;border-left:1px solid var(--line-2);
}
.mv .note strong{color:#fff;font-weight:600;}
/* The three PPF words light in sequence — the bridge into the PPF section. */
.mv-vision .w{color:rgba(247,241,235,.38);transition:color .7s ease;}
.mv-vision.lit .w-p{color:var(--red);transition-delay:.35s;}
.mv-vision.lit .w-r{color:var(--teal);transition-delay:.9s;}
.mv-vision.lit .w-f{color:var(--gold);transition-delay:1.45s;}

/* ═══════════════════════════════════════════════════════════════════════════
   4 · PPF
   ═══════════════════════════════════════════════════════════════════════════ */
.ppf-h{
  font-size:clamp(28px,2.5vw,36px);font-weight:700;line-height:1.14;
  letter-spacing:-0.026em;text-transform:uppercase;color:#fff;max-width:820px;margin-top:16px;
}
.ppf-h .p{color:var(--red);} .ppf-h .r{color:var(--teal);} .ppf-h .f{color:var(--gold);}
.ppf-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 72px;align-items:center;margin-top:48px;}
.ppf-svg{width:100%;height:auto;display:block;overflow:visible;}
.ppf-edge{stroke-width:1.6;fill:none;stroke-dasharray:1;stroke-dashoffset:1;
  transition:stroke-dashoffset 1.1s ease,stroke-width .45s ease,opacity .45s ease;opacity:.5;}
.reveal.on .ppf-edge{stroke-dashoffset:0;}
.ppf-edge.e1{stroke:var(--red);transition-delay:.15s,0s,0s;}
.ppf-edge.e2{stroke:var(--teal);transition-delay:.45s,0s,0s;}
.ppf-edge.e3{stroke:var(--gold);transition-delay:.75s,0s,0s;}
.ppf-spoke{stroke-width:1;fill:none;opacity:.18;transition:opacity .45s ease;}
.ppf-spoke.lit{opacity:.55;}
.ppf-core{opacity:0;transition:opacity .7s ease 1.25s;}
.reveal.on .ppf-core{opacity:1;}
.ppf-core .ring-out{transition:r .5s ease,stroke-opacity .5s ease;}
.ppf-node circle{transition:r .45s ease,stroke-opacity .45s ease;}
.ppf-node text{
  font-family:'Poppins',sans-serif;font-size:13px;font-weight:800;
  letter-spacing:.18em;text-transform:uppercase;fill:rgba(247,241,235,.42);transition:fill .4s ease;
}
.ppf-node.lit text{fill:#fff;}
.ppf-core text{
  font-family:'Poppins',sans-serif;font-size:15px;font-weight:800;
  letter-spacing:.2em;fill:var(--gold);text-transform:uppercase;
}
.ppf-core .s{font-size:11.5px;font-weight:600;letter-spacing:.16em;fill:var(--muted);}
.ppf-pulse{opacity:0;}
.ppf-tabs{display:flex;flex-direction:column;}
.ppf-tab{
  display:block;width:100%;text-align:left;background:none;border:0;cursor:pointer;
  font-family:inherit;color:inherit;padding:21px 0 21px 24px;
  border-top:1px solid var(--line);border-left:2px solid transparent;
  transition:border-color .35s,background-color .35s;
}
.ppf-tab:last-child{border-bottom:1px solid var(--line);}
.ppf-tab .t{
  display:flex;align-items:center;gap:14px;
  font-size:17px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  color:rgba(247,241,235,.5);line-height:1.1;transition:color .35s;
}
.ppf-tab .dot{width:10px;height:10px;flex:0 0 10px;border-radius:50%;}
.ppf-tab .d{margin-top:12px;font-size:14.5px;line-height:1.7;color:var(--dim);transition:color .35s;}
.ppf-tab[data-k="personal"] .dot{background:var(--red);}
.ppf-tab[data-k="professional"] .dot{background:var(--teal);}
.ppf-tab[data-k="financial"] .dot{background:var(--gold);}
.ppf-tab.on .t{color:#fff;}
.ppf-tab.on .d{color:var(--body);}
.ppf-tab.on[data-k="personal"]{border-left-color:var(--red);}
.ppf-tab.on[data-k="professional"]{border-left-color:var(--teal);}
.ppf-tab.on[data-k="financial"]{border-left-color:var(--gold);}

/* ═══════════════════════════════════════════════════════════════════════════
   5 · CORE VALUES — one quiet grid, no numbers, no per-value device
   ═══════════════════════════════════════════════════════════════════════════ */
.vals{display:grid;grid-template-columns:repeat(12,1fr);gap:14px;margin-top:44px;}
.val{
  grid-column:span 3;background:var(--ink-600);border:1px solid var(--line);
  border-top:2px solid var(--red);padding:30px 28px 28px;
  transition:background-color .3s;
}
.val:nth-child(n+5){grid-column:span 4;}
.val:hover{background:var(--ink-500);}
.val .name{
  font-size:clamp(17px,1.42vw,20px);font-weight:700;letter-spacing:-0.01em;
  text-transform:uppercase;color:#fff;line-height:1.2;
}
.val .def{margin-top:14px;font-size:14.5px;line-height:1.7;color:var(--body);}

/* Ownership — the standard panel, not a signature gradient */
.own{margin-top:14px;padding:40px;}
.own .grid{display:grid;grid-template-columns:1fr 1.05fr;gap:0 60px;align-items:start;}
.own h3{
  font-size:clamp(21px,1.75vw,25px);text-transform:uppercase;letter-spacing:-0.02em;
  line-height:1.18;color:#fff;max-width:460px;
}
.own h3 em{color:var(--orange);}
.own p{font-size:15.5px;line-height:1.8;color:var(--body);margin-top:20px;max-width:540px;}
.own p strong{color:#fff;font-weight:600;}
.chips{display:flex;flex-wrap:wrap;gap:9px;}
.chip{
  font-size:12.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  padding:10px 16px;border:1px solid var(--line-2);color:var(--body);line-height:1;
  transition:border-color .25s,color .25s;
}
.chip:hover{border-color:rgba(247,241,235,.4);color:#fff;}

/* ═══════════════════════════════════════════════════════════════════════════
   6 · WE MOVE FAST / ISN'T FOR EVERYONE
   ═══════════════════════════════════════════════════════════════════════════ */
/* Clean editorial split — image one side, copy the other. */
.split{display:grid;grid-template-columns:0.78fr 1fr;gap:0 68px;align-items:center;margin-top:44px;}
.split-photo{aspect-ratio:4/5;overflow:hidden;border:1px solid var(--line);}
.split-photo img{width:100%;height:100%;object-fit:cover;display:block;}
.fastlist{border-top:1px solid var(--line);}
.fastlist li{
  padding:17px 0;border-bottom:1px solid var(--line);
  font-size:16px;line-height:1.55;color:var(--body);display:flex;gap:15px;align-items:baseline;
}
.fastlist li::before{content:'';width:7px;height:7px;flex:0 0 7px;background:var(--orange);transform:translateY(-1px);}
.counter{margin-top:32px;padding:32px 36px;display:grid;grid-template-columns:1fr 1.2fr;gap:0 48px;align-items:center;}
.counter h3{
  font-size:clamp(19px,1.55vw,23px);text-transform:uppercase;letter-spacing:-0.018em;
  line-height:1.22;color:#fff;
}
.counter p{font-size:15.5px;line-height:1.8;color:var(--body);}
.counter p strong{color:#fff;font-weight:600;}

/* PUSH HARD / SUPPORT HARD */
.balance{margin-top:72px;}
.balance-h{
  display:flex;gap:18px;align-items:baseline;flex-wrap:wrap;
  font-size:clamp(22px,1.85vw,27px);font-weight:700;letter-spacing:-0.02em;
  text-transform:uppercase;line-height:1.1;
}
.balance-h .a{color:var(--red);} .balance-h .b{color:var(--teal);}
.scale{margin-top:28px;border-top:1px solid var(--line);}
.scale-row{display:grid;grid-template-columns:1fr 96px 1fr;align-items:center;border-bottom:1px solid var(--line);}
.scale-row .l,.scale-row .r{padding:20px 0;font-size:15.5px;line-height:1.55;}
.scale-row .l{color:#fff;font-weight:600;padding-right:24px;}
.scale-row .r{color:var(--body);padding-left:24px;}
.scale-row .mid{position:relative;height:100%;display:flex;align-items:center;justify-content:center;}
.scale-row .mid::before{
  content:'';position:absolute;left:0;right:0;height:1px;
  background:linear-gradient(90deg,var(--red),var(--teal));opacity:.55;
}
.scale-row .mid span{position:relative;width:8px;height:8px;background:var(--offwhite);transform:rotate(45deg);}
.scale-head{
  display:grid;grid-template-columns:1fr 96px 1fr;
  font-size:11.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;padding-bottom:14px;
}
.scale-head .a{color:var(--red);} .scale-head .b{color:var(--teal);padding-left:24px;}

/* Isn't for everyone */
.nfe{margin-top:80px;padding-top:52px;border-top:2px solid var(--red);}
.nfe-h{
  font-size:clamp(28px,2.5vw,36px);font-weight:700;letter-spacing:-0.026em;
  text-transform:uppercase;line-height:1.1;color:#fff;
}
.nfe-h em{color:var(--red);}
.nfe-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 72px;margin-top:36px;align-items:start;}
.ifs li{padding:16px 0;border-bottom:1px solid var(--line);font-size:16px;line-height:1.55;color:var(--body);}
.ifs li:first-child{border-top:1px solid var(--line);}
.ifs li em{display:block;margin-top:5px;color:#fff;font-weight:600;}
.buts{padding:36px 34px;}
.buts .k{font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--teal);}
.buts .list{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px;}
.buts .list span{
  font-size:13.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  padding:11px 16px;border:1px solid rgba(15,168,185,.30);color:var(--offwhite);line-height:1;
}
.buts .close{
  margin-top:26px;font-size:clamp(18px,1.5vw,22px);font-weight:700;
  text-transform:uppercase;letter-spacing:-0.014em;line-height:1.24;color:#fff;
}
.buts .close em{color:var(--teal);}
.nfe-note{
  margin-top:34px;padding-left:24px;border-left:2px solid var(--gold);
  font-size:15.5px;line-height:1.8;color:var(--body);max-width:880px;
}
.nfe-note strong{color:#fff;font-weight:600;}

/* ═══════════════════════════════════════════════════════════════════════════
   7 · TWO PATHS — ONE VFO
   ═══════════════════════════════════════════════════════════════════════════ */
.paths{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:44px;}
.path{padding:38px 36px 34px;display:flex;flex-direction:column;}
.path .k{font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;}
.path.p-corp .k{color:var(--teal);}
.path.p-field .k{color:var(--orange);}
.path h3{
  font-size:clamp(18px,1.5vw,21px);text-transform:uppercase;letter-spacing:-0.015em;
  line-height:1.28;color:#fff;margin-top:16px;min-height:3.84em;
}
.path .sub{font-size:15.5px;line-height:1.78;color:var(--body);margin-top:18px;}
.path .items{margin-top:26px;border-top:1px solid var(--line);}
.path .items li{
  padding:12px 0 12px 24px;border-bottom:1px solid var(--line);position:relative;
  font-size:14.5px;line-height:1.55;color:var(--body);
}
.path .items li::before{content:'';position:absolute;left:0;top:1.05em;width:9px;height:1.5px;}
.path.p-corp .items li::before{background:var(--teal);}
.path.p-field .items li::before{background:var(--orange);}
.path .items li strong{color:#fff;font-weight:600;}
.terms-box{margin-top:26px;border:1px solid var(--line);border-left:2px solid;padding:22px 24px;}
.terms-box .t{font-size:14px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;line-height:1.2;}
.terms-box p{margin-top:12px;font-size:13.5px;line-height:1.7;color:var(--body);}
.p-field .terms-box{border-left-color:var(--orange);}
.p-field .terms-box .t{color:var(--orange);}
.p-corp .terms-box{border-left-color:var(--teal);}
.p-corp .terms-box .t{color:var(--teal);}
.path .qual{margin-top:auto;padding-top:24px;font-size:13.5px;line-height:1.7;color:var(--dim);}

.knit{
  margin-top:40px;padding-top:40px;border-top:1px solid var(--line);
  display:grid;grid-template-columns:1fr 1fr;gap:0 72px;align-items:center;
}
.knit .a,.knit .b{
  font-size:clamp(17px,1.42vw,20px);font-weight:700;text-transform:uppercase;
  letter-spacing:-0.014em;line-height:1.3;color:#fff;
}
.knit .a em{color:var(--orange);} .knit .b em{color:var(--teal);}
.knit .b{padding-left:40px;border-left:1px solid var(--line);}

/* ═══════════════════════════════════════════════════════════════════════════
   8 · GROWTH
   ═══════════════════════════════════════════════════════════════════════════ */
/* The six "more" statements as a quiet grid, not animated progress bars. */
.mores{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:44px;
  background:var(--line);border:1px solid var(--line);}
.more{background:var(--ink-800);padding:26px 26px 24px;}
.more .l{font-size:16px;font-weight:700;letter-spacing:.035em;text-transform:uppercase;color:#fff;line-height:1.24;}
.more .l i{font-style:normal;color:var(--gold);}
.more .d{margin-top:9px;font-size:14px;line-height:1.6;color:var(--muted);}

.getin{margin-top:48px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;overflow:hidden;}
.getin .gphoto{position:relative;min-height:400px;}
.getin .gphoto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.getin .gbody{padding:44px 42px;display:flex;flex-direction:column;justify-content:center;}
.getin h3{
  font-size:clamp(26px,2.2vw,32px);font-weight:700;letter-spacing:-0.024em;
  text-transform:uppercase;line-height:1.12;color:#fff;
}
.getin h3 em{color:var(--red);}
.getin p{font-size:16px;line-height:1.8;color:var(--body);margin-top:18px;}
.getin p strong{color:#fff;font-weight:600;}
.getin .cta{margin-top:28px;}

.tracks{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:48px;}
.track-col{padding:34px 32px 32px;}
.track-col .k{font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;}
.track-col.t-field .k{color:var(--orange);}
.track-col.t-corp .k{color:var(--teal);}
.track-col h3{
  font-size:clamp(17px,1.42vw,20px);text-transform:uppercase;letter-spacing:-0.014em;
  color:#fff;margin-top:12px;line-height:1.24;min-height:2.48em;
}
.steps{margin-top:26px;}
.step{position:relative;padding:0 0 26px 40px;}
.step:last-child{padding-bottom:0;}
.step::before{content:'';position:absolute;left:8px;top:22px;bottom:-4px;width:1px;background:var(--line);}
.step:last-child::before{display:none;}
.step .dot{position:absolute;left:0;top:5px;width:17px;height:17px;border:2px solid;display:flex;align-items:center;justify-content:center;}
.t-field .step .dot{border-color:var(--orange);}
.t-corp .step .dot{border-color:var(--teal);}
.step .dot::after{content:'';width:5px;height:5px;}
.t-field .step .dot::after{background:var(--orange);}
.t-corp .step .dot::after{background:var(--teal);}
.step .t{font-size:14.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#fff;line-height:1.3;}
.step .d{margin-top:6px;font-size:14px;line-height:1.6;color:var(--muted);}

/* ═══════════════════════════════════════════════════════════════════════════
   9 · THE DEAL
   ═══════════════════════════════════════════════════════════════════════════ */
/* The black pay box, kept — it works because the section around it is not black. */
.pay{
  margin-top:44px;display:grid;grid-template-columns:1.05fr 1fr;gap:0 68px;align-items:center;
  background:var(--ink-900);border:1px solid var(--line);border-left:3px solid var(--orange);
  padding:52px 50px;
}
.pay h3{
  font-size:clamp(26px,2.2vw,32px);font-weight:700;letter-spacing:-0.024em;
  text-transform:uppercase;line-height:1.12;color:#fff;
}
.pay h3 em{color:var(--orange);}
.pay p{font-size:15.5px;line-height:1.82;color:var(--body);}
.pay p + p{margin-top:16px;}
.pay p strong{color:#fff;font-weight:600;}

.duo{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:60px;align-items:stretch;}
.duo > div{padding:36px 34px;}
.duo h3{
  font-size:clamp(18px,1.5vw,21px);text-transform:uppercase;letter-spacing:-0.015em;
  line-height:1.26;color:#fff;margin-top:12px;
}
.duo .t-travel h3 em{color:var(--orange);}
.duo .t-dev h3 em{color:var(--teal);}
.duo p{font-size:15.5px;line-height:1.78;color:var(--body);margin-top:18px;}
.duo p strong{color:#fff;font-weight:600;}
.duo .k{font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);}

.bens{margin-top:60px;padding-top:40px;border-top:1px solid var(--line);}
.bens .k{font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);}
.bens h3{font-size:clamp(18px,1.5vw,21px);text-transform:uppercase;letter-spacing:-0.015em;color:#fff;margin-top:12px;}
.bengrid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:30px;background:var(--line);border:1px solid var(--line);}
.ben{background:var(--ink-700);padding:24px 22px;transition:background-color .3s;}
.ben:hover{background:var(--ink-600);}
.ben .i{display:block;width:24px;height:2px;margin-bottom:16px;background:var(--teal);}
.ben .t{font-size:14px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#fff;line-height:1.3;}

/* ═══════════════════════════════════════════════════════════════════════════
   10 · MEANINGFUL WORK + RECIPROCAL EXPECTATIONS
   ═══════════════════════════════════════════════════════════════════════════ */
.real{display:grid;grid-template-columns:1fr 1fr;gap:0 72px;margin-top:40px;align-items:start;}
.real h2{font-size:clamp(22px,1.85vw,27px);text-transform:uppercase;letter-spacing:-0.02em;line-height:1.2;color:#fff;}
.real h2 em{color:var(--gold);}
.real p{font-size:16px;line-height:1.82;color:var(--body);margin-top:20px;}
.real p strong{color:#fff;font-weight:600;}

.recip{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:64px;}
.recip-col{padding:36px 34px;}
.recip-col .k{font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;}
.recip-col.c-them .k{color:var(--teal);}
.recip-col.c-you .k{color:var(--red);}
.recip-col h3{font-size:clamp(19px,1.6vw,23px);text-transform:uppercase;letter-spacing:-0.018em;color:#fff;margin-top:12px;line-height:1.2;}
.recip-col ul{margin-top:26px;}
.recip-col li{
  padding:14px 0 14px 24px;border-bottom:1px solid var(--line);position:relative;
  font-size:15px;line-height:1.6;color:var(--body);
}
.recip-col li:first-child{border-top:1px solid var(--line);}
.recip-col li:last-child{border-bottom:none;}
.recip-col li strong{color:#fff;font-weight:600;}
.recip-col li::before{content:'';position:absolute;left:0;top:1.35em;width:10px;height:1.5px;}
.c-them li::before{background:var(--teal);}
.c-you li::before{background:var(--red);}

.finepr{
  margin-top:40px;padding-left:24px;border-left:1px solid var(--line-2);
  font-size:14px;line-height:1.75;color:var(--dim);max-width:940px;
}
.finepr strong{color:var(--body);font-weight:600;}

/* ═══════════════════════════════════════════════════════════════════════════
   11 · FINAL CLOSE
   ═══════════════════════════════════════════════════════════════════════════ */
.final{position:relative;background:var(--ink-900);overflow:hidden;}
.final-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:.8;}
.final-scrim{
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(120% 80% at 50% 42%,rgba(5,5,6,.32) 0%,rgba(5,5,6,.82) 56%,var(--ink-900) 100%);
}
.final-in{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;padding:76px var(--pad) 84px;text-align:center;}
.bridge{display:inline-block;max-width:720px;}
.bridge .k{font-size:12px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);}
.bridge h2{font-size:clamp(20px,1.65vw,24px);text-transform:uppercase;letter-spacing:-0.018em;color:#fff;margin-top:12px;line-height:1.22;}
.bridge p{font-size:15.5px;line-height:1.75;color:var(--body);margin-top:13px;}
.bridge .div{width:1px;height:38px;margin:22px auto 0;background:linear-gradient(180deg,var(--gold),transparent);}
.final h3{
  font-size:clamp(35px,3.3vw,47px);font-weight:700;letter-spacing:-0.026em;
  text-transform:uppercase;line-height:1.08;color:#fff;margin-top:18px;
}
.final h3 .l2{display:block;}
.final h3 .w-b{color:var(--red);} .final h3 .w-g{color:var(--teal);} .final h3 .w-w{color:var(--gold);}
.final .sub{font-size:16.5px;line-height:1.7;color:var(--body);margin:22px auto 0;max-width:540px;}
.final .cta{margin-top:30px;}
.final .after{margin-top:22px;font-size:12px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--dim);}

/* ══════════════════ FOOTER — approved chrome ══════════════════ */
footer{background:var(--ink-900);border-top:1px solid var(--line);padding:76px 0 34px;}
.fgrid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:54px;}
.fbrand .flogo{display:inline-block;}
.fbrand img{width:236px;}
.tagline{margin-top:26px;}
.tagline .l{display:block;font-size:14px;font-weight:700;letter-spacing:.055em;text-transform:uppercase;line-height:1.9;white-space:nowrap;}
.tagline .r{color:var(--red);} .tagline .b{color:var(--teal);} .tagline .g{color:var(--gold);}
.fcontact{margin-top:26px;font-size:13px;font-weight:500;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);line-height:2.15;}
.fcontact a{transition:color .2s;}
.fcontact a:hover{color:var(--offwhite);}
.fcol .h{font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--offwhite);margin-bottom:20px;}
.fcol li{margin-bottom:12px;}
.fcol a{font-size:14px;color:var(--body);transition:color .2s;}
.fcol a:hover{color:#fff;}
.fcol a[aria-current="page"]{color:var(--teal);}
.legal{
  margin-top:64px;padding-top:28px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;
  font-size:11.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
}

/* ══════════════════ DESKTOP RANGE TUNING (1280–1920) ══════════════════ */
@media (max-width:1400px){
  :root{--pad:40px;}
  .ppf-grid{gap:0 52px;}
  .own,.pay{padding:42px 38px;}
}
@media (max-width:1180px){
  .sec-head{grid-template-columns:1fr;gap:24px;}
  .sec-head .head-r{padding-bottom:0;}
  .ppf-grid,.split,.nfe-grid,.paths,.tracks,.duo,.real,.recip,.getin,.counter,.knit,.own .grid,.pay{
    grid-template-columns:1fr;gap:40px;
  }
  .getin{gap:0;}
  .getin .gphoto{min-height:320px;}
  .getin .gbody{padding:40px 36px;}
  .knit .b{padding-left:0;border-left:none;padding-top:24px;border-top:1px solid var(--line);}
  .mores{grid-template-columns:repeat(2,1fr);}
  .bengrid{grid-template-columns:repeat(2,1fr);}
  .path h3,.track-col h3{min-height:0;}
  .vals{grid-template-columns:repeat(6,1fr);}
  .val,.val:nth-child(n+5){grid-column:span 3;}
}
@media (max-width:900px){
  .fgrid{grid-template-columns:1fr 1fr;}
  .nav-links a:not(.btn){display:none;}
  .scale-row,.scale-head{grid-template-columns:1fr;}
  .scale-row .mid{display:none;}
  .scale-row .l,.scale-row .r{padding-left:0;padding-right:0;}
  .mores{grid-template-columns:1fr;}
  .vals{grid-template-columns:1fr;}
  .val,.val:nth-child(n+5){grid-column:span 1;}
}

/* ══════════════════ MOTION ══════════════════
   One reveal behaviour for the whole page. No per-component choreography. */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease;}
.reveal.on{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation:none !important;transition:none !important;}
  .reveal{opacity:1;transform:none;}
  .ppf-edge{stroke-dashoffset:0;opacity:1;}
  .ppf-spoke{opacity:.55;}
  .ppf-core{opacity:1;}
  .mv-vision .w-p{color:var(--red);}
  .mv-vision .w-r{color:var(--teal);}
  .mv-vision .w-f{color:var(--gold);}
}

/* ===========================================================================
   WIX IFRAME COMPATIBILITY — TECHNICAL ONLY
   =========================================================================== */
html{background:var(--ink-900);overflow-x:clip;}
body{overflow-x:clip;max-width:100%;min-height:100vh;}
html.vfo-embed-tall .nav{position:static;}