:root{
  --sage:#b8c2b6;
  --gold:#c7a25a;
  --cocoa:#251d19;
  --paper:#eeeae2;
}

.brunette-hero{
  min-height:760px;
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(430px,1.08fr);
  border-bottom:1px solid var(--line);
  background:#090a08;
}
.brunette-hero-copy{align-self:center;padding:7rem 5vw 6rem}
.brunette-hero h1,.brunette-copy h2,.brunette-route h2,.brunette-route h3{
  margin:0;
  font-family:"Italiana","Baskerville","Songti SC",serif;
  font-weight:400;
  letter-spacing:0;
}
.brunette-hero h1{max-width:720px;font-size:clamp(3.45rem,6.3vw,7.1rem);line-height:.91}
.brunette-hero h1 em{color:#c39b82;font-weight:400}
.brunette-hero-photo{position:relative;min-width:0;min-height:760px;margin:0;overflow:hidden;border-left:1px solid var(--line)}
.brunette-hero-photo img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 42%}
.brunette-hero-photo figcaption{
  position:absolute;right:0;bottom:0;left:0;display:flex;justify-content:space-between;gap:1rem;
  padding:1rem 1.25rem;background:rgba(10,10,9,.84);color:rgba(241,240,234,.66);
  font-size:.68rem;letter-spacing:.07em;text-transform:uppercase;
}
.brunette-hero-photo strong{color:#dbc5b6;font-weight:500}

.brunette-story{display:grid;grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);gap:5vw;padding-top:8rem;padding-bottom:8rem}
.brunette-copy{position:sticky;top:2rem;align-self:start}
.brunette-copy h2{max-width:560px;margin-bottom:2.4rem;font-size:clamp(2.65rem,4.5vw,5.1rem);line-height:.98}
.brunette-copy p{max-width:560px;margin:0 0 1.05rem;color:rgba(241,240,234,.57);font-size:.84rem;line-height:1.82}
.brunette-copy p strong{color:rgba(241,240,234,.88);font-weight:500}
.brunette-copy .service-meta{margin-top:2rem;padding-top:1rem;border-top:1px solid var(--line);color:#c39b82;font-size:.67rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase}
.brunette-comparison{min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.brunette-photo{min-width:0;margin:0}
.brunette-photo img{width:100%;height:auto;aspect-ratio:3/4;display:block;object-fit:cover}
.brunette-photo figcaption{display:flex;justify-content:space-between;gap:1rem;padding:.9rem 0 0;color:rgba(241,240,234,.47);font-size:.66rem;line-height:1.45}
.brunette-photo figcaption strong{color:#c39b82;font-weight:500;letter-spacing:.1em;text-transform:uppercase}

.brunette-route{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);gap:7vw;padding:8rem 5vw;background:var(--paper);color:var(--ink);border-bottom:1px solid rgba(10,10,9,.15)}
.brunette-route .section-kicker{color:#7b6253}
.brunette-route h2{max-width:620px;font-size:clamp(2.5rem,4.8vw,5.4rem);line-height:.98}
.brunette-route ol{margin:0;padding:0;list-style:none;border-top:1px solid rgba(10,10,9,.2)}
.brunette-route li{display:grid;grid-template-columns:3rem 1fr;gap:1.5rem;padding:1.6rem 0;border-bottom:1px solid rgba(10,10,9,.2)}
.brunette-route li>span{color:#7b6253;font-size:.68rem;letter-spacing:.12em}
.brunette-route h3{margin-bottom:.45rem;font-size:1.5rem}
.brunette-route p{margin:0;color:rgba(10,10,9,.58);font-size:.84rem;line-height:1.75}

.brunette-close{padding:9rem 10vw;background:var(--cocoa);text-align:center}
.brunette-close .case-result-quote{max-width:1040px;margin:0 auto;color:#eadfd5}
.close-note{max-width:700px;margin:2rem auto 0;color:rgba(241,240,234,.5);font-size:.78rem;line-height:1.75}
.brunette-close>a{display:inline-block;margin-top:3rem;padding:.9rem 0;border-bottom:1px solid var(--gold);color:var(--gold);font-size:.68rem;font-weight:500;letter-spacing:.12em;text-decoration:none;text-transform:uppercase}

@media(max-width:900px){
  .brunette-hero{grid-template-columns:1fr;min-height:auto}
  .brunette-hero-copy{padding:5.5rem 6vw 4rem}
  .brunette-hero-photo{min-height:680px;border-left:0;border-top:1px solid var(--line)}
  .brunette-story,.brunette-route{grid-template-columns:1fr;gap:3.5rem}
  .brunette-copy{position:static}
}

@media(max-width:600px){
  .brunette-hero-copy{padding:4.5rem 5vw 3.3rem}
  .brunette-hero h1{font-size:clamp(3rem,15vw,4.35rem)}
  .brunette-hero-photo{min-height:520px}
  .brunette-hero-photo figcaption{align-items:flex-start;flex-direction:column;gap:.35rem}
  .brunette-story{padding-top:5rem;padding-bottom:5rem}
  .brunette-copy h2{font-size:clamp(2.45rem,12vw,3.6rem)}
  .brunette-comparison{grid-template-columns:1fr;gap:2.4rem}
  .brunette-photo figcaption{align-items:flex-start;flex-direction:column;gap:.25rem}
  .brunette-route{padding-top:5rem;padding-bottom:5rem}
  .brunette-route li{grid-template-columns:2rem 1fr;gap:1rem}
  .brunette-close{padding:6rem 5vw}
}

@media(min-width:901px){
  .brunette-hero{width:100%;max-width:1320px;min-height:590px;margin-inline:auto}
  .brunette-hero-copy{padding:4.75rem 4rem}
  .brunette-hero h1{max-width:590px;font-size:clamp(3rem,3.8vw,4.7rem);line-height:.94}
  .brunette-hero-photo{min-height:590px;height:590px}
  .brunette-story{padding-top:5.5rem;padding-bottom:5.5rem}
  .brunette-copy h2{font-size:clamp(2.35rem,3vw,3.65rem)}
  .brunette-photo img{aspect-ratio:4/5}
  .brunette-route{padding:5.5rem max(3rem,calc((100vw - 1280px)/2));gap:5rem}
  .brunette-route h2{font-size:clamp(2.3rem,3.1vw,3.8rem)}
  .brunette-close{padding:6.5rem max(3rem,calc((100vw - 1280px)/2))}
}
