@layer base{html,body{margin:0;padding:0;}body{overscroll-behavior:none;}main>:first-child{margin-top:0!important;}main>:last-child{margin-bottom:0!important;}}::-webkit-scrollbar{display:none;}

/* Mobile/tablet-only responsive layer. Desktop (>=1280px) remains unchanged. */
  .mobile-nav-toggle,
  #mobile-nav { display: none; }

  @media (max-width: 1279px) {
    html, body {
      max-width: 100%;
      overflow-x: hidden;
    }

    /* Keep the multi-row header in normal document flow on mobile/tablet so it
       can grow naturally without covering the page. */
    #site-header {
      position: sticky !important;
      top: 0;
      left: auto !important;
      right: auto !important;
      width: 100%;
    }
    main { padding-top: 0 !important; }

    #main-header-row {
      padding-left: 1rem !important;
      padding-right: 1rem !important;
      gap: .75rem !important;
    }

    #main-header-row > div:first-child {
      min-width: 0;
      flex: 1 1 auto;
    }

    #main-header-row > div:first-child img { flex: 0 0 auto; }
    #main-header-row > div:first-child > div { min-width: 0; }

    #header-actions {
      gap: .5rem !important;
      flex: 0 0 auto;
    }

    .mobile-nav-toggle {
      display: inline-flex !important;
      width: 40px;
      height: 40px;
      align-items: center;
      justify-content: center;
      border: 0;
      border-radius: .75rem;
      background: #eff4ff;
      color: #0b1c30;
      cursor: pointer;
      flex: 0 0 auto;
    }

    .mobile-nav-toggle:focus-visible {
      outline: 2px solid #006398;
      outline-offset: 2px;
    }

    #mobile-nav {
      background: rgba(255,255,255,.98);
      border-top: 1px solid #e5eeff;
      box-shadow: 0 8px 18px rgba(11,28,48,.08);
      padding: .5rem 1rem .875rem;
    }
    #mobile-nav.is-open { display: block !important; }
    #mobile-nav .mobile-nav-inner {
      max-width: 80rem;
      margin: 0 auto;
      display: grid;
      grid-template-columns: repeat(2, minmax(0,1fr));
      gap: .375rem;
    }
    #mobile-nav a {
      display: flex;
      align-items: center;
      min-height: 42px;
      padding: .625rem .75rem;
      border-radius: .625rem;
      color: #45464d;
      font: 600 14px/20px Inter, sans-serif;
      text-decoration: none;
      overflow-wrap: anywhere;
    }
    #mobile-nav a:hover,
    #mobile-nav a[aria-current="page"] {
      background: #dce9ff;
      color: #0b1c30;
    }

    #hero-section > .max-w-7xl {
      gap: 2rem !important;
    }

    #hero-section .text-display-lg {
      font-size: 38px !important;
      line-height: 46px !important;
      letter-spacing: -.02em !important;
    }

    #hero-section .w-96,
    #hero-section .w-80 {
      max-width: 82vw;
    }
  }

  @media (max-width: 767px) {
    #top-support-bar {
      padding: .5rem .75rem !important;
    }
    #top-support-bar .max-w-7xl {
      display: grid !important;
      grid-template-columns: minmax(0,1fr);
      gap: .3rem !important;
    }
    #top-support-bar .max-w-7xl > div {
      min-width: 0;
      flex-wrap: wrap;
      gap: .35rem .5rem !important;
    }

    #independent-advisory-bar {
      padding: .375rem .75rem !important;
      font-size: 10px !important;
      line-height: 14px !important;
    }

    #main-header-row {
      height: 60px !important;
      padding-left: .75rem !important;
      padding-right: .75rem !important;
    }

    #main-header-row > div:first-child {
      gap: .5rem !important;
    }
    #main-header-row > div:first-child img {
      height: 30px !important;
      max-width: 58px;
    }
    #main-header-row > div:first-child .text-headline-sm {
      font-size: 17px !important;
      line-height: 20px !important;
    }
    #main-header-row > div:first-child .text-label-sm {
      font-size: 9px !important;
      line-height: 11px !important;
      letter-spacing: .04em !important;
    }

    #consultation-btn {
      padding: .5rem .65rem !important;
      white-space: nowrap;
    }

    #mobile-nav .mobile-nav-inner {
      grid-template-columns: minmax(0,1fr);
    }

    main section[class*="px-6"] {
      padding-left: 1rem !important;
      padding-right: 1rem !important;
    }

    main section[class*="py-16"] {
      padding-top: 2.75rem !important;
      padding-bottom: 2.75rem !important;
    }

    #hero-section {
      padding-top: 2.25rem !important;
      padding-bottom: 2.75rem !important;
    }

    #hero-section .text-display-lg {
      font-size: 32px !important;
      line-height: 39px !important;
    }

    #hero-section .text-headline-lg,
    main .text-headline-lg {
      font-size: 26px !important;
      line-height: 33px !important;
    }

    #hero-section .inline-flex.w-fit {
      max-width: 100%;
      align-items: flex-start;
    }

    #hero-section > .max-w-7xl > div:last-child > div {
      padding: 1rem !important;
      gap: 1rem !important;
    }

    #hero-section .font-code-sm,
    #hero-section .text-body-sm {
      overflow-wrap: anywhere;
    }

    #support-wizard-section {
      padding-top: 2.75rem !important;
      padding-bottom: 2.75rem !important;
    }

    #support-wizard-section > div > div.bg-surface-container-lowest {
      padding: 1rem !important;
      gap: 1.5rem !important;
      border-radius: 1rem !important;
    }

    #support-wizard-section .brand-chip,
    #support-wizard-section .os-card,
    #support-wizard-section .issue-option {
      min-width: 0;
    }

    #support-wizard-section .brand-chip span,
    #support-wizard-section .os-card span,
    #support-wizard-section .issue-option span {
      overflow-wrap: anywhere;
    }

    #mobile-help-bar {
      bottom: .75rem !important;
      padding-left: .75rem !important;
      padding-right: .75rem !important;
    }
    #mobile-help-bar > div {
      gap: .75rem !important;
    }

    #site-footer {
      padding-top: 2.25rem !important;
      padding-bottom: 1.5rem !important;
    }
    #site-footer > div {
      padding-left: 1rem !important;
      padding-right: 1rem !important;
    }

    #site-footer a,
    #site-footer p,
    #site-footer span,
    main a,
    main p,
    main span {
      overflow-wrap: anywhere;
    }
  }

  @media (max-width: 639px) {
    /* Compact support bar content without removing the phone action. */
    #top-support-bar .max-w-7xl > div:first-child > span:last-child {
      display: none !important;
    }
    #top-support-bar .max-w-7xl > div:last-child > .text-outline-variant,
    #top-support-bar .max-w-7xl > div:last-child > a:last-child {
      display: none !important;
    }

    #consultation-btn {
      font-size: 0 !important;
      width: 40px;
      height: 40px;
      padding: 0 !important;
      display: inline-flex !important;
      justify-content: center;
      align-items: center;
    }
    #consultation-btn .material-symbols-outlined {
      font-size: 20px !important;
    }

    #header-actions > .relative {
      display: none !important;
    }

    #hero-section .text-display-lg {
      font-size: 30px !important;
      line-height: 36px !important;
    }

    #hero-section .text-body-lg {
      font-size: 15px !important;
      line-height: 23px !important;
    }

    #hero-section .mt-4.bg-surface-container-lowest {
      padding: .5rem !important;
    }

    #hero-section #hero-search-btn {
      width: 100%;
    }

    #support-wizard-section .grid.grid-cols-4 {
      gap: .25rem !important;
    }

    #support-wizard-section #wizard-nav-footer {
      flex-direction: column !important;
      align-items: stretch !important;
      gap: .75rem !important;
    }
    #support-wizard-section #wizard-prev-btn {
      width: 100%;
      justify-content: center;
    }
    #support-wizard-section #wizard-nav-footer > div {
      width: 100%;
      margin-left: 0 !important;
      justify-content: space-between;
      gap: .5rem !important;
    }
    #support-wizard-section #wizard-next-btn {
      flex: 1 1 auto;
      justify-content: center;
      padding-left: .9rem !important;
      padding-right: .9rem !important;
    }

    #mobile-help-bar > div {
      flex-direction: column !important;
      align-items: stretch !important;
      padding: .75rem !important;
    }
    #mobile-help-bar > div > div:first-child .truncate {
      white-space: normal !important;
      overflow: visible !important;
      text-overflow: clip !important;
    }
    #mobile-help-bar > div > div:last-child,
    #mobile-help-bar > div > div:last-child a {
      width: 100%;
    }
    #mobile-help-bar > div > div:last-child a {
      justify-content: center;
      min-height: 42px;
    }
  }

  @media (max-width: 389px) {
    #main-header-row > div:first-child img {
      display: none !important;
    }

    #hero-section .text-display-lg {
      font-size: 28px !important;
      line-height: 34px !important;
    }

    #hero-section > .max-w-7xl > div:last-child > div .grid.grid-cols-2,
    #support-wizard-section #wizard-step-1 > .grid.grid-cols-2 {
      grid-template-columns: minmax(0,1fr) !important;
    }

    #support-wizard-section .text-headline-sm {
      font-size: 18px !important;
      line-height: 25px !important;
    }

    #support-wizard-section #wizard-step-indicator {
      font-size: 10px !important;
    }
  }