body[data-project=dwh]{--ink:#203e46;--gold:#338d8b;--muted:#748184}
.dwh-brand{font-size:25px;letter-spacing:-1px;gap:12px;font-weight:400}.dwh-brand b{font-weight:600}.dwh-mark{display:flex;flex-direction:column;width:27px;gap:3px;transform:skewY(-12deg)}.dwh-mark i{height:7px;background:#328987;border-radius:1px}.dwh-mark i:nth-child(2){background:#497c8b}.dwh-mark i:last-child{background:#21485c}.dwh-step :is(h1,h2) em{color:#338d8b}.dwh-step .primary-button{background:#214c57;border-color:#214c57}.dwh-step .primary-button:hover{background:#2e7477}.dwh-step .feature-tags span{border-color:#d0dfdc;color:#628682}.visual .platform{border-color:#90c9bf;background:linear-gradient(130deg,#193948,#2e6268);box-shadow:0 5px 0 #193b47,0 11px 0 #142d3c,0 12px 0 #81bcb733}.platform>span{color:#9fcac1}.platform-grid{border-color:#82bcb629;background-image:linear-gradient(#89bfb30e 1px,transparent 1px),linear-gradient(90deg,#89bfb30e 1px,transparent 1px)}.orbit{border-color:#438d8414}.orbit-one:after{background:#78a59c}.scene-topline,.scene-caption{color:#78928f}.caption-line{background:#7eaca1}.motion-toggle{border-color:#c7d8d0}.visual[data-stage=dwhintro] .dwh-intro-art,.visual[data-stage=sources] .sources-art,.visual[data-stage=warehouse] .warehouse-art,.visual[data-stage=insights] .insights-art{visibility:visible;opacity:1;transform:translateY(0) translateZ(0) scale(1)}
/* Architectural layers form a small solid warehouse. */
.warehouse-tower{position:absolute;left:128px;top:87px;width:200px;height:242px;transform-style:preserve-3d;transform:translateZ(30px) rotateY(-16deg)}.warehouse-level{position:absolute;left:0;width:183px;height:68px;transform-style:preserve-3d;animation:layer-float 8s ease-in-out infinite}.level-bottom{top:154px}.level-middle{top:69px;animation-delay:-2s}.level-topmost{top:-17px;animation-delay:-4s}.level-front{position:absolute;inset:0;transform:translateZ(48px);background:linear-gradient(130deg,#2a6470,#153947);border:1px solid #86bfb6;box-shadow:inset 0 -5px 0 #113642;display:flex;align-items:center;justify-content:flex-end;gap:7px;padding:18px}.level-front>span{position:absolute;top:10px;left:13px;font-size:6px;letter-spacing:1.2px;color:#b3d6cc}.level-front>i{height:5px;width:5px;background:#a3d5bb;box-shadow:0 0 8px #8be6b469;border-radius:50%;margin-top:24px;animation:meter 3s ease-in-out infinite}.level-top{position:absolute;top:-48px;left:0;width:183px;height:96px;background:linear-gradient(130deg,#c6e0cf,#70a49d);border:1px solid #e1eee0;transform:rotateX(90deg);box-shadow:inset 0 0 0 8px #ffffff13}.level-top:after{content:'';position:absolute;inset:13px;border:1px solid #62978d66;border-radius:3px}.level-top>b{font-size:50px;color:#4b8980;position:absolute;left:68px;top:16px;line-height:1}.level-side{position:absolute;left:135px;width:96px;height:68px;background:linear-gradient(90deg,#37707a,#1b424b);transform:rotateY(90deg);border:1px solid #497e80}.tower-title{position:absolute;top:346px;left:86px;transform:translateZ(105px) rotateZ(4deg);background:#fafcf7;border:1px solid #d8e5dc;padding:12px 18px;font:25px var(--serif);box-shadow:3px 5px 0 #c8dbd3;color:#336466}.dwh-floating-tag{position:absolute;border:1px solid #d4e0d7;background:#fcfdf9;padding:13px 16px;box-shadow:3px 5px 0 #d3dfd7;border-radius:4px;font-size:6px;letter-spacing:1.2px;color:#678b83;display:flex;gap:15px;align-items:center}.dwh-floating-tag>span{font-size:16px;line-height:10px}.tag-left{top:69px;left:6px;transform:translateZ(70px) rotateZ(-5deg)}.tag-right{top:225px;right:-4px;transform:translateZ(100px) rotateZ(6deg)}
.source-card{position:absolute;width:167px;height:190px;background:linear-gradient(140deg,#fffef9,#ecf3ec);border:1px solid white;border-radius:5px;box-shadow:3px 4px 0 #c8d8d1,6px 8px 0 #d7e2da,12px 17px 28px #21495115;padding:17px}.source-a{left:3px;top:32px;transform:translateZ(15px) rotateZ(-10deg)}.source-b{left:220px;top:5px;transform:translateZ(-15px) rotateZ(9deg)}.source-c{left:254px;top:210px;transform:translateZ(85px) rotateZ(7deg)}.source-card>div:first-child{display:flex;align-items:center;justify-content:space-between;font-size:5px;letter-spacing:1.1px;color:#6e948b}.source-card b{font-size:15px;font-weight:400}.source-card strong{font:26px/1.05 var(--serif);display:block;margin:14px 0;color:#285159}.source-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:13px}.source-grid i{height:5px;background:#c7dcd1}.source-grid i:nth-child(odd){background:#94bcaa}.source-card small{position:absolute;bottom:13px;font-size:5px;letter-spacing:1px;color:#93a99d}.source-flow{position:absolute;border:1px dashed #70b3a0;border-radius:18px;height:85px;transform:rotateX(40deg) translateZ(-10px)}.flow-a{width:130px;left:69px;top:237px}.flow-b{width:130px;left:160px;top:187px}.flow-c{width:140px;left:184px;top:322px}.source-flow>i{position:absolute;top:-4px;width:7px;height:7px;border-radius:2px;background:#72b5a1;box-shadow:0 0 10px #82d5bc;animation:flow-packet 3s linear infinite}.flow-b>i{animation-delay:-1s}.flow-c>i{animation-delay:-2s}.data-hub{position:absolute;top:264px;left:76px;width:113px;height:80px;border:1px solid #a3d6c8;background:linear-gradient(130deg,#3e8b87,#1d4b58);transform:translateZ(65px) rotateY(-10deg);box-shadow:8px 5px 0 #173e4a,12px 8px 0 #26535c;display:flex;align-items:center;justify-content:center;gap:10px;color:#d9ede2}.data-hub>span{font-size:31px}.data-hub>b{font-size:16px;letter-spacing:1px;font-weight:500}
.data-layer{position:absolute;width:278px;height:196px;border-radius:6px;border:1px solid #eef7ed;padding:20px;box-shadow:4px 5px 0 #c4d8cb,8px 9px 0 #b9d0c6;transform-style:preserve-3d}.data-layer>span{font-size:7px;letter-spacing:1.8px}.layer-back{top:15px;left:126px;background:linear-gradient(140deg,#e4f0e2,#c5dccd);transform:translateZ(-40px) rotateZ(9deg);color:#568578}.layer-middle{top:88px;left:77px;background:linear-gradient(130deg,#85b7a4,#accbbb);transform:translateZ(15px) rotateZ(0);color:#2e625c}.layer-front{top:171px;left:24px;background:linear-gradient(130deg,#285d65,#153d4a);transform:translateZ(95px) rotateZ(-7deg);color:#c4e2d4;border-color:#a6cbbb;box-shadow:4px 5px 0 #163f49,8px 9px 0 #2c5960}.layer-cells{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:25px}.layer-cells>i{height:41px;border:1px solid #ffffff70;background:#ffffff20;border-radius:3px}.layer-front strong{display:block;font:39px/1.03 var(--serif);margin:23px 0 17px;color:#eef5e9}.layer-front small{position:absolute;bottom:15px;left:20px;font-size:5px;letter-spacing:1.5px;color:#97bfb3}.warehouse-indicators{position:absolute;right:21px;bottom:16px;display:flex;gap:5px}.warehouse-indicators i{width:4px;height:4px;border-radius:50%;background:#a5d7b8;animation:meter 3s ease-in-out infinite}.foundation-chip{position:absolute;top:355px;left:207px;background:#fcfdf7;border:1px solid #d7e4da;padding:12px 16px;border-radius:20px;font-size:8px;white-space:nowrap;transform:translateZ(135px) rotateZ(6deg);box-shadow:3px 5px 0 #c6dacf;color:#517d72;display:flex;gap:8px;align-items:center}.foundation-chip>span{font-size:16px}
.analytics-board{position:absolute;left:22px;top:16px;width:347px;height:296px;border-radius:9px;transform:translateZ(15px) rotateY(-7deg)}.analytics-board .mini-mark{color:#4c9d8b}.analytics-board>.window-bar{border-color:#e1eae0;color:#6b9184}.analytics-board>strong{display:block;font:33px/1.05 var(--serif);margin:20px 23px;color:#325961}.analytics-plot{position:absolute;top:138px;left:24px;right:24px;height:109px}.plot-guide{position:absolute;inset:0;background:repeating-linear-gradient(0deg,#e5ede4 0 1px,transparent 1px 27px);border-bottom:1px solid #bdd1c8}.plot-bars{position:absolute;inset:0 12px;display:flex;align-items:flex-end;gap:17px}.plot-bars i{width:24px;height:45%;border:1px solid #87b4a3;background:linear-gradient(90deg,#84bda2,#549988);border-radius:3px 3px 0 0;box-shadow:4px -3px 0 #c4dccb;transform-origin:bottom;animation:plot-rise 6s ease-in-out infinite}.plot-bars i:nth-child(2){height:61%}.plot-bars i:nth-child(3){height:52%}.plot-bars i:nth-child(4){height:79%}.plot-bars i:nth-child(5){height:68%}.plot-bars i:nth-child(6){height:92%;background:linear-gradient(90deg,#4f9991,#2c686c)}.analytics-labels{position:absolute;bottom:20px;left:25px;right:25px;display:flex;justify-content:space-between;font-size:5px;letter-spacing:1.1px;color:#7c9a8b}.report-sheet{position:absolute;left:261px;top:185px;width:167px;height:211px;background:linear-gradient(130deg,#fdfdf6,#eff4ea);border:1px solid white;box-shadow:3px 4px 0 #cedbd2,6px 7px 0 #dbe4d9,10px 14px 24px #204e4715;padding:15px;transform:translateZ(100px) rotateZ(8deg)}.report-sheet>div:first-child{display:flex;justify-content:space-between;font-size:5px;letter-spacing:1px;color:#6c9585}.report-sheet b{font-size:12px}.report-sheet strong{display:block;font:27px/1.03 var(--serif);margin:12px 0 8px;color:#345c5a}.report-sheet>span{font-size:4px;letter-spacing:1px;color:#839e8b}.report-donut{position:absolute;top:114px;left:17px;width:54px;height:54px;border-radius:50%;background:conic-gradient(#4f9a8a 0 61%,#9bc5ae 61% 84%,#dce7d7 84%)}.report-donut:after{content:'';position:absolute;inset:12px;border-radius:50%;background:#f5f8ef}.report-lines{position:absolute;right:16px;top:126px;width:59px;display:flex;flex-direction:column;gap:9px}.report-lines>i{height:3px;background:#bdcfbf}.report-lines>i:nth-child(2){width:80%}.report-sheet small{position:absolute;bottom:15px;left:15px;font-size:4px;letter-spacing:.7px;color:#889f8b}
@keyframes layer-float{0%,100%{translate:0 0}50%{translate:0 -5px}}@keyframes flow-packet{0%{left:5%;opacity:0}15%{opacity:1}85%{opacity:1}100%{left:90%;opacity:0}}@keyframes plot-rise{0%,100%{scale:1 1}50%{scale:1 .88}}
@media(max-width:1100px) and (min-width:761px){.dwh-step h1{font-size:64px}.dwh-step h2{font-size:58px}.dwh-brand{font-size:22px}}
@media(max-width:760px){.dwh-brand{font-size:20px;gap:9px;letter-spacing:-.7px}.dwh-mark{width:22px;gap:2px}.dwh-mark i{height:6px}.dwh-step h1{font-size:54px}.dwh-step h2{font-size:49px}.header-link{font-size:10px}.visual .scene-caption{font-size:6px}}
@media(max-width:760px) and (max-height:700px){.dwh-step h1{font-size:49px}.dwh-step h2{font-size:46px}}