/* Sprint 2.1 - IDE real, clar si perfect mascat in display */
.hero-laptop-stage{position:absolute;left:50%;top:50%;width:100%;max-width:100%;aspect-ratio:8/5;transform:translate(-50%,-50%);pointer-events:none}
.hero-laptop-stage .hero-image-frame{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;z-index:4}
.hero-laptop-stage .hero-image-frame img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:contain!important}

/* Coordonatele urmeaza exact panoul interior al laptopului frontal. */
.hero-laptop-ui{position:absolute;z-index:6;left:23.95%;top:17.55%;width:52.10%;height:51.85%;border-radius:1.2% / 2%;overflow:hidden;clip-path:inset(0 round 1.2%);pointer-events:none;background:#07101f;box-shadow:inset 0 0 0 1px rgba(111,224,255,.12),inset 0 0 45px rgba(34,89,180,.12);font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;color:#d9f7ff}
.ide-shell{position:absolute;inset:0;display:grid;grid-template-rows:9% 1fr 7%;background:linear-gradient(140deg,#07101f,#0a1830 72%,#081426);overflow:hidden}
.ide-titlebar{display:flex;align-items:center;gap:3%;padding:0 2.4%;background:#0b1424;border-bottom:1px solid rgba(130,218,255,.1);font-size:clamp(5px,.72vw,11px);letter-spacing:.02em}
.ide-brand{font-weight:800;color:#82edff}.ide-project{color:#8c9ab0}.ide-status{margin-left:auto;color:#70f0bb;font-weight:700}.ide-status i{display:inline-block;width:.55em;height:.55em;margin-right:.45em;border-radius:50%;background:#70f0bb;box-shadow:0 0 8px #70f0bb;animation:idePulse 1.8s ease-in-out infinite}
.ide-workspace{display:grid;grid-template-columns:22% 1fr;min-height:0}
.ide-sidebar{padding:5% 7%;background:#091321;border-right:1px solid rgba(129,214,255,.09);font-size:clamp(5px,.67vw,10px);line-height:1.75;color:#8c9cb2}
.ide-sidebar-title{margin-bottom:7%;font-size:.85em;letter-spacing:.14em;color:#63748c}.ide-folder{color:#c2d7e8;font-weight:700}.ide-file{padding-left:12%;white-space:nowrap}.ide-file.active{margin-left:-7%;padding-left:19%;background:rgba(105,150,255,.13);color:#e1f8ff;border-left:2px solid #6eeaff}
.ide-editor{display:grid;grid-template-rows:11% 54% 35%;min-width:0;min-height:0;background:#07111f}
.ide-tabs{display:flex;align-items:stretch;background:#091321;border-bottom:1px solid rgba(130,218,255,.08);font-size:clamp(5px,.69vw,10px)}.ide-tabs span{display:flex;align-items:center;padding:0 4%;color:#708198}.ide-tabs .active{background:#07111f;color:#d7efff;border-top:1px solid #6eeaff}.ide-tabs b{margin-left:.7em;font-weight:400;color:#708198}
.ide-code{padding:3.5% 3% 2%;overflow:hidden;font-size:clamp(6px,.88vw,14px);line-height:1.48}.ide-code>div{display:grid;grid-template-columns:5% 1fr;opacity:0;transform:translateY(3px);animation:codeReveal 8s infinite}.ide-code>div:nth-child(1){animation-delay:.15s}.ide-code>div:nth-child(2){animation-delay:.35s}.ide-code>div:nth-child(3){animation-delay:.75s}.ide-code>div:nth-child(4){animation-delay:1.35s}.ide-code>div:nth-child(5){animation-delay:1.95s}.ide-code>div:nth-child(6){animation-delay:2.55s}.ide-code em{font-style:normal;text-align:right;padding-right:22%;color:#3f526b;user-select:none}.ide-code code{font:inherit;color:#d9f7ff;white-space:nowrap}.c-key{color:#9c8cff}.c-fn{color:#67ddff}.c-str{color:#76efbd}.c-bool{color:#ffb86c}.ide-caret{display:inline-block;width:.5em;height:1.05em;margin-left:.2em;vertical-align:-.12em;background:#8df5ff;animation:caretBlink .8s steps(1) infinite}
.ide-terminal{position:relative;padding:2.5% 4%;border-top:1px solid rgba(130,218,255,.1);background:#050c17;font-size:clamp(4.5px,.62vw,9px);line-height:1.42}.terminal-head{display:flex;gap:7%;margin-bottom:2%;font-size:.78em;color:#66778d;letter-spacing:.08em}.terminal-head span:first-child{color:#c9eaff;border-bottom:1px solid #6eeaff}.terminal-line{color:#a7b7ca}.terminal-line b{color:#72eaff}.terminal-step,.terminal-success{opacity:0;animation:terminalReveal 8s infinite}.terminal-step{color:#83dcb9}.terminal-success{margin-top:.3%;font-weight:900;letter-spacing:.08em;color:#73f2b8;text-shadow:0 0 12px rgba(81,240,178,.35)}.t1{animation-delay:3.1s}.t2{animation-delay:3.65s}.t3{animation-delay:4.2s}.t4{animation-delay:4.85s}
.ide-footer{display:flex;align-items:center;gap:4%;padding:0 2.5%;background:linear-gradient(90deg,#1d5ea8,#3477bd);font-size:clamp(3.5px,.48vw,7px);color:#eefaff}.ide-footer span:last-child{margin-left:auto}
.ide-glass{position:absolute;inset:0;z-index:5;background:linear-gradient(112deg,transparent 15%,rgba(180,243,255,.055) 39%,transparent 57%);transform:translateX(-135%);animation:screenGlass 11s ease-in-out infinite;mix-blend-mode:screen;pointer-events:none}
@keyframes codeReveal{0%,3%{opacity:0;transform:translateY(3px)}8%,88%{opacity:1;transform:none}96%,100%{opacity:0}}
@keyframes terminalReveal{0%,45%{opacity:0;transform:translateY(2px)}52%,88%{opacity:1;transform:none}96%,100%{opacity:0}}
@keyframes caretBlink{50%{opacity:0}}
@keyframes idePulse{50%{opacity:.45;transform:scale(.85)}}
@keyframes screenGlass{0%,52%{transform:translateX(-135%)}72%,100%{transform:translateX(150%)}}
@media(max-width:900px){.hero-laptop-ui{display:none}}
@media(prefers-reduced-motion:reduce){.ide-code>div,.terminal-step,.terminal-success,.ide-status i,.ide-caret,.ide-glass{animation:none!important;opacity:1!important;transform:none!important}}
@supports (aspect-ratio:8/5){.hero-laptop-stage{width:min(100%,calc(100vh * 1.6))}}
