:root{--photo-accent:#f06423}

/* Loveland Barricade field photography */
.hero{position:relative;background:#111!important;overflow:hidden}
.hero .hero-media{
  display:block!important;
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  overflow:hidden!important;
  background-color:#111!important;
  background-position:center 48%!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  transform:none!important;
  filter:none!important;
  opacity:1!important;
  visibility:visible!important;
}
.hero .hero-media .hero-image{
  display:block!important;
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  object-fit:cover!important;
  object-position:center 48%!important;
  opacity:1!important;
  visibility:visible!important;
  transform:none!important;
  filter:none!important;
}
.hero .hero-shade{
  position:absolute!important;
  inset:0!important;
  z-index:1!important;
  pointer-events:none!important;
  background:
    linear-gradient(90deg,rgba(0,0,0,.80) 0%,rgba(0,0,0,.58) 34%,rgba(0,0,0,.18) 62%,rgba(0,0,0,.02) 100%),
    linear-gradient(0deg,rgba(0,0,0,.18),transparent 58%)!important;
}
.hero .hero-content{position:relative;z-index:2}

.inline-photo-credit{
  display:block;
  margin:-12px 0 15px;
  padding:0 2px;
}

.photo-story{
  padding:48px 0;
  background:#f3f2ef;
  border-top:1px solid #ddd9d2;
  border-bottom:1px solid #ddd9d2;
}
.photo-story.photo-story-dark{
  background:#101112;
  border-color:#2a2c2e;
  color:#fff;
}
.photo-story-head{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);
  align-items:end;
  gap:42px;
  margin-bottom:26px;
}
.photo-story-head h2{
  margin:4px 0 0;
  max-width:760px;
  font-size:clamp(2rem,4vw,3.5rem);
  line-height:1;
}
.photo-story-head p:last-child{
  max-width:520px;
  margin:0 0 4px;
  color:#666b70;
  line-height:1.55;
}
.photo-story-dark .photo-story-head p:last-child{color:#c1c3c5}

.photo-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  align-items:stretch;
}
.photo-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.photo-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.project-photo{
  margin:0;
  overflow:hidden;
  background:#fff;
  border:1px solid #d9d6d0;
  border-radius:5px;
  min-width:0;
  height:100%;
  display:flex;
  flex-direction:column;
}
.photo-story-dark .project-photo{
  background:#17191b;
  border-color:#303235;
}
.project-photo img,
.project-photo.portrait img,
.project-photo.tall img{
  width:100%;
  height:auto!important;
  aspect-ratio:4/3;
  display:block;
  object-fit:cover;
  object-position:center;
  background:#e9e7e2;
  flex:0 0 auto;
}
.project-photo figcaption{
  display:flex;
  flex-direction:column;
  gap:5px;
  padding:13px 14px 14px;
  min-height:76px;
  flex:1;
  font-size:.82rem;
  line-height:1.35;
  color:#555a5f;
}
.photo-story-dark .project-photo figcaption{color:#c5c7c9}
.project-photo figcaption strong{
  color:#17191b;
  font-size:.9rem;
}
.photo-story-dark .project-photo figcaption strong{color:#fff}
.photo-credit{
  display:inline-block;
  color:#777b80;
  font-size:.68rem;
  letter-spacing:.02em;
  text-decoration:none;
}
.photo-story-dark .photo-credit{color:#a9acaf}
.photo-credit:hover{color:var(--photo-accent);text-decoration:underline}

@media(max-width:980px){
  .photo-story-head{grid-template-columns:1fr;align-items:start;gap:12px}
  .photo-grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:760px){
  .photo-story{padding:30px 0}
  .photo-grid,
  .photo-grid.two,
  .photo-grid.four{grid-template-columns:1fr}
  .project-photo figcaption{min-height:0}
}
