/* Compact reading rhythm: more context per viewport, less presentation-deck scale. */
.hero {
  min-height: auto;
  padding-top: 72px;
  padding-bottom: 50px;
  gap: 42px;
}

.hero h1 {
  font-size: clamp(58px, 8.2vw, 118px);
  line-height: .88;
  margin: 32px 0;
}

.hero-footer p { font-size: 17px; }
.statement { padding-top: 100px; padding-bottom: 100px; }
.statement-copy { font-size: clamp(32px, 4.2vw, 58px); }
.work { padding-top: 100px; padding-bottom: 100px; }
.section-head h2 { font-size: clamp(38px, 4.5vw, 62px); }
.project.flagship { grid-column: auto; }
.project-visual,
.flagship .project-visual { height: 500px; }
.project-info { min-height: 155px; }

.flagship .phone {
  width: 180px;
  height: 390px;
  border-width: 5px;
  padding: 38px 14px;
}

.flagship .phone-a { left: 14%; top: 12%; }
.flagship .phone-b { left: 48%; top: 19%; }
.flagship .phone h3 { font-size: 18px; }
.flagship .mini-card { height: 65px; }
.flagship .metric { font-size: 47px; }
.flagship .orbit { left: 8%; top: 3%; }
.flagship .orbit-b { left: -12%; top: -12%; }
.about { padding-top: 105px; padding-bottom: 105px; }
.about h2 { font-size: clamp(38px, 4.5vw, 62px); }
footer { padding-top: 90px; }
footer > a { font-size: clamp(44px, 7vw, 95px); margin-bottom: 90px; }

.fw-hero,
.ai-hero,
.ds-hero,
.about-hero,
.case-hero {
  padding-top: 68px;
  padding-bottom: 58px;
}

.fw-hero h1,
.ai-hero h1,
.ds-hero h1,
.about-hero h1,
.case-hero h1 {
  font-size: clamp(55px, 7.2vw, 102px);
  line-height: .92;
  margin: 55px 0;
}

.fw-summary p,
.ai-summary p,
.ds-summary p,
.about-lead p,
.case-intro > p:first-child {
  font-size: 20px;
}

.shield-cover,
.shield-stage,
.fw-cover,
.fw-cover-inner,
.ds-cover,
.ds-stage {
  min-height: 650px;
}

.ai-manifesto { padding-top: 70px; padding-bottom: 70px; }
.ai-manifesto p { font-size: clamp(30px, 4vw, 52px); }

.method-overview,
.context-section,
.roles-section,
.intervention-section,
.failure-section,
.boundaries-section,
.example-brief,
.truth-section,
.directions-section,
.challenge-section,
.decision-section,
.proof-section,
.ux-artifact,
.flow-artifact,
.iterations,
.edge-artifact,
.metrics-artifact,
.journey-artifact,
.taxonomy-artifact,
.blueprint-artifact,
.story,
.chapter,
.screen-section,
.practice-band,
.about-story,
.capabilities,
.experience,
.outside {
  padding-top: 88px;
  padding-bottom: 88px;
}

.artifact-heading { margin-bottom: 50px; }
.artifact-heading h2 { font-size: clamp(36px, 4.3vw, 58px); }
.story-main h2,
.screen-head h2,
.chapter-body h2,
.about-story h2,
.capabilities h2,
.outside h2 {
  font-size: clamp(38px, 4.5vw, 62px);
  margin-bottom: 50px;
}

.large-copy { font-size: 20px; }
.insight-grid,
.journey,
.entry-model,
.iteration-grid,
.screen-row,
.screen-gallery {
  margin-top: 65px;
}

.question-band { padding-top: 80px; padding-bottom: 80px; }
.question-band h2 { font-size: clamp(38px, 4.8vw, 64px); }
.device-placeholder { height: 390px; }
.screen { min-height: 450px; }
.portrait-stage { padding-top: 65px; padding-bottom: 65px; }
.portrait-placeholder { height: 510px; }
.portrait-note { font-size: 29px; }
.practice-grid article { padding-bottom: 50px; }
.practice-grid h3 { margin-top: 42px; }
.about-contact { padding-top: 100px; padding-bottom: 100px; }
.about-contact h2 { font-size: clamp(44px, 5.5vw, 76px); }
.case-end { padding-top: 95px; padding-bottom: 95px; }
.case-end h2 { font-size: clamp(42px, 5.5vw, 76px); margin-bottom: 70px; }

@media (max-width: 800px) {
  .hero h1,
  .fw-hero h1,
  .ai-hero h1,
  .ds-hero h1,
  .about-hero h1,
  .case-hero h1 {
    font-size: 13.5vw;
  }

  .project-info { min-height: 0; }

  .method-overview,
  .context-section,
  .roles-section,
  .intervention-section,
  .failure-section,
  .boundaries-section,
  .example-brief,
  .truth-section,
  .directions-section,
  .challenge-section,
  .decision-section,
  .proof-section,
  .ux-artifact,
  .flow-artifact,
  .iterations,
  .edge-artifact,
  .metrics-artifact,
  .journey-artifact,
  .taxonomy-artifact,
  .blueprint-artifact,
  .story,
  .chapter,
  .screen-section,
  .practice-band,
  .about-story,
  .capabilities,
  .experience,
  .outside {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
