/* Mint editorial layout pass, 17 Sep 2026.
   Homepage only: preserve our actual mint / ink identity, existing content,
   accessibility and guided intake. No fabricated trust metrics or decorative emoji. */

/* Give the value proposition and real work a quicker first-screen handoff. */
.hero { min-height: 0; padding: clamp(44px,5.5vw,70px) clamp(24px,5vw,76px) 30px; margin-bottom: 58px; }
.hero h1 { font-size: clamp(47px,6.1vw,83px); max-width: 1020px; margin: 16px 0 18px; text-wrap: balance; }
.hero-copy { font-size: clamp(16px,1.7vw,18px); line-height: 1.53; max-width: 710px; }
.hero .hero-actions { margin-top: 22px; }
.hero .trust-strip { margin-top: 35px; }
@media (max-width: 700px) {
  .hero { padding: 38px 22px 22px; margin-bottom: 42px; border-radius: 24px; }
  .hero h1 { font-size: clamp(39px,10.2vw,58px); line-height: 1.03; }
  .hero .trust-strip { margin-top: 27px; }
}

/* Break the repeated row of three same-sized service tiles. */
#readiness + .section .service-grid {
  grid-template-columns: minmax(0, 1.35fr) minmax(0, .85fr);
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
#readiness + .section .service-grid > .card:first-child {
  grid-row: 1 / span 2;
  min-height: 430px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: var(--ink);
  color: #f8faf7;
}
#readiness + .section .service-grid > .card:first-child .num { color: var(--mint); }
#readiness + .section .service-grid > .card:first-child p,
#readiness + .section .service-grid > .card:first-child ul { color: #d4e4dc; }
#readiness + .section .service-grid > .card:first-child h3 {
  max-width: 16ch;
  font-size: clamp(32px, 3.6vw, 53px);
}
#readiness + .section .service-grid > .card:not(:first-child) { min-height: 200px; }
#readiness + .section .service-grid > .card:not(:first-child) h3 { margin-top: 14px; }

/* Lead with one real case study instead of three interchangeable cards. */
#readiness ~ .section .work-grid {
  grid-template-columns: minmax(0, 1.3fr) minmax(0, .9fr);
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
#readiness ~ .section .work-grid > .work-card:first-child {
  grid-row: 1 / span 2;
  min-height: 440px;
  padding: clamp(28px, 4vw, 54px);
}
#readiness ~ .section .work-grid > .work-card:first-child h3 {
  font-size: clamp(40px, 4.2vw, 64px);
  max-width: 11ch;
}
#readiness ~ .section .work-grid > .work-card:not(:first-child) { min-height: 205px; }
#readiness ~ .section .work-grid > .work-card:not(:first-child) h3 { margin-top: 13px; }

/* Editorial process rows, not another row of three identical boxes. */
#readiness ~ .section .process-grid {
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  border-top: 1px solid var(--line);
}
#readiness ~ .section .process-grid > .card {
  min-height: 130px;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  padding: 27px 9px;
  display: grid;
  grid-template-columns: 80px minmax(0, 0.8fr) minmax(0, 1.2fr);
  align-items: center;
  gap: 24px;
}
#readiness ~ .section .process-grid > .card h3 { margin: 0; font-size: clamp(25px, 3vw, 36px); }
#readiness ~ .section .process-grid > .card p { margin: 0; font-size: 15px; }
#readiness ~ .section .process-grid > .card .num { font-size: 13px; }

@media (max-width: 920px) {
  #readiness + .section .service-grid,
  #readiness ~ .section .work-grid { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; }
  #readiness + .section .service-grid > .card:first-child,
  #readiness ~ .section .work-grid > .work-card:first-child { grid-row: auto; min-height: 300px; }
  #readiness + .section .service-grid > .card:not(:first-child),
  #readiness ~ .section .work-grid > .work-card:not(:first-child) { min-height: auto; }
  #readiness ~ .section .process-grid > .card {
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 12px 18px;
    padding: 23px 0;
  }
  #readiness ~ .section .process-grid > .card p { grid-column: 2; }
}
@media (max-width: 560px) {
  #readiness + .section .service-grid > .card:first-child,
  #readiness ~ .section .work-grid > .work-card:first-child { min-height: auto; }
  #readiness + .section .service-grid > .card:first-child h3,
  #readiness ~ .section .work-grid > .work-card:first-child h3 { font-size: 37px; }
  #readiness ~ .section .process-grid > .card p { font-size: 14px; }
}


/* Keep the commercial offer and a real project within the opening section. */
.hero-project-link{display:inline-flex;gap:12px;margin-top:20px;font-size:15px;font-weight:750;text-decoration:underline;text-underline-offset:4px}
.hero-project-link:focus-visible{outline:3px solid var(--mint);outline-offset:5px}