/* MSITC subpages: one lightweight cosmic system, without canvas or JS particles. */
.subpage-shell {
  --cosmic-blue: 77, 126, 255;
  --cosmic-violet: 143, 76, 255;
  --cosmic-pink: 255, 79, 123;
  min-height: 100%;
  overflow-x: hidden;
  background: #05070d;
}

@supports (overflow: clip) {
  .subpage-shell { overflow-x: clip; }
}

.subpage-shell::before,
.subpage-shell::after {
  position: fixed;
  inset: 0;
  z-index: 0;
  content: "";
  pointer-events: none;
}

/* A single sparse star layer. It is rasterised once and only changes opacity. */
.subpage-shell::before {
  opacity: .34;
  background-image:
    radial-gradient(circle, rgba(242, 246, 255, .82) 0 .7px, transparent 1.15px),
    radial-gradient(circle, rgba(122, 182, 255, .58) 0 .65px, transparent 1.1px),
    radial-gradient(circle, rgba(217, 190, 255, .52) 0 .55px, transparent 1px),
    radial-gradient(circle, rgba(255, 133, 177, .32) 0 .5px, transparent .95px);
  background-size: 211px 211px, 307px 307px, 401px 401px, 557px 557px;
  background-position: 19px 31px, 101px 73px, 177px 129px, 263px 47px;
  animation: msitc-star-breathe 16s ease-in-out infinite alternate;
}

/* Static depth: gradients replace large blurred elements and extra DOM nodes. */
.subpage-shell::after {
  opacity: .72;
  background:
    radial-gradient(ellipse 46% 32% at 9% 21%, rgba(var(--cosmic-violet), .105), transparent 72%),
    radial-gradient(ellipse 40% 34% at 92% 48%, rgba(var(--cosmic-blue), .08), transparent 74%),
    radial-gradient(ellipse 42% 25% at 48% 93%, rgba(var(--cosmic-pink), .045), transparent 75%),
    linear-gradient(180deg, rgba(4, 6, 12, .12), rgba(4, 6, 12, .72));
}

.subpage-shell > :not(.skip-link):not(.content-drawer):not(.mobile-menu) {
  position: relative;
  z-index: 1;
}

.subpage-shell main {
  isolation: isolate;
  background:
    linear-gradient(90deg, transparent, rgba(125, 145, 205, .035) 50%, transparent),
    linear-gradient(180deg, rgba(6, 8, 14, .72), rgba(5, 7, 13, .42));
}

/* Section depth and transitions. */
.subpage-shell :is(
  .about-intro,.about-process,.about-approach,.about-work,.about-team,
  .work-list,.case-gallery,.case-quote,.case-related,.case-cta,
  .insights-list,.article-related,.article-cta,
  .profile-details,.profile-work,.profile-articles,
  .people,.team-contact,.contact-page > section:not(.contact-hero),
  .service-related
) {
  position: relative;
  isolation: isolate;
}

.subpage-shell :is(
  .about-intro,.about-process,.about-approach,.about-work,.about-team,
  .work-list,.case-gallery,.case-quote,.case-related,
  .insights-list,.article-related,.profile-details,.profile-work,.profile-articles,
  .people,.contact-page > section:not(.contact-hero)
)::after {
  position: absolute;
  right: 7%;
  bottom: -1px;
  left: 7%;
  z-index: 2;
  height: 1px;
  content: "";
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(111, 244, 255, .16) 32%, rgba(143, 76, 255, .22) 68%, transparent);
  box-shadow: 0 0 26px rgba(91, 111, 255, .1);
}

.subpage-shell :is(.about-process,.about-team,.profile-work,.profile-articles,.article-related,.case-gallery) {
  background-color: rgba(8, 10, 17, .72) !important;
}

.subpage-shell :is(.about-intro,.about-approach,.about-work,.profile-details,.case-related,.insights-list,.people) {
  background-color: rgba(5, 8, 14, .42);
}

/* Shared hero atmosphere. Existing layout and typography remain untouched. */
.subpage-shell :is(.about-hero,.work-hero,.insights-hero,.article-hero,.profile-hero,.contact-hero) {
  background:
    radial-gradient(ellipse 46% 52% at 78% 22%, rgba(var(--cosmic-violet), .17), transparent 72%),
    radial-gradient(ellipse 38% 44% at 12% 78%, rgba(var(--cosmic-blue), .085), transparent 74%),
    linear-gradient(145deg, rgba(10, 14, 27, .97), rgba(6, 8, 15, .94) 56%, rgba(10, 7, 17, .96)) !important;
}

.subpage-shell :is(.about-hero,.work-hero,.insights-hero,.article-hero,.profile-hero,.contact-hero)::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  pointer-events: none;
  opacity: .34;
  background:
    radial-gradient(circle at 13% 25%, rgba(255,255,255,.72) 0 .75px, transparent 1.3px),
    radial-gradient(circle at 31% 72%, rgba(120,184,255,.58) 0 .7px, transparent 1.25px),
    radial-gradient(circle at 57% 18%, rgba(255,255,255,.5) 0 .65px, transparent 1.2px),
    radial-gradient(circle at 76% 61%, rgba(190,157,255,.58) 0 .8px, transparent 1.35px),
    radial-gradient(circle at 92% 31%, rgba(255,129,174,.38) 0 .65px, transparent 1.2px);
}

.subpage-shell :is(.about-hero,.work-hero,.insights-hero,.article-hero,.profile-hero,.contact-hero) :is(h1,.content-lead) {
  animation: msitc-cosmic-entry .75s cubic-bezier(.22,1,.36,1) both;
}

.subpage-shell :is(.about-hero,.work-hero,.insights-hero,.article-hero,.profile-hero,.contact-hero) .content-lead {
  animation-delay: 90ms;
}

/* About: a restrained technological process axis. */
.about-process ol {
  position: relative;
}

.about-process ol::before {
  position: absolute;
  top: 30px;
  bottom: 30px;
  left: 44px;
  width: 1px;
  content: "";
  background: linear-gradient(180deg, rgba(111,244,255,.08), rgba(111,244,255,.55) 18%, rgba(143,76,255,.48) 75%, rgba(255,79,123,.08));
  box-shadow: 0 0 18px rgba(111,244,255,.12);
}

.about-process li {
  position: relative;
}

.about-process li > span {
  position: relative;
  z-index: 1;
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  margin-left: 25px;
  border: 1px solid rgba(111,244,255,.24);
  border-radius: 50%;
  background: #090d17;
  box-shadow: 0 0 25px rgba(93,111,255,.08);
}

.about-process li:nth-child(n+4) > span { border-color: rgba(177,112,255,.28); }

/* Cards receive depth from borders and gradients, not animated filters. */
.subpage-shell :is(.content-project-card,.insight-card,.about-team__grid > a,.profile-columns > div,.article-layout aside > div,.contact-direct > a,.contact-brief) {
  border-color: rgba(159, 169, 220, .16);
  background-color: rgba(10, 12, 20, .78);
  box-shadow: 0 28px 70px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.025);
}

.subpage-shell :is(.content-project-card,.insight-card,.about-team__grid > a,.contact-direct > a) {
  transition: transform .42s cubic-bezier(.22,1,.36,1), border-color .42s ease, background-color .42s ease;
}

.subpage-shell :is(.content-project-card,.insight-card,.about-team__grid > a,.contact-direct > a):hover {
  transform: translateY(-3px);
  border-color: rgba(126, 154, 255, .32);
  background-color: rgba(13, 16, 27, .9);
}

/* Case-study accents remain part of one visual system. */
.case-study { --case-accent: 105, 130, 255; --case-secondary: 143, 76, 255; }
.case-study--urdiamant { --case-accent: 91, 137, 255; --case-secondary: 137, 82, 232; }
.case-study--mkk { --case-accent: 193, 177, 211; --case-secondary: 116, 91, 160; }
.case-study--cpe { --case-accent: 70, 211, 224; --case-secondary: 68, 127, 255; }
.case-study--espresso { --case-accent: 255, 111, 157; --case-secondary: 155, 75, 220; }

.subpage-shell .case-hero {
  background:
    radial-gradient(ellipse 53% 58% at 78% 36%, rgba(var(--case-accent), .18), transparent 70%),
    radial-gradient(ellipse 38% 44% at 20% 82%, rgba(var(--case-secondary), .09), transparent 72%),
    linear-gradient(145deg, #090d18, #070910 60%, #0a0710) !important;
}

.case-hero__media {
  overflow: visible;
  border-color: rgba(var(--case-accent), .26);
  background: rgba(4,6,11,.82);
  box-shadow: 0 38px 95px rgba(0,0,0,.42), 0 0 58px rgba(var(--case-accent), .09);
  transform: perspective(1300px) rotateY(-1.4deg) rotateX(.5deg);
}

.case-hero__media::before,
.case-hero__media::after {
  position: absolute;
  z-index: -1;
  content: "";
  pointer-events: none;
}

.case-hero__media::before {
  inset: -22px;
  border: 1px solid rgba(var(--case-accent), .1);
  transform: translate(10px, -8px);
}

.case-hero__media::after {
  right: -16px;
  bottom: -16px;
  width: 78px;
  height: 78px;
  border-right: 1px solid rgba(var(--case-accent), .5);
  border-bottom: 1px solid rgba(var(--case-accent), .5);
}

.case-hero__media img { position: relative; z-index: 1; }

.case-body {
  position: relative;
}

.case-body::before {
  position: absolute;
  top: 72px;
  bottom: 130px;
  left: 54px;
  width: 1px;
  content: "";
  pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(var(--case-accent), .3) 12%, rgba(var(--case-secondary), .22) 82%, transparent);
}

.case-section__number { color: rgba(var(--case-accent), .72); }

.case-section--outcome {
  border-color: rgba(var(--case-accent), .2);
  background: linear-gradient(120deg, rgba(var(--case-accent), .1), rgba(var(--case-secondary), .04), transparent);
  box-shadow: 0 30px 80px rgba(0,0,0,.15);
}

.case-gallery figure {
  border-color: rgba(var(--case-accent), .18);
  box-shadow: 0 24px 64px rgba(0,0,0,.2);
}

/* Team and profile: spatial framing without grey cards. */
.subpage-shell .team-hero {
  background:
    radial-gradient(ellipse 48% 62% at 18% 43%, rgba(143,76,255,.2), transparent 72%),
    radial-gradient(ellipse 39% 52% at 84% 30%, rgba(61,126,255,.14), transparent 72%),
    linear-gradient(145deg,#080d19,#060810 65%,#0a0712);
}

.person-card {
  border-color: rgba(140,155,220,.18);
  background: linear-gradient(135deg,rgba(12,16,28,.92),rgba(7,9,16,.92));
  box-shadow: 0 36px 86px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.025);
}

.person-card__visual,
.profile-portrait {
  background:
    radial-gradient(circle at 50% 48%, rgba(143,76,255,.25), transparent 42%),
    linear-gradient(rgba(115,136,210,.055) 1px, transparent 1px),
    linear-gradient(90deg,rgba(115,136,210,.055) 1px, transparent 1px),
    #080b13;
  background-size: auto, 42px 42px, 42px 42px, auto;
  box-shadow: 0 32px 86px rgba(0,0,0,.25), 0 0 60px rgba(143,76,255,.07);
}

.profile-columns li::before {
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 10px;
  border-radius: 50%;
  background: var(--content-cyan);
  box-shadow: 0 0 10px rgba(111,244,255,.45);
  content: "";
  vertical-align: 2px;
}

/* Insights stays deliberately calmer. */
.insights-page,
.article-page { --cosmic-violet: 110, 99, 210; --cosmic-blue: 81, 154, 220; }

.article-body {
  text-shadow: 0 1px 18px rgba(0,0,0,.16);
}

.article-body h2 {
  position: relative;
  padding-top: 22px;
}

.article-body h2::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 86px;
  height: 1px;
  content: "";
  background: linear-gradient(90deg, var(--content-cyan), rgba(143,76,255,.15));
  box-shadow: 0 0 14px rgba(111,244,255,.16);
}

/* Signature systems for About, Work and Insights. */
.about-hero .content-shell,.work-hero .content-shell,.insights-hero .content-shell,.case-hero .content-shell{position:relative}
.about-hero,.insights-hero,.article-hero{overflow:hidden}
.about-hero .content-shell>:not(.about-system-map),.work-hero .content-shell>:not(.work-orbit-map),.insights-hero .content-shell>:not(.insights-signal-map),.case-hero .content-shell>:not(.case-signature){position:relative;z-index:1}
.about-system-map,.work-orbit-map,.insights-signal-map{position:absolute;top:76px;right:0;width:clamp(330px,42vw,610px);aspect-ratio:1.35;z-index:0;pointer-events:none;opacity:.72}
.about-system-map:before,.about-system-map:after,.about-system-map i,.work-orbit-map:before,.work-orbit-map:after,.work-orbit-map i,.insights-signal-map:before,.insights-signal-map:after,.insights-signal-map i{position:absolute;content:"";pointer-events:none}
.about-system-map:before{inset:10% 8%;border:1px solid rgba(111,244,255,.16);border-radius:50%;transform:rotate(-9deg)}
.about-system-map:after{inset:24% 20%;border:1px solid rgba(143,76,255,.2);transform:rotate(24deg)}
.about-system-map i:nth-child(1){inset:4% 26% 17% 12%;border:1px solid rgba(99,128,255,.13);border-radius:50%}
.about-system-map i:nth-child(2){width:22%;aspect-ratio:1;right:10%;top:16%;border:1px solid rgba(255,79,123,.2);transform:rotate(45deg)}
.about-system-map i:nth-child(3){width:11%;aspect-ratio:1;left:22%;bottom:8%;border:1px solid rgba(111,244,255,.22);clip-path:polygon(50% 0,100% 100%,0 100%);background:rgba(79,114,255,.035)}
.about-system-map span,.work-orbit-map span,.insights-signal-map span{position:absolute;width:12px;height:12px;border:1px solid rgba(111,244,255,.58);border-radius:50%;background:#080c16;box-shadow:0 0 18px rgba(111,244,255,.22)}
.about-system-map span:after,.work-orbit-map span:after,.insights-signal-map span:after{position:absolute;top:15px;left:-4px;color:rgba(210,222,255,.52);content:attr(data-node);font:600 9px ui-monospace,monospace;letter-spacing:.08em}
.about-system-map span:nth-of-type(1){top:19%;left:28%}.about-system-map span:nth-of-type(2){top:51%;left:61%}.about-system-map span:nth-of-type(3){right:14%;bottom:17%}
.about-system-map b,.work-orbit-map b,.insights-signal-map b{position:absolute;right:9%;bottom:4%;color:rgba(199,211,255,.36);font:600 9px ui-monospace,monospace;letter-spacing:.16em}

.about-process ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;background:linear-gradient(27deg,transparent 49.8%,rgba(111,244,255,.07) 50%,transparent 50.2%)}
.about-process ol:before{top:50%;right:4%;bottom:auto;left:4%;width:auto;height:1px}
.about-process li{display:block;min-height:230px;padding:28px;border:1px solid rgba(138,157,222,.14);background:linear-gradient(145deg,rgba(12,16,27,.86),rgba(7,10,17,.78))}
.about-process li:nth-child(2),.about-process li:nth-child(5){transform:translateY(24px)}
.about-process li>span{margin:0 0 28px}
.about-approach .content-shell:after{position:absolute;right:7%;bottom:8%;width:170px;aspect-ratio:1;border:1px solid rgba(143,76,255,.13);border-radius:50%;content:"";pointer-events:none;box-shadow:inset 0 0 0 34px rgba(111,244,255,.018),inset 0 0 0 68px rgba(143,76,255,.018)}

.work-orbit-map:before{inset:8% 5%;border:1px solid rgba(111,244,255,.16);border-radius:50%;transform:rotate(8deg)}
.work-orbit-map:after{inset:24% 21%;border:1px solid rgba(143,76,255,.22);border-radius:50%;transform:rotate(-18deg)}
.work-orbit-map i{top:50%;left:4%;width:92%;height:1px;background:linear-gradient(90deg,transparent,rgba(111,244,255,.14),rgba(255,79,123,.12),transparent);transform:rotate(-15deg)}
.work-orbit-map span:after{content:attr(data-project)}
.work-orbit-map span:nth-of-type(1){top:12%;left:29%}.work-orbit-map span:nth-of-type(2){top:47%;left:14%}.work-orbit-map span:nth-of-type(3){right:23%;bottom:17%;border-color:rgba(255,79,123,.55)}.work-orbit-map span:nth-of-type(4){top:23%;right:10%;border-color:rgba(143,76,255,.6)}
.work-project{position:relative;isolation:isolate}.work-project:before{position:absolute;top:14px;right:16px;z-index:3;color:rgba(225,232,255,.42);content:attr(data-project-index);pointer-events:none;font:600 10px ui-monospace,monospace;letter-spacing:.16em}.work-project:after{position:absolute;inset:-7px;z-index:-1;border-top:1px solid rgba(111,244,255,.14);border-right:1px solid rgba(143,76,255,.12);content:"";pointer-events:none}.work-project:nth-child(2):after{border-color:rgba(198,183,213,.18)}.work-project:nth-child(3):after{border-color:rgba(70,211,224,.2)}.work-project:nth-child(4):after{border-color:rgba(255,111,157,.2)}

.case-signature{position:absolute;top:78px;right:0;width:145px;height:96px;z-index:2;pointer-events:none}.case-signature span{position:absolute;right:0;bottom:0;color:rgba(var(--case-accent),.62);font:600 9px ui-monospace,monospace;letter-spacing:.16em}.case-signature i{position:absolute;display:block;border:1px solid rgba(var(--case-accent),.28)}.case-signature i:first-child{inset:8px 30px 25px 18px;transform:rotate(45deg)}.case-signature i:last-child{inset:22px 10px 11px 54px;transform:rotate(45deg);border-color:rgba(var(--case-secondary),.24)}
.case-study--mkk .case-signature i{transform:skewY(-18deg);border-radius:0}.case-study--cpe .case-signature i{transform:none;border-width:1px 0 0 1px;box-shadow:-9px 9px 0 -8px rgba(var(--case-accent),.7)}.case-study--espresso .case-signature i{transform:none;border-radius:50%}
.case-section{position:relative}.case-section:not(:last-child):after{position:absolute;bottom:-5px;left:50px;width:9px;height:9px;border-right:1px solid rgba(var(--case-accent),.5);border-bottom:1px solid rgba(var(--case-accent),.5);content:"";pointer-events:none;transform:rotate(45deg)}
.case-section--outcome:before{position:absolute;top:20px;right:24px;color:rgba(var(--case-accent),.46);content:"RESULT / VERIFIED FIELD";pointer-events:none;font:600 9px ui-monospace,monospace;letter-spacing:.14em}
.case-gallery figure{position:relative}.case-gallery figure:after{position:absolute;top:11px;right:12px;padding:5px 7px;border:1px solid rgba(var(--case-accent),.24);color:rgba(255,255,255,.68);background:rgba(5,7,12,.72);content:attr(data-gallery-index);pointer-events:none;font:600 9px ui-monospace,monospace}

.insights-signal-map:before{top:18%;right:6%;bottom:18%;left:8%;border-top:1px solid rgba(111,244,255,.13);border-bottom:1px solid rgba(143,76,255,.14);transform:skewY(-9deg)}
.insights-signal-map:after{top:48%;left:9%;width:82%;height:1px;background:linear-gradient(90deg,transparent,rgba(111,244,255,.22),rgba(143,76,255,.16),transparent);transform:rotate(18deg)}
.insights-signal-map i:first-child{inset:12% 14%;border:1px solid rgba(111,244,255,.12);border-radius:50%}.insights-signal-map i:last-child{inset:28% 31%;border:1px solid rgba(143,76,255,.14);transform:rotate(45deg)}.insights-signal-map span:after{content:attr(data-signal)}
.insights-signal-map span:nth-of-type(1){top:17%;left:20%}.insights-signal-map span:nth-of-type(2){top:53%;left:51%}.insights-signal-map span:nth-of-type(3){right:12%;bottom:20%}
.insight-card{position:relative}.insight-card:before{position:absolute;top:17px;right:20px;color:rgba(202,214,255,.32);content:"ARTICLE / " attr(data-article-index);pointer-events:none;font:600 9px ui-monospace,monospace;letter-spacing:.14em}

.article-progress{position:fixed;top:0;right:0;left:0;z-index:100;height:2px;pointer-events:none;background:rgba(255,255,255,.035)}.article-progress span{display:block;width:100%;height:100%;background:linear-gradient(90deg,var(--content-cyan),#8f4cff,#ff4f7b);box-shadow:0 0 12px rgba(111,244,255,.26);transform:scaleX(0);transform-origin:0 50%}
.article-body h2{display:grid;grid-template-columns:42px minmax(0,1fr) 24px;gap:10px;scroll-margin-top:110px}.article-heading-number{padding-top:8px;color:rgba(111,244,255,.68);font:600 10px ui-monospace,monospace;letter-spacing:.08em}.article-heading-anchor{align-self:start;padding-top:3px;color:rgba(150,167,221,.34);font-size:20px;text-decoration:none}.article-heading-anchor:hover,.article-heading-anchor:focus-visible{color:var(--content-cyan)}
.article-body blockquote{margin:42px 0;padding:26px 28px 26px 38px;border:1px solid rgba(111,244,255,.14);border-left:2px solid var(--content-cyan);background:linear-gradient(110deg,rgba(111,244,255,.055),rgba(143,76,255,.035))}.article-body blockquote p{margin:0;color:#f0edf5;font-size:clamp(21px,2.4vw,29px)}.article-body pre{max-width:100%;overflow:auto;margin:36px 0;padding:22px;border:1px solid rgba(143,160,222,.16);background:#060910;color:#cceff1;font-size:14px}.article-body ul{padding:22px 24px 22px 46px;border-left:1px solid rgba(143,76,255,.22);background:rgba(12,14,23,.45)}
.article-toc{position:sticky;top:108px;display:block;padding:24px;border:1px solid rgba(141,158,218,.15);background:rgba(9,12,20,.82)}.article-toc ol{display:grid;gap:12px;margin:0;padding:0;list-style:none}.article-toc a{display:grid;grid-template-columns:28px 1fr;gap:8px;color:#d1ced8;font-size:13px;line-height:1.35}.article-toc a span{color:rgba(111,244,255,.62);font:600 9px ui-monospace,monospace}.article-author a{display:grid;gap:5px}.article-author span{color:var(--content-cyan);font-size:13px}

/* Contact: intentional empty space around a focused brief. */
.contact-page > section:not(.contact-hero) {
  background:
    radial-gradient(ellipse 34% 46% at 11% 74%, rgba(111,244,255,.055), transparent 74%),
    radial-gradient(ellipse 38% 54% at 88% 18%, rgba(255,79,123,.065), transparent 74%),
    rgba(5,8,14,.38);
}

/* Service templates use the same atmosphere without altering their structures. */
.service-subpage-shell main {
  background: linear-gradient(180deg, rgba(5,8,15,.28), rgba(4,6,11,.58));
}

.service-subpage-shell :is(.metric-section,.services-section,.method-section,.service-story,.comparison-section,.process-section,.estimator-section,.faq-section,.next-service,.service-related) {
  position: relative;
  isolation: isolate;
  background-color: rgba(6,9,16,.38);
}

.service-subpage-shell :is(.metric-section,.services-section,.method-section,.service-story,.comparison-section,.process-section,.estimator-section,.faq-section,.service-related)::after {
  position: absolute;
  right: 8%;
  bottom: 0;
  left: 8%;
  height: 1px;
  content: "";
  pointer-events: none;
  background: linear-gradient(90deg,transparent,rgba(var(--accent-rgb),.2),rgba(143,76,255,.16),transparent);
}

.service-subpage-shell :is(.metric-card,.feature-grid article,.comparison-table,.estimator,.service-related__grid > a) {
  border-color: rgba(var(--accent-rgb), .16);
  background-color: rgba(9,13,23,.82);
}

@supports (content-visibility: auto) {
  .subpage-shell main > section:not([class*="hero"]),
  .subpage-shell .case-body,
  .service-subpage-shell main > section:not(.service-hero) {
    content-visibility: auto;
    contain-intrinsic-size: auto 760px;
  }
}

@keyframes msitc-star-breathe {
  from { opacity: .25; }
  to { opacity: .38; }
}

@keyframes msitc-cosmic-entry {
  from { opacity: 0; transform: translate3d(0,18px,0); }
  to { opacity: 1; transform: none; }
}

@media (max-width: 900px) {
  .subpage-shell::before {
    opacity: .24;
    background-image:
      radial-gradient(circle,rgba(242,246,255,.68) 0 .65px,transparent 1.1px),
      radial-gradient(circle,rgba(125,183,255,.46) 0 .55px,transparent 1px);
    background-size: 263px 263px, 401px 401px;
    animation: none;
  }

  .subpage-shell::after {
    opacity: .58;
    background:
      radial-gradient(ellipse 72% 30% at 8% 18%,rgba(var(--cosmic-violet),.08),transparent 72%),
      radial-gradient(ellipse 68% 28% at 94% 67%,rgba(var(--cosmic-blue),.055),transparent 74%),
      linear-gradient(180deg,rgba(4,6,12,.16),rgba(4,6,12,.72));
  }

  .case-hero__media { transform: none; }
  .case-hero__media::before { inset: -10px; transform: translate(4px,-3px); }
  .case-body::before { left: 26px; opacity: .55; }
  .about-process ol { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .about-process ol::before { display: none; }
  .about-process li:nth-child(2),.about-process li:nth-child(5) { transform: none; }
  .article-toc { display: none; }
}

@media (max-width: 600px) {
  .subpage-shell::before { opacity: .18; }
  .subpage-shell::after {
    background: radial-gradient(ellipse 88% 25% at 20% 18%,rgba(var(--cosmic-violet),.065),transparent 74%),#05070d;
  }

  .subpage-shell :is(.about-hero,.work-hero,.insights-hero,.article-hero,.profile-hero,.contact-hero)::before {
    opacity: .2;
  }

  .about-process ol::before,
  .case-body::before { display: none; }

  .about-process li > span { margin-left: 0; }
  .about-process ol { grid-template-columns: 1fr; background: none; }
  .about-process li { min-height: 0; padding: 22px; }
  .about-system-map,.work-orbit-map,.insights-signal-map { top: 100px; right: -20%; width: 300px; opacity: .32; }
  .about-system-map i:nth-child(2),.about-system-map i:nth-child(3),.work-orbit-map span:nth-of-type(n+3),.insights-signal-map span:nth-of-type(n+3) { display: none; }
  .case-signature { top: 96px; right: -18px; width: 96px; opacity: .45; }
  .case-section:not(:last-child)::after { display: none; }
  .article-body h2 { grid-template-columns: 30px minmax(0,1fr); }
  .article-heading-anchor { display: none; }
  .article-hero h1,.article-hero .content-breadcrumb { overflow-wrap: anywhere; word-break: normal; }
  .case-hero__media::after { width: 42px; height: 42px; right: -7px; bottom: -7px; }

  .subpage-shell :is(.content-project-card,.insight-card,.about-team__grid > a,.contact-direct > a):hover {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .subpage-shell::before,
  .subpage-shell :is(.about-hero,.work-hero,.insights-hero,.article-hero,.profile-hero,.contact-hero) :is(h1,.content-lead) {
    animation: none !important;
  }

  .subpage-shell :is(.content-project-card,.insight-card,.about-team__grid > a,.contact-direct > a) {
    transition: none !important;
  }

  .article-progress span { transition: none !important; }
}