
.problem-lab{position:relative;isolation:isolate;overflow:hidden;margin-top:35px;color:#eef4ff;background:#070d1b;padding:45px 0 35px}.p-shell{position:relative;width:min(1400px,calc(100% - 100px));margin:auto;z-index:2}.p-meta{display:flex;justify-content:space-between;gap:20px;font:10px 'Space Grotesk',sans-serif;letter-spacing:.15em;margin-bottom:35px;color:#87b6ff}.p-heading{display:flex;align-items:center;justify-content:space-between;gap:35px;margin-bottom:35px}.p-heading h2{font-size:clamp(35px,4.1vw,66px);font-weight:500;line-height:1.03;letter-spacing:-.055em}.p-heading em{font-style:normal;color:#78adff}.p-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.p-card{position:relative;padding:28px;min-height:295px;display:flex;flex-direction:column}.p-card-top{display:flex;justify-content:space-between;align-items:center;font:10px 'Space Grotesk',sans-serif;letter-spacing:.12em;margin-bottom:32px}.p-card-top>span:last-child{font-size:28px;letter-spacing:0}.p-card h3{font-size:clamp(25px,2.6vw,38px);font-weight:500;line-height:1.08;letter-spacing:-.045em;margin-bottom:25px}.p-card p{font-size:14px;line-height:1.6;color:#adbed8;margin-top:auto;max-width:340px}.p-bottom{display:flex;align-items:center;gap:16px;margin-top:30px;padding-top:22px;border-top:1px solid #7db0ff30;font-size:13px}.p-bottom a{margin-left:auto;display:flex;align-items:center;gap:25px}.p-bottom b{font-size:24px;color:#ffc53d}.p-emblem{position:relative;flex-shrink:0;width:100px;height:100px}.p-emblem i{position:absolute;width:25px;height:25px;border-radius:7px;background:#5b9bff;left:calc(mod(var(--i),3)*31px);top:0}.p-emblem i:nth-child(1){left:0}.p-emblem i:nth-child(2){left:31px}.p-emblem i:nth-child(3){left:62px}.p-emblem i:nth-child(4){left:15px;top:31px;background:#7db0ff}.p-emblem i:nth-child(5){left:46px;top:31px;background:#7db0ff}.p-emblem i:nth-child(6){left:31px;top:62px;background:#ffc53d}.design-switch{position:fixed;bottom:15px;left:15px;z-index:100;background:#101b30;color:#fff;padding:12px 16px;border:1px solid #7db0ff55;border-radius:30px;font-size:11px;box-shadow:0 4px 20px #0002}.p-grid{position:absolute;inset:0;z-index:0;background-image:linear-gradient(#7db0ff09 1px,transparent 1px),linear-gradient(90deg,#7db0ff09 1px,transparent 1px);background-size:50px 50px}.p-aura{position:absolute;inset:0;pointer-events:none}.p-card{transition:transform .35s,border-color .35s}.p-card:hover{transform:translateY(-7px)}
/* 01: ultra-high contrast signal panels. */
.p-1 .p-aura{background:radial-gradient(ellipse at 80% 0,#215fff55,transparent 60%)}.p-1 .p-card{border:1px solid #5b9bff66;background:#0d1930d9;border-radius:2px}.p-1 .p-card:first-child{background:#2868ee;color:#fff}.p-1 .p-card:first-child p{color:#e3eeff}.p-1 .p-card:nth-child(2){border-top:4px solid #7db0ff}.p-1 .p-card:nth-child(3){border-top:4px solid #ffc53d}.p-1 .p-card-top{color:#ffc53d}.p-1 .p-card:after{content:'';position:absolute;left:0;right:0;top:0;height:2px;background:#a9cfff;transform:scaleX(0);transform-origin:left}.p-1.in-view .p-card:after{animation:scan-panel 2s ease forwards;animation-delay:.5s}.p-1.in-view .p-emblem i{animation:signal-dot 1.8s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i)*.09s)}
/* 02: the business ledger, recast as oversized golden blocks. */
.p-2{background:#ffc53d;color:#101b30}.p-2 .p-grid{background-image:linear-gradient(#101b300b 1px,transparent 1px);background-size:100% 60px}.p-2 .p-meta{color:#594310}.p-2 .p-heading em{color:#101b30;font-family:'Instrument Serif';font-weight:400}.p-2 .p-heading h2{font-size:clamp(36px,4.5vw,71px)}.p-2 .p-card{background:#ffe49a;border:1px solid #101b3022;border-radius:0;box-shadow:7px 7px 0 #101b30;min-height:310px}.p-2 .p-card:first-child{background:#101b30;color:#fff}.p-2 .p-card p{color:#4f421f}.p-2 .p-card:first-child p{color:#ccd7e9}.p-2 .p-card-top{font-weight:600}.p-2 .p-card:first-child .p-card-top{color:#ffc53d}.p-2 .p-bottom{border-color:#101b3033}.p-2 .p-bottom b{color:#101b30}.p-2 .p-emblem{background:#101b30;box-sizing:content-box;padding:18px;transform:rotate(8deg);border-radius:20px}.p-2 .p-emblem i{margin:22px}.p-2.in-view .p-card{animation:ledger-rise .8s both}.p-2.in-view .p-card:nth-child(2){animation-delay:.12s}.p-2.in-view .p-card:nth-child(3){animation-delay:.24s}
/* 03: animated six-dot context engine, orbiting circuitry. */
.p-3{background:#030711;padding-top:38px}.p-3 .p-grid{background-image:radial-gradient(#7db0ff30 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(transparent,#000,transparent)}.p-3 .p-heading{position:relative;min-height:200px;padding-right:280px}.p-3 .p-heading h2{font-size:clamp(33px,3.7vw,57px)}.p-3 .p-heading em{color:#ffc53d}.p-3 .p-emblem{position:absolute;right:105px;top:65px;filter:drop-shadow(0 0 25px #5b9bff66)}.p-3 .p-emblem:before,.p-3 .p-emblem:after{content:'';position:absolute;border:1px solid #5b9bff66;border-radius:50%;inset:-65px;transform:rotateX(55deg) rotate(-25deg)}.p-3 .p-emblem:after{inset:-45px;border-style:dashed;transform:rotateY(55deg) rotate(30deg)}.p-3.in-view .p-emblem:before{animation:engine-orbit 8s linear 1}.p-3.in-view .p-emblem:after{animation:engine-orbit 8s linear reverse 1}.p-3 .p-card{background:linear-gradient(140deg,#132746dd,#08101edd);border:1px solid #5b9bff66;border-radius:15px;min-height:280px;box-shadow:inset 0 1px #ffffff15}.p-3 .p-card-top{color:#7db0ff}.p-3 .p-card-top>span:last-child{color:#ffc53d}.p-3 .p-card:before{content:'';position:absolute;left:50%;top:-35px;height:35px;width:1px;background:linear-gradient(transparent,#5b9bff)}.p-3 .p-aura{background:radial-gradient(ellipse at 80% 30%,#185cff30,transparent 55%)}.p-3.in-view .p-emblem i{animation:signal-dot 2.6s both;animation-delay:calc(var(--i)*.08s)}
/* 04: luminous sculptural canvas with striking scale and layered glass. */
.p-4{background:#eaf0ff;color:#101b30}.p-4 .p-aura{background:radial-gradient(ellipse at 5% 20%,#5b9bff90,transparent 50%),radial-gradient(ellipse at 95% 70%,#ffc53d99,transparent 55%)}.p-4 .p-grid{background:linear-gradient(125deg,transparent 35%,#fff8 35.2%,transparent 35.5%,transparent 65%,#fff8 65.2%,transparent 65.5%)}.p-4 .p-meta{color:#235fbf}.p-4 .p-heading{position:relative;padding:10px 0 20px}.p-4 .p-heading h2{font-size:clamp(39px,4.7vw,73px);position:relative;z-index:2;max-width:1100px}.p-4 .p-heading em{color:#235fbf;font-family:'Instrument Serif';font-weight:400}.p-4 .p-emblem{position:absolute;right:40px;top:10px;transform:scale(2.9) rotate(-17deg);opacity:.24;filter:blur(.3px)}.p-4 .p-card{background:#ffffff7a;border:1px solid #fff;border-radius:22px;backdrop-filter:blur(20px);box-shadow:0 20px 50px #14377612;min-height:305px}.p-4 .p-card:nth-child(2){background:#101b30;color:#fff;transform:translateY(-9px);box-shadow:0 25px 40px #101b3030}.p-4 .p-card p{color:#435572}.p-4 .p-card:nth-child(2) p{color:#becce0}.p-4 .p-card-top{color:#235fbf}.p-4 .p-card:nth-child(2) .p-card-top{color:#ffc53d}.p-4 .p-bottom{border-color:#101b3025}.p-4 .p-bottom b{color:#235fbf}.p-4.in-view .p-aura{animation:light-sweep 6s ease-out both}.p-4.in-view .p-card{animation:glass-open 1.2s both;animation-delay:.1s}.p-4.in-view .p-card:nth-child(2){animation-delay:.25s}.p-4.in-view .p-card:nth-child(3){animation-delay:.4s}
@keyframes scan-panel{to{transform:scaleX(1)}}@keyframes signal-dot{from{transform:translate(calc((var(--i) - 2.5)*25px),-35px) rotate(45deg);opacity:.1}to{transform:none;opacity:1}}@keyframes ledger-rise{from{transform:translateY(35px);opacity:0}to{transform:none;opacity:1}}@keyframes engine-orbit{to{transform:rotateX(55deg) rotate(335deg)}}@keyframes light-sweep{from{transform:scale(1.5) translateX(-15%)}to{transform:scale(1) translateX(0)}}@keyframes glass-open{from{transform:perspective(800px) rotateY(-12deg) translateY(25px);opacity:0}to{transform:perspective(800px) rotateY(0) translateY(0);opacity:1}}
@media(max-width:900px){.p-shell{width:calc(100% - 48px)}.p-card{padding:22px}.p-cards{gap:12px}.p-3 .p-heading{padding-right:180px}.p-3 .p-emblem{right:40px}.p-heading h2{font-size:42px}.p-card h3{font-size:28px}.p-card p{font-size:13px}}
@media(max-width:650px){.problem-lab{padding:35px 0}.p-shell{width:calc(100% - 36px)}.p-meta{font-size:8px;letter-spacing:.07em;gap:12px}.p-heading{margin-bottom:28px}.p-heading h2,.p-2 .p-heading h2,.p-3 .p-heading h2,.p-4 .p-heading h2{font-size:35px}.p-heading>.p-emblem{display:none}.p-cards{grid-template-columns:1fr;gap:16px}.p-card,.p-2 .p-card,.p-3 .p-card,.p-4 .p-card{min-height:0;padding:23px}.p-card-top{margin-bottom:18px}.p-card h3{font-size:30px;margin-bottom:18px}.p-card p{max-width:none;font-size:14px}.p-bottom{flex-wrap:wrap;font-size:12px}.p-bottom a{margin-left:44px}.p-3 .p-heading{padding:0;min-height:0}.p-3 .p-card:before{display:none}.p-4 .p-card:nth-child(2){transform:none}.design-switch{font-size:10px;padding:10px 13px}}
@media(prefers-reduced-motion:reduce){.problem-lab *{animation:none!important;transition:none!important}}
/* Distinct spatial compositions for the experimental directions. */
@media(min-width:901px){.p-3 .p-shell{display:grid;grid-template-columns:.95fr 1.05fr;column-gap:65px}.p-3 .p-meta,.p-3 .p-bottom{grid-column:1/-1}.p-3 .p-heading{display:block;padding:10px 0 220px;margin:0;align-self:center}.p-3 .p-heading h2{font-size:53px;line-height:1.06}.p-3 .p-emblem{top:auto;bottom:65px;left:130px;right:auto;transform:scale(1.3)}.p-3 .p-cards{grid-template-columns:1fr;gap:14px}.p-3 .p-card{min-height:0;padding:22px 26px 22px 75px;border-radius:8px}.p-3 .p-card-top{position:absolute;left:20px;top:25px;margin:0;display:block}.p-3 .p-card-top>span:first-child{font-size:0}.p-3 .p-card-top>span:last-child{display:block;font-size:29px}.p-3 .p-card h3{font-size:28px;margin-bottom:13px}.p-3 .p-card p{max-width:none;font-size:13px}.p-3 .p-card:before{left:-45px;top:50%;height:1px;width:45px;background:linear-gradient(90deg,transparent,#5b9bff)}.p-4 .p-heading{margin-bottom:25px}.p-4 .p-heading h2{font-size:62px}.p-4 .p-cards{display:block;counter-reset:issue}.p-4 .p-card,.p-4 .p-card:nth-child(2){display:grid;grid-template-columns:90px 1.3fr 1fr;align-items:center;gap:30px;min-height:0;padding:22px 28px;margin-bottom:13px;border-radius:0 24px 24px 0;box-shadow:none;transform:none;counter-increment:issue}.p-4 .p-card:before{content:'0' counter(issue);font-family:'Space Grotesk';font-size:65px;letter-spacing:-.08em;color:#235fbf;line-height:1}.p-4 .p-card:nth-child(2):before{color:#ffc53d}.p-4 .p-card-top{display:none}.p-4 .p-card h3{font-size:30px;margin:0}.p-4 .p-card p{font-size:13px;margin:0;max-width:none}.p-4 .p-bottom{margin-top:20px}}
/* Keep the logo as six dots, without a square container. */
.p-2 .p-emblem{background:transparent;padding:0;box-shadow:none;border-radius:0;transform:rotate(8deg)}.p-2 .p-emblem i{margin:0}
