.como-funciona-container{width:100%;max-width:1100px;font-family:var(--font);margin:0 auto;padding:40px 24px 100px}.how-hero{text-align:center;max-width:780px;margin:0 auto;padding:60px 0 80px}.how-hero h1{letter-spacing:-.03em;color:var(--ink);margin-bottom:20px;font-size:48px;font-weight:700;line-height:1.15}.how-hero p{color:var(--ink-soft);margin-bottom:32px;font-size:19px;line-height:1.6}.timeline{flex-direction:column;gap:100px;display:flex;position:relative}.timeline:before{content:"";background:var(--line);z-index:1;width:2px;position:absolute;top:100px;bottom:100px;left:50%;transform:translate(-50%)}.step-row{z-index:2;align-items:center;gap:60px;display:flex;position:relative}.step-row:nth-child(2n){flex-direction:row-reverse}.step-content{flex-direction:column;flex:1;gap:16px;display:flex}.step-badge{font-family:var(--mono);color:var(--accent);background:var(--accent-bg);border:1px solid var(--accent-line);text-transform:uppercase;letter-spacing:.05em;border-radius:99px;justify-content:center;align-items:center;width:fit-content;padding:4px 12px;font-size:14px;font-weight:700;display:inline-flex}.step-title{letter-spacing:-.02em;color:var(--ink);font-size:32px;font-weight:700;line-height:1.2}.step-desc{color:var(--ink-soft);font-size:16.5px;line-height:1.6}.step-features{flex-direction:column;gap:10px;margin-top:10px;display:flex}.step-feature-item{color:var(--ink);align-items:flex-start;gap:10px;font-size:15px;display:flex}.step-feature-item svg{color:var(--accent);flex-shrink:0;margin-top:3px}.step-visual{background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r-card);min-height:340px;box-shadow:var(--shadow-md);flex:1;justify-content:center;align-items:center;padding:30px;transition:border-color .2s,box-shadow .2s;display:flex;position:relative;overflow:hidden}.step-visual:hover{border-color:var(--ink-faint);box-shadow:var(--shadow-lg)}.step-node{background:var(--surface);border:4px solid var(--line-strong);width:44px;height:44px;color:var(--ink-soft);z-index:10;border-radius:99px;justify-content:center;align-items:center;font-weight:700;transition:all .25s;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.step-row:hover .step-node{border-color:var(--accent);color:var(--accent);box-shadow:0 0 15px var(--accent-bg);transform:translate(-50%,-50%)scale(1.1)}.mock-map{background:var(--map-water);width:100%;height:100%;position:absolute;overflow:hidden}.mock-land{background-image:radial-gradient(var(--map-land) 60%, transparent 60%);background-size:180px 180px;background-color:var(--map-water);width:140%;height:140%;position:absolute;top:-20%;left:-20%}.mock-roads{width:100%;height:100%;position:absolute;top:0;left:0}.mock-road{background:var(--map-street);border:1px solid var(--map-street-border);position:absolute}.mock-road.h1{width:100%;height:18px;top:30%;left:0}.mock-road.h2{width:100%;height:18px;top:70%;left:0}.mock-road.v1{width:18px;height:100%;top:0;left:35%}.mock-road.v2{width:18px;height:100%;top:0;left:75%}.mock-hotzone{background:color-mix(in oklch, var(--accent) 15%, transparent);border:2px dashed var(--accent);border-radius:99px;justify-content:center;align-items:center;width:120px;height:120px;display:flex;position:absolute;top:50%;left:55%;transform:translate(-50%,-50%)}.mock-hotzone-pulse{border:2px solid var(--accent);opacity:0;border-radius:99px;width:100%;height:100%;animation:3s linear infinite radar-pulse;position:absolute}.mock-marker{color:var(--dont);filter:drop-shadow(var(--shadow-md));animation:2.5s ease-in-out infinite float-marker;position:absolute;top:50%;left:55%;transform:translate(-50%,-100%)}.mock-album{flex-direction:column;gap:16px;width:100%;display:flex}.mock-album-header{justify-content:space-between;align-items:center;display:flex}.mock-album-progress-bar{background:var(--line);border-radius:4px;width:100%;height:8px;margin-top:4px;overflow:hidden}.mock-album-progress-fill{background:var(--have);height:100%;transition:width .4s cubic-bezier(.16,1,.3,1)}.mock-album-grid{grid-template-columns:repeat(4,1fr);gap:12px;display:grid}.mock-sticker{aspect-ratio:1;border-radius:var(--r-sq);border:1px solid var(--line);cursor:pointer;-webkit-user-select:none;user-select:none;flex-direction:column;justify-content:center;align-items:center;font-size:16px;font-weight:700;transition:all .2s cubic-bezier(.16,1,.3,1);display:flex;position:relative}.mock-sticker.missing{background:var(--bg);color:var(--ink-faint);border-style:dashed}.mock-sticker.have{background:var(--have-bg);border-color:var(--have-line);color:var(--have)}.mock-sticker.repeated{background:var(--trade-bg);border-color:var(--trade);color:var(--trade)}.mock-sticker-badge{background:var(--trade);color:#fff;font-size:9.5px;font-family:var(--mono);width:16px;height:16px;box-shadow:var(--shadow-sm);border-radius:99px;justify-content:center;align-items:center;font-weight:700;display:flex;position:absolute;top:-4px;right:-4px}.mock-comparison{flex-direction:column;gap:16px;width:100%;display:flex}.mock-comparison-players{justify-content:space-between;align-items:center;display:flex}.mock-comparison-user-card{background:var(--bg-tint);border-radius:12px;flex:1;align-items:center;gap:10px;max-width:44%;padding:8px 14px;display:flex}.mock-comparison-divider{color:var(--ink-faint);font-weight:700}.mock-comparison-list{flex-direction:column;gap:10px;display:flex}.mock-comparison-row{background:var(--surface);border:1px solid var(--line);border-radius:12px;justify-content:space-between;align-items:center;padding:10px 14px;font-size:13.5px;transition:all .3s;display:flex}.mock-comparison-row.trade-in{border-color:var(--have-line);background:var(--have-bg);animation:4s ease-in-out infinite comparison-pulse-have}.mock-comparison-row.trade-out{border-color:var(--trade);background:var(--trade-bg);animation:4s ease-in-out infinite comparison-pulse-trade}.mock-radar{background:var(--surface);border-radius:var(--r-card);width:100%;height:100%;position:absolute;overflow:hidden}.mock-radar-grid{background-image:linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px);opacity:.5;background-position:50%;background-size:40px 40px;position:absolute;inset:0}.mock-radar-sweep{background:conic-gradient(from 0deg, var(--accent) 0deg, transparent 90deg, transparent 360deg);transform-origin:50%;opacity:.12;pointer-events:none;width:150%;height:150%;animation:6s linear infinite radar-sweep;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.mock-radar-avatar{cursor:pointer;transition:transform .3s;position:absolute;transform:translate(-50%,-50%)}.mock-radar-avatar:hover{z-index:10;transform:translate(-50%,-50%)scale(1.15)}.mock-radar-avatar.center{top:50%;left:50%}.mock-radar-avatar.p1{animation:3s ease-in-out infinite float-slow;top:30%;left:25%}.mock-radar-avatar.p2{animation:3.5s ease-in-out .5s infinite float-slow;top:25%;left:78%}.mock-radar-avatar.p3{animation:4s ease-in-out 1s infinite float-slow;top:75%;left:35%}.mock-radar-avatar.p4{animation:3.2s ease-in-out 1.5s infinite float-slow;top:70%;left:70%}.mock-radar-indicator{background:var(--bg-tint);border:1px solid var(--line);font-size:11px;font-family:var(--mono);color:var(--ink-soft);border-radius:8px;align-items:center;gap:6px;padding:4px 8px;display:flex;position:absolute;bottom:12px;left:12px}.mock-radar-indicator:before{content:"";background:var(--have);border-radius:99px;width:6px;height:6px;animation:1.5s step-end infinite blink;display:block}.mock-chat{flex-direction:column;gap:12px;width:100%;display:flex}.mock-chat-bubble{max-width:80%;box-shadow:var(--shadow-sm);border-radius:16px;padding:10px 14px;font-size:14px;line-height:1.4;animation:.4s cubic-bezier(.16,1,.3,1) both slide-in-bubble}.mock-chat-bubble.in{background:var(--bg-tint);color:var(--ink);border-bottom-left-radius:4px;align-self:flex-start}.mock-chat-bubble.out{background:var(--accent);color:var(--primary-ink);border-bottom-right-radius:4px;align-self:flex-end}.mock-chat-bubble.b1{animation-delay:.2s}.mock-chat-bubble.b2{animation-delay:2.2s}.mock-chat-bubble.b3{animation-delay:4.2s}.how-cta{text-align:center;background:var(--bg-tint);border:1px solid var(--line);border-radius:var(--r-card);margin-top:80px;padding:50px 40px}.how-cta h2{color:var(--ink);letter-spacing:-.02em;margin-bottom:12px;font-size:32px;font-weight:700}.how-cta p{color:var(--ink-soft);max-width:540px;margin-bottom:24px;margin-left:auto;margin-right:auto;font-size:16.5px}.how-cta-buttons{justify-content:center;gap:14px;display:flex}@keyframes radar-pulse{0%{opacity:.8;transform:scale(.3)}to{opacity:0;transform:scale(1)}}@keyframes float-marker{0%{transform:translate(-50%,-100%)}50%{transform:translate(-50%,-115%)}to{transform:translate(-50%,-100%)}}@keyframes float-slow{0%{transform:translate(-50%,-50%)translateY(0)}50%{transform:translate(-50%,-50%)translateY(-6px)}to{transform:translate(-50%,-50%)translateY(0)}}@keyframes radar-sweep{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(-50%,-50%)rotate(360deg)}}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}@keyframes slide-in-bubble{0%{opacity:0;transform:translateY(10px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes comparison-pulse-have{0%,to{border-color:var(--have-line);box-shadow:none;transform:scale(1)}50%{border-color:var(--have);box-shadow:var(--shadow-sm);transform:scale(1.02)}}@keyframes comparison-pulse-trade{0%,to{border-color:var(--line);box-shadow:none;transform:scale(1)}50%{border-color:var(--trade);box-shadow:var(--shadow-sm);transform:scale(1.02)}}@media (max-width:900px){.how-hero h1{font-size:38px}.timeline:before{left:20px;transform:none}.step-row{align-items:stretch;gap:30px;padding-left:50px;flex-direction:column!important}.step-node{top:30px;left:20px;transform:translate(-50%)}.step-row:hover .step-node{transform:translate(-50%)scale(1.1)}}header.nav{z-index:40;background:color-mix(in oklch, var(--bg) 82%, transparent);-webkit-backdrop-filter:saturate(1.4)blur(12px);backdrop-filter:saturate(1.4)blur(12px);border-bottom:1px solid var(--line);position:sticky;top:0}header.nav .inner{justify-content:space-between;align-items:center;gap:18px;height:66px;display:flex}.wrap{max-width:1160px;margin:0 auto;padding:0 32px}.nav-actions{align-items:center;gap:10px;display:flex}