/*
 * SDES mobile experience layer — 2026-08-03
 * This file intentionally has no visual desktop rules. The dynamic PHP site
 * keeps one content source while mobile receives compact, touch-first layouts.
 */

.sdes-mobile-section-toggle,
.sdes-mobile-swipe-hint {
  display: none;
}

@media (max-width: 767px) {
  :root {
    --sdes-mobile-gutter: 14px;
    --sdes-mobile-radius: 16px;
    --sdes-mobile-ink: #10231f;
    --sdes-mobile-muted: #435b54;
    --sdes-mobile-green: #0b5d4b;
    --sdes-mobile-orange: #a84300;
    --sdes-mobile-border: #d6e2dd;
    --sdes-mobile-surface: #ffffff;
    --sdes-mobile-soft: #f4f8f6;
  }

  html {
    scroll-behavior: smooth;
    scroll-padding-top: 124px;
    -webkit-text-size-adjust: 100%;
  }

  body {
    min-width: 320px !important;
    padding-bottom: 0 !important;
    overflow-x: clip !important;
    color: var(--sdes-mobile-ink);
  }

  body.sdes-mobile-experience {
    --mobile-section-limit: 286px;
  }

  body.sdes-mobile-experience.contact-page {
    --mobile-section-limit: 320px;
  }

  *,
  *::before,
  *::after {
    min-width: 0;
  }

  .container,
  .cp-container,
  [class*="container"] {
    width: calc(100% - (var(--sdes-mobile-gutter) * 2)) !important;
    max-width: calc(100% - (var(--sdes-mobile-gutter) * 2)) !important;
    margin-inline: auto !important;
    padding-inline: 0 !important;
  }

  main,
  section,
  article,
  nav,
  aside,
  footer,
  header {
    max-width: 100%;
  }

  p,
  li,
  dd,
  label,
  input,
  select,
  textarea,
  button {
    font-size: 16px !important;
    line-height: 1.55 !important;
  }

  p,
  li,
  dd {
    overflow-wrap: anywhere;
    text-align: left !important;
    text-align-last: left !important;
    hyphens: auto;
  }

  h1,
  .home-hero-title,
  .sp-hero h1,
  .sdes-industry-hero h1,
  .sdes-hero h1,
  .cp-hero h1,
  .csd-hero h1 {
    max-width: 100% !important;
    margin: 8px 0 14px !important;
    font-size: clamp(30px, 9vw, 38px) !important;
    line-height: 1.12 !important;
    letter-spacing: -.025em !important;
    text-align: left !important;
  }

  h2,
  .sp-sec-head h2,
  .sdes-section-head h2,
  .cp-guidance-head h2,
  .csd-page h2,
  .home-page .sp-sec-head h2,
  .home-page .home-global-panel h2 {
    max-width: 100% !important;
    margin-top: 7px !important;
    margin-bottom: 12px !important;
    font-size: clamp(24px, 7vw, 29px) !important;
    line-height: 1.18 !important;
    letter-spacing: -.018em !important;
    text-align: left !important;
  }

  h3,
  main#main-content h3 {
    font-size: 20px !important;
    line-height: 1.28 !important;
  }

  a,
  button,
  summary,
  input,
  select,
  textarea {
    touch-action: manipulation;
  }

  a:focus-visible,
  button:focus-visible,
  summary:focus-visible,
  input:focus-visible,
  select:focus-visible,
  textarea:focus-visible {
    outline: 3px solid #1d70b8 !important;
    outline-offset: 3px !important;
  }

  /* Compact header: logo, theme control and quote action stay usable. */
  .top-bar {
    display: none !important;
  }

  .site-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    height: auto !important;
    background: rgba(255, 255, 255, .98) !important;
    border-bottom: 1px solid var(--sdes-mobile-border) !important;
    box-shadow: 0 5px 18px rgba(16, 35, 31, .08) !important;
    backdrop-filter: none !important;
  }

  .header-inner {
    display: flex !important;
    min-height: 62px !important;
    gap: 8px !important;
    padding-block: 8px 0 !important;
    align-items: center !important;
    flex-wrap: wrap !important;
  }

  .site-header .logo,
  .site-header .logo-image-link {
    order: 1 !important;
    display: inline-flex !important;
    flex: 1 1 136px !important;
    width: auto !important;
    margin: 0 !important;
    text-align: left !important;
  }

  .site-header .header-logo-img {
    width: 148px !important;
    max-width: 148px !important;
    max-height: 34px !important;
    margin: 0 !important;
  }

  .site-header .dark-toggle {
    order: 2 !important;
    flex: 0 0 44px !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
  }

  .site-header .header-cta {
    order: 2 !important;
    display: inline-flex !important;
    min-height: 44px !important;
    width: auto !important;
    padding: 10px 13px !important;
    border-radius: 12px !important;
    background: var(--sdes-mobile-orange) !important;
    color: #fff !important;
    font-size: 14px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
  }

  .sdes-main-menu {
    order: 3 !important;
    flex: 1 1 100% !important;
    width: 100% !important;
  }

  .sdes-main-menu .sdes-mobile-toggle,
  .sdes2-bar .sdes2-mobile-toggle {
    min-height: 44px !important;
    padding: 10px 2px !important;
    font-size: 14px !important;
  }

  .sdes-menu-list > li > a,
  .sdes-caret,
  .sdes2-pill,
  .sdes2-flyout-grid a {
    min-height: 44px !important;
  }

  .sdes-menu-list,
  .sdes2-pillrow {
    max-height: min(58vh, 480px) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
  }

  /* Mobile hero and banner geometry. */
  .home-top-banner-section,
  .cs-top-banner,
  .portfolio-banner,
  .sdes-industry-banner,
  .sdes-page-banner {
    padding: 8px 0 !important;
  }

  .home-top-banner-frame,
  .cs-top-banner-frame,
  .portfolio-banner-frame,
  .sdes-industry-banner-frame,
  .sdes-page-banner-frame {
    height: 132px !important;
    min-height: 132px !important;
    aspect-ratio: auto !important;
    border-radius: 13px !important;
    overflow: hidden !important;
  }

  .home-top-banner-frame img,
  .cs-top-banner-frame img,
  .portfolio-banner-frame img,
  .sdes-industry-banner-frame img,
  .sdes-page-banner-frame img {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: auto !important;
    object-fit: cover !important;
    object-position: center !important;
  }

  .sp-hero,
  .home-page .sp-hero,
  .sdes-industry-hero,
  .sdes-hero,
  .cp-hero,
  .csd-hero {
    min-height: 0 !important;
    padding: 24px 0 28px !important;
    clip-path: none !important;
  }

  .sp-hero-inner,
  .home-page .sp-hero-inner,
  .sdes-hero-grid,
  .sdes-industry-hero-grid,
  .cp-hero-grid,
  .csd-hero-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    min-height: 0 !important;
  }

  .sp-hero-text,
  .home-page .sp-hero-text,
  .sdes-hero-copy,
  .cp-hero-copy {
    padding: 0 !important;
  }

  .sp-hero-text p,
  .home-page .sp-hero-text p,
  .sdes-hero-copy p,
  .cp-hero-copy p,
  .csd-hero p {
    margin: 0 0 10px !important;
    font-size: 15.5px !important;
    line-height: 1.58 !important;
  }

  .sp-hero-img,
  .sp-hero-img.sp-hero-img-portrait,
  .home-hero-visual,
  .sdes-hero-visual,
  .cp-hero-visual,
  .csd-hero-visual,
  .csd-hero-image {
    width: 100% !important;
    height: 205px !important;
    min-height: 0 !important;
    max-height: 205px !important;
    margin: 0 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
  }

  .sp-hero-img picture,
  .sp-hero-img img,
  .home-hero-visual picture,
  .home-hero-visual img,
  .sdes-hero-visual picture,
  .sdes-hero-visual img,
  .cp-hero-visual img,
  .csd-hero-image img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 205px !important;
    aspect-ratio: 16 / 9 !important;
    object-fit: cover !important;
    object-position: center !important;
  }

  .sp-hero-actions,
  .home-hero-actions,
  .sdes-hero-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 9px !important;
    margin-top: 15px !important;
  }

  .sp-hero-actions .sp-btn-secondary,
  .home-hero-actions .sp-btn-secondary,
  .sdes-hero-actions .sdes-btn-secondary {
    display: none !important;
  }

  .btn,
  .sp-btn-primary,
  .sdes-btn,
  .cp-submit,
  .footer-cta .btn {
    display: inline-flex !important;
    min-height: 48px !important;
    width: 100% !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 15px !important;
    border-radius: 13px !important;
    background: var(--sdes-mobile-orange) !important;
    border-color: var(--sdes-mobile-orange) !important;
    color: #fff !important;
    font-size: 15px !important;
    line-height: 1.25 !important;
    text-align: center !important;
    white-space: normal !important;
  }

  .sp-hero-jump-links {
    display: flex !important;
    gap: 8px !important;
    margin-top: 13px !important;
    overflow-x: auto !important;
    scrollbar-width: none;
  }

  .sp-hero-jump-links::-webkit-scrollbar {
    display: none;
  }

  .sp-hero-jump-links a {
    flex: 0 0 auto !important;
    min-height: 44px !important;
    padding: 10px 12px !important;
    white-space: nowrap !important;
  }

  .sp-hero-badges,
  .sp-trust-badges,
  .home-page .sp-hero-badges {
    display: flex !important;
    grid-template-columns: none !important;
    gap: 8px !important;
    margin-top: 13px !important;
    overflow-x: auto !important;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }

  .sp-hero-badges::-webkit-scrollbar,
  .sp-trust-badges::-webkit-scrollbar {
    display: none;
  }

  .sp-hero-badges span,
  .sp-trust-badge {
    flex: 0 0 auto !important;
    width: auto !important;
    min-height: 42px !important;
    padding: 9px 11px !important;
    border-radius: 10px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
    scroll-snap-align: start;
  }

  .sp-trust-strip,
  .sp-stats-strip,
  .cs-evidence-strip,
  .csd-facts {
    padding: 12px 0 !important;
  }

  .sp-stats-grid,
  .trust-stats-grid,
  .csd-facts dl {
    display: flex !important;
    grid-template-columns: none !important;
    gap: 9px !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .sp-stats-grid::-webkit-scrollbar,
  .trust-stats-grid::-webkit-scrollbar,
  .csd-facts dl::-webkit-scrollbar {
    display: none;
  }

  .sp-stat-card,
  .csd-facts dl > div {
    flex: 0 0 128px !important;
    min-height: 86px !important;
    padding: 12px 10px !important;
    scroll-snap-align: start;
  }

  .sp-stat-card strong {
    font-size: 23px !important;
  }

  /* Consistent compact section rhythm. */
  .sp-section,
  .sdes-section,
  .home-page .sp-section,
  .cp-section,
  .cp-guidance,
  .cp-faq,
  .csd-page .sp-section {
    padding: 26px 0 !important;
  }

  .sp-sec-head,
  .sdes-section-head,
  .cp-guidance-head {
    margin-bottom: 17px !important;
  }

  .sp-sec-head p,
  .sdes-section-head p,
  .cp-guidance-head p {
    margin-bottom: 0 !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
  }

  .sp-overview-grid,
  .sp-quality-grid,
  .sp-io-grid,
  .service-integration-layout,
  .service-format-strip,
  .sdes-content-grid,
  .sdes-content-grid-alt,
  .csd-two-col,
  .cp-grid,
  .portfolio-final,
  .footer-cta-inner {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  /* One-card swipe rows replace tall mobile card stacks. */
  .sdes-mobile-carousel {
    display: flex !important;
    grid-template-columns: none !important;
    grid-auto-flow: unset !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
    padding: 2px 7% 12px 1px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory;
    scroll-padding-left: 1px;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .sdes-mobile-carousel::-webkit-scrollbar {
    display: none;
  }

  .sdes-mobile-carousel > * {
    flex: 0 0 88% !important;
    width: 88% !important;
    max-width: 88% !important;
    height: auto !important;
    margin: 0 !important;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }

  .sdes-mobile-swipe-hint {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: -4px 0 10px !important;
    color: var(--sdes-mobile-green) !important;
    font-size: 12px !important;
    font-weight: 900;
    line-height: 1.25 !important;
    letter-spacing: .035em;
    text-transform: uppercase;
  }

  .sdes-mobile-swipe-hint::before {
    content: "↔";
    font-size: 16px;
  }

  /* Long page sections expose a useful preview and remain available on tap. */
  .sdes-mobile-disclosure-content {
    max-height: var(--mobile-section-limit) !important;
    overflow: hidden !important;
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 78%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 0%, #000 78%, transparent 100%);
    transition: max-height .28s ease;
  }

  .sdes-mobile-disclosure.is-mobile-expanded .sdes-mobile-disclosure-content {
    max-height: none !important;
    overflow: visible !important;
    -webkit-mask-image: none;
    mask-image: none;
  }

  .sdes-mobile-section-toggle {
    display: flex;
    width: calc(100% - (var(--sdes-mobile-gutter) * 2));
    max-width: 420px;
    min-height: 46px;
    margin: 12px auto 0;
    padding: 10px 14px;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border: 2px solid var(--sdes-mobile-green);
    border-radius: 999px;
    background: var(--sdes-mobile-surface);
    color: var(--sdes-mobile-green);
    font-size: 14px !important;
    font-weight: 900;
    line-height: 1.2 !important;
    box-shadow: 0 7px 18px rgba(11, 93, 75, .10);
    cursor: pointer;
  }

  .sdes-mobile-section-toggle::after {
    content: "+";
    display: grid;
    width: 22px;
    height: 22px;
    place-items: center;
    border-radius: 50%;
    background: var(--sdes-mobile-green);
    color: #fff;
    font-size: 17px;
    line-height: 1;
  }

  .sdes-mobile-disclosure.is-mobile-expanded .sdes-mobile-section-toggle::after {
    content: "−";
  }

  /* Native details accordions remain the preferred FAQ interaction. */
  details,
  .sp-faq-item,
  .cp-faq-grid details {
    border-radius: 13px !important;
  }

  summary,
  .sp-faq-item summary,
  .cp-faq-grid summary {
    min-height: 48px !important;
    padding: 13px 44px 13px 13px !important;
    cursor: pointer;
    font-size: 15px !important;
    line-height: 1.4 !important;
  }

  details > p,
  .sp-faq-item > p,
  .cp-faq-grid details > p {
    padding: 0 13px 14px !important;
    font-size: 15px !important;
  }

  /* Forms use mobile keyboard-safe sizing and single-column fields. */
  .cp-row,
  .cp-form-trust,
  .cp-guidance-grid,
  .cp-faq-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .cp-form-card,
  .cp-info,
  .csd-panel {
    padding: 20px 16px !important;
    border-radius: var(--sdes-mobile-radius) !important;
  }

  input,
  select,
  textarea {
    width: 100% !important;
    min-height: 48px !important;
    padding: 12px !important;
    border-radius: 10px !important;
  }

  textarea {
    min-height: 132px !important;
  }

  .cp-consent input[type="checkbox"] {
    width: 24px !important;
    min-height: 24px !important;
  }

  table {
    width: 100%;
    min-width: 620px;
  }

  .sdes-table-scroll {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* Keep the fixed interface clear and avoid duplicate mobile CTAs. */
  .sp-sticky-cta,
  .sp-wa-float,
  .mobile-scroll-control-wrap {
    display: none !important;
  }

  .site-footer .footer-cta {
    padding: 18px 0 !important;
  }

  .site-footer .footer-cta p {
    display: none !important;
  }

  .site-footer .footer-two-column {
    padding-top: 18px !important;
    padding-bottom: 12px !important;
  }

  .footer-section-toggle {
    min-height: 44px !important;
    font-size: 13px !important;
  }

  .footer-product-social-icons {
    display: flex !important;
    flex-wrap: wrap !important;
  }

  .footer-product-social-icons a {
    width: 44px !important;
    height: 44px !important;
  }

  [data-theme="dark"] .site-header {
    background: rgba(8, 20, 35, .98) !important;
    border-color: rgba(255, 255, 255, .14) !important;
  }

  [data-theme="dark"] .sdes-mobile-section-toggle {
    background: #0e1b2f;
    border-color: #69d1b8;
    color: #bff4e7;
  }

  [data-theme="dark"] .sdes-mobile-section-toggle::after {
    background: #69d1b8;
    color: #071510;
  }

  [data-theme="dark"] .sdes-mobile-swipe-hint {
    color: #9ce8d5 !important;
  }
}

@media (max-width: 370px) {
  .site-header .header-logo-img {
    width: 130px !important;
  }

  .site-header .header-cta {
    padding-inline: 10px !important;
    font-size: 13px !important;
  }

  h1,
  .home-hero-title,
  .sp-hero h1,
  .sdes-industry-hero h1,
  .sdes-hero h1,
  .cp-hero h1,
  .csd-hero h1 {
    font-size: 28px !important;
  }
}

@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* Final mobile contract: every content collection uses one vertical column.
   Secondary sections start fully closed so the complete page remains within
   the requested 8–10-screen review length; opening a row reveals all content. */
@media (max-width: 767px) {
  main#main-content [class*="grid"],
  main#main-content .sp-stats-grid,
  main#main-content .trust-stats-grid,
  main#main-content .csd-facts dl,
  main#main-content .sp-hero-inner,
  main#main-content .sdes-hero-grid,
  main#main-content .sdes-industry-hero-grid,
  main#main-content .cp-hero-grid,
  main#main-content .csd-hero-grid,
  main#main-content .sp-overview-grid,
  main#main-content .sp-quality-grid,
  main#main-content .sp-io-grid,
  main#main-content .service-integration-layout,
  main#main-content .service-format-strip,
  main#main-content .sdes-content-grid,
  main#main-content .sdes-content-grid-alt,
  main#main-content .csd-two-col,
  main#main-content .cp-grid,
  main#main-content .cp-row,
  main#main-content .cp-guidance-grid,
  main#main-content .cp-faq-grid,
  main#main-content .portfolio-final {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-auto-flow: row !important;
    grid-auto-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-inline: 0 !important;
    overflow: visible !important;
    scroll-snap-type: none !important;
  }

  main#main-content [class*="grid"] > *,
  main#main-content .sdes-mobile-carousel > *,
  main#main-content .sp-stats-grid > *,
  main#main-content .trust-stats-grid > *,
  main#main-content .csd-facts dl > * {
    flex: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
  }

  .sdes-mobile-swipe-hint {
    display: none !important;
  }

  main#main-content img {
    display: block !important;
    max-width: 100% !important;
  }

  .sdes-mobile-disclosure {
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    border: 0 !important;
    overflow: visible !important;
  }

  .sdes-mobile-disclosure > .sdes-mobile-disclosure-content {
    display: none !important;
    max-height: none !important;
    overflow: visible !important;
    -webkit-mask-image: none !important;
    mask-image: none !important;
  }

  .sdes-mobile-disclosure.is-mobile-expanded {
    padding-block: 0 24px !important;
  }

  .sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content {
    display: block !important;
  }

  .sdes-mobile-disclosure > .sdes-mobile-section-toggle {
    position: relative !important;
    display: flex !important;
    width: calc(100% - (var(--sdes-mobile-gutter) * 2)) !important;
    max-width: none !important;
    min-height: 58px !important;
    margin: 7px auto !important;
    padding: 11px 14px !important;
    justify-content: space-between !important;
    border: 1px solid var(--sdes-mobile-border) !important;
    border-left: 4px solid var(--sdes-mobile-orange) !important;
    border-radius: 13px !important;
    background: #fff !important;
    color: var(--sdes-mobile-ink) !important;
    font-size: 14px !important;
    line-height: 1.35 !important;
    text-align: left !important;
  }

  .sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-section-toggle {
    position: sticky !important;
    top: 118px !important;
    z-index: 20 !important;
    border-left-color: var(--sdes-mobile-green) !important;
  }

  .sdes-mobile-disclosure > .sdes-mobile-section-toggle::after {
    flex: 0 0 24px !important;
  }
}

/* Screenshot corrections — compact mobile navigation and flush disclosure
   rows. These selectors intentionally outrank template-specific mobile rules. */
@media (max-width: 767px) {
  html body .site-header .sdes-main-menu,
  html body .site-header .sdes2-bar-inner {
    width: 100% !important;
    max-width: 100% !important;
  }

  html body .site-header .sdes-mobile-toggle,
  html body .site-header .sdes2-mobile-toggle {
    min-height: 46px !important;
    padding: 11px 14px !important;
    border: 0 !important;
    background: transparent !important;
  }

  html body .site-header .sdes-menu-list {
    width: 100% !important;
    max-height: min(58vh, 430px) !important;
    margin: 0 !important;
    padding: 4px !important;
    border: 0 !important;
    border-radius: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background: #fff !important;
    box-shadow: none !important;
  }

  html body .site-header .sdes-menu-list > li {
    width: 100% !important;
    min-height: 44px !important;
    margin: 0 !important;
    border: 0 !important;
  }

  html body .site-header .sdes-menu-list > li.sdes-has-menu {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 44px !important;
    align-items: center !important;
  }

  html body .site-header .sdes-menu-list > li.sdes-has-menu > a {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  html body .site-header .sdes-menu-list > li.sdes-has-menu > .sdes-caret {
    grid-column: 2 !important;
    grid-row: 1 !important;
    margin: 0 !important;
  }

  html body .site-header .sdes-menu-list > li.sdes-has-menu > .sdes-about-dropdown,
  html body .site-header .sdes-menu-list > li.sdes-has-menu > .sdes-industries-dropdown {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
  }

  html body .site-header .sdes-menu-list > li > a {
    min-height: 44px !important;
    padding: 10px 12px !important;
    border: 0 !important;
    border-radius: 6px !important;
    color: #1e293b !important;
    background: transparent !important;
  }

  html body .sdes2-bar {
    border: 0 !important;
    box-shadow: none !important;
  }

  html body .sdes2-bar .sdes2-pillrow,
  html[data-theme="dark"] body .sdes2-bar .sdes2-pillrow,
  body[data-theme="dark"] .sdes2-bar .sdes2-pillrow,
  body.dark-mode .sdes2-bar .sdes2-pillrow {
    display: none !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0 !important;
    width: 100% !important;
    max-height: min(58vh, 430px) !important;
    margin: 0 !important;
    padding: 4px !important;
    border: 0 !important;
    border-radius: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background: #fff !important;
    box-shadow: none !important;
  }

  html body .sdes2-bar.sdes2-bar-open .sdes2-pillrow,
  html body #sdes2Bar.sdes2-bar-open #sdes2PillRow {
    display: grid !important;
  }

  html body .sdes2-bar .sdes2-pill,
  html[data-theme="dark"] body .sdes2-bar .sdes2-pill,
  body[data-theme="dark"] .sdes2-bar .sdes2-pill,
  body.dark-mode .sdes2-bar .sdes2-pill {
    display: flex !important;
    width: 100% !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 10px 12px !important;
    align-items: center !important;
    justify-content: space-between !important;
    border: 0 !important;
    border-radius: 6px !important;
    background: transparent !important;
    color: #1e293b !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    text-align: left !important;
  }

  html body .sdes2-bar .sdes2-pill:hover,
  html body .sdes2-bar .sdes2-pill.sdes2-pill-active {
    background: #fff1e6 !important;
    color: #9f3a00 !important;
  }

  html body .sdes2-bar .sdes2-flyout,
  html body .sdes2-bar .sdes2-flyout-grid,
  html body .sdes2-bar .sdes2-flyout-grid a {
    border-top: 0 !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
  }

  html body.sdes-mobile-experience main#main-content > section,
  html body.sdes-mobile-experience main#main-content > nav,
  html body.sdes-mobile-experience main#main-content > .cp-wrap > section {
    border-top: 0 !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
  }

  html body.sdes-mobile-experience main#main-content > section.sdes-mobile-disclosure,
  html body.sdes-mobile-experience main#main-content > nav.sdes-mobile-disclosure,
  html body.sdes-mobile-experience main#main-content > .cp-wrap > section.sdes-mobile-disclosure {
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body.sdes-mobile-experience .sdes-mobile-disclosure > .sdes-mobile-section-toggle {
    width: calc(100% - (var(--sdes-mobile-gutter) * 2)) !important;
    min-height: 58px !important;
    margin: 0 auto !important;
    padding: 11px 14px !important;
    border-top: 0 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
    border-left: 4px solid var(--sdes-mobile-orange) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  html body.sdes-mobile-experience .sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-section-toggle {
    border-left-color: var(--sdes-mobile-green) !important;
  }

  html body.sdes-mobile-experience .sdes-mobile-disclosure + .sdes-mobile-disclosure {
    margin-top: 0 !important;
  }
}

/* Dark-mode reading and navigation corrections. */
@media (max-width: 767px) {
  html body .site-header .sdes-main-menu {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
  }

  html body .sdes2-bar .sdes2-bar-inner {
    width: calc(100% - (var(--sdes-mobile-gutter) * 2)) !important;
    max-width: calc(100% - (var(--sdes-mobile-gutter) * 2)) !important;
    margin-inline: auto !important;
  }

  html body .site-header .sdes-mobile-toggle,
  html body .sdes2-bar .sdes2-mobile-toggle {
    width: 100% !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 11px 0 !important;
  }

  html[data-theme="dark"] body.sdes-mobile-experience .sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content,
  body[data-theme="dark"].sdes-mobile-experience .sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content,
  body.dark-mode.sdes-mobile-experience .sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content {
    padding: 20px 14px !important;
    background: #fff !important;
    color: #27364a !important;
    color-scheme: light !important;
  }

  html[data-theme="dark"] body.sdes-mobile-experience .sdes-mobile-disclosure-content h1,
  html[data-theme="dark"] body.sdes-mobile-experience .sdes-mobile-disclosure-content h2,
  html[data-theme="dark"] body.sdes-mobile-experience .sdes-mobile-disclosure-content h3,
  html[data-theme="dark"] body.sdes-mobile-experience .sdes-mobile-disclosure-content h4,
  html[data-theme="dark"] body.sdes-mobile-experience .sdes-mobile-disclosure-content strong,
  body[data-theme="dark"].sdes-mobile-experience .sdes-mobile-disclosure-content h1,
  body[data-theme="dark"].sdes-mobile-experience .sdes-mobile-disclosure-content h2,
  body[data-theme="dark"].sdes-mobile-experience .sdes-mobile-disclosure-content h3,
  body[data-theme="dark"].sdes-mobile-experience .sdes-mobile-disclosure-content h4,
  body[data-theme="dark"].sdes-mobile-experience .sdes-mobile-disclosure-content strong,
  body.dark-mode.sdes-mobile-experience .sdes-mobile-disclosure-content h1,
  body.dark-mode.sdes-mobile-experience .sdes-mobile-disclosure-content h2,
  body.dark-mode.sdes-mobile-experience .sdes-mobile-disclosure-content h3,
  body.dark-mode.sdes-mobile-experience .sdes-mobile-disclosure-content h4,
  body.dark-mode.sdes-mobile-experience .sdes-mobile-disclosure-content strong {
    color: #10233e !important;
    opacity: 1 !important;
  }

  html[data-theme="dark"] body.sdes-mobile-experience .sdes-mobile-disclosure-content p,
  html[data-theme="dark"] body.sdes-mobile-experience .sdes-mobile-disclosure-content li,
  html[data-theme="dark"] body.sdes-mobile-experience .sdes-mobile-disclosure-content dd,
  html[data-theme="dark"] body.sdes-mobile-experience .sdes-mobile-disclosure-content span:not(.eyebrow):not(.sdes-star-meter),
  body[data-theme="dark"].sdes-mobile-experience .sdes-mobile-disclosure-content p,
  body[data-theme="dark"].sdes-mobile-experience .sdes-mobile-disclosure-content li,
  body[data-theme="dark"].sdes-mobile-experience .sdes-mobile-disclosure-content dd,
  body[data-theme="dark"].sdes-mobile-experience .sdes-mobile-disclosure-content span:not(.eyebrow):not(.sdes-star-meter),
  body.dark-mode.sdes-mobile-experience .sdes-mobile-disclosure-content p,
  body.dark-mode.sdes-mobile-experience .sdes-mobile-disclosure-content li,
  body.dark-mode.sdes-mobile-experience .sdes-mobile-disclosure-content dd,
  body.dark-mode.sdes-mobile-experience .sdes-mobile-disclosure-content span:not(.eyebrow):not(.sdes-star-meter) {
    color: #3f5068 !important;
    opacity: 1 !important;
  }

  html[data-theme="dark"] body.sdes-mobile-experience .sdes-mobile-disclosure-content article,
  html[data-theme="dark"] body.sdes-mobile-experience .sdes-mobile-disclosure-content [class*="card"],
  body[data-theme="dark"].sdes-mobile-experience .sdes-mobile-disclosure-content article,
  body[data-theme="dark"].sdes-mobile-experience .sdes-mobile-disclosure-content [class*="card"],
  body.dark-mode.sdes-mobile-experience .sdes-mobile-disclosure-content article,
  body.dark-mode.sdes-mobile-experience .sdes-mobile-disclosure-content [class*="card"] {
    background-color: #fff !important;
    color: #27364a !important;
    border-color: #dce5ef !important;
  }

  html body .sdes2-pillrow > .sdes2-flyout {
    grid-column: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: min(48vh, 360px) !important;
    margin: 0 !important;
    padding: 8px 10px 12px !important;
    overflow-y: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #f7f9fc !important;
    box-shadow: none !important;
  }

  html body .sdes2-pillrow > .sdes2-flyout:not(.sdes2-flyout-open) {
    display: none !important;
  }

  html body .sdes2-pillrow > .sdes2-flyout.sdes2-flyout-open {
    display: block !important;
  }

  html body .sdes2-pillrow > .sdes2-flyout .sdes2-flyout-head {
    color: #10233e !important;
    background: transparent !important;
  }

  html body .sdes2-pillrow > .sdes2-flyout .sdes2-flyout-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 2px !important;
  }

  html body .sdes2-pillrow > .sdes2-flyout .sdes2-flyout-grid a {
    min-height: 42px !important;
    padding: 9px 10px !important;
    color: #26364d !important;
    background: #fff !important;
    border: 0 !important;
  }

  /* Beat the legacy dark-mode rule scoped through main#main-content. */
  html[data-theme="dark"] body.sdes-mobile-experience main#main-content section.sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content h1,
  html[data-theme="dark"] body.sdes-mobile-experience main#main-content section.sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content h2,
  html[data-theme="dark"] body.sdes-mobile-experience main#main-content section.sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content h3,
  html[data-theme="dark"] body.sdes-mobile-experience main#main-content section.sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content h4,
  html[data-theme="dark"] body.sdes-mobile-experience main#main-content section.sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content h5,
  html[data-theme="dark"] body.sdes-mobile-experience main#main-content section.sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content h6,
  html[data-theme="dark"] body.sdes-mobile-experience main#main-content section.sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content strong {
    color: #10233e !important;
    opacity: 1 !important;
  }

  html[data-theme="dark"] body.sdes-mobile-experience main#main-content section.sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content p,
  html[data-theme="dark"] body.sdes-mobile-experience main#main-content section.sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content li,
  html[data-theme="dark"] body.sdes-mobile-experience main#main-content section.sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content dd,
  html[data-theme="dark"] body.sdes-mobile-experience main#main-content section.sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content span:not(.eyebrow):not(.sdes-star-meter) {
    color: #3f5068 !important;
    opacity: 1 !important;
  }

  /* Statistics stay navy in dark mode, so their copy must remain light. */
  html[data-theme="dark"] body.sdes-mobile-experience main#main-content section.sp-trust-strip.sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content .sp-stat-card {
    background: linear-gradient(135deg, #132b49, #0d1f36) !important;
    border-color: rgba(148, 193, 234, .28) !important;
  }

  html[data-theme="dark"] body.sdes-mobile-experience main#main-content section.sp-trust-strip.sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content .sp-stat-card strong {
    color: #7dd3fc !important;
  }

  html[data-theme="dark"] body.sdes-mobile-experience main#main-content section.sp-trust-strip.sdes-mobile-disclosure.is-mobile-expanded > .sdes-mobile-disclosure-content .sp-stat-card span {
    color: #d9e8f7 !important;
  }
}
