.motionlab-page { background: #fafbf7; color: #172823; }
.motionlab-page h1, .motionlab-page h2, .motionlab-page h3, .motionlab-page p, .motionlab-page figure, .motionlab-page dl, .motionlab-page dd { margin: 0; }
.motionlab-page h1, .motionlab-page h2, .motionlab-page h3 { text-wrap: balance; }
.motionlab-page:lang(ja) h1, .motionlab-page:lang(ja) h2, .motionlab-page:lang(ja) h3 { text-wrap: wrap; }
.motionlab-page:lang(ko) h1, .motionlab-page:lang(ko) h2, .motionlab-page:lang(ko) h3 { word-break: keep-all; overflow-wrap: break-word; }
.motionlab-page p { line-height: 1.85; }
.motionlab-page .motion-label { font-size: 11px; font-weight: 700; letter-spacing: .13em; line-height: 1.6; }
.motionlab-page .motion-small { font-size: 12px; line-height: 1.8; }
.motionlab-page .motion-intro { padding: 54px 0 42px; background: #090f18; color: #f3f7f5; }
.motionlab-page .motion-identity { display: flex; align-items: center; margin-bottom: 54px; }
.motionlab-page .motion-identity img { width: 46px; height: 46px; margin-right: 14px; border-radius: 12px; }
.motionlab-page .motion-identity strong { display: block; font-size: 15px; line-height: 1.5; }
.motionlab-page .motion-identity span { display: block; color: #afc2bd; font-size: 11px; }
.motionlab-page .motion-opening { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 44px; }
.motionlab-page .motion-headline { width: 55%; }
.motionlab-page .motion-intro .motion-label { color: #6ce9be; margin-bottom: 18px; }
.motionlab-page h1 { font-size: 60px; line-height: 1.13; letter-spacing: -.04em; font-weight: 650; }
.motionlab-page .motion-invitation { width: 38%; padding-bottom: 4px; }
.motionlab-page .motion-invitation > p:first-child { font-size: 16px; color: #c5d3d0; }
.motionlab-page .motion-links { display: flex; flex-wrap: wrap; align-items: center; margin: 23px 0 14px; }
.motionlab-page .motion-links a { display: inline-flex; justify-content: center; align-items: center; min-height: 46px; margin: 0 12px 10px 0; padding: 10px 19px; border: 1px solid transparent; border-radius: 30px; font-size: 12px; font-weight: 700; text-decoration: none; transition: background-color .2s, color .2s; }
.motionlab-page .motion-links .motion-primary { background: #72ecc2; color: #10261e; }
.motionlab-page .motion-links .motion-primary:hover { background: #adffdf; }
.motionlab-page .motion-links .motion-secondary { border-color: #536760; color: #e6f4ef; }
.motionlab-page .motion-links .motion-secondary:hover { background: #1e342d; }
.motionlab-page a:focus-visible, .motionlab-page summary:focus-visible { outline: 3px solid #239770; outline-offset: 5px; }
.motionlab-page .motion-intro .motion-small { color: #a5b9b3; }
.motionlab-page .motion-screen img { display: block; width: 100%; height: auto; image-orientation: from-image; border: 1px solid #2c3b3b; border-radius: 16px; }
.motionlab-page .motion-screen figcaption { max-width: 850px; margin: 15px auto 0; color: #a7b9b4; font-size: 11px; line-height: 1.8; text-align: center; }
.motionlab-page .motion-overview { display: flex; justify-content: space-between; margin-top: 40px; }
.motionlab-page .motion-overview > div { width: 30%; border-top: 1px solid #34423e; padding-top: 20px; }
.motionlab-page .motion-overview h2 { font-size: 16px; margin-bottom: 7px; }
.motionlab-page .motion-overview p { color: #aabfb7; font-size: 12px; }
.motionlab-page .motion-workflow, .motionlab-page .motion-studio, .motionlab-page .motion-exports, .motionlab-page .motion-plans, .motionlab-page .motion-questions { padding: 86px 0; scroll-margin-top: 110px; }
.motionlab-page .motion-section-heading { max-width: 760px; margin-bottom: 42px; }
.motionlab-page .motion-section-heading .motion-label { color: #45735d; margin-bottom: 15px; }
.motionlab-page h2 { font-size: 38px; line-height: 1.3; letter-spacing: -.025em; }
.motionlab-page .motion-section-heading > p:last-child { margin-top: 20px; color: #597066; font-size: 15px; }
.motionlab-page .motion-steps { display: flex; justify-content: space-between; list-style: none; padding: 0; margin: 0; }
.motionlab-page .motion-steps li { width: 29%; border-top: 1px solid #c3d0c5; padding-top: 22px; }
.motionlab-page .motion-step-number { font-size: 13px; color: #53775f; font-variant-numeric: tabular-nums; }
.motionlab-page .motion-steps h3 { font-size: 21px; line-height: 1.5; margin: 18px 0 13px; }
.motionlab-page .motion-steps p { color: #597066; font-size: 14px; }
.motionlab-page .motion-studio { background: #eaf0e8; }
.motionlab-page .motion-controls { display: flex; justify-content: space-between; }
.motionlab-page .motion-controls article { width: 47%; background: #f9fcf6; border: 1px solid #d5e1d3; border-radius: 20px; padding: 32px; }
.motionlab-page .motion-marker { font-size: 10px; font-family: ui-monospace, monospace; color: #47795e; letter-spacing: .06em; }
.motionlab-page .motion-controls h3 { font-size: 23px; line-height: 1.45; margin: 22px 0 16px; }
.motionlab-page .motion-controls article > p:last-child { color: #587061; font-size: 14px; }
.motionlab-page .motion-studio .motion-small { max-width: 850px; color: #587061; margin-top: 24px; }
.motionlab-page .motion-exports { background: #101821; color: #f3f7f5; }
.motionlab-page .motion-exports .motion-label { color: #72ecc2; }
.motionlab-page .motion-exports .motion-section-heading > p:last-child { color: #b1c3bc; }
.motionlab-page .motion-formats { display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 28px; }
.motionlab-page .motion-formats > div { width: 31%; margin-bottom: 24px; padding: 19px 0; border-top: 1px solid #3d4e4b; }
.motionlab-page .motion-formats dt { font-size: 24px; line-height: 1.4; font-weight: 600; color: #83efd0; }
.motionlab-page .motion-formats dd { margin-top: 8px; font-size: 12px; line-height: 1.7; color: #c2d1ca; }
.motionlab-page .motion-export-notes { display: flex; justify-content: space-between; margin-top: 32px; }
.motionlab-page .motion-export-notes p { width: 47%; font-size: 12px; color: #aabeb4; }
.motionlab-page .motion-local { background: #d9ebde; padding: 65px 0; }
.motionlab-page .motion-local .inner { display: flex; justify-content: space-between; }
.motionlab-page .motion-local .inner > div:first-child { width: 38%; }
.motionlab-page .motion-local .inner > div:last-child { width: 52%; }
.motionlab-page .motion-local .motion-label { color: #43745b; margin-bottom: 16px; }
.motionlab-page .motion-local .motion-small { margin-top: 18px; color: #4e6c59; }
.motionlab-page .motion-plan-options { display: flex; justify-content: space-between; }
.motionlab-page .motion-plan-options article { width: 48%; padding: 34px; border: 1px solid #cbdace; border-radius: 20px; }
.motionlab-page .motion-free { background: #e9f3e7; }
.motionlab-page .motion-creator { background: #fff; }
.motionlab-page .motion-plan-options h3 { font-size: 14px; color: #43684f; }
.motionlab-page .motion-plan-value { font-size: 30px; font-weight: 650; line-height: 1.3; letter-spacing: -.02em; margin-top: 28px; }
.motionlab-page .motion-plan-duration { font-size: 13px; margin-top: 8px; color: #41684e; }
.motionlab-page .motion-plan-options article > p:nth-last-child(2) { margin-top: 25px; font-size: 14px; color: #546b5b; }
.motionlab-page .motion-plan-note { margin-top: 26px; padding-top: 21px; border-top: 1px solid #cbdace; font-size: 12px; color: #41614d; }
.motionlab-page .motion-questions { padding-top: 0; }
.motionlab-page .motion-answers details { border-top: 1px solid #ced9ce; }
.motionlab-page .motion-answers details:last-child { border-bottom: 1px solid #ced9ce; }
.motionlab-page .motion-answers summary { cursor: pointer; padding: 22px 0; font-size: 16px; font-weight: 600; }
.motionlab-page .motion-answers details p { max-width: 890px; margin: 0 0 25px; color: #586f60; font-size: 14px; }
.motionlab-page .motion-closing { padding: 67px 0 58px; background: #203e31; color: #f2fbf5; }
.motionlab-page .motion-closing h2 { max-width: 780px; }
.motionlab-page .motion-closing p { margin-top: 20px; color: #c5decd; }
.motionlab-page .motion-resources { display: flex; flex-wrap: wrap; list-style: none; padding: 0; margin: 18px 0 0; }
.motionlab-page .motion-resources li { margin-right: 24px; }
.motionlab-page .motion-resources a { display: inline-block; padding: 10px 0; color: #d1e8d8; font-size: 12px; text-underline-offset: 4px; }
@media (max-width: 1100px) {
  .motionlab-page h1 { font-size: 48px; }
  .motionlab-page .motion-invitation > p:first-child { font-size: 14px; }
  .motionlab-page .motion-links a { margin-right: 6px; padding: 10px 15px; }
}
@media (max-width: 760px) {
  .motionlab-page .motion-intro { padding: 34px 0; }
  .motionlab-page .motion-identity { margin-bottom: 38px; }
  .motionlab-page .motion-opening { display: block; margin-bottom: 24px; }
  .motionlab-page .motion-headline, .motionlab-page .motion-invitation { width: 100%; }
  .motionlab-page h1 { font-size: 43px; line-height: 1.15; max-width: 600px; }
  .motionlab-page .motion-invitation { margin-top: 24px; }
  .motionlab-page .motion-invitation > p:first-child { font-size: 15px; }
  .motionlab-page .motion-screen img { border-radius: 9px; }
  .motionlab-page .motion-screen figcaption { text-align: left; font-size: 10px; }
  .motionlab-page .motion-overview { display: block; margin-top: 28px; }
  .motionlab-page .motion-overview > div { width: 100%; padding-top: 14px; margin-top: 18px; }
  .motionlab-page .motion-overview h2 { font-size: 14px; margin-bottom: 4px; }
  .motionlab-page .motion-workflow, .motionlab-page .motion-studio, .motionlab-page .motion-exports, .motionlab-page .motion-plans, .motionlab-page .motion-questions { padding: 55px 0; }
  .motionlab-page h2 { font-size: 30px; }
  .motionlab-page .motion-section-heading { margin-bottom: 30px; }
  .motionlab-page .motion-section-heading > p:last-child { font-size: 14px; }
  .motionlab-page .motion-steps, .motionlab-page .motion-controls, .motionlab-page .motion-export-notes, .motionlab-page .motion-local .inner, .motionlab-page .motion-plan-options { display: block; }
  .motionlab-page .motion-steps li { width: 100%; margin-top: 27px; padding-top: 18px; }
  .motionlab-page .motion-steps h3 { margin-top: 12px; }
  .motionlab-page .motion-controls article { width: 100%; padding: 24px; margin-top: 18px; }
  .motionlab-page .motion-controls h3 { font-size: 21px; }
  .motionlab-page .motion-formats > div { width: 47%; margin-bottom: 10px; }
  .motionlab-page .motion-formats dt { font-size: 22px; }
  .motionlab-page .motion-export-notes p { width: 100%; margin-top: 18px; }
  .motionlab-page .motion-local { padding: 45px 0; }
  .motionlab-page .motion-local .inner > div:first-child, .motionlab-page .motion-local .inner > div:last-child { width: 100%; }
  .motionlab-page .motion-local .inner > div:last-child { margin-top: 24px; font-size: 14px; }
  .motionlab-page .motion-plan-options article { width: 100%; padding: 26px; margin-top: 20px; }
  .motionlab-page .motion-plan-value { font-size: 29px; margin-top: 22px; }
  .motionlab-page .motion-questions { padding-top: 0; }
  .motionlab-page .motion-closing { padding: 48px 0 38px; }
}
@media (max-width: 380px) {
  .motionlab-page h1 { font-size: 37px; }
  .motionlab-page .motion-label { font-size: 10px; letter-spacing: .08em; }
}
@media (prefers-reduced-motion: reduce) {
  .motionlab-page .motion-links a { transition: none; }
}