/* ═══════════════════════════════════════════════════════
   SELMCORP — SELMLabs PAGE
   LAB / BLUEPRINT AESTHETIC
   Blueprint grids, molecules, experiment vibes
   ═══════════════════════════════════════════════════════ */

/* ═══ HERO ═══ */
.lb-hero{min-height:95vh;display:flex;align-items:center;position:relative;overflow:hidden;padding:clamp(110px,14vh,140px) 0 clamp(3rem,6vh,5rem)}
.lb-hero__orb{position:absolute;border-radius:50%;filter:blur(110px);opacity:.25;pointer-events:none;animation:lbOrb 13s ease-in-out infinite}
.lb-hero__orb--1{width:450px;height:450px;background:var(--cyan);top:-10%;right:-6%;animation-delay:0s}
.lb-hero__orb--2{width:350px;height:350px;background:var(--primary);bottom:-8%;left:-5%;animation-delay:-6s}
@keyframes lbOrb{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(-20px,18px) scale(1.05)}66%{transform:translate(15px,-12px) scale(.94)}}

/* Blueprint grid */
.lb-hero__blueprint{position:absolute;inset:0;background-image:linear-gradient(rgba(0,229,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(0,229,255,.06) 1px,transparent 1px);background-size:40px 40px;mask-image:radial-gradient(ellipse at 40% 50%,black 20%,transparent 65%);-webkit-mask-image:radial-gradient(ellipse at 40% 50%,black 20%,transparent 65%);animation:bpPulse 5s ease-in-out infinite}
@keyframes bpPulse{0%,100%{opacity:.5}50%{opacity:.9}}

/* Molecule */
.lb-molecule{position:absolute;top:15%;right:8%;width:280px;height:280px;pointer-events:none;z-index:1;animation:molRotate 25s linear infinite}
@keyframes molRotate{to{transform:rotate(360deg)}}
.lb-atom{position:absolute;border-radius:50%;animation:atomPulse 3s ease-in-out infinite}
.lb-atom--1{width:18px;height:18px;background:var(--cyan);box-shadow:0 0 15px var(--cyan),0 0 30px rgba(0,229,255,.3);top:20%;left:15%;animation-delay:0s}
.lb-atom--2{width:14px;height:14px;background:var(--accent);box-shadow:0 0 15px var(--accent);top:20%;right:15%;animation-delay:-.8s}
.lb-atom--3{width:16px;height:16px;background:var(--primary);box-shadow:0 0 15px var(--primary);bottom:20%;left:15%;animation-delay:-1.5s}
.lb-atom--4{width:12px;height:12px;background:var(--cyan);box-shadow:0 0 12px var(--cyan);bottom:20%;right:15%;animation-delay:-2.2s}
@keyframes atomPulse{0%,100%{transform:scale(1);opacity:.7}50%{transform:scale(1.5);opacity:1}}
.lb-bonds{position:absolute;inset:0;width:100%;height:100%}
.lb-bond{stroke:var(--cyan);stroke-width:.3;opacity:0;animation:bondFlow 3.5s ease-in-out infinite}
.lb-bond:nth-child(1){animation-delay:0s}.lb-bond:nth-child(2){animation-delay:-.9s}
.lb-bond:nth-child(3){animation-delay:-1.8s}.lb-bond:nth-child(4){animation-delay:-2.6s}
@keyframes bondFlow{0%{opacity:0;stroke-dasharray:0 100}30%{opacity:.5;stroke-dasharray:40 60}70%{opacity:.5}100%{opacity:0;stroke-dasharray:0 100}}

.lb-hero__inner{position:relative;z-index:3;max-width:750px}
.lb-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem 1rem;background:var(--card);border:1px solid var(--border);border-radius:var(--r-pill);font-size:.82rem;font-weight:600;color:var(--cyan);backdrop-filter:blur(10px);margin-bottom:1.5rem}
.lb-badge i{color:var(--primary);animation:flaskBubble 3s ease-in-out infinite}
@keyframes flaskBubble{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px) rotate(10deg)}}
.lb-hero__h1{font-family:'Syne',sans-serif;font-size:clamp(2.4rem,6vw,3.8rem);font-weight:800;line-height:1.08;margin-bottom:1.2rem;letter-spacing:-.02em}
.lb-hero__h1 em{font-style:normal}
.lb-hero__sub{font-size:clamp(1rem,1.8vw,1.12rem);color:var(--txt2);max-width:600px;line-height:1.75;margin-bottom:2rem}
.lb-hero__actions{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:1.5rem}
.lb-hero__stats{display:flex;gap:1rem;flex-wrap:wrap}
.lb-stat{display:flex;align-items:center;gap:.4rem;padding:.4rem .9rem;background:rgba(0,229,255,.06);border:1px solid rgba(0,229,255,.12);border-radius:var(--r-pill);font-size:.78rem;font-weight:600;color:var(--cyan)}
.lb-stat i{font-size:.7rem}

/* ═══ DEMO VIDEO ═══ */
.lb-demo{padding:0 0 var(--py);margin-top:-2rem;position:relative;z-index:2}
.lb-demo__box{max-width:900px;margin:0 auto;border-radius:var(--r-lg);overflow:hidden;border:1px solid rgba(0,229,255,.12);background:var(--bg2);aspect-ratio:16/9;position:relative;box-shadow:0 8px 40px rgba(0,229,255,.06)}
.lb-demo__ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;cursor:pointer;transition:all .4s var(--ease)}
.lb-demo__ph:hover{background:rgba(0,229,255,.03)}
.lb-demo__play{width:80px;height:80px;background:linear-gradient(135deg,var(--cyan),var(--primary));border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.8rem;color:#fff;box-shadow:0 0 30px rgba(0,229,255,.3);animation:lbPlay 2.5s ease-in-out infinite}
@keyframes lbPlay{0%,100%{box-shadow:0 0 30px rgba(0,229,255,.3)}50%{box-shadow:0 0 50px rgba(0,229,255,.5)}}
.lb-demo__ph p{font-family:'Syne',sans-serif;font-size:1rem;font-weight:700;color:var(--txt2)}
.lb-demo__ph span{font-size:.78rem;color:var(--txt3)}
.lb-demo__box video,.lb-demo__box iframe{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;border:none}

/* ═══ FEATURES — alternating layout ═══ */
.lb-features{padding:var(--py) 0;background:var(--bg2)}
.lb-feat-grid{display:flex;flex-direction:column;gap:3rem}
.lb-feat{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:center;background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;backdrop-filter:blur(8px);transition:all .5s var(--ease)}
.lb-feat:hover{box-shadow:var(--sh-lg);border-color:rgba(0,229,255,.15)}
.lb-feat--reverse{direction:rtl}
.lb-feat--reverse>*{direction:ltr}
.lb-feat__visual{height:100%;min-height:280px;position:relative;overflow:hidden;background:linear-gradient(135deg,rgba(0,229,255,.04),rgba(108,43,217,.04))}
.lb-feat__visual img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.lb-feat:hover .lb-feat__visual img{transform:scale(1.05)}
.lb-feat__ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:4rem;color:var(--cyan);opacity:.1;animation:labFloat 5s ease-in-out infinite}
@keyframes labFloat{0%,100%{transform:translateY(0) scale(1);opacity:.1}50%{transform:translateY(-10px) scale(1.08);opacity:.18}}
.lb-feat__body{padding:2rem 2.5rem 2rem 1.5rem}
.lb-feat--reverse .lb-feat__body{padding:2rem 1.5rem 2rem 2.5rem}
.lb-feat__icon{width:46px;height:46px;background:linear-gradient(135deg,var(--cyan),var(--primary));border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.1rem;margin-bottom:1rem;transition:transform .4s var(--bounce)}
.lb-feat:hover .lb-feat__icon{transform:scale(1.12) rotate(5deg)}
.lb-feat__body h3{font-family:'Syne',sans-serif;font-size:1.2rem;font-weight:700;margin-bottom:.2rem}
.lb-feat__body h4{font-size:.82rem;color:var(--txt3);font-weight:500;margin-bottom:.7rem;font-family:'JetBrains Mono',monospace;letter-spacing:.5px}
.lb-feat__body p{font-size:.9rem;color:var(--txt2);line-height:1.7;margin-bottom:.8rem}
.lb-feat__body ul{list-style:none;padding:0}
.lb-feat__body ul li{padding:.3rem 0 .3rem 1.3rem;position:relative;font-size:.84rem;color:var(--txt3)}
.lb-feat__body ul li::before{content:'⚗';position:absolute;left:0;font-size:.75rem}

/* ═══ PROCESS ═══ */
.lb-process{padding:var(--py) 0}
.lb-process .sd-process__track{max-width:700px;margin:0 auto;position:relative;padding-left:44px}
.lb-process .sd-process__track::before{content:'';position:absolute;left:14px;top:0;bottom:0;width:2px;background:linear-gradient(to bottom,var(--cyan),var(--primary),var(--accent));border-radius:2px}
.lb-process .sd-step__num{background:linear-gradient(135deg,var(--cyan),var(--primary))}

/* ═══ PRICING ═══ */
.lb-pricing{padding:var(--py) 0;background:var(--bg2)}
.lb-pricing .sd-pricing__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.3rem;align-items:start}
.lb-pricing .price-card--custom{border-style:dashed;border-color:var(--cyan);background:linear-gradient(135deg,rgba(0,229,255,.03),rgba(108,43,217,.03))}
.lb-pricing .price-card--custom:hover{border-color:var(--primary);box-shadow:0 12px 40px rgba(0,229,255,.12)}
.lb-pricing .amount--custom{font-size:1.8rem!important;background:linear-gradient(135deg,var(--cyan),var(--primary))!important;-webkit-background-clip:text!important;-webkit-text-fill-color:transparent!important;background-clip:text!important}

/* ═══ RESPONSIVE ═══ */
@media(max-width:1024px){
  .lb-feat{grid-template-columns:1fr}
  .lb-feat--reverse{direction:ltr}
  .lb-feat__visual{min-height:200px}
  .lb-feat__body{padding:1.5rem!important}
  .lb-molecule{width:180px;height:180px;right:3%;top:10%}
  .lb-pricing .sd-pricing__grid{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
  .lb-hero__actions{flex-direction:column;align-items:flex-start}
  .lb-hero__actions .btn{width:100%;max-width:300px}
  .lb-hero__stats{flex-direction:column}
  .lb-molecule{display:none}
  .lb-pricing .sd-pricing__grid{grid-template-columns:1fr}
}
@media(max-width:480px){.lb-hero{padding-top:90px}}
@media(prefers-reduced-motion:reduce){.lb-hero__orb,.lb-atom,.lb-bond,.lb-molecule,.lb-feat__ph{animation:none!important;opacity:.1}}