/* ═══════════════════════════════════════════════════════════════════════
   RM GROWTH PARTNERS — Design System (rebuild)
   "Profit Is A System. We Build Yours."

   A single stylesheet for the whole site. Dark is the brand and the default;
   a light theme is layered at the end. Almost every surface is painted as a
   translucent veil of --on-rgb over the page, so a handful of tokens repaint
   the entire UI. Section padding is deliberately compact per brief.
   ═══════════════════════════════════════════════════════════════════════ */

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box }
*{ margin:0 }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; scroll-behavior:smooth }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto } }
body{ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility }
img,svg,video,canvas{ display:block; max-width:100% }
img{ height:auto }
button,input,textarea,select{ font:inherit; color:inherit }
button{ background:none; border:0; cursor:pointer }
a{ color:inherit; text-decoration:none }
ul,ol{ list-style:none; padding:0 }
:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; border-radius:4px }

/* ---------- Tokens ---------- */
:root{
  color-scheme:dark;

  /* Veil channels — flipped by the light theme at the bottom. */
  --on-rgb: 255 255 255;
  --bg-rgb: 8 8 10;

  /* Backgrounds: near-black → deep charcoal ladder. */
  --bg:   #08080A;
  --bg-2: #0C0D10;
  --bg-3: #111318;

  /* Text ladder. */
  --ink:   #F5F6F8;
  --ink-2: rgba(245,246,248,.72);
  --ink-3: rgba(245,246,248,.52);
  --ink-4: rgba(245,246,248,.34);

  /* Refined antique gold — subtle, never flashy. */
  --gold:      #C9A24D;
  --gold-lt:   #E7C979;
  --gold-dk:   #9A7A2E;
  --gold-glow: rgba(201,162,77,.30);
  --on-gold:   #17130A;

  /* Deep cool navy for a quiet secondary voice. */
  --navy:   #7C8CA8;
  --navy-2: #566481;

  /* Glass & hairlines as veils. */
  --glass:   rgb(var(--on-rgb) / .04);
  --glass-2: rgb(var(--on-rgb) / .07);
  --line:    rgb(var(--on-rgb) / .09);
  --line-2:  rgb(var(--on-rgb) / .16);

  /* Type. */
  --f-display: "Plus Jakarta Sans", "Manrope", system-ui, sans-serif;
  --f-body:    "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Motion. */
  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);

  /* Rhythm — compact section padding per brief. */
  --pad-y: clamp(2.75rem, 4.5vw, 4.5rem);
  --gut:   clamp(1.25rem, 4vw, 2.5rem);
  --maxw:  1200px;
  --radius: 16px;
}

/* ---------- Base ---------- */
body{
  font-family:var(--f-body);
  font-size:clamp(1rem,.96rem + .2vw,1.075rem);
  line-height:1.6;
  color:var(--ink-2);
  background:var(--bg);
  overflow-x:hidden;
}

h1,h2,h3,h4{
  font-family:var(--f-display);
  color:var(--ink);
  line-height:1.06;
  letter-spacing:-.03em;
  font-weight:600;
  text-wrap:balance;
}

::selection{ background:var(--gold); color:var(--on-gold) }

/* ---------- Layout ---------- */
.container{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gut) }
.container--wide{ max-width:1320px }
.container--tight{ max-width:920px }
section{ position:relative; padding-block:var(--pad-y) }

.eyebrow{
  display:inline-flex; align-items:center; gap:.6rem;
  font-family:var(--f-display);
  font-size:.72rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold);
  margin-bottom:1.1rem;
}
.eyebrow::before{
  content:""; width:22px; height:1px;
  background:linear-gradient(90deg, var(--gold), transparent);
}
.eyebrow--center{ justify-content:center }
.eyebrow--center::before{ display:none }

.h-xl{ font-size:clamp(2.4rem,1.7rem + 3.4vw,4.4rem) }
.h-lg{ font-size:clamp(2rem,1.5rem + 2.4vw,3.3rem) }
.h-md{ font-size:clamp(1.55rem,1.3rem + 1.3vw,2.3rem) }
.h-sm{ font-size:clamp(1.2rem,1.1rem + .5vw,1.5rem) }

.lede{
  font-size:clamp(1.05rem,1rem + .35vw,1.25rem);
  color:var(--ink-2); max-width:60ch; line-height:1.65;
}
.dim{ color:var(--ink-3) }
.grad{
  background:linear-gradient(104deg, var(--gold-lt) 0%, var(--gold) 52%, var(--gold-dk) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.sec-head{ max-width:66ch; margin-bottom:clamp(2rem,4vw,3rem) }
.sec-head--center{ margin-inline:auto; text-align:center }

/* ---------- Backgrounds / rhythm ---------- */
.bg-2{ background:var(--bg-2) }
.bg-3{ background:var(--bg-3) }
.bg-grid::before{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
  background-image:linear-gradient(rgb(var(--on-rgb)/.03) 1px,transparent 1px),
                   linear-gradient(90deg,rgb(var(--on-rgb)/.03) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 0%,#000,transparent 75%);
          mask-image:radial-gradient(ellipse 80% 60% at 50% 0%,#000,transparent 75%);
}
.bg-glow{ position:absolute; border-radius:50%; filter:blur(120px); pointer-events:none; z-index:0; opacity:.55 }
.bg-glow--gold{ background:radial-gradient(circle,var(--gold-glow),transparent 70%) }
.hr-gold{ height:1px; border:0; background:linear-gradient(90deg,transparent,rgb(201 162 77/.4),transparent) }

/* keep content above decorative layers */
.container, .sec-head{ position:relative; z-index:1 }

/* ---------- Buttons ---------- */
.btn{
  --h:52px;
  position:relative; display:inline-flex; align-items:center; gap:.6rem;
  height:var(--h); padding:0 1.5rem;
  font-family:var(--f-display); font-size:.94rem; font-weight:600; letter-spacing:-.01em;
  border-radius:100px; white-space:nowrap;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), background .35s var(--ease), border-color .35s var(--ease), color .35s var(--ease);
}
.btn svg{ width:16px; height:16px; transition:transform .35s var(--ease) }
.btn:hover svg{ transform:translateX(3px) }
.btn--gold{
  color:var(--on-gold);
  background:linear-gradient(140deg,var(--gold-lt),var(--gold) 60%,var(--gold-dk));
  box-shadow:0 1px 0 rgba(255,255,255,.25) inset, 0 10px 28px -10px var(--gold-glow);
}
.btn--gold:hover{ transform:translateY(-2px); box-shadow:0 1px 0 rgba(255,255,255,.3) inset, 0 16px 40px -12px var(--gold-glow) }
.btn--ghost{
  color:var(--ink); background:var(--glass);
  border:1px solid var(--line-2); backdrop-filter:blur(8px);
}
.btn--ghost:hover{ transform:translateY(-2px); border-color:rgb(201 162 77/.5); background:var(--glass-2) }
.btn--lg{ --h:58px; padding:0 1.9rem; font-size:1rem }
.btn--xl{ --h:64px; padding:0 2.3rem; font-size:1.05rem }
.btn--sm{ --h:42px; padding:0 1.15rem; font-size:.85rem }
.btn--block{ width:100%; justify-content:center }

/* ---------- Chrome: nav ---------- */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:80;
  display:flex; align-items:center; gap:1.5rem;
  padding:.85rem var(--gut);
  transition:background .4s var(--ease), border-color .4s var(--ease), padding .4s var(--ease);
  border-bottom:1px solid transparent;
}
.nav.is-stuck{
  background:rgb(8 8 10 / .72); backdrop-filter:blur(18px) saturate(1.2);
  border-bottom-color:var(--line); padding-block:.6rem;
}
.nav__logo{ display:inline-flex; align-items:center; gap:.6rem; margin-right:auto; font-family:var(--f-display) }
.nav__mark{
  display:grid; place-items:center; width:38px; height:38px; border-radius:10px;
  font-weight:700; font-size:.9rem; letter-spacing:.02em; color:var(--on-gold);
  background:linear-gradient(140deg,var(--gold-lt),var(--gold-dk));
  box-shadow:0 6px 18px -8px var(--gold-glow);
}
.nav__word{ font-weight:600; font-size:1.02rem; letter-spacing:-.02em; color:var(--ink) }
.nav__links{ display:flex; align-items:center; gap:.35rem }
.nav__links a{
  padding:.5rem .8rem; border-radius:8px;
  font-size:.9rem; font-weight:500; color:var(--ink-3);
  transition:color .25s var(--ease), background .25s var(--ease);
}
.nav__links a:hover{ color:var(--ink); background:var(--glass) }
.nav__links a.is-current{ color:var(--ink) }
.nav__cta{ flex:none }
.nav__burger{
  display:none; width:44px; height:44px; border-radius:10px; border:1px solid var(--line-2);
  flex-direction:column; align-items:center; justify-content:center; gap:5px;
}
.nav__burger span{ width:18px; height:1.5px; background:var(--ink); border-radius:2px; transition:transform .3s var(--ease), opacity .3s var(--ease) }
.nav.is-open .nav__burger span:nth-child(1){ transform:translateY(3.25px) rotate(45deg) }
.nav.is-open .nav__burger span:nth-child(2){ transform:translateY(-3.25px) rotate(-45deg) }

.mobile-menu{
  position:fixed; inset:0; z-index:70; display:flex; flex-direction:column; gap:.3rem;
  padding:6rem var(--gut) 2rem; background:rgb(8 8 10 / .98); backdrop-filter:blur(20px);
  transform:translateY(-100%); transition:transform .5s var(--ease); visibility:hidden;
}
.mobile-menu.is-open{ transform:none; visibility:visible }
.mobile-menu a{ padding:.9rem .25rem; font-family:var(--f-display); font-size:1.4rem; font-weight:600; color:var(--ink); border-bottom:1px solid var(--line) }
.mobile-menu .btn{ margin-top:1.25rem }

.scroll-progress{ position:fixed; top:0; left:0; height:2px; width:0; z-index:90; background:linear-gradient(90deg,var(--gold-dk),var(--gold-lt)); transition:width .1s linear }

/* ---------- Preloader ---------- */
.preloader{ position:fixed; inset:0; z-index:100; display:grid; place-items:center; background:var(--bg); transition:opacity .6s var(--ease), visibility .6s }
.preloader.is-done{ opacity:0; visibility:hidden }
.preloader__mark{ font-family:var(--f-display); font-weight:700; font-size:1.6rem; letter-spacing:.3em; color:var(--gold); margin-bottom:1rem }
.preloader__bar{ width:120px; height:2px; border-radius:2px; overflow:hidden; background:var(--line-2) }
.preloader__bar span{ display:block; height:100%; width:0; background:linear-gradient(90deg,var(--gold-dk),var(--gold-lt)) }

/* ---------- Glass card ---------- */
.glass{
  position:relative; border-radius:var(--radius);
  background:linear-gradient(160deg, rgb(var(--on-rgb)/.06), rgb(var(--on-rgb)/.02));
  border:1px solid var(--line);
  backdrop-filter:blur(10px);
}
.glass::before{
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; pointer-events:none;
  background:linear-gradient(140deg, rgb(255 255 255/.14), transparent 40%, transparent 62%, rgb(201 162 77/.22));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}

/* ---------- Reveal animation ---------- */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .8s var(--ease-out), transform .8s var(--ease-out) }
.reveal.is-in{ opacity:1; transform:none }
[data-stagger] > *{ transition-delay:calc(var(--i,0) * 70ms) }
@media (prefers-reduced-motion:reduce){
  .reveal{ opacity:1 !important; transform:none !important; transition:none }
}

/* count-up numbers use tabular figures so widths don't jitter */
.count{ font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1 }