/* ==== motion-brand-v2.css ==== */
/* The signal atmosphere belongs to the whole viewport, behind the page. */

/* Koopper: metallic geometry, generous artwork and three distinct chapters. */
.koopper-studio{--case-text:#f0f2f3;--case-muted:#b9c0ca;max-width:1320px}.koopper-studio.case-refined .koopper-opening{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:80px;margin-bottom:0}.koopper-studio .case-heading{border:0;padding:0}.koopper-studio.case-refined h1{font-size:clamp(48px,6vw,86px);line-height:1.05}.koopper-studio .case-kicker{letter-spacing:.15em}.koopper-studio .case-lead{max-width:500px;font-size:16px;line-height:1.9}.koopper-studio.case-refined .koopper-stage{background:radial-gradient(ellipse at var(--studio-x,50%) var(--studio-y,50%),#ffffff,#e9ecf0);}.koopper-pulse{display:flex;gap:7px;align-items:center;height:40px;margin-top:35px;opacity:.4}.koopper-pulse i{display:block;width:2px;height:calc(12px + var(--bar)*2px);background:#d8e2ee;transform-origin:center;animation:studio-pulse calc(3s + var(--bar)*.13s) ease-in-out infinite alternate;animation-delay:calc(var(--bar)*-.37s)}@keyframes studio-pulse{from{transform:scaleY(.4)}to{transform:scaleY(1)}}.studio-paused .koopper-pulse i{animation-play-state:paused}
.koopper-studio.case-refined #project-modules{display:block}.koopper-studio .case-view-hint{margin-bottom:45px}.koopper-studio .case-prose{border:0;margin:0 0 45px!important}.koopper-studio .case-content .module-text{margin:0!important}.koopper-chapter{display:grid;grid-template-columns:240px minmax(0,1fr);gap:60px;padding:50px 0 70px;border-top:1px solid #b0c5de30}.koopper-label{line-height:1.8;text-transform:uppercase;letter-spacing:.12em;color:#a5b4c5}.koopper-chapter h2{font:300 clamp(28px,3vw,40px)/1.25 nqdy,Arial,sans-serif;letter-spacing:-.025em;color:#edf1f5;margin:18px 0}.koopper-deck{min-width:0}.koopper-studio.case-refined .case-content .case-media{padding:0!important;border:0;background:none}.koopper-studio .koopper-deck .case-prose{margin:22px 0 0!important}.koopper-studio.case-refined .case-content .grid--main{gap:25px!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}.koopper-variants .grid__item-container:not(:first-child){background:#080a0d;padding:25px;border:1px solid #b0c5de22}.koopper-studio.case-refined .koopper-banners .grid--main{grid-template-columns:1fr!important}.koopper-banners .grid__item-container{background:#f0f0f0;padding:0}.koopper-studio .koopper-banners img{width:100%!important;max-height:none!important}.koopper-labs .grid__item-container{border:1px solid #b0c5de25;background:#1b1d21}.koopper-studio .koopper-labs img{width:100%!important;max-height:none!important}
@media(max-width:1000px){.koopper-studio.case-refined .koopper-opening{gap:40px}.koopper-chapter{grid-template-columns:180px minmax(0,1fr);gap:30px}}
@media(max-width:760px){.koopper-studio.case-refined .koopper-opening{grid-template-columns:1fr;gap:35px;}.koopper-chapter{grid-template-columns:1fr;gap:25px;padding:30px 0 45px}.koopper-chapter h2{font-size:32px;max-width:420px}.koopper-chapter header p{margin:0}.koopper-studio.case-refined .case-content .grid--main{grid-template-columns:1fr!important}.koopper-studio .case-index{margin-block:30px}.koopper-pulse{margin-top:20px}}
@media(prefers-reduced-motion:reduce){.koopper-pulse i{animation:none!important}}

.koopper-opening .koopper-stage{grid-column:auto!important;min-width:0;width:100%!important}

.koopper-studio .grid__item-container{box-sizing:border-box!important}
.koopper-studio .koopper-variants img{width:100%!important;height:auto!important;max-height:none!important}

/* ==== koopper-stage-v1.css ==== */
/* KOOPPER: folded-plane stage for the horizontal logo, echoing the brand's banner geometry */
.koopper-studio.case-refined .koopper-opening{display:block;padding:20px 0 50px}
.koopper-studio.case-refined .koopper-stage{position:relative;isolation:isolate;display:grid;place-items:center;align-content:center;gap:30px;min-height:clamp(320px,54svh,580px);padding:clamp(48px,7vw,96px) clamp(20px,5vw,72px)!important;background:radial-gradient(ellipse at var(--studio-x,50%) var(--studio-y,42%),#3b3f45 0%,#1c1e22 52%,#0f1013 100%);border:1px solid #b0c5de1f;box-shadow:none}
.koopper-folds{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.koopper-folds i{position:absolute;display:block;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.koopper-folds i:nth-child(1){left:-4%;top:0;width:34%;height:100%;background:linear-gradient(160deg,#2d3035,#141518);clip-path:polygon(0 0,100% 0,36% 100%,0 100%)}
.koopper-folds i:nth-child(2){left:20%;top:-12%;width:15%;height:82%;background:linear-gradient(200deg,#4b5057,#24272b);clip-path:polygon(0 0,100% 10%,24% 100%)}
.koopper-folds i:nth-child(3){right:-3%;top:0;width:31%;height:100%;background:linear-gradient(205deg,#2a2d31,#121316);clip-path:polygon(42% 0,100% 0,100% 100%,0 100%)}
.koopper-folds i:nth-child(4){right:21%;bottom:-6%;width:11%;height:72%;background:linear-gradient(20deg,#e6e9ed,#868c94);clip-path:polygon(72% 0,100% 100%,0 100%);opacity:.09}
.koopper-folds i:nth-child(5){left:40%;bottom:0;width:22%;height:34%;background:linear-gradient(0deg,#202327,#30343a);clip-path:polygon(50% 0,100% 100%,0 100%);opacity:.75}
.koopper-folds i:nth-child(6){inset:0;background:linear-gradient(105deg,transparent 42%,#ffffff0e 50%,transparent 58%);background-size:260% 100%;animation:koopper-sweep 11s ease-in-out infinite}
@keyframes koopper-sweep{from{background-position:120% 0}to{background-position:-20% 0}}
.koopper-stage:hover .koopper-folds i:nth-child(2){transform:translate(-6px,4px)}
.koopper-stage:hover .koopper-folds i:nth-child(4){transform:translate(6px,-4px)}
.studio-paused .koopper-folds i{animation-play-state:paused}
.koopper-mark{cursor:zoom-in}
.koopper-studio.case-refined .koopper-opening .koopper-stage .koopper-mark img{display:block;width:100%!important;height:auto!important;aspect-ratio:1920/509;max-height:none!important;filter:drop-shadow(0 18px 40px #000a)}
.koopper-tagline{display:flex;align-items:center;gap:18px;margin:0;font:300 clamp(11px,1.1vw,14px)/1.4 nqdy,Arial,sans-serif;letter-spacing:.42em;text-transform:uppercase;color:#c9d0d8}
.koopper-tagline::before,.koopper-tagline::after{content:"";width:48px;height:1px;background:#c9d0d860}
.koopper-studio .koopper-opening .case-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 80px;align-items:end;margin-top:46px}
.koopper-studio.case-refined .koopper-opening h1{font-weight:200;letter-spacing:.2em;margin-bottom:0}
.koopper-studio .koopper-opening .case-lead{margin-top:0}
.koopper-studio.case-refined .koopper-variants .grid--main{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.koopper-studio .koopper-variants .grid__item-container:first-child{grid-column:auto;background:#f4f5f6;padding:25px;border:1px solid #b0c5de22}
@media(max-width:760px){
.koopper-studio.case-refined .koopper-opening{padding:10px 0 35px}
.koopper-studio.case-refined .koopper-stage{min-height:300px;gap:22px}
.koopper-tagline{letter-spacing:.24em;text-align:center}
.koopper-tagline::before,.koopper-tagline::after{display:none}
.koopper-studio .koopper-opening .case-heading{grid-template-columns:1fr;margin-top:30px}
.koopper-studio.case-refined .koopper-opening h1{letter-spacing:.12em}
.koopper-studio.case-refined .koopper-variants .grid--main{grid-template-columns:1fr!important}
}
@media(prefers-reduced-motion:reduce){.koopper-folds i{animation:none!important;}}

/* ==== Type floor ==== */
/* koopper-stage-v1.css */
.koopper-tagline { font-size: clamp(12px, 1.1vw, 14px); }
/* motion-brand-v2.css */
.koopper-label,
.koopper-studio .case-kicker { font-size: 12px; }
/* project-experiences-v4.css */
@media (max-width: 760px) {
  .case-onward { font-size: 12px; }
  .case-shell .case-lead { font-size: 14px; }
}