/*
 * TehranWeb About — Stage 06 / Team
 * Reference geometry: approved frozen About mockup.
 * Content is ACF-driven; only verified members are rendered.
 */
:root {
    --tw-team-bg: #03111d;
    --tw-team-panel: rgba(3, 17, 29, .78);
    --tw-team-border: rgba(92, 157, 184, .28);
    --tw-team-gold: #f1b733;
    --tw-team-text: #f7f9fb;
    --tw-team-muted: rgba(224, 235, 242, .76);
}

.tw-about-team {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: #03111d;
    border-top: 1px solid rgba(60, 125, 151, .18);
    border-bottom: 1px solid rgba(60, 125, 151, .22);
    color: var(--tw-team-text);
}

.tw-about-team__ambient,
.tw-about-team__ambient span {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.tw-about-team__ambient { z-index: 0; overflow: hidden; }
.tw-about-team__glow--one {
    background: radial-gradient(circle at 10% 58%, rgba(245, 176, 41, .13), transparent 18%);
}
.tw-about-team__glow--two {
    background: radial-gradient(circle at 87% 62%, rgba(246, 179, 40, .10), transparent 16%);
}
.tw-about-team__beam--one,
.tw-about-team__beam--two {
    inset: auto !important;
    width: 48%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(245, 181, 52, .72), rgba(77, 151, 178, .20), transparent);
    box-shadow: 0 0 18px rgba(242, 174, 39, .18);
}
.tw-about-team__beam--one { left: -7%; top: 13%; transform: rotate(-9deg); }
.tw-about-team__beam--two { right: -8%; bottom: 11%; transform: rotate(8deg); }

.tw-about-team__container {
    position: relative;
    z-index: 2;
    width: min(94%, 1440px);
    margin: 0 auto;
    padding: clamp(34px, 3.4vw, 58px) 0 clamp(38px, 3.8vw, 64px);
}

.tw-about-team__header {
    width: min(720px, 92%);
    margin: 0 auto clamp(22px, 2.1vw, 34px);
    text-align: center;
}

.tw-about-team__title {
    margin: 0;
    color: var(--tw-team-gold);
    font-size: clamp(24px, 2.15vw, 38px);
    line-height: 1.15;
    font-weight: 900;
    letter-spacing: -.025em;
    text-shadow: 0 0 18px rgba(241, 183, 51, .12);
}
.tw-about-team__header p {
    margin: .55em 0 0;
    color: rgba(234, 241, 246, .84);
    font-size: clamp(12px, 1.05vw, 17px);
    line-height: 1.75;
}

.tw-about-team__layout {
    display: grid;
    grid-template-columns: minmax(270px, .92fr) minmax(0, 2.08fr);
    gap: clamp(18px, 2vw, 32px);
    align-items: stretch;
    direction: rtl;
}

.tw-about-team__quote {
    position: relative;
    min-height: clamp(210px, 18vw, 290px);
    padding: clamp(28px, 2.4vw, 38px);
    border: 1px solid var(--tw-team-border);
    border-radius: 14px;
    background:
        linear-gradient(140deg, rgba(6, 27, 40, .82), rgba(2, 13, 22, .80)),
        radial-gradient(circle at 86% 15%, rgba(241, 183, 51, .08), transparent 24%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.02), 0 18px 48px rgba(0,0,0,.16);
    overflow: hidden;
}
.tw-about-team__quote::after {
    content: '';
    position: absolute;
    inset: auto -8% -26% 24%;
    height: 56%;
    background: radial-gradient(ellipse at center, rgba(241, 183, 51, .08), transparent 68%);
    pointer-events: none;
}
.tw-about-team__quote-mark {
    position: absolute;
    top: 14px;
    right: 22px;
    color: var(--tw-team-gold);
    font: 900 clamp(52px, 4vw, 72px)/1 Georgia, serif;
}
.tw-about-team__quote blockquote {
    position: relative;
    z-index: 1;
    margin: clamp(32px, 3vw, 46px) 0 24px;
    color: rgba(247, 249, 251, .93);
    font-size: clamp(13px, 1.08vw, 17px);
    line-height: 1.95;
    font-weight: 500;
}
.tw-about-team__quote-footer {
    position: absolute;
    z-index: 2;
    left: clamp(24px, 2.2vw, 34px);
    right: clamp(24px, 2.2vw, 34px);
    bottom: clamp(22px, 2vw, 30px);
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
}
.tw-about-team__quote-person { display: grid; gap: 3px; }
.tw-about-team__quote-person strong { color: #fff; font-size: 13px; font-weight: 800; }
.tw-about-team__quote-person span { color: var(--tw-team-muted); font-size: 11px; line-height: 1.5; }
.tw-about-team__signature { width: min(118px, 36%); max-height: 52px; }
.tw-about-team__signature-image { width: 100%; height: 100%; object-fit: contain; object-position: left bottom; }

.tw-about-team__members {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(10px, 1.25vw, 18px);
    align-items: stretch;
    direction: rtl;
}
.tw-about-team__member {
    position: relative;
    min-width: 0;
    border: 1px solid rgba(89, 151, 177, .25);
    border-radius: 11px;
    background: rgba(4, 19, 30, .76);
    overflow: hidden;
    box-shadow: 0 12px 32px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.02);
    transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}
.tw-about-team__member:hover,
.tw-about-team__member:focus-within {
    transform: translateY(-4px);
    border-color: rgba(241, 183, 51, .42);
    box-shadow: 0 18px 42px rgba(0,0,0,.24), 0 0 26px rgba(241,183,51,.06);
}

.tw-about-team__member-media {
    position: relative;
    aspect-ratio: 1 / 1.08;
    overflow: hidden;
    background: #0a1924;
}
.tw-about-team__member-photo {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    transition: transform .5s cubic-bezier(.2,.7,.2,1);
}
.tw-about-team__member:hover .tw-about-team__member-photo,
.tw-about-team__member:focus-within .tw-about-team__member-photo { transform: scale(1.035); }
.tw-about-team__member-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 52%, rgba(2,11,18,.20) 72%, rgba(2,11,18,.86) 100%);
    pointer-events: none;
}
.tw-about-team__member-placeholder {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    background:
        radial-gradient(circle at 50% 34%, rgba(241,183,51,.14), transparent 26%),
        linear-gradient(145deg, #102936, #06131d 62%);
}
.tw-about-team__member-placeholder::before,
.tw-about-team__member-placeholder::after {
    content: '';
    position: absolute;
    border: 1px solid rgba(241,183,51,.12);
    border-radius: 50%;
}
.tw-about-team__member-placeholder::before { width: 54%; aspect-ratio: 1; }
.tw-about-team__member-placeholder::after { width: 72%; aspect-ratio: 1; }
.tw-about-team__member-placeholder span {
    position: relative;
    z-index: 2;
    color: var(--tw-team-gold);
    font-size: clamp(26px, 2vw, 38px);
    font-weight: 800;
}

.tw-about-team__linkedin {
    position: absolute;
    z-index: 5;
    left: 9px;
    bottom: 9px;
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border-radius: 6px;
    color: #fff;
    background: #0a66c2;
    box-shadow: 0 4px 14px rgba(0,0,0,.24);
}
.tw-about-team__linkedin svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }

.tw-about-team__member-overlay {
    position: absolute;
    z-index: 4;
    inset: auto 0 0;
    padding: 30px 12px 12px;
    transform: translateY(105%);
    opacity: 0;
    background: linear-gradient(180deg, transparent, rgba(2,12,20,.96) 34%);
    transition: transform .3s ease, opacity .3s ease;
}
.tw-about-team__member:hover .tw-about-team__member-overlay,
.tw-about-team__member:focus-within .tw-about-team__member-overlay { transform: translateY(0); opacity: 1; }
.tw-about-team__member-overlay p {
    margin: 0;
    color: rgba(240,246,249,.92);
    font-size: 10px;
    line-height: 1.65;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
}
.tw-about-team__socials { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }
.tw-about-team__socials a {
    color: #fff;
    text-decoration: none;
    font-size: 9px;
    line-height: 1;
    padding: 5px 7px;
    border: 1px solid rgba(241,183,51,.30);
    border-radius: 999px;
    background: rgba(241,183,51,.08);
}

.tw-about-team__member-copy {
    min-height: 64px;
    padding: 11px 10px 13px;
    text-align: center;
}
.tw-about-team__member-copy h3 {
    margin: 0;
    color: #fff;
    font-size: clamp(12px, .96vw, 15px);
    line-height: 1.45;
    font-weight: 850;
}
.tw-about-team__member-copy p {
    margin: 3px 0 0;
    color: var(--tw-team-muted);
    font-size: clamp(9px, .75vw, 11px);
    line-height: 1.55;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

/* Preserve the four-card reference geometry even when only verified members exist. */
.tw-about-team__members--1 .tw-about-team__member { grid-column: 1; }
.tw-about-team__members--2 .tw-about-team__member:nth-child(1) { grid-column: 1; }
.tw-about-team__members--2 .tw-about-team__member:nth-child(2) { grid-column: 2; }
.tw-about-team__members--3 .tw-about-team__member:nth-child(1) { grid-column: 1; }
.tw-about-team__members--3 .tw-about-team__member:nth-child(2) { grid-column: 2; }
.tw-about-team__members--3 .tw-about-team__member:nth-child(3) { grid-column: 3; }

@media (max-width: 980px) {
    .tw-about-team__layout { grid-template-columns: 1fr; }
    .tw-about-team__quote { order: 2; min-height: 220px; }
    .tw-about-team__members { order: 1; }
}

@media (max-width: 680px) {
    .tw-about-team__container { width: min(92%, 560px); padding: 34px 0 40px; }
    .tw-about-team__header { margin-bottom: 20px; }
    .tw-about-team__title { font-size: clamp(23px, 7vw, 30px); }
    .tw-about-team__header p { font-size: 12px; line-height: 1.7; }
    .tw-about-team__members { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
    .tw-about-team__members--1 .tw-about-team__member { grid-column: 2; }
    .tw-about-team__members--2 .tw-about-team__member:nth-child(1) { grid-column: 2; }
    .tw-about-team__members--2 .tw-about-team__member:nth-child(2) { grid-column: 1; }
    .tw-about-team__members--3 .tw-about-team__member:nth-child(1) { grid-column: 2; }
    .tw-about-team__members--3 .tw-about-team__member:nth-child(2) { grid-column: 1; }
    .tw-about-team__members--3 .tw-about-team__member:nth-child(3) { grid-column: 2; }
    .tw-about-team__member-copy { min-height: 60px; }
    .tw-about-team__quote { min-height: 250px; padding: 26px 22px; }
    .tw-about-team__quote blockquote { font-size: 12px; line-height: 1.9; margin-top: 34px; }
    .tw-about-team__quote-footer { left: 22px; right: 22px; }
}

@media (prefers-reduced-motion: reduce) {
    .tw-about-team__member,
    .tw-about-team__member-photo,
    .tw-about-team__member-overlay { transition: none !important; }
}


/* v0.8.1 — frozen reference background for Team. */
.tw-about-team__ambient {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}
.tw-about-team__background {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center center;
    opacity: 1;
    filter: none;
    transform: none;
}
.tw-about-team__glow--one,
.tw-about-team__glow--two,
.tw-about-team__beam--one,
.tw-about-team__beam--two {
    display: none !important;
}

@media (min-width: 981px) {
    .tw-about-team__container {
        padding-top: clamp(30px, 2.7vw, 46px);
        padding-bottom: clamp(32px, 3vw, 50px);
    }
}


/* v0.8.2 — desktop Team geometry calibrated to the frozen 724x185 reference. */
@media (min-width: 981px) {
    .tw-about-team {
        width: 100%;
        aspect-ratio: 724 / 185;
        min-height: 0;
        overflow: hidden;
        background: #03111d;
    }

    .tw-about-team__ambient {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        overflow: hidden;
        z-index: 0;
    }

    .tw-about-team__background {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        max-width: none;
        object-fit: fill;
        object-position: center center;
        opacity: 1;
        filter: none;
        transform: none;
    }

    .tw-about-team__container {
        position: absolute;
        inset: 0;
        z-index: 2;
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0;
    }

    .tw-about-team__header {
        position: absolute;
        top: 7.4%;
        left: 50%;
        width: 62%;
        margin: 0;
        transform: translateX(-50%);
        text-align: center;
    }

    .tw-about-team__title {
        margin: 0;
        font-size: clamp(24px, 2.08vw, 40px);
        line-height: 1.08;
        font-weight: 900;
        letter-spacing: -.028em;
        color: var(--tw-team-gold);
    }

    .tw-about-team__header p {
        margin: .42em 0 0;
        font-size: clamp(11px, .98vw, 18px);
        line-height: 1.4;
        color: rgba(238,244,248,.88);
    }

    .tw-about-team__layout {
        position: absolute;
        top: 24.85%;
        left: 4.55%;
        right: 4.45%;
        bottom: 10.8%;
        display: grid;
        grid-template-columns: minmax(0,.92fr) minmax(0,1.82fr);
        gap: 2.55%;
        align-items: stretch;
        direction: rtl;
    }

    .tw-about-team__quote {
        width: 100%;
        height: 100%;
        min-height: 0;
        padding: 9.4% 7.8% 8.5%;
        border-radius: clamp(9px, .75vw, 14px);
        background:
            linear-gradient(142deg, rgba(5,26,39,.78), rgba(2,13,22,.78)),
            radial-gradient(circle at 86% 15%, rgba(241,183,51,.07), transparent 25%);
    }

    .tw-about-team__quote-mark {
        top: 4.5%;
        right: 7%;
        font-size: clamp(50px, 3.4vw, 68px);
    }

    .tw-about-team__quote blockquote {
        margin: 8% 0 20%;
        font-size: clamp(12px, .92vw, 17px);
        line-height: 1.82;
    }

    .tw-about-team__quote-footer {
        left: 7.5%;
        right: 7.5%;
        bottom: 7.8%;
    }

    .tw-about-team__members {
        height: 91.2%;
        align-self: end;
        display: grid;
        grid-template-columns: repeat(4,minmax(0,1fr));
        gap: 2.5%;
        align-items: stretch;
    }

    .tw-about-team__member {
        height: 100%;
        min-height: 0;
        border-radius: clamp(8px, .65vw, 12px);
        display: flex;
        flex-direction: column;
        background: rgba(4,19,30,.72);
    }

    .tw-about-team__member-media {
        flex: 1 1 auto;
        min-height: 0;
        aspect-ratio: auto;
    }

    .tw-about-team__member-copy {
        flex: 0 0 24.5%;
        min-height: 0;
        padding: 5.5% 5% 6.5%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        text-align: center;
    }

    .tw-about-team__member-copy h3 {
        font-size: clamp(11px, .82vw, 15px);
        line-height: 1.22;
    }

    .tw-about-team__member-copy p {
        margin-top: .22em;
        font-size: clamp(8px, .65vw, 11px);
        line-height: 1.32;
    }

    .tw-about-team__linkedin {
        left: 4.5%;
        bottom: 3.8%;
        width: clamp(20px,1.35vw,26px);
        height: clamp(20px,1.35vw,26px);
    }
}


/* v0.8.3 — frozen Team reference alignment and copy visibility fixes. */
@media (min-width: 981px) {
    .tehranweb-about-template .tw-about-team {
        width: 100% !important;
        aspect-ratio: 724 / 185 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        background: #03111d !important;
    }

    .tehranweb-about-template .tw-about-team__ambient,
    .tehranweb-about-template .tw-about-team__background {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .tehranweb-about-template .tw-about-team__background {
        object-fit: fill !important;
        object-position: 50% 50% !important;
        opacity: 1 !important;
        filter: none !important;
        transform: none !important;
    }

    /* The fallback uses the exact frozen reference. These masks remove only the
       baked content areas, leaving the original edge/city/network artwork visible. */
    .tehranweb-about-template .tw-about-team--reference-bg .tw-about-team__ambient::after {
        content: '';
        position: absolute;
        inset: 0;
        z-index: 1;
        pointer-events: none;
        background:
            linear-gradient(#03111d,#03111d) 50% 13% / 32% 19% no-repeat,
            linear-gradient(#04131e,#04131e) 10.8% 58% / 15.5% 67% no-repeat,
            linear-gradient(#04131e,#04131e) 26.2% 58% / 15.5% 67% no-repeat,
            linear-gradient(#04131e,#04131e) 41.7% 58% / 15.5% 67% no-repeat,
            linear-gradient(#04131e,#04131e) 57.1% 58% / 15.5% 67% no-repeat,
            linear-gradient(#04131e,#04131e) 81.2% 58% / 31.4% 70% no-repeat;
        opacity: .985;
    }

    .tehranweb-about-template .tw-about-team__container {
        position: absolute !important;
        inset: 0 !important;
        z-index: 3 !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Do not use translateX for centering here: the global reveal animation also
       owns transform. Symmetric left/right positioning is deterministic. */
    .tehranweb-about-template .tw-about-team__header,
    .tehranweb-about-template .tw-about-team__header[data-tw-reveal],
    .tehranweb-about-template .tw-about-team__header[data-tw-reveal].is-visible {
        position: absolute !important;
        top: 7.2% !important;
        left: 19% !important;
        right: 19% !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
        text-align: center !important;
        direction: rtl !important;
        opacity: 1 !important;
    }

    .tehranweb-about-template .tw-about-team__title {
        margin: 0 !important;
        padding: 0 !important;
        color: var(--tw-team-gold) !important;
        font-size: clamp(22px, 1.72vw, 33px) !important;
        line-height: 1.08 !important;
        font-weight: 900 !important;
        letter-spacing: -.025em !important;
        text-align: center !important;
    }

    .tehranweb-about-template .tw-about-team__header p {
        margin: .42em 0 0 !important;
        padding: 0 !important;
        color: rgba(238,244,248,.88) !important;
        font-size: clamp(10px, .82vw, 15px) !important;
        line-height: 1.35 !important;
        text-align: center !important;
        white-space: nowrap !important;
    }

    .tehranweb-about-template .tw-about-team__layout {
        position: absolute !important;
        top: 24.9% !important;
        left: 4.55% !important;
        right: 4.45% !important;
        bottom: 10.8% !important;
        display: grid !important;
        grid-template-columns: minmax(0,.92fr) minmax(0,1.82fr) !important;
        gap: 2.55% !important;
        align-items: stretch !important;
        direction: rtl !important;
    }

    .tehranweb-about-template .tw-about-team__quote {
        min-height: 0 !important;
        height: 100% !important;
        background: linear-gradient(142deg, rgba(5,26,39,.96), rgba(2,13,22,.97)) !important;
    }

    .tehranweb-about-template .tw-about-team__members {
        height: 91.2% !important;
        align-self: end !important;
        grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    }

    .tehranweb-about-template .tw-about-team__member {
        height: 100% !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        background: rgba(4,19,30,.97) !important;
        overflow: hidden !important;
    }

    .tehranweb-about-template .tw-about-team__member-media {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        aspect-ratio: auto !important;
    }

    /* Reserve enough space for long real-world job titles. */
    .tehranweb-about-template .tw-about-team__member-copy {
        flex: 0 0 32% !important;
        min-height: 0 !important;
        padding: 4.5% 4% 5.5% !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        overflow: visible !important;
    }

    .tehranweb-about-template .tw-about-team__member-copy h3 {
        margin: 0 !important;
        font-size: clamp(10px, .78vw, 14px) !important;
        line-height: 1.22 !important;
        font-weight: 850 !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        overflow-wrap: anywhere !important;
    }

    .tehranweb-about-template .tw-about-team__member-copy p {
        margin: .32em 0 0 !important;
        padding: 0 !important;
        color: var(--tw-team-muted) !important;
        font-size: clamp(7.5px, .57vw, 10.5px) !important;
        line-height: 1.28 !important;
        display: block !important;
        overflow: visible !important;
        -webkit-line-clamp: unset !important;
        -webkit-box-orient: initial !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
    }
}


/* v0.8.4 — Team background is now CODE-BUILT, not a crop/screenshot.
   Visual target: frozen Team reference (dark navy, subtle city lights,
   gold network sweeps at top/bottom, no baked cards/text). */
.tehranweb-about-template .tw-about-team {
    background:
        radial-gradient(70% 90% at 50% 68%, rgba(7,28,42,.34) 0%, rgba(3,17,29,0) 62%),
        linear-gradient(180deg, #031321 0%, #03111d 42%, #02101a 100%) !important;
}

.tehranweb-about-template .tw-about-team__ambient {
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    overflow: hidden !important;
    background: transparent !important;
}

/* Optional ACF background remains supported, but it sits underneath the coded
   reference treatment and never injects baked Team content by default. */
.tehranweb-about-template .tw-about-team__background {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    opacity: .30 !important;
    filter: saturate(.75) brightness(.58) contrast(1.08) !important;
    z-index: 0 !important;
}

.tehranweb-about-template .tw-about-team__sky,
.tehranweb-about-template .tw-about-team__city,
.tehranweb-about-template .tw-about-team__city-lights,
.tehranweb-about-template .tw-about-team__network,
.tehranweb-about-template .tw-about-team__edge-glow {
    position: absolute !important;
    display: block !important;
    pointer-events: none !important;
}

/* Reference-like deep blue atmosphere. */
.tehranweb-about-template .tw-about-team__sky {
    inset: 0 !important;
    z-index: 1 !important;
    background:
        radial-gradient(36% 54% at 4% 63%, rgba(19,54,70,.26), transparent 72%),
        radial-gradient(30% 46% at 96% 61%, rgba(15,46,62,.22), transparent 74%),
        linear-gradient(180deg, rgba(0,8,15,.10), rgba(0,8,15,.34) 80%, rgba(0,8,15,.50));
}

/* A coded skyline silhouette in the lower third, matching the reference's
   low-rise illuminated city without importing the frozen screenshot. */
.tehranweb-about-template .tw-about-team__city {
    z-index: 2 !important;
    left: -2% !important;
    right: -2% !important;
    bottom: 5.5% !important;
    height: 31% !important;
    opacity: .92 !important;
    background:
        linear-gradient(180deg, transparent 0 64%, rgba(1,9,15,.92) 64% 100%),
        repeating-linear-gradient(90deg,
            transparent 0 1.8%,
            rgba(6,24,35,.94) 1.8% 2.8%,
            transparent 2.8% 3.5%,
            rgba(7,27,39,.96) 3.5% 5.1%,
            transparent 5.1% 6.2%,
            rgba(5,22,33,.96) 6.2% 7.1%,
            transparent 7.1% 8.8%) bottom / 100% 76% no-repeat,
        repeating-linear-gradient(90deg,
            transparent 0 3.2%,
            rgba(10,34,46,.78) 3.2% 4.1%,
            transparent 4.1% 7.4%) bottom / 100% 100% no-repeat;
    clip-path: polygon(0 43%, 3% 40%, 6% 56%, 9% 48%, 12% 61%, 16% 37%, 20% 53%, 23% 46%, 27% 58%, 30% 34%, 34% 51%, 37% 43%, 41% 60%, 45% 47%, 48% 54%, 52% 39%, 56% 57%, 59% 45%, 63% 51%, 67% 35%, 70% 55%, 74% 44%, 78% 59%, 82% 42%, 86% 52%, 90% 37%, 94% 55%, 97% 46%, 100% 49%, 100% 100%, 0 100%);
}

/* Tiny warm windows / city points. */
.tehranweb-about-template .tw-about-team__city-lights {
    z-index: 3 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 7.5% !important;
    height: 24% !important;
    opacity: .82 !important;
    background-image:
        radial-gradient(circle, rgba(255,188,68,.95) 0 1px, rgba(255,188,68,.18) 1.3px, transparent 1.7px),
        radial-gradient(circle, rgba(255,203,97,.86) 0 .9px, transparent 1.5px),
        radial-gradient(circle, rgba(242,169,43,.78) 0 .8px, transparent 1.4px);
    background-size: 34px 16px, 51px 21px, 73px 27px !important;
    background-position: 7px 3px, 19px 8px, 31px 1px !important;
    mask-image: linear-gradient(to top, #000 0 80%, transparent 100%);
}

/* Gold network sweeps. No raster reference is used. */
.tehranweb-about-template .tw-about-team__network {
    z-index: 4 !important;
    left: -3% !important;
    right: -3% !important;
    height: 33% !important;
    opacity: .78 !important;
    filter: drop-shadow(0 0 6px rgba(244,178,45,.26));
    background:
        linear-gradient(15deg, transparent 0 13.8%, rgba(238,170,36,.64) 14.05%, rgba(238,170,36,.16) 14.35%, transparent 14.7%),
        linear-gradient(-10deg, transparent 0 23.8%, rgba(238,170,36,.46) 24.1%, rgba(238,170,36,.12) 24.4%, transparent 24.8%),
        linear-gradient(7deg, transparent 0 47.7%, rgba(54,129,157,.24) 48%, transparent 48.4%),
        radial-gradient(circle at 4% 74%, rgba(255,195,71,.98) 0 2px, rgba(255,186,50,.30) 3px, transparent 12px),
        radial-gradient(circle at 31% 42%, rgba(255,191,58,.92) 0 1.5px, transparent 8px),
        radial-gradient(circle at 72% 58%, rgba(255,191,58,.86) 0 1.4px, transparent 7px),
        radial-gradient(circle at 96% 25%, rgba(255,195,71,.96) 0 2px, transparent 11px);
}
.tehranweb-about-template .tw-about-team__network--top {
    top: -14% !important;
    transform: rotate(-1.5deg) !important;
    transform-origin: center !important;
}
.tehranweb-about-template .tw-about-team__network--bottom {
    bottom: -13% !important;
    transform: rotate(1.8deg) scaleY(-1) !important;
    transform-origin: center !important;
}

.tehranweb-about-template .tw-about-team__edge-glow {
    z-index: 5 !important;
    width: 28% !important;
    height: 40% !important;
    bottom: -18% !important;
    opacity: .74 !important;
    filter: blur(.2px) drop-shadow(0 0 18px rgba(243,177,47,.15));
}
.tehranweb-about-template .tw-about-team__edge-glow--left {
    left: -7% !important;
    background: linear-gradient(16deg, transparent 44%, rgba(244,179,46,.68) 45%, rgba(244,179,46,.12) 46%, transparent 47%);
}
.tehranweb-about-template .tw-about-team__edge-glow--right {
    right: -7% !important;
    background: linear-gradient(-16deg, transparent 44%, rgba(244,179,46,.68) 45%, rgba(244,179,46,.12) 46%, transparent 47%);
}

/* Remove every previous screenshot-mask fallback. */
.tehranweb-about-template .tw-about-team--reference-bg .tw-about-team__ambient::after {
    content: none !important;
    display: none !important;
}

@media (min-width: 981px) {
    .tehranweb-about-template .tw-about-team {
        width: 100% !important;
        aspect-ratio: 724 / 185 !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }

    .tehranweb-about-template .tw-about-team__container {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
        padding: 0 !important;
        margin: 0 !important;
        z-index: 10 !important;
    }

    /* Reference header: centered, compact, above cards. */
    .tehranweb-about-template .tw-about-team__header,
    .tehranweb-about-template .tw-about-team__header[data-tw-reveal],
    .tehranweb-about-template .tw-about-team__header[data-tw-reveal].is-visible {
        position: absolute !important;
        top: 7.1% !important;
        left: 22% !important;
        right: 22% !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
        opacity: 1 !important;
        text-align: center !important;
    }

    .tehranweb-about-template .tw-about-team__layout {
        position: absolute !important;
        top: 25.0% !important;
        left: 4.6% !important;
        right: 4.3% !important;
        bottom: 10.5% !important;
        display: grid !important;
        grid-template-columns: 30.8% minmax(0,1fr) !important;
        gap: 2.6% !important;
        direction: rtl !important;
        align-items: stretch !important;
    }

    .tehranweb-about-template .tw-about-team__quote {
        min-height: 0 !important;
        height: 100% !important;
        background: linear-gradient(145deg, rgba(5,25,38,.83), rgba(2,14,23,.86)) !important;
        border-color: rgba(80,145,172,.30) !important;
        backdrop-filter: blur(1.5px) !important;
    }

    .tehranweb-about-template .tw-about-team__members {
        height: 100% !important;
        align-self: stretch !important;
        grid-template-columns: repeat(4,minmax(0,1fr)) !important;
        gap: 2.6% !important;
    }

    .tehranweb-about-template .tw-about-team__member {
        height: 100% !important;
        min-height: 0 !important;
        background: rgba(4,19,30,.84) !important;
        border-color: rgba(88,151,177,.28) !important;
    }

    .tehranweb-about-template .tw-about-team__member-copy {
        flex: 0 0 31% !important;
        min-height: 0 !important;
        padding: 4.2% 4% 5.4% !important;
        overflow: visible !important;
    }

    .tehranweb-about-template .tw-about-team__member-copy p {
        display: block !important;
        overflow: visible !important;
        -webkit-line-clamp: unset !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        font-size: clamp(7.5px,.59vw,10.5px) !important;
        line-height: 1.30 !important;
    }
}


/* v0.8.5 — BACKGROUND ONLY.
   The Stage 06 background is extracted from the frozen approved reference,
   with all baked cards/text removed. No layout/content/card rules are changed. */
.tehranweb-about-template .tw-about-team {
    background: #03111d !important;
}

.tehranweb-about-template .tw-about-team__ambient {
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    overflow: hidden !important;
    background: url('../images/team-background-reference-exact-v085.png') center center / 100% 100% no-repeat !important;
}

/* The reference background is authoritative for this frozen stage. */
.tehranweb-about-template .tw-about-team__background,
.tehranweb-about-template .tw-about-team__sky,
.tehranweb-about-template .tw-about-team__city,
.tehranweb-about-template .tw-about-team__city-lights,
.tehranweb-about-template .tw-about-team__network,
.tehranweb-about-template .tw-about-team__edge-glow,
.tehranweb-about-template .tw-about-team__ambient::before,
.tehranweb-about-template .tw-about-team__ambient::after {
    display: none !important;
    content: none !important;
}

@media (max-width: 980px) {
    .tehranweb-about-template .tw-about-team__ambient {
        background-size: cover !important;
        background-position: center center !important;
    }
}


/* v0.8.6 — seam cleanup ONLY.
   Removes the two horizontal lines visible between Journey and Team.
   No layout, spacing, typography, cards, quote, or background composition changes. */
.tehranweb-about-template .tw-about-team {
    border-top: 0 !important;
}

/* Cover only the baked 3px top-edge line in the Team background artwork. */
.tehranweb-about-template .tw-about-team__ambient::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    z-index: 50 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 3px !important;
    background: #03111d !important;
    pointer-events: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}


/* v0.10.2 — ACF Team background fix ONLY.
   When the Team section has a custom ACF background, that uploaded image must
   be the authoritative background. The hard-coded frozen reference remains only
   for the fallback/reference mode. */
.tehranweb-about-template .tw-about-team.tw-about-team--custom-bg .tw-about-team__ambient {
    background: none !important;
}

.tehranweb-about-template .tw-about-team.tw-about-team--custom-bg .tw-about-team__background {
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
    z-index: 0 !important;
}

.tehranweb-about-template .tw-about-team.tw-about-team--custom-bg .tw-about-team__sky,
.tehranweb-about-template .tw-about-team.tw-about-team--custom-bg .tw-about-team__city,
.tehranweb-about-template .tw-about-team.tw-about-team--custom-bg .tw-about-team__city-lights,
.tehranweb-about-template .tw-about-team.tw-about-team--custom-bg .tw-about-team__network,
.tehranweb-about-template .tw-about-team.tw-about-team--custom-bg .tw-about-team__edge-glow {
    display: none !important;
}

/* Keep the plugin fallback background only when no ACF background is supplied. */
.tehranweb-about-template .tw-about-team.tw-about-team--reference-bg .tw-about-team__ambient {
    background: url('../images/team-background-reference-exact-v085.png') center center / 100% 100% no-repeat !important;
}