/* Distinct surfaces and purposeful motion. Text remains visible without JS. */
.motion-design{--ease-ui:cubic-bezier(.22,.68,0,1.01);--duration-ui:280ms;--lilac:#d8c1ff;--rose:#ffb9dd;--blue:#b9dbff;--mint:#bde2d2}
.motion-design .section{border-top:0}
.motion-design .section-heading{margin-bottom:40px}
.motion-design .split-heading{gap:6%}
.motion-design .visual-label{display:block;font-size:11px;letter-spacing:.12em;font-weight:500;color:var(--muted);margin-bottom:16px}
.motion-design .hero{border-bottom:1px solid var(--line)}
.motion-design .product-preview-card{transform:perspective(1000px) rotateX(var(--tilt-y,0deg)) rotateY(var(--tilt-x,0deg)) rotate(3deg);transition:transform 350ms var(--ease-ui)}
.motion-design .product-preview-card .method-lines{transition:transform 600ms var(--ease-ui)}
.motion-design .product-stage:hover .method-lines{transform:rotate(-12deg) translateY(-8px)}

/* A shared-incentives panel; the switch makes contributions concrete. */
.motion-design .model-compact{margin-block:48px 8px;padding:48px;border-radius:24px;background:radial-gradient(ellipse at 15% 40%,#542e46 0,transparent 62%),#241b25;grid-template-columns:1.15fr 1fr;gap:8%;border:1px solid #624754}
.model-copy h2{font-size:clamp(30px,2.9vw,42px)}
.partnership-visual{margin-top:28px;max-width:390px}
.partnership-switch{display:flex;gap:8px}
.partnership-switch button{font-size:12px;border:1px solid #6a4c65;border-radius:24px;padding:10px 16px;min-height:44px;background:#ffffff06;color:var(--text);transition:background var(--duration-ui),color var(--duration-ui)}
.partnership-switch button[aria-pressed=true]{background:var(--rose);color:#2c1427;border-color:var(--rose)}
.partnership-orbit{position:relative;display:flex;align-items:center;justify-content:space-between;height:108px;margin-top:12px;max-width:360px}
.partnership-orbit svg{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#c493b7;stroke-width:1;stroke-dasharray:280;stroke-dashoffset:0}
.partnership-visual.in-view .partnership-orbit svg{animation:draw-connection 1.1s var(--ease-ui) both}
.orbit-node{display:grid;place-items:center;width:64px;height:64px;flex:none;border-radius:50%;position:relative;background:#221b26;border:1px solid #a27494;font:500 22px Outfit,sans-serif;transition:background var(--duration-ui),transform var(--duration-ui),color var(--duration-ui)}
.node-focal{background:var(--rose);color:#2c1427;transform:scale(1.06)}
.partnership-visual[data-side=creator] .node-focal{background:#221b26;color:var(--text);transform:scale(1)}
.partnership-visual[data-side=creator] .node-creator{background:var(--lilac);color:#251a34;transform:scale(1.06)}
#partner-detail{font-size:14px;min-height:46px;max-width:38ch;color:#eee1ec}
.partnership-outcome{font-size:11px;color:#c7b9c7;display:block;margin-top:8px}
.motion-design .model-terms>p{font-size:18px;line-height:1.7}
.motion-design .model-terms .model-note{font-size:14px;margin-top:24px}
.motion-design .model-terms .text-link{margin-top:28px}

/* Four coloured, linked service cards, instead of four adjacent text columns. */
.motion-design .service-section .split-heading{display:block;max-width:880px}
.motion-design .service-section .split-heading>p{margin-top:24px;max-width:65ch}
.motion-design .service-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.motion-design .service-grid article{padding:0;border:0;min-width:0}
.service-card{--card-accent:var(--lilac);--card-surface:#2b2337;display:block;position:relative;isolation:isolate;height:100%;border-radius:18px;padding:32px;background:var(--card-surface);border:1px solid color-mix(in srgb,var(--card-accent) 35%,transparent);overflow:hidden;transition:transform 320ms var(--ease-ui),border-color 320ms,box-shadow 320ms}
.service-card[data-tone=rose]{--card-accent:var(--rose);--card-surface:#352331}
.service-card[data-tone=blue]{--card-accent:var(--blue);--card-surface:#202d3a}
.service-card[data-tone=mint]{--card-accent:var(--mint);--card-surface:#22332e}
.service-card:before{content:'';position:absolute;inset:0;background:radial-gradient(350px circle at var(--spot-x,50%) var(--spot-y,50%),color-mix(in srgb,var(--card-accent) 18%,transparent),transparent 70%);opacity:0;transition:opacity 350ms;z-index:-1}
.service-card:hover,.service-card:focus-visible{transform:translateY(-5px);border-color:var(--card-accent);box-shadow:0 18px 36px #0002}
.service-card:hover:before,.service-card:focus-visible:before{opacity:1}
.service-icon{width:48px;height:48px;display:grid;place-items:center;background:color-mix(in srgb,var(--card-accent) 15%,transparent);border-radius:12px;color:var(--card-accent);margin-bottom:24px}
.service-icon svg{width:27px;height:27px;transition:transform 400ms var(--ease-ui)}
.service-card:hover .service-icon svg,.service-card:focus-visible .service-icon svg{transform:rotate(-10deg) scale(1.12)}
.motion-design .service-grid h3{min-height:0;font-size:27px;margin-bottom:16px}
.motion-design .service-grid p{max-width:52ch;color:#e0dce5}
.service-explore{display:flex;align-items:center;gap:14px;color:var(--card-accent);font-size:12px;margin-top:24px}
.service-explore svg{width:16px;height:16px;transition:transform var(--duration-ui)}
.service-card:hover .service-explore svg{transform:translate(3px,-3px)}
.motion-design .creator-contribution{position:relative;background:#1e1b22;border:0;padding:32px 32px 32px 112px;grid-template-columns:1fr 1.4fr;gap:6%;margin-top:24px}
.collaboration-mark{position:absolute;left:32px;top:50%;width:60px;height:48px;transform:translateY(-50%)}
.collaboration-mark i{position:absolute;inset:0;width:40px;height:40px;border:1px solid var(--rose);border-radius:50%}
.collaboration-mark i+i{left:20px;border-color:var(--lilac)}
.creator-contribution.in-view .collaboration-mark i{animation:circle-meet-left 700ms var(--ease-ui) both}
.creator-contribution.in-view .collaboration-mark i+i{animation:circle-meet-right 700ms var(--ease-ui) both}

/* A niche playground replaces the decorative phone and connector diagram. */
.motion-design .creator-fit{grid-template-columns:1.05fr 1fr;gap:48px 7%;align-items:start}
.motion-design .fit-details article{border:0;padding:24px;background:#1e1b24;border-radius:14px;margin-bottom:12px}
.motion-design .fit-details article:first-child{padding-top:24px}
.motion-design .fit-details h3{font-size:23px}
.niche-explorer{grid-column:1/-1;border-radius:20px;background:linear-gradient(115deg,#272036,#1c1925);border:1px solid #50405f;padding:32px}
.niche-controls{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:32px}
.niche-controls button{padding:10px 18px;min-height:44px;border:1px solid #65596f;border-radius:24px;font-size:13px;background:#ffffff03;color:#e8e1ec;transition:background var(--duration-ui),color var(--duration-ui),transform var(--duration-ui)}
.niche-controls button:hover{background:#ffffff10;transform:translateY(-2px)}
.niche-controls button[aria-pressed=true]{background:var(--lilac);border-color:var(--lilac);color:#2c1c3c}
.niche-result{display:grid;grid-template-columns:240px 1fr;gap:40px;align-items:center;min-height:200px}
.niche-result h3{font-size:34px;margin-bottom:14px}
.niche-result p{font-size:17px;max-width:58ch;min-height:56px}
.niche-result small{display:block;font-size:12px;color:#c2b8ce;margin-top:20px}
.niche-sculpture{position:relative;width:190px;height:170px;margin:auto;perspective:700px}
.niche-sculpture i{position:absolute;inset:12px 20px;border:1px solid #d8c1ff99;border-radius:36%;background:linear-gradient(130deg,#d8c1ff12,#d8c1ff02);transform:rotate(calc(var(--leaf)*15deg)) rotateY(30deg);transition:transform 700ms var(--ease-ui),border-radius 700ms,border-color 700ms}
.niche-sculpture i:nth-child(1){--leaf:0}.niche-sculpture i:nth-child(2){--leaf:1}.niche-sculpture i:nth-child(3){--leaf:2}.niche-sculpture i:nth-child(4){--leaf:3}.niche-sculpture i:nth-child(5){--leaf:4}.niche-sculpture i:nth-child(6){--leaf:5}
.niche-result[data-niche-active=photography] i{transform:rotate(calc(var(--leaf)*8deg)) translateX(calc(var(--leaf)*3px));border-radius:12px}
.niche-result[data-niche-active=coding] i{transform:rotateY(calc(var(--leaf)*16deg)) translateY(calc(var(--leaf)*3px));border-radius:6px}
.niche-result[data-niche-active=crafts] i{transform:rotate(calc(var(--leaf)*24deg)) scale(calc(1 - var(--leaf)*.07));border-radius:28%}
.niche-result[data-niche-active=food] i{transform:rotate(calc(var(--leaf)*18deg)) scale(calc(1 - var(--leaf)*.08));border-radius:50%;border-color:#ffb9ddaa}
.niche-result[data-niche-active=movement] i{transform:rotate(calc(var(--leaf)*-12deg)) translateX(calc(var(--leaf)*5px));border-radius:50% 10%;border-color:#bde2d2aa}

/* Restore colour-changing hover/focus/tap selection with a stable preview. */
.motion-design #products{--format-accent:var(--lilac)}
.format-feature{display:grid;grid-template-columns:320px 1fr;gap:48px;align-items:center;padding:40px;background:color-mix(in srgb,var(--format-accent) 12%,#151218);border:1px solid color-mix(in srgb,var(--format-accent) 34%,#28212d);border-radius:20px;transition:background 450ms,border-color 450ms;min-height:310px}
.format-feature-copy h3{font-size:clamp(32px,3.5vw,48px);color:var(--format-accent);margin-bottom:20px;transition:color var(--duration-ui)}
.format-feature-copy p{font-size:18px;max-width:47ch;min-height:70px}
.format-art{position:relative;width:220px;height:220px;margin:auto;perspective:1000px}
.format-art-page{position:absolute;left:28px;top:10px;width:160px;height:190px;border:1px solid color-mix(in srgb,var(--format-accent) 66%,transparent);background:color-mix(in srgb,var(--format-accent) 12%,#211b29);border-radius:12px;transition:transform 600ms var(--ease-ui),border-radius 500ms,background 500ms}
.page-back{transform:rotate(-15deg) translate(-20px,4px)}
.page-middle{transform:rotate(-5deg) translate(-6px,2px)}
.page-front{transform:rotate(8deg);padding:28px;background:color-mix(in srgb,var(--format-accent) 78%,#251d30);color:#251c2c}
.format-art-symbol{display:block;margin-bottom:22px}
.format-art-symbol svg{width:34px;height:34px}
.art-rule{display:block;height:3px;border-radius:3px;background:currentColor;opacity:.4;margin-top:12px;width:100%}
.art-rule.short{width:60%}
.format-art-ring{position:absolute;inset:0;border:1px solid color-mix(in srgb,var(--format-accent) 28%,transparent);border-radius:50%;z-index:-1;transition:transform 600ms}
.format-feature[data-format-active=guides] .page-back{transform:rotate(-4deg) translate(-24px,8px)}
.format-feature[data-format-active=guides] .page-front{transform:rotate(2deg);border-radius:2px 12px 12px 2px}
.format-feature[data-format-active=programs] .page-back{transform:rotate(-16deg) translate(-32px,10px)}
.format-feature[data-format-active=programs] .page-front{transform:rotate(-5deg) translate(16px,-4px)}
.format-feature[data-format-active=memberships] .page-back{transform:rotate(-25deg) translate(-24px,0)}
.format-feature[data-format-active=memberships] .page-middle{transform:rotate(0) translate(0,-12px)}
.format-feature[data-format-active=memberships] .page-front{transform:rotate(25deg) translate(22px,5px)}
.motion-design .format-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:16px}
.format-choice{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;text-align:left;gap:24px;min-height:150px;padding:24px;position:relative;border-radius:14px;border:1px solid color-mix(in srgb,var(--format-color) 40%,#2a242e);background:color-mix(in srgb,var(--format-color) 12%,#19151d);color:var(--text);transition:background 300ms,color 300ms,transform 300ms var(--ease-ui),border-color 300ms;font:500 20px/1.25 Outfit,sans-serif}
.format-choice:hover,.format-choice[aria-pressed=true]{background:var(--format-color);border-color:var(--format-color);color:#241b2b;transform:translateY(-3px)}
.format-icon svg{width:27px;height:27px;color:var(--format-color);transition:color var(--duration-ui)}
.format-choice:hover .format-icon svg,.format-choice[aria-pressed=true] .format-icon svg{color:currentColor}
.format-choice-arrow{position:absolute;right:20px;top:20px}
.format-choice-arrow svg{width:16px;height:16px}
.motion-design .connected-products{margin-top:56px}
.motion-design .ecosystem-path li{background:#2b2435;border-color:#796188;transition:transform 350ms,border-color 350ms}
.motion-design .ecosystem-path li:nth-child(2){background:#292838;border-color:#5d6489}
.motion-design .ecosystem-path li:nth-child(3){background:#32222f;border-color:#956a85}
.motion-design .ecosystem-path li:hover{transform:translateY(-4px);border-color:var(--rose)}

/* One desktop stage at a time; mobile keeps the whole readable overview. */
.process-deck{display:grid;grid-template-columns:320px 1fr;gap:28px;align-items:start}
.process-selector{display:none}
.motion-design .process-panels{border:0;min-width:0}
.motion-design .process-row{border:1px solid #454159;border-radius:20px;margin-bottom:20px;padding:32px;background:linear-gradient(135deg,#252336,#1c1b27);grid-template-columns:1fr;gap:24px;min-width:0}
.motion-design .process-title{grid-template-columns:36px 1fr;gap:14px}
.motion-design .process-title h3{font-size:32px;max-width:none}
.motion-design .process-number{color:var(--blue)}
.motion-design .process-description>p{font-size:17px;max-width:60ch}
.motion-design .process-output{padding:18px 20px;border-radius:10px;background:#b9dbff10;margin-top:24px!important;display:block!important;color:#e5edf8!important}
.motion-design .process-output strong{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:#b9dbff;margin-bottom:6px}
.motion-design .compact-details{border-top:0;margin-top:12px}
.motion-design .compact-details summary{color:#d3cee4;padding-block:16px}
.motion-design .compact-details summary>span{color:var(--blue)}
.motion-design .compact-detail-content ul{gap:8px}
.motion-design .process-row[hidden]{display:none}
.stage-diagram{margin-top:24px;min-height:160px;display:grid;align-items:center;position:relative;overflow:hidden;border-radius:12px;background:#11101c66;padding:24px}
.research-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.research-notes>span{background:#b9dbff0b;border:1px solid #b9dbff40;border-radius:8px;padding:18px 14px;font-size:12px;color:#d4e4fa}
.research-notes i{display:block;height:3px;background:#b9dbff66;border-radius:3px;margin-top:14px;transform-origin:left}
.research-notes i:nth-child(2){width:80%}.research-notes i:nth-child(3){width:56%}
.stage-enter .research-notes i{animation:note-line 650ms var(--ease-ui) both}
.stage-enter .research-notes>span:nth-child(2) i{animation-delay:90ms}.stage-enter .research-notes>span:nth-child(3) i{animation-delay:180ms}
.offer-blocks{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.offer-blocks span{padding:22px 16px;border-radius:10px;background:#d8c1ff18;border:1px solid #d8c1ff60;font-size:15px;color:#efe6ff}
.offer-blocks small{display:block;color:var(--lilac);font-size:10px;margin-bottom:16px}
.stage-enter .offer-blocks span{animation:offer-stack 600ms var(--ease-ui) both}
.stage-enter .offer-blocks span:nth-child(2){animation-delay:80ms}.stage-enter .offer-blocks span:nth-child(3){animation-delay:160ms}
.test-path{display:flex;gap:12px;justify-content:center}
.test-path span{border:1px solid #ffb9dd66;border-radius:30px;padding:14px 16px;font-size:13px;color:#ffe4f2;background:#ffb9dd0b}
.stage-enter .test-path span{animation:test-emphasis 850ms var(--ease-ui) both}
.stage-enter .test-path span:nth-child(2){animation-delay:180ms}.stage-enter .test-path span:nth-child(3){animation-delay:360ms}
.system-path{display:flex;align-items:center;justify-content:center;gap:12px}
.system-path span{border:1px solid #bde2d277;border-radius:12px;padding:20px 14px;background:#bde2d20b;color:#e1f7ef;font-size:13px}
.system-path i{height:1px;flex:1;background:var(--mint);transform-origin:left;max-width:40px}
.stage-enter .system-path i{animation:note-line 700ms var(--ease-ui) both}
.stage-enter .system-path i:nth-of-type(2){animation-delay:180ms}
.launch-scene{display:grid;grid-template-columns:1fr 1.2fr;align-items:center;gap:24px}
.launch-source{padding:22px 12px;border-radius:12px;border:1px solid #ffb9dd80;color:#ffe5f2;text-align:center;background:#ffb9dd14;font-size:15px}
.launch-scene>div{display:flex;flex-direction:column;gap:8px;border-left:1px solid #ffb9dd60;padding-left:24px}
.launch-scene>div>span{padding:8px 14px;background:#ffb9dd0d;border-radius:5px;color:#e8dae5;font-size:12px}
.stage-enter .launch-scene>div>span{animation:launch-item 600ms var(--ease-ui) both}
.stage-enter .launch-scene>div>span:nth-child(2){animation-delay:90ms}.stage-enter .launch-scene>div>span:nth-child(3){animation-delay:180ms}
.growth-stack{display:flex;align-items:center;justify-content:center;gap:8px}
.growth-stack span{padding:22px 18px;border:1px solid #d8c1ff66;border-radius:12px;background:#d8c1ff10;color:#e5daf5;font-size:15px;transform:rotate(-6deg)}
.growth-stack span:nth-child(2){transform:rotate(0) translateY(-10px);background:#d8c1ff22}.growth-stack span:nth-child(3){transform:rotate(6deg)}
.stage-enter .growth-stack span{animation:grow-stack 650ms var(--ease-ui) both}
.stage-enter .growth-stack span:nth-child(2){animation-delay:80ms}.stage-enter .growth-stack span:nth-child(3){animation-delay:160ms}
@media(min-width:1001px){
 .stage-enhanced .process-selector{display:flex;flex-direction:column;gap:10px;position:sticky;top:32px}
 .process-selector button{display:grid;grid-template-columns:24px 1fr 20px;gap:12px;text-align:left;align-items:center;border:1px solid #3f394c;padding:20px;border-radius:12px;background:#201c27;min-height:78px;transition:background var(--duration-ui),border-color var(--duration-ui),transform var(--duration-ui)}
 .process-selector button>span{font-size:12px;color:#b3a7c5}
 .process-selector button strong{font:500 18px/1.3 Outfit,sans-serif}
 .process-selector svg{width:18px;height:18px;color:#b3a7c5}
 .process-selector button:hover{border-color:#8e7bab;transform:translateX(3px)}
 .process-selector button[aria-pressed=true]{background:var(--blue);color:#182639;border-color:var(--blue)}
 .process-selector button[aria-pressed=true]>span,.process-selector button[aria-pressed=true] svg{color:#334d6c}
 .stage-enhanced .process-row{min-height:600px;margin:0;padding:36px}
 .stage-enhanced .process-title h3{font-size:34px}
}
html:not(.stage-enhanced) .process-deck{display:block}

/* A personal portrait frame, not another block of ruled text. */
.motion-design .founder-personal .founder-introduction{grid-template-columns:360px 1fr;gap:32px 7%;align-items:center}
.motion-design .founder-portrait{position:relative;transform:perspective(1000px) rotateX(var(--tilt-y,0deg)) rotateY(var(--tilt-x,0deg));transition:transform 400ms var(--ease-ui);border-radius:20px;border:1px solid #9e6889;overflow:hidden;isolation:isolate}
.portrait-frame{position:absolute;inset:16px;border:1px solid #ffffff66;border-radius:12px;pointer-events:none;transition:inset 500ms var(--ease-ui)}
.founder-portrait:hover .portrait-frame{inset:22px}
.founder-portrait.in-view .portrait-frame{animation:portrait-frame-enter 900ms var(--ease-ui) both}
@keyframes portrait-frame-enter{from{opacity:.2;transform:scale(.92)}to{opacity:1;transform:scale(1)}}
.format-caption{font:400 14px/1.6 'DM Sans',sans-serif}
.interaction-enhanced .format-caption{display:none}
html:not(.interaction-enhanced) .niche-controls,html:not(.interaction-enhanced) .partnership-switch{display:none}
.portrait-signature{position:absolute;left:30px;bottom:28px;font:500 30px/1 Outfit,sans-serif;letter-spacing:-.03em;color:#fff;text-shadow:0 2px 12px #0009}
.portrait-signature small{display:block;font:500 9px/1.4 'DM Sans',sans-serif;letter-spacing:.14em;margin-top:10px}
.founder-lenses{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:20px}
.founder-lenses span{font-size:11px;padding:7px 12px;border-radius:20px;background:#ffb9dd15;color:#e8c5dd;border:1px solid #83556f}
.motion-design .founder-story .founder-opening{color:var(--rose);font-size:15px}
.motion-design .founder-signoff{margin-top:24px;color:var(--rose);font:500 24px/1.4 Outfit,sans-serif}

/* Each answer becomes a card; expanding it changes the entire surface. */
.motion-design .faq-section{column-gap:8%}
.motion-design .faq-list{display:flex;flex-direction:column;gap:12px}
.motion-design .faq-list details{border:1px solid #4b4055;border-radius:14px;background:#211b29;padding:0;overflow:hidden;transition:background 300ms,border-color 300ms}
.motion-design .faq-list summary{padding:22px 24px;min-height:68px;font-size:16px;color:#eee8f4;gap:18px}
.motion-design .faq-list summary>span{color:var(--lilac)}
.motion-design .faq-list details:hover{border-color:#9782ac}
.motion-design .faq-list details[open]{background:#30263c;border-color:#aa8cc5}
.motion-design .faq-answer{padding:0 24px 24px}
.motion-design .faq-answer p{padding:0;font-size:16px;line-height:1.7;color:#ddd5e6}
.motion-design .faq-list details[open] .faq-answer{animation:answer-enter 300ms var(--ease-ui)}
.faq-art{position:relative;width:210px;height:210px;display:grid;place-items:center;margin-top:40px}
.faq-art>span{font:500 96px/1 Outfit,sans-serif;color:var(--lilac);position:relative;z-index:1;transition:transform 500ms var(--ease-ui)}
.faq-art i{position:absolute;inset:10px;border:1px solid #d8c1ff66;border-radius:42%;transform:rotate(20deg);transition:transform 800ms var(--ease-ui),border-radius 800ms}
.faq-art i:nth-of-type(2){inset:24px;transform:rotate(50deg)}
.faq-art i:nth-of-type(3){inset:38px;transform:rotate(80deg)}
.faq-art:hover i{transform:rotate(100deg);border-radius:50%}
.faq-art:hover>span{transform:rotate(-12deg)}
.faq-section:has(details[open]) .faq-art i:nth-of-type(2){transform:rotate(100deg);border-radius:50%}

/* Form-completion feedback; the normal submission flow remains unchanged. */
.motion-design .contact{border-radius:24px;padding:48px;background:linear-gradient(120deg,#2d1f2b,#201b27 72%);border:1px solid #69475d;gap:7%}
.motion-design .contact form{background:#15121c;border:1px solid #5a4052;border-radius:16px;padding:28px;transition:border-color 300ms,box-shadow 300ms}
.motion-design .contact form:focus-within{border-color:#c291b0;box-shadow:0 0 0 4px #ffb9dd08}
.motion-design .contact input:focus,.motion-design .contact textarea:focus{border-color:var(--rose);background:#211826}
.contact-progress{display:grid;grid-template-columns:96px 1fr;gap:16px;align-items:center;margin-top:40px;max-width:420px}
.contact-orbit{position:relative;width:96px;height:96px;display:grid;place-items:center}
.contact-orbit>svg{position:absolute;inset:0;fill:none;width:100%;height:100%;stroke:#69465d;stroke-width:1.5}
.contact-orbit>svg path{stroke:var(--rose);stroke-width:2;stroke-dasharray:400;stroke-dashoffset:calc(400 - var(--form-progress,0)*400);transition:stroke-dashoffset 550ms var(--ease-ui)}
.contact-orbit>span>svg{width:30px;height:30px;color:var(--rose);transition:transform 400ms var(--ease-ui)}
.contact:focus-within .contact-orbit>span>svg{transform:translate(3px,-3px) rotate(-5deg)}
.contact-progress strong{font:500 20px/1.3 Outfit,sans-serif;display:block}
.contact-progress p{font-size:13px;margin-top:10px}
.form-progress-dots{grid-column:2;display:flex;gap:8px;margin-top:-8px}
.form-progress-dots i{width:7px;height:7px;border-radius:50%;background:#644a61;transition:background 300ms,transform 300ms}
.form-progress-dots i.complete{background:var(--rose);transform:scale(1.15)}
.motion-design footer .brand svg path{transition:stroke 400ms;stroke-dasharray:200;stroke-dashoffset:0}
.motion-design footer .brand:hover svg path{stroke:var(--rose);animation:draw-connection 1s var(--ease-ui)}

@keyframes draw-connection{from{stroke-dashoffset:280}to{stroke-dashoffset:0}}
@keyframes circle-meet-left{from{transform:translateX(-12px)}to{transform:translateX(0)}}
@keyframes circle-meet-right{from{transform:translateX(12px)}to{transform:translateX(0)}}
@keyframes note-line{from{transform:scaleX(.1)}to{transform:scaleX(1)}}
@keyframes offer-stack{from{transform:translateY(12px);opacity:.45}to{transform:translateY(0);opacity:1}}
@keyframes test-emphasis{0%{background:#ffb9dd08;transform:scale(.94)}50%{background:#ffb9dd36}100%{background:#ffb9dd12;transform:scale(1)}}
@keyframes launch-item{from{transform:translateX(-12px);opacity:.3}to{transform:translateX(0);opacity:1}}
@keyframes grow-stack{from{translate:0 12px;opacity:.4}to{translate:0 0;opacity:1}}
@keyframes answer-enter{from{opacity:.4;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
@keyframes preview-enter{from{opacity:.6;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.preview-changing{animation:preview-enter 320ms var(--ease-ui)}
@media(max-width:1100px){
 .motion-design .model-compact{padding:36px;gap:6%}
 .format-feature{grid-template-columns:240px 1fr;gap:24px;padding:32px}
 .format-choice{padding:20px;font-size:18px}
 .process-deck{grid-template-columns:280px 1fr;gap:20px}
 .motion-design .founder-personal .founder-introduction{grid-template-columns:300px 1fr;gap:32px 6%}
 .motion-design .contact{padding:36px;gap:6%}
}
@media(max-width:1000px){
 .process-deck{display:block}
 .process-selector{display:none}
 .motion-design .process-row{grid-template-columns:1fr;min-height:0}
 .format-feature{grid-template-columns:200px 1fr;padding:28px}
 .format-art{transform:scale(.85);transform-origin:center}
 .motion-design .format-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .format-choice{min-height:130px}
 .motion-design .founder-personal .founder-introduction{grid-template-columns:260px 1fr;gap:28px}
}
@media(max-width:760px){
 .motion-design .section{padding-block:64px}
 .motion-design .model-compact{grid-template-columns:1fr;padding:28px 24px;margin-block:28px 0;gap:28px;border-radius:20px}
 .model-copy h2{font-size:29px}
 .partnership-visual{margin-top:24px;max-width:360px}
 .partnership-switch{gap:8px}
 .partnership-switch button{font-size:12px;padding:10px 14px}
 .partnership-orbit{height:100px}
 .orbit-node{width:56px;height:56px}
 #partner-detail{min-height:42px}
 .motion-design .model-terms>p{font-size:16px}
 .motion-design .model-terms .model-note{margin-top:16px}
 .motion-design .model-terms .text-link{margin-top:20px}
 .motion-design .service-grid{grid-template-columns:1fr;gap:14px}
 .service-card{padding:26px;border-radius:16px}
 .service-icon{margin-bottom:20px;width:44px;height:44px}
 .motion-design .service-grid h3{font-size:25px}
 .motion-design .service-grid p{font-size:16px}
 .service-explore{margin-top:20px}
 .motion-design .creator-contribution{padding:84px 24px 24px;grid-template-columns:1fr;gap:20px;margin-top:20px}
 .collaboration-mark{left:24px;top:24px;transform:none}
 .motion-design .creator-fit{grid-template-columns:1fr;gap:28px}
 .motion-design .fit-details article{padding:22px;margin-bottom:10px}
 .motion-design .fit-details article:first-child{padding-top:22px}
 .niche-explorer{padding:24px 20px;border-radius:16px}
 .niche-controls{gap:8px;margin-bottom:20px}
 .niche-controls button{font-size:12px;padding:10px 12px}
 .niche-result{grid-template-columns:1fr;gap:24px;min-height:0}
 .niche-sculpture{width:160px;height:130px}
 .niche-result h3{font-size:27px}
 .niche-result p{font-size:16px;min-height:80px}
 .niche-result small{font-size:11px;margin-top:16px}
 .format-feature{grid-template-columns:1fr;padding:28px 24px;gap:20px;min-height:0}
 .format-art{width:220px;height:220px;transform:scale(.85);margin-block:-12px}
 .format-feature-copy h3{font-size:32px;min-height:76px;margin-bottom:16px}
 .format-feature-copy p{font-size:16px;min-height:108px}
 .motion-design .format-grid{gap:10px;margin-top:12px}
 .format-choice{font-size:17px;min-height:154px;padding:20px 16px;gap:20px}
 .format-choice-arrow{right:14px;top:16px}
 .format-choice-arrow svg{width:14px;height:14px}
 .format-icon svg{width:24px;height:24px}
 .motion-design .process-row{padding:24px 20px;border-radius:16px;gap:18px;margin-bottom:16px}
 .motion-design .process-title{grid-template-columns:26px 1fr;gap:10px}
 .motion-design .process-title h3{font-size:27px}
 .motion-design .process-description>p{font-size:16px}
 .stage-diagram{padding:18px 14px;min-height:146px;margin-top:20px}
 .research-notes{gap:8px}
 .research-notes>span{font-size:10px;padding:14px 8px}
 .offer-blocks{gap:8px}
 .offer-blocks span{font-size:12px;padding:18px 10px}
 .test-path{gap:8px;flex-wrap:wrap}
 .test-path span{font-size:11px;padding:12px}
 .system-path{gap:6px}
 .system-path span{font-size:11px;padding:16px 10px}
 .system-path i{max-width:16px}
 .launch-scene{gap:14px}
 .launch-source{font-size:12px}
 .launch-scene>div{padding-left:14px}
 .launch-scene>div>span{font-size:11px;padding:8px 10px}
 .growth-stack{gap:6px}
 .growth-stack span{font-size:12px;padding:18px 12px}
 .motion-design .process-output{padding:16px;font-size:14px}
 .motion-design .compact-detail-content p{font-size:15px}
 .motion-design .founder-personal .founder-introduction{grid-template-columns:1fr;gap:28px}
 .founder-lenses{margin-top:16px}
 .portrait-signature{font-size:28px;left:26px;bottom:26px}
 .faq-art{display:none}
 .motion-design .faq-list{gap:10px}
 .motion-design .faq-list summary{padding:20px;font-size:16px}
 .motion-design .faq-answer{padding:0 20px 20px}
 .motion-design .contact{padding:28px 24px;gap:32px;border-radius:20px;margin-top:20px}
 .motion-design .contact form{padding:22px 18px}
 .contact-progress{margin-top:28px;grid-template-columns:80px 1fr;gap:14px}
 .contact-orbit{width:80px;height:80px}
 .contact-progress strong{font-size:18px}
 .contact-progress p{font-size:12px}
 .form-progress-dots{margin-top:0}
}
@media(max-width:360px){
 .motion-design .model-compact,.motion-design .contact{padding-inline:20px}
 .service-card{padding:24px 20px}
 .niche-explorer{padding-inline:18px}
 .niche-controls button{padding-inline:10px}
 .format-feature{padding-inline:20px}
 .format-feature-copy h3{font-size:29px}
 .format-choice{font-size:16px;padding-inline:14px}
 .format-choice-arrow{display:none}
 .motion-design .process-row{padding-inline:18px}
 .research-notes>span{font-size:9px;padding-inline:7px}
 .system-path span{padding:14px 8px;font-size:10px}
}
@media(prefers-reduced-motion:reduce){
 .motion-design *, .motion-design *:before,.motion-design *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 .motion-design [data-tilt]{--tilt-x:0deg!important;--tilt-y:0deg!important}
 .service-card:hover,.service-card:focus-visible,.format-choice:hover,.format-choice[aria-pressed=true]{transform:none}
}