.nx-office-section{background:var(--nx-bg);color:var(--nx-ink);border-bottom:1px solid var(--nx-line);scroll-margin-top:100px}.nx-office-inner{max-width:1380px;margin:auto;padding:80px 5%}.nx-office-eyebrow{font:500 11px/1.5 monospace;letter-spacing:2px;text-transform:uppercase;color:#4387ef;margin:0 0 16px}.nx-office-section h2{font-size:clamp(30px,3vw,44px);font-weight:500;line-height:1.15;letter-spacing:-1px;margin:0 0 22px;color:var(--nx-ink)}.nx-office-intro{max-width:680px;font-size:17px;line-height:1.65;color:var(--nx-muted);margin:0 0 42px}.nx-office-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;grid-template-areas:'doc doc calc' 'doc doc slides' 'drive mail mail' 'meet meet meet'}.nx-office-doc{grid-area:doc}.nx-office-calc{grid-area:calc}.nx-office-slides{grid-area:slides}.nx-office-drive{grid-area:drive}.nx-office-mail{grid-area:mail}.nx-office-meet{grid-area:meet}.nx-office-card{position:relative;display:flex;flex-direction:column;min-width:0;border:1px solid var(--nx-line);border-radius:14px;background:var(--nx-panel);padding:24px;text-decoration:none;color:var(--nx-ink);overflow:hidden;transition:border-color .25s,box-shadow .25s}.nx-office-card:hover{border-color:#798aa2;box-shadow:0 8px 30px #0001}.nx-office-card:focus-visible{outline:2px solid #4387ef;outline-offset:4px}.nx-office-card header{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:22px}.nx-office-card h3{font-size:17px;line-height:1.3;font-weight:600;margin:0 0 5px;color:var(--nx-ink)}.nx-office-card header p{font:11px/1.5 monospace;color:var(--nx-muted);margin:0}.nx-office-live{font:9px/1.5 monospace;letter-spacing:1px;color:#00ba91;white-space:nowrap}.nx-office-screen{background:var(--nx-bg);border:1px solid var(--nx-line);border-radius:9px;overflow:hidden;flex:1;color:var(--nx-muted);font:10px/1.6 monospace}.nx-office-hover{position:absolute;inset:85px 20px 20px;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;font-size:15px;color:var(--nx-ink);transition:opacity .25s;background:color-mix(in srgb,var(--nx-panel),transparent 55%);border-radius:8px}.nx-office-card:hover .nx-office-hover{opacity:1}.nx-office-card:hover>div{filter:blur(3px)}.nx-office-card>div{transition:filter .3s}.nx-doc-screen{min-height:390px;padding:16px}.nx-doc-toolbar{display:flex;justify-content:space-between;border-bottom:1px solid var(--nx-line);padding-bottom:12px;font:12px/1.5 sans-serif}.nx-doc-avatars{color:#6366f1}.nx-doc-avatars small{color:var(--nx-muted);font-size:8px}.nx-doc-page{padding:14px 0}.nx-doc-page h4{font-size:13px;margin:16px 0 10px;color:var(--nx-muted)}.nx-doc-page>i{display:block;height:5px;background:var(--nx-line);margin:7px 0;border-radius:3px}.nx-doc-page>i:nth-child(3n){width:94%}.nx-doc-page>i:nth-child(4n){width:85%}.nx-doc-page .nx-doc-blue{background:linear-gradient(90deg,#3676e7aa 45%,var(--nx-line) 45%);width:70%}.nx-doc-status{display:flex;justify-content:space-between;border-top:1px solid var(--nx-line);padding-top:10px;font-size:8px}.nx-doc-status span{color:#0b9b82}.nx-calc-formula{padding:8px;border-bottom:1px solid var(--nx-line);font-size:8px}.nx-office-screen table{width:100%;border-collapse:collapse;font-size:8px}.nx-office-screen td{border:1px solid var(--nx-line);padding:6px 8px}.nx-office-screen td:nth-child(3),.nx-office-screen td:nth-child(4){text-align:right}.nx-office-screen tr:not(:first-child) td:nth-child(4),.nx-calc-total{color:#00a98c}.nx-calc-total{background:#00a98c15}.nx-slides-screen{display:flex;gap:10px;min-height:116px}.nx-slide-thumbs{width:38px;display:flex;flex-direction:column;gap:6px}.nx-slide-thumbs i{flex:1;background:var(--nx-bg);border:1px solid var(--nx-line);border-radius:4px}.nx-slide-thumbs i:first-child{border-color:#b96524;background:#b965241a}.nx-slide-main{padding:18px;display:flex;align-items:center;flex-direction:column}.nx-slide-main b{width:60%;height:8px;background:var(--nx-muted);border-radius:2px;margin-bottom:8px}.nx-slide-main i{width:80%;height:2px;background:var(--nx-line);margin:2px}.nx-slide-main span{color:#c86f28;border:1px solid #c86f28;border-radius:50%;padding:3px 7px;margin-top:12px}.nx-drive-screen{padding:16px;min-height:185px}.nx-drive-screen p{margin:0 0 12px;font-size:9px}.nx-drive-screen b{color:#2c9eca;margin-right:6px}.nx-drive-storage{margin-top:38px;border-top:1px solid var(--nx-line);padding-top:10px;font-size:8px}.nx-drive-storage span{float:right}.nx-drive-storage i{display:block;height:4px;margin-top:5px;border-radius:3px;background:linear-gradient(90deg,#2c9eca 24%,var(--nx-line) 24%)}.nx-mail-screen>div{padding:7px 10px;font-size:9px;border-bottom:1px solid var(--nx-line)}.nx-mail-screen>div span{float:right;background:#8b5cf626;color:#9b78dd;border-radius:12px;padding:1px 6px;font-size:8px}.nx-mail-screen p{margin:0;padding:12px;border-bottom:1px solid var(--nx-line);background:#8b5cf60a}.nx-mail-screen p:last-child{border:0;background:transparent}.nx-mail-screen b{font-size:9px;font-weight:400}.nx-mail-screen small{display:block;font-size:8px;padding-left:12px}.nx-meet-screen{display:grid;grid-template-columns:1.3fr 1fr;gap:10px}.nx-meet-people{position:relative;display:flex;gap:8px;border:1px solid var(--nx-line);background:#8b5cf611;border-radius:9px;padding:9px;min-height:125px}.nx-meet-people>span{flex:1;display:grid;place-items:center;background:#8b5cf628;border-radius:6px}.nx-meet-people>span:first-child{border:1px solid #9b59d0}.nx-meet-people i{font-style:normal;background:#8b5cf645;color:#bfa2e3;border-radius:50%;padding:12px;font:9px monospace}.nx-meet-people small{position:absolute;top:11px;right:14px;color:#dd4864;font:7px monospace}.nx-meet-transcript{padding:18px 12px;display:flex;justify-content:center;flex-direction:column;font-size:8px}.nx-meet-transcript b{color:#9b83bd;letter-spacing:1px;font-size:8px;margin-bottom:7px}.nx-meet-transcript p{margin:4px 0}.nx-office-facts{display:flex;flex-wrap:wrap;justify-content:center;gap:30px;text-align:center;border-top:1px solid var(--nx-line);margin-top:35px;padding-top:28px;font:12px/1.6 monospace}.nx-office-facts span{display:block;text-transform:uppercase;color:var(--nx-muted);font-size:9px;letter-spacing:1.5px;margin-bottom:7px}
@media(max-width:900px){.nx-office-card{padding:18px}.nx-office-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:'doc doc' 'calc slides' 'drive mail' 'meet meet'}.nx-doc-screen{min-height:330px}}
@media(max-width:550px){.nx-office-inner{padding:55px 6%}.nx-office-grid{grid-template-columns:1fr;grid-template-areas:'doc' 'calc' 'slides' 'drive' 'mail' 'meet'}.nx-meet-screen{grid-template-columns:1fr}.nx-office-intro{font-size:15px}.nx-office-facts{display:grid;grid-template-columns:1fr 1fr;gap:22px 12px}}
@media(prefers-reduced-motion:reduce){.nx-office-card,.nx-office-card>div,.nx-office-hover{transition:none}}
/* Keep the miniature document lines visible after global theme classification. */
.nx-doc-page>i{background:var(--nx-line)!important}.nx-doc-page>.nx-doc-blue{background:linear-gradient(90deg,#3676e7aa 45%,var(--nx-line) 45%)!important}.nx-slide-main i{background:var(--nx-line)!important}
html[data-nx-theme='dark'] .nx-office-card .nx-office-screen{background:#242426!important;border-color:#414145}
html[data-nx-theme='dark'] .nx-office-card{background:#151517!important}
html[data-nx-theme='dark'] .nx-doc-page>i{background:#45454a!important}
html[data-nx-theme='dark'] .nx-doc-page>.nx-doc-blue{background:linear-gradient(90deg,#3676e799 45%,#45454a 45%)!important}
/* Foreground details follow the theme, independently of structural borders. */
.nx-office-section{--nx-office-detail:#62626b}
html[data-nx-theme='dark'] .nx-office-section{--nx-office-detail:#c5c5ce}
html[data-nx-theme] .nx-office-section .nx-doc-page>i,
html[data-nx-theme] .nx-office-section .nx-slide-main i,
html[data-nx-theme] .nx-office-section .nx-slide-main b{background:var(--nx-office-detail)!important}
html[data-nx-theme] .nx-office-section .nx-doc-page>.nx-doc-blue{background:linear-gradient(90deg,#3676e7 45%,var(--nx-office-detail) 45%)!important}
html[data-nx-theme] .nx-office-section .nx-office-screen,
html[data-nx-theme] .nx-office-section .nx-office-screen :is(p,h4,small,td,b),
html[data-nx-theme] .nx-office-section .nx-doc-toolbar,
html[data-nx-theme] .nx-office-section .nx-doc-status,
html[data-nx-theme] .nx-office-section .nx-calc-formula{color:var(--nx-ink)!important}
html[data-nx-theme] .nx-office-section .nx-office-screen tr:not(:first-child) td:nth-child(4),
html[data-nx-theme] .nx-office-section .nx-office-screen .nx-calc-total{color:#00a98c!important}
/* Soft app-colored reflections, using the official app icon palette. */
.nx-office-doc{--app-tint:#2875b9}.nx-office-calc{--app-tint:#23835c}.nx-office-slides{--app-tint:#cf5539}.nx-office-drive{--app-tint:#309bc4}.nx-office-mail{--app-tint:#2863aa}.nx-office-meet{--app-tint:#8055ad}
html[data-nx-theme] #office .nx-office-card{background:radial-gradient(ellipse at 95% 0%,color-mix(in srgb,var(--app-tint) 13%,transparent),transparent 68%),var(--nx-panel)!important;border-color:color-mix(in srgb,var(--app-tint) 22%,var(--nx-line));box-shadow:inset 0 1px 0 #ffffff40;transition:border-color .7s,box-shadow .7s}
html[data-nx-theme=dark] #office .nx-office-card{background:radial-gradient(ellipse at 95% 0%,color-mix(in srgb,var(--app-tint) 19%,transparent),transparent 70%),#151517!important;box-shadow:inset 0 1px 0 #ffffff0a}
html[data-nx-theme] #office .nx-office-card:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 15%,color-mix(in srgb,var(--app-tint) 9%,transparent) 48%,transparent 80%);opacity:.45;transition:opacity .8s}
html[data-nx-theme] #office .nx-office-card:is(:hover,:focus-visible){border-color:color-mix(in srgb,var(--app-tint) 55%,var(--nx-line));box-shadow:0 8px 28px color-mix(in srgb,var(--app-tint) 12%,transparent)}
html[data-nx-theme] #office .nx-office-card:is(:hover,:focus-visible):after{opacity:1}
@media(prefers-reduced-motion:reduce){html[data-nx-theme] #office .nx-office-card,html[data-nx-theme] #office .nx-office-card:after{transition:none}}

/* Bento cards: a large document, compact tools and wider collaboration views. */
.nx-office-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-areas:'doc doc calc' 'doc doc slides' 'drive mail mail' 'meet meet meet';align-items:stretch;gap:16px}
.nx-has-screenshot{display:flex;min-height:270px}
.nx-office-doc{min-height:560px}
.nx-office-mail,.nx-office-drive{min-height:350px}
.nx-office-meet{min-height:420px}
.nx-has-screenshot>div{min-height:0;flex:1;overflow:hidden}
.nx-doc-screen{display:flex;flex-direction:column}
.nx-doc-page{flex:1;display:flex;flex-direction:column;justify-content:space-evenly}
.nx-office-calc>.nx-office-screen{display:flex;flex-direction:column}
.nx-office-calc table{flex:1;height:100%}
.nx-slide-main{justify-content:center}
.nx-slide-main span{margin-top:24px}
.nx-drive-screen{display:flex;flex-direction:column;justify-content:center}
.nx-drive-storage{margin-top:auto;padding-top:20px}
.nx-mail-screen{display:flex;flex-direction:column}
.nx-mail-screen>p{flex:1;display:flex;flex-direction:column;justify-content:center}
.nx-meet-screen{grid-template-columns:1.6fr 1fr}
.nx-meet-people{align-items:stretch}
.nx-meet-people i{font-size:15px;padding:20px}
.nx-meet-transcript{font-size:12px;padding:24px;gap:12px}
/* Fit screenshots inside each block, with no stretching or cropped controls. */
.nx-has-screenshot .nx-office-hover{position:absolute;inset:85px 24px 24px;z-index:1;display:flex;flex-direction:column;justify-content:center;gap:0;background:var(--nx-panel);overflow:hidden;transform:translateY(8px) scale(.985);transition:opacity .28s ease,transform .35s ease}
.nx-has-screenshot .nx-office-hover img{display:block;width:100%;height:calc(100% - 34px);min-height:0;object-fit:contain;object-position:center;border-radius:6px}
.nx-has-screenshot .nx-office-hover>span{display:block;flex-shrink:0;width:100%;padding:9px 12px;color:var(--nx-ink)!important;font:500 11px/16px sans-serif;text-align:right}
.nx-has-screenshot:is(:hover,:focus-visible,.nx-preview-open) .nx-office-hover{opacity:1;transform:none}
.nx-has-screenshot:is(:hover,:focus-visible,.nx-preview-open)>div{opacity:.15;filter:none}
@media(max-width:900px){.nx-office-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:'doc doc' 'calc slides' 'drive mail' 'meet meet'}.nx-office-doc{min-height:460px}.nx-office-meet{min-height:350px}.nx-has-screenshot .nx-office-hover{inset:79px 18px 18px}.nx-meet-transcript{font-size:10px;padding:16px}}
@media(max-width:550px){.nx-office-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:'doc' 'calc' 'slides' 'drive' 'mail' 'meet'}.nx-office-doc{min-height:430px}.nx-office-calc,.nx-office-slides{min-height:270px}.nx-office-drive,.nx-office-mail{min-height:300px}.nx-office-meet{min-height:360px}.nx-meet-screen{grid-template-columns:1fr}.nx-meet-transcript{gap:3px}.nx-meet-people i{padding:12px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.nx-has-screenshot .nx-office-hover{transition:none}}