*{box-sizing:border-box;margin:0;padding:0}:root{--paper:#F3EDE1;--paper-2:#EBE3D4;--ink:#211E1A;--ink-soft:#6B6358;--accent:#324C7E;--accent-soft:#9FB0CC;--line:#D9CFBC;}html,body{overflow-x:clip}html{scroll-behavior:auto}body{background:var(--paper);color:var(--ink);font-family:"Bricolage Grotesque",system-ui,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.4;}.wrap{max-width:1100px;margin:0 auto}a{color:inherit}.cta{display:inline-flex;align-items:center;gap:.5em;background:var(--ink);color:var(--paper);text-decoration:none;font-weight:700;font-size:clamp(1rem,2.6vw,1.12rem);padding:15px 28px;border-radius:999px;min-height:48px;box-shadow:0 8px 22px rgba(33,30,26,.16);transition:transform .18s ease;}.cta .arrow{display:inline-block;transition:transform .18s ease}@media (hover:hover) and (pointer:fine){.cta:hover{transform:translateY(-2px)}.cta:hover .arrow{transform:translateX(4px)}}.cta:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.hero{min-height:100dvh;display:grid;align-content:center;padding:calc(env(safe-area-inset-top) + 28px) 22px calc(env(safe-area-inset-bottom) + 28px);gap:26px;}.hero .wrap{display:grid;gap:24px;align-items:center}.logo{width:112px;height:112px;display:block;border-radius:24px}.title{display:flex;flex-direction:column;gap:.35em}.wordmark{font-weight:700;letter-spacing:-.03em;line-height:.9;font-size:clamp(2.9rem,12vw,5.8rem);}.promise{font-weight:400;color:var(--ink-soft);font-size:clamp(1.1rem,3.6vw,1.6rem);line-height:1.3;max-width:16ch;}.sub{color:var(--ink-soft);font-size:clamp(1rem,2.8vw,1.12rem);max-width:42ch}.scribble{font-family:"Caveat",cursive;font-weight:700;color:var(--accent);font-size:clamp(1.25rem,4.4vw,1.6rem);transform:rotate(-3deg);transform-origin:left center;display:inline-block;}.hero-actions{display:flex}.card{--w:min(80vw,360px);width:var(--w);background:var(--paper-2);border-radius:22px;padding:20px;box-shadow:0 18px 40px rgba(33,30,26,.16);display:grid;gap:16px;}.card .scrap{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:12px 14px;display:flex;align-items:center;justify-content:space-between;gap:10px;transform-origin:center;transition:transform .55s cubic-bezier(.2,.7,.2,1),opacity .55s;}.scrap .scrap-label{font-size:.78rem;color:var(--ink-soft);font-weight:700;letter-spacing:.02em}.scrap .scrap-val{font-size:1.02rem;font-weight:700;letter-spacing:.14em}.lens-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;transform-origin:top center;transition:transform .6s cubic-bezier(.2,.7,.2,1),opacity .55s;}.lens{position:relative;aspect-ratio:1/1;border:1.5px solid var(--ink);border-radius:14px;background: radial-gradient(circle at 50% 46%,var(--accent-soft) 0 16%,transparent 17%),var(--paper);display:grid;place-items:end start;padding:8px;}.lens::before,.lens::after{content:"";position:absolute;width:12px;height:12px;border:2px solid var(--ink-soft)}.lens::before{top:7px;left:7px;border-right:0;border-bottom:0;border-radius:3px 0 0 0}.lens::after{bottom:7px;right:7px;border-left:0;border-top:0;border-radius:0 0 3px 0}.lens .tag{font-size:.72rem;font-weight:700;color:var(--ink-soft)}.lens .live{position:absolute;top:8px;right:9px;display:flex;align-items:center;gap:5px;font-family:"Caveat",cursive;font-weight:700;color:var(--accent);font-size:1.05rem;line-height:1}.lens .dot{width:9px;height:9px;border-radius:50%;background:var(--accent)}.strip{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;align-items:center;transform-origin:top center;transition:transform .6s cubic-bezier(.2,.7,.2,1),opacity .55s;}.strip .frame{aspect-ratio:3/4;border:1px solid var(--ink-soft);border-radius:8px;background: linear-gradient(130deg,var(--paper) 40%,var(--accent-soft) 160%);}.strip .frame:last-child{border:0;background:none;display:grid;place-items:center;font-family:"Caveat",cursive;font-weight:700;color:var(--ink-soft);font-size:1.1rem}[data-step="1"] .lens-row{transform:scaleY(.04);opacity:0}[data-step="1"] .strip{transform:scaleY(.04);opacity:0}[data-step="1"] .scrap{transform:scale(1.06)}[data-step="2"] .lens-row{transform:none;opacity:1}[data-step="2"] .strip{transform:scaleY(.04);opacity:0}[data-step="2"] .scrap{transform:scale(1)}[data-step="3"] .lens-row{transform:none;opacity:1}[data-step="3"] .strip{transform:none;opacity:1}[data-step="3"] .scrap{transform:scale(.9);opacity:.7}.scrolly{position:relative}.viz{position:sticky;top:0;height:100dvh;display:grid;place-items:center;z-index:0;padding:14dvh 22px 0;align-items:start;}.viz .card{--w:min(78vw,340px)}.steps{position:relative;z-index:1}.step{min-height:92dvh;display:grid;align-items:end;justify-items:center;padding:0 20px 11dvh;}.step-card{background:rgba(243,237,225,.94);border-radius:18px;padding:24px 22px;max-width:min(90vw,440px);box-shadow:0 14px 30px rgba(33,30,26,.14);}.step-eyebrow{font-family:"Caveat",cursive;font-weight:700;color:var(--accent);font-size:1.2rem;line-height:1;margin-bottom:.35em;display:block}.step-card p{font-size:clamp(1.3rem,4.6vw,1.8rem);font-weight:700;line-height:1.3;letter-spacing:-.01em}.outro{min-height:70dvh;display:grid;place-items:center;text-align:center;padding:48px 22px calc(env(safe-area-inset-bottom) + 120px);gap:22px;}.outro p{font-size:clamp(1.3rem,4vw,1.9rem);font-weight:700;max-width:16ch;margin:0 auto}.outro .scribble{text-align:center;transform:rotate(-2deg)}footer{text-align:center;color:var(--ink-soft);padding:28px 22px calc(env(safe-area-inset-bottom) + 96px);font-weight:700;letter-spacing:.02em}.cta-bar{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;justify-content:center;padding:10px 16px calc(env(safe-area-inset-bottom) + 10px);background:linear-gradient(to top,var(--paper) 62%,rgba(243,237,225,0));transform:translateY(130%);transition:transform .32s ease;pointer-events:none;}.cta-bar.show{transform:none;pointer-events:auto}.cta-bar .cta{width:min(92vw,440px);justify-content:center}@media (min-width:900px){.hero .wrap{grid-template-columns:1.05fr .95fr;gap:48px;}.hero-text{display:grid;gap:22px;align-content:center}.hero-figure{display:grid;place-items:center}.card{--w:min(38vw,420px)}.viz{justify-items:end;padding-right:8vw;align-items:center;padding-top:0}.viz .card{--w:min(34vw,400px)}.step{justify-items:start;align-items:center;padding:0 8vw}}@media (max-width:899px){.hero-text{display:grid;gap:22px}.hero-figure{justify-self:center;padding-top:6px}}@media (prefers-reduced-motion:reduce){.lens-row,.strip,.scrap,.cta,.cta .arrow,.cta-bar{transition:none}}