/* * DBC / BIOTEN V7.31.8 R11 * About-page layout and footer refinement. * Scope is intentionally limited to body[data-v7318-about-layout]. */ html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] { --about-r11-footer-ink: #061827; --about-r11-footer-mid: #082438; --about-r11-footer-line: rgb(197 220 232 / 0.16); --about-r11-footer-copy: rgb(235 243 247 / 0.68); } /* Anchor destinations already inherit the shared shell scroll padding. */ html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .dbc-about > section[id] { scroll-margin-top: -2.5rem !important; } /* Capability path: tighter editorial hierarchy and a clearer five-step read. */ html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .dbc-about-capability { padding-block: clamp(4.5rem, 6vw, 5.6rem); background: linear-gradient(90deg, transparent 0, transparent calc(20% - 0.5px), rgb(16 47 56 / 0.045) 20%, transparent calc(20% + 0.5px)), linear-gradient(180deg, #f5f6f3 0%, #f3f5f2 100%); } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .dbc-about-capability__head { grid-template-columns: minmax(8.5rem, 1.7fr) minmax(25rem, 6.3fr) minmax(18rem, 4fr); gap: clamp(1.75rem, 3.5vw, 3.5rem); align-items: start; } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] main.dbc-about .dbc-about-capability__head h2 { max-width: 12.5ch; font-size: clamp(2.65rem, 4vw, 3.75rem) !important; line-height: 1.055 !important; letter-spacing: -0.05em !important; text-wrap: balance; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .dbc-about-capability__head > p:last-child { align-self: end; max-width: 22rem; border-left: 1px solid rgb(21 72 143 / 0.22); padding-left: 1.25rem; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .dbc-about-capability__chain { margin-top: clamp(2.75rem, 4vw, 3.6rem); } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .dbc-about-capability__chain li { min-height: 9.25rem; padding: 1.05rem 1rem 1.15rem; } /* The patent proof module now follows the same shell and cool material palette. */ html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .pgeo-summary { border-block: 1px solid rgb(16 47 56 / 0.1); background: linear-gradient(135deg, #edf2ef 0%, #f6f6f1 100%); } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .pgeo-summary .pgeo-shell { width: min(calc(100% - clamp(2.5rem, 7vw, 7rem)), 77.5rem); } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] main.dbc-about .pgeo-summary__head h2 { font-size: clamp(2.4rem, 4.35vw, 4.15rem) !important; font-weight: 520 !important; line-height: 1.07 !important; letter-spacing: -0.052em !important; text-wrap: balance; } /* * Corporate footer signature. * The existing semantic footer and shared disclosure behavior stay intact; * only the about-page presentation is reorganized. */ html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.site-footer.formal-site-footer { position: relative; isolation: isolate; border-top: 0 !important; background: radial-gradient(circle at 12% -16%, rgb(255 255 255 / 0.055), transparent 31rem), radial-gradient(circle at 88% 0%, rgb(21 72 143 / 0.2), transparent 36rem), linear-gradient(128deg, var(--about-r11-footer-ink) 0%, var(--about-r11-footer-mid) 55%, #051521 100%) !important; color: #f5f8fa !important; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.site-footer.formal-site-footer::before { position: absolute; z-index: 2; inset: 0 0 auto; height: 1px; background: linear-gradient(90deg, transparent 3%, rgb(91 196 212 / 0.62) 34%, rgb(49 111 187 / 0.72) 67%, transparent 97%); content: ""; pointer-events: none; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"][data-v7301-shared-shell="active"] { --v7301-formal-gap: clamp(0.85rem, 1.65vw, 1.45rem); } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-inner.footer-inner { display: grid !important; width: min(calc(100% - clamp(2.5rem, 7vw, 7rem)), 77.5rem) !important; grid-template-columns: minmax(24rem, 0.82fr) minmax(0, 1.18fr); grid-template-areas: "identity directory" "note directory" "legal legal"; column-gap: clamp(3rem, 6vw, 6rem); row-gap: 0; margin-inline: auto !important; padding: clamp(2.75rem, 4vw, 3.5rem) 0 1.15rem !important; } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-bottom.footer-bottom { display: contents !important; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .v7301-footer-identity { grid-area: identity; width: 100%; max-width: 29rem; grid-template-columns: 10.25rem minmax(0, 1fr); align-self: start; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .v7301-footer-identity__mark { width: 10.25rem; border-color: rgb(255 255 255 / 0.12); box-shadow: 0 0.75rem 2.25rem rgb(0 0 0 / 0.12), inset 0 1px 0 rgb(255 255 255 / 0.09); } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-note.footer-note { grid-area: note; width: auto !important; max-width: 28.5rem !important; margin: 1.55rem 0 0 !important; border: 0 !important; border-left: 1px solid rgb(91 196 212 / 0.45) !important; padding: 0 0 0 1rem !important; color: var(--about-r11-footer-copy) !important; font-size: 0.76rem !important; line-height: 1.75 !important; text-align: left !important; } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-directory.footer-directory { grid-area: directory; align-self: start; padding: 0 !important; border: 0 !important; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-column.footer-column h3 { margin: 0 0 0.8rem !important; color: #f4f8fb !important; font-size: 0.73rem !important; font-weight: 680 !important; line-height: 1.4 !important; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .v7301-footer-disclosure__links { gap: 0.48rem; } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-column.footer-column a { color: rgb(230 239 244 / 0.7) !important; font-size: 0.69rem !important; line-height: 1.48 !important; transition: color 160ms ease, transform 160ms ease; } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-column.footer-column a:is(:hover, :focus-visible) { color: #fff !important; transform: translateX(0.15rem); } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-legal.footer-legal { display: flex !important; grid-area: legal; min-height: 2.5rem; flex-wrap: wrap !important; gap: 0.45rem 1.05rem !important; align-items: center; justify-content: flex-end !important; margin: clamp(1.45rem, 2.4vw, 2rem) 0 0 !important; border-top: 1px solid var(--about-r11-footer-line) !important; padding: 0.9rem 0 0 !important; color: rgb(230 239 244 / 0.62) !important; font-size: 0.66rem !important; line-height: 1.5 !important; } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-legal :is(a, span) { color: inherit !important; font-size: inherit !important; line-height: inherit !important; } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-legal span:last-child { order: -1; margin-right: auto; } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-legal a:is(:hover, :focus-visible) { color: #f7fbfd !important; } /* Avoid awkward automatic hyphenation in narrow English headings and labels. */ html[lang^="en"] body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .dbc-about :is(h1, h2, h3, p, strong, small, span, a), html[lang^="en"] body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer :is(h3, p, strong, span, a) { hyphens: none !important; word-break: normal !important; overflow-wrap: break-word !important; } @media (max-width: 56.25rem) { html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .dbc-about > section[id] { scroll-margin-top: -4.75rem !important; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .dbc-about-capability__head { grid-template-columns: minmax(7.5rem, 1.8fr) minmax(0, 6.2fr); gap: 1.25rem 2rem; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .dbc-about-capability__head > p:last-child { grid-column: 2; max-width: 34rem; align-self: start; border-left: 0; border-top: 1px solid rgb(21 72 143 / 0.18); padding: 1rem 0 0; } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-inner.footer-inner { grid-template-columns: minmax(0, 1fr); grid-template-areas: "identity" "note" "directory" "legal"; padding-top: 2.6rem !important; } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-note.footer-note { max-width: 38rem !important; margin: 1.35rem 0 2.25rem !important; } } @media (max-width: 37.5rem) { html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .dbc-about-capability { padding-block: 3.25rem; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .dbc-about-capability__head { grid-template-columns: minmax(0, 1fr); gap: 0.55rem; } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] main.dbc-about .dbc-about-capability__head h2 { max-width: 13ch; font-size: clamp(2rem, 9.5vw, 2.55rem) !important; line-height: 1.08 !important; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .dbc-about-capability__head > p:last-child { grid-column: 1; max-width: none; margin-top: 0.55rem; padding-top: 0.85rem; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .dbc-about-capability__chain { margin-top: 2.2rem; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .dbc-about-capability__chain li { min-height: 8.25rem; padding: 0.95rem 0.85rem 1rem; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] .pgeo-summary .pgeo-shell { width: calc(100% - 2rem); } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-inner.footer-inner { width: calc(100% - 2rem) !important; padding: 2rem 0 1rem !important; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .v7301-footer-identity { max-width: 100%; grid-template-columns: minmax(0, 1fr); gap: 0.7rem; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .v7301-footer-identity__mark { width: min(100%, 9.4rem); } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .v7301-footer-identity__copy { grid-template-columns: repeat(2, minmax(0, auto)); grid-template-rows: repeat(2, minmax(0, auto)); column-gap: 1rem; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .v7301-footer-identity__copy strong { grid-column: 1 / -1; } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-note.footer-note { max-width: none !important; margin: 1.15rem 0 1.75rem !important; padding-left: 0.8rem !important; font-size: 0.73rem !important; line-height: 1.7 !important; } html body[class][class][class][class][class][class][class].dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-directory.footer-directory { border-top: 1px solid var(--about-r11-footer-line) !important; padding-bottom: 0 !important; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .v7301-footer-disclosure { border-bottom-color: var(--about-r11-footer-line) !important; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .v7301-footer-disclosure > summary { min-height: 3.1rem; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-column.footer-column h3 { margin: 0 !important; font-size: 0.72rem !important; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-legal.footer-legal { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.45rem 0.9rem !important; justify-items: start; margin-top: 1.25rem !important; padding-top: 1rem !important; } html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer .footer-legal span:last-child { order: 0; grid-column: 1 / -1; margin-right: 0; } } @media (prefers-reduced-motion: reduce) { html body.dbc-about-page[data-v7318-about-layout="scope-footer-r11"] footer.formal-site-footer * { transition: none !important; } }