/* =========================================================
   VIONESHPERE PROJECTS
   Premium project-management product page
   ========================================================= */

.projects-page{
    --p-bg:#090a0b;
    --p-panel:#111314;
    --p-panel2:#151718;
    --p-ivory:#f4f1eb;
    --p-white:#faf8f4;
    --p-text:#9aa1a4;
    --p-gold:#c18a3a;
    --p-gold2:#c9953d;
    --p-line:#2a2d2e;
    color:#111;
    background:var(--p-white);
}

.projects-container{
    width:min(1260px,calc(100% - 90px));
    margin:0 auto;
}

.projects-kicker{
    color:var(--p-gold);
    font-size:9px;
    letter-spacing:.22em;
    font-weight:700;
}

.projects-hero{
    min-height:690px;
    padding:105px 0 78px;
    background:
      radial-gradient(circle at 82% 20%,rgba(193,138,58,.12),transparent 28%),
      linear-gradient(120deg,#080909 0%,#0b0c0d 48%,#111315 100%);
    color:#f5f2ed;
    overflow:hidden;
}

.projects-hero-grid{
    width:min(1260px,calc(100% - 90px));
    margin:0 auto;
    display:grid;
    grid-template-columns:.86fr 1.14fr;
    gap:65px;
    align-items:center;
}

.projects-hero-copy h1{
    margin:22px 0 25px;
    font-size:clamp(49px,5.4vw,74px);
    line-height:.9;
    letter-spacing:-.06em;
    font-weight:700;
}

.projects-hero-copy h1 span,
.projects-section-head h2 span,
.projects-lifecycle-head h2 span,
.projects-delivery-copy h2 span,
.projects-resource-copy h2 span,
.projects-risk-head h2 span,
.projects-intelligence-head h2 span,
.projects-collaboration h2 span,
.projects-api h2 span,
.projects-final-cta h2 span{
    color:var(--p-gold2);
}

.projects-hero-copy>p{
    max-width:560px;
    color:#9ca3a6;
    font-size:14px;
    line-height:1.75;
}

.projects-hero-actions{
    display:flex;
    align-items:center;
    gap:28px;
    margin-top:30px;
}

.projects-btn{
    display:inline-flex;
    align-items:center;
    gap:15px;
    min-height:50px;
    padding:0 22px;
    text-decoration:none;
    font-size:10px;
    font-weight:700;
    transition:.2s ease;
}

.projects-btn-gold{
    background:var(--p-gold2);
    color:#111;
}

.projects-btn-gold:hover{
    transform:translateY(-2px);
    box-shadow:0 10px 28px rgba(201,149,61,.15);
}

.projects-text-link{
    color:#aab0b2;
    font-size:10px;
    text-decoration:none;
}

.projects-hero-board{
    border:1px solid #303334;
    background:rgba(17,19,20,.94);
    box-shadow:0 30px 80px rgba(0,0,0,.25);
}

.projects-board-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:20px 22px;
    border-bottom:1px solid var(--p-line);
}

.projects-board-top small,
.projects-board-label{
    display:block;
    color:#70777b;
    font-size:7px;
    letter-spacing:.17em;
    font-weight:700;
}

.projects-board-top strong{
    display:block;
    margin-top:6px;
    color:#eeeae3;
    font-size:14px;
    font-weight:500;
}

.projects-board-top>span{
    color:#7e8689;
    font-size:8px;
}

.projects-board-top i{
    display:inline-block;
    width:6px;height:6px;border-radius:50%;
    margin-right:7px;background:#7d9a72;
}

.projects-board-kpis{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    border-bottom:1px solid var(--p-line);
}

.projects-board-kpis>div{
    padding:20px 16px;
    border-right:1px solid var(--p-line);
}

.projects-board-kpis>div:last-child{border-right:0}

.projects-board-kpis small{
    display:block;
    color:#737b7f;
    font-size:7px;
    letter-spacing:.12em;
}

.projects-board-kpis strong{
    display:block;
    margin-top:11px;
    color:#f5f2ed;
    font-size:27px;
    letter-spacing:-.04em;
}

.projects-board-kpis em{
    display:block;
    margin-top:6px;
    color:#777f83;
    font-size:8px;
    font-style:normal;
}

.projects-board-kpis .warn strong{color:#c58a2c}

.projects-board-table{padding:6px 18px 16px}

.projects-row{
    display:grid;
    grid-template-columns:1.4fr .8fr 1fr .65fr;
    gap:15px;
    align-items:center;
    min-height:51px;
    border-bottom:1px solid #252829;
    color:#92999d;
    font-size:8px;
}

.projects-row strong{
    color:#ddd9d2;
    font-size:9px;
    font-weight:500;
}

.projects-row-head{
    min-height:34px;
    color:#666d71;
    font-size:7px;
    letter-spacing:.12em;
}

.projects-progress{
    height:4px;
    background:#292b2c;
}

.projects-progress i{
    display:block;
    height:100%;
    background:#b98235;
}

.projects-row b{
    font-size:7px;
    letter-spacing:.08em;
}

.projects-row .ok{color:#779471}
.projects-row .watch{color:#c18a3a}
.projects-row .risk{color:#c76c56}

/* CONTROL */
.projects-control{
    padding:95px 0 100px;
    background:#dedad2;
}

.projects-section-head{
    display:grid;
    grid-template-columns:.7fr 1.1fr .9fr;
    gap:50px;
    align-items:start;
    margin-bottom:52px;
}

.projects-section-head h2,
.projects-lifecycle-head h2,
.projects-delivery-copy h2,
.projects-resource-copy h2,
.projects-risk-head h2,
.projects-intelligence-head h2,
.projects-collaboration h2,
.projects-api h2{
    margin:0;
    font-size:clamp(45px,4.8vw,66px);
    line-height:.94;
    letter-spacing:-.055em;
}

.projects-section-head p,
.projects-risk-head p,
.projects-collaboration p,
.projects-api p{
    color:#667077;
    font-size:13px;
    line-height:1.75;
    max-width:420px;
}

.projects-control-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    border-top:1px solid #c9c3b9;
    border-left:1px solid #c9c3b9;
}

.projects-control-grid article{
    min-height:225px;
    padding:24px 22px;
    border-right:1px solid #c9c3b9;
    border-bottom:1px solid #c9c3b9;
    background:#ebe8e2;
    transition:.2s ease;
}

.projects-control-grid article:hover{
    background:#f2efe9;
    transform:translateY(-3px);
}

.projects-num{
    color:#b57c2a;
    font-size:8px;
    letter-spacing:.13em;
}

.projects-control-grid h3{
    margin:45px 0 10px;
    font-size:25px;
    letter-spacing:-.03em;
}

.projects-control-grid p{
    color:#707a80;
    font-size:10px;
    line-height:1.65;
    min-height:50px;
}

.projects-control-grid b{
    color:#9c6c2b;
    font-size:8px;
    font-weight:600;
}

/* LIFECYCLE */
.projects-lifecycle{
    padding:90px 0 96px;
    background:#101112;
    color:#f5f2ed;
}

.projects-lifecycle-head{
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:end;
    gap:60px;
    margin-bottom:55px;
}

.projects-lifecycle-head p{
    max-width:450px;
    justify-self:end;
    color:#8f979b;
    font-size:13px;
    line-height:1.75;
}

.projects-lifecycle-flow{
    display:grid;
    grid-template-columns:1fr 30px 1fr 30px 1fr 30px 1fr 30px 1fr;
    align-items:center;
}

.projects-stage{
    min-height:126px;
    padding:18px;
    border:1px solid #343637;
    background:#151718;
}

.projects-stage.active{
    border-color:#b98235;
    box-shadow:inset 0 2px #b98235;
}

.projects-stage small{
    color:#b98235;
    font-size:7px;
}

.projects-stage strong{
    display:block;
    margin-top:25px;
    font-size:10px;
}

.projects-stage span{
    display:block;
    margin-top:7px;
    color:#777f83;
    font-size:8px;
}

.projects-lifecycle-flow>i{
    color:#b98235;
    text-align:center;
    font-style:normal;
}

/* DELIVERY */
.projects-delivery{
    padding:96px 0;
    background:#f7f5f1;
}

.projects-two-col{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:75px;
    align-items:center;
}

.projects-delivery-copy h2,
.projects-resource-copy h2{
    margin-top:20px;
}

.projects-delivery-copy>p,
.projects-resource-copy>p{
    max-width:500px;
    color:#69737a;
    font-size:13px;
    line-height:1.75;
    margin-top:25px;
}

.projects-mini-list{
    margin-top:30px;
    border-top:1px solid #ddd7ce;
}

.projects-mini-list>div{
    display:grid;
    grid-template-columns:35px 1fr;
    padding:15px 0;
    border-bottom:1px solid #ddd7ce;
}

.projects-mini-list span{
    color:#b57c2a;
    font-size:9px;
    font-weight:700;
}

.projects-mini-list strong{
    color:#3f484e;
    font-size:10px;
}

.projects-mini-list em{
    grid-column:2;
    color:#8a9296;
    font-size:8px;
    font-style:normal;
    margin-top:4px;
}

.projects-delivery-board,
.projects-resource-board{
    min-width:0;
    background:#111314;
    border:1px solid #2b2d2e;
    box-shadow:0 25px 60px rgba(25,22,18,.1);
    padding:25px;
}

.projects-gantt{
    margin-top:26px;
}

.gantt-row{
    display:grid;
    grid-template-columns:86px minmax(0,1fr) 62px;
    gap:12px;
    align-items:center;
    min-height:48px;
    border-bottom:1px solid #2a2c2d;
}

.gantt-row strong{
    color:#c9c5be;
    font-size:9px;
    font-weight:500;
    white-space:nowrap;
}

.gantt-track{
    position:relative;
    display:block;
    height:13px;
    min-width:0;
    background:#202324;
    overflow:hidden;
}

.gantt-track i{
    display:block;
    height:100%;
    background:#b98235;
}

.gantt-track i.point{
    width:13px!important;
    height:13px;
    border-radius:50%;
    background:#c58a2c;
}

.gantt-row b{
    color:#7e8689;
    font-size:7px;
    font-weight:500;
    text-align:right;
    white-space:nowrap;
}

.projects-date-scale{
    display:flex;
    justify-content:space-between;
    margin-top:12px;
    padding-left:98px;
    padding-right:62px;
    color:#626a6e;
    font-size:7px;
    letter-spacing:.12em;
}

/* RESOURCE */
.projects-resource{
    padding:96px 0;
    background:#e9e6df;
}

.projects-resource-board{
    min-height:365px;
}

.resource-total{
    margin:35px 0 25px;
}

.resource-total small{
    display:block;
    color:#747c80;
    font-size:7px;
    letter-spacing:.15em;
}

.resource-total strong{
    display:block;
    margin-top:9px;
    color:#f5f2ed;
    font-size:42px;
    letter-spacing:-.04em;
}

.resource-total span{
    color:#789078;
    font-size:8px;
}

.resource-bars>div{
    display:grid;
    grid-template-columns:75px 1fr 30px;
    align-items:center;
    gap:10px;
    margin-top:16px;
}

.resource-bars span,.resource-bars em{
    color:#838b8e;
    font-size:8px;
    font-style:normal;
}

.resource-bars i{
    height:5px;
    background:#292b2c;
}

.resource-bars i b{
    display:block;
    height:100%;
    background:#b98235;
}

/* RISK */
.projects-risk{
    padding:95px 0 100px;
    background:#f4f1eb;
}

.projects-risk-head{
    display:grid;
    grid-template-columns:.7fr 1fr 1fr;
    gap:50px;
    align-items:start;
    margin-bottom:45px;
}

.projects-risk-board{
    border:1px solid #d8d2c9;
    background:#fff;
}

.risk-head,.risk-row{
    display:grid;
    grid-template-columns:1.6fr .75fr .5fr .5fr;
    gap:20px;
    align-items:center;
    padding:0 22px;
}

.risk-head{
    min-height:39px;
    background:#101112;
    color:#777f83;
    font-size:7px;
    letter-spacing:.12em;
}

.risk-row{
    min-height:62px;
    border-top:1px solid #e1dcd4;
    color:#6e777d;
    font-size:9px;
}

.risk-row strong{
    color:#3e474c;
    font-size:10px;
    font-weight:500;
}

.risk-row b{
    color:#c56d53;
    font-size:7px;
    letter-spacing:.1em;
}

.risk-row a{
    color:#aa742c;
    font-size:8px;
    text-decoration:none;
}

/* INTELLIGENCE */
.projects-intelligence{
    padding:92px 0 96px;
    background:#0d0e0f;
    color:#f5f2ed;
}

.projects-intelligence-head{
    display:grid;
    grid-template-columns:.7fr 1.1fr 1fr;
    gap:50px;
    margin-bottom:48px;
}

.projects-intelligence-head p{
    color:#8f979b;
    font-size:13px;
    line-height:1.75;
}

.projects-intelligence-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    border:1px solid #2c2e2f;
}

.projects-intelligence-grid>div{
    min-height:205px;
    padding:23px 21px;
    border-right:1px solid #2c2e2f;
    background:#141516;
    transition:.2s ease;
}

.projects-intelligence-grid>div:last-child{border-right:0}

.projects-intelligence-grid>div:hover{
    background:#191a1b;
    transform:translateY(-3px);
}

.projects-intelligence-grid small{
    color:#737b7f;
    font-size:7px;
    letter-spacing:.14em;
}

.projects-intelligence-grid strong{
    display:block;
    margin-top:35px;
    color:#f5f2ed;
    font-size:23px;
}

.projects-intelligence-grid p{
    color:#8c9498;
    font-size:9px;
    line-height:1.6;
}

.projects-intelligence-grid b{
    position:relative;
    top:16px;
    color:#c18a3a;
    font-size:8px;
    font-weight:500;
}

.projects-intelligence-bottom{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:20px 22px;
    border:1px solid #2c2e2f;
    border-top:0;
    background:#101112;
}

.projects-intelligence-bottom span{
    color:#70777b;
    font-size:7px;
    letter-spacing:.16em;
}

.projects-intelligence-bottom strong{
    color:#c58a2c;
    font-size:10px;
}

/* COLLABORATION */
.projects-collaboration{
    padding:95px 0;
    background:#f1eee8;
}

.projects-collaboration h2{
    margin-top:20px;
}

.projects-approval-board{
    border:1px solid #d8d2c9;
    background:#fff;
}

.approval-item{
    padding:21px 22px;
    border-bottom:1px solid #e0dbd3;
}

.approval-item:last-child{border-bottom:0}

.approval-item span{
    display:block;
    color:#a8732d;
    font-size:7px;
    letter-spacing:.14em;
}

.approval-item strong{
    display:block;
    margin-top:8px;
    color:#3d464b;
    font-size:11px;
    font-weight:600;
}

.approval-item b{
    display:block;
    margin-top:7px;
    color:#9b6c2d;
    font-size:8px;
    font-weight:500;
}

.approval-item b.approved{color:#718e70}

/* API */
.projects-api{
    padding:85px 0;
    background:#111314;
    color:#f5f2ed;
}

.projects-api-inner{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:70px;
    align-items:center;
}

.projects-api h2{
    margin-top:20px;
}

.projects-api p{
    max-width:530px;
    color:#92999d;
    font-size:13px;
    line-height:1.75;
}

.projects-api-tags{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:8px;
}

.projects-api-tags span{
    padding:12px 15px;
    border:1px solid #343637;
    background:#151718;
    color:#92999d;
    font-size:8px;
    letter-spacing:.12em;
}

/* FINAL CTA */
.projects-final-cta{
    padding:90px 0 100px;
    background:#080909;
    color:#f5f2ed;
}

.projects-final-grid{
    display:grid;
    grid-template-columns:1.15fr .85fr;
    gap:100px;
    align-items:center;
}

.projects-final-cta h2{
    margin:20px 0 22px;
    font-size:clamp(54px,6vw,84px);
    line-height:.9;
    letter-spacing:-.06em;
}

.projects-final-cta p{
    max-width:520px;
    color:#92999d;
    font-size:13px;
    line-height:1.75;
}

.projects-final-side{
    min-height:235px;
    padding-left:40px;
    border-left:1px solid #2c2e2f;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.projects-final-side>div{
    width:auto;
    height:auto;
    background:transparent;
    margin:0 0 24px;
}

.projects-final-cta .final-principle{
    width:100%;
    min-height:235px;
    box-sizing:border-box;
    padding:30px;
    border:1px solid #353738;
    background:#101112;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.projects-final-cta .final-principle span{
    display:block;
    color:#c18a3a;
    font-size:7px;
    line-height:1.4;
    letter-spacing:.16em;
}

.projects-final-cta .final-principle strong{
    display:block;
    margin-top:16px;
    color:#eeeae3;
    font-size:clamp(25px,2.2vw,34px);
    line-height:1.08;
    letter-spacing:-.035em;
}

.projects-final-side>p{
    margin:0;
    color:#aeb3b5;
    font-size:15px;
    line-height:1.6;
}

.projects-final-side p{
    color:#aeb3b5;
    font-size:15px;
}

/* RESPONSIVE */
@media(max-width:1050px){
    .projects-hero-grid,
    .projects-two-col,
    .projects-final-grid{
        grid-template-columns:1fr;
    }

    .projects-section-head,
    .projects-risk-head,
    .projects-intelligence-head{
        grid-template-columns:1fr 1.4fr;
    }

    .projects-section-head p,
    .projects-risk-head p,
    .projects-intelligence-head p{
        grid-column:2;
    }

    .projects-board-kpis,
    .projects-intelligence-grid{
        grid-template-columns:1fr 1fr;
    }

    .projects-intelligence-grid>div:nth-child(2){
        border-right:0;
    }

    .projects-intelligence-grid>div:nth-child(-n+2){
        border-bottom:1px solid #2c2e2f;
    }

    .projects-lifecycle-flow{
        overflow-x:auto;
        display:flex;
        align-items:center;
    }

    .projects-stage{min-width:155px;flex:0 0 155px}
    .projects-lifecycle-flow>i{flex:0 0 30px}

    .projects-final-side{
        min-height:auto;
        padding:30px 0 0;
        border-left:0;
        border-top:1px solid #2c2e2f;
    }
}

@media(max-width:700px){
    .projects-container,
    .projects-hero-grid{
        width:92%;
    }

    .projects-hero{
        padding:75px 0 65px;
        min-height:auto;
    }

    .projects-hero-actions{
        flex-wrap:wrap;
    }

    .projects-section-head,
    .projects-risk-head,
    .projects-intelligence-head{
        display:block;
    }

    .projects-section-head p,
    .projects-risk-head p,
    .projects-intelligence-head p{
        margin-top:22px;
    }

    .projects-control-grid,
    .projects-board-kpis,
    .projects-intelligence-grid{
        grid-template-columns:1fr;
    }

    .projects-control-grid article{
        min-height:auto;
    }

    .projects-board-kpis>div{
        border-right:0;
        border-bottom:1px solid var(--p-line);
    }

    .projects-intelligence-grid>div{
        border-right:0;
        border-bottom:1px solid #2c2e2f;
    }

    .projects-intelligence-grid>div:last-child{border-bottom:0}

    .projects-row{
        grid-template-columns:1fr 1fr;
        padding:10px 0;
        gap:8px;
    }

    .projects-row-head{display:none}

    .projects-row .projects-progress{display:none}

    .risk-head{display:none}

    .risk-row{
        grid-template-columns:1fr 80px;
        padding:15px;
    }

    .risk-row span{display:none}

    .projects-api-inner{
        grid-template-columns:1fr;
    }

    .projects-api-tags{
        justify-content:flex-start;
    }

    .projects-resource,
    .projects-delivery,
    .projects-collaboration{
        padding:70px 0;
    }
}

/* =========================================================
   PROJECTS FINAL — HERO BACKGROUND + DRAG/DROP CONFIGURATION
   ========================================================= */
.projects-hero{position:relative!important;min-height:690px!important;display:flex;align-items:center;padding:80px 0!important;background:#080909!important;overflow:hidden;isolation:isolate}
.projects-hero-bg{position:absolute;inset:0;z-index:0;background:url("../images/vioneshpere-projects-hero.png") center/cover no-repeat}
.projects-hero-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(5,6,7,.96),rgba(5,6,7,.78) 34%,rgba(5,6,7,.35) 67%,rgba(5,6,7,.14))}
.projects-hero-content{position:relative;z-index:2;width:min(1260px,calc(100% - 90px));margin:0 auto;max-width:none;padding-right:500px}
.projects-hero-content h1{margin:22px 0 25px;color:#f5f2ed;font-size:clamp(50px,5.58vw,77px);line-height:.9;letter-spacing:-.06em}
.projects-hero-content h1 span{color:#c9953d}
.projects-hero-content>p{max-width:570px;color:#b2b6b8;font-size:14px;line-height:1.75}
.projects-hero-actions{display:flex;gap:28px;align-items:center;margin-top:31px}

/* Lifecycle builder */
.projects-builder{border:1px solid #343637;background:#111314;box-shadow:0 25px 65px rgba(0,0,0,.18)}
.projects-builder-toolbar{display:flex;justify-content:space-between;align-items:center;padding:19px 21px;border-bottom:1px solid #2a2d2e}
.projects-builder-toolbar span{display:block;color:#70777b;font-size:7px;letter-spacing:.17em;font-weight:700}
.projects-builder-toolbar strong{display:block;margin-top:5px;color:#eeeae3;font-size:13px;font-weight:500}
.projects-builder-actions{display:flex;gap:7px}
.projects-builder-actions button{border:1px solid #3a3c3d;background:#171819;color:#969da0;padding:8px 12px;font-size:8px;cursor:pointer}
.projects-builder-actions button.save{background:#c9953d;border-color:#c9953d;color:#111}
.projects-builder-workspace{display:grid;grid-template-columns:165px 1fr;min-height:315px}
.projects-stage-palette{padding:18px 13px;border-right:1px solid #2a2d2e;background:#0f1011}
.projects-stage-palette>small{display:block;margin-bottom:12px;color:#6f777b;font-size:7px;letter-spacing:.15em}
.palette-stage{width:100%;display:flex;gap:8px;align-items:center;padding:9px 8px;margin-bottom:6px;border:1px solid #2d3031;background:#171819;color:#bfc2c2;font-size:8px;text-align:left;cursor:grab}
.palette-stage i{width:6px;height:6px;border-radius:50%;background:#c18a3a}
.projects-builder-canvas{padding:22px;background:radial-gradient(#2a2c2d 1px,transparent 1px);background-size:16px 16px}
.projects-builder-canvas-head{display:flex;justify-content:space-between;gap:15px;margin-bottom:25px}
.projects-builder-canvas-head span{color:#8d9598;font-size:7px;letter-spacing:.14em}
.projects-builder-canvas-head em{color:#626a6e;font-size:8px;font-style:normal}
.projects-stage-flow{display:flex;align-items:center;gap:10px;min-height:118px;overflow-x:auto;padding-bottom:8px}
.projects-stage-flow>i{color:#c18a3a;font-style:normal;flex:0 0 auto}
.projects-stage-flow .projects-stage{flex:0 0 120px;min-height:95px;padding:13px;border:1px solid #3a3c3d;background:#171819;cursor:grab}
.projects-stage-flow .projects-stage.active{border-color:#7e9c6f;box-shadow:inset 0 2px #7e9c6f}
.projects-stage-flow .projects-stage small{color:#c18a3a;font-size:7px}
.projects-stage-flow .projects-stage strong{display:block;margin-top:18px;color:#eeeae3;font-size:10px}
.projects-stage-flow .projects-stage span{display:block;margin-top:6px;color:#777f83;font-size:7px}
.projects-drop-zone{border:1px dashed #4a4d4e;color:#70777b;text-align:center;padding:12px;font-size:8px}
.projects-drop-zone span{color:#c18a3a;font-size:13px;margin-right:6px}
.projects-drop-zone.drag-over{border-color:#c18a3a;background:rgba(193,138,58,.08);color:#c58a2c}
.projects-builder-result{display:flex;gap:15px;align-items:center;padding:15px 20px;border-top:1px solid #2a2d2e;background:#0d0e0f}
.projects-builder-result span{color:#c18a3a;font-size:7px;letter-spacing:.14em}
.projects-builder-result strong{color:#ddd9d2;font-size:9px;font-weight:500}
.projects-builder-result em{margin-left:auto;color:#737b7f;font-size:8px;font-style:normal}

/* Full workflow builder */
.projects-configurable-flow{padding:92px 0 98px;background:#f4f1eb}
.projects-configurable-head{display:grid;grid-template-columns:.65fr 1.05fr 1fr;gap:50px;align-items:start;margin-bottom:45px}
.projects-configurable-head h2{margin:0;font-size:clamp(45px,4.8vw,66px);line-height:.94;letter-spacing:-.055em}
.projects-configurable-head h2 span{color:#c18a3a}
.projects-configurable-head p{margin:0;color:#687279;font-size:13px;line-height:1.75}
.projects-workflow-builder{background:#111314;border:1px solid #2c2e2f;box-shadow:0 25px 60px rgba(20,18,15,.12)}
.projects-workflow-toolbar{display:flex;justify-content:space-between;align-items:center;padding:19px 21px;border-bottom:1px solid #2a2d2e}
.projects-workflow-toolbar small{display:block;color:#70777b;font-size:7px;letter-spacing:.17em}
.projects-workflow-toolbar strong{display:block;margin-top:5px;color:#eeeae3;font-size:13px;font-weight:500}
.projects-workflow-body{display:grid;grid-template-columns:1fr 150px;min-height:290px}
.projects-workflow-canvas{display:flex;align-items:center;gap:10px;padding:30px 22px;overflow:auto;background:radial-gradient(#292c2d 1px,transparent 1px);background-size:15px 15px}
.workflow-node{flex:0 0 auto;min-width:82px;padding:15px 10px;text-align:center;border:1px solid #454748;background:#181a1b;color:#e8e4dc;font-size:9px}
.workflow-node.start,.workflow-node.end{border-radius:50%;min-width:64px;height:64px;display:flex;align-items:center;justify-content:center}
.workflow-node.task{border-color:#668b55}.workflow-node.decision{border-color:#b68131}.workflow-node.review{border-color:#557da1}
.workflow-arrow{flex:0 0 auto;color:#c18a3a}
.projects-workflow-library{padding:18px 12px;border-left:1px solid #2a2d2e;background:#0f1011}
.projects-workflow-library>small{display:block;margin-bottom:12px;color:#6f777b;font-size:7px;letter-spacing:.15em}
.workflow-palette{width:100%;padding:10px 8px;margin-bottom:6px;border:1px solid #2d3031;background:#171819;color:#bfc2c2;font-size:8px;text-align:left;cursor:grab}
.projects-workflow-status{padding:15px 20px;border-top:1px solid #2a2d2e;background:#0d0e0f}
.projects-workflow-status span{color:#c18a3a;font-size:7px;letter-spacing:.15em}
.projects-workflow-status strong{margin-left:12px;color:#ddd9d2;font-size:9px;font-weight:500}
.projects-workflow-status em{margin-left:12px;color:#70777b;font-size:8px;font-style:normal}

@media(max-width:950px){
 .projects-hero-content{width:92%}
 .projects-builder-workspace{grid-template-columns:1fr}
 .projects-stage-palette{border-right:0;border-bottom:1px solid #2a2d2e;display:flex;flex-wrap:wrap;gap:6px}
 .projects-stage-palette>small{width:100%}
 .palette-stage{width:auto;margin:0}
 .projects-configurable-head{grid-template-columns:1fr 1.4fr}
 .projects-configurable-head p{grid-column:2}
 .projects-workflow-body{grid-template-columns:1fr}
 .projects-workflow-library{border-left:0;border-top:1px solid #2a2d2e;display:flex;flex-wrap:wrap;gap:6px}
 .projects-workflow-library>small{width:100%}
 .workflow-palette{width:auto;margin:0}
}
@media(max-width:650px){
 .projects-hero{min-height:620px!important}
 .projects-hero-content{width:92%}
 .projects-hero-actions{flex-wrap:wrap}
 .projects-builder-toolbar,.projects-workflow-toolbar{display:block}
 .projects-builder-actions{margin-top:12px}
 .projects-builder-result{display:block}
 .projects-builder-result strong,.projects-builder-result em{display:block;margin:7px 0 0}
 .projects-configurable-head{display:block}
 .projects-configurable-head p{margin-top:22px}
}

/* =========================================================
   PROJECTS — BUSINESS-ADAPTATION POSITIONING
   ========================================================= */
.projects-philosophy{padding:100px 0;background:#f4f1eb}
.philosophy-intro{display:grid;grid-template-columns:.55fr 1.2fr .8fr;gap:45px;align-items:start;margin-bottom:55px}
.philosophy-intro h2{margin:0;font-size:clamp(43px,4.7vw,64px);line-height:.96;letter-spacing:-.055em}.philosophy-intro h2 span{color:#c18a3a}.philosophy-intro p{margin:0;color:#687279;font-size:13px;line-height:1.8}
.adaptation-compare{display:grid;grid-template-columns:1fr 70px 1fr;align-items:stretch}.adaptation-compare article{padding:30px;background:#faf9f6;border:1px solid #d8d2c9}.adaptation-compare .v-way{background:#111314;border-color:#2c2e2f;color:#f4f1eb}.adaptation-compare small{display:block;color:#a06f29;font-size:7px;letter-spacing:.17em;font-weight:700}.adaptation-compare strong{display:block;margin-top:20px;font-size:20px;letter-spacing:-.03em}.adaptation-compare p{margin:12px 0 0;color:#7b8387;font-size:11px;line-height:1.7}.adaptation-compare .v-way p{color:#9aa1a4}.compare-arrow{display:flex;align-items:center;justify-content:center;color:#c18a3a;font-size:22px}
.projects-multiple-flows{padding:100px 0;background:#101112;color:#f4f1eb}.projects-multiple-flows .projects-section-head{margin-bottom:50px}.projects-multiple-flows .projects-section-head p{color:#90979a}.flow-example-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#2b2d2e}.flow-example-grid article{padding:30px;background:#151718;min-height:245px}.flow-example-grid article>span{color:#c18a3a;font-size:9px}.flow-example-grid small{display:block;margin-top:35px;color:#6f777b;font-size:7px;letter-spacing:.16em}.flow-example-grid h3{margin:12px 0;color:#eeeae3;font-size:18px;line-height:1.2;letter-spacing:-.02em}.flow-example-grid p{color:#8e9699;font-size:10px;line-height:1.7}.license-value{margin-top:35px;display:grid;grid-template-columns:1fr 1.2fr;gap:50px;padding:28px 30px;border:1px solid #3a3c3d;background:#0d0e0f;align-items:center}.license-value h3{margin:10px 0 0;font-size:26px;letter-spacing:-.035em}.license-value p{margin:0;color:#8e9699;font-size:11px;line-height:1.75}
.projects-lifecycle .projects-lifecycle-head h2{max-width:720px}.hero-philosophy{margin-top:12px!important;color:#c5c8c9!important;max-width:600px!important}
.projects-decision-section{padding:100px 0;background:#e9e6df}.projects-decision-section h2{margin:18px 0 0;font-size:clamp(43px,4.7vw,62px);line-height:.96;letter-spacing:-.055em}.projects-decision-section p{max-width:520px;color:#687279;font-size:13px;line-height:1.8;margin-top:24px}.decision-points{margin-top:30px;border-top:1px solid #d0cac0}.decision-points div{display:grid;grid-template-columns:130px 1fr;gap:15px;padding:15px 0;border-bottom:1px solid #d0cac0}.decision-points b{color:#3e464b;font-size:10px}.decision-points span{color:#737d82;font-size:9px}.decision-board{background:#111314;border:1px solid #2c2e2f;padding:30px;min-height:300px}.decision-board-label{color:#70777b;font-size:7px;letter-spacing:.17em;font-weight:700}.decision-node-row{display:flex;align-items:center;gap:15px;margin-top:70px}.flow-node{padding:16px 20px;border:1px solid #63875a;background:#171819;color:#eeeae3;font-size:10px}.flow-node.diamond{border-color:#b68131;transform:rotate(45deg)}.flow-node.diamond::first-line{transform:rotate(-45deg)}.decision-node-row b{color:#c18a3a}.branch-line{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:60px}.branch-line span{padding:12px;border-top:1px solid #3a3c3d;color:#9ba2a5;font-size:8px}
.projects-final-cta h2{
    max-width:850px;
}
@media(max-width:950px){.philosophy-intro{grid-template-columns:1fr 1.5fr}.philosophy-intro p{grid-column:2}.flow-example-grid{grid-template-columns:1fr}.license-value{grid-template-columns:1fr}.adaptation-compare{grid-template-columns:1fr}.compare-arrow{padding:15px}.projects-decision-section .projects-two-col{grid-template-columns:1fr}}
@media(max-width:650px){.projects-philosophy,.projects-multiple-flows,.projects-decision-section{padding:70px 0}.philosophy-intro{display:block}.philosophy-intro p{margin-top:22px}.adaptation-compare article{padding:24px}.decision-node-row{margin-top:45px;gap:8px}.flow-node{padding:12px 10px}.branch-line{grid-template-columns:1fr;margin-top:40px}.license-value{padding:24px}.hero-philosophy{margin-top:10px!important}}

@media (max-width: 900px){
    .projects-container,.projects-hero-grid{width:min(100% - 40px,720px);}
    .projects-two-col{grid-template-columns:1fr;gap:45px;}
    .projects-section-head,.projects-risk-head,.projects-intelligence-head{grid-template-columns:1fr;gap:20px;}
    .projects-control-grid,.projects-intelligence-grid{grid-template-columns:repeat(2,1fr);}
    .projects-lifecycle-head{grid-template-columns:1fr;gap:20px;}
}

@media (max-width: 600px){
    .projects-control-grid,.projects-intelligence-grid{grid-template-columns:1fr;}
    .projects-two-col{gap:35px;}
    .projects-delivery-board{padding:18px;}
    .gantt-row{grid-template-columns:74px minmax(0,1fr) 50px;gap:8px;}
    .projects-date-scale{padding-left:82px;padding-right:50px;}
}

/* Final hero treatment: background image only, no overlapping right-side text/visual */
.projects-hero{position:relative;min-height:680px;display:flex;align-items:center;overflow:hidden;background:#070809}
.projects-hero-bg{position:absolute;inset:0;background:url("../images/vioneshpere-projects-hero.png") center/cover no-repeat;z-index:0}
.projects-hero-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(5,6,7,.97) 0%,rgba(5,6,7,.88) 34%,rgba(5,6,7,.48) 62%,rgba(5,6,7,.16) 100%)}
.projects-hero-inner{position:relative;z-index:2;width:min(1260px,calc(100% - 90px));margin:0 auto}
.projects-hero-content{width:min(700px,58%);margin:0;padding:0!important}
.projects-hero-content h1{max-width:700px}
@media(max-width:950px){.projects-hero{min-height:640px}.projects-hero-content{width:90%;max-width:700px}}
@media(max-width:650px){.projects-hero{min-height:650px}.projects-hero-inner{width:calc(100% - 40px)}.projects-hero-content{width:100%}}

/* =========================================================
   VIONESHPERE — ENTERPRISE FEATURE EXPLORER
   Reference: Vioneshpere Sales presentation
   Intent: restrained enterprise UI, precise hierarchy,
   hairline borders, disciplined spacing, minimal decoration.
   ========================================================= */
.vx-feature-explorer{
  position:relative;
  overflow:hidden;
  padding:108px 0 116px;
  background:#f3f0ea;
  color:#141414;
}
.vx-feature-container{
  width:min(1240px,calc(100% - 72px));
  margin:0 auto;
}
.vx-feature-head{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(300px,.72fr);
  gap:72px;
  align-items:end;
  margin:0 0 34px;
}
.vx-feature-eyebrow{
  margin:0 0 17px;
  color:#ae7737;
  font:700 10px/1 Inter,sans-serif;
  letter-spacing:.19em;
  text-transform:uppercase;
}
.vx-feature-head h2{
  margin:0;
  max-width:790px;
  color:#111;
  font:700 clamp(42px,5vw,70px)/.98 Manrope,Inter,sans-serif;
  letter-spacing:-.055em;
}
.vx-feature-head>p{
  margin:0 0 3px;
  max-width:500px;
  color:#67635d;
  font:400 14px/1.78 Inter,sans-serif;
}

/* Category rail */
.vx-feature-tabs{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:4px;
  margin:0 0 18px;
  padding:7px;
  background:#e7e3db;
  border:1px solid #d2ccc1;
  border-radius:13px;
  box-shadow:0 1px 0 rgba(255,255,255,.72) inset;
}
.vx-feature-category{
  position:relative;
  appearance:none;
  border:1px solid transparent;
  border-radius:7px;
  background:transparent;
  color:#625e57;
  padding:13px 16px;
  cursor:pointer;
  font:700 10px/1 Inter,sans-serif;
  letter-spacing:.085em;
  text-transform:uppercase;
  transition:background .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.vx-feature-category:hover{
  background:rgba(255,255,255,.55);
  color:#161616;
}
.vx-feature-category:focus-visible{
  outline:2px solid #b88444;
  outline-offset:2px;
}
.vx-feature-category.is-active{
  background:#101213;
  border-color:#101213;
  color:#f6f2ea;
  box-shadow:0 5px 14px rgba(0,0,0,.14),0 1px 0 rgba(255,255,255,.04) inset;
}

/* Main explorer frame */
.vx-feature-panel{
  display:grid;
  grid-template-columns:350px minmax(0,1fr);
  min-height:500px;
  background:#fff;
  border:1px solid #d1cbc1;
  border-radius:13px;
  overflow:hidden;
  box-shadow:0 20px 55px rgba(24,21,17,.055),0 1px 0 rgba(255,255,255,.85) inset;
}

/* Feature navigation */
.vx-feature-list{
  min-width:0;
  background:#f6f3ed;
  border-right:1px solid #ddd7ce;
  padding:8px;
  overflow:auto;
  scrollbar-width:thin;
  scrollbar-color:#c9c1b5 transparent;
}
.vx-feature-list::-webkit-scrollbar{width:6px}
.vx-feature-list::-webkit-scrollbar-track{background:transparent}
.vx-feature-list::-webkit-scrollbar-thumb{background:#c9c1b5;border-radius:8px}
.vx-feature-item{
  width:100%;
  min-height:61px;
  display:grid;
  grid-template-columns:31px minmax(0,1fr) 24px;
  gap:9px;
  align-items:center;
  box-sizing:border-box;
  margin:0;
  padding:15px 12px;
  border:1px solid transparent;
  border-bottom-color:#e1dcd4;
  border-radius:7px;
  background:transparent;
  color:#5f5a54;
  text-align:left;
  cursor:pointer;
  transition:background .16s ease,color .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.vx-feature-item:last-child{border-bottom-color:transparent}
.vx-feature-item span{
  color:#b47b3c;
  font:700 9px/1 Inter,sans-serif;
  letter-spacing:.10em;
}
.vx-feature-item strong{
  min-width:0;
  color:#36332f;
  font:700 14px/1.32 Manrope,Inter,sans-serif;
}
.vx-feature-item i{
  justify-self:end;
  color:#b88444;
  font:400 16px/1 Inter,sans-serif;
  font-style:normal;
  opacity:0;
  transform:translateX(-5px);
  transition:opacity .16s ease,transform .16s ease;
}
.vx-feature-item:hover{
  background:#ebe7df;
  border-color:#e0d9cf;
}
.vx-feature-item:hover i{opacity:.72;transform:none}
.vx-feature-item:focus-visible{
  outline:2px solid #b88444;
  outline-offset:-2px;
}
.vx-feature-item.is-active{
  background:#101213;
  border-color:#101213;
  border-bottom-color:#101213;
  color:#fff;
  box-shadow:0 7px 18px rgba(0,0,0,.12);
}
.vx-feature-item.is-active strong{color:#fff}
.vx-feature-item.is-active span{color:#d0a066}
.vx-feature-item.is-active i{opacity:1;transform:none;color:#d0a066}

/* Detail stage */
.vx-feature-detail-host{
  min-width:0;
  background:#fff;
}
.vx-feature-detail{
  position:relative;
  display:none;
  width:100%;
  min-height:500px;
  box-sizing:border-box;
  padding:64px 68px 58px;
  overflow:hidden;
  background:linear-gradient(135deg,#fff 0%,#fdfcfb 58%,#f4f0e8 100%);
  animation:vxEnterpriseFeatureIn .22s ease both;
}
.vx-feature-detail:before{
  content:"";
  position:absolute;
  width:320px;
  height:320px;
  right:-145px;
  top:-145px;
  border:1px solid rgba(184,132,68,.14);
  border-radius:50%;
  box-shadow:0 0 0 34px rgba(184,132,68,.022),0 0 0 68px rgba(184,132,68,.014);
  pointer-events:none;
}
.vx-feature-detail:after{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  right:-85px;
  bottom:-100px;
  border:1px solid rgba(184,132,68,.10);
  border-radius:50%;
  pointer-events:none;
}
.vx-feature-detail>*{position:relative;z-index:1}
.vx-feature-detail-eyebrow{
  margin:0 0 19px;
  color:#ae7737;
  font:700 9px/1 Inter,sans-serif;
  letter-spacing:.17em;
  text-transform:uppercase;
}
.vx-feature-detail h3{
  max-width:760px;
  margin:0;
  color:#121212;
  font:700 clamp(34px,4.15vw,55px)/1.02 Manrope,Inter,sans-serif;
  letter-spacing:-.045em;
}
.vx-feature-summary{
  max-width:710px;
  margin:23px 0 29px;
  color:#5c5954;
  font:400 16px/1.78 Inter,sans-serif;
}
.vx-feature-detail-rule{
  width:48px;
  height:2px;
  margin:0 0 25px;
  background:#b88444;
}
.vx-feature-points-label{
  margin:0 0 13px;
  color:#8a857d;
  font:700 9px/1 Inter,sans-serif;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.vx-feature-detail ul{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 38px;
  max-width:760px;
  margin:0;
  padding:0;
  list-style:none;
}
.vx-feature-detail li{
  position:relative;
  margin:0;
  padding:11px 0 11px 17px;
  border-bottom:1px solid #e4dfd7;
  color:#3f3c38;
  font:500 13px/1.55 Inter,sans-serif;
}
.vx-feature-detail li:before{
  content:"";
  position:absolute;
  left:0;
  top:18px;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#b88444;
}
@keyframes vxEnterpriseFeatureIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

/* Tablet */
@media(max-width:900px){
  .vx-feature-head{grid-template-columns:1fr;gap:18px}
  .vx-feature-panel{grid-template-columns:300px minmax(0,1fr)}
  .vx-feature-detail{padding:48px 40px}
  .vx-feature-detail ul{grid-template-columns:1fr;gap:0}
}

/* Mobile */
@media(max-width:700px){
  .vx-feature-explorer{padding:78px 0 84px}
  .vx-feature-container{width:calc(100% - 36px)}
  .vx-feature-head h2{font-size:40px}
  .vx-feature-tabs{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
  .vx-feature-tabs::-webkit-scrollbar{display:none}
  .vx-feature-category{white-space:nowrap}
  .vx-feature-panel{grid-template-columns:1fr;min-height:0}
  .vx-feature-list{border-right:0;border-bottom:1px solid #ddd7ce;max-height:330px}
  .vx-feature-detail{min-height:0;padding:38px 25px 44px}
  .vx-feature-detail h3{font-size:36px}
  .vx-feature-summary{font-size:15px}
}