/* KAMUI_DC_WEB_20261016: shared JP / EN. This asset loads globally;
 * every rule is scoped to this page, including motion and breakpoints. */
.qm-data-center-page { --qm-dc-blue: var(--qm-color-primary-dark); --qm-dc-rule: #cddbe9; color: var(--qm-color-text); background: var(--qm-bg-standard); line-height: 1.8; word-break: normal; overflow-wrap: break-word; }
.qm-data-center-page *, .qm-data-center-page *::before, .qm-data-center-page *::after { box-sizing: border-box; }
.qm-data-center-page .qm-container { width: min(calc(100% - 64px), 1200px); max-width: 1200px; margin-inline: auto; padding: 0; }
.qm-data-center-page .qm-dc-section { padding-block: 72px; }
.qm-data-center-page [id] { scroll-margin-top: 112px; }
.qm-data-center-page p { margin: 0 0 20px; }
.qm-data-center-page h2 { margin: 0; color: inherit; font-size: 34px; font-weight: 700; line-height: 1.5; letter-spacing: -.025em; text-wrap: pretty; }
.qm-data-center-page h3 { margin: 0 0 12px; color: inherit; font-size: 21px; font-weight: 700; line-height: 1.5; text-wrap: pretty; }
.qm-data-center-page h4 { margin: 22px 0 10px; color: inherit; font-size: 20px; font-weight: 700; line-height: 1.5; }
/* Reuse the shared label typography and rule. Product's introductory labels
 * use this blue and an 18px gap before the heading. */
.qm-data-center-page .qm-dc-label.qm-section-label { margin: 0 0 18px; color: #0867d7; }
.qm-data-center-page .qm-dc-heading { margin-bottom: 16px; }
.qm-data-center-page .qm-dc-intro { max-width: 1000px; margin-bottom: 32px; font-size: 16px; }
.qm-data-center-page .qm-dc-grid { display: grid; gap: 32px; }
.qm-data-center-page .qm-dc-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.qm-data-center-page .qm-dc-grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.qm-data-center-page .qm-dc-rule-card { min-width: 0; padding: 24px 0 0; border-top: 1px solid var(--qm-dc-rule); }
.qm-data-center-page .qm-dc-rule-card > p:last-child { margin-bottom: 0; }
.qm-data-center-page .qm-dc-eyebrow { display: block; margin: 0 0 10px; color: var(--qm-dc-blue); font-size: 12px; font-weight: 700; line-height: 1.7; letter-spacing: .12em; }
.qm-data-center-page .qm-dc-split { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.qm-data-center-page .qm-dc-split > * { min-width: 0; }
.qm-data-center-page .qm-dc-split--top { align-items: start; }
.qm-data-center-page .qm-dc-note { margin: 28px 0 0; color: var(--qm-color-muted); font-size: 14px; line-height: 1.85; }
/* OUR APPROACH: compact cards matching Product's WHY IMMERSION COOLING. */
.qm-data-center-page #qm-dc-approach > .qm-container { container-name: qm-dc-approach; container-type: inline-size; }
.qm-data-center-page #qm-dc-approach .qm-dc-approach-break { display: none; }
.qm-data-center-page #qm-dc-approach .qm-dc-approach-items { display: grid; gap: 20px; }
.qm-data-center-page #qm-dc-approach .qm-dc-approach-item { display: grid; min-width: 0; grid-template-columns: minmax(0, 1fr) 64px; grid-template-rows: auto 3px auto; align-content: start; align-items: start; gap: 16px 18px; padding: 24px; border: 1px solid rgba(47, 125, 246, .28); border-radius: 20px; background: linear-gradient(145deg, #eef9ff, #d9effb); box-shadow: 0 14px 30px rgba(42, 91, 128, .1); }
.qm-data-center-page #qm-dc-approach .qm-dc-approach-item > div { display: contents; }
.qm-data-center-page #qm-dc-approach .qm-dc-approach-item h3 { min-width: 0; grid-column: 1; grid-row: 1; margin: 0; color: #102b45; font-size: 22px; }
.qm-data-center-page #qm-dc-approach .qm-dc-approach-item::after { display: block; width: 42px; height: 3px; grid-column: 1; grid-row: 2; border-radius: 999px; background: #1679c8; content: ""; }
.qm-data-center-page #qm-dc-approach .qm-dc-approach-item p { min-width: 0; grid-column: 1 / -1; grid-row: 3; margin: 0; color: #111b2c; font-size: 16px; line-height: 1.8; }
.qm-data-center-page #qm-dc-approach .qm-dc-approach-icon { display: block; width: 64px; height: 64px; grid-column: 2; grid-row: 1; justify-self: end; margin: 0; color: #1679c8; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.qm-data-center-page #qm-dc-approach > .qm-container > .qm-dc-note { color: #000; font-size: 16px; font-weight: 400; line-height: 1.8; }
@media (min-width: 1025px) {
    .qm-data-center-page #qm-dc-approach .qm-dc-approach-break { display: block; }
    .qm-data-center-page #qm-dc-approach .qm-dc-approach-item { padding: 28px; }
    .qm-data-center-page #qm-dc-approach .qm-dc-approach-item h3 { font-size: 24px; }
    .qm-data-center-page #qm-dc-approach .qm-dc-approach-item p { font-size: 17px; }
}
/* Keep the content-width breakpoint: three cards at 60em (normally 960px).
 * Enlarged text raises the threshold so cards return to one column. */
@container qm-dc-approach (min-width: 60em) {
    .qm-data-center-page #qm-dc-approach .qm-dc-approach-items { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: auto 3px auto; gap: 16px 24px; }
    /* Shared tracks align headings, accent lines and descriptions across all
     * three cards. Their height follows the text, including wrapped EN copy. */
    .qm-data-center-page #qm-dc-approach .qm-dc-approach-item { grid-row: span 3; grid-template-rows: subgrid; }
}
@media (max-width: 700px) {
    .qm-data-center-page #qm-dc-approach .qm-dc-approach-item { grid-template-columns: minmax(0, 1fr) 44px; gap: 14px 16px; padding: 20px; }
    .qm-data-center-page #qm-dc-approach .qm-dc-approach-icon { width: 44px; height: 44px; }
    .qm-data-center-page #qm-dc-approach .qm-dc-approach-item h3 { font-size: 20px; }
}
.qm-data-center-page .qm-dc-media { margin: 0; }
.qm-data-center-page figcaption { margin-top: 12px; color: var(--qm-color-muted); font-size: 14px; line-height: 1.8; }
/* Final images can fill the existing wrapper without rebuilding the layout. */
.qm-data-center-page .qm-dc-placeholder { position: relative; display: flex; aspect-ratio: 3 / 2; width: 100%; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 24px; border: 1px solid #cbd2db; background: #e8ecf1; color: #5a6675; text-align: center; font-size: 14px; line-height: 1.8; }
.qm-data-center-page .qm-dc-placeholder > span { font-size: 13px; }
.qm-data-center-page .qm-dc-placeholder strong { display: block; color: inherit; font-weight: 500; }
.qm-data-center-page .qm-dc-placeholder--facility { aspect-ratio: 3 / 2; }
.qm-data-center-page .qm-dc-placeholder--cooling, .qm-data-center-page .qm-dc-placeholder--interior { aspect-ratio: 16 / 9; }
.qm-data-center-page .qm-dc-placeholder > img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: contain; }
.qm-data-center-page .qm-dc-product { min-width: 0; padding-top: 24px; border-top: 1px solid var(--qm-dc-rule); }
.qm-data-center-page .qm-dc-product h3 { margin-bottom: 18px; font-size: 26px; }
.qm-data-center-page .qm-dc-product > p:last-child { margin-bottom: 0; }
/* This boundary has one total gap, shared by the two adjacent sections. */
.qm-data-center-page #qm-dc-approach { padding-bottom: 40px; }
.qm-data-center-page #qm-dc-scalability { padding-top: 40px; }
.qm-data-center-page #qm-dc-scalability .qm-dc-sentence,
.qm-data-center-page #qm-dc-scalability .qm-dc-note-line { display: block; }
.qm-data-center-page #qm-dc-scalability > .qm-container { container-name: qm-dc-scalability; container-type: inline-size; }
/* Normal flow first: the note follows the intro until both columns fit. */
.qm-data-center-page #qm-dc-scalability .qm-dc-scalability-overview { margin-bottom: 28px; }
.qm-data-center-page #qm-dc-scalability .qm-dc-scalability-overview > .qm-dc-intro { min-width: 0; margin: 0; }
.qm-data-center-page #qm-dc-scalability .qm-dc-scalability-overview > .qm-dc-note { min-width: 0; margin: 20px 0 0; color: #000; font-size: 14px; font-weight: 400; line-height: 1.6; }
/* The label keeps its established position. Shared rows place the note at
 * the title's top, with the intro below the title and outside the note. */
@container qm-dc-scalability (min-width: 66em) {
    .qm-data-center-page #qm-dc-scalability .qm-dc-scalability-overview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 32px; align-items: start; }
    .qm-data-center-page #qm-dc-scalability .qm-dc-scalability-overview > .qm-dc-heading { display: grid; grid-column: 1 / 3; grid-row: 1 / 3; grid-template-rows: subgrid; align-self: stretch; margin-bottom: 0; }
    .qm-data-center-page #qm-dc-scalability .qm-dc-scalability-overview > .qm-dc-intro { grid-column: 1 / 3; grid-row: 3; margin-top: 16px; }
    /* Offset only the note within the existing clearance. Relative positioning
     * retains its Grid track size, so the product list stays at the same top. */
    .qm-data-center-page #qm-dc-scalability .qm-dc-scalability-overview > .qm-dc-note { position: relative; top: 20px; grid-column: 3; grid-row: 2 / 4; margin: 0; }
}
/* Shared intrinsic rows keep media, rack counts and copy aligned even when
 * the EN rack heading wraps or text is enlarged. Never crop the source art. */
.qm-data-center-page #qm-dc-scalability .qm-dc-product { position: relative; display: grid; grid-row: span 5; grid-template-rows: subgrid; row-gap: 0; align-content: start; border-top: 2px solid #1683ff; }
/* Decorative dividers occupy only the space between product columns. */
.qm-data-center-page #qm-dc-scalability .qm-dc-product + .qm-dc-product::after { position: absolute; inset-block: 0; inset-inline-start: -16px; width: 1px; background: #d5dfeb; content: ""; }
.qm-data-center-page #qm-dc-scalability .qm-dc-eyebrow { color: #005cff; font-family: Arial, Helvetica, sans-serif; font-size: 13px; font-weight: 700; letter-spacing: .2em; }
.qm-data-center-page #qm-dc-scalability .qm-dc-product h3 { font-family: "Arial Black", Arial, Helvetica, sans-serif; font-size: 28px; font-weight: 900; line-height: 1.4; letter-spacing: .01em; }
.qm-data-center-page #qm-dc-scalability .qm-dc-product-symbol { font-family: Georgia, "Times New Roman", serif; font-weight: 700; }
.qm-data-center-page #qm-dc-scalability .qm-dc-product-media { width: 100%; aspect-ratio: 16 / 9; margin: 0; }
.qm-data-center-page #qm-dc-scalability .qm-dc-product-media img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: left top; }
@media (max-width: 1024px) {
    .qm-data-center-page #qm-dc-approach { padding-bottom: 26px; }
    .qm-data-center-page #qm-dc-scalability { padding-top: 26px; }
    .qm-data-center-page #qm-dc-scalability .qm-dc-scalability-overview > .qm-dc-note { font-size: 15px; }
    .qm-data-center-page #qm-dc-scalability .qm-dc-product { display: block; }
    .qm-data-center-page #qm-dc-scalability .qm-dc-product + .qm-dc-product::after { display: none; }
    .qm-data-center-page #qm-dc-scalability .qm-dc-product-media { max-width: 480px; }
    .qm-data-center-page #qm-dc-scalability .qm-dc-product h4 { margin-top: 22px; }
}
.qm-data-center-page .qm-dc-pue { display: flex; align-items: baseline; flex-wrap: wrap; gap: 16px; color: var(--qm-dc-blue); }
.qm-data-center-page .qm-dc-pue strong { font-size: 76px; line-height: 1.2; letter-spacing: -.04em; }
.qm-data-center-page .qm-dc-pue span { font-size: 22px; font-weight: 700; }
.qm-data-center-page .qm-dc-detail-list { margin: 0; border-top: 1px solid var(--qm-dc-rule); }
.qm-data-center-page .qm-dc-detail-list > div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 28px; padding-block: 22px; border-bottom: 1px solid var(--qm-dc-rule); }
.qm-data-center-page .qm-dc-detail-list dt { font-size: 16px; font-weight: 700; }
.qm-data-center-page .qm-dc-detail-list dd { margin: 0; color: var(--qm-color-muted); font-size: 16px; }
/* Only the SCALABILITY / IMMERSION boundary: 40 + 40px, 26 + 26px below. */
.qm-data-center-page #qm-dc-scalability { padding-bottom: 40px; }
.qm-data-center-page #qm-dc-immersion { padding-top: 40px; color: #111; }
.qm-data-center-page #qm-dc-immersion .qm-dc-split { grid-template-rows: max-content 1fr; row-gap: 24px; }
.qm-data-center-page #qm-dc-immersion .qm-dc-media { grid-column: 2; grid-row: 1 / 3; }
.qm-data-center-page #qm-dc-immersion .qm-dc-split > div > p:not(.qm-dc-pue) { font-size: 16px; line-height: 1.8; }
.qm-data-center-page #qm-dc-immersion .qm-dc-split > div > p:last-child { margin-bottom: 0; }
.qm-data-center-page #qm-dc-immersion figcaption,
.qm-data-center-page #qm-dc-immersion .qm-dc-note { color: #111; }
.qm-data-center-page #qm-dc-immersion .qm-dc-note { grid-column: 1; grid-row: 2; align-self: start; margin: 0; font-size: 14px; line-height: 1.75; }
.qm-data-center-page #qm-dc-immersion .qm-dc-diagram-panel { display: block; width: 100%; margin: 0; padding: 0; border: 1px solid #d4dce6; border-radius: 6px; background: #fff; box-shadow: none; cursor: zoom-in; }
.qm-data-center-page #qm-dc-immersion .qm-dc-diagram-panel img { display: block; width: 100%; height: auto; border-radius: inherit; }
.qm-data-center-page #qm-dc-immersion .qm-dc-diagram-hint { display: block; margin-top: 8px; color: #111; font-size: 14px; line-height: 1.7; }
.qm-data-center-page #qm-dc-immersion .qm-dc-diagram-action { display: inline-flex; max-width: 100%; min-height: 28px; align-items: center; gap: 6px; margin: 12px 0 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: #111; font-family: inherit; font-size: 14px; font-weight: 400; line-height: 1.7; text-align: start; text-decoration: underline; text-underline-offset: 3px; cursor: zoom-in; }
.qm-data-center-page #qm-dc-immersion .qm-dc-diagram-action:focus-visible { outline: 2px solid #1474e8; outline-offset: 4px; }
.qm-data-center-page #qm-dc-immersion .qm-dc-desktop-break { display: none; }
@media (min-width: 1025px) {
    .qm-data-center-page #qm-dc-immersion .qm-dc-desktop-break { display: initial; }
    /* Keep both track widths and the left copy's wrapping unchanged. Move the
     * figure group through the gutter, leaving that space at the right edge. */
    .qm-data-center-page #qm-dc-immersion .qm-dc-split {
        --qm-dc-figure-shift: clamp(0px, calc((100vw - 1200px) * .166666667), 40px);
        --qm-dc-figure-column: calc((100% - 48px) / 2);
        grid-template-columns: repeat(2, minmax(0, var(--qm-dc-figure-column)));
        column-gap: clamp(8px, calc(48px - var(--qm-dc-figure-shift)), 48px);
    }
}
.qm-data-center-page #qm-dc-immersion .qm-dc-diagram-key-title { margin: 12px 0 6px; color: #111; font-size: 14px; font-weight: 600; }
.qm-data-center-page #qm-dc-immersion .qm-dc-diagram-key { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; margin: 0; color: #111; font-size: 14px; line-height: 1.6; }
.qm-data-center-page #qm-dc-immersion .qm-dc-diagram-key > div { min-width: 0; }
.qm-data-center-page #qm-dc-immersion .qm-dc-diagram-key dt { font-weight: 600; }
.qm-data-center-page #qm-dc-immersion .qm-dc-diagram-key dd { margin: 0; }
@media (max-width: 1024px) {
    .qm-data-center-page #qm-dc-scalability { padding-bottom: 26px; }
    .qm-data-center-page #qm-dc-immersion { padding-top: 26px; }
    .qm-data-center-page #qm-dc-immersion .qm-dc-split { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; gap: 24px; }
    .qm-data-center-page #qm-dc-immersion .qm-dc-media,
    .qm-data-center-page #qm-dc-immersion .qm-dc-note { grid-column: auto; grid-row: auto; }
    .qm-data-center-page #qm-dc-immersion .qm-dc-note { font-size: 15px; }
}
.qm-data-center-page .qm-dc-step-number { display: inline-block; margin-right: 16px; color: var(--qm-dc-blue); font-size: 13px; font-weight: 700; }
/* IMMERSION / EXPERIENCE boundary only; retain all immersion inner geometry. */
.qm-data-center-page #qm-dc-immersion { padding-bottom: 40px; }
.qm-data-center-page #qm-dc-experience { padding-top: 40px; }
.qm-data-center-page #qm-dc-experience .qm-dc-experience-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 14px 48px; margin: 0; }
.qm-data-center-page #qm-dc-experience .qm-dc-experience-photo { display: block; width: 100%; height: auto; }
.qm-data-center-page #qm-dc-experience .qm-dc-copy { min-width: 0; }
.qm-data-center-page #qm-dc-experience .qm-dc-copy > .qm-dc-eyebrow { margin: 0 0 8px; font-size: 18px; font-weight: 700; line-height: 1.5; letter-spacing: .08em; }
.qm-data-center-page #qm-dc-experience .qm-dc-copy h3 { margin-bottom: 16px; }
.qm-data-center-page #qm-dc-experience .qm-dc-experience-paragraph { margin: 0; color: #111; }
.qm-data-center-page #qm-dc-experience .qm-dc-experience-paragraph + .qm-dc-experience-paragraph { margin-top: 24px; }
.qm-data-center-page #qm-dc-experience .qm-dc-experience-sentence { display: block; }
.qm-data-center-page #qm-dc-experience .qm-dc-experience-layout > figcaption { grid-column: 1 / -1; margin: 0; color: #111; font-size: 14px; line-height: 1.8; }
@media (min-width: 1025px) {
    /* Photo track = 78% of its former half; retain the copy's measure, 48px gutter and full-width caption. */
    .qm-data-center-page #qm-dc-experience .qm-dc-experience-layout { grid-template-columns: minmax(0, calc((100% - 48px) * .39)) minmax(0, calc((100% - 48px) / 2)) minmax(0, 1fr); }
}
@media (max-width: 1024px) {
    .qm-data-center-page #qm-dc-immersion { padding-bottom: 26px; }
    .qm-data-center-page #qm-dc-experience { padding-top: 26px; }
    .qm-data-center-page #qm-dc-experience .qm-dc-experience-layout { grid-template-columns: minmax(0, 1fr); }
    .qm-data-center-page #qm-dc-experience .qm-dc-copy > .qm-dc-eyebrow { font-size: 16px; }
    .qm-data-center-page #qm-dc-experience .qm-dc-experience-layout > figcaption { font-size: 15px; }
}
/* SYSTEM EXAMPLE and its preceding boundary only. */
.qm-data-center-page #qm-dc-experience { padding-bottom: 40px; }
.qm-data-center-page #qm-dc-system { padding-top: 40px; color: #111; }
.qm-data-center-page #qm-dc-system .qm-dc-system-overview { --qm-dc-system-media-shift: clamp(0px, calc((100vw - 1200px) * .333333333), 80px); grid-template-columns: minmax(0, calc(100% - 550px - var(--qm-dc-system-media-shift))) minmax(0, 510px); align-items: start; gap: 18px 40px; }
.qm-data-center-page #qm-dc-system .qm-dc-system-overview > .qm-dc-heading { grid-column: 1 / -1; margin: 0; }
.qm-data-center-page #qm-dc-system .qm-dc-system-overview > .qm-dc-heading .qm-dc-label { margin-bottom: 0; }
.qm-data-center-page #qm-dc-system .qm-dc-system-copy h2 { margin: 0 0 24px; }
.qm-data-center-page #qm-dc-system .qm-dc-system-title-line { display: block; }
.qm-data-center-page #qm-dc-system .qm-dc-system-copy h3 { margin: 0 0 16px; font-size: 24px; line-height: 1.5; }
.qm-data-center-page #qm-dc-system .qm-dc-system-copy p { margin: 0 0 12px; color: #111; font-size: 16px; line-height: 1.8; }
.qm-data-center-page #qm-dc-system .qm-dc-system-copy p:last-child { margin-bottom: 0; }
.qm-data-center-page #qm-dc-system .qm-dc-system-load strong { color: var(--qm-dc-blue); font-size: 22px; font-weight: 700; }
.qm-data-center-page #qm-dc-system .qm-dc-system-media { min-width: 0; margin: 0; }
.qm-data-center-page #qm-dc-system .qm-dc-system-image { display: block; width: 100%; margin: 0; padding: 0; border: 0; border-radius: 6px; background: transparent; box-shadow: none; cursor: zoom-in; }
.qm-data-center-page #qm-dc-system .qm-dc-system-image img { display: block; width: 100%; height: auto; border-radius: inherit; }
.qm-data-center-page #qm-dc-system .qm-dc-system-media figcaption { display: flex; flex-wrap: wrap; align-items: start; justify-content: space-between; gap: 8px 16px; margin: 10px 0 0; color: #111; font-size: 14px; line-height: 1.7; }
.qm-data-center-page #qm-dc-system .qm-dc-system-caption-text { min-width: 0; max-width: 100%; }
.qm-data-center-page #qm-dc-system .qm-dc-system-enlarge { display: inline-flex; max-width: 100%; min-height: 28px; align-items: center; gap: 6px; margin: 0 0 0 auto; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: #111; font-family: inherit; font-size: 14px; font-weight: 400; line-height: 1.7; text-align: start; text-decoration: underline; text-underline-offset: 3px; cursor: zoom-in; }
.qm-data-center-page #qm-dc-system .qm-dc-system-enlarge:focus-visible { outline: 2px solid #1474e8; outline-offset: 4px; }
.qm-data-center-page #qm-dc-system .qm-dc-diagram { margin: 28px 0 0; }
.qm-data-center-page #qm-dc-system .qm-dc-container-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.qm-data-center-page #qm-dc-system .qm-dc-container-unit { display: block; min-width: 0; min-height: 156px; padding: 14px 20px; border: 1px solid #bbd0e7; border-radius: 8px; color: #111; text-align: start; }
.qm-data-center-page #qm-dc-system .qm-dc-container-unit--server { background: #e6f0fc; }
.qm-data-center-page #qm-dc-system .qm-dc-container-unit--cooling { background: #e5f5f8; }
.qm-data-center-page #qm-dc-system .qm-dc-container-unit--power { background: #f0f5fc; }
.qm-data-center-page #qm-dc-system .qm-dc-unit-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.qm-data-center-page #qm-dc-system .qm-dc-unit-number { color: var(--qm-dc-blue); font-size: 16px; font-weight: 700; line-height: 1.5; }
.qm-data-center-page #qm-dc-system .qm-dc-unit-icon { display: block; width: 28px; height: 28px; flex: 0 0 auto; color: var(--qm-dc-blue); stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.qm-data-center-page #qm-dc-system .qm-dc-container-unit h4 { margin: 0 0 6px; color: #111; font-size: 18px; font-weight: 700; line-height: 1.5; }
.qm-data-center-page #qm-dc-system .qm-dc-container-unit p { margin: 0; color: #111; font-size: 15px; line-height: 1.65; }
.qm-data-center-page #qm-dc-system .qm-dc-container-unit p > span { display: block; }
.qm-data-center-page #qm-dc-system .qm-dc-diagram > figcaption { display: flex; flex-wrap: wrap; gap: 4px 28px; margin: 14px 0 0; color: #111; font-size: 14px; line-height: 1.8; }
.qm-data-center-page #qm-dc-system .qm-dc-note { margin: 20px 0 0; color: #111; font-size: 14px; line-height: 1.8; }
.qm-data-center-page #qm-dc-system .qm-dc-note > span { display: block; }
@media (max-width: 1199px) {
    .qm-data-center-page #qm-dc-system .qm-dc-system-overview { grid-template-columns: minmax(0, 1fr); }
    .qm-data-center-page #qm-dc-system .qm-dc-system-media { width: 100%; max-width: 510px; }
}
@media (max-width: 1024px) {
    .qm-data-center-page #qm-dc-experience { padding-bottom: 26px; }
    .qm-data-center-page #qm-dc-system { padding-top: 26px; }
    .qm-data-center-page #qm-dc-system .qm-dc-system-media { width: 100%; max-width: 460px; }
    .qm-data-center-page #qm-dc-system .qm-dc-container-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .qm-data-center-page #qm-dc-system .qm-dc-note,
    .qm-data-center-page #qm-dc-system .qm-dc-diagram > figcaption,
    .qm-data-center-page #qm-dc-system .qm-dc-system-media figcaption,
    .qm-data-center-page #qm-dc-system .qm-dc-system-enlarge { font-size: 15px; }
}
@media (max-width: 700px) {
    .qm-data-center-page #qm-dc-system .qm-dc-system-caption-text { flex-basis: 100%; }
    .qm-data-center-page #qm-dc-system .qm-dc-system-copy h3 { font-size: 22px; }
    .qm-data-center-page #qm-dc-system .qm-dc-container-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
    .qm-data-center-page #qm-dc-system .qm-dc-container-unit { min-height: 0; }
}
/* SITE & ENGINEERING and the SYSTEM EXAMPLE boundary only. */
.qm-data-center-page #qm-dc-system { padding-bottom: 40px; }
.qm-data-center-page #qm-dc-engineering { padding-top: 40px; }
.qm-data-center-page #qm-dc-engineering .qm-dc-intro,
.qm-data-center-page #qm-dc-engineering .qm-dc-engineering-copy p,
.qm-data-center-page #qm-dc-engineering .qm-dc-note { color: #111; }
.qm-data-center-page #qm-dc-engineering .qm-dc-engineering-list { margin: 0; padding: 0; list-style: none; }
.qm-data-center-page #qm-dc-engineering .qm-dc-engineering-list > li { display: grid; grid-template-columns: max-content 60px minmax(0, 1fr); align-items: start; gap: 12px 28px; padding-block: 20px; border-bottom: 1px solid var(--qm-dc-rule); }
.qm-data-center-page #qm-dc-engineering .qm-dc-step-number { width: 2.5ch; margin: 0; color: var(--qm-dc-blue); font-size: 18px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.6; white-space: nowrap; }
.qm-data-center-page #qm-dc-engineering .qm-dc-engineering-icon { display: block; width: 60px; height: 60px; color: var(--qm-dc-blue); stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.qm-data-center-page #qm-dc-engineering .qm-dc-engineering-copy { min-width: 0; word-break: normal; overflow-wrap: normal; hyphens: none; }
.qm-data-center-page #qm-dc-engineering .qm-dc-engineering-copy h3 { margin: 0 0 6px; font-size: 16px; font-weight: 700; line-height: 1.8; }
.qm-data-center-page #qm-dc-engineering .qm-dc-engineering-copy p { margin: 0; font-size: 16px; line-height: 1.8; text-wrap: pretty; }
@media (max-width: 1024px) {
    .qm-data-center-page #qm-dc-system { padding-bottom: 26px; }
    .qm-data-center-page #qm-dc-engineering { padding-top: 26px; }
}
@media (max-width: 700px) {
    .qm-data-center-page #qm-dc-engineering .qm-dc-engineering-list > li { grid-template-columns: max-content 44px minmax(0, 1fr); column-gap: 14px; }
    .qm-data-center-page #qm-dc-engineering .qm-dc-step-number,
    .qm-data-center-page #qm-dc-engineering .qm-dc-engineering-icon { grid-row: 1; }
    .qm-data-center-page #qm-dc-engineering .qm-dc-engineering-icon { width: 44px; height: 44px; }
    .qm-data-center-page #qm-dc-engineering .qm-dc-engineering-copy { display: contents; }
    .qm-data-center-page #qm-dc-engineering .qm-dc-engineering-copy h3 { grid-column: 3; grid-row: 1; margin: 0; }
    .qm-data-center-page #qm-dc-engineering .qm-dc-engineering-copy p { grid-column: 1 / -1; grid-row: 2; word-break: normal; overflow-wrap: normal; hyphens: none; }
}
/* PROJECT FLOW and its preceding boundary only. Shared rows align deliverables. */
.qm-data-center-page #qm-dc-engineering { padding-bottom: 40px; }
.qm-data-center-page #qm-dc-flow { padding-top: 40px; }
.qm-data-center-page #qm-dc-flow .qm-dc-intro,
.qm-data-center-page #qm-dc-flow .qm-dc-process p { color: #111; }
.qm-data-center-page #qm-dc-flow .qm-dc-process--four { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px 32px; }
.qm-data-center-page #qm-dc-flow .qm-dc-process--four > li { display: grid; grid-row: span 4; grid-template-columns: minmax(0, 1fr); grid-template-rows: subgrid; row-gap: 14px; padding: 20px; border: 1px solid #bfd2e8; border-top: 3px solid #0867d7; border-radius: 8px; background: #e9f2fc; box-shadow: none; }
.qm-data-center-page #qm-dc-flow .qm-dc-flow-card-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.qm-data-center-page #qm-dc-flow .qm-dc-eyebrow { margin: 0; font-size: 14px; }
.qm-data-center-page #qm-dc-flow .qm-dc-flow-icon { display: block; width: 44px; height: 44px; flex: 0 0 auto; color: var(--qm-dc-blue); stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.qm-data-center-page #qm-dc-flow .qm-dc-process h3,
.qm-data-center-page #qm-dc-flow .qm-dc-process p { margin: 0; }
.qm-data-center-page #qm-dc-flow .qm-dc-process p { word-break: normal; overflow-wrap: break-word; text-wrap: pretty; }
.qm-data-center-page #qm-dc-flow .qm-dc-process .qm-dc-deliverable { margin: 0; padding-top: 14px; border-top: 1px solid #c5d7e9; color: #111; }
.qm-data-center-page #qm-dc-flow .qm-dc-flow-copy-break { display: none; }
.qm-data-center-page #qm-dc-flow .qm-dc-process--four > li:not(:last-child)::after { top: calc(50% - 10px); right: -26px; bottom: auto; width: 20px; height: 20px; color: var(--qm-dc-blue); font-size: 18px; line-height: 20px; text-align: center; content: "→"; }
@media (min-width: 1025px) {
    .qm-data-center-page #qm-dc-flow .qm-dc-flow-sentence { display: block; }
}
@media (min-width: 1200px) {
    .qm-data-center-page #qm-dc-flow.qm-dc-flow-copy-breaks .qm-dc-flow-copy-break { display: initial; }
    .qm-data-center-page #qm-dc-flow.qm-dc-flow-readable .qm-dc-process--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .qm-data-center-page #qm-dc-flow.qm-dc-flow-readable .qm-dc-process--four > li:nth-child(2)::after { display: none; }
}
@media (max-width: 1199px) {
    .qm-data-center-page #qm-dc-flow .qm-dc-process--four { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 14px; }
    .qm-data-center-page #qm-dc-flow .qm-dc-process--four > li:nth-child(2)::after { display: none; }
}
@media (max-width: 1024px) {
    .qm-data-center-page #qm-dc-engineering { padding-bottom: 26px; }
    .qm-data-center-page #qm-dc-flow { padding-top: 26px; }
}
@media (max-width: 700px) {
    .qm-data-center-page #qm-dc-flow .qm-dc-process--four { grid-template-columns: minmax(0, 1fr); row-gap: 36px; }
    .qm-data-center-page #qm-dc-flow .qm-dc-process--four > li { grid-row: auto; grid-template-rows: auto auto auto auto; }
    .qm-data-center-page #qm-dc-flow .qm-dc-process--four > li:not(:last-child)::after { display: block; top: auto; right: calc(50% - 10px); bottom: -28px; content: "↓"; }
}
/* OPERATIONS and its preceding boundary only. */
.qm-data-center-page #qm-dc-flow { padding-bottom: 40px; }
.qm-data-center-page #qm-dc-operations { padding-top: 40px; color: #fff; }
.qm-data-center-page #qm-dc-operations .qm-dc-intro,
.qm-data-center-page #qm-dc-operations h2,
.qm-data-center-page #qm-dc-operations h3,
.qm-data-center-page #qm-dc-operations .qm-dc-operation-copy p,
.qm-data-center-page #qm-dc-operations .qm-dc-note { color: #fff; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-layout { display: grid; grid-template-columns: 380px minmax(0, 1fr); align-items: center; gap: 44px; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-cycle { display: grid; width: 100%; max-width: 380px; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr) minmax(0, 1fr); grid-template-rows: auto auto auto; gap: 8px; align-items: center; margin: 0; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-cycle figcaption { grid-column: 2; grid-row: 2; min-width: 0; margin: 0; color: #fff; font-size: 15.5px; font-weight: 700; line-height: 1.6; text-align: center; word-break: normal; overflow-wrap: break-word; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-center-line { display: block; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-nodes { display: grid; grid-column: 1 / -1; grid-row: 1 / -1; grid-template-columns: subgrid; grid-template-rows: subgrid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-nodes > li { display: flex; width: 114px; max-width: 100%; min-width: 0; flex-direction: column; align-items: center; justify-content: center; align-self: center; justify-self: center; gap: 6px; padding: 10px 5px; border: 1px solid #79cdef; border-radius: 8px; background: rgba(89,216,255,.06); color: #fff; text-align: center; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-nodes > li:nth-child(1) { grid-column: 2; grid-row: 1; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-nodes > li:nth-child(2) { grid-column: 3; grid-row: 2; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-nodes > li:nth-child(3) { grid-column: 2; grid-row: 3; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-nodes > li:nth-child(4) { grid-column: 1; grid-row: 2; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-nodes strong { max-width: 100%; font-size: 15px; font-weight: 700; line-height: 1.5; word-break: normal; overflow-wrap: break-word; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-node-icon,
.qm-data-center-page #qm-dc-operations .qm-dc-ops-support-icon { display: block; width: 28px; height: 28px; flex: 0 0 auto; color: #59d8ff; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-arrow { display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; align-self: stretch; contain: size; color: #59d8ff; stroke: currentColor; stroke-width: 1.5; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-arrow--0 { grid-column: 3; grid-row: 1; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-arrow--1 { grid-column: 3; grid-row: 3; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-arrow--2 { grid-column: 1; grid-row: 3; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-arrow--3 { grid-column: 1; grid-row: 1; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-arrow > path { vector-effect: non-scaling-stroke; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-return { display: none; margin: 14px 0 0; color: #fff; font-size: 14px; line-height: 1.7; text-align: center; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-return > span { color: #59d8ff; }
.qm-data-center-page #qm-dc-operations .qm-dc-operation-copy { min-width: 0; }
.qm-data-center-page #qm-dc-operations .qm-dc-operations-item { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 6px 12px; padding-block: 16px; border-bottom: 1px solid rgba(190,222,241,.24); }
.qm-data-center-page #qm-dc-operations .qm-dc-operations-item:first-child { padding-top: 0; }
.qm-data-center-page #qm-dc-operations .qm-dc-operations-item:last-child { padding-bottom: 0; border-bottom: 0; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-support-icon { grid-column: 1; grid-row: 1; width: 24px; height: 24px; margin-top: 3px; }
.qm-data-center-page #qm-dc-operations .qm-dc-operations-item h3 { grid-column: 2; grid-row: 1; min-width: 0; margin: 0; font-size: 21px; line-height: 1.5; }
.qm-data-center-page #qm-dc-operations .qm-dc-operations-item p { grid-column: 2; grid-row: 2; min-width: 0; margin: 0; font-size: 16px; line-height: 1.8; word-break: normal; overflow-wrap: break-word; text-wrap: pretty; }
.qm-data-center-page #qm-dc-operations .qm-dc-ops-keep { white-space: nowrap; }
.qm-data-center-page #qm-dc-operations .qm-dc-note { margin: 28px 0 0; font-size: 14px; line-height: 1.85; }
@media (min-width: 1025px) {
    .qm-data-center-page #qm-dc-operations .qm-dc-ops-sentence { display: block; }
}
@media (max-width: 1024px) {
    .qm-data-center-page #qm-dc-flow { padding-bottom: 26px; }
    .qm-data-center-page #qm-dc-operations { padding-top: 26px; }
    .qm-data-center-page #qm-dc-operations .qm-dc-ops-layout { grid-template-columns: minmax(0, 1fr); gap: 32px; }
    .qm-data-center-page #qm-dc-operations .qm-dc-ops-cycle { margin-inline: auto; }
}
.qm-data-center-page #qm-dc-operations.qm-dc-ops-linear .qm-dc-ops-layout { grid-template-columns: minmax(0, 1fr); gap: 32px; }
.qm-data-center-page #qm-dc-operations.qm-dc-ops-linear .qm-dc-ops-cycle { display: block; max-width: 520px; margin-inline: auto; }
.qm-data-center-page #qm-dc-operations.qm-dc-ops-linear .qm-dc-ops-cycle figcaption { margin: 0 0 18px; text-align: center; }
.qm-data-center-page #qm-dc-operations.qm-dc-ops-linear .qm-dc-ops-nodes { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; gap: 30px; }
.qm-data-center-page #qm-dc-operations.qm-dc-ops-linear .qm-dc-ops-nodes > li { position: relative; display: grid; width: 100%; grid-column: auto; grid-row: auto; grid-template-columns: 44px minmax(0, 1fr); gap: 12px; padding: 14px; text-align: start; }
.qm-data-center-page #qm-dc-operations.qm-dc-ops-linear .qm-dc-ops-nodes > li:not(:last-child)::after { position: absolute; top: 100%; left: calc(50% - 10px); width: 20px; height: 30px; color: #59d8ff; font-size: 18px; line-height: 30px; text-align: center; content: "↓"; }
.qm-data-center-page #qm-dc-operations.qm-dc-ops-linear .qm-dc-ops-arrow { display: none; }
.qm-data-center-page #qm-dc-operations.qm-dc-ops-linear .qm-dc-ops-return { display: block; }
/* Scale the adopted PC cycle through Grid, retaining the mobile/linear design. */
.qm-data-center-page #qm-dc-operations { --qm-dc-ops-growth: 0px; --qm-dc-ops-node-font: 15px; --qm-dc-ops-center-font: 15.5px; }
@media (min-width: 1025px) {
    /* Reach 580px at the confirmed 1272px CSS viewport, while preserving the
     * established 613.6px wide-screen cycle and readable narrower columns. */
    .qm-data-center-page #qm-dc-operations:not(.qm-dc-ops-linear) { --qm-dc-ops-growth: calc(clamp(0px, calc((100vw - 1100px) * .684), 68.4px) + clamp(0px, calc((100vw - 1200px) * 1.827777778), 131.6px) + clamp(0px, calc((100vw - 1272px) * .2), 33.6px)); --qm-dc-ops-node-font: calc(15px + var(--qm-dc-ops-growth) * .039473684); --qm-dc-ops-center-font: calc(15.5px + var(--qm-dc-ops-growth) * .040789474); }
    .qm-data-center-page #qm-dc-operations:not(.qm-dc-ops-linear) .qm-dc-ops-layout { grid-template-columns: calc(380px + var(--qm-dc-ops-growth)) minmax(0, 1fr); }
    .qm-data-center-page #qm-dc-operations:not(.qm-dc-ops-linear) .qm-dc-ops-cycle { max-width: calc(380px + var(--qm-dc-ops-growth)); gap: calc(8px + var(--qm-dc-ops-growth) * .021052632); }
    .qm-data-center-page #qm-dc-operations:not(.qm-dc-ops-linear) .qm-dc-ops-cycle figcaption { font-size: var(--qm-dc-ops-center-font); }
    .qm-data-center-page #qm-dc-operations:not(.qm-dc-ops-linear) .qm-dc-ops-nodes { gap: calc(8px + var(--qm-dc-ops-growth) * .021052632); }
    .qm-data-center-page #qm-dc-operations:not(.qm-dc-ops-linear) .qm-dc-ops-nodes > li { width: calc(114px + var(--qm-dc-ops-growth) * .3); gap: calc(6px + var(--qm-dc-ops-growth) * .015789474); padding: calc(10px + var(--qm-dc-ops-growth) * .026315789) calc(5px + var(--qm-dc-ops-growth) * .013157895); }
    .qm-data-center-page #qm-dc-operations:not(.qm-dc-ops-linear) .qm-dc-ops-nodes strong { font-size: var(--qm-dc-ops-node-font); }
    .qm-data-center-page #qm-dc-operations:not(.qm-dc-ops-linear) .qm-dc-ops-node-icon { width: calc(28px + var(--qm-dc-ops-growth) * .073684211); height: calc(28px + var(--qm-dc-ops-growth) * .073684211); }
}
/* COMPUTE BUSINESS and its preceding boundary only. */
.qm-data-center-page #qm-dc-operations { padding-bottom: 40px; }
.qm-data-center-page #qm-dc-compute { padding-top: 40px; }
.qm-data-center-page #qm-dc-compute .qm-dc-compute-phrase { display: inline-block; max-width: 100%; }
.qm-data-center-page #qm-dc-compute .qm-dc-intro { max-width: none; margin-bottom: 24px; color: #111; }
.qm-data-center-page #qm-dc-compute .qm-dc-compute-icon { display: block; width: 36px; height: 36px; color: var(--qm-dc-blue); stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.qm-data-center-page #qm-dc-compute .qm-dc-process--compact { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin: 0; padding: 0; list-style: none; }
.qm-data-center-page #qm-dc-compute .qm-dc-process--compact > li { display: grid; min-width: 0; min-height: 78px; grid-template-columns: 36px minmax(0, 1fr); align-items: center; justify-content: start; gap: 12px; padding: 12px 18px; border: 1px solid #c1d5eb; border-radius: 6px; background: #e7f0fc; color: #111; text-align: start; }
.qm-data-center-page #qm-dc-compute .qm-dc-process--compact h3 { min-width: 0; margin: 0; font-size: 19px; line-height: 1.5; word-break: normal; overflow-wrap: normal; }
.qm-data-center-page #qm-dc-compute .qm-dc-process--compact > li:not(:last-child)::after { top: calc(50% - 9px); right: -22px; bottom: auto; width: 16px; color: var(--qm-dc-blue); font-size: 18px; line-height: 18px; text-align: center; content: "→"; }
.qm-data-center-page #qm-dc-compute .qm-dc-channels { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto auto auto; column-gap: 40px; row-gap: 8px; margin-top: 28px; }
.qm-data-center-page #qm-dc-compute .qm-dc-channels > article { display: grid; min-width: 0; grid-row: span 3; grid-template-columns: 40px minmax(0, 1fr); grid-template-rows: subgrid; column-gap: 12px; row-gap: 8px; padding: 16px 0 0; border-top: 2px solid var(--qm-dc-blue); }
.qm-data-center-page #qm-dc-compute .qm-dc-channels .qm-dc-compute-icon { grid-column: 1; grid-row: 1; align-self: center; width: 40px; height: 40px; }
.qm-data-center-page #qm-dc-compute .qm-dc-channels .qm-dc-eyebrow { grid-column: 2; grid-row: 1; align-self: center; margin: 0; color: var(--qm-dc-blue); font-size: 16px; font-weight: 700; letter-spacing: .04em; word-break: normal; overflow-wrap: normal; }
.qm-data-center-page #qm-dc-compute .qm-dc-channels h3 { grid-column: 2; grid-row: 2; margin: 0; color: #111; font-size: 24px; font-weight: 700; }
.qm-data-center-page #qm-dc-compute .qm-dc-channels > article:first-child h3 > .qm-dc-compute-phrase { white-space: nowrap; }
.qm-data-center-page #qm-dc-compute .qm-dc-channels p:last-child { grid-column: 2; grid-row: 3; margin: 0; color: #111; font-size: 17px; }
.qm-data-center-page #qm-dc-compute .qm-dc-note { margin-top: 24px; color: #111; font-size: 14px; line-height: 1.85; }
.qm-data-center-page #qm-dc-compute .qm-dc-actions { display: flex; align-items: flex-start; justify-content: flex-start; margin-top: 22px; }
/* Home's underlined text-and-arrow link, scoped to this section. */
.qm-data-center-page #qm-dc-compute .qm-dc-compute-link { position: relative; display: inline-flex; max-width: 100%; align-items: center; gap: 26px; padding: 0 0 8px; color: var(--qm-dc-blue); font-size: 14px; font-weight: 600; line-height: 1.5; letter-spacing: .04em; text-decoration: none; }
.qm-data-center-page #qm-dc-compute .qm-dc-compute-link > span:first-child { min-width: 0; }
.qm-data-center-page #qm-dc-compute .qm-dc-compute-link > span:last-child { flex: 0 0 auto; font-size: 16px; }
.qm-data-center-page #qm-dc-compute .qm-dc-compute-link::after { position: absolute; right: 0; bottom: 0; left: 0; height: 1px; background: currentColor; content: ""; }
.qm-data-center-page #qm-dc-compute .qm-dc-compute-link:hover { color: #003baf; }
.qm-data-center-page #qm-dc-compute .qm-dc-compute-link:hover::after,
.qm-data-center-page #qm-dc-compute .qm-dc-compute-link:focus-visible::after { height: 2px; }
.qm-data-center-page #qm-dc-compute .qm-dc-compute-link:focus-visible { outline: 2px solid var(--qm-dc-blue); outline-offset: 5px; }
@media (min-width: 1025px) {
    .qm-data-center-page #qm-dc-compute .qm-dc-compute-sentence { display: block; }
}
@media (max-width: 1199px) {
    .qm-data-center-page #qm-dc-compute .qm-dc-process--compact { grid-template-columns: minmax(0, 1fr); }
    .qm-data-center-page #qm-dc-compute .qm-dc-process--compact > li:not(:last-child)::after { top: auto; right: calc(50% - 8px); bottom: -23px; content: "↓"; }
}
@media (max-width: 1024px) {
    .qm-data-center-page #qm-dc-operations { padding-bottom: 26px; }
    .qm-data-center-page #qm-dc-compute { padding-top: 26px; }
    .qm-data-center-page #qm-dc-compute .qm-dc-note { font-size: 15px; }
}
@media (max-width: 700px) {
    .qm-data-center-page #qm-dc-compute .qm-dc-channels { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; row-gap: 24px; }
    .qm-data-center-page #qm-dc-compute .qm-dc-channels > article { grid-row: auto; grid-template-columns: 32px minmax(0, 1fr); grid-template-rows: auto auto auto; }
    .qm-data-center-page #qm-dc-compute .qm-dc-channels .qm-dc-compute-icon { width: 32px; height: 32px; }
    .qm-data-center-page #qm-dc-compute .qm-dc-channels .qm-dc-eyebrow { font-size: 14px; }
    .qm-data-center-page #qm-dc-compute .qm-dc-channels h3 { font-size: 22px; }
    .qm-data-center-page #qm-dc-compute .qm-dc-channels p:last-child { font-size: 16px; }
}
/* PARTNERSHIP and its preceding boundary only. */
.qm-data-center-page #qm-dc-compute { padding-bottom: 40px; }
.qm-data-center-page #qm-dc-partnership { padding-top: 40px; font-size: 16px; }
.qm-data-center-page #qm-dc-partnership > .qm-container > .qm-dc-heading { margin-bottom: 24px; }
.qm-data-center-page #qm-dc-partnership .qm-dc-partnership-phrase { display: inline-block; max-width: 100%; }
.qm-data-center-page #qm-dc-partnership .qm-dc-roles,
.qm-data-center-page #qm-dc-partnership .qm-dc-costs { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 19em), 1fr)); grid-template-rows: auto auto; column-gap: 20px; row-gap: 12px; }
.qm-data-center-page #qm-dc-partnership .qm-dc-role-card { display: grid; min-width: 0; grid-row: span 2; grid-template-rows: subgrid; row-gap: 12px; padding: 20px; border: 1px solid #c1d5eb; border-radius: 8px; background: #e7f0fc; }
.qm-data-center-page #qm-dc-partnership .qm-dc-role-header { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px; }
.qm-data-center-page #qm-dc-partnership .qm-dc-role-header h3 { flex: 1 1 0; min-width: min-content; max-width: 100%; margin: 0; color: #111; font-size: 1.375em; line-height: 1.5; word-break: normal; }
.qm-data-center-page #qm-dc-partnership .qm-dc-role-icon { display: block; width: 40px; height: 40px; flex: 0 0 40px; margin-inline-start: auto; color: var(--qm-dc-blue); stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.qm-data-center-page #qm-dc-partnership .qm-dc-role-card p,
.qm-data-center-page #qm-dc-partnership .qm-dc-cost-card p,
.qm-data-center-page #qm-dc-partnership .qm-dc-estimate > p:not(.qm-dc-note) { min-width: 0; margin: 0; color: #111; font-size: 1em; line-height: 1.8; }
.qm-data-center-page #qm-dc-partnership .qm-dc-estimate { margin-top: 28px; }
.qm-data-center-page #qm-dc-partnership .qm-dc-estimate h3 { margin: 0 0 10px; color: #111; font-size: 1.3125em; line-height: 1.5; }
.qm-data-center-page #qm-dc-partnership .qm-dc-note { color: #111; font-size: .875em; line-height: 1.85; }
.qm-data-center-page #qm-dc-partnership .qm-dc-estimate .qm-dc-note { margin-top: 14px; }
.qm-data-center-page #qm-dc-partnership .qm-dc-costs { margin-top: 28px; }
.qm-data-center-page #qm-dc-partnership .qm-dc-cost-card { display: grid; min-width: 0; grid-row: span 2; grid-template-rows: subgrid; row-gap: 12px; padding: 16px 0 0; border-top: 2px solid var(--qm-dc-blue); }
.qm-data-center-page #qm-dc-partnership .qm-dc-cost-card h3 { display: flex; align-items: flex-start; gap: 12px; margin: 0; color: #111; font-size: 1.3125em; line-height: 1.5; }
.qm-data-center-page #qm-dc-partnership .qm-dc-cost-card .qm-dc-step-number { flex: 0 0 auto; margin: 2px 0 0; color: var(--qm-dc-blue); font-size: .857142857em; }
.qm-data-center-page #qm-dc-partnership .qm-dc-cost-title { min-width: 0; }
.qm-data-center-page #qm-dc-partnership > .qm-container > .qm-dc-note { margin-top: 20px; }
@media (min-width: 1025px) {
    .qm-data-center-page #qm-dc-partnership .qm-dc-partnership-line { display: block; }
}
@media (max-width: 1024px) {
    .qm-data-center-page #qm-dc-compute { padding-bottom: 26px; }
    .qm-data-center-page #qm-dc-partnership { padding-top: 26px; }
    .qm-data-center-page #qm-dc-partnership .qm-dc-note { font-size: .9375em; }
}
@media (max-width: 700px) {
    .qm-data-center-page #qm-dc-partnership .qm-dc-roles,
    .qm-data-center-page #qm-dc-partnership .qm-dc-costs { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; row-gap: 20px; }
    .qm-data-center-page #qm-dc-partnership .qm-dc-role-card,
    .qm-data-center-page #qm-dc-partnership .qm-dc-cost-card { grid-row: auto; grid-template-rows: auto auto; }
    .qm-data-center-page #qm-dc-partnership .qm-dc-role-icon { width: 32px; height: 32px; flex-basis: 32px; }
}
/* Final contact panel and its preceding boundary only. Panel inset counts
 * toward the visible distance from PARTNERSHIP's final note to this label. */
.qm-data-center-page #qm-dc-partnership { padding-bottom: 24px; }
.qm-data-center-page #qm-dc-contact { padding-top: 25px; padding-bottom: 40px; background: var(--qm-bg-standard); color: var(--qm-color-text); font-size: 16px; }
.qm-data-center-page #qm-dc-contact .qm-dc-contact-panel { padding: 30px; border: 1px solid #0878e8; border-radius: 18px; background: #fff; box-shadow: 0 4px 18px rgba(18, 62, 105, .06); }
.qm-data-center-page #qm-dc-contact .qm-dc-contact-copy { padding-inline-start: 24px; container-name: qm-dc-contact-copy; container-type: inline-size; }
.qm-data-center-page #qm-dc-contact .qm-dc-label { color: #0867d7; }
.qm-data-center-page #qm-dc-contact h2 { color: var(--qm-color-text); }
.qm-data-center-page #qm-dc-contact .qm-dc-contact-phrase { display: inline-block; max-width: 100%; }
.qm-data-center-page #qm-dc-contact .qm-dc-intro { max-width: none; margin-bottom: 20px; color: #111; font-size: 1em; }
.qm-data-center-page #qm-dc-contact .qm-dc-contact-topics { grid-template-columns: repeat(auto-fit, minmax(min(100%, 26em), 1fr)); gap: 16px 32px; }
.qm-data-center-page #qm-dc-contact .qm-dc-contact-topics > li { --contact-number-width: max(24px, 1.5em); --contact-icon-size: 40px; display: block; min-width: 0; padding: 12px 0 0; border-top: 1px solid var(--qm-dc-rule); }
.qm-data-center-page #qm-dc-contact .qm-dc-contact-topic-heading { display: grid; grid-template-columns: var(--contact-number-width) var(--contact-icon-size) minmax(0, 1fr); align-items: center; column-gap: 12px; }
.qm-data-center-page #qm-dc-contact .qm-dc-step-number { margin: 0; color: var(--qm-dc-blue); font-size: 1.125em; font-weight: 700; white-space: nowrap; }
.qm-data-center-page #qm-dc-contact .qm-dc-contact-topic-heading h3 { min-width: 0; margin: 0; padding-inline-start: 2px; color: #111; font-size: 1.3125em; line-height: 1.5; word-break: normal; }
.qm-data-center-page #qm-dc-contact .qm-dc-contact-icon { display: block; width: var(--contact-icon-size); height: var(--contact-icon-size); color: var(--qm-dc-blue); stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.qm-data-center-page #qm-dc-contact .qm-dc-contact-topics p { min-width: 0; margin: 6px 0 0 calc(var(--contact-number-width) + var(--contact-icon-size) + 26px); color: #111; font-size: 1em; line-height: 1.8; }
.qm-data-center-page #qm-dc-contact .qm-dc-note { margin: 22px 0 0; color: #111; font-size: .875em; line-height: 1.85; }
.qm-data-center-page #qm-dc-contact .qm-dc-actions { display: flex; align-items: flex-start; justify-content: flex-start; margin-top: 22px; }
.qm-data-center-page #qm-dc-contact .qm-dc-contact-link { position: relative; display: inline-flex; min-height: 44px; max-width: 100%; align-items: center; gap: 26px; padding: 6px 0 8px; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: var(--qm-dc-blue); font-size: .875em; font-weight: 600; line-height: 1.5; letter-spacing: .04em; text-decoration: none; }
.qm-data-center-page #qm-dc-contact .qm-dc-contact-link > span:first-child { min-width: 0; }
.qm-data-center-page #qm-dc-contact .qm-dc-contact-link > span:last-child { flex: 0 0 auto; font-size: 16px; }
.qm-data-center-page #qm-dc-contact .qm-dc-contact-link::after { position: absolute; right: 0; bottom: 4px; left: 0; height: 1px; background: currentColor; content: ""; }
.qm-data-center-page #qm-dc-contact .qm-dc-contact-link:hover { color: #003baf; }
.qm-data-center-page #qm-dc-contact .qm-dc-contact-link:hover::after,
.qm-data-center-page #qm-dc-contact .qm-dc-contact-link:focus-visible::after { height: 2px; }
.qm-data-center-page #qm-dc-contact .qm-dc-contact-link:focus-visible { outline: 2px solid var(--qm-dc-blue); outline-offset: 5px; }
@container qm-dc-contact-copy (min-width: 60em) {
    .qm-data-center-page #qm-dc-contact .qm-dc-contact-line { display: block; }
}
@container qm-dc-contact-copy (max-width: 18em) {
    .qm-data-center-page #qm-dc-contact .qm-dc-contact-topic-heading { row-gap: 6px; }
    .qm-data-center-page #qm-dc-contact .qm-dc-contact-topic-heading h3 { grid-column: 1 / -1; padding-inline-start: 0; }
}
@media (max-width: 1024px) {
    .qm-data-center-page #qm-dc-partnership { padding-bottom: 16px; }
    .qm-data-center-page #qm-dc-contact { padding-top: 15px; padding-bottom: 32px; }
    .qm-data-center-page #qm-dc-contact .qm-dc-contact-panel { padding: 20px; }
    .qm-data-center-page #qm-dc-contact .qm-dc-contact-copy { padding-inline-start: 0; }
    .qm-data-center-page #qm-dc-contact .qm-dc-note { font-size: .9375em; }
}
@media (max-width: 700px) {
    .qm-data-center-page #qm-dc-contact .qm-dc-contact-topics { grid-template-columns: minmax(0, 1fr); }
    .qm-data-center-page #qm-dc-contact .qm-dc-contact-topics > li { --contact-icon-size: 32px; }
    .qm-data-center-page #qm-dc-contact .qm-dc-contact-topics p { margin-inline-start: 0; }
    .qm-data-center-page #qm-dc-contact .qm-dc-contact-link { font-size: .9375em; }
}
/* Photograph -> dark overlay -> text. The overlay never paints over the copy.
 * Keep the existing image and focal point; do not add a white fade. */
.qm-data-center-page .qm-dc-hero.qm-subpage-hero.qm-photo-hero { position: relative; isolation: isolate; height: auto; min-height: 0; padding-block: 44px; background: #071a32; }
.qm-data-center-page .qm-dc-hero.qm-subpage-hero::before { position: absolute; inset: 0; z-index: 0; background: url("../../images/data-center-development/data-center-development.png") center 65% / cover no-repeat; content: ""; }
.qm-data-center-page .qm-dc-hero.qm-subpage-hero.qm-photo-hero::after { position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(3,17,37,.62), rgba(3,17,37,.45) 36%, rgba(3,17,37,.14) 64%, rgba(3,17,37,.02)); pointer-events: none; content: ""; }
.qm-data-center-page .qm-dc-hero.qm-subpage-hero > .qm-subpage-hero__container { position: relative; z-index: 2; }
.qm-data-center-page .qm-dc-hero.qm-subpage-hero .qm-subpage-hero__content { display: block; width: 100%; max-width: 760px; color: #fff; filter: none; mix-blend-mode: normal; }
.qm-data-center-page .qm-dc-hero.qm-subpage-hero .qm-dc-label { color: #fff; }
.qm-data-center-page .qm-dc-hero.qm-subpage-hero .qm-subpage-hero__title { max-width: 760px; margin: 0 0 18px; color: #fff; -webkit-text-fill-color: #fff; opacity: 1; filter: none; mix-blend-mode: normal; font-size: 40px; font-weight: 700; line-height: 1.4; letter-spacing: -.025em; text-wrap: pretty; overflow-wrap: break-word; }
.qm-data-center-page .qm-dc-phrase { display: inline-block; max-width: 100%; }
.qm-data-center-page .qm-dc-hero.qm-subpage-hero .qm-subpage-hero__text { max-width: 600px; margin: 0; color: #fff; font-size: 16px; font-weight: 500; line-height: 1.85; }
.qm-data-center-page .qm-dc-hero-sentence { display: block; }
.qm-data-center-page .qm-dc-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px; }
.qm-data-center-page .qm-dc-button { display: inline-flex; min-height: 48px; max-width: 100%; align-items: center; justify-content: space-between; gap: 24px; padding: 13px 22px; border: 1px solid var(--qm-dc-blue); border-radius: 4px; background: var(--qm-dc-blue); color: #fff; font-size: 14px; font-weight: 700; line-height: 1.6; text-decoration: none; transition: background-color .2s, border-color .2s; }
.qm-data-center-page .qm-dc-button:hover { border-color: #0047a0; background: #0047a0; color: #fff; }
.qm-data-center-page .qm-dc-button > span { flex: 0 0 auto; }
.qm-data-center-page a:focus-visible { outline: 2px solid #2e9de0; outline-offset: 5px; }
/* Home Hero button geometry and states, scoped here to preserve body CTAs. */
.qm-data-center-page .qm-dc-hero .qm-dc-actions { column-gap: 8px; row-gap: 14px; }
.qm-data-center-page .qm-dc-hero-button { position: relative; display: inline-flex; min-width: min(100%, 220px); min-height: 58px; max-width: 100%; align-items: center; justify-content: center; gap: 0; padding: 16px 30px; overflow: hidden; border: 1px solid transparent; border-radius: 999px; color: #fff; font-size: .9375rem; font-weight: 600; line-height: 1.4; letter-spacing: .04em; text-align: center; text-decoration: none; transition: color .35s cubic-bezier(.22,1,.36,1), background-color .35s cubic-bezier(.22,1,.36,1), border-color .35s cubic-bezier(.22,1,.36,1), box-shadow .35s cubic-bezier(.22,1,.36,1), transform .35s cubic-bezier(.22,1,.36,1); }
.qm-data-center-page .qm-dc-hero-button::before { position: absolute; top: 0; left: -120%; width: 100%; height: 100%; background: linear-gradient(110deg, transparent 20%, rgba(255,255,255,.24) 50%, transparent 80%); content: ""; pointer-events: none; transition: left .7s ease; }
.qm-data-center-page .qm-dc-hero-button:hover { transform: translateY(-3px); }
.qm-data-center-page .qm-dc-hero-button:hover::before { left: 120%; }
.qm-data-center-page .qm-dc-hero-button--primary { background: linear-gradient(100deg, #005cff 0%, #2879ff 100%); box-shadow: 0 15px 36px rgba(0,92,255,.3), inset 0 1px 0 rgba(255,255,255,.18); }
.qm-data-center-page .qm-dc-hero-button--primary:hover, .qm-data-center-page .qm-dc-hero-button--primary:focus-visible, .qm-data-center-page .qm-dc-hero-button--primary:active { color: #fff; background: linear-gradient(100deg, #1c6cff 0%, #4b8dff 100%); box-shadow: 0 20px 42px rgba(0,92,255,.38), inset 0 1px 0 rgba(255,255,255,.2); }
.qm-data-center-page .qm-dc-hero-button--secondary { color: rgba(255,255,255,.96); border-color: rgba(190,225,240,.62); background: linear-gradient(135deg, rgba(205,232,242,.16), rgba(145,190,210,.10)); -webkit-backdrop-filter: blur(16px) saturate(115%); backdrop-filter: blur(16px) saturate(115%); box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 8px 24px rgba(0,20,40,.12); }
.qm-data-center-page .qm-dc-hero-button--secondary:hover, .qm-data-center-page .qm-dc-hero-button--secondary:focus-visible { color: #fff; border-color: rgba(210,238,250,.82); background: linear-gradient(135deg, rgba(215,240,248,.24), rgba(160,205,222,.16)); }
.qm-data-center-page .qm-dc-hero .qm-dc-hero-button:focus-visible { outline: 3px solid rgba(89,216,255,.7); outline-offset: 4px; }
/* Ordinary anchor links: wrap rather than introducing a horizontal scroller. */
.qm-data-center-page .qm-dc-index > div { display: flex; flex-wrap: wrap; gap: 10px; padding-block: 18px; }
.qm-data-center-page .qm-dc-index a { display: inline-flex; min-height: 44px; max-width: 100%; align-items: center; justify-content: center; padding: 8px 16px; border: 1px solid #bfd5ed; border-radius: 6px; background: #e7f0fc; color: var(--qm-color-navy); font-size: 14px; font-weight: 600; line-height: 1.6; text-align: center; text-decoration: none; overflow-wrap: anywhere; transition: background-color .2s, border-color .2s, color .2s; }
.qm-data-center-page .qm-dc-index a:hover { border-color: #81afe0; background: #d7e7fb; color: var(--qm-dc-blue); }
.qm-data-center-page .qm-dc-index a:focus-visible { outline: 3px solid var(--qm-dc-blue); outline-offset: 3px; border-color: var(--qm-dc-blue); background: #d7e7fb; }
/* Functional grouping; no invented piping, power feeds or redundancy links. */
.qm-data-center-page .qm-dc-diagram { margin: 32px 0 0; }
.qm-data-center-page .qm-dc-container-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.qm-data-center-page .qm-dc-container-unit { display: flex; min-height: 132px; flex-direction: column; align-items: center; justify-content: flex-start; gap: 12px; padding: 18px 12px; border: 1px solid #b7cce4; border-top: 3px solid var(--qm-dc-blue); background: #e8eff6; text-align: center; font-size: 15px; line-height: 1.65; }
.qm-data-center-page .qm-dc-unit-number { color: var(--qm-dc-blue); font-size: 20px; }
.qm-data-center-page .qm-dc-container-unit--facility { border-top-color: #54889a; }
/* Sequential diagrams: connectors follow the same reading order on mobile. */
.qm-data-center-page .qm-dc-process { display: grid; gap: 30px; margin: 32px 0 0; padding: 0; list-style: none; }
.qm-data-center-page .qm-dc-process--four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.qm-data-center-page .qm-dc-process > li { position: relative; min-width: 0; padding: 22px 0 0; border-top: 2px solid #8cb8e5; }
.qm-data-center-page .qm-dc-process > li:not(:last-child)::after { position: absolute; top: 20px; right: -25px; color: var(--qm-dc-blue); font-size: 20px; line-height: 1; content: "→"; }
.qm-data-center-page .qm-dc-process h3 { font-size: 20px; }
.qm-data-center-page .qm-dc-process p { font-size: 16px; }
.qm-data-center-page .qm-dc-process .qm-dc-deliverable { margin: 16px 0 0; color: var(--qm-color-muted); font-size: 14px; }
.qm-data-center-page .qm-dc-deliverable > span { display: block; }
.qm-data-center-page .qm-dc-process--compact { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.qm-data-center-page .qm-dc-process--compact > li { display: flex; align-items: center; justify-content: center; padding: 24px 16px; border: 1px solid var(--qm-dc-rule); }
.qm-data-center-page .qm-dc-process--compact h3 { margin: 0; font-size: 19px; }
.qm-data-center-page .qm-dc-process--compact > li::after { top: calc(50% - 10px); }
.qm-data-center-page .qm-dc-channels { margin-top: 36px; }
.qm-data-center-page .qm-dc-costs { margin-top: 44px; }
.qm-data-center-page .qm-dc-roles .qm-dc-rule-card { padding-block: 20px; }
.qm-data-center-page .qm-dc-operations { background: var(--qm-color-navy); color: #fff; }
.qm-data-center-page .qm-dc-operations .qm-dc-label { color: #59d8ff; }
.qm-data-center-page .qm-dc-operations .qm-dc-rule-card { border-color: #4b5b72; padding-block: 18px; }
.qm-data-center-page .qm-dc-operations .qm-dc-rule-card h3 { font-size: 20px; }
.qm-data-center-page .qm-dc-operations .qm-dc-note, .qm-data-center-page .qm-dc-operations .qm-dc-rule-card p { color: #e0e8f2; }
.qm-data-center-page .qm-dc-cycle { width: min(100%, 440px); margin: 0 auto; padding: 0 12px; }
.qm-data-center-page .qm-dc-cycle figcaption { margin: 0 0 28px; color: #fff; text-align: center; font-size: 20px; font-weight: 700; }
.qm-data-center-page .qm-dc-cycle ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "a b" "d c"; gap: 38px; margin: 0; padding: 0; list-style: none; }
.qm-data-center-page .qm-dc-cycle li { position: relative; display: flex; min-height: 100px; align-items: center; justify-content: center; padding: 16px 8px; border: 1px solid #8cb5d0; border-radius: 50%; text-align: center; font-size: 17px; font-weight: 700; }
.qm-data-center-page .qm-dc-cycle li:nth-child(1) { grid-area: a; }
.qm-data-center-page .qm-dc-cycle li:nth-child(2) { grid-area: b; }
.qm-data-center-page .qm-dc-cycle li:nth-child(3) { grid-area: c; }
.qm-data-center-page .qm-dc-cycle li:nth-child(4) { grid-area: d; }
.qm-data-center-page .qm-dc-cycle li strong { display: block; min-width: 0; max-width: 100%; font: inherit; overflow-wrap: anywhere; }
.qm-data-center-page .qm-dc-cycle li span { position: absolute; top: calc(50% - 8px); right: -29px; width: 22px; height: 16px; color: #9fdcff; }
.qm-data-center-page .qm-dc-cycle li span::before { position: absolute; top: 7px; left: 0; width: 21px; border-top: 1px solid currentColor; content: ""; }
.qm-data-center-page .qm-dc-cycle li span::after { position: absolute; top: 3px; right: 1px; width: 9px; height: 9px; border-top: 1px solid currentColor; border-right: 1px solid currentColor; transform: rotate(45deg); content: ""; }
.qm-data-center-page .qm-dc-cycle li:nth-child(2) span { top: auto; right: calc(50% - 11px); bottom: -29px; transform: rotate(90deg); }
.qm-data-center-page .qm-dc-cycle li:nth-child(3) span { right: auto; left: -29px; transform: rotate(180deg); }
.qm-data-center-page .qm-dc-cycle li:nth-child(4) span { top: -29px; right: calc(50% - 11px); transform: rotate(-90deg); }
.qm-data-center-page .qm-dc-contact { background: var(--qm-color-primary-dark); color: #fff; }
.qm-data-center-page .qm-dc-contact .qm-dc-label, .qm-data-center-page .qm-dc-contact .qm-dc-note, .qm-data-center-page .qm-dc-contact .qm-dc-step-number { color: #fff; }
.qm-data-center-page .qm-dc-contact-topics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 40px; margin: 0; padding: 0; list-style: none; }
.qm-data-center-page .qm-dc-contact-topics li { display: flex; gap: 8px; padding-top: 20px; border-top: 1px solid #ffffff50; }
.qm-data-center-page .qm-dc-contact-topics .qm-dc-step-number { flex: 0 0 auto; margin-top: 4px; }
.qm-data-center-page .qm-dc-contact-topics p { margin: 0; }
.qm-data-center-page .qm-dc-button--white { border-color: #fff; background: #fff; color: var(--qm-color-primary-dark); }
.qm-data-center-page .qm-dc-button--white:hover { border-color: #dfeeff; background: #dfeeff; color: var(--qm-color-primary-dark); }
.qm-data-center-page .qm-dc-contact a:focus-visible, .qm-data-center-page .qm-dc-hero a:focus-visible { outline-color: #fff; }
/* Company / Product measure 364 CSS px at desktop widths. Keep this as a
 * minimum, with intrinsic content height for text enlargement and wrapping. */
@media (min-width: 1025px) {
    /* One inset per content group: headings, copy, media, diagrams and notes
     * share the same edge. Pull only the chapter label back to the rule edge. */
    .qm-data-center-page .qm-dc-section > .qm-container,
    .qm-data-center-page .qm-dc-hero.qm-subpage-hero .qm-subpage-hero__content { padding-inline-start: 24px; }
    .qm-data-center-page .qm-dc-heading > .qm-dc-label,
    .qm-data-center-page .qm-dc-hero.qm-subpage-hero .qm-dc-label { margin-inline-start: -24px; }
    .qm-data-center-page .qm-dc-section .qm-dc-label { font-size: 14px; letter-spacing: 2.4px; }
    .qm-data-center-page .qm-dc-hero.qm-subpage-hero.qm-photo-hero { display: flex; align-items: center; min-height: 364px; padding-block: 32px; }
    .qm-data-center-page .qm-dc-hero.qm-subpage-hero .qm-dc-label { margin-bottom: 14px; }
    .qm-data-center-page .qm-dc-hero.qm-subpage-hero .qm-subpage-hero__title { margin-bottom: 14px; line-height: 1.25; }
    .qm-data-center-page .qm-dc-hero.qm-subpage-hero .qm-subpage-hero__text { line-height: 1.65; }
    .qm-data-center-page .qm-dc-hero .qm-dc-actions { margin-top: 18px; }
}
@media (max-width: 1024px) {
    .qm-data-center-page .qm-container { width: min(calc(100% - 40px), 900px); }
    .qm-data-center-page .qm-dc-section { padding-block: 56px; }
    .qm-data-center-page h2 { font-size: 30px; }
    .qm-data-center-page .qm-dc-split { gap: 30px; }
    .qm-data-center-page .qm-dc-grid { gap: 24px; }
    .qm-data-center-page .qm-dc-process--four { grid-template-columns: 1fr; }
    .qm-data-center-page .qm-dc-process--four > li { padding: 20px 0 12px; }
    .qm-data-center-page .qm-dc-process--four > li:not(:last-child)::after { top: auto; bottom: -27px; right: calc(50% - 10px); content: "↓"; }
    .qm-data-center-page .qm-dc-container-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .qm-data-center-page .qm-dc-hero.qm-subpage-hero.qm-photo-hero { padding-block: 48px 32px; }
    .qm-data-center-page .qm-dc-hero.qm-subpage-hero::before { background-position: right 65%; }
    .qm-data-center-page .qm-dc-hero.qm-subpage-hero .qm-subpage-hero__title { font-size: 36px; }
    .qm-data-center-page .qm-dc-products { grid-template-columns: 1fr; }
    .qm-data-center-page .qm-dc-product { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 30px; align-items: start; }
    .qm-data-center-page .qm-dc-product > .qm-dc-placeholder { grid-column: 2; grid-row: 1 / 5; }
    .qm-data-center-page .qm-dc-product h4 { margin-top: 0; }
}
@media (max-width: 700px) {
    .qm-data-center-page .qm-dc-section { padding-block: 46px; }
    .qm-data-center-page h2 { font-size: var(--qm-mobile-section-title-size); line-height: var(--qm-mobile-section-title-leading); }
    .qm-data-center-page h3 { font-size: 20px; }
    .qm-data-center-page .qm-dc-split, .qm-data-center-page .qm-dc-grid, .qm-data-center-page .qm-dc-contact-topics { grid-template-columns: minmax(0, 1fr); gap: 26px; }
    .qm-data-center-page .qm-dc-product { display: block; }
    .qm-data-center-page .qm-dc-product h4 { margin-top: 20px; }
    .qm-data-center-page .qm-dc-hero.qm-subpage-hero.qm-photo-hero { min-height: 0; padding-block: 44px 30px; }
    .qm-data-center-page .qm-dc-hero.qm-subpage-hero::before { background-position: 58% center; }
    .qm-data-center-page .qm-dc-hero.qm-subpage-hero.qm-photo-hero::after { background: linear-gradient(90deg, rgba(3,17,37,.68), rgba(3,17,37,.38)); }
    .qm-data-center-page .qm-dc-hero.qm-subpage-hero .qm-subpage-hero__title { font-size: clamp(28px, 7.5vw, 34px); line-height: 1.45; }
    .qm-data-center-page .qm-dc-hero .qm-dc-actions { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; max-width: 420px; }
    .qm-data-center-page .qm-dc-hero-button { width: 100%; min-width: 0; min-height: 52px; padding-inline: 22px; }
    .qm-data-center-page .qm-dc-index > div { padding-block: 16px; }
    .qm-data-center-page .qm-dc-detail-list > div { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    .qm-data-center-page .qm-dc-container-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .qm-data-center-page .qm-dc-container-unit { padding: 16px 10px; }
    .qm-data-center-page .qm-dc-process--compact { grid-template-columns: 1fr; }
    .qm-data-center-page .qm-dc-process--compact > li:not(:last-child)::after { top: auto; bottom: -27px; right: calc(50% - 10px); content: "↓"; }
    .qm-data-center-page .qm-dc-cycle { padding: 0; }
    .qm-data-center-page .qm-dc-cycle li { font-size: 16px; }
    .qm-data-center-page .qm-dc-costs { margin-top: 34px; }
}
@media (prefers-reduced-motion: reduce) {
    .qm-data-center-page .qm-dc-button, .qm-data-center-page .qm-dc-hero-button, .qm-data-center-page .qm-dc-hero-button::before, .qm-data-center-page .qm-dc-index a { transition: none; }
    .qm-data-center-page .qm-dc-hero-button:hover { transform: none; }
}
