/* ==========================================================================
   Somnium Development Group: shared stylesheet
   Sizing: 1rem = 10 "design pixels". The live site was designed on a 1200px
   desktop canvas and a 320px mobile canvas, and scales both to the window.
   The root font-size below reproduces that scaling, so every measurement in
   this file is simply the design value / 10.
   ========================================================================== */

@font-face {
  font-family: "Glacial Indifference Regular";
  src: url("/assets/fonts/glacialindifference-regular-webfont.woff") format("woff");
  font-display: swap;
}
@font-face {
  font-family: "Glacial Indifference Bold";
  src: url("/assets/fonts/glacialindifference-bold-webfont.woff") format("woff");
  font-display: swap;
}

:root {
  --navy: #0f192a;
  --slate: #53687f;
  --black: #000000;
  --white: #fefefe;
  --gray-light: #d9d9d9;
  --offwhite: #ecebe8;
  --gray: #636363;
  --form-band: #9ba4b4;

  --f-reg: "Glacial Indifference Regular", "Helvetica Neue", Arial, sans-serif;
  --f-bold: "Glacial Indifference Bold", "Helvetica Neue", Arial, sans-serif;
  --f-hg: "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;
}

/* Root scale: desktop canvas 1200 wide, mobile canvas 320 wide (switch at 768px, like the live site). */
html { font-size: 10px; background: #fff; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
@media (min-width: 768px) and (max-width: 1199.98px) { html { font-size: calc(100vw / 120); } }
@media (max-width: 767.98px) { html { font-size: min(calc(100vw / 32), 16px); } }

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
  background: #fff;
  color: var(--black);
  font-family: var(--f-reg);
  font-size: 1.7rem;
  line-height: 1.5;
  overflow-x: hidden;
}
img { display: block; max-width: none; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
h1, h2, h3, h4, p { font-weight: inherit; font-size: inherit; }

/* Canvas wrappers */
.wrap { width: 120rem; margin-inline: auto; }
@media (max-width: 767.98px) { .wrap { width: 32rem; } }

/* Visibility helpers (desktop-only / mobile-only content, as on the live site) */
@media (min-width: 768px) { .m-only { display: none !important; } }
@media (max-width: 767.98px) { .d-only { display: none !important; } }

.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}
:focus-visible { outline: 2px solid var(--slate); outline-offset: 2px; }

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */
.btn {
  display: flex; align-items: center; justify-content: center;
  padding: 1rem 2rem;
  font-family: var(--f-reg); font-size: 1.4rem; line-height: 1.8;
  letter-spacing: .1em; text-transform: uppercase; text-align: center;
  color: #fff;
  transition: background-color .5s, opacity .5s;
}
.btn > span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-height: fit-content; }
.btn--primary { background: var(--slate); }
.btn--primary:hover { background: var(--navy); }
.btn--secondary { background: var(--navy); color: var(--white); }
.btn--secondary:hover { background: var(--gray); }
.btn--hover-gray:hover { background: var(--gray); }
.btn--hover-slate:hover { background: var(--slate); }
.btn--tight { padding-inline: 1rem; }
.is-faded { opacity: .7; }
@media (max-width: 767.98px) {
  .btn--primary { font-size: 1.1rem; }
  .btn--secondary { font-size: 1.2rem; }
}

/* --------------------------------------------------------------------------
   Photo sections: photo sits on black at a set opacity. "Fixed" photos stay
   still while the page scrolls over them (clip-path keeps each one inside
   its own section).
   -------------------------------------------------------------------------- */
.has-bg { display: grid; background: #000; clip-path: inset(0); }
.has-bg > * { grid-area: 1 / 1; }
.has-bg > .inner { position: relative; z-index: 1; }
.bg { background-size: cover; background-position: center; background-repeat: no-repeat; opacity: var(--o, 1); }
.bg--fixed { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; z-index: 0; }

/* --------------------------------------------------------------------------
   Header (overlays the first section, scrolls with the page)
   -------------------------------------------------------------------------- */
.site-header { position: relative; z-index: 10; height: 0; }
.site-header__bar { display: flex; align-items: flex-start; }
.site-logo { display: block; flex: none; margin: 3.9rem 0 0 4rem; width: 26.4rem; height: 9.1rem; }
.site-logo img, .footer-logo img { width: 100%; height: 100%; object-fit: contain; }
.site-nav { display: flex; align-items: flex-start; margin: 0 2.9rem 0 auto; }
.site-nav__link {
  margin-top: 7.5rem; height: 1.7rem;
  font-family: var(--f-reg); font-size: 1.4rem; line-height: 1.4;
  letter-spacing: .1em; text-transform: uppercase; text-align: center; color: var(--white);
}
.site-nav__link--about { width: 6.4rem; }
.site-nav__link--services { width: 8.5rem; margin-left: 4.1rem; }
.site-nav__link--projects { width: 8.6rem; margin-left: 4.1rem; }
.site-nav__cta { margin: 5.7rem 0 0 2.5rem; width: 19.8rem; height: 5.4rem; }
.menu-toggle { display: none; }

@media (max-width: 767.98px) {
  .site-logo { margin: .9rem 0 0 1.9rem; width: 12.6rem; height: 4.3rem; }
  .site-nav { display: none; }
  .menu-toggle {
    display: flex; align-items: center; justify-content: center;
    margin: .9rem 0 0 auto; width: 6rem; height: 4.3rem;
  }
  .menu-toggle svg { width: 4.3rem; height: 4.3rem; fill: var(--gray-light); }
}

/* Mobile menu: full-width navy panel that slides in from the right */
.mobile-menu {
  position: fixed; top: 0; left: 0; z-index: 1000;
  width: 100%; height: 63.3rem;
  display: none; flex-direction: column; align-items: center;
  background: var(--navy);
}
.mobile-menu.is-open { display: flex; animation: slideInRight .5s both; }
.mobile-menu.is-closing { display: flex; animation: slideOutRight .5s both; }
.mobile-menu__close { align-self: flex-end; margin: 1.4rem 2.1rem 0 0; width: 2.7rem; height: 3.1rem; display: flex; align-items: center; justify-content: center; }
.mobile-menu__close svg { width: 2.7rem; height: 2.7rem; fill: var(--white); }
.mobile-menu__links { display: flex; flex-direction: column; align-items: center; gap: 2.25rem; margin-top: 7.3rem; }
.mobile-menu__links a {
  display: block; height: 2.5rem;
  font-family: var(--f-hg); font-weight: 500; font-size: 1.4rem; line-height: 1.4;
  letter-spacing: .1em; text-transform: uppercase; color: var(--white);
  transition: color .5s;
}
.mobile-menu__links a:hover { color: var(--gray); }
@media (min-width: 768px) { .mobile-menu { display: none !important; } }
@keyframes slideInRight { from { transform: translate3d(100%, 0, 0); visibility: visible; } to { transform: translate3d(0, 0, 0); } }
@keyframes slideOutRight { from { transform: translate3d(0, 0, 0); } to { visibility: hidden; transform: translate3d(100%, 0, 0); } }
@media (prefers-reduced-motion: reduce) { .mobile-menu.is-open, .mobile-menu.is-closing { animation-duration: .01s; } }

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.site-footer { background: var(--navy); color: #fff; }
.footer-nav { display: flex; width: 120rem; margin-inline: auto; padding: 3rem 0 0 6.7rem; gap: 14.8rem; }
.footer-nav a {
  width: 9.2rem; height: 2rem;
  font-family: var(--f-reg); font-size: 1.5rem; line-height: 1.4;
  letter-spacing: .1em; text-transform: uppercase; text-align: center; color: #fff;
}
.footer-nav a:nth-child(4) { width: 10.7rem; }
.footer-rule { height: .1rem; min-height: 1px; background: #fff; margin-top: 2.3rem; }
.footer-logo { display: block; width: 53.7rem; height: 18.3rem; margin: 5.5rem auto 0; }
.footer-rule--bottom { margin-top: 7rem; }
.footer-bottom {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: start;
  padding: 2.4rem 0;
  font-family: var(--f-reg); font-size: 1.1rem; line-height: 1.8; letter-spacing: .04em; color: #fff;
}
.footer-copy { grid-column: 2; width: 37.3rem; height: 1.8rem; text-align: center; }
.footer-legal { grid-column: 3; justify-self: end; display: flex; gap: 3.5rem; margin-right: 2.2rem; }
.footer-legal a { height: 1.8rem; text-align: right; }
.footer-legal a:first-child { width: 15.3rem; }
.footer-legal a:last-child { width: 8.6rem; }

@media (max-width: 767.98px) {
  .footer-nav { width: auto; flex-direction: column; align-items: center; padding: 2.9rem 0 0; gap: 2.5rem; }
  .footer-nav a, .footer-nav a:nth-child(4) { width: 15.3rem; height: 1.7rem; font-size: 1.3rem; }
  .footer-rule { margin-top: 4.9rem; }
  .footer-logo { width: 28.3rem; height: 9.6rem; margin-top: 6.7rem; }
  .footer-rule--bottom { margin-top: 8.1rem; }
  .footer-bottom { display: flex; flex-direction: column; align-items: center; gap: .5rem; padding: 2.2rem 0 1.4rem; font-size: 1rem; }
  .footer-copy { width: 30.8rem; height: 2.7rem; }
  .footer-legal { flex-direction: column; align-items: center; gap: .5rem; margin: 0; }
  .footer-legal a, .footer-legal a:first-child, .footer-legal a:last-child { width: auto; height: 2.7rem; text-align: center; }
}

/* --------------------------------------------------------------------------
   Shared text styles
   -------------------------------------------------------------------------- */
.t-white { color: var(--white); }
.t-hg5 { font-family: var(--f-hg); font-weight: 500; }
.t-hg7 { font-family: var(--f-hg); font-weight: 700; }
.t-bold { font-family: var(--f-bold); }
.t-cap { text-transform: capitalize; }
.t-upper { text-transform: uppercase; letter-spacing: .1em; }
.t-uc { text-transform: uppercase; }
.fw-normal { font-weight: 400; }
.t-center { text-align: center; }

/* ==========================================================================
   HOME
   ========================================================================== */
.home-hero { min-height: 75.8rem; }
.home-hero .bg { background-image: url("/assets/images/web/bernd-dittrich-evzncqmzh3e-unsplash.webp"); --o: .7; }
.home-hero .wrap { padding-top: 22.5rem; text-align: center; }
.home-hero h1 { margin-inline: auto; width: 99.7rem; height: 14.2rem; font-size: 4.4rem; line-height: 1; }
.home-hero__tagline { margin: 7rem auto 0; width: 114.1rem; height: 9.1rem; font-size: 2.4rem; line-height: 1.5; }
.home-hero__btns { display: flex; margin-top: 6.8rem; padding-left: 25.1rem; gap: 8.7rem; }
.home-hero__btns .btn { width: 30.3rem; height: 5.7rem; }

.pain { background: var(--gray-light); min-height: 52rem; text-align: center; }
.pain .wrap { padding-top: 5rem; }
.pain h2 { margin-left: 6.8rem; width: 105.9rem; height: 7.7rem; font-size: 4.8rem; line-height: 1; }
.pain__copy { margin-left: 8.5rem; width: 103.1rem; font-size: 3rem; line-height: 1.2; }

.solution { background: var(--white); min-height: 54rem; }
.solution .wrap { display: flex; align-items: flex-start; }
.solution__media {
  flex: none; margin: 4.8rem 0 0 4.2rem; width: 46.2rem; height: 46.8rem;
  background: url("/assets/images/web/buckler_creek_site_plan_website.webp") no-repeat;
  background-size: 196.386%; background-position: 4.318% 92.404%;
}
.solution__body { flex: none; margin-left: 3.6rem; width: 64.5rem; padding-top: 1.2rem; }
.solution h2 { margin-left: .9rem; width: 62.7rem; height: 11.3rem; font-size: 4.8rem; line-height: 1; }
.solution__copy { margin-top: 1.3rem; height: 28.7rem; font-size: 3rem; line-height: 1.2; text-align: center; }
.solution__btns { display: flex; align-items: flex-start; margin-top: .6rem; padding-left: 2.4rem; }
.solution__btns .btn { height: 4.5rem; }
.solution__btns .btn--secondary { width: 27.5rem; }
.solution__btns .btn--primary { width: 24.3rem; margin-left: 8.2rem; }

.handle { min-height: 69rem; }
.handle .bg { background-image: url("/assets/images/web/pexels-rdne-5922202.webp"); --o: .7; }
.handle .bg.m-only { background-image: url("/assets/images/web/pexels-pavel-danilyuk-7937323.webp"); --o: .6; }
.handle .wrap { padding-top: 5.7rem; }
.handle__group { margin-left: 5.9rem; width: 78.1rem; height: 55.2rem; }
.handle__eyebrow { width: 62.3rem; height: 3.2rem; font-size: 2.2rem; line-height: 1.5; }
.handle h2 { margin-top: 2.9rem; width: 62.9rem; height: 20.9rem; font-size: 5.5rem; line-height: 1.3; }
.handle__copy { margin-top: 3.6rem; width: 51rem; height: 24.6rem; font-size: 2.4rem; line-height: 1.5; }

.svc-cards { background: var(--offwhite); min-height: 110rem; }
.svc-cards .wrap { display: flex; align-items: flex-start; gap: 3.2rem; padding: 15.4rem 0 0 6rem; }
.svc-card { display: flex; flex-direction: column; width: 52.4rem; height: 80.1rem; padding: 1.7rem 1.6rem 0; background: #fff; }
.svc-card img { width: 49.2rem; height: 30.6rem; object-fit: cover; }
.svc-card h3 {
  margin: 3.4rem auto 0; width: 39.3rem; height: 7.8rem;
  font-family: var(--f-hg); font-weight: 500; font-size: 2.4rem; line-height: 1.5;
  letter-spacing: .1em; text-transform: uppercase; text-align: center; color: var(--navy);
}
.svc-card p { margin: 2.3rem auto 0; width: 42.1rem; height: 24.6rem; font-size: 2rem; line-height: 1.5; text-align: center; }
.svc-card .btn { margin: auto auto 5.2rem; width: 18rem; height: 4.5rem; }
.svc-card--civil h3 { margin-top: 3.6rem; width: 36.4rem; }
.svc-card--civil p { width: 37.5rem; height: 21.1rem; }

.trust { background: var(--navy); min-height: 92.6rem; }
.trust .wrap { padding-top: 18.1rem; }
.trust__box { margin-left: 6.1rem; width: 107.8rem; height: 60.5rem; padding-top: 5.5rem; background: var(--slate); text-align: center; color: var(--white); }
.trust__eyebrow { margin-inline: auto; width: 48.5rem; height: 3.2rem; font-size: 2.2rem; line-height: 1.5; }
.trust h2 { margin: 3.9rem auto 0; width: 74.8rem; height: 16.3rem; font-size: 4rem; line-height: 1.3; }
.trust__copy { margin: 1.4rem auto 0; width: 95.4rem; height: 16.7rem; font-size: 2.2rem; line-height: 1.3; }
.trust__btns { display: flex; margin-top: 4.7rem; padding-left: 20.7rem; gap: 30.5rem; }
.trust__btns .btn { width: 18rem; height: 5.9rem; }
.trust__btns .btn + .btn { width: 19.5rem; }

.home-cta { min-height: 81.4rem; }
.home-cta .bg { background-image: url("/assets/images/web/pexels-pixabay-271667.webp"); --o: .5; }
.home-cta .wrap { padding-top: 12.4rem; text-align: center; }
.home-cta h2 { margin-left: 6.5rem; width: 107.3rem; height: 22.3rem; font-size: 8.5rem; line-height: 1.2; }
.home-cta__copy { margin: 9.3rem 0 0 25.7rem; width: 68.9rem; height: 6.6rem; font-size: 3.4rem; line-height: 1.5; }
.home-cta__btns { display: flex; align-items: flex-start; margin-top: 11.1rem; padding-left: 25.7rem; }
.home-cta__btns .btn--secondary { width: 29.3rem; height: 6.4rem; }
.home-cta__btns .btn--primary { width: 23.1rem; height: 6.2rem; margin: .2rem 0 0 10.3rem; }

@media (max-width: 767.98px) {
  .home-hero { min-height: 62.3rem; }
  .home-hero .wrap { padding-top: 9.9rem; }
  .home-hero h1 { width: 30.9rem; height: 22.1rem; font-size: 3.7rem; }
  .home-hero__tagline { margin-top: 2.8rem; width: 30rem; height: 6.5rem; font-size: 1.5rem; }
  .home-hero__btns { flex-direction: column; align-items: center; margin-top: 4.6rem; padding: 0; gap: 4rem; }
  .home-hero__btns .btn--secondary { width: 26.4rem; height: 4.2rem; }
  .home-hero__btns .btn--primary { width: 17.5rem; height: 4rem; }

  .pain { min-height: 65rem; }
  .pain .wrap { padding-top: 2.8rem; }
  .pain h2 { margin-inline: auto; width: 24.9rem; height: 12.4rem; font-size: 3rem; }
  .pain__copy { margin-inline: auto; width: 25.7rem; font-size: 2.4rem; }

  .solution { min-height: 101rem; }
  .solution .wrap { flex-direction: column; align-items: center; }
  .solution__body { display: contents; }
  .solution h2 { order: 1; margin: 3.5rem auto 0; width: 28.8rem; height: 13.3rem; font-size: 3rem; text-align: center; }
  .solution__media { order: 2; margin: 0 auto; width: 26.2rem; height: 27.4rem; }
  .solution__copy { order: 3; margin: 2.2rem auto 0; width: 25.7rem; height: 37.5rem; font-size: 2.4rem; }
  .solution__btns { order: 4; flex-direction: column; align-items: center; margin-top: .7rem; padding: 0; }
  .solution__btns .btn--secondary { width: 26.4rem; height: 4.2rem; }
  .solution__btns .btn--primary { width: 17.5rem; height: 4rem; margin: 2.3rem 0 0; }

  .handle { min-height: 73rem; }
  .handle .wrap { padding-top: 3.9rem; }
  .handle__group { margin-left: 2.1rem; width: 27.8rem; height: 65.1rem; padding-top: 2.6rem; background: var(--navy); text-align: center; }
  .handle__eyebrow { margin-left: 2.4rem; width: 23.4rem; height: 5.4rem; font-size: 1.6rem; }
  .handle h2 { margin: 3.1rem 0 0 2.3rem; width: 23.7rem; height: 10.3rem; font-size: 2.6rem; }
  .handle__copy { margin: 8.3rem 0 0 1.8rem; width: 24.2rem; height: 28.9rem; font-size: 1.8rem; }

  .svc-cards { min-height: 121rem; }
  .svc-cards .wrap { flex-direction: column; gap: 4.9rem; padding: 4.5rem 0 0 1.8rem; }
  .svc-card { width: 28.4rem; height: 61.1rem; padding: 1.3rem 1.05rem 0; }
  .svc-card img { width: 26.3rem; height: 16.7rem; }
  .svc-card h3 { margin-top: 2rem; width: 24.2rem; height: 4.5rem; font-size: 1.7rem; }
  .svc-card p { margin-top: 2.3rem; width: 25rem; height: 24.5rem; font-size: 1.6rem; }
  .svc-card .btn { width: 16rem; height: 4rem; margin-bottom: 3.7rem; }
  .svc-card--civil { height: 48.9rem; padding-top: 2rem; }
  .svc-card--civil h3 { margin-top: 2.2rem; width: 25.3rem; height: 5rem; }
  .svc-card--civil p { margin-top: 2.7rem; width: 25rem; height: 12.5rem; }
  .svc-card--civil .btn { margin-bottom: 3rem; }

  .trust { min-height: 74rem; }
  .trust .wrap { padding-top: 5.1rem; }
  .trust__box { margin-left: 2.1rem; width: 26.7rem; height: 62.4rem; padding-top: 3.8rem; }
  .trust__eyebrow { margin-left: 4.2rem; width: 19.4rem; height: 4.4rem; font-size: 1.4rem; }
  .trust h2 { margin: 3.5rem 0 0 1.6rem; width: 24.6rem; height: 12.4rem; font-size: 2.6rem; }
  .trust__copy { margin: 0 0 0 1.1rem; width: 25.6rem; height: 22.8rem; font-size: 1.6rem; }
  .trust__btns { flex-direction: column; margin-top: 0; padding-left: 5.9rem; gap: 3rem; }
  .trust__btns .btn, .trust__btns .btn + .btn { width: 16rem; height: 4.2rem; padding-inline: 1rem; }

  .home-cta { min-height: 54.5rem; }
  .home-cta .wrap { padding-top: 7.7rem; }
  .home-cta h2 { margin-inline: auto; width: 26.8rem; height: 9rem; font-size: 3.5rem; }
  .home-cta__copy { margin: 4.9rem auto 0; width: 24.9rem; height: 4.7rem; font-size: 2rem; }
  .home-cta__btns { flex-direction: column; align-items: center; margin-top: 7.7rem; padding: 0; }
  .home-cta__btns .btn--secondary { width: 26.4rem; height: 4.2rem; }
  .home-cta__btns .btn--primary { width: 17.5rem; height: 4.8rem; margin: 2.3rem 0 0; }
}

/* ==========================================================================
   INNER-PAGE HEROES (About, Services, Projects, Contact, Land Possibility Report)
   On desktop the hero text is pinned to the window's left edge, as on the live site.
   ========================================================================== */
.page-hero > .inner { width: 100%; }
/* "Window height" heroes (About, Services): on desktop the section is at least as tall as the window
   and its content is centered vertically, as on the live site. --dh is the design height. */
@media (min-width: 768px) {
  .page-hero.page-hero--wh { min-height: max(var(--dh), 100vh); }
  .page-hero.page-hero--wh > .inner { padding-top: max(0px, (100vh - var(--dh)) / 2); }
}
.page-hero h1 { font-family: var(--f-bold); font-size: 10rem; line-height: 1; color: var(--white); }
.page-hero__copy { font-size: 2.4rem; line-height: 1.5; color: var(--white); }
@media (max-width: 767.98px) {
  .page-hero > .inner { width: 32rem; margin-inline: auto; }
  .page-hero h1 { font-size: 4.5rem; text-align: center; }
  .page-hero__copy { text-align: center; }
}

/* ==========================================================================
   ABOUT
   ========================================================================== */
.about-hero { --dh: 67.1rem; min-height: 67.1rem; }
.about-hero .bg { background-image: url("/assets/images/web/shane-mclendon-en1tf2eg-50-unsplash.webp"); --o: .6; }
.about-hero h1 { margin: 18.1rem 0 0 4.8rem; width: 86.7rem; height: 29.2rem; }
.about-hero .page-hero__copy { margin: 4.3rem 0 0 4.8rem; width: 75.9rem; height: 7.7rem; }

.about-intro { display: flex; align-items: flex-start; min-height: 90.1rem; background: var(--navy); }
.about-intro__text { flex: 1; }
.about-intro__eyebrow { margin: 14.6rem 0 0 6.5rem; width: 33.7rem; height: 5.4rem; font-family: var(--f-bold); font-size: 1.8rem; line-height: 1.8; letter-spacing: .1em; text-transform: uppercase; color: var(--slate); }
.about-intro h2 { margin: 3rem 0 0 6.5rem; width: 48.3rem; height: 24.1rem; font-size: 6.5rem; line-height: 1.2; text-transform: capitalize; color: var(--slate); }
.about-intro__copy { margin: 2.4rem 0 0 7.1rem; width: 55rem; height: 20.7rem; font-size: 2.2rem; line-height: 1.5; color: var(--white); }
.about-intro .btn { margin: 6rem 0 0 6.5rem; width: 26.8rem; height: 4.5rem; }
.about-intro__img { flex: none; width: calc(54.7rem + (100% - 120rem) / 2); height: 90.1rem; object-fit: cover; }

.about-why { min-height: 92.6rem; }
.about-why .bg { background-image: url("/assets/images/web/pexels-tima-miroshnichenko-6614747.webp"); --o: .9; }
.about-why .wrap { padding-top: 16.1rem; }
.about-why__box { margin-left: 6.1rem; width: 107.8rem; height: 60.5rem; padding-top: 5.2rem; background: var(--gray); color: var(--white); text-align: center; }
.about-why h2 { margin-inline: auto; width: 67.4rem; height: 10.4rem; font-size: 3.3rem; line-height: 1.5; }
.about-why__lead { margin: 3.9rem auto 0; width: 74.8rem; height: 9.1rem; font-size: 2.6rem; line-height: 1.3; }
.about-why__copy { margin: 1.2rem auto 0; width: 86.3rem; height: 12.3rem; font-size: 2rem; line-height: 1.3; }
.about-why .btn { margin: 4.8rem auto 0; width: 39.6rem; height: 5.9rem; }

.story { min-height: 77.2rem; background: var(--slate); color: var(--white); }
.story .wrap { display: flex; align-items: flex-start; }
.story__plan { flex: none; display: flex; align-items: center; justify-content: center; margin: 7.45rem 0 0 4.85rem; width: 47.3rem; height: 63.6rem; }
.story__plan > div {
  flex: none; width: 63.6rem; height: 47.3rem; transform: rotate(90deg);
  background: url("/assets/images/web/riverbend_commons.webp") no-repeat;
  background-size: 135.393%; background-position: 16.507% 27.841%;
}
.story__text { margin-left: 6.65rem; padding-top: 11.3rem; }
.story h2 { width: 49rem; height: 16rem; font-size: 4.5rem; line-height: 1.2; text-transform: capitalize; }
.story__sub { margin-top: 4rem; width: 54.6rem; height: 9.7rem; font-size: 1.8rem; line-height: 1.8; letter-spacing: .1em; text-transform: uppercase; }
.story__copy { margin-top: 2.8rem; width: 54.6rem; height: 22.2rem; font-size: 2rem; line-height: 1.5; }

.values { min-height: 60.4rem; background: var(--slate); }
.values__cards { display: flex; align-items: flex-start; padding: 4rem 0 0 7.1rem; }
.value-card { width: 31.8rem; height: 37.1rem; padding-top: 5.3rem; background: var(--offwhite); text-align: center; }
.value-card + .value-card { margin-left: 5.2rem; }
.value-card:last-child { margin-left: 5.3rem; }
.value-card h3 { height: 3.7rem; font-size: 2.6rem; line-height: 1.2; }
.value-card p { margin: 2.2rem auto 0; width: 28.2rem; height: 21.5rem; font-size: 1.7rem; line-height: 1.5; }
.value-card:nth-child(2) p { width: 26rem; }
.value-card:nth-child(3) p { width: 27.6rem; }
.values .btn { margin: 7.4rem 0 0 46.2rem; width: 27.7rem; height: 4.5rem; }

.team { min-height: 100.8rem; background: var(--offwhite); }
.team .wrap { display: flex; align-items: flex-start; }
.team__title { flex: none; display: flex; align-items: center; justify-content: center; margin: 13.25rem 0 0 7.75rem; width: 8rem; height: 74.3rem; }
.team__title h2 { flex: none; width: 74.3rem; height: 8rem; transform: rotate(-90deg); font-size: 8.7rem; line-height: 1.2; text-align: center; color: var(--slate); white-space: nowrap; }
.member { flex: none; margin-top: 14.4rem; }
.member--moroni { margin-left: 12.55rem; width: 36.8rem; }
.member--josh { margin-left: 11.4rem; width: 35.8rem; }
.member img { width: 35.8rem; height: 33.5rem; object-fit: cover; }
.member--josh img { object-position: 40% 40%; }
.member h3 { margin-top: 4.2rem; height: 3.4rem; font-size: 2.9rem; line-height: 1.2; }
.member__role { margin-top: .5rem; height: 2.5rem; font-family: var(--f-bold); font-size: 1.5rem; line-height: 1.8; letter-spacing: .1em; text-transform: uppercase; color: var(--navy); }
.member__rule { margin-top: 2.8rem; width: 35.8rem; height: .1rem; min-height: 1px; background: rgba(0, 0, 0, .4); }
.member__bio { margin-top: 3.1rem; width: 36.8rem; height: 27.8rem; font-size: 1.7rem; line-height: 1.5; }
.member--josh .member__bio { width: 34.6rem; height: 17.8rem; }

.cta-band .wrap { text-align: center; color: var(--white); }
.cta-band h2 { margin-inline: auto; width: 72.7rem; height: 13.6rem; font-family: var(--f-hg); font-weight: 500; font-size: 5.5rem; line-height: 1.2; text-transform: uppercase; }
.cta-band__copy { margin-inline: auto; line-height: 1.5; }
.cta-band .btn { margin-inline: auto; width: 20.4rem; height: 5.9rem; }
.about-cta { min-height: 70.8rem; }
.about-cta .bg { background-image: url("/assets/images/web/pexels-theo-34334650.webp"); --o: .7; }
.about-cta .wrap { padding-top: 15rem; }
.about-cta .cta-band__copy { margin-top: 2.6rem; width: 52.1rem; height: 13.7rem; font-size: 2.8rem; }
.about-cta .btn { margin-top: 2rem; }

@media (max-width: 767.98px) {
  .about-hero { min-height: 68.1rem; }
  .about-hero h1 { margin: 15.4rem 0 0 2.4rem; width: 27.4rem; height: 15.6rem; }
  .about-hero .page-hero__copy { margin: 10.4rem 0 0 1.7rem; width: 28.7rem; height: 11.3rem; font-size: 1.9rem; }

  .about-intro { flex-direction: column; min-height: 112.2rem; }
  .about-intro__text { flex: none; width: 32rem; margin-inline: auto; }
  .about-intro__eyebrow { margin: 6.3rem 0 0 2.8rem; width: 26.5rem; height: 5.2rem; font-size: 1.4rem; text-align: center; }
  .about-intro h2 { margin: 2.5rem 0 0 2rem; width: 28rem; height: 14rem; font-size: 3.6rem; text-align: center; }
  .about-intro__copy { margin: 3.1rem 0 0 2.7rem; width: 26.6rem; height: 23.9rem; font-size: 1.7rem; text-align: center; }
  .about-intro .btn { margin: 4.7rem 0 0 5.5rem; width: 21rem; height: 4rem; }
  .about-intro__img { margin: 5.6rem auto 0; width: 25.2rem; height: 37.8rem; }

  .about-why { min-height: 95.6rem; }
  .about-why .wrap { padding-top: 10rem; }
  .about-why__box { margin-left: 2.1rem; width: 27.8rem; height: 75.7rem; padding-top: 4.2rem; }
  .about-why h2 { width: 23.6rem; height: 4.4rem; font-size: 2.2rem; }
  .about-why__lead { margin-top: 9.9rem; width: 24.6rem; height: 9.7rem; font-size: 1.8rem; }
  .about-why__copy { margin-top: 2rem; width: 24.1rem; height: 29.6rem; font-size: 1.7rem; }
  .about-why .btn { margin-top: 7.5rem; width: 24.4rem; height: 4.2rem; font-size: 1.1rem; }

  .story { min-height: 107.8rem; }
  .story .wrap { flex-direction: column; }
  .story__plan { margin: 5.35rem 0 0 3.45rem; width: 25.3rem; height: 33.2rem; }
  .story__plan > div { width: 33.2rem; height: 25.3rem; }
  .story__text { margin-left: 0; padding-top: 0; }
  .story h2 { margin: 5.05rem 0 0 2.7rem; width: 26.7rem; height: 8.9rem; font-size: 2.7rem; }
  .story__sub { margin: 3.6rem 0 0 2.8rem; width: 26.7rem; height: 6.6rem; font-size: 1.3rem; }
  .story__copy { margin: 8.7rem 0 0 2.7rem; width: 26.7rem; height: 18rem; font-size: 1.6rem; }

  .values { min-height: 140.9rem; }
  .values__cards { flex-direction: column; padding: 4.7rem 0 0 2.5rem; }
  .value-card { width: 27.1rem; height: 38.2rem; padding-top: 2.9rem; }
  .value-card + .value-card, .value-card:last-child { margin: 2.8rem 0 0; }
  .value-card:nth-child(2) { height: 38rem; padding-top: 3.7rem; }
  .value-card:nth-child(3) { height: 36.5rem; padding-top: 3.9rem; }
  .value-card h3 { margin-inline: auto; width: 18.8rem; height: 2.3rem; font-size: 2.7rem; }
  .value-card:nth-child(2) h3 { width: 20.5rem; height: 2.8rem; }
  .value-card p, .value-card:nth-child(2) p, .value-card:nth-child(3) p { margin-top: 5.4rem; width: 22.6rem; height: 11.3rem; font-size: 1.5rem; }
  .value-card:nth-child(2) p { margin-top: 5.7rem; width: 22.9rem; }
  .value-card:nth-child(3) p { margin-top: 5.5rem; }
  .values .btn { margin: 5rem 0 0 2.4rem; width: 27.1rem; height: 4.2rem; }

  .team { min-height: 164rem; }
  .team .wrap { flex-direction: column; align-items: center; }
  .team__title { margin: 3.4rem 0 0; width: 27rem; height: 8.6rem; }
  .team__title h2 { width: 27rem; height: 8.6rem; transform: none; font-size: 4rem; white-space: normal; }
  .member, .member--moroni, .member--josh { margin: 0; width: 28.3rem; display: flex; flex-direction: column; align-items: center; text-align: center; }
  .member--moroni { margin-top: 3.3rem; }
  .member--josh { margin-top: 25.3rem; }
  .member img { width: 25rem; height: 25rem; }
  .member h3 { margin-top: 3.3rem; height: 2.8rem; font-size: 2.8rem; }
  .member__role { margin-top: .8rem; width: 22.4rem; height: 1.9rem; font-size: 1.3rem; }
  .member--josh .member__role { margin-top: 1.9rem; }
  .member__rule { margin-top: 2.7rem; width: 22.8rem; }
  .member--josh .member__rule { margin-top: 1.6rem; }
  .member__bio, .member--josh .member__bio { margin-top: 3rem; width: 24.7rem; height: 11.5rem; font-size: 1.5rem; }
  .member--josh .member__bio { width: 25rem; }

  .cta-band h2 { width: 29.3rem; font-size: 3.5rem; }
  .cta-band .btn { width: 16rem; height: 4.9rem; }
  .about-cta { min-height: 51.9rem; }
  .about-cta .wrap { padding-top: 8.8rem; }
  .about-cta h2 { height: 11.3rem; }
  .about-cta .cta-band__copy { margin-top: 0; width: 26.8rem; height: 16.1rem; font-size: 2rem; }
  .about-cta .btn { margin-top: 2rem; }
}

/* ==========================================================================
   SERVICES
   ========================================================================== */
.svc-hero { --dh: 76.9rem; min-height: 76.9rem; }
.svc-hero .bg { background-image: url("/assets/images/web/pexels-urtimud-89-76108288-14263363.webp"); }
.svc-hero h1 { margin: 30.6rem 0 0 5rem; width: 91.6rem; height: 21rem; text-transform: capitalize; }
.svc-hero .page-hero__copy { margin: 5.1rem 0 0 5rem; width: 59.6rem; height: 12.6rem; }

.svc-intro { min-height: 50rem; background: var(--navy); text-align: center; }
.svc-intro .wrap { padding-top: 10.6rem; }
.svc-intro h2 { margin-inline: auto; width: 73.5rem; height: 15.8rem; font-size: 6.5rem; line-height: 1.2; text-transform: capitalize; color: var(--slate); }
.svc-intro__copy { margin: 4rem auto 0; width: 74.1rem; height: 14.2rem; font-size: 2.2rem; line-height: 1.5; color: var(--white); }

.svc-detail { background: var(--navy); }
.svc-detail .wrap { display: flex; align-items: flex-start; padding: 9.2rem 0 0 13.7rem; }
.svc-detail__img { flex: none; width: 49.4rem; height: 67.9rem; object-fit: cover; }
.svc-detail__crop { flex: none; width: 49.4rem; height: 67.9rem; background: url("/assets/images/web/guille-b-cbubpux1_ei-unsplash.webp") no-repeat 50% 50%; background-size: 244.133%; }
.svc-detail__card { flex: none; width: 43.2rem; height: 67.9rem; background: var(--white); }
.svc-detail h2 { margin-left: 5.4rem; font-size: 3.4rem; line-height: 1.2; }
.svc-detail__rule { margin-left: 4.9rem; height: .1rem; min-height: 1px; background: var(--gray); }
.svc-detail__copy { margin-left: 5.4rem; font-size: 1.7rem; line-height: 1.5; }
.svc-detail__list { font-family: var(--f-bold); font-size: 1.5rem; line-height: 1.5; text-transform: uppercase; }
.svc-detail__list ul { list-style: disc; margin-left: 1.4em; }
.svc-detail__list li { margin-left: 1em; padding-left: .1em; }
.svc-detail .btn { margin-left: 5.4rem; width: 18rem; height: 4.5rem; }

.svc-civil { min-height: 84.2rem; }
.svc-civil .svc-detail__card { padding-top: 7.1rem; }
.svc-civil h2 { width: 30.5rem; height: 8.6rem; }
.svc-civil .svc-detail__rule { margin-top: 1.6rem; width: 34.1rem; }
.svc-civil .svc-detail__copy { margin-top: 2.9rem; width: 33.6rem; height: 19.2rem; }
.svc-civil .svc-detail__list { margin: 1.9rem 0 0 3.3rem; width: 30.4rem; height: 13.3rem; }
.svc-civil .btn { margin-top: 1.5rem; }

.svc-dev { min-height: 93.4rem; }
.svc-dev .svc-detail__card { padding-top: 6.8rem; }
.svc-dev h2 { width: 35.2rem; height: 4.3rem; }
.svc-dev .svc-detail__rule { margin-top: 1rem; width: 33.9rem; }
.svc-dev .svc-detail__copy { margin-top: 2.7rem; width: 32.9rem; height: 27.1rem; }
.svc-dev .svc-detail__list { margin: 1.7rem 0 0 3.5rem; width: 34.2rem; height: 13.3rem; }
.svc-dev .btn { margin-top: 1rem; }

.svc-cta { min-height: 70.8rem; }
.svc-cta .bg { background-image: url("/assets/images/web/screenshot_2025-10-23_at_7_44_14_am.webp"); --o: .7; }
.svc-cta .wrap { padding-top: 15rem; }
.svc-cta .cta-band__copy { margin-top: 2.6rem; width: 58.7rem; height: 13.9rem; font-size: 3rem; }
.svc-cta .btn { margin-top: 3.7rem; }

@media (max-width: 767.98px) {
  .svc-hero { min-height: 61.2rem; }
  .svc-hero h1 { margin: 16.1rem 0 0 2.3rem; width: 27.4rem; height: 15.6rem; }
  .svc-hero .page-hero__copy { margin: 1.6rem 0 0 1.7rem; width: 28.7rem; height: 19.7rem; font-size: 2rem; }

  .svc-intro { min-height: 56rem; }
  .svc-intro .wrap { padding-top: 4rem; }
  .svc-intro h2 { width: 24.3rem; height: 18.3rem; font-size: 4rem; }
  .svc-intro__copy { margin-top: 4.8rem; width: 26.6rem; height: 23.9rem; font-size: 1.7rem; }

  .svc-detail .wrap { flex-direction: column; padding: 4.7rem 0 0 2.7rem; }
  .svc-detail__img, .svc-detail__crop { order: -1; width: 26.6rem; height: 15.9rem; }
  .svc-detail__card, .svc-civil .svc-detail__card, .svc-dev .svc-detail__card { width: 26.6rem; padding-top: 3.4rem; }
  .svc-detail h2, .svc-civil h2, .svc-dev h2 { margin-left: 2rem; width: 22.6rem; height: 5.6rem; font-size: 2.4rem; }
  .svc-detail__rule, .svc-civil .svc-detail__rule, .svc-dev .svc-detail__rule { margin: 2.5rem 0 0 2.5rem; width: 5.7rem; }
  .svc-detail__copy, .svc-civil .svc-detail__copy, .svc-dev .svc-detail__copy { margin: 2.8rem 0 0 2.4rem; width: 21.9rem; height: 24.4rem; font-size: 1.6rem; }
  .svc-detail__list, .svc-civil .svc-detail__list, .svc-dev .svc-detail__list { margin-left: .8rem; width: 22.6rem; height: 13.5rem; }
  .svc-detail .btn, .svc-civil .btn, .svc-dev .btn { margin: 5.4rem 0 0 5.3rem; width: 16rem; height: 4rem; }
  .svc-civil { min-height: 97.3rem; }
  .svc-civil .svc-detail__card { height: 71.8rem; }
  .svc-civil .svc-detail__list { margin-top: 5.1rem; }
  .svc-dev { min-height: 106.3rem; }
  .svc-dev .svc-detail__card { height: 79.5rem; }
  .svc-dev .svc-detail__list { margin-top: 14.1rem; }

  .svc-cta { min-height: 68.4rem; }
  .svc-cta .wrap { padding-top: 11.4rem; }
  .svc-cta h2 { height: 14rem; }
  .svc-cta .cta-band__copy { margin-top: 3.6rem; width: 23rem; height: 17rem; font-size: 2rem; }
  .svc-cta .btn { margin-top: 6.1rem; }
}

/* ==========================================================================
   PROJECTS
   ========================================================================== */
.proj-hero { min-height: 78.2rem; }
.proj-hero .bg { background-image: url("/assets/images/web/built-robotics-ox2mggrtcva-unsplash.webp"); --o: .6; }
.proj-hero h1 { margin: 23.1rem 0 0 5rem; width: 91.6rem; height: 21rem; text-transform: capitalize; }
.proj-hero .page-hero__copy { margin: 5.1rem 0 0 5rem; width: 81.2rem; height: 8.9rem; font-size: 2.6rem; }
.proj-hero .btn { margin: 4rem 0 0 5rem; width: 22.1rem; height: 4.5rem; }

.proj-list { background: var(--white); padding-bottom: 8.2rem; }
.proj-row { display: flex; align-items: flex-start; gap: 3.7rem; height: 54.2rem; padding: 11.6rem 0 0 3.9rem; }
.proj-row--short { height: 53.2rem; }
.proj-row--single { padding-left: 4.7rem; }
.project { width: 54.3rem; }
.project__img { display: block; width: 54.3rem; height: 34.5rem; }
.project__img img { width: 100%; height: 100%; object-fit: contain; }
.project__img--photo img { object-fit: cover; }
.project h2 {
  margin-top: 2.8rem; height: 3.6rem;
  font-family: var(--f-bold); font-size: 2rem; line-height: 1.8; letter-spacing: .1em;
  text-transform: uppercase; text-align: center; color: var(--slate);
}

@media (max-width: 767.98px) {
  .proj-hero { min-height: 76.2rem; }
  .proj-hero h1 { margin: 21.9rem 0 0 2.3rem; width: 27.4rem; height: 15.6rem; }
  .proj-hero .page-hero__copy { margin: 2rem 0 0 2.3rem; width: 27.4rem; height: 17.9rem; font-size: 2rem; }
  .proj-hero .btn { margin: 4rem 0 0 7.4rem; width: 17.3rem; height: 4.9rem; }

  .proj-list { padding-bottom: 5rem; }
  .proj-row, .proj-row--short { flex-direction: column; gap: 7.6rem; height: 71.8rem; padding: 6.3rem 0 0 1.8rem; }
  .proj-row--short { height: 72rem; }
  .proj-row--single { height: 37rem; padding-top: 3.3rem; }
  .project { width: 28.5rem; }
  .project__img { width: 28.5rem; height: 22.9rem; }
  .project h2 { margin-top: 2.5rem; height: 3rem; font-size: 1.8rem; }
}

/* ==========================================================================
   CONTACT + LAND POSSIBILITY REPORT
   ========================================================================== */
.contact-hero { min-height: 60.8rem; }
.contact-hero .bg { background-image: url("/assets/images/web/greg-rosenke-yq9slr8e5jm-unsplash.webp"); --o: .8; }
.contact-hero h1 { margin: 17.5rem 0 0 4.6rem; width: 67.1rem; height: 10.2rem; }
.contact-hero .page-hero__copy { margin: 2.1rem 0 0 4.6rem; width: 53.9rem; height: 7.5rem; }
/* These two sit on the 1200px canvas (not pinned to the window edge). */
.contact-hero .btn { margin: 12.6rem 0 0 calc((100% - 120rem) / 2 + 44.9rem); width: 30.3rem; height: 5.7rem; }
.contact-hero__byline { margin: 1.7rem 0 0 calc((100% - 120rem) / 2 + 17.6rem); width: 84.9rem; height: 3.5rem; font-size: 1.7rem; line-height: 1.5; color: #fff; }

/* Fillout embeds are drawn at their design width and zoomed by the page scale (set in site.js),
   exactly like the live site, which scales its whole canvas, forms included. */
.embed-zoom { width: 100%; }

.form-band { background: var(--form-band); padding: 9.3rem 0 7.5rem; }
.form-band__embed { margin-left: calc((100% - 120rem) / 2 + 10.8rem); width: 94rem; min-height: 28.5rem; }

.lpr-hero { min-height: 60.8rem; }
.lpr-hero .bg { background-image: url("/assets/images/web/michael-chiara-cpmwyjgytfa-unsplash.webp"); --o: .8; }
.lpr-hero h1 { margin: 17.3rem 0 0 4.6rem; width: 112.8rem; height: 16.4rem; }
.lpr-hero .page-hero__copy { margin: 5.9rem 0 0 4.6rem; width: 54.2rem; height: 15.9rem; }

.lpr-band { background: var(--gray-light); min-height: 70rem; padding: 2.7rem 0; }
.lpr-band__embed { margin-left: calc((100% - 120rem) / 2 + 21.2rem); width: 79.5rem; min-height: 64.6rem; }

@media (max-width: 767.98px) {
  .contact-hero { min-height: 50.2rem; }
  .contact-hero h1 { margin: 6.9rem 0 0 3.3rem; width: 25.5rem; height: 10.4rem; }
  .contact-hero .page-hero__copy { margin: 0 0 0 4.8rem; width: 22.4rem; height: 12.4rem; font-size: 2rem; }
  .contact-hero .btn { margin: 13.9rem 0 0 2.9rem; width: 26.4rem; height: 4.9rem; }
  /* B3 fix: on the live site this line overlapped the button on phones; here it sits below it. */
  .contact-hero__byline { margin: 1.6rem auto 2.4rem; width: 26.4rem; height: auto; font-size: 1.5rem; text-align: center; }

  .form-band { padding: 3.8rem 0 3.7rem; }
  .form-band__embed { margin-left: calc((100% - 32rem) / 2 + 2.8rem); width: 26.4rem; min-height: 14.9rem; }

  .lpr-hero { min-height: 50.2rem; }
  .lpr-hero h1 { margin: 8.9rem 0 0 .6rem; width: 30.8rem; height: 14.3rem; }
  .lpr-hero .page-hero__copy { margin: 8.5rem 0 0 .6rem; width: 30.8rem; height: 11.2rem; font-size: 2rem; }

  .lpr-band { min-height: 78rem; padding: 1.4rem 0 0; }
  .lpr-band__embed { margin-left: calc((100% - 32rem) / 2 + 4.5rem); width: 23.1rem; min-height: 74.4rem; }
}

/* ==========================================================================
   LEGAL PAGES (Privacy Policy, Terms and Conditions)
   ========================================================================== */
.legal { background: var(--white); }
.legal__bar { height: 16rem; background: var(--navy); }
.legal h1 {
  margin: 7rem 0 0 8.5rem; width: 28rem; height: 2rem;
  font-family: var(--f-bold); font-size: 2rem; line-height: 1.6; letter-spacing: .1em;
  text-transform: uppercase; color: var(--navy); white-space: nowrap;
}
.legal__body { margin: 6.5rem 0 0 8.5rem; width: 103rem; padding-bottom: 6rem; font-size: 1.6rem; line-height: 1.5; text-align: justify; }
.legal__body ul { list-style: disc; margin-left: 1.4em; }
.legal__body li { margin-left: 1em; padding-left: .1em; }
.legal--privacy { min-height: 191.1rem; }
.legal--terms { min-height: 378rem; }
.legal--terms h1 { margin-top: 2rem; }

@media (max-width: 767.98px) {
  .legal__bar { height: 7.1rem; }
  .legal h1 { margin: 4.1rem 0 0 3.1rem; width: 22.4rem; height: 1.7rem; font-size: 1.6rem; }
  .legal--terms h1 { margin-top: 3.4rem; }
  .legal__body { margin: 3.1rem 0 0 3.1rem; width: 27.3rem; padding-bottom: 0; font-size: 1.5rem; text-align: left; }
  .legal--privacy { min-height: 420.9rem; }
  .legal--terms { min-height: 773.9rem; }
}

/* ==========================================================================
   404 PAGE
   ========================================================================== */
.notfound { min-height: 60rem; background: var(--navy); color: var(--white); text-align: center; }
.notfound .wrap { padding-top: 22rem; }
.notfound h1 { font-size: 5.5rem; line-height: 1.2; }
.notfound__copy { margin-top: 2rem; font-size: 2.2rem; line-height: 1.5; }
.notfound .btn { margin: 4rem auto 0; width: 20rem; height: 5rem; }
@media (max-width: 767.98px) {
  .notfound { min-height: 50rem; }
  .notfound .wrap { padding-top: 14rem; }
  .notfound h1 { font-size: 3.5rem; }
  .notfound__copy { margin-inline: auto; width: 26rem; font-size: 1.8rem; }
  .notfound .btn { width: 17.5rem; height: 4.2rem; }
}