/* ============================================================
   WÖRTH SELECTION · EMPRESA EXPERIENCE V1
   ============================================================ */

body.ws-company-experience{
    --ce-green:#0F493B;
    --ce-dark:#082F27;
    --ce-mint:#E9F5EF;
    --ce-cream:#F7F5EF;
    --ce-line:#DCE7E1;
    --ce-text:#274C42;
    --ce-muted:#71817B;
}


/* ============================================================
   OVERVIEW
   ============================================================ */

.ws-company-overview{
    margin:0 0 20px;
}


.ws-company-welcome-card{
    position:relative;

    overflow:hidden;

    padding:27px 29px;

    border:1px solid #DCE7E1;

    border-radius:16px;

    background:
        linear-gradient(
            125deg,
            #FFFFFF 0%,
            #F8FBF9 58%,
            #EDF7F2 100%
        );
}


.ws-company-welcome-card::after{
    content:"";

    position:absolute;

    width:180px;
    height:180px;

    right:-70px;
    top:-85px;

    border-radius:50%;

    background:
        rgba(167,243,208,.20);
}


.ws-company-eyebrow{
    margin-bottom:7px;

    color:#16816A;

    font-size:9.5px;

    font-weight:600;

    letter-spacing:.15em;

    text-transform:uppercase;
}


.ws-company-welcome-card h1{
    position:relative;

    z-index:1;

    margin:0;

    color:#0F3B2E;

    font-family:
        "Barlow Semi Condensed","Arial Narrow",Arial,sans-serif !important;

    font-size:
        clamp(29px,3vw,40px);

    font-weight:600 !important;

    line-height:1.05;
}


.ws-company-welcome-card p{
    position:relative;

    z-index:1;

    max-width:700px;

    margin:10px 0 0;

    color:#71817B;

    font-size:12.5px;

    line-height:1.6;
}


/* ============================================================
   KPIS
   ============================================================ */

.ws-company-kpis{
    display:grid;

    grid-template-columns:
        repeat(4,minmax(0,1fr));

    gap:11px;

    margin-top:13px;
}


.ws-company-kpi{
    position:relative;

    min-height:116px;

    padding:18px;

    border:1px solid #DFE9E4;

    border-radius:13px;

    background:#fff;

    transition:
        transform .18s ease,
        box-shadow .18s ease;
}


.ws-company-kpi:hover{
    transform:
        translateY(-2px);

    box-shadow:
        0 10px 24px
        rgba(8,47,39,.06);
}


.ws-company-kpi-icon{
    display:flex;

    align-items:center;

    justify-content:center;

    width:30px;
    height:30px;

    margin-bottom:12px;

    border-radius:9px;

    background:#EEF6F2;

    color:#0F493B;

    font-size:13px;
}


.ws-company-kpi strong{
    display:block;

    color:#0F493B;

    font-family:
        "Barlow Semi Condensed","Arial Narrow",Arial,sans-serif;

    font-size:29px;

    font-weight:600;

    line-height:1;
}


.ws-company-kpi span{
    display:block;

    margin-top:6px;

    color:#74847E;

    font-size:10.5px;
}


/* ============================================================
   QUICK ACTIONS
   ============================================================ */

.ws-company-actions{
    display:flex;

    flex-wrap:wrap;

    gap:8px;

    margin-top:13px;
}


.ws-company-action{
    min-height:39px;

    padding:0 15px;

    border:1px solid #D3E0DA;

    border-radius:999px;

    background:#fff;

    color:#174A3D;

    font-size:10.8px;

    font-weight:500;

    cursor:pointer;

    transition:
        background .16s ease,
        transform .16s ease;
}


.ws-company-action:hover{
    background:#F0F7F3;

    transform:
        translateY(-1px);
}


.ws-company-action.is-primary{
    border-color:#0F493B;

    background:#0F493B;

    color:#fff;
}


/* ============================================================
   EMPRESA NAV
   ============================================================ */

.ws-company-nav{
    margin:10px 12px 16px;

    padding:12px 8px;

    border-top:
        1px solid #E4ECE8;

    border-bottom:
        1px solid #E4ECE8;
}


.ws-company-nav-label{
    padding:
        2px 9px 8px;

    color:#8B9994;

    font-size:8.5px;

    font-weight:600;

    letter-spacing:.14em;

    text-transform:uppercase;
}


.ws-company-nav button{
    display:flex;

    align-items:center;

    gap:9px;

    width:100%;

    min-height:37px;

    margin:2px 0;

    padding:0 10px;

    border:0;

    border-radius:8px;

    background:transparent;

    color:#385B52;

    font-size:10.8px;

    text-align:left;

    cursor:pointer;

    transition:
        background .16s ease,
        color .16s ease;
}


.ws-company-nav button:hover,
.ws-company-nav button.is-active{
    background:#EDF5F1;

    color:#0F493B;
}


.ws-company-nav-icon{
    width:18px;

    color:#0F6752;

    text-align:center;
}


/* ============================================================
   REQUESTS SUMMARY
   ============================================================ */

.ws-company-requests-strip{
    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:14px;

    margin-top:13px;

    padding:13px 16px;

    border:1px solid #E0E8E4;

    border-radius:11px;

    background:#fff;
}


.ws-company-requests-strip strong{
    color:#214C40;

    font-size:11px;

    font-weight:500;
}


.ws-company-requests-strip span{
    color:#7B8B85;

    font-size:10px;
}


/* ============================================================
   MODAL
   ============================================================ */

.ws-talent-request-modal{
    position:fixed;

    inset:0;

    z-index:10000010;

    display:flex;

    align-items:center;

    justify-content:center;

    padding:20px;

    background:
        rgba(4,34,27,.42);

    backdrop-filter:
        blur(5px);
}


.ws-talent-request-dialog{
    width:
        min(620px,100%);

    max-height:
        calc(100vh - 40px);

    overflow-y:auto;

    padding:27px;

    border-radius:16px;

    background:#fff;

    box-shadow:
        0 26px 70px
        rgba(0,0,0,.18);
}


.ws-talent-request-head{
    display:flex;

    align-items:flex-start;

    justify-content:space-between;

    gap:20px;

    margin-bottom:22px;
}


.ws-talent-request-head h2{
    margin:0;

    color:#0F3B2E;

    font-family:
        "Barlow Semi Condensed","Arial Narrow",Arial,sans-serif !important;

    font-size:30px;

    font-weight:600 !important;
}


.ws-talent-request-head p{
    margin:6px 0 0;

    color:#778781;

    font-size:11px;

    line-height:1.5;
}


.ws-talent-request-close{
    width:35px;
    height:35px;

    flex:0 0 35px;

    border:1px solid #DCE5E1;

    border-radius:50%;

    background:#fff;

    color:#48655D;

    font-size:20px;

    cursor:pointer;
}


.ws-talent-request-grid{
    display:grid;

    grid-template-columns:
        1fr 120px;

    gap:12px;
}


.ws-talent-request-field{
    margin-bottom:13px;
}


.ws-talent-request-field label{
    display:block;

    margin-bottom:6px;

    color:#345A50;

    font-size:10px;

    font-weight:500;
}


.ws-talent-request-field input,
.ws-talent-request-field textarea{
    width:100%;

    box-sizing:border-box;

    border:1px solid #D4E0DA;

    border-radius:9px;

    background:#fff;

    color:#244C41;

    font-family:
        Barlow,"Helvetica Neue",Arial,sans-serif;

    font-size:12px;

    outline:none;
}


.ws-talent-request-field input{
    height:43px;

    padding:0 12px;
}


.ws-talent-request-field textarea{
    min-height:90px;

    padding:11px 12px;

    resize:vertical;
}


.ws-talent-request-context{
    display:flex;

    flex-wrap:wrap;

    gap:6px;

    margin:
        4px 0
        17px;
}


.ws-talent-request-context span{
    padding:6px 9px;

    border-radius:999px;

    background:#EDF6F1;

    color:#315E52;

    font-size:9.5px;
}


.ws-talent-request-submit{
    width:100%;

    min-height:45px;

    border:0;

    border-radius:999px;

    background:#0F493B;

    color:#fff;

    font-size:11.5px;

    font-weight:500;

    cursor:pointer;
}


.ws-talent-request-message{
    margin-top:11px;

    color:#3B675B;

    font-size:10.5px;

    text-align:center;
}


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media(max-width:1100px){

    .ws-company-kpis{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

}


@media(max-width:640px){

    .ws-company-welcome-card{
        padding:21px 18px;
    }


    .ws-company-kpis{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .ws-company-kpi{
        min-height:105px;

        padding:14px;
    }


    .ws-company-kpi strong{
        font-size:25px;
    }


    .ws-company-actions{
        display:grid;

        grid-template-columns:
            1fr 1fr;
    }


    .ws-company-action{
        width:100%;
    }


    .ws-talent-request-dialog{
        padding:20px 16px;
    }


    .ws-talent-request-grid{
        grid-template-columns:1fr;
    }

}


@media(max-width:420px){

    .ws-company-kpis{
        grid-template-columns:1fr 1fr;
    }


    .ws-company-actions{
        grid-template-columns:1fr;
    }

}