.contact-page{background:#f4f3ee;color:var(--ink)}
.contact-page .site-header{mix-blend-mode:difference}

.contact-opening{padding:clamp(155px,13vw,230px) var(--pad) clamp(125px,11vw,200px);background:#f4f3ee}
.contact-opening-head{display:grid;grid-template-columns:minmax(180px,.7fr) minmax(320px,1.45fr) minmax(260px,.85fr);gap:clamp(28px,4vw,80px);align-items:start}
.contact-kicker,.contact-form-intro>p{margin:7px 0 0;font-size:11px;letter-spacing:.14em;color:#647050}
.contact-opening h2,.contact-form-intro h2{margin:0;font:500 clamp(75px,9.5vw,170px)/.76 "Barlow Condensed",sans-serif;letter-spacing:-.05em;text-transform:uppercase}
.contact-lead{margin:7px 0 0;font-size:clamp(11px,.83vw,14px);line-height:1.8;max-width:440px}
.contact-details{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:clamp(85px,9vw,155px);border-top:1px solid #11130f4a;border-bottom:1px solid #11130f4a}
.contact-details article{min-height:315px;padding:25px clamp(24px,2.5vw,46px) 29px 0;display:flex;flex-direction:column}
.contact-details article+article{padding-left:clamp(24px,2.5vw,46px);border-left:1px solid #11130f4a}
.contact-details span{font-size:11px;letter-spacing:.13em;color:#647050}
.contact-details h3{margin:clamp(55px,5vw,85px) 0 18px;font:500 clamp(28px,2.3vw,43px)/.92 "Barlow Condensed",sans-serif;letter-spacing:-.025em}
.contact-details p{margin:0;font-size:12px;line-height:1.75}
.contact-details article>a{width:max-content;margin-top:auto;padding-bottom:4px;border-bottom:1px solid currentColor;font-size:11px;letter-spacing:.1em;transition:color .3s}
.contact-details a:hover{color:#667a45}

.contact-form-section{display:grid;grid-template-columns:minmax(300px,.82fr) minmax(420px,1.18fr);gap:clamp(60px,8vw,150px);padding:clamp(120px,11vw,200px) var(--pad);background:#e9e9e2}
.contact-form-intro h2{margin-top:clamp(34px,4vw,70px);font-size:clamp(78px,8vw,145px)}
.contact-form-intro>span{display:block;margin-top:35px;font-size:12px;line-height:1.8}
.contact-form{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:38px clamp(25px,3vw,55px);align-self:start;padding-top:7px}
.contact-form label{display:flex;flex-direction:column;gap:13px}
.contact-form label>span{font-size:11px;letter-spacing:.1em}
.contact-form input,.contact-form textarea{width:100%;padding:0 0 14px;border:0;border-bottom:1px solid #11130f69;border-radius:0;outline:0;background:transparent;color:var(--ink);font:400 11px/1.65 "JetBrains Mono",monospace;resize:vertical;transition:border-color .3s}
.contact-form textarea{min-height:112px}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:#11130f75}
.contact-form input:focus,.contact-form textarea:focus{border-color:#11130f}
.contact-form-wide{grid-column:1/-1}
.hp-field{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
#contact-turnstile{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.contact-form-submit{display:flex;align-items:center;justify-content:space-between;gap:30px}
.contact-form-submit p{max-width:240px;margin:0;font-size:10px;line-height:1.6;color:#11130f8a}
.contact-form button{height:54px;padding:0 9px 0 22px;display:flex;align-items:center;gap:38px;border:1px solid #11130f;border-radius:100px;background:transparent;color:var(--ink);font:500 12px/1 "JetBrains Mono",monospace;letter-spacing:.08em;cursor:pointer;transition:background .35s,color .35s,gap .35s}
.contact-form button b{width:35px;height:35px;display:grid;place-items:center;border-radius:50%;background:var(--ink);color:#fff;font-size:14px;transition:background .35s,color .35s}
.contact-form button:hover{gap:49px;background:var(--ink);color:#fff}.contact-form button:hover b{background:var(--lime);color:var(--ink)}

@media(max-width:900px){
  .contact-opening-head{grid-template-columns:1fr}.contact-opening h2{font-size:18vw}.contact-lead{max-width:600px}
  .contact-details{grid-template-columns:1fr}.contact-details article{min-height:250px;padding:24px 0 28px}.contact-details article+article{padding-left:0;border-left:0;border-top:1px solid #11130f4a}.contact-details h3{margin-top:45px}
  .contact-form-section{grid-template-columns:1fr}.contact-form-intro h2{font-size:16vw}
}
@media(max-width:600px){
  .contact-opening{padding:130px 22px 110px}.contact-opening h2{font-size:22vw}.contact-lead{font-size:11px}
  .contact-form-section{padding:100px 22px 115px;gap:70px}.contact-form{grid-template-columns:1fr;gap:34px}.contact-form-wide{grid-column:auto}.contact-form-submit{align-items:flex-start;flex-direction:column}.contact-form button{width:100%;justify-content:space-between}.contact-form-intro h2{font-size:21vw}
}
