/* Cross-link strip at the end of a page (card 29A-18, GT-Bravo; NAVIGATION-RULEBOOK rule 7): at most 3 cards to the sibling pages.
   Each card is the target page's own heading and its own one-line lead. Lines #2A4BB0 (light) and #8FA6EE (dark); no orange. */
.xl{--xl-line:#2A4BB0}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .xl{--xl-line:#8FA6EE}}
:root[data-theme="dark"] .xl{--xl-line:#8FA6EE}
.xl .wrap{padding-block:clamp(28px,3vw,40px)}
.xl-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,40px)}
.xl-card{display:flex;flex-direction:column;gap:10px;padding-top:20px;border-top:2px solid var(--xl-line);text-decoration:none;color:var(--text);min-height:44px;transition:border-color .2s ease}
.xl-card .xl-h{margin:0;font-size:clamp(1.25rem,1.6vw,1.5rem);line-height:1.2;font-weight:700}
.xl-card .xl-p{margin:0;font-size:1rem;line-height:1.5;color:var(--muted)}
.xl-card::after{content:"\2192" / "";margin-top:0;padding-top:2px;font-size:1.25rem;line-height:1;color:var(--xl-line);transition:transform .2s ease}
@media (hover:hover) and (pointer:fine){.xl-card:hover::after{transform:translateX(5px)}.xl-card:hover .xl-h{text-decoration:underline;text-decoration-color:var(--xl-line);text-underline-offset:4px;text-decoration-thickness:2px}}
.xl-card:focus-visible{outline:3px solid var(--xl-line);outline-offset:6px}
@media (max-width:900px){.xl-row{grid-template-columns:minmax(0,1fr);gap:28px}}
@media (prefers-reduced-motion:reduce){.xl-card,.xl-card::after{transition:none}}
/* Page budget (rulebook rule 9: at most 7,200 px at 1440 and 10,100 px at 390): a shorter hero and tighter band padding on the two split pages.
   Nothing is removed. The hero keeps its persona rotation. */
@media (min-width:961px){
  .home-hero.sp{min-height:clamp(400px,46svh,420px)}
  .home-hero.sp > .wrap{padding-block:48px}
}
@media (max-width:760px){.home-hero.sp .hero-media{aspect-ratio:16/9}}
main:has(.home-hero.sp) .band{padding-block:56px}
main:has(.home-hero.sp) .band.xl{padding-block:0}
@media (max-width:900px){main:has(.home-hero.sp) .band{padding-block:36px}.xl .wrap{padding-block:28px}.xl-row{gap:22px}}
/* the AI page has one reader group, so the group strip would hold a single tab */
.tc-reader[data-reader="ai"] .tc-gstrip{display:none}
/* 29A-23 part 3: phone length (limits 10,100 px for Application and AI, 8,400 px for Solutions) */
@media (max-width:760px){
  main:has(.home-hero.sp) .band{padding-block:24px}
  main:has(.home-hero.sp) .band.xl{padding-block:0}
  .xl .wrap{padding-block:20px}
  #explainers .tc-reader.tc-reader{padding-block:28px}
  .cus1 ~ * .close,.band .close,.rail .close{margin-top:24px;padding-top:20px}
  .rcv-steps{gap:6px;margin-bottom:12px}
  #needs .needs-head{margin-bottom:16px}
  .pilot-top{margin-bottom:16px}
  #ai-solution-pilot .ladder{margin-top:20px}
  .dg-pad{margin-block:16px}
  .glance-wrap{padding-top:16px}
  .sol-reader .tc-reader.tc-reader{padding-block:28px}
  .home-hero.sp .wrap{padding-block:28px 24px}
  .ov-card + .ov-card{margin-top:20px;padding-top:20px}
  .sol-ov .ov-card .glance{margin:16px 0 20px}
  .sol-ov .cm-row{padding-block:10px}
  .sol-ov .chips{gap:8px}
  .sol-ov .writ{margin-top:20px}
  .ledger > li{padding-block:12px}
  #explainers .tc-tab,.sol-reader .tc-tab{height:92px;padding:10px 16px}
  .close-band h2{font-size:28px;margin-bottom:20px}
  .tc-head{gap:8px}
  .tc-body{gap:16px}
  .tc-card{gap:16px}
  .ladder > ol > li,.ladder li{padding-block:12px}
  .sol-ov .cm .cm-row{padding-block:8px}
  .sol-ov .pick{margin-top:16px}
  .sol-ov .wlist{margin-top:8px;gap:8px}
  .home-hero.sp .hero-media{aspect-ratio:2/1}
  .tc-row{padding-bottom:6px}
  .op-copy > p{margin-bottom:10px}
  .op-lead{margin-bottom:12px}
  .xl-card{padding-block:12px}
  .xl-row{gap:8px}
  .op-lead{margin-bottom:16px}
  .glance{row-gap:14px}
  .pl-stage{padding-top:12px}
  .pstep{gap:10px}
  .tc-cap{padding:10px 16px}
  .tc-panel{gap:12px}
  .sol-ov .band.m-deep,.sol-ov .ov-cards{padding-block:16px}
}
