/* /landing — NXT AI 2026 QR destination, in the site's design system */
.l-hero .inner { padding-top: calc(var(--header-h) + 84px); padding-bottom: 110px; max-width: 1180px; }
.l-hero .eyebrow { color: var(--pale); margin: 0 0 18px; letter-spacing: .14em; text-transform: uppercase; font-size: 13px; }
.l-hero h1 { max-width: 14ch; }
.l-hero .sub { color: var(--pale); font-weight: 500; margin-top: 10px; max-width: 30ch; }
.l-hero .when { margin-top: 26px; color: var(--ice); }
.l-hero .welcome { max-width: 58ch; margin-top: 18px; }
.ctas { display: flex; flex-wrap: wrap; gap: 18px 28px; align-items: center; margin-top: 34px; }
.l-hero .btn-line { color: var(--pale); min-height: 58px; }

.l-tax .inner, .l-fw .inner, .l-res .inner { padding-top: 39px; padding-bottom: 106px; }
.label { margin: 2px 0 0; }
.l-tax h2, .l-fw h2, .l-res h2 { margin-top: 40px; max-width: 22ch; }
.lede { max-width: 46ch; margin-top: 24px; }
.l-fw .lede { max-width: 62ch; }
.stats { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 56px; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.stats > div { padding: 30px 28px 26px; border-left: 1px solid var(--ink); }
.stats > div:first-child { border-left: 0; padding-left: 0; }
.stats .num { font: 500 var(--h2)/1 var(--f-head); margin-bottom: 14px; letter-spacing: -.02em; }
.stats .cite { font-size: 12.5px; opacity: .8; margin-top: 10px; }
.l-tax .pull { max-width: 40ch; margin-top: 56px; }

.ladder { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--col-gap); margin-top: 56px; }
.ladder > div { border-top: 1px solid var(--ink); padding: 22px 18px 0 0; }
.ladder h3 { margin-bottom: 16px; }
.ladder dl { margin: 0; }
.ladder dt { font-weight: 600; }
.ladder dd { margin: 0 0 14px; }

.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 56px; }
.card { display: flex; flex-direction: column; text-decoration: none; color: inherit; background: rgba(255,255,255,.45);
  border-top: 3px solid var(--blue); padding: 26px 26px 24px; transition: background .2s, transform .2s; }
a.card:hover { background: #fff; transform: translateY(-2px); }
.card .tag { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--blue); margin: 0 0 12px; }
.card h3 { font-size: calc(var(--h3) * .72); margin-bottom: 10px; }
.card .t-body { flex: 1; margin-bottom: 18px; }
.card .go { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; font-weight: 500; }
.card.soon { background: transparent; border: 1px dashed var(--stone); border-top: 3px dashed var(--stone); }
.card.soon .go { opacity: .7; }
.card.feature { grid-column: span 2; flex-direction: row; gap: 30px; align-items: center; background: var(--slate); color: var(--ice); border-top-color: var(--pale); }
.card.feature:hover { background: #3a5163; }
.card.feature svg { flex: 0 0 150px; }
.card.feature .tag { color: var(--pale); }
.card.feature h3 { font-size: calc(var(--h3) * .9); }
.card.feature > div { display: flex; flex-direction: column; }

.l-begin .inner { padding-top: 39px; padding-bottom: 106px; }
.l-begin .lhs { grid-column: 1 / span 12; }
.l-begin .lhs h2 { margin-top: 40px; }
.l-begin .lhs .t-normal { margin-top: 24px; max-width: 48ch; }
.l-begin .lhs .dl-row { margin-top: 30px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; }
.l-begin .alt a { color: var(--ice); text-underline-offset: 3px; }
.steps { grid-column: 14 / span 10; margin: 120px 0 0; padding: 0; list-style: none; counter-reset: s; }
.steps li { counter-increment: s; position: relative; padding: 0 0 22px 56px; }
.steps li::before { content: counter(s); position: absolute; left: 0; top: -2px; width: 36px; height: 36px; border: 1px solid var(--pale);
  border-radius: 50%; display: grid; place-items: center; font: 500 18px/1 var(--f-head); color: var(--pale); }
.l-begin .rule { background: var(--ice); }

.l-connect .inner { padding-top: 60px; padding-bottom: 106px; }
.l-connect .mark { grid-column: 1 / span 5; width: 216px; margin-top: 50px; }
.l-connect .who { grid-column: 7 / span 17; }
.l-connect h2 { margin-top: 40px; }
.l-connect .role { margin-top: 4px; }
.l-connect .links a { text-decoration: none; border-bottom: 1px solid var(--blue); }
.l-connect .btn-line.dark { color: var(--ink); min-height: 58px; }
.l-connect .cite { margin-top: 44px; max-width: 80ch; opacity: .85; }

@media (max-width: 900px) {
  .ladder { grid-template-columns: 1fr 1fr; }
  .cards { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 767px) {
  .l-hero .inner { padding-top: calc(var(--header-h) + 40px); padding-bottom: 64px; }
  .l-tax .inner, .l-fw .inner, .l-res .inner, .l-begin .inner, .l-connect .inner { padding-top: 34px; padding-bottom: 56px; }
  .stats { grid-template-columns: 1fr; }
  .stats > div { border-left: 0; border-top: 1px solid var(--ink); padding-left: 0; }
  .stats > div:first-child { border-top: 0; }
  .ladder, .cards { grid-template-columns: 1fr; }
  .card.feature { grid-column: auto; flex-direction: column; align-items: flex-start; }
  .card.feature svg { flex-basis: auto; width: 120px; }
  .steps { margin-top: 36px; }
  .l-connect .mark { width: 140px; margin: 0 auto 10px; }
}

/* Charter card: one link per format */
.formats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 4px; }
.fmt { display: flex; flex-direction: column; align-items: center; padding: 10px 6px 8px; text-decoration: none; color: var(--ink);
  border: 1px solid var(--blue); background: rgba(255,255,255,.55); transition: background .2s, color .2s; }
.fmt span { font: 500 15px/1.2 var(--f-meta); letter-spacing: .04em; }
.fmt small { font: italic 400 12px/1.4 var(--f-body); opacity: .75; }
.fmt:hover, .fmt:focus-visible { background: var(--blue); color: var(--ice); }
