/* part 2: buttons, reveal, hero, phone, badge, marquee, manifesto, stats */
.btn{display:inline-flex;align-items:center;gap:10px;padding:16px 28px;border-radius:100px;font-weight:700;font-size:15px;letter-spacing:.01em;transition:background .3s,color .3s,border-color .3s,transform .5s cubic-bezier(.22,1,.36,1);border:1.5px solid transparent}
.btn-ink{background:var(--ink);color:var(--paper)}
.btn-ink:hover{background:var(--acc);border-color:var(--acc)}
.btn-ghost{border-color:rgba(13,14,16,.25)}
.btn-ghost:hover{border-color:var(--ink);background:var(--ink);color:var(--paper)}
.magnet{display:inline-flex}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s cubic-bezier(.22,1,.36,1)}
.reveal.in{opacity:1;transform:none}
.acc{font-style:italic;font-weight:400;color:var(--acc)}
.hero{min-height:100svh;display:flex;flex-direction:column;justify-content:center;position:relative;padding:140px 0 60px}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
.overline{font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;margin-bottom:22px;color:var(--ink2)}
.hero-title{font-size:clamp(3.2rem,8.5vw,7.6rem);letter-spacing:-.03em}
.hl{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.hi{display:block;transform:translateY(112%);transition:transform 1s cubic-bezier(.22,1,.36,1)}
body.loaded .hl:nth-child(1) .hi{transition-delay:.1s}
body.loaded .hl:nth-child(2) .hi{transition-delay:.22s}
body.loaded .hl:nth-child(3) .hi{transition-delay:.34s}
body.loaded .hi{transform:translateY(0)}
.hero-sub{max-width:52ch;margin:28px 0 34px;font-size:clamp(16px,1.6vw,19px);color:#3F4247}
.hero-sub strong{color:var(--ink)}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap}
.hero-meta{margin-top:26px;font-size:13px;font-weight:600;letter-spacing:.04em;color:#5F6368;display:flex;gap:10px;flex-wrap:wrap}
.hero-meta .sep{color:#BEC1C4}
.scroll-hint{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:#5F6368;animation:bob 2.2s ease-in-out infinite}
@keyframes bob{50%{transform:translate(-50%,8px)}}
.hero-vis{position:relative;display:flex;justify-content:center}
.phone{width:min(300px,80vw);aspect-ratio:9/19;background:var(--ink);border-radius:44px;padding:10px;transform:rotate(-7deg);box-shadow:24px 40px 60px -20px rgba(13,14,16,.45);position:relative;z-index:2}
.ph-notch{width:38%;height:22px;background:var(--ink);border-radius:0 0 18px 18px;margin:0 auto;position:relative;z-index:3}
.ph-screen{background:var(--paper);border-radius:34px;height:calc(100% - 22px);overflow:hidden;display:flex;flex-direction:column;position:relative}
.ph-top{display:flex;justify-content:space-between;padding:12px 18px 4px;font-size:11px;font-weight:700;color:var(--ink)}
.ph-body{flex:1;padding:10px 12px;display:flex;flex-direction:column;gap:10px;position:relative}
.ph-call{background:#fff;border:1px solid rgba(13,14,16,.08);border-radius:16px;padding:12px;display:flex;align-items:center;gap:10px;box-shadow:0 8px 20px rgba(13,14,16,.08);opacity:0;transform:translateY(-8px);transition:all .5s;position:absolute;top:10px;left:12px;right:12px;z-index:4}
.ph-call.show{opacity:1;transform:none}
.pc-ring{width:38px;height:38px;border-radius:50%;background:#2f7d4f;color:#fff;display:grid;place-items:center;font-size:17px;animation:ringp 1.2s ease-in-out infinite}
@keyframes ringp{50%{transform:scale(1.12)}}
.ph-call.missed .pc-ring{background:var(--alert);animation:shake .5s}
@keyframes shake{25%{transform:rotate(-8deg)}75%{transform:rotate(8deg)}}
.pc-info{flex:1;line-height:1.25}
.pc-info strong{font-size:13px;display:block}
.pc-info span{font-size:11px;color:#5F6368}
.pc-btns{display:flex;flex-direction:column;gap:6px;font-size:11px}
.pc-x,.pc-ok{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;color:#fff}
.pc-x{background:var(--alert)}.pc-ok{background:#2f7d4f;font-size:12px}
.ph-chat{display:flex;flex-direction:column;gap:8px;padding-top:52px;transition:opacity .5s}
.ph-chat.fade{opacity:0}
.ph-tag{font-size:9px;letter-spacing:.08em;text-transform:uppercase;text-align:center;color:#8E9296;background:rgba(13,14,16,.05);border-radius:100px;padding:3px 8px;align-self:center;opacity:0;transition:opacity .5s .2s}
.ph-chat.on .ph-tag{opacity:1}
.pm{max-width:82%;padding:8px 12px;border-radius:14px;font-size:11.5px;line-height:1.4;opacity:0;transform:scale(.85);transition:all .45s cubic-bezier(.22,1,.36,1)}
.pm.show{opacity:1;transform:none}
.pm.out{align-self:flex-end;background:var(--ink);color:var(--paper);border-bottom-right-radius:4px}
.pm.in{align-self:flex-start;background:#fff;border:1px solid rgba(13,14,16,.07);border-bottom-left-radius:4px}
.pm .dots{display:none;gap:4px}
.pm.typing .dots{display:flex}
.pm.typing .txt{display:none}
.dots i{width:5px;height:5px;border-radius:50%;background:#8E9296;animation:blink 1s infinite}
.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}
@keyframes blink{50%{opacity:.25}}
.ph-saved{align-self:center;background:#e7f3ec;color:#2f7d4f;font-size:10px;font-weight:700;border-radius:100px;padding:5px 12px;opacity:0;transform:scale(.8);transition:all .45s}
.ph-saved.show{opacity:1;transform:none}
.badge-rot{position:absolute;top:-14px;left:-6px;width:112px;height:112px;z-index:5;animation:spin 16s linear infinite;pointer-events:none}
@keyframes spin{to{transform:rotate(360deg)}}
.badge-rot text{font-size:11.5px;font-weight:700;letter-spacing:.12em;fill:var(--ink)}
.badge-rot svg{width:100%;height:100%}
.bd-c{position:absolute;inset:0;display:grid;place-items:center;font-size:26px;animation:spin 16s linear infinite reverse}
.float-card{position:absolute;bottom:6%;right:2%;background:#fff;border:1px solid rgba(13,14,16,.08);border-radius:14px;padding:12px 16px;box-shadow:0 16px 40px rgba(13,14,16,.14);z-index:5;display:flex;flex-direction:column;line-height:1.3;opacity:0;transition:opacity .8s .6s}
body.loaded .float-card{opacity:1}
.float-card strong{font-size:13px}.float-card span{font-size:11px;color:#5F6368}
@media(max-width:920px){.hero-grid{grid-template-columns:1fr}.hero-vis{margin-top:20px}.phone{transform:rotate(-4deg)}}
.marquee{overflow:hidden;border-top:1px solid rgba(13,14,16,.14);border-bottom:1px solid rgba(13,14,16,.14);padding:18px 0;background:var(--paper2)}
.mq-track{display:flex;width:max-content;animation:mq 26s linear infinite}
.mq-set{display:flex;align-items:center;gap:26px;padding-right:26px}
.mq-set span{font-family:var(--serif);font-size:clamp(16px,2.4vw,24px);font-weight:500;white-space:nowrap;letter-spacing:-.01em}
.mq-set i{font-style:normal;color:var(--acc);font-size:14px}
@keyframes mq{to{transform:translateX(-50%)}}
.mani-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:56px;align-items:start;margin-top:28px}
.mani-text{font-family:var(--serif);font-size:clamp(1.6rem,3.2vw,2.7rem);line-height:1.28;letter-spacing:-.01em;font-weight:400}
.mw{opacity:.18;transition:opacity .35s}
.mw.on{opacity:1}
.mani-figs{display:flex;flex-direction:column;gap:22px}
.para{overflow:hidden;position:relative;margin:0}
.para img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);will-change:transform}
.para figcaption{position:absolute;left:0;right:0;bottom:0;margin:0;padding:26px 14px 10px;background:linear-gradient(transparent,rgba(13,14,16,.62));color:#F4F4F2;font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.mani-figs .para{border-radius:6px;aspect-ratio:4/3}
.mani-figs figure{aspect-ratio:4/3}
@media(max-width:920px){.mani-grid{grid-template-columns:1fr}}
.stats{border-top:1px solid rgba(13,14,16,.14);border-bottom:1px solid rgba(13,14,16,.14);background:var(--ink);color:var(--paper);padding:40px 0}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.stat{display:flex;flex-direction:column;gap:4px}
.stat strong{font-family:var(--serif);font-size:clamp(2.6rem,5vw,4.4rem);font-weight:500;letter-spacing:-.02em;line-height:1}
.stat strong i{font-style:italic;color:var(--acc2);font-size:.5em}
.stat span{font-size:13px;color:#8E9296;letter-spacing:.04em}
@media(max-width:720px){.stats-grid{grid-template-columns:repeat(2,1fr)}}
