/* =====================================================
   CONTACTS — HERO
===================================================== */

.contacts-hero{
position:relative;
height:680px;
min-height:620px;
overflow:hidden;
background:var(--forest-dark);
color:var(--warm-white);
}

.contacts-hero-media{
position:absolute;
inset:0;
}

.contacts-hero-media img{
width:100%;
height:100%;
object-fit:cover;
object-position:center;
display:block;
}

.contacts-hero-media::after{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(
180deg,
rgba(15,22,17,.46) 0%,
rgba(15,22,17,.16) 34%,
rgba(15,22,17,.10) 100%
),
linear-gradient(
90deg,
rgba(15,22,17,.88) 0%,
rgba(15,22,17,.64) 42%,
rgba(15,22,17,.24) 76%,
rgba(15,22,17,.10) 100%
);
}

.contacts-hero .container{
position:relative;
z-index:2;
height:100%;
display:flex;
align-items:center;
padding-top:var(--header-height);
}

.contacts-hero-content{
width:100%;
max-width:820px;
padding:70px 0;
}

.contacts-hero .eyebrow{
margin-bottom:26px;
color:var(--sand);
}

.contacts-hero h1{
max-width:820px;
margin-bottom:28px;
font-size:64px;
line-height:1.08;
color:var(--warm-white);
}

.contacts-hero-content p{
max-width:620px;
font-size:18px;
line-height:1.75;
color:rgba(255,255,255,.78);
}


/* =====================================================
   CONTACTS — MAIN
===================================================== */

.contacts-main{
background:var(--warm-white);
}

.contacts-main-grid{
display:grid;
grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);
gap:100px;
align-items:start;
}

.contacts-main-intro{
max-width:460px;
}

.contacts-main-intro .eyebrow{
margin-bottom:22px;
}

.contacts-main-intro h2{
max-width:430px;
margin-bottom:28px;
}

.contacts-main-intro p{
max-width:410px;
font-size:16px;
line-height:1.8;
color:var(--gray);
}


/* =====================================================
   CONTACTS — LIST
===================================================== */

.contacts-list{
border-top:1px solid var(--line);
}

.contact-row{
display:grid;
grid-template-columns:150px minmax(0,1fr);
gap:36px;
padding:32px 0;
border-bottom:1px solid var(--line);
}

.contact-label{
padding-top:7px;
font-size:12px;
font-weight:500;
line-height:1.4;
letter-spacing:.9px;
text-transform:uppercase;
color:var(--wood);
}

.contact-value{
min-width:0;
}

.contact-main-link{
display:inline-block;
max-width:100%;
margin-bottom:12px;
font-family:var(--font-display);
font-size:28px;
font-weight:400;
line-height:1.35;
color:var(--forest-dark);
transition:
color var(--transition-fast),
transform var(--transition-fast);
}

a.contact-main-link:hover{
color:var(--wood);
}

.contact-address{
font-size:25px;
}

.contact-value p{
max-width:540px;
margin:0;
font-size:14px;
line-height:1.75;
color:var(--gray);
}


/* =====================================================
   CONTACTS — PROJECT INFO
===================================================== */

.contacts-project{
background:var(--cream);
border-top:1px solid var(--line);
}

.contacts-project-grid{
display:grid;
grid-template-columns:minmax(300px,.78fr) minmax(0,1.22fr);
gap:100px;
align-items:start;
}

.contacts-project .eyebrow{
margin-bottom:22px;
}

.contacts-project h2{
max-width:500px;
}

.contacts-project-list{
border-top:1px solid var(--line);
}

.contacts-project-item{
display:grid;
grid-template-columns:64px minmax(0,1fr);
gap:26px;
padding:26px 0;
border-bottom:1px solid var(--line);
}

.contacts-project-item > span{
padding-top:3px;
font-family:var(--font-display);
font-size:15px;
color:var(--wood);
}

.contacts-project-item h3{
margin-bottom:8px;
font-family:var(--font-display);
font-size:23px;
font-weight:400;
line-height:1.3;
color:var(--forest-dark);
}

.contacts-project-item p{
max-width:560px;
margin:0;
font-size:14px;
line-height:1.75;
color:var(--gray);
}


/* =====================================================
   CONTACTS — PLACE
===================================================== */

.contacts-place{
position:relative;
height:680px;
overflow:hidden;
background:var(--forest-dark);
color:var(--warm-white);
}

.contacts-place-media{
position:absolute;
inset:0;
}

.contacts-place-media img{
width:100%;
height:100%;
object-fit:cover;
object-position:center;
display:block;
}

.contacts-place-media::after{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(
90deg,
rgba(15,22,17,.82) 0%,
rgba(15,22,17,.58) 42%,
rgba(15,22,17,.18) 76%,
rgba(15,22,17,.06) 100%
),
linear-gradient(
180deg,
rgba(15,22,17,.06) 0%,
rgba(15,22,17,.30) 100%
);
}

.contacts-place .container{
position:relative;
z-index:2;
height:100%;
display:flex;
align-items:flex-end;
padding-bottom:72px;
}

.contacts-place-content{
max-width:650px;
}

.contacts-place .eyebrow{
margin-bottom:22px;
color:var(--sand);
}

.contacts-place h2{
max-width:620px;
margin-bottom:24px;
font-size:50px;
line-height:1.12;
color:var(--warm-white);
}

.contacts-place p{
max-width:570px;
font-size:16px;
line-height:1.75;
color:rgba(255,255,255,.76);
}

.contacts-place-address{
margin-top:34px;
padding-top:20px;
border-top:1px solid rgba(255,255,255,.22);
}

.contacts-place-address span{
font-size:12px;
font-weight:500;
letter-spacing:1px;
text-transform:uppercase;
color:var(--sand);
}


/* =====================================================
   CONTACTS — ACTION
===================================================== */

.contacts-action{
background:var(--warm-white);
}

.contacts-action-grid{
display:grid;
grid-template-columns:minmax(300px,.82fr) minmax(0,1.18fr);
gap:100px;
align-items:start;
}

.contacts-action .eyebrow{
margin-bottom:22px;
}

.contacts-action h2{
max-width:560px;
}

.contacts-action-content{
max-width:650px;
padding-top:44px;
}

.contacts-action-content > p{
max-width:600px;
margin-bottom:34px;
font-size:17px;
line-height:1.8;
color:var(--gray);
}

.contacts-action-buttons{
display:flex;
align-items:center;
flex-wrap:wrap;
gap:14px;
}


/* =====================================================
   CONTACTS — SECONDARY BUTTON
===================================================== */

.contacts-action .btn-secondary{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:52px;
padding:14px 24px;
border:1px solid var(--line-dark);
background:transparent;
color:var(--forest-dark);
font-size:14px;
font-weight:500;
transition:
background var(--transition-fast),
color var(--transition-fast),
border-color var(--transition-fast);
}

.contacts-action .btn-secondary:hover{
background:var(--forest);
border-color:var(--forest);
color:var(--warm-white);
}


/* =====================================================
   CONTACTS — SMALL INTERACTIONS
===================================================== */

.contacts-project-item{
transition:
background var(--transition-main),
padding-left var(--transition-main),
padding-right var(--transition-main);
}

.contacts-project-item:hover{
padding-left:18px;
padding-right:18px;
background:rgba(38,53,43,.035);
}

.contacts-place-media img,
.contacts-hero-media img{
transition:transform 1s ease;
}

.contacts-place:hover .contacts-place-media img{
transform:scale(1.015);
}