/* Agency Nika — case study editorial layout system, 2026-11-05
   Shared across the 14 case detail routes only. Brand-specific colors, gradients,
   creative assets and case metrics remain defined by the original pages. */
body.nika-premium.nika-layout-case {
  --case-content-width: 1200px;
  --case-readable-width: 760px;
  --case-card-line: rgba(29, 25, 49, .11);
  --case-card-shadow: 0 14px 34px rgba(26, 19, 54, .055);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif!important;
}
body.nika-premium.nika-layout-case main {
  min-width: 0;
}
body.nika-premium.nika-layout-case main > section {
  min-width: 0;
}
body.nika-premium.nika-layout-case main > section > .wrap,
body.nika-premium.nika-layout-case main > section > .wrap.wrap {
  width: min(var(--case-content-width), calc(100% - clamp(40px,5.5vw,96px)))!important;
  max-width: var(--case-content-width)!important;
  margin-inline: auto!important;
}
body.nika-premium.nika-layout-case main > section:not(:has(> .wrap)):not(:is(.hero,.case-hero,.nika-related-work,.nika-delivery-note)) {
  padding-inline: max(20px,calc((100% - var(--case-content-width))/2))!important;
}
body.nika-premium.nika-layout-case main > section:not(:is(.hero,.case-hero,.nika-related-work,.nika-delivery-note,.nda-note,.cta,.contact)) {
  padding-block: clamp(68px, 6.8vw, 104px)!important;
}
body.nika-premium.nika-layout-case main > section :is(.wrap,.hero-grid,.story-grid,.section-head,.section-heading,.impact-head,.impact-intro,.metric-grid,.impact-grid,.proof-grid,.outcome-grid,.system-grid,.case-grid,.case-portfolio-grid,.process-grid,.project-grid,.steps,.case-copy,.chapter,.case) {
  min-width: 0;
}
body.nika-premium.nika-layout-case main > section :is(.metric-grid,.impact-grid,.proof-grid,.outcome-grid,.system-grid,.case-index-grid,.case-cards,.numbers-grid,.process-grid) > * {
  min-width: 0;
  max-width: 100%;
}
body.nika-premium.nika-layout-case main > section :is(h1,h2,h3) {
  hyphens: manual;
  overflow-wrap: normal;
  word-break: normal;
  text-wrap: balance;
}
body.nika-premium.nika-layout-case main > section :is(p,li,figcaption) {
  line-height: 1.62;
  overflow-wrap: break-word;
}
body.nika-premium.nika-layout-case main > section :is(.section-heading,.impact-head,.impact-intro,.section-head,.proof-head) {
  column-gap: clamp(24px,4vw,56px)!important;
  row-gap: 18px!important;
  margin-bottom: clamp(28px,3.8vw,48px)!important;
}
body.nika-premium.nika-layout-case main > section :is(.section-heading,.impact-head,.impact-intro,.section-head,.proof-head) h2 {
  font-size: clamp(38px,4.3vw,68px)!important;
  line-height: 1.055!important;
  letter-spacing: -.05em!important;
}
body.nika-premium.nika-layout-case main > section :is(.section-heading,.impact-head,.impact-intro,.section-head,.proof-head) > p {
  font-size: clamp(15px,1.25vw,18px)!important;
  line-height: 1.65!important;
}
body.nika-premium.nika-layout-case main > section:is(.hero,.case-hero) :is(h1,.display),
body.nika-premium.nika-layout-case .case-portfolio-grid .hero-copy h1 {
  font-size: clamp(46px,5.2vw,76px)!important;
  line-height: 1.04!important;
  letter-spacing: -.056em!important;
}
body.nika-premium.nika-layout-case main > section :is(.eyebrow,.kicker,.section-label) {
  letter-spacing: .105em!important;
  line-height: 1.5!important;
}
body.nika-premium.nika-layout-case main > section :is(.impact-grid,.metric-grid,.proof-grid,.outcome-grid,.case-index-grid,.case-cards) {
  gap: clamp(14px,1.6vw,20px)!important;
}
/* KPI cards: content must take precedence over decorative, offset shadows. */
body.nika-premium.nika-layout-case main > section :is(.impact-card,.impact-grid > article,.metric-grid > .metric,.metric-grid > article,.proof-grid > article,.result-card,.hero-board > article) {
  min-width: 0!important;
  border: 1px solid var(--case-card-line)!important;
  border-radius: 20px!important;
  box-shadow: var(--case-card-shadow)!important;
  transform: none!important;
}
body.nika-premium.nika-layout-case main > section :is(.impact-card,.impact-grid > article,.metric-grid > .metric,.metric-grid > article,.proof-grid > article) {
  padding: clamp(22px,2vw,28px)!important;
  min-height: clamp(204px,18vw,248px)!important;
}
body.nika-premium.nika-layout-case main > section :is(.impact-card,.impact-grid > article,.metric-grid > .metric,.metric-grid > article,.proof-grid > article) :is(small) {
  font-size: 11px!important;
  line-height: 1.45!important;
  letter-spacing: .095em!important;
  font-weight: 750!important;
}
body.nika-premium.nika-layout-case main > section :is(.impact-card,.impact-grid > article,.metric-grid > .metric,.metric-grid > article,.proof-grid > article) :is(strong,b) {
  display: block;
  max-width: 100%;
  font-size: clamp(34px,2.55vw,43px)!important;
  line-height: 1.09!important;
  letter-spacing: -.052em!important;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
body.nika-premium.nika-layout-case main > section :is(.impact-card,.impact-grid > article,.metric-grid > .metric,.metric-grid > article,.proof-grid > article) p {
  font-size: clamp(13px,1.06vw,15px)!important;
  font-weight: 550!important;
  line-height: 1.45!important;
  margin-top: 14px!important;
  margin-bottom: 0!important;
}
body.nika-premium.nika-layout-case main > section :is(.impact-card,.impact-grid > article,.metric-grid > .metric,.proof-grid > article) {
  justify-content: flex-start!important;
}
body.nika-premium.nika-layout-case main > section :is(.impact-card,.impact-grid > article,.metric-grid > .metric,.proof-grid > article) :is(strong,b) {
  margin-top: auto!important;
}
body.nika-premium.nika-layout-case main > section :is(.metrics,.numbers-grid) {
  border: 1px solid var(--case-card-line)!important;
  border-radius: 18px!important;
}
body.nika-premium.nika-layout-case main > section .metrics > div {
  padding: clamp(18px,2vw,27px)!important;
  min-width: 0;
  background: rgba(255,255,255,.98);
}
body.nika-premium.nika-layout-case main > section .metrics > div strong {
  font-size: clamp(32px,2.6vw,44px)!important;
  line-height: 1.1!important;
  letter-spacing: -.052em!important;
  overflow-wrap: normal;
  font-variant-numeric: tabular-nums;
}
body.nika-premium.nika-layout-case main > section .metrics > div :is(p,span,small) {
  line-height: 1.46!important;
}
/* Editorial steps: closer headings and supporting paragraphs, without excess dead space. */
body.nika-premium.nika-layout-case main > section :is(.impact-grid,.foundation-grid,.system-grid,.process-grid) > article {
  min-width: 0;
}
body.nika-premium.nika-layout-case main > section :is(.impact-grid,.foundation-grid,.system-grid,.process-grid) > article h3 {
  margin-top: 22px!important;
  margin-bottom: 10px!important;
  overflow-wrap: normal;
  line-height: 1.16!important;
}
body.nika-premium.nika-layout-case main > section :is(.foundation-grid,.system-grid,.process-grid) > article {
  min-height: 0!important;
}
body.nika-premium.nika-layout-case main > section .process-grid {
  border: 1px solid var(--case-card-line)!important;
  border-radius: 20px!important;
}
body.nika-premium.nika-layout-case main > section .process-grid article {
  padding: 24px!important;
  border-color: var(--case-card-line)!important;
}
body.nika-premium.nika-layout-case main > section .process-grid article h3 {
  font-size: clamp(20px,1.8vw,26px)!important;
}
/* Case-specific legacy class collision broke the Wheel Team narrative timeline. */
body.migrated-wheels.nika-premium main > section.story {
  display: block!important;
  grid-template-columns: none!important;
}
body.migrated-wheels.nika-premium main > section.story > .story-grid {
  display: grid!important;
  width: min(1200px,calc(100% - clamp(40px,5.5vw,96px)))!important;
  grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr)!important;
  gap: clamp(38px,5vw,72px)!important;
}
body.migrated-wheels.nika-premium main > section.story .steps > .step {
  display: block!important;
  grid-template-columns: none!important;
  width: 100%!important;
  min-width: 0!important;
  padding: 0 0 48px!important;
}
body.migrated-wheels.nika-premium main > section.story .steps > .step h3 {
  width: auto!important;
  max-width: 28ch!important;
  margin: 0 0 12px!important;
  font-size: clamp(23px,2.15vw,30px)!important;
  line-height: 1.2!important;
}
body.migrated-wheels.nika-premium main > section.story .steps > .step p {
  width: auto!important;
  max-width: 62ch!important;
  font-size: 16px!important;
  line-height: 1.7!important;
}
/* An NDA disclaimer should read like an editorial annotation, not a hero section. */
body.nika-premium.nika-layout-case main > section.nda-note {
  min-height: 0!important;
  padding: 34px 0!important;
  background: #f9f8fc!important;
  border-block: 1px solid #ece9f1!important;
}
body.nika-premium.nika-layout-case main > section.nda-note > .nda-inner {
  width: min(960px,calc(100% - 40px))!important;
  display: grid!important;
  grid-template-columns: 64px minmax(0,1fr)!important;
  gap: 26px!important;
  align-items: center!important;
}
body.nika-premium.nika-layout-case main > section.nda-note .nda-mark {
  width: 64px!important;
  height: 64px!important;
  font-size: 19px!important;
  transform: none!important;
}
body.nika-premium.nika-layout-case main > section.nda-note p {
  font-size: 14px!important;
  line-height: 1.65!important;
  max-width: 78ch!important;
  margin: 7px 0 0!important;
}
/* Automotive capability strip: retain the acid accent but avoid the full-width billboard. */
body.nika-premium.nika-layout-case .capability-strip {
  margin-inline: 0!important;
  width: 100%!important;
  border: 1px solid rgba(151,180,52,.28)!important;
  background: rgba(201,255,47,.16)!important;
  border-radius: 12px!important;
  overflow: hidden;
  justify-content: flex-start!important;
}
body.nika-premium.nika-layout-case .capability-strip > span {
  border-color: rgba(41,52,23,.15)!important;
  font-size: 11px!important;
  letter-spacing: .065em!important;
  padding: 14px 18px!important;
}
body.nika-premium.nika-layout-case main > section :is(.case-index-grid a,.case-cards a) {
  border: 1px solid var(--case-card-line)!important;
  box-shadow: var(--case-card-shadow)!important;
  border-radius: 18px!important;
  min-width: 0;
}
body.nika-premium.nika-layout-case main > section .case-stats {
  border-width: 1px!important;
  border-color: var(--case-card-line)!important;
}
body.nika-premium.nika-layout-case main > section .case-stats > div {
  border-width: 1px!important;
  border-color: var(--case-card-line)!important;
}
body.nika-premium.nika-layout-case main > section .case-stats strong {
  font-size: clamp(32px,3vw,48px)!important;
  line-height: 1.12!important;
  overflow-wrap: normal;
}
body.nika-premium.nika-layout-case main > section :is(.search-card,.sequence,.funnel-card) {
  transform: none!important;
  border-width: 1px!important;
  border-radius: 22px!important;
  box-shadow: 0 18px 40px rgba(23,16,48,.09)!important;
}
body.nika-premium.nika-layout-case main > section :is(.case,.chapter,.workstream) :is(h2,h3,p,li) {
  min-width: 0;
}
@media(max-width:1100px){
  body.nika-premium.nika-layout-case main > section :is(.impact-grid,.proof-grid,.system-grid,.process-grid,.foundation-grid) {
    grid-template-columns: repeat(2,minmax(0,1fr))!important;
  }
  body.nika-premium.nika-layout-case main > section .metric-grid {
    grid-template-columns: repeat(2,minmax(0,1fr))!important;
  }
  body.nika-premium.nika-layout-case main > section .metrics.four {
    grid-template-columns: repeat(2,minmax(0,1fr))!important;
  }
  body.nika-premium.nika-layout-case main > section .process-grid > article:nth-child(2n) {
    border-right: 0!important;
  }
  body.migrated-wheels.nika-premium main > section.story > .story-grid {
    grid-template-columns: minmax(0,1fr)!important;
    gap: 30px!important;
  }
  body.migrated-wheels.nika-premium main > section.story .sticky {
    position: static!important;
  }
}
@media(max-width:720px){
  body.nika-premium.nika-layout-case main > section > .wrap,
  body.nika-premium.nika-layout-case main > section > .wrap.wrap {
    width: calc(100% - 40px)!important;
  }
  body.nika-premium.nika-layout-case main > section:not(:is(.hero,.case-hero,.nika-related-work,.nika-delivery-note,.nda-note,.cta,.contact)) {
    padding-block: 62px!important;
  }
  body.nika-premium.nika-layout-case main > section:is(.hero,.case-hero) :is(h1,.display),
  body.nika-premium.nika-layout-case .case-portfolio-grid .hero-copy h1 {
    font-size: clamp(40px,9.4vw,56px)!important;
    line-height: 1.07!important;
  }
  body.nika-premium.nika-layout-case main > section :is(.section-heading,.impact-head,.impact-intro,.section-head,.proof-head) {
    grid-template-columns: minmax(0,1fr)!important;
    flex-direction: column!important;
    align-items: flex-start!important;
    gap: 15px!important;
    margin-bottom: 28px!important;
  }
  body.nika-premium.nika-layout-case main > section :is(.section-heading,.impact-head,.impact-intro,.section-head,.proof-head) h2 {
    font-size: clamp(35px,8vw,49px)!important;
  }
  body.nika-premium.nika-layout-case main > section :is(.impact-grid,.proof-grid,.system-grid,.process-grid,.foundation-grid,.metric-grid) {
    grid-template-columns: repeat(2,minmax(0,1fr))!important;
  }
  body.nika-premium.nika-layout-case main > section :is(.impact-card,.impact-grid > article,.metric-grid > .metric,.metric-grid > article,.proof-grid > article) {
    min-height: 190px!important;
    padding: 20px!important;
  }
  body.nika-premium.nika-layout-case main > section :is(.impact-card,.impact-grid > article,.metric-grid > .metric,.metric-grid > article,.proof-grid > article) :is(strong,b) {
    font-size: clamp(29px,5.1vw,42px)!important;
  }
  body.nika-premium.nika-layout-case main > section :is(.metrics.three,.metrics.four) {
    grid-template-columns: repeat(2,minmax(0,1fr))!important;
  }
  body.nika-premium.nika-layout-case main > section .metrics > div strong {
    font-size: clamp(30px,5.6vw,40px)!important;
  }
  body.nika-premium.nika-layout-case main > section.nda-note > .nda-inner {
    grid-template-columns: 1fr!important;
    gap: 14px!important;
  }
}
@media(max-width:520px){
  body.nika-premium.nika-layout-case main > section :is(.impact-grid,.proof-grid,.system-grid,.process-grid,.foundation-grid,.metric-grid,.metrics.three,.metrics.four) {
    grid-template-columns: minmax(0,1fr)!important;
  }
  body.nika-premium.nika-layout-case main > section :is(.impact-card,.impact-grid > article,.metric-grid > .metric,.metric-grid > article,.proof-grid > article) {
    min-height: 0!important;
    padding: 22px!important;
  }
  body.nika-premium.nika-layout-case main > section :is(.impact-card,.impact-grid > article,.metric-grid > .metric,.metric-grid > article,.proof-grid > article) :is(strong,b) {
    margin-top: 28px!important;
    font-size: clamp(38px,9.7vw,48px)!important;
  }
  body.nika-premium.nika-layout-case main > section .metrics {
    display: grid!important;
  }
  body.nika-premium.nika-layout-case main > section :is(.case-index-grid,.case-cards,.service-grid,.outcome-grid,.route-grid) {
    grid-template-columns: minmax(0,1fr)!important;
  }
  body.nika-premium.nika-layout-case main > section .case-stats strong {
    font-size: 35px!important;
  }
  body.nika-premium.nika-layout-case .capability-strip > span {
    flex: 1 1 auto;
    text-align: center;
  }
  body.migrated-wheels.nika-premium main > section.story .steps > .step {
    padding-bottom: 32px!important;
  }
}
@media(max-width:350px){
  body.nika-premium.nika-layout-case main > section :is(.impact-card,.impact-grid > article,.metric-grid > .metric,.metric-grid > article,.proof-grid > article) :is(strong,b) {
    font-size: 34px!important;
  }
  body.nika-premium.nika-layout-case main > section .metrics > div strong {
    font-size: 32px!important;
  }
}

/* Narrow-screen fixes found during rendered overflow auditing. */
@media(max-width:600px){
  body.nika-premium.nika-layout-case .subscription-visual {
    min-width: 0!important;
    padding: 24px!important;
    box-shadow: var(--case-card-shadow)!important;
  }
  body.nika-premium.nika-layout-case .subscription-visual > strong {
    max-width: 100%;
    font-size: clamp(54px,13vw,78px)!important;
    letter-spacing: -.055em!important;
  }
  body.nika-premium.nika-layout-case .subscription-flow {
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:center;
    gap:10px!important;
  }
  body.nika-premium.nika-layout-case .subscription-flow :is(b,i) {
    flex: 0 1 auto;
    white-space: normal;
  }
  body.nika-premium.nika-layout-case .search-card {
    min-width: 0!important;
    padding: clamp(18px,5vw,28px)!important;
  }
  body.nika-premium.nika-layout-case .search-path {
    display:flex!important;
    flex-wrap: wrap!important;
    justify-content: flex-start!important;
    gap: 7px!important;
  }
  body.nika-premium.nika-layout-case .search-path > * {
    flex: 0 0 auto;
  }
  body.nika-premium.nika-layout-case .search-path b {
    font-size: 9px!important;
    padding: 6px 7px!important;
  }
  body.nika-premium.nika-layout-case .search-result h3 {
    font-size: clamp(26px,7.5vw,38px)!important;
  }
}

/* Repeated case rows must switch to a single editorial column on tablets/phones.
   Several legacy styles kept a 40/60 split even at 320px. */
@media(max-width:960px) {
  body.nika-premium.nika-layout-case main > section.cases > .case,
  body.nika-premium.nika-layout-case main > section.case,
  body.nika-premium.nika-layout-case main > section .case-grid,
  body.nika-premium.nika-layout-case main > section .project-grid,
  body.nika-premium.nika-layout-case main > section .proof-row,
  body.nika-premium.nika-layout-case main > section .proof-row.reverse {
    grid-template-columns: minmax(0,1fr)!important;
    gap: clamp(20px,4vw,34px)!important;
  }
  body.nika-premium.nika-layout-case main > section.cases > .case > *,
  body.nika-premium.nika-layout-case main > section.case > * {
    min-width: 0!important;
    max-width: 100%;
  }
  body.nika-premium.nika-layout-case main > section.cases > .case .case-work,
  body.nika-premium.nika-layout-case main > section.cases > .case .case-metrics {
    grid-column: 1 / -1!important;
  }
  body.nika-premium.nika-layout-case main > section .proof-row.reverse .proof-copy,
  body.nika-premium.nika-layout-case main > section .proof-row.reverse figure {
    order: initial!important;
  }
}
