/* Result-first landing. The cinematic opening and purchase screens keep their own styles. */
#kn-app[data-screen="landing"] .kn-block { max-width:1120px; padding:88px 48px; scroll-margin-top:24px; }
#kn-app .kn-block h2 { font-size:clamp(32px,4vw,52px); letter-spacing:-.045em; line-height:1.08; max-width:760px; }
#kn-app .kn-section-lead { max-width:610px; font-size:16px; color:var(--kn-muted); }
#kn-app .kn-inline-link { display:inline-flex; align-items:center; min-height:44px; color:var(--kn-ink); text-decoration:underline; text-underline-offset:5px; font-size:13px; font-weight:600; }
#kn-app .kn-journey-intro .kn-inline-link { margin-top:4px; }
#kn-app .kn-result-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin:32px 0; }
#kn-app .kn-result-cards figure { margin:0; min-width:0; }
#kn-app .kn-result-cards img { display:block; width:100%; height:auto; border-radius:4px; }
#kn-app .kn-result-cards figcaption { margin-top:12px; font-size:13px; color:var(--kn-muted); }
/* Progressive enhancement: the static three-column gallery remains if JS is unavailable. */
#kn-app .kn-card-gallery[data-enhanced="true"] { margin:24px -20px 32px; }
#kn-app .kn-card-gallery[data-enhanced="true"] .kn-result-cards { display:block; position:relative; height:620px; margin:0; perspective:1100px; overflow:hidden; touch-action:pan-y pinch-zoom; cursor:grab; isolation:isolate; }
#kn-app .kn-card-gallery[data-enhanced="true"] .kn-result-cards { overflow:clip; contain:layout paint; overflow-anchor:none; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; }
#kn-app .kn-card-gallery[data-enhanced="true"] .kn-result-cards figure { pointer-events:none; }
#kn-app .kn-card-gallery[data-enhanced="true"] .kn-result-cards::after { content:""; position:absolute; width:260px; height:32px; left:50%; bottom:30px; transform:translateX(-50%); border-radius:50%; background:radial-gradient(ellipse,#20362e20,transparent 70%); pointer-events:none; }
#kn-app .kn-card-gallery[data-enhanced="true"] figure { position:absolute; width:290px; left:50%; top:47%; margin:0; transform-style:preserve-3d; will-change:transform; }
#kn-app .kn-card-face { position:relative; display:block; padding:0; width:100%; border:1px solid #ffffff80; border-radius:9px; background:#fff; color:inherit; cursor:inherit; box-shadow:0 24px 36px -16px #17262066,2px 3px 0 #d8dfdc; transform:translateY(0); animation:kn-card-float 5s ease-in-out infinite; animation-play-state:paused; }
#kn-app .kn-card-gallery figure:nth-child(2) .kn-card-face { animation-delay:-1.7s; }
#kn-app .kn-card-gallery figure:nth-child(3) .kn-card-face { animation-delay:-3.4s; }
#kn-app .kn-card-gallery[data-visible="true"]:not([data-paused="true"]):not([data-dragging="true"]) .kn-card-face { animation-play-state:running; }
#kn-app .kn-card-gallery[data-visible="true"]:not([data-paused="true"]):not([data-dragging="true"]):is(:hover,:focus-within) .kn-card-face { animation-play-state:paused; }
#kn-app .kn-card-gallery[data-enhanced="true"] .kn-card-face img { border-radius:8px; pointer-events:none; user-select:none; -webkit-user-select:none; }
#kn-app .kn-card-face::after { content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit; background:linear-gradient(125deg,#ffffff26,transparent 40%,#1726200a); }
#kn-app .kn-card-gallery[data-enhanced="true"] figcaption { display:none; }
#kn-app .kn-card-gallery[data-dragging="true"] .kn-result-cards { cursor:grabbing; }
#kn-app .kn-card-controls { display:flex; align-items:center; justify-content:center; gap:24px; }
#kn-app .kn-card-arrow { display:grid; place-items:center; width:46px; height:46px; padding:0; flex-shrink:0; border:1px solid var(--kn-edge); border-radius:50%; background:#fff; color:var(--kn-ink); font-size:22px; }
#kn-app .kn-card-arrow:hover { background:#f1f5f2; border-color:var(--kn-accent); }
#kn-app .kn-card-caption { min-width:180px; text-align:center; }
#kn-app .kn-card-current { font-size:13px; }
#kn-app .kn-card-dots { display:flex; justify-content:center; }
#kn-app .kn-card-dots button { display:grid; place-items:center; width:32px; height:28px; padding:0; border:0; background:transparent; }
#kn-app .kn-card-dots button::after { content:""; width:6px; height:6px; border-radius:50%; background:#c9d3cc; }
#kn-app .kn-card-dots button[aria-pressed="true"]::after { width:18px; border-radius:4px; background:var(--kn-accent); }
#kn-app .kn-card-gallery .kn-card-hint { margin:12px 0 0; text-align:center; font-size:12px; color:var(--kn-muted); }
#kn-app .kn-card-gallery button:focus-visible { outline:3px solid var(--kn-accent); outline-offset:5px; }
@keyframes kn-card-float { 0%,100% { transform:translateY(0) rotateX(0); } 50% { transform:translateY(-12px) rotateX(1.5deg); } }
@media(max-width:700px) {
  #kn-app .kn-card-gallery[data-enhanced="true"] { margin:18px -24px 28px; }
  #kn-app .kn-card-gallery[data-enhanced="true"] .kn-result-cards { height:calc(clamp(190px,60vw,290px) * 1.777 + 90px); perspective:850px; }
  #kn-app .kn-card-gallery[data-enhanced="true"] figure { width:clamp(190px,60vw,290px); top:47%; }
  #kn-app .kn-card-controls { gap:12px; }
  #kn-app .kn-card-gallery .kn-card-hint { font-size:11px; }
}
@media(prefers-reduced-motion:reduce) {
  #kn-app .kn-card-gallery .kn-card-face { animation:none; }
}
#kn-app .kn-delivery-strip { display:flex; flex-wrap:wrap; gap:8px 24px; padding:16px 0; border-block:1px solid var(--kn-edge); font-size:13px; }
#kn-app .kn-result-details { display:grid; grid-template-columns:1fr .8fr 1.2fr; gap:24px; margin-top:32px; }
#kn-app .kn-result-detail { min-width:0; padding:24px; border:1px solid var(--kn-edge); border-radius:4px; }
#kn-app .kn-result-detail p { font-size:14px; }
#kn-app .kn-result-detail .kn-sample-name { font-family:var(--kn-font-reading); font-size:32px; font-weight:600; letter-spacing:.08em; margin:20px 0 4px; }
#kn-app .kn-sample-seal img { display:block; width:100%; max-width:180px; height:auto; margin:12px auto; }
#kn-app .kn-sample-reading blockquote { margin:20px 0; padding-left:16px; border-left:3px solid #375a48; font-size:16px; line-height:1.7; }
#kn-app .kn-sample-note { font-size:12px; color:var(--kn-muted); margin-top:18px; }
#kn-app .kn-process-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; list-style:none; padding:0; margin:36px 0 24px; }
#kn-app .kn-process-grid li { border-top:2px solid var(--kn-ink); padding-top:18px; min-width:0; }
#kn-app .kn-process-step { display:block; font-size:12px; color:var(--kn-muted); margin-bottom:20px; }
#kn-app .kn-process-grid h3 { font-size:22px; }
#kn-app .kn-process-grid p { color:var(--kn-muted); }
#kn-app .kn-input-example { margin:22px 0 0; border-top:1px solid var(--kn-edge); padding-top:12px; font-size:12px; }
#kn-app .kn-input-example div { display:flex; justify-content:space-between; gap:16px; margin:8px 0; }
#kn-app .kn-input-example dt { color:var(--kn-muted); }
#kn-app .kn-input-example dd { margin:0; text-align:right; }
#kn-app .kn-use-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 40px; margin-top:32px; }
#kn-app .kn-use-list li { grid-template-columns:1fr; padding:24px 0; }
#kn-app .kn-use-list h3 { font-size:21px; }
#kn-app .kn-use-example { margin-top:18px; padding:18px; border:1px solid var(--kn-edge); border-radius:3px; font-size:16px; }
#kn-app .kn-use-example small { display:block; font-size:11px; color:var(--kn-muted); margin-top:6px; }
#kn-app[data-screen="landing"] .kn-package-card { background:#fff; border-radius:4px; padding:30px; }
#kn-app[data-screen="landing"] .kn-package-card:last-child { border-color:var(--kn-accent); }
#kn-app .kn-faq details { padding:20px 0; }
#kn-app .kn-faq summary { font-size:16px; }
#kn-app .kn-faq details p { max-width:760px; font-size:14px; }
#kn-app[data-screen="landing"] .kn-closing { text-align:center; }
#kn-app .kn-closing h2,#kn-app .kn-closing .kn-section-lead { margin-left:auto; margin-right:auto; }
#kn-app .kn-closing .kn-primary { max-width:360px; margin:28px auto 8px; }
#kn-app .kn-inline-link:focus-visible { outline:2px solid currentColor; outline-offset:4px; }
@media(max-width:700px) {
  #kn-app[data-screen="landing"] .kn-block { padding:56px 24px; }
  #kn-app .kn-section-lead { font-size:15px; }
  #kn-app .kn-result-cards { gap:10px; margin:24px 0; }
  #kn-app .kn-result-cards figcaption { font-size:11px; }
  #kn-app .kn-result-details { grid-template-columns:1fr 1fr; gap:12px; margin-top:24px; }
  #kn-app .kn-result-detail { padding:18px; }
  #kn-app .kn-result-detail .kn-sample-name { font-size:26px; }
  #kn-app .kn-sample-reading { grid-column:1 / -1; }
  #kn-app .kn-process-grid,#kn-app .kn-use-list { grid-template-columns:1fr; }
  #kn-app .kn-process-grid { gap:28px; }
  #kn-app .kn-process-step { margin-bottom:12px; }
  #kn-app .kn-input-example { max-width:360px; }
  #kn-app .kn-delivery-strip { gap:8px 16px; font-size:12px; }
}
@media(max-width:359px) {
  #kn-app .kn-result-details { grid-template-columns:1fr; }
  #kn-app .kn-sample-reading { grid-column:auto; }
}