@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700&family=Source+Sans+3:wght@400;500;600;700&display=swap');

:root { --paper:#fff; --ink:#10243a; --jade:#91e477; --deep:#216517; --line:#d9e1e7; color-scheme:light; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font:1.125rem/1.55 'Source Sans 3',system-ui,sans-serif; }
a { color:var(--deep); }
a:focus-visible, button:focus-visible, summary:focus-visible { outline:3px solid #d88a38; outline-offset:5px; }
.skip { position:absolute; top:0; left:1rem; transform:translateY(-150%); z-index:4; background:white; padding:.5rem 1rem; }
.skip:focus { transform:none; }
header { background:var(--paper); color:var(--ink); border-bottom:1px solid var(--line); }
footer { background:var(--ink); color:#fff; }
.nav, footer { display:flex; align-items:center; justify-content:space-between; gap:1.25rem; padding:1rem clamp(1rem,5vw,5rem); }
.nav nav, footer div { display:flex; gap:clamp(.75rem,3vw,2.5rem); flex-wrap:wrap; }
header a, footer a { color:inherit; text-decoration:none; }
header a:hover, footer a:hover { text-decoration:underline; }
.brand { display:inline-flex; flex-shrink:0; }
.brand img { display:block; width:clamp(7rem,16vw,10rem); height:auto; }
.nav-contact { border:1px solid var(--line); padding:.4rem .85rem; border-radius:3px; }
.hero { position:relative; isolation:isolate; overflow:hidden; background:var(--ink); color:#fff; padding:clamp(3rem,10vw,8rem) clamp(1rem,8vw,8rem); }
.hero.with-video { min-height: min(41rem,82svh); display:grid; align-items:center; }
.hero.with-video::after { position:absolute; inset:0; z-index:-1; content:''; background:linear-gradient(90deg,#10243af7,#10243abd 51%,#10243a45); }
.hero-video { position:absolute; z-index:-2; inset:0; width:100%; height:100%; object-fit:cover; }
.hero-content { max-width:48rem; }
h1,h2 { font-family:'Barlow Condensed','Arial Narrow',sans-serif; line-height:.97; margin:0 0 .55em; }
h1 { font-size:clamp(3.4rem,8.8vw,7.4rem); font-weight:700; letter-spacing:-.015em; }
h2 { font-size:clamp(2rem,4vw,3.6rem); }
.hero-content > p:not(.eyebrow) { max-width:30rem; font-size:clamp(1.15rem,2.5vw,1.5rem); }
.eyebrow, .cards small { color:var(--deep); text-transform:uppercase; letter-spacing:.13em; font-size:.8rem; font-weight:700; }
.hero .eyebrow { color:var(--jade); }
.button { display:inline-flex; align-items:center; gap:1rem; background:var(--deep); border-radius:3px; color:#fff; padding:.8rem 1.15rem; font-weight:700; text-decoration:none; }
.button:hover { background:#194c11; }
.pause { position:absolute; right:1rem; bottom:1rem; color:white; background:#101b1c; border:1px solid #ffffff70; border-radius:3px; padding:.4rem .7rem; cursor:pointer; font:inherit; font-size:.9rem; }
.home-body,.reading { padding:clamp(2rem,6vw,6rem) clamp(1rem,6vw,6rem); margin:auto; }
.home-body { max-width:95rem; }
.reading { max-width:61rem; }
.section-copy { max-width:38rem; }
.explorer-grid { display:grid; grid-template-columns:1.5fr 1fr; gap:clamp(1rem,4vw,4rem); align-items:center; margin:2rem 0 4rem; }
.model { min-height:19rem; aspect-ratio:4/3; background:#101b1c url('/assets/building-cutaway.png') center/contain no-repeat; border-radius:.4rem; }
details { border-top:1px solid var(--line); padding:.8rem .15rem; }
details:last-child { border-bottom:1px solid var(--line); }
summary { color:var(--deep); font-weight:700; cursor:pointer; }
details p { margin:.6rem 0 0; }
.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.cards a { border:1px solid var(--line); border-radius:.4rem; padding:1.25rem; color:inherit; text-decoration:none; }
.cards a:hover { background:#e7efe5; }
.cards h2 { margin:.3rem 0; }
.cards p { margin-bottom:0; }
.reading section + section { margin-top:2.75rem; }
.content-block { margin-block:3rem; }
.photo-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr)); gap:1rem; }
.photo-grid figure { margin:0; }
.photo-grid img { width:100%; display:block; aspect-ratio:4/3; object-fit:cover; background:#f3f5f5; border-radius:4px; }
.photo-grid figcaption { margin-top:.5rem; color:#344b60; font-size:.95rem; }
.reference-image { display:inline-block; width:min(100%,23rem); vertical-align:top; margin:1rem 1rem 1rem 0; }
.reference-image img { display:block; max-width:100%; height:auto; border-radius:4px; }
.reading > h2:not(:first-child) { margin-top:2.5rem; }
.reading > h3 { margin-top:1.8rem; }
.catalog-grid { list-style:none; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr)); gap:1rem; }
.catalog-grid li { padding:1rem .5rem; border-top:1px solid var(--line); text-align:center; font-weight:600; }
.catalog-grid img { display:block; width:100%; height:6rem; object-fit:contain; margin-bottom:.6rem; }
.intake iframe { border:1px solid var(--line); border-radius:.4rem; background:white; width:100%; height:64rem; display:block; }
.industry-hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.3fr); align-items:center; gap:clamp(1.25rem,4vw,4rem); padding-block:clamp(2rem,5vw,5rem); }
.industry-hero h1 { font-size:clamp(2.75rem,5.4vw,5.5rem); }
.industry-hero .eyebrow { display:flex; align-items:center; gap:.6rem; }
.industry-hero .eyebrow img { padding:4px; border-radius:4px; background:#fff; }
.industry-hero-art,.industry-card-art { display:block; width:100%; height:auto; aspect-ratio:2; object-fit:cover; }
.industry-hero-art { border-radius:4px; }
.industry-grid { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,19rem),1fr)); gap:1.25rem; }
.industry-card { display:block; height:100%; border:1px solid var(--line); border-radius:4px; overflow:hidden; color:inherit; text-decoration:none; }
.industry-card:hover { border-color:var(--deep); }
.industry-card > span { display:flex; align-items:center; gap:.6rem; padding:.9rem; font-weight:700; }
.industry-card > span > span { margin-inline-start:auto; color:var(--deep); }
.location-search { max-width:30rem; margin-bottom:1.75rem; }
.location-search label { display:block; font-weight:700; margin-bottom:.5rem; }
.location-search input { width:100%; border:1px solid var(--line); border-radius:4px; padding:.7rem .85rem; font:inherit; }
.location-grid { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr)); gap:.6rem 1.25rem; }
.location-grid a { display:flex; align-items:center; justify-content:space-between; gap:.7rem; padding:.7rem 0; border-bottom:1px solid var(--line); color:inherit; font-weight:650; text-decoration:none; }
.location-grid a:hover { color:var(--deep); text-decoration:underline; }
.case-hero {
  padding-block:clamp(3.5rem,8vw,8rem);
  background:linear-gradient(120deg,#10243a,#19364a 75%,#214442);
}
.case-hero h1 { font-size:clamp(3rem,6vw,6rem); text-wrap:balance; }
.case-hero.industry-hero { grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); }
.case-list { max-width:76rem; margin:0 auto; padding:0; list-style:none; }
.case-list li { border-bottom:1px solid var(--line); }
.case-story {
  display:grid;
  grid-template-columns:minmax(7rem,12rem) minmax(0,1fr) auto;
  align-items:center;
  gap:clamp(1.25rem,4vw,3.5rem);
  padding:clamp(1.35rem,3.2vw,2.8rem) clamp(.5rem,2vw,1.5rem);
  color:inherit;
  text-decoration:none;
  transition:background-color .2s ease;
}
.case-story:hover,.case-story:focus-visible { background:#f3f7f4; }
.case-mark { display:grid; place-items:center; min-height:5rem; color:var(--ink); }
.case-mark img { display:block; max-width:min(100%,9rem); max-height:3.75rem; object-fit:contain; }
.case-hero-mark { min-height:clamp(8rem,15vw,13rem); padding:1rem 2rem; border-radius:6px; background:white; }
.case-hero-mark img { max-width:min(100%,14rem); max-height:7rem; }
.case-wordmark { font-size:1.1rem; font-weight:750; text-align:center; }
.case-story h2 { font-size:clamp(1.65rem,3vw,2.45rem); margin:.3rem 0 .45rem; }
.case-story-copy p { margin:0; }
.case-location,.case-source { color:#344b60; font-size:.95rem; }
.case-link { color:var(--deep); font-weight:700; white-space:nowrap; }
.case-link span { display:inline-block; margin-left:.25rem; transition:transform .2s ease; }
.case-story:hover .case-link span { transform:translate(2px,-2px); }
.case-back { margin:0 0 clamp(1.5rem,4vw,3rem); }
.case-layout { display:grid; grid-template-columns:minmax(9rem,1fr) minmax(0,2.7fr); gap:clamp(1.5rem,5vw,4rem); align-items:start; }
.case-facts { margin:0; padding-inline-start:1.2rem; border-inline-start:2px solid var(--jade); }
.case-facts div + div { margin-top:1rem; }
.case-facts dt { font-weight:700; }
.case-facts dd { margin:.25rem 0 0; }
.case-narrative .content-block { margin:0 0 2.4rem; }
.case-narrative h2 { font-size:clamp(1.8rem,4vw,3rem); }
.case-source { padding-top:1.25rem; border-top:1px solid var(--line); }
@media (max-width:820px) {
  .case-hero.industry-hero { grid-template-columns:1fr; }
  .case-hero-mark { max-width:22rem; }
  .case-story { grid-template-columns:minmax(4.5rem,7rem) minmax(0,1fr); gap:.65rem 1.2rem; }
  .case-link { grid-column:2; }
}
@media (max-width:540px) {
  .case-layout { grid-template-columns:1fr; }
  .case-facts { display:grid; gap:.65rem; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .case-facts div + div { margin-top:0; }
  .case-facts div:last-child { grid-column:1/-1; }
}
@media (prefers-reduced-motion:reduce) {
  .case-story,.case-link span { transition:none; }
}
@media (max-width:820px) {
  .industry-hero { grid-template-columns:1fr; }
}
@media (max-width:640px) {
  .nav { display:grid; grid-template-columns:1fr auto; }
  .nav nav { grid-row:2; grid-column:1/-1; }
  .explorer-grid,.cards { grid-template-columns:1fr; }
  .model { min-height:0; }
  footer { align-items:flex-start; flex-direction:column; }
}

.contact-layout { display:grid; grid-template-columns:minmax(12rem,1fr) minmax(0,2.25fr); gap:clamp(2rem,6vw,6rem); max-width:75rem; margin:auto; align-items:start; }
.contact-details { padding-left:1.25rem; border-left:2px solid var(--jade); }
.contact-details h2,.intake h2 { font-size:clamp(2rem,4vw,3rem); }
.contact-details ul { padding-left:1.1rem; }
.contact-layout iframe { height:58rem; }
@media(max-width:760px) { .contact-layout { grid-template-columns:1fr; } }

.contractor-actions { display:flex; align-items:center; flex-wrap:wrap; gap:1rem; }
.contractor-login { color:inherit; font-weight:700; text-underline-offset:.2em; }
.contractor-process { padding-inline-start:1.35rem; }
.contractor-process li + li { margin-top:1.4rem; }
.contractor-process h3 { margin:0 0 .3rem; }
.contractor-process p { margin:0; }

.service-hero { background:#f3f7f5; color:#142638; }
.service-hero .eyebrow { color:#22641a; }
.service-hero .industry-hero-art { box-shadow:0 12px 32px #14263816; }
.service-detail-content { max-width:56rem; margin:auto; }
.service-detail-content h2 { font-size:clamp(1.85rem,3vw,2.75rem); }
.service-hero { grid-template-columns:minmax(0,1.65fr) minmax(0,1fr); gap:clamp(1rem,4vw,3rem); padding:clamp(1.4rem,3.5vw,3rem) max(clamp(1.25rem,5vw,4.5rem),calc((100% - 82.5rem)/2)); background:#f3f7f5; }
.service-hero:not(.industry-hero) { grid-template-columns:1fr; }
.service-hero h1 { font:750 clamp(2.3rem,5vw,4rem)/1.03 system-ui,sans-serif; margin:.3rem 0 .65rem; letter-spacing:-.04em; }
.service-hero .eyebrow { margin:0; }
.service-hero .hero-content > p:not(.eyebrow) { margin:.7rem 0 1rem; font-size:clamp(1.03rem,2vw,1.27rem); }
.industry-hero .industry-hero-art { border-radius:clamp(1rem,2.6vw,2rem); }
.service-hero .industry-hero-art { width:100%; max-width:24rem; justify-self:end; }
.service-reading { max-width:none; padding:clamp(1.4rem,3vw,2.4rem) max(clamp(1.25rem,5vw,4.5rem),calc((100% - 82.5rem)/2)); }
.service-reading .service-detail-content { margin:0; max-width:56rem; }
.service-reading .service-detail-content > section:first-child { margin-top:0; }
.service-reading h2 { font:720 clamp(1.45rem,3vw,2.15rem)/1.15 system-ui,sans-serif; letter-spacing:-.02em; }
.service-reading p,.service-reading ul { max-width:69ch; }
.service-reading .content-block { margin-block:1.75rem; }
.related-routes { list-style:none; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr)); gap:.25rem 1.25rem; }
.related-routes a { display:flex; align-items:center; gap:.6rem; min-height:3rem; border-bottom:1px solid #d9e1e5; text-decoration:none; font-weight:650; }
.related-routes a:hover { text-decoration:underline; }
.related-routes a img { flex:none; }
.related-routes a span { margin-inline-start:auto; }
.reading:has(.media-section) { max-width:78rem; }
.service-reading:has(.media-section) .service-detail-content { max-width:none; }
.media-section {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:center;
  gap:clamp(1rem,4vw,3.5rem);
  padding-block:1rem;
  border-top:1px solid var(--line);
}
.media-section h2 { font:720 clamp(1.45rem,3vw,2.15rem)/1.15 system-ui,sans-serif; }
.media-section img {
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3/2;
  object-fit:cover;
  border-radius:clamp(.85rem,2.4vw,1.65rem);
}
.media-section-reverse img { grid-column:1; grid-row:1; }
@media(max-width:680px) {
  .media-section { grid-template-columns:1fr; }
  .media-section-reverse img { grid-column:auto; grid-row:auto; }
}
.service-reading + .page-guide { width:min(calc(100% - 2.5rem),60rem); margin:0 auto 2rem; grid-template-columns:minmax(0, .85fr) minmax(0,1.15fr); padding:1rem; background:#f3f7f5; border-radius:10px; }
@media(max-width:660px) {
  .service-hero { grid-template-columns:1fr; }
  .service-hero .industry-hero-art { justify-self:start; max-width:15rem; }
  .service-reading + .page-guide { grid-template-columns:1fr; }
}
.blog-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr)); gap:1rem; }
.blog-card { border:1px solid #d9e1e5; border-radius:.85rem; overflow:hidden; }
.blog-card a { display:block; height:100%; color:inherit; text-decoration:none; }
.blog-card a:hover h3 { text-decoration:underline; }
.blog-card img { display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; }
.blog-card a > div { padding:.9rem; }
.blog-card h3,.blog-card p { margin:0 0 .5rem; }
.article-photo,.article-flow { margin:2rem 0; }
.article-photo img { display:block; width:100%; aspect-ratio:3/2; object-fit:cover; border-radius:.85rem; }
.article-photo figcaption { margin-top:.4rem; font-size:.9rem; color:#475b68; }
.article-flow { padding:1rem; border:1px solid #d9e1e5; border-radius:.85rem; background:#f3f7f5; }
.article-flow figcaption { font-weight:700; }
.article-flow ol { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.65rem; list-style:none; padding:0; margin:.65rem 0 0; }
.article-flow li { padding:.6rem; background:white; border-top:3px solid #24641e; border-radius:.25rem; font-weight:650; overflow-wrap:anywhere; }
@media(max-width:550px) { .article-flow ol { grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* Keep directory entries open, with the image and title as the link. */
.industry-grid, .blog-grid, .cards { gap:clamp(1.25rem,2.8vw,2.5rem); }
.industry-card, .blog-card, .cards a { border:0; border-radius:0; overflow:visible; }
.industry-card-art, .blog-card img, .photo-grid img { border-radius:1rem; }
.industry-card > span, .blog-card a > div { padding:.85rem 0 0; }
.industry-card:hover > span, .industry-card:focus-visible > span { color:var(--deep); }
.cards a { padding:1rem 0; border-top:1px solid var(--line); }
.cards a:hover { background:transparent; }
.cards a:hover h2 { color:var(--deep); }
.service-reading + .page-guide { background:transparent; padding:0; border-radius:0; }

/* Article typography and navigation share the site's ink and green palette. */
.hero.article-hero {
  color:var(--ink);
  background:linear-gradient(120deg,#f6f9f6,#f0f5f4);
  padding-block:clamp(2.5rem,6vw,5.5rem);
}
.article-hero .eyebrow { color:var(--deep); }
.article-hero h1 { font:750 clamp(2.3rem,5vw,4.65rem)/1.02 system-ui,sans-serif; letter-spacing:-.052em; text-wrap:balance; }
.article-hero .hero-content > p:not(.eyebrow) { max-width:54ch; color:#435464; }
.article-layout {
  width:min(100% - 2 * clamp(1.25rem,5vw,4.5rem),75rem);
  margin-inline:auto;
  padding-block:clamp(2rem,5vw,4.75rem);
  display:grid;
  grid-template-columns:minmax(0,44rem) minmax(0,17rem);
  justify-content:space-between;
  align-items:start;
  gap:clamp(1.5rem,5vw,5rem);
}
.article-copy { grid-column:1; grid-row:1; min-width:0; overflow-wrap:anywhere; }
.article-copy .content-block { margin-block:2.4rem; }
.article-copy h2, .article-next > h2 {
  font:720 clamp(1.6rem,3vw,2.35rem)/1.13 system-ui,sans-serif;
  letter-spacing:-.035em;
}
.article-copy h2[id] { scroll-margin-top:1.25rem; }
.article-copy h2[id]:target { color:var(--deep); }
.article-copy :is(img,video,iframe) { max-width:100%; }
.article-sidebar { grid-column:2; grid-row:1; position:sticky; top:1rem; padding-inline-start:1.25rem; border-inline-start:1px solid var(--line); }
.article-sidebar h2 { font:750 1rem/1.3 system-ui,sans-serif; margin:0; }
.article-sidebar ul { list-style:none; padding:0; margin:.75rem 0 1rem; max-height:55vh; overflow:auto; }
.article-sidebar li + li { margin-top:.45rem; }
.article-sidebar li a { color:#435464; font-size:.95rem; text-decoration:none; }
.article-sidebar li a:hover { color:var(--deep); text-decoration:underline; }
.article-back { display:inline-block; color:var(--deep); font-weight:700; text-underline-offset:.2em; }
.article-next { grid-column:1/-1; padding-top:clamp(1.5rem,4vw,3.5rem); border-top:1px solid var(--line); }
.article-next .blog-grid { margin:1.2rem 0; }
.article-flow { border:0; background:#f3f7f5; }
@media(max-width:760px) {
  .article-layout { grid-template-columns:minmax(0,1fr); }
  .article-sidebar { position:static; grid-column:1; grid-row:auto; }
  .article-sidebar ul { max-height:12rem; }
  .article-copy { grid-row:auto; }
}

#main .contact-hero {
  grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
  gap:clamp(1.5rem,5vw,5.5rem);
  padding:clamp(2.4rem,5.5vw,5.5rem) max(clamp(1.25rem,5vw,4.5rem),calc((100% - 82.5rem)/2));
  background:radial-gradient(ellipse at 94% 20%,#e7f1eb 0%,transparent 65%),#f7f9f8;
}
#main .contact-hero h1 { max-width:13ch; font-size:clamp(2.6rem,5.25vw,5.25rem); }
.contact-hero .hero-content > p:not(.eyebrow) { color:#435464; max-width:36ch; }
#main .contact-hero .industry-hero-art { aspect-ratio:3/2; border-radius:clamp(1rem,2.4vw,2rem); }
.contact-hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:.85rem 1.25rem; margin-top:1.5rem; }
.contact-hero-actions > a:not(.button) { display:inline-flex; white-space:nowrap; font-weight:700; text-underline-offset:.2em; }
#contact-form-title { scroll-margin-top:1.5rem; }
@media(max-width:760px) {
  #main .contact-hero { grid-template-columns:minmax(0,1fr); }
}