/* Neutralize iOS Safari's auto-linking of long digit strings (e.g. COA numbers) as tel: links */
  .coa-document a[href^="tel"],
  .coa-document a[href^="tel:"] {
    color: inherit !important;
    text-decoration: none !important;
    pointer-events: none !important;
    cursor: inherit !important;
    background: none !important;
  }

  .coa-document {
    /* Brand palette */
    --coa-black: #1c1025;
    --coa-dark-purple: #301639;
    --coa-purple: #6d2777;
    --coa-light-grey: #fafafa;
    --coa-white: #fefefe;

    /* Hero (dark) tokens */
    --coa-hero-bg: var(--coa-black);
    --coa-hero-text: var(--coa-white);
    --coa-hero-muted: rgba(254, 254, 254, 0.55);
    --coa-hero-accent: #b071bd; /* lightened 6D2777 for contrast on near-black */
    --coa-emphasis-bg: var(--coa-dark-purple);

    /* Body (light) tokens */
    --coa-body-bg: var(--coa-light-grey);
    --coa-body-subtle: #f2f0f4;
    --coa-card-bg: var(--coa-white);
    --coa-text: var(--coa-black);
    --coa-text-muted: #6b6b6b;
    --coa-accent: var(--coa-purple);
    --coa-border: #e8e4ec;

    /* Type inherits from Kadence theme so the COA matches the rest of the site.
  */
    --coa-mono: inherit;
    --coa-serif: inherit;
    --coa-radius: 4px;

    font-family: inherit;
    line-height: 1.5;
    color: var(--coa-text);

    margin: 0 auto;
    max-width: 100%;
  }

  .coa-document *,
  .coa-document *::before,
  .coa-document *::after {
    box-sizing: border-box;
  }

  /* ============ CONDITIONAL VISIBILITY ============
   Any element is hidden when its value is empty
   or "0". The value comes from a shortcode, so the field's
   presence drives whether the element renders. 

   Used for:
     - Hero Endotoxin stat 
     - Section 02 Endotoxin card 
     - Section 04 Test History 
*/
  .coa-document [data-coa-value=""],
  .coa-document [data-coa-value="0"] {
    display: none !important;
  }

  /* ============ HERO ============ */
  .coa-hero {
    background: var(--coa-hero-bg);
    color: var(--coa-hero-text);
    padding: 3rem 0 0;
    margin-top: -16px;
    position: relative;

    /* Full-width breakout extends only the hero edge-to-edge.
     Inner content stays centered via .coa-hero-inner max-width. */
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
  }

  .coa-hero::before {
    display: none;
  }

  .coa-hero-inner {
    max-width: 1300px;
    padding-right: 24px;
    padding-left: 24px;
    margin: 0 auto;
  }

  .coa-hero-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 2rem;
    padding-bottom: 2.5rem;
    position: relative;
    flex-wrap: wrap;
  }

  .coa-hero-main {
    min-width: 0;
    flex: 1 1 auto;
  }

  .coa-hero-status {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
  }

  .coa-breadcrumb {
    margin-bottom: 1rem;
  }

  .coa-breadcrumb ol {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
  }

  .coa-breadcrumb li {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
  }

  .coa-breadcrumb a {
    font-family: var(--coa-mono);
    font-size: 0.78rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--coa-hero-muted);
    text-decoration: none;
    transition: color 0.15s ease;
  }

  .coa-breadcrumb a:hover {
    color: var(--coa-hero-text);
  }

  .coa-breadcrumb-chevron {
    width: 1.1rem;
    height: 1.1rem;
    color: var(--coa-hero-accent);
    flex-shrink: 0;
  }

  .coa-hero-meta-row {
    margin-top: 0.75rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.5rem;
  }

  .coa-meta-item {
    display: inline-flex;
    align-items: center;
    font-family: var(--coa-mono);
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--coa-hero-muted);
  }

  .coa-meta-icon {
    width: 1.15rem;
    height: 1.15rem;
    margin-right: 0.45rem;
    color: var(--coa-hero-accent);
    flex-shrink: 0;
  }

  .coa-meta-verified {
    color: var(--coa-hero-accent);
  }

  .coa-hero-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
  }

  .coa-hero-button {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 1.1rem;
    border-radius: var(--coa-radius);
    font-family: var(--coa-mono);
    font-size: 0.72rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    transition:
      background 0.15s ease,
      border-color 0.15s ease,
      color 0.15s ease;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.04);
    color: var(--coa-hero-text);
  }

  .coa-hero-button:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.3);
  }

  .coa-hero-button-primary {
    background: var(--coa-purple);
    border-color: var(--coa-purple);
    color: var(--coa-white);
  }

  .coa-hero-button-primary:hover {
    background: var(--coa-hero-accent);
    border-color: var(--coa-hero-accent);
  }

  .coa-hero-button-icon {
    width: 1.1rem;
    height: 1.1rem;
    flex-shrink: 0;
  }

  /* Edge-to-edge divider that matches the hero's full-bleed background. */
  .coa-hero-top::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 100vw;
    height: 1px;
    transform: translateX(-50%);
    background: rgba(255, 255, 255, 0.08);
  }

  .coa-eyebrow {
    font-family: var(--coa-mono);
    font-size: 0.72rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--coa-hero-muted);
    margin: 0 0 1.5rem 0;
  }

  /* CSS-drawn diamond: a rotated square. Symmetric box centers reliably
   with the parent's flex alignment regardless of font, so we don't have
   to chase font-specific glyph offsets. The ‚óÜ unicode character inside
   the span is hidden via text-indent + overflow.

   The translateY(-0.06em) is an optical correction: flex `align-items:
   center` aligns to the line-box center, but uppercase glyphs sit in
   the upper ~70% of the line-box (cap-height < em-height). This nudge
   shifts the diamond from line-box center to cap-height center.
   The eyebrow parents lock `line-height: 1` so this offset stays
   consistent across every eyebrow location. */
  .coa-diamond {
    display: inline-block;
    width: 0.5em;
    height: 0.5em;
    background-color: currentColor;
    color: var(--coa-hero-accent);
    transform: translateY(-0.06em) rotate(45deg);
    text-indent: -9999px;
    overflow: hidden;
    flex-shrink: 0;
    line-height: 0;
  }

  /* Any eyebrow / footer meta containing a diamond uses flex so the
   diamond auto-centers vertically with the text regardless of font.
   Use display: flex (not inline-flex) so block-level eyebrows still
   span their container, preserving any full-width underline borders.

   line-height: 1 makes the line-box equal to the font's em-square,
   so the diamond's translateY optical correction stays predictable
   across every eyebrow (different font sizes, same offset). Since
   eyebrow text is uppercase (no descenders), line-height: 1 is safe. */
  .coa-eyebrow,
  .coa-section-eyebrow,
  .coa-card-eyebrow,
  .coa-product-bar-eyebrow,
  .coa-footer-meta {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    line-height: 1;
  }

  .coa-eyebrow .coa-diamond,
  .coa-section-eyebrow .coa-diamond,
  .coa-card-eyebrow .coa-diamond,
  .coa-product-bar-eyebrow .coa-diamond,
  .coa-footer-meta .coa-diamond {
    margin-right: 0;
    display: inline-flex;
    align-items: center;
  }

  .coa-dot {
    opacity: 0.75;
    margin: 0 0.4em;
  }
  .coa-title-margin {
    margin-top: 0 !important;
  }
  .coa-title {
    font-family: inherit;
    font-size: clamp(1.85rem, 5vw, 3.75rem);
    line-height: 1.04;
    letter-spacing: -0.02em;
    margin: 0 0 0.75rem 0;
    color: var(--coa-hero-text);
    word-break: break-word;
  }

  .coa-subtitle {
    font-family: var(--coa-mono);
    font-size: 0.78rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--coa-hero-muted);
    margin: 0;
  }

  .coa-hero-status {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 1rem;
  }

  .coa-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.5rem 1rem;
    border: 1px solid rgba(176, 113, 189, 0.5);
    border-radius: 9999px;
    font-family: var(--coa-mono);
    font-size: 0.68rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--coa-hero-accent);
    white-space: nowrap;
    background: rgba(109, 39, 119, 0.08);
  }

  .coa-badge-dot {
    font-size: 1.1em;
    line-height: 0;
  }

  .coa-badge-icon {
    width: 1.4em;
    height: 1.4em;
    flex-shrink: 0;
  }

  .coa-reported {
    font-family: var(--coa-mono);
    font-size: 0.72rem;
    text-align: right;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
  }

  .coa-reported-label {
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--coa-hero-muted);
  }

  .coa-reported-date {
    color: var(--coa-hero-text);
    font-size: 0.85rem;
  }

  /* Hero stats row auto-fit so the row reflows cleanly when Endotoxin is omitted */
  .coa-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr));
  }

  .coa-stat {
    padding: 1.75rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    border-right: 1px solid rgba(255, 255, 255, 0.08);
  }

  .coa-stat:last-child {
    border-right: none;
  }

  .coa-stat-label {
    font-family: var(--coa-mono);
    font-size: 0.7rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--coa-hero-muted);
    margin: 0;
  }

  .coa-stat-value {
    font-family: inherit;
    font-size: clamp(1.35rem, 3vw, 2.25rem);
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--coa-hero-text);
    margin: 0;
    line-height: 1.05;
    word-break: break-word;
  }

  .coa-stat-accent {
    color: var(--coa-hero-accent);
  }

  /* ============ PRODUCT BAR (NEW) ============ */
  .coa-product-bar {
    background: var(--coa-card-bg);
    border-bottom: 1px solid var(--coa-border);
    /* Full-width breakout matches the hero so the bar reads as a continuous band. */
    width: 100vw;
    max-width: 100vw;
  }

  .coa-product-bar-inner {
    max-width: 1300px;
    margin: 0 auto;
    display: grid;
    padding: 24px;
    grid-template-columns: auto 1fr auto;
    gap: 1.75rem;
    align-items: center;
  }

  .coa-document .coa-product-bar-image {
    width: 140px !important;
    height: 140px !important;
    min-width: 140px;
    background: var(--coa-body-subtle);
    border: 1px solid var(--coa-border);
    border-radius: var(--coa-radius);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }

  .coa-document .coa-product-bar-image img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover;
    display: block;
    margin: 0 !important;
  }

  .coa-product-bar-image:empty::after {
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    border: 1px solid var(--coa-border);
    border-radius: 50%;
  }

  .coa-product-bar-eyebrow {
    font-family: var(--coa-mono);
    font-size: 0.7rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--coa-text-muted);
    margin: 0 0 0.4rem;
  }

  .coa-product-bar-eyebrow .coa-diamond {
    color: var(--coa-accent);
  }

  .coa-product-bar-name {
    font-family: inherit;
    font-size: clamp(1.15rem, 2.2vw, 1.5rem);
    margin: 0 0 0.25rem;
    color: var(--coa-text);
    letter-spacing: -0.01em;
    line-height: 1.2;
  }

  .coa-product-bar-desc {
    font-size: 0.9rem;
    color: var(--coa-text-muted);
    margin: 0;
  }

  .coa-product-bar-cta {
    flex-shrink: 0;
  }

  /* ============ BUTTONS ============ */
  .coa-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border-radius: var(--coa-radius);
    font-family: inherit;
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-decoration: none;
    transition:
      background-color 0.18s ease,
      color 0.18s ease,
      border-color 0.18s ease;
    border: 1px solid transparent;
    cursor: pointer;
    white-space: nowrap;
    line-height: 1;
  }

  .coa-button-primary {
    background: var(--coa-purple);
    color: var(--coa-white);
    border-color: var(--coa-purple);
  }

  .coa-button-primary:hover,
  .coa-button-primary:focus {
    background: var(--coa-dark-purple);
    border-color: var(--coa-dark-purple);
    color: var(--coa-white);
    text-decoration: none;
  }

  .coa-button-ghost {
    background: transparent;
    color: var(--coa-purple);
    border-color: var(--coa-border);
  }

  .coa-button-ghost:hover,
  .coa-button-ghost:focus {
    background: var(--coa-purple);
    color: var(--coa-white);
    border-color: var(--coa-purple);
    text-decoration: none;
  }

  .coa-button-icon,
  .coa-button-arrow {
    font-size: 1em;
    line-height: 1;
  }

  .coa-document .coa-doc-actions {
    display: flex;
    gap: 0.5rem;
    margin: 1rem 0 0 !important;
    padding: 0 !important;
    flex-wrap: wrap;
  }

  .coa-document .coa-doc-actions .coa-button {
    margin: 0 !important;
    flex: 1 1 0;
    min-width: 0;
  }

  /* ============ BODY ============ */
  .coa-body {
    background: var(--coa-body-bg);
  }

  .coa-section {
    max-width: 1300px;
    margin: 0 auto 0;
    padding-left: 24px;
    padding-right: 24px;
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .coa-section-head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.4rem;
    margin-bottom: 1.5rem;
  }

  .coa-document .coa-section-eyebrow {
    font-family: var(--coa-mono);
    font-size: 0.72rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--coa-text-muted);
    margin: 0 !important;
    padding: 0 0 0 0.25rem;
    line-height: 1.2;
  }

  .coa-section-eyebrow .coa-diamond {
    color: var(--coa-accent);
  }

  .coa-document .coa-section-title {
    font-family: inherit;
    font-size: clamp(1.4rem, 3vw, 2rem);
    letter-spacing: -0.01em;
    margin: 0 !important;
    padding: 0;
    color: var(--coa-text);
    line-height: 1.1;
  }

  .coa-section-sub {
    font-family: inherit;
    font-size: 0.95rem;
    color: var(--coa-text-muted);
    margin: -0.75rem 0 1.5rem;
  }

  /* ============ DATA ROWS (Basic Info) ============ */
  .coa-data-rows {
    border: 1px solid var(--coa-border);
    border-radius: var(--coa-radius);
    overflow: hidden;
  }

  .coa-data-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .coa-data-row:nth-child(odd) {
    background: var(--coa-card-bg);
  }

  .coa-data-row:nth-child(even) {
    background: var(--coa-body-subtle);
  }

  .coa-data-cell {
    display: grid;
    grid-template-columns: minmax(140px, 30%) 1fr;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.5rem;
    border-right: 1px solid var(--coa-border);
  }

  .coa-data-cell:last-child {
    border-right: none;
  }

  .coa-data-label {
    font-family: var(--coa-mono);
    font-size: 0.72rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--coa-text-muted);
    font-weight: 400;
  }

  .coa-data-value {
    font-family: inherit;
    font-size: 0.95rem;
    color: var(--coa-text);
    font-weight: 400;
    word-break: break-word;
  }

  /* ============ RESULTS GRID ============ */
  .coa-results-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
  }

  .coa-card {
    background: var(--coa-card-bg);
    border: 1px solid var(--coa-border);
    border-radius: var(--coa-radius);
    padding: 1.5rem;
  }

  .coa-card-eyebrow {
    font-family: var(--coa-mono);
    font-size: 0.72rem;
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--coa-text-muted);
    margin: 0 0 1rem 0;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--coa-border);
  }

  .coa-card-eyebrow .coa-diamond {
    color: var(--coa-accent);
  }

  .coa-document .coa-card-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .coa-document .coa-card-list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.85rem 0;
    margin: 0 !important;
    border-bottom: 1px dashed var(--coa-border);
    gap: 1rem;
    list-style: none;
  }

  .coa-document .coa-card-list li::before,
  .coa-document .coa-card-list li::marker {
    content: none;
    display: none;
  }

  .coa-card-list li:last-child {
    border-bottom: none;
    padding-bottom: 0;
  }

  .coa-card-list li:first-child {
    padding-top: 0;
  }

  .coa-card-label {
    font-family: var(--coa-mono);
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--coa-text-muted);
  }

  .coa-card-value {
    font-family: var(--coa-mono);
    font-size: 0.92rem;
    font-weight: 400;
    color: var(--coa-text);
    text-align: right;
    font-variant-numeric: tabular-nums;
    word-break: break-word;
  }

  .coa-accent {
    color: var(--coa-accent);
    font-weight: 600;
  }

  .coa-check {
    color: var(--coa-accent);
    margin-left: 0.4rem;
    opacity: 0.55;
    font-size: 0.85em;
  }

  /* ============ ANALYTICAL DATA ============ */
  .coa-analytical-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    gap: 1rem;
    align-items: stretch;
  }

  .coa-analytical-grid > .coa-card-document {
    display: flex;
    flex-direction: column;
  }

  .coa-analytical-grid > .coa-card-document .coa-doc-image {
    flex: 1;
  }

  .coa-card-document {
    padding: 1rem;
  }

  .coa-card-document .coa-card-eyebrow {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
  }

  .coa-doc-image {
    background: var(--coa-white);
    border: 1px solid var(--coa-border);
    border-radius: var(--coa-radius);
    padding: 1rem;
    text-align: center;
    overflow: hidden;
    min-height: 280px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .coa-doc-image img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
  }

  .coa-doc-image:empty::after {
    content: "No source document attached";
    color: var(--coa-text-muted);
    font-family: var(--coa-mono);
    font-size: 0.75rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }

  .coa-analytical-meta {
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }

  .coa-card-emphasis {
    background: var(--coa-emphasis-bg);
    color: var(--coa-hero-text);
    border-color: transparent;
  }

  .coa-card-emphasis .coa-card-eyebrow {
    color: var(--coa-hero-muted);
    border-bottom-color: rgba(255, 255, 255, 0.08);
  }

  .coa-card-emphasis .coa-card-eyebrow .coa-diamond {
    color: var(--coa-hero-accent);
  }

  .coa-display-value {
    font-family: inherit;
    font-size: clamp(1.25rem, 2.5vw, 1.75rem);
    font-weight: 600;
    letter-spacing: -0.01em;
    color: inherit;
    margin: 0.25rem 0 0;
    line-height: 1.1;
    word-break: break-word;
  }

  .coa-card-prose {
    font-family: inherit;
    font-size: 0.95rem;
    line-height: 1.55;
    color: var(--coa-text);
    margin: 0;
  }

  /* ============ TEST HISTORY (NEW) ============ */
  .coa-history-rows {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }

  .coa-history-row {
    display: grid;
    grid-template-columns: 130px 1fr auto;
    gap: 1.5rem;
    align-items: center;
    padding: 1rem 1.5rem;
    background: var(--coa-card-bg);
    border: 1px solid var(--coa-border);
    border-radius: var(--coa-radius);
    text-decoration: none;
    color: inherit;
    transition:
      border-color 0.18s ease,
      background-color 0.18s ease;
  }

  .coa-history-row:hover,
  .coa-history-row:focus {
    border-color: var(--coa-purple);
    background: rgba(109, 39, 119, 0.025);
    text-decoration: none;
  }

  .coa-history-row:hover .coa-history-action,
  .coa-history-row:focus .coa-history-action {
    color: var(--coa-dark-purple);
  }

  .coa-history-current {
    background: rgba(109, 39, 119, 0.05);
    border-color: rgba(109, 39, 119, 0.3);
    border-left: 4px solid var(--coa-purple);
    padding-left: calc(1.5rem - 3px);
    cursor: default;
  }

  .coa-history-current:hover,
  .coa-history-current:focus {
    background: rgba(109, 39, 119, 0.05);
    border-color: rgba(109, 39, 119, 0.3);
  }

  .coa-history-status {
    font-family: var(--coa-mono);
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--coa-text);
    font-variant-numeric: tabular-nums;
  }

  .coa-history-status-label {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--coa-text-muted);
    text-transform: none;
    letter-spacing: 0;
    margin-left: 0.35em;
  }

  .coa-history-meta {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
  }

  .coa-history-batch {
    font-family: var(--coa-mono);
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--coa-text);
    margin: 0;
    word-break: break-word;
  }

  .coa-history-date {
    font-family: var(--coa-mono);
    font-size: 0.8rem;
    color: var(--coa-text-muted);
    margin: 0;
  }

  .coa-history-action {
    font-family: var(--coa-mono);
    font-size: 0.78rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--coa-purple);
    font-weight: 600;
    white-space: nowrap;
  }

  .coa-history-current .coa-history-action {
    color: var(--coa-purple);
    font-weight: 700;
  }

  /* ============ CERTIFICATE OF ANALYSIS CARD (Section 03) ============ */
  .coa-card-signature {
    background: var(--coa-card-bg);
  }

  .coa-document .coa-signature-summary {
    font-family: inherit;
    font-size: 0.95rem;
    line-height: 1.55;
    color: #1c1025 !important;
    margin: 0 0 1.25rem;
  }

  .coa-document .coa-signature-details {
    list-style: none !important;
    padding: 1.25rem 0 0 !important;
    margin: 0 !important;
    border-top: 1px solid var(--coa-border);
  }

  .coa-document .coa-signature-details li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.6rem 0;
    margin: 0 !important;
    gap: 1rem;
    list-style: none;
  }

  .coa-document .coa-signature-details li::before,
  .coa-document .coa-signature-details li::marker {
    content: none;
    display: none;
  }

  /* ============ FOOTER ============ */
  .coa-footer {
    max-width: 1300px;
    margin: 0 auto;
    padding-top: 2.5rem;
    padding-left: 24px;
    padding-right: 24px;
    padding-bottom: 2.5rem;
    border-top: 1px solid var(--coa-border);
  }

  .coa-footer-meta {
    font-family: var(--coa-mono);
    font-size: 0.7rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--coa-text-muted);
    margin: 0 0 1rem 0;
    word-break: break-word;
  }

  .coa-footer-meta .coa-diamond {
    color: var(--coa-accent);
  }

  .coa-footer-meta-item {
    white-space: nowrap;
  }

  .coa-footer-disclaimer {
    font-family: inherit;
    font-size: 0.85rem;
    line-height: 1.65;
    color: var(--coa-text-muted);
    margin: 0;
    max-width: 900px;
  }

  .coa-footer-disclaimer strong {
    color: var(--coa-text);
    font-weight: 700;
  }

  /* ============ RESPONSIVE ============ */
  @media (max-width: 900px) {
    .coa-analytical-grid {
      grid-template-columns: 1fr;
    }

    .coa-product-bar-inner {
      grid-template-columns: 1fr;
      grid-template-areas:
        "image"
        "info"
        "cta";
      gap: 1.25rem;
      text-align: center;
      justify-items: center;
    }

    .coa-product-bar-image {
      grid-area: image;
    }

    .coa-product-bar-info {
      grid-area: info;
    }

    /* Center the eyebrow flex contents (diamond + text) under the image. */
    .coa-product-bar-info .coa-product-bar-eyebrow {
      justify-content: center;
      width: 100%;
    }

    .coa-product-bar-cta {
      grid-area: cta;
    }

    .coa-product-bar-cta .coa-button {
      width: 100%;
    }
  }

  @media (max-width: 768px) {
    /* Stack the footer meta line on mobile so each item is on its own row
     instead of wrapping awkwardly around the middle-dot separators. */
    .coa-footer-meta {
      flex-direction: column;
      align-items: flex-start;
      gap: 0.4rem;
    }

    .coa-footer-meta .coa-dot {
      display: none;
    }

    .coa-hero {
      padding: 3.5rem 0 0;
    }

    .coa-hero-top {
      grid-template-columns: 1fr;
      gap: 1.5rem;
      padding-bottom: 1.75rem;
    }

    .coa-hero-status {
      align-items: flex-start;
    }

    .coa-reported {
      text-align: left;
    }

    /* Slightly smaller breadcrumb + tighter chevron spacing on mobile. */
    .coa-breadcrumb a {
      font-size: 0.7rem;
      letter-spacing: 0.1em;
    }

    .coa-breadcrumb ol,
    .coa-breadcrumb li {
      gap: 0.5rem;
    }

    .coa-breadcrumb-chevron {
      width: 0.95rem;
      height: 0.95rem;
    }

    /* Stack meta items vertically on mobile so each row reads cleanly. */
    .coa-hero-meta-row {
      flex-direction: column;
      align-items: flex-start;
      gap: 0.6rem;
    }

    .coa-hero-meta-row .coa-meta-item,
    .coa-hero-meta-row .coa-badge {
      width: auto;
    }

    /* Force 2-col on mobile so we can manage borders deterministically. */
    .coa-stats {
      grid-template-columns: 1fr 1fr;
      position: relative;
    }

    .coa-stat {
      padding: 1.25rem 1rem;
    }

    /* Right-column stats: no right border (no neighbor to separate from). */
    .coa-stat:nth-child(2n) {
      border-right: none;
    }

    /* Edge-to-edge horizontal divider between rows.
     Uses a 100vw pseudo so the line bleeds past the hero's inner padding
     instead of stopping at each cell's edge. */
    .coa-stats::before {
      content: "";
      position: absolute;
      top: 50%;
      left: 50%;
      width: 100vw;
      height: 1px;
      transform: translate(-50%, -50%);
      background: rgba(255, 255, 255, 0.08);
      pointer-events: none;
    }

    .coa-product-bar {
      padding: 1.25rem;
    }

    .coa-document .coa-product-bar-image {
      width: 250px !important;
      height: 250px !important;
      min-width: 250px;
    }

    .coa-body {
      padding: 2.5rem 0;
    }

    .coa-section-head {
      gap: 0.3rem;
    }

    .coa-data-row {
      grid-template-columns: 1fr;
    }

    /* Clear the desktop alternating row bg so the per-cell stripes below show through. */
    .coa-data-row:nth-child(odd),
    .coa-data-row:nth-child(even) {
      background: transparent;
    }

    .coa-data-cell {
      border-right: none;
      border-bottom: 1px solid var(--coa-border);
      padding: 0.85rem 1.25rem;
    }

    /* Per-cell zebra striping so stacked cells alternate W/G/W/G instead of W/W/G/G. */
    .coa-data-cell:nth-child(odd) {
      background: var(--coa-card-bg);
    }
    .coa-data-cell:nth-child(even) {
      background: var(--coa-body-subtle);
    }

    .coa-data-row:last-child .coa-data-cell:last-child {
      border-bottom: none;
    }

    .coa-results-grid {
      grid-template-columns: 1fr;
    }

    .coa-card {
      padding: 1.25rem;
    }

    .coa-doc-actions {
      flex-direction: column;
      padding: 0;
    }

    .coa-doc-actions .coa-button {
      width: 100%;
    }

    .coa-history-row {
      grid-template-columns: 100px 1fr auto;
      gap: 1rem;
      padding: 0.85rem 1rem;
    }

    .coa-history-current {
      padding-left: calc(1rem - 3px);
    }
  }

  @media (max-width: 480px) {
    .coa-hero {
      padding: 3rem 0 0;
    }

    /* Single column on small phones; switch from 2x2 grid to a stack. */
    .coa-stats {
      grid-template-columns: 1fr;
    }

    .coa-stats::before {
      display: none;
    }

    .coa-stat {
      padding: 24px;
      margin-left: -24px;
      margin-right: -24px;
      border-right: none;
      border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }

    .coa-stat:last-child {
      border-bottom: none;
    }

    .coa-product-bar-inner {
      grid-template-columns: 1fr;
      grid-template-areas:
        "image"
        "info"
        "cta";
      text-align: center;
      justify-items: center;
    }

    .coa-document .coa-product-bar-image {
      width: 250px !important;
      height: 250px !important;
      min-width: 250px;
    }

    .coa-body {
      padding: 2rem 0;
    }

    .coa-data-cell {
      grid-template-columns: 1fr;
      gap: 0.25rem;
      padding: 0.85rem 1rem;
    }

    .coa-card {
      padding: 1rem;
    }

    .coa-card-list li {
      flex-direction: column;
      align-items: flex-start;
      gap: 0.25rem;
    }

    .coa-card-value {
      text-align: left;
    }

    .coa-signature-details li {
      flex-direction: column;
      align-items: flex-start;
      gap: 0.25rem;
    }

    .coa-signature-details .coa-card-value {
      text-align: left;
    }

    .coa-history-row {
      grid-template-columns: 1fr;
      gap: 0.5rem;
    }

    .coa-history-current {
      padding-left: calc(1rem - 3px);
    }

    .coa-history-action {
      text-align: left;
    }
  }
  .white-bleed {
    background: var(--coa-white);
    border-bottom: 1px solid var(--coa-border);
    border-top: 1px solid var(--coa-border);
  }

  /* ============ PRINT ============ */
  @media print {
    .coa-document {
      background: var(--coa-white);
      color: var(--coa-black);
    }

    .coa-hero {
      background: var(--coa-white);
      color: var(--coa-black);
      padding: 1rem 0 0;
      border-bottom: 2px solid var(--coa-purple);
    }

    .coa-hero::before {
      display: none;
    }

    .coa-eyebrow,
    .coa-subtitle,
    .coa-stat-label,
    .coa-reported-label {
      color: var(--coa-text-muted);
    }

    .coa-title,
    .coa-stat-value,
    .coa-reported-date {
      color: var(--coa-black);
    }

    .coa-stat-accent {
      color: var(--coa-purple);
    }

    .coa-badge {
      color: var(--coa-purple);
      border-color: var(--coa-purple);
      background: transparent;
    }

    .coa-stat {
      border-right: 1px solid var(--coa-border);
    }

    .coa-product-bar,
    .coa-doc-actions {
      display: none;
    }

    .coa-body {
      background: var(--coa-white);
      padding: 2rem 0;
    }

    .coa-section {
      page-break-inside: avoid;
    }

    .coa-card {
      border: 1px solid var(--coa-border);
      page-break-inside: avoid;
    }

    .coa-card-emphasis {
      background: var(--coa-white);
      color: var(--coa-black);
      border: 2px solid var(--coa-purple);
    }

    .coa-card-emphasis .coa-card-eyebrow {
      color: var(--coa-text-muted);
      border-bottom-color: var(--coa-border);
    }

    .coa-card-emphasis .coa-card-eyebrow .coa-diamond {
      color: var(--coa-purple);
    }

    .coa-history-row {
      page-break-inside: avoid;
    }
  }