/*
  YakData visual elevation: Phase 1, Global Design System
  2026-08-28
  Scope: visual system only. No copy, image, CTA, route, or section-order changes.
*/

:root{
  /* Canonical geometry */
  --yd-content-max:1180px;
  --yd-reading-max:800px;

  /* Canonical spacing scale */
  --yd-s1:8px;
  --yd-s2:16px;
  --yd-s3:24px;
  --yd-s4:32px;
  --yd-s5:48px;
  --yd-s6:64px;
  --yd-s7:96px;
  --yd-s8:128px;

  /* Canonical surfaces */
  --yd-line-soft:#E2DFD7;
  --yd-line-strong:#CEC9BE;
  --yd-panel-soft:#F4F1EA;
  --yd-radius:8px;
  --yd-radius-feature:12px;
  --yd-shadow-raised:0 12px 32px rgba(11,29,45,.075);
  --yd-shadow-featured:0 22px 54px rgba(11,29,45,.13);
}

/* --------------------------------------------------------------------------
   1. One content-width system
   -------------------------------------------------------------------------- */
body[data-page] .wrap{
  width:min(var(--yd-content-max), calc(100% - 64px))!important;
  max-width:var(--yd-content-max)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:0!important;
  padding-right:0!important;
}
body[data-page] .prose,
body[data-page] .legal-prose{
  max-width:var(--yd-reading-max)!important;
}
body[data-page] .narrow{
  max-width:var(--yd-reading-max)!important;
}

/* --------------------------------------------------------------------------
   2. Typography hierarchy
   -------------------------------------------------------------------------- */
body[data-page]{
  text-rendering:optimizeLegibility;
  font-kerning:normal;
}
body[data-page] h1,
body[data-page] h2,
body[data-page] h3{
  text-wrap:balance;
  font-kerning:normal;
}
body[data-page] h1{
  letter-spacing:-.024em!important;
}
body[data-page] h2{
  letter-spacing:-.018em!important;
}
body[data-page] h3{
  letter-spacing:-.010em!important;
}
body[data-page] .hero h1,
body[data-page] .home-hero h1,
body[data-page] .lab-hero h1,
body[data-page] .mth-hero h1,
body[data-page] .reviews-hero h1,
body[data-page] .episodes-hero h1{
  line-height:1.015!important;
}
body[data-page] .section h2,
body[data-page] .section-head h2{
  line-height:1.08!important;
}
body[data-page] .eyebrow{
  letter-spacing:.16em!important;
}
body[data-page] .lede,
body[data-page] .hero-lede,
body[data-page] .kicker{
  line-height:1.62!important;
}
body[data-page] p{
  text-wrap:pretty;
}

/* --------------------------------------------------------------------------
   3. Predictable section rhythm
   -------------------------------------------------------------------------- */
body[data-page] .section{
  padding-top:var(--yd-s7)!important;
  padding-bottom:var(--yd-s7)!important;
}
body[data-page="home"] main > section:not(.home-hero):not(.hero){
  padding-top:var(--yd-s7)!important;
  padding-bottom:var(--yd-s7)!important;
}
body[data-page="home"] main > section.tight{
  padding-top:var(--yd-s6)!important;
  padding-bottom:var(--yd-s6)!important;
}
body[data-page] .capture-section{
  padding-top:var(--yd-s7)!important;
  padding-bottom:var(--yd-s7)!important;
}
body[data-page] .section-head{
  margin-bottom:var(--yd-s5)!important;
}
body[data-page] .section-head.compact{
  margin-bottom:var(--yd-s4)!important;
}
body[data-page] .head{
  margin-bottom:var(--yd-s5)!important;
}
body[data-page] .section-head .lede,
body[data-page] .head .lede{
  margin-top:var(--yd-s2)!important;
}

/* --------------------------------------------------------------------------
   4. Surface and border discipline
   Three elevation levels: flat, raised, featured.
   -------------------------------------------------------------------------- */
body[data-page]{
  --line:var(--yd-line-soft);
  --line2:var(--yd-line-strong);
  --line-2:var(--yd-line-strong);
}

/* Raised, reusable cards */
body[data-page] :is(
  .card,
  .lab-card,
  .cred-item,
  .episode,
  .asset,
  .linked-card,
  .score-box,
  .fit-box,
  .manager-box,
  .question-card-final,
  .question-form-wrap
){
  border-radius:var(--yd-radius)!important;
  box-shadow:var(--yd-shadow-raised);
}

/* Featured proof / conversion surfaces */
body[data-page] :is(
  .map-card,
  .case-grid,
  .offer-box,
  .form-card,
  .home-proof-shot,
  .diagnosis-proof img,
  .lab-case-card,
  .episode-hero-card,
  .r77-hero-card,
  .mth-hero-card,
  .offer-card-final
){
  border-radius:var(--yd-radius-feature)!important;
  box-shadow:var(--yd-shadow-featured);
}

/* Flat structural surfaces stay flat. */
body[data-page] :is(
  .operating-map,
  .map-lanes,
  .production-map-seven,
  .lane-strip-five,
  .system-architecture,
  table
){
  box-shadow:none!important;
}

/* Soft panel system, same palette with clearer separation. */
body[data-page] .panel,
body[data-page] .section.tint{
  background:var(--yd-panel-soft)!important;
}

/* --------------------------------------------------------------------------
   5. Component geometry consistency
   -------------------------------------------------------------------------- */
body[data-page] :is(.card,.lab-card,.cred-item,.episode,.asset){
  padding:var(--yd-s4)!important;
}
body[data-page] :is(.card,.lab-card,.cred-item,.episode,.asset) h3{
  margin-top:var(--yd-s1)!important;
  margin-bottom:12px!important;
}
body[data-page] :is(.card,.lab-card,.cred-item,.episode,.asset) p:last-child{
  margin-bottom:0!important;
}

/* Keep buttons structurally identical across the site without changing CTA copy. */
body[data-page] .btn{
  border-radius:4px!important;
  transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease!important;
}
body[data-page] .btn:hover{
  transform:translateY(-1px);
}
body[data-page] .btn:active{
  transform:translateY(0);
}
body[data-page] :focus-visible{
  outline:3px solid var(--gold)!important;
  outline-offset:3px!important;
}

/* Header geometry. No navigation or CTA changes. */
body[data-page] :is(.topbar-inner,.top .wrap){
  min-height:72px!important;
}
body[data-page] .nav{
  gap:26px!important;
}

/* Unified footer width with the same page grid. */
.yd-site-footer .yd-footer-wrap{
  width:min(var(--yd-content-max), calc(100% - 64px))!important;
  max-width:var(--yd-content-max)!important;
}

/* --------------------------------------------------------------------------
   Responsive geometry
   -------------------------------------------------------------------------- */
@media(max-width:900px){
  body[data-page] .wrap,
  .yd-site-footer .yd-footer-wrap{
    width:min(100% - 40px, var(--yd-content-max))!important;
  }
  body[data-page] .section,
  body[data-page="home"] main > section:not(.home-hero):not(.hero),
  body[data-page] .capture-section{
    padding-top:72px!important;
    padding-bottom:72px!important;
  }
}

@media(max-width:600px){
  body[data-page] .wrap,
  .yd-site-footer .yd-footer-wrap{
    width:calc(100% - 32px)!important;
  }
  body[data-page] .section,
  body[data-page="home"] main > section:not(.home-hero):not(.hero),
  body[data-page] .capture-section{
    padding-top:56px!important;
    padding-bottom:56px!important;
  }
  body[data-page="home"] main > section.tight{
    padding-top:48px!important;
    padding-bottom:48px!important;
  }
  body[data-page] .section-head,
  body[data-page] .head{
    margin-bottom:32px!important;
  }
  body[data-page] :is(.card,.lab-card,.cred-item,.episode,.asset){
    padding:24px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  body[data-page] .btn{transition:none!important}
  body[data-page] .btn:hover{transform:none!important}
}