/* ═══════════════════════════════════════════════════════════════
   CODE-IDE-LANDING.CSS — AlphaVault AI
   Styles spécifiques à landing-code-ide.html
   Namespace : lab-ide-*
   Dépend de : landing-institutional.css (variables --ink-*, classes lp-*, lab-*)
   ═══════════════════════════════════════════════════════════════ */

/* ── LIVE BUILD MOCKUP (hero visual — hérite de .lp-hero-visual-frame) ── */
.lab-ide-live-badge{
    margin-left:auto;
    display:inline-flex; align-items:center; gap:6px;
    font-size:.7rem; font-weight:800; letter-spacing:.04em;
    text-transform:uppercase; color:var(--ink-accent-dark);
    white-space:nowrap;
}
.lab-ide-rec-dot{
    width:7px; height:7px; border-radius:50%; background:var(--ink-accent);
    display:inline-block; animation:labIdePulse 1.5s ease-in-out infinite;
}
@keyframes labIdePulse{ 0%,100%{opacity:1;} 50%{opacity:.3;} }

.lab-ide-hero-visual-body{
    min-height:300px;
    display:flex; align-items:center; justify-content:center;
    padding:32px 22px;
    background:var(--ink-surface-2);
}

.lab-ide-build-log{
    width:100%; max-width:620px;
    display:flex; flex-direction:column; gap:10px;
    font-family:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;
}
.lab-ide-build-line{
    display:flex; align-items:center; gap:12px;
    font-size:.78rem; text-align:left;
    padding:11px 16px; border-radius:8px;
    background:var(--ink-white);
    border:1px solid var(--ink-border);
    color:var(--ink-text-muted);
}
.lab-ide-build-line .lab-ide-build-dot{
    width:8px; height:8px; border-radius:50%; flex-shrink:0;
    background:var(--ink-border);
}
.lab-ide-build-line.done{ color:var(--ink-text-secondary); }
.lab-ide-build-line.done .lab-ide-build-dot{ background:#059669; }
.lab-ide-build-line.active{
    color:var(--ink-black); border-color:rgba(99,102,241,.35);
    background:var(--ink-accent-pale);
}
.lab-ide-build-line.active .lab-ide-build-dot{
    background:var(--ink-accent);
    animation:labIdePulse 1.2s ease-in-out infinite;
}
.lab-ide-build-line.pending{ opacity:.55; }
.lab-ide-build-line.pending .lab-ide-build-dot{ background:var(--ink-border); }

/* ── WORKFLOW LOOP (Plan → Team → Generate → Validate → Host) ── */
.lab-ide-workflow{
    display:flex; align-items:center; flex-wrap:wrap;
    justify-content:center; margin:8px 0 0; gap:8px;
}
.lab-ide-wf-node{
    background:var(--ink-white);
    border:1px solid var(--ink-border);
    border-radius:var(--ink-radius-md); padding:20px 22px;
    text-align:center; min-width:140px;
    transition:box-shadow var(--ink-t-fast), transform var(--ink-t-fast), border-color var(--ink-t-fast);
}
.lab-ide-wf-node:hover{ border-color:#d4d4e0; transform:translateY(-3px); box-shadow:0 10px 24px rgba(10,10,10,.08); }
.lab-ide-wf-node .lab-iso-icon{ width:34px; height:34px; margin:0 auto 10px; }
.lab-ide-wf-node span{ font-size:.78rem; font-weight:600; color:var(--ink-black); }
.lab-ide-wf-arrow{ color:var(--ink-text-muted); font-size:1rem; padding:0 2px; }

/* ── FEATURE GRID (style lab-why-card) ── */
.lab-ide-feat-grid{
    display:grid; grid-template-columns:repeat(3,1fr); gap:16px;
}
.lab-ide-feat-card{
    background:var(--ink-white);
    border:1px solid var(--ink-border);
    border-radius:var(--ink-radius-md);
    padding:28px 26px 26px;
    transition:box-shadow var(--ink-t-fast), transform var(--ink-t-fast), border-color var(--ink-t-fast);
    position:relative;
}
.lab-ide-feat-card:hover{
    border-color:#d4d4e0;
    transform:translateY(-3px);
    box-shadow:0 14px 32px rgba(10,10,10,.08);
}
.lab-ide-feat-card h4{ font-size:1rem; font-weight:700; color:var(--ink-black); margin:0 0 9px; }
.lab-ide-feat-card p{ font-size:.85rem; color:var(--ink-text-secondary); line-height:1.6; margin:0; }
.lab-ide-feat-tag{
    display:inline-block; margin-top:12px; font-size:.62rem; font-weight:700;
    text-transform:uppercase; letter-spacing:.04em; padding:3px 10px; border-radius:20px;
    background:var(--ink-accent-pale); color:var(--ink-accent-dark);
}

@media(max-width:1024px){ .lab-ide-feat-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:600px){ .lab-ide-feat-grid{ grid-template-columns:1fr; } }

/* ── AGENT TEAM GRID (13 specialists) ── */
.lab-ide-agent-grid{
    display:grid; grid-template-columns:repeat(4,1fr); gap:14px;
}
.lab-ide-agent-card{
    background:var(--ink-white);
    border:1px solid var(--ink-border);
    border-radius:var(--ink-radius-md);
    padding:22px 20px;
    transition:box-shadow var(--ink-t-fast), transform var(--ink-t-fast), border-color var(--ink-t-fast);
}
.lab-ide-agent-card:hover{ border-color:#d4d4e0; transform:translateY(-2px); box-shadow:0 10px 22px rgba(10,10,10,.07); }
.lab-ide-agent-card h4{ font-size:.85rem; font-weight:700; color:var(--ink-black); margin:0 0 7px; }
.lab-ide-agent-card p{ font-size:.76rem; color:var(--ink-text-secondary); line-height:1.55; margin:0; }

@media(max-width:1024px){ .lab-ide-agent-grid{ grid-template-columns:repeat(3,1fr); } }
@media(max-width:700px){ .lab-ide-agent-grid{ grid-template-columns:repeat(2,1fr); } }

/* ── DEPLOY / HOSTING CARD ── */
.lab-ide-deploy-card{
    border:1px solid var(--ink-border);
    border-radius:var(--ink-radius-lg);
    padding:32px;
    background:var(--ink-white);
    box-shadow:var(--ink-shadow-2);
    display:flex; flex-direction:column; gap:20px;
}
.lab-ide-deploy-row{
    display:flex; align-items:flex-start; gap:16px;
}
.lab-ide-deploy-row-icon{
    width:38px; height:38px; border-radius:10px; flex-shrink:0;
    background:var(--ink-accent-pale);
    display:flex; align-items:center; justify-content:center;
    position:relative;
}
.lab-ide-deploy-row-icon::before, .lab-ide-deploy-row-icon::after{
    content:''; position:absolute; width:4px; height:4px; background:var(--carta-corner);
}
.lab-ide-deploy-row-icon::before{ top:-2px; left:-2px; }
.lab-ide-deploy-row-icon::after{ bottom:-2px; right:-2px; }
.lab-ide-deploy-row-icon .lab-iso-icon{ width:22px; height:22px; }
.lab-ide-deploy-row h5{ font-size:.9rem; font-weight:700; color:var(--ink-black); margin:0 0 5px; }
.lab-ide-deploy-row p{ font-size:.82rem; color:var(--ink-text-secondary); margin:0; line-height:1.55; }

.lab-ide-deploy-url{
    margin-top:6px;
    display:flex; align-items:center; gap:10px;
    background:#f0fdf9;
    border:1px solid #a7f3d0;
    border-radius:10px;
    padding:13px 18px;
    font-family:'SFMono-Regular',Consolas,monospace;
    font-size:.8rem;
    color:#047857;
}
.lab-ide-deploy-url::before{
    content:'';
    width:8px; height:8px; border-radius:50%;
    background:#059669; flex-shrink:0;
}

/* ── TEMPLATE GRID ── */
.lab-ide-tpl-grid{
    display:grid; grid-template-columns:repeat(3,1fr); gap:16px;
}
.lab-ide-tpl-card{
    background:var(--ink-white);
    border:1px solid var(--ink-border);
    border-radius:var(--ink-radius-md);
    padding:26px 24px;
    transition:box-shadow var(--ink-t-fast), transform var(--ink-t-fast), border-color var(--ink-t-fast);
}
.lab-ide-tpl-card:hover{ border-color:#d4d4e0; transform:translateY(-3px); box-shadow:0 12px 28px rgba(10,10,10,.08); }
.lab-ide-tpl-card h4{ font-size:.94rem; font-weight:700; color:var(--ink-black); margin:0 0 9px; }
.lab-ide-tpl-card p{ font-size:.82rem; color:var(--ink-text-secondary); line-height:1.6; margin:0; }

@media(max-width:1024px){ .lab-ide-tpl-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:600px){ .lab-ide-tpl-grid{ grid-template-columns:1fr; } }

/* ── USE CASE GRID (by role) ── */
.lab-ide-usecase-grid{
    display:grid; grid-template-columns:repeat(3,1fr); gap:16px;
}
.lab-ide-usecase-card{
    background:var(--ink-white);
    border:1px solid var(--ink-border);
    border-radius:var(--ink-radius-md); padding:26px 24px;
    transition:box-shadow var(--ink-t-fast), transform var(--ink-t-fast), border-color var(--ink-t-fast);
}
.lab-ide-usecase-card:hover{ border-color:#d4d4e0; transform:translateY(-3px); box-shadow:0 12px 28px rgba(10,10,10,.08); }
.lab-ide-usecase-role{
    font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em;
    color:var(--ink-text-muted); margin-bottom:10px;
}
.lab-ide-usecase-card h4{ font-size:.96rem; font-weight:700; color:var(--ink-black); margin:0 0 9px; }
.lab-ide-usecase-card p{ font-size:.83rem; color:var(--ink-text-secondary); line-height:1.6; margin:0; }
@media(max-width:860px){ .lab-ide-usecase-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:600px){ .lab-ide-usecase-grid{ grid-template-columns:1fr; } }

/* ── RESPONSIVE ── */
@media (max-width:768px){
    .lab-ide-hero-visual-body{ min-height:auto; padding:22px 16px; }
    .lab-ide-build-line{ font-size:.74rem; padding:10px 12px; }

    .lab-ide-workflow{
        flex-wrap:nowrap !important; justify-content:flex-start !important; overflow-x:auto !important;
        -webkit-overflow-scrolling:touch !important; margin:8px -20px 0 !important;
        padding:4px 20px 14px !important; scrollbar-width:none !important; -ms-overflow-style:none !important;
    }
    .lab-ide-workflow::-webkit-scrollbar{ display:none !important; }
    .lab-ide-wf-node{ flex:0 0 auto; min-width:130px; }

    .lab-ide-feat-grid{ grid-template-columns:1fr; }
    .lab-ide-agent-grid{ grid-template-columns:1fr 1fr; }
    .lab-ide-tpl-grid{ grid-template-columns:1fr; }
    .lab-ide-usecase-grid{ grid-template-columns:1fr; }

    .lab-ide-hero-visual-body{ min-height:auto; padding:22px 16px; }
    .lab-ide-build-line{ font-size:.74rem; padding:10px 12px; }
    .lab-ide-deploy-card{ padding:24px; }
}

@media (min-width:769px) and (max-width:1024px){
    .lab-ide-feat-grid{ grid-template-columns:repeat(2,1fr); }
    .lab-ide-agent-grid{ grid-template-columns:repeat(3,1fr); }
    .lab-ide-tpl-grid{ grid-template-columns:repeat(2,1fr); }
    .lab-ide-usecase-grid{ grid-template-columns:repeat(2,1fr); }
}