@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&display=swap');
/* Shared UA studio shell. Loaded after the page-specific CSS. */
body{font-family:'DM Sans',Arial,sans-serif}

.header,body .site-header{position:sticky;top:0;z-index:20;height:82px;background:#202223;color:#fff;box-shadow:0 1px 0 #0004;font-family:Manrope,'DM Sans',Arial,sans-serif}
.header{display:flex;align-items:center;gap:34px;padding:0 max(28px,calc((100vw - 1180px)/2))}
body .site-header .shell{display:flex;align-items:center;min-height:82px;width:auto;max-width:none;gap:34px;padding:0 max(28px,calc((100vw - 1180px)/2))}
.header .logo,body .site-header .logo{display:flex;align-items:center;flex:none;width:226px;height:auto;min-height:0;background:transparent}
.header .logo img,body .site-header .logo img{display:block;width:226px;height:auto;max-width:none;object-fit:contain;object-position:left center}
.header .nav,body .site-header .nav{display:flex;align-items:center;gap:clamp(12px,1.6vw,30px);margin-left:auto;font:500 14px/1.4 Manrope,'DM Sans',Arial,sans-serif}
.header .nav a,body .site-header .nav a{position:relative;color:#f2f2ef;text-decoration:none}
.header .nav a::after,body .site-header .nav a::after{content:'';position:absolute;left:0;right:100%;bottom:-7px;height:2px;background:#ff641d;transition:right .25s}
.header .nav a:hover::after,.header .nav a:focus-visible::after,body .site-header .nav a:hover::after,body .site-header .nav a:focus-visible::after{right:0}
.header .top-cta,body .site-header .header-cta{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:46px;margin-left:0;padding:12px 18px;border:1px solid #f4efe4;border-radius:999px;background:#f4efe4;color:#17191a;font:800 13px/1.2 Manrope,'DM Sans',Arial,sans-serif;white-space:nowrap;transform:none;box-shadow:none}
.header .top-cta:hover,.header .top-cta:focus-visible,body .site-header .header-cta:hover,body .site-header .header-cta:focus-visible{border-color:#ff641d;background:#ff641d;color:#17191a;transform:none}
.header .top-cta b,body .site-header .header-cta b{font-size:21px;line-height:0;margin-left:0}

/* One 1180px content edge across the three routes. */
main#top>.hero{width:100%;max-width:1180px}
main#top>.hero .hero-copy{padding-left:28px}
main>.process{max-width:none;margin-right:0;margin-left:0;padding-right:max(28px,calc((100vw - 1124px)/2));padding-left:max(28px,calc((100vw - 1124px)/2))}
main>.services,main>.work{max-width:1180px;margin-right:auto;margin-left:auto;padding-right:28px;padding-left:28px}
main>.about,main>.contact{padding-right:max(28px,calc((100vw - 1124px)/2));padding-left:max(28px,calc((100vw - 1124px)/2))}
.site-footer{padding-right:max(28px,calc((100vw - 1124px)/2));padding-left:max(28px,calc((100vw - 1124px)/2))}
main>.hero .shell,main>.section .shell,main>.closing .shell{width:min(1124px,calc(100% - 56px))}
main>.hero .hero-inner,main>.close .close-inner{width:100%;max-width:1180px;padding-right:28px;padding-left:28px}
.faq-bridge{width:min(1124px,calc(100% - 56px))}
/* Keep the FAQ accordion's intentionally narrower reading column. */
main>.faq .faq-layout{max-width:920px}

@media(max-width:1050px){
  .header .menu-toggle,body .site-header .menu-toggle{display:block;margin-left:auto}
  .header .top-cta,body .site-header .header-cta{display:none}
  .header .nav,body .site-header .nav{position:fixed;top:90px;left:12px;right:12px;display:grid;width:auto;gap:0;margin:0;padding:12px 18px;border:1px solid #3f4242;border-radius:16px;background:#202223;box-shadow:0 18px 40px #0005;opacity:0;visibility:hidden;transform:translateY(-10px)}
  .header .nav.open,body .site-header .nav.open{opacity:1;visibility:visible;transform:none}
  .header .nav a,body .site-header .nav a{padding:13px 4px;border-bottom:1px solid #ffffff14;font-size:16px}
  .header .nav a:last-child,body .site-header .nav a:last-child{border-bottom:0}
}
@media(max-width:700px){
  .header,body .site-header{height:72px}
  .header{padding:0 16px}
  body .site-header .shell{min-height:72px;padding:0 16px}
  .header .logo,body .site-header .logo,.header .logo img,body .site-header .logo img{width:184px}
  .header .nav,body .site-header .nav{top:80px}
  main#top>.hero{width:100%}
  main#top>.hero .hero-copy{padding-left:20px}
  main>.process,main>.services,main>.work,main>.about,main>.contact{padding-right:20px;padding-left:20px}
  main>.hero .hero-inner,main>.close .close-inner{padding-right:20px;padding-left:20px}
  .site-footer{padding-right:20px;padding-left:20px}
}
@media(max-width:520px){main>.hero .shell,main>.section .shell,main>.closing .shell,.faq-bridge{width:calc(100% - 40px)}}
