/* Site V2 construction family: project flow, document checkpoint and monthly close. */

.construction-v2 { overflow-x: clip; }
.construction-v2__heading { max-width: 860px; }

.construction-hero {
  position: relative;
  padding: 68px 0 64px;
  color: #fff;
  background:
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px),
    radial-gradient(circle at 82% 24%, rgba(251,197,61,.22), transparent 25%),
    linear-gradient(138deg, #2e063d, #531267 56%, #6c1b80);
  background-size: 34px 34px, 34px 34px, auto, auto;
}

.construction-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(330px, .88fr);
  gap: 46px;
  align-items: center;
}

.construction-hero .breadcrumbs,
.construction-hero .breadcrumbs a { color: rgba(255,255,255,.72); }

.construction-hero h1 {
  max-width: 900px;
  margin: 10px 0 18px;
  color: #fff;
  font-size: clamp(2.55rem, 5vw, 4.75rem);
  line-height: .99;
}

.construction-hero__lead {
  max-width: 790px;
  margin: 0;
  color: rgba(255,255,255,.86);
  font-size: clamp(1rem, 1.5vw, 1.18rem);
  line-height: 1.72;
}

.construction-hero__map {
  position: relative;
  min-height: 370px;
  padding: 30px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 30px;
  background: linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.06));
  box-shadow: 0 30px 76px rgba(20,0,28,.27);
  overflow: hidden;
}

.construction-hero__map > p {
  position: relative;
  z-index: 3;
  margin: 0 0 10px;
  color: #f5d368;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .15em;
}

.construction-hero__map h2 {
  position: relative;
  z-index: 3;
  max-width: 430px;
  margin: 0 0 20px;
  color: #fff;
  font-size: clamp(1.45rem, 2.4vw, 2.08rem);
  line-height: 1.14;
}

.construction-hero__badges {
  position: relative;
  z-index: 3;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.construction-hero__badges span {
  padding: 7px 10px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.9);
  font-size: .76rem;
  font-weight: 800;
}

.construction-hero__nodes {
  position: absolute;
  left: 30px;
  right: 30px;
  bottom: 54px;
  height: 74px;
  opacity: .7;
}

.construction-hero__nodes::before {
  content: "";
  position: absolute;
  left: 7%;
  right: 7%;
  top: 36px;
  height: 2px;
  background: linear-gradient(90deg, rgba(245,211,104,.25), #f5d368, rgba(245,211,104,.25));
}

.construction-hero__nodes i {
  position: absolute;
  top: 27px;
  width: 20px;
  height: 20px;
  border: 4px solid #f5d368;
  border-radius: 50%;
  background: #541468;
  box-shadow: 0 0 0 7px rgba(245,211,104,.1);
}

.construction-hero__nodes i:nth-child(1) { left: 7%; }
.construction-hero__nodes i:nth-child(2) { left: 34%; }
.construction-hero__nodes i:nth-child(3) { left: 62%; }
.construction-hero__nodes i:nth-child(4) { right: 7%; }

.construction-hero__map img {
  position: absolute;
  right: -34px;
  bottom: -52px;
  width: 225px;
  height: 225px;
  opacity: .13;
  object-fit: contain;
}

.construction-project-flow__track {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 34px;
  counter-reset: construction-flow;
}

.construction-project-flow__track article {
  position: relative;
  min-height: 220px;
  padding: 26px 24px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 14px 38px rgba(62,12,75,.05);
}

.construction-project-flow__track article:nth-child(2),
.construction-project-flow__track article:nth-child(5) { transform: translateY(18px); }

.construction-project-flow__track article::after {
  content: "";
  position: absolute;
  right: -17px;
  top: 50%;
  width: 18px;
  height: 2px;
  background: #d7aa2d;
}

.construction-project-flow__track article:nth-child(3)::after,
.construction-project-flow__track article:nth-child(6)::after { display: none; }

.construction-project-flow__track span,
.construction-month__grid span {
  display: inline-flex;
  margin-bottom: 16px;
  color: #77218b;
  font-size: .74rem;
  font-weight: 900;
  letter-spacing: .09em;
}

.construction-project-flow__track h3,
.construction-checkpoint__row h3,
.construction-ledger__grid h3,
.construction-month__grid h3,
.construction-scope__grid h3 {
  margin: 0 0 8px;
  font-size: 1.03rem;
}

.construction-project-flow__track p,
.construction-checkpoint__row p,
.construction-ledger__grid p,
.construction-month__grid p,
.construction-scope__grid p {
  margin: 0;
  color: var(--muted);
  line-height: 1.62;
}

.construction-checkpoint__layout {
  display: grid;
  grid-template-columns: minmax(250px, .78fr) minmax(0, 1.22fr);
  gap: 48px;
  align-items: start;
}

.construction-checkpoint__intro {
  position: sticky;
  top: 132px;
  padding: 28px;
  border-radius: 24px;
  color: #fff;
  background: linear-gradient(145deg, #421052, #671879);
  box-shadow: 0 22px 54px rgba(62,12,75,.15);
}

.construction-checkpoint__intro .eyebrow { color: #f5d368; }
.construction-checkpoint__intro h2 { margin: 8px 0 12px; color: #fff; }
.construction-checkpoint__intro p:last-child { margin: 0; color: rgba(255,255,255,.82); line-height: 1.7; }

.construction-checkpoint__rows {
  border: 1px solid var(--line);
  border-radius: 22px;
  overflow: hidden;
  background: #fff;
}

.construction-checkpoint__row {
  display: grid;
  grid-template-columns: minmax(150px,.62fr) minmax(0,1fr) minmax(0,1.15fr);
  gap: 20px;
  align-items: start;
  padding: 24px;
}

.construction-checkpoint__row + .construction-checkpoint__row { border-top: 1px solid var(--line); }
.construction-checkpoint__row strong { color: #5d126e; font-size: .9rem; line-height: 1.5; }

.construction-ledger__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;
  margin-top: 30px;
}

.construction-ledger__grid article {
  position: relative;
  min-height: 178px;
  padding: 24px 22px 22px 26px;
  border: 1px solid var(--line);
  border-left: 5px solid #d7aa2d;
  border-radius: 18px;
  background: #fff;
}

.construction-ledger__grid article:nth-child(even) { border-left-color: #76208a; }

.construction-month__grid,
.construction-scope__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 15px;
  margin-top: 30px;
}

.construction-month__grid article,
.construction-scope__grid article {
  padding: 24px 21px;
  border: 1px solid var(--line);
  border-radius: 19px;
  background: #fff;
}

.construction-month__grid article { border-top: 4px solid #76208a; }

.construction-related {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 24px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fbf8fc;
}

.construction-related > strong { margin-right: 4px; color: var(--purple-900); }
.construction-related a {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  padding: 8px 11px;
  border-radius: 999px;
  background: #fff;
  color: #651677;
  font-size: .84rem;
  font-weight: 850;
}

.construction-cta {
  padding-block: 54px;
  background:
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(135deg, #351044, #6a1a7e);
  background-size: 32px 32px, auto;
  color: #fff;
}

.construction-cta__inner {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 36px;
  align-items: center;
}

.construction-cta h2 { max-width: 800px; margin: 8px 0 10px; color: #fff; }
.construction-cta p:not(.eyebrow) { max-width: 780px; margin: 0; color: rgba(255,255,255,.82); line-height: 1.65; }
.construction-cta__inner > div:last-child { display: grid; gap: 10px; min-width: 245px; }

.construction-v2 a:focus-visible,
.construction-v2 button:focus-visible { outline: 3px solid #f5c53d; outline-offset: 3px; }

@media (max-width: 1040px) {
  .construction-project-flow__track { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .construction-project-flow__track article:nth-child(2),
  .construction-project-flow__track article:nth-child(5) { transform: none; }
  .construction-project-flow__track article::after { display: none; }
  .construction-ledger__grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .construction-month__grid, .construction-scope__grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 900px) {
  .construction-hero__grid,
  .construction-checkpoint__layout { grid-template-columns: 1fr; }
  .construction-checkpoint__intro { position: static; }
}

@media (max-width: 700px) {
  .construction-hero { padding: 46px 0 42px; background-size: 26px 26px, 26px 26px, auto, auto; }
  .construction-hero__grid { gap: 28px; }
  .construction-hero h1 { font-size: clamp(2.12rem, 11vw, 3.15rem); }
  .construction-hero__map { min-height: 310px; padding: 22px; border-radius: 21px; }
  .construction-project-flow__track,
  .construction-ledger__grid,
  .construction-month__grid,
  .construction-scope__grid,
  .construction-cta__inner { grid-template-columns: 1fr; }
  .construction-project-flow__track article { min-height: 0; }
  .construction-checkpoint__row { grid-template-columns: 1fr; gap: 7px; }
  .construction-cta__inner > div:last-child { min-width: 0; }
  .construction-hero .btn, .construction-cta .btn { width: 100%; }
}

@media (max-width: 360px) {
  .construction-hero__map,
  .construction-project-flow__track article,
  .construction-checkpoint__intro,
  .construction-checkpoint__row,
  .construction-ledger__grid article,
  .construction-month__grid article,
  .construction-scope__grid article { padding-inline: 17px; }
}

@media (prefers-reduced-motion: reduce) {
  .construction-project-flow__track article { transform: none !important; }
}
