/* Phoenix By Design — experiential proof layer */
.showcase-section{position:relative;padding:132px 0 150px;overflow:hidden;background:radial-gradient(circle at 50% 0,rgba(112,223,255,.06),transparent 34%),linear-gradient(180deg,#050807,#07100d 46%,#050807);border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.showcase-section::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(to bottom,transparent,black 18%,black 82%,transparent)}
.showcase-head{position:relative;z-index:2;display:grid;grid-template-columns:.78fr 1.22fr;gap:80px;align-items:end;margin-bottom:58px}
.showcase-head h2{font-size:clamp(48px,6.6vw,92px);line-height:.92;letter-spacing:-.06em;margin:0;color:#f2f6f3}
.showcase-head h2 em{font-style:normal;color:#70dfff}
.showcase-head>div:last-child{max-width:680px;color:#87948f;font-size:16px;line-height:1.8}
.showcase-grid{position:relative;z-index:2;display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.showcase-card{--scene:#70dfff;--scene-rgb:112,223,255;--px:50%;--py:50%;--rx:0deg;--ry:0deg;position:relative;grid-column:span 6;min-height:640px;padding:30px;border:1px solid rgba(255,255,255,.11);border-radius:24px;overflow:hidden;background:linear-gradient(145deg,rgba(var(--scene-rgb),.055),rgba(255,255,255,.018) 38%,rgba(0,0,0,.16));box-shadow:0 28px 80px rgba(0,0,0,.28);transform:perspective(1400px) rotateX(var(--rx)) rotateY(var(--ry));transform-style:preserve-3d;transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease}
.showcase-card::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--px) var(--py),rgba(var(--scene-rgb),.17),transparent 32%);opacity:.66}
.showcase-card::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 1px rgba(255,255,255,.045),inset 0 -1px rgba(var(--scene-rgb),.08)}
.showcase-card:hover{border-color:rgba(var(--scene-rgb),.28);box-shadow:0 34px 100px rgba(0,0,0,.36),0 0 70px rgba(var(--scene-rgb),.07)}
.showcase-wide{grid-column:span 12;min-height:690px}.showcase-stage{--scene:#eab36b;--scene-rgb:234,179,107}.showcase-remodel{--scene:#f2d7ae;--scene-rgb:242,215,174}.showcase-smart{--scene:#70dfff;--scene-rgb:112,223,255}.showcase-regen{--scene:#64f0b5;--scene-rgb:100,240,181}.showcase-digital{--scene:#a991ff;--scene-rgb:169,145,255}
.showcase-copy{position:relative;z-index:5;max-width:720px;transform:translateZ(36px)}
.showcase-kicker{display:flex;align-items:center;gap:12px;color:var(--scene);font-size:9px;font-weight:800;letter-spacing:.2em;text-transform:uppercase}
.showcase-kicker::before{content:"";width:32px;height:1px;background:currentColor;box-shadow:0 0 12px currentColor}
.showcase-copy h3{max-width:880px;margin:14px 0 14px;font-size:clamp(32px,4.2vw,58px);line-height:.98;letter-spacing:-.045em;color:#edf3ef}
.showcase-copy p{max-width:660px;color:#899691;line-height:1.72;font-size:14px}
.showcase-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.showcase-tags span{padding:7px 10px;border:1px solid rgba(255,255,255,.1);border-radius:999px;background:rgba(0,0,0,.2);color:#a8b3af;font-size:8px;letter-spacing:.12em;text-transform:uppercase}
.showcase-scene{position:absolute;z-index:2;left:0;right:0;bottom:0;height:72%;pointer-events:none;transform:translateZ(12px);transition:transform .45s cubic-bezier(.2,.7,.2,1),filter .45s ease}.showcase-card.scene-live .showcase-scene{filter:saturate(1.08) brightness(1.04)}
.showcase-scene svg{width:100%;height:100%;overflow:visible}.showcase-scene .line{fill:none;stroke:rgba(231,240,236,.72);stroke-width:1.2;vector-effect:non-scaling-stroke}.showcase-scene .dim{fill:none;stroke:rgba(231,240,236,.19);stroke-width:1;vector-effect:non-scaling-stroke}.showcase-scene .accent{fill:none;stroke:var(--scene);stroke-width:1.35;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 7px rgba(var(--scene-rgb),.34))}.showcase-scene .panel{fill:rgba(255,255,255,.018);stroke:rgba(255,255,255,.26);stroke-width:1;vector-effect:non-scaling-stroke}.showcase-scene .soft{fill:rgba(var(--scene-rgb),.05);stroke:rgba(var(--scene-rgb),.32);stroke-width:1;vector-effect:non-scaling-stroke}.showcase-scene .hot{fill:rgba(var(--scene-rgb),.12);stroke:var(--scene);stroke-width:1;vector-effect:non-scaling-stroke}
.showcase-scene text{font-family:Inter,Arial,sans-serif;fill:#7f8d88;font-size:8px;font-weight:700;letter-spacing:1.5px}.showcase-scene text.live{fill:var(--scene)}
.scene-hud{position:absolute;z-index:4;right:28px;bottom:26px;display:grid;gap:5px;min-width:168px;padding:14px 15px;border:1px solid rgba(var(--scene-rgb),.23);border-radius:10px;background:rgba(4,8,7,.72);backdrop-filter:blur(12px);box-shadow:0 16px 42px rgba(0,0,0,.25);transform:translateZ(48px)}
.scene-hud small{font-size:7px;letter-spacing:.18em;color:#697772}.scene-hud b{font-size:11px;letter-spacing:.08em;color:#e6eeea}.scene-hud span{font-size:8px;letter-spacing:.1em;color:var(--scene)}
.showcase-stage .showcase-scene{height:78%}.showcase-regen .showcase-scene{height:77%}.showcase-digital .showcase-scene{height:80%}
.scene-beam{animation:scenePulse 3.8s ease-in-out infinite}.scene-beam:nth-child(2){animation-delay:-1.2s}.scene-flow{stroke-dasharray:7 10;animation:sceneFlow 7s linear infinite}.scene-scan{animation:sceneScan 5.5s ease-in-out infinite;transform-origin:center}
@keyframes scenePulse{50%{opacity:.34}}@keyframes sceneFlow{to{stroke-dashoffset:-170}}@keyframes sceneScan{50%{opacity:.18;transform:translateY(10px)}}
.stage-spectrum{position:absolute;left:35px;bottom:25px;z-index:4;display:flex;align-items:flex-end;gap:3px;height:32px;transform:translateZ(44px)}.stage-spectrum i{display:block;width:3px;height:35%;background:var(--scene);opacity:.72;animation:spectrum 1.3s ease-in-out infinite}.stage-spectrum i:nth-child(2){height:75%;animation-delay:-.25s}.stage-spectrum i:nth-child(3){height:52%;animation-delay:-.5s}.stage-spectrum i:nth-child(4){height:90%;animation-delay:-.75s}.stage-spectrum i:nth-child(5){height:63%;animation-delay:-1s}@keyframes spectrum{50%{height:22%;opacity:.36}}
.digital-status{position:absolute;left:32px;bottom:28px;z-index:5;display:flex;gap:18px;color:#75827d;font-size:8px;letter-spacing:.12em;transform:translateZ(48px)}.digital-status b{color:var(--scene)}
/* Hero detail pass */
.stage-led-wall{position:absolute;left:31%;top:22%;width:38%;height:26%;border:1px solid rgba(234,179,107,.32);background:repeating-linear-gradient(90deg,rgba(234,179,107,.04) 0 1px,transparent 1px 22px),repeating-linear-gradient(0deg,rgba(234,179,107,.04) 0 1px,transparent 1px 16px);transform:perspective(700px) rotateX(-5deg);box-shadow:0 0 28px rgba(234,179,107,.05)}
.stage-led-wall::after{content:"SHOW CONTROL";position:absolute;right:8px;bottom:7px;color:rgba(234,179,107,.58);font-size:6px;letter-spacing:.18em}.speaker-array{position:absolute;top:24%;display:grid;gap:2px;transform:rotate(5deg)}.speaker-array i{display:block;width:18px;height:12px;border:1px solid rgba(255,255,255,.34);background:rgba(0,0,0,.22)}.array-left{left:18%}.array-right{right:16%;transform:rotate(-5deg)}
.stage-beam{position:absolute;top:16%;height:64%;width:1px;transform-origin:top;background:linear-gradient(rgba(234,179,107,.5),transparent);filter:drop-shadow(0 0 4px rgba(234,179,107,.38));opacity:.5}.beam-a{left:29%;transform:rotate(17deg)}.beam-b{left:47%;transform:rotate(-10deg)}.beam-c{left:67%;transform:rotate(13deg)}
.control-desk{position:absolute;left:38%;bottom:11%;width:25%;height:9%;border:1px solid rgba(234,179,107,.28);transform:skewX(-10deg);display:flex;gap:7px;align-items:center;justify-content:center;background:rgba(0,0,0,.28)}.control-desk span{font-size:5px;letter-spacing:.12em;color:rgba(234,179,107,.64)}
.regen-tree{position:absolute;left:8%;bottom:16%;width:80px;height:105px;border-left:1px solid rgba(100,240,181,.42)}.regen-tree::before,.regen-tree::after{content:"";position:absolute;border:1px solid rgba(100,240,181,.26);border-radius:50%}.regen-tree::before{width:74px;height:58px;left:-36px;top:0}.regen-tree::after{width:52px;height:44px;left:-15px;top:18px}.regen-cistern{position:absolute;right:9%;bottom:18%;width:40px;height:54px;border:1px solid rgba(112,223,255,.35);border-radius:20px 20px 7px 7px}.regen-cistern::after{content:"RAIN";position:absolute;left:7px;top:21px;font-size:5px;letter-spacing:.12em;color:rgba(112,223,255,.65)}
.airflow-path{position:absolute;left:22%;top:31%;width:56%;height:36%;border-top:1px dashed rgba(100,240,181,.36);border-radius:50%;transform:rotate(-7deg);animation:airBreathe 4s ease-in-out infinite}.soil-line{position:absolute;left:14%;right:12%;bottom:14%;height:1px;background:repeating-linear-gradient(90deg,rgba(100,240,181,.28) 0 8px,transparent 8px 14px)}@keyframes airBreathe{50%{opacity:.25;transform:rotate(-7deg) scale(1.04)}}
.smart-glass{position:absolute;right:11%;top:20%;width:28%;height:38%;border:1px solid rgba(112,223,255,.18);background:linear-gradient(135deg,rgba(112,223,255,.03),transparent)}.cove-light{position:absolute;left:14%;right:15%;top:19%;height:1px;background:linear-gradient(90deg,transparent,rgba(112,223,255,.8),transparent);box-shadow:0 0 11px rgba(112,223,255,.3)}.device-rack{position:absolute;right:8%;bottom:16%;width:34px;height:90px;border:1px solid rgba(112,223,255,.25);background:repeating-linear-gradient(0deg,transparent 0 8px,rgba(112,223,255,.08) 8px 9px)}.occupancy-sensor{position:absolute;left:46%;top:20%;width:9px;height:9px;border-radius:50%;border:1px solid rgba(112,223,255,.65);box-shadow:0 0 12px rgba(112,223,255,.35)}.network-pulse{position:absolute;left:47%;top:21%;width:180px;height:180px;border:1px solid rgba(112,223,255,.09);border-radius:50%;transform:translate(-50%,-50%);animation:netPulse 4s ease-out infinite}@keyframes netPulse{50%{width:240px;height:240px;opacity:.08}}
@media(max-width:980px){.showcase-head{grid-template-columns:1fr;gap:22px}.showcase-card,.showcase-wide{grid-column:span 12;min-height:610px}.showcase-copy{max-width:90%}.showcase-scene{height:68%}}
@media(max-width:640px){.showcase-section{padding:82px 0 96px}.showcase-head{margin-bottom:34px}.showcase-head h2{font-size:clamp(42px,13vw,58px)}.showcase-head>div:last-child{font-size:14px}.showcase-grid{gap:14px}.showcase-card,.showcase-wide{min-height:590px;padding:22px;border-radius:18px;transform:none!important}.showcase-copy{max-width:100%}.showcase-copy h3{font-size:clamp(31px,9.5vw,44px)}.showcase-copy p{font-size:13px}.showcase-tags span{font-size:7px;padding:6px 8px}.showcase-scene,.showcase-stage .showcase-scene,.showcase-regen .showcase-scene,.showcase-digital .showcase-scene{height:62%;left:-7%;right:-7%;width:114%}.scene-hud{right:18px;bottom:18px;min-width:142px;padding:11px}.stage-spectrum,.digital-status{left:20px;bottom:20px}.digital-status{gap:9px;font-size:7px}}
@media(prefers-reduced-motion:reduce){.scene-beam,.scene-flow,.scene-scan,.stage-spectrum i,.airflow-path,.network-pulse{animation:none!important}.showcase-card,.showcase-scene{transition:none!important}}
.showcase-link{display:inline-flex;align-items:center;gap:8px;margin-top:18px;color:var(--scene);font-size:9px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;text-decoration:none}.showcase-link span{transition:transform .2s ease}.showcase-link:hover span{transform:translateX(4px)}
/* Frontier rendering pass — true 3D is progressive enhancement over semantic DOM. */
.hero-webgl{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;opacity:.82;filter:saturate(1.08) contrast(1.04)}
.world-field{opacity:.34!important}.world-stage{z-index:4}.world-hero-copy{z-index:12}.world-noise{z-index:9}
.world-panel{background:linear-gradient(180deg,rgba(5,8,7,.04),rgba(5,8,7,.18) 65%,rgba(5,8,7,.42));backdrop-filter:blur(.4px)}
.world-panel:hover{filter:brightness(1.12) saturate(1.1)}
.world-label{padding:7px 10px;border-radius:10px;background:rgba(3,7,6,.34);backdrop-filter:blur(9px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.045)}
.world-caption{padding:9px 11px;border-radius:9px;background:rgba(3,7,6,.38);backdrop-filter:blur(8px)}
@view-transition{navigation:auto}.logo{view-transition-name:pbd-brand}.nav-cta-desktop{view-transition-name:pbd-action}
html{color-scheme:dark}::view-transition-old(root),::view-transition-new(root){animation-duration:.42s;animation-timing-function:cubic-bezier(.2,.7,.2,1)}
@media(max-width:767px){.hero-webgl{opacity:.58}.world-panel{backdrop-filter:none}.world-label,.world-caption{backdrop-filter:blur(6px)}}
@media(prefers-reduced-motion:reduce){.hero-webgl{opacity:.52}::view-transition-group(*){animation-duration:.01ms!important}}
