/* /contact: full-width film stage, the brief over its lower edge, then next steps and live work. */
.contact-stage{position:relative;overflow:hidden;background:#fff;color:var(--ink);height:clamp(520px,58vh,42.86vw);min-height:520px;display:flex;align-items:flex-start}
.contact-film{z-index:0}
.contact-film img,.contact-film video{object-position:70% 62%}
.contact-stage::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#fffffff0 0,#ffffffc9 30%,#fff0 58%);pointer-events:none}
.contact-stage-copy{position:relative;z-index:2;padding-top:clamp(44px,7vh,72px)}
.contact-stage .eyebrow{color:var(--ink)}
.contact-stage h1{color:var(--ink);font-size:clamp(50px,6.1vw,104px);line-height:.98}
.contact-stage .intro-copy{max-width:500px;margin-top:22px;color:var(--ink);font-size:19px}

.contact-body{position:relative;z-index:3;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr);gap:72px;align-items:start;margin-top:-132px;padding-bottom:96px}
.contact-body>*{min-width:0}
.contact-body .project-form{border:0;border-top:4px solid var(--red);border-radius:4px;padding:44px 48px 48px;box-shadow:0 30px 70px -20px #11131540}
.contact-direct{margin-top:176px}
.contact-direct .eyebrow{margin-bottom:18px}
.contact-direct .button{display:flex;width:100%;font-size:16px;margin:0}
.contact-direct .contact-email{display:flex;justify-content:space-between;align-items:center;margin:26px 0 0;padding-bottom:14px;font-size:clamp(22px,2vw,28px)}
.contact-direct .contact-person{margin:30px 0 0}
.contact-direct address{margin-top:24px;font-size:14px;font-style:normal;color:var(--muted)}

.contact-next{background:var(--nardo);color:#fff;padding-block:88px}
.contact-next h2{font-size:clamp(38px,4vw,60px)}
.contact-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:44px 0 0;padding:0;list-style:none;counter-reset:step}
.contact-steps li{counter-increment:step;padding:26px 40px 0 0;border-top:1px solid #ffffff73}
.contact-steps li::before{content:counter(step);display:block;margin-bottom:34px;font-size:15px;font-weight:600;color:#fff}
.contact-steps h3{font-size:clamp(23px,2vw,29px);line-height:1.2;color:#fff}
.contact-steps p{margin-top:12px;max-width:340px;font-size:16px;color:#fff}

.contact-live{background:var(--paper);color:var(--ink);padding-block:64px}
.contact-live-head{display:flex;justify-content:space-between;align-items:baseline;gap:24px;margin-bottom:26px}
.contact-live .eyebrow{margin:0;color:var(--ink)}
.contact-live .text-link{flex:none;color:var(--ink);border-color:var(--ink)}
.contact-live ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin:0;padding:0;list-style:none;background:#11131526;border-block:1px solid #11131526}
.contact-live li{background:var(--paper)}
.contact-live li a{display:flex;flex-direction:column;height:100%;padding:24px 24px 24px 0;color:var(--ink)}
.contact-live li+li a{padding-left:24px}
.contact-live li a:hover{background:#fff;color:var(--ink)}
.contact-live strong{font-size:22px;font-weight:500;letter-spacing:-.02em}
.contact-live li span{margin-top:6px;font-size:15px;line-height:1.45;color:var(--muted)}
.contact-live small{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:18px;font-size:14px}

@media(max-width:1100px){
 .contact-body{grid-template-columns:minmax(0,1.5fr) minmax(0,.85fr);gap:40px}
 .contact-body .project-form{padding:34px}
}
@media(max-width:900px){
 .contact-stage{display:block;height:auto;min-height:0}
 .contact-film{position:relative;display:block;aspect-ratio:21/9}
 .contact-stage::after{display:none}
 .contact-stage-copy{padding-block:26px 150px}
 .contact-stage h1{font-size:clamp(46px,10vw,72px)}
 .contact-stage .intro-copy{font-size:17px;margin-top:16px}
 .contact-body{display:block;margin-top:-118px;padding-bottom:64px}
 .contact-direct{margin-top:44px}
 .contact-direct .button{margin:0}
 .contact-next{padding-block:64px}
 .contact-steps{grid-template-columns:minmax(0,1fr);margin-top:30px}
 .contact-steps li{padding:20px 0 28px;display:grid;grid-template-columns:34px minmax(0,1fr)}
 .contact-steps li::before{margin:3px 0 0;grid-row:span 2}
 .contact-steps p{margin-top:8px;max-width:none}
 .contact-live{padding-block:52px}
 .contact-live-head{flex-direction:column;gap:12px}
 .contact-live ul{grid-template-columns:minmax(0,1fr)}
 .contact-live li a,.contact-live li+li a{padding:20px 0}
}
@media(max-width:600px){
 .contact-body .project-form{padding:26px 22px 28px}
 .contact-direct .contact-email{font-size:22px}
}