/* Reserve the logo/currency slots before scripts or image decoding run. */
.site-header .logo { min-height:44px; display:flex; align-items:center }
.site-header .brand-logo-dark { height:44px !important; object-fit:contain; object-position:left }
.site-header .header-actions { min-width:182px }
.home-route .contact-band .eyebrow { color:#06130d !important }
@media(max-width:900px) {.site-header .header-actions {min-width:0}.site-header .brand-logo-dark {height:38px !important}}

/*
 * Final storefront UI system.
 *
 * This file is intentionally loaded after route-specific CSS. The product
 * detail page has several research explorers with their own presentation
 * layers; keeping the final rhythm and type rules here prevents one route
 * from silently reintroducing oversized headings or large empty bands.
 */
:root {
  --tpc-display-font:var(--tpc-font-family);
  --tpc-ui-font:var(--tpc-font-family);
  --tpc-ui-heading: clamp(2.15rem, 4vw, 3.9rem);
  --tpc-ui-section-y: clamp(3.75rem, 5.5vw, 5.75rem);
  --tpc-ui-mobile-section-y: 2.75rem;
}

body.seo-route,
body.home-route,
body.products-route {
  font-family: var(--tpc-ui-font) !important;
}

/* Route-specific CSS can still control size, weight, spacing, and layout, but
 * it cannot reintroduce an unintended type family. */
body.seo-route :where(*),
body.home-route :where(*),
body.products-route :where(*),
.product-page :where(*) {
  font-family: var(--tpc-ui-font) !important;
}

.site-header,
.site-header *{
  font-family: var(--tpc-ui-font) !important;
}
.site-header .logo b{
  font-family: var(--tpc-display-font) !important;
}

body.seo-route h1,
body.seo-route h2,
body.seo-route h3,
body.seo-route h4,
body.seo-route h5,
body.seo-route h6,
body.home-route h1,
body.home-route h2,
body.home-route h3,
body.home-route h4,
body.home-route h5,
body.home-route h6,
body.products-route h1,
body.products-route h2,
body.products-route h3,
body.products-route h4,
body.products-route h5,
body.products-route h6 {
  font-family: var(--tpc-display-font) !important;
  font-weight: 550 !important;
  letter-spacing: -0.055em !important;
}

/* The client-rendered catalogue uses a product-page modal rather than the
 * server-rendered .approved-detail shell. Keep both implementations aligned. */
.product-page h1,
.product-page h2,
.product-page h3,
.product-page h4,
.product-page h5,
.product-page h6 {
  font-family: var(--tpc-display-font) !important;
  font-weight: 550 !important;
  letter-spacing: -0.055em !important;
}

.product-page .section-shell {
  padding-block: clamp(2.75rem, 4.5vw, 4.75rem) !important;
}

.product-page .benefit-story,
.product-page .plain-language-section,
.product-page .product-overview,
.product-page .specifications-section,
.product-page .knowledge-intro,
.product-page .mechanism-section,
.product-page .applications-section,
.product-page .handling-section,
.product-page .product-faqs,
.product-page .related-section,
.product-page .potential-section,
.product-page .evidence-panel {
  margin-block: clamp(2.25rem, 4vw, 4.25rem) !important;
  padding-block: clamp(2.5rem, 4vw, 4.5rem) !important;
}

.product-page .benefit-story-copy h2,
.product-page .product-overview h2,
.product-page .specifications-heading h2,
.product-page .knowledge-heading h2,
.product-page .subsection-heading h2,
.product-page .handling-copy h2,
.product-page .potential-section h2,
.product-page .evidence-panel h2 {
  font-size: var(--tpc-ui-heading) !important;
  line-height: 0.98 !important;
}

.product-page .detail-visual {
  overflow: hidden !important;
  padding: 0 !important;
}

.product-page .detail-product-photo {
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: scale(1.08) !important;
  transform-origin: center !important;
}

/* Product detail: one predictable section rhythm for every compound. */
.seo-route .approved-detail .approved-section,
.seo-route .approved-detail .mechanism-explorer,
.seo-route .approved-detail .ix-section,
.seo-route .approved-detail .research-blueprint,
.seo-route .approved-detail .ev-explorer,
.seo-route .approved-detail .rp-explorer {
  padding-block: var(--tpc-ui-section-y) !important;
}

.seo-route .approved-detail .approved-section > .approved-head,
.seo-route .approved-detail .mechanism-explorer > .mx-heading,
.seo-route .approved-detail .ix-section > .approved-head,
.seo-route .approved-detail .research-blueprint > header,
.seo-route .approved-detail .ev-explorer > .approved-head,
.seo-route .approved-detail .rp-explorer > .approved-head {
  margin-bottom: clamp(1.75rem, 3vw, 2.75rem) !important;
}

.seo-route .approved-detail .approved-head,
.seo-route .approved-detail .mx-heading {
  gap: clamp(1.5rem, 5vw, 5rem) !important;
}

.seo-route .approved-detail .approved-head h2,
.seo-route .approved-detail .mx-heading h2,
.seo-route .approved-detail .ix-section .approved-head h2,
.seo-route .approved-detail .research-blueprint > header h2,
.seo-route .approved-detail .ev-explorer > .approved-head h2,
.seo-route .approved-detail .rp-explorer > .approved-head h2 {
  font-family: var(--tpc-display-font) !important;
  font-size: var(--tpc-ui-heading) !important;
  font-weight: 550 !important;
  line-height: 0.98 !important;
  letter-spacing: -0.055em !important;
}

.seo-route .approved-detail .approved-head p,
.seo-route .approved-detail .mx-heading > div > p:last-child,
.seo-route .approved-detail .research-blueprint > header p,
.seo-route .approved-detail .ev-explorer > .approved-head p,
.seo-route .approved-detail .rp-explorer > .approved-head p {
  line-height: 1.6 !important;
}

.seo-route .approved-detail .approved-pair article,
.seo-route .approved-detail .approved-mechanisms article,
.seo-route .approved-detail .approved-timeline article,
.seo-route .approved-detail .approved-polls article {
  padding-block: clamp(1.25rem, 2.5vw, 2.5rem) !important;
}

.seo-route .approved-detail .approved-pair h3,
.seo-route .approved-detail .approved-mechanisms h3,
.seo-route .approved-detail .approved-timeline h3,
.seo-route .approved-detail .approved-polls h3,
.seo-route .approved-detail .mx-card h3,
.seo-route .approved-detail .rp-card h3,
.seo-route .approved-detail .ev-explorer .evidence-theme h3 {
  font-family: var(--tpc-display-font) !important;
  font-weight: 550 !important;
}

.seo-route .approved-detail .mx-card-top > b,
.seo-route .approved-detail .mx-card h3 {
  font-family: var(--tpc-display-font) !important;
}

.seo-route .approved-detail .approved-after-evidence,
.seo-route .approved-detail .approved-legacy {
  padding-top: clamp(2.5rem, 4vw, 4.5rem) !important;
  margin-top: clamp(2.5rem, 4vw, 4.5rem) !important;
}

/* Make the square product artwork use the available card width without
 * cropping the actual vial or carton. */
.seo-route .approved-detail .approved-hero-art,
.seo-route .seo-dedicated-product .detail-visual {
  overflow: hidden !important;
  padding: 0 !important;
}

.seo-route .approved-detail .approved-hero-art img,
.seo-route .seo-dedicated-product .detail-product-photo {
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: scale(1.08) !important;
  transform-origin: center !important;
}

/* The home page and editorial pages use the same compact section cadence. */
.home-route .section-shell,
.home-route .homepage-data-section {
  padding-block: clamp(3.5rem, 5vw, 5.5rem) !important;
}

.home-route .section-heading,
.home-route .homepage-data-section > h2,
.home-route .quality,
.home-route .about,
.home-route .contact-band {
  margin-bottom: clamp(1.5rem, 3vw, 2.75rem) !important;
}

.home-route .section-heading h2,
.home-route .homepage-data-section > h2,
.home-route .quality h2,
.home-route .about h2,
.home-route .contact-band h2 {
  font-size: var(--tpc-ui-heading) !important;
  line-height: 0.98 !important;
}

.seo-route .seo-article {
  padding-block: clamp(2rem, 4vw, 4.75rem) clamp(4rem, 6vw, 6.5rem) !important;
}

.seo-route .seo-article-hero {
  padding-block: clamp(3.5rem, 7vw, 7rem) !important;
}

.seo-route .seo-article-hero h1,
.seo-route .research-calculator-head h1,
.seo-route .concern-shell h1,
.seo-route .seo-not-found h1 {
  font-size: clamp(2.75rem, 5.5vw, 5.75rem) !important;
  line-height: 0.94 !important;
}

.seo-route .seo-article-body section {
  padding: clamp(1.5rem, 2.5vw, 2.5rem) !important;
}

.seo-route .seo-article-body section h2,
.seo-route .seo-article-links h2,
.seo-route .research-calculator-form h2,
.seo-route .research-calculator-results h2,
.seo-route .concern-group h2 {
  font-size: clamp(1.45rem, 2.4vw, 2.25rem) !important;
  line-height: 1.02 !important;
}

.seo-route .concern-shell {
  padding-block: clamp(2.75rem, 5vw, 5rem) clamp(4rem, 6vw, 6rem) !important;
}

@media (max-width: 850px) {
  .seo-route .approved-detail .approved-section,
  .seo-route .approved-detail .mechanism-explorer,
  .seo-route .approved-detail .ix-section,
  .seo-route .approved-detail .research-blueprint,
  .seo-route .approved-detail .ev-explorer,
  .seo-route .approved-detail .rp-explorer {
    padding-block: var(--tpc-ui-mobile-section-y) !important;
  }

  .seo-route .approved-detail .approved-head,
  .seo-route .approved-detail .mx-heading {
    gap: 0.9rem !important;
  }

  .seo-route .approved-detail .approved-head h2,
  .seo-route .approved-detail .mx-heading h2,
  .seo-route .approved-detail .ix-section .approved-head h2,
  .seo-route .approved-detail .research-blueprint > header h2,
  .seo-route .approved-detail .ev-explorer > .approved-head h2,
  .seo-route .approved-detail .rp-explorer > .approved-head h2 {
    font-size: clamp(1.95rem, 8.5vw, 2.8rem) !important;
    line-height: 1 !important;
  }

  .seo-route .approved-detail .approved-hero-art img,
  .seo-route .seo-dedicated-product .detail-product-photo {
    height: auto !important;
    max-height: none !important;
    transform: scale(1.06) !important;
  }

  .product-page .detail-product-photo {
    height: auto !important;
    max-height: none !important;
    transform: scale(1.06) !important;
  }

  .product-page .benefit-story,
  .product-page .plain-language-section,
  .product-page .product-overview,
  .product-page .specifications-section,
  .product-page .knowledge-intro,
  .product-page .mechanism-section,
  .product-page .applications-section,
  .product-page .handling-section,
  .product-page .product-faqs,
  .product-page .related-section,
  .product-page .potential-section,
  .product-page .evidence-panel {
    margin-block: 2rem !important;
    padding-block: 2.75rem !important;
  }

  .product-page .benefit-story-copy h2,
  .product-page .product-overview h2,
  .product-page .specifications-heading h2,
  .product-page .knowledge-heading h2,
  .product-page .subsection-heading h2,
  .product-page .handling-copy h2,
  .product-page .potential-section h2,
  .product-page .evidence-panel h2 {
    font-size: clamp(1.95rem, 8.5vw, 2.8rem) !important;
  }

  .home-route .section-shell,
  .home-route .homepage-data-section {
    padding-block: 3rem !important;
  }

  .home-route .section-heading h2,
  .home-route .homepage-data-section > h2,
  .home-route .quality h2,
  .home-route .about h2,
  .home-route .contact-band h2 {
    font-size: clamp(1.95rem, 8.5vw, 2.8rem) !important;
  }

  .seo-route .seo-article {
    padding-block: 1.75rem 4.5rem !important;
  }

  .seo-route .seo-article-hero {
    padding-block: 3.25rem !important;
  }

  .seo-route .seo-article-hero h1,
  .seo-route .research-calculator-head h1,
  .seo-route .concern-shell h1,
  .seo-route .seo-not-found h1 {
    font-size: clamp(2.35rem, 12vw, 3.7rem) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .seo-route .approved-detail .approved-hero-art img,
  .seo-route .seo-dedicated-product .detail-product-photo {
    transform: none !important;
  }

  .product-page .detail-product-photo {
    transform: none !important;
  }
}

/* Final storefront type lock: catalogue/home titles use the brand display
 * family even when route-specific bundles add a later heading declaration. */
body.home-route .catalogue-title h1,
body.home-route .catalogue-title h2,
body.home-route .section-heading h2,
body.home-route .homepage-data-section > h2,
body.products-route .catalogue-title h1,
body.products-route .catalogue-title h2,
body.products-route .section-heading h2,
body.products-route .product-card h3,
body.products-route .product-card h2,
body.seo-route .seo-page > header h1,
body.seo-route .seo-article h1,
body.seo-route .seo-article h2,
body.seo-route .seo-article h3,
.site-header .logo b{
  font-family: var(--tpc-display-font) !important;
}

/* The footer wordmark is a responsive three-part lockup rather than one
 * oversized unbroken line{
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: center !important;
  gap: clamp(.3rem, 1.1vw, 1.4rem) !important;
  align-items: baseline !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin-inline: 0 !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  font-size: clamp(3rem, 8vw, 8rem) !important;
  line-height: .88 !important;
  letter-spacing: -.085em !important;
  word-spacing: 0 !important;
}
/* Reconstitution uses the same left-aligned editorial heading rhythm as the
 * other public pages; its explanatory copy follows the title below it. */
.seo-route .research-calculator-head {
  display: block !important;
  max-width: 1180px !important;
  margin-inline: auto !important;
}
.seo-route .research-calculator-head .eyebrow {
  margin: 0 0 18px !important;
}
.seo-route .research-calculator-head h1 {
  max-width: 900px !important;
  margin: 0 0 22px !important;
  font-family: var(--tpc-display-font) !important;
  font-size: var(--tpc-ui-heading) !important;
  font-weight: 550 !important;
  line-height: .98 !important;
  letter-spacing: -.055em !important;
}
.seo-route .research-calculator-head > p:last-child {
  max-width: 680px !important;
  margin: 0 !important;
}

/* The Vite/RSC storefront does not add the legacy route classes to <body>.
 * These structural hooks keep the public headings on the brand type system
 * on both shells, including after client-side hydration. */
.catalogue-title h1,
.catalogue-title h2,
.section-heading h2,
.homepage-data-section > h2,
.hero-campaign h1,
.hero-campaign-v2 h1,
.hero-mobile-copy h1,
.research-calculator-head h1,
.seo-page > header h1,
.seo-article h1,
.seo-article h2,
.seo-article h3,
.product-card h3,
.product-card h2 {
  font-family: var(--tpc-display-font) !important;
  font-weight: 550 !important;
  letter-spacing: -.055em !important;
}

.product-card h2 {
  margin: 0 0 12px;
  font-size: 23px;
}

/* Keep the calculator title in the same compact hierarchy as the other page
 * headings even when its route is rendered by the client shell. */
.research-calculator-head h1 {
  font-size: var(--tpc-ui-heading) !important;
  line-height: .98 !important;
  max-width: 900px !important;
}

/* Public informational pages keep a semantic H1, but its visual scale is the
 * same compact level used by the site's section H2 headings. */
body.seo-route .concern-shell h1,
body.seo-route .seo-article-hero h1,
body.seo-route .seo-not-found h1 {
  font-size: var(--tpc-ui-heading) !important;
  line-height: .98 !important;
  letter-spacing: -.055em !important;
}

/* Large-screen layout guardrails. Keep the catalogue on a readable rail so
 * four cards do not become panoramic, and give the approved detail hero a
 * real layout height so its artwork cannot overlap the following sections. */
@media (min-width: 1200px) {
  .catalogue-grid {
    width: min(100%, 1640px) !important;
    max-width: 1640px !important;
    margin-inline: auto !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: clamp(18px, 1.35vw, 26px) !important;
  }
}

@media (min-width: 901px) {
  .approved-detail > .approved-hero {
    min-height: clamp(620px, 64vw, 900px) !important;
    height: auto !important;
    max-height: none !important;
  }

  .approved-detail > .approved-hero-art,
  .approved-detail > .approved-hero-copy,
  .approved-detail > .approved-section {
    position: relative;
  }

  .approved-detail > .approved-section {
    clear: both;
    z-index: 1;
  }
}
/* Private documentation enquiries: keep the action reachable on small screens. */
.procurement-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:18px 0}
.procurement-actions .secondary-button{min-height:44px;white-space:normal;line-height:1.4;text-align:center;padding:12px 16px}
.procurement-actions>a:focus-visible{outline:2px solid var(--accent,var(--tpc-accent));outline-offset:4px}
.procurement-actions>small{flex-basis:100%;color:var(--muted,#96a6ad);line-height:1.6;font-size:12px}
.home-route #science.homepage-data-section .ra-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.home-route #science.homepage-data-section .ra-card{min-height:0}
.home-route .homepage-chart-section .ra-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px!important;background:transparent!important}
.home-route .homepage-chart-section .ra-card{min-width:0;min-height:0;padding:30px!important;border-radius:28px!important;background:var(--glass-fill,var(--surface));border:1px solid var(--glass-border,var(--line))}
.home-route #research-charts{background:radial-gradient(700px 400px at 82% 20%,rgba(var(--tpc-accent-rgb),.07),transparent 65%)}
.home-route #research-charts .ra-card-top{font-size:1.35rem;padding-bottom:18px;border-bottom:1px solid var(--glass-border,var(--line))}
.home-route #research-charts .ra-card-top i{width:11px;height:11px;box-shadow:0 0 22px currentColor}
.home-route #research-charts .ra-desc{font-size:14px;min-height:72px}
.home-route #research-charts .ra-legend{font-size:9px;color:var(--ux-accent,var(--accent))}
.homepage-chart-section .chart-disclosure{max-width:80ch;margin:20px 0 32px;color:var(--muted);font-size:14px;line-height:1.65}
.homepage-chart-section .chart-disclosure b{color:var(--text)}
.homepage-chart-section .ra-line-chart{width:100%;height:100px;margin:10px 0 15px;padding:10px;border-radius:16px;background:linear-gradient(180deg,rgba(255,255,255,.08),transparent)}
.homepage-chart-section .ra-bar-row{grid-template-columns:75px minmax(0,1fr) 30px;height:25px;margin-bottom:9px}
.homepage-chart-section .ra-bar-row>i{height:8px;background:rgba(255,255,255,.12)}
.homepage-chart-section .ev-scroll{max-width:100%;overflow-x:auto}
.homepage-chart-section .sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.homepage-chart-section .ev-scroll:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.homepage-chart-section caption{text-align:left;padding:0 0 16px;color:var(--muted);font-size:13px}
.homepage-chart-section .ind-grid{min-width:0}
.home-route #indications.homepage-chart-section .ind-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
.home-route #indications.homepage-chart-section .ind-card{min-width:0;min-height:0}
.home-route #community.homepage-community-polls .polls-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
/* Legacy 3D card transforms can escape an overflow rail in WebKit. Paint
 * containment preserves each rail's scrolling without widening the page. */
.home-route .homepage-catalogue-scroll,.homepage-chart-section .ev-scroll,.homepage-chart-section .ind-grid,.homepage-chart-section .polls-grid{contain:paint}
.homepage-community-polls .poll-row{min-width:0}
.homepage-community-polls .poll-row>div{height:auto;min-height:0}
.homepage-community-polls .poll-row>div>span{position:relative;display:block;white-space:normal;line-height:1.5;padding:0}
.homepage-community-polls .poll-row em{white-space:normal;line-height:1.5}
.frequency-distribution{margin-top:12px;font-size:12px}
.frequency-distribution summary{min-height:44px;cursor:pointer;color:var(--accent);display:flex;align-items:center}
.frequency-distribution ul{padding:0;list-style:none}
.frequency-distribution li{display:grid;grid-template-columns:1fr auto;gap:8px;padding:10px 0;border-top:1px solid var(--line)}
.frequency-distribution li small{grid-column:1/-1;color:var(--muted)}
@media(max-width:1200px){.home-route #community.homepage-community-polls .polls-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-route #indications.homepage-chart-section .ind-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:850px){.home-route #community.homepage-community-polls .polls-grid{grid-template-columns:1fr!important}}
@media(max-width:1000px){.home-route #indications.homepage-chart-section .ind-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.home-route #indications.homepage-chart-section .ind-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.home-route #community.homepage-community-polls .polls-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:1000px){.home-route .homepage-chart-section .ra-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.home-route .homepage-chart-section .ra-grid{grid-template-columns:1fr}}
.homepage-research-suite .ra-card h3{font-size:20px;line-height:1.3;margin:0 0 14px}
.homepage-research-suite .ra-card p{line-height:1.65;color:var(--muted,#96a6ad)}
.homepage-research-suite .ra-card a{display:inline-flex;align-items:center;min-height:44px;color:var(--accent,var(--tpc-accent))}
.homepage-research-suite .learn-card{grid-template-columns:1fr;min-width:0}
.homepage-research-suite .learn-card h3{font-size:20px;line-height:1.3}
.homepage-research-suite .learn-card>div:last-child>p:not(.eyebrow){font-size:14px;line-height:1.65}
@media(max-width:700px){.procurement-actions>a{width:100%}.home-route #science.homepage-data-section .ra-grid,.homepage-research-suite .learn-grid{grid-template-columns:1fr}.homepage-research-suite .learn-card>div:last-child{padding:24px}.homepage-research-suite .learn-card .eyebrow{font-size:10px}}

/* Temporarily hide customer review UI; keep review code and data intact. */
.home-route .testimonials,
.rating-link,
.approved-rating,
.product-reviews,
[data-product-reviews],
.product-reviews + .sample-note {
  display: none !important;
}

/* All bags reuse the established cart-panel/head/lines/summary system. */
.inline-bag.cart-panel{position:fixed;inset:0 0 0 auto;max-width:100%;color:var(--text);font-family:inherit}
.inline-bag:not([open]){display:none!important}
.inline-bag button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.inline-bag button:disabled{opacity:.45;cursor:not-allowed}
.inline-bag .cart-summary{padding-bottom:max(16px,env(safe-area-inset-bottom))!important}
/* Compact shared cart: content-sized rows, fixed totals and a scrollable list. */
.cart-panel{box-sizing:border-box!important;width:min(500px,calc(100vw - 16px))!important;height:fit-content!important;min-height:0!important;max-height:calc(100dvh - 16px)!important;padding:12px!important;border-radius:16px!important;bottom:auto!important}
.inline-bag.cart-panel{inset:8px 8px auto auto!important;margin:0!important}
.cart-panel>.close{top:6px!important;right:6px!important;width:44px!important;height:44px!important}
.cart-panel .cart-head{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;padding:4px 44px 10px 0!important}
.cart-panel .cart-head .eyebrow{display:none!important}
.cart-panel .cart-head h2{font-size:24px!important;line-height:1.2!important;margin:0!important;letter-spacing:-.03em!important}
.cart-panel .cart-head>p:not(.eyebrow){font-size:12px!important;line-height:1.4!important;margin:0!important}
.cart-panel .cart-lines{margin:10px 0 0!important;padding:0!important;display:flex;flex-direction:column;gap:8px}
.cart-panel .cart-lines article{display:grid!important;grid-template-columns:38px minmax(0,1fr) auto!important;align-items:center!important;gap:10px!important;margin:0!important;padding:10px!important;border-radius:12px!important;min-height:0!important;flex-shrink:0}
.cart-panel .cart-lines article>div:nth-child(2){min-width:0;gap:3px}
.cart-panel .cart-lines article b{font-size:14px!important;line-height:1.3;overflow-wrap:anywhere}
.cart-panel .cart-lines article small{font-size:11px!important;line-height:1.35!important;margin:0!important}
.cart-panel .cart-lines article>strong{grid-column:3!important;grid-row:1!important;font-size:14px!important;white-space:nowrap;align-self:center}
.cart-panel .mini-vial{width:36px!important;height:48px!important;font-size:8px!important;border-radius:8px!important}
.cart-panel .cart-product-link{color:inherit;text-decoration:none}
.cart-panel b .cart-product-link:hover{text-decoration:underline;text-underline-offset:3px}
.cart-panel .cart-product-link:focus-visible{outline:2px solid var(--accent,var(--tpc-accent));outline-offset:3px;border-radius:3px}
.cart-panel .quantity{margin-top:2px!important;gap:6px!important}
.cart-panel .quantity button{min-width:44px!important;min-height:44px!important;width:44px!important;height:44px!important;padding:0!important;font-size:18px!important}
.cart-panel .quantity span{min-width:16px;text-align:center;font-size:12px!important}
.cart-panel .cart-summary{margin-top:10px!important;padding:12px 0 max(4px,env(safe-area-inset-bottom))!important;background:transparent!important}
.cart-panel .cart-summary>div{font-size:16px!important;line-height:1.4}
.cart-panel .cart-summary small{font-size:11px!important;line-height:1.4!important;margin:6px 0 10px!important}
.cart-panel .cart-summary .primary-button{min-height:44px!important;padding:10px 12px!important;font-size:14px!important;line-height:1.3!important}
.cart-panel .empty-cart{margin:0!important;padding:20px 12px!important}
.cart-panel>h3{font-size:17px;margin:12px 0 6px}.cart-panel>p{font-size:12px;line-height:1.5;margin:6px 0 10px}
.overlay.cart-overlay,
.inline-bag::backdrop {
  background:rgba(3,7,12,.28)!important;
  -webkit-backdrop-filter:blur(2px)!important;
  backdrop-filter:blur(2px)!important;
}

/* Clip decorative horizontal overflow without creating a sticky-header scroll ancestor. */
.products-route{overflow-x:clip !important;overflow-y:visible !important}
.mobile-order-bar{display:none}
@media(max-width:767px){
  .mobile-order-bar:not([hidden]){box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:16px;position:fixed;inset:auto 0 0;z-index:60;background:var(--bg,#091219);border-top:1px solid var(--line,#34434e);padding:12px max(16px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
  .mobile-order-bar>div{min-width:0;display:grid;gap:4px}
  .mobile-order-bar span{font-size:12px;line-height:1.3;color:var(--muted,#a5b4be);overflow-wrap:anywhere}
  .mobile-order-bar strong{font-size:20px;font-variant-numeric:tabular-nums;color:var(--text,#edf3f5)}
  .mobile-order-bar button{flex-shrink:0;min-height:44px;font:700 15px var(--tpc-font-family);padding:12px 20px;border:0;border-radius:12px;background:var(--accent,var(--tpc-accent));color:#061018;cursor:pointer}
  .mobile-order-bar button:focus-visible{outline:2px solid var(--text,#edf3f5);outline-offset:3px}
  body.has-mobile-order-bar{padding-bottom:calc(100px + env(safe-area-inset-bottom))}
}
/* Compact catalogue artwork: trim the portrait background above/below the
 * package, keeping the lower-middle vial label in view. */
.products-route .product-card .product-photo-wrap {
  position:relative !important;
  display:block !important;
  height:auto !important;
  aspect-ratio:1 / 1;
  padding:0 !important;
  overflow:hidden;
}
.products-route .product-card .product-photo,
.products-route .product-card:hover .product-photo {
  box-sizing:border-box !important;
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:cover !important;
  object-position:center 40% !important;
  padding:0 !important;
  transform:none !important;
  transition:transform .35s ease;
}
@media(hover:hover) and (pointer:fine){
  .products-route .product-card:hover .product-photo{transform:scale(1.04) !important}
}
@media(prefers-reduced-motion:reduce){
  .products-route .product-card .product-photo{transition:none}
}

/* On narrow screens, category summaries and poll cards work better as
 * deliberate swipeable rails than as compressed multi-column grids. */
@media(max-width:700px){
  .home-route #indications.homepage-chart-section .ind-grid,
  body.home-route #indications.homepage-chart-section .ind-grid{
    display:flex!important;grid-template-columns:none!important;gap:14px!important;
    overflow-x:auto!important;overflow-y:hidden!important;overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;scrollbar-width:thin;
    padding:0 2px 12px!important;contain:paint
  }
  .home-route #indications.homepage-chart-section .ind-card,
  body.home-route #indications.homepage-chart-section .ind-card{
    flex:0 0 min(340px,82vw)!important;min-width:0!important;scroll-snap-align:start
  }
  .home-route #community.homepage-community-polls .polls-grid,
  body.home-route #community.homepage-community-polls .polls-grid{
    display:flex!important;grid-template-columns:none!important;gap:14px!important;
    overflow-x:auto!important;overflow-y:hidden!important;overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;scrollbar-width:thin;
    padding:0 2px 12px!important;contain:paint
  }
  .home-route #community.homepage-community-polls .poll-card,
  body.home-route #community.homepage-community-polls .poll-card{
    flex:0 0 min(360px,84vw)!important;min-width:0!important;scroll-snap-align:start
  }
}

/* Black glass with a restrained surface reflection and a fine upper rim. */
.home-route{
  --glass-fill:linear-gradient(135deg,rgba(12,16,21,.92),rgba(4,7,11,.86) 55%,rgba(5,10,14,.9));
  --glass-border:rgba(218,232,242,.16);
  --glass-shadow:0 24px 64px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.08);
}
.home-route .ra-card::before,.home-route .ind-card::before,
.home-route .poll-card::before,.home-route .learn-card::before{
  background:radial-gradient(500px 220px at var(--ux-light-x,50%) var(--ux-light-y,0%),rgba(255,255,255,.055),transparent 65%);
}
.home-route .product-card::before{background:linear-gradient(140deg,rgba(255,255,255,.04),transparent 28%,transparent 70%,rgba(var(--tpc-accent-rgb),.025))}
.home-route .learn-grid{background:transparent}
.home-route #indications .ind-measure{display:grid!important;grid-template-columns:minmax(0,1fr) 28px;gap:8px;align-items:center}
.home-route #indications .ind-measure small{font:600 11px/1.4 var(--tpc-font-family);font-variant-numeric:tabular-nums;color:var(--muted);text-align:right}
/* Store-first copy uses the incumbent surfaces, type and image treatment. */
.approved-detail .approved-hero-copy{min-width:0;max-width:100%;box-sizing:border-box}
.approved-detail .approved-hero-copy h1{overflow-wrap:anywhere}
.approved-detail .approved-hero-copy .approved-lede{display:block!important;max-width:65ch;font-size:.95rem;line-height:1.6;color:var(--ap-muted,#9dafbd)}
.approved-detail .approved-hero-copy .approved-status{display:inline-flex!important;font-size:.75rem;line-height:1.4;padding:.3rem .65rem;border:1px solid var(--line,#29404c);border-radius:6px;margin-block:.5rem}
.sales-view-product{font-size:.75rem;line-height:1.4;max-width:8rem;text-align:center;padding:.65rem;border:1px solid var(--line,#29404c);border-radius:6px;color:inherit;text-decoration:none}
.sales-view-product:hover,.sales-view-product:focus-visible{border-color:var(--tpc-accent);color:var(--tpc-accent)}
.product-meta span:last-child{max-width:65%;text-align:right;overflow-wrap:anywhere}
/* Catalogue browsing: keep identity and controls close to the products. */
.products-route .catalogue.section-shell{padding-top:40px!important}
.products-route .catalogue-title{gap:16px!important;margin-bottom:24px!important}
.products-route .catalogue .product-open{padding:20px}
.products-route .catalogue .product-photo-wrap{margin-bottom:12px}
.products-route .catalogue .product-meta{margin:8px 0 6px}
.products-route .catalogue .product-open h2,.products-route .catalogue .product-open h3{margin-bottom:8px}
@media(max-width:600px){
 .products-route .catalogue.section-shell{padding-top:24px!important}
 .products-route .catalogue-title{gap:12px!important;margin-bottom:20px!important}
 .products-route .catalogue .product-open{padding:16px}
}
.sales-catalogue-intro{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin:0 0 1.25rem}
.sales-catalogue-intro p{flex:1 1 30rem;max-width:70ch}
.sales-catalogue-intro label{display:flex;align-items:center;gap:.5rem}
.sales-catalogue-intro select{background:#0b1720;color:#edf4f5;border:1px solid #29404c;border-radius:6px;padding:.6rem;min-height:44px}
.sales-catalogue-intro small{flex-basis:100%;color:#9cafbb}
.home-route .homepage-data-section.sales-shop-categories{padding-block:24px!important}
.home-route .sales-shop-categories .sales-shopping-note,.home-route .sales-shop-categories .homepage-topic-links{font-size:.8125rem;line-height:1.65}
.home-route .sales-shop-categories .sales-shopping-note{margin:0;color:var(--text-secondary,#a8b7c2)}
.home-route .sales-shop-categories .homepage-topic-links{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;margin:12px 0}
.sales-category-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-block:1.5rem}
.sales-category-grid article{min-width:0;padding:1rem;border:1px solid #29404c;border-radius:14px;background:#0b1720}
.sales-category-grid img{width:100%;height:200px;object-fit:contain}
.sales-category-grid p{font-size:.875rem;overflow-wrap:anywhere}
.sales-category-grid strong{display:block;margin-block:.75rem}
@media(max-width:600px){.sales-category-grid{grid-template-columns:1fr}.sales-catalogue-intro label,.sales-catalogue-intro select{width:100%}.sales-value-strip{font-size:.8rem}.sales-view-product{max-width:7rem}}

/* Unslop craft pass. Adapted from Unslop by Damir Sokolovsky (@heydamir), CC BY 4.0.
   Public storefront only. Photography and scientific diagrams carry the detail. */
:is(.home-route,.products-route,.seo-route){
 --tpc-surface:#11191e;--tpc-surface-raised:#192229;--tpc-ink:#edf2f3;
 --tpc-secondary:#b9c5cb;--tpc-muted:#a5b4bc;--tpc-hairline:#344148;
 --glass-fill:var(--tpc-surface);--glass-border:var(--tpc-hairline);--glass-shadow:none;
 --tpc-ui-section-y:64px;--tpc-ui-mobile-section-y:40px;
}
:is(.home-route,.products-route,.seo-route) :is(.product-card,.ra-card,.ind-card,.poll-card,.learn-card,.ev-card,.ex-card,.cp-card,.rp-card,.mx-card,.seo-article-links,.sales-category-grid article){
 background:var(--tpc-surface)!important;border-color:var(--tpc-hairline)!important;
 box-shadow:none!important;backdrop-filter:none!important;border-radius:16px!important;
}
:is(.home-route,.products-route,.seo-route) :is(.product-card,.ra-card,.ind-card,.poll-card,.learn-card,.ev-card,.ex-card,.cp-card,.rp-card,.mx-card)::before{
 background:none!important;box-shadow:none!important;pointer-events:none;
}
:is(.home-route,.products-route,.seo-route) :is(h1,h2,h3,h4){font-weight:500!important;letter-spacing:-.025em;}
:is(.home-route,.products-route,.seo-route) :is(.eyebrow,.cp-eyebrow,.ev-eyebrow,.mx-eyebrow,.rp-eyebrow,.product-meta,.ex-stage-caption){
 text-transform:none!important;letter-spacing:.02em!important;font-size:12px!important;line-height:1.5;
}
:is(.home-route,.products-route,.seo-route) :is(.product-card small,.sales-discount,.ev-card small,.rp-card small,.ind-measure small){font-size:12px!important;line-height:1.5;letter-spacing:0!important;}
:is(.home-route,.products-route,.seo-route) :is(.product-card p,.seo-article-body p){color:var(--tpc-secondary);}
:is(.home-route,.products-route,.seo-route) :is(button,select,input){font-variant-numeric:tabular-nums;}
:is(.home-route,.products-route,.seo-route) :is(.primary-button,.sales-add-cart){
 background:var(--tpc-accent)!important;box-shadow:none!important;border-radius:10px!important;font-weight:600!important;
}
:is(.home-route,.products-route,.seo-route) :is(.sales-quick-buy,.sales-card-controls){gap:12px!important;}
:is(.home-route,.products-route,.seo-route) :is(.ev-icon,.rp-icon,.cp-icon,.ex-card-header-icon,.ex-safety-icon){
 box-shadow:none!important;background:transparent!important;border-radius:50%;aspect-ratio:1;flex-shrink:0;
}
:is(.home-route,.products-route,.seo-route) :is(a,button,summary,input,select):focus-visible{
 outline:2px solid var(--tpc-accent);outline-offset:4px;
}
:is(.home-route,.products-route,.seo-route) :is(.seo-article-faqs,.approved-faqs){background:transparent!important;}
:is(.home-route,.products-route,.seo-route) :is(.seo-article-faqs,.approved-faqs) details{
 border:1px solid var(--tpc-hairline)!important;border-radius:12px!important;background:var(--tpc-surface)!important;
 margin-block:12px!important;padding:0!important;box-shadow:none!important;
}
:is(.home-route,.products-route,.seo-route) :is(.seo-article-faqs,.approved-faqs) summary{
 padding:20px!important;font-size:16px!important;line-height:1.6;color:var(--tpc-ink)!important;
}
:is(.home-route,.products-route,.seo-route) :is(.seo-article-faqs,.approved-faqs) details>p{
 padding:0 20px 20px!important;margin:0!important;color:var(--tpc-secondary)!important;
}
/* Decorative motion must never gate access to research or commerce controls. */
:is(.home-route,.products-route,.seo-route) :is(.ux-reveal,.ev-card,.rp-card,.mx-node){opacity:1!important;visibility:visible!important;}
:is(.home-route,.products-route,.seo-route) :is(.product-card,.ra-card,.ind-card,.learn-card):hover{transform:none!important;}
:is(.home-route,.products-route,.seo-route) :is(.product-card,.ra-card,.ind-card,.poll-card,.learn-card,.ev-card,.rp-card,.mx-node,.mx-node-icon){animation:none!important;}
@media(max-width:600px){
 :is(.home-route,.products-route,.seo-route) :is(.seo-article-faqs,.approved-faqs) summary{padding:16px!important;}
 :is(.home-route,.products-route,.seo-route) :is(.seo-article-faqs,.approved-faqs) details>p{padding:0 16px 16px!important;}
}
/* The official standalone ribbon has portrait proportions, unlike a wordmark. */
.site-header a:has(>img[src*="brand-mark-static.svg"]){gap:8px;min-width:0;}
:root body .site-header .logo img[src*="brand-mark-static.svg"]{width:28px!important;height:40px!important;max-width:28px!important;object-fit:contain;position:static!important;}
.site-header a:has(>img[src*="brand-mark-static.svg"])::after{content:"THE PEPTIDE CO.";font:500 14px/1.3 var(--tpc-font-family);color:var(--tpc-ink,#edf2f3);white-space:nowrap;}