/* Help center: builds on blog.css (hero, crumbs, pager, prose). */
.hp-search { display: flex; align-items: center; gap: 1rem; max-width: 40rem; margin: 2.2rem 0 0; border-bottom: 2px solid var(--hv-line); transition: border-color .25s; }
.hp-search:focus-within { border-color: var(--hv-accent); }
.hp-search i { color: var(--hv-muted); font-size: 1.1rem; }
.hp-search input { flex: 1; min-width: 0; padding: 1rem 0; border: 0 !important; outline: 0 !important; box-shadow: none !important; background: transparent !important; color: var(--hv-text); font-size: 1.25rem; }
.hp-search input::placeholder { color: var(--hv-muted); }
.hp-search button { display: inline-flex; align-items: center; gap: .6rem; border: 0; background: none; color: var(--hv-accent); font-size: 1rem; font-weight: 800; }
.hp-search button svg, .hp-row svg, .hp-topic small svg, .hp-ask a svg, .hp-white svg { transition: transform .35s cubic-bezier(.16,1,.3,1); }
.hp-search button:hover svg { transform: translateX(.35rem); }
.hp .bl-hero { padding-bottom: clamp(2.5rem,5vw,4rem); }
.hp-sec { margin-top: clamp(3.5rem,8vw,6rem); }
.hp-sec:first-child { margin-top: clamp(2rem,4vw,3rem); }
.hp-sec h2 { margin: 0 0 2rem; font-size: clamp(2rem,4.4vw,3.2rem); font-weight: 900; letter-spacing: -.045em; }

/* topics: text blocks on hairlines */
.hp-topics { display: grid; grid-template-columns: repeat(auto-fit,minmax(15rem,1fr)); gap: 0 clamp(1.5rem,3vw,3rem); }
.hp-topic { display: flex; flex-direction: column; gap: .5rem; padding: 1.8rem 0 2rem; border-top: 1.5px solid var(--hv-line); color: inherit; text-decoration: none; transition: border-color .3s, transform .45s cubic-bezier(.16,1,.3,1); }
.hp-topic:hover { border-color: var(--hv-accent); transform: translateY(-.25rem); }
.hp-ic { color: var(--hv-accent); font-size: 1.6rem; line-height: 1; margin-bottom: .6rem; }
.hp-topic h3 { margin: 0; font-size: 1.35rem; font-weight: 800; letter-spacing: -.035em; }
.hp-topic p { margin: 0; color: var(--hv-muted); line-height: 1.7; word-break: keep-all; }
.hp-topic small { display: inline-flex; align-items: center; gap: .5rem; margin-top: .6rem; color: var(--hv-muted); font-size: .9rem; font-weight: 700; }
.hp-topic:hover small { color: var(--hv-accent); } .hp-topic:hover small svg { transform: translateX(.35rem); }

/* question rows */
.hp-list { border-bottom: 1.5px solid var(--hv-line); }
.hp-row { display: flex; align-items: center; gap: 1.5rem; padding: 1.4rem 0; border-top: 1.5px solid var(--hv-line); color: inherit; text-decoration: none; transition: transform .45s cubic-bezier(.16,1,.3,1); }
.hp-q { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .35rem; }
.hp-q b { font-size: clamp(1.05rem,2vw,1.3rem); font-weight: 800; letter-spacing: -.02em; word-break: keep-all; }
.hp-q small { color: var(--hv-muted); line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; word-break: keep-all; }
.hp-t { flex: none; color: var(--hv-muted); font-size: .85rem; }
.hp-row svg { flex: none; color: var(--hv-accent); }
.hp-row:hover { transform: translateX(.6rem); } .hp-row:hover b { color: var(--hv-accent); } .hp-row:hover svg { transform: translateX(.3rem); }

/* reveal */
.hp [data-r] > *, .hp [data-r] .hp-topic, .hp [data-r] .hp-row { transition: opacity .9s cubic-bezier(.16,1,.3,1), transform .9s cubic-bezier(.16,1,.3,1); }
.hp [data-r]:not(.in) > *, .hp [data-r]:not(.in) .hp-topic, .hp [data-r]:not(.in) .hp-row { opacity: 0; transform: translateY(28px); }
.hp [data-r].in .hp-topic:nth-child(3n+2) { transition-delay: .08s; } .hp [data-r].in .hp-topic:nth-child(3n+3) { transition-delay: .16s; }
.hp-row:hover { transition-duration: .45s; }

/* closing band */
.hp-band { margin-top: clamp(4rem,9vw,7rem); padding: clamp(4rem,10vw,8rem) 0; background: var(--hv-accent); color: #fff; text-align: center; }
.hp-band h2 { margin: 0; color: #fff; font-size: clamp(2.6rem,8vw,6.5rem); font-weight: 900; line-height: 1.05; letter-spacing: -.05em; }
.hp-white { display: inline-flex; align-items: center; gap: 1.2rem; margin-top: 2.2rem; padding: 1.1rem 2.6rem; border-radius: 999px; background: #fff; color: #14301a; font-size: 1.25rem; font-weight: 800; text-decoration: none; transition: transform .3s cubic-bezier(.16,1,.3,1); }
.hp-white:hover { transform: translateY(-2px); color: #14301a; } .hp-white:hover svg { transform: translateX(.4rem); }
.hp-band > .container > * { transition: opacity .9s cubic-bezier(.16,1,.3,1), transform .9s cubic-bezier(.16,1,.3,1); }
.hp-band:not(.in) > .container > * { opacity: 0; transform: translateY(30px); }
.hp-band > .container > a { transition-delay: .15s; }

/* article */
.hp-single .bl-body { padding-top: 9rem; }
.hp-cols { display: grid; grid-template-columns: minmax(0,8fr) minmax(0,3fr); gap: clamp(2rem,6vw,5rem); align-items: start; }
.hp-single h1 { font-size: clamp(2rem,4.4vw,3.2rem); line-height: 1.25; }
.hp-cover { margin-top: 2.5rem; } .hp-cover img { display: block; width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: 14px; }
.hp-prose { margin-top: 2.5rem; }
.hp-ask { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem; margin-top: clamp(3rem,6vw,4.5rem); padding: 1.6rem 0; border-block: 1.5px solid var(--hv-line); }
.hp-ask h2 { margin: 0; font-size: 1.3rem; font-weight: 800; letter-spacing: -.03em; }
.hp-ask a { display: inline-flex; align-items: center; gap: .7rem; color: var(--hv-accent); text-decoration: none; font-weight: 800; } .hp-ask a:hover svg { transform: translateX(.35rem); }
.hp-aside { position: sticky; top: 7rem; padding-top: 3.2rem; }
.hp-aside h2 { margin: 0 0 .8rem; font-size: 1rem; font-weight: 800; color: var(--hv-muted); }
.hp-aside ul { list-style: none; margin: 0; padding: 0; }
.hp-aside li { border-top: 1.5px solid var(--hv-line); }
.hp-aside a { display: block; padding: .95rem 0; color: var(--hv-text); text-decoration: none; font-weight: 700; line-height: 1.5; word-break: keep-all; transition: color .2s, transform .35s cubic-bezier(.16,1,.3,1); }
.hp-aside a:hover { color: var(--hv-accent); transform: translateX(.4rem); }

@media (max-width: 991.98px) { .hp-cols { grid-template-columns: 1fr; } .hp-aside { position: static; padding-top: 0; } }
@media (max-width: 575.98px) { .hp-t { display: none; } .hp-single .bl-body { padding-top: 7.5rem; } .hp-search input { font-size: 1.05rem; } }
@media (prefers-reduced-motion: reduce) { .hp [data-r] *, .hp-band * { transition: none !important; opacity: 1 !important; transform: none !important; } }
@media (max-width: 575.98px) { .hp-ask { flex-direction: column; align-items: flex-start; } .hp-row { gap: 1rem; padding: 1.2rem 0; } .hp-band h2 { font-size: clamp(2.2rem, 11vw, 3rem); } }
@media (max-width: 575.98px) { .hp-single .container, .hp .container { padding-inline: 1.25rem; } .hp-cover { margin-top: 1.6rem; } .hp-prose { margin-top: 1.6rem; } .hp-single h1 { font-size: 1.8rem; } .hp-aside { margin-top: 2rem; } }
/* grid items must be allowed to shrink below their content (editor markup has fixed-width media) */
.hp-cols > * { min-width: 0; }
@media (max-width: 991.98px) { .hp-cols { grid-template-columns: minmax(0, 1fr); } }
.hp-prose { overflow-wrap: anywhere; }
.hp-prose [class^="bn-"], .hp-prose .bn-block-group, .hp-prose .bn-block-content { max-width: 100%; min-width: 0; }
.hp-prose img, .hp-prose video, .hp-prose iframe { max-width: 100% !important; height: auto; }
.hp-prose .ProseMirror-trailingBreak { display: none !important; }
