/*
 * DBC / BIOTEN V4.1.0
 * Full-site editorial refinement layer.
 *
 * This file intentionally sits after the historical stylesheets. It does not
 * redesign the locked homepage hero. It consolidates the visible system:
 * navigation, secondary-page rhythm, controls and both footer families.
 */

:root {
  --v410-blue: #075ca8;
  --v410-blue-deep: #0a324f;
  --v410-green: #0e7b5b;
  --v410-green-deep: #095b44;
  --v410-ink: #112b3c;
  --v410-copy: #435b6a;
  --v410-muted: #71828e;
  --v410-paper: #fbfcfc;
  --v410-canvas: #f1f5f6;
  --v410-line: rgb(17 65 93 / .14);
  --v410-line-strong: rgb(17 65 93 / .24);
  --v410-shadow: 0 22px 62px rgb(8 45 69 / .09);
  --v410-shadow-soft: 0 12px 34px rgb(8 45 69 / .065);
  --v410-radius-card: 14px;
  --v410-radius-control: 9px;
  --v410-shell: min(1240px, calc(100% - clamp(36px, 7vw, 104px)));
  --v410-reading: min(740px, calc(100% - 36px));
  --v410-ease: cubic-bezier(.16, 1, .3, 1);
}

html {
  scroll-padding-top: 6rem;
}

body.v410-site {
  color: var(--v410-ink);
  background: var(--v410-canvas);
}

body.v410-site > main {
  isolation: isolate;
}

body.v410-site :where(h1, h2, h3) {
  color: var(--v410-ink);
  text-wrap: balance;
}

body.v410-site :where(p, li, dd) {
  color: var(--v410-copy);
}

body.v410-site :where(a, button, input, select, textarea):focus-visible {
  outline: 2px solid rgb(7 92 168 / .76);
  outline-offset: 3px;
}

/* ---------- global header and five-entry navigation ---------- */

html body.v410-site.dbc-global-nav-active .site-header.site-header {
  min-height: 4.35rem !important;
  border-bottom: 1px solid rgb(9 62 96 / .12) !important;
  background: rgb(249 251 252 / .9) !important;
  box-shadow: 0 8px 28px rgb(9 45 68 / .045) !important;
  backdrop-filter: blur(24px) saturate(132%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(132%) !important;
}

html body.v410-site.dbc-global-nav-active .site-header .header-inner {
  width: min(1420px, calc(100% - clamp(28px, 5vw, 78px))) !important;
  min-height: 4.35rem !important;
}

body.v410-site.dbc-global-nav-active .brand-logos {
  gap: .58rem;
}

body.v410-site.dbc-global-nav-active .brand-logos .logo-image:first-child img {
  height: 2.2rem;
}

body.v410-site.dbc-global-nav-active .brand-logos .logo-image-biocycle img {
  width: 2.2rem;
  height: 2.2rem;
}

body.v410-site.dbc-global-nav-active .dbc-desktop-nav {
  gap: .1rem;
}

body.v410-site.dbc-global-nav-active .dbc-desktop-nav__link {
  min-height: 2.45rem;
  padding-inline: clamp(.58rem, .85vw, .84rem);
  border-radius: var(--v410-radius-control);
  color: #263c49;
  font-size: clamp(.76rem, .79vw, .83rem);
  font-weight: 660;
  letter-spacing: -.008em;
}

body.v410-site.dbc-global-nav-active .dbc-desktop-nav__link:is(:hover, :focus-visible, .is-open, [aria-current="page"]) {
  color: var(--v410-blue);
  background: rgb(229 240 247 / .78);
}

body.v410-site.dbc-global-nav-active .dbc-desktop-nav__link:is([data-dbc-desktop-menu="bioten"], [data-dbc-desktop-menu="packaging"], [data-dbc-desktop-menu="developer"]):is(:hover, :focus-visible, .is-open, [aria-current="page"]) {
  color: var(--v410-green-deep);
  background: rgb(230 242 237 / .84);
}

/* Do not advertise a language switch on pages whose full body has not been
   translated. The Chinese page remains complete and the control reappears on
   pages explicitly marked data-en-ready="true". */
body.v410-site.dbc-global-nav-active [data-language-unavailable] {
  display: none !important;
}

body.v410-site.dbc-global-nav-active .dbc-desktop-mega {
  border-top: 1px solid rgb(7 92 168 / .1);
  border-bottom: 1px solid rgb(17 65 93 / .16);
  background:
    radial-gradient(circle at 78% 0%, rgb(14 123 91 / .055), transparent 25rem),
    linear-gradient(112deg, rgb(247 250 252 / .975), rgb(250 252 251 / .97));
  box-shadow: 0 32px 82px rgb(8 42 64 / .14);
  backdrop-filter: blur(30px) saturate(130%);
  -webkit-backdrop-filter: blur(30px) saturate(130%);
}

body.v410-site.dbc-global-nav-active .dbc-desktop-mega__inner {
  grid-template-columns: minmax(10.2rem, .68fr) minmax(32rem, 1.9fr) minmax(11rem, .72fr);
  width: min(79rem, calc(100% - clamp(2.5rem, 6vw, 5.5rem)));
  min-height: 16.5rem;
  gap: clamp(1rem, 1.8vw, 1.65rem);
  padding-block: 1.25rem 1.4rem;
}

body.v410-site.dbc-global-nav-active .dbc-desktop-mega__intro::before {
  width: 3.25rem;
  margin-bottom: .78rem;
  background: linear-gradient(90deg, var(--v410-blue), var(--v410-green));
}

body.v410-site.dbc-global-nav-active .dbc-desktop-mega__eyebrow {
  color: var(--v410-blue);
  font-size: .65rem;
  letter-spacing: .13em;
}

body.v410-site.dbc-global-nav-active .dbc-desktop-mega__intro h2 {
  color: var(--v410-blue-deep);
  font-size: clamp(1.28rem, 1.65vw, 1.68rem);
  line-height: 1.13;
}

body.v410-site.dbc-global-nav-active .dbc-desktop-mega__intro > p:not(.dbc-desktop-mega__eyebrow) {
  margin-block: .65rem .72rem;
  color: var(--v410-copy);
  font-size: .78rem;
  line-height: 1.62;
}

body.v410-site.dbc-global-nav-active .dbc-desktop-route {
  grid-template-rows: 5.8rem minmax(0, 1fr);
  height: 13.8rem;
  min-height: 13.8rem;
  overflow: hidden;
  border: 1px solid var(--v410-line);
  border-radius: 12px;
  background: rgb(255 255 255 / .82);
  box-shadow: inset 0 1px rgb(255 255 255 / .9);
  transition: transform 260ms var(--v410-ease), border-color 220ms ease, box-shadow 260ms ease;
}

body.v410-site.dbc-global-nav-active .dbc-desktop-route:is(:hover, :focus-visible) {
  border-color: rgb(7 92 168 / .25);
  box-shadow: 0 15px 38px rgb(8 45 69 / .09);
  transform: translateY(-2px);
}

body.v410-site.dbc-global-nav-active .dbc-desktop-route__media img {
  filter: saturate(.78) contrast(1.04) brightness(.99);
  transform: scale(1.005);
}

body.v410-site.dbc-global-nav-active .dbc-desktop-route:is(:hover, :focus-visible) .dbc-desktop-route__media img {
  filter: saturate(.9) contrast(1.04) brightness(1.01);
  transform: scale(1.03);
}

body.v410-site.dbc-global-nav-active .dbc-desktop-route__copy {
  padding: .72rem .84rem .8rem;
}

body.v410-site.dbc-global-nav-active .dbc-desktop-route__copy::before {
  left: .84rem;
  width: 1.65rem;
}

body.v410-site.dbc-global-nav-active .dbc-desktop-route__copy small {
  margin-bottom: .28rem;
  color: var(--v410-green-deep);
  font-size: .62rem;
  letter-spacing: .09em;
}

body.v410-site.dbc-global-nav-active .dbc-desktop-route__copy strong {
  color: var(--v410-ink);
  font-size: .94rem;
  line-height: 1.28;
}

body.v410-site.dbc-global-nav-active .dbc-desktop-route__desc {
  margin-top: .25rem;
  color: #667985;
  font-size: .73rem;
  line-height: 1.48;
}

body.v410-site.dbc-global-nav-active .dbc-desktop-mega__quick {
  padding-left: clamp(.85rem, 1.6vw, 1.3rem);
  border-left-color: var(--v410-line);
}

body.v410-site.dbc-global-nav-active .dbc-desktop-mega__quick > p {
  color: var(--v410-muted);
  font-size: .65rem;
  letter-spacing: .1em;
}

body.v410-site.dbc-global-nav-active .dbc-desktop-mega__quick > a {
  min-height: 2.18rem;
  color: #405765;
  font-size: .73rem;
}

body.v410-site.dbc-global-nav-active .dbc-desktop-mega__quick > a:is(:hover, :focus-visible) {
  color: var(--v410-blue);
}

body.v410-site.dbc-global-nav-active .dbc-desktop-mega__quick > a.dbc-desktop-mega__cta {
  min-height: 2.42rem;
  border-radius: var(--v410-radius-control);
}

/* ---------- secondary-page typography and spatial rhythm ---------- */

body.v410-site:not(.dbc-home-page) > main {
  background: var(--v410-paper);
}

body.v410-site:not(.dbc-home-page) :is(
  .about-bioten-hero,
  .request-hero,
  .v245-hero,
  .formal-hero,
  .dv2-hero,
  .dv21-hero
) {
  min-height: 0 !important;
  border-bottom: 1px solid var(--v410-line) !important;
  background:
    radial-gradient(circle at 82% 16%, rgb(14 123 91 / .065), transparent 24rem),
    radial-gradient(circle at 12% 4%, rgb(7 92 168 / .075), transparent 27rem),
    linear-gradient(180deg, #fafcfc 0%, #eef4f6 100%) !important;
}

body.v410-site:not(.dbc-home-page) :is(.about-bioten-hero, .request-hero) {
  min-height: clamp(21rem, 39vw, 31rem) !important;
}

body.v410-site:not(.dbc-home-page) :is(
  .about-hero-copy,
  .request-hero-inner,
  .formal-hero__inner,
  .v245-hero__grid,
  .dv2-hero__grid,
  .dv21-hero__grid
) {
  width: var(--v410-shell) !important;
}

body.v410-site:not(.dbc-home-page) :is(
  .about-hero-copy,
  .request-hero-copy,
  .formal-hero__copy,
  .v245-hero__copy,
  .dv2-hero__copy,
  .dv21-hero__copy
) h1 {
  max-width: 18ch !important;
  color: var(--v410-blue-deep) !important;
  font-size: clamp(2.55rem, 4.45vw, 4.55rem) !important;
  font-weight: 630 !important;
  line-height: 1.025 !important;
  letter-spacing: -.052em !important;
}

body.v410-site:not(.dbc-home-page) :is(
  .hero-eyebrow,
  .formal-eyebrow,
  .v245-eyebrow,
  .dv2-kicker
) {
  color: var(--v410-green-deep) !important;
  font-size: .68rem;
  letter-spacing: .12em;
}

body.v410-site:not(.dbc-home-page) :is(
  .about-hero-title p,
  .request-lead,
  .formal-lead,
  .v245-lead,
  .dv2-lead,
  .dv21-hero__lead
) {
  max-width: 44rem;
  color: var(--v410-copy) !important;
  font-size: clamp(.96rem, 1.1vw, 1.06rem) !important;
  line-height: 1.75 !important;
}

body.v410-site:not(.dbc-home-page) :is(
  .home-band,
  .formal-section,
  .v245-section,
  .dv2-section,
  .dv21-progressive,
  .request-shell
) {
  padding-block: clamp(4.2rem, 6.7vw, 6.8rem) !important;
}

body.v410-site:not(.dbc-home-page) :is(
  .home-section-title,
  .formal-section-head,
  .v245-section__head,
  .dv2-section__head,
  .dv21-section-intro,
  .request-intro
) {
  width: min(100%, 64rem);
}

body.v410-site:not(.dbc-home-page) :is(
  .home-section-title,
  .formal-section-head,
  .v245-section__head,
  .dv2-section__head,
  .dv21-section-intro,
  .request-intro
) h2 {
  max-width: 19ch !important;
  color: var(--v410-blue-deep) !important;
  font-size: clamp(2.05rem, 3.45vw, 3.35rem) !important;
  font-weight: 630 !important;
  line-height: 1.065 !important;
  letter-spacing: -.045em !important;
}

body.v410-site:not(.dbc-home-page) :is(
  .home-section-title,
  .formal-section-head,
  .v245-section__head,
  .dv2-section__head,
  .dv21-section-intro,
  .request-intro
) > p {
  max-width: 62ch;
  color: var(--v410-copy) !important;
  font-size: .94rem;
  line-height: 1.76;
}

body.v410-site .v281-path {
  border-block: 1px solid var(--v410-line) !important;
  background: rgb(248 251 252 / .95) !important;
}

body.v410-site .v281-path__inner {
  width: var(--v410-shell);
  padding-block: .68rem;
}

body.v410-site .v281-path__item {
  border-radius: var(--v410-radius-control);
}

body.v410-site .v281-path__item:is(:hover, :focus-visible),
body.v410-site [data-v281-current] .v281-path__item {
  background: rgb(230 240 247 / .76);
}

body.v410-site :is(
  .about-anchor-nav,
  .packaging-anchor,
  .resources-page-nav,
  .news-business-anchor-wrap,
  .knowledge-anchor-nav,
  .bioten-product-nav,
  .pl-anchor-nav,
  .v245-local-nav,
  .vp-anchor-nav
) {
  top: 4.35rem !important;
  border-block: 1px solid var(--v410-line) !important;
  background: rgb(249 251 252 / .93) !important;
  backdrop-filter: blur(20px) saturate(118%);
  -webkit-backdrop-filter: blur(20px) saturate(118%);
}

body.v410-site :is(
  .about-anchor-nav,
  .packaging-anchor,
  .resources-page-nav,
  .news-business-anchor,
  .knowledge-anchor-nav,
  .bioten-product-nav,
  .pl-anchor-nav,
  .v245-local-nav,
  .vp-anchor-nav
) a {
  color: #526977 !important;
  font-size: .72rem !important;
  font-weight: 660 !important;
}

body.v410-site :is(
  .about-anchor-nav,
  .packaging-anchor,
  .resources-page-nav,
  .news-business-anchor,
  .knowledge-anchor-nav,
  .bioten-product-nav,
  .pl-anchor-nav,
  .v245-local-nav,
  .vp-anchor-nav
) a:is(:hover, :focus-visible, .is-active, [aria-current]) {
  color: var(--v410-blue) !important;
}

body.v410-site :is(
  .bioten-lab-card,
  .bioten-compliance-card,
  .formal-card,
  .request-card,
  .dv2-asset,
  .dv2-tool-row,
  .dv21-domain-tab,
  .dv21-domain-panel,
  .v300-domain-index__card
) {
  border-color: var(--v410-line) !important;
  border-radius: var(--v410-radius-card) !important;
  box-shadow: none !important;
}

body.v410-site :is(
  .bioten-lab-card,
  .bioten-compliance-card,
  .formal-card,
  .request-card,
  .v300-domain-index__card
):is(:hover, :focus-within) {
  border-color: rgb(7 92 168 / .27) !important;
  box-shadow: var(--v410-shadow-soft) !important;
}

body.v410-site :is(.formal-button, .v245-button, .dv2-action, .request-submit-button) {
  min-height: 2.78rem;
  border-radius: var(--v410-radius-control) !important;
  font-weight: 680;
  transition: transform 180ms var(--v410-ease), border-color 180ms ease, background-color 180ms ease, color 180ms ease, box-shadow 220ms ease;
}

body.v410-site :is(.formal-button, .v245-button, .dv2-action, .request-submit-button):is(:hover, :focus-visible) {
  box-shadow: 0 12px 28px rgb(8 45 69 / .11);
  transform: translateY(-1px);
}

body.v410-site :is(.formal-button, .v245-button, .dv2-action, .request-submit-button):active {
  box-shadow: none;
  transform: translateY(1px) scale(.985);
}

body.v410-site :where(input, textarea, select) {
  border-color: rgb(17 65 93 / .22);
  border-radius: var(--v410-radius-control);
  background: #fff;
}

/* V4.0 accidentally styled the submission status wrapper as a blue button.
   Keep the container structural; only its real submit control is a button. */
html body.v410-site .request-submit.request-submit {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: .65rem !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--v410-copy) !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body.v410-site .request-submit .request-submit-button {
  min-height: 2.95rem !important;
  padding: .72rem 1.18rem !important;
  border: 1px solid rgb(7 92 168 / .86) !important;
  color: #fff !important;
  background: linear-gradient(145deg, #0a67b7, #075ca8) !important;
  box-shadow: 0 10px 24px rgb(7 92 168 / .16) !important;
}

html body.v410-site .request-submit .request-reset-button {
  min-height: 2.95rem !important;
  padding: .72rem 1.08rem !important;
  border: 1px solid rgb(17 65 93 / .17) !important;
  border-radius: var(--v410-radius-control) !important;
  color: var(--v410-ink) !important;
  background: rgb(255 255 255 / .78) !important;
}

html body.v410-site .request-submit [data-request-status] {
  flex-basis: 100% !important;
  margin-top: .25rem !important;
}

body.v410-site :where(input, textarea, select):focus {
  border-color: var(--v410-blue);
  box-shadow: 0 0 0 3px rgb(7 92 168 / .1);
}

/* ---------- formal footer: compact, readable and consistent ---------- */

html body.v410-site[class][class][class] footer.formal-site-footer.formal-site-footer {
  color: var(--v410-ink) !important;
  border-top: 1px solid var(--v410-line) !important;
  background:
    radial-gradient(circle at 85% 2%, rgb(14 123 91 / .055), transparent 25rem),
    linear-gradient(180deg, #f1f6f7 0%, #eaf1f3 100%) !important;
  box-shadow: none !important;
}

html body.v410-site[class][class][class] footer.formal-site-footer.formal-site-footer::before {
  height: 2px !important;
  background: linear-gradient(90deg, var(--v410-blue) 0 68%, var(--v410-green) 68% 100%) !important;
  opacity: .9 !important;
}

html body.v410-site[class][class][class] footer.formal-site-footer .formal-footer-cta {
  display: grid !important;
  grid-template-columns: minmax(0, 1.15fr) auto !important;
  align-items: center !important;
  gap: 2rem !important;
  width: var(--v410-shell) !important;
  margin-inline: auto !important;
  padding-block: 2.2rem !important;
  border-bottom: 1px solid var(--v410-line) !important;
}

html body.v410-site[class][class][class] footer.formal-site-footer .formal-footer-cta h2 {
  max-width: 22ch !important;
  margin: 0 !important;
  color: var(--v410-blue-deep) !important;
  font-size: clamp(1.55rem, 2.25vw, 2.35rem) !important;
  line-height: 1.08 !important;
}

html body.v410-site[class][class][class] footer.formal-site-footer .formal-footer-cta p {
  max-width: 62ch !important;
  margin: .62rem 0 0 !important;
  color: var(--v410-copy) !important;
  font-size: .82rem !important;
  line-height: 1.68 !important;
}

html body.v410-site[class][class][class] footer.formal-site-footer .formal-footer-cta__actions {
  display: flex !important;
  align-items: center !important;
  gap: .55rem !important;
  margin: 0 !important;
}

html body.v410-site[class][class][class] footer.formal-site-footer .formal-footer-cta__actions a.formal-button {
  min-height: 2.7rem !important;
  padding-inline: 1rem !important;
  border-radius: var(--v410-radius-control) !important;
  font-size: .72rem !important;
}

html body.v410-site[class][class][class] footer.formal-site-footer .footer-inner.footer-inner {
  width: var(--v410-shell) !important;
  margin-inline: auto !important;
  padding: 2.15rem 0 1.2rem !important;
}

html body.v410-site[class][class][class] footer.formal-site-footer .footer-note.footer-note {
  max-width: 62rem !important;
  margin: 0 0 1.7rem !important;
  color: var(--v410-copy) !important;
  font-size: .78rem !important;
  line-height: 1.66 !important;
}

html body.v410-site[class][class][class] footer.formal-site-footer .footer-directory.footer-directory {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: clamp(1rem, 2.5vw, 2.4rem) !important;
  margin: 0 !important;
  padding: 0 0 1.8rem !important;
}

html body.v410-site[class][class][class] footer.formal-site-footer .footer-column.footer-column {
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

html body.v410-site[class][class][class] footer.formal-site-footer .footer-column.footer-column h3 {
  margin: 0 0 .68rem !important;
  color: var(--v410-blue-deep) !important;
  font-size: .72rem !important;
  letter-spacing: .015em !important;
}

html body.v410-site[class][class][class] footer.formal-site-footer .footer-column.footer-column:nth-child(2) h3,
html body.v410-site[class][class][class] footer.formal-site-footer .footer-column.footer-column:nth-child(3) h3,
html body.v410-site[class][class][class] footer.formal-site-footer .footer-column.footer-column:nth-child(4) h3 {
  color: var(--v410-green-deep) !important;
}

html body.v410-site[class][class][class] footer.formal-site-footer .footer-column.footer-column > a {
  display: block !important;
  min-height: 1.72rem !important;
  padding: .18rem 0 !important;
  color: #526977 !important;
  font-size: .72rem !important;
  line-height: 1.42 !important;
}

html body.v410-site[class][class][class] footer.formal-site-footer .footer-column.footer-column > a:is(:hover, :focus-visible) {
  color: var(--v410-blue) !important;
  transform: translateX(2px);
}

html body.v410-site[class][class][class] footer.formal-site-footer .footer-bottom.footer-bottom {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 1rem 2rem !important;
  padding-top: 1.05rem !important;
  border-top: 1px solid var(--v410-line) !important;
}

html body.v410-site[class][class][class] footer.formal-site-footer .footer-bottom > strong {
  color: var(--v410-blue-deep) !important;
  font-size: .74rem !important;
}

html body.v410-site[class][class][class] footer.formal-site-footer .footer-legal.footer-legal {
  justify-content: flex-end !important;
  gap: .5rem .9rem !important;
  color: var(--v410-muted) !important;
  font-size: .65rem !important;
}

html body.v410-site[class][class][class] footer.formal-site-footer .footer-legal :is(a, span) {
  color: inherit !important;
}

/* Article pages already end with a contextual decision panel. Repeating a
   large footer CTA makes the path feel circular, so it is removed there. */
html body.v410-site.news-article-page footer.formal-site-footer .formal-footer-cta {
  display: none !important;
}

/* ---------- homepage footer: stronger brand hierarchy, still compact ---------- */

body.v410-site .v410-home-footer {
  position: relative;
  overflow: hidden;
  color: #eaf2f5;
  background:
    radial-gradient(circle at 82% 12%, rgb(18 131 97 / .2), transparent 27rem),
    linear-gradient(135deg, #071f31 0%, #0b2d43 58%, #0b3547 100%);
}

body.v410-site .v410-home-footer::before {
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  content: "";
  background: linear-gradient(90deg, #1683d6 0 70%, #29a779 70% 100%);
}

body.v410-site .v410-home-footer__inner {
  width: var(--v410-shell);
  margin-inline: auto;
  padding: clamp(3rem, 5.3vw, 4.8rem) 0 1.35rem;
}

body.v410-site .v410-home-footer__top {
  display: grid;
  grid-template-columns: minmax(16rem, .9fr) minmax(0, 1.55fr);
  gap: clamp(2.5rem, 6vw, 6rem);
  padding-bottom: 2.3rem;
}

body.v410-site .v410-home-footer__brand a {
  display: inline-flex;
  flex-direction: column;
  gap: .28rem;
  color: #fff;
}

body.v410-site .v410-home-footer__brand strong {
  font-size: clamp(1.45rem, 2.25vw, 2.1rem);
  letter-spacing: -.035em;
}

body.v410-site .v410-home-footer__brand span {
  color: #9fc4d6;
  font-size: .78rem;
  letter-spacing: .08em;
}

body.v410-site .v410-home-footer__brand p {
  max-width: 34rem;
  margin: 1.15rem 0 0;
  color: #b8cbd4;
  font-size: .82rem;
  line-height: 1.72;
}

body.v410-site .v410-home-footer__official {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1.1rem;
  margin-top: 1.25rem;
}

body.v410-site .v410-home-footer__official a {
  color: #e5f1f5;
  font-size: .76rem;
}

body.v410-site .v410-home-footer__official a:is(:hover, :focus-visible) {
  color: #6bc5a1;
}

body.v410-site .v410-home-footer__directory {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1rem clamp(1.1rem, 2.7vw, 2.6rem);
}

body.v410-site .v410-home-footer__column h2 {
  margin: 0 0 .78rem;
  color: #fff;
  font-size: .78rem;
  letter-spacing: .02em;
}

body.v410-site .v410-home-footer__column:nth-child(2) h2,
body.v410-site .v410-home-footer__column:nth-child(3) h2,
body.v410-site .v410-home-footer__column:nth-child(4) h2 {
  color: #81d1b1;
}

body.v410-site .v410-home-footer__column a {
  display: block;
  min-height: 1.7rem;
  padding: .16rem 0;
  color: #adc3cd;
  font-size: .76rem;
  line-height: 1.45;
}

body.v410-site .v410-home-footer__column a:is(:hover, :focus-visible) {
  color: #fff;
  transform: translateX(2px);
}

body.v410-site .v410-home-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .75rem 1.5rem;
  padding-top: 1.15rem;
  border-top: 1px solid rgb(220 237 244 / .14);
}

body.v410-site .v410-home-footer__bottom strong,
body.v410-site .v410-home-footer__legal {
  color: #8eabb8;
  font-size: .72rem;
}

/* The green project CTA needs a clear action contrast in every mega panel. */
html body.v410-site.dbc-global-nav-active .dbc-desktop-mega__quick a.dbc-desktop-mega__cta,
html body.v410-site.dbc-global-nav-active .dbc-desktop-mega__quick a.dbc-desktop-mega__cta span {
  color: #fff !important;
}

body.v410-site .v410-home-footer__legal {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .9rem;
}

body.v410-site .v410-home-footer__legal a {
  color: inherit;
}

body.v410-site .v410-home-footer__legal a:is(:hover, :focus-visible) {
  color: #fff;
}

/* ---------- responsive refinement ---------- */

@media (max-width: 1180px) {
  body.v410-site.dbc-global-nav-active .dbc-desktop-mega__inner {
    grid-template-columns: minmax(9.2rem, .62fr) minmax(28rem, 1.78fr) minmax(10rem, .67fr);
    width: min(73rem, calc(100% - 2.4rem));
    gap: .9rem;
  }

  body.v410-site.dbc-global-nav-active .dbc-desktop-route__desc {
    font-size: .68rem;
  }
}

@media (max-width: 980px) {
  :root {
    --v410-shell: min(100% - 40px, 68rem);
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .formal-footer-cta {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 1.15rem !important;
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .footer-directory.footer-directory {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1.7rem 1.4rem !important;
  }

  body.v410-site .v410-home-footer__top {
    grid-template-columns: minmax(0, 1fr);
    gap: 2.3rem;
  }

  body.v410-site .v410-home-footer__directory {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.7rem 1.4rem;
  }
}

@media (max-width: 760px) {
  :root {
    --v410-shell: min(100% - 32px, 42rem);
  }

  html {
    scroll-padding-top: 4.9rem;
  }

  html body.v410-site.dbc-global-nav-active .site-header.site-header,
  html body.v410-site.dbc-global-nav-active .site-header .header-inner {
    min-height: 4rem !important;
  }

  body.v410-site :is(
    .about-anchor-nav,
    .packaging-anchor,
    .resources-page-nav,
    .news-business-anchor-wrap,
    .knowledge-anchor-nav,
    .bioten-product-nav,
    .pl-anchor-nav,
    .v245-local-nav,
    .vp-anchor-nav
  ) {
    top: 4rem !important;
  }

  body.v410-site:not(.dbc-home-page) :is(.about-bioten-hero, .request-hero) {
    min-height: 0 !important;
  }

  body.v410-site:not(.dbc-home-page) :is(
    .about-hero-copy,
    .request-hero-inner,
    .formal-hero__inner,
    .v245-hero__grid,
    .dv2-hero__grid,
    .dv21-hero__grid
  ) {
    width: var(--v410-shell) !important;
  }

  body.v410-site:not(.dbc-home-page) :is(
    .about-hero-copy,
    .request-hero-copy,
    .formal-hero__copy,
    .v245-hero__copy,
    .dv2-hero__copy,
    .dv21-hero__copy
  ) h1 {
    max-width: 100% !important;
    font-size: clamp(2.2rem, 10.5vw, 3.15rem) !important;
    line-height: 1.06 !important;
  }

  body.v410-site:not(.dbc-home-page) :is(
    .home-band,
    .formal-section,
    .v245-section,
    .dv2-section,
    .dv21-progressive,
    .request-shell
  ) {
    padding-block: clamp(3.5rem, 13vw, 5rem) !important;
  }

  body.v410-site:not(.dbc-home-page) :is(
    .home-section-title,
    .formal-section-head,
    .v245-section__head,
    .dv2-section__head,
    .dv21-section-intro,
    .request-intro
  ) h2 {
    max-width: 100% !important;
    font-size: clamp(1.9rem, 8.6vw, 2.7rem) !important;
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .formal-footer-cta {
    padding-block: 2rem !important;
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .formal-footer-cta h2 {
    font-size: clamp(1.6rem, 7vw, 2.1rem) !important;
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .formal-footer-cta__actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .formal-footer-cta__actions a.formal-button {
    width: 100% !important;
    padding-inline: .6rem !important;
    text-align: center;
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .footer-inner.footer-inner {
    padding: 1.75rem 0 1rem !important;
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .footer-note.footer-note {
    margin-bottom: 1.15rem !important;
    font-size: .74rem !important;
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .footer-directory.footer-directory {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0 !important;
    padding-bottom: 1rem !important;
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .footer-column.footer-column {
    border-bottom: 1px solid var(--v410-line) !important;
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .footer-column.footer-column h3 {
    margin: 0 !important;
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .v270-footer-toggle {
    position: relative;
    width: 100%;
    min-height: 3rem;
    padding: .78rem 2rem .78rem 0;
    border: 0;
    color: var(--v410-blue-deep) !important;
    background: transparent !important;
    font-size: .75rem;
    font-weight: 680;
    text-align: left;
    cursor: pointer;
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .v270-footer-toggle::after {
    position: absolute;
    top: 50%;
    right: .12rem;
    content: "+";
    color: var(--v410-blue);
    font-size: 1rem;
    font-weight: 450;
    transform: translateY(-50%);
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .v270-footer-toggle[aria-expanded="true"]::after {
    content: "−";
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .v270-footer-column:not(.is-v270-open) > a {
    display: none !important;
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .v270-footer-column.is-v270-open > a {
    display: block !important;
    min-height: 2.4rem !important;
    padding: .5rem 0 !important;
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .footer-bottom.footer-bottom {
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: start !important;
    gap: .78rem !important;
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .footer-legal.footer-legal {
    justify-content: flex-start !important;
  }

  body.v410-site .v410-home-footer__inner {
    padding: 3rem 0 1.15rem;
  }

  body.v410-site .v410-home-footer__top {
    gap: 2rem;
    padding-bottom: 1.8rem;
  }

  body.v410-site .v410-home-footer__directory {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem 1.25rem;
  }

  body.v410-site .v410-home-footer__column:nth-child(5) {
    grid-column: 1 / -1;
  }

  body.v410-site .v410-home-footer__bottom {
    align-items: flex-start;
  }
}

@media (max-width: 390px) {
  :root {
    --v410-shell: calc(100% - 28px);
  }

  html body.v410-site[class][class][class] footer.formal-site-footer .formal-footer-cta__actions {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.v410-site .v410-home-footer__directory {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.35rem 1rem;
  }

  body.v410-site .v410-home-footer__column:nth-child(5) {
    grid-column: 1 / -1;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.v410-site *,
  body.v410-site *::before,
  body.v410-site *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

@media (prefers-reduced-transparency: reduce) {
  html body.v410-site.dbc-global-nav-active .site-header.site-header,
  body.v410-site.dbc-global-nav-active .dbc-desktop-mega,
  body.v410-site .dbc-nav-overlay {
    background: #f8fbfc !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}