/* KNUENCE™ website — Stage E additions.
   Loaded after knuence.css, which stays byte-identical to the approved Stage D file.
   Only existing design tokens are used here: no new colours, typefaces or sizes. */

/* ---------------------------------------------------------------- Footer: legal links */
.k-footer__legalnav { list-style: none; padding: 0; margin: 0 0 var(--k-space-2); display: flex; flex-wrap: wrap; gap: 0 var(--k-space-5); }
.k-footer__legalnav a { color: var(--k-soft); text-decoration: none; display: inline-flex; min-height: 44px; align-items: center; }
.k-footer__legalnav a:hover { color: var(--k-white); text-decoration: underline; }

/* ---------------------------------------------------------------- Placeholder for unconfirmed details */
.k-placeholder { font-weight: 600; color: var(--k-blue); background: rgba(0, 53, 253, .06); border: 1px dashed var(--k-blue);
  border-radius: var(--k-radius-sm); padding: 0 .3em; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.k-dark .k-placeholder { color: var(--k-cyan); background: rgba(1, 227, 253, .08); border-color: var(--k-cyan); }

/* ---------------------------------------------------------------- Long-form legal and policy text */
.k-prose { max-width: var(--k-container-reading); }
.k-prose > * + * { margin-top: var(--k-space-4); }
.k-prose h2 { font-family: var(--k-font-display); font-weight: 600; font-size: var(--k-text-h2-size); line-height: var(--k-text-h2-lh);
  letter-spacing: var(--k-text-h2-tracking); margin-top: var(--k-space-8); padding-top: var(--k-space-5); border-top: 1px solid var(--k-rule); text-wrap: balance; }
.k-prose h2:first-child { margin-top: 0; }
.k-prose h3 { font-size: var(--k-text-h3-size); line-height: var(--k-text-h3-lh); font-weight: 600; margin-top: var(--k-space-6); }
.k-prose p, .k-prose li { text-wrap: pretty; }
.k-prose ul, .k-prose ol { padding-left: 1.25em; display: grid; gap: var(--k-space-2); }
.k-prose .k-table { margin-top: var(--k-space-5); }
.k-prose-meta { margin-top: var(--k-space-6); color: var(--k-role-text-muted); font-size: var(--k-text-small-size); }

/* ---------------------------------------------------------------- Contact list */
.k-contacts { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 0 var(--k-space-6); }
.k-contacts dt { font-weight: 600; padding-top: var(--k-space-4); border-top: 1px solid var(--k-rule); }
.k-contacts dd { margin: var(--k-space-1) 0 var(--k-space-6); color: var(--k-slate); }
.k-contacts dd > * + * { margin-top: var(--k-space-2); }

/* ---------------------------------------------------------------- Stage E mobile and tablet hero composition
   Same K, gradient, type and colours; only position, size and spacing change below 900 px.
   Goals: the K stays the page's gradient moment but sits above the headline instead of under it,
   and both calls to action are reachable without the K or the overlay crowding them. */
@media (max-width: 899.98px) {
  /* Home: the whole K is visible top-right; the headline starts where the K's lower arm fades out. */
  .k-hero__k { width: min(62vw, 500px); right: -6vw; top: calc(var(--k-header-height) - 8px); opacity: 1; }
  .k-hero::after { background: linear-gradient(180deg, rgba(4, 13, 28, 0) 0, rgba(4, 13, 28, 0) calc(var(--k-header-height) + 30vw),
    rgba(4, 13, 28, .82) calc(var(--k-header-height) + 50vw), var(--k-navy) calc(var(--k-header-height) + 62vw)); }
  .k-hero__content { padding-top: calc(var(--k-header-height) + min(42vw, 340px)); }
  .k-hero__note { margin-top: var(--k-space-7); }

  /* AI Studio: the K moves from a clipped corner to a complete mark at the top right. */
  .k-pagehead--dark .k-pagehead__k { width: min(44vw, 340px); right: -6vw; top: calc(var(--k-header-height) - 4px); bottom: auto; opacity: .9; }
  .k-pagehead--dark::after { background: linear-gradient(180deg, rgba(4, 13, 28, 0) calc(var(--k-header-height) + 12vw), rgba(4, 13, 28, .85) calc(var(--k-header-height) + 32vw), var(--k-navy) calc(var(--k-header-height) + 40vw)); }
  .k-pagehead--dark { padding-top: calc(var(--k-header-height) + min(34vw, 280px)); padding-bottom: var(--k-space-9); }
}
@media (max-width: 599.98px) {
  .k-hero__k { width: 72vw; right: -10vw; top: calc(var(--k-header-height) - 12px); }
  .k-hero::after { background: linear-gradient(180deg, rgba(4, 13, 28, 0) 0, rgba(4, 13, 28, 0) calc(var(--k-header-height) + 24vw),
    rgba(4, 13, 28, .82) calc(var(--k-header-height) + 40vw), var(--k-navy) calc(var(--k-header-height) + 50vw)); }
  .k-hero__content { padding-top: calc(var(--k-header-height) + 40vw); padding-bottom: var(--k-space-8); }
  .k-hero__content .k-display { margin-top: var(--k-space-4) !important; } /* overrides the inline space-5 on small screens */
  .k-hero__content .k-lead { margin-top: var(--k-space-4); }
  /* Calls to action stack: primary full width, secondary aligned to the text edge, both at least 48 px tall. */
  .k-hero .k-btn-row, .k-pagehead--dark .k-btn-row, .k-cta .k-btn-row { flex-direction: column; align-items: stretch; gap: var(--k-space-2); }
  .k-hero .k-btn-row { margin-top: var(--k-space-5); }
  .k-hero .k-btn--text { min-height: 48px; padding-inline: 0; justify-content: flex-start; }
  .k-cta .k-btn, .k-cta__inner > .k-btn { width: 100%; }
  .k-pagehead--dark .k-pagehead__k { width: 46vw; }
  /* Long button labels wrap inside the screen instead of being clipped (e.g. 321 px label at 320 px). */
  .k-btn { white-space: normal; text-align: center; }
  .k-btn--lg { padding-inline: var(--k-space-5); }
}
@media (max-width: 374.98px) {
  .k-btn--lg { font-size: var(--k-text-body-size); }
}

/* ---------------------------------------------------------------- AI Studio: "Planned" label under each outcome */
.k-intent .k-intent__status { margin-top: var(--k-space-3); }
