/* =========================================================
   NZ recruiter refinement — homepage only
   Inspired by the light, image-led editorial rhythm of anil.design.
   Existing colour theme and #d9ff55 accent are preserved.
   ========================================================= */

body.homepage-v4 {
  --portfolio-accent: #d9ff55;
}

/* Keep the page quiet and spacious */
body.homepage-v4 .section {
  padding-top: clamp(88px, 10vw, 148px) !important;
  padding-bottom: clamp(88px, 10vw, 148px) !important;
}

body.homepage-v4 .section-head {
  margin-bottom: clamp(44px, 6vw, 78px) !important;
  gap: 28px !important;
}

/* Titles use the same confident Manrope language as the hero */
body.homepage-v4 .section-head h2,
body.homepage-v4 .outcomes-intro h2,
body.homepage-v4 #capabilities h2,
body.homepage-v4 .experience h2,
body.homepage-v4 .voices h2,
body.homepage-v4 .contact-box h2 {
  font-family: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: clamp(2.75rem, 5.4vw, 4.8rem) !important;
  line-height: 1 !important;
  letter-spacing: 0em !important;
  font-weight: 750 !important;
  text-wrap: balance !important;
}

body.homepage-v4 .section-head h2::after,
body.homepage-v4 .outcomes-intro h2::after {
  display: none !important;
}

/* ---------- Free-hanging project gallery ---------- */
body.homepage-v4 #work .project-stack-wrap {
  overflow: visible !important;
}

body.homepage-v4 #work .project-stack {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: clamp(76px, 9vw, 132px) clamp(32px, 5.5vw, 76px) !important;
  align-items: start !important;
  overflow: visible !important;
}

body.homepage-v4 #work .stack-card,
body.homepage-v4 #work .stack-card.is-cascade-active,
body.homepage-v4 #work .stack-card.is-cascade-back-1,
body.homepage-v4 #work .stack-card.is-cascade-back-2,
body.homepage-v4 #work .stack-card.is-cascade-hidden,
body.homepage-v4 #work .stack-card.is-current,
body.homepage-v4 #work .stack-card.is-covered {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  width: auto !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  scale: 1 !important;
  filter: none !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  pointer-events: auto !important;
  z-index: auto !important;
}

body.homepage-v4 #work .stack-card:nth-child(even) {
  /*margin-top: clamp(70px, 8vw, 118px) !important; */
}

body.homepage-v4 #work .stack-card:nth-child(5) {
  margin-top: 0px !important;
}

/* Project imagery feels pinned/hanging, not boxed */
body.homepage-v4 #work .stack-media,
body.homepage-v4 #work .stack-card:nth-child(even) .stack-media {
  position: relative !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  aspect-ratio: 1.28 / 1 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0px !important;
  background: none !important;
  box-shadow: 0 15px 34px rgba(0,0,0,0) !important;
  /* transform: rotate(-.75deg) !important; */
  transition: transform .3s ease, box-shadow .3s ease !important;
}

body.homepage-v4 #work .stack-card:nth-child(even) .stack-media {
  /* transform: rotate(.7deg) !important; */
}

body.homepage-v4 #work .stack-card:nth-child(3) .stack-media {
  /* transform: rotate(.45deg) !important; */
}

body.homepage-v4 #work .stack-card:nth-child(5) .stack-media {
  /* transform: rotate(-.4deg) !important; */
}

body.homepage-v4 #work .stack-media::before,
body.homepage-v4 #work .stack-media::after,
body.homepage-v4 #work .media-chrome,
body.homepage-v4 #work .media-status,
body.homepage-v4 #work .media-sheen {
  display: none !important;
  content: none !important;
}

body.homepage-v4 #work .stack-media img,
body.homepage-v4 #work .stack-card:nth-child(even) .stack-media img {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  transform: none !important;
  transition: transform .35s ease !important;
}

body.homepage-v4 #work .stack-card:hover .stack-media,
body.homepage-v4 #work .stack-card:focus-within .stack-media {
  transform: rotate(0deg) translateY(-3px) !important;
  /* box-shadow: 0 18px 40px rgba(0,0,0,.10) !important; */
}

body.homepage-v4 #work .stack-card:hover .stack-media img,
body.homepage-v4 #work .stack-card:focus-within .stack-media img {
  /* transform: scale(1.012) !important; */
}

/* Compact recruiter-first copy kept close to the image */
body.homepage-v4 #work .stack-content {
  width: 100% !important;
  max-width: 580px !important;
  padding: 22px 4px 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.homepage-v4 #work .stack-content::after {
  display: none !important;
}

body.homepage-v4 #work .project-kicker {
  margin: 0 0 9px !important;
  color: inherit !important;
  opacity: .68 !important;
  font-size: .78rem !important;
  line-height: 1.35 !important;
  font-weight: 650 !important;
  letter-spacing: .035em !important;
  text-transform: uppercase !important;
}

body.homepage-v4 #work .stack-content h3 {
  max-width: 17ch !important;
  margin: 0 !important;
  font-family: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: clamp(1.65rem, 2.6vw, 2.55rem) !important;
  line-height: 1.04 !important;
  letter-spacing: -.04em !important;
  font-weight: 560 !important;
  text-wrap: balance !important;
}

body.homepage-v4 #work .project-recruiter-summary {
  max-width: 48ch !important;
  margin: 13px 0 0 !important;
  font-size: .98rem !important;
  line-height: 1.6 !important;
  opacity: .76 !important;
}

body.homepage-v4 #work .project-role {
  margin: 13px 0 0 !important;
  font-size: .82rem !important;
  line-height: 1.45 !important;
  font-weight: 650 !important;
  opacity: .66 !important;
}

body.homepage-v4 #work .case-link {
  width: fit-content !important;
  height: 100%;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-top: 18px !important;
  padding: 0 0 4px !important;
  /* color: inherit !important; */
  background: transparent !important;
  border: 0 !important;
  border-bottom: 0px solid var(--portfolio-accent) !important;
  border-radius: 0 !important;
  font-size: .92rem !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

body.homepage-v4 #work .case-link span {
  transition: transform .2s ease !important;
}

body.homepage-v4 #work .case-link:hover span,
body.homepage-v4 #work .case-link:focus-visible span {
  transform: translate(2px, -2px) !important;
  color: #666;
}

/* ---------- Outcomes: keep evidence, remove explanation overload ---------- */
body.homepage-v4 .outcomes-intro > p:last-child {
  max-width: 42ch !important;
  line-height: 1.55 !important;
}

body.homepage-v4 .outcome {
  min-height: 0 !important;
}

body.homepage-v4 .outcome h3 {
  margin-bottom: 0 !important;
  font-weight: 560 !important;
}

/* ---------- Capabilities: compact overview, not a second CV ---------- */
body.homepage-v4 #capabilities .cap-grid {
  gap: clamp(20px, 2.5vw, 34px) !important;
}

body.homepage-v4 #capabilities .cap {
  min-height: 0 !important;
}

body.homepage-v4 #capabilities .cap h3 {
  font-family: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: clamp(1.35rem, 2vw, 1.8rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -.03em !important;
  font-weight: 560 !important;
}

body.homepage-v4 #capabilities .cap p {
  max-width: 34ch !important;
  line-height: 1.55 !important;
}

/* Improve scan rhythm without changing the existing colour theme */
body.homepage-v4 .eyebrow {
  letter-spacing: .08em !important;
  font-weight: 700 !important;
}

@media (max-width: 820px) {
  body.homepage-v4 #work .project-stack {
    grid-template-columns: 1fr !important;
    gap: 72px !important;
  }

  body.homepage-v4 #work .stack-card:nth-child(even),
  body.homepage-v4 #work .stack-card:nth-child(5) {
    margin-top: 0 !important;
  }

  body.homepage-v4 #work .stack-media,
  body.homepage-v4 #work .stack-card:nth-child(even) .stack-media,
  body.homepage-v4 #work .stack-card:nth-child(3) .stack-media,
  body.homepage-v4 #work .stack-card:nth-child(5) .stack-media {
    transform: none !important;
  }
}

@media (max-width: 560px) {
  body.homepage-v4 .section {
    padding-top: 78px !important;
    padding-bottom: 78px !important;
  }

  body.homepage-v4 .section-head h2,
  body.homepage-v4 .outcomes-intro h2,
  body.homepage-v4 #capabilities h2,
  body.homepage-v4 .experience h2,
  body.homepage-v4 .voices h2,
  body.homepage-v4 .contact-box h2 {
    font-size: clamp(2.35rem, 11vw, 3.5rem) !important;
    line-height: 1.01 !important;
  }

  body.homepage-v4 #work .stack-content {
    padding-top: 18px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.homepage-v4 #work .stack-media,
  body.homepage-v4 #work .stack-media img,
  body.homepage-v4 #work .case-link span {
    transition: none !important;
  }
}

/* Three cross-industry outcomes: balanced columns, clear hierarchy. */
body.homepage-v4 .outcome-grid-three {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0 !important;
}
body.homepage-v4 .outcome-grid-three .outcome {
  min-width: 0;
  padding: 28px clamp(12px, 1.5vw, 24px) 30px !important;
  border-right: 1px solid rgba(0,0,0,.12) !important;
}
body.homepage-v4 .outcome-grid-three .outcome:last-child { border-right: 0 !important; }
body.homepage-v4 .outcome-grid-three .outcome h3 { font-size: clamp(15px, 1.35vw, 18px); line-height: 1.35; }
body.homepage-v4 .outcome-grid-three .outcome small { display:block; min-height: 2.5em; margin-bottom: 16px; }
@media (max-width: 680px) {
  body.homepage-v4 .outcome-grid-three { grid-template-columns: 1fr !important; }
  body.homepage-v4 .outcome-grid-three .outcome { border-right: 0 !important; padding: 24px 12px !important; }
  body.homepage-v4 .outcome-grid-three .outcome small { min-height: 0; margin-bottom: 10px; }
}

/* Keep metric provenance legible without changing the outcomes grid. */
body.homepage-v4 .outcomes-evidence { margin: 14px 0 0; color: #626870; font-size: 12px; line-height: 1.5; }
body.homepage-v4 .outcomes-evidence a { color: #3e4952; text-decoration: underline; text-underline-offset: 3px; }
body.homepage-v4 .outcomes-evidence a:hover { color: #007a40; }