.how{overflow-x:clip}.how .site-section-head{text-align:center;flex-direction:column;align-items:center}.how .site-section-aside{max-width:46ch}.how-lead{font-size:var(--type-lead-size);line-height:var(--type-lead-lh);margin:0}.how-stage{--how-card-pad:10px;--how-pin-size:30px;--how-pin-gap:4px;--how-pin-y:calc(var(--how-card-pad) + var(--how-pin-gap) + var(--how-pin-size) / 2);max-width:1000px;margin-inline:auto;position:relative}.how-line{z-index:0;pointer-events:none;fill:none;stroke-linecap:round;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.how-line-track{stroke:var(--tn-surface-lavender);stroke-width:3px}.how-line-draw{stroke:var(--tn-violet-700);stroke-width:4px}.how-steps{z-index:1;gap:64px;margin:0;padding:0;list-style:none;display:grid;position:relative}.how-step{--how-tilt:-1.5deg;--how-tint:var(--tn-surface-lavender);--how-pin-color:var(--tn-violet-700);width:min(340px,100%);transform:rotate(var(--how-tilt));transform-origin:50% var(--how-pin-y);justify-self:center}.how-step:nth-child(2n){--how-tilt:1.5deg}.how-step:nth-child(3n+2){--how-tint:var(--tn-surface-sage);--how-pin-color:color-mix(in oklab, var(--tn-accent-sage), black 40%)}.how-step:nth-child(3n){--how-tint:var(--tn-surface-peach);--how-pin-color:color-mix(in oklab, var(--tn-accent-peach), black 40%)}.how-card{padding:var(--how-card-pad);border-radius:var(--radius-card-lg);background:var(--tn-surface-card);box-shadow:var(--shadow-3);position:relative}.how-pin{width:var(--how-pin-size);height:var(--how-pin-size);margin:var(--how-pin-gap) auto 10px;color:var(--how-pin-color);display:block}.how-inner{border-radius:var(--radius-bubble);background:var(--how-tint);padding:18px 18px 20px}.how-num{font:700 44px/1 var(--font-display);color:var(--tn-violet-800);display:block}.how-step-title{font:800 var(--type-h4-size)/var(--type-h4-lh) var(--font-sans);margin:8px 0 6px}.how-step-text{color:var(--muted-foreground);margin:0 0 14px}.how-visual{aspect-ratio:4/3;border-radius:var(--radius-card);background:var(--tn-surface-card);position:relative;overflow:hidden}@media (min-width:768px){.how-steps{gap:96px}.how-step{--how-tilt:-2deg;width:min(400px,92%);transition:transform var(--dur-base) var(--ease-out);justify-self:start}.how-step:nth-child(2n){--how-tilt:2deg;justify-self:end}}@media (min-width:768px) and (hover:hover) and (pointer:fine){.how-step:hover{--how-tilt:0deg}}.how-anim{background:color-mix(in oklab, var(--how-tint) 40%, var(--tn-surface-card));position:absolute;inset:0;overflow:hidden}.how-anim p,.how-anim ul{margin:0}.how-chat{background:var(--tn-surface-card);flex-direction:column;justify-content:flex-end;gap:6px;padding:12px;display:flex}.how-bubble{max-width:82%;font:500 13px/1.35 var(--font-sans);border-radius:14px;flex-shrink:0;padding:7px 11px}.how-bubble--ai{background:var(--tn-chat-ai-surface);color:var(--tn-chat-ai-text);border-bottom-left-radius:4px;align-self:flex-start}.how-bubble--user{background:var(--tn-chat-user-surface);color:var(--tn-chat-user-text);border-bottom-right-radius:4px;align-self:flex-end}.how-chat-thumb{aspect-ratio:5/3;border:3px solid var(--tn-surface-card);width:104px;box-shadow:var(--shadow-2);border-radius:12px;flex-shrink:0;align-self:flex-end;position:relative;overflow:hidden}.how-typing{vertical-align:middle;gap:4px;padding-block:4px;display:inline-flex}.how-typing i{opacity:.4;background:currentColor;border-radius:50%;width:6px;height:6px}.how-price{place-items:center;padding:12px;display:grid}.how-ticket{text-align:center;border-radius:var(--radius-card);background:var(--tn-surface-card);box-shadow:var(--shadow-2);justify-items:center;gap:6px;padding:16px 22px;display:grid}.how-ticket-title{font:700 12px/1.2 var(--font-sans);letter-spacing:.06em;text-transform:uppercase;color:var(--muted-foreground)}.how-ticket-amount{font:700 40px/1.05 var(--font-display);color:var(--tn-violet-800)}.how-call{flex-direction:column;justify-content:center;gap:12px;padding:14px;display:flex}.how-call-card{background:var(--tn-surface-card);max-width:86%;box-shadow:var(--shadow-2);font:500 13px/1.35 var(--font-sans);border-radius:14px;margin:0;padding:9px 12px}.how-call-card b{font:700 11px/1.2 var(--font-sans);color:var(--muted-foreground);align-items:center;gap:5px;margin-bottom:2px;display:flex}.how-call-card--reply{background:var(--tn-chat-user-surface);color:var(--tn-chat-user-text);box-shadow:none;align-self:flex-end}.how-video{object-fit:cover;width:100%;height:100%;display:block;position:absolute;inset:0}.how-result{position:absolute;inset:0}.how-after-tag{font-size:11px;top:10px;right:10px}@keyframes how-rise{0%{opacity:0;transform:translateY(10px)}}@keyframes how-pop{0%{opacity:0;transform:scale(.85)}}@keyframes how-fade{0%{opacity:0}}@keyframes how-unpick{0%{opacity:1}}@keyframes how-blink{50%{opacity:1}}@media (prefers-reduced-motion:no-preference){.how-anim[data-armed][data-state=idle] .how-a{opacity:0}.how-anim[data-state=playing] .how-a{animation:var(--how-kf,how-rise) var(--how-dur,.42s) var(--ease-out) var(--how-at,0s) 1 backwards}.how-chat .how-a:first-child{--how-at:.1s}.how-chat .how-a:nth-child(2){--how-at:.7s}.how-chat .how-a:nth-child(3){--how-at:1.2s;--how-kf:how-pop}.how-chat .how-a:nth-child(4){--how-at:1.8s}.how-chat[data-state=playing] .how-typing i{animation:.8s ease-in-out 2.1s 3 backwards how-blink}.how-chat[data-state=playing] .how-typing i:nth-child(2){animation-delay:2.25s}.how-chat[data-state=playing] .how-typing i:nth-child(3){animation-delay:2.4s}.how-price .how-a{--how-at:.1s;--how-dur:.5s}.how-price[data-state=playing] .how-ticket-amount{animation:how-pop .4s var(--ease-out) .5s backwards}.how-price[data-state=playing] .how-ticket-demo{animation:.3s ease-out 1s backwards how-fade}.how-call .how-a:first-child{--how-at:.2s;--how-dur:.45s}.how-call .how-a:nth-child(2){--how-at:1.3s;--how-dur:.45s}.how-result{--how-kf:how-fade;--how-dur:.4s}.how-result:nth-child(2){--how-at:1.4s}.how-result:nth-child(3){--how-at:2.8s}}
.mat-aside{margin:0}.mat-tabs{background:var(--tn-surface-subtle);border-radius:16px;margin-bottom:32px;position:relative}.mat-tablist{grid-template-columns:repeat(var(--mat-cols,2), minmax(0, 1fr));gap:4px;padding:4px;display:grid}.mat-tab{min-width:0;min-height:44px;color:var(--muted-foreground);font:700 15px/20px var(--font-sans);text-align:center;text-wrap:balance;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .14s var(--ease-out-strong);background:0 0;border:0;border-radius:12px;justify-content:center;align-items:center;padding:6px 10px;display:inline-flex}.mat-tab:active{transform:scale(.97)}.mat-tablist--active .mat-tab:active{transform:none}.mat-tab:focus-visible{box-shadow:var(--shadow-focus);outline:none}[role=tablist]:not([data-measured]) .mat-tab[aria-selected=true]{background:var(--tn-violet-800);color:var(--tn-text-on-violet)}.mat-tablist--active{pointer-events:none;clip-path:inset(0 100% 100% 0);background:0 0;border-radius:16px;position:absolute;inset:0}.mat-tablist--active .mat-tab{background:var(--tn-violet-800);color:var(--tn-text-on-violet);cursor:default}.mat-tablist--active[data-ready]{transition:clip-path .22s var(--ease-out-strong)}.mat-tabs:has([role=tablist]:not([data-measured])) .mat-tablist--active{visibility:hidden}@media (min-width:640px){.mat-tabs{width:fit-content}.mat-tablist{display:flex}.mat-tab{white-space:nowrap;padding:0 18px}}@media (hover:hover) and (pointer:fine){.mat-tab{transition:transform .14s var(--ease-out-strong), color var(--dur-fast) var(--ease-out-strong)}.mat-tab:hover{color:var(--foreground)}}@media (prefers-reduced-motion:reduce){.mat-tablist--active[data-ready],.mat-tab{transition:none}.mat-tab:active{transform:none}}.mat-panel:focus-visible{box-shadow:var(--shadow-focus);border-radius:var(--radius-card);outline:none}.mat-intro{max-width:60ch;font:600 17px/26px var(--font-sans);margin:0 0 20px}.mat-grid{grid-template-columns:1fr;gap:16px;margin:0;padding:0;list-style:none;display:grid}.mat-card{flex-direction:column;align-items:flex-start;gap:12px;padding:24px;display:flex}.mat-name{font:700 var(--type-h4-size)/var(--type-h4-lh) var(--font-display);letter-spacing:-.01em;text-wrap:balance;margin:0}.mat-precautions{color:var(--muted-foreground);font:500 15px/22px var(--font-sans);flex-direction:column;gap:8px;margin:4px 0 0;padding:0;list-style:none;display:flex}.mat-precautions li{padding-left:16px;position:relative}.mat-precautions li:before{content:"";background:var(--tn-violet-400);border-radius:50%;width:6px;height:6px;position:absolute;top:9px;left:0}@media (min-width:768px){.mat-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width:1024px){.mat-grid{grid-template-columns:repeat(3,1fr)}}
.commit-card{--commit-rule:color-mix(in oklab, var(--tn-accent-peach-ink) 18%, transparent);background:var(--tn-accent-peach);color:var(--tn-accent-peach-ink);border-radius:var(--radius-hero);padding:32px}.commit-title{color:var(--tn-accent-peach-ink);margin:0 0 24px;font-size:clamp(28px,4vw,40px);line-height:1.1}.commit-row{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:24px;display:grid}.commit-item{grid-template-rows:auto 64px auto;align-content:start;gap:10px;min-width:0;margin:0;padding:0 12px;display:grid}.commit-item:nth-child(2n){border-left:1.5px solid var(--commit-rule)}.commit-label{font:800 11px/1 var(--font-sans);letter-spacing:.1em;text-transform:uppercase;opacity:.75}.commit-visual{align-items:center;height:64px;display:flex}.commit-logo{filter:grayscale()contrast(1.15);mix-blend-mode:multiply;opacity:.9;max-width:100%;height:auto;display:block}.commit-icon{color:var(--tn-accent-peach-ink)}.commit-value{flex-wrap:wrap;align-items:center;gap:6px 8px;display:inline-flex}.commit-big{font:700 28px/1 var(--font-display);white-space:nowrap;color:var(--tn-accent-peach-ink)}.commit-item figcaption{font:600 14px/1.35 var(--font-sans)}@media (min-width:1024px){.commit-row{grid-template-columns:repeat(6,minmax(0,1fr));row-gap:0}.commit-item{padding:4px 14px 4px 0}.commit-item+.commit-item{border-left:1.5px solid var(--commit-rule);padding-left:14px}}@media (max-width:767px){.commit-card{padding:24px 12px}.commit-title{padding:0 8px}}@media (max-width:1023px){.commit-item{--reveal-delay:0s!important}}
