/* Lower content and the shared portfolio/about transition; hero is untouched. */
:is(#about,#services,#approach,#contact){--depth-ink:#e1f3f6;--depth-muted:#aac4cc;--depth-line:#7cbdcc33;color:var(--depth-ink);background:#071e28;border:0;padding:100px 0;position:relative;isolation:isolate}
:is(#about,#services,#approach,#contact)>.shell{max-width:1200px}
:is(#about,#services,#approach,#contact):after{display:none}
:is(#about,#services,#approach,#contact) .section-index{color:#9cd8e4;font:600 11px/1.5 Manrope,sans-serif;letter-spacing:.18em}
:is(#about,#services,#approach,#contact) .section-note{color:#91b3bf;font:500 12px/1.8 Manrope,sans-serif;letter-spacing:.04em;max-width:420px;text-transform:none}
:is(#about,#approach) .section-top{border-bottom:1px solid var(--depth-line);padding-bottom:28px;align-items:start}
#about .section-top{border-bottom-color:transparent}
:is(#about,#services,#approach,#contact) h2{font-family:Unbounded,Manrope,sans-serif;font-size:clamp(32px,3.4vw,49px);font-weight:400;line-height:1.32;letter-spacing:-.045em;text-shadow:none;color:var(--depth-ink)}
:is(#about,#services,#approach,#contact) h2 em{font-family:inherit;font-weight:400;letter-spacing:inherit;color:#8dbfcf}
:is(#about,#services,#approach,#contact) .inline-link{color:#d6f8ff;border-color:#7db9c955;font-size:10px;letter-spacing:.12em;min-height:44px;align-items:center}
:is(#about,#services,#approach,#contact) a:focus-visible,:is(#about,#services,#approach,#contact) summary:focus-visible{outline:2px solid #b3edf7;outline-offset:6px}
/* One textured layer crosses the boundary instead of two fades to a flat band. */
#work:after{content:'';position:absolute;z-index:1;pointer-events:none;left:0;right:0;bottom:-1px;height:320px;background:linear-gradient(180deg,transparent,#071e2833 30%,#071e28b3 70%,#071e28)}
.depth-continuity{display:grid;grid-template-columns:minmax(0,1fr);position:relative;isolation:isolate;margin-top:-180px;background:linear-gradient(transparent 179px,#071e28 180px)}
.depth-continuity>#work{grid-area:1/1;margin-top:0}
#about{grid-area:2/1;min-width:0;padding-top:60px;background:transparent;z-index:3;overflow:visible}
#about:before{display:none}
.depth-continuity>#services{grid-area:3/1}
.depth-continuity>#approach{grid-area:4/1}
.depth-continuity>#contact{grid-area:5/1}
.lower-atmosphere{grid-area:3/1/6/2;min-width:0;position:relative;margin-top:-260px;z-index:2;pointer-events:none;background:url('assets/images/portfolio-depth-v1.webp') center/100% 100% no-repeat;opacity:.3;mask-image:linear-gradient(transparent,#000 350px,#000 75%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 350px,#000 75%,transparent)}
.lower-atmosphere svg{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:url(#lower-current);stroke-width:1;vector-effect:non-scaling-stroke}
.lower-atmosphere svg path+path{stroke-width:.5;opacity:.5}
.scene-continuation{grid-area:2/1;min-width:0;margin-top:-320px;z-index:2;pointer-events:none;background:url('assets/images/portfolio-depth-v1.webp') center bottom/100% 100% no-repeat;opacity:.48;mask-image:linear-gradient(transparent,#000 270px,#000 60%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 270px,#000 60%,transparent)}
#about .about-grid{grid-template-columns:1.12fr 1fr;align-items:center;gap:80px;padding:65px 0 60px}
#about .about-copy{max-width:480px;padding:0}
#about .about-copy p{color:var(--depth-muted);font:500 16px/1.8 Manrope,sans-serif;margin-bottom:20px}
#about .about-copy p:first-child{font-size:19px;line-height:1.7;color:#d3e9ee}
#about .value-grid{border:0;background:none;box-shadow:none;gap:20px}
#about .value-card{min-height:350px;padding:24px;border:1px solid var(--depth-line);background:linear-gradient(145deg,#1335438c,#081e28);border-radius:3px;box-shadow:inset 0 1px #c2f4ff0d;transition:transform .25s,border-color .25s}
#about .value-card:hover{transform:translateY(-4px);background:#102d39;border-color:#8acee166}
#about .value-card>span{color:#89bacb;font:500 10px/1.5 Manrope,sans-serif;letter-spacing:.18em}
#about .value-card h3{font:600 19px/1.45 Manrope,sans-serif;letter-spacing:-.02em;color:#e0f2f6;margin:17px 0 12px}
#about .value-card>p{color:#a7c0ca;font:400 14px/1.75 Manrope,sans-serif;margin:0}
#about .module-art{height:155px;margin:0 0 18px;filter:none;transform:scale(.85);transform-origin:50% 50%;opacity:.85}
#about .module-art i,#about .module-art b{background:linear-gradient(140deg,#406b7d,#173a49 70%);border-color:#93d6e555;box-shadow:inset 0 1px #dcfaff55,0 8px 18px #000f1880}
#about .module-structure i{height:40px}#about .module-structure i:nth-child(2){top:60px}#about .module-structure i:nth-child(3){bottom:0}#about .module-structure b{height:55px;top:60px}
#about .module-interface i:nth-child(2){height:90px}#about .module-interface b{height:45px;background:linear-gradient(135deg,#5594a2,#244d5c)}
#about .module-connect i{top:55px}#about .module-connect b{top:83px;background:#80c5d5}
#services{background:transparent;z-index:3;min-width:0}
#services:before,#services .service-light,#contact:before,#contact .contact-beam{display:none}
#services .services-grid{grid-template-columns:.75fr 1.25fr;gap:80px}
#services .services-intro>p:last-child{color:var(--depth-muted);font-size:16px;line-height:1.8;margin-top:25px}
#services .accordion{border-top:1px solid var(--depth-line)}
#services .accordion details{border-bottom:1px solid var(--depth-line);padding:0 16px;transition:background .25s}
#services .accordion details[open]{background:linear-gradient(120deg,#193d4a80,#0a243044)}
#services .accordion summary{grid-template-columns:36px 1fr 24px;min-height:88px;gap:12px;color:#e3f5f8}
#services .accordion summary span{color:#8ec0d0;font-size:10px}
#services .accordion summary b{font:600 21px/1.4 Manrope,sans-serif;letter-spacing:-.02em}
#services .accordion summary i{color:#97d1df}
#services .accordion-body{display:grid;grid-template-columns:1fr;gap:18px;padding:0 16px 30px 48px}
#services .accordion-body p{font:400 15px/1.75 Manrope,sans-serif;color:#b0cbd3}
#services .accordion-body strong{font:600 10px/1.5 Manrope,sans-serif;letter-spacing:.12em;color:#8cd1e1;margin-bottom:5px}
#approach{background:transparent;z-index:3;min-width:0}
#approach .section-top{border-bottom-color:transparent}
#approach .process-title{margin:55px 0 65px}
#approach .steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:30px;border:0}
#approach .steps:before{top:23px;left:24px;right:24px;bottom:auto;width:auto;height:1px;background:linear-gradient(90deg,#90dfec88,#427f9180);box-shadow:none}
#approach .steps li{display:flex;flex-direction:column;gap:22px;padding:0;border:0}
#approach .steps li>span{width:46px;height:46px;border:1px solid #75adbf80;background:#0b2935;color:#c0eaf3;font-size:10px;box-shadow:0 0 0 8px #0b2935}
#approach .steps h3{font:600 18px/1.4 Manrope,sans-serif;letter-spacing:-.02em;margin:0 0 12px;color:#dcf0f5}
#approach .steps p{font:400 14px/1.8 Manrope,sans-serif;color:#a5bfca}
#approach .steps small{margin-top:auto;padding-top:8px;color:#83b8cb;font-size:9px;letter-spacing:.12em}
#contact{background:transparent;z-index:3;min-width:0;padding-bottom:80px}
#contact .contact-shell{grid-template-columns:1fr 1.2fr;gap:80px;padding-top:60px;border-top:1px solid transparent}
#contact h2{margin:28px 0}
#contact .contact-copy>p:not(.section-index){color:var(--depth-muted);font-size:16px;line-height:1.8;max-width:370px}
#contact .contact-copy>a{font-size:15px;text-transform:none;letter-spacing:0;color:#c9edf5;margin-top:24px;border-color:#72b7cc55}
#contact .contact-form{padding:28px;background:#0c2a3680;border:1px solid #7cbdcc33;box-shadow:inset 0 1px #d2fbff0a}
#contact .contact-form label>span{color:#b7d3db;font-size:10px;letter-spacing:.06em;line-height:1.5}
#contact .contact-form input:not([type=checkbox]),#contact .contact-form textarea,#contact .contact-form select{background:#061c27aa;border:1px solid #739fb344;border-radius:2px;padding:12px;color:#e3f2f6;font:400 16px/1.5 Manrope,sans-serif;min-height:50px;color-scheme:dark}
#contact .contact-form :is(input,textarea,select):focus{border-color:#9ddbea;box-shadow:0 0 0 2px #80d2e51a}
#contact .contact-form [aria-invalid=true]{border-color:#ed9e98}
#contact .contact-form select option{background:#0b2834;color:#e5f3f5}
#contact .form-line{gap:18px}#contact .form-end{flex-direction:column;align-items:stretch;gap:22px}
#contact .consent input{accent-color:#8ecbd9}#contact .consent span{color:#a6c0cb}
#contact .button-ice{background:#c9eaf0;color:#10333f;border:1px solid #d5f8ff;border-radius:2px;box-shadow:none;justify-content:center;min-height:52px;font-size:12px}
#contact .button-ice:hover{background:#e5f9fc;transform:translateY(-2px)}
#contact .form-status{color:#c3e9f2;font-size:12px;line-height:1.6}
.site-footer{background:#071e28;color:#a1c1cc;border-top:0;padding:42px 0}
.site-footer .wordmark{color:#d3edf4}.site-footer .footer-shell{max-width:1200px;gap:30px}.site-footer p{font-size:9px;line-height:1.8}.site-footer a:not(.wordmark){color:#bad8e1;font-size:12px}.site-footer a:focus-visible{outline:2px solid #b6edf6;outline-offset:5px}
@media(max-width:1050px){#about .about-grid,#services .services-grid,#contact .contact-shell{gap:36px;grid-template-columns:1fr 1fr}#about .value-grid{gap:12px}#about .value-card{padding:20px}#approach .steps{gap:20px}}
@media(max-width:760px){
 .lower-atmosphere{margin-top:-220px;background-image:url('assets/images/portfolio-depth-mobile-v1.webp');opacity:.24;mask-image:linear-gradient(transparent,#000 320px,#000 80%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 320px,#000 80%,transparent)}
 #work:after{height:240px}
 .scene-continuation{margin-top:-240px;background-image:url('assets/images/portfolio-depth-mobile-v1.webp');opacity:.38;mask-image:linear-gradient(transparent,#000 200px,#000 45%,transparent 90%);-webkit-mask-image:linear-gradient(transparent,#000 200px,#000 45%,transparent 90%)}
 :is(#about,#services,#approach,#contact){padding:60px 0}
 :is(#about,#services,#approach,#contact) h2{font-size:clamp(28px,6.8vw,38px);line-height:1.35;letter-spacing:-.04em}
 :is(#about,#approach) .section-top{display:block}:is(#about,#approach) .section-top .section-note{margin-top:14px}
 #about .about-grid,#services .services-grid,#contact .contact-shell{grid-template-columns:1fr;gap:32px}
 #about .about-grid{padding:35px 0}#about .about-copy p:first-child{font-size:17px}#about .about-copy p{font-size:15px}
 #about .value-grid{grid-template-columns:1fr;gap:14px}#about .value-card{min-height:0;padding:24px 22px}
 #about .module-art{height:130px;width:220px;max-width:100%;margin:0 auto 20px}#about .value-card h3{font-size:20px}
 #services .accordion summary{min-height:80px;grid-template-columns:24px 1fr 20px;gap:10px}#services .accordion summary b{font-size:18px}#services .accordion details{padding:0 8px}#services .accordion-body{padding:0 6px 25px 34px}#services .accordion-body p{font-size:14px}
 #approach .process-title{margin:35px 0 40px}#approach .steps{grid-template-columns:1fr;gap:28px}#approach .steps:before{top:20px;bottom:40px;left:23px;width:1px;height:auto;background:#6baec344}
 #approach .steps li{display:grid;grid-template-columns:46px 1fr;column-gap:22px;row-gap:8px}#approach .steps li>span{grid-row:1/3}#approach .steps small{grid-column:2;padding-top:0}
 #contact .contact-shell{padding-top:35px}#contact .contact-form{padding:20px 16px}#contact .form-line{grid-template-columns:1fr;gap:20px}#contact .contact-copy>a{font-size:16px}
 .site-footer .footer-shell{grid-template-columns:1fr 1fr;gap:25px}.site-footer .wordmark{grid-column:1/-1}.site-footer p:last-child{grid-column:1/-1}
}
@media(prefers-reduced-motion:reduce){#about .value-card,#services .accordion details,#contact .button-ice{transition:none;transform:none}}
@media(max-width:700px){.depth-continuity{margin-top:-90px;background:linear-gradient(transparent 89px,#071e28 90px)}}