@font-face {
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("assets/fonts/dm-sans-latin.woff2") format("woff2");
}

@font-face {
  font-family: "Fraunces";
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("assets/fonts/fraunces-italic-latin.woff2") format("woff2");
}

:root {
  --ink: #171713;
  --muted: #68685f;
  --cream: #f6f1e7;
  --paper: #fffdfa;
  --lime: #d8ff67;
  --green: #134e3a;
  --orange: #f36b3b;
  --line: rgba(23, 23, 19, 0.13);
  --shadow: 0 30px 80px rgba(34, 30, 20, 0.15);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "DM Sans", sans-serif; -webkit-font-smoothing: antialiased; }
.page-top-anchor { position: absolute; top: 0; left: 0; width: 1px; height: 1px; pointer-events: none; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.section-shell { width: min(1216px, calc(100% - 48px)); margin: 0 auto; }

.site-header { height: 86px; padding: 0 32px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; border-bottom: 1px solid rgba(23,23,19,.07); position: sticky; top: 0; z-index: 100; background: rgba(255,253,250,.72); backdrop-filter: blur(18px) saturate(1.2); -webkit-backdrop-filter: blur(18px) saturate(1.2); box-shadow: 0 1px 0 rgba(255,255,255,.55); }
.brand { display: inline-flex; align-items: center; gap: 10px; font-size: 23px; font-weight: 700; letter-spacing: -1.2px; width: max-content; }
.brand-mark { width: 31px; height: 31px; display: block; object-fit: contain; }
.brand-dot { color: var(--orange); }
.main-nav { display: flex; gap: 38px; font-size: 14px; font-weight: 500; }
.mobile-nav-cta { display: none; }
.main-nav a, .text-link { transition: opacity .2s; }.main-nav a:hover, .text-link:hover { opacity: .55; }
.header-actions { display: flex; justify-content: flex-end; align-items: center; gap: 24px; font-size: 14px; }
.menu-toggle { display: none; border: 0; background: none; padding: 8px; }

.button { min-height: 50px; padding: 0 25px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; gap: 18px; font-size: 14px; font-weight: 600; border: 1px solid transparent; transition: transform .2s, box-shadow .2s, background .2s; }
.button:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(23,23,19,.15); }
.button-dark { color: white; background: var(--ink); }.button-dark:hover { background: #33332d; }
.button-light { border-color: var(--line); background: rgba(255,255,255,.75); }
.button-white { color: var(--ink); background: white; }
.button-small { min-height: 42px; padding: 0 20px; }
.ui-icon { width: 1em; height: 1em; display: inline-grid; place-items: center; flex: 0 0 auto; line-height: 1; color: currentColor; }
.ui-icon svg { width: 100%; height: 100%; display: block; overflow: visible; }
.ui-icon path { fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.icon-arrow { width: 15px; height: 15px; }
.icon-inline { width: 12px; height: 12px; vertical-align: -1px; }
.icon-play path,
.icon-heart path { fill: currentColor; stroke: none; }
.icon-check { width: 13px; height: 13px; }
.icon-copy { width: 13px; height: 13px; }
.play-control .icon-play { width: 19px; height: 19px; margin-left: 3px; }
.fan-note .icon-heart { width: 13px; height: 13px; }
.check-list .icon-check,
.video-benefits .icon-check { width: 14px; height: 14px; }
.reply-sent .icon-check { width: 16px; height: 16px; }

@media(max-width:1050px) and (min-width:901px){
  .site-header{grid-template-columns:1fr auto;height:76px;padding:0 22px}
  .menu-toggle{display:block;grid-column:2}
  .menu-toggle span:not(.sr-only){display:block;width:23px;height:2px;background:var(--ink);margin:5px}
  .main-nav{display:none;position:absolute;left:0;right:0;top:75px;padding:25px 22px 28px;background:rgba(255,253,250,.96);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);flex-direction:column;align-items:flex-start;gap:20px;border-bottom:1px solid var(--line);box-shadow:0 18px 38px rgba(23,23,19,.08)}
  .main-nav.open{display:flex}
  .main-nav .mobile-nav-cta{display:inline-flex;width:auto;min-height:48px;margin-top:4px;padding:0 22px;border-radius:999px;align-items:center;justify-content:center;gap:20px;background:var(--ink);color:#fff;font-weight:700}
  .header-actions{display:none}
}

.hero { text-align: center; padding-top: 73px; }
.eyebrow, .section-kicker { margin: 0 0 18px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.8px; color: var(--orange); }
.hero h1 { max-width: 1010px; margin: 0 auto; font-size: clamp(58px, 7.2vw, 104px); line-height: .91; letter-spacing: -6px; font-weight: 600; }
.hero-title-kicker { display: block; font-size: clamp(46px, 5.7vw, 82px); line-height: .92; letter-spacing: -4.6px; }
.hero h1 em { display: block; margin-top: 4px; font-size: clamp(80px, 9.4vw, 136px); line-height: .78; letter-spacing: -5.2px; }
em { font-family: "Fraunces", serif; color: var(--orange); font-weight: 600; }
.hero-copy { max-width: 690px; margin: 34px auto 0; color: #54544e; font-size: 18px; line-height: 1.65; }
.hero-actions { display: flex; justify-content: center; gap: 10px; margin-top: 30px; }
.product-stage { height: 648px; margin-top: 72px; padding: 82px 64px 0; position: relative; overflow: hidden; border-radius: 28px; background: #ece8de; isolation: isolate; }
.glow { position: absolute; border-radius: 50%; filter: blur(2px); opacity: .85; z-index: -1; }.glow-one { width: 700px; height: 420px; background: radial-gradient(circle, #d7c4f9, transparent 68%); left: -100px; top: -70px; }.glow-two { width: 650px; height: 480px; background: radial-gradient(circle, #ffdcb7, transparent 68%); right: -90px; top: 20px; }
.dashboard-window { height: 590px; border-radius: 18px 18px 0 0; overflow: hidden; background: #fff; box-shadow: var(--shadow); border: 1px solid rgba(255,255,255,.8); text-align: left; }
.browser-bar { height: 43px; display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: center; padding: 0 18px; border-bottom: 1px solid #ecece8; color: #9a9a91; font-size: 10px; }.browser-bar > span:nth-child(2) { text-align: center; }.browser-bar .secure { text-align: right; color: #68a87f; }
.browser-dots { display: flex; gap: 5px; }.browser-dots i { width: 7px; height: 7px; border-radius: 50%; background: #d3d2cd; }
.dashboard { display: grid; grid-template-columns: 150px 1fr; min-height: 547px; background: #f7f7f3; }
.sidebar { padding: 22px 13px; background: #fff; border-right: 1px solid #ecece8; }.mini-brand { margin: 0 10px 32px; transform: scale(.75); transform-origin: left; }.side-item { display: flex; align-items: center; gap: 9px; padding: 10px 11px; margin-bottom: 4px; border-radius: 8px; color: #898981; font-size: 10px; }.side-item b { font-size: 12px; }.side-item.active { color: var(--green); background: #ecf4ef; font-weight: 600; }
.dashboard-main { padding: 29px 32px; }.dash-heading { display: flex; justify-content: space-between; align-items: center; }.dash-heading small { font-size: 10px; color: #92928b; }.dash-heading h3 { margin: 3px 0 0; font-size: 20px; letter-spacing: -.6px; }.dash-heading button { width: 30px; height: 30px; border: 1px solid #e5e5df; border-radius: 50%; background: white; }
.metric-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 12px; margin-top: 24px; }.metric { min-height: 115px; padding: 17px; border: 1px solid #e7e7e1; border-radius: 12px; background: white; display: flex; flex-direction: column; }.metric span { font-size: 9px; color: #77776f; }.metric strong { margin-top: 9px; font-size: 20px; letter-spacing: -.6px; }.metric small { margin-top: auto; font-size: 8px; color: #6c9a7d; }.metric.featured { position: relative; overflow: hidden; }.sparkline { position: absolute; right: 15px; bottom: 15px; height: 38px; display: flex; align-items: flex-end; gap: 3px; }.sparkline i { display:block; width: 5px; border-radius: 4px; background: var(--lime); }.sparkline i:nth-child(1){height:22%}.sparkline i:nth-child(2){height:43%}.sparkline i:nth-child(3){height:36%}.sparkline i:nth-child(4){height:58%}.sparkline i:nth-child(5){height:48%}.sparkline i:nth-child(6){height:75%}.sparkline i:nth-child(7){height:100%}
.dashboard-lower { display: grid; grid-template-columns: 1.55fr .8fr; gap: 12px; margin-top: 12px; }.chart-card, .activity-card { background: white; border: 1px solid #e7e7e1; border-radius: 12px; padding: 18px; }.card-title { display: flex; align-items: center; justify-content: space-between; }.card-title div { display:flex; flex-direction:column; }.card-title span, .card-title small { font-size: 8px; color: #898981; }.card-title strong { font-size: 10px; }.chart { height: 130px; margin-top: 18px; border-bottom: 1px solid #eee; background: repeating-linear-gradient(to bottom, transparent 0, transparent 42px, #f0f0ec 43px); position: relative; overflow: hidden; }.chart-line { position:absolute; left:-5%; top:48%; width:110%; height:65px; border-top: 3px solid var(--green); border-radius: 50%; transform: rotate(-6deg); }.chart-line:after { content:""; position:absolute; width:110%; height:50px; left:-3%; top:-35px; border-top:3px solid var(--green); border-radius:45%; transform:rotate(10deg); }.chart-point { position:absolute; width:7px; height:7px; background:white; border:2px solid var(--green); border-radius:50%; }.point-one {left:20%;top:54%}.point-two{left:54%;top:35%}.point-three{left:82%;top:21%}.chart-labels{display:flex;justify-content:space-between;margin-top:9px;color:#aaa;font-size:7px}.activity-card .card-title { margin-bottom: 18px; }.activity { display:flex;align-items:center;gap:9px;padding:10px 0;border-bottom:1px solid #eee;}.activity > span{width:27px;height:27px;border-radius:7px;background:#f5f2e9;display:grid;place-items:center;font-size:11px}.activity div{display:flex;flex-direction:column}.activity b{font-size:9px}.activity small{font-size:7px;color:#aaa;margin-top:3px}
.tip-card { position: absolute; right: 27px; top: 52px; display: flex; gap: 12px; align-items: center; padding: 14px 19px; border-radius: 14px; background: rgba(255,255,255,.9); backdrop-filter: blur(12px); box-shadow: 0 16px 45px rgba(41,34,25,.15); text-align:left; animation: float 4s ease-in-out infinite; }.tip-icon{width:32px;height:32px;border-radius:50%;background:var(--lime);display:grid;place-items:center;font-weight:700}.tip-card div:last-child{display:flex;flex-direction:column}.tip-card small{font-size:9px;color:#888}.tip-card strong{font-size:14px;margin-top:2px}@keyframes float{50%{transform:translateY(-8px)}}

.hero-product-flow{height:500px;display:grid;grid-template-columns:250px 54px 300px 54px 280px;align-items:end;justify-content:center;position:relative;z-index:1;text-align:left}.hero-flow-step{display:flex;flex-direction:column;gap:12px}.step-heading{height:48px;display:flex;align-items:center;gap:10px;padding-left:4px}.step-heading>span{width:34px;height:34px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:white;font-size:13px;font-weight:700}.featured-step .step-heading>span{background:var(--lime);color:var(--green)}.step-heading>div{display:flex;flex-direction:column}.step-heading strong{font-size:13px;letter-spacing:-.2px}.step-heading small{font-size:8px;color:#777;margin-top:2px}.hero-product-flow article{background:white;box-shadow:0 22px 55px rgba(49,39,26,.14);overflow:hidden;border:1px solid rgba(23,23,19,.06)}.social-profile-card{height:410px;border-radius:20px}.social-top{height:40px;padding:0 15px;display:flex;align-items:center;justify-content:space-between;font-size:9px}.social-profile-card>img{display:block;width:100%;height:225px;object-fit:cover;object-position:center 28%}.social-copy{padding:13px 15px 9px}.social-copy strong{font-size:11px}.social-copy p{margin:5px 0 9px;font-size:8px;line-height:1.45;color:#666}.social-link{padding:8px 9px;border-radius:7px;background:#f1f1ed;color:var(--green);font-size:8px;font-weight:700;display:flex;align-items:center;justify-content:space-between}.social-nav{height:35px;padding:0 22px;border-top:1px solid #eee;display:flex;align-items:center;justify-content:space-between;font-size:12px}.support-page-card{height:430px;padding:21px;border-radius:20px;position:relative;z-index:2}.support-profile{display:flex;align-items:center;gap:10px}.support-profile img{width:42px;height:42px;border-radius:50%;object-fit:cover}.support-profile div{display:flex;flex-direction:column}.support-profile strong{font-size:11px}.support-profile span{font-size:8px;color:#999;margin-top:3px}.support-page-card>p{font-size:9px;line-height:1.5;color:#666;margin:14px 0}.support-page-card>small{font-size:7px;color:#999;text-transform:uppercase;letter-spacing:.6px}.hero-tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:7px}.hero-tiers>span{padding:9px 3px;border:1px solid #e5e5df;border-radius:8px;text-align:center;font-size:11px;font-weight:700}.hero-tiers>span.active{border-color:var(--green);background:#edf5f0;color:var(--green)}.hero-tiers small{display:block;margin-top:3px;font-size:6px;font-weight:500;color:#999}.hero-custom{height:35px;margin-top:7px;padding:0 11px;border:1px solid #e5e5df;border-radius:8px;display:flex;align-items:center;justify-content:space-between;font-size:8px;color:#999}.hero-message{height:62px;margin-top:7px;padding:9px;border:1px solid #e5e5df;border-radius:8px}.hero-message small{font-size:7px;color:#aaa}.hero-message p{margin:5px 0 0;font-size:8px;line-height:1.4}.support-page-card button,.reply-video-card button{width:100%;height:35px;margin-top:8px;border:0;border-radius:8px;background:var(--ink);color:white;font-size:8px;font-weight:700}.reply-video-card{height:410px;padding:17px;border-radius:20px}.reply-heading{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:7px;margin-bottom:11px}.reply-heading b{font-size:9px}.reply-heading small{font-size:7px;color:#999}.live-dot{width:8px;height:8px;border-radius:50%;background:#ff5c54;box-shadow:0 0 0 4px rgba(255,92,84,.13)}.hero-video-person{height:240px;border-radius:12px;overflow:hidden;position:relative;background:#193b31}.hero-video-person>img{width:100%;height:100%;object-fit:cover;object-position:center 34%}.hero-video-person:after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.55))}.video-caption{position:absolute;z-index:2;left:12px;right:12px;bottom:14px;color:white;font-size:9px;line-height:1.4;text-align:center}.play-control{position:absolute;z-index:2;left:50%;top:42%;transform:translate(-50%,-50%);width:38px;height:38px;border-radius:50%;display:grid;place-items:center;padding-left:2px;background:rgba(255,255,255,.9);color:var(--ink);font-size:10px}.fan-note{display:flex;align-items:center;gap:8px;margin-top:10px;padding:8px;border-radius:8px;background:#f5f2e9}.fan-note>span{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#ffe1d6;color:var(--orange);font-size:9px}.fan-note div{display:flex;flex-direction:column}.fan-note small{font-size:6px;color:#999}.fan-note p{margin:2px 0 0;font-size:7px}.flow-connector{height:458px;display:flex;align-items:center;position:relative}.flow-connector i{display:block;width:100%;height:2px;background:rgba(19,78,58,.22)}.flow-connector span{position:absolute;right:-2px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--lime);color:var(--green);font-size:18px;line-height:1}
.social-nav-icon{width:13px;height:13px;display:block;position:relative;color:#6f7068}.icon-home:before{content:"";position:absolute;left:2px;right:2px;bottom:1px;height:7px;border:1.6px solid currentColor;border-top:0}.icon-home:after{content:"";position:absolute;left:2px;top:1px;width:9px;height:9px;border-left:1.6px solid currentColor;border-top:1.6px solid currentColor;transform:rotate(45deg)}.icon-search:before{content:"";position:absolute;left:1px;top:1px;width:7px;height:7px;border:1.7px solid currentColor;border-radius:50%}.icon-search:after{content:"";position:absolute;right:1px;bottom:1px;width:5px;height:1.7px;background:currentColor;transform:rotate(45deg);transform-origin:center}.icon-plus:before,.icon-plus:after{content:"";position:absolute;left:2px;right:2px;top:50%;height:1.7px;background:currentColor;transform:translateY(-50%)}.icon-plus:after{transform:translateY(-50%) rotate(90deg)}.icon-play-mini:before{content:"";position:absolute;left:4px;top:2px;border-left:8px solid currentColor;border-top:5px solid transparent;border-bottom:5px solid transparent}.icon-profile:before{content:"";position:absolute;left:3px;top:1px;width:7px;height:7px;border:1.6px solid currentColor;border-radius:50%}.icon-profile:after{content:"";position:absolute;left:1px;right:1px;bottom:0;height:5px;border:1.6px solid currentColor;border-radius:50% 50% 0 0;border-bottom:0}

.hero-product-flow{display:flex;width:870px;margin:0 auto;align-items:flex-end;justify-content:center}.hero-flow-step{width:290px;flex:0 0 290px;position:relative;transition:transform .28s ease,filter .28s ease;transform-origin:center bottom}.hero-flow-step:nth-child(1){z-index:1;transform:translateX(34px) scale(.94)}.hero-flow-step:nth-child(2){z-index:3}.hero-flow-step:nth-child(3){z-index:2;transform:translateX(-34px) scale(.94)}.hero-flow-step:hover{z-index:10;transform:translateY(-14px) scale(1.025);filter:none}.hero-product-flow:hover .hero-flow-step:not(:hover){filter:saturate(.78) brightness(.97)}.step-heading{padding:8px 12px;height:58px;border-radius:14px 14px 0 0;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);box-shadow:0 -8px 28px rgba(49,39,26,.07)}.hero-flow-step article{border-radius:0 0 20px 20px}.coffee-picker{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:10px;margin-top:8px;padding:9px;border:1px solid #deded7;border-radius:10px;background:#fff}.coffee-cup{width:38px;height:38px;border-radius:9px;display:grid;place-items:center;background:#f5eee3;font-size:18px}.coffee-picker>strong{font-size:13px}.coffee-counter{display:flex;align-items:center;border:1px solid #deded7;border-radius:8px;overflow:hidden}.coffee-counter button{width:27px;height:29px;margin:0;border:0;border-radius:0;background:#f5f5f1;color:var(--ink);font-size:13px}.coffee-counter b{width:25px;text-align:center;font-size:10px}.coffee-total{height:34px;margin-top:7px;padding:0 10px;border-radius:8px;background:#edf5f0;display:flex;align-items:center;justify-content:space-between;color:var(--green);font-size:8px}.coffee-total b{font-size:10px}.fee-note{width:min(720px,calc(100% - 48px));margin:-52px auto 70px;text-align:center;color:var(--muted);font-size:11px;line-height:1.6}.fee-note a{color:var(--green);font-weight:700;text-decoration:underline;text-underline-offset:3px}.receipt-total{font-weight:700;color:var(--green)}

.trust { padding: 120px 0 130px; text-align: center; }.trust h2 { max-width: 700px; margin: 0 auto; font-size: 44px; line-height: 1.12; letter-spacing: -2.2px; }.logo-row { display: flex; justify-content: space-between; align-items: center; margin: 70px 0; color:#797970; font-weight:700; letter-spacing:1px }.serif-logo{font-family:Georgia,serif;font-style:italic;font-size:24px}.outline-logo{border:2px solid;padding:5px 8px}.script-logo{font-family:"Fraunces";font-size:20px}.stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.stats div{padding:42px 20px;display:flex;flex-direction:column;gap:9px}.stats div+div{border-left:1px solid var(--line)}.stats strong{font-size:36px;letter-spacing:-1.5px}.stats span{font-size:13px;color:var(--muted)}

.how { padding: 130px 0; }.section-intro { display:grid;grid-template-columns:1.35fr .65fr;column-gap:120px;align-items:end;margin-bottom:62px}.section-intro .section-kicker{grid-column:1/-1}.section-intro h2,.feature-copy h2,.faq h2,.final-cta h2{margin:0;font-size:clamp(48px,5.4vw,76px);line-height:.98;letter-spacing:-4px}.section-intro > p:last-child{margin:0;color:var(--muted);font-size:16px;line-height:1.65}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.step-card{padding:20px 20px 30px;border-radius:22px;background:var(--cream);position:relative}.step-number{position:absolute;top:25px;left:25px;font-size:11px;font-weight:700;color:#8d897e}.step-card h3{font-size:22px;margin:27px 8px 8px;letter-spacing:-.7px}.step-card > p{font-size:14px;line-height:1.55;color:var(--muted);margin:0 8px}.phone-visual,.pay-visual,.team-visual{height:360px;border-radius:14px;background:white;box-shadow:0 16px 40px rgba(50,44,30,.08);overflow:hidden}.phone-visual{width:210px;margin:28px auto 0;padding:30px 18px;text-align:center;border:5px solid #24241f;border-bottom:0;border-radius:28px 28px 0 0}.phone-notch{width:70px;height:15px;background:#24241f;border-radius:0 0 10px 10px;margin:-30px auto 42px}.phone-visual small{color:#999;font-size:8px}.phone-visual h4{font-size:15px;margin:5px 0 20px}.faces{display:flex;justify-content:center;gap:10px}.faces span{width:35px;height:35px;border:1px solid #eee;border-radius:50%;display:grid;place-items:center}.faces .selected{background:var(--lime);border-color:var(--lime)}.amounts{display:flex;gap:6px;margin-top:26px}.amounts span{flex:1;padding:8px 2px;border:1px solid #e5e5df;border-radius:7px;font-size:9px}.amounts .selected{border-color:var(--green);color:var(--green);background:#edf5f0}.pay-button{margin-top:10px;padding:10px;background:var(--ink);color:white;border-radius:8px;font-size:9px}.pay-visual{margin-top:28px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(145deg,#164f3b,#0b3024)}.pay-ring{width:150px;height:150px;border:1px solid rgba(255,255,255,.25);border-radius:50%;display:grid;place-items:center;box-shadow:0 0 0 25px rgba(255,255,255,.035),0 0 0 50px rgba(255,255,255,.025)}.pay-ring span{width:105px;height:105px;border-radius:50%;display:grid;place-items:center;background:var(--lime);font-size:32px;font-weight:700}.pay-methods{display:flex;gap:7px;margin-top:55px}.pay-methods span{padding:7px 10px;border-radius:6px;background:white;font-size:8px;font-weight:700}.team-visual{margin-top:28px;padding:36px 25px}.team-total{display:flex;flex-direction:column;text-align:center;padding-bottom:25px;border-bottom:1px solid #eee}.team-total small{font-size:9px;color:#999}.team-total strong{font-size:27px;margin-top:6px}.member{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:15px 0;border-bottom:1px solid #eee}.avatar{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;font-size:10px;font-style:normal}.a1{background:#ffe0d5}.a2{background:#d8e9ff}.a3{background:#e7dbff}.member span{display:flex;flex-direction:column}.member b,.member strong{font-size:10px}.member small{font-size:8px;color:#999;margin-top:2px}

.phone-visual .phone-notch{margin-bottom:24px}.phone-visual h4{margin-bottom:14px}.tier-list{display:flex;flex-direction:column;gap:6px;text-align:left}.tier-list>div{display:grid;grid-template-columns:24px 1fr auto;align-items:center;gap:7px;padding:8px;border:1px solid #e8e8e2;border-radius:8px}.tier-list>div.selected{border-color:var(--green);background:#edf5f0}.tier-list span{width:22px;height:22px;border-radius:6px;background:#f4f1e8;display:grid;place-items:center;font-size:9px}.tier-list b,.tier-list strong{font-size:8px}.tier-list strong{color:var(--green)}
.profile-preview{display:flex;align-items:center;gap:9px;text-align:left;margin:0 0 16px}.profile-photo{width:38px;height:38px;flex:0 0 auto;border-radius:50%;object-fit:cover;object-position:center 25%;background:#ead9cd}.profile-preview>div:last-child{display:flex;flex-direction:column}.profile-preview b{font-size:9px}.profile-preview small{margin-top:2px}.setup-field{height:37px;margin-top:7px;padding:0 10px;border:1px solid #e7e7e1;border-radius:8px;display:flex;align-items:center;justify-content:space-between;text-align:left;font-size:8px}.setup-field b{width:19px;height:19px;border-radius:50%;display:grid;place-items:center;background:#edf5f0;color:var(--green);font-size:8px}
.support-visual,.video-visual,.link-visual{height:360px;margin-top:28px;padding:31px 25px;border-radius:14px;background:white;box-shadow:0 16px 40px rgba(50,44,30,.08);overflow:hidden}.support-visual>small{font-size:8px;color:#999}.support-visual h4{margin:6px 0 20px;font-size:15px}.support-visual .amounts{margin-top:0}.custom-amount{height:39px;margin-top:9px;padding:0 12px;border:1px solid #e5e5df;border-radius:8px;display:flex;align-items:center;justify-content:space-between;color:#aaa;font-size:9px}.custom-amount strong{color:var(--ink);font-size:11px}.fan-message{height:82px;margin-top:9px;padding:10px 12px;border:1px solid #e5e5df;border-radius:8px}.fan-message span{display:block;font-size:7px;color:#aaa;margin-bottom:7px}.fan-message p{margin:0;font-size:9px;line-height:1.45;color:#555}.support-visual .pay-button{text-align:center;margin-top:9px}
.link-visual{padding:31px 24px;text-align:center;background:linear-gradient(155deg,#fff,#f7f5ef)}.link-profile{display:flex;flex-direction:column;align-items:center}.link-profile .profile-photo{width:55px;height:55px;font-size:13px;margin-bottom:9px}.link-profile b{font-size:12px}.link-profile small{font-size:8px;color:#999;margin-top:4px}.creator-link{height:43px;margin-top:22px;padding:0 10px;border:1px solid #dcdcd5;border-radius:8px;background:white;display:flex;align-items:center;font-size:8px;text-align:left}.creator-link span{color:#999}.creator-link strong{flex:1}.creator-link b{width:24px;height:24px;border-radius:6px;background:var(--lime);display:grid;place-items:center;color:var(--green);font-size:10px}.share-label{margin-top:17px;font-size:7px;color:#aaa;text-transform:uppercase;letter-spacing:.8px}.share-channels{display:flex;justify-content:center;gap:7px;margin-top:8px}.share-channels span{width:29px;height:29px;border-radius:8px;display:grid;place-items:center;background:var(--ink);color:white;font-size:7px;font-weight:700}.bio-preview{margin-top:17px;padding:10px 12px;border:1px solid #e7e7e1;border-radius:8px;background:white;text-align:left}.bio-preview small{font-size:7px;color:#aaa}.bio-preview p{margin:5px 0 0;font-size:8px;line-height:1.5}.bio-preview b{color:var(--green)}
.video-visual{padding:22px;background:#fff}.supporter-head{display:flex;align-items:center;gap:9px}.supporter-head>span{display:flex;flex-direction:column}.supporter-head b{font-size:10px}.supporter-head small{font-size:8px;color:#999;margin-top:3px}.message-bubble{margin:14px 0;padding:10px 12px;border-radius:4px 10px 10px 10px;background:#f3f0e8;font-size:8px;line-height:1.4;color:#666}.video-preview{height:180px;position:relative;overflow:hidden;border-radius:11px;background:linear-gradient(145deg,#254f43,#102d25);display:grid;place-items:center}.creator-video-photo{width:100%;height:100%;object-fit:cover;object-position:center 25%}.video-preview:after{content:"";position:absolute;inset:55% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.25))}.record-dot{position:absolute;z-index:2;right:12px;top:12px;width:8px;height:8px;border-radius:50%;background:#ff5c54;box-shadow:0 0 0 4px rgba(255,92,84,.18)}.video-controls{position:absolute;z-index:2;left:10px;right:10px;bottom:10px;height:27px;padding:0 10px;border-radius:8px;background:rgba(0,0,0,.35);display:flex;align-items:center;justify-content:space-between;color:white}.video-controls i{width:8px;height:8px;border-radius:50%;background:white}.video-controls b{font-size:7px}.send-video{margin-top:10px;padding:10px;border-radius:8px;background:var(--lime);color:var(--green);font-size:9px;font-weight:700;text-align:center}

.feature-band { background:#eef2e7; overflow:hidden; }.split-feature{min-height:760px;display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}.feature-copy > p:not(.section-kicker){color:var(--muted);font-size:16px;line-height:1.7;max-width:550px}.check-list{list-style:none;padding:14px 0 20px;margin:0}.check-list li{display:flex;align-items:center;gap:12px;margin:15px 0;font-size:14px}.check-list span{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:white;font-size:11px}.feature-visual{height:610px;position:relative;display:grid;place-items:center}.feature-visual:before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:var(--lime)}.receipt-card{width:370px;padding:34px;position:relative;background:white;border-radius:19px;box-shadow:var(--shadow);transform:rotate(2.5deg)}.receipt-head{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px}.receipt-head span{font-weight:700}.receipt-head small{color:#999}.receipt-card h4{font-size:15px;margin:48px 0 8px}.receipt-card > strong{font-size:40px;letter-spacing:-2px}.progress{height:7px;background:#e8e8e2;border-radius:5px;margin:25px 0 32px}.progress i{display:block;width:84%;height:100%;background:var(--green);border-radius:5px}.receipt-row{display:flex;justify-content:space-between;padding:13px 0;border-top:1px solid #eee;font-size:11px}.receipt-card button{width:100%;border:0;border-radius:9px;background:var(--ink);color:white;padding:13px;margin-top:22px;font-size:10px}.floating-stat{position:absolute;right:7px;top:105px;padding:16px 19px;background:white;border-radius:13px;box-shadow:0 15px 40px rgba(20,40,20,.14);display:flex;align-items:center;gap:10px;animation:float 4s 1s ease-in-out infinite}.floating-stat>span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--lime)}.floating-stat div{display:flex;flex-direction:column}.floating-stat small{font-size:8px;color:#999}.floating-stat strong{font-size:16px}

.video-reply{padding:150px 0;display:grid;grid-template-columns:.9fr 1.1fr;gap:110px;align-items:center}.video-reply-copy h2{margin:0;font-size:clamp(48px,5.4vw,76px);line-height:.98;letter-spacing:-4px}.video-reply-copy>p:not(.section-kicker){max-width:520px;margin:28px 0;color:var(--muted);font-size:16px;line-height:1.7}.video-benefits{list-style:none;padding:0;margin:0}.video-benefits li{display:flex;align-items:center;gap:11px;margin:13px 0;font-size:14px}.video-benefits span{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:white;font-size:10px}.video-reply-demo{min-height:560px;border-radius:25px;background:var(--cream);display:grid;place-items:center;position:relative;padding:55px}.video-reply-demo .video-visual{width:min(390px,100%);height:450px;margin:0;padding:30px;box-shadow:var(--shadow)}.video-reply-demo .video-preview{height:250px}.reply-sent{position:absolute;right:24px;bottom:30px;padding:14px 18px;border-radius:13px;background:white;box-shadow:0 15px 40px rgba(50,44,30,.14);display:flex;align-items:center;gap:10px}.reply-sent>span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--lime);color:var(--green);font-weight:700}.reply-sent div{display:flex;flex-direction:column}.reply-sent b{font-size:10px}.reply-sent small{font-size:8px;color:#999;margin-top:2px}
.faq{padding:110px 0 150px;display:grid;grid-template-columns:.7fr 1.3fr;gap:100px}.faq-list{border-top:1px solid var(--line)}details{border-bottom:1px solid var(--line);padding:0}summary{list-style:none;cursor:pointer;padding:27px 0;display:flex;justify-content:space-between;gap:20px;font-size:17px;font-weight:600}summary::-webkit-details-marker{display:none}summary span{font-size:23px;font-weight:400;transition:transform .2s}details[open] summary span{transform:rotate(45deg)}details p{margin:-5px 50px 25px 0;color:var(--muted);line-height:1.6;font-size:14px}
.final-cta{padding-bottom:32px}.cta-inner{min-height:620px;border-radius:28px;background:var(--green);color:white;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:65px 30px;position:relative;overflow:hidden}.cta-inner:before,.cta-inner:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.08);border-radius:50%;width:700px;height:700px}.cta-inner:after{width:940px;height:940px}.cta-inner .section-kicker{color:var(--lime)}.cta-inner h2 em{color:var(--lime)}.cta-inner>p:not(.section-kicker){max-width:480px;color:rgba(255,255,255,.7);line-height:1.6}.cta-inner .button{margin-top:18px;z-index:1}.cta-cup{width:65px;height:65px;border-radius:50%;background:var(--lime);color:var(--green);display:grid;place-items:center;margin-bottom:30px;font-size:19px;z-index:1}
.site-footer{padding:65px 32px 28px}.footer-top{display:grid;grid-template-columns:1fr 1fr 2fr;align-items:start;padding-bottom:60px}.brand-footer{font-size:21px}.footer-top p{margin:4px 0;color:var(--muted);font-size:13px;max-width:220px}.footer-links{display:flex;justify-content:flex-end;gap:30px;font-size:13px}.footer-bottom{padding-top:25px;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:#999;font-size:11px}.footer-bottom div{display:flex;gap:25px}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .75s ease,transform .75s ease}.reveal.is-visible{opacity:1;transform:none}

@media(max-width:900px){.site-header{grid-template-columns:1fr auto;height:76px;padding:0 22px}.menu-toggle{display:block;grid-column:2}.menu-toggle span:not(.sr-only){display:block;width:23px;height:2px;background:var(--ink);margin:5px}.main-nav{display:none;position:absolute;left:0;right:0;top:75px;padding:25px 22px 28px;background:rgba(255,253,250,.96);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);flex-direction:column;align-items:flex-start;gap:20px;border-bottom:1px solid var(--line);box-shadow:0 18px 38px rgba(23,23,19,.08)}.main-nav.open{display:flex}.main-nav .mobile-nav-cta{display:inline-flex;width:auto;min-height:48px;margin-top:4px;padding:0 22px;border-radius:999px;align-items:center;justify-content:center;gap:20px;background:var(--ink);color:#fff;font-weight:700}.main-nav .mobile-nav-cta:hover{opacity:1;background:#33332d}.header-actions{display:none}.hero{padding-top:60px}.hero h1{letter-spacing:-4px}.product-stage{height:520px;padding:20px 25px 0}.hero-product-flow{width:970px;transform:scale(.72);transform-origin:top center;left:50%;margin-left:-485px}.hero-flow-label{bottom:16px}.dashboard-window{min-width:760px;transform:translateX(-60px)}.tip-card{right:15px}.section-intro,.faq{grid-template-columns:1fr;gap:35px}.steps{grid-template-columns:1fr}.step-card{display:grid;grid-template-columns:1fr 1fr;column-gap:30px}.step-card>div{grid-row:1/4;grid-column:1}.step-card>.step-number{grid-row:auto;grid-column:auto}.step-card h3{align-self:end}.split-feature{grid-template-columns:1fr;gap:30px;padding-top:100px}.feature-visual{height:580px}.video-reply{grid-template-columns:1fr;gap:55px;padding:110px 0}.video-reply-copy{max-width:650px}.video-reply-demo{min-height:540px}.footer-top{grid-template-columns:1fr 1fr;row-gap:40px}.footer-links{grid-column:1/-1;justify-content:flex-start}}
@media(max-width:620px){.section-shell{width:min(100% - 28px,1216px)}.hero{padding-top:42px}.hero h1{font-size:52px;letter-spacing:-3px}.hero-copy{font-size:16px;margin-top:27px}.hero-actions{flex-direction:column;align-items:stretch;margin:28px 24px 0}.product-stage{margin-top:50px;height:430px;padding:12px 0 0;border-radius:20px}.hero-product-flow{transform:scale(.54);height:500px}.hero-flow-label{bottom:10px;gap:6px;padding:8px 10px}.hero-flow-label span{font-size:6px}.hero-flow-label i{width:9px}.dashboard-window{transform:scale(.72) translateX(-210px);transform-origin:top center}.tip-card{top:17px;right:10px}.how{padding:90px 0}.section-intro h2,.feature-copy h2,.faq h2,.final-cta h2,.video-reply-copy h2{font-size:47px;letter-spacing:-2.7px}.section-intro{margin-bottom:40px}.step-card{display:block}.phone-visual,.pay-visual,.team-visual,.support-visual,.video-visual,.link-visual{height:330px}.support-visual,.video-visual,.link-visual{padding:22px}.video-preview{height:155px}.feature-band{padding-top:0}.split-feature{padding-top:85px}.feature-visual{height:480px}.feature-visual:before{width:370px;height:370px}.receipt-card{width:290px;padding:25px}.floating-stat{right:-5px;top:52px}.video-reply{padding:90px 0;gap:40px}.video-reply-demo{min-height:475px;padding:28px 18px}.video-reply-demo .video-visual{height:410px;padding:22px}.video-reply-demo .video-preview{height:215px}.reply-sent{right:10px;bottom:16px}.faq{padding:80px 0 100px}.cta-inner{min-height:560px}.site-footer{padding:50px 20px 25px}.footer-top{grid-template-columns:1fr}.footer-links{grid-column:auto;flex-wrap:wrap}.footer-bottom{flex-direction:column;gap:15px}}

.hero-flow-step:nth-child(1):hover{transform:translateX(34px) translateY(-14px) scale(1.025)}
.hero-flow-step:nth-child(3):hover{transform:translateX(-34px) translateY(-14px) scale(1.025)}
.step-coffee-picker{margin-top:0}
.support-visual .coffee-total{margin-bottom:9px}
.coffee-cup{position:relative;isolation:isolate}
.coffee-cup img{width:30px;height:30px;display:block;object-fit:contain;transform-origin:center 70%}
.coffee-cup.is-added{animation:coffee-cup-pop .52s cubic-bezier(.2,.85,.3,1.35)}
.coffee-cup.is-added:before{content:"";position:absolute;z-index:-1;inset:-5px;border:2px solid rgba(255,104,61,.4);border-radius:12px;animation:coffee-cup-ring .52s ease-out both}
.coffee-hearts{position:absolute;z-index:3;inset:0;pointer-events:none}
.coffee-hearts i{position:absolute;left:14px;top:8px;width:9px;height:9px;background:var(--orange);transform:rotate(45deg);animation:coffee-heart-rise .82s cubic-bezier(.2,.75,.25,1) both}
.coffee-hearts i:before,.coffee-hearts i:after{content:"";position:absolute;width:9px;height:9px;border-radius:50%;background:inherit}
.coffee-hearts i:before{left:-5px}.coffee-hearts i:after{top:-5px}
.coffee-hearts i:nth-child(2){left:6px;top:12px;background:#ff8e72;animation-delay:.05s;animation-duration:.76s}
.coffee-hearts i:nth-child(3){left:24px;top:12px;background:#e95757;animation-delay:.09s;animation-duration:.88s}
.coffee-hearts i:nth-child(4){left:10px;top:4px;width:7px;height:7px;background:#ffb09c;animation-delay:.14s;animation-duration:.72s}
.coffee-hearts i:nth-child(4):before,.coffee-hearts i:nth-child(4):after{width:7px;height:7px}.coffee-hearts i:nth-child(4):before{left:-4px}.coffee-hearts i:nth-child(4):after{top:-4px}
.coffee-hearts i:nth-child(5){left:23px;top:5px;width:6px;height:6px;background:#ff7a61;animation-delay:.18s;animation-duration:.78s}
.coffee-hearts i:nth-child(5):before,.coffee-hearts i:nth-child(5):after{width:6px;height:6px}.coffee-hearts i:nth-child(5):before{left:-3px}.coffee-hearts i:nth-child(5):after{top:-3px}

@keyframes coffee-cup-pop{
  0%{transform:scale(1) rotate(0)}
  38%{transform:translateY(-6px) scale(1.18) rotate(-7deg)}
  68%{transform:translateY(1px) scale(.96) rotate(3deg)}
  100%{transform:scale(1) rotate(0)}
}
@keyframes coffee-cup-ring{0%{opacity:.9;transform:scale(.72)}100%{opacity:0;transform:scale(1.35)}}
@keyframes coffee-heart-rise{0%{opacity:0;transform:translate(0,4px) rotate(45deg) scale(.45)}28%{opacity:1}100%{opacity:0;transform:translate(var(--heart-drift,5px),-32px) rotate(45deg) scale(1.05)}}
.coffee-hearts i:nth-child(even){--heart-drift:-8px}.coffee-hearts i:nth-child(3){--heart-drift:10px}

@media(prefers-reduced-motion:reduce){
  .coffee-cup.is-added,.coffee-cup.is-added:before{animation:none}
  .coffee-hearts{display:none}
}

@media(max-width:900px){
  .hero-product-flow{width:870px;margin-left:-435px}
}

@media(max-width:620px){
  .hero-product-flow{width:870px;margin-left:-435px}
  .fee-note{margin:-20px auto 55px}
}

/* Product story carousel */
.product-stage{width:min(1080px,100%);height:570px;margin:60px auto 0;padding:38px 42px 0}
.hero-product-flow{height:500px}
.hero-flow-step{gap:0;filter:saturate(.78) brightness(.97)}
.hero-flow-step.is-active{z-index:12!important;filter:none;transform:translateY(-12px) scale(1.035)!important}
.step-heading{position:relative;overflow:hidden}
.step-heading:after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:#deded7;transform-origin:left}
.hero-flow-step.is-active .step-heading:after{background:var(--orange);animation:story-progress 4.5s linear forwards}
@keyframes story-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* Compact account setup card */
.account-visual{height:360px;margin-top:28px;padding:30px 26px;border-radius:14px;background:white;box-shadow:0 16px 40px rgba(50,44,30,.08);overflow:hidden}
.account-visual .profile-preview{padding-bottom:15px;margin-bottom:10px;border-bottom:1px solid #eee}
.account-visual .profile-photo{width:48px;height:48px}
.account-visual .profile-preview b{font-size:11px}
.profile-description{padding:10px 11px;margin-bottom:8px;border-radius:8px;background:#f6f4ee;text-align:left}
.profile-description small{font-size:7px;color:#999}
.profile-description p{margin:4px 0 0;font-size:8px;line-height:1.4;color:#555}
.account-visual .pay-button{text-align:center;margin-top:9px}

/* Recognizable social icons */
.share-channels span{background:white;border:1px solid #dfdfd9;color:var(--ink)}
.share-channels svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.share-channels span:nth-child(2){color:#f20d18}
.share-channels span:nth-child(2) svg path:first-child{fill:currentColor;stroke:none}
.share-channels span:nth-child(2) .icon-fill{fill:white;stroke:none}
.share-channels span:nth-child(3){color:#111}

/* Video framing and fee note */
.creator-video-photo{object-position:center 50%}
.hero-video-person>img{object-position:center 42%}
.feature-band{padding-bottom:48px}
.fee-note{position:relative;z-index:3;margin:0 auto;text-align:center}
.feature-visual:before{width:460px;height:460px}
.how{padding:105px 0 115px}
.section-intro{margin-bottom:48px}

@media(max-width:900px){
  .product-stage{height:500px;padding-top:20px}
  .hero-flow-step.is-active{transform:translateY(-8px) scale(1.035)!important}
  .account-visual{margin-top:28px}
}

@media(max-width:620px){
  .product-stage{height:410px;padding-top:6px}
  .account-visual{height:330px;padding:22px}
  .fee-note{margin:0 auto 15px}
}

/* Shared story heading above the product cards */
.product-stage{height:510px;padding:24px 42px 0}
.story-header{width:min(680px,calc(100% - 40px));height:72px;margin:0 auto 10px;display:grid;grid-template-columns:42px 1fr;column-gap:12px;align-items:center;position:relative;text-align:left;z-index:20}
.story-number{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:white;font-size:14px;font-weight:700}
.story-copy{display:flex;flex-direction:column}
.story-copy strong{font-size:18px;letter-spacing:-.4px}
.story-copy small{margin-top:3px;color:var(--muted);font-size:10px}
.story-progress{position:absolute;left:0;right:0;bottom:0;height:3px;border-radius:4px;background:rgba(23,23,19,.12);overflow:hidden}
.story-progress i{display:block;width:100%;height:100%;background:var(--orange);transform-origin:left;animation:story-progress 4.5s linear forwards}
.hero-product-flow{height:402px;align-items:flex-end}
.hero-flow-step{gap:0}
.hero-flow-step article{border-radius:20px}
.social-profile-card,.reply-video-card{height:382px}
.support-page-card{height:402px}
.social-profile-card>img{height:205px}
.hero-video-person{height:218px}
.step-heading{display:none}

@media(max-width:900px){
  .product-stage{height:465px;padding-top:15px}
  .story-header{height:64px;margin-bottom:4px}
  .hero-product-flow{height:398px}
}

@media(max-width:620px){
  .product-stage{height:390px;padding-top:8px}
  .story-header{width:calc(100% - 24px);height:60px;margin-bottom:0;grid-template-columns:34px 1fr;column-gap:9px}
  .story-number{width:31px;height:31px;font-size:11px}
  .story-copy strong{font-size:14px}
  .story-copy small{font-size:8px}
}

/* Diagonal card stack with a separate explanatory header */
.product-stage{height:600px;padding:26px 34px 0}
.story-header{width:min(650px,calc(100% - 50px));height:82px;margin:0 auto 22px;padding:12px 22px;grid-template-columns:42px 1fr;border:1px solid rgba(23,23,19,.07);border-radius:18px;background:rgba(255,255,255,.9);box-shadow:0 14px 35px rgba(49,39,26,.09);backdrop-filter:blur(12px)}
.story-progress{left:22px;right:22px;bottom:11px}
.hero-product-flow{display:block;position:relative;width:820px;height:465px;margin:0 auto;overflow:visible}
.hero-flow-step{position:absolute;width:290px;transform-origin:center center;filter:saturate(.78) brightness(.97);transition:transform .32s ease,filter .32s ease,box-shadow .32s ease}
.hero-flow-step:nth-child(1){left:20px;top:0;z-index:3;transform:scale(.94)}
.hero-flow-step:nth-child(2){left:265px;top:34px;z-index:2;transform:scale(.94)}
.hero-flow-step:nth-child(3){left:510px;top:68px;z-index:1;transform:scale(.94)}
.hero-flow-step.is-active,.hero-flow-step:hover{z-index:20!important;transform:translateY(-8px) scale(1.025)!important;filter:none;box-shadow:0 26px 60px rgba(49,39,26,.12)}
.hero-product-flow:hover .hero-flow-step:not(:hover){filter:saturate(.7) brightness(.94)}
.hero-flow-step:nth-child(1):hover,.hero-flow-step:nth-child(3):hover{transform:translateY(-8px) scale(1.025)!important}

@media(max-width:900px){
  .product-stage{height:500px;padding:18px 22px 0}
  .story-header{height:74px;margin-bottom:12px;padding:9px 18px}
  .story-progress{left:18px;right:18px;bottom:9px}
  .hero-product-flow{width:820px;height:430px;margin-left:-410px;transform:scale(.72);transform-origin:top center}
}

@media(max-width:620px){
  .product-stage{height:410px;padding:12px 8px 0}
  .story-header{width:calc(100% - 16px);height:68px;margin-bottom:8px;padding:8px 13px;border-radius:14px}
  .story-progress{left:13px;right:13px;bottom:7px}
  .hero-product-flow{width:820px;margin-left:-410px;transform:scale(.54)}
}

/* Final product showcase: balanced row, focused active card */
.product-stage{height:620px;padding:32px 46px 42px}
.story-header{width:min(720px,100%);height:84px;margin:0 auto 32px;padding:13px 24px;border-radius:20px}
.story-progress{left:24px;right:24px;bottom:12px}
.hero-product-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;position:relative;width:min(1000px,100%);height:448px;margin:0 auto;overflow:visible;transform:none}
.hero-flow-step,.hero-flow-step:nth-child(1),.hero-flow-step:nth-child(2),.hero-flow-step:nth-child(3){position:relative;inset:auto;width:auto;transform:scale(.94);filter:saturate(.72) brightness(.96);z-index:1;transition:transform .32s ease,filter .32s ease,box-shadow .32s ease,opacity .32s ease}
.hero-flow-step article{width:100%;height:430px;border-radius:20px;box-shadow:0 14px 35px rgba(49,39,26,.1)}
.hero-flow-step.is-active,.hero-flow-step:hover,.hero-flow-step:nth-child(1):hover,.hero-flow-step:nth-child(3):hover{z-index:5!important;transform:translateY(-10px) scale(1.025)!important;filter:none;box-shadow:none}
.hero-flow-step.is-active article,.hero-flow-step:hover article{box-shadow:0 25px 60px rgba(49,39,26,.2)}
.hero-product-flow:hover .hero-flow-step:not(:hover){filter:saturate(.72) brightness(.96)}
.social-profile-card>img{height:235px}
.support-page-card{padding:21px}
.hero-video-person{height:248px}
.product-stage.is-paused .story-progress i{animation-play-state:paused}
.story-navigation{display:none}

@media(max-width:1050px){
  .product-stage{height:540px;padding:24px 28px 30px}
  .story-header{height:76px;margin-bottom:20px}
  .hero-product-flow{width:900px;height:430px;left:50%;margin-left:-450px;transform:scale(.72);transform-origin:top center;gap:22px}
}

@media(max-width:620px){
  .product-stage{height:430px;padding:14px 12px 24px}
  .story-header{height:70px;margin-bottom:10px;padding:9px 14px}
  .story-progress{left:14px;right:14px;bottom:8px}
  .hero-product-flow{width:900px;height:430px;margin-left:-450px;transform:scale(.53);gap:22px}
}

/* Tighter showcase with stronger active-card emphasis */
.product-stage{height:575px;padding:26px 42px 14px}
.story-header{height:72px;margin-bottom:16px;padding:10px 22px;grid-template-columns:40px 1fr}
.story-progress{display:none}
.hero-product-flow{height:438px;gap:36px}
.hero-flow-step,.hero-flow-step:nth-child(1),.hero-flow-step:nth-child(2),.hero-flow-step:nth-child(3){transform:scale(.88);opacity:.78;filter:saturate(.64) brightness(.95)}
.hero-flow-step.is-active,.hero-flow-step:hover,.hero-flow-step:nth-child(1):hover,.hero-flow-step:nth-child(3):hover{transform:translateY(-8px) scale(1.075)!important;opacity:1;filter:none}
.hero-product-flow:hover .hero-flow-step:not(:hover){transform:scale(.84);opacity:.66;filter:saturate(.55) brightness(.93)}

@media(max-width:1050px){
  .product-stage{height:425px;padding:18px 22px 4px}
  .story-header{height:66px;margin-bottom:10px}
  .hero-product-flow{height:400px;gap:34px}
}

@media(max-width:620px){
  .product-stage{height:345px;padding:10px 10px 3px}
  .story-header{height:60px;margin-bottom:4px}
  .hero-product-flow{height:390px;gap:34px}
}

/* Readable story header and collision-free card spacing */
.story-header{height:88px;margin-bottom:30px;padding:14px 24px;grid-template-columns:44px 1fr;column-gap:14px}
.story-number{width:40px;height:40px}
.story-copy strong{font-size:20px;line-height:1.1}
.story-copy small{margin-top:6px;font-size:13px;line-height:1.35;color:#5f5f58}
.hero-product-flow{margin-top:0}

@media(max-width:1050px) and (min-width:621px){
  .product-stage{height:482px;padding:22px 26px 8px}
  .story-header{width:min(600px,calc(100% - 20px));height:84px;margin-bottom:40px;padding:12px 20px}
  .story-copy strong{font-size:19px}
  .story-copy small{font-size:12px}
  .hero-product-flow{width:900px;height:390px;left:50%;margin-left:-450px;transform:scale(.72);transform-origin:top center}
}

@media(max-width:620px){
  .product-stage{height:630px;padding:16px 14px 68px}
  .story-header{width:min(300px,calc(100vw - 68px));height:94px;margin:0 auto 24px;padding:14px 16px;grid-template-columns:38px 1fr;column-gap:12px;border-radius:16px}
  .story-number{width:36px;height:36px;font-size:13px}
  .story-copy strong{font-size:18px}
  .story-copy small{font-size:12px;line-height:1.35}
  .hero-product-flow{display:block;position:relative;left:auto;width:100%;height:450px;margin:0;transform:none!important;touch-action:pan-y}
  .hero-flow-step,.hero-flow-step:nth-child(1),.hero-flow-step:nth-child(2),.hero-flow-step:nth-child(3){position:absolute!important;inset:0 auto auto 50%!important;width:min(300px,calc(100vw - 68px));height:440px;opacity:0;visibility:hidden;pointer-events:none;transform:translateX(-50%) scale(.92)!important;filter:none}
  .hero-flow-step.is-active{z-index:5!important;opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) scale(1)!important}
  .hero-flow-step article{height:430px}
  .hero-product-flow:hover .hero-flow-step:not(:hover){opacity:0;transform:translateX(-50%) scale(.92)!important;filter:none}
  .hero-flow-step.is-active:hover{transform:translateX(-50%) scale(1)!important}
  .story-navigation{position:absolute;z-index:30;left:14px;right:14px;bottom:28px;display:flex;align-items:center;justify-content:center}
  .story-dots{display:flex;align-items:center;justify-content:center;gap:8px}
  .story-dots button{width:18px;height:28px;padding:0;border:0;background:transparent;position:relative;cursor:pointer}
  .story-dots button:after{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:50%;background:rgba(23,23,19,.2);transform:translate(-50%,-50%);transition:width .2s ease,background .2s ease}
  .story-dots button.is-active{width:30px}
  .story-dots button.is-active:after{width:24px;border-radius:5px;background:var(--orange)}
}

/* Reuse the same reply-card language as the product showcase above. */
.video-reply-demo{min-height:720px;padding:48px}
.video-reply-demo .video-visual{width:min(440px,100%);height:auto;margin:0;padding:28px;border-radius:22px}
.video-reply-demo .reply-heading{margin-bottom:16px}
.video-reply-demo .reply-heading b{font-size:13px}
.video-reply-demo .reply-heading small{font-size:10px}
.video-reply-demo .hero-video-person{height:410px;border-radius:18px}
.video-reply-demo .creator-video-photo{object-position:center 42%}
.video-reply-demo .play-control{width:58px;height:58px;font-size:15px}
.video-reply-demo .play-control .icon-play{width:24px;height:24px;margin-left:3px}
.video-reply-demo .video-caption{font-size:12px;bottom:20px}
.video-reply-demo .fan-note{margin-top:16px;padding:12px;border-radius:11px}
.video-reply-demo .fan-note>span{width:34px;height:34px;font-size:13px}
.video-reply-demo .fan-note small{font-size:8px}
.video-reply-demo .fan-note p{font-size:10px}
.video-reply-demo .send-video{width:100%;margin-top:14px;padding:15px;border-radius:10px;background:var(--ink);color:white;font-size:11px}

@media(max-width:900px){
  .video-reply-demo{min-height:680px;padding:38px}
  .video-reply-demo .hero-video-person{height:390px}
}

@media(max-width:620px){
  .video-reply-demo{min-height:610px;padding:22px 12px}
  .video-reply-demo .video-visual{width:100%;padding:20px}
  .video-reply-demo .hero-video-person{height:340px}
}

.reply-play{position:absolute;z-index:3;left:50%;top:50%;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;transform:translate(-50%,-50%);padding-left:4px;background:rgba(255,255,255,.92);color:var(--ink);box-shadow:0 10px 30px rgba(0,0,0,.2);font-size:18px}
.video-reply-demo .reply-sent{top:28px;right:22px;bottom:auto;animation:reply-float 3.2s ease-in-out infinite}
@keyframes reply-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

@media(max-width:620px){
  .reply-play{width:50px;height:50px;font-size:15px}
  .video-reply-demo .reply-sent{top:12px;right:8px;padding:11px 13px}
}

@media(max-width:620px){
  .hero-title-kicker{font-size:42px;line-height:.95;letter-spacing:-2.5px}
  .hero h1 em{margin-top:7px;font-size:64px;line-height:.82;letter-spacing:-2.6px}
}

/* Turn each setup step into one compact, balanced product story. */
.step-card .step-copy{padding:14px 8px 4px}
.step-card .step-copy h3{margin:0 0 12px;font-size:clamp(25px,2.2vw,34px);line-height:1.05;letter-spacing:-1.2px}
.step-card .step-copy>p{max-width:490px;margin:0;color:var(--muted);font-size:15px;line-height:1.6}
.step-benefits{display:grid;gap:10px;margin:26px 0 0;padding:0;list-style:none}
.step-benefits li{display:flex;align-items:center;gap:10px;padding:11px 13px;border:1px solid rgba(20,20,17,.08);border-radius:12px;background:rgba(255,255,255,.52);font-size:13px;font-weight:650;color:#35362f}
.step-benefits li:before{content:"\2713";width:23px;height:23px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;background:#e5f1eb;color:var(--green);font-size:12px;font-weight:900}

@media(min-width:621px) and (max-width:900px){
  .steps{gap:28px}
  .step-card{grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);gap:clamp(34px,6vw,74px);align-items:center;min-height:0;padding:clamp(34px,5vw,58px);overflow:hidden}
  .step-card>div.account-visual,.step-card>div.link-visual,.step-card>div.support-visual{grid-column:1;grid-row:1;margin:0;width:100%;align-self:center}
  .step-card>div.step-copy{grid-column:2;grid-row:1;padding:0;align-self:center}
  .step-card:nth-child(2)>div.step-copy{grid-column:1}
  .step-card:nth-child(2)>div.link-visual{grid-column:2}
  .step-card .step-copy h3{align-self:auto;margin:0 0 16px;font-size:clamp(34px,4.8vw,52px);letter-spacing:-2px}
  .step-card .step-copy>p{font-size:clamp(17px,2vw,21px);line-height:1.55}
  .step-benefits{margin-top:30px}
  .step-benefits li{padding:13px 15px;font-size:14px;background:rgba(255,255,255,.68)}
}

@media(max-width:620px){
  .steps{gap:18px}
  .step-card{padding:18px 18px 26px}
  .step-card .account-visual{height:auto;min-height:330px;overflow:visible}
  .step-card .link-visual{height:auto;min-height:390px;overflow:visible}
  .step-card .support-visual{height:auto;min-height:390px;overflow:visible}
  .step-card .step-copy{padding:18px 4px 2px}
  .step-card .step-copy h3{font-size:29px;letter-spacing:-1.2px}
  .step-card .step-copy>p{font-size:15px}
  .step-benefits{margin-top:22px;gap:8px}
}

.footer-top .footer-tagline{color:var(--orange);font-weight:750}

.legal-page{padding:82px 0 110px;max-width:860px}
.legal-page h1{margin:0 0 22px;font-size:clamp(48px,6vw,82px);line-height:.95;letter-spacing:-4px}
.legal-lead{margin:0 0 48px;color:#4f5049;font-size:18px;line-height:1.65}
.legal-section{padding:30px 0;border-top:1px solid var(--line)}
.legal-section h2{margin:0 0 14px;font-size:24px;letter-spacing:-.7px}
.legal-section p{margin:0 0 14px;color:var(--muted);font-size:15px;line-height:1.75}
.legal-section p:last-child{margin-bottom:0}
.legal-section a{color:var(--green);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.legal-nav{justify-self:center}

@media(max-width:900px){
  .legal-nav{display:flex;position:static;padding:0;background:transparent;box-shadow:none;border:0;backdrop-filter:none}
}

@media(max-width:620px){
  .legal-page{padding:58px 0 82px}
  .legal-page h1{font-size:46px;letter-spacing:-2.4px}
  .legal-lead{font-size:16px;margin-bottom:34px}
  .legal-section{padding:24px 0}
  .legal-nav{display:none}
}

.video-benefits .video-benefit-primary{width:fit-content;margin:20px 0 18px;padding:16px 20px;border:1px solid rgba(19,78,58,.16);border-radius:14px;background:#edf5f0;color:var(--green);box-shadow:0 10px 28px rgba(19,78,58,.08)}
.video-benefits .video-benefit-primary strong{font-size:15px;font-weight:800}

/* Give the reply showcase its own visual world instead of another cream panel. */
.video-reply-demo{isolation:isolate;overflow:hidden;background:
  radial-gradient(circle at 13% 18%,rgba(255,106,61,.34),transparent 31%),
  radial-gradient(circle at 88% 82%,rgba(207,255,78,.24),transparent 30%),
  linear-gradient(145deg,#123d31 0%,#0b2c24 58%,#12382e 100%)}
.video-reply-demo:before{content:"";position:absolute;z-index:-1;width:360px;height:360px;left:-150px;bottom:-190px;border:1px solid rgba(255,255,255,.12);border-radius:50%;box-shadow:0 0 0 48px rgba(255,255,255,.025),0 0 0 96px rgba(255,255,255,.018)}
.video-reply-demo:after{content:"";position:absolute;z-index:-1;width:190px;height:190px;right:-70px;top:-85px;border-radius:50%;background:rgba(255,255,255,.045);filter:blur(1px)}
.video-reply-demo .video-visual{position:relative;z-index:2;box-shadow:0 30px 75px rgba(0,0,0,.3)}
.video-reply-demo .reply-sent{z-index:4}

/* A brighter, editorial counterpart to the dark reply showcase. */
.product-stage{isolation:isolate;border:1px solid rgba(62,53,40,.07);background:
  radial-gradient(circle at 18% 10%,rgba(207,193,231,.42),transparent 35%),
  radial-gradient(circle at 84% 22%,rgba(247,204,177,.38),transparent 34%),
  radial-gradient(circle at 54% 100%,rgba(190,216,202,.26),transparent 40%),
  linear-gradient(145deg,#f4f0e8 0%,#eee9e1 52%,#e8e8df 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 30px 75px rgba(73,61,43,.1)}
.product-stage:before{content:"";position:absolute;z-index:0;inset:0;opacity:.14;background-image:linear-gradient(rgba(74,65,51,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(74,65,51,.09) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.55),transparent 78%);pointer-events:none}
.product-stage:after{content:"";position:absolute;z-index:0;width:620px;height:620px;right:-330px;bottom:-390px;border:1px solid rgba(77,72,60,.1);border-radius:50%;box-shadow:0 0 0 70px rgba(255,255,255,.09),0 0 0 140px rgba(255,255,255,.05);pointer-events:none}
.product-stage .glow{z-index:0;filter:blur(16px);opacity:.72;pointer-events:none}
.product-stage .glow-one{width:620px;height:430px;left:-170px;top:-130px;background:radial-gradient(circle,rgba(194,174,225,.5),transparent 68%)}
.product-stage .glow-two{width:590px;height:440px;right:-140px;top:10px;background:radial-gradient(circle,rgba(245,190,153,.44),transparent 69%)}
.product-stage .story-header{border-color:rgba(61,54,43,.09);background:rgba(255,255,255,.91);box-shadow:0 18px 45px rgba(73,61,43,.12)}
.product-stage .hero-product-flow{z-index:2}

@media(max-width:620px){
  .product-stage:before{background-size:48px 48px;opacity:.13}
  .product-stage:after{width:360px;height:360px;right:-230px;bottom:-210px;box-shadow:0 0 0 42px rgba(255,255,255,.022)}
  .product-stage .glow-one{width:390px;height:300px;left:-170px;top:-80px}
  .product-stage .glow-two{width:360px;height:300px;right:-170px;top:110px}
}

/* Conversion and launch trust */
.hero-trust{width:min(850px,100%);margin:28px auto 0;padding:15px 20px;border:1px solid rgba(23,23,19,.08);border-radius:16px;display:flex;align-items:center;justify-content:center;gap:0;background:#f7f5ef;color:#5f5f58;font-size:12px}
.hero-trust span{padding:0 24px;border-right:1px solid rgba(23,23,19,.1)}
.hero-trust span:last-child{border-right:0}
.hero-trust b{color:var(--green);font-weight:800}
.hero-fee{margin:11px auto 0;color:#77766f;font-size:11px}

.cta-inner{min-height:720px;padding:72px 30px}
.cta-status{z-index:1;margin-bottom:25px;padding:9px 14px;border:1px solid rgba(255,255,255,.16);border-radius:999px;display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.08);font-size:11px;font-weight:700;letter-spacing:.03em}
.cta-status i{width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 5px rgba(207,255,78,.12)}
.waitlist-form{z-index:1;width:min(720px,100%);margin-top:28px;text-align:left}
.waitlist-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.waitlist-form label>span{display:block;margin:0 0 8px 3px;color:rgba(255,255,255,.76);font-size:11px;font-weight:650}
.waitlist-form label small{color:rgba(255,255,255,.46);font-weight:500}
.waitlist-form input[type="email"],.waitlist-form input[type="text"]{width:100%;height:58px;padding:0 18px;border:1px solid rgba(255,255,255,.17);border-radius:13px;outline:0;background:rgba(255,255,255,.1);color:white;font:inherit;font-size:14px;transition:border-color .2s,background .2s,box-shadow .2s}
.waitlist-form input::placeholder{color:rgba(255,255,255,.42)}
.waitlist-form input:focus{border-color:var(--lime);background:rgba(255,255,255,.14);box-shadow:0 0 0 4px rgba(207,255,78,.1)}
.waitlist-consent{display:flex;align-items:flex-start;gap:10px;margin:16px 3px 0;cursor:pointer}
.waitlist-consent input{width:17px;height:17px;margin-top:1px;accent-color:var(--lime)}
.waitlist-consent span{margin:0!important;font-size:11px!important;line-height:1.45}
.waitlist-form .button{width:100%;margin-top:18px;border:0;cursor:pointer}
.waitlist-form .button:disabled{opacity:.65;cursor:wait}
.waitlist-honey{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important}
.waitlist-message{min-height:20px;margin:12px 2px 0!important;color:rgba(255,255,255,.72)!important;text-align:center;font-size:12px!important}
.waitlist-message.is-success{color:var(--lime)!important;font-weight:700}
.waitlist-message.is-error{color:#ffb39d!important}
.launch-trust{z-index:1;display:flex;gap:20px;margin-top:4px;color:rgba(255,255,255,.58);font-size:10px}
.launch-trust span:before{content:"";width:6px;height:10px;margin-right:8px;display:inline-block;border:solid var(--lime);border-width:0 2px 2px 0;transform:rotate(45deg);vertical-align:1px}

@media(max-width:620px){
  .hero-trust{width:min(330px,calc(100% - 36px));padding:7px 16px;display:grid;gap:0;text-align:left}
  .hero-trust span{padding:9px 2px;border-right:0;border-bottom:1px solid rgba(23,23,19,.08)}
  .hero-trust span:last-child{border-bottom:0}
  .hero-fee{max-width:320px;line-height:1.5}
  .cta-inner{min-height:760px;padding:58px 20px}
  .waitlist-fields{grid-template-columns:1fr}
  .launch-trust{flex-wrap:wrap;justify-content:center;gap:8px 14px}
}

/* Touch layouts must not inherit the desktop card-hover dimming. */
@media(max-width:620px){
  .hero-product-flow:hover .hero-flow-step:not(:hover){opacity:0;visibility:hidden;pointer-events:none;transform:translateX(-50%) scale(.92)!important;filter:none}
  .hero-product-flow:hover .hero-flow-step.is-active,
  .hero-product-flow:hover .hero-flow-step.is-active:not(:hover),
  .hero-flow-step.is-active:hover{z-index:5!important;opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) scale(1)!important;filter:none}
}

/* Keep the complete showcase visible across desktop and tablet widths. */
@media(min-width:1051px){
  .product-stage{height:570px;padding:26px 42px 52px}
  .story-header{height:76px;margin-bottom:14px}
  .hero-product-flow{width:min(1000px,100%);height:410px;gap:clamp(20px,3vw,38px);align-items:center}
  .hero-flow-step,
  .hero-flow-step:nth-child(1),
  .hero-flow-step:nth-child(2),
  .hero-flow-step:nth-child(3){height:max-content;align-self:center;transform-origin:center center;transform:scale(.8);opacity:.78}
  .hero-flow-step.is-active,
  .hero-flow-step:hover,
  .hero-flow-step:nth-child(1):hover,
  .hero-flow-step:nth-child(3):hover{transform:scale(.9)!important;opacity:1}
  .hero-product-flow:hover .hero-flow-step:not(:hover){transform:scale(.76);opacity:.64}
}

@media(max-width:1050px) and (min-width:821px){
  .product-stage{height:545px;padding:20px 24px 43px}
  .story-header{width:min(650px,calc(100% - 24px));height:76px;margin:0 auto 14px;padding:11px 20px}
  .hero-product-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));position:relative;left:auto;width:100%;height:400px;margin:0;gap:18px;align-items:center;transform:none!important}
  .hero-flow-step,
  .hero-flow-step:nth-child(1),
  .hero-flow-step:nth-child(2),
  .hero-flow-step:nth-child(3){position:relative!important;inset:auto!important;width:auto;height:max-content;align-self:center;transform-origin:center center;transform:scale(.76)!important;opacity:.76;visibility:visible;pointer-events:auto;filter:saturate(.68) brightness(.95)}
  .hero-flow-step.is-active,
  .hero-flow-step:hover,
  .hero-flow-step:nth-child(1):hover,
  .hero-flow-step:nth-child(3):hover{z-index:5!important;transform:scale(.88)!important;opacity:1;filter:none}
  .hero-flow-step article{width:100%;height:430px}
  .hero-product-flow:hover .hero-flow-step:not(:hover){transform:scale(.72)!important;opacity:.62;visibility:visible;pointer-events:auto}
  .story-navigation{display:none}
}

@media(max-width:820px) and (min-width:621px){
  .product-stage{height:560px;padding:20px 26px 58px}
  .story-header{width:min(650px,calc(100% - 24px));height:76px;margin:0 auto 18px;padding:11px 20px}
  .hero-product-flow{display:block;position:relative;left:auto;width:100%;height:410px;margin:0;transform:none!important}
  .hero-flow-step,
  .hero-flow-step:nth-child(1),
  .hero-flow-step:nth-child(2),
  .hero-flow-step:nth-child(3){position:absolute!important;inset:0 auto auto 50%!important;width:340px;height:450px;opacity:0;visibility:hidden;pointer-events:none;transform-origin:top center;transform:translateX(-50%) scale(.82)!important;filter:none}
  .hero-flow-step.is-active,
  .hero-product-flow:hover .hero-flow-step.is-active,
  .hero-product-flow:hover .hero-flow-step.is-active:not(:hover),
  .hero-flow-step.is-active:hover{z-index:5!important;opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) scale(.88)!important;filter:none;box-shadow:none}
  .hero-flow-step article{width:100%;height:440px}
  .hero-flow-step.is-active article{box-shadow:0 24px 58px rgba(49,39,26,.16)}
  .hero-product-flow:hover .hero-flow-step:not(.is-active){opacity:0;visibility:hidden;pointer-events:none;transform:translateX(-50%) scale(.82)!important;filter:none}
  .story-navigation{position:absolute;z-index:30;left:20px;right:20px;bottom:18px;display:flex;align-items:center;justify-content:center}
  .story-dots{display:flex;align-items:center;justify-content:center;gap:8px}
  .story-dots button{width:18px;height:28px;padding:0;border:0;background:transparent;position:relative;cursor:pointer}
  .story-dots button:after{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:50%;background:rgba(23,23,19,.2);transform:translate(-50%,-50%);transition:width .2s ease,background .2s ease}
  .story-dots button.is-active{width:30px}
  .story-dots button.is-active:after{width:24px;border-radius:5px;background:var(--orange)}
}