/* =========================================================
   AF_Team v1.0.0
   Developed by Ilyas Benayad
   Isolated aft-* namespace
   ========================================================= */

.aft-section{
    --aft-orange:#ed501b;
    --aft-orange-light:#fff7f3;
    --aft-navy:#081a30;
    --aft-text:#687078;
    --aft-line:#edb6a4;

    width:100%;
    padding:55px 6% 50px;
    background:#fff;
    font-family:"Inter",Arial,Helvetica,sans-serif;
    overflow:hidden;
}

.aft-section *,
.aft-section *::before,
.aft-section *::after{
    box-sizing:border-box;
}

.aft-container{
    width:100%;
    max-width:1450px;
    margin:0 auto;
    position:relative;
    min-width:0;
}

.aft-header{
    width:48%;
    max-width:100%;
    margin-bottom:20px;
}

.aft-header > span{
    display:block;
    margin-bottom:8px;
    color:var(--aft-orange);
    font-size:10px;
    line-height:1;
    font-weight:800;
    letter-spacing:.3px;
}

.aft-title{
    margin:0 0 8px;
    color:var(--aft-navy);
    font-size:27px;
    line-height:1.08;
    font-weight:700;
    letter-spacing:-.7px;
    overflow-wrap:anywhere;
}

.aft-title strong{
    color:var(--aft-orange);
    font-weight:700;
}

.aft-header p{
    max-width:530px;
    margin:0;
    color:#34404c;
    font-size:14px;
    line-height:1.55;
    font-weight:400;
    overflow-wrap:anywhere;
}

/* DIRECTOR */
.aft-director{
    width:390px;
    max-width:100%;
    min-height:118px;
    margin:-65px auto 40px;
    padding:17px 20px;

    display:flex;
    align-items:center;
    gap:16px;

    position:relative;
    z-index:5;

    background:#fff;
    border:1px solid #eee;
    border-radius:10px;
    box-shadow:0 6px 20px rgba(0,0,0,.055);

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

@media (hover:hover) and (pointer:fine){
    .aft-director:hover{
        transform:translateY(-3px);
        box-shadow:0 10px 28px rgba(237,80,27,.10);
    }
}

.aft-avatar{
    width:58px;
    height:58px;
    flex:0 0 58px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:var(--aft-orange-light);
    border:1px solid #f8ded4;
    color:var(--aft-orange);
}

.aft-avatar i{
    color:currentColor!important;
    font-size:31px;
}

.aft-avatar svg{
    width:31px;
    height:31px;
    color:currentColor!important;
    fill:currentColor!important;
    stroke:currentColor!important;
}

.aft-avatar svg *{
    fill:currentColor!important;
    stroke:currentColor!important;
}

.aft-director-content{
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
}

.aft-director-content > span{
    display:block;
    color:var(--aft-orange);
    font-size:10px;
    line-height:1.1;
    font-weight:800;
}

.aft-director-content h3{
    margin:4px 0;
    color:var(--aft-navy);
    font-size:14px;
    line-height:1.1;
    font-weight:700;
}

.aft-director-content a{
    display:block;
    max-width:100%;
    margin-top:3px;
    color:var(--aft-text);
    font-size:14px;
    line-height:1.25;
    text-decoration:none;
    overflow-wrap:anywhere;
    word-break:normal;
    transition:color .25s ease;
}

.aft-director-content a:hover{
    color:var(--aft-orange);
}

/* GRID */
.aft-grid{
    width:100%;
    min-width:0;
    position:relative;
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:12px;
    padding-top:22px;
    align-items:stretch;
}

.aft-grid::before{
    content:"";
    position:absolute;
    top:0;
    left:3%;
    right:3%;
    height:1px;
    background:var(--aft-line);
    z-index:0;
}

.aft-member{
    min-width:0;
    min-height:182px;
    height:auto;
    padding:18px 10px 17px;

    position:relative;
    z-index:2;

    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;

    background:#fff;
    border:1px solid #eee;
    border-radius:9px;
    box-shadow:0 4px 15px rgba(0,0,0,.035);

    overflow:visible;

    transition:
        background-color .3s ease,
        border-color .3s ease,
        box-shadow .3s ease,
        transform .3s ease;
}

.aft-member::before{
    content:"";
    position:absolute;
    top:-22px;
    left:50%;
    width:1px;
    height:22px;
    transform:translateX(-50%);
    background:var(--aft-line);
    z-index:1;
}

.aft-member::after{
    content:"";
    position:absolute;
    top:-26px;
    left:50%;
    width:8px;
    height:8px;
    transform:translateX(-50%);
    border-radius:50%;
    background:var(--aft-orange);
    z-index:3;
    transition:transform .3s ease,box-shadow .3s ease;
}

@media (hover:hover) and (pointer:fine){
    .aft-member:hover{
        background:var(--aft-orange-light);
        border-color:#f1c4b4;
        transform:translateY(-5px);
        box-shadow:0 10px 25px rgba(237,80,27,.10);
    }

    .aft-member:hover::after{
        transform:translateX(-50%) scale(1.25);
        box-shadow:0 0 0 4px rgba(237,80,27,.08);
    }
}

.aft-department{
    width:100%;
    min-height:31px;
    display:flex;
    align-items:flex-start;
    justify-content:center;
    color:var(--aft-orange);
    font-size:10px;
    line-height:1.15;
    font-weight:800;
    letter-spacing:.2px;
    overflow-wrap:anywhere;
}

.aft-member h3{
    width:100%;
    margin:8px 0 10px;
    color:var(--aft-navy);
    font-size:12px;
    line-height:1.2;
    font-weight:700;
    white-space:normal;
    overflow-wrap:anywhere;
}

.aft-contact{
    width:100%;
    min-width:0;
    display:flex;
    align-items:flex-start;
    justify-content:center;
    gap:5px;
    color:var(--aft-text);
    font-size:11px;
    line-height:1.3;
    text-decoration:none;
    transition:color .25s ease;
}

.aft-phone{
    margin-bottom:6px;
}

.aft-contact span:last-child{
    min-width:0;
    max-width:100%;
    overflow-wrap:anywhere;
    word-break:normal;
}

.aft-contact-icon{
    flex:0 0 auto;
    color:var(--aft-orange);
}

.aft-contact:hover{
    color:var(--aft-orange);
}

/* PARTNER */
.aft-partner{
    width:395px;
    max-width:100%;
    min-height:112px;
    margin:20px auto 0;
    padding:15px 20px;

    position:relative;
    display:flex;
    align-items:center;
    gap:15px;

    background:#fff;
    border:1px solid #eee;
    border-radius:9px;
    box-shadow:0 4px 15px rgba(0,0,0,.035);

    transition:transform .3s ease,box-shadow .3s ease,background-color .3s ease;
}

.aft-partner::before{
    content:"";
    position:absolute;
    left:50%;
    top:-20px;
    width:1px;
    height:20px;
    transform:translateX(-50%);
    background:var(--aft-line);
}

.aft-partner::after{
    content:"";
    position:absolute;
    left:50%;
    top:-24px;
    width:8px;
    height:8px;
    transform:translateX(-50%);
    border-radius:50%;
    background:var(--aft-orange);
}

@media (hover:hover) and (pointer:fine){
    .aft-partner:hover{
        background:var(--aft-orange-light);
        border-color:#f1c4b4;
        transform:translateY(-4px);
        box-shadow:0 10px 25px rgba(237,80,27,.10);
    }
}

.aft-partner-icon{
    width:54px;
    height:54px;
    flex:0 0 54px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:var(--aft-orange-light);
    border:1px solid #f8ded4;
    color:var(--aft-orange);
}

.aft-partner-icon i{
    color:currentColor!important;
    font-size:30px;
}

.aft-partner-icon svg{
    width:30px;
    height:30px;
    color:currentColor!important;
    fill:currentColor!important;
    stroke:currentColor!important;
}

.aft-partner-icon svg *{
    fill:currentColor!important;
    stroke:currentColor!important;
}

.aft-partner-content{
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
}

.aft-partner-content > span{
    display:block;
    color:var(--aft-orange);
    font-size:10px;
    line-height:1.15;
    font-weight:800;
    overflow-wrap:anywhere;
}

.aft-partner-content > strong{
    display:block;
    margin-top:4px;
    color:var(--aft-navy);
    font-size:13px;
    line-height:1.1;
    font-weight:700;
}

.aft-partner-content a{
    display:flex;
    align-items:flex-start;
    gap:5px;
    max-width:100%;
    margin-top:4px;
    color:var(--aft-text);
    font-size:14px;
    line-height:1.25;
    text-decoration:none;
    overflow-wrap:anywhere;
    word-break:normal;
    transition:color .25s ease;
}

.aft-partner-content a span:last-child{
    min-width:0;
    overflow-wrap:anywhere;
}

.aft-partner-content a:hover{
    color:var(--aft-orange);
}

/* TABLET */
@media (max-width:1100px){
    .aft-section{
        padding:50px 4%;
    }

    .aft-header{
        width:55%;
    }

    .aft-title{
        font-size:25px;
    }

    .aft-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
        gap:16px;
        padding-top:0;
    }

    .aft-grid::before,
    .aft-member::before,
    .aft-member::after{
        display:none;
    }

    .aft-director{
        margin:0 auto 35px;
    }

    .aft-partner{
        margin-top:25px;
    }

    .aft-partner::before,
    .aft-partner::after{
        display:none;
    }
}

/* SMALL TABLET */
@media (max-width:850px){
    .aft-header{
        width:100%;
        margin-bottom:25px;
    }

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

/* MOBILE */
@media (max-width:560px){
    .aft-section{
        padding:40px 20px;
    }

    .aft-title{
        font-size:24px;
        line-height:1.12;
    }

    .aft-header p{
        font-size:14px;
        line-height:1.55;
    }

    .aft-director{
        width:100%;
        min-height:105px;
        margin:0 auto 30px;
        padding:14px;
    }

    .aft-avatar{
        width:50px;
        height:50px;
        flex-basis:50px;
    }

    .aft-director-content a{
        font-size:13px;
    }

    .aft-grid{
        grid-template-columns:1fr;
        gap:12px;
    }

    .aft-member{
        min-height:0;
        padding:18px 15px;
    }

    .aft-member h3{
        font-size:13px;
    }

    .aft-contact{
        font-size:14px;
    }

    .aft-partner{
        width:100%;
        min-height:105px;
        padding:14px;
    }

    .aft-partner-content a{
        font-size:13px;
    }
}

/* HARD SAFETY */
.elementor-widget-af_team,
.elementor-widget-af_team .elementor-widget-container,
.aft-section,
.aft-container,
.aft-grid,
.aft-member,
.aft-director,
.aft-partner{
    max-width:100%;
}

.elementor-widget-af_team{
    overflow:clip;
}

@supports not (overflow:clip){
    .elementor-widget-af_team{
        overflow:hidden;
    }
}

@media (prefers-reduced-motion:reduce){
    .aft-section *,
    .aft-section *::before,
    .aft-section *::after{
        animation:none!important;
        transition:none!important;
    }
}


/* =========================================================
   AF_Team v1.1.0 — ORGANIGRAM / TIMELINE CONNECTORS
   Keeps the original hierarchy visible:
   Director → horizontal line → 6 members → partner
   ========================================================= */

/* The connectors MUST be allowed to live outside the cards. */
.elementor-widget-af_team,
.elementor-widget-af_team .elementor-widget-container,
.aft-section,
.aft-container,
.aft-grid{
    overflow:visible!important;
}

/* Main horizontal branch */
.aft-grid{
    position:relative;
    isolation:isolate;
}

.aft-grid::before{
    display:block!important;
    content:"";
    position:absolute;
    top:0;
    left:3%;
    right:3%;
    height:1px;
    background:var(--aft-line);
    z-index:1;
}

/* Director vertical stem, connecting director to the main branch */
.aft-director::after{
    content:"";
    position:absolute;
    left:50%;
    top:100%;
    width:1px;
    height:40px;
    transform:translateX(-50%);
    background:var(--aft-line);
    z-index:-1;
    pointer-events:none;
}

/* Member stems + dots */
.aft-member{
    overflow:visible!important;
    contain:none!important;
}

.aft-member::before{
    display:block!important;
    content:"";
    position:absolute;
    top:-22px;
    left:50%;
    width:1px;
    height:22px;
    transform:translateX(-50%);
    background:var(--aft-line);
    z-index:1;
    pointer-events:none;
}

.aft-member::after{
    display:block!important;
    content:"";
    position:absolute;
    top:-26px;
    left:50%;
    width:8px;
    height:8px;
    transform:translateX(-50%);
    border-radius:50%;
    background:var(--aft-orange);
    z-index:4;
    pointer-events:none;
}

/* Central descent from team grid to partner */
.aft-grid::after{
    content:"";
    position:absolute;
    left:50%;
    top:100%;
    width:1px;
    height:32px;
    transform:translateX(-50%);
    background:var(--aft-line);
    z-index:1;
    pointer-events:none;
}

/* Partner vertical stem + dot */
.aft-partner{
    margin-top:32px;
    overflow:visible!important;
}

.aft-partner::before{
    display:block!important;
    content:"";
    position:absolute;
    left:50%;
    top:-32px;
    width:1px;
    height:32px;
    transform:translateX(-50%);
    background:var(--aft-line);
    z-index:1;
    pointer-events:none;
}

.aft-partner::after{
    display:block!important;
    content:"";
    position:absolute;
    left:50%;
    top:-36px;
    width:8px;
    height:8px;
    transform:translateX(-50%);
    border-radius:50%;
    background:var(--aft-orange);
    z-index:4;
    pointer-events:none;
}

/* Text remains contained without clipping connector pseudo-elements */
.aft-member,
.aft-member h3,
.aft-department,
.aft-contact,
.aft-contact span,
.aft-partner-content,
.aft-partner-content a,
.aft-director-content,
.aft-director-content a{
    min-width:0;
    max-width:100%;
}

.aft-member h3,
.aft-department,
.aft-contact span:last-child,
.aft-partner-content a span:last-child,
.aft-director-content a{
    overflow-wrap:anywhere;
    word-break:normal;
}

/* Keep connector geometry only when the team is laid out as a single row.
   On smaller screens, switch to a clean card grid without misleading branches. */
@media (max-width:1100px){
    .aft-director::after,
    .aft-grid::before,
    .aft-grid::after,
    .aft-member::before,
    .aft-member::after,
    .aft-partner::before,
    .aft-partner::after{
        display:none!important;
    }

    .aft-partner{
        margin-top:25px;
    }
}

/* If the user manually chooses 6 columns on wider tablet/desktop,
   keep the timeline visible whenever there is enough space. */
@media (min-width:1101px){
    .aft-grid{
        padding-top:22px;
    }
}

/* Ensure hover never moves the connector itself out of alignment visually. */
@media (hover:hover) and (pointer:fine){
    .aft-member:hover::before{
        transform:translateX(-50%) translateY(5px);
    }

    .aft-member:hover::after{
        transform:translateX(-50%) translateY(5px) scale(1.25);
    }
}