
/* source: static/css/site-ux-refinement-20260926-v1.css */
/* Site-wide detail system. First declared layer wins for important rules. */
@layer ux-refinement;
@layer ux-refinement {
  :root {
    --ux-ink: #252927;
    --ux-copy: #565c59;
    --ux-brand: #0b6f69;
    --ux-line: #dedede;
    --ux-soft: #f5f7f6;
    --ux-r-card: 20px;
    --ux-r-panel: 24px;
    --ux-r-control: 12px;
    --ux-shadow-rest: 0 1px 2px rgba(20, 32, 29, .04), 0 5px 18px rgba(20, 32, 29, .045);
    --ux-shadow-hover: 0 4px 10px rgba(20, 32, 29, .07), 0 12px 30px rgba(20, 32, 29, .095);
    --ux-header-h: 54px;
    --ux-ease: cubic-bezier(.2, .75, .25, 1);
  }

  html { scroll-padding-top: calc(var(--ux-header-h) + 20px); }
  body { -webkit-tap-highlight-color: rgba(11, 111, 105, .12); }
  body .site-unified-header { height: var(--ux-header-h) !important; min-height: var(--ux-header-h) !important; max-height: var(--ux-header-h) !important; }
  :where(main, #siteSearch, #clientCenterPanel) :where(button, input, select, textarea, a.button, a.btn-primary, a.btn-secondary, a.btn-ghost, a.btn-outline, .nav-cta) {
    transition: color 160ms var(--ux-ease), background-color 160ms var(--ux-ease), border-color 160ms var(--ux-ease), box-shadow 180ms var(--ux-ease), transform 180ms var(--ux-ease) !important;
  }

  /* A complete wordmark gives the existing mark a clear home in every template. */
  body .site-unified-header .logo {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 9px !important;
    flex-basis: 158px !important;
    width: 158px !important;
    min-width: 158px !important;
    overflow: visible !important;
  }
  body .site-unified-header .logo::after {
    content: "PCBA PARTNER" !important;
    display: block !important;
    position: static !important;
    height: auto !important;
    width: auto !important;
    transform: none !important;
    color: var(--ux-ink) !important;
    font: 650 12px/1.1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    letter-spacing: .085em !important;
    white-space: nowrap !important;
  }
  body .site-unified-header .logo .logo-icon { display: inline-flex !important; align-items: center !important; flex: 0 0 44px !important; width: 44px !important; min-width: 44px !important; height: 30px !important; }
  body .site-unified-header .logo img { flex: 0 0 auto !important; }
  @media (min-width: 1200px) {
    body > header.site-unified-header,
    body .site-unified-header #navbar,
    body .site-unified-header #navbar > .nav-container,
    body .site-unified-header #navbar .nav-links,
    body .site-unified-header #navbar .nav-links > li > a:not(.nav-cta),
    body .site-unified-header #navbar #navSearch,
    body .site-unified-header #navbar #navAiQuote { height: var(--ux-header-h) !important; min-height: var(--ux-header-h) !important; max-height: var(--ux-header-h) !important; }
    body .site-unified-header #navbar > .nav-container { max-width: 1200px !important; padding-inline: 24px !important; gap: 22px !important; }
    body .site-unified-header #navbar .nav-links { gap: clamp(11px, 1.4vw, 20px) !important; }
    body .site-unified-header #navbar .nav-links > li > a:not(.nav-cta) { line-height: var(--ux-header-h) !important; font-size: 13px !important; }
    body .site-unified-header #navbar #navSearch, body .site-unified-header #navbar #navAiQuote { width: 40px !important; }
    body .site-unified-header #navbar #appleNavPanel { top: var(--ux-header-h) !important; }
  }
  @media (max-width: 1199px) {
    body > header.site-unified-header,
    body .site-unified-header #navbar,
    body .site-unified-header #navbar > .nav-container,
    body .site-unified-header #navbar :is(#navSearch,#navAiQuote,#mobileToggle) { height: var(--ux-header-h) !important; min-height: var(--ux-header-h) !important; max-height: var(--ux-header-h) !important; }
    body .site-unified-header #navbar > .nav-container { padding-inline: 14px 6px !important; }
    body .site-unified-header #navbar .logo { flex: 0 1 158px !important; width: 158px !important; min-width: 0 !important; margin-right: auto !important; }
    body .site-unified-header #navbar :is(#navSearch,#navAiQuote,#mobileToggle) { width: 48px !important; min-width: 48px !important; flex-basis: 48px !important; }
    body .site-unified-header #navbar #navLinks { top: var(--ux-header-h) !important; height: calc(100dvh - var(--ux-header-h)) !important; max-height: calc(100dvh - var(--ux-header-h)) !important; padding-top: 14px !important; }
    body .site-unified-header #navbar #appleNavPanel { top: var(--ux-header-h) !important; max-height: calc(100dvh - var(--ux-header-h)) !important; }
    body .site-unified-header #navbar .apple-nav-back:not([hidden]) { height: var(--ux-header-h) !important; }
    body .site-unified-header #navbar #navLinks > li > a:not(.nav-cta) { min-height: 52px !important; border-radius: 12px !important; }
    body .site-unified-header #navbar #navLinks .nav-cta { min-height: 48px !important; border-radius: 999px !important; }
  }
  @media (max-width: 390px) {
    body .site-unified-header #navbar > .nav-container { padding-left: 12px !important; }
    body .site-unified-header #navbar .logo { flex-basis: 142px !important; }
    body .site-unified-header .logo::after { font-size: 11px !important; letter-spacing: .06em !important; }
    body .site-unified-header .logo img { width: 38px !important; }
  }
  body .site-unified-header #navbar :is(a,button):focus-visible,
  body #siteSearch :is(a,button,input):focus-visible,
  body #clientCenterPanel :is(a,button,input,select,textarea):focus-visible {
    outline: 3px solid rgba(11, 111, 105, .72) !important;
    outline-offset: 3px !important;
    box-shadow: 0 0 0 5px rgba(11, 111, 105, .11) !important;
    border-radius: 10px !important;
  }

  /* Quiet, consistent depth on real content surfaces. */
  :where(main) :where(.journey-card, .service-card, .industry-card, .case-card, .gallery-card, .hs-card, .vas-card, .value-card, .factory-card, .cert-card, .equip-card, .blog-card, .blog-card-content, .cap-card, .seo-link-card, .case-evidence-item, .related-card, .case-library-editorial__card, .file-card, .result-card, .export-card, .product-card, .process-step, .journey-disclosure, .spec-group, .buyer-evidence-card, .rfq-resource, .case-cta, .certification-card, .case-detail-hero > span, .detail-gallery__item, .pp-photo-card, .values-card, .industry-tile) {
    border-radius: var(--ux-r-card) !important;
    box-shadow: var(--ux-shadow-rest) !important;
    transition: box-shadow 220ms var(--ux-ease), transform 220ms var(--ux-ease), border-color 180ms var(--ux-ease) !important;
  }
  :where(main) :where(.page-hero img, .hero-image, .hero-media-frame, .case-detail-hero > span, .article-cover, .story-media, .product-hero-image, .detail-gallery__item) { border-radius: var(--ux-r-panel) !important; }
  :where(main) :where(button, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea, .choose-file, .drop-zone, .tool-tabs a) { border-radius: var(--ux-r-control) !important; }
  :where(main) :where(.btn-primary, .btn-secondary, .btn-ghost, .button, .nav-cta, .hero-btn-group > a, .case-detail-actions > a, .case-cta > a, .inline-rfq__submit) { border-radius: 999px !important; }
  :where(main) :where(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea) { min-height: 46px !important; box-shadow: inset 0 1px 2px rgba(20, 32, 29, .035) !important; }
  :where(main) textarea { min-height: 112px !important; }
  :where(main) :where(button, a.button, a.btn-primary, a.btn-secondary, a.btn-ghost, a.btn-outline, .choose-file) { min-height: 44px; }
  :where(main) :where(button, input, select, textarea, a, summary, .choose-file):focus-visible {
    outline: 3px solid rgba(11, 111, 105, .72) !important;
    outline-offset: 3px !important;
    box-shadow: 0 0 0 5px rgba(11, 111, 105, .1) !important;
  }
  :where(main) :where(input, select, textarea):is(:hover,:focus-visible) { border-color: var(--ux-brand) !important; }
  :where(main) :where(button, a.button, a.btn-primary, a.btn-secondary, a.btn-ghost, a.btn-outline, .choose-file):active { transform: scale(.985) !important; }
  :where(main) :where(input[type="checkbox"], input[type="radio"]) { accent-color: var(--ux-brand) !important; }
  :where(main) :where(button, summary, .choose-file, .tool-tabs a) { min-height: 44px !important; }
  body.case-detail-page main > .case-cta { display: flex !important; align-items: center !important; justify-content: space-between !important; flex-wrap: wrap !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; }
  :where(main) .pcba-select-button { min-height: 46px !important; border-radius: var(--ux-r-control) !important; }
  #assembly-tools :where(.examples button, .card-heading > button, .file-options > button, .pagination button) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 9px 14px !important;
    border: 1px solid rgba(37,41,39,.11) !important;
    border-radius: 999px !important;
    background: #fff !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
  }
  #assembly-tools :where(.examples button, .card-heading > button, .file-options > button, .pagination button):disabled { cursor: not-allowed !important; opacity: .48 !important; }

  @media (hover: hover) and (pointer: fine) {
    :where(main) :where(a.journey-card, a.service-card, a.industry-card, a.case-card, a.gallery-card, a.blog-card, a.seo-link-card, a.related-card, .tool-card, .case-library-card, .result-card, .file-card):hover {
      transform: translateY(-2px) !important;
      box-shadow: var(--ux-shadow-hover) !important;
    }
    :where(main) :where(button, a.button, a.btn-primary, a.btn-secondary, a.btn-ghost, a.btn-outline, .choose-file):hover { box-shadow: 0 3px 10px rgba(20,32,29,.13) !important; }
    :where(main) a:not(:is(.button,.btn-primary,.btn-secondary,.btn-ghost,.btn-outline,.nav-cta,.journey-card,.service-card,.industry-card,.case-card,.gallery-card,.blog-card,.seo-link-card,.related-card)):hover { text-underline-offset: .22em; }
    body .site-unified-header #navbar .nav-links > li > a:not(.nav-cta):hover { color: var(--ux-brand) !important; }
  }
  @media (hover: none) {
    :where(main) :where(.journey-card, .service-card, .industry-card, .case-card, .gallery-card, .blog-card, .seo-link-card, .related-card):active { box-shadow: var(--ux-shadow-hover) !important; }
  }

  /* Existing in-page indexes become calm, keyboard-friendly wayfinding. */
  main .ia-page-index {
    position: sticky !important;
    top: var(--ux-header-h) !important;
    z-index: 30 !important;
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    padding: 6px !important;
    margin-block: 20px 28px !important;
    overflow-x: auto !important;
    overscroll-behavior-inline: contain !important;
    scrollbar-width: none !important;
    border: 1px solid rgba(37,41,39,.075) !important;
    border-radius: 16px !important;
    background: rgba(255,255,255,.94) !important;
    box-shadow: 0 4px 18px rgba(20,32,29,.07) !important;
    backdrop-filter: blur(16px) saturate(1.4) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.4) !important;
  }
  main .ia-page-index::-webkit-scrollbar { display: none !important; }
  main .ia-page-index > span { flex: 0 0 auto !important; padding-inline: 12px 8px !important; font-size: 12px !important; font-weight: 650 !important; }
  main .ia-page-index > a { display: inline-flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 auto !important; min-height: 40px !important; padding: 8px 12px !important; border-radius: 11px !important; color: var(--ux-copy) !important; font-size: 13px !important; line-height: 1.25 !important; text-decoration: none !important; white-space: nowrap !important; }
  main .ia-page-index > a:hover, main .ia-page-index > a:focus-visible { background: var(--ux-soft) !important; color: var(--ux-brand) !important; }
  main :where(section[id], [id].section, article[id], h2[id]) { scroll-margin-top: calc(var(--ux-header-h) + 70px) !important; }
  main .ux-page-nav { position: relative !important; margin: 16px 0 28px !important; border: 1px solid rgba(37,41,39,.09) !important; border-radius: 18px !important; background: #fff !important; box-shadow: var(--ux-shadow-rest) !important; }
  main .ux-page-nav > summary { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 16px !important; min-height: 48px !important; padding: 10px 16px !important; border-radius: 18px !important; color: var(--ux-ink) !important; cursor: pointer !important; list-style: none !important; }
  main .ux-page-nav > summary::-webkit-details-marker { display: none !important; }
  main .ux-page-nav > summary::after { content: "+" !important; flex: 0 0 auto !important; color: var(--ux-brand) !important; font-size: 21px !important; line-height: 1 !important; }
  main .ux-page-nav[open] > summary::after { content: "−" !important; }
  main .ux-page-nav [data-ux-map-title] { font-size: 15px !important; font-weight: 650 !important; }
  main .ux-page-nav [data-ux-map-action] { margin-left: auto !important; color: var(--ux-copy) !important; font-size: 13px !important; }
  main .ux-page-nav > nav { display: grid !important; grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 4px !important; padding: 0 10px 10px !important; }
  main .ux-page-nav > nav > a { display: flex !important; align-items: center !important; min-height: 42px !important; padding: 8px 10px !important; border-radius: 10px !important; color: var(--ux-copy) !important; font-size: 13px !important; line-height: 1.35 !important; text-decoration: none !important; }
  main .ux-page-nav > nav > a:hover, main .ux-page-nav > nav > a:focus-visible { background: var(--ux-soft) !important; color: var(--ux-brand) !important; }

  /* Dialogs and expandable content feel related to the page around them. */
  body :where(dialog, [role="dialog"], .modal-content, .client-center-panel, #siteSearch, #appleNavPanel) { border-radius: 22px !important; box-shadow: 0 18px 60px rgba(18,27,24,.18) !important; }
  body dialog::backdrop { background: rgba(18,27,24,.34) !important; backdrop-filter: blur(3px) !important; }
  :where(main) details[open] > :not(summary) { animation: ux-disclose-in 170ms var(--ux-ease) both; }
  @keyframes ux-disclose-in { from { opacity: .76; transform: translateY(-3px); } to { opacity: 1; transform: none; } }
  @media (prefers-reduced-transparency: reduce) {
    body .site-unified-header #navbar, main .ia-page-index { background: #fff !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  }
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
    main :where(button, a.button, a.btn-primary, a.btn-secondary, a.btn-ghost, a.btn-outline, .choose-file):active { transform: none !important; }
  }
  @media (max-width: 600px) {
    :root { --ux-r-card: 18px; --ux-r-panel: 20px; }
    main .ia-page-index { margin: 14px 0 22px !important; border-radius: 14px !important; }
    main .ia-page-index > span { padding-inline: 8px 4px !important; }
    main .ia-page-index > a { min-height: 42px !important; padding-inline: 10px !important; font-size: 12px !important; }
    main .ux-page-nav { margin: 12px 0 22px !important; }
    main .ux-page-nav > nav { grid-template-columns: minmax(0,1fr) !important; }
    main .ux-page-nav > nav > a { min-height: 44px !important; font-size: 14px !important; }
    #assembly-tools .examples { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 8px !important; }
    #assembly-tools .examples > span { flex-basis: 100% !important; }
    body.case-detail-page main > nav.breadcrumbs { margin-top: 12px !important; }
    body.case-detail-page main > .case-cta { align-items: stretch !important; flex-direction: column !important; gap: 18px !important; }
    body.case-detail-page .case-story__body .story-rail {
      position: sticky !important;
      top: var(--ux-header-h) !important;
      z-index: 28 !important;
      display: flex !important;
      align-items: center !important;
      gap: 4px !important;
      width: calc(100% + 40px) !important;
      margin: 12px -20px 18px !important;
      padding: 6px 14px !important;
      overflow-x: auto !important;
      overscroll-behavior-inline: contain !important;
      scrollbar-width: none !important;
      border-block: 1px solid rgba(37,41,39,.08) !important;
      background: rgba(255,255,255,.96) !important;
      box-shadow: 0 3px 12px rgba(20,32,29,.055) !important;
      backdrop-filter: blur(14px) !important;
      -webkit-backdrop-filter: blur(14px) !important;
    }
    body.case-detail-page .case-story__body .story-rail::-webkit-scrollbar { display: none !important; }
    body.case-detail-page .case-story__body .story-rail > strong { position: sticky !important; left: 0 !important; flex: 0 0 auto !important; padding: 9px 8px 9px 4px !important; background: #fff !important; font-size: 12px !important; }
    body.case-detail-page .case-story__body .story-rail > a { display: inline-flex !important; align-items: center !important; flex: 0 0 auto !important; min-height: 40px !important; padding: 8px 10px !important; border-radius: 10px !important; font-size: 12px !important; white-space: nowrap !important; }
  }
  @media (forced-colors: active) {
    :where(main) :where(button, input, select, textarea, a, summary):focus-visible { outline: 2px solid Highlight !important; outline-offset: 3px !important; }
    :where(main) :where(.journey-card,.service-card,.industry-card,.case-card,.gallery-card,.blog-card,.seo-link-card,.related-card) { border: 1px solid CanvasText !important; }
  }
}


/* source: static/css/site-ux-refinement-20260926-v2.css */
/* Site-wide detail system. First declared layer wins for important rules. */
@layer ux-refinement;
@layer ux-refinement {
  :root {
    --ux-ink: #252927;
    --ux-copy: #565c59;
    --ux-brand: #0b6f69;
    --ux-line: #dedede;
    --ux-soft: #f5f7f6;
    --ux-r-card: 20px;
    --ux-r-panel: 24px;
    --ux-r-control: 12px;
    --ux-shadow-rest: 0 1px 2px rgba(20, 32, 29, .04), 0 5px 18px rgba(20, 32, 29, .045);
    --ux-shadow-hover: 0 4px 10px rgba(20, 32, 29, .07), 0 12px 30px rgba(20, 32, 29, .095);
    --ux-header-h: 54px;
    --ux-ease: cubic-bezier(.2, .75, .25, 1);
  }

  html { scroll-padding-top: calc(var(--ux-header-h) + 20px); }
  body { -webkit-tap-highlight-color: rgba(11, 111, 105, .12); }
  body .site-unified-header { height: var(--ux-header-h) !important; min-height: var(--ux-header-h) !important; max-height: var(--ux-header-h) !important; }
  :where(main, #siteSearch, #clientCenterPanel) :where(button, input, select, textarea, a.button, a.btn-primary, a.btn-secondary, a.btn-ghost, a.btn-outline, .nav-cta) {
    transition: color 160ms var(--ux-ease), background-color 160ms var(--ux-ease), border-color 160ms var(--ux-ease), box-shadow 180ms var(--ux-ease), transform 180ms var(--ux-ease) !important;
  }

  /* A complete wordmark gives the existing mark a clear home in every template. */
  body .site-unified-header .logo {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 9px !important;
    flex-basis: 158px !important;
    width: 158px !important;
    min-width: 158px !important;
    overflow: visible !important;
  }
  body .site-unified-header .logo::after {
    content: "PCBA PARTNER" !important;
    display: block !important;
    position: static !important;
    height: auto !important;
    width: auto !important;
    transform: none !important;
    color: var(--ux-ink) !important;
    font: 650 12px/1.1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    letter-spacing: .085em !important;
    white-space: nowrap !important;
  }
  body .site-unified-header .logo .logo-icon { display: inline-flex !important; align-items: center !important; flex: 0 0 44px !important; width: 44px !important; min-width: 44px !important; height: 30px !important; }
  body .site-unified-header .logo img { flex: 0 0 auto !important; }
  @media (min-width: 1200px) {
    body > header.site-unified-header,
    body .site-unified-header #navbar,
    body .site-unified-header #navbar > .nav-container,
    body .site-unified-header #navbar .nav-links,
    body .site-unified-header #navbar .nav-links > li > a:not(.nav-cta),
    body .site-unified-header #navbar #navSearch,
    body .site-unified-header #navbar #navAiQuote { height: var(--ux-header-h) !important; min-height: var(--ux-header-h) !important; max-height: var(--ux-header-h) !important; }
    body .site-unified-header #navbar > .nav-container { max-width: 1200px !important; padding-inline: 24px !important; gap: 22px !important; }
    body .site-unified-header #navbar .nav-links { gap: clamp(11px, 1.4vw, 20px) !important; }
    body .site-unified-header #navbar .nav-links > li > a:not(.nav-cta) { line-height: var(--ux-header-h) !important; font-size: 13px !important; }
    body .site-unified-header #navbar #navSearch, body .site-unified-header #navbar #navAiQuote { width: 40px !important; }
    body .site-unified-header #navbar #appleNavPanel { top: var(--ux-header-h) !important; }
  }
  @media (max-width: 1199px) {
    body > header.site-unified-header,
    body .site-unified-header #navbar,
    body .site-unified-header #navbar > .nav-container,
    body .site-unified-header #navbar :is(#navSearch,#navAiQuote,#mobileToggle) { height: var(--ux-header-h) !important; min-height: var(--ux-header-h) !important; max-height: var(--ux-header-h) !important; }
    body .site-unified-header #navbar > .nav-container { padding-inline: 14px 6px !important; }
    body .site-unified-header #navbar .logo { flex: 0 1 158px !important; width: 158px !important; min-width: 0 !important; margin-right: auto !important; }
    body .site-unified-header #navbar :is(#navSearch,#navAiQuote,#mobileToggle) { width: 48px !important; min-width: 48px !important; flex-basis: 48px !important; }
    body .site-unified-header #navbar #navLinks { top: var(--ux-header-h) !important; height: calc(100dvh - var(--ux-header-h)) !important; max-height: calc(100dvh - var(--ux-header-h)) !important; padding-top: 14px !important; }
    body .site-unified-header #navbar #appleNavPanel { top: var(--ux-header-h) !important; max-height: calc(100dvh - var(--ux-header-h)) !important; }
    body .site-unified-header #navbar .apple-nav-back:not([hidden]) { height: var(--ux-header-h) !important; }
    body .site-unified-header #navbar #navLinks > li > a:not(.nav-cta) { min-height: 52px !important; border-radius: 12px !important; }
    body .site-unified-header #navbar #navLinks .nav-cta { min-height: 48px !important; border-radius: 999px !important; }
  }
  @media (max-width: 390px) {
    body .site-unified-header #navbar > .nav-container { padding-left: 12px !important; }
    body .site-unified-header #navbar .logo { flex-basis: 142px !important; }
    body .site-unified-header .logo::after { font-size: 11px !important; letter-spacing: .06em !important; }
    body .site-unified-header .logo img { width: 38px !important; }
  }
  body .site-unified-header #navbar :is(a,button):focus-visible,
  body #siteSearch :is(a,button,input):focus-visible,
  body #clientCenterPanel :is(a,button,input,select,textarea):focus-visible {
    outline: 3px solid rgba(11, 111, 105, .72) !important;
    outline-offset: 3px !important;
    box-shadow: 0 0 0 5px rgba(11, 111, 105, .11) !important;
    border-radius: 10px !important;
  }

  /* Quiet, consistent depth on real content surfaces. */
  :where(main) :where(.journey-card, .service-card, .industry-card, .case-card, .gallery-card, .hs-card, .vas-card, .value-card, .factory-card, .cert-card, .equip-card, .blog-card, .blog-card-content, .cap-card, .seo-link-card, .case-evidence-item, .related-card, .case-library-editorial__card, .file-card, .result-card, .export-card, .product-card, .process-step, .journey-disclosure, .spec-group, .buyer-evidence-card, .rfq-resource, .case-cta, .certification-card, .case-detail-hero > span, .detail-gallery__item, .pp-photo-card, .values-card, .industry-tile) {
    border-radius: var(--ux-r-card) !important;
    box-shadow: var(--ux-shadow-rest) !important;
    transition: box-shadow 220ms var(--ux-ease), transform 220ms var(--ux-ease), border-color 180ms var(--ux-ease) !important;
  }
  :where(main) :where(.page-hero img, .hero-image, .hero-media-frame, .case-detail-hero > span, .article-cover, .story-media, .product-hero-image, .detail-gallery__item) { border-radius: var(--ux-r-panel) !important; }
  :where(main) :where(button, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea, .choose-file, .drop-zone, .tool-tabs a) { border-radius: var(--ux-r-control) !important; }
  :where(main) :where(.btn-primary, .btn-secondary, .btn-ghost, .button, .nav-cta, .hero-btn-group > a, .case-detail-actions > a, .case-cta > a, .inline-rfq__submit) { border-radius: 999px !important; }
  :where(main) :where(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea) { min-height: 46px !important; box-shadow: inset 0 1px 2px rgba(20, 32, 29, .035) !important; }
  :where(main) textarea { min-height: 112px !important; }
  :where(main) :where(button, a.button, a.btn-primary, a.btn-secondary, a.btn-ghost, a.btn-outline, .choose-file) { min-height: 44px; }
  :where(main) :where(button, input, select, textarea, a, summary, .choose-file):focus-visible {
    outline: 3px solid rgba(11, 111, 105, .72) !important;
    outline-offset: 3px !important;
    box-shadow: 0 0 0 5px rgba(11, 111, 105, .1) !important;
  }
  :where(main) :where(input, select, textarea):is(:hover,:focus-visible) { border-color: var(--ux-brand) !important; }
  :where(main) :where(button, a.button, a.btn-primary, a.btn-secondary, a.btn-ghost, a.btn-outline, .choose-file):active { transform: scale(.985) !important; }
  :where(main) :where(input[type="checkbox"], input[type="radio"]) { accent-color: var(--ux-brand) !important; }
  :where(main) :where(button, summary, .choose-file, .tool-tabs a) { min-height: 44px !important; }
  body.case-detail-page main > .case-cta { display: flex !important; align-items: center !important; justify-content: space-between !important; flex-wrap: wrap !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; }
  :where(main) .pcba-select-button { min-height: 46px !important; border-radius: var(--ux-r-control) !important; }
  #assembly-tools :where(.examples button, .card-heading > button, .file-options > button, .pagination button) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 9px 14px !important;
    border: 1px solid rgba(37,41,39,.11) !important;
    border-radius: 999px !important;
    background: #fff !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
  }
  #assembly-tools :where(.examples button, .card-heading > button, .file-options > button, .pagination button):disabled { cursor: not-allowed !important; opacity: .48 !important; }

  @media (hover: hover) and (pointer: fine) {
    :where(main) :where(a.journey-card, a.service-card, a.industry-card, a.case-card, a.gallery-card, a.blog-card, a.seo-link-card, a.related-card, .tool-card, .case-library-card, .result-card, .file-card):hover {
      transform: translateY(-2px) !important;
      box-shadow: var(--ux-shadow-hover) !important;
    }
    :where(main) :where(button, a.button, a.btn-primary, a.btn-secondary, a.btn-ghost, a.btn-outline, .choose-file):hover { box-shadow: 0 3px 10px rgba(20,32,29,.13) !important; }
    :where(main) a:not(:is(.button,.btn-primary,.btn-secondary,.btn-ghost,.btn-outline,.nav-cta,.journey-card,.service-card,.industry-card,.case-card,.gallery-card,.blog-card,.seo-link-card,.related-card)):hover { text-underline-offset: .22em; }
    body .site-unified-header #navbar .nav-links > li > a:not(.nav-cta):hover { color: var(--ux-brand) !important; }
  }
  @media (hover: none) {
    :where(main) :where(.journey-card, .service-card, .industry-card, .case-card, .gallery-card, .blog-card, .seo-link-card, .related-card):active { box-shadow: var(--ux-shadow-hover) !important; }
  }

  /* Existing in-page indexes become calm, keyboard-friendly wayfinding. */
  main .ia-page-index {
    position: sticky !important;
    top: var(--ux-header-h) !important;
    z-index: 30 !important;
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    padding: 6px !important;
    margin-block: 20px 28px !important;
    overflow-x: auto !important;
    overscroll-behavior-inline: contain !important;
    scrollbar-width: none !important;
    border: 1px solid rgba(37,41,39,.075) !important;
    border-radius: 16px !important;
    background: rgba(255,255,255,.94) !important;
    box-shadow: 0 4px 18px rgba(20,32,29,.07) !important;
    backdrop-filter: blur(16px) saturate(1.4) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.4) !important;
  }
  main .ia-page-index::-webkit-scrollbar { display: none !important; }
  main .ia-page-index > span { flex: 0 0 auto !important; padding-inline: 12px 8px !important; font-size: 12px !important; font-weight: 650 !important; }
  main .ia-page-index > a { display: inline-flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 auto !important; min-height: 40px !important; padding: 8px 12px !important; border-radius: 11px !important; color: var(--ux-copy) !important; font-size: 13px !important; line-height: 1.25 !important; text-decoration: none !important; white-space: nowrap !important; }
  main .ia-page-index > a:hover, main .ia-page-index > a:focus-visible { background: var(--ux-soft) !important; color: var(--ux-brand) !important; }
  main :where(section[id], [id].section, article[id], h2[id]) { scroll-margin-top: calc(var(--ux-header-h) + 70px) !important; }
  main .ux-page-nav { position: relative !important; margin: 16px 0 28px !important; border: 1px solid rgba(37,41,39,.09) !important; border-radius: 18px !important; background: #fff !important; box-shadow: var(--ux-shadow-rest) !important; }
  main .ux-page-nav > summary { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 16px !important; min-height: 48px !important; padding: 10px 16px !important; border-radius: 18px !important; color: var(--ux-ink) !important; cursor: pointer !important; list-style: none !important; }
  main .ux-page-nav > summary::-webkit-details-marker { display: none !important; }
  main .ux-page-nav > summary::after { content: "+" !important; flex: 0 0 auto !important; color: var(--ux-brand) !important; font-size: 21px !important; line-height: 1 !important; }
  main .ux-page-nav[open] > summary::after { content: "−" !important; }
  main .ux-page-nav [data-ux-map-title] { font-size: 15px !important; font-weight: 650 !important; }
  main .ux-page-nav [data-ux-map-action] { margin-left: auto !important; color: var(--ux-copy) !important; font-size: 13px !important; }
  main .ux-page-nav > nav { display: grid !important; grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 4px !important; padding: 0 10px 10px !important; }
  main .ux-page-nav > nav > a { display: flex !important; align-items: center !important; min-height: 42px !important; padding: 8px 10px !important; border-radius: 10px !important; color: var(--ux-copy) !important; font-size: 13px !important; line-height: 1.35 !important; text-decoration: none !important; }
  main .ux-page-nav > nav > a:hover, main .ux-page-nav > nav > a:focus-visible { background: var(--ux-soft) !important; color: var(--ux-brand) !important; }

  /* Dialogs and expandable content feel related to the page around them. */
  body :where(dialog, [role="dialog"], .modal-content, .client-center-panel, #siteSearch, #appleNavPanel) { border-radius: 22px !important; box-shadow: 0 18px 60px rgba(18,27,24,.18) !important; }
  body dialog::backdrop { background: rgba(18,27,24,.34) !important; backdrop-filter: blur(3px) !important; }
  :where(main) details[open] > :not(summary) { animation: ux-disclose-in 170ms var(--ux-ease) both; }
  @keyframes ux-disclose-in { from { opacity: .76; transform: translateY(-3px); } to { opacity: 1; transform: none; } }
  @media (prefers-reduced-transparency: reduce) {
    body .site-unified-header #navbar, main .ia-page-index { background: #fff !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  }
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
    main :where(button, a.button, a.btn-primary, a.btn-secondary, a.btn-ghost, a.btn-outline, .choose-file):active { transform: none !important; }
  }
  @media (max-width: 600px) {
    :root { --ux-r-card: 18px; --ux-r-panel: 20px; }
    main .ia-page-index { margin: 14px 0 22px !important; border-radius: 14px !important; }
    main .ia-page-index > span { padding-inline: 8px 4px !important; }
    main .ia-page-index > a { min-height: 42px !important; padding-inline: 10px !important; font-size: 12px !important; }
    main .ux-page-nav { margin: 12px 0 22px !important; }
    main .ux-page-nav > nav { grid-template-columns: minmax(0,1fr) !important; }
    main .ux-page-nav > nav > a { min-height: 44px !important; font-size: 14px !important; }
    #assembly-tools .examples { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 8px !important; }
    #assembly-tools .examples > span { flex-basis: 100% !important; }
    body.case-detail-page main > nav.breadcrumbs { margin-top: 12px !important; }
    body.case-detail-page main > .case-cta { align-items: stretch !important; flex-direction: column !important; gap: 18px !important; }
    body.case-detail-page .case-story__body .story-rail {
      position: sticky !important;
      top: var(--ux-header-h) !important;
      z-index: 28 !important;
      display: flex !important;
      align-items: center !important;
      gap: 4px !important;
      width: calc(100% + 40px) !important;
      margin: 12px -20px 18px !important;
      padding: 6px 14px !important;
      overflow-x: auto !important;
      overscroll-behavior-inline: contain !important;
      scrollbar-width: none !important;
      border-block: 1px solid rgba(37,41,39,.08) !important;
      background: rgba(255,255,255,.96) !important;
      box-shadow: 0 3px 12px rgba(20,32,29,.055) !important;
      backdrop-filter: blur(14px) !important;
      -webkit-backdrop-filter: blur(14px) !important;
    }
    body.case-detail-page .case-story__body .story-rail::-webkit-scrollbar { display: none !important; }
    body.case-detail-page .case-story__body .story-rail > strong { position: sticky !important; left: 0 !important; flex: 0 0 auto !important; padding: 9px 8px 9px 4px !important; background: #fff !important; font-size: 12px !important; }
    body.case-detail-page .case-story__body .story-rail > a { display: inline-flex !important; align-items: center !important; flex: 0 0 auto !important; min-height: 40px !important; padding: 8px 10px !important; border-radius: 10px !important; font-size: 12px !important; white-space: nowrap !important; }
  }
  @media (forced-colors: active) {
    :where(main) :where(button, input, select, textarea, a, summary):focus-visible { outline: 2px solid Highlight !important; outline-offset: 3px !important; }
    :where(main) :where(.journey-card,.service-card,.industry-card,.case-card,.gallery-card,.blog-card,.seo-link-card,.related-card) { border: 1px solid CanvasText !important; }
  }
}

@layer pcba-ds {
  html.page-tools .tool-context {
    padding-top: calc(var(--ux-header-h, 54px) + 8px) !important;
  }
  html.page-tools .tool-context__title {
    display: block !important;
    margin: 0 !important;
    color: #1d1d1f !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    letter-spacing: -.02em !important;
    position: relative !important;
    top: 8px !important;
  }
  html.page-tools .tool-context > a {
    position: relative !important;
    top: 8px !important;
  }
  @media (max-width: 700px) {
    html.page-tools .tool-context__title { font-size: 14px !important; }
  }

  /* The estimator's percentage-width inputs include their padding and border. */
  .est-wrap {
    margin-top: calc(var(--ux-header-h, 54px) + 2px) !important;
  }
  .est-wrap .est-card,
  .est-wrap .est-row,
  .est-wrap .est-f {
    min-width: 0 !important;
  }
  .est-wrap .est-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }
  .est-wrap input[type="number"],
  .est-wrap select {
    box-sizing: border-box !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  @media (max-width: 820px) {
    .est-wrap .est-res {
      position: static !important;
      inset: auto !important;
    }
  }
}

/* Follow-up audit fixes. These rules share the existing highest-priority design
   layer so the legacy header's !important rules cannot collapse the wordmark. */
@layer pcba-ds {
  @media (min-width: 1200px) {
    html:root body .site-unified-header #navbar#navbar#navbar#navbar > .nav-container {
      width: 100% !important;
      max-width: 1200px !important;
      padding-inline: 24px !important;
      gap: 14px !important;
      box-sizing: border-box !important;
    }
    html:root body .site-unified-header #navbar#navbar#navbar#navbar .logo {
      display: inline-flex !important;
      flex: 0 0 158px !important;
      width: 158px !important;
      min-width: 158px !important;
      max-width: 158px !important;
      margin: 0 !important;
    }
    html:root body .site-unified-header #navbar#navbar#navbar#navbar #navLinks {
      flex: 1 1 auto !important;
      min-width: 0 !important;
      gap: clamp(10px, 1vw, 16px) !important;
    }
  }
}


/* source: static/css/site-ux-refinement-20260926-v3.css */
/* Site-wide detail system. First declared layer wins for important rules. */
@layer ux-refinement;
@layer ux-refinement {
  :root {
    --ux-ink: #252927;
    --ux-copy: #565c59;
    --ux-brand: #0b6f69;
    --ux-line: #dedede;
    --ux-soft: #f5f7f6;
    --ux-r-card: 20px;
    --ux-r-panel: 24px;
    --ux-r-control: 12px;
    --ux-shadow-rest: 0 1px 2px rgba(20, 32, 29, .04), 0 5px 18px rgba(20, 32, 29, .045);
    --ux-shadow-hover: 0 4px 10px rgba(20, 32, 29, .07), 0 12px 30px rgba(20, 32, 29, .095);
    --ux-header-h: 54px;
    --ux-ease: cubic-bezier(.2, .75, .25, 1);
  }

  html { scroll-padding-top: calc(var(--ux-header-h) + 20px); }
  body { -webkit-tap-highlight-color: rgba(11, 111, 105, .12); }
  body .site-unified-header { height: var(--ux-header-h) !important; min-height: var(--ux-header-h) !important; max-height: var(--ux-header-h) !important; }
  :where(main, #siteSearch, #clientCenterPanel) :where(button, input, select, textarea, a.button, a.btn-primary, a.btn-secondary, a.btn-ghost, a.btn-outline, .nav-cta) {
    transition: color 160ms var(--ux-ease), background-color 160ms var(--ux-ease), border-color 160ms var(--ux-ease), box-shadow 180ms var(--ux-ease), transform 180ms var(--ux-ease) !important;
  }

  /* A complete wordmark gives the existing mark a clear home in every template. */
  body .site-unified-header .logo {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 9px !important;
    flex-basis: 158px !important;
    width: 158px !important;
    min-width: 158px !important;
    overflow: visible !important;
  }
  body .site-unified-header .logo::after {
    content: "PCBA PARTNER" !important;
    display: block !important;
    position: static !important;
    height: auto !important;
    width: auto !important;
    transform: none !important;
    color: var(--ux-ink) !important;
    font: 650 12px/1.1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    letter-spacing: .085em !important;
    white-space: nowrap !important;
  }
  body .site-unified-header .logo .logo-icon { display: inline-flex !important; align-items: center !important; flex: 0 0 44px !important; width: 44px !important; min-width: 44px !important; height: 30px !important; }
  body .site-unified-header .logo img { flex: 0 0 auto !important; }
  @media (min-width: 1200px) {
    body > header.site-unified-header,
    body .site-unified-header #navbar,
    body .site-unified-header #navbar > .nav-container,
    body .site-unified-header #navbar .nav-links,
    body .site-unified-header #navbar .nav-links > li > a:not(.nav-cta),
    body .site-unified-header #navbar #navSearch,
    body .site-unified-header #navbar #navAiQuote { height: var(--ux-header-h) !important; min-height: var(--ux-header-h) !important; max-height: var(--ux-header-h) !important; }
    body .site-unified-header #navbar > .nav-container { max-width: 1200px !important; padding-inline: 24px !important; gap: 22px !important; }
    body .site-unified-header #navbar .nav-links { gap: clamp(11px, 1.4vw, 20px) !important; }
    body .site-unified-header #navbar .nav-links > li > a:not(.nav-cta) { line-height: var(--ux-header-h) !important; font-size: 13px !important; }
    body .site-unified-header #navbar #navSearch, body .site-unified-header #navbar #navAiQuote { width: 40px !important; }
    body .site-unified-header #navbar #appleNavPanel { top: var(--ux-header-h) !important; }
  }
  @media (max-width: 1199px) {
    body > header.site-unified-header,
    body .site-unified-header #navbar,
    body .site-unified-header #navbar > .nav-container,
    body .site-unified-header #navbar :is(#navSearch,#navAiQuote,#mobileToggle) { height: var(--ux-header-h) !important; min-height: var(--ux-header-h) !important; max-height: var(--ux-header-h) !important; }
    body .site-unified-header #navbar > .nav-container { padding-inline: 14px 6px !important; }
    body .site-unified-header #navbar .logo { flex: 0 1 158px !important; width: 158px !important; min-width: 0 !important; margin-right: auto !important; }
    body .site-unified-header #navbar :is(#navSearch,#navAiQuote,#mobileToggle) { width: 48px !important; min-width: 48px !important; flex-basis: 48px !important; }
    body .site-unified-header #navbar #navLinks { top: var(--ux-header-h) !important; height: calc(100dvh - var(--ux-header-h)) !important; max-height: calc(100dvh - var(--ux-header-h)) !important; padding-top: 14px !important; }
    body .site-unified-header #navbar #appleNavPanel { top: var(--ux-header-h) !important; max-height: calc(100dvh - var(--ux-header-h)) !important; }
    body .site-unified-header #navbar .apple-nav-back:not([hidden]) { height: var(--ux-header-h) !important; }
    body .site-unified-header #navbar #navLinks > li > a:not(.nav-cta) { min-height: 52px !important; border-radius: 12px !important; }
    body .site-unified-header #navbar #navLinks .nav-cta { min-height: 48px !important; border-radius: 999px !important; }
  }
  @media (max-width: 390px) {
    body .site-unified-header #navbar > .nav-container { padding-left: 12px !important; }
    body .site-unified-header #navbar .logo { flex-basis: 142px !important; }
    body .site-unified-header .logo::after { font-size: 11px !important; letter-spacing: .06em !important; }
    body .site-unified-header .logo img { width: 38px !important; }
  }
  body .site-unified-header #navbar :is(a,button):focus-visible,
  body #siteSearch :is(a,button,input):focus-visible,
  body #clientCenterPanel :is(a,button,input,select,textarea):focus-visible {
    outline: 3px solid rgba(11, 111, 105, .72) !important;
    outline-offset: 3px !important;
    box-shadow: 0 0 0 5px rgba(11, 111, 105, .11) !important;
    border-radius: 10px !important;
  }

  /* Quiet, consistent depth on real content surfaces. */
  :where(main) :where(.journey-card, .service-card, .industry-card, .case-card, .gallery-card, .hs-card, .vas-card, .value-card, .factory-card, .cert-card, .equip-card, .blog-card, .blog-card-content, .cap-card, .seo-link-card, .case-evidence-item, .related-card, .case-library-editorial__card, .file-card, .result-card, .export-card, .product-card, .process-step, .journey-disclosure, .spec-group, .buyer-evidence-card, .rfq-resource, .case-cta, .certification-card, .case-detail-hero > span, .detail-gallery__item, .pp-photo-card, .values-card, .industry-tile) {
    border-radius: var(--ux-r-card) !important;
    box-shadow: var(--ux-shadow-rest) !important;
    transition: box-shadow 220ms var(--ux-ease), transform 220ms var(--ux-ease), border-color 180ms var(--ux-ease) !important;
  }
  :where(main) :where(.page-hero img, .hero-image, .hero-media-frame, .case-detail-hero > span, .article-cover, .story-media, .product-hero-image, .detail-gallery__item) { border-radius: var(--ux-r-panel) !important; }
  :where(main) :where(button, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea, .choose-file, .drop-zone, .tool-tabs a) { border-radius: var(--ux-r-control) !important; }
  :where(main) :where(.btn-primary, .btn-secondary, .btn-ghost, .button, .nav-cta, .hero-btn-group > a, .case-detail-actions > a, .case-cta > a, .inline-rfq__submit) { border-radius: 999px !important; }
  :where(main) :where(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea) { min-height: 46px !important; box-shadow: inset 0 1px 2px rgba(20, 32, 29, .035) !important; }
  :where(main) textarea { min-height: 112px !important; }
  :where(main) :where(button, a.button, a.btn-primary, a.btn-secondary, a.btn-ghost, a.btn-outline, .choose-file) { min-height: 44px; }
  :where(main) :where(button, input, select, textarea, a, summary, .choose-file):focus-visible {
    outline: 3px solid rgba(11, 111, 105, .72) !important;
    outline-offset: 3px !important;
    box-shadow: 0 0 0 5px rgba(11, 111, 105, .1) !important;
  }
  :where(main) :where(input, select, textarea):is(:hover,:focus-visible) { border-color: var(--ux-brand) !important; }
  :where(main) :where(button, a.button, a.btn-primary, a.btn-secondary, a.btn-ghost, a.btn-outline, .choose-file):active { transform: scale(.985) !important; }
  :where(main) :where(input[type="checkbox"], input[type="radio"]) { accent-color: var(--ux-brand) !important; }
  :where(main) :where(button, summary, .choose-file, .tool-tabs a) { min-height: 44px !important; }
  body.case-detail-page main > .case-cta { display: flex !important; align-items: center !important; justify-content: space-between !important; flex-wrap: wrap !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; }
  :where(main) .pcba-select-button { min-height: 46px !important; border-radius: var(--ux-r-control) !important; }
  #assembly-tools :where(.examples button, .card-heading > button, .file-options > button, .pagination button) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 9px 14px !important;
    border: 1px solid rgba(37,41,39,.11) !important;
    border-radius: 999px !important;
    background: #fff !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
  }
  #assembly-tools :where(.examples button, .card-heading > button, .file-options > button, .pagination button):disabled { cursor: not-allowed !important; opacity: .48 !important; }

  @media (hover: hover) and (pointer: fine) {
    :where(main) :where(a.journey-card, a.service-card, a.industry-card, a.case-card, a.gallery-card, a.blog-card, a.seo-link-card, a.related-card, .tool-card, .case-library-card, .result-card, .file-card):hover {
      transform: translateY(-2px) !important;
      box-shadow: var(--ux-shadow-hover) !important;
    }
    :where(main) :where(button, a.button, a.btn-primary, a.btn-secondary, a.btn-ghost, a.btn-outline, .choose-file):hover { box-shadow: 0 3px 10px rgba(20,32,29,.13) !important; }
    :where(main) a:not(:is(.button,.btn-primary,.btn-secondary,.btn-ghost,.btn-outline,.nav-cta,.journey-card,.service-card,.industry-card,.case-card,.gallery-card,.blog-card,.seo-link-card,.related-card)):hover { text-underline-offset: .22em; }
    body .site-unified-header #navbar .nav-links > li > a:not(.nav-cta):hover { color: var(--ux-brand) !important; }
  }
  @media (hover: none) {
    :where(main) :where(.journey-card, .service-card, .industry-card, .case-card, .gallery-card, .blog-card, .seo-link-card, .related-card):active { box-shadow: var(--ux-shadow-hover) !important; }
  }

  /* Existing in-page indexes become calm, keyboard-friendly wayfinding. */
  main .ia-page-index {
    position: sticky !important;
    top: var(--ux-header-h) !important;
    z-index: 30 !important;
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    padding: 6px !important;
    margin-block: 20px 28px !important;
    overflow-x: auto !important;
    overscroll-behavior-inline: contain !important;
    scrollbar-width: none !important;
    border: 1px solid rgba(37,41,39,.075) !important;
    border-radius: 16px !important;
    background: rgba(255,255,255,.94) !important;
    box-shadow: 0 4px 18px rgba(20,32,29,.07) !important;
    backdrop-filter: blur(16px) saturate(1.4) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.4) !important;
  }
  main .ia-page-index::-webkit-scrollbar { display: none !important; }
  main .ia-page-index > span { flex: 0 0 auto !important; padding-inline: 12px 8px !important; font-size: 12px !important; font-weight: 650 !important; }
  main .ia-page-index > a { display: inline-flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 auto !important; min-height: 40px !important; padding: 8px 12px !important; border-radius: 11px !important; color: var(--ux-copy) !important; font-size: 13px !important; line-height: 1.25 !important; text-decoration: none !important; white-space: nowrap !important; }
  main .ia-page-index > a:hover, main .ia-page-index > a:focus-visible { background: var(--ux-soft) !important; color: var(--ux-brand) !important; }
  main :where(section[id], [id].section, article[id], h2[id]) { scroll-margin-top: calc(var(--ux-header-h) + 70px) !important; }
  main .ux-page-nav { position: relative !important; margin: 16px 0 28px !important; border: 1px solid rgba(37,41,39,.09) !important; border-radius: 18px !important; background: #fff !important; box-shadow: var(--ux-shadow-rest) !important; }
  main .ux-page-nav > summary { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 16px !important; min-height: 48px !important; padding: 10px 16px !important; border-radius: 18px !important; color: var(--ux-ink) !important; cursor: pointer !important; list-style: none !important; }
  main .ux-page-nav > summary::-webkit-details-marker { display: none !important; }
  main .ux-page-nav > summary::after { content: "+" !important; flex: 0 0 auto !important; color: var(--ux-brand) !important; font-size: 21px !important; line-height: 1 !important; }
  main .ux-page-nav[open] > summary::after { content: "−" !important; }
  main .ux-page-nav [data-ux-map-title] { font-size: 15px !important; font-weight: 650 !important; }
  main .ux-page-nav [data-ux-map-action] { margin-left: auto !important; color: var(--ux-copy) !important; font-size: 13px !important; }
  main .ux-page-nav > nav { display: grid !important; grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 4px !important; padding: 0 10px 10px !important; }
  main .ux-page-nav > nav > a { display: flex !important; align-items: center !important; min-height: 42px !important; padding: 8px 10px !important; border-radius: 10px !important; color: var(--ux-copy) !important; font-size: 13px !important; line-height: 1.35 !important; text-decoration: none !important; }
  main .ux-page-nav > nav > a:hover, main .ux-page-nav > nav > a:focus-visible { background: var(--ux-soft) !important; color: var(--ux-brand) !important; }

  /* Dialogs and expandable content feel related to the page around them. */
  body :where(dialog, [role="dialog"], .modal-content, .client-center-panel, #siteSearch, #appleNavPanel) { border-radius: 22px !important; box-shadow: 0 18px 60px rgba(18,27,24,.18) !important; }
  body dialog::backdrop { background: rgba(18,27,24,.34) !important; backdrop-filter: blur(3px) !important; }
  :where(main) details[open] > :not(summary) { animation: ux-disclose-in 170ms var(--ux-ease) both; }
  @keyframes ux-disclose-in { from { opacity: .76; transform: translateY(-3px); } to { opacity: 1; transform: none; } }
  @media (prefers-reduced-transparency: reduce) {
    body .site-unified-header #navbar, main .ia-page-index { background: #fff !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  }
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
    main :where(button, a.button, a.btn-primary, a.btn-secondary, a.btn-ghost, a.btn-outline, .choose-file):active { transform: none !important; }
  }
  @media (max-width: 600px) {
    :root { --ux-r-card: 18px; --ux-r-panel: 20px; }
    main .ia-page-index { margin: 14px 0 22px !important; border-radius: 14px !important; }
    main .ia-page-index > span { padding-inline: 8px 4px !important; }
    main .ia-page-index > a { min-height: 42px !important; padding-inline: 10px !important; font-size: 12px !important; }
    main .ux-page-nav { margin: 12px 0 22px !important; }
    main .ux-page-nav > nav { grid-template-columns: minmax(0,1fr) !important; }
    main .ux-page-nav > nav > a { min-height: 44px !important; font-size: 14px !important; }
    #assembly-tools .examples { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 8px !important; }
    #assembly-tools .examples > span { flex-basis: 100% !important; }
    body.case-detail-page main > nav.breadcrumbs { margin-top: 12px !important; }
    body.case-detail-page main > .case-cta { align-items: stretch !important; flex-direction: column !important; gap: 18px !important; }
    body.case-detail-page .case-story__body .story-rail {
      position: sticky !important;
      top: var(--ux-header-h) !important;
      z-index: 28 !important;
      display: flex !important;
      align-items: center !important;
      gap: 4px !important;
      width: calc(100% + 40px) !important;
      margin: 12px -20px 18px !important;
      padding: 6px 14px !important;
      overflow-x: auto !important;
      overscroll-behavior-inline: contain !important;
      scrollbar-width: none !important;
      border-block: 1px solid rgba(37,41,39,.08) !important;
      background: rgba(255,255,255,.96) !important;
      box-shadow: 0 3px 12px rgba(20,32,29,.055) !important;
      backdrop-filter: blur(14px) !important;
      -webkit-backdrop-filter: blur(14px) !important;
    }
    body.case-detail-page .case-story__body .story-rail::-webkit-scrollbar { display: none !important; }
    body.case-detail-page .case-story__body .story-rail > strong { position: sticky !important; left: 0 !important; flex: 0 0 auto !important; padding: 9px 8px 9px 4px !important; background: #fff !important; font-size: 12px !important; }
    body.case-detail-page .case-story__body .story-rail > a { display: inline-flex !important; align-items: center !important; flex: 0 0 auto !important; min-height: 40px !important; padding: 8px 10px !important; border-radius: 10px !important; font-size: 12px !important; white-space: nowrap !important; }
  }
  @media (forced-colors: active) {
    :where(main) :where(button, input, select, textarea, a, summary):focus-visible { outline: 2px solid Highlight !important; outline-offset: 3px !important; }
    :where(main) :where(.journey-card,.service-card,.industry-card,.case-card,.gallery-card,.blog-card,.seo-link-card,.related-card) { border: 1px solid CanvasText !important; }
  }
}

@layer pcba-polish {
  html.page-tools .tool-context {
    padding-top: calc(var(--ux-header-h, 54px) + 8px) !important;
  }
  html.page-tools .tool-context__title {
    display: block !important;
    margin: 0 !important;
    color: #1d1d1f !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    letter-spacing: -.02em !important;
    position: relative !important;
    top: 8px !important;
  }
  html.page-tools .tool-context > a {
    position: relative !important;
    top: 8px !important;
  }
  @media (max-width: 700px) {
    html.page-tools .tool-context__title { font-size: 14px !important; }
  }

  /* The estimator's percentage-width inputs include their padding and border. */
  .est-wrap {
    margin-top: calc(var(--ux-header-h, 54px) + 2px) !important;
  }
  .est-wrap .est-card,
  .est-wrap .est-row,
  .est-wrap .est-f {
    min-width: 0 !important;
  }
  .est-wrap .est-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }
  .est-wrap input[type="number"],
  .est-wrap select {
    box-sizing: border-box !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  @media (max-width: 820px) {
    .est-wrap .est-res {
      position: static !important;
      inset: auto !important;
    }
  }
}

/* Follow-up audit fixes. Use the first declared design layer so older layered
   !important header rules cannot collapse the wordmark. */
@layer pcba-polish {
  @media (min-width: 1200px) {
    html:root body .site-unified-header #navbar#navbar#navbar#navbar > .nav-container {
      width: 100% !important;
      max-width: 1200px !important;
      padding-inline: 24px !important;
      gap: 14px !important;
      box-sizing: border-box !important;
    }
    html:root body .site-unified-header #navbar#navbar#navbar#navbar .logo {
      display: inline-flex !important;
      flex: 0 0 158px !important;
      width: 158px !important;
      min-width: 158px !important;
      max-width: 158px !important;
      margin: 0 !important;
    }
    html:root body .site-unified-header #navbar#navbar#navbar#navbar #navLinks {
      flex: 1 1 auto !important;
      min-width: 0 !important;
      gap: clamp(10px, 1vw, 16px) !important;
    }
  }
}

/* Case-study phone layout. Use the first declared design layer so
   older layered !important declarations cannot restore stretched image tiles. */
@layer pcba-polish {
  @media (max-width: 760px) {
    html:not(#ds):not(#ds) body.case-detail-page main .case-detail-hero > .case-detail-hero__stack {
      width: 100% !important;
      height: auto !important;
      min-height: 0 !important;
      aspect-ratio: auto !important;
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      grid-template-rows: auto !important;
      grid-auto-rows: auto !important;
      align-self: start !important;
    }
    html:not(#ds):not(#ds) body.case-detail-page main .case-detail-hero .case-detail-hero__stack > .case-detail-hero__secondary {
      width: 100% !important;
      height: auto !important;
      min-width: 0 !important;
      min-height: 0 !important;
      aspect-ratio: 1 / 1 !important;
    }
    html:not(#ds):not(#ds) body.case-detail-page main .case-detail-hero .case-detail-hero__stack > .case-detail-hero__secondary img {
      width: 100% !important;
      height: 100% !important;
      padding: 12px !important;
      box-sizing: border-box !important;
      object-fit: contain !important;
    }
    html:not(#ds):not(#ds) body.case-detail-page main .case-story__body .story-rail {
      width: min(calc(100% + 40px), 100vw) !important;
      max-width: 100vw !important;
      box-sizing: border-box !important;
    }
  }
}


/* source: static/css/site-ux-refinement-20260926-v4.css */
/* Gerber Viewer: preserve finger-sized targets for compact toolbar controls. */
@media (max-width: 760px) {
  #projectGerberViewer .rfq-gerber-toolbar button,
  #projectGerberViewer .rfq-gerber-toolbar select {
    min-width: 44px !important;
  }
}


/* source: static/css/site-ui-detail-polish-20260930-v1.css */
/* Small service-hero alignment correction. The existing layout and mobile stack stay intact. */
@layer ux-refinement {
  @media (min-width: 768px) {
    body.page-services .services-hero-actions {
      justify-content: flex-start !important;
    }
  }
}


/* source: static/css/services-content.20261002-v1.css */
/* Page-owned Services content. Shared navigation, footer and RFQ remain independently owned. */
.svc-main{--svc-ink:#252829;--svc-muted:#565d60;--svc-line:#e1e5e4;--svc-tint:#f6f7f7;--svc-accent:#14685f;background:#fff;color:var(--svc-ink);font-family:inherit;line-height:1.65;overflow-wrap:break-word}
.svc-main,.svc-main *{box-sizing:border-box}
.svc-main>.ux-page-nav{display:none!important}
.svc-wrap{width:min(1160px,calc(100% - 64px));margin-inline:auto}
.svc-main h1,.svc-main h2,.svc-main h3,.svc-main p{margin:0;color:inherit}
.svc-main h1,.svc-main h2,.svc-main h3{font-family:inherit;font-weight:650;line-height:1.18;letter-spacing:-.035em}
.svc-main h1{font-size:clamp(36px,5.1vw,64px);max-width:940px;text-wrap:balance}
.svc-main h2{font-size:clamp(27px,3vw,38px);max-width:950px;text-wrap:balance}
.svc-main h3{font-size:23px;letter-spacing:-.022em}
.svc-main p,.svc-main dd,.svc-main td,.svc-main li{font-size:16px;line-height:1.65}
.svc-hero{padding-block:94px 56px}
.svc-main .svc-kicker{font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--svc-accent);margin-bottom:20px}
.svc-main .svc-intro{max-width:760px;font-size:20px;line-height:1.55;color:var(--svc-muted);margin-top:25px}
.svc-actions{display:flex;align-items:center;flex-wrap:wrap;gap:16px;margin-block:30px 18px}
.svc-main a{color:var(--svc-accent);text-decoration:none;transition:color .15s ease,background .15s ease}
.svc-main a:hover{text-decoration:underline;text-underline-offset:4px}
.svc-main a:focus-visible,.svc-main summary:focus-visible{outline:3px solid var(--svc-accent);outline-offset:5px;border-radius:6px}
.svc-main a.svc-button{display:inline-flex;justify-content:center;align-items:center;gap:8px;min-height:48px;padding:12px 24px;border-radius:999px;background:var(--svc-ink);color:#fff!important;font-size:15px;font-weight:550;line-height:1.4;border:1px solid var(--svc-ink);text-decoration:none}
.svc-main a.svc-button:hover{background:#414748;color:#fff!important}
.svc-main a.svc-button-secondary{background:#fff;color:var(--svc-ink)!important;border-color:var(--svc-line)}
.svc-main a.svc-button-secondary:hover{background:var(--svc-tint);color:var(--svc-ink)!important}
.svc-main .svc-note{font-size:14px;color:var(--svc-muted);max-width:900px;line-height:1.6;margin-top:16px}
.svc-nav{display:flex;flex-wrap:wrap;gap:12px 28px;padding-block:22px;border-block:1px solid var(--svc-line)}
.svc-nav a{font-size:14px;min-height:32px;display:inline-flex;align-items:center;font-weight:500}
.svc-section{padding-block:70px}
.svc-heading{margin-bottom:30px}
.svc-heading>p{max-width:800px;color:var(--svc-muted);margin-top:14px}
.svc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:stretch}
.svc-grid-work{grid-template-columns:repeat(2,minmax(0,1fr))}
.svc-card{position:relative;padding:30px;border:1px solid var(--svc-line);border-radius:22px;background:#fff;box-shadow:none;display:flex;flex-direction:column;min-width:0}
.svc-card h3{margin-bottom:20px}
.svc-card dl{margin:0 0 23px}
.svc-card dt{margin:18px 0 5px;font-size:12px;font-weight:650;letter-spacing:.015em;color:var(--svc-ink)}
.svc-card dt:first-child{margin-top:0}
.svc-card dd{margin:0;color:var(--svc-muted)}
.svc-card .svc-link{margin-top:auto;display:inline-block;font-size:14px;font-weight:550;line-height:1.5;padding-top:8px}
.svc-compact-card>p{margin:0 0 20px;color:var(--svc-muted)}
.svc-main .svc-number{font-size:13px;font-weight:600;color:var(--svc-accent);margin-bottom:20px}
.svc-section-tint{background:var(--svc-tint)}
.svc-section-tint .svc-card{border-color:transparent}
.svc-records{border-collapse:collapse;width:100%;text-align:left;background:transparent;border:0;table-layout:fixed}
.svc-records th,.svc-records td{padding:19px 18px;border-bottom:1px solid #d9dedd;vertical-align:top;line-height:1.6}
.svc-records thead th{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--svc-muted);font-weight:600}
.svc-records th:first-child{width:29%;padding-left:0}
.svc-records tbody th{font-size:16px;font-weight:550}
.svc-records td{color:var(--svc-muted)}
.svc-resource-links{display:flex;flex-wrap:wrap;gap:12px 26px;margin-top:24px;align-items:center}
.svc-resource-links a{font-size:14px;line-height:1.55;font-weight:550;min-height:30px;display:inline-flex;align-items:center}
.svc-workflow{counter-reset:svc-step;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;list-style:none;padding:0;margin:0}
.svc-workflow li{counter-increment:svc-step;border-top:1px solid var(--svc-line);padding-top:20px;min-width:0}
.svc-workflow li::before{content:counter(svc-step,decimal-leading-zero);font-size:13px;font-weight:600;color:var(--svc-accent);display:block;margin-bottom:16px}
.svc-workflow h3{font-size:20px;margin-bottom:12px}
.svc-workflow p{color:var(--svc-muted)}
.svc-industry{border-block:1px solid var(--svc-line);padding-block:32px}
.svc-industry h2{font-size:24px}
.svc-industry>p{max-width:900px;margin-top:12px;color:var(--svc-muted)}
.svc-faq details{border-bottom:1px solid var(--svc-line);padding:0;background:transparent;color:var(--svc-ink)}
.svc-faq details:first-child{border-top:1px solid var(--svc-line)}
.svc-main summary{cursor:pointer;font-size:17px;line-height:1.55;font-weight:550;padding:21px 0;list-style:revert}
.svc-main summary::marker{color:var(--svc-accent);font-size:.8em}
.svc-faq details>p{padding:0 0 23px 20px;max-width:980px;color:var(--svc-muted)}
.svc-rfq{background:var(--svc-tint);padding-bottom:74px}
.svc-checklist{max-width:860px;margin-top:28px;border-top:1px solid var(--svc-line)}
.svc-checklist ul{padding-left:22px;margin:0 0 16px;color:var(--svc-muted)}
.svc-checklist li{margin-bottom:8px}
.svc-checklist>a{display:inline-block;font-size:14px;margin-bottom:12px}
.svc-email-link,.svc-nda a{font-size:14px;font-weight:500}
.svc-nda{margin-top:22px}
.svc-main [id]{scroll-margin-top:100px}
.svc-anchor-alias{position:absolute;width:1px;height:1px;pointer-events:none}
@media(max-width:900px){.svc-wrap{width:calc(100% - 48px)}.svc-hero{padding-top:70px}.svc-grid{gap:16px}.svc-card{padding:24px}.svc-workflow{grid-template-columns:repeat(2,minmax(0,1fr))}.svc-main h3{font-size:21px}}
@media(max-width:700px){.svc-wrap{width:calc(100% - 40px)}.svc-hero{padding-block:52px 36px}.svc-main h1{font-size:38px}.svc-main .svc-intro{font-size:18px;margin-top:20px}.svc-section{padding-block:48px}.svc-grid,.svc-grid-work{grid-template-columns:1fr;gap:16px}.svc-card{padding:25px;border-radius:18px}.svc-card dl{margin-bottom:19px}.svc-nav{gap:5px 21px;padding-block:14px}.svc-nav a{font-size:13px}.svc-workflow{gap:24px 18px}.svc-workflow h3{font-size:19px}.svc-records th,.svc-records td{padding:16px 10px;font-size:15px}.svc-records th:first-child{width:35%;padding-left:0}.svc-records tbody th{font-size:15px}.svc-records thead th{font-size:11px}.svc-industry h2{font-size:23px}.svc-resource-links{gap:10px 20px}.svc-main summary{font-size:16px}.svc-actions{gap:14px}.svc-faq details>p{padding-left:15px}.svc-rfq{padding-bottom:54px}}
@media(max-width:360px){.svc-wrap{width:calc(100% - 32px)}.svc-main h1{font-size:34px}.svc-main h2{font-size:26px}.svc-workflow{grid-template-columns:1fr}.svc-card{padding:22px}.svc-main a.svc-button{padding-inline:20px}.svc-records th,.svc-records td{font-size:14px}}
@media(prefers-reduced-motion:reduce){.svc-main a{transition:none}.svc-main{scroll-behavior:auto}}


/* source: static/css/site-loading.20261004-v1.css */
/* No runtime CSS framework is required. Works with compiled Tailwind utility layouts.
   Unlayered normal rules and inherited tokens supersede the older layered feedback CSS. */
.pp-feedback{--pp-accent:var(--pcba-brand,#0b6f69);--pp-success:#27814b;--pp-placeholder:#e8e6de;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--pcba-ink,#252927);box-sizing:border-box}
.pp-feedback[hidden]{display:none!important}
.pp-feedback-status{display:inline-flex;align-items:center;gap:10px;font-size:14px;line-height:1.5;vertical-align:middle}
.pp-feedback-status-label{min-width:0;overflow-wrap:anywhere}
.pp-feedback-spinner{display:inline-block!important;box-sizing:border-box!important;flex:0 0 24px!important;width:24px!important;height:24px!important;border:2px solid transparent!important;border-top-color:var(--pp-accent,#0b6f69)!important;border-right-color:var(--pp-accent,#0b6f69)!important;border-radius:50%!important;background:transparent!important;animation:pp-feedback-spin 900ms linear infinite!important}
.pp-feedback-check{display:inline-block;flex:0 0 24px;width:24px;height:24px;color:var(--pp-success,#27814b);font-size:22px;line-height:24px;text-align:center}
.pp-feedback-progress{width:100%;display:grid;gap:8px}
.pp-feedback-progress-label{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:13px;line-height:1.5}
.pp-feedback-progress-label>:first-child{min-width:0;overflow-wrap:anywhere}
.pp-feedback-progress-value{white-space:nowrap;flex:none;font-variant-numeric:tabular-nums}
.pp-feedback-track{width:100%;height:8px;border-radius:4px;overflow:hidden;background:var(--pp-placeholder,#e8e6de)}
.pp-feedback-fill{height:100%;width:0;border-radius:4px;background:var(--pp-accent,#0b6f69);transition:width 400ms ease,background-color 400ms ease}
.pp-feedback-progress.is-complete .pp-feedback-fill{background:var(--pp-success,#27814b)}
.pp-feedback-circle{width:64px;height:64px;display:inline-grid;place-items:center;position:relative;vertical-align:middle;flex-shrink:0}
.pp-feedback-circle svg{width:64px;height:64px;overflow:visible;grid-area:1/1;transform:none!important;animation:none!important}
.pp-feedback-circle circle{fill:none;stroke-width:6}
.pp-feedback-circle .pp-feedback-circle-track{stroke:var(--pp-placeholder,#e8e6de)}
.pp-feedback-circle .pp-feedback-circle-fill{stroke:var(--pp-accent,#0b6f69);stroke-linecap:round;transition:stroke-dashoffset 400ms ease,stroke 400ms ease}
.pp-feedback-circle.is-complete .pp-feedback-circle-fill{stroke:var(--pp-success,#27814b)}
.pp-feedback-circle-label{grid-area:1/1;font-size:13px;font-weight:600;line-height:1;text-align:center;font-variant-numeric:tabular-nums}
.pp-feedback-skeleton{width:100%;height:var(--pp-card-height,196px);padding:24px;border-radius:8px;overflow:hidden;background:#faf8f1;box-sizing:border-box;contain:paint}
.pp-feedback-skeleton-layout{display:grid;grid-template-columns:40px minmax(0,1fr);gap:20px;align-items:start}
.pp-feedback-placeholder{display:block;position:relative;overflow:hidden;background:var(--pp-placeholder,#e8e6de);border-radius:8px}
.pp-feedback-avatar{width:40px;height:40px;border-radius:50%;flex-shrink:0}
.pp-feedback-lines{display:grid;gap:12px;padding-top:4px;min-width:0}
.pp-feedback-line{height:12px;width:100%}
.pp-feedback-line:first-child{height:18px;width:64%;margin-bottom:10px}
.pp-feedback-line:last-child{width:82%}
.pp-feedback-shimmer::after{content:"";position:absolute;inset:0 auto 0 -60px;width:60px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent);animation:pp-feedback-shimmer 1500ms ease-in-out infinite;pointer-events:none}
.pp-feedback-button{position:relative!important;box-sizing:border-box!important}
.pp-feedback-button-content{--pp-accent:currentColor;--pp-success:currentColor;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;max-width:100%!important;min-width:0!important;color:inherit!important;margin:0!important;font:inherit!important;line-height:inherit!important}
.pp-feedback-button-content .pp-feedback-spinner{flex-basis:14px!important;width:14px!important;height:14px!important;border-width:1.5px!important;border-top-color:currentColor!important;border-right-color:currentColor!important}
.pp-feedback-button-content .pp-feedback-check{display:inline-block!important;flex-basis:14px;width:14px;height:18px;font-size:16px;line-height:18px;color:inherit!important}
.pp-feedback-button-label{display:inline-block!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;min-width:0!important;margin:0!important;color:inherit!important}
.pp-feedback-button-content .pp-feedback-spinner,.pp-feedback-button-content .pp-feedback-check{margin:0!important}
#search #submit{min-width:132px!important}
#search .searchbar-actions{flex-wrap:wrap}
#aiStatus{min-height:48px}
#status .pp-feedback-status{color:inherit!important}
.pp-feedback-page{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;background:rgba(250,248,241,.9);opacity:1;transition:opacity 400ms ease;isolation:isolate}
.pp-feedback-page.is-leaving{opacity:0;pointer-events:none}
.pp-feedback-page-content{display:grid;justify-items:center;gap:18px;max-width:calc(100vw - 32px);padding:28px;font-size:15px;text-align:center;overflow-wrap:anywhere}
.pp-feedback-sr{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
.component-search-feedback{margin:14px 0;min-height:24px}
.aiq-waiting-feedback{margin:18px 0;padding:14px 0;border-top:1px solid #e8e6de}
@keyframes pp-feedback-spin{to{transform:rotate(360deg)}}
@keyframes pp-feedback-shimmer{to{left:100%}}
@media(prefers-reduced-motion:reduce){.pp-feedback-spinner,.pp-feedback-shimmer::after{animation:none!important}.pp-feedback-fill,.pp-feedback-circle-fill,.pp-feedback-page{transition:none!important}}


/* source: static/css/site-loading-adapters.20261004-v1.css */
/* Preserve existing layouts; show feedback only for explicit application loading states. */
.pcba-async-feedback .pcba-async-spinner,
.pcba-async-spinner {
  box-sizing: border-box !important;
  border: 2px solid transparent !important;
  border-top-color: currentColor !important;
  border-right-color: currentColor !important;
  border-radius: 50% !important;
  background: transparent !important;
  animation: pcba-adapter-spin 900ms linear infinite, pcba-adapter-reveal 300ms ease 200ms both !important;
}
.pcba-async-spinner { width: 24px; height: 24px; flex: 0 0 24px; color: #252927; }
.pcba-async-feedback .pcba-async-spinner { width: 18px !important; height: 18px !important; flex-basis: 18px !important; color: inherit; }
.pcba-rfq-loading { cursor: wait; }

/* The language control exposes aria-busy only while its own locale work is in flight. */
#navigationLanguage { position: relative; }
#navigationLanguage .pcba-language-loading {
  position: absolute;
  left: 10px;
  top: calc(50% - 7px);
  width: 14px;
  height: 14px;
  visibility: hidden;
  opacity: 0;
  transition: opacity 400ms ease;
  pointer-events: none;
}
#navigationLanguage .pcba-language-loading .pp-feedback-spinner {
  width: 14px !important;
  height: 14px !important;
  flex-basis: 14px !important;
  border-width: 1.5px !important;
  --pp-accent: currentColor;
}
#navigationLanguage.pcba-language-waiting .pcba-language-loading { visibility: visible; opacity: 1; }
#navigationLanguage.pcba-language-waiting .navigation-language-icon { visibility: hidden; }

/* Fixed-size, absolutely placed ornament leaves AI button text and geometry to the application. */
#ao-review { position: relative; padding-inline: 42px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#ao-review::after {
  content: "";
  position: absolute;
  inset-inline-end: 17px;
  top: calc(50% - 8px);
  width: 16px;
  height: 16px;
  box-sizing: border-box;
  border: 1.5px solid transparent;
  border-radius: 50%;
  pointer-events: none;
  opacity: 0;
}
body.pcba-ao-busy-visible #ao-review::after {
  border-top-color: currentColor;
  border-right-color: currentColor;
  opacity: 1;
  animation: pcba-adapter-spin 900ms linear infinite;
}
#ao-output > .ao-section-head { position: relative; }
.pcba-ao-complete {
  position: absolute;
  inset-inline-end: 0;
  top: 0;
  width: 20px;
  height: 20px;
  color: #27814b;
  font-size: 18px;
  line-height: 20px;
  text-align: center;
  opacity: 0;
  transition: opacity 400ms ease;
  pointer-events: none;
}
#ao-output.pcba-ao-completed .pcba-ao-complete { opacity: 1; }
.pcba-ao-waiting {
  min-height: 32px;
  margin-top: 6px;
  visibility: hidden;
  opacity: 0;
  transition: opacity 400ms ease;
}
.pcba-ao-waiting .pp-feedback-status { font-size: 12px; color: #626269; }
body.pcba-ao-busy-visible .pcba-ao-waiting { visibility: visible; opacity: 1; }

/* The original first-review copy retains its dimensions and margins under the placeholders. */
body.pcba-ao-busy-visible #ao-empty:not([hidden]) > p,
body.pcba-ao-busy-visible #ao-empty:not([hidden]) li {
  position: relative;
  color: transparent;
  overflow: hidden;
}
body.pcba-ao-busy-visible #ao-empty:not([hidden]) > p::before,
body.pcba-ao-busy-visible #ao-empty:not([hidden]) li::before {
  content: "";
  position: absolute;
  inset: 4px 0;
  border-radius: 8px;
  background: repeating-linear-gradient(to bottom, #e8e6de 0 10px, transparent 10px 1.65em);
  pointer-events: none;
}
body.pcba-ao-busy-visible #ao-empty:not([hidden]) li:nth-child(2)::before { inset-inline-end: 14%; }
body.pcba-ao-busy-visible #ao-empty:not([hidden]) li:nth-child(3)::before { inset-inline-end: 7%; }
body.pcba-ao-busy-visible #ao-empty:not([hidden]) > p::after,
body.pcba-ao-busy-visible #ao-empty:not([hidden]) li::after,
.pcba-media-loading::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -60px;
  width: 60px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent);
  animation: pcba-adapter-shimmer 1500ms ease-in-out infinite;
  pointer-events: none;
}

/* Images already have a reserved area. Their original element, alt text and decode timing remain intact. */
.pcba-media-relative { position: relative; }
.pcba-media-loading, .pcba-media-error { background-color: #e8e6de !important; }
.pcba-media-loading { overflow: hidden; }
.pcba-media-loading::after { z-index: 1; }

@keyframes pcba-adapter-spin { to { transform: rotate(360deg); } }
@keyframes pcba-adapter-shimmer { to { left: 100%; } }
@keyframes pcba-adapter-reveal { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .pcba-async-spinner,
  body.pcba-ao-busy-visible #ao-review::after,
  body.pcba-ao-busy-visible #ao-empty > p::after,
  body.pcba-ao-busy-visible #ao-empty li::after,
  .pcba-media-loading::after { animation: none !important; }
  .pcba-async-spinner { opacity: 1 !important; }
  body.pcba-ao-busy-visible #ao-empty > p::after,
  body.pcba-ao-busy-visible #ao-empty li::after,
  .pcba-media-loading::after { display: none; }
  .pcba-ao-waiting, .pcba-ao-complete, #navigationLanguage .pcba-language-loading { transition: none !important; }
}
@media print {
  .pcba-ao-waiting, .pcba-ao-complete { display: none !important; }
  #ao-review::after, .pcba-media-loading::after { display: none !important; }
}
