/*
  YakData visual elevation: Phase 2, Visual Rhythm
  2026-08-28
  Scope: spacing, grouping, section rhythm, and layout breathing room only.
  No copy, image, CTA, route, or section-order changes.
*/

:root{
  --yd-intro-max:960px;
  --yd-intro-gap:44px;
  --yd-block-gap:32px;
  --yd-grid-gap:28px;
  --yd-grid-gap-wide:48px;
  --yd-artifact-space:40px;
}

/* --------------------------------------------------------------------------
   1. Major section openings read as one composed unit
   -------------------------------------------------------------------------- */
body[data-page] :is(
  .section-head,
  .head,
  .home-proof-intro,
  .map-head,
  .episodes-index-head,
  .question-intro
){
  max-width:var(--yd-intro-max);
}

body[data-page] :is(.section-head,.head,.home-proof-intro,.map-head,.episodes-index-head){
  margin-bottom:var(--yd-intro-gap)!important;
}

body[data-page] :is(.section-head,.head,.home-proof-intro,.map-head,.episodes-index-head,.question-intro) .eyebrow,
body[data-page] :is(.section-head,.head,.home-proof-intro,.map-head) > .eyebrow{
  margin-bottom:12px!important;
}

body[data-page] :is(.section-head,.head,.home-proof-intro,.map-head,.episodes-index-head) h2{
  margin-top:0!important;
}

body[data-page] :is(.section-head,.head,.home-proof-intro,.map-head,.episodes-index-head) .lede{
  margin-top:16px!important;
  max-width:72ch;
}

/* Compact split headings stay split, but get more breathing room. */
body[data-page="fde_lab"] .section-head.compact,
body[data-page="77_rules_internal_system"] .section-head.compact,
body[data-page="method"] .section-head.compact{
  column-gap:clamp(36px,4.5vw,64px)!important;
  margin-bottom:44px!important;
}

body[data-page="production_reviews"] .compact-head{
  margin-bottom:40px!important;
}

/* --------------------------------------------------------------------------
   2. Separate explanation from proof without adding new UI
   -------------------------------------------------------------------------- */
body[data-page] :is(
  .system-architecture,
  .production-map-seven,
  .episode-list,
  .role-strip,
  .lesson-grid,
  .reviews-flow,
  .review-lens-grid,
  .thesis-grid,
  .r77-project-shell,
  .r77-boundary-grid,
  .r77-lesson-grid,
  .mth-loop,
  .mth-versus-grid,
  .mth-role-strip
){
  scroll-margin-top:110px;
}

/* Give dense proof surfaces room around them, not extra decoration. */
body[data-page="home"] .system-architecture{
  margin-top:36px!important;
}
body[data-page="home"] .production-map-seven{
  margin-top:36px!important;
}
body[data-page="77_rules_internal_system"] .r77-project-shell,
body[data-page="method"] .mth-loop{
  margin-top:4px!important;
}

/* --------------------------------------------------------------------------
   3. Two-column layouts: clearer hierarchy and less competition
   -------------------------------------------------------------------------- */
@media(min-width:901px){
  body[data-page="home"] .home-proof-lower{
    gap:48px!important;
    grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr)!important;
  }
  body[data-page="home"] .closing-grid{
    gap:56px!important;
  }
  body[data-page] .capture-grid{
    gap:56px!important;
  }
  body[data-page="production_reviews"] .reviews-hero-grid{
    gap:64px!important;
  }
  body[data-page="8x_engineer"] .episode-hero-grid{
    gap:64px!important;
  }
  body[data-page="77_rules_internal_system"] .r77-assurance-grid{
    gap:64px!important;
  }
  body[data-page="method"] .mth-lineage-grid,
  body[data-page="method"] .mth-conversion-grid{
    gap:60px!important;
  }
}

/* --------------------------------------------------------------------------
   4. Repeated groups get more air between units
   -------------------------------------------------------------------------- */
body[data-page="home"] .lab-three,
body[data-page="home"] .cred-grid-simple{
  gap:28px!important;
  margin-top:38px!important;
}

body[data-page="production_reviews"] .recognition-grid,
body[data-page="production_reviews"] .buyer-fit-grid{
  gap:24px!important;
}
body[data-page="production_reviews"] .review-lens-grid{
  gap:18px!important;
}
body[data-page="production_reviews"] .manager-panel{
  margin-top:30px!important;
}

body[data-page="fde_lab"] .case-points,
body[data-page="fde_lab"] .fde-integration{
  margin-top:32px!important;
}

/* --------------------------------------------------------------------------
   5. Calls to action sit after the argument instead of inside it
   -------------------------------------------------------------------------- */
body[data-page] .section > .wrap > .actions,
body[data-page] .head + .actions,
body[data-page="home"] .panel .wrap > .actions{
  margin-top:32px!important;
}

body[data-page] :is(.capture-copy,.closing-cta,.offer-card-copy,.lab-case-copy) > .actions,
body[data-page] :is(.capture-copy,.closing-cta,.offer-card-copy,.lab-case-copy) > :is(.capture-asset-action,.lab-hero-actions){
  margin-top:28px!important;
}

/* --------------------------------------------------------------------------
   6. Home page rhythm: proof is visually dominant, support stays secondary
   -------------------------------------------------------------------------- */
body[data-page="home"] .home-proof-intro{
  max-width:900px!important;
}
body[data-page="home"] .home-proof-lower{
  margin-top:44px!important;
}
body[data-page="home"] .verified-proof-facts{
  align-self:start;
}
body[data-page="home"] .map-note{
  margin-top:28px!important;
}
body[data-page="home"] .success-system{
  margin-top:32px!important;
}
body[data-page="home"] .closing-grid{
  margin-top:44px!important;
  padding-top:44px!important;
}

/* --------------------------------------------------------------------------
   7. FDE Lab: keep the long page calm between dense operating artifacts
   -------------------------------------------------------------------------- */
body[data-page="fde_lab"] .episode-row{
  padding-top:28px!important;
  padding-bottom:28px!important;
}
body[data-page="fde_lab"] .role-strip,
body[data-page="fde_lab"] .lesson-grid{
  margin-top:2px;
}
body[data-page="fde_lab"] .outcome-list li{
  padding-top:19px!important;
  padding-bottom:19px!important;
}

/* --------------------------------------------------------------------------
   8. Technical pages: more outside whitespace, preserve dense internals
   -------------------------------------------------------------------------- */
body[data-page="77_rules_internal_system"] .r77-evidence-note{
  margin-top:28px!important;
}
body[data-page="77_rules_internal_system"] .r77-boundary-grid,
body[data-page="77_rules_internal_system"] .r77-lesson-grid{
  gap:24px!important;
}
body[data-page="method"] .mth-versus-grid,
body[data-page="method"] .mth-role-strip{
  margin-top:4px;
}
body[data-page="8x_engineer"] :is(.thesis-grid,.system-flow,.acceptance-box,.path-grid){
  margin-top:4px;
}

/* --------------------------------------------------------------------------
   9. Mobile: preserve separation without wasting vertical space
   -------------------------------------------------------------------------- */
@media(max-width:900px){
  :root{
    --yd-intro-gap:36px;
  }
  body[data-page] :is(.section-head,.head,.home-proof-intro,.map-head,.episodes-index-head){
    margin-bottom:36px!important;
  }
  body[data-page="fde_lab"] .section-head.compact,
  body[data-page="77_rules_internal_system"] .section-head.compact,
  body[data-page="method"] .section-head.compact{
    margin-bottom:36px!important;
  }
  body[data-page] .capture-grid{
    gap:32px!important;
  }
}

@media(max-width:600px){
  body[data-page] :is(.section-head,.head,.home-proof-intro,.map-head,.episodes-index-head){
    margin-bottom:30px!important;
  }
  body[data-page] :is(.section-head,.head,.home-proof-intro,.map-head,.episodes-index-head) .lede{
    margin-top:13px!important;
  }
  body[data-page="home"] .home-proof-lower{
    margin-top:30px!important;
  }
  body[data-page="home"] .lab-three,
  body[data-page="home"] .cred-grid-simple{
    margin-top:30px!important;
    gap:20px!important;
  }
  body[data-page="production_reviews"] .recognition-grid,
  body[data-page="production_reviews"] .buyer-fit-grid,
  body[data-page="production_reviews"] .review-lens-grid{
    gap:16px!important;
  }
  body[data-page="fde_lab"] .episode-row{
    padding-top:23px!important;
    padding-bottom:23px!important;
  }
  body[data-page="home"] .closing-grid{
    margin-top:34px!important;
    padding-top:34px!important;
  }
}
