/*
Theme Name: Talent Engineering
Theme URI: https://www.talent-engineering.com
Author: Talent Engineering
Description: Animated bilingual (English/Arabic) theme for Talent Engineering. Works with Elementor Pro, Polylang and Contact Form 7.
Version: 1.1.2
Requires at least: 6.0
Requires PHP: 7.4
License: Proprietary
Text Domain: talent
*/

:root{--navy:#042E77;--ink:#031B4A;--sky:#48B9DD;--mist:#EAF6FB;--w:#fff;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-behavior:smooth;scroll-padding-top:90px}
*,*::before,*::after{box-sizing:inherit}
body{margin:0;font-family:'Readex Pro',system-ui,'Segoe UI',Tahoma,sans-serif;color:var(--ink);background:#fff;line-height:1.75;overflow-x:hidden}
a{color:inherit;text-decoration:none}
body.cu,body.cu *{cursor:none!important}
#pg{position:fixed;top:0;inset-inline:0;height:3px;background:var(--sky);transform:scaleX(0);transform-origin:right;z-index:100}
[dir=ltr] #pg{transform-origin:left}
#cr,#dt{position:fixed;top:0;left:0;pointer-events:none;z-index:9999;display:none}
body.cu #cr,body.cu #dt{display:block}
#cr{width:36px;height:36px;margin:-18px 0 0 -18px;border:1.5px solid var(--sky);border-radius:50%;transition:width .25s,height .25s,margin .25s,background .25s;display:none;place-items:center;font-size:12px;font-weight:600;color:#fff}
body.cu #cr{display:grid}
#cr.big{width:84px;height:84px;margin:-42px 0 0 -42px;background:rgba(4,46,119,.82)}
#cr::after{content:attr(data-l)}
#cr::before,#cr::after{position:absolute}
#dt{width:6px;height:6px;margin:-3px 0 0 -3px;background:var(--sky);border-radius:50%}
nav{position:fixed;top:14px;inset-inline:16px;z-index:60;display:flex;align-items:center;justify-content:space-between;gap:16px;background:rgba(255,255,255,.9);backdrop-filter:blur(12px);border-radius:999px;padding:8px 22px;box-shadow:0 8px 30px rgba(3,27,74,.18)}
nav img{height:38px;display:block}
.links{display:flex;gap:26px;font-weight:600;font-size:.92rem;color:var(--navy)}
.links a:hover{color:var(--sky)}
.act{display:flex;gap:10px;align-items:center}
.btn{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:999px;padding:12px 26px;font:600 .95rem 'Readex Pro',sans-serif;background:var(--sky);color:var(--ink);transition:background .25s,color .25s,transform .15s;will-change:transform}
.btn:hover{background:#fff}
.btn.n{background:var(--navy);color:#fff}.btn.n:hover{background:var(--sky);color:var(--ink)}
.btn.g{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.6)}.btn.g:hover{background:#fff;color:var(--navy)}
.lang{background:var(--mist);color:var(--navy);padding:8px 16px;font-size:.85rem}
.hero{position:relative;min-height:100svh;background:var(--ink);color:#fff;display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:20px;padding:120px 6vw 70px;overflow:hidden;isolation:isolate}
.hero .ph{position:absolute;inset:0;z-index:-3;background:var(--hero) center/cover;opacity:.16;filter:grayscale(1)}
.hero .gr,.hero .sp{position:absolute;inset:0;z-index:-2;background-size:48px 48px}
.hero .gr{background-image:linear-gradient(rgba(72,185,221,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(72,185,221,.09) 1px,transparent 1px)}
.hero .sp{background-image:linear-gradient(rgba(72,185,221,.7) 1px,transparent 1px),linear-gradient(90deg,rgba(72,185,221,.7) 1px,transparent 1px);-webkit-mask-image:radial-gradient(circle 230px at var(--mx,50%) var(--my,50%),#000,transparent);mask-image:radial-gradient(circle 230px at var(--mx,50%) var(--my,50%),#000,transparent)}
h1{font-size:clamp(2.6rem,6.6vw,5.8rem);line-height:1.12;margin:0 0 26px;font-weight:700}
h1 span{display:block;animation:rv 1s cubic-bezier(.2,.8,.2,1) both}
h1 span:nth-child(2){animation-delay:.18s;color:var(--sky)}
@keyframes rv{from{clip-path:inset(0 0 100% 0);transform:translateY(40px)}to{clip-path:inset(0);transform:none}}
.hero p{max-width:54ch;color:rgba(255,255,255,.82);font-size:1.1rem;margin:0 0 34px}
.bt{display:flex;gap:14px;flex-wrap:wrap}
.hero svg{width:100%;height:auto;max-height:78vh}
.dr{fill:none;stroke:var(--sky);stroke-width:1.6;stroke-dasharray:1;stroke-dashoffset:1;animation:dw 2.6s ease forwards;animation-delay:var(--d,0s)}
@keyframes dw{to{stroke-dashoffset:0}}
.wn{fill:var(--sky);opacity:0;animation:lt 1.4s forwards;animation-delay:var(--d)}
@keyframes lt{to{opacity:var(--o)}}
.dim{font:11px ui-monospace,Menlo,monospace;fill:var(--sky);opacity:0;animation:lt 1s 2.8s forwards;--o:.9}
.st{display:grid;grid-template-columns:repeat(4,1fr);background:#fff}
.st div{padding:40px 6vw 36px 20px;border-inline-end:1px solid rgba(4,46,119,.12)}
.st div:last-child{border:0}
.st b{display:block;font-size:clamp(2.2rem,4.4vw,3.8rem);color:var(--navy);line-height:1.1;font-weight:700}
.st span{font-size:.95rem;color:#3d5280}
.sec{padding:100px 6vw 20px}
h2{font-size:clamp(1.9rem,4vw,3.2rem);line-height:1.25;margin:0 0 14px;color:var(--navy);max-width:20ch}
.lead{max-width:60ch;color:#3d5280;margin:0 0 40px}
.acc{display:flex;gap:10px;height:68vh;min-height:470px;padding:0 6vw}
.pn{position:relative;flex:1;border-radius:20px;overflow:hidden;background:var(--navy) center/cover;color:#fff;transition:flex .8s cubic-bezier(.2,.8,.2,1)}
.pn.on{flex:4.2}
.pn::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(3,27,74,.94),rgba(4,46,119,.25))}
.pn div{position:absolute;inset-inline:0;bottom:0;padding:30px}
.pn h3{margin:0;font-size:1.5rem}
.pn p{margin:10px 0 0;max-width:46ch;opacity:0;max-height:0;transition:opacity .5s .2s,max-height .6s}
.pn.on p{opacity:.92;max-height:200px}
.pn:not(.on) h3{writing-mode:vertical-rl;font-size:1.2rem}
.sv{position:relative;display:grid;grid-template-columns:1fr 1.3fr;gap:30px;padding:30px 6vw;border-bottom:1px solid rgba(4,46,119,.15);overflow:hidden;transition:color .4s}
.sv::before{content:"";position:absolute;inset:0;background:var(--navy);transform:scaleX(0);transform-origin:right;transition:transform .55s cubic-bezier(.2,.8,.2,1);z-index:-1}
[dir=ltr] .sv::before{transform-origin:left}
.sv{z-index:0}.sv:hover{color:#fff}.sv:hover::before{transform:scaleX(1)}
.sv h3{margin:0;font-size:clamp(1.3rem,2.6vw,2rem);color:inherit}
.sv p{margin:0;color:inherit;opacity:.8}
.fl{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:30px}
.fl button{border:1.5px solid var(--navy);background:transparent;color:var(--navy);border-radius:999px;padding:8px 20px;font:600 .9rem 'Readex Pro',sans-serif;transition:.25s}
.fl button.on,.fl button:hover{background:var(--navy);color:#fff}
.gd{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:22px;padding:0 6vw}
.cd{position:relative}
.cd .im{position:relative;aspect-ratio:4/3;border-radius:16px;overflow:hidden;background:var(--navy) center/cover;transition:transform .35s}

.cd .bp{position:absolute;inset:0;background:rgba(4,46,119,.86);background-image:linear-gradient(rgba(72,185,221,.5) 1px,transparent 1px),linear-gradient(90deg,rgba(72,185,221,.5) 1px,transparent 1px);background-size:24px 24px;clip-path:circle(0 at var(--x,50%) var(--y,50%));transition:clip-path .5s cubic-bezier(.2,.8,.2,1)}
.cd:hover .bp{clip-path:circle(120px at var(--x,50%) var(--y,50%))}
.cd h4{margin:14px 0 2px;font-size:1.08rem;color:var(--navy)}
.cd small{color:#4a5f8c;font-size:.86rem;display:block}
.cd.h{display:none}
.mq{overflow:hidden;white-space:nowrap;background:var(--mist);margin-top:90px;padding:26px 0;direction:ltr}
.mq div{display:inline-block;animation:mq 45s linear infinite;font-size:1.5rem;font-weight:600;color:var(--navy)}
.mq span{padding:0 34px}.mq span:nth-child(even){color:var(--sky)}
@keyframes mq{to{transform:translateX(-50%)}}
.ct{background:var(--ink);color:#fff;display:grid;grid-template-columns:1fr 1fr;gap:50px;padding:100px 6vw}
.ct h2{color:#fff}
.ct address{font-style:normal;color:rgba(255,255,255,.82);display:grid;gap:8px;margin-top:24px}
.ct address a:hover{color:var(--sky)}
form{display:grid;gap:14px}
input,select,textarea{width:100%;background:rgba(255,255,255,.07);border:1px solid rgba(72,185,221,.35);border-radius:12px;color:#fff;padding:14px 16px;font:400 1rem 'Readex Pro',sans-serif}
select option{color:#000}
input:focus,select:focus,textarea:focus,.btn:focus-visible,.fl button:focus-visible,a:focus-visible{outline:2px solid var(--sky);outline-offset:2px}
#ok{color:var(--sky);margin:0;min-height:1.5em}
footer{background:var(--ink);color:rgba(255,255,255,.72);border-top:1px solid rgba(72,185,221,.25);padding:70px 6vw 0;font-size:.95rem}
.fg{display:grid;grid-template-columns:1.5fr 1fr 1.3fr;gap:50px;padding-bottom:50px}
.fb{display:inline-block;background:#fff;border-radius:14px;padding:10px 18px;margin-bottom:18px}
.fb img{height:34px;display:block}
footer p{margin:0;max-width:38ch}
footer h4{margin:0 0 16px;color:#fff;font-size:1.05rem}
.fg>div:not(:first-child){display:grid;gap:9px;align-content:start}
.fg a:not(.fb):hover{color:var(--sky)}
.fz{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;border-top:1px solid rgba(72,185,221,.2);padding:20px 0;font-size:.85rem;color:rgba(255,255,255,.55)}
.fz .up{color:var(--sky);font-weight:600}
@media(max-width:900px){.fg{grid-template-columns:1fr;gap:34px}.fz{flex-direction:column;align-items:flex-start}footer{padding-top:50px}}

.hero{clip-path:polygon(0 0,100% 0,100% 95%,0 100%);padding-bottom:9vw}
.bgt{position:absolute;inset-inline:0;bottom:2vw;z-index:-1;font-size:24vw;font-weight:700;line-height:1;color:transparent;-webkit-text-stroke:1px rgba(72,185,221,.25);white-space:nowrap;direction:ltr;pointer-events:none;transform:translateX(var(--tx,0))}
.hero svg{transform:perspective(900px) rotateY(var(--ry,0deg)) rotateX(var(--rx,0deg));transition:transform .25s}
.hk{transform-box:view-box;transform-origin:440px 160px;animation:sw 3.6s ease-in-out infinite alternate}
@keyframes sw{from{transform:rotate(-5deg)}to{transform:rotate(5deg)}}
body:not(.go) .hero *{animation-play-state:paused}
#pl{position:fixed;inset:0;z-index:300;background:var(--ink);display:grid;place-items:center;clip-path:inset(0);transition:clip-path .9s cubic-bezier(.7,0,.2,1)}
#pl.d{clip-path:inset(0 0 100% 0)}
#pl b{font-size:clamp(4.5rem,18vw,12rem);font-weight:700;direction:ltr;color:transparent;-webkit-text-stroke:1.5px var(--sky)}
#pl i{position:absolute;bottom:0;left:0;height:5px;background:var(--sky);width:var(--w,0)}
.ab{padding:110px 6vw 30px}
.rv{font-size:clamp(1.55rem,3.3vw,2.8rem);line-height:1.55;font-weight:600;max-width:30em;margin:0 0 50px;color:var(--navy)}
.rv .w{opacity:.15;transition:opacity .4s}.rv .w.on{opacity:1}
.vm{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.vm div{background:var(--mist);border-radius:22px;padding:32px}
.vm h3{margin:0 0 8px;color:var(--navy);font-size:1.4rem}.vm p{margin:0;color:#3d5280}
.bg{display:none;position:relative;width:44px;height:44px;border:0;border-radius:50%;background:var(--navy)}
.bg i{position:absolute;inset-inline:13px;height:2px;background:#fff;transition:.3s}
.bg i:nth-child(1){top:17px}.bg i:nth-child(2){top:25px}
.bg.x i:nth-child(1){top:21px;transform:rotate(45deg)}.bg.x i:nth-child(2){top:21px;transform:rotate(-45deg)}
.mm{position:fixed;inset:0;z-index:55;background:var(--ink);display:flex;flex-direction:column;justify-content:center;padding:100px 8vw 40px;clip-path:circle(0 at 50% 0);visibility:hidden;transition:clip-path .7s cubic-bezier(.7,0,.2,1),visibility 0s .7s}
.mm.on{clip-path:circle(160% at 50% 0);visibility:visible;transition-delay:0s}
.mm a{font-size:clamp(1.7rem,8vw,2.5rem);font-weight:700;color:#fff;padding:8px 0;border-bottom:1px solid rgba(72,185,221,.22)}
.mm a:active{color:var(--sky)}
.mm .btn{margin-top:26px;justify-content:center;font-size:1.1rem;color:var(--ink);border:0}
.mm small{margin-top:18px;color:var(--sky);direction:ltr;text-align:center}
.bd{height:500vh;position:relative;background:var(--ink);color:#fff;margin-top:60px}
.bds{position:sticky;top:0;height:100svh;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:30px;padding:90px 6vw 40px;overflow:hidden;background-image:linear-gradient(rgba(72,185,221,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(72,185,221,.08) 1px,transparent 1px);background-size:48px 48px}
.bd h2{color:#fff}
.ph2 b{display:block;font-size:clamp(3.5rem,9vw,7rem);line-height:1.05;font-weight:700;direction:ltr;color:transparent;-webkit-text-stroke:1.5px var(--sky)}
.ph2 h3{margin:10px 0 6px;font-size:clamp(1.5rem,3vw,2.3rem)}
.ph2 p{margin:0;max-width:44ch;color:rgba(255,255,255,.8);min-height:5.5em}
.bar{height:4px;background:rgba(255,255,255,.15);margin-top:26px;max-width:420px}.bar i{display:block;height:100%;width:0;background:var(--sky)}
.bd svg{width:100%;max-height:78vh;justify-self:center}
.gf{fill:none;stroke:var(--sky);stroke-width:1;stroke-dasharray:4 4;opacity:.35}
.sf{fill:rgba(72,185,221,.12);stroke:var(--sky);stroke-width:1.6;opacity:0;transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(.2);transition:opacity .4s,transform .5s,fill .6s}
.sf.s{opacity:1;transform:none}
#bs.fn .sf{fill:#0b4fb3}
.wd{fill:rgba(255,255,255,.1);opacity:0;transition:opacity .4s,fill .6s var(--dl)}
.wd.s{opacity:1}#bs.lit .wd.s{fill:var(--sky)}
.pp{fill:none;stroke:#fff;stroke-width:2;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.4s}
#bs.mep .pp{stroke-dashoffset:0}
.ho{font:600 15px 'Readex Pro',sans-serif;fill:var(--sky);opacity:0;transition:opacity .6s}
#bs.lit .ho{opacity:1}
@media(max-width:1060px){.links,.act .cta{display:none}.bg{display:block}}
@media(max-width:900px){.bds{grid-template-columns:1fr;padding-top:84px;gap:8px;align-content:center}.bd svg{max-height:40vh}.ph2 p{min-height:6.5em}.vm{grid-template-columns:1fr}nav{padding:6px 14px}nav img{height:30px}.lang{padding:8px 12px}.bgt{font-size:30vw}.links{display:none}.hero{grid-template-columns:1fr;padding-top:110px}.hero svg{max-height:44vh}.st{grid-template-columns:1fr 1fr}.sv,.ct{grid-template-columns:1fr}.acc{flex-direction:column;height:auto}.pn{flex:none;height:90px}.pn.on{height:380px}.pn:not(.on) h3{writing-mode:horizontal-tb}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01s!important;animation-delay:0s!important;transition-duration:.01s!important}}

.admin-bar nav{top:60px}@media(max-width:782px){.admin-bar nav{top:74px}}
.cd{display:block;color:inherit}
.cf .wpcf7-form p{margin:0 0 14px}.cf .wpcf7-form-control-wrap{display:block}
.cf input[type=submit]{background:var(--sky);color:var(--ink);font:600 .95rem 'Readex Pro',sans-serif;border:0;border-radius:999px;padding:12px 30px;width:auto;cursor:pointer;transition:background .25s}
.cf input[type=submit]:hover{background:#fff}
.cf .wpcf7-response-output{color:#fff;border-color:var(--sky)!important;border-radius:12px;margin:10px 0 0!important}
.cf .wpcf7-not-valid-tip{color:#ffb4b4;font-size:.85rem}.cf .wpcf7-spinner{display:none}
.pg{padding:130px 6vw 70px;min-height:70vh}.pg h1{color:var(--navy);font-size:clamp(2rem,4.5vw,3.6rem);line-height:1.2;margin:0 0 12px}
.pg .sub{color:#3d5280;margin:0 0 30px}.pg .entry{max-width:75ch}.pg .entry img{max-width:100%;height:auto}
.pj{aspect-ratio:21/9;border-radius:22px;background:var(--navy) center/cover;margin-bottom:30px}

.te-ex:empty{display:none}.te-ex{position:relative;z-index:1}
