/* One navy canvas; decorative layers crossfade across section boundaries. */
:root{--site-navy:#03101e;--site-text:#eef3f8;--site-muted:#adbecd;--site-accent:#68c5e9;--site-line:#7a9bb52b;--site-waves:url('/assets/sections/navy-silk-v2.webp');--section-blend:clamp(84px,9vw,150px)}
body{background-color:var(--site-navy)}
main{position:relative;isolation:isolate;background:var(--site-navy)}
main>section:not(.experience),.site-section{position:relative;isolation:isolate;background:transparent;color:var(--site-text);box-shadow:none}
main>section:not(.experience):not(#about-us):not(#material-experience)::before,.site-section::before{
  content:'';position:absolute;inset:calc(-1 * var(--section-blend)) 0;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,#02081238,transparent 12%,transparent 88%,#02081248),var(--site-waves) center/100% 100% no-repeat;
  -webkit-mask-image:linear-gradient(transparent,#000 var(--section-blend),#000 calc(100% - var(--section-blend)),transparent);
  mask-image:linear-gradient(transparent,#000 var(--section-blend),#000 calc(100% - var(--section-blend)),transparent);
}
/* This sits at the physical end of the hero, outside its animated scene. */
.experience::after{content:'';position:absolute;inset:auto 0 -1px;height:clamp(120px,13vw,220px);z-index:6;pointer-events:none;background:linear-gradient(transparent,var(--site-navy))}
.services-stack .stack-eyebrow{color:#9fb7cd}.services-stack .stack-eyebrow:before{background:var(--site-accent)}
.services-stack .stack-intro-copy p,.services-stack .stack-scroll-cue{color:var(--site-muted)}
.services-stack .stack-scroll-cue span:first-child{color:var(--site-accent)}
.services-stack .stack-footnote{color:#9baec0;border-color:var(--site-line)}
.services-stack .stack-surface{box-shadow:0 25px 65px #00000070,0 0 0 1px #b4d3ee26}
@media(max-width:680px){
  main>section:not(.experience):not(#about-us):not(#material-experience)::before,.site-section::before{background-size:100% 100%,auto 100%;background-position:center,48% center}
}