/* q/allums — shared styles. Brand: dark shell, bone type, orange = action/money, teal = structure. */
:root{
  --bg:#08090C; --band:#0B0C11; --card:#0D0F14; --card-up:#111319;
  --bone:#F4F3F1; --ink:#111215; --body:#A9ABB4; --list:#DDDEE2; --muted:#8D8F99; --label:#7A7C86; --faint:#4C4E58;
  --orange:#FF6B2C; --orange-on-bone:#D23A06; --teal:#4E9A94; --teal-on-bone:#0B7C74;
  --cta:linear-gradient(90deg,#FF9A3D,#FF5A1F 55%,#E2400B);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--bg);color:var(--bone);font-family:Figtree,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:var(--orange);text-decoration:none}a:hover{color:#FF8A50}
button{font:inherit}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--orange);outline-offset:4px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.page{overflow:hidden}

/* Logo: types "allums" once, then the cursor blinks. */
@keyframes qtype{from{width:0}}
@keyframes qblink{0%,49%{opacity:1}50%,100%{opacity:0}}
.qlogo{flex:none;display:inline-flex;align-items:center;font:500 24px/1 'JetBrains Mono',monospace;letter-spacing:-.02em;text-decoration:none}
.qlogo .q{color:var(--teal)}
.qlogo .w{flex:none;display:inline-block;overflow:hidden;white-space:nowrap;width:87px;color:var(--bone);animation:qtype .9s steps(6) .4s both}
.qlogo .c{flex:none;width:13px;height:25px;margin-left:6px;background:var(--orange);animation:qblink 1.1s steps(1) infinite}

/* Header */
.site-head{position:sticky;top:0;z-index:20;background:rgba(8,9,12,.86);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.06)}
.site-head nav{max-width:1240px;margin:0 auto;padding:16px 24px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.navlinks{display:flex;gap:32px;font:600 12px/1 'IBM Plex Mono',monospace;letter-spacing:.16em;text-transform:uppercase}
.navlinks a{color:var(--body)}.navlinks a:hover{color:var(--bone)}
.navlinks a[aria-current]{color:var(--bone);border-bottom:2px solid var(--teal);padding-bottom:6px}

/* The one CTA style */
.cta{display:inline-flex;align-items:center;justify-content:center;gap:12px;border-radius:999px;background:var(--cta);border:1px solid rgba(255,180,120,.5);color:#fff;font:800 16px/1 Figtree,sans-serif;letter-spacing:.06em;text-transform:uppercase;box-shadow:0 0 44px rgba(255,90,31,.4);white-space:nowrap;cursor:pointer;transition:filter .2s,transform .2s}
.cta:hover{color:#fff;filter:brightness(1.08);transform:translateY(-2px)}
.cta:disabled{opacity:.7;cursor:progress;transform:none}
.cta-sm{min-height:44px;padding:0 22px;font-size:13px;box-shadow:0 0 28px rgba(255,90,31,.32)}
.cta-md{min-height:56px;padding:0 30px}
.cta-lg{min-height:68px;padding:0 44px;font-size:19px}

/* Quiet text link (teal underline) */
.tlink{display:inline-flex;align-items:center;gap:10px;font:600 13px/1 'IBM Plex Mono',monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--bone);border-bottom:2px solid var(--teal);padding-bottom:8px}
.tlink:hover{color:var(--bone)}

/* Email capture pill */
.sub-form{display:flex;gap:8px;padding:8px;background:var(--card);border:1px solid rgba(255,255,255,.1);border-radius:999px}
.sub-form input{flex:1;min-width:0;min-height:52px;padding:0 22px;background:transparent;border:0;outline:none;color:var(--bone);font:500 17px Figtree,sans-serif}
.sub-form input::placeholder{color:#6E7079}

/* Field inputs (class + waitlist forms) */
.field{width:100%;min-height:54px;border:1px solid #2A2D34;border-radius:14px;padding:0 18px;background:var(--bg);color:var(--bone);font:500 17px Figtree,sans-serif}
.field:focus{border-color:var(--orange);box-shadow:0 0 0 4px rgba(255,107,44,.13);outline:none}
.formkit-alert{margin:0;padding:0;list-style:none;color:#FF9270;font:500 12px/1.45 'IBM Plex Mono',monospace}
.formkit-alert:empty{display:none}

/* Marquee */
@keyframes qmarq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.marq{animation:qmarq 38s linear infinite}

/* Growth line (count-up cards) */
@keyframes gdraw{to{stroke-dashoffset:0}}
@keyframes gpop{from{opacity:0;transform:scale(.2)}to{opacity:1;transform:scale(1)}}
.gline{stroke-dasharray:1;stroke-dashoffset:1}
.gdot{opacity:0;transform-box:fill-box;transform-origin:center;filter:drop-shadow(0 0 8px rgba(255,90,31,.8))}
.play .gline{animation:gdraw 1.8s .1s cubic-bezier(.3,.7,.2,1) forwards}
.play .gdot{animation:gpop .4s 1.8s ease-out forwards}

/* FAQ */
details summary{list-style:none}
details summary::-webkit-details-marker{display:none}
details summary::after{content:"+";float:right;color:var(--teal-on-bone);font-weight:600;margin-left:16px}
details[open] summary::after{content:"–"}

/* Footer */
.site-foot{border-top:1px solid rgba(255,255,255,.06);padding:40px 24px}
.site-foot .in{max-width:1240px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px}
.site-foot .links{display:flex;flex-wrap:wrap;gap:28px;font:600 11px/1 'IBM Plex Mono',monospace;letter-spacing:.16em;text-transform:uppercase}
.site-foot .links a{color:var(--label)}.site-foot .links a:hover{color:var(--bone)}
.site-foot small{font:600 11px/1 'IBM Plex Mono',monospace;letter-spacing:.12em;color:var(--faint)}

/* Phones */
@media (max-width:900px){
  .navlinks{display:none}
  .g2,.g3,.g4,.g5,.split,.offers,.hero-grid{grid-template-columns:1fr !important}
  .h-xl{font-size:56px !important}
  .h-l{font-size:44px !important}
  .h-m{font-size:46px !important}
  .sect{padding:72px 20px !important}
  .pad-m{padding:26px !important}
  .num-m{font-size:52px !important}
  .stick{position:static !important}
  .photo-stack{height:400px !important}
  .offer-card{min-height:0 !important}
  .polaroids{display:none !important}
  .sub-form{flex-direction:column;border-radius:22px}
  .cta-sm{padding:0 16px;font-size:12px;gap:8px}
  .cta-lg{padding:0 22px;font-size:16px}
  .site-head nav{padding:14px 16px;gap:12px}
  .wrap-m{white-space:normal !important;text-align:center;line-height:1.2 !important}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .qlogo .w,.qlogo .c,.marq{animation:none}
  .gline{stroke-dashoffset:0}.gdot{opacity:1}
}

/* Page-level CTA sizing on phones */
@media (max-width:900px){
  .nav-cta{padding:0 16px !important;font-size:12px !important;gap:8px !important}
  .hero-cta{padding:0 22px !important;font-size:16px !important}
}

@media (min-width:901px) and (max-width:1180px){.g4{grid-template-columns:repeat(2,minmax(0,1fr)) !important}}
