/* Blixtflow – hjälpcentrets sida. Bygger på ai.css (fakta, kort, steg, frågor) men har egen rörelse:
   artiklar som svävar i djupled runt sökfältet (--mx/--my/--hp från help.js), källor som flyger ihop
   till kunskapsbasen medan sidan står still (--a och --b), kort som staplas och en urtavla som snurrar. */

/* ==========================================================================
   1. Hjälten
   ========================================================================== */
.hcp-hero {
  --mx: 0; --my: 0; --hp: 0;
  position: relative; isolation: isolate; overflow: clip;
  padding: calc(var(--header-h) + env(safe-area-inset-top) + 26px) 0 calc(var(--sheet-r) + 70px);
  color: #fff; background: radial-gradient(90% 70% at 50% 40%, #461a63, var(--natt) 65%);
}
.hcp-stars { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.hcp-stars i { position: absolute; left: var(--x); top: var(--y); width: var(--s); height: var(--s); border-radius: 50%; background: #fff; opacity: .35; }
.motion .hcp-stars i { animation: twinkle 3.2s ease-in-out infinite; animation-delay: calc(var(--d) * -.5s); }
.hcp-hero__wrap { position: relative; }
.hcp-hero__wrap .crumbs ol { justify-content: center; }
.hcp-hero__copy { position: relative; z-index: 2; max-width: 820px; margin-inline: auto; padding-top: clamp(10px, 4vw, 50px); text-align: center; }
.hcp-title { margin-bottom: 20px; font-size: clamp(2.5rem, 1.4rem + 4.4vw, 5.2rem); font-weight: 800; letter-spacing: -.047em; line-height: .97; text-wrap: balance; }
.hcp-lead { max-width: 640px; margin-inline: auto; color: var(--on-dark-muted); }
.hcp-cta { justify-content: center; }
.hcp-trust { justify-content: center; }
.hcp-trust li { text-align: left; }

/* Det stora sökfältet */
.hcp-bar {
  position: relative; display: flex; align-items: center; gap: 14px; max-width: 640px; height: 72px; margin: 34px auto 0; padding: 0 12px 0 24px;
  border-radius: 999px; color: var(--ink); background: #fff; text-align: left;
  box-shadow: 0 0 0 8px rgba(242, 250, 163, .12), 0 40px 90px -30px rgba(242, 250, 163, .45), 0 30px 60px -30px rgba(0, 0, 0, .8);
}
.hcp-bar__ic .ic { width: 26px; height: 26px; color: var(--primar-ink); }
.hcp-bar__q { flex: 1; min-width: 0; overflow: hidden; font-size: clamp(1rem, .9rem + .5vw, 1.3rem); font-weight: 650; white-space: nowrap; text-overflow: ellipsis; }
.hcp-bar__q.is-typing::after { content: ""; display: inline-block; width: 2px; height: 1.1em; margin-left: 2px; vertical-align: -3px; background: var(--primar-ink); animation: caret .8s steps(1) infinite; }
.hcp-bar__key { flex: none; padding: 8px 14px; border-radius: 999px; font-size: .78rem; font-weight: 800; color: var(--natt); background: var(--gnista); }
.hcp-bar__hit {
  position: absolute; left: 16px; right: 16px; top: calc(100% + 12px); display: grid; grid-template-columns: auto 1fr auto; grid-template-rows: auto auto; column-gap: 12px; align-items: center;
  padding: 14px 16px; border-radius: 20px; background: #fff; box-shadow: 0 30px 60px -24px rgba(0, 0, 0, .7);
}
.hcp-bar__hit > span { grid-row: span 2; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; color: var(--primar-ink); background: var(--soft); }
.hcp-bar__hit .ic { width: 18px; height: 18px; }
.hcp-bar__hit b { font-size: .98rem; }
.hcp-bar__hit small { grid-column: 2; font-size: .78rem; color: var(--muted); }
.hcp-bar__hit > .ic { grid-row: 1 / 3; grid-column: 3; color: var(--primar-ink); }
.js .hcp-bar__hit { opacity: 0; transform: translateY(-8px) scale(.97); transition: opacity .4s, transform .6s var(--spring); }
.js .hcp-bar.is-found .hcp-bar__hit { opacity: 1; transform: none; }
.hcp-cta { margin-top: 110px; }

/* Artiklarna som svävar runt */
.hcp-cloud { position: absolute; inset: -20px -4% 0; z-index: 1; pointer-events: none; }
.hcp-float {
  position: absolute; left: var(--x); top: var(--y); width: 270px;
  opacity: calc(.45 + var(--k) * .55); filter: blur(calc((1 - var(--k)) * 2.4px));
  transform: translate3d(calc(var(--mx) * var(--z) * 1px), calc(var(--my) * var(--z) * 1px + var(--hp) * var(--z) * -9px), 0) scale(calc(.75 + var(--k) * .25));
  transition: transform .9s var(--ease-out);
}
.motion .hcp-float .hcp-art { animation: bob 6s ease-in-out infinite, hcp-in 1s var(--spring) backwards; animation-delay: calc(var(--i) * -1.1s), calc(.5s + var(--i) * .12s); }
.hcp-art { display: flex; align-items: center; gap: 12px; padding: 13px 15px; border-radius: 18px; color: #fff; background: rgba(255, 255, 255, .08); box-shadow: inset 0 0 0 1px rgba(200, 168, 242, .25), 0 30px 60px -30px rgba(0, 0, 0, .8); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.hcp-art__ic { display: grid; flex: none; place-items: center; width: 38px; height: 38px; border-radius: 12px; color: var(--natt); background: var(--gnista); }
.hcp-float:nth-child(2n) .hcp-art__ic { color: #fff; background: var(--primar-ink); }
.hcp-art__ic .ic { width: 18px; height: 18px; }
.hcp-art > span:last-child { display: grid; min-width: 0; }
.hcp-art small { font-size: .7rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--gnista); }
.hcp-art b { font-size: .92rem; line-height: 1.3; }
.hcp-art em { font-size: .72rem; font-style: normal; color: var(--ton); }
@media (max-width: 1099px) {
  .hcp-float { width: 220px; opacity: .35; }
  .hcp-float:nth-child(n + 3) { display: none; }
  .hcp-float:nth-child(1) { left: -10%; top: 4%; }
  .hcp-float:nth-child(2) { left: 74%; top: 2%; }
}
@media (max-width: 699px) { .hcp-cloud { display: none; } }

/* ==========================================================================
   2. Källorna flyger ihop
   ========================================================================== */
.hcp-conv { --a: 1; --b: 1; position: relative; z-index: 1; margin-top: calc(var(--sheet-r) * -1); border-radius: var(--sheet-r) var(--sheet-r) 0 0; background: var(--ljus); }
.hcp-conv__sticky { display: grid; grid-template-columns: minmax(0, 1fr); align-content: center; gap: 10px; padding: clamp(70px, 9vw, 110px) 0 clamp(60px, 7vw, 90px); }
.hcp-conv.is-pinned .hcp-conv__sticky { position: sticky; top: 0; height: 100vh; height: 100svh; padding-top: calc(var(--header-h) + 20px); padding-bottom: 30px; overflow: hidden; }
.hcp-conv__head { text-align: center; }
.hcp-conv__head .lead { max-width: 620px; margin: 14px auto 0; }
.hcp-orbit { position: relative; width: min(100% - 2 * var(--gutter), 980px); height: clamp(330px, 46vh, 460px); margin: 10px auto 0; }
.hcp-orbit__rays { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.hcp-orbit__rays line { stroke: var(--primar); stroke-width: 2; stroke-dasharray: 100; stroke-dashoffset: calc(100 - var(--b) * 100); vector-effect: non-scaling-stroke; opacity: calc(.2 + var(--b) * .6); }
.hcp-srcs { position: absolute; inset: 0; }
.hcp-src {
  position: absolute; z-index: 2; display: flex; align-items: center; gap: 12px; padding: 12px 18px 12px 12px; border-radius: 20px; white-space: nowrap;
  background: #fff; box-shadow: 0 0 0 1px var(--line), 0 24px 50px -24px rgba(44, 14, 61, .45);
  translate: -50% -50%;
  transform: translate(calc(var(--sx) * (1 - var(--a))), calc(var(--sy) * (1 - var(--a)))) rotate(calc(var(--sr) * (1 - var(--a)))) scale(calc(.7 + var(--a) * .3));
  opacity: calc(.15 + var(--a) * .85);
}
.hcp-src--1 { left: 8%; top: 12%; --sx: -60vw; --sy: -30vh; --sr: -30deg; }
.hcp-src--2 { left: 92%; top: 14%; --sx: 60vw; --sy: -30vh; --sr: 25deg; }
.hcp-src--3 { left: 4%; top: 74%; --sx: -70vw; --sy: 20vh; --sr: 18deg; }
.hcp-src--4 { left: 96%; top: 72%; --sx: 70vw; --sy: 25vh; --sr: -22deg; }
.hcp-src--5 { left: 50%; top: 102%; --sx: 0vw; --sy: 50vh; --sr: 12deg; }
.hcp-src__ic { display: grid; flex: none; place-items: center; width: 42px; height: 42px; border-radius: 14px; color: var(--gnista); background: var(--natt); }
.hcp-src:nth-child(2n) .hcp-src__ic { color: #fff; background: var(--primar-ink); }
.hcp-src__ic .ic { width: 20px; height: 20px; }
.hcp-src b { display: block; font-size: .98rem; }
.hcp-src small { font-size: .8rem; color: var(--muted); }
.hcp-core {
  position: absolute; left: 50%; top: 50%; z-index: 3; display: grid; place-items: center; align-content: center; gap: 4px; width: 210px; aspect-ratio: 1; border-radius: 50%;
  translate: -50% -50%; scale: calc(.86 + var(--b) * .14); text-align: center; color: #fff;
  background: radial-gradient(circle at 35% 30%, #6b33a0, var(--natt) 70%);
  box-shadow: 0 0 0 calc(var(--b) * 14px) rgba(242, 250, 163, .14), 0 0 0 calc(var(--b) * 30px) rgba(155, 93, 229, .1), 0 40px 90px -30px rgba(44, 14, 61, .8);
}
.hcp-core__ring { position: absolute; inset: -10px; border-radius: 50%; border: 1.5px dashed rgba(155, 93, 229, .45); }
.hcp-core__ring + .hcp-core__ring { inset: -34px; border-style: solid; border-color: rgba(155, 93, 229, .15); }
.motion .hcp-core__ring { animation: fx-spin 24s linear infinite; }
.hcp-core__ic { display: grid; place-items: center; width: 54px; height: 54px; margin-bottom: 4px; border-radius: 18px; color: var(--natt); background: var(--gnista); box-shadow: 0 0 calc(var(--b) * 30px) rgba(242, 250, 163, .8); }
.hcp-core__ic .ic { width: 26px; height: 26px; }
.hcp-core b { font-size: 1.05rem; }
.hcp-core small { font-size: .8rem; color: var(--ton); }
.hcp-core small span { font-weight: 800; color: var(--gnista); font-variant-numeric: tabular-nums; }
.hcp-conv__note { margin-top: 70px; text-align: center; font-size: .95rem; font-weight: 650; color: var(--primar-ink); opacity: var(--b); }
@media (max-width: 899px) {
  .hcp-orbit { height: 440px; margin-bottom: 70px; }
  .hcp-src { padding: 9px 12px 9px 9px; border-radius: 16px; }
  .hcp-src small { display: none; }
  .hcp-src__ic { width: 34px; height: 34px; border-radius: 11px; }
  .hcp-src--1 { left: 30%; top: 5%; } .hcp-src--2 { left: 72%; top: 16%; } .hcp-src--3 { left: 28%; top: 84%; } .hcp-src--4 { left: 72%; top: 95%; } .hcp-src--5 { left: 50%; top: 112%; }
  .hcp-conv__note { margin-top: 30px; }
  .hcp-core { width: 170px; }
  .hcp-orbit__rays { display: none; }
}

/* ==========================================================================
   4. Korten som staplas
   ========================================================================== */
.hcp-same { padding-bottom: calc(clamp(76px, 10vw, 136px) + var(--sheet-r)); background: linear-gradient(180deg, var(--natt), #321147); }
.hcp-stack { display: grid; gap: 30px; max-width: 980px; margin-inline: auto; }
.hcp-card {
  position: sticky; top: calc(var(--header-h) + 24px + var(--n) * 22px); display: grid; gap: 24px; align-items: center; min-height: 340px; padding: 30px 26px;
  border-radius: 32px; transform-origin: 50% 0; transform: scale(var(--sc, 1)); filter: brightness(var(--br, 1));
  box-shadow: 0 -20px 60px -30px rgba(0, 0, 0, .7), inset 0 0 0 1px rgba(255, 255, 255, .1);
}
.hcp-card--1 { color: var(--natt); background: radial-gradient(120% 120% at 0% 0%, #fdffe0, var(--gnista)); }
.hcp-card--2 { color: #fff; background: radial-gradient(120% 120% at 100% 0%, #a46ff0, var(--primar-ink)); }
.hcp-card--3 { color: #fff; background: radial-gradient(120% 120% at 0% 100%, #5b2a80, var(--natt-2)); }
.hcp-card__tag { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 14px; font-size: .82rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hcp-card__tag span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 13px; background: rgba(255, 255, 255, .2); }
.hcp-card--1 .hcp-card__tag span { color: var(--gnista); background: var(--natt); }
.hcp-card__tag .ic { width: 20px; height: 20px; }
.hcp-card h3 { font-size: clamp(1.8rem, 1.3rem + 2vw, 2.8rem); font-weight: 800; letter-spacing: -.035em; line-height: 1.02; }
.hcp-card__copy > p:last-child { margin-top: 12px; font-size: 1.05rem; line-height: 1.6; opacity: .85; }
.hcp-card__demo { display: grid; gap: 10px; padding: 18px; border-radius: 24px; color: var(--ink); background: #fff; box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .6); }
.hcp-mini__search { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 14px; font-weight: 650; background: var(--ljus); box-shadow: inset 0 0 0 1.5px var(--primar); }
.hcp-mini__search .ic { width: 18px; height: 18px; color: var(--primar-ink); }
.hcp-mini__hit { display: grid; grid-template-columns: auto 1fr; column-gap: 12px; align-items: center; padding: 12px 14px; border-radius: 14px; background: var(--soft); }
.hcp-mini__hit > span { grid-row: span 2; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 11px; color: #fff; background: var(--primar-ink); }
.hcp-mini__hit .ic { width: 16px; height: 16px; }
.hcp-mini__hit small { color: var(--muted); }
.hcp-mini__b { justify-self: start; max-width: 90%; padding: 10px 13px; border-radius: 16px 16px 16px 5px; font-size: .95rem; background: var(--line-2); }
.hcp-mini__b--me { justify-self: end; border-radius: 16px 16px 5px 16px; color: #fff; background: var(--primar-ink); }
.hcp-mini__b small { display: flex; align-items: center; gap: 5px; margin-top: 6px; font-size: .74rem; font-weight: 700; color: var(--primar-ink); }
.hcp-mini__b small .ic { width: 13px; height: 13px; }
.hcp-mini__call { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-radius: 14px; color: #fff; background: var(--natt); }
.hcp-mini__call > span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #22A45D; }
.hcp-mini__call .ic { width: 16px; height: 16px; }
.hcp-mini__call > i { display: flex; align-items: center; gap: 3px; margin-left: auto; height: 26px; }
.hcp-mini__call > i i { width: 3px; height: 6px; border-radius: 2px; background: var(--gnista); }
.motion .hcp-mini__call > i i { animation: eq .5s ease-in-out infinite alternate; animation-delay: calc(var(--i) * -.07s); }
@media (min-width: 860px) {
  .hcp-card { grid-template-columns: 1fr 1fr; gap: 40px; padding: 44px 48px; min-height: 380px; }
}

/* ==========================================================================
   5. Sök själv
   ========================================================================== */
.hcp-try__grid { display: grid; gap: 40px; align-items: center; }
.hcp-try__note { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; font-size: .875rem; color: var(--muted); }
.hcp-try__note .ic { width: 16px; height: 16px; color: var(--primar-ink); }
.hcp-try__bx { width: 150px; margin-top: 26px; }
.hcp-hc { --focus: var(--primar-ink); width: 100%; max-width: 480px; margin-inline: auto; overflow: hidden; border-radius: 28px; background: #fff; box-shadow: 0 0 0 1px var(--line), 0 60px 110px -40px rgba(44, 14, 61, .5); }
.hcp-hc__top { padding: 22px 20px 18px; color: #fff; background: radial-gradient(120% 120% at 100% 0%, #5b2a80, var(--natt) 65%); }
.hcp-hc__title { display: flex; align-items: center; gap: 10px; font-size: 1.15rem; font-weight: 800; }
.hcp-hc__title .ic { width: 20px; height: 20px; color: var(--gnista); }
.hcp-hc__field { display: flex; align-items: center; gap: 10px; height: 52px; margin-top: 14px; padding: 0 16px; border-radius: 16px; color: var(--ink); background: #fff; }
.hcp-hc__field .ic { flex: none; width: 19px; height: 19px; color: var(--muted); }
.hcp-hc__field input { flex: 1; min-width: 0; height: 100%; border: 0; font-size: 1rem; background: transparent; }
.hcp-hc__field input:focus { outline: none; }
.hcp-hc__field:focus-within { box-shadow: 0 0 0 4px rgba(242, 250, 163, .5); }
.hcp-hc__cats { display: flex; gap: 6px; margin-top: 12px; overflow-x: auto; scrollbar-width: none; }
.hcp-hc__cats::-webkit-scrollbar { display: none; }
.hcp-cat { flex: none; padding: 7px 13px; border: 0; border-radius: 999px; cursor: pointer; white-space: nowrap; font-size: .8rem; font-weight: 650; color: #fff; background: rgba(255, 255, 255, .1); box-shadow: inset 0 0 0 1px rgba(200, 168, 242, .25); transition: background-color .2s, color .2s; }
.hcp-cat[aria-pressed="true"] { color: var(--natt); background: var(--gnista); box-shadow: none; }
.hcp-hc__list { display: grid; gap: 6px; height: 380px; overflow-y: auto; padding: 14px; align-content: start; overscroll-behavior: contain; }
.hcp-res[hidden] { display: none; }
.hcp-res details { border-radius: 16px; box-shadow: inset 0 0 0 1px var(--line-2); transition: background-color .2s, box-shadow .2s; }
.hcp-res details[open] { background: var(--soft); box-shadow: inset 0 0 0 1.5px rgba(155, 93, 229, .4); }
.hcp-res summary { display: flex; align-items: center; gap: 12px; padding: 12px 14px; list-style: none; cursor: pointer; border-radius: 16px; }
.hcp-res summary::-webkit-details-marker { display: none; }
.hcp-res__ic { display: grid; flex: none; place-items: center; width: 34px; height: 34px; border-radius: 11px; color: var(--primar-ink); background: #fff; box-shadow: 0 0 0 1px var(--line); }
.hcp-res__ic .ic { width: 16px; height: 16px; }
.hcp-res__t { display: grid; flex: 1; min-width: 0; }
.hcp-res__t b { font-size: .95rem; }
.hcp-res__t small { font-size: .76rem; color: var(--muted); }
.hcp-res__go { width: 18px; height: 18px; color: var(--muted); transition: transform .3s var(--ease-out); }
.hcp-res details[open] .hcp-res__go { transform: rotate(180deg); }
.hcp-res__body { padding: 0 14px 14px 60px; font-size: .92rem; line-height: 1.55; color: var(--ink-2); }
.motion .hcp-res:not([hidden]) { animation: bub-in .4s var(--ease-out) both; }
.hcp-res mark { padding: 0 2px; border-radius: 4px; color: inherit; background: var(--gnista); }
.hcp-hc__none { margin: 0 14px 18px; padding: 14px; border-radius: 14px; font-size: .9rem; color: var(--ink-2); background: var(--ljus); }
@media (min-width: 1000px) { .hcp-try__grid { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 64px; } }

/* ==========================================================================
   6. AI-utkast och urtavlan
   ========================================================================== */
.hcp-build { padding-top: clamp(40px, 6vw, 80px); padding-bottom: calc(clamp(76px, 10vw, 136px) + var(--sheet-r)); }
.hcp-duo { display: grid; gap: 18px; margin-top: 40px; }
.hcp-ai, .hcp-refresh { padding: 30px 26px; border-radius: 30px; }
.hcp-ai { --focus: var(--gnista); display: grid; gap: 26px; color: #fff; background: radial-gradient(120% 100% at 100% 0%, #5b2a80, var(--natt) 60%); box-shadow: var(--shadow-3); }
.hcp-ai h3, .hcp-refresh h3 { font-size: clamp(1.4rem, 1.15rem + 1vw, 1.9rem); font-weight: 800; letter-spacing: -.03em; line-height: 1.1; }
.hcp-ai p { margin-top: 10px; line-height: 1.6; color: var(--on-dark-muted); }
.hcp-ai__btn { margin-top: 22px; }
.hcp-ai__btn .ic { width: 18px; height: 18px; }
.hcp-ai__btn.is-busy { pointer-events: none; opacity: .7; }
.hcp-doc { padding: 18px; border-radius: 20px; color: var(--ink); background: #fff; box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .7); }
.hcp-doc__bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.hcp-doc__badge { padding: 4px 10px; border-radius: 999px; font-size: .74rem; font-weight: 800; color: #92400E; background: #FEF3C7; }
.hcp-doc__pub { padding: 6px 12px; border-radius: 10px; font-size: .78rem; font-weight: 700; color: #fff; background: var(--primar-ink); opacity: .45; }
.hcp-doc.is-done .hcp-doc__pub { opacity: 1; }
.hcp-doc__title { font-size: 1.15rem; font-weight: 800; letter-spacing: -.01em; }
.hcp-doc__body { min-height: 7.5em; margin-top: 8px !important; font-size: .92rem; line-height: 1.6; color: var(--ink-2) !important; }
.hcp-doc .is-typing::after { content: ""; display: inline-block; width: 2px; height: 1em; margin-left: 1px; vertical-align: -2px; background: var(--primar-ink); animation: caret .8s steps(1) infinite; }
.hcp-doc__keys { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.hcp-doc__keys span { padding: 3px 9px; border-radius: 8px; font-size: .76rem; font-weight: 650; color: var(--primar-ink); background: var(--soft); }
.hcp-refresh { --spd: 4s; display: grid; gap: 12px; justify-items: center; text-align: center; background: #fff; box-shadow: 0 0 0 1px var(--line), var(--shadow-1); }
.hcp-refresh > p:not([class]) { max-width: 420px; color: var(--muted); line-height: 1.6; }
.hcp-dial { position: relative; width: 170px; aspect-ratio: 1; margin: 6px 0; }
.hcp-dial svg { width: 100%; height: 100%; }
.hcp-dial circle { fill: none; stroke: var(--line); stroke-width: 9; }
.hcp-dial .hcp-dial__arc { stroke: var(--primar-ink); stroke-linecap: round; stroke-dasharray: 26 74; transform-origin: 50% 50%; }
.motion .hcp-dial .hcp-dial__arc { animation: fx-spin var(--spd) linear infinite; }
.hcp-dial__ic { position: absolute; inset: 0; display: grid; place-items: center; }
.hcp-dial__ic .ic { width: 46px; height: 46px; padding: 16px; box-sizing: content-box; border-radius: 50%; color: var(--natt); background: var(--gnista); }
.motion .hcp-dial__ic .ic { animation: fx-spin calc(var(--spd) * 1.5) linear infinite reverse; }
.hcp-refresh__opts { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.hcp-refresh .hcp-cat { color: var(--primar-ink); background: var(--soft); box-shadow: none; }
.hcp-refresh .hcp-cat[aria-pressed="true"] { color: #fff; background: var(--natt); }
.hcp-refresh__meta { font-size: .85rem; color: var(--muted); }
@media (min-width: 1000px) {
  .hcp-duo { grid-template-columns: 1.3fr .7fr; }
  .hcp-ai { grid-template-columns: 1fr 1fr; align-items: center; padding: 40px; }
}
.hcp-go { padding-bottom: calc(clamp(76px, 10vw, 136px) + var(--sheet-r)); }

@keyframes hcp-in { from { opacity: 0; scale: .6; } }
.hcp-doc .hcp-doc__title { margin-top: 0; color: var(--ink); }
.hcp-doc p.hcp-doc__keys, .hcp-doc p.hcp-doc__bar { margin-top: 12px; }
.hcp-doc p.hcp-doc__bar { margin-top: 0; }