:root{--yellow:#F2FF44;--pink:#FF3CAC;--cyan:#1FD8E6;--grape:#7A2FF2;--lime:#C8FF3D;--ink:#141318;--dark:#1A1A1A;--white:#FFFFFF;--cream:#FCF6E8;--mist:#F4F1FF;--fat:"Bagel Fat One",system-ui,sans-serif;--body:"Hanken Grotesk",system-ui,sans-serif;--mono:"DM Mono",ui-monospace,monospace}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--body);color:var(--ink);background:var(--yellow);-webkit-font-smoothing:antialiased}
a{color:inherit}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px;width:100%}
.skip-link,.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.skip-link:focus{clip:auto;width:auto;height:auto;top:12px;left:12px;z-index:99;background:var(--white);padding:10px 14px;border:3px solid var(--ink);border-radius:999px}
.nav{position:sticky;top:0;z-index:50;background:var(--ink)}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:68px}
.logo{font-family:var(--fat);font-size:30px;line-height:1;color:var(--yellow);text-shadow:2.5px 2.5px 0 var(--pink);letter-spacing:.01em;text-decoration:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--body);font-weight:800;cursor:pointer;border:0;border-radius:999px;text-decoration:none;transition:transform .15s ease,box-shadow .15s ease,opacity .15s ease}
.btn:hover{transform:scale(1.03)}
.btn:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--cyan);outline-offset:4px}
.btn-pink{background:var(--pink);color:var(--ink)}
.nav .btn{font-size:15px;padding:11px 20px;box-shadow:0 3px 0 rgba(0,0,0,.35)}
.hero{position:relative;min-height:calc(100vh - 68px);overflow:hidden;display:flex;align-items:center;background:var(--yellow)}
.hero-grid{position:relative;z-index:3;display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;width:100%}
.eyebrow{font-family:var(--mono);font-size:13px;letter-spacing:.24em;text-transform:uppercase;color:var(--grape);font-weight:500;margin:0}
h1.hl{font-family:var(--fat);font-weight:400;color:var(--ink);margin:18px 0 0;font-size:clamp(46px,7vw,96px);line-height:.92;letter-spacing:.005em}
.hl .pink{color:var(--pink);text-shadow:4px 4px 0 var(--ink)}
.hl .w{display:inline-block}
.sub{font-size:clamp(17px,1.8vw,22px);font-weight:600;margin:24px 0 0;max-width:30ch;color:var(--ink)}
.hero-cta{margin-top:34px}
.hero .btn-pink{font-size:20px;padding:18px 32px;box-shadow:0 5px 0 var(--ink)}
.hero .btn-pink:hover{box-shadow:0 7px 0 var(--ink)}
.graphic{position:relative;height:440px}
.graphic svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.spin,.spin-rev,.pulse{transform-origin:center}
.star{position:absolute;z-index:2}
.bubble-a{top:6%;left:2%;width:64px;height:64px}
.bubble-b{bottom:4%;right:2%;width:50px;height:50px}
.sparkle{bottom:18%;left:0;width:38px;height:38px}

@media (prefers-reduced-motion:no-preference){.spin{animation:spin 26s linear infinite}
.spin-rev{animation:spin 34s linear infinite reverse}
.bob{animation:bob 6s ease-in-out infinite}
.bob2{animation:bob 7.5s ease-in-out infinite}
.pulse{animation:pulse 4.5s ease-in-out infinite}
.hl .w,.sub,.hero-cta{opacity:0;animation:up .6s cubic-bezier(.2,.7,.3,1) forwards}
.hl .w{animation-delay:calc(var(--i)*.08s)}
.sub{animation-delay:.7s}
.hero-cta{animation-delay:.85s}
}

@keyframes spin{to{transform:rotate(360deg)}
}

@keyframes bob{50%{transform:translateY(-18px)}
}

@keyframes pulse{50%{transform:scale(1.06)}
}

@keyframes up{from{opacity:0;transform:translateY(28px)}
to{opacity:1;transform:translateY(0)}
}
.features{background:var(--mist);padding:88px 0}
.sec-head{text-align:center;margin-bottom:48px}
.sec-head h2{font-family:var(--fat);font-weight:400;font-size:clamp(34px,5vw,58px);margin:12px 0 0;line-height:.95}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.card{background:var(--white);border:3px solid var(--ink);border-radius:22px;padding:30px 26px 32px;transition:transform .2s ease,box-shadow .2s ease}
.card .ic{width:64px;height:64px;border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:34px;line-height:1;margin-bottom:20px}
.card h3{font-family:var(--fat);font-weight:400;font-size:24px;line-height:1.02;margin:0 0 10px}
.card p{font-size:15.5px;line-height:1.5;color:#444047;margin:0}
.c1{border-color:var(--pink)}
.c1 .ic{background:rgba(255,60,172,.15)}
.c2{border-color:var(--cyan)}
.c2 .ic{background:rgba(31,216,230,.18)}
.c3{border-color:var(--grape)}
.c3 .ic{background:rgba(122,47,242,.14)}
.card:hover{transform:translateY(-10px);box-shadow:0 18px 0 -2px currentColor,0 26px 40px rgba(0,0,0,.12)}
.c1{color:var(--pink)}
.c2{color:var(--cyan)}
.c3{color:var(--grape)}
.card h3,.card p{color:var(--ink)}
.why{background:var(--pink);color:var(--white);padding:96px 0;text-align:center;position:relative;overflow:hidden}
.why .q{display:block;font-family:var(--fat);font-weight:400;font-size:clamp(30px,4.6vw,56px);line-height:1.04;max-width:16ch;margin:0 auto;text-shadow:3px 3px 0 rgba(0,0,0,.18)}
.badges{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:40px}
.badge{background:var(--ink);color:var(--white);font-family:var(--mono);font-size:13px;letter-spacing:.08em;text-transform:uppercase;padding:11px 20px;border-radius:999px;display:inline-flex;gap:8px;align-items:center}
.badge b{color:var(--lime);font-weight:400}
.capture{background:var(--dark);color:var(--white);padding:100px 0;position:relative;overflow:hidden}
.capture .inner{max-width:680px;margin:0 auto;text-align:center}
.capture h2{font-family:var(--fat);font-weight:400;color:var(--yellow);font-size:clamp(38px,6vw,72px);line-height:.94;margin:0;text-shadow:4px 4px 0 var(--pink)}
.subcopy{color:#B8B5BE;font-size:17px;line-height:1.55;margin:22px auto 0;max-width:46ch}
.signup{display:flex;gap:12px;margin:36px auto 0;max-width:520px}
.signup input[type=email]{flex:1;min-width:0;font-family:var(--body);font-size:17px;font-weight:500;color:var(--ink);background:var(--white);border:3px solid var(--white);border-radius:999px;padding:17px 24px;outline:none;transition:box-shadow .18s ease,border-color .18s ease}
.signup input::placeholder{color:#8b8893}
.signup input[type=email]:focus{box-shadow:0 0 0 3px var(--pink);border-color:var(--pink)}
.signup input.err{border-color:var(--pink);box-shadow:0 0 0 3px rgba(255,60,172,.45)}
.signup .btn-pink{font-size:17px;padding:17px 28px;white-space:nowrap;box-shadow:0 4px 0 #00000066}
.signup.is-loading .btn{opacity:.8;cursor:wait}
.hp,.submission-frame{position:absolute;left:-9999px;width:1px;height:1px;border:0}
.micro{font-size:13px;color:#a19ea8;margin-top:16px;font-family:var(--mono);letter-spacing:.04em}
.micro a{color:var(--yellow);text-underline-offset:3px}
.thanks{display:none;margin:34px auto 0;max-width:560px;background:rgba(200,255,61,.1);border:2px solid var(--lime);border-radius:22px;padding:30px 28px}
.thanks h3{font-family:var(--fat);font-weight:400;color:var(--lime);font-size:30px;margin:0 0 8px;line-height:1}
.thanks p{color:#CFCDD4;margin:0;font-size:16px}
.err-msg{display:none;color:var(--pink);font-weight:700;font-size:14px;margin-top:14px}
.footer{background:var(--dark);color:var(--white);padding:30px 0 56px;text-align:center;border-top:1px solid rgba(255,255,255,.08)}
.footer .logo{display:inline-block;margin-bottom:14px}
.foot-tag{color:#9C99A3;font-size:15px;font-weight:600;margin:0 0 22px}
.copy{color:#8d8994;font-size:12.5px;font-family:var(--mono);letter-spacing:.04em}
.copy a{color:var(--yellow)}
.privacy-page{background:var(--cream)}
.privacy-hero{padding:72px 0;background:var(--yellow);border-bottom:4px solid var(--ink)}
.privacy-card{max-width:850px;margin:48px auto;background:var(--white);border:3px solid var(--ink);border-radius:24px;box-shadow:10px 10px 0 var(--pink);padding:clamp(24px,5vw,54px)}
.privacy-card h1,.privacy-card h2{font-family:var(--fat);font-weight:400}
.privacy-card h1{font-size:clamp(38px,7vw,72px);line-height:.95;margin:0 0 18px}
.privacy-card h2{font-size:28px;margin-top:32px}
.placeholder{background:var(--mist);border:2px dashed var(--grape);border-radius:14px;padding:14px 16px}

@media (max-width:860px){.hero-grid{grid-template-columns:1fr;gap:8px}
.graphic{height:300px;order:-1;margin-top:18px}
.cards{grid-template-columns:1fr;gap:18px}
.hero{min-height:auto;padding:54px 0 64px}
}

@media (max-width:480px){.wrap{padding:0 18px}
.nav .btn{font-size:13px;padding:10px 15px}
.logo{font-size:26px}
.signup{flex-direction:column}
.signup .btn-pink{width:100%}
.badges{gap:10px}
.graphic{height:240px}
.hero{padding-top:36px}
h1.hl{font-size:clamp(42px,17vw,68px)}
}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}

