/* Urban Web layout correction — About readability + homepage portfolio */

/* About Urban Web: explicit high-contrast split layout */
.split-band{
  display:grid!important;
  grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr)!important;
  align-items:stretch!important;
  background:#fffdf8!important;
  color:#17363a!important;
  overflow:hidden!important;
}
.split-band>figure{
  min-height:620px!important;
  margin:0!important;
  position:relative!important;
  overflow:hidden!important;
  background:#17363a!important;
}
.split-band>figure img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  filter:saturate(1.04) contrast(1.03)!important;
}
.split-band>section{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  padding:clamp(3.5rem,7vw,7rem)!important;
  background:#fffdf8!important;
  color:#17363a!important;
}
.split-band .eyebrow{
  color:#b94f27!important;
  font-weight:800!important;
  letter-spacing:.15em!important;
}
.split-band h2{
  color:#17363a!important;
  font-size:clamp(2.5rem,4.7vw,5rem)!important;
  line-height:.98!important;
  letter-spacing:-.045em!important;
  margin:.55rem 0 1.5rem!important;
  max-width:700px!important;
}
.split-band .lede,
.split-band p{
  color:#304542!important;
  font-size:clamp(1rem,1.25vw,1.15rem)!important;
  line-height:1.78!important;
  max-width:700px!important;
}
.split-band .lede{font-weight:600!important;color:#223b3b!important}
.split-band .button.dark{
  align-self:flex-start!important;
  margin-top:1rem!important;
  background:#17363a!important;
  color:#fffdf8!important;
  border:2px solid #17363a!important;
  box-shadow:6px 6px 0 #d76332!important;
  opacity:1!important;
  visibility:visible!important;
}
.split-band .button.dark:hover{
  background:#28533d!important;
  color:#fff!important;
  transform:translate(-2px,-2px)!important;
}

/* Portfolio: controlled editorial grid, readable and balanced */
.portfolio-section{
  background:#fffdf8!important;
  padding:clamp(5.5rem,8vw,8.5rem) clamp(1.2rem,4vw,4rem)!important;
}
.portfolio-intro{
  display:grid!important;
  grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr)!important;
  gap:2.5rem!important;
  align-items:end!important;
  max-width:1240px!important;
  margin:0 auto!important;
}
.portfolio-intro h2{
  font-size:clamp(2.65rem,5vw,5.2rem)!important;
  line-height:.98!important;
  max-width:850px!important;
}
.portfolio-intro>p:last-child{
  grid-column:2!important;
  grid-row:1/3!important;
  color:#354a47!important;
  font-size:1.05rem!important;
  line-height:1.75!important;
  max-width:470px!important;
}
.project-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:clamp(2rem,3vw,3.25rem)!important;
  max-width:1240px!important;
  margin:4rem auto 0!important;
}
.project-grid>article,
.project-grid>article:nth-child(even){
  grid-column:auto!important;
  margin:0!important;
  background:#f8f3e8!important;
  border:1px solid rgba(23,54,58,.16)!important;
  box-shadow:8px 8px 0 rgba(40,83,61,.10)!important;
  overflow:hidden!important;
}
.project-grid>article:first-child{
  grid-column:1/-1!important;
}
.project-main-link{
  height:100%!important;
  display:flex!important;
  flex-direction:column!important;
  color:#17363a!important;
  text-decoration:none!important;
}
.project-grid>article:first-child .project-main-link{
  display:grid!important;
  grid-template-columns:minmax(0,1.3fr) minmax(320px,.7fr)!important;
  grid-template-rows:1fr auto!important;
  align-items:stretch!important;
}
.project-browser,
.project-grid>article:nth-child(even) .project-browser{
  margin:0!important;
  border:0!important;
  border-bottom:1px solid rgba(23,54,58,.14)!important;
  border-radius:0!important;
  box-shadow:none!important;
  transform:none!important;
  background:#e7ddc9!important;
  overflow:hidden!important;
}
.project-browser img{
  display:block!important;
  width:100%!important;
  aspect-ratio:16/10!important;
  object-fit:cover!important;
  object-position:top center!important;
}
.project-grid>article:first-child .project-browser{
  grid-row:1/3!important;
  border-right:1px solid rgba(23,54,58,.14)!important;
  border-bottom:0!important;
}
.project-grid>article:first-child .project-browser img{
  height:100%!important;
  min-height:500px!important;
  aspect-ratio:auto!important;
}
.project-card-copy{
  padding:clamp(1.6rem,2.6vw,2.4rem)!important;
}
.project-card-copy h3{
  color:#17363a!important;
  font-size:clamp(1.55rem,2.2vw,2.25rem)!important;
  line-height:1.08!important;
  margin:0 0 .65rem!important;
}
.project-service{color:#b94f27!important;font-weight:800!important}
.project-summary{color:#344946!important;line-height:1.7!important}
.project-main-link>span{
  display:flex!important;
  align-items:center!important;
  gap:.45rem!important;
  margin-top:auto!important;
  padding:0 clamp(1.6rem,2.6vw,2.4rem) clamp(1.6rem,2.6vw,2.4rem)!important;
  color:#1f4332!important;
  font-weight:800!important;
}
.project-main-link:hover .project-browser{transform:none!important;box-shadow:none!important}
.project-grid>article:hover{
  transform:translateY(-4px)!important;
  box-shadow:12px 14px 0 rgba(40,83,61,.14)!important;
}

@media(max-width:900px){
  .split-band{grid-template-columns:1fr!important}
  .split-band>figure{min-height:430px!important}
  .split-band>section{padding:clamp(3rem,8vw,5rem) clamp(1.4rem,5vw,3rem)!important}
  .portfolio-intro{display:block!important}
  .portfolio-intro>p:last-child{margin-top:1.35rem!important;max-width:700px!important}
  .project-grid{grid-template-columns:1fr!important}
  .project-grid>article:first-child{grid-column:auto!important}
  .project-grid>article:first-child .project-main-link{display:flex!important}
  .project-grid>article:first-child .project-browser{border-right:0!important;border-bottom:1px solid rgba(23,54,58,.14)!important}
  .project-grid>article:first-child .project-browser img{height:auto!important;min-height:0!important;aspect-ratio:16/10!important}
}
@media(max-width:640px){
  .split-band>figure{min-height:320px!important}
  .split-band h2{font-size:clamp(2.35rem,11vw,3.4rem)!important}
  .split-band .button.dark{width:100%!important;text-align:center!important}
  .portfolio-section{padding-left:1.1rem!important;padding-right:1.1rem!important}
  .project-grid{gap:2rem!important;margin-top:2.8rem!important}
  .project-grid>article,.project-grid>article:nth-child(even){box-shadow:5px 6px 0 rgba(40,83,61,.10)!important}
}