/* White-glass integration layer for the accepted v2.0 homepage composition. */
:root {
  --home-glass: rgba(255, 255, 255, 0.76);
  --home-glass-strong: rgba(255, 255, 255, 0.9);
  --home-glass-line: rgba(88, 132, 156, 0.22);
  --home-shadow: 0 30px 70px -38px rgba(11, 36, 64, 0.42),
    0 14px 30px -24px rgba(11, 36, 64, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    inset 0 -1px 0 rgba(91, 130, 151, 0.08);
  --home-card-shadow: 0 22px 42px -30px rgba(11, 36, 64, 0.52),
    0 8px 18px -14px rgba(11, 36, 64, 0.25),
    inset 0 1px 0 #fff,
    inset 0 -1px 0 rgba(91, 130, 151, 0.08);
}

/* The legacy light theme declares --navy with a more specific root selector.
   Reassert the homepage palette after the shared styles so text and actions
   cannot become white on white. */
:root:not([data-theme="dark"]) {
  --navy: #0b2440;
  --ink: #17354f;
  --muted: #536b81;
  --accent: #007783;
  --teal: #1fb6c1;
  --line: #dce8ef;
  --light: #f5f9fc;
}

body {
  background:
    radial-gradient(circle at 18% 5%, rgba(209, 240, 246, 0.48), transparent 31rem),
    radial-gradient(circle at 91% 28%, rgba(227, 241, 249, 0.7), transparent 35rem),
    #fff;
}

/* The monochrome layer hides general imagery. These are approved package assets. */
.uh img,
#main img,
.db-footer img {
  visibility: visible !important;
  filter: none !important;
}

.uh svg,
#main svg,
.db-footer svg {
  filter: none !important;
}

.uh {
  background: rgba(255, 255, 255, 0.84);
  -webkit-backdrop-filter: blur(22px) saturate(1.08);
  backdrop-filter: blur(22px) saturate(1.08);
  box-shadow: 0 18px 40px -34px rgba(11, 36, 64, 0.48), inset 0 -1px 0 rgba(83, 128, 151, 0.08);
}

.uh-nav,
.uh-channel,
.uh-phone,
.uh-menu {
  box-shadow: var(--home-card-shadow);
}

.uh-cabinet-link {
  display: none;
}

/* Shared footer rules use a higher-specificity light-theme selector. */
:root:not([data-theme="dark"]) .db-footer .footer-links a {
  color: #e3edf6 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

:root:not([data-theme="dark"]) #main .u-section h2 {
  color: var(--navy) !important;
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: currentColor !important;
  text-shadow: none !important;
}

#main > .hero {
  width: 100%;
  max-width: none;
  margin: 0;
}

#main .hero-frame,
#main :is(.choice-card, .service-card, .step-card, .provider-card),
#main .fallback {
  border-color: rgba(255, 255, 255, 0.98) var(--home-glass-line) rgba(70, 111, 135, 0.3) rgba(255, 255, 255, 0.96);
  background:
    radial-gradient(circle at 12% 0%, rgba(255, 255, 255, 0.98), transparent 48%),
    linear-gradient(145deg, var(--home-glass-strong), rgba(255, 255, 255, 0.48) 58%, rgba(244, 251, 254, 0.8)),
    var(--home-glass);
  -webkit-backdrop-filter: blur(18px) saturate(1.04);
  backdrop-filter: blur(18px) saturate(1.04);
  box-shadow: var(--home-shadow);
}

#main :is(.choice-card, .service-card, .step-card, .provider-card) {
  box-shadow: var(--home-card-shadow);
}

#main .hero-frame {
  box-shadow:
    0 42px 82px -52px rgba(11, 36, 64, 0.48),
    0 18px 38px -28px rgba(11, 36, 64, 0.28),
    inset 0 1px 0 #fff,
    inset 0 -1px 0 rgba(91, 130, 151, 0.1);
}

#main .icon-tile,
#main .card-arrow,
#main .eyebrow {
  box-shadow: 0 12px 25px -20px rgba(11, 36, 64, 0.46), inset 0 1px 0 #fff;
}

@media (hover: hover) and (pointer: fine) {
  #main :is(.choice-card, .service-card, .provider-card):hover {
    transform: translateY(-2px);
    box-shadow:
      0 28px 48px -30px rgba(11, 36, 64, 0.48),
      0 12px 24px -18px rgba(11, 36, 64, 0.28),
      inset 0 1px 0 #fff;
  }
}

@media (max-width: 699px) {
  .uh {
    box-shadow: 0 14px 30px -26px rgba(11, 36, 64, 0.46), inset 0 -1px 0 rgba(83, 128, 151, 0.08);
  }

  #main .hero-frame,
  #main :is(.choice-card, .service-card, .step-card, .provider-card),
  #main .fallback {
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
  }
}

/* Finish service pages with a compact, centered bridge into the footer. */
#main.service-page .service-section:has(+ nav.service-related-links) {
  padding-bottom: 34px;
}

#main.service-page nav.service-related-links {
  padding: 16px 0 24px;
}

#main.service-page nav.service-related-links > .container {
  justify-content: center;
}

#main.service-page nav.service-related-links a {
  min-height: 38px;
  padding: 7px 12px;
}

@media (max-width: 699px) {
  #main.service-page .service-section:has(+ nav.service-related-links) {
    padding-bottom: 24px;
  }

  #main.service-page nav.service-related-links {
    padding: 12px 0 18px;
  }
}

@media (max-width: 1199px) {
  .uh-cabinet-link {
    display: flex;
  }
}

/* Keep every numbered process marker centered over the card it labels. */
@media (min-width: 700px) {
  #main :is(.process-grid, .steps) {
    --process-column-gap: 24px;
  }

  #main .steps {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
  }

  #main :is(.process-grid, .steps) .step-rail {
    justify-content: center !important;
  }

  #main :is(.process-grid, .steps) .step:not(:last-child) .step-rail::after {
    left: calc(50% + 33px) !important;
    right: calc(-50% - var(--process-column-gap) + 33px) !important;
  }

  #main :is(.process-grid, .steps) .step:not(:last-child) .step-rail::before {
    right: calc(-50% - var(--process-column-gap) + 35px) !important;
  }
}

@media (min-width: 1000px) and (max-width: 1199px) {
  #main :is(.process-grid, .steps) {
    --process-column-gap: 20px;
  }

  #main .steps {
    gap: 20px;
  }
}

@media (min-width: 700px) and (max-width: 999px) {
  #main .steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
  }
}
/* Compatibility polish shared by every redesigned page. */
main[data-ui-version] .request-panel>.request-form.crm-lead-form{border:0;border-radius:0;box-shadow:none}
main[data-ui-version] .news-card.glass-card{border-color:#D5E6ED}
@media(min-width:1401px) and (max-width:1699px){
body:has(main[data-ui-version]) :is(.ai-chat-widget,.client-portal-widget){width:58px;max-width:58px;min-height:56px;justify-content:center;gap:0;padding:.68rem;opacity:.9}
body:has(main[data-ui-version]) :is(.ai-chat-widget,.client-portal-widget) strong{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
}
@media(max-width:640px){
body:has(main[data-ui-version]) .ai-chat-widget{width:44px;max-width:44px;min-height:44px;padding:7px;right:6px;opacity:.86}
body:has(main[data-ui-version]) .ai-chat-widget span{width:28px;height:28px}
}

/* Compact first-screen hierarchy shared by the redesigned service pages. */
#main.service-page .service-hero {
  padding: 24px 24px 14px;
}

#main.service-page .service-hero-frame {
  border-radius: 28px;
}

#main.service-page .service-hero-grid {
  grid-template-columns: minmax(0, .96fr) minmax(0, 1.04fr);
  gap: 34px;
  align-items: center;
  padding-block: 32px;
}

#main.service-page .service-hero-copy {
  min-width: 0;
}

#main.service-page .service-eyebrow {
  margin-bottom: 10px;
  font-size: 13px;
}

#main.service-page .service-hero h1 {
  max-width: 620px;
  font-size: clamp(40px, 3.25vw, 46px);
  line-height: 1.055;
  letter-spacing: -.042em;
}

#main.service-page .service-hero h1 span {
  color: #0796a7 !important;
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: currentColor !important;
}

#main.service-page .service-lead {
  max-width: 620px;
  margin-top: 13px;
  font-size: 15px;
  line-height: 1.58;
}

#main.service-page .hero-geo {
  margin-top: 8px;
  font-size: 12px;
}

#main.service-page .hero-service-points {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  max-width: 620px;
  margin-top: 16px;
}

#main.service-page .hero-service-points:has(> :nth-child(4)) {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

#main.service-page .hero-service-point {
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 8px;
  min-height: 54px;
  padding: 6px 9px 6px 6px;
  border-radius: 13px;
}

#main.service-page .hero-service-point .point-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
}

#main.service-page .hero-service-point :is(.point-svg, .point-icon > svg) {
  width: 19px;
  height: 19px;
}

#main.service-page .hero-service-point .point-icon::after {
  min-width: 17px;
  height: 17px;
  font-size: 7px;
}

#main.service-page .hero-service-point strong {
  font-size: 13px;
  line-height: 1.24;
}

#main.service-page .hero-service-point small {
  display: none;
}

#main.service-page .hero-commerce {
  grid-template-columns: minmax(170px, .78fr) minmax(0, 1.22fr);
  gap: 8px;
  max-width: 620px;
  margin-top: 12px;
}

#main.service-page .hero-commerce--banner {
  grid-template-columns: minmax(0, 1.3fr) minmax(145px, .7fr);
  gap: 8px;
  margin-top: 12px;
}

#main.service-page .hero-commerce .hero-actions {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
  gap: 8px;
  align-self: center;
  align-items: center;
  margin: 0;
}

#main.service-page .hero-commerce > .button {
  align-self: center;
}

#main.service-page .hero-commerce .button,
#main.service-page .hero-consult-button {
  min-width: 0;
  min-height: 46px !important;
  gap: 6px;
  padding: 10px 9px;
  border-radius: 13px !important;
  font-size: 13px !important;
  line-height: 1.25;
  white-space: normal;
}

#main.service-page .hero-commerce .button svg {
  width: 16px;
  height: 16px;
  flex: none;
}

#main.service-page .hero-consult-button .icon {
  width: 18px !important;
  height: 18px !important;
  padding: 6px !important;
  border-radius: 10px;
}

#main.service-page .hero-price,
#main.service-page .hero-price-inline {
  min-width: 0;
  min-height: 0;
  padding: 8px 12px;
  border-radius: 13px;
}

#main.service-page .hero-price strong,
#main.service-page .hero-price-inline strong {
  font-size: 20px;
  line-height: 1.12;
}

#main.service-page .hero-price small {
  display: none;
}

#main.service-page .hero-price-inline span {
  margin-top: 3px;
  font-size: 9.5px;
  line-height: 1.3;
}

#main.service-page :is(.hero-facts, .hero-report-note, .hero-route-bar) {
  display: none;
}

#main.service-page .service-hero-visual {
  align-self: center;
  width: 100%;
  max-width: none;
  min-width: 0;
  margin: 0;
}

#main.service-page :is(.hero-art-panel, .hero-banner-media, .hero-art-crop) {
  width: 100%;
  height: 460px;
  min-height: 0;
  max-height: 460px;
  aspect-ratio: auto;
  border-radius: 23px;
}

#main.service-page :is(.hero-art-panel, .hero-banner-media, .hero-art-crop) :is(picture, img) {
  width: 100%;
  height: 100%;
}

#main.service-page .hero-banner-image {
  object-fit: cover;
}

#main.service-page .service-hero-visual figcaption.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

#main.service-page.reporting-hub-page .hero-price {
  min-height: 0;
}

#main.service-page.bank-115-hub-page .hero-commerce--banner {
  grid-template-columns: 1fr;
}

#main.service-page.bank-115-hub-page .hero-price-inline {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  padding: 6px 12px;
  border-left: 0;
}

#main.service-page.bank-115-hub-page .hero-price-inline .price-tier {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: baseline;
  min-height: 32px;
}

#main.service-page.bank-115-hub-page .hero-price-inline .price-tier + .price-tier {
  margin: 0 0 0 12px;
  padding: 0 0 0 12px;
  border-top: 0;
  border-left: 1px solid #dcebf0;
}

#main.service-page.bank-115-hub-page .hero-price-inline .price-tier b {
  font-size: 17px;
}

#main.service-page.bank-115-hub-page .hero-price-inline .price-tier small {
  font-size: 10px;
}

#main.service-page .service-hero-steps {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: calc(100% - 48px);
  max-width: 1000px;
  gap: 18px;
  margin: 12px auto 0;
}

#main.service-page .service-hero-steps:has(> :nth-child(4)) {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-width: 1100px;
}

#main.service-page .service-hero {
  padding-bottom: 0;
}

#main.service-page .service-hero-steps .hero-service-point {
  grid-template-columns: 24px 36px minmax(0, 1fr);
  gap: 8px;
}

#main.service-page .service-hero-steps .point-icon::after {
  display: none;
}

#main.service-page .service-step-number {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 8px;
  background: var(--navy);
  color: #fff;
  font-size: 8px;
  line-height: 1;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

@media (min-width: 1000px) {
  #main.service-page .service-hero-steps {
    grid-template-columns: repeat(3, minmax(0, 250px));
    justify-content: space-between;
    gap: 32px;
  }

  #main.service-page .service-hero-steps:has(> :nth-child(4)) {
    grid-template-columns: repeat(4, minmax(0, 220px));
    gap: 24px;
  }

  #main.service-page .service-hero-copy {
    align-self: stretch;
    display: grid;
    align-content: center;
    gap: 18px;
  }

  #main.service-page :is(.service-eyebrow, .service-lead, .hero-geo, .hero-commerce, .hero-report-note) {
    margin-top: 0;
    margin-bottom: 0;
  }

  #main.service-page .service-hero h1 {
    line-height: 1.1;
  }

  #main.service-page .service-lead {
    line-height: 1.68;
  }
}

@media (min-width: 1200px) {
  #main.service-page .service-hero-visual {
    transform: translateX(32px);
  }
}

@media (min-width: 1000px) and (max-width: 1199px) {
  #main.service-page .service-hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, .92fr);
    gap: 24px;
    padding-block: 28px;
  }

  #main.service-page .service-hero h1 {
    font-size: 40px;
  }

  #main.service-page :is(.hero-art-panel, .hero-banner-media, .hero-art-crop) {
    height: 420px;
    max-height: 420px;
  }

  #main.service-page .service-hero-visual {
    transform: translateX(16px);
  }
}

@media (min-width: 700px) and (max-width: 999px) {
  #main.service-page .service-hero {
    padding: 18px 18px 10px;
  }

  #main.service-page .service-hero-grid {
    grid-template-columns: 1fr;
    gap: 20px;
    padding-block: 26px 22px;
  }

  #main.service-page .service-hero-copy {
    width: 100%;
    max-width: none;
    margin: 0;
  }

  #main.service-page .service-hero h1 {
    max-width: 760px;
    font-size: 40px;
  }

  #main.service-page .service-lead,
  #main.service-page .hero-service-points,
  #main.service-page .hero-commerce {
    max-width: none;
  }

  #main.service-page .hero-service-points:has(> :nth-child(4)) {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  #main.service-page .service-hero-steps {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: calc(100% - 48px);
    max-width: 1000px;
    gap: 18px;
    margin-top: 12px;
  }

  #main.service-page .service-hero-steps:has(> :nth-child(4)) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 720px;
  }

  #main.service-page .service-hero-visual {
    width: 100%;
    max-width: none;
    margin: 0;
  }

  #main.service-page :is(.hero-art-panel, .hero-banner-media, .hero-art-crop) {
    height: 360px;
    max-height: 360px;
    border-radius: 20px;
  }
}

@media (max-width: 699px) {
  #main.service-page .service-hero {
    padding: 12px 10px 8px;
  }

  #main.service-page .service-hero-frame {
    border-radius: 21px;
  }

  #main.service-page .service-hero-grid {
    width: calc(100% - 28px);
    grid-template-columns: 1fr;
    gap: 18px;
    padding-block: 22px 18px;
  }

  #main.service-page .service-hero-copy {
    display: block;
    width: 100%;
    max-width: none;
    margin: 0;
  }

  #main.service-page .service-eyebrow {
    margin-bottom: 9px;
    font-size: 12px;
  }

  #main.service-page .service-hero h1 {
    max-width: none;
    font-size: clamp(30px, 8.9vw, 35px);
    line-height: 1.06;
    letter-spacing: -.038em;
  }

  #main.service-page .service-lead {
    margin-top: 12px;
    font-size: 14px;
    line-height: 1.55;
  }

  #main.service-page .hero-geo {
    margin-top: 7px;
    font-size: 11px;
  }

  #main.service-page .hero-service-points,
  #main.service-page .hero-service-points:has(> :nth-child(4)) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin-top: 14px;
  }

  #main.service-page .hero-service-point {
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 7px;
    min-height: 50px;
    padding: 6px;
    border-radius: 12px;
  }

  #main.service-page .hero-service-point .point-icon {
    width: 32px;
    height: 32px;
    border-radius: 9px;
  }

  #main.service-page .hero-service-point :is(.point-svg, .point-icon > svg) {
    width: 17px;
    height: 17px;
  }

  #main.service-page .hero-service-point strong {
    font-size: 11.5px;
    line-height: 1.22;
  }

  #main.service-page .hero-commerce,
  #main.service-page .hero-commerce--banner {
    grid-template-columns: 1fr;
    gap: 7px;
    margin-top: 10px;
  }

  #main.service-page .hero-commerce .hero-actions {
    grid-template-columns: 1fr;
    gap: 7px;
  }

  #main.service-page .hero-commerce .button,
  #main.service-page .hero-consult-button {
    min-height: 44px !important;
    padding: 9px 11px;
    font-size: 12px !important;
  }

  #main.service-page .hero-price,
  #main.service-page .hero-price-inline {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 9px;
    padding: 8px 11px;
  }

  #main.service-page .hero-price > span {
    grid-column: 1 / -1;
    font-size: 9px;
  }

  #main.service-page .hero-price strong,
  #main.service-page .hero-price-inline strong {
    font-size: 18px;
  }

  #main.service-page .hero-price-inline span {
    margin: 0;
  }

  #main.service-page .service-hero-visual {
    width: 100%;
    max-width: none;
    margin: 0;
  }

  #main.service-page :is(.hero-art-panel, .hero-banner-media, .hero-art-crop) {
    height: 300px;
    max-height: 300px;
    aspect-ratio: auto;
    border-radius: 17px;
  }

  #main.service-page .service-hero-steps,
  #main.service-page .service-hero-steps:has(> :nth-child(4)) {
    grid-template-columns: 1fr;
    width: calc(100% - 50px);
    max-width: 340px;
    gap: 12px;
    margin-top: 12px;
  }
}
