/* =====================================================
   ABOUT — HERO
===================================================== */

.about-hero{
position:relative;
height:720px;
min-height:640px;
overflow:hidden;
background:var(--forest-dark);
color:var(--warm-white);
}

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

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

.about-hero-media::after{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(
180deg,
rgba(15,22,17,.42) 0%,
rgba(15,22,17,.14) 32%,
rgba(15,22,17,.08) 100%
),
linear-gradient(
90deg,
rgba(15,22,17,.86) 0%,
rgba(15,22,17,.62) 42%,
rgba(15,22,17,.20) 76%,
rgba(15,22,17,.08) 100%
);
}

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

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

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

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

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


/* =====================================================
   ABOUT — INTRO
===================================================== */

.about-intro{
background:var(--warm-white);
}

.about-intro-grid{
display:grid;
grid-template-columns:260px minmax(0,1fr);
gap:90px;
align-items:start;
}

.about-intro-side{
padding-top:8px;
}

.about-year{
display:block;
font-family:var(--font-display);
font-size:76px;
font-weight:400;
line-height:1;
color:var(--forest);
}

.about-year-label{
display:block;
max-width:180px;
margin-top:16px;
font-size:13px;
line-height:1.6;
letter-spacing:.3px;
color:var(--gray);
}

.about-intro-content{
max-width:850px;
}

.about-intro-content .eyebrow{
margin-bottom:22px;
}

.about-intro-content h2{
max-width:820px;
margin-bottom:30px;
}

.about-intro-content p{
max-width:720px;
margin-bottom:18px;
font-size:16px;
line-height:1.8;
}

.about-intro-content p:last-child{
margin-bottom:0;
}

.about-intro-content .about-intro-lead{
max-width:760px;
margin-bottom:24px;
font-family:var(--font-display);
font-size:25px;
font-weight:400;
line-height:1.5;
color:var(--forest-dark);
}


/* =====================================================
   ABOUT — NUMBERS
===================================================== */

.about-numbers{
background:var(--cream);
border-top:1px solid var(--line);
border-bottom:1px solid var(--line);
}

.about-numbers-grid{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
}

.about-number{
min-height:190px;
padding:42px 32px;
display:flex;
flex-direction:column;
justify-content:space-between;
}

.about-number:first-child{
padding-left:0;
}

.about-number:last-child{
padding-right:0;
}

.about-number + .about-number{
border-left:1px solid var(--line);
}

.about-number strong{
display:block;
font-family:var(--font-display);
font-size:42px;
font-weight:400;
line-height:1;
color:var(--forest);
}

.about-number span{
display:block;
margin-top:30px;
font-size:13px;
line-height:1.55;
color:var(--gray);
}


/* =====================================================
   ABOUT — PRODUCTION
===================================================== */

.about-production{
background:var(--forest);
color:var(--warm-white);
}

.about-production-grid{
display:grid;
grid-template-columns:minmax(380px,.88fr) minmax(0,1.12fr);
gap:88px;
align-items:stretch;
}

.about-production-content{
max-width:560px;
padding:16px 0;
}

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

.about-production h2{
max-width:550px;
margin-bottom:28px;
color:var(--warm-white);
}

.about-production-content > p{
max-width:520px;
margin-bottom:18px;
font-size:16px;
line-height:1.8;
color:rgba(255,255,255,.72);
}

.about-production-list{
margin:38px 0;
border-top:1px solid rgba(255,255,255,.18);
}

.about-production-item{
display:grid;
grid-template-columns:38px minmax(0,1fr);
gap:18px;
padding:18px 0;
border-bottom:1px solid rgba(255,255,255,.18);
}

.about-production-item > span{
padding-top:2px;
font-family:var(--font-display);
font-size:14px;
color:var(--sand);
}

.about-production-item strong{
display:block;
margin-bottom:5px;
font-size:14px;
font-weight:600;
letter-spacing:.2px;
color:var(--warm-white);
}

.about-production-item p{
margin:0;
font-size:14px;
line-height:1.6;
color:rgba(255,255,255,.68);
}

.about-production-media{
position:relative;
width:100%;
min-height:660px;
overflow:hidden;
}

.about-production-media img{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
object-position:center;
display:block;
}


/* =====================================================
   ABOUT — PRINCIPLES
===================================================== */

.about-principles{
background:var(--warm-white);
}

.about-principles .section-heading{
display:grid;
grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);
gap:80px;
align-items:start;
}

.about-principles .section-heading__content{
padding-top:0;
}

.about-principles .section-heading > p{
margin:0;
padding-top:135px;
max-width:520px;
font-size:16px;
line-height:1.75;
}

.about-principles .eyebrow{
margin-bottom:30px;
}

.about-principles .section-heading h2{
margin:0;
}

.about-principles-grid{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
border-top:1px solid var(--line);
border-bottom:1px solid var(--line);
}

.about-principle{
min-width:0;
padding:34px 30px 38px;
}

.about-principle:first-child{
padding-left:0;
}

.about-principle:last-child{
padding-right:0;
}

.about-principle + .about-principle{
border-left:1px solid var(--line);
}

.about-principle-number{
display:block;
margin-bottom:38px;
font-family:var(--font-display);
font-size:15px;
color:var(--wood);
}

.about-principle h3{
max-width:240px;
margin-bottom:18px;
font-family:var(--font-display);
font-size:24px;
font-weight:400;
line-height:1.3;
color:var(--forest-dark);
}

.about-principle p{
max-width:250px;
font-size:14px;
line-height:1.75;
color:var(--gray);
}


/* =====================================================
   ABOUT — PLACE
===================================================== */

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

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

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

.about-place-media::after{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(
90deg,
rgba(15,22,17,.80) 0%,
rgba(15,22,17,.55) 42%,
rgba(15,22,17,.16) 76%,
rgba(15,22,17,.06) 100%
),
linear-gradient(
180deg,
rgba(15,22,17,.04) 0%,
rgba(15,22,17,.26) 100%
);
}

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

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

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

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

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

.about-place-location{
display:flex;
align-items:center;
gap:22px;
margin-top:34px;
padding-top:20px;
border-top:1px solid rgba(255,255,255,.22);
}

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

.about-place-location span + span{
position:relative;
padding-left:22px;
}

.about-place-location span + span::before{
content:"";
position:absolute;
left:0;
top:50%;
width:1px;
height:16px;
background:rgba(255,255,255,.28);
transform:translateY(-50%);
}


/* =====================================================
   ABOUT — ADDRESS
===================================================== */

.about-address{
background:var(--cream);
}

.about-address-grid{
display:grid;
grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);
gap:90px;
align-items:start;
}

.about-address .eyebrow{
margin-bottom:22px;
}

.about-address h2{
max-width:430px;
}

.about-address-content{
border-top:1px solid var(--line);
}

.about-address-row{
display:grid;
grid-template-columns:150px minmax(0,1fr);
gap:30px;
padding:24px 0;
border-bottom:1px solid var(--line);
}

.about-address-row > span{
padding-top:3px;
font-size:12px;
font-weight:500;
letter-spacing:.8px;
text-transform:uppercase;
color:var(--gray);
}

.about-address-row strong,
.about-address-row a{
font-family:var(--font-display);
font-size:21px;
font-weight:400;
line-height:1.45;
color:var(--forest-dark);
}

.about-address-row a{
width:max-content;
max-width:100%;
transition:color var(--transition-fast);
}

.about-address-row a:hover{
color:var(--wood);
}

.about-address-action{
padding-top:34px;
}


/* =====================================================
   ABOUT — SMALL INTERACTIONS
===================================================== */

.about-production-media img{
transition:transform .8s ease;
}

.about-production-media:hover img{
transform:scale(1.02);
}

.about-principle{
transition:background var(--transition-main);
}

.about-principle:hover{
background:rgba(38,53,43,.035);
}