:root{--showcase-navy:#102a3c;--showcase-cream:#f4f2ed;--showcase-blue:#0078a8}
[hidden]{display:none!important}html{scroll-padding-top:100px}body{background:var(--showcase-cream);color:#173143}header{position:sticky;top:0;z-index:80;background:rgba(250,249,246,.97);border-bottom:1px solid #dce1e1;padding:18px 4%;display:flex;align-items:center;justify-content:space-between;backdrop-filter:blur(14px)}.showcase-nav-brand{font-size:14px;font-weight:800;letter-spacing:2px;text-decoration:none;color:#102a3c}#nav{gap:22px}#nav a{font-size:13px}#nav a[aria-current=page]:not(.button){color:var(--ink)}#nav .button{border-radius:50px}.showcase-kicker{background:#102a3c;color:#e2edf0;letter-spacing:2px;font-size:10px;padding:12px 5%;display:flex;justify-content:space-between}.hero{background:radial-gradient(ellipse at 0 10%,#dcebf0,transparent 55%),#f4f2ed;padding:65px 5% 75px;gap:5%;min-height:690px}.hero h1{font-size:clamp(48px,5.2vw,83px);line-height:1.03;letter-spacing:-3px;color:#102a3c}.hero .lede{max-width:520px;font-size:18px;line-height:1.7}.home-logo{max-width:430px!important;margin:0 0 22px!important}.home-logo .brand{max-width:100%!important}.hero .flow-panel{box-shadow:0 35px 65px #102a3c2b;transform:perspective(1300px) rotateY(-4deg);border:1px solid #345669;border-radius:16px;background:#102a3c}.hero .hero-foot{letter-spacing:2px;font-size:11px}.button{border-radius:6px;padding:15px 23px;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px)}.section{padding:85px 6%;}.section h2{font-size:clamp(35px,4vw,58px);letter-spacing:-1.8px;line-height:1.1}.eyebrow{letter-spacing:2px;font-size:11px}.showcase-featured{background:#fff}.showcase-feature-grid,.showcase-project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}.showcase-card{padding:0;text-align:left;border:1px solid #dbe3e5;border-radius:12px;overflow:hidden;background:#fff;color:#163246;cursor:pointer;box-shadow:0 6px 22px #112e3d09;transition:transform .25s,box-shadow .25s;font:inherit;width:100%}.showcase-card:hover{transform:translateY(-6px);box-shadow:0 18px 35px #112e3d19}.showcase-card>img{width:100%;height:230px;object-fit:cover;display:block;transition:transform .4s}.showcase-card:hover>img{transform:scale(1.025)}.showcase-card-body{display:flex;flex-direction:column;padding:25px;gap:12px}.showcase-card-tag{color:#0078a8;font-size:10px;letter-spacing:1.6px}.showcase-card strong{font-size:23px;line-height:1.2;font-weight:650}.showcase-card-intro{font-size:14px;line-height:1.6;color:#576c78;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.showcase-card-link{font-size:12px;font-weight:700;color:#0078a8;margin-top:5px}.showcase-invitation{background:linear-gradient(120deg,#102a3c,#1d4c63);color:#fff;position:relative;overflow:hidden}.showcase-invitation:after{content:'';position:absolute;width:430px;height:430px;border:70px solid #5aa2b51f;border-radius:50%;right:-70px;top:-120px;pointer-events:none}.showcase-invitation h2,.showcase-invitation p{color:#fff}.showcase-invitation .text-link{color:#c3eaf7}.showcase-invitation .eyebrow{color:#94cde0}#projects{background:#eff3f3;min-height:75vh}#projects>h2{max-width:700px}.project-story{background:white;border:1px solid #dce5e8;border-radius:14px;padding:30px;margin:24px 0}.showcase-detail .project-story{margin-top:25px}.showcase-back{margin:20px 0}.showcase-project-grid{margin-top:32px}.project-filters{gap:9px}.project-filters button{border-radius:30px}#about{background:#f4f2ed}.signature{background:#0078a8!important;border-radius:12px;color:#fff;padding:50px!important}.signature strong,.signature p{color:#fff!important}#capabilities{background:#eff3f3}.service-grid article{border-radius:12px;background:white;box-shadow:0 5px 20px #102a3c08;border:1px solid #dae3e5}#partners{background:linear-gradient(115deg,#102a3c,#214b60);color:#fff}#partners h2,#partners p,#partners h3{color:#f4f8fa}#partners .text-link{color:#a9deed}#contact{background:#f4f2ed}#planner{background:#e5edf0}.contact-details{background:#fff;border-radius:14px;padding:32px;border:1px solid #dbe4e7}footer{background:#0b2231;color:#c1d3dc;padding:28px 6%}body[data-view=home] .showcase-kicker{display:flex}body:not([data-view=home]) .showcase-kicker{display:none}body[data-view=home] .hero{display:grid}a:focus-visible,button:focus-visible{outline:3px solid #0078a8;outline-offset:4px}
@media(max-width:1000px){.showcase-nav-brand{font-size:11px;letter-spacing:1px}#nav{gap:12px}.showcase-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{gap:30px}.showcase-card>img{height:200px}}
@media(max-width:760px){header{padding:14px 5%}.showcase-kicker span{display:none}.hero{padding:35px 6% 45px!important;grid-template-columns:1fr!important;min-height:0}.hero h1{letter-spacing:-2px}.hero .flow-panel{transform:none}.section{padding:48px 6%}.showcase-feature-grid,.showcase-project-grid{grid-template-columns:1fr}.showcase-card>img{height:240px}.showcase-invitation:after{right:-270px}.project-story{padding:18px}.home-logo{max-width:330px!important}#nav{background:#faf9f6}#nav a{padding:12px}.showcase-nav-brand{max-width:70%}.signature{padding:30px!important}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}.hero .flow-panel{transform:none}}
/* Retain visualization implementation without exposing the unfinished feature. */
#visualize,.visualize-prompt{display:none!important}

.showcase-nav-brand{display:flex;align-items:center;flex-shrink:0}.showcase-nav-brand img{display:block;width:190px;height:60px;object-fit:contain}@media(max-width:760px){.showcase-nav-brand img{width:150px;height:48px}}

.showcase-nav-brand svg{display:block;width:230px;height:57px;overflow:hidden}@media(max-width:1000px){.showcase-nav-brand svg{width:190px;height:47px}}@media(max-width:760px){.showcase-nav-brand svg{width:185px;height:46px}}

#nav a.button,#nav a.button[aria-current],#contact a.button,.showcase-planner-button{background:#006b96;color:#fff!important;border:1px solid #006b96}#nav a.button:hover,#contact a.button:hover{background:#005474;color:#fff!important}.showcase-planner-button{display:inline-block;margin:16px 0 0 12px}body[data-view=planner] main{display:flex;flex-direction:column}body[data-view=planner] #planner{order:1}body[data-view=planner] #contact{order:2}@media(max-width:760px){.showcase-planner-button{margin-left:0}}

.hero .flow-panel{transform:none!important}

/* Exclude the static drop baked into the artwork; the separate SVG drop keeps dripping. */
.animated-logo > image{clip-path:polygon(0 0,100% 0,100% 100%,4.3% 100%,4.3% 51.2%,0 51.2%)}
.showcase-nav-brand svg > image{clip-path:none}

.animated-logo .logo-drop{animation:showcaseDripSplash 4s linear infinite;transform-origin:35px 275px}.logo-splash{opacity:0;transform-box:view-box;transform-origin:35px 500px;animation:showcaseSplash 4s ease-out infinite}.paused .logo-splash{animation-play-state:paused}@keyframes showcaseDripSplash{0%,65%{opacity:0;transform:translateY(0) scale(.3)}67%{opacity:1;transform:translateY(0) scale(.5)}75%{opacity:1;transform:translateY(0) scale(1)}89%{opacity:1;transform:translateY(180px) scale(1)}90%,100%{opacity:0;transform:translateY(180px) scale(1)}}@keyframes showcaseSplash{0%,88%{opacity:0;transform:scale(.3)}90%{opacity:.9;transform:scale(.65)}99%,100%{opacity:0;transform:scale(1.4)}}@media(prefers-reduced-motion:reduce){.logo-splash{animation:none;opacity:0}.animated-logo .logo-drop{animation:none;transform:translateY(0);opacity:1}}

.showcase-video-card{position:relative}.showcase-play-badge{position:absolute;top:174px;left:16px;padding:10px 13px;border-radius:5px;background:#082b3ee8;color:white;font-size:11px;font-weight:700;letter-spacing:1px;pointer-events:none}@media(max-width:1000px){.showcase-play-badge{top:144px}}@media(max-width:760px){.showcase-play-badge{top:184px}}
/* Comfortable text inset for every service card. */
#capabilities .service-grid>article{padding:30px 28px;box-sizing:border-box}#capabilities .service-grid>article p{line-height:1.7}#capabilities .service-grid>article .text-link{display:inline-block;line-height:1.6;margin-top:10px}@media(max-width:760px){#capabilities .service-grid>article{padding:26px 24px}}

#capabilities>.section-heading .eyebrow{font-size:19px;font-weight:750;letter-spacing:1.3px;color:#174a64;line-height:1.4;margin-bottom:15px}.showcase-featured h2{font-size:clamp(32px,3.4vw,50px)}

#capabilities>.section-heading>p{font-size:20px;line-height:1.6;color:#294b60;max-width:420px}@media(max-width:760px){#capabilities>.section-heading>p{font-size:18px}}
/* Contact section label matches the readable blue section-label treatment. */
#contact>div>.eyebrow{font-size:19px;font-weight:750;letter-spacing:1.3px;line-height:1.4;color:#0078a8;margin-bottom:15px}
#planner>div>.eyebrow{font-size:19px;font-weight:750;letter-spacing:1.3px;line-height:1.4;color:#0078a8;margin-bottom:15px}
#partners>div>.eyebrow{font-size:19px;font-weight:750;letter-spacing:1.3px;line-height:1.5;color:#fff;margin-bottom:15px}
#capabilities>.section-heading .eyebrow{color:#0078a8}
#about>div>.eyebrow{color:#0078a8;font-size:19px;font-weight:750;letter-spacing:1.3px;line-height:1.4;margin-bottom:15px}
/* One consistent, readable treatment for main section labels. */
.section>.eyebrow,.section>.section-heading .eyebrow,.section>div>.eyebrow,#about>div>.eyebrow,#planner>div>.eyebrow,#contact>div>.eyebrow,#capabilities>.section-heading .eyebrow{font-size:19px;font-weight:750;letter-spacing:1.3px;line-height:1.5;color:#0078a8;margin-bottom:15px}
#partners>div>.eyebrow,.showcase-invitation>.eyebrow{color:#83d5f6;font-size:19px}
/* White labels on dark blue surfaces, as requested. */
#partners>div>.eyebrow,.showcase-invitation>.eyebrow{color:#fff}

.ribbon{background:#0078a8;color:#fff;font-size:15px;line-height:1.5;font-weight:600;gap:18px;flex-wrap:wrap}@media(max-width:760px){.ribbon{font-size:13px;letter-spacing:1.5px}}

/* Home diagram heading and a restrained architectural backdrop. */
#home .panel-head{background:#0078a8;color:#fff;padding:14px 16px;border-radius:9px;font-size:13px}
#home .panel-head .quiet{color:#fff;border-color:#b9e4f4}
.showcase-invitation{background-color:#102a3c;background-image:linear-gradient(90deg,#102a3c 0%,rgba(16,42,60,.97) 34%,rgba(16,42,60,.67) 60%,rgba(16,42,60,.35) 100%),url('https://images.pexels.com/photos/8134821/pexels-photo-8134821.jpeg?auto=compress&w=1600');background-size:cover;background-position:center,right center}
.showcase-invitation:after{display:none}
.showcase-invitation>h2,.showcase-invitation>p,.showcase-invitation>.actions{position:relative;z-index:1;max-width:620px}
@media(max-width:760px){.showcase-invitation{background-image:linear-gradient(90deg,rgba(16,42,60,.95),rgba(16,42,60,.78)),url('https://images.pexels.com/photos/8134821/pexels-photo-8134821.jpeg?auto=compress&w=1000');background-position:center}}

#partners .steps article>span{font-size:17px;line-height:1.5;font-weight:650;letter-spacing:1.4px;display:block;margin-bottom:9px}

.showcase-nav-brand img{width:230px;height:57px;object-fit:cover;object-position:top}@media(max-width:1100px){.showcase-nav-brand img{width:190px;height:47px}}@media(max-width:760px){.showcase-nav-brand img{width:185px;height:46px}}

.showcase-nav-brand{position:relative;width:230px;height:73px}.showcase-nav-brand img{width:100%;height:100%;object-fit:contain}.showcase-nav-brand svg.nav-logo-flow{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.nav-logo-flow .logo-drop{animation:showcaseDripSplash 4s linear infinite;transform-origin:35px 275px}@media(max-width:1100px){.showcase-nav-brand{width:190px;height:60px}}@media(max-width:760px){.showcase-nav-brand{width:185px;height:59px}}@media(prefers-reduced-motion:reduce){.nav-logo-flow .logo-drop{animation:none}}


.nav-logo-flow .logo-drop{animation:logoFullSizeDrip 4s linear infinite}
@keyframes logoFullSizeDrip{0%,65%{opacity:0;transform:translateY(0)}67%,75%{opacity:1;transform:translateY(0)}89%{opacity:1;transform:translateY(180px)}90%,100%{opacity:0;transform:translateY(185px)}}
@media(prefers-reduced-motion:reduce){.nav-logo-flow .logo-drop{animation:none}}

.showcase-nav-brand>img{clip-path:polygon(0 0,100% 0,100% 100%,4.3% 100%,4.3% 51.2%,0 51.2%)}

.showcase-kicker{background:#0078a8;color:#fff;font-size:14px;line-height:1.5;padding:18px 5%;letter-spacing:1.6px;gap:18px;flex-wrap:wrap}@media(max-width:760px){.showcase-kicker{font-size:13px;padding:16px 5%;letter-spacing:1.2px}}

/* One shared cycle: flow reaches outlet, then full-size drop falls. */
.animated-logo .logo-water,.nav-logo-flow .logo-water{stroke-dasharray:70 1100;animation:logoOutletFlow 4s linear infinite}
.animated-logo .logo-drop,.nav-logo-flow .logo-drop{animation:logoOutletDrip 4s linear infinite;transform-box:view-box;transform-origin:35px 275px}
.animated-logo .logo-splash,.nav-logo-flow .logo-splash{animation:logoOutletSplash 4s linear infinite}
@keyframes logoOutletFlow{0%{stroke-dashoffset:70;opacity:1}72%{stroke-dashoffset:-930;opacity:1}77%{stroke-dashoffset:-1000;opacity:1}78%,100%{stroke-dashoffset:-1000;opacity:0}}
@keyframes logoOutletDrip{0%,71.9%{opacity:0;transform:translateY(0)}72%,77%{opacity:1;transform:translateY(0)}94%{opacity:1;transform:translateY(180px)}95%,100%{opacity:0;transform:translateY(185px)}}
@keyframes logoOutletSplash{0%,93%{opacity:0;transform:scale(.3)}95%{opacity:.9;transform:scale(.65)}100%{opacity:0;transform:scale(1.4)}}
.paused .animated-logo .logo-water,.paused .animated-logo .logo-drop,.paused .animated-logo .logo-splash,.paused .nav-logo-flow .logo-water,.paused .nav-logo-flow .logo-drop,.paused .nav-logo-flow .logo-splash{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.animated-logo .logo-water,.animated-logo .logo-drop,.animated-logo .logo-splash,.nav-logo-flow .logo-water,.nav-logo-flow .logo-drop,.nav-logo-flow .logo-splash{animation:none}}

/* Home banner matches the service bands used on the other pages. */
.showcase-kicker{font-size:15px;line-height:1.5;font-weight:600;letter-spacing:2px;padding:23px 5%;gap:18px;box-sizing:border-box}@media(max-width:760px){.showcase-kicker{font-size:13px;letter-spacing:1.5px;padding:23px 5%}}