/* Flowhaze layout refinement — August 2026
   Keeps established content and assets while correcting alignment,
   header scale consistency, services symmetry and decorative numbering. */

/* A single page-heading scale across inner pages. */
[data-page="about"] .inner-hero h1,
[data-page="services"] .inner-hero h1,
[data-page="ai"] .inner-hero h1,
[data-page="work"] .inner-hero h1,
[data-page="process"] .inner-hero h1 {
  font-size: clamp(2.9rem, 4vw, 4.45rem) !important;
  line-height: .98 !important;
  letter-spacing: -.052em !important;
}

/* Why Us: reduce the oversized heading while retaining the existing composition. */
[data-page="about"] .inner-hero-grid {
  grid-template-columns: minmax(0,.92fr) minmax(0,1.08fr) !important;
  gap: clamp(48px,6vw,84px) !important;
}
[data-page="about"] .inner-hero p { max-width: 590px !important; }

/* Home work heading: start precisely on the first card edge and sit closer to it. */
[data-page="home"] .work-section > .shell {
  max-width: min(1220px, calc(100% - 48px)) !important;
}
[data-page="home"] .work-section .section-heading {
  width: 100% !important;
  grid-template-columns: minmax(0,1.05fr) minmax(280px,.55fr) !important;
  gap: 52px !important;
  margin: 0 0 34px !important;
  align-items: end !important;
}
[data-page="home"] .work-section .section-heading > div,
[data-page="home"] .work-section .section-heading h2 {
  margin-left: 0 !important;
  padding-left: 0 !important;
}
[data-page="home"] .work-section .section-heading h2 {
  font-size: clamp(2.55rem,3.55vw,4rem) !important;
  line-height: .98 !important;
}
[data-page="home"] .work-section .section-heading p {
  justify-self: end !important;
  max-width: 340px !important;
  margin: 0 !important;
}
[data-page="home"] .production-video-grid {
  max-width: none !important;
  margin: 0 !important;
}

/* Services: replace alternating oversized rows with a compact, balanced card grid. */
[data-page="services"] .service-stack {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 24px !important;
  max-width: 1180px !important;
  margin-inline: auto !important;
}
[data-page="services"] .service-feature,
[data-page="services"] .service-feature-reverse {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
  align-content: start !important;
  overflow: hidden !important;
  border: 1px solid rgba(13,13,13,.12) !important;
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: 0 12px 36px rgba(13,13,13,.055) !important;
}
[data-page="services"] .service-feature-reverse .service-image {
  order: 0 !important;
}
[data-page="services"] .service-image {
  width: 100% !important;
  height: 260px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #0d0d0d !important;
}
[data-page="services"] .service-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
[data-page="services"] .service-copy {
  padding: 30px 32px 34px !important;
  min-height: 285px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
}
[data-page="services"] .service-copy h2 {
  font-size: clamp(2rem,2.45vw,2.85rem) !important;
  line-height: 1.02 !important;
  margin: 0 0 14px !important;
}
[data-page="services"] .service-copy p {
  margin: 0 0 20px !important;
  max-width: 520px !important;
}
[data-page="services"] .service-copy ul {
  margin: auto 0 0 !important;
}
[data-page="services"] .service-copy .inline-link {
  margin-top: 22px !important;
}

/* Number markers have been removed from HTML. Hide any legacy marker that survives. */
.case-copy > span:first-child,
.service-copy > span:first-child,
.principle > span:first-of-type,
.timeline-item > span:first-of-type,
.brief-grid article > span:first-of-type,
.ai-cap-grid article > span:first-of-type,
.engagement-list article > span:first-child {
  display: none !important;
}

@media (max-width: 1000px) {
  [data-page="home"] .work-section .section-heading {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }
  [data-page="home"] .work-section .section-heading p {
    justify-self: start !important;
  }
  [data-page="services"] .service-stack {
    grid-template-columns: 1fr !important;
    max-width: 720px !important;
  }
  [data-page="about"] .inner-hero-grid { grid-template-columns: 1fr !important; }
}

@media (max-width: 700px) {
  [data-page="about"] .inner-hero h1,
  [data-page="services"] .inner-hero h1,
  [data-page="ai"] .inner-hero h1,
  [data-page="work"] .inner-hero h1,
  [data-page="process"] .inner-hero h1 {
    font-size: clamp(2.55rem,12vw,3.5rem) !important;
  }
  [data-page="home"] .work-section > .shell {
    max-width: none !important;
    width: calc(100vw - 28px) !important;
  }
  [data-page="home"] .work-section .section-heading {
    margin-bottom: 22px !important;
  }
  [data-page="home"] .work-section .section-heading h2 {
    font-size: clamp(2.35rem,11vw,3.15rem) !important;
  }
  [data-page="services"] .service-stack { gap: 18px !important; }
  [data-page="services"] .service-image { height: 205px !important; }
  [data-page="services"] .service-copy {
    padding: 24px 22px 27px !important;
    min-height: 0 !important;
  }
  [data-page="services"] .service-copy h2 {
    font-size: 2rem !important;
  }
}
