/* Shared reading rows and spacing after the homepage type-size increase.
   Font sizes, motion and the original artwork remain owned by their stylesheets. */
#main #choose .foundation-atlas-art figcaption {
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  text-align:center;
}
#main #choose .foundation-atlas-art figcaption > [data-foundation-caption] { min-width:0; }
#main #choose .foundation-atlas-next { align-items:center; gap:24px; }
#main #choose .foundation-atlas-next > span:first-child { min-width:0; }
#main #choose .foundation-atlas-next-action { align-items:center; gap:20px; }
#main #platform .evidence-next { align-items:start; }
#main #platform .evidence-next-copy { min-width:0; }
#main #platform .evidence-next-copy > a > span { flex-shrink:0; }
#main #aisco .aisco-list > div { align-items:start; }
#main #aisco .aisco-list > div > section { min-width:0; }
#main #ownership .ghost-principle > div { min-width:0; }
#main #ownership .story-security summary { align-items:flex-start; }
#main #ownership .story-security summary::after { flex-shrink:0; }
#main #contact .rai-paths > a > b > i { flex-shrink:0; }
#site-footer .footer-links { align-items:start; }

@media(min-width:761px) {
  /* The controls and artwork finish together above the next-chapter divider. */
  #main #choose .foundation-atlas-composition { align-items:stretch; }
  #main #choose .foundation-atlas-editorial { display:flex; flex-direction:column; padding-bottom:0; }
  #main #choose .foundation-atlas-controls { margin-top:auto; }
  #main #choose .foundation-atlas-art { align-self:end; margin-bottom:0; }
}

@supports(grid-template-rows:subgrid) {
  @media(min-width:601px) {
    /* A wrapped protocol title cannot push only its own paragraph down. */
    #main #protocol .protocol-v2-steps { grid-template-rows:repeat(4,auto); row-gap:0; }
    #main #protocol .protocol-v2-steps > li {
      display:grid;
      grid-row:span 4;
      grid-template-rows:subgrid;
      row-gap:0;
      align-content:start;
    }
    #main #protocol .protocol-v2-node { grid-row:1; }
    #main #protocol .protocol-v2-steps > li > div {
      display:grid;
      grid-row:2 / span 3;
      grid-template-rows:subgrid;
      row-gap:0;
      min-width:0;
    }
    #main #protocol .protocol-v2-stage { grid-row:1; }
    #main #protocol .protocol-v2-steps h4 { grid-row:2; }
    #main #protocol .protocol-v2-steps p { grid-row:3; }
  }
  @media(min-width:901px) {
    /* Share label, title, copy and action rows across the three RAI choices. */
    #main #contact .rai-paths { grid-template-rows:auto auto 1fr auto; row-gap:0; }
    #main #contact .rai-paths > a {
      display:grid;
      grid-row:span 4;
      grid-template-rows:subgrid;
      row-gap:0;
      align-items:start;
    }
    #main #contact .rai-paths > a > span:not([aria-hidden]) { grid-row:1; }
    #main #contact .rai-paths > a > strong { grid-row:2; }
    #main #contact .rai-paths > a > p { grid-row:3; }
    #main #contact .rai-paths > a > b { grid-row:4; align-self:end; margin-top:0; }
  }
}

@media(min-width:601px) and (max-width:1100px) {
  /* This matches the typography sheet's two-column protocol breakpoint. */
  #main #protocol .protocol-v2-steps > li::before { display:none; }
  #main #protocol .protocol-v2-steps > li:nth-child(n+3) { border-top:1px solid var(--line); }
  #main #protocol .protocol-v2-steps > li:nth-child(2n) { border-left:1px solid var(--line); }
}
@media(max-width:900px) {
  /* Three narrow text columns are no longer comfortable with full-size copy. */
  #main #contact .rai-paths { grid-template-columns:minmax(0,1fr); }
  #main #contact .rai-paths > a { min-height:0; }
  #main #contact .rai-paths > a + a { border-left:0; border-top:1px solid var(--line); }
}
@media(max-width:760px) {
  #main #choose .foundation-light-canvas,
  #main #choose .foundation-atlas-illustration > svg { transform:none; }
  #main #choose .foundation-atlas-next { align-items:stretch; gap:18px; }
  #main #choose .foundation-atlas-next-action { width:100%; justify-content:space-between; gap:16px; }
  #main #platform .evidence-next { gap:22px; }
}
@media(max-width:600px) {
  /* The desktop flex basis becomes a height when this header stacks. */
  #main #protocol .protocol-v2-transaction-head > div { flex:0 1 auto; width:100%; }
  #main #protocol .protocol-v2-transaction-head { gap:18px; }
  #main #protocol .protocol-v2-policy { align-self:flex-start; }
}
