/* DCS Labs additions on top of the R-Series design system (site.css). Same tokens, same dark look. */
:root{--cx:#59DBFF;--grn:#70F1B5;--orb:#FFCD8C}
.hero.labs h1{font-size:clamp(44px,6.6vw,96px);line-height:1.02;max-width:12.5ch}
.hero.labs .lede{max-width:54ch}
.hero.labs .eyebrow b{color:var(--amber);font-weight:500}

/* counters */
.counters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:18px;overflow:hidden;margin-top:40px}
.counters>div{background:var(--ink2);padding:28px 24px 24px;min-width:0}
.counters b{display:block;font:500 clamp(34px,4.2vw,56px)/1 var(--display);letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.counters span{display:block;margin-top:12px;color:var(--dim);font-size:14px;line-height:1.45}
.counters em{font-style:normal;display:block;margin-top:10px;font:500 10.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
@media (max-width:900px){.counters{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.counters{grid-template-columns:minmax(0,1fr)}}

/* constellation */
.constel{position:relative;height:min(78vh,640px);min-height:440px;margin-top:40px;border:1px solid var(--line);border-radius:22px;overflow:hidden;background:radial-gradient(700px 400px at 50% 50%,rgba(255,181,71,.06),transparent 70%),var(--ink2)}
.constel canvas{position:absolute;inset:0;width:100%;height:100%}
.constel .node{position:absolute;transform:translate(-50%,calc(-50% + 64px));text-align:center;text-decoration:none;color:var(--fg);width:min(250px,40vw)}
.constel .node.big{transform:translate(-50%,calc(-50% + 88px))}
.constel .node b{display:block;font:600 18px var(--display);letter-spacing:.02em}
.constel .node span{display:block;margin-top:4px;color:var(--dim);font-size:13px;line-height:1.4}
.constel .node .st{margin-top:8px}
.constel .node:hover b,.constel .node:focus-visible b{color:var(--amber)}
.constel .node.dim{opacity:.55;pointer-events:none}
@media (max-width:640px){.constel{height:auto;min-height:0;padding:24px 18px;display:grid;gap:18px}.constel canvas{opacity:.35}.constel .node,.constel .node.big{position:relative;left:auto!important;top:auto!important;transform:none;width:auto;text-align:left;padding:14px 16px;border:1px solid var(--line2);border-radius:14px;background:rgba(10,11,13,.6)}}

/* pipeline */
.pipe{position:relative;height:260px;margin-top:36px;border:1px solid var(--line);border-radius:22px;background:var(--ink2);overflow:hidden}
.pipe canvas{position:absolute;inset:0;width:100%;height:100%}
.pipe-notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:22px}
.pipe-notes>div{padding:20px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.015);min-width:0}
.pipe-notes h3{margin:0 0 6px;font:600 17px var(--display)}
.pipe-notes p{margin:0;color:var(--dim);font-size:14.5px}
@media (max-width:900px){.pipe-notes{grid-template-columns:minmax(0,1fr)}}

/* research areas + programme cards */
.areas{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-top:36px}
.areas>div{padding:22px 18px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.015);min-width:0}
.areas i{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:10px;border:1px solid var(--line2);font:600 12px var(--mono);font-style:normal;color:var(--amber)}
.areas h3{margin:14px 0 6px;font:600 16px var(--display)}
.areas p{margin:0;color:var(--dim);font-size:14px;line-height:1.5}
@media (max-width:1100px){.areas{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.areas{grid-template-columns:minmax(0,1fr)}}

/* status board */
.board{margin-top:36px;border:1px solid var(--line);border-radius:18px;overflow:hidden}
.board .row{display:grid;grid-template-columns:200px 1fr 220px;gap:18px;align-items:center;padding:18px 22px;border-top:1px solid var(--line);background:var(--ink2)}
.board .row:first-child{border-top:0}
.board .row b{font:600 16px var(--display)}
.board .row p{margin:0;color:var(--dim);font-size:14.5px}
.board .bar{height:6px;border-radius:3px;background:rgba(255,255,255,.08);overflow:hidden;display:flex}
.board .bar i{display:block;height:100%}
.board .bar .b1{background:var(--ok)} .board .bar .b2{background:rgba(143,211,191,.35)}
.board .lg{font:500 10.5px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mute);margin-top:8px}
@media (max-width:900px){.board .row{grid-template-columns:minmax(0,1fr)}}

/* in-browser verify */
.vdemo{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:20px;margin-top:36px}
.vdemo pre{margin:0;padding:20px;border-radius:16px;background:#07080A;border:1px solid var(--line);font:12.5px/1.65 var(--mono);color:#C9D1D8;overflow:auto;max-height:380px;white-space:pre-wrap;word-break:break-all}
.vsteps{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.vsteps li{display:flex;gap:12px;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--ink2);font-size:14.5px}
.vsteps li i{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font:600 12px var(--mono);font-style:normal;border:1px solid var(--line2);color:var(--dim);flex:none}
.vsteps li.ok i{background:var(--ok);color:#06110D;border-color:var(--ok)}
.vsteps li.bad i{background:var(--red);color:#1A0507;border-color:var(--red)}
.vverdict{margin-top:14px;padding:14px 16px;border-radius:12px;font:600 15px var(--display);border:1px solid var(--line2)}
.vverdict.ok{color:var(--ok);border-color:rgba(143,211,191,.6)} .vverdict.bad{color:var(--red);border-color:rgba(255,93,108,.6)}
.vbtns{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
@media (max-width:900px){.vdemo{grid-template-columns:minmax(0,1fr)}}

/* films placeholder */
.films-hold{margin-top:30px;padding:40px 28px;border:1px dashed var(--line2);border-radius:18px;text-align:center;color:var(--dim)}

/* programme pages: slim "enter the site" bar under the header */
.enterbar{position:fixed;z-index:49;left:0;right:0;top:calc(64px + env(safe-area-inset-top,0px));background:rgba(10,11,13,.86);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.enterbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;height:44px}
.enterbar span{font:500 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.enterbar a{font:600 13px var(--body);color:var(--ink);background:var(--cx);padding:7px 14px;border-radius:99px;text-decoration:none;white-space:nowrap}
.enterbar.orb a{background:var(--orb)} .enterbar.ot a{background:var(--grn)}
.prog-hero{padding-top:132px}
.enter-end{margin-top:28px;display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.enter-end .btn.big{font-size:16px;padding:14px 22px}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:36px}
.facts>div{padding:22px;border:1px solid var(--line);border-radius:16px;background:var(--ink2);min-width:0}
.facts h3{margin:0 0 8px;font:600 17px var(--display)}
.facts p{margin:0;color:var(--dim);font-size:14.5px}
@media (max-width:900px){.facts{grid-template-columns:minmax(0,1fr)}}
.sim-frame{margin-top:30px;border:1px solid var(--line2);border-radius:18px;overflow:hidden;aspect-ratio:16/9;max-width:100%;background:#000}
.sim-frame iframe{width:100%;height:100%;border:0;display:block}
/* programme heroes: headline left, subject right, never behind the text */
.prog-hero h1{font-size:clamp(40px,5.2vw,78px);line-height:1.03;max-width:11ch}
.prog-hero .lede{max-width:46ch}
.hero canvas.scene.side{left:auto;right:0;width:60%;-webkit-mask-image:linear-gradient(90deg,transparent,#000 22%);mask-image:linear-gradient(90deg,transparent,#000 22%)}
@media (max-width:900px){.hero canvas.scene.side{width:100%;-webkit-mask-image:none;mask-image:none}}
/* home: earth hero + crossfading story acts */
.hero.labs.earth h1{font-size:clamp(46px,6.4vw,104px);max-width:11.5ch}
.story .pin.labs-acts canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0}
.story .step .more{font:600 13px var(--body);color:var(--amber);text-decoration:none}
#defence .band{margin-top:22px}
/* programme hero on the hero package footage (grey, no planet render) */
.hero.has-foot{position:relative;isolation:isolate;overflow:hidden}
.hero-foot{position:absolute;inset:0;z-index:-1;background:#0a0b0d}
.hero-foot img,.hero-foot video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:65% 50%;filter:saturate(.18) contrast(1.05) brightness(.82)}
.hero-foot video{opacity:0;transition:opacity 1.2s}.hero-foot video.on{opacity:1}
.hero-foot::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,11,13,.94) 0%,rgba(10,11,13,.78) 38%,rgba(10,11,13,.15) 75%),linear-gradient(0deg,rgba(10,11,13,.9),transparent 30%)}
.hero-foot-cap{position:absolute;right:clamp(16px,4vw,48px);bottom:18px;z-index:1;font:500 10px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:rgba(237,238,235,.45)}
@media (max-width:760px){.hero-foot img,.hero-foot video{object-position:70% 30%}.hero-foot::after{background:linear-gradient(0deg,rgba(10,11,13,.97) 45%,rgba(10,11,13,.55) 80%,rgba(10,11,13,.3))}}
/* enter link moved into the header (18 Oct) */
.hdr .hdr-enter{margin-left:auto;font:600 13px var(--body);color:var(--ink);background:var(--cx);padding:8px 15px;border-radius:99px;text-decoration:none;white-space:nowrap;transition:filter .2s}
.hdr .hdr-enter:hover{filter:brightness(1.08)}
.hdr .hdr-enter.orb{background:var(--orb)}.hdr .hdr-enter.ot{background:var(--grn)}
.hdr .nav .hdr-enter.mobonly{display:none}
.no-enterbar .prog-hero{padding-top:108px}
@media (max-width:1180px){.hdr .wrap>.hdr-enter{margin-left:12px}}
@media (max-width:640px){.hdr .wrap>.hdr-enter{display:none}.hdr .nav.mob .hdr-enter.mobonly{display:inline-flex;align-self:flex-start;margin-top:14px}}
/* header spans the full page (18 Oct): logo at the left gutter, Book a briefing at the right, same gutter as the home hero */
.hdr .wrap{max-width:none;padding-inline:clamp(20px,2.6vw,40px)}
/* hero scenes that measure the copy column (receiptHero, fleetGlobeXL) must see the real width of the action and meta rows */
.hero.labs-sub .wrap>.actions,.hero.labs-sub .wrap>.meta{width:fit-content;max-width:100%}
/* header never wraps: labels stay on one line; on programme pages with an Enter button the site switcher steps aside below 1560 px */
.hdr .nav button,.hdr .nav .cta,.hdr .hdr-enter{white-space:nowrap}
@media (max-width:1560px) and (min-width:1181px){.no-enterbar .hdr .wrap>.xsite{display:none}.no-enterbar .hdr .wrap>.hdr-enter{margin-left:28px}}

/* header tabs: readable over any hero, with a soft glass chip on hover and while a menu is open */
.hdr .nav button,.hdr .nav>a:not(.cta){color:#c9ced3}
.hdr .nav button:hover,.hdr .nav>a:not(.cta):hover,.hdr .nav button[aria-expanded="true"]{color:#fff;background:rgba(255,255,255,.09);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}

/* speed: no live blur behind the fixed header or the cookie bar (re-blurring moving video and canvas every frame made pages stutter) */
.hdr.solid{background:rgba(10,11,13,.94)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
#cc-bar{background:rgba(14,15,18,.97)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.hdr .nav button:hover,.hdr .nav>a:not(.cta):hover,.hdr .nav button[aria-expanded="true"]{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgba(255,255,255,.1)}
/* site switcher toward the centre (rseries site.css): on Labs pages the full nav needs the room between 1181 and 1319 px, so the switcher keeps the clamp minimum of 48px from the brand there */
@media (max-width:1319px) and (min-width:1181px){.hdr .wrap>.xsite{margin-left:24px}}