/*
 * DBC / BIOTEN V2.7.2
 * Responsive composition, mobile readability and navigation refinement.
 *
 * This layer is intentionally additive. The approved homepage hero copy,
 * particle sequence and normal desktop / portrait composition are preserved.
 */

/* ---------- resilient shared geometry ---------- */

body.v270-site,
body.v270-site *,
body.v270-site *::before,
body.v270-site *::after {
  box-sizing: border-box;
}

body.v270-site :where(main, section, article, aside, nav, form, fieldset, figure, div) {
  min-inline-size: 0;
}

body.v270-site :where(img, picture, video, canvas, svg) {
  max-inline-size: 100%;
}

body.v270-site :where(
  .matrix-scroll,
  .table-wrap,
  .decision-table-wrap,
  .routing-table-wrap,
  .pro-table-wrap,
  .market-table-wrap,
  .bioten-table-wrap
) {
  max-inline-size: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
}

body.v270-site main :where(pre, code, samp) {
  max-inline-size: 100%;
}

body.v270-site main pre {
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}

/* ---------- desktop mega menu: readable and safe at short heights ---------- */

@media (min-width: 861px) {
  body.v270-site .dbc-desktop-mega-layer.is-open {
    pointer-events: auto;
  }

  body.v270-site .dbc-desktop-mega {
    max-block-size: calc(100dvh - var(--dbc-header-height, 4.5rem));
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
  }

  body.v270-site .dbc-desktop-route__copy small {
    font-size: max(10px, .625rem);
    line-height: 1.25;
  }

  body.v270-site .dbc-desktop-route__desc,
  body.v270-site .dbc-desktop-mega__quick > a {
    font-size: max(12px, .75rem);
  }

  body.v270-site .dbc-desktop-mega__quick > p {
    font-size: max(10px, .625rem);
  }

  body.v270-site .dbc-desktop-mega__intro > p:not(.dbc-desktop-mega__eyebrow) {
    font-size: max(12.5px, .8rem);
  }

  html body.v270-site.dbc-global-nav-active .site-header.site-header .header-inner.header-inner {
    display: grid !important;
    grid-template-columns: minmax(8rem, 1fr) auto minmax(8rem, 1fr) !important;
    grid-template-rows: auto !important;
    column-gap: 1rem !important;
  }

  html body.v270-site.dbc-global-nav-active .site-header.site-header .brand-logos {
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: start !important;
    inline-size: clamp(8rem, 13vw, 10.75rem) !important;
    min-inline-size: 8rem !important;
    max-inline-size: 10.75rem !important;
  }

  html body.v270-site.dbc-global-nav-active .site-header.site-header .dbc-desktop-nav {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: center !important;
    inline-size: max-content !important;
    max-inline-size: 100% !important;
    margin: 0 !important;
  }

  html body.v270-site.dbc-global-nav-active .site-header.site-header .dbc-header-actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    margin: 0 !important;
  }
}

@media (min-width: 861px) and (max-height: 760px) {
  body.v270-site .dbc-desktop-mega__inner {
    min-block-size: 0;
    padding-block: 1rem 1.1rem;
  }

  body.v270-site .dbc-desktop-mega__intro::before {
    margin-block-end: .75rem;
  }

  body.v270-site .dbc-desktop-mega__intro > p:not(.dbc-desktop-mega__eyebrow) {
    margin-block: .55rem .7rem;
  }

  body.v270-site .dbc-desktop-route {
    grid-template-rows: 4.6rem minmax(0, 1fr);
    block-size: 13.25rem;
    min-block-size: 13.25rem;
  }

  body.v270-site .dbc-desktop-route__copy {
    padding: .7rem .82rem .65rem;
  }

  body.v270-site .dbc-desktop-route__copy::before {
    left: .82rem;
  }

  body.v270-site .dbc-desktop-mega__quick > a,
  body.v270-site .dbc-desktop-mega__quick > a.dbc-desktop-mega__cta {
    min-block-size: 2.3rem;
  }
}

@media (min-width: 861px) and (max-width: 1180px) {
  body.v270-site .dbc-desktop-mega__quick {
    grid-template-columns: auto repeat(var(--dbc-nav-quick-count, 5), minmax(0, 1fr));
  }
}

@media (min-width: 861px) and (max-height: 620px) {
  body.v270-site .dbc-desktop-mega__inner {
    padding-block: .8rem .9rem;
  }

  body.v270-site .dbc-desktop-route {
    grid-template-rows: 4rem minmax(0, 1fr);
    block-size: 11.75rem;
    min-block-size: 11.75rem;
  }

  body.v270-site .dbc-desktop-route__desc {
    line-height: 1.45;
  }
}

/* ---------- mobile navigation: independent composition ---------- */

@media (max-width: 860px) {
  body.v270-site .dbc-nav-overlay {
    overscroll-behavior: contain;
    scroll-padding-block-start: calc(4rem + env(safe-area-inset-top));
    backdrop-filter: blur(10px) saturate(112%);
    -webkit-backdrop-filter: blur(10px) saturate(112%);
  }

  body.v270-site .dbc-nav-topbar {
    min-block-size: calc(4rem + env(safe-area-inset-top));
    padding-block-start: env(safe-area-inset-top);
  }

  body.v270-site .dbc-nav-stage {
    padding-block-end: calc(3rem + env(safe-area-inset-bottom));
  }

  body.v270-site .dbc-nav-primary button,
  body.v270-site .dbc-nav-card,
  body.v270-site .dbc-nav-quick > a,
  body.v270-site .dbc-nav-utilities a,
  body.v270-site .dbc-nav-back,
  body.v270-site .dbc-nav-close {
    touch-action: manipulation;
  }

  body.v270-site .dbc-nav-card__copy small {
    font-size: max(10px, .625rem);
    line-height: 1.25;
  }

  body.v270-site .dbc-nav-card__copy strong {
    font-size: max(15px, .94rem);
    line-height: 1.32;
  }

  body.v270-site .dbc-nav-card__copy em,
  body.v270-site .dbc-nav-primary__copy small,
  body.v270-site .dbc-nav-panel-head > p:last-child {
    font-size: max(12px, .75rem);
    line-height: 1.5;
  }

  body.v270-site .dbc-nav-quick > a,
  body.v270-site .dbc-nav-utilities a {
    min-block-size: 44px;
    font-size: max(12px, .75rem);
  }

  body.v270-site .dbc-nav-close,
  body.v270-site .dbc-nav-back {
    min-inline-size: 44px;
    min-block-size: 44px;
  }

  body.v270-site .dbc-nav-back {
    position: sticky;
    z-index: 4;
    top: calc(4rem + env(safe-area-inset-top));
    inline-size: fit-content;
    margin-block: -1rem .9rem;
    padding-inline: .7rem;
    border: 1px solid rgba(7, 52, 95, .1);
    border-radius: 999px;
    background: rgba(248, 251, 253, .94);
    box-shadow: 0 8px 24px rgba(6, 31, 53, .07);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }

  body.v270-site .dbc-nav-card__copy em {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  html[lang="en"] body.v270-site .dbc-nav-overlay :is(
    p,
    h2,
    h3,
    small,
    strong,
    em,
    a,
    button
  ) {
    overflow-wrap: anywhere !important;
    word-break: normal !important;
  }
}

@media (max-width: 720px) {
  body.v270-site .dbc-nav-card {
    border-radius: 0;
  }
}

@media (max-width: 860px) and (orientation: landscape) and (max-height: 520px) {
  body.v270-site .dbc-nav-topbar {
    min-block-size: calc(3.5rem + env(safe-area-inset-top));
  }

  body.v270-site .dbc-nav-stage {
    padding-block-start: 1rem;
  }

  body.v270-site .dbc-nav-root-grid,
  body.v270-site .dbc-nav-panel-body {
    gap: 1.4rem;
  }

  body.v270-site :is(.dbc-nav-directory > h2, .dbc-nav-panel-head > h2) {
    font-size: clamp(1.75rem, 5.3vw, 2.35rem);
  }

  body.v270-site .dbc-nav-primary {
    margin-block-start: .65rem;
  }

  body.v270-site .dbc-nav-primary button {
    min-block-size: 3.45rem;
  }

  body.v270-site .dbc-nav-panel-body {
    margin-block-start: 1rem;
  }
}

@media (max-width: 360px) {
  html body.v270-site.dbc-global-nav-active .site-header.site-header .header-inner.header-inner {
    padding-inline: .55rem !important;
    column-gap: .3rem !important;
  }

  html body.v270-site.dbc-global-nav-active .site-header.site-header .brand-logos {
    inline-size: 6.55rem !important;
    min-inline-size: 6.55rem !important;
    max-inline-size: 6.55rem !important;
  }

  html body.v270-site.dbc-global-nav-active .dbc-header-actions .language-toggle.language-toggle {
    inline-size: 3.65rem !important;
    min-inline-size: 3.65rem !important;
    max-inline-size: 3.65rem !important;
  }

  html body.v270-site.dbc-global-nav-active .site-header.site-header .dbc-nav-trigger {
    min-inline-size: 4rem !important;
    padding-inline: .48rem !important;
  }

  body.v270-site .dbc-nav-stage {
    inline-size: calc(100% - 1.35rem);
  }
}

/* ---------- family context strip and mobile controls ---------- */

@media (max-width: 560px) {
  .v270-context__identity {
    display: none;
  }

  .v270-context__inner {
    grid-template-columns: 1fr;
    padding-block: 0;
  }

  .v270-context__links {
    padding-inline-end: .4rem;
    mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 1.75rem), transparent 100%);
    -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 1.75rem), transparent 100%);
  }

  .v270-context__links a {
    min-block-size: 44px;
    font-size: .75rem;
  }

  body.v270-site main :where(input, select, textarea) {
    font-size: 16px !important;
  }

  body.v270-site main :where(a[href], button, input, select, textarea) {
    touch-action: manipulation;
  }

  body.v270-site:not([data-v270-family="home"]) main h1 {
    max-inline-size: 100%;
    overflow-wrap: anywhere;
  }

  body.v270-site:not([data-v270-family="home"]) main :where(p, li, dd, figcaption, td, th) {
    overflow-wrap: anywhere;
  }

  body.v270-site main :where(
    .table-wrap,
    .matrix-scroll,
    .decision-table-wrap,
    .routing-table-wrap,
    .table-card
  ) {
    border-radius: 12px;
  }
}

@media (max-width: 760px) {
  body.v270-site.nav-editorial-page :is(
    h1,
    h2,
    h3,
    p,
    li,
    dd,
    dt,
    td,
    th,
    a,
    button,
    small,
    strong
  ) {
    word-break: normal !important;
    overflow-wrap: anywhere !important;
  }

  html[lang="en"] body.v270-site.nav-editorial-page :is(
    h1,
    h2,
    h3,
    p,
    li,
    dd,
    dt,
    td,
    th,
    a,
    button,
    small,
    strong
  ) {
    word-break: normal !important;
    overflow-wrap: break-word !important;
    hyphens: auto !important;
  }

  html body.newsroom-article-v233 #main-content .news-article-actions .news-article-action-pdf {
    block-size: auto !important;
    min-block-size: 44px !important;
    padding: .65rem .85rem !important;
  }

  body.v270-site .formal-site-footer .v270-footer-column.is-v270-open > a {
    min-block-size: 44px !important;
  }

  body.v270-site .v270-visual-disclaimer {
    inset: .65rem .65rem auto;
    max-inline-size: min(32rem, calc(100% - 1.3rem));
    padding: .65rem .72rem;
    font-size: 12px;
    line-height: 1.45;
  }
}

/* ---------- homepage: stronger editorial readability below the locked hero ---------- */

@media (min-width: 701px) {
  body.home-v271 .v271-business-node > span,
  body.home-v271 .v271-business-applications a > span {
    font-size: 10px;
  }

  body.home-v271 .v271-business-node > small {
    font-size: 12px;
    line-height: 1.52;
  }

  body.home-v271 .v271-business-applications a > strong {
    font-size: 14.5px;
  }

  body.home-v271 .v271-business-applications a > small {
    font-size: 11.5px;
    line-height: 1.48;
  }

  body.home-v271 .v271-news-item p {
    font-size: 10.5px;
  }

  body.home-v271 .v271-news-item h3 {
    font-size: 15px;
    line-height: 1.34;
  }

  body.home-v271 .v271-news-item small {
    font-size: 12px;
    line-height: 1.42;
  }
}

@media (max-width: 700px) {
  body.v270-site.home-v262.home-v271 .v260-news-record {
    display: grid;
    min-block-size: 0;
    grid-template-columns: 1fr;
    gap: 16px;
  }

  body.v270-site.home-v262.home-v271 .v260-news-record figure {
    inline-size: 100%;
    block-size: auto;
    min-block-size: 0;
    max-block-size: none;
    aspect-ratio: 16 / 10;
  }

  body.v270-site.home-v262.home-v271 .v260-news-record h3 {
    font-size: 20px;
    line-height: 1.28;
  }

  body.v270-site.home-v262.home-v271 .v260-news-record small {
    font-size: 13px;
    line-height: 1.55;
  }

  body.v270-site.home-v262.home-v271 .v260-news-record > div > p {
    font-size: 10.5px;
  }

  body.v270-site.home-v262 .v261-mechanism__head p {
    font-size: 10.5px;
  }

  body.v270-site.home-v262 .v261-mechanism__steps strong,
  body.v270-site.home-v262 .v261-mechanism.v260-strength__media figcaption span,
  body.v270-site.home-v262 .v260-capability-path a > strong {
    font-size: 12px;
  }

  body.v270-site.home-v262 .v261-afteruse > div strong,
  body.v270-site.home-v262 .v262-afteruse-boundary {
    font-size: 12px;
  }

  body.v270-site.home-v262 .v261-afteruse li {
    font-size: 11.5px;
  }

  body.v270-site.home-v262 .v260-strength__media {
    min-block-size: 460px;
  }

  body.home-v271 .v271-business-node,
  body.home-v271 .v271-business-applications > a,
  body.home-v271 .v271-news-item,
  body.home-v271 .v271-news-portals > a {
    touch-action: manipulation;
  }

  body.home-v271 .v271-business-node > i,
  body.home-v271 .v271-business-applications a > i,
  body.home-v271 .v271-news-item > i {
    font-size: 1rem;
  }

  body.home-v271 .v260-footer__brand p {
    font-size: 12.5px;
    line-height: 1.55;
  }

  body.home-v271 .v260-footer__primary a {
    min-block-size: 44px;
    font-size: 12px;
  }

  body.home-v271 .v260-footer__legal {
    padding-block-end: env(safe-area-inset-bottom);
    font-size: 10.5px;
  }
}

@media (max-width: 420px) {
  body.home-v271 .v271-news-item {
    grid-template-columns: 96px minmax(0, 1fr) 14px;
    gap: 10px;
  }

  body.home-v271 .v271-news-item figure {
    inline-size: 96px;
    block-size: 68px;
  }
}

@media (max-width: 380px) {
  body.v270-site.home-v262.home-v271 .v260-news-record figure {
    block-size: auto;
    aspect-ratio: 16 / 10;
  }
}

/* The approved portrait and desktop hero stay untouched. On a short landscape
   phone the chapter becomes a deliberate scroll composition so no copy is
   clipped merely because the browser height is small. */
@media (max-width: 860px) and (orientation: landscape) and (max-height: 520px) {
  html body.home-v271.home-v23 #main-content > .v23-hero.v23-hero,
  html body.home-v271.home-v23 #main-content .v23-hero__copy.v240-hero__copy {
    min-block-size: 31rem !important;
  }

  html body.home-v271.home-v23 #main-content .v23-hero__copy.v240-hero__copy,
  html[lang="en"] body.home-v271.home-v23 #main-content .v23-hero__copy.v240-hero__copy {
    padding: 12.5rem 1.25rem 2.25rem !important;
  }
}

/* Wide phones in landscape are still touch devices. They use the mobile
   overlay and naturally sized homepage chapters even when their CSS width is
   greater than the normal 860px breakpoint. */
@media (orientation: landscape) and (max-height: 560px) and (pointer: coarse) {
  body.v270-site .dbc-desktop-nav,
  body.v270-site .dbc-desktop-mega-layer {
    display: none !important;
  }

  body.v270-site .dbc-nav-trigger {
    display: inline-flex !important;
  }

  body.v270-site .dbc-nav-overlay[hidden] {
    display: none !important;
  }

  body.v270-site .dbc-nav-overlay:not([hidden]) {
    display: block !important;
  }

  body.v270-site .dbc-nav-overlay {
    scroll-padding-block-start: calc(3.5rem + env(safe-area-inset-top));
    backdrop-filter: blur(10px) saturate(112%);
    -webkit-backdrop-filter: blur(10px) saturate(112%);
  }

  body.v270-site .dbc-nav-topbar {
    min-block-size: calc(3.5rem + env(safe-area-inset-top));
    padding-block-start: env(safe-area-inset-top);
  }

  body.v270-site .dbc-nav-back {
    position: sticky;
    z-index: 4;
    top: calc(3.5rem + env(safe-area-inset-top));
    min-inline-size: 44px;
    min-block-size: 44px;
    inline-size: fit-content;
    margin-block: -.5rem .75rem;
    padding-inline: .7rem;
    border: 1px solid rgba(7, 52, 95, .1);
    border-radius: 999px;
    background: rgba(248, 251, 253, .94);
    box-shadow: 0 8px 24px rgba(6, 31, 53, .07);
  }

  html body.v270-site.dbc-global-nav-active .site-header.site-header .header-inner.header-inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    min-block-size: 4rem !important;
    padding: .5rem .875rem !important;
    column-gap: .625rem !important;
  }

  html body.v270-site.dbc-global-nav-active .site-header.site-header .brand-logos {
    grid-column: 1 !important;
    justify-self: start !important;
    inline-size: 8rem !important;
    min-inline-size: 8rem !important;
    max-inline-size: 8rem !important;
  }

  html body.v270-site.dbc-global-nav-active .site-header.site-header .dbc-header-actions {
    grid-column: 2 !important;
    justify-self: end !important;
    margin: 0 !important;
  }

  body.v270-site .dbc-nav-stage {
    inline-size: min(100% - 2.5rem, 52rem);
    padding-block: 1rem calc(2rem + env(safe-area-inset-bottom));
  }

  body.v270-site .dbc-nav-root-grid,
  body.v270-site .dbc-nav-panel-body {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.35rem;
  }

  body.v270-site .dbc-nav-panel-body {
    margin-block-start: 1rem;
  }

  body.v270-site .dbc-nav-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
  }

  body.v270-site .dbc-nav-quick {
    padding: 1rem 0 0;
    border-block-start: 1px solid var(--dbc-nav-line);
    border-inline-start: 0;
  }

  body.home-v271 #main-content > .v260-screen,
  body.home-v271 :is(
    .v260-strength__stage,
    .v260-business__stage,
    .v260-updates,
    .v260-updates__stage
  ) {
    block-size: auto;
    min-block-size: auto;
  }

  body.home-v271 #main-content > .v260-screen {
    overflow: clip;
  }
}

/* ---------- inner-page mobile polish ---------- */

@media (max-width: 720px) {
  body.v270-site:not([data-v270-family="home"]) main :where(
    .formal-actions,
    .v245-actions,
    .resource-actions,
    .news-article-actions
  ) {
    flex-wrap: wrap;
  }

  body.v270-site:not([data-v270-family="home"]) main :where(
    .formal-actions,
    .v245-actions,
    .resource-actions,
    .news-article-actions
  ) > :where(a, button) {
    min-block-size: 44px;
    max-inline-size: 100%;
  }

  body.v270-site .news-article-body,
  body.v270-site .news-article-content {
    inline-size: 100%;
    max-inline-size: 100%;
  }

  body.v270-site :where(.news-original-figure, .openai-news-image, .news-article-body figure) {
    max-inline-size: 100%;
    margin-inline: 0;
  }

  body.v270-site .formal-site-footer {
    padding-block-end: env(safe-area-inset-bottom);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.v270-site .dbc-desktop-mega,
  body.v270-site .dbc-nav-overlay,
  body.v270-site .dbc-nav-view {
    scroll-behavior: auto !important;
  }
}
