/* Midstream case studies: full-width colour chapters and progressive enhancement. */
body.ms-interactive { margin:0; background:#111; color:#ffffff; --ms-motion-accent:#e9323b; }
.ms-interactive main { background:transparent; overflow:clip; }
.ms-interactive .ms-wrap { width:min(1280px,calc(100% - 96px)); }
.ms-interactive .ms-hero { position:relative; padding-top:170px; padding-bottom:100px; min-height:88svh; box-sizing:border-box; }
.ms-interactive .ms-hero h1 { max-width:15ch; text-wrap:balance; }
body.ms-interactive.project-midstream .ms-case h1 { font-size:clamp(54px,7.6vw,112px); line-height:.98; letter-spacing:-.055em; }
.ms-interactive .ms-hero .ms-lead { max-width:700px; margin-top:35px; }
.ms-interactive .ms-hero .ms-back { font-size:14px; }
.ms-orbit { position:absolute; top:155px; right:3vw; width:46vw; height:65vh; pointer-events:none; overflow:hidden; opacity:.12; }
.ms-orbit span { position:absolute; right:-.2em; top:90px; font:600 clamp(120px,20vw,340px)/1 "Funnel Display",sans-serif; writing-mode:vertical-rl; color:#ffffff; }
.ms-orbit i { position:absolute; inset:0; border:1px solid #ffffff; border-radius:50%; transform:rotate(-25deg) scaleX(.65); }
body.ms-interactive [data-ms-scene] { --scene-bg:#111; --scene-ink:#ffffff; --scene-muted:#bcbcbc; --scene-line:#494644; --scene-accent:#ff777d; width:100%; max-width:none; margin:0; padding:clamp(80px,10vw,150px) max(48px,calc((100% - 1280px)/2)); box-sizing:border-box; background:var(--scene-bg); color:var(--scene-ink); border:0; scroll-margin-top:80px; }
body.ms-interactive [data-ms-tone="paper"] { --scene-bg:#ffffff; --scene-ink:#141414; --scene-muted:#555555; --scene-line:#dedede; --scene-accent:#b8161a; }
body.ms-interactive [data-ms-scene] :is(h2,h3,p,figcaption,caption,th,td,.ms-copy,.ms-eyebrow,.ms-source,.ms-photo-caption) { color:var(--scene-ink); }
body.ms-interactive [data-ms-scene] :is(.ms-copy,.ms-copy p,.ms-split>div>p,figcaption,.ms-source) { color:var(--scene-muted); }
body.ms-interactive [data-ms-scene] :is(h2,h3) { margin-top:0; }
body.ms-interactive [data-ms-scene] :is(em,.ms-metrics b) { color:var(--scene-accent); }
body.ms-interactive [data-ms-scene] :is(th,td,.ms-metrics article) { border-color:var(--scene-line); }
.ms-interactive .ms-story,.ms-interactive .ms-split { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(36px,6vw,96px); }
.ms-interactive .ms-story h2,.ms-interactive .ms-split h2 { max-width:19ch; }
.ms-interactive [data-ms-scene] .ms-eyebrow { font-size:11px; letter-spacing:.16em; margin-bottom:32px; }
body.ms-interactive [data-ms-scene] .ms-button { color:#fff!important; background:#b8161a; border-radius:0; }
.ms-interactive .ms-hero-media img { will-change:transform; }
.ms-interactive .ms-image { border-radius:0; }
.ms-interactive .ms-brand-band { overflow:hidden; }
.ms-word { display:inline-block; transform-origin:50% 100%; }
.ms-progress { position:fixed; z-index:1001; top:0; left:0; right:0; height:3px; background:#ef333d; transform:scaleX(0); transform-origin:left; pointer-events:none; }
.ms-controls { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:25px; }
.ms-controls button { font:600 14px/1.3 "DM Sans",sans-serif; padding:14px 20px; border:1px solid var(--scene-line,#555); color:var(--scene-ink,#fff); background:transparent; cursor:pointer; }
.ms-controls button[aria-pressed="true"] { color:#fff; background:#b8161a; border-color:#b8161a; }
.ms-compare-ready { display:block!important; }
.ms-compare-ready [hidden] { display:none!important; }
.ms-compare-ready .ms-image { aspect-ratio:1536/674; }
.ms-compare-ready figcaption { margin-top:18px; }
.ms-chart-live { padding:24px 0; border:0; background:transparent; }
.ms-chart-live .ms-chart-kicker { font-size:12px!important; letter-spacing:.12em; text-transform:uppercase; margin-bottom:28px; }
.ms-chart-rows { display:grid; gap:30px; }
.ms-chart-row { display:grid; grid-template-columns:64px 1fr; gap:14px; align-items:center; }
.ms-chart-year { font-size:15px; font-weight:600; }
.ms-chart-track { min-width:0; }
.ms-chart-value { display:block; font:600 clamp(28px,4vw,48px)/1.1 "Funnel Display",sans-serif; margin-bottom:12px; }
.ms-chart-bar { display:block; height:20px; background:#b8161a; transform-origin:left; }
.ms-chart-row:first-child .ms-chart-bar { background:#88817c; }
.ms-chart-live .ms-chart-status { margin:28px 0 0; font-size:17px!important; }
.ms-chart-live+.ms-chart { margin-top:24px; }
.ms-chart-static-link { display:inline-block; margin-top:18px; font-size:14px; color:inherit; }
@media(min-width:1000px) { .ms-interactive [data-ms-scene] .ms-story h2,.ms-interactive [data-ms-scene] .ms-split h2 { position:sticky; top:130px; align-self:start; } }
@media(max-width:760px) {
 .ms-interactive .ms-wrap { width:calc(100% - 40px); }
 body.ms-interactive [data-ms-scene] { padding:65px 20px; }
 .ms-interactive .ms-story,.ms-interactive .ms-split { grid-template-columns:1fr; gap:24px; }
 .ms-interactive .ms-hero { padding-top:130px; padding-bottom:65px; min-height:auto; }
 .ms-interactive .ms-pair,.ms-interactive .ms-metrics { grid-template-columns:1fr; }
 .ms-orbit { display:none; }
 .ms-chart-row { grid-template-columns:44px 1fr; }
}
@media(prefers-reduced-motion:reduce) { .ms-interactive *, .ms-interactive *::before { scroll-behavior:auto!important; } }

.ms-interactive main [hidden] { display:none!important; }
/* Compact controls follow the site's outlined button treatment. */
body.ms-interactive .ms-case .ms-button,
body.ms-interactive .ms-controls button {
 display:inline-flex; align-items:center; justify-content:center; gap:14px;
 min-height:42px; padding:10px 17px; border:1px solid currentColor;
 border-radius:999px; background:transparent; color:var(--scene-ink,#ffffff)!important;
 font:500 13px/1.4 "DM Sans",sans-serif; text-decoration:none;
 transition:background .2s,color .2s,transform .2s;
}
body.ms-interactive .ms-case .ms-button:hover { transform:translateY(-2px); background:#ffffff14; }
body.ms-interactive .ms-controls button[aria-pressed="true"] { background:var(--scene-ink,#ffffff); color:var(--scene-bg,#111)!important; border-color:var(--scene-ink,#ffffff); }
.ms-interactive :is(.ms-button,.ms-controls button,.ms-motion-toggle):focus-visible { outline:2px solid #e9323b; outline-offset:5px; }
.ms-motion-toggle { display:block; margin-top:24px; padding:6px 0; border:0; background:none; color:inherit; opacity:.7; font:500 12px/1.4 "DM Sans",sans-serif; text-decoration:underline; text-underline-offset:4px; cursor:pointer; }
body.ms-interactive.project-midstream .ms-estate-hero { isolation:isolate; display:flex; align-items:center; width:100%; min-height:100svh; padding:155px 0 65px; overflow:hidden; }
.ms-estate-hero .ms-hero-media { position:absolute; inset:0; z-index:-2; }
.ms-estate-hero .ms-hero-media img { width:100%; height:100%; object-fit:cover; object-position:65% center; }
.ms-estate-hero::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(15,15,15,.84),rgba(15,15,15,.64) 55%,rgba(15,15,15,.25)); }
.ms-estate-hero .ms-hero-result { width:fit-content; max-width:100%; margin:28px 0; padding:14px 18px; border-left:3px solid #e9323b; background:#0f0f0fd1; }
.ms-estate-hero .ms-hero-result p { margin:0; color:#ff777d; font-size:16px; }
.ms-estate-hero .ms-hero-result span { display:block; margin-top:7px; color:#eee; font-size:14px; }
body.ms-interactive.project-midstream .ms-estate-hero h1 { font-size:clamp(52px,8vw,108px); line-height:1.05; margin:18px 0; letter-spacing:-.055em; }
.ms-estate-hero .ms-deck { max-width:32ch; margin:20px 0 28px; font-size:clamp(18px,2vw,25px); line-height:1.35; color:#ffffff; }
.ms-estate-intro { padding:44px 0 60px; }
.ms-estate-intro .ms-lead { max-width:850px; }
.ms-estate-intro .ms-photo-caption { font-size:12px; color:#aaa; margin-top:24px; }
.ms-estate-intro a { color:inherit; }
@media(max-width:700px) {
 body.ms-interactive.project-midstream .ms-estate-hero { padding:130px 0 45px; }
 body.ms-interactive.project-midstream .ms-estate-hero h1 { font-size:clamp(38px,10.4vw,72px); }
 .ms-estate-hero::after { background:#0f0f0fb3; }
}
body.ms-interactive .ms-case .ms-button, body.ms-interactive .ms-controls button { box-sizing:border-box; min-height:44px; }
body.ms-interactive.project-midstream .ms-estate-hero h1 { font-family:"Funnel Display",sans-serif; font-weight:600; text-transform:none; letter-spacing:-.045em; }

.ms-chart-value { font-variant-numeric:tabular-nums; }

/* Contain parallax inside the photograph, keeping following copy unobscured. */
.ms-interactive .ms-hero-media { overflow:hidden; }
body.ms-interactive.project-midstream-shopping .ms-hero-facts { position:relative; padding-block:56px 64px; }
.ms-interactive .ms-hero-facts .ms-standfirst { max-width:950px; margin-bottom:28px; }
body.ms-interactive.project-midstream-shopping .ms-hero-facts .ms-photo-caption { font-size:12px!important; color:#aaa; }
.ms-interactive .ms-evidence-record { display:grid; grid-template-columns:minmax(200px,.7fr) minmax(0,2fr); gap:64px; border-top:2px solid #141414; margin-top:64px; padding-top:40px; }
.ms-evidence-label { display:block; color:#b8161a; font:600 11px/1.4 "DM Sans",sans-serif; text-transform:uppercase; letter-spacing:.12em; margin-bottom:24px; }
body.ms-interactive #ms-evidence .ms-evidence-heading h3 { font-size:clamp(28px,3vw,42px); line-height:1.08; letter-spacing:-.035em; margin:0 0 24px; }
body.ms-interactive #ms-evidence .ms-evidence-heading p { color:#666; }
.ms-evidence-data { min-width:0; }
.ms-evidence-data table { margin:0; font-variant-numeric:tabular-nums; }
.ms-evidence-data caption { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
body.ms-interactive #ms-evidence .ms-evidence-data th,body.ms-interactive #ms-evidence .ms-evidence-data td { padding:22px 12px; }
body.ms-interactive #ms-evidence .ms-evidence-data thead th { padding-top:0; font-size:12px; font-weight:500; color:#666; }
body.ms-interactive #ms-evidence .ms-evidence-data tbody td { font-size:clamp(18px,2vw,28px); letter-spacing:-.025em; }
body.ms-interactive #ms-evidence .ms-evidence-data tbody td:last-child { color:#b8161a; font-weight:600; }
body.ms-interactive #ms-evidence .ms-evidence-data tbody th { font-size:14px; font-weight:500; }
body.ms-interactive #ms-evidence .ms-evidence-data .ms-source { margin-top:28px; font-size:12px!important; line-height:1.6!important; color:#666; max-width:80ch; }
@media(max-width:800px) {
 .ms-interactive .ms-evidence-record { grid-template-columns:1fr; gap:20px; margin-top:40px; }
 .ms-evidence-heading p { display:none; }
 .ms-evidence-data table { min-width:570px; }
 body.ms-interactive.project-midstream-shopping .ms-hero-facts { padding-block:36px 44px; }
}
