.fiber-motion{height:230svh;background:#0d2d2a;color:#fff;position:relative}.motion-pin{position:sticky;top:0;min-height:100svh;display:grid;grid-template-columns:43% 57%;align-items:center;gap:2vw;padding:8vh max(5vw,24px);overflow:hidden}.motion-copy{max-width:560px}.motion-copy h2{font-size:clamp(2.6rem,5vw,5.5rem);line-height:1.28;letter-spacing:-.06em;margin:25px 0}.motion-copy h2 span{color:#f4b570}.motion-copy>p:not(.eyebrow){color:#d2e4db;line-height:1.9}.motion-chapters{display:flex;gap:7px;margin:28px 0}.motion-chapters button{font:700 .78rem "DM Sans",sans-serif;color:#e3eada;background:transparent;border:1px solid #ffffff5c;border-radius:100px;padding:10px 12px;cursor:pointer}.motion-chapters button span{font-family:"Noto Sans Thai",sans-serif}.motion-chapters button[aria-pressed=true]{background:#f4b570;border-color:#f4b570;color:#17362d}.motion-copy label{display:block;color:#d5e5d7;font-size:.77rem;margin-bottom:8px}.motion-copy input{display:block;width:100%;accent-color:#f4a35c;cursor:pointer}.motion-resume{background:none;color:#f4b570;border:0;border-bottom:1px solid #f4b570;padding:0 0 3px;font:700 .8rem "Noto Sans Thai",sans-serif;cursor:pointer;margin:12px 0}.motion-copy small{display:block;color:#b7c8bb;line-height:1.8;font-size:.7rem;margin-top:20px}.motion-view{position:relative;aspect-ratio:16/10;border:1px solid #42605a;border-radius:25px;overflow:hidden;background:radial-gradient(circle,#26736b,#0d2425 72%);box-shadow:0 30px 90px #0005}.motion-view img,.motion-view canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.motion-view canvas[hidden]{display:none}.motion-view>span{position:absolute;left:20px;bottom:17px;font:700 .65rem "DM Sans",sans-serif;letter-spacing:.13em;color:#fff;background:#092726aa;border:1px solid #ffffff55;border-radius:100px;padding:8px 11px}@media(max-width:900px){.fiber-motion{height:auto}.motion-pin{position:relative;top:auto;min-height:0;grid-template-columns:1fr;padding:70px 6%;gap:30px}.motion-copy{max-width:none}.motion-view{aspect-ratio:16/10}.motion-copy h2{font-size:3rem}}@media(max-width:560px){.motion-chapters{flex-wrap:wrap}.motion-chapters button{font-size:.7rem;padding:8px}.motion-view{aspect-ratio:16/11}.motion-copy h2{font-size:2.6rem}}@media(prefers-reduced-motion:reduce){.fiber-motion{height:auto}.motion-pin{position:relative;top:auto;min-height:0}}
