:root {
  --maroon:#420f0f;
  --orange:#f9543b;
  --terracotta:#fb9453;
  --gray:#bdc3c7;
  --black:#000;
  --cobalt:#3d57a3;
  --paper:#fff;
  --line:#dce0e2;
  --body:#494043
}

* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:110px
}
body {
  margin:0;
  background:var(--paper);
  color:var(--maroon);
  font-family:Montserrat,Arial,sans-serif;
  -webkit-font-smoothing:antialiased
}
a {
  color:inherit;
  text-decoration:none
}
button,a,summary {
  -webkit-tap-highlight-color:transparent
}
a:focus-visible,summary:focus-visible {
  outline:3px solid var(--cobalt);
  outline-offset:6px
}
img {
  display:block;
  max-width:100%;
  height:auto
}
p {
  font-size:16px;
  line-height:1.85
}
h1,h2,h3,p {
  margin:0
}
h1,h2 {
  font-family:'Paytone One',Arial,sans-serif;
  font-weight:400;
  letter-spacing:-.035em;
  line-height:1.08
}
h1 {
  font-size:clamp(52px,6.6vw,100px)
}
h2 {
  font-size:clamp(40px,4.6vw,68px)
}
.eyebrow {
  display:block;
  font-family:'Montserrat Alternates',Montserrat,sans-serif;
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  line-height:1.7;
  font-weight:500
}
.site-header {
  height:108px;
  padding:0 5.5%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  background:white;
  position:relative;
  z-index:2;
  border-bottom:1px solid #f0eeee
}
.brand {
  display:inline-flex;
  flex-shrink:0
}
.brand img {
  width:229px
}
.site-header nav {
  display:flex;
  gap:34px;
  margin-left:auto;
  font-size:13px;
  font-weight:600
}
.site-header nav a {
  padding:14px 0
}
.site-header nav a:hover,footer>a:hover {
  color:var(--orange)
}
.button {
  min-height:52px;
  padding:16px 23px;
  background:var(--maroon);
  color:white;
  border-radius:5px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:32px;
  font-size:13px;
  font-weight:600;
  transition:background .2s,transform .2s
}
.button:hover {
  background:#641b1b;
  transform:translateY(-2px)
}
.button span {
  font-size:21px;
  line-height:1
}
.header-cta {
  background:var(--orange);
  color:var(--maroon)
}
.header-cta:hover {
  background:var(--terracotta)
}
.hero {
  min-height:610px;
  display:grid;
  grid-template-columns:1fr 1fr;
  position:relative;
  overflow:hidden
}
.hero-copy {
  padding:88px 0 80px 11%;
  position:relative;
  z-index:1
}
.hero .eyebrow {
  margin-bottom:32px;
  display:flex;
  align-items:center;
  gap:12px
}
.hero .eyebrow i {
  width:9px;
  height:9px;
  border:2px solid var(--orange);
  transform:rotate(45deg)
}
.hero h1 {
  white-space:nowrap
}
.hero p {
  font-size:21px;
  max-width:390px;
  line-height:1.55;
  margin:24px 0 28px
}
.hero .explore {
  display:flex;
  gap:22px;
  font-size:11px;
  font-weight:600;
  width:fit-content;
  margin-top:35px;
  padding:8px 0
}
.hero-art {
  position:relative;
  min-width:0
}
.hero-art img {
  position:absolute;
  height:100%;
  width:110%;
  max-width:none;
  object-fit:cover;
  object-position:25% center;
  left:-4%
}
.stats {
  background:var(--orange);
  padding:40px 5.5%
}
.stats dl {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin:0
}
.stats dl>div {
  display:flex;
  flex-direction:column-reverse;
  align-items:center;
  justify-content:center;
  border-right:1px solid #420f0f45;
  gap:5px
}
.stats dl>div:last-child {
  border:0
}
.stats dt {
  font-size:12px;
  font-weight:600;
  line-height:1.5;
  text-align:center
}
.stats dd {
  margin:0;
  font-family:'Paytone One',sans-serif;
  font-size:46px;
  line-height:1.1;
  letter-spacing:-.04em
}
.stats dd span {
  font-size:.8em
}
.section {
  padding:100px 5.5%
}
.section-heading {
  display:grid;
  grid-template-columns:1.2fr 1fr;
  align-items:end;
  gap:9%;
  margin-bottom:52px
}
.section-heading .eyebrow {
  margin-bottom:24px
}
.section-heading p {
  color:var(--body);
  max-width:470px;
  padding-bottom:5px
}
.service-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  column-gap:38px;
  align-items:start
}
.service {
  border-top:1px solid var(--line)
}
.service summary {
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:14px;
  min-height:100px;
  list-style:none;
  padding:22px 0
}
.service summary::-webkit-details-marker {
  display:none
}
.service-number {
  font-size:10px;
  color:var(--cobalt);
  font-weight:600;
  flex-shrink:0
}
.service h3 {
  font-size:15px;
  font-weight:500;
  line-height:1.5
}
.service-toggle {
  font-size:23px;
  color:var(--maroon);
  margin-left:auto;
  padding-left:5px
}
.service summary:hover h3 {
  color:#a52919
}
.service[open] {
  border-top-color:var(--orange)
}
.service-copy {
  padding:0 10px 30px 29px
}
.service-copy p {
  font-size:13px;
  line-height:1.8;
  color:var(--body);
  margin-bottom:14px
}
.service-copy a {
  font-size:12px;
  font-weight:700;
  display:inline-block;
  padding:10px 0
}
.about {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10%;
  background:#f6f7f7
}
.about .eyebrow {
  margin-bottom:22px
}
.about-intro>p {
  margin-top:28px;
  max-width:500px;
  color:var(--body)
}
.about-art {
  margin:55px 0 0 40px;
  width:95px;
  height:95px;
  border:22px solid var(--orange);
  border-right-color:var(--maroon);
  border-radius:20px;
  transform:rotate(45deg)
}
.about-stories article {
  border-top:1px solid #ced2d4;
  padding:25px 0 32px
}
.about-stories .eyebrow {
  color:var(--cobalt);
  margin:0 0 10px
}
.about h3 {
  font-family:'Paytone One',sans-serif;
  font-size:25px;
  font-weight:400;
  margin-bottom:12px
}
.about-stories p {
  font-size:14px;
  color:var(--body)
}
.contact {
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:9%;
  position:relative
}
.contact .eyebrow {
  margin-bottom:24px
}
.contact h2 {
  margin-bottom:25px
}
.contact>div>p {
  max-width:450px;
  color:var(--body);
  margin-bottom:30px
}
.contact-details {
  font-style:normal;
  padding-top:18px
}
.contact-details>div {
  border-bottom:1px solid var(--line);
  padding:24px 0
}
.contact-details .eyebrow {
  font-size:10px;
  color:var(--body);
  margin-bottom:12px
}
.contact-details a {
  font-size:clamp(16px,1.7vw,24px);
  display:flex;
  justify-content:space-between;
  gap:12px;
  line-height:1.5;
  overflow-wrap:anywhere
}
.contact-details a:hover {
  color:#a52919
}
.contact-details p {
  font-size:18px;
  line-height:1.6
}
.contact-details .map-link {
  font-size:12px;
  display:inline-flex;
  gap:22px;
  margin-top:15px;
  padding:6px 0
}
footer {
  padding:36px 5.5%;
  border-top:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px
}
footer .brand img {
  width:160px
}
footer p,footer>a {
  font-size:11px
}
footer>a {
  padding:12px 0
}
.skip-link {
  position:fixed;
  top:-100px;
  left:20px;
  z-index:10;
  background:var(--maroon);
  color:white;
  padding:15px
}
.skip-link:focus {
  top:10px
}

@media(min-width:1600px) {
  .site-header,.section,footer {
  padding-left:max(5.5%,calc((100vw - 1440px)/2));
  padding-right:max(5.5%,calc((100vw - 1440px)/2))
}
.hero-copy {
  padding-left:max(11%,calc((100vw - 1440px)/2))
}
.hero {
  min-height:680px
}

}

@media(max-width:1050px) {
  .site-header {
  height:95px;
  gap:22px
}
.brand img {
  width:190px
}
.site-header nav {
  gap:23px
}
.header-cta {
  display:none
}
.hero {
  min-height:540px
}
.hero-copy {
  padding-top:70px
}
.hero h1 {
  font-size:clamp(50px,6.5vw,64px)
}
.hero p {
  font-size:18px;
  max-width:280px
}
.section {
  padding-top:75px;
  padding-bottom:75px
}
.service-grid {
  column-gap:24px
}
.service h3 {
  font-size:13px
}
.about {
  gap:7%
}
.stats dd {
  font-size:40px
}

}

@media(max-width:700px) {
  html {
  scroll-padding-top:20px
}
.site-header {
  height:auto;
  min-height:100px;
  padding:22px 6% 16px;
  flex-wrap:wrap;
  gap:14px
}
.brand img {
  width:174px
}
.site-header nav {
  width:100%;
  margin:0;
  justify-content:space-between;
  gap:12px;
  font-size:12px
}
.site-header nav a {
  padding:8px 0
}
.hero {
  display:flex;
  flex-direction:column;
  min-height:0
}
.hero-copy {
  padding:45px 6% 12px
}
.hero .eyebrow {
  font-size:10px;
  margin-bottom:22px
}
.hero h1 {
  font-size:clamp(45px,10.8vw,72px);
  white-space:normal
}
.hero p {
  font-size:18px;
  max-width:330px;
  margin:20px 0 24px
}
.hero .explore {
  position:absolute;
  bottom:-36px;
  left:6%;
  z-index:2;
  background:white;
  padding:8px 12px 8px 0;
  margin:0
}
.hero-art {
  height:330px;
  margin-top:10px;
  overflow:hidden
}
.hero-art img {
  width:100%;
  height:120%;
  top:-5%;
  left:10%;
  object-position:center
}
.stats {
  padding:30px 6%
}
.stats dl {
  grid-template-columns:1fr 1fr;
  gap:24px 0
}
.stats dl>div {
  padding:0 8px
}
.stats dl>div:nth-child(2) {
  border:0
}
.stats dd {
  font-size:36px
}
.stats dt {
  font-size:10px
}
.section {
  padding:60px 6%
}
.section-heading {
  display:block;
  margin-bottom:30px
}
.section-heading .eyebrow {
  margin-bottom:20px
}
h2 {
  font-size:43px
}
.section-heading p {
  margin-top:24px;
  font-size:14px
}
.service-grid {
  grid-template-columns:1fr
}
.service summary {
  min-height:78px;
  padding:20px 0
}
.service h3 {
  font-size:16px
}
.service-copy p {
  font-size:14px
}
.about {
  grid-template-columns:1fr;
  gap:44px
}
.about-intro>p {
  font-size:14px
}
.about-art {
  display:none
}
.about-stories article:last-child {
  padding-bottom:0
}
.contact {
  grid-template-columns:1fr;
  gap:24px
}
.contact-details {
  padding:0
}
.contact-details a {
  font-size:19px
}
.contact-details p {
  font-size:17px
}
footer {
  padding:30px 6%;
  flex-wrap:wrap
}
footer .brand {
  width:100%
}
footer p {
  font-size:10px
}
footer>a {
  font-size:10px
}
.contact>div>p {
  font-size:14px
}

}

@media(prefers-reduced-motion:reduce) {
  html {
  scroll-behavior:auto
}
*,*::before,*::after {
  transition:none!important;
  animation:none!important
}

}