/* Popsmith — investor funnel · tokens & base */
:root{
--brown-950:#2E1F11;--brown-900:#3B2917;--brown-800:#4A3520;--brown-700:#5B4127;--brown-600:#6E5133;--brown-500:#8A6A45;
--gold-700:#C99A2E;--gold-600:#E0AE3C;--gold-500:#EFC75E;--gold-400:#F4D379;--gold-300:#F8DE8D;--gold-200:#FBE9B4;
--coral:#D9553F;--coral-dark:#B8412D;
--cream-50:#FFFCF4;--cream-100:#FDF6E7;--cream-200:#F7EDD8;
--ink:#3B2917;--ink-2:#5B4127;--ink-3:#8A6A45;
--on-dark:#FDF6E7;--on-dark-2:rgba(253,246,231,.78);--on-dark-3:rgba(253,246,231,.55);
--line:#E7D9BE;--line-dark:rgba(253,246,231,.18);
--radius-sm:12px;--radius:18px;--radius-lg:26px;--radius-xl:34px;--radius-pill:999px;
--shadow-sm:0 2px 0 var(--brown-700);
--shadow-hard:0 5px 0 var(--brown-700);
--shadow-hard-lg:0 7px 0 var(--brown-700);
--shadow-soft:0 14px 34px rgba(59,41,23,.14);
--shadow-lift:0 24px 54px rgba(59,41,23,.22);
--container:1180px;--gutter:clamp(20px,5vw,60px);
--font-display:'Baloo 2',system-ui,sans-serif;--font-body:'Poppins',system-ui,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);color:var(--ink);background:var(--cream-100);line-height:1.62;font-size:16.5px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
a:hover{color:var(--coral)}
button{font-family:inherit;cursor:pointer;border:none;background:none}
ul{list-style:none}
table{width:100%;border-collapse:collapse}

.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:clamp(58px,8vw,110px);position:relative}
.section--tight{padding-block:clamp(36px,5vw,60px)}
.section--gold{background:var(--gold-500)}
.section--gold-lt{background:var(--gold-300)}
.section--cream{background:var(--cream-100)}
.section--cream-dk{background:var(--cream-200)}
.section--brown{background:var(--brown-900);color:var(--on-dark)}

h1,h2,h3,h4{font-family:var(--font-display);font-weight:800;line-height:1.04;letter-spacing:-.015em;color:var(--brown-800)}
.section--brown h1,.section--brown h2,.section--brown h3,.section--brown h4{color:var(--cream-100)}
.h-display{font-size:clamp(38px,5.6vw,66px);line-height:1;letter-spacing:-.02em}
.h-sect{font-size:clamp(29px,4.2vw,50px);letter-spacing:-.02em}
.h-sub{font-size:clamp(21px,2.6vw,30px)}
.eyebrow{font-family:var(--font-display);font-weight:800;font-size:clamp(16px,1.7vw,20px);color:var(--coral);letter-spacing:.01em}
.lead{font-size:clamp(15.5px,1.35vw,17.5px);color:var(--ink-2);line-height:1.72}
.section--brown .lead{color:var(--on-dark-2)}
.section-head{max-width:820px}
.section-head--center{margin-inline:auto;text-align:center}
.section-head .h-sect{margin-top:8px}
.section-head .lead{margin-top:16px}

/* Buttons — chunky hard-shadow brand style */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--font-display);font-weight:800;font-size:16px;letter-spacing:.06em;text-transform:uppercase;padding:14px 32px;border-radius:var(--radius-pill);border:2.5px solid var(--brown-700);transition:transform .14s ease,box-shadow .14s ease,background .16s ease,color .16s ease}
.btn svg{width:17px;height:17px}
.btn-primary{background:var(--gold-400);color:var(--brown-800);box-shadow:var(--shadow-hard)}
.btn-primary:hover{background:var(--gold-500);color:var(--brown-800);transform:translateY(-3px);box-shadow:var(--shadow-hard-lg)}
.btn-primary:active{transform:translateY(2px);box-shadow:0 2px 0 var(--brown-700)}
.btn-cream{background:var(--cream-50);color:var(--brown-800);box-shadow:var(--shadow-hard)}
.btn-cream:hover{background:#fff;color:var(--brown-800);transform:translateY(-3px);box-shadow:var(--shadow-hard-lg)}
.btn-coral{background:var(--coral);color:var(--cream-50);box-shadow:var(--shadow-hard)}
.btn-coral:hover{background:var(--coral-dark);color:var(--cream-50);transform:translateY(-3px);box-shadow:var(--shadow-hard-lg)}
.btn-outline-cream{background:transparent;color:var(--cream-100);border-color:var(--cream-100)}
.btn-outline-cream:hover{background:var(--cream-100);color:var(--brown-800)}
.btn-outline{background:transparent;color:var(--brown-800);border-color:var(--brown-700)}
.btn-outline:hover{background:var(--brown-800);color:var(--cream-100)}
.btn-lg{padding:17px 38px;font-size:17px}
.btn-sm{padding:10px 20px;font-size:13.5px}
.btn-block{width:100%}

/* Cards — brand hard-edge */
.pcard{background:var(--cream-50);border:2.5px solid var(--brown-700);border-radius:var(--radius-lg);box-shadow:var(--shadow-hard);padding:26px}
.pcard--gold{background:var(--gold-300)}
.pcard--coral{background:var(--coral);color:var(--cream-50)}
.pcard--coral h3,.pcard--coral .stat__num{color:var(--cream-50)}
.pcard--flat{box-shadow:none}
.pcard--lift{transition:transform .18s ease,box-shadow .18s ease}
.pcard--lift:hover{transform:translateY(-4px);box-shadow:var(--shadow-hard-lg)}

/* Image placeholders */
.ph{position:relative;border-radius:var(--radius);overflow:hidden;background-color:var(--gold-200);background-image:repeating-linear-gradient(135deg,rgba(91,65,39,.10) 0 11px,rgba(91,65,39,.02) 11px 22px);display:flex;align-items:center;justify-content:center;border:2.5px solid var(--brown-700)}
.ph>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ph--dark{background-color:var(--brown-800);background-image:repeating-linear-gradient(135deg,rgba(253,246,231,.13) 0 11px,rgba(253,246,231,.02) 11px 22px)}
.ph__tag{font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;background:var(--cream-50);color:var(--brown-700);padding:6px 11px;border-radius:8px;border:1.5px solid var(--brown-700);text-align:center;max-width:80%}
.ph--dark .ph__tag{background:var(--brown-900);color:var(--on-dark-2);border-color:var(--line-dark)}

/* Stat block */
.stat__num{font-family:var(--font-display);font-weight:800;font-size:clamp(30px,4vw,44px);line-height:1;letter-spacing:-.02em;color:var(--brown-800)}
.stat__lbl{margin-top:7px;font-size:13.5px;font-weight:500;color:var(--ink-2);line-height:1.4}
.pcard--coral .stat__lbl{color:rgba(255,252,244,.9)}

.fine{font-size:11.5px;line-height:1.6;color:var(--ink-3)}
.fine em{font-style:italic}
.section--brown .fine{color:var(--on-dark-3)}

.reveal{opacity:1!important}
.reveal.is-in{animation:popIn .55s cubic-bezier(.2,.75,.25,1) both}
@keyframes popIn{from{transform:translateY(18px)}to{transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){
.reveal.is-in{animation:none;transform:none}
.colgroup__bar,.hbar__fill,.radial .prog{animation:none!important;transform:none!important}
html{scroll-behavior:auto}
}
