/* Chapter LXI — shared Windows presentation layer. */
:root{--mono:Segoe,'Segoe UI',Arial,sans-serif;--windows-blue:#0067b8;--focus-blue:#70baff}
h1,h2,h3{font-family:var(--sans);font-weight:700;letter-spacing:-.035em;line-height:1.08;text-wrap:balance}
.eyebrow{font-family:var(--sans);font-weight:600;letter-spacing:.1em}
.lead,.detail{ text-wrap:pretty }
a,button{touch-action:manipulation}
a:focus-visible,button:focus-visible{outline:2px solid var(--focus-blue);outline-offset:6px}
.windows-brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--sans);font-weight:600;font-size:24px;flex-shrink:0;letter-spacing:-.02em}
.windows-symbol{display:grid;grid-template-columns:repeat(2,12px);gap:2px}.windows-symbol i{display:block;height:12px;background:currentColor}
.chrome{height:84px;padding-inline:3.1vw;gap:24px}
.chrome .idea-nav{display:flex;gap:24px}.idea-nav a{font-family:var(--sans);font-size:12px;letter-spacing:0;font-weight:600;color:#b0b0b0;padding:12px 0}.idea-nav a[aria-current=page]{color:#fff;border-bottom:1px solid #70baff}.idea-nav a:hover{color:#fff}
.header-right{gap:24px}.project-label{display:none}.quiet{font-size:12px}
.strategy-reminder{font-size:clamp(15px,1.25vw,18px);line-height:1.55;max-width:580px;color:#c9cdd2;margin:0 0 28px;text-wrap:pretty}
.cover h1{font-size:clamp(40px,4.4vw,80px);max-width:1440px;line-height:1.09;letter-spacing:-.035em;text-wrap:initial}
.music-hero h1{font-size:clamp(44px,5.5vw,82px);line-height:1.07;letter-spacing:-.035em}.music-hero .content{padding-top:70px}.music-hero .lead{line-height:1.5}
.talent-nav{top:86px;right:3.1vw;gap:20px;padding:10px 18px;border-color:#ffffff26;background:#080808c9}.talent-nav a{font:500 11px/1.5 var(--sans);letter-spacing:0;padding:2px 0}.talent-nav a[aria-current]{color:#fff}.talent-nav a:not([aria-current]){color:#aaa}
.tv-frame h2{letter-spacing:-.025em;line-height:1.12}.tv-frame-heading .eyebrow{margin-bottom:16px}.tv-caption{gap:32px;margin-top:24px}.tv-caption p{font-size:18px;line-height:1.5}.tv-caption span{white-space:nowrap;letter-spacing:.08em}.tv-note{letter-spacing:.035em;line-height:1.5;color:#888;margin-top:14px}.activation-grid h3,.steps h3{font-weight:600;letter-spacing:-.02em;line-height:1.2}.activation-grid p{color:#b7b7b7}.notes-body h3{font-weight:600;letter-spacing:-.015em}.notes-body h2{letter-spacing:-.025em}
/* Overview: one quiet grid, clear hierarchy, image-led idea selection. */
.overview-page{color-scheme:light;background:#fff;color:#111;font-weight:400;--overview-gutter:clamp(24px,8vw,144px)}
.overview-page .chrome{background:#ffffffed;backdrop-filter:blur(20px);border-bottom:1px solid #e7e7e7}
.overview-page .windows-symbol{color:var(--windows-blue)}
.overview-page .idea-nav a{color:#606060;font-size:13px}.overview-page .idea-nav a[aria-current=page]{color:#111;border-bottom-color:var(--windows-blue)}.overview-page .idea-nav a:hover{color:var(--windows-blue)}
.overview-page .eyebrow{color:var(--windows-blue);font-size:11px;line-height:1.5;letter-spacing:.12em;margin-bottom:24px}
.overview-hero{background:#fff;padding:clamp(150px,13vw,210px) var(--overview-gutter) 72px;min-height:700px;border-bottom:1px solid #e7e7e7}
.overview-hero h1{font-size:clamp(56px,8vw,124px);font-weight:650;letter-spacing:-.045em;line-height:1.12;max-width:1200px}
.platform-question{font-size:clamp(25px,3vw,44px);font-weight:500;line-height:1.25;letter-spacing:-.025em;margin-top:28px;color:#171717;text-wrap:balance;max-width:1100px}
.overview-lead{font-size:clamp(19px,1.6vw,24px);line-height:1.55;color:#646464;margin-top:36px;max-width:800px;text-wrap:pretty}
.overview-jump{display:inline-flex;align-items:center;gap:18px;margin-top:46px;padding:10px 0;color:var(--windows-blue);text-decoration:none;font-size:15px;font-weight:600;line-height:1.5;border-bottom:1px solid transparent;transition:border-color .2s}.overview-jump:hover{border-color:var(--windows-blue)}
.overview-opportunity{padding:100px var(--overview-gutter);background:#f6f6f6;scroll-margin-top:84px}
.overview-opportunity h2,.ideas-intro h2{font-size:clamp(36px,4.2vw,64px);line-height:1.12;max-width:900px;letter-spacing:-.035em}
.overview-opportunity>p:not(.eyebrow){font-size:clamp(20px,1.85vw,26px);line-height:1.55;max-width:790px;margin-top:30px;color:#555;text-wrap:pretty}
.overview-opportunity>p.opportunity-small{font-size:16px;color:#666;margin-top:24px}
.overview-ideas{padding:100px var(--overview-gutter) 88px;background:#fff}.ideas-intro{margin-bottom:48px}
.idea-cards{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:stretch}
.idea-card{color:inherit;text-decoration:none;display:flex;flex-direction:column;min-width:0}.card-image{aspect-ratio:16/10;overflow:hidden;background:#050505;border-radius:3px}.card-image img{display:block;width:100%;height:100%;object-fit:cover;object-position:center top;transition:transform .65s cubic-bezier(.2,.65,.2,1)}.idea-card:hover img{transform:scale(1.025)}
.card-copy{padding:28px 0 0;display:flex;flex-direction:column;flex:1}.card-copy .eyebrow{margin-bottom:14px}.card-copy h3{font-size:clamp(28px,2.8vw,44px);line-height:1.13;letter-spacing:-.03em;margin-bottom:18px;text-wrap:initial}.card-copy>p:not(.eyebrow){font-size:18px;line-height:1.55;color:#606060;margin-bottom:28px;text-wrap:pretty}.card-copy>span{display:block;margin-top:auto;font-size:15px;font-weight:600;color:var(--windows-blue)}
.overview-footer{display:flex;justify-content:space-between;gap:24px;padding:28px var(--overview-gutter);border-top:1px solid #e7e7e7;background:#fff;color:#6a6a6a;font-size:12px;line-height:1.6}
@media(min-width:1800px){.chrome{height:96px}.talent-nav{top:98px}}
@media(max-width:1000px){.header-right{gap:20px}.chrome .idea-nav{gap:18px}.idea-cards{gap:28px}}
@media(max-width:760px){
 .chrome{height:auto;min-height:78px;gap:16px;padding:14px 5vw;flex-wrap:wrap}.windows-brand{font-size:21px}.windows-symbol{grid-template-columns:repeat(2,10px);gap:2px}.windows-symbol i{height:10px}.chrome .idea-nav{gap:16px}.idea-nav a{font-size:11px}.header-right{gap:16px}.header-right .quiet{font-size:11px}
 .strategy-reminder{font-size:15px;line-height:1.55;max-width:100%;margin-bottom:26px}.cover h1{font-size:clamp(36px,10vw,60px)}.cover .lead{font-size:17px;line-height:1.55}.music-hero h1{font-size:10vw}.music-hero .content{padding-top:0}.talent-nav{top:82px;right:5vw;gap:16px;padding:8px 14px}.talent-nav a{font-size:10px}
 .overview-page .chrome{height:78px;flex-wrap:nowrap}.overview-page .idea-nav a{font-size:12px}.overview-page .eyebrow{font-size:10px;margin-bottom:22px}.overview-hero{padding:145px var(--overview-gutter) 64px;min-height:0}.overview-hero h1{font-size:clamp(48px,12.7vw,80px);line-height:1.15}.platform-question{font-size:27px;line-height:1.3;margin-top:26px;text-wrap:pretty}.overview-lead{font-size:19px;line-height:1.55;margin-top:30px}.overview-jump{margin-top:30px;font-size:14px}
 .overview-opportunity,.overview-ideas{padding:64px var(--overview-gutter)}.overview-opportunity{scroll-margin-top:78px}.overview-opportunity h2,.ideas-intro h2{font-size:36px;line-height:1.15}.overview-opportunity>p:not(.eyebrow){font-size:20px;margin-top:24px}.overview-opportunity>p.opportunity-small{font-size:15px}.ideas-intro{margin-bottom:32px}.idea-cards{grid-template-columns:1fr;gap:48px}.card-copy{padding-top:24px}.card-copy h3{font-size:31px;line-height:1.13}.card-copy>p:not(.eyebrow){font-size:17px;margin-bottom:22px}.overview-footer{flex-direction:column;gap:6px;padding-block:24px}
 .tv-caption{display:block}.tv-caption span{display:block;white-space:normal;margin-top:16px}.tv-frame-heading .eyebrow{margin-bottom:14px}
}
@media(max-width:400px){.windows-brand{font-size:19px;gap:8px}.chrome .idea-nav{gap:12px}.header-right{gap:12px}.header-right .quiet{font-size:10px}.idea-nav a{font-size:10px}.overview-page .idea-nav a{font-size:11px}}
@media(prefers-reduced-motion:reduce){.card-image img,.overview-jump{transition:none}.idea-card:hover img{transform:none}}

/* Cinematic campaign entrance. */
.cinematic-overview .chrome{position:absolute;background:transparent;border:0;backdrop-filter:none;color:#fff;height:88px;padding-inline:var(--overview-gutter)}
.cinematic-overview .windows-symbol{color:#fff}.cinematic-overview .idea-nav a{color:#c0c0c0}.cinematic-overview .idea-nav a[aria-current=page]{color:#fff;border-bottom-color:#fff}.cinematic-overview .idea-nav a:hover{color:#fff}
.cinematic-overview .overview-hero{position:relative;isolation:isolate;display:flex;align-items:center;min-height:700px;height:92svh;max-height:1080px;padding:148px var(--overview-gutter) 130px;background:#090a0b;color:#fff;overflow:hidden;border:0}
.overview-stadium{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-3}
.cinematic-overview .overview-hero::after{content:'';position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#0009,transparent 80%),linear-gradient(180deg,#0005,transparent 40%,#0007)}
.overview-hero-copy{width:100%;max-width:1200px}.cinematic-overview .overview-hero .eyebrow{font-size:11px;color:#c7c7c7;letter-spacing:.14em;margin-bottom:40px}
.chapter-label{font-size:20px;letter-spacing:-.01em;font-weight:500;line-height:1.4;margin-bottom:18px;color:#eee}
.cinematic-overview .overview-hero h1{color:#fff;font-size:clamp(48px,5.8vw,94px);line-height:1.09;letter-spacing:-.035em;font-weight:650;max-width:1100px;text-wrap:initial}
.cinematic-overview .overview-lead{font-size:clamp(18px,1.6vw,24px);margin-top:28px;color:#d0d0d0;line-height:1.5}
.cinematic-overview .overview-jump{color:#fff;margin-top:32px;gap:28px;font-size:15px;border-bottom:1px solid #ffffff55;padding-bottom:12px}.cinematic-overview .overview-jump:hover{border-bottom-color:#fff}
.hero-footnote{position:absolute;bottom:36px;left:var(--overview-gutter);right:var(--overview-gutter);display:flex;justify-content:space-between;color:#b6b6b6;font-size:10px;letter-spacing:.12em;line-height:1.5}
.cinematic-overview .overview-opportunity{display:grid;grid-template-columns:1.1fr 1fr;gap:7vw;background:#fff;padding-block:100px;align-items:center;border-bottom:1px solid #e7e7e7}
.cinematic-overview .overview-opportunity h2{font-size:clamp(34px,3.7vw,58px);line-height:1.13}.opportunity-copy>p{font-size:clamp(19px,1.7vw,25px);line-height:1.55;color:#444;text-wrap:pretty}.opportunity-copy .opportunity-small{font-size:15px;color:#737373;margin-top:24px;line-height:1.55}
.cinematic-overview .overview-ideas{scroll-margin-top:32px;padding-top:88px}.cinematic-overview .card-image{aspect-ratio:4/3}.cinematic-overview .card-image img{object-position:center}.cinematic-overview .idea-card:first-child .card-image img{object-position:53% center}.cinematic-overview .card-copy{padding-top:28px}
@media(max-width:760px){
 .cinematic-overview .chrome{height:78px;padding-inline:6vw;flex-wrap:nowrap}.cinematic-overview .overview-hero{height:90svh;min-height:690px;max-height:none;padding:135px 6vw 105px;align-items:center}.overview-stadium{object-position:50% center}.cinematic-overview .overview-hero::after{background:linear-gradient(90deg,#000a,#0003),linear-gradient(180deg,#0004,transparent 50%,#0007)}.cinematic-overview .overview-hero .eyebrow{font-size:9px;letter-spacing:.1em;margin-bottom:36px}.chapter-label{font-size:18px;margin-bottom:20px}.cinematic-overview .overview-hero h1{font-size:clamp(38px,8.8vw,65px);line-height:1.13;letter-spacing:-.035em}.cinematic-overview .overview-lead{font-size:18px;max-width:290px;margin-top:26px}.cinematic-overview .overview-jump{margin-top:30px;font-size:14px}.hero-footnote{left:6vw;right:6vw;bottom:28px;font-size:8px;letter-spacing:.06em;gap:18px}
 .cinematic-overview .overview-opportunity{grid-template-columns:1fr;gap:28px;padding-block:64px}.cinematic-overview .overview-opportunity h2{font-size:36px}.opportunity-copy>p{font-size:20px}.opportunity-copy .opportunity-small{font-size:15px;margin-top:22px}.cinematic-overview .overview-ideas{padding-top:64px}.cinematic-overview .card-image{aspect-ratio:4/3}
}

/* Interaction details drawn from Windows.com: blue primary actions,
   Segoe semibold labels and translucent secondary media controls. */
:root{--windows-action:#0078d4;--windows-action-hover:#006cbe}
.cinematic-overview .overview-jump{background:var(--windows-action);color:#fff;border:1px solid transparent;border-radius:999px;padding:12px 28px;min-height:48px;gap:20px;font-weight:600;font-size:15px;transition:background .2s,box-shadow .2s}
.cinematic-overview .overview-jump:hover{background:var(--windows-action-hover);border-color:transparent;box-shadow:0 4px 20px #0003}
.card-copy>span{align-self:flex-start;display:inline-flex;gap:20px;align-items:center;background:var(--windows-action);color:#fff;border-radius:999px;padding:12px 24px;min-height:48px;font-size:15px;font-weight:600;transition:background .2s}.idea-card:hover .card-copy>span{background:var(--windows-action-hover)}
.film-toggle{background:rgba(56,60,86,.4);border:1px solid #ffffff26;backdrop-filter:blur(16px);border-radius:999px;font-family:var(--sans);font-weight:600;min-height:44px;transition:background .2s,border-color .2s}.film-toggle:hover{background:rgba(76,80,106,.65);border-color:#ffffff60;color:#fff}.film-toggle:hover span{color:#ddd}
.talent-nav{background:rgba(56,60,86,.4);backdrop-filter:blur(16px)}
a:focus-visible,button:focus-visible{outline:2px solid #70baff;outline-offset:5px}
@media(prefers-reduced-motion:reduce){.cinematic-overview .overview-jump,.card-copy>span,.film-toggle{transition:none}}

/* Windows creative workflow replaces the hardware specification grid. */
.windows-power{min-height:850px}.windows-power>img.backdrop{object-position:center;transform:none;will-change:auto}.power-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#000e, #0009 37%,transparent 75%),linear-gradient(0deg,#000f 3%,#000c 23%,transparent 65%)}
.power-copy{position:absolute;left:var(--gutter);top:17%;max-width:580px;width:45%}.power-copy h2{font-size:clamp(36px,4.2vw,64px);line-height:1.12;letter-spacing:-.035em;margin-bottom:26px}.power-copy .lead{font-size:19px;line-height:1.55;max-width:470px;color:#ddd}.power-steps{position:absolute;bottom:135px;left:var(--gutter);right:var(--gutter);display:grid;grid-template-columns:repeat(3,1fr);gap:42px}.power-steps article{border-top:1px solid #ffffff55;padding-top:16px}.power-steps span{font-size:11px;color:#aaa}.power-steps h3{font-size:25px;font-weight:600;margin:10px 0 12px}.power-steps p{font-size:16px;line-height:1.5;color:#ccc;max-width:330px}
@media(max-width:700px){.windows-power{min-height:1100px;height:auto;padding:140px var(--gutter) 140px}.windows-power>img.backdrop{height:610px;object-position:65% top}.power-shade{background:linear-gradient(90deg,#000c,#0006),linear-gradient(0deg,#050505 42%,transparent 85%)}.power-copy{position:relative;left:auto;top:auto;width:100%;max-width:none}.power-copy h2{font-size:36px}.power-copy .lead{font-size:17px}.power-steps{position:relative;left:auto;right:auto;bottom:auto;grid-template-columns:1fr;gap:24px;margin-top:80px}.power-steps h3{font-size:23px;margin:8px 0}.power-steps p{font-size:16px;max-width:none}}
@media(min-width:701px){.windows-power{min-height:720px}.power-copy{top:16%}.power-copy h2{font-size:clamp(34px,3.6vw,58px)}.power-copy .lead{font-size:18px}.power-steps{bottom:105px}}
