/* Supporting pages. Keep copy, field definitions and interaction logic in HTML/JS.
   Loaded after the existing page styles; all selectors belong to these pages. */

/* The shared header is sticky and occupies its own space in the document. */
.contact-page,
.faq-page,
.hub-page {
  padding-top: 0;
  background: #f5f8fc;
}

.contact-wrap { max-width: 720px; padding: 48px 24px 88px; }
.faq-wrap { max-width: 900px; padding: 30px 24px 88px; }
.hub-wrap { max-width: 1008px; padding: 30px 24px 88px; }

.faq-page .breadcrumb,
.hub-page .breadcrumb {
  margin-bottom: 32px;
  color: #68788e;
  font-size: 12px;
  line-height: 1.7;
}
.faq-page .breadcrumb a,
.hub-page .breadcrumb a { color: #365c8b; }
.hub-page .breadcrumb-sep { color: #68788e; }

.contact-head,
.faq-page-head { margin-bottom: 32px; }
.contact-head h1,
.faq-page-head h1,
.hub-head h1 {
  color: #172f50;
  letter-spacing: .015em;
  line-height: 1.5;
}
.contact-head h1,
.faq-page-head h1 { font-size: clamp(1.75rem, 3.8vw, 2.35rem); }
.contact-head p,
.faq-page-head p,
.hub-lead { color: #44546b; font-size: 15px; line-height: 1.95; }

/* Contact and brochure request. */
.contact-card {
  padding: 38px 40px;
  border: 1px solid #dce5f0;
  border-radius: 22px;
  box-shadow: 0 8px 28px rgba(23, 47, 80, .045);
}
.contact-page .cf-group { gap: 9px; margin-bottom: 24px; }
.contact-page .cf-label { font-size: 14px; color: #172f50; line-height: 1.6; }
.contact-page .cf-required,
.contact-page .cf-optional { font-size: 11px; padding: 2px 8px; line-height: 1.65; }
.contact-page .cf-required { background: #2468db; }
.contact-page .cf-optional { color: #596b82; background: #f7f9fc; border-color: #dce5f0; }
.contact-page .cf-input,
.contact-page .cf-select,
.contact-page .cf-textarea {
  min-height: 50px;
  border: 1px solid #cbd7e6;
  border-radius: 10px;
  background-color: #fbfcfe;
  padding: 13px 15px;
  font-size: 16px;
  color: #172f50;
  transition: border-color .18s, box-shadow .18s, background-color .18s;
}
.contact-page .cf-select { padding-right: 40px; }
.contact-page .cf-textarea { min-height: 156px; line-height: 1.85; }
.contact-page .cf-input::placeholder,
.contact-page .cf-textarea::placeholder { color: #78869a; opacity: 1; }
.contact-page .cf-input:focus,
.contact-page .cf-select:focus,
.contact-page .cf-textarea:focus {
  border-color: #2468db;
  background-color: #fff;
  box-shadow: 0 0 0 3px rgba(36, 104, 219, .12);
}
.contact-page .cf-input:user-invalid,
.contact-page .cf-select:user-invalid,
.contact-page .cf-textarea:user-invalid {
  border-color: #b93842;
  background-color: #fffafb;
}
.contact-page .cf-divider { margin: 30px 0; border-color: #e4eaf2; }
.contact-page .cf-agree { gap: 11px; font-size: 13px; color: #44546b; line-height: 1.85; }
.contact-page .cf-agree input[type="checkbox"] { width: 20px; height: 20px; margin-top: 3px; }
.contact-page .cf-agree a { text-underline-offset: 3px; }
.contact-page .cf-submit { min-height: 54px; padding: 15px 20px; border-radius: 12px; }
.contact-page .cf-submit:disabled { opacity: .65; cursor: wait; transform: none; }
.contact-page .cf-note { color: #68788e; font-size: 13px; line-height: 1.8; }
.contact-page .cf-thanks { padding: 28px 4px; }
.contact-page .cf-thanks h2 { color: #172f50; line-height: 1.6; }
.contact-page .cf-thanks p { font-size: 15px; color: #44546b; line-height: 1.95; }
.contact-trust { gap: 12px; margin-top: 22px; }
.contact-trust .ct-item { background: #edf3fc; border-radius: 14px; padding: 18px 10px; }
.contact-trust .ct-label { color: #36506f; font-size: 12px; line-height: 1.7; }
.contact-page .doc-preview {
  padding: 22px 24px;
  border: 1px solid #d7e5fb;
  border-radius: 18px;
  background: #edf4ff;
  margin-bottom: 24px;
}
.contact-page .doc-preview-info h3 { color: #172f50; line-height: 1.65; }
.contact-page .doc-preview-tag { font-size: 12px; color: #365c8b; border-color: #d5e3f5; }
.contact-page .dl-contents { border: 1px solid #dce5f0; background: #fff; border-radius: 18px; }
.contact-page .dl-contents-title { color: #44546b; font-size: 14px; }
.contact-page .dl-contents li { align-items: flex-start; color: #44546b; line-height: 1.8; }
.contact-page .dl-contents li::before { margin-top: 3px; }

/* Searchable FAQ: visible states and compact, scrollable category navigation. */
.faq-page .faq-disclaimer {
  padding: 17px 20px;
  border-left: 3px solid #aac7f4;
  border-radius: 0 12px 12px 0;
  background: #edf3fc;
  font-size: 13px;
  color: #596b82;
  line-height: 1.9;
  margin-bottom: 24px;
}
.faq-page .faq-search-wrap { margin-bottom: 16px; }
.faq-page .faq-search {
  min-height: 54px;
  padding: 15px 20px;
  border: 1px solid #cbd7e6;
  border-radius: 14px;
  color: #172f50;
  font-size: 16px;
  box-shadow: 0 3px 12px rgba(23, 47, 80, .025);
}
.faq-page .faq-search::placeholder { color: #78869a; opacity: 1; }
.faq-page .faq-search:focus { border-color: #2468db; box-shadow: 0 0 0 3px rgba(36, 104, 219, .12); }
.faq-page .faq-cats {
  top: 80px;
  gap: 8px;
  padding: 14px 0;
  margin-bottom: 32px;
  background: #f5f8fc;
  border-bottom: 1px solid #dce5f0;
}
.faq-page .faq-cat-btn {
  min-height: 40px;
  padding: 9px 15px;
  border: 1px solid #d6e0ed;
  font-size: 12px;
  color: #44546b;
  line-height: 1.5;
}
.faq-page .faq-cat-btn:hover { color: #1e59b8; background: #eaf2ff; border-color: #aac7f4; }
.faq-page .faq-cat-btn.active { background: #2468db; border-color: #2468db; color: #fff; }
.faq-page .faq-group { margin-bottom: 48px; scroll-margin-top: 190px; }
.faq-page .faq-group-header { gap: 12px; padding-bottom: 14px; margin-bottom: 18px; border-bottom: 1px solid #dce5f0; }
.faq-page .faq-group-num { width: 38px; height: 38px; background: #e6efff; color: #2468db; border-radius: 10px; }
.faq-page .faq-group-title { color: #172f50; line-height: 1.6; }
.faq-page .faq-group-count { color: #68788e; white-space: nowrap; }
.faq-page .faq-item-page { border: 1px solid #dce5f0; border-radius: 14px; margin-bottom: 12px; background: #fff; }
.faq-page .faq-item-page:hover { border-color: #b9cdeb; box-shadow: 0 3px 12px rgba(23, 47, 80, .025); }
.faq-page .faq-item-page.open { border-color: #9bbff4; box-shadow: none; }
.faq-page .faq-q-page { padding: 21px 22px; color: #172f50; font-size: 15px; line-height: 1.75; gap: 14px; }
.faq-page .faq-q-page:hover { background: #f8fbff; }
.faq-page .faq-item-page.open .faq-q-page { background: #edf4ff; }
.faq-page .faq-qnum { margin-top: 2px; background: #edf3fc; color: #2468db; font-size: 11px; line-height: 1.8; }
.faq-page .faq-item-page.open .faq-qnum { background: #2468db; color: #fff; }
.faq-page .faq-tog { width: 24px; height: 26px; color: #68788e; }
.faq-page .faq-a-page { padding: 20px 24px 23px 24px; font-size: 15px; color: #44546b; line-height: 1.95; }
.faq-page .faq-cta { border: 1px solid #dce5f0; border-radius: 20px; box-shadow: none; padding: 34px; }
.faq-page .faq-cta h3 { color: #172f50; line-height: 1.6; }
.faq-page .faq-cta p { color: #44546b; font-size: 14px; line-height: 1.9; }
.faq-page .faq-search-empty { color: #68788e; line-height: 1.8; }

/* Comparison and cost guides. */
.hub-page .hub-head { margin-bottom: 28px; }
.hub-page .hub-head h1 { font-size: clamp(1.65rem, 3.5vw, 2.3rem); }
.hub-page .hub-eyebrow { color: #2468db; background: #e6efff; font-size: 11px; padding: 7px 14px; }
.hub-page .hub-updated { color: #68788e; font-size: 12px; margin-top: 18px; }
.hub-page .hub-toc {
  background: #fff;
  border: 1px solid #dce5f0;
  border-radius: 18px;
  padding: 24px 30px;
  margin: 28px 0 36px;
}
.hub-page .hub-toc h2 { color: #172f50; font-size: 14px; margin-bottom: 14px; }
.hub-page .hub-toc li { color: #68788e; font-size: 14px; line-height: 1.8; padding: 4px 0 4px 3px; }
.hub-page .hub-toc a { color: #365c8b; }
.hub-page .hub-sec {
  background: #fff;
  border: 1px solid #e1e8f1;
  border-radius: 20px;
  padding: 30px;
  margin-bottom: 24px;
  scroll-margin-top: 104px;
}
.hub-page .hub-sec h2 { color: #172f50; font-size: clamp(1.2rem, 2.7vw, 1.5rem); line-height: 1.6; border-bottom: 1px solid #dce5f0; padding-bottom: 17px; margin-bottom: 22px; }
.hub-page .hub-sec h3 { color: #172f50; line-height: 1.7; }
.hub-page .hub-sec p,
.hub-page .hub-sec li { font-size: 15px; color: #44546b; line-height: 1.95; }
.hub-page .hub-sec > :last-child { margin-bottom: 0; }
.hub-page .hub-sec a:not(.btn) { color: #2468db; text-underline-offset: 4px; }
.hub-page .hub-table-scroll {
  max-width: 100%;
  border: 1px solid #d7e1ee;
  border-radius: 14px;
  scrollbar-color: #9db8de #edf2f8;
  scrollbar-width: thin;
}
.hub-page .hub-table { min-width: 740px; font-size: 14px; }
.hub-page .hub-table th,
.hub-page .hub-table td { padding: 16px; line-height: 1.8; border-color: #e4eaf2; }
.hub-page .hub-table thead th { background: #233f65; color: #fff; font-size: 13px; }
.hub-page .hub-table tbody th { background: #f5f8fc; color: #172f50; white-space: normal; min-width: 130px; }
.hub-page .hub-table tbody td { color: #44546b; }
.hub-page .hub-table tr.is-ours th { background: #e6efff; color: #1f57a4; }
.hub-page .hub-table tr.is-ours td { background: #f1f6ff; }
.hub-page .hub-sec .hub-note,
.hub-page .hub-note { color: #68788e; font-size: 13px; line-height: 1.9; }
.hub-page .hub-card,
.hub-page .hub-check,
.hub-page .hub-qa { border: 1px solid #dce5f0; background: #fbfcfe; border-radius: 14px; padding: 22px; }
.hub-page .hub-card .hub-meta { color: #68788e; font-size: 13px; }
.hub-page .hub-pros { gap: 16px; margin: 18px 0 20px; }
.hub-page .hub-pros > div { padding: 19px; border-radius: 14px; }
.hub-page .hub-pros h4 { color: #172f50; font-size: 14px; line-height: 1.7; }
.hub-page .hub-pros li { font-size: 14px; line-height: 1.85; }
.hub-page .hub-pros .good { background: #edf7f3; }
.hub-page .hub-pros .bad { background: #fcf3ef; }
.hub-page .hub-qa h3 { font-size: 15px; margin-bottom: 10px; }
.hub-page .hub-links { border: 1px solid #dce5f0; border-radius: 18px; padding: 26px 30px; }
.hub-page .hub-links h2 { font-size: 15px; color: #172f50; }
.hub-page .hub-links a { color: #365c8b; padding: 13px 0; font-size: 14px; line-height: 1.8; }
.hub-page .hub-cta { border-radius: 20px; padding: 38px 32px; background: #233f65; }
.hub-page .hub-cta h2 { line-height: 1.7; font-size: 1.25rem; }
.hub-page .hub-cta p { color: #e0eafa; font-size: 14px; line-height: 1.95; }

/* Company and statutory disclosure. */
.legal-hero {
  padding: 50px 0 54px;
  background: #edf4ff;
  border-bottom: 1px solid #dce5f0;
}
.legal-hero::before,
.legal-hero::after { background: rgba(36, 104, 219, .035); }
.legal-hero .eyebrow { margin-bottom: 18px; color: #2468db; background: #e0ebfc; }
.legal-hero .eyebrow .dot { background: #2468db; }
.legal-hero h1 { color: #172f50; font-size: clamp(1.7rem, 3.6vw, 2.4rem); line-height: 1.5; }
.legal-hero .hero-lead { color: #44546b; line-height: 1.95; font-size: 15px; }
.company-section { padding: 64px 0; }
.company-section.alt { background: #f5f8fc; }
.company-section .section-head { margin-bottom: 32px; }
.company-section .section-head h2 { color: #172f50; font-size: clamp(1.4rem, 2.8vw, 1.9rem); }
.company-section .section-head p { font-size: 15px; color: #44546b; }
.company-section .philosophy,
.company-section .strength-card,
.company-section .biz-card,
.company-section .process-step,
.legal-card,
.company-section .access-card {
  border: 1px solid #dce5f0;
  border-radius: 18px;
  box-shadow: 0 5px 20px rgba(23, 47, 80, .035);
}
.company-section .philosophy { border-top: 3px solid #2468db; padding: 36px 44px; }
.company-section .philosophy p { color: #44546b; font-size: 15px; line-height: 2; }
.company-section .philosophy .lead-quote { color: #245baf; font-size: clamp(1.2rem, 2.4vw, 1.6rem); }
.company-section .strength-card,
.company-section .biz-card { padding: 30px; }
.company-section .strength-card h3,
.company-section .biz-card h3 { color: #172f50; line-height: 1.7; }
.company-section .strength-card p,
.company-section .biz-card > p { color: #44546b; font-size: 14px; line-height: 1.95; }
.company-section .biz-list li { color: #44546b; font-size: 14px; line-height: 1.8; }
.company-section .process-step { padding: 26px 20px; }
.company-section .process-step .p-num { background: #e6efff; color: #2468db; border-radius: 12px; }
.company-section .process-step h3 { color: #172f50; }
.company-section .process-step p { color: #596b82; font-size: 13px; line-height: 1.9; }
.company-section .tech-band { background: #f5f8fc; border: 1px solid #dce5f0; border-radius: 16px; }
.company-section .tech-tags span { font-size: 13px; color: #44546b; border-color: #dce5f0; }
.legal-body { background: #f5f8fc; padding: 48px 0 88px; }
.legal-table th,
.legal-table td { font-size: 14px; line-height: 1.95; padding: 20px 22px; overflow-wrap: anywhere; }
.legal-table th { background: #f3f7fc; color: #36506f; }
.legal-table td { color: #44546b; }
.legal-table tr { border-color: #e0e7f1; }
.legal-table td small { color: #68788e; font-size: 13px; }
.legal-note { color: #68788e; font-size: 13px; line-height: 1.95; }
.company-section .access-body { padding: 24px; }
.company-section .access-body h3 { color: #172f50; }
.company-section .access-body p { color: #44546b; font-size: 14px; }
.company-section .company-cta { background: #233f65; border-radius: 22px; box-shadow: none; padding: 44px 36px; }
.company-section .company-cta p { color: #e0eafa; line-height: 1.95; }

:is(.contact-page, .faq-page, .hub-page) :is(a, button, input[type="checkbox"]):focus-visible,
.legal-table a:focus-visible {
  outline: 3px solid #2468db;
  outline-offset: 3px;
}
.faq-page .faq-q-page:focus-visible { outline-offset: -4px; }

@media (max-width: 860px) {
  .company-section .process-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .company-section .legal-table th { padding: 15px 20px 7px; }
  .company-section .legal-table td { padding: 0 20px 17px; background: #f3f7fc; }
}

@media (max-width: 640px) {
  .contact-wrap { padding: 32px 20px 64px; }
  .faq-wrap,
  .hub-wrap { padding: 22px 20px 64px; }
  .faq-page .breadcrumb,
  .hub-page .breadcrumb { margin-bottom: 24px; font-size: 11px; }
  .contact-head,
  .faq-page-head { margin-bottom: 26px; }
  .contact-head h1,
  .faq-page-head h1 { font-size: 1.65rem; }
  .contact-head p,
  .faq-page-head p { font-size: 14px; line-height: 1.9; }
  .contact-card { padding: 25px 21px; border-radius: 18px; }
  .contact-page .cf-group { margin-bottom: 22px; }
  .contact-page .cf-label { flex-wrap: wrap; }
  .contact-page .cf-agree { font-size: 12px; }
  .contact-trust { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .contact-trust .ct-item { padding: 15px 6px; }
  .contact-trust .ct-label { font-size: 11px; }
  .contact-page .doc-preview { padding: 22px 18px; gap: 12px; }
  .contact-page .dl-contents { padding: 22px 20px; }
  .faq-page .faq-cats {
    top: 72px;
    flex-wrap: nowrap;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
    scrollbar-color: #b8c9e2 transparent;
    margin-right: -20px;
    padding: 12px 20px 12px 0;
    margin-bottom: 26px;
  }
  .faq-page .faq-cat-btn { flex-shrink: 0; font-size: 12px; min-height: 40px; }
  .faq-page .faq-disclaimer { padding: 15px 16px; font-size: 12px; }
  .faq-page .faq-search { padding: 14px; font-size: 16px; }
  .faq-page .faq-group { scroll-margin-top: 150px; margin-bottom: 36px; }
  .faq-page .faq-group-header { gap: 10px; }
  .faq-page .faq-group-title { font-size: 16px; }
  .faq-page .faq-group-count { font-size: 11px; }
  .faq-page .faq-q-page { padding: 18px 16px; gap: 9px; font-size: 14px; }
  .faq-page .faq-qnum { padding: 3px 6px; font-size: 10px; }
  .faq-page .faq-a-page { padding: 17px 18px 21px; font-size: 14px; }
  .faq-page .faq-cta { padding: 27px 21px; }
  .faq-page .faq-cta .btn { max-width: 100%; }
  .hub-page .hub-head h1 { font-size: 1.65rem; }
  .hub-page .hub-lead { font-size: 14px; }
  .hub-page .hub-toc { padding: 23px; margin-bottom: 26px; }
  .hub-page .hub-toc li { font-size: 13px; line-height: 1.9; }
  .hub-page .hub-sec { padding: 23px 20px; border-radius: 16px; margin-bottom: 20px; }
  .hub-page .hub-sec h2 { font-size: 1.15rem; margin-bottom: 18px; }
  .hub-page .hub-sec p,
  .hub-page .hub-sec li { font-size: 14px; line-height: 1.95; }
  .hub-page .hub-table th,
  .hub-page .hub-table td { padding: 13px 14px; }
  .hub-page .hub-sec .hub-scroll-hint { display: block; font-size: 12px; color: #596b82; margin-bottom: 9px; }
  .hub-page .hub-sec .hub-note,
  .hub-page .hub-note { font-size: 12px; }
  .hub-page .hub-card,
  .hub-page .hub-check,
  .hub-page .hub-qa { padding: 18px; }
  .hub-page .hub-pros { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .hub-page .hub-pros > div { padding: 17px; }
  .hub-page .hub-pros li { font-size: 13px; }
  .hub-page .hub-links { padding: 23px; }
  .hub-page .hub-links a { font-size: 13px; }
  .hub-page .hub-cta { padding: 29px 23px; }
  .hub-page .hub-cta h2 { font-size: 1.15rem; }
  .hub-page .hub-cta .btn { max-width: 100%; white-space: normal; text-align: center; }
  .legal-hero { padding: 35px 0 38px; }
  .legal-hero h1 { font-size: 1.7rem; }
  .legal-hero .hero-lead { font-size: 14px; }
  .company-section { padding: 46px 0; }
  .company-section .section-head p { font-size: 14px; }
  .company-section .philosophy { padding: 27px 23px; }
  .company-section .philosophy p { font-size: 14px; }
  .company-section .strength-card,
  .company-section .biz-card { padding: 26px 23px; }
  .company-section .process-flow { gap: 12px; }
  .company-section .process-step { padding: 23px 15px; }
  .company-section .company-cta { padding: 32px 24px; }
  .legal-body { padding: 32px 0 64px; }
}

@media (max-width: 600px) {
  .legal-body .legal-table th { padding: 16px 20px 7px; background: #f3f7fc; }
  .legal-body .legal-table td { padding: 0 20px 18px; background: #f3f7fc; }
}

@media (max-width: 380px) {
  .contact-wrap,
  .faq-wrap,
  .hub-wrap { padding-left: 16px; padding-right: 16px; }
  .contact-card { padding: 24px 18px; }
  .faq-page .faq-cats { margin-right: -16px; padding-right: 16px; }
  .company-section .process-flow { grid-template-columns: minmax(0, 1fr); }
}