@import url('assets/brand.css');
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;color:var(--color-carbon);background:var(--color-paper)}h1,h2,h3,p{margin-top:0}h1,h2,h3{letter-spacing:-.055em}a{color:inherit;text-decoration:none}button{cursor:pointer}.shell{width:min(100% - 80px,1280px);margin-inline:auto}
.skip{position:fixed;top:-90px;left:12px;background:white;padding:12px;z-index:100;border:var(--sticker-border)}.skip:focus{top:12px}
.nav{position:fixed;top:16px;left:24px;right:24px;z-index:80}.nav-inner{width:min(100%,1360px);height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:12px 20px;background:white;border:var(--sticker-border);border-radius:999px;box-shadow:0 3px 0 #111}.nav-links{display:flex;align-items:center;gap:24px;font-size:13px;font-weight:700}.nav-links a{padding-block:10px}.nav-links a:hover{text-decoration:underline;text-underline-offset:5px}.nav-cta{padding:14px 20px;background:var(--color-carbon);color:white;border-radius:999px;font-size:13px;font-weight:700;white-space:nowrap}.nav-cta span{margin-left:12px}.menu{display:none;border:0;padding:8px;background:transparent}.menu span{display:block;width:24px;height:2px;margin:5px 0;background:var(--color-carbon)}
.hero{background:var(--color-sky-wash);padding:120px 0 0;overflow:hidden}.hero-layout{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;min-height:640px;position:relative}.hero-copy{position:relative;z-index:3;padding:40px 0 56px}.kicker{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border:var(--sticker-border);border-radius:999px;background:var(--color-mint-pop);font-size:11px;font-weight:800;letter-spacing:.06em;transform:rotate(-3deg)}.beacon{display:none}.hero h1{font-family:var(--font-display);font-size:clamp(60px,6.9vw,104px);line-height:.92;letter-spacing:-.07em;font-weight:400;margin:28px 0}.hero h1 em{display:inline-block;font-style:normal;color:var(--color-carbon);position:relative}.hero h1 em::after{content:'';position:absolute;height:13px;left:0;right:0;bottom:-5px;background:var(--color-electric-blue);z-index:-1;border-radius:50%;transform:rotate(-2deg)}.hero-desc{color:var(--color-muted);font-size:17px;line-height:1.65;max-width:440px}.hero-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:56px;padding:16px 24px;border:var(--sticker-border);border-radius:999px;font-size:14px;font-weight:800;transition:transform .18s,box-shadow .18s}.btn:hover{transform:translateY(-3px);box-shadow:3px 4px 0 var(--color-carbon)}.btn:active{transform:translateY(1px);box-shadow:none}.btn-light,.btn-dark,.btn-burgundy{background:var(--color-carbon);color:white}.text-link{color:var(--color-carbon);padding-bottom:5px;border-bottom:1px solid;font-size:14px;font-weight:700}.text-link span{margin-left:10px}.hero-proof{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:30px;font-size:12px;font-weight:500;color:var(--color-muted)}.proof-check{width:22px;height:22px;display:grid;place-items:center;border:var(--sticker-border);border-radius:50%;background:var(--color-mint-pop);color:var(--color-carbon);font-weight:800}.hero-divider{width:1px;height:16px;background:#93a7bd;margin-inline:4px}
.hero-art{position:relative;display:grid;place-items:center;min-height:640px;min-width:0}.hero-ribbon{position:absolute;width:740px;max-width:none;left:50%;top:48%;transform:translate(-50%,-50%) rotate(-14deg);pointer-events:none}.hero-phone{width:272px;height:534px;border:7px solid var(--color-carbon);background:var(--color-carbon);border-radius:42px;transform:rotate(8deg);position:relative;z-index:2;box-shadow:12px 16px 0 #111}.phone-notch{position:absolute;z-index:5;background:var(--color-carbon);width:84px;height:20px;left:calc(50% - 42px);top:0;border-radius:0 0 14px 14px}.phone-content{display:flex;flex-direction:column;background:white;height:100%;border-radius:34px;overflow:hidden}.phone-head{display:flex;align-items:center;gap:10px;padding:36px 18px 16px;border-bottom:1px solid var(--color-line);font-size:12px;font-weight:800}.phone-head small{display:block;color:var(--color-muted);font-size:10px;font-weight:500;margin-top:3px}.restaurant-icon{width:34px;height:34px;display:grid;place-items:center;background:var(--color-lavender);border:var(--sticker-border);border-radius:12px}.phone-body{padding:24px 18px;text-align:center;flex:1}.phone-indicator{display:grid;place-items:center;margin:0 auto 18px}.phone-indicator img{width:66px;height:66px}.phone-body p{font-size:10px;font-weight:700;letter-spacing:.08em}.phone-body strong{font-family:var(--font-display);font-size:72px;letter-spacing:-.08em;line-height:1}.pbar{height:5px;border-radius:999px;background:var(--color-sky-wash);margin:18px 0}.pbar span{display:block;width:60%;height:100%;background:var(--color-electric-blue);border-radius:inherit}.phone-body h3{font-size:17px;line-height:1.35;margin-bottom:18px}.phone-green{background:var(--color-mint-pop);border:var(--sticker-border);border-radius:999px;padding:12px 8px;font-size:12px;font-weight:700}.phone-powered{text-align:center;margin-bottom:16px;font-size:10px}
.float-card{position:absolute;bottom:50px;right:-2%;z-index:5;background:var(--color-mint-pop);border:var(--sticker-border);border-radius:20px;box-shadow:var(--sticker-shadow);display:flex;align-items:center;gap:12px;padding:18px 20px;transform:rotate(-6deg)}.float-symbol{width:36px;height:36px;display:grid;place-items:center;background:white;border:var(--sticker-border);border-radius:50%;font-size:21px}.float-card b,.float-card span{display:block;font-size:13px}.float-card span{font-size:11px;margin-top:4px}.hero-sticker{position:absolute;z-index:4;top:50px;right:-4px;display:grid;place-items:center;width:116px;height:116px;background:var(--color-sunburst);border:var(--sticker-border);border-radius:50%;transform:rotate(12deg);font-family:var(--font-display);font-size:16px;line-height:1.1;text-align:center;box-shadow:3px 4px 0 var(--color-carbon)}
.hero-end{display:flex;align-items:center;justify-content:center;gap:40px;padding:25px 0;border-top:var(--sticker-border);font-size:12px;font-weight:700;letter-spacing:.02em}.hero-end .arrow-scroll{font-size:24px}
.section{padding:96px 0}.overline{display:none}.intro-head{max-width:760px;margin-bottom:40px}:is(.intro-head,.demo-heading,.flow,.industry-heading,.faq,.statement,.closing) h2{font-family:var(--font-display);font-size:clamp(36px,4.2vw,60px);line-height:1.04;font-weight:400;margin:0}.intro-head h2 span,.demo-heading h2 span{color:var(--color-carbon)}.intro-head p,.demo-heading p,.flow-top p{color:var(--color-muted);font-size:16px;line-height:1.65;max-width:560px;margin:22px 0 0}
.feature-grid{display:grid;grid-template-columns:1.14fr .93fr .93fr;gap:20px}.feature{border:var(--sticker-border);border-radius:var(--radius-card);padding:28px;min-height:430px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}.feature-tag{font-size:10px;font-weight:800;letter-spacing:.07em}.feature h3{font-size:24px;line-height:1.15;margin:0 0 12px;letter-spacing:-.045em}.feature p{font-size:14px;line-height:1.65;margin:0}.feature-large{background:var(--color-electric-blue)}.feature-burgundy{background:var(--color-lavender)}.feature-cream{background:var(--color-mint-pop)}.feature-graphic{flex:1;position:relative;display:grid;place-items:center;min-height:220px}.card-receipt{width:150px;padding:22px 16px;background:white;border:var(--sticker-border);border-radius:20px;text-align:center;font-size:10px;font-weight:700;transform:rotate(-8deg);box-shadow:5px 6px 0 #111}.card-receipt strong{display:block;font-family:var(--font-display);font-size:64px;margin:14px 0;letter-spacing:-.08em}.card-receipt span{font-size:9px}.curve-mark{position:absolute;right:8%;font-size:78px;font-weight:800;transform:rotate(10deg)}.signal-visual{height:230px;display:grid;place-items:center;position:relative}.signal-visual div{color:var(--color-voltage-violet);font-size:120px;text-shadow:3px 3px 0 #111}.signal-visual span{width:112px;height:112px;position:absolute;border:1.5px solid #9274aa;border-radius:50%}.signal-visual span:nth-child(2){width:160px;height:160px}.signal-visual span:nth-child(3){width:208px;height:208px}.simple-screen{width:85%;margin:24px auto;padding:24px;display:flex;flex-direction:column;align-items:center;gap:12px;background:white;border:var(--sticker-border);border-radius:22px;transform:rotate(5deg);box-shadow:4px 5px 0 #111}.simple-screen b{font-family:var(--font-display);font-size:56px;letter-spacing:-.07em}.simple-screen span{font-size:11px}.simple-screen button{border:0;border-radius:999px;padding:12px 14px;background:var(--color-carbon);color:white;font-size:10px}
.flow{background:var(--color-lavender);border-block:var(--sticker-border)}.flow-top{margin-bottom:40px}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.step{padding:22px;border:var(--sticker-border);border-radius:24px;background:white;min-height:270px}.step:nth-child(2){background:var(--color-sky-wash)}.step:nth-child(3){background:var(--color-mint-pop)}.step:nth-child(4){background:var(--color-electric-blue)}.step-number{font-size:12px;font-weight:700}.step-mark{font-family:var(--font-display);font-size:56px;height:100px;display:flex;align-items:center}.step h3{font-size:20px;margin-bottom:12px}.step p{font-size:13px;line-height:1.65;margin:0}
.demo{background:white}.demo-heading{max-width:820px;margin-bottom:36px}
/* Keep original simulation event targets; live-test.js mounts the two-device test before them. */
.demo-workspace,.demo-warning,.qr-preview{display:none}
.industries{background:var(--color-sky-wash)}.industry-heading{margin-bottom:40px}.industry-heading em,.statement h2 em{font-style:normal}.industry-list{display:grid;gap:12px}.industry{display:grid;grid-template-columns:48px 1fr 1fr 24px;align-items:center;gap:20px;padding:25px 28px;background:white;border:var(--sticker-border);border-radius:20px}.industry:nth-child(2){background:var(--color-lavender)}.industry:nth-child(3){background:var(--color-mint-wash)}.industry:nth-child(4){background:var(--color-electric-blue)}.industry span:first-child{font-size:12px}.industry b{font-size:clamp(18px,2vw,26px);letter-spacing:-.04em}.industry span:nth-child(3){font-size:14px}.industry i{font-size:25px;font-style:normal}
.statement{background:var(--color-mint-wash);border-block:var(--sticker-border);text-align:center}.statement-inner{display:flex;flex-direction:column;align-items:center}.statement-emblem img{width:80px;height:80px;margin-bottom:28px;transform:rotate(-8deg)}.statement p{max-width:520px;font-size:16px;line-height:1.65;margin:25px auto 30px;color:var(--color-muted)}.mobile-test-promo{display:none}
.faq-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:72px;align-items:start}.faq-items{display:grid;gap:12px}.faq-items details{background:white;border:var(--sticker-border);border-radius:20px;overflow:hidden}.faq-items details[open]{background:var(--color-sky-wash)}.faq-items summary{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px;font-size:15px;font-weight:700;list-style:none;cursor:pointer}.faq-items summary::-webkit-details-marker{display:none}.faq-items summary span{font-size:24px;flex-shrink:0}.faq-items details[open] summary span{transform:rotate(45deg)}.faq-items p{font-size:14px;line-height:1.7;padding:0 22px 22px;margin:0;color:var(--color-muted)}
.closing{background:var(--color-electric-blue);padding:64px 0;border-block:var(--sticker-border)}.closing-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}.footer{background:var(--color-sky-wash);padding:60px 0 24px}.footer-upper{display:grid;grid-template-columns:2fr 1fr 1.3fr;gap:48px;padding-bottom:48px}.footer-upper p{margin-top:20px;line-height:1.7;color:var(--color-muted);font-size:13px}.footer-upper h3{font-size:14px;letter-spacing:0;margin-bottom:20px}.footer-upper a:not(.brand),.footer-upper>div>span{display:block;font-size:13px;margin:0 0 14px;color:var(--color-muted);line-height:1.5}.footer-upper a:not(.brand):hover{text-decoration:underline}.footer-lower{border-top:1px solid #9bafc3;padding-top:22px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;color:var(--color-muted);font-size:11px}
.reveal{opacity:0;transform:translateY(20px);transition:opacity .45s ease,transform .45s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:1100px){.nav-links{gap:14px;font-size:12px}.nav-inner{gap:16px}.nav-cta{padding:13px 16px}.hero h1{font-size:clamp(56px,7vw,90px)}.hero-ribbon{width:620px}.hero-phone{transform:rotate(8deg) scale(.9)}.hero-sticker{right:0;width:100px;height:100px;font-size:14px}.feature{padding:22px}.feature h3{font-size:21px}.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.shell{width:min(100% - 40px,1280px)}.nav{left:16px;right:16px;top:12px}.nav-inner{width:100%;height:68px}.nav-links{display:none;position:absolute;top:78px;left:0;right:0;padding:20px;flex-direction:column;align-items:stretch;gap:8px;background:white;border:var(--sticker-border);border-radius:24px;box-shadow:var(--sticker-shadow)}.nav-links.open{display:flex}.menu{display:block}.nav-cta{margin-left:auto}.hero-layout{grid-template-columns:1fr 1fr;min-height:590px}.hero-copy{padding:36px 0}.hero h1{font-size:58px}.hero-art{min-height:590px}.hero-phone{transform:rotate(8deg) scale(.8)}.hero-sticker{top:45px}.hero-desc{font-size:15px}.hero-actions{gap:18px}.float-card{right:-10px;padding:14px;bottom:55px}.feature-grid{grid-template-columns:1fr 1fr}.feature-large{grid-column:span 2;min-height:330px;flex-direction:row;gap:28px;flex-wrap:wrap}.feature-large .feature-tag{width:100%}.feature-large .feature-graphic{flex:1}.feature-large>div:last-child{flex:1;align-self:center}.faq-layout{gap:32px}}
@media(max-width:640px){html{scroll-padding-top:100px}.shell{width:calc(100% - 32px)}.nav-inner{padding:10px 14px}.brand{font-size:23px;gap:7px}.brand img{width:38px;height:38px}.nav-cta{display:none}.hero{padding-top:100px}.hero-layout{display:flex;flex-direction:column;align-items:stretch}.hero-copy{padding:28px 0 0}.hero h1{font-size:clamp(52px,11.5vw,74px);margin:24px 0}.hero-desc{max-width:410px;font-size:16px}.hero-proof{gap:8px;font-size:11px;margin-top:22px}.hero-divider{margin:0}.hero-art{min-height:570px;margin-top:0}.hero-ribbon{width:650px}.hero-phone{transform:rotate(8deg) scale(.85)}.hero-sticker{right:0;top:45px;width:96px;height:96px}.float-card{right:5px;bottom:45px}.hero-end{gap:20px;padding:20px 0;font-size:10px}.hero-end span:last-child{display:none}.section{padding:64px 0}.intro-head{margin-bottom:28px}.feature-grid{grid-template-columns:1fr;gap:16px}.feature-large{grid-column:auto;flex-direction:column}.feature-large>div:last-child{align-self:stretch}.feature{min-height:410px;padding:24px}.feature-graphic{width:100%}.feature h3{font-size:24px}.steps{gap:12px}.step{padding:18px;min-height:250px}.step h3{font-size:18px}.step-mark{font-size:48px;height:88px}.industry{grid-template-columns:24px 1fr 24px;gap:12px;padding:22px 18px}.industry span:nth-child(3){grid-column:2;grid-row:2;font-size:12px}.industry i{grid-column:3;grid-row:1}.industry b{font-size:20px}.faq-layout{grid-template-columns:1fr}.faq-items summary{padding:20px}.closing-inner{flex-direction:column;align-items:start}.footer-upper{grid-template-columns:1fr 1fr;gap:28px}.footer-upper>div:first-child{grid-column:1/-1}}
@media(max-width:360px){.hero h1{font-size:49px}.hero-proof{font-size:10px}.hero-phone{transform:rotate(8deg) scale(.78)}.hero-art{min-height:530px}.hero-sticker{width:82px;height:82px;font-size:12px}.steps{grid-template-columns:1fr}.step{min-height:220px}}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}}

/* Reference-led hero: centered type first, product shown in its own section. */
.hero{padding:118px 0 44px}
.hero-layout{display:block;min-height:0}
.hero-copy{padding:0;max-width:860px;text-align:center;margin:auto}
.hero h1{display:flex;flex-direction:column;align-items:center;font-size:clamp(64px,7.8vw,112px);line-height:.87;letter-spacing:-.065em;margin:18px 0 28px}
.puffy-title span,.puffy-title em{display:block;position:relative;color:#111;font-style:normal;-webkit-text-stroke:7px white;paint-order:stroke fill;text-shadow:0 3px 0 #060606,0 5px 0 #222,0 8px 0 #111,0 12px 0 white,0 14px 3px #7188a238}
.hero .puffy-title em{color:#288cf5;text-shadow:0 3px 0 #1675df,0 5px 0 #0866ce,0 8px 0 #0654af,0 12px 0 white,0 14px 3px #7188a238;margin-top:8px}
.hero h1 em::after{display:none}
.hero-desc{max-width:510px;margin:32px auto 0;color:var(--color-carbon);font-size:16px;line-height:1.55}
.hero-actions{justify-content:center;margin-top:24px}
.hero-proof{justify-content:center;margin-top:24px;color:var(--color-carbon)}
.hero-end{display:none}
.product-showcase{overflow:hidden;background:#ecf6ff;border-radius:50% 50% 0 0 / 40px 40px 0 0;border-bottom:1px solid var(--color-line)}
.product-showcase .hero-art{min-height:610px;max-width:780px;margin:auto}
.product-showcase .hero-ribbon{width:730px;height:auto;top:50%;transform:translate(-50%,-50%) rotate(-14deg)}
.product-showcase .hero-phone{transform:rotate(-8deg);box-shadow:8px 10px 0 #111}
.product-showcase .float-card{right:10%;bottom:auto;top:90px;transform:rotate(3deg)}
.feature-tag{display:none}
@media(max-width:900px){.hero{padding-top:108px}.hero h1{font-size:92px}.hero-copy{padding:0}.product-showcase .hero-art{min-height:590px}}
@media(max-width:640px){.hero{padding:100px 0 36px}.hero h1{font-size:clamp(52px,12.5vw,78px);line-height:.9;margin:24px 0}.puffy-title span,.puffy-title em{-webkit-text-stroke-width:5px}.hero-desc{font-size:15px;max-width:420px;margin-top:28px}.hero-actions{gap:18px}.hero-proof{font-size:10px;gap:7px}.product-showcase .hero-art{min-height:550px}.product-showcase .hero-phone{transform:rotate(-8deg) scale(.84)}.product-showcase .hero-ribbon{width:590px}.product-showcase .float-card{right:0;top:auto;bottom:48px;padding:15px}.intro-head h2{font-size:clamp(29px,7.5vw,45px)}}
@media(max-width:360px){.hero h1{font-size:53px}.hero-proof{font-size:10px;gap:6px}.product-showcase .hero-art{min-height:520px}.product-showcase .hero-phone{transform:rotate(-8deg) scale(.78)}.product-showcase .float-card{padding:12px;font-size:12px}.intro-head h2{font-size:29px}}
/* Retain the header's pill design; animate only the surface and content. */
.nav.motion-ready .nav-inner{position:relative;background:transparent;border:0;box-shadow:none}
.nav-surface{position:absolute;inset:0;border:var(--sticker-border);border-radius:999px;background:white;box-shadow:0 3px 0 #111;transform-origin:center;z-index:-1;pointer-events:none}
.nav.nav-collapsed .nav-inner{width:60px;height:60px;padding:0;justify-content:center}
.nav.nav-collapsed .nav-inner>:not(.nav-surface):not(.nav-reopen){display:none}
.nav-reopen{width:60px;height:60px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;cursor:pointer;padding:0;transition:transform .18s cubic-bezier(.34,1.56,.64,1)}
.nav-reopen:hover{transform:scale(1.1)}.nav-reopen:active{transform:scale(.95)}
.nav-reopen img{width:26px;height:26px}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
.hero h1{display:block;margin:10px auto 18px;width:min(100%,800px);font-size:inherit;line-height:1}
.puffy-title>img{display:block;width:100%;height:auto}
.hero-desc{margin-top:8px}
@media(max-width:640px){.hero h1{width:100%;margin:18px auto 24px}.hero-desc{margin-top:0}}
/* One continuous canvas from the headline into the product illustration. */
.hero{padding-bottom:24px}
.product-showcase{background:var(--color-sky-wash);border-radius:0;border-bottom:0;padding-top:64px}
@media(max-width:640px){.hero{padding-bottom:20px}.product-showcase{padding-top:32px}}
/* Keep the complete ribbon inside its section and continue the canvas below it. */
.product-showcase{padding-bottom:88px}
.intro{background:var(--color-sky-wash);padding-top:48px}
@media(max-width:640px){.product-showcase{padding-bottom:56px}.intro{padding-top:32px}}
.waiting-ticket-image{display:block;width:auto;height:280px;max-width:100%;object-fit:contain;margin:14px auto 22px;transform:rotate(-4deg)}
.feature-large .feature-graphic{min-height:310px}
@media(max-width:900px) and (min-width:641px){.waiting-ticket-image{height:260px}.feature-large .feature-graphic{min-height:290px}}
@media(max-width:640px){.waiting-ticket-image{height:300px;margin:10px auto 24px}.feature-large .feature-graphic{min-height:330px}}
.puffy-title>img{transform-origin:center 65%;animation:piqo-type-inflate .9s .12s cubic-bezier(.16,1,.3,1) both}
@keyframes piqo-type-inflate{0%{transform:scale(.82,.68);opacity:0}20%{opacity:1}65%{transform:scale(1.025,1.04)}84%{transform:scale(.994,.985)}100%{transform:scale(1);opacity:1}}
@media(prefers-reduced-motion:reduce){.puffy-title>img{animation:none!important;transform:none!important}}
/* Give rotated artwork enough room above and below its actual painted bounds. */
.product-showcase{padding-block:112px}
.product-showcase .hero-ribbon{width:640px}
@media(max-width:640px){.product-showcase .hero-ribbon{width:590px}.product-showcase{padding-block:112px}}
/* Each heading word flies upward once, with a short stagger. */
.word-clip{display:inline-block;overflow:clip;vertical-align:top;padding-bottom:.14em;margin-bottom:-.14em;line-height:inherit}
.word-motion{display:inline-block;opacity:0;transform:translate3d(0,110%,0);transition:opacity .35s ease,transform .65s cubic-bezier(.16,1,.3,1);transition-delay:var(--word-delay,0ms)}
.words-visible .word-motion{opacity:1;transform:translate3d(0,0,0)}
.reveal.reveal-words{opacity:1;transform:none;transition:none}
@media(prefers-reduced-motion:reduce){.word-motion{opacity:1!important;transform:none!important;transition:none!important}}

/* Replace the six local files in assets/card-images to swap these examples. */
.card-image{width:100%;aspect-ratio:1.55;overflow:hidden;border-radius:18px;margin:16px 0 30px;border:var(--sticker-border)}
.card-photo{display:block;width:100%;height:100%;object-fit:cover}
.feature-burgundy,.feature-cream{justify-content:flex-start}.feature-burgundy>div:last-child,.feature-cream>div:last-child{margin-top:auto}
.step-image{aspect-ratio:1.55;width:100%;overflow:hidden;border-radius:14px;margin:20px 0 22px;border:var(--sticker-border)}
.step{min-width:0}.step-number{display:inline-block}.step h3{line-height:1.2}
.piqo-loop{position:relative;background:var(--color-carbon);padding:22px 0;overflow:hidden;border-block:var(--sticker-border)}
.piqo-loop-window{display:grid;gap:9px;overflow:hidden}
.piqo-loop-track{display:flex;width:max-content;will-change:transform;animation:piqo-loop-left 28s linear infinite}
.piqo-loop-group{display:flex;gap:9px;padding-right:9px;flex-shrink:0}
.piqo-loop-tile{display:block;width:300px;text-align:center;border-radius:8px;padding:8px 18px 4px;color:var(--color-carbon);font-family:Impact,'Arial Narrow',sans-serif;font-weight:900;font-style:italic;font-size:96px;line-height:1;letter-spacing:-.045em}
.loop-orange{background:#ff6314}.loop-blue{background:var(--color-electric-blue)}.loop-white{background:white}.loop-yellow{background:var(--color-sunburst)}.loop-mint{background:var(--color-mint-pop)}.loop-lavender{background:var(--color-lavender)}
.loop-right{animation-direction:reverse}.loop-left{margin-left:-110px}
@keyframes piqo-loop-left{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(max-width:640px){.card-image{aspect-ratio:1.5;margin:14px 0 28px}.steps{grid-template-columns:1fr}.step{padding:22px}.step-image{aspect-ratio:1.8;margin-block:16px 22px}.step h3{font-size:22px}.step p{font-size:15px}.piqo-loop-tile{width:220px;font-size:76px}.piqo-loop{padding-top:14px}.piqo-loop-window,.piqo-loop-group{gap:7px}.piqo-loop-group{padding-right:7px}}
@media(prefers-reduced-motion:reduce){.piqo-loop-track{animation:none!important;will-change:auto}.loop-right{transform:translateX(-90px)}.piqo-loop{padding-bottom:22px}}

.piqo-loop-track{animation-duration:48s}
@media(min-width:2400px){.piqo-loop-tile{width:25vw}}
/* Compact header lockup; keep the symbol's existing inflation animation. */
.nav .brand{gap:8px}
.nav .brand>img.brand-symbol{width:34px;height:34px;border-radius:0}
.nav .brand>img.brand-wordmark{width:82px;height:33px}
@media(max-width:640px){.nav .brand>img.brand-symbol{width:30px;height:30px}.nav .brand>img.brand-wordmark{width:75px;height:30px}}
/* Four alternating story rows: photo left/right, generously sized descriptions. */
.flow .steps{grid-template-columns:minmax(0,1fr);gap:24px}
.flow .step{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:24px;padding:16px;min-height:0;border-radius:28px}
.flow .step-image{margin:0;aspect-ratio:1.55;min-height:300px;border-radius:18px;order:0}
.flow .step-copy{padding:28px 32px;order:1}
.flow .step:nth-child(even) .step-image{order:2}
.flow .step-number{font-size:12px;letter-spacing:.09em;font-weight:800;margin-bottom:24px}
.flow .step h3{font-size:clamp(30px,3.4vw,46px);line-height:1.08;letter-spacing:-.05em;margin-bottom:20px}
.flow .step p{font-size:clamp(17px,1.6vw,20px);line-height:1.65;max-width:34ch}
@media(max-width:900px){.flow .step{gap:8px}.flow .step-copy{padding:20px}.flow .step-image{min-height:280px}.flow .step h3{font-size:34px}}
@media(max-width:640px){.flow .step{grid-template-columns:minmax(0,1fr);gap:0;padding:12px;border-radius:24px}.flow .step-image,.flow .step:nth-child(even) .step-image{order:0;min-height:0;aspect-ratio:1.5;border-radius:15px}.flow .step-copy{order:1;padding:26px 12px 14px}.flow .step-number{margin-bottom:16px;font-size:11px}.flow .step h3{font-size:32px;margin-bottom:14px}.flow .step p{font-size:17px;max-width:none;margin:0}}
/* Open alternating layout, following the supplied reference without card frames. */
.flow{background:var(--color-paper-white);border:0}
.flow .steps{gap:88px}
.flow .step{background:transparent;border:0;border-radius:0;padding:0;gap:64px}
.flow .step-image{border:0;border-radius:18px;min-height:360px;aspect-ratio:1.35}
.flow .step-copy{padding:24px 0}
.flow .step h3{font-family:var(--font-display);font-weight:400;font-size:clamp(36px,4.1vw,58px);line-height:1.02;letter-spacing:-.055em;text-transform:uppercase;margin-bottom:28px}
.flow .step p{font-size:20px;line-height:1.6}
.nav .brand{gap:6px}
.nav .brand>img.brand-symbol{width:24px;height:24px}
.nav .brand>img.brand-wordmark{width:60px;height:24px}
@media(max-width:900px){.flow .step{gap:36px}.flow .step-image{min-height:300px}.flow .step h3{font-size:40px}.flow .step p{font-size:18px}}
@media(max-width:640px){.flow .steps{gap:56px}.flow .step{gap:0}.flow .step-image,.flow .step:nth-child(even) .step-image{aspect-ratio:1.4;min-height:0;border-radius:16px}.flow .step-copy{padding:24px 0 0}.flow .step h3{font-size:36px;margin-bottom:18px}.flow .step p{font-size:18px}.nav .brand>img.brand-symbol{width:22px;height:22px}.nav .brand>img.brand-wordmark{width:55px;height:22px}}
/* Distinct page sections, with narrow dark gutters like the supplied reference. */
body{background:var(--color-carbon)}
#main{padding:12px 12px 0}
.landing-opening,#main>section{border-radius:28px;overflow:clip;margin-bottom:8px;isolation:isolate}
#main>section{border:0}
.footer{margin:0 12px 12px;border-radius:28px;overflow:hidden}
@media(max-width:640px){#main{padding:8px 8px 0}.landing-opening,#main>section{border-radius:20px;margin-bottom:6px}.footer{margin:0 8px 8px;border-radius:20px}}
