/* User-directed floating composition; existing actual project screens. */
.clients-section{padding:76px 0 32px;border-top:1px solid var(--line);overflow:hidden;background:#f5f6f4}
.client-heading{text-align:center;padding:0 24px}.client-heading .section-kicker{justify-content:center;margin-bottom:20px}.client-heading h2{font-size:32px;letter-spacing:-1.2px;font-weight:550}.client-heading>p:last-child{font-size:13px;color:var(--muted);margin-top:16px;line-height:1.8}
.client-marquees{margin-top:48px;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.client-lane{overflow:hidden;padding:16px 0}.client-track{display:flex;width:max-content;animation:client-travel 42s linear infinite;will-change:transform}.client-set{display:flex;align-items:center;gap:100px;padding-right:100px;flex-shrink:0}.client-name{display:flex;align-items:center;justify-content:center;width:220px;height:80px;flex-shrink:0}.client-logo{display:block;width:180px;height:64px;object-fit:contain}.client-lg .client-logo{width:144px}.client-hyundai .client-logo{width:190px;height:80px}.client-iic .client-logo{width:190px;height:54px}.client-gentle .client-logo{width:220px}.client-samsung .client-logo{width:160px}.client-controls{display:flex;justify-content:center;margin-top:28px}
.motion-toggle{display:inline-flex;gap:8px;align-items:center;min-height:44px;background:transparent;color:var(--muted);font-size:11px;padding:0 8px;white-space:nowrap}.motion-toggle>span{font-size:15px}.motion-toggle:hover{color:var(--ink)}
.floating-section{padding:100px 0 84px;overflow:hidden;background:radial-gradient(ellipse at 48% 48%,#e9eee9 0,transparent 64%),var(--bg)}
.floating-heading,.floating-bottom,.all-projects{max-width:1200px;margin-left:auto;margin-right:auto}.floating-heading{display:flex;justify-content:space-between;align-items:flex-end;padding:0 0 20px;gap:40px}.floating-heading h2{font-size:50px;font-weight:550;line-height:1.2;letter-spacing:-2px}.floating-copy>p{font-size:14px;line-height:1.9;color:var(--muted)}.floating-tools{display:flex;gap:22px;align-items:center;margin-top:20px}.floating-tools .work-total{font-size:10px}
.floating-gallery{padding:20px 0 24px;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.float-lane{overflow:hidden;padding:26px 0 30px}.float-track{display:flex;width:max-content;animation:work-travel 120s linear infinite;will-change:transform}.float-set{display:flex;align-items:center;gap:32px;padding-right:32px;flex-shrink:0}
.float-card{width:clamp(240px,25vw,360px);flex-shrink:0;animation:work-float var(--float-time) ease-in-out var(--delay) infinite alternate;transform:rotate(var(--tilt));will-change:transform}.float-card:nth-child(3n+2){width:clamp(220px,22vw,320px)}.float-card:nth-child(3n){width:clamp(260px,28vw,400px)}
.float-link{display:block;padding:7px;background:#fff;border:1px solid #e3e7e3;border-radius:9px;box-shadow:0 8px 16px -12px #17352230,0 22px 32px -25px #15332360;transition:box-shadow .2s}.float-screen{aspect-ratio:3/2;overflow:hidden;background:#eee;border-radius:4px}.float-screen img{width:100%;height:100%;object-fit:contain}.float-caption{display:flex;align-items:center;gap:8px;padding:12px 7px 5px;font-size:11px;line-height:1.5}.float-caption>span:first-child{font-weight:600}.float-caption small{font-size:9px;color:var(--muted);margin-left:auto}.float-caption>span:last-child{margin-left:6px;font-size:15px;color:var(--muted)}
.lane-2 .float-track{animation-direction:reverse;animation-duration:138s}.lane-3 .float-track{animation-duration:150s}.lane-2{margin-left:-100px}.lane-3{margin-left:-180px}
.floating-bottom{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:24px}.all-work-link{font-size:13px;display:flex;align-items:center;gap:32px;min-height:44px}.all-projects{margin-top:28px;border-top:1px solid var(--line)}.all-projects summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;padding:22px 0;min-height:64px;font-size:13px}.all-projects summary::-webkit-details-marker{display:none}.all-projects[open] summary>span{transform:rotate(45deg)}.work-index{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 32px}.work-index a{display:flex;align-items:center;gap:12px;border-top:1px solid var(--line);min-height:64px;font-size:13px}.work-index small{font-size:10px;color:var(--muted);margin-left:auto}.work-index a>span:last-child{color:var(--muted)}
@keyframes client-travel{to{transform:translateX(-50%)}}
@keyframes work-travel{from{transform:translateX(-4%)}to{transform:translateX(-54%)}}
@keyframes work-float{from{transform:translateY(-9px) rotate(var(--tilt))}to{transform:translateY(9px) rotate(calc(var(--tilt) * -.4))}}
.showcase-paused .float-track,.showcase-paused .float-card,.showcase-paused .client-track{animation-play-state:paused}
.floating-gallery:focus-within .float-track,.floating-gallery:focus-within .float-card{animation-play-state:paused}
@media(hover:hover) and (pointer:fine){.floating-gallery:hover .float-track,.floating-gallery:hover .float-card,.client-marquees:hover .client-track{animation-play-state:paused}.float-link:hover{box-shadow:0 12px 32px -12px #17352238}.work-index a:hover{color:var(--green)}}
@media(max-width:1280px){.floating-heading,.floating-bottom,.all-projects{margin-left:48px;margin-right:48px}}
@media(max-width:1000px){.floating-heading,.floating-bottom,.all-projects{margin-left:32px;margin-right:32px}.floating-heading h2{font-size:42px}.floating-tools{gap:8px;flex-wrap:wrap}.floating-copy>p{font-size:13px}}
@media(max-width:760px){.clients-section{padding-top:56px}.client-heading h2{font-size:28px}.client-heading>p:last-child{font-size:11px}.client-marquees{margin-top:28px}.client-set{gap:48px;padding-right:48px}.client-name{width:170px;height:68px}.client-logo{max-width:150px;height:56px}.client-hyundai .client-logo{height:68px}.client-iic .client-logo{width:150px;height:48px}.client-gentle .client-logo{max-width:170px}.client-lane{padding:14px 0}.client-controls{margin-top:12px}.floating-section{padding:64px 0 60px}.floating-heading,.floating-bottom,.all-projects{margin-left:24px;margin-right:24px}.floating-heading{display:block;padding:0}.floating-heading h2{font-size:36px;letter-spacing:-1.5px}.floating-copy>p{margin-top:22px}.floating-tools{justify-content:space-between;margin-top:16px}.floating-gallery{padding-top:4px;padding-bottom:4px;mask-image:linear-gradient(90deg,transparent,#000 2%,#000 98%,transparent)}.float-card{width:218px}.float-card:nth-child(3n+2){width:192px}.float-card:nth-child(3n){width:236px}.float-set{gap:20px;padding-right:20px}.float-lane{padding:20px 0}.float-caption{padding:9px 3px 3px;font-size:10px}.float-caption small{font-size:8px}.float-caption>span:last-child{font-size:12px}.lane-2{margin-left:-72px}.lane-3{margin-left:-132px}.floating-bottom{display:block;margin-top:16px}.all-work-link{margin-top:16px;justify-content:space-between}.work-index{grid-template-columns:1fr}.all-projects{margin-top:16px}}
@media(prefers-reduced-motion:reduce){.float-track,.float-card,.client-track{animation:none!important;transform:none;will-change:auto}.float-copy,.client-set[aria-hidden=true]{display:none}.float-lane,.client-lane{overflow-x:auto;margin-left:0}.float-lane{padding-left:24px;padding-right:24px}.motion-toggle{display:none}.client-marquees{mask-image:none}.client-set{gap:24px;padding:0 24px}.floating-gallery{mask-image:none}}
