/* Microsoft/Office accents, scoped exclusively to the two Office cards. */
/* Motion is limited to devices with a real hover pointer. */
html body.extras-page #windows-keys .extras-license-grid .office-license-card{grid-column:span 2;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.3fr);align-items:center;align-content:center;gap:22px;padding:20px;min-width:0;min-height:0;height:100%;border:1px solid #526b8c50!important;border-radius:16px;background:linear-gradient(115deg,#152132,#0d1827)!important;box-shadow:0 12px 32px #0003,inset 0 1px #ffffff08!important;opacity:1;filter:none;}
html body.extras-page #windows-keys .office-license-card:hover{border-color:#0078d477!important;transform:none;}
html body.extras-page #windows-keys .office-license-card>a.office-license-art{display:flex;position:relative;align-items:center;justify-content:center;aspect-ratio:16/11;min-width:0;min-height:0;width:100%;padding:0;overflow:hidden;border:1px solid #ffffff15;border-radius:12px;background:#fff!important;box-shadow:none!important;transform:none;box-sizing:border-box;}
.office-license-art img{display:block;width:100%;height:100%;object-fit:contain;transform:none;}
.office-license-art>span{position:absolute;bottom:8px;left:8px;padding:4px 8px;border-radius:4px;background:#14253deb;color:#fff;font:600 9px 'Segoe UI',sans-serif;letter-spacing:.7px;}
.office-license-content{min-width:0;display:flex;flex-direction:column;gap:12px;align-self:stretch;font-family:'Segoe UI','Kanit',sans-serif;}
.office-license-brand{display:flex;align-items:center;gap:7px;color:#c7d2df;font-size:12px;}
.office-license-brand svg{width:17px;height:17px;flex:none;}
.office-license-brand small{margin-left:auto;font-size:8px;letter-spacing:1px;color:#f7a479;}
html body.extras-page #windows-keys .office-license-card h3{font-family:'Segoe UI','Kanit',sans-serif;font-size:19px;line-height:1.35;font-weight:600;min-height:0;margin:0;color:#f4f7fc;overflow-wrap:break-word;}
html body.extras-page #windows-keys .office-license-description{font-size:12px;line-height:1.7;margin:0;color:#9dafc4;}
.office-license-tags{display:flex;flex-wrap:wrap;gap:5px;}
.office-license-tags span{border:1px solid #809fbd24;border-radius:5px;background:#769ec20c;color:#b9cbdf;font-size:9px;padding:3px 7px;}
.office-license-purchase{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-top:12px;margin-top:auto;border-top:1px solid #799bb624;}
.office-license-price strong{font-size:26px;line-height:1.15;color:#fff;}
.office-license-price del{font-size:10px;color:#8d9eb2;margin-left:6px;}
.office-license-price small{display:block;font-size:9px;color:#9bb0c8;margin-top:5px;}
html body.extras-page #windows-keys .office-license-action{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:auto;max-width:100%;box-sizing:border-box;gap:8px;min-height:42px;padding:10px 16px;background:#0078d4!important;color:#fff!important;border:1px solid #50a9ee40;border-radius:8px;box-shadow:none!important;text-decoration:none;font-size:12px;font-weight:500;line-height:1.4;}
html body.extras-page #windows-keys .office-license-action svg{display:block;width:18px;height:18px;min-width:18px;flex:0 0 18px;margin:0;stroke:currentColor;fill:none;}
html body.extras-page #windows-keys .office-license-action span{display:block;line-height:1.4;}
html body.extras-page #windows-keys .office-license-action:hover{background:#168ae2!important;}
.office-license-card a:focus-visible{outline:2px solid #80caff;outline-offset:4px;}
/* Artwork owns the whole left panel, not a small inset box. */
html body.extras-page #windows-keys .extras-license-grid .office-license-card{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);padding:0;gap:0;overflow:hidden;align-items:stretch;}
html body.extras-page #windows-keys .office-license-card>a.office-license-art{align-self:stretch;aspect-ratio:auto;min-height:210px;height:100%;border:0;border-right:1px solid #526b8c30;border-radius:0;margin:0;}
html body.extras-page #windows-keys .office-license-art img{position:absolute;inset:0;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center;padding:0;}
html body.extras-page #windows-keys .office-license-content{padding:22px;}
html body.extras-page #windows-keys .office-license-art>span{bottom:10px;left:10px;}
@media(max-width:600px){html body.extras-page #windows-keys .office-license-card>a.office-license-art{aspect-ratio:4/3;}}
@media(max-width:1100px){html body.extras-page #windows-keys .extras-license-grid .office-license-card{grid-column:1/-1;grid-template-columns:minmax(0,.75fr) minmax(0,1.5fr);}}
@media(max-width:600px){html body.extras-page #windows-keys .extras-license-grid .office-license-card{grid-template-columns:minmax(90px,.75fr) minmax(0,1.4fr);padding:12px;gap:12px;align-items:start;}html body.extras-page #windows-keys .office-license-card h3{font-size:14px;}.office-license-content{gap:9px;}.office-license-brand small{display:none;}.office-license-brand{font-size:10px;}.office-license-art{margin-top:3px;aspect-ratio:4/3;}.office-license-art>span{font-size:7px;bottom:4px;left:4px;padding:3px 5px;}html body.extras-page #windows-keys .office-license-description{font-size:10px;}.office-license-purchase{gap:8px;}.office-license-price strong{font-size:22px;}html body.extras-page #windows-keys .office-license-action{width:100%;min-height:36px;font-size:11px;}}
@media(max-width:1100px){html body.extras-page #windows-keys .extras-license-grid .office-license-card{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);}}
@media(max-width:600px){html body.extras-page #windows-keys .extras-license-grid .office-license-card{grid-template-columns:minmax(100px,.85fr) minmax(0,1.3fr);padding:0;gap:0;align-items:stretch;}html body.extras-page #windows-keys .office-license-content{padding:14px 12px;}html body.extras-page #windows-keys .office-license-card>a.office-license-art{aspect-ratio:auto;min-height:160px;}html body.extras-page #windows-keys .office-license-art>span{left:5px;bottom:5px;}}
@media(hover:hover) and (pointer:fine){
 html body.extras-page #windows-keys .extras-license-grid .office-license-card{transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;}
 html body.extras-page #windows-keys .office-license-card .office-license-art img{transition:transform .4s ease;}
 html body.extras-page #windows-keys .extras-license-grid .office-license-card:hover{transform:translateY(-4px);border-color:#57b2f2a6!important;box-shadow:0 18px 40px #0005,0 0 22px #0078d41a,inset 0 1px #ffffff12!important;}
 html body.extras-page #windows-keys .office-license-card:hover .office-license-art img{transform:scale(1.015);}
 html body.extras-page #windows-keys .office-license-card .office-license-action{transition:transform .18s ease,background-color .18s ease,box-shadow .18s ease;}
 html body.extras-page #windows-keys .office-license-card .office-license-action:hover{transform:translateY(-2px);box-shadow:0 6px 18px #0078d44d!important;}
 html body.extras-page #windows-keys .office-license-card .office-license-action:active{transform:translateY(0);}
}
@media(prefers-reduced-motion:reduce){
 html body.extras-page #windows-keys .extras-license-grid .office-license-card,
 html body.extras-page #windows-keys .office-license-card .office-license-art img,
 html body.extras-page #windows-keys .office-license-card .office-license-action{transition:none!important;animation:none!important;transform:none!important;}
}
/* 1920 x 1080 composition: the artwork has its own ratio, independent of copy. */
html body.extras-page #windows-keys .extras-license-grid .office-license-card{
 grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr;align-content:start;
}
html body.extras-page #windows-keys .office-license-card>a.office-license-art{
 aspect-ratio:16/9;height:auto;min-height:0;align-self:start;border:0;
 border-bottom:1px solid #526b8c30;background:#0b1522!important;
}
html body.extras-page #windows-keys .office-license-card .office-license-art img{
 aspect-ratio:auto;object-fit:contain;transform:none!important;
}