#methode .method-timeline{position:relative;isolation:isolate;gap:24px;padding:14px 0 0}#methode .method-timeline li{position:relative;z-index:1;border:0;padding:78px 18px 20px;border-radius:14px;min-width:0}#methode .method-timeline li:nth-child(2n){margin-top:26px}#methode .method-timeline li:after{content:"";position:absolute;inset:65px 0 0;border-radius:14px;background:linear-gradient(145deg,#e4edffbb,#e4edff00);z-index:-1;opacity:0;animation:method-card 16s linear infinite;animation-delay:var(--step-delay)}#methode .method-timeline li:nth-child(1){--step-delay:0s}#methode .method-timeline li:nth-child(2){--step-delay:4s}#methode .method-timeline li:nth-child(3){--step-delay:8s}#methode .method-timeline li:nth-child(4){--step-delay:12s}#methode .method-timeline .method-marker{position:absolute;top:0;left:18px;display:grid;place-items:center;width:46px;height:46px;border:1px solid #b7cbed;border-radius:50%;background:#fffdf8;font:12px var(--mono);color:#286cff;box-shadow:0 0 0 8px #f5f2eb;animation:method-node 16s linear infinite;animation-delay:var(--step-delay);z-index:2}#methode .method-timeline li>span:not(.method-marker){font:9px var(--mono);color:#536174}#methode .method-timeline h3{margin-top:18px}#methode .method-track{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0}#methode .method-track path{fill:none;stroke-width:2;stroke-linecap:round}#methode .method-track-base{stroke:#bccde6}#methode .method-track-light{stroke:#286cff;stroke-width:3;stroke-dasharray:.13 .87;animation:method-flow 16s linear infinite;filter:drop-shadow(0 0 4px #286cff66)}@keyframes method-flow{0%{stroke-dashoffset:.13}to{stroke-dashoffset:-.87}}@keyframes method-card{0%,22%{opacity:1}27%,96%{opacity:0}to{opacity:1}}@keyframes method-node{0%,22%{background:#286cff;color:#fff;border-color:#286cff;box-shadow:0 0 0 8px #e4edff}27%,96%{background:#fffdf8;color:#286cff;border-color:#b7cbed;box-shadow:0 0 0 8px #f5f2eb}to{background:#286cff;color:#fff;border-color:#286cff;box-shadow:0 0 0 8px #e4edff}}#methode .method-timeline.s-demo-idle *,#methode .method-timeline.s-demo-idle li:after,#methode .method-timeline.timeline-hidden *,#methode .method-timeline.timeline-hidden li:after{animation-play-state:paused}@media(max-width:1050px){#methode .method-timeline{grid-template-columns:1fr;padding-top:0;gap:22px}#methode .method-timeline li,#methode .method-timeline li:nth-child(2n){padding:18px 18px 18px 80px;margin:0}#methode .method-timeline .method-marker{top:18px;left:4px}#methode .method-timeline li:after{inset:0 0 0 65px}#methode .method-timeline h3{margin:12px 0}#methode .method-timeline p{font-size:15px;max-width:640px}}@media(prefers-reduced-motion:reduce){#methode .method-timeline *,#methode .method-timeline li:after{animation:none!important}#methode .method-timeline li:after{opacity:0}#methode .method-track-light{display:none}}#methode .method-build{display:grid;grid-template-columns:.8fr 1.2fr;gap:8%;padding:42px;border:1px solid #b9cef1;border-radius:22px;background:radial-gradient(ellipse at 80% 30%,#f5f8ff,#e1ebfd);margin:0 0 44px;overflow:hidden}.build-copy{align-self:center;min-width:0}.build-kicker{font:9px var(--mono);letter-spacing:.08em;color:#28599e}.build-level{display:flex;align-items:center;gap:12px;margin-top:28px;font:10px var(--mono);color:#28599e}.build-level>span:first-child{padding:8px 12px;border:1px solid #b9cef1;border-radius:30px;background:#fffdf8}#methode .build-copy h3{font-size:clamp(32px,3.5vw,54px);margin:20px 0;line-height:1.08}.build-copy>p{font-size:15px;color:#536174;max-width:310px;min-height:52px}.build-progress{display:flex;gap:6px;margin:24px 0}.build-progress i{height:4px;flex:1;border-radius:5px;background:#b9cef1;transition:background .5s}.build-progress i.is-done{background:#286cff}.build-replay{border:0;background:none;cursor:pointer;padding:8px 0;font:13px var(--sans);color:#245bc2}.build-replay:focus-visible{outline:2px solid #286cff;outline-offset:4px}.build-preview{min-width:0;align-self:center;position:relative;padding-bottom:82px}.build-browser{border-radius:12px;overflow:hidden;background:#fffdf8;border:1px solid #b9cef1;box-shadow:0 20px 40px #142b4718;transform:rotate(-2deg);transition:transform .8s}.build-browser-bar{display:flex;align-items:center;justify-content:space-between;background:#f4f6fa;border-bottom:1px solid #dde5f0;padding:10px 12px;color:#637382;font:8px var(--mono)}.build-browser-bar small{font-size:9px}.build-website{padding:20px;transition:filter .8s}.build-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:10px;padding-bottom:20px;border-bottom:1px solid #ddd}.build-nav span{font-size:7px;color:#637382}.build-page{display:grid;grid-template-columns:1.2fr 1fr;gap:15px;padding:26px 0}.build-page small{font:7px var(--mono);color:#536174}.build-page strong{display:block;font:clamp(19px,2vw,31px)/1.1 var(--serif);letter-spacing:-.04em;margin-top:10px}.build-page p{font-size:9px;color:#536174}.build-button{display:inline-block;padding:9px 12px;background:#286cff;border-radius:5px;color:#fff;font-size:8px}.build-art{display:flex;flex-direction:column;justify-content:space-between;position:relative;border-radius:40px 8px 8px;background:#e0e9f8;overflow:hidden;padding:18px;min-height:150px;color:#28599e}.build-art div{width:85px;height:85px;border:1px solid #fff;background:linear-gradient(135deg,#72a5ff,#286cff);border-radius:50% 50% 8px;transform:rotate(-20deg);box-shadow:12px 12px #b9cef1}.build-art span{position:relative;font:italic 15px/1.1 var(--serif);margin-top:18px}.build-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.build-tiles i{height:30px;border-radius:5px;background:#f2ded5}.build-tiles i:nth-child(2){background:#e6e0f2}.build-tiles i:nth-child(3){background:#e0e9f8}.build-handoff{display:flex;align-items:center;gap:8px;padding:12px 18px;background:#eef4ff;border-top:1px solid #d6e4fb;color:#28599e;font-size:10px;opacity:0;transition:opacity .6s}.build-handoff span{display:grid;place-items:center;background:#286cff;color:#fff;width:18px;height:18px;border-radius:50%}.build-reward{position:absolute;bottom:33px;left:6%;right:0;display:flex;align-items:center;gap:12px;background:#142b47;color:#fffdf8;padding:18px;border-radius:12px;box-shadow:0 12px 28px #142b4726;opacity:0;transform:translateY(12px);transition:opacity .7s,transform .7s}.build-check{display:grid;place-items:center;border:1px solid #94b6ff;background:#286cff;width:36px;height:36px;flex-shrink:0;border-radius:50%;font-size:20px}.build-reward small{display:block;font:8px var(--mono);color:#b9cef1;margin-bottom:5px}.build-reward strong{font:21px var(--serif)}.build-spark{margin-left:auto;color:#9fbeff;font-size:28px}.build-caption{position:absolute;bottom:0;left:0;font:9px/1.5 var(--sans);color:#536174}.method-build[data-phase="0"] .build-website{filter:grayscale(1);opacity:.4}.method-build[data-phase="0"] .build-page p,.method-build[data-phase="0"] .build-button,.method-build[data-phase="0"] .build-art,.method-build[data-phase="0"] .build-tiles{opacity:.15}.method-build[data-phase="1"] .build-button,.method-build[data-phase="1"] .build-tiles{opacity:.25}.method-build[data-phase="1"] .build-art{opacity:.55}.method-build[data-phase="3"] .build-handoff,.method-build[data-phase="4"] .build-handoff{opacity:1}.method-build[data-phase="4"] .build-browser{transform:rotate(0)}.method-build[data-phase="4"] .build-reward{opacity:1;transform:translateY(0)}#methode .method-timeline li:after,#methode .method-marker,#methode .method-track-light{animation:none}#methode .method-timeline li:after{transition:opacity .6s}#methode .method-timeline li.is-current:after{opacity:1}#methode .method-timeline li.is-done .method-marker{background:#286cff;color:#fff;border-color:#286cff}#methode .method-timeline li.is-current .method-marker{box-shadow:0 0 0 8px #e4edff}#methode .method-track-light{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.2s ease}@media(max-width:1050px){#methode .method-build{gap:30px;padding:28px;grid-template-columns:1fr 1.2fr}.build-art{min-height:130px;padding:12px}.build-art div{width:60px;height:60px}.build-nav span{display:none}.build-website{padding:14px}}@media(max-width:720px){#methode .method-build{grid-template-columns:1fr;gap:24px;padding:24px}.build-level{margin-top:18px}#methode .build-copy h3{font-size:36px;margin:16px 0}.build-copy>p{min-height:52px;max-width:none}.build-progress{margin:18px 0}.build-preview{padding-bottom:95px}.build-page{gap:12px}.build-page strong{font-size:23px}.build-art{padding:10px;min-height:130px}.build-reward{left:0;padding:15px;bottom:35px}.build-reward strong{font-size:20px}.build-caption{font-size:8px}.build-spark{display:none}}@media(prefers-reduced-motion:reduce){#methode .method-build *,#methode .method-timeline *{transition:none!important}.build-replay{display:none}}@media(max-width:720px){.build-page{grid-template-columns:1.3fr .8fr;gap:8px}.build-page>div{min-width:0}.build-page strong{font-size:20px}.build-art div{width:50px;height:50px;flex-shrink:0}.build-art span{font-size:12px}.build-page p{font-size:8px}.build-reward strong{font-size:18px}}@media(max-width:360px){.build-page strong{font-size:18px}.build-website{padding:12px}.build-button{padding:8px;font-size:7px}.build-art{padding:8px}.build-reward{gap:8px;padding:12px}.build-check{width:28px;height:28px}.build-reward strong{font-size:16px}}#methode .method-timeline .method-marker{animation:none;transition:background .5s,color .5s,box-shadow .5s}.method-build[data-phase="4"] .build-handoff{opacity:0}