/* Revenue Operator brand v4 */
@font-face{font-family:"Bricolage Grotesque";src:url(/assets/brand/fonts/BricolageGrotesque-Variable.latin.woff2) format("woff2");font-weight:200 800;font-stretch:75% 100%;font-style:normal;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url(/assets/brand/fonts/InstrumentSans-Variable.latin.woff2) format("woff2");font-weight:400 700;font-stretch:75% 100%;font-style:normal;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url(/assets/brand/fonts/InstrumentSans-Italic-Variable.latin.woff2) format("woff2");font-weight:400 700;font-stretch:75% 100%;font-style:italic;font-display:swap}

/* Revenue Operator v2 — "Brand v4 (flame/saffron/cream; --klein = flame, --flash = saffron, --wall = cream)"
   Layout idea: a bright gallery wall. Rounded color-field panels hung like canvases,
   one saturated blue, chrome orbs as the 3D object, highlighter yellow only for "this is the fix". */
:root{
  --wall:#EBE9E1;      /* gallery white */
  --card:#FFFFFF;
  --ink:#1A1210;       /* type */
  --smoke:#5A5A66;     /* secondary text, 6.2:1 on wall */
  --line:#DEDED7;
  --klein:#E43D12;     /* flame: ours */
  --klein-deep:#B8300C;
  --berry:#D6536D;--blush:#FFA2B6;
  --klein-soft:#FFE3DA;
  --flash:#EFB11D;     /* volt: only for the fix or the number */
  --display:"Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;
  --ember:#B8300C;     /* flame, darkened for small text */
  --field:#C8370F;     /* flame field that holds body text (white passes AA) */
  --sans:"Instrument Sans","Helvetica Neue",Arial,sans-serif;
  --r:28px;
  --max:1280px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-variation-settings:"wdth" 84;background:var(--wall);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
img,svg{max-width:100%}
h1,h2,h3{margin:0;text-wrap:balance;font-family:var(--display);font-weight:800;letter-spacing:-.02em}
p{margin:0}
:focus-visible{outline:3px solid var(--klein);outline-offset:3px;border-radius:6px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 clamp(16px,3.5vw,36px)}
.num{font-variant-numeric:tabular-nums}
.blue{color:var(--klein)}
.hl{background:linear-gradient(transparent 12%,var(--flash) 12%,var(--flash) 88%,transparent 88%);padding:0 .12em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.pill{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 14px;border-radius:999px;background:var(--card);border:1px solid var(--line);font:600 13px var(--sans);color:var(--ink)}
.pill .dot{width:8px;height:8px;border-radius:50%;background:var(--klein)}
.pill.onblue{background:#ffffff1f;border-color:#ffffff40;color:#fff}
.pill.onblue .dot{background:var(--flash)}

/* chrome orbs: the brand's 3D object */
.orb{border-radius:50%;background:radial-gradient(circle at 32% 26%,#fff 0 5%,#e9ebf3 12%,#a9adc0 34%,#3a3c4b 58%,#7d82a0 74%,#dfe2f0 90%,#fff 100%);box-shadow:inset -10px -16px 30px #0003,0 30px 50px -20px #1A121066}
.orb.k{background:radial-gradient(circle at 32% 26%,#fff 0 4%,#ffc4ae 12%,#ff6a3d 30%,#E43D12 52%,#7a1c05 82%,#ff5a2a 100%)}
.orb.p{background:radial-gradient(circle at 32% 26%,#fff 0 5%,#ffd6df 14%,#FFA2B6 36%,#D6536D 72%,#ffc0cf 100%)}
.orb.y{background:radial-gradient(circle at 32% 26%,#fff 0 5%,#FFF1C9 14%,#EFB11D 38%,#B9850B 76%,#FFD670 100%)}

/* floating pill nav */
.nav{position:sticky;top:14px;z-index:50;margin-top:14px}
.nav .bar{max-width:var(--max);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;background:#ffffffd9;backdrop-filter:blur(16px) saturate(1.5);-webkit-backdrop-filter:blur(16px) saturate(1.5);border:1px solid var(--line);border-radius:999px;padding:8px 8px 8px 18px;box-shadow:0 10px 30px -18px #1A121040;width:calc(100% - 2*clamp(16px,3.5vw,36px))}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font:800 19px/1 var(--display);letter-spacing:-.025em}
.logo svg{width:30px;height:30px;flex:none}
.nav ul{display:flex;gap:2px;list-style:none;margin:0;padding:0}
.nav ul a{display:block;padding:10px 14px;border-radius:999px;text-decoration:none;font-weight:500;font-size:15px;color:var(--smoke)}
.nav ul a:hover{color:var(--ink);background:var(--wall)}
.nav ul a[aria-current]{color:var(--ink);background:var(--klein-soft)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:12px;min-height:54px;padding:0 10px 0 26px;border-radius:999px;border:0;background:var(--ink);color:#fff;font:600 16px var(--sans);text-decoration:none;cursor:pointer;transition:background .25s,transform .25s cubic-bezier(.2,.8,.2,1)}
.btn .ball{width:36px;height:36px;border-radius:50%;background:var(--flash);display:grid;place-items:center;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.btn .ball svg{width:16px;height:16px;color:var(--ink)}
.btn:hover{background:var(--klein);transform:translateY(-2px)}
.btn:hover .ball{transform:rotate(-45deg) scale(1.08)}
.btn.lt{background:var(--card);color:var(--ink);border:1px solid var(--line);padding:0 26px}
.btn.lt:hover{border-color:var(--ink);background:var(--card)}
.btn.onblue{background:#fff;color:var(--ink)}
.btn.onblue:hover{background:var(--flash)}
.btn.sm{min-height:46px;font-size:15px;padding-left:20px}
.btn.sm .ball{width:30px;height:30px}
.price{font-variant-numeric:tabular-nums;font-weight:700}

/* panels */
.field{background:var(--field);color:#fff;border-radius:var(--r);position:relative;overflow:hidden}
.canvas{background:var(--card);border-radius:var(--r);border:1px solid var(--line)}

/* footer */
.foot{margin-top:120px;background:var(--field);color:#fff;border-radius:40px 40px 0 0;padding:72px 0 36px;overflow:hidden;position:relative}
.foot .say{font:800 clamp(56px,11vw,176px)/.86 var(--display);letter-spacing:-.02em}
.foot .say span{color:var(--flash)}
.foot .cols{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:32px;margin-top:64px;font-size:15px}
.foot h4{margin:0 0 12px;font:700 13px var(--sans);opacity:.7}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.foot a{text-decoration:none}
.foot a:hover{text-decoration:underline}
.foot .legal{margin-top:48px;padding-top:22px;border-top:1px solid #ffffff33;font-size:12.5px;line-height:1.6;opacity:.85;display:grid;gap:6px}
.foot .orb{position:absolute;right:-60px;top:-60px;width:260px;height:260px;opacity:.95}
@media (max-width:820px){.nav ul{display:none}.foot .cols{grid-template-columns:1fr 1fr}}

.rise{animation:rise .9s cubic-bezier(.2,.8,.2,1) both}
@keyframes rise{from{transform:translateY(20px);opacity:.001}to{transform:none;opacity:1}}
@keyframes float{50%{transform:translateY(-14px)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

/* the big word: giant readable type with an object sitting in front of it */
.bigword{padding-top:70px;padding-bottom:7vw;overflow:hidden}
.bw{position:relative;font:800 clamp(72px,17vw,280px)/.82 var(--display);letter-spacing:-.03em;text-transform:uppercase;color:var(--klein);text-align:center;white-space:nowrap;user-select:none}
.bw .bwo{position:absolute;left:50%;bottom:-48%;width:15%;aspect-ratio:1;transform:translateX(-50%);animation:float 7s ease-in-out infinite}
.bw small{display:block;font:600 clamp(15px,1.4vw,19px)/1.4 var(--sans);letter-spacing:0;text-transform:none;color:var(--ink);margin-top:22px;white-space:normal}

/* Brand v4: the site-wide overlays (checkout-return, before-Stripe sheet, exit guide, share bar, mobile bar) in brand colours and type. */
#ro-cr,#ro-sheet .in,#ro-exit .bx,.ro-share,.mbar{font-family:var(--sans)!important}
#ro-cr{background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:22px;box-shadow:0 30px 60px -24px #1A121066}
#ro-cr b{font-family:var(--display);font-weight:800;letter-spacing:-.02em}
#ro-cr button:not(.x),#ro-exit .go,#ro-sheet .go{background:var(--ink)!important;color:#fff!important;border-radius:999px!important;font-weight:600}
#ro-cr button:not(.x):hover,#ro-exit .go:hover,#ro-sheet .go:hover{background:var(--klein)!important}
#ro-cr input[type=email],#ro-exit input[type=email]{border-radius:999px!important;border:1px solid var(--line)!important;padding-left:16px!important}
#ro-sheet,#ro-exit{background:rgba(20,12,9,.62)!important}
#ro-sheet .in,#ro-exit .bx{border-radius:28px!important;color:var(--ink)!important}
#ro-sheet h2,#ro-exit h2{font-family:var(--display)!important;font-weight:800;letter-spacing:-.02em;color:var(--ink)}
#ro-sheet .note{border-radius:16px}
#ro-sheet .go{display:flex!important;justify-content:center}
.ro-share a,.ro-share button{border-radius:999px}
.mbar{background:rgba(255,255,255,.94)!important;border-top:1px solid var(--line)!important;color:var(--ink)!important;backdrop-filter:blur(12px)}
.mbar .btn{background:var(--ink)!important;color:#fff!important;border-radius:999px!important}