:root { --help-card: rgba(15, 31, 51, .88); --help-line: rgba(151, 180, 216, .18); --help-orange: #ffb000; }
.help-header { position: sticky; top: 0; z-index: 20; }
.desktop-nav a[aria-current="page"] { color: var(--text); background: rgba(255,255,255,.07); }
.help-shell { width: min(calc(100% - 40px), 1180px); margin: 0 auto; padding: 72px 0 80px; }
.help-hero { max-width: 860px; margin: 0 auto 56px; text-align: center; }
.help-eyebrow { margin: 0 0 14px; color: var(--help-orange); font-size: 13px; font-weight: 900; letter-spacing: .12em; }
.help-hero h1 { margin: 0; font-size: clamp(42px, 7vw, 76px); line-height: .98; letter-spacing: -.055em; }
.help-hero > p:not(.help-eyebrow) { max-width: 720px; margin: 22px auto 0; color: var(--muted); font-size: clamp(16px, 2vw, 20px); line-height: 1.55; }
.help-search { display: grid; grid-template-columns: 26px 1fr; align-items: center; gap: 12px; max-width: 760px; min-height: 66px; margin: 34px auto 0; padding: 0 22px; border: 1px solid rgba(255,176,0,.42); border-radius: 20px; background: rgba(7,19,33,.92); box-shadow: 0 22px 70px rgba(0,0,0,.28); }
.help-search:focus-within { border-color: var(--help-orange); box-shadow: 0 0 0 4px rgba(255,176,0,.12); }
.help-search svg { width: 25px; fill: none; stroke: #a9bed7; stroke-width: 2; stroke-linecap: round; }
.help-search input { min-width: 0; padding: 20px 0; border: 0; outline: 0; background: transparent; color: var(--text); font: inherit; font-size: 17px; }
.help-search input::placeholder { color: #8295ac; }
.help-categories { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px; }
.help-category { min-height: 42px; padding: 9px 15px; border: 1px solid var(--help-line); border-radius: 999px; background: rgba(255,255,255,.035); color: var(--muted); font: inherit; font-weight: 750; cursor: pointer; }
.help-category:hover, .help-category.is-active { border-color: rgba(255,176,0,.55); background: rgba(255,176,0,.12); color: #ffd066; }
.help-count { margin: 30px 0 16px; color: var(--muted-2); font-size: 14px; }
.help-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; }
.help-topic { display: flex; min-height: 220px; flex-direction: column; padding: 24px; border: 1px solid var(--help-line); border-radius: 24px; background: linear-gradient(145deg, rgba(18,35,57,.88), rgba(8,20,35,.92)); color: inherit; text-decoration: none; transition: transform .18s ease, border-color .18s ease; }
.help-topic:hover { transform: translateY(-3px); border-color: rgba(255,176,0,.45); }
.help-topic small { color: var(--help-orange); font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.help-topic h2 { margin: 18px 0 10px; font-size: 25px; line-height: 1.08; letter-spacing: -.025em; }
.help-topic p { margin: 0; color: var(--muted); line-height: 1.55; }
.help-topic span { margin-top: auto; padding-top: 22px; color: #b9d7fb; font-weight: 800; }
.help-empty { padding: 60px 24px; border: 1px dashed var(--help-line); border-radius: 24px; text-align: center; }
.help-empty h2 { margin: 0 0 8px; }
.help-empty p { margin: 0; color: var(--muted); }
.help-contact { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: 0 0 36px; padding: 14px 20px; border: 1px solid rgba(255,176,0,.3); border-radius: 18px; background: radial-gradient(circle at 85% 10%, rgba(255,153,0,.16), transparent 40%), var(--help-card); }
.help-contact .help-eyebrow { margin-bottom: 4px; font-size: 10px; }
.help-contact h2 { margin: 0 0 3px; font-size: clamp(20px, 2vw, 24px); line-height: 1.05; }
.help-contact p:not(.help-eyebrow) { max-width: 720px; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.35; }
.help-contact .button { min-height: 40px; padding: 9px 16px; border-radius: 12px; font-size: 14px; white-space: nowrap; }
.help-footer { width: min(calc(100% - 40px), 1180px); margin: 0 auto; padding: 28px 0 40px; border-top: 1px solid var(--help-line); color: var(--muted-2); font-size: 13px; text-align: center; }
.help-footer a { color: var(--muted); }
.article-shell { max-width: 940px; padding-top: 44px; }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 20px; color: var(--muted-2); font-size: 14px; }
.breadcrumbs a { color: #a9ccf3; }
.article-card { padding: clamp(28px, 6vw, 64px); border: 1px solid var(--help-line); border-radius: 30px; background: linear-gradient(145deg, rgba(17,34,56,.94), rgba(8,19,33,.96)); }
.article-card .article-category { color: var(--help-orange); font-size: 13px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.article-card h1 { max-width: 780px; margin: 15px 0 18px; font-size: clamp(39px, 6vw, 64px); line-height: 1; letter-spacing: -.05em; }
.article-summary { max-width: 760px; margin: 0 0 40px; color: var(--muted); font-size: 19px; line-height: 1.6; }
.article-section { margin-top: 34px; padding-top: 34px; border-top: 1px solid var(--help-line); }
.article-section h2 { margin: 0 0 17px; font-size: 26px; }
.article-section p, .article-section li { color: #cfdbeb; font-size: 16px; line-height: 1.7; }
.article-section ul, .article-section ol { margin: 0; padding-left: 25px; }
.article-section li + li { margin-top: 10px; }
.article-note { padding: 18px 20px; border-left: 4px solid var(--help-orange); border-radius: 0 14px 14px 0; background: rgba(255,176,0,.08); }
.related-card { margin-top: 20px; padding: 26px; border: 1px solid var(--help-line); border-radius: 24px; background: var(--help-card); }
.related-card h2 { margin: 0 0 16px; font-size: 22px; }
.related-links { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.related-links a { padding: 15px; border: 1px solid var(--help-line); border-radius: 14px; color: #cce3ff; text-decoration: none; }
.related-links a:hover { border-color: rgba(255,176,0,.45); color: #ffd066; }
@media (max-width: 900px) { .help-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .related-links { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .help-shell { width: min(calc(100% - 24px),1180px); padding-top: 46px; } .help-grid { grid-template-columns: 1fr; } .help-topic { min-height: 190px; } .help-contact { align-items: stretch; flex-direction: column; gap: 10px; padding: 14px 16px; } .help-contact .button { text-align: center; } .article-card { border-radius: 22px; } }
@media (prefers-reduced-motion: reduce) { .help-topic { transition: none; } }
