.public-help-main { background: #e9f5ff; box-sizing: border-box; max-width: none; min-height: calc(100vh - 72px); padding: 0; width: 100%; }
.public-help-shell .public-home-main-column { margin-right: var(--public-home-shell-gap); min-width: 0; padding-top: 0; }
.public-help-shell .public-home-header-region { min-height: var(--public-header-height); }
.public-help-page { box-sizing: border-box; margin: 0 auto; max-width: 1220px; padding: 28px 32px 72px; }
.public-help-shell .public-help-page { max-width: none; width: 100%; }
.public-help-shell .public-home-main-column { align-content: start; justify-items: stretch; width: auto; }
.public-help-hero { align-items: center; background: linear-gradient(135deg, #f7fbff 0%, #eaf3ff 100%); border: 1px solid #d6e6fa; border-radius: 24px; box-shadow: 0 14px 36px rgba(55, 105, 172, .08); display: flex; justify-content: space-between; margin-bottom: 18px; min-height: 168px; overflow: hidden; padding: 32px 40px; position: relative; }
.public-help-hero::after { background-image: radial-gradient(circle, rgba(48, 124, 240, .18) 1.5px, transparent 1.5px); background-size: 18px 18px; content: ''; height: 150px; opacity: .55; position: absolute; right: 24px; top: -14px; width: 220px; }
.public-help-hero__copy, .public-help-hero__spark { position: relative; z-index: 1; }
.public-help-eyebrow { align-items: center; color: #176cf2; display: inline-flex; font-size: 12px; font-weight: 800; gap: 7px; letter-spacing: .12em; text-transform: uppercase; }
.public-help-eyebrow svg { height: 16px; width: 16px; }
.public-help-hero h1 { color: #14233f; font-size: clamp(30px, 4vw, 46px); letter-spacing: -.035em; line-height: 1.05; margin: 9px 0 10px; }
.public-help-hero p { color: #58708f; font-size: 16px; line-height: 1.6; margin: 0; max-width: 600px; }
.public-help-hero__spark { align-items: center; background: #fff; border: 1px solid #d6e6fa; border-radius: 22px; box-shadow: 0 12px 26px rgba(41, 99, 177, .12); color: #176cf2; display: flex; height: 68px; justify-content: center; margin-right: 48px; width: 68px; }
.public-help-hero__spark svg { height: 34px; width: 34px; }
.public-help-search { align-items: center; background: #fff; border: 1px solid #d6e6fa; border-radius: 16px; box-shadow: 0 8px 22px rgba(37, 91, 160, .05); display: flex; gap: 12px; margin-bottom: 28px; padding: 10px; }
.public-help-search > svg { color: #6b83a5; height: 21px; margin-left: 10px; width: 21px; }
.public-help-search input { background: transparent; border: 0; color: #1a2a47; flex: 1; font-size: 15px; min-width: 0; outline: 0; padding: 12px 0; }
.public-help-search input::placeholder { color: #8a9bb4; }
.public-help-search .button-primary { border: 0; border-radius: 11px; cursor: pointer; padding: 12px 21px; }
.public-help-section { margin-top: 28px; }
.public-help-section__heading { align-items: end; display: flex; justify-content: space-between; margin-bottom: 14px; }
.public-help-section__heading h2 { color: #162641; font-size: 23px; letter-spacing: -.02em; margin: 4px 0 0; }
.public-help-text-link, .public-help-results-count { color: #176cf2; font-size: 13px; font-weight: 700; text-decoration: none; }
.public-help-results-count { color: #6c819e; font-weight: 600; }
.public-help-featured__grid, .public-help-category-grid, .public-help-support-grid { display: grid; gap: 14px; }
.public-help-featured__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.public-help-featured-card, .public-help-category-card, .public-help-article-card { align-items: center; background: #fff; border: 1px solid #d8e6f7; border-radius: 16px; color: inherit; display: flex; gap: 14px; min-width: 0; padding: 18px; text-decoration: none; transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.public-help-featured-card:hover, .public-help-category-card:hover, .public-help-article-card:hover { border-color: #9bc3ff; box-shadow: 0 12px 24px rgba(37, 101, 184, .1); transform: translateY(-2px); }
.public-help-card__icon, .public-help-category-card__icon, .public-help-article-card__icon, .public-help-support-card__icon { align-items: center; background: #edf5ff; border-radius: 12px; color: #176cf2; display: inline-flex; flex: 0 0 42px; height: 42px; justify-content: center; width: 42px; }
.public-help-card__icon svg, .public-help-category-card__icon svg, .public-help-article-card__icon svg { height: 21px; width: 21px; }
.public-help-card__body, .public-help-category-card > span:last-of-type, .public-help-article-card__body { display: flex; flex: 1; flex-direction: column; gap: 5px; min-width: 0; }
.public-help-card__body strong, .public-help-category-card strong, .public-help-article-card strong { color: #1a2a47; font-size: 15px; line-height: 1.3; }
.public-help-card__body span, .public-help-category-card small, .public-help-article-card__body > span:last-child { color: #6c819e; font-size: 13px; line-height: 1.45; }
.public-help-card__arrow, .public-help-category-card__arrow, .public-help-article-card__arrow { color: #76a4e4; flex: 0 0 17px; height: 17px; width: 17px; }
.public-help-category-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.public-help-category-card { align-items: flex-start; position: relative; }
.public-help-category-card.is-active { background: #eef6ff; border-color: #6da7ff; box-shadow: 0 8px 22px rgba(37, 101, 184, .08); }
.public-help-category-card em { color: #176cf2; font-size: 12px; font-style: normal; font-weight: 700; margin-top: 2px; }
.public-help-category-card__arrow { margin-left: auto; margin-top: 3px; }
.public-help-articles { background: rgba(255, 255, 255, .38); border-radius: 20px; padding: 22px; }
.public-help-article-list { display: grid; gap: 10px; }
.public-help-article-card { border-radius: 13px; padding: 15px 17px; }
.public-help-article-card__meta { align-items: center; color: #176cf2 !important; display: flex; font-size: 11px !important; font-weight: 800; gap: 8px; letter-spacing: .06em; text-transform: uppercase; }
.public-help-article-card__meta b { background: #eaf8ef; border-radius: 999px; color: #159447; font-size: 10px; letter-spacing: 0; padding: 4px 8px; text-transform: none; }
.public-help-empty { align-items: center; background: #fff; border: 1px dashed #bfd4ec; border-radius: 15px; color: #637894; display: flex; flex-direction: column; gap: 8px; padding: 36px 20px; text-align: center; }
.public-help-empty svg { color: #6da7ff; height: 28px; width: 28px; }
.public-help-empty h3, .public-help-empty p { margin: 0; }
.public-help-empty h3 { color: #1a2a47; font-size: 17px; }
.public-help-empty p { font-size: 13px; }
.public-help-empty .button-secondary { margin-top: 7px; }
.public-help-support-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 28px; }
.public-help-support-card { align-items: flex-start; background: #fff; border: 1px solid #d8e6f7; border-radius: 17px; display: flex; gap: 14px; padding: 20px; }
.public-help-support-card--accent { background: linear-gradient(135deg, #eef6ff, #f9fbff); border-color: #c6dcfa; }
.public-help-support-card__icon { flex-basis: 44px; height: 44px; }
.public-help-support-card h2 { color: #192a47; font-size: 16px; margin: 0 0 6px; }
.public-help-support-card p { color: #647a99; font-size: 13px; line-height: 1.5; margin: 0 0 11px; }
.public-help-support-card a { align-items: center; color: #176cf2; display: inline-flex; font-size: 13px; font-weight: 800; gap: 5px; text-decoration: none; }
.public-help-support-card a svg { height: 15px; width: 15px; }
.public-help-pagination { margin-top: 18px; }
.public-help-pagination nav { display: block; width: 100%; }
.public-help-pagination nav > div:first-child { display: none; }
.public-help-pagination nav > div:last-child { align-items: center; display: flex; gap: 18px; justify-content: space-between; width: 100%; }
.public-help-pagination nav > div:last-child > div:first-child { flex: 1 1 auto; min-width: 0; }
.public-help-pagination nav > div:last-child > div:first-child p { color: #536b8d; font-size: 13px; line-height: 1.4; margin: 0; }
.public-help-pagination nav > div:last-child > div:first-child .font-medium { color: #1a2a47; font-weight: 800; }
.public-help-pagination nav > div:last-child > div:last-child { flex: 0 0 auto; }
.public-help-pagination .inline-flex { align-items: stretch; box-shadow: 0 5px 14px rgba(37, 91, 160, .07); display: inline-flex; overflow: hidden; }
.public-help-pagination .inline-flex > a,
.public-help-pagination .inline-flex > span > span { align-items: center; background: #fff; border: 1px solid #d8e6f7; color: #536b8d; display: inline-flex; font-size: 13px; height: 34px; justify-content: center; margin: 0 0 0 -1px; min-width: 34px; padding: 0 9px; text-decoration: none; }
.public-help-pagination .inline-flex > a:first-child,
.public-help-pagination .inline-flex > span:first-child > span { margin-left: 0; }
.public-help-pagination .inline-flex > a:hover { background: #edf5ff; border-color: #9bc3ff; color: #176cf2; position: relative; z-index: 1; }
.public-help-pagination .inline-flex > span[aria-current="page"] > span { background: #176cf2; border-color: #176cf2; color: #fff; font-weight: 800; position: relative; z-index: 1; }
.public-help-pagination .inline-flex > span[aria-disabled="true"] > span { background: #f7faff; color: #a7b8cd; cursor: not-allowed; }
.public-help-pagination .inline-flex svg { height: 16px; width: 16px; }
.public-help-back { align-items: center; color: #176cf2; display: inline-flex; font-size: 13px; font-weight: 800; gap: 6px; margin-bottom: 16px; text-decoration: none; }
.public-help-back svg { height: 16px; width: 16px; }
.public-help-article { background: #fff; border: 1px solid #d8e6f7; border-radius: 22px; box-shadow: 0 12px 28px rgba(37, 91, 160, .06); overflow: hidden; }
.public-help-article__header { background: linear-gradient(135deg, #f6faff, #edf5ff); border-bottom: 1px solid #d8e6f7; padding: 32px 40px 28px; }
.public-help-article__header h1 { color: #14233f; font-size: clamp(28px, 4vw, 42px); letter-spacing: -.03em; line-height: 1.1; margin: 10px 0; }
.public-help-article__header p { color: #58708f; font-size: 16px; line-height: 1.6; margin: 0; max-width: 760px; }
.public-help-article__meta { align-items: center; color: #6c819e; display: flex; flex-wrap: wrap; font-size: 12px; gap: 16px; margin-top: 18px; }
.public-help-article__meta span { align-items: center; display: inline-flex; gap: 6px; }
.public-help-article__meta svg { color: #176cf2; height: 15px; width: 15px; }
.public-help-article__body { color: #263b5c; font-size: 16px; line-height: 1.82; padding: 34px 40px 42px; white-space: normal; }
.public-help-contact-page { max-width: 1040px; }
.public-help-contact { background: #fff; border: 1px solid #d8e6f7; border-radius: 24px; box-shadow: 0 14px 34px rgba(37, 91, 160, .07); overflow: hidden; }
.public-help-contact__header { align-items: flex-start; background: linear-gradient(135deg, #f6faff, #edf5ff); border-bottom: 1px solid #d8e6f7; display: flex; gap: 18px; padding: 32px 38px; }
.public-help-contact__icon { align-items: center; background: #176cf2; border-radius: 16px; box-shadow: 0 10px 20px rgba(23, 108, 242, .2); color: #fff; display: inline-flex; flex: 0 0 54px; height: 54px; justify-content: center; width: 54px; }
.public-help-contact__icon svg { height: 25px; width: 25px; }
.public-help-contact__header h1 { color: #14233f; font-size: clamp(28px, 4vw, 40px); letter-spacing: -.03em; line-height: 1.08; margin: 8px 0 9px; }
.public-help-contact__header p { color: #58708f; font-size: 15px; line-height: 1.65; margin: 0; max-width: 720px; }
.public-help-contact__form { padding: 28px 38px 32px; }
.public-help-contact__grid { display: grid; gap: 20px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.public-help-contact__field { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.public-help-contact__field--wide { grid-column: 1 / -1; }
.public-help-contact__field label { color: #1a2a47; font-size: 13px; font-weight: 800; }
.public-help-contact__field label span { color: #7c8fa9; font-weight: 600; }
.public-help-contact__field input, .public-help-contact__field select, .public-help-contact__field textarea { background: #fbfdff; border: 1px solid #cbdcf0; border-radius: 11px; box-sizing: border-box; color: #1a2a47; font: inherit; font-size: 14px; outline: 0; padding: 12px 14px; transition: border-color .16s ease, box-shadow .16s ease; width: 100%; }
.public-help-contact__field textarea { min-height: 168px; resize: vertical; }
.public-help-contact__field input:focus, .public-help-contact__field select:focus, .public-help-contact__field textarea:focus { border-color: #6da7ff; box-shadow: 0 0 0 3px rgba(23, 108, 242, .12); }
.public-help-contact__field small { color: #c73b4a; font-size: 12px; }
.public-help-contact__errors { background: #fff3f3; border: 1px solid #f2c4ca; border-radius: 12px; color: #a52a38; margin-bottom: 22px; padding: 14px 16px; }
.public-help-contact__errors strong { display: block; margin-bottom: 5px; }
.public-help-contact__errors ul { margin: 0; padding-left: 18px; }
.public-help-contact__privacy, .public-help-contact__unavailable { align-items: center; background: #f4f9ff; border: 1px solid #d8e8fb; border-radius: 12px; color: #5d7392; display: flex; font-size: 12px; gap: 9px; line-height: 1.5; margin-top: 22px; padding: 13px 15px; }
.public-help-contact__privacy svg, .public-help-contact__unavailable svg { color: #176cf2; flex: 0 0 18px; height: 18px; width: 18px; }
.public-help-contact__unavailable { margin: 28px 38px 32px; }
.public-help-contact__unavailable div { display: flex; flex-direction: column; gap: 2px; }
.public-help-contact__unavailable strong { color: #243957; }
.public-help-contact__footer { display: flex; justify-content: flex-end; gap: 10px; margin-top: 22px; }
.public-help-contact__footer a, .public-help-contact__footer button { align-items: center; display: inline-flex; gap: 7px; justify-content: center; }
.public-help-contact__footer button svg { height: 16px; width: 16px; }
.public-help-related { margin-top: 28px; }
.public-help-loading { display: none; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.public-help-skeleton-card { background: #dceafa; border-radius: 15px; height: 82px; }
.public-help-skeleton-card--wide { grid-column: 1 / -1; height: 112px; }
.public-help-page.is-loading [data-help-live] { opacity: .2; pointer-events: none; }
body[data-performance-skeleton="1"] .public-help-page.is-loading .public-help-loading { display: grid; }
body[data-performance-shimmer="1"] .public-help-page.is-loading .public-help-skeleton-card { animation: public-help-shimmer 1.35s ease-in-out infinite; background: linear-gradient(100deg, #dceafa 25%, #f4f8ff 43%, #dceafa 62%); background-size: 300% 100%; }
@keyframes public-help-shimmer { 0% { background-position: 100% 0; } 100% { background-position: -100% 0; } }
@media (prefers-reduced-motion: reduce) { body[data-performance-shimmer="1"] .public-help-page.is-loading .public-help-skeleton-card { animation: none; } .public-help-featured-card, .public-help-category-card, .public-help-article-card { transition: none; } }
.public-help-feedback { align-items: center; background: linear-gradient(135deg, #f4f9ff, #ffffff); border: 1px solid #cfe1f7; border-radius: 18px; display: flex; gap: 22px; justify-content: space-between; margin-top: 18px; padding: 20px 24px; }
.public-help-feedback h2 { color: #1a2a47; font-size: 18px; margin: 5px 0 4px; }
.public-help-feedback p { color: #657b99; font-size: 13px; margin: 0; }
.public-help-feedback__actions { display: flex; flex: 0 0 auto; gap: 8px; }
.public-help-feedback__actions form { margin: 0; }
.public-help-feedback__button { align-items: center; background: #fff; border: 1px solid #c8dbf1; border-radius: 10px; color: #31547e; cursor: pointer; display: inline-flex; font: inherit; font-size: 13px; font-weight: 800; gap: 7px; min-height: 38px; padding: 0 13px; transition: border-color .16s ease, background .16s ease, color .16s ease; }
.public-help-feedback__button:hover, .public-help-feedback__button.is-selected { background: #eaf3ff; border-color: #5f9cf5; color: #176cf2; }
.public-help-feedback__button:disabled { cursor: wait; opacity: .65; }
.public-help-feedback__button svg { height: 16px; width: 16px; }
@media (max-width: 900px) { .public-help-page { padding: 22px 20px 58px; } .public-help-featured__grid, .public-help-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .public-help-hero__spark { margin-right: 15px; } }
@media (max-width: 640px) { .public-help-page { padding: 14px 12px 96px; } .public-help-hero { align-items: flex-start; min-height: 0; padding: 25px 22px; } .public-help-hero__spark { display: none; } .public-help-hero h1 { font-size: 31px; } .public-help-hero p { font-size: 14px; } .public-help-search { margin-bottom: 22px; } .public-help-search .button-primary { padding: 11px 14px; } .public-help-featured__grid, .public-help-category-grid, .public-help-support-grid { grid-template-columns: 1fr; } .public-help-section__heading h2 { font-size: 20px; } .public-help-articles { padding: 16px; } .public-help-featured-card, .public-help-category-card { padding: 15px; } .public-help-article__header { padding: 25px 21px 22px; } .public-help-article__header h1 { font-size: 29px; } .public-help-article__body { font-size: 15px; padding: 25px 21px 31px; } .public-help-feedback { align-items: flex-start; flex-direction: column; padding: 18px; } .public-help-feedback__actions { width: 100%; } .public-help-feedback__actions form, .public-help-feedback__button { flex: 1; } .public-help-skeleton-card--wide { height: 92px; } .public-help-contact__header { padding: 24px 21px; } .public-help-contact__form { padding: 22px 21px 26px; } .public-help-contact__grid { grid-template-columns: 1fr; } .public-help-contact__field--wide { grid-column: auto; } .public-help-contact__unavailable { margin: 22px 21px 26px; } .public-help-contact__footer { justify-content: stretch; } .public-help-contact__footer a, .public-help-contact__footer button { flex: 1; } .public-help-pagination nav > div:last-child { align-items: flex-start; flex-direction: column; gap: 10px; } .public-help-pagination nav > div:last-child > div:first-child { width: 100%; } .public-help-pagination nav > div:last-child > div:last-child { align-self: center; } }

/* Laravel emits separate mobile and desktop pagination groups. Keep the
   utility classes from collapsing the group after the public theme styles. */
@media (min-width: 641px) {
    .public-help-pagination nav > div:first-child { display: none !important; }
    .public-help-pagination nav > div:last-child { display: flex !important; }
}
@media (max-width: 640px) {
    .public-help-pagination nav > div:first-child { align-items: center; display: flex !important; gap: 10px; justify-content: center; width: 100%; }
    .public-help-pagination nav > div:last-child { display: none !important; }
    .public-help-pagination nav > div:first-child > a,
    .public-help-pagination nav > div:first-child > span > span { align-items: center; background: #fff; border: 1px solid #d8e6f7; border-radius: 9px; color: #536b8d; display: inline-flex; font-size: 13px; height: 34px; justify-content: center; min-width: 34px; padding: 0 9px; text-decoration: none; }
    .public-help-pagination nav > div:first-child > a:hover { background: #edf5ff; border-color: #9bc3ff; color: #176cf2; }
    .public-help-pagination nav > div:first-child > span[aria-disabled="true"] > span { background: #f7faff; color: #a7b8cd; }
    .public-help-pagination nav > div:first-child svg { height: 16px; width: 16px; }
}