/* One immersive space: typography, architecture and product context. */
.confluence-hero{min-height:680px;background:radial-gradient(ellipse at 81% 30%,#fff 0%,#eef1f2 49%,#f4f5f2 85%)}
.confluence-hero:before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.42;background:linear-gradient(90deg,transparent 49.8%,#aab7cb25 50%,transparent 50.2%) 0 0/180px 180px,linear-gradient(0deg,transparent 49.8%,#aab7cb25 50%,transparent 50.2%) 0 0/180px 180px;mask-image:linear-gradient(90deg,transparent 30%,#000 70%)}
.confluence-hero .hero-content{padding-top:87px;padding-bottom:115px}
.confluence-hero h1{font-size:clamp(64px,5.7vw,84px);max-width:650px;line-height:1.04}
.confluence-hero .hero-description{max-width:340px}
.confluence-hero .hero-art.architecture-scene{position:absolute;inset:0;right:0;top:0;width:100%;height:100%;margin:0;opacity:1;z-index:1}
.confluence-hero .architecture-scene:before{display:none}
.architecture-scene .hero-particles{cursor:default;outline-offset:-6px}
.architecture-scene>.hero-fallback{position:absolute;inset:0;display:block;transition:opacity .4s;pointer-events:none}
.architecture-scene>.hero-fallback img{width:100%;height:100%;object-fit:cover;transform:none;animation:none}
.architecture-scene.model-ready>.hero-fallback{opacity:0}
.confluence-hero .particle-controls{right:max(56px,calc((100vw - 1248px)/2));bottom:27px;font-size:var(--text-xs,.75rem);color:#7988a1;gap:8px}
.confluence-hero .particle-controls>span{margin-right:10px}
.confluence-hero .particle-controls button{background:#ffffffb5;border-color:#d8e0ea;color:#526787;width:29px;height:29px}
.confluence-hero .hero-index{left:max(56px,calc((100vw - 1248px)/2));right:auto;bottom:35px;z-index:2;font-size:var(--text-xs,.75rem)}
.hero-portfolio{position:absolute;z-index:3;right:max(56px,calc((100vw - 1248px)/2));bottom:110px;width:212px;padding:20px;border:1px solid #fff;border-radius:21px;background:linear-gradient(130deg,#ffffffc9,#eef2f7b5);box-shadow:0 14px 40px #1524450b;backdrop-filter:blur(16px);transition:transform .2s,box-shadow .2s}
.hero-portfolio:hover{transform:translateY(-4px);box-shadow:0 18px 42px #15244516}
.hero-portfolio-top{display:flex;align-items:center;gap:8px;font-size:var(--text-xs,.75rem);color:#687995}
.hero-portfolio-top>.icon{width:15px;height:15px;color:var(--cobalt)}
.hero-portfolio-top>.icon:last-child{margin-left:auto;width:13px}
.hero-portfolio strong{display:block;font:500 23px/1.13 var(--heading);letter-spacing:-.045em;margin:20px 0}
.hero-portfolio-bottom{display:flex;justify-content:space-between;border-top:1px solid #d5deea;padding-top:11px;font-size:var(--text-xs,.75rem);color:#70809b}
:root[data-theme="dark"] .confluence-hero{background:radial-gradient(ellipse at 81% 26%,#1b2c46 0%,#101d30 48%,#0b1220 90%)}
:root[data-theme="dark"] .confluence-hero:before{opacity:.26;background-image:linear-gradient(90deg,transparent 49.8%,#6c8cbb2a 50%,transparent 50.2%),linear-gradient(0deg,transparent 49.8%,#6c8cbb2a 50%,transparent 50.2%)}
:root[data-theme="dark"] .hero-portfolio{border-color:#59749936;background:linear-gradient(130deg,#253a56cf,#16263fc9);box-shadow:0 18px 50px #00000025}
:root[data-theme="dark"] .hero-portfolio-top,:root[data-theme="dark"] .hero-portfolio-bottom{color:#a0b5d4}
:root[data-theme="dark"] .hero-portfolio-top>.icon{color:#9cbaff}
:root[data-theme="dark"] .hero-portfolio-bottom{border-color:#536e913d}
:root[data-theme="dark"] .confluence-hero .particle-controls button{background:#1b2e4b;border-color:#3b557c;color:#b3c7eb}
:root[data-theme="dark"] .confluence-hero .hero-fallback img{filter:none}
@media(max-width:1100px){.confluence-hero{min-height:640px}.confluence-hero h1{font-size:73px;max-width:550px}.confluence-hero .hero-content{padding-top:70px}.hero-portfolio{right:32px;bottom:100px;width:185px;padding:17px}.hero-portfolio strong{font-size:21px}.confluence-hero .hero-index{left:32px}.confluence-hero .particle-controls{right:32px}}
@media(max-width:800px){.confluence-hero{min-height:0}.confluence-hero .hero-content{padding-top:40px;padding-bottom:0}.confluence-hero h1{font-size:68px}.confluence-hero .hero-art.architecture-scene{position:relative;inset:auto;width:100%;height:400px;margin:0;opacity:1}.hero-portfolio{right:24px;bottom:80px;width:178px}.confluence-hero .hero-index{display:none}.confluence-hero .particle-controls{right:24px;bottom:18px}.confluence-hero:before{mask-image:linear-gradient(180deg,transparent 30%,#000 70%)}}
@media(max-width:600px){.confluence-hero h1{font-size:clamp(47px,11.8vw,68px);max-width:100%}.confluence-hero .hero-content{padding-top:28px}.confluence-hero .hero-description{max-width:320px}.confluence-hero .hero-art.architecture-scene{height:330px;margin:0}.hero-portfolio{right:20px;bottom:67px;width:148px;padding:13px;border-radius:15px}.hero-portfolio strong{font-size:18px;margin:13px 0}.hero-portfolio-top{font-size:var(--text-xs,.75rem);gap:6px}.hero-portfolio-top>.icon{width:12px;height:12px}.hero-portfolio-bottom{font-size:var(--text-xs,.75rem);padding-top:8px}.confluence-hero .particle-controls{right:20px;bottom:16px}.confluence-hero .particle-controls>span{font-size:var(--text-xs,.75rem)}.architecture-scene>.hero-fallback img{object-fit:cover}.confluence-hero .hero-foot{gap:13px}}
.no-motion .hero-portfolio{transition:none}

.architecture-scene>.hero-fallback .scene-dark{display:none}
:root[data-theme="dark"] .architecture-scene>.hero-fallback .scene-light{display:none}
:root[data-theme="dark"] .architecture-scene>.hero-fallback .scene-dark{display:block}

.architecture-scene>.hero-fallback picture{position:absolute;inset:0}