/* Outcome cards: wide, illustrated, and readable without swiping. */
.goal-section { background: radial-gradient(ellipse at 0 35%, #eaf3fc 0, transparent 55%), #f7faff; }
.goal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.goal-card { --goal-color: #2a6ba2; --goal-wash: #e4f0fc; display: block; padding: 0; overflow: hidden; border-radius: 24px; border: 1px solid #dce7f1; background: #fff; box-shadow: 0 8px 26px -20px #163e6260; }
.goal-link { display: grid; grid-template-columns: 128px minmax(0, 1fr); min-height: 214px; height: 100%; color: inherit; text-decoration: none; }
.goal-art { position: relative; display: grid; align-content: center; background: radial-gradient(circle at 30% 20%, #ffffffc0, transparent 65%), var(--goal-wash); color: var(--goal-color); overflow: hidden; }
.goal-art::before, .goal-art::after { content: ''; position: absolute; width: 140px; height: 140px; border: 1px solid currentColor; opacity: .09; border-radius: 50%; left: -70px; bottom: -74px; }
.goal-art::after { width: 180px; height: 180px; left: -90px; bottom: -94px; }
.goal-art > svg { position: relative; width: 100%; max-height: 174px; z-index: 1; }
.goal-art-line { position: absolute; height: 3px; width: 24px; bottom: 18px; left: calc(50% - 12px); border-radius: 2px; background: currentColor; opacity: .35; }
.goal-copy { align-self: center; min-width: 0; padding: 24px; }
.goal-label { display: block; font-size: .65rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--goal-color); margin-bottom: 8px; line-height: 1.5; }
.goal-card h3 { font-size: 1.35rem; margin: 0 0 9px; line-height: 1.2; }
.goal-card p { color: #486079; font-size: .9rem; line-height: 1.55; margin: 0; }
.goal-explore { display: flex; align-items: center; gap: 8px; margin-top: 15px; font-size: .73rem; font-weight: 600; color: var(--goal-color); }
.goal-explore svg { width: 16px; height: 16px; transition: transform .2s ease; }
.goal-fat { --goal-color: #9fd6ff; --goal-wash: #234e70; background: #11324e; border-color: #204560; color: #fff; }
.goal-fat .goal-art { background: radial-gradient(circle at 30% 10%, #36739d, transparent 75%), #1b4565; }
.goal-fat p { color: #d7e6f3; }
.goal-strength { --goal-color: #5862a0; --goal-wash: #eaeafa; }
.goal-run { --goal-color: #287975; --goal-wash: #e1f1ed; }
.goal-muscle { --goal-color: #98632e; --goal-wash: #faf0dc; }
.goal-gut { --goal-color: #4a784c; --goal-wash: #e9f3e5; }
.goal-habits { --goal-color: #3a6ea3; --goal-wash: #e4effb; }
.goal-link:focus-visible { outline: 3px solid #438fe7; outline-offset: -4px; border-radius: 23px; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .goal-link:hover .goal-explore svg { transform: translateX(4px); }
}

/* A stronger final scene: reveal the existing summit art instead of whitening it. */
.cta { background: #122b43; }
.cta::after { background: linear-gradient(90deg, rgba(8,27,45,.88), rgba(8,27,45,.42) 52%, rgba(8,27,45,.08)); }
.cta h2, .cta h2 em { color: #fff; }
.cta .eyebrow { color: #c1def4; }
.cta .appstore { background: #fff; color: #102e47; box-shadow: 0 8px 24px #06152530; }
.cta .appstore svg { color: #102e47; }

@media (max-width: 900px) {
  .goal-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .goal-link { grid-template-columns: 120px minmax(0, 1fr); min-height: 190px; }
  .goal-card { padding: 0; }
  .goal-copy { padding: 22px; }
  .goal-section { padding-block: 54px; }
  .goal-section .sub { max-width: 28ch; margin-inline: auto; }
  .coach-prompt { background: linear-gradient(125deg, #edf6ff, #fff); border-color: #c5dbee; box-shadow: 0 12px 28px -22px #183f6b80; }
  .hero-perks { border: 1px solid #ffffffc0; background: #ffffff90; border-radius: 24px; padding: 20px 12px; box-shadow: 0 10px 28px -22px #204b7770; }
  .hub-node { border-radius: 22px; box-shadow: 0 10px 28px -24px #1c426880; }
  .faq details { border-radius: 16px; background: #f3f7fc; border: 1px solid #e0e9f3; margin-bottom: 10px; }
  .faq details[open] { background: #edf5ff; border-color: #c8def5; }
  .shot-hint { color: #315d89; font-weight: 600; }
  .cta { min-height: 540px; align-items: flex-start; border-radius: 32px 32px 0 0; }
  .cta-bg { object-position: 64% center; }
  .cta::after { background: linear-gradient(180deg, rgba(8,27,45,.85) 0%, rgba(8,27,45,.58) 35%, rgba(8,27,45,.08) 74%, rgba(8,27,45,.22)); }
  .cta-grid { width: 100%; padding-top: 48px; padding-bottom: 230px; }
  .cta h2 { max-width: 14ch; font-size: clamp(2rem, 8vw, 2.8rem); line-height: 1.12; letter-spacing: -.035em; text-shadow: 0 2px 16px #071d3530; margin-bottom: 25px; }
  footer { background: #102c43; border-top: 1px solid #426178; color: #dce9f5; padding-block: 32px; }
  footer .brand-word, footer .brand-word b, footer .foot-links a, footer .foot-tag { color: #dce9f5; }
  footer .foot-links a { min-height: 44px; display: inline-flex; align-items: center; }
  footer .foot-links { gap: 4px 22px; }
}
@media (max-width: 560px) {
  .goal-grid { gap: 12px; margin-top: 26px; }
  .goal-card { padding: 0; border-radius: 20px; }
  .goal-link { grid-template-columns: 88px minmax(0, 1fr); min-height: 190px; }
  .goal-copy { padding: 18px 16px; }
  .goal-card h3 { font-size: 1.2rem; margin-bottom: 8px; }
  .goal-card p { font-size: .9rem; margin: 0; line-height: 1.55; }
  .goal-label { font-size: .59rem; letter-spacing: .07em; margin-bottom: 7px; }
  .goal-explore { font-size: .7rem; margin-top: 12px; }
  .goal-art > svg { max-height: 140px; }
  .goal-footnote { max-width: 28ch; margin-inline: auto; font-size: .85rem; }
  .cta { min-height: 550px; }
}
@media (max-width: 360px) {
  .goal-link { grid-template-columns: 72px minmax(0, 1fr); }
  .goal-copy { padding: 16px 13px; }
  .goal-card h3 { font-size: 1.1rem; }
}
