/* Align only the footer's live content to the hero rails.
   The footer plate, fades, artwork, section dimensions and background remain untouched. */

@media (min-width:1101px){
  .footer-hero-aligned .csf__stage{
    --footer-rail:170px;
  }

  /* Keep the title, script, swash and lead together while moving the block's
     first line onto the hero's left content edge. */
  .footer-hero-aligned .csf__photo-copy{
    position:absolute;
    z-index:2;
    inset:0;
    transform:translateX(calc(var(--footer-rail) - 134 * var(--u)));
    pointer-events:none;
  }

  /* Align the partner row's outer edges and keep its middle group centered. */
  .footer-hero-aligned .csf__run--powered{
    left:var(--footer-rail)!important;
  }
  .footer-hero-aligned .csf__pair:first-child > .csf__partner{
    left:calc(var(--footer-rail) + 138 * var(--u))!important;
  }
  .footer-hero-aligned .csf__run--proud{
    left:calc(50% - 108 * var(--u))!important;
  }
  .footer-hero-aligned .csf__pair:nth-child(2) > .csf__partner{
    left:calc(50% + 47 * var(--u))!important;
  }
  .footer-hero-aligned .csf__run--accept{
    left:calc(100% - var(--footer-rail) - 250 * var(--u))!important;
  }
  .footer-hero-aligned .csf__pair:last-child .csf__tile:first-child{
    left:calc(100% - var(--footer-rail) - 132 * var(--u))!important;
  }
  .footer-hero-aligned .csf__pair:last-child .csf__tile:last-child{
    left:calc(100% - var(--footer-rail) - 57 * var(--u))!important;
  }
}

/* The hero changes from a fixed 170px rail to a proportional rail at 1450px. */
@media (min-width:1101px) and (max-width:1450px){
  .footer-hero-aligned .csf__stage{
    --footer-rail:clamp(80px,8.947vw,170px);
  }
}

/* The stacked footer uses the same horizontal gutter as the hero. */
@media (min-width:901px) and (max-width:1100px){
  .footer-hero-aligned .csf__stage{
    --m:clamp(80px,8.947vw,170px);
  }
}
@media (max-width:900px){
  .footer-hero-aligned .csf__stage{
    --m:24px;
  }
}