/* ProTalent — site styles
   Layout: the slanted "blade" from the PT mark cuts photo frames, section edges and service badges;
   content sits in a 1180px column; warm-neutral paper with the logo's navy→blue as the only accent family. */
:root{
  --ink:#1F262C; --ink-2:#4E5A65; --ink-3:#76828C;
  --navy:#0E3F69; --navy-2:#0A2F50; --blue:#1C78C4; --blue-2:#3E95DA;
  --tint:#EAF2F9; --paper:#F6F7F8; --surface:#FFFFFF; --line:#DCE3EA; --line-2:#C8D3DD;
  --on-dark:#FFFFFF; --on-dark-2:#BFD3E6; --gold:#C9A45C;
  --ok:#1E7A4C; --ok-bg:#E6F4EC; --err:#B3261E; --err-bg:#FBEAE8; --wa:#1E8E4E;
  --f-display:"Readex Pro","IBM Plex Sans Arabic",system-ui,sans-serif;
  --f-body:"IBM Plex Sans Arabic","Readex Pro",system-ui,sans-serif;
  --r:12px; --r-s:8px; --wrap:1180px;
  --shadow:0 1px 2px rgba(14,63,105,.06),0 8px 24px rgba(14,63,105,.07);
  color-scheme:light;
}
/* الموقع بالألوان الفاتحة دائمًا لكل الزوار */
html{color-scheme:light;background:#F6F7F8}
 
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:16.5px;line-height:1.8;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--surface)}
img{max-width:100%;display:block}
a{color:var(--blue)}
h1,h2,h3,h4{font-family:var(--f-display);line-height:1.35;margin:0;color:var(--ink);text-wrap:balance;font-weight:600}
p{margin:0}
ul{margin:0}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px;border-radius:4px}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.skip{position:absolute;inset-inline-start:8px;top:-60px;background:var(--surface);padding:8px 14px;border-radius:8px;z-index:100}
.skip:focus{top:8px}
.ic{flex:none;display:block}
.hp{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.eyebrow{font-family:var(--f-display);font-size:13px;font-weight:600;letter-spacing:.06em;color:var(--blue);display:flex;align-items:center;gap:10px}
.eyebrow::before{content:"";width:22px;height:8px;background:var(--blue);clip-path:polygon(30% 0,100% 0,70% 100%,0 100%)}
.muted{color:var(--ink-2)}
.preview-bar{background:var(--gold);color:#1F262C;font-family:var(--f-display);font-size:13.5px;text-align:center;padding:8px 16px}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--f-display);font-weight:600;font-size:15.5px;padding:13px 22px;border-radius:var(--r-s);border:1.5px solid transparent;text-decoration:none;cursor:pointer;line-height:1.2;transition:background .2s,color .2s,border-color .2s,transform .2s}
.btn .ic{transition:transform .2s}
.btn:hover .ic{transform:translateX(-4px)}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:var(--navy)}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--line-2)}
.btn-ghost:hover{border-color:var(--blue);color:var(--blue)}
.btn-light{background:#fff;color:#0E3F69}
.btn-light:hover{background:#EAF2F9}
.btn-outline-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.45)}
.btn-outline-light:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.btn-wa{background:var(--wa);color:#fff}
.btn-wa-brand{background:#25D366;color:#fff;border-color:#25D366;font-weight:700;box-shadow:0 6px 18px rgba(37,211,102,.35)}
.btn-wa-brand:hover{background:#1EBE5A;border-color:#1EBE5A;color:#fff}
.btn-wa-brand svg{width:20px;height:20px}
.btn-sm{padding:9px 14px;font-size:14px}

/* Header */
.hdr{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:var(--surface);border-bottom:1px solid var(--line)}
.hdr-in{display:flex;align-items:center;gap:18px;min-height:74px}
.brand{display:flex;align-items:center;background:#fff;border-radius:8px;padding:4px 6px;flex:none}
.brand img{height:46px;width:auto}
.nav{display:flex;gap:2px;margin-inline-start:auto;align-items:center}
.nav a:not(.btn){font-family:var(--f-display);font-size:15.5px;font-weight:500;color:var(--ink);text-decoration:none;padding:8px 13px;border-radius:8px;position:relative}
.nav a:not(.btn):hover{background:var(--tint)}
.nav a[aria-current="page"]{color:var(--blue)}
.nav a[aria-current="page"]::after{content:"";position:absolute;inset-inline:13px;bottom:2px;height:2px;background:var(--blue);border-radius:2px}
.nav-cta-m{display:none}
.menu-btn{display:none;background:none;border:1.5px solid var(--line);border-radius:8px;padding:9px;cursor:pointer;color:var(--ink);margin-inline-start:auto}
@media (max-width:1180px){
  .menu-btn{display:inline-flex}.hdr-cta{display:none}
  .nav{position:fixed;inset:calc(74px + env(safe-area-inset-top,0px)) 0 0 0;background:var(--surface);flex-direction:column;align-items:stretch;gap:2px;margin:0;overflow:auto;display:none;border-top:1px solid var(--line);padding-block:12px 24px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
  .nav.open{display:flex}
  .nav a:not(.btn){font-size:18px;padding:15px 8px;border-bottom:1px solid var(--line);border-radius:0}
  .nav a[aria-current="page"]::after{display:none}
  .nav-cta-m{display:inline-flex;margin-top:18px}
}

/* Hero */
.hero{background:var(--surface);position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.hero-in{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center;padding-block:64px 72px}
.hero h1{font-size:clamp(32px,4.4vw,52px);font-weight:700;line-height:1.28;margin-block:16px 18px;color:var(--ink)}
.hero h1 em{font-style:normal;color:var(--blue)}
.hero-lead{font-size:18px;color:var(--ink-2);max-width:56ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.hero-facts{display:flex;flex-wrap:wrap;gap:12px 32px;margin-top:34px;padding-top:22px;border-top:1px solid var(--line)}
.hero-facts div{display:flex;flex-direction:column;line-height:1.4}
.hero-facts b{font-family:var(--f-display);font-size:19px;font-weight:600;color:var(--ink)}
.hero-facts span{font-size:14px;color:var(--ink-3)}
.hero-visual{position:relative;min-width:0}
.hero-frame{position:relative;aspect-ratio:5/4.4;max-width:100%;clip-path:polygon(14% 0,100% 0,100% 100%,0 100%,0 22%);border-radius:var(--r);overflow:hidden;background:var(--navy)}
.hero-frame img{width:100%;height:100%;object-fit:cover}
.hero-blade{position:absolute;inset-block:-6% 30%;inset-inline-end:-5%;width:34%;background:linear-gradient(160deg,var(--blue),var(--blue-2));clip-path:polygon(40% 0,100% 0,60% 100%,0 100%);opacity:.9;z-index:-1}
.hero-visual{isolation:isolate}
.hero-chip{position:absolute;background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);padding:12px 16px;display:flex;gap:12px;align-items:center;font-family:var(--f-display);font-size:14px;line-height:1.35}
.hero-chip .ic{color:var(--blue)}
.hero-chip b{display:block;font-size:15.5px;color:var(--ink)}
.hero-chip span{color:var(--ink-3);font-size:13px}
.hero-chip.c1{inset-inline-start:-18px;bottom:28px}
.hero-chip.c2{inset-inline-end:18px;top:20px}
/* placeholder visual when no photo uploaded */
.hero-ph{position:absolute;inset:0;background:radial-gradient(120% 90% at 85% 15%,var(--blue) 0,var(--navy) 55%,var(--navy-2) 100%);display:grid;place-items:center}
.hero-ph::before,.hero-ph::after{content:"";position:absolute;background:rgba(255,255,255,.08);clip-path:polygon(38% 0,100% 0,62% 100%,0 100%)}
.hero-ph::before{width:46%;height:120%;inset-inline-start:8%;top:-10%}
.hero-ph::after{width:24%;height:120%;inset-inline-start:46%;top:-10%;background:rgba(255,255,255,.05)}
.hero-ph .ph-people{position:relative;display:flex;gap:18px;align-items:flex-end}
.hero-ph .ph-people span{display:block;border-radius:50% 50% 14px 14px / 40% 40% 14px 14px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22)}
.hero-ph .ph-people span:nth-child(1){width:84px;height:150px}
.hero-ph .ph-people span:nth-child(2){width:104px;height:190px;background:rgba(255,255,255,.2)}
.hero-ph .ph-people span:nth-child(3){width:84px;height:140px}
.hero-ph small{position:absolute;bottom:16px;inset-inline:16px;text-align:center;color:var(--on-dark-2);font-size:13px}
@media (max-width:920px){.hero-in{grid-template-columns:1fr;gap:40px;padding-block:40px 56px}.hero-chip.c1{inset-inline-start:8px}}

/* Quick service navigator — the signature control */
.qnav{padding-block:0 8px;margin-top:-1px}
.qnav-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;transform:translateY(-34px)}
.qtile{position:relative;display:flex;flex-direction:column;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:18px 16px 16px;text-decoration:none;color:var(--ink);box-shadow:var(--shadow);transition:border-color .2s,transform .2s;overflow:hidden;min-width:0}
.qtile:hover{border-color:var(--blue);transform:translateY(-3px)}
.qbadge{width:50px;height:44px;display:grid;place-items:center;color:var(--blue);background:var(--tint);clip-path:polygon(18% 0,100% 0,82% 100%,0 100%);transition:background .2s,color .2s}
.qtile:hover .qbadge{background:var(--blue);color:#fff}
.qtile strong{font-family:var(--f-display);font-weight:600;font-size:15px;line-height:1.45}
.qtile .go{margin-top:auto;display:flex;align-items:center;gap:6px;font-family:var(--f-display);font-size:13px;color:var(--blue)}
.qtile .go .ic{transition:transform .2s}
.qtile:hover .go .ic{transform:translateX(-4px)}
@media (max-width:900px){.qnav-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.qnav-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.qtile{padding:14px 12px}.qtile strong{font-size:14px}}

/* Sections */
.s{padding-block:76px}
.s.tight{padding-block:48px 76px}
.s.tint{background:var(--tint)}
.s.white{background:var(--surface);border-block:1px solid var(--line)}
.s-head{max-width:740px;margin-bottom:40px;display:grid;gap:10px}
.s-head h2{font-size:clamp(25px,3.1vw,36px)}
.s-head p{color:var(--ink-2);font-size:17.5px}
.s-head-row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:36px}
.s-head-row .s-head{margin:0}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
@media (max-width:1080px){.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.grid-4{grid-template-columns:1fr}}
@media (max-width:900px){.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.grid-2,.grid-3{grid-template-columns:1fr}}

/* Media frames */
.media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--tint);max-width:100%}
.media img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.media-ph{display:grid;place-items:center;color:#fff;background:linear-gradient(150deg,var(--navy) 0%,var(--blue) 100%)}
.media-ph[data-k="hr-consulting"],.media-ph[data-k="training"]{background:linear-gradient(150deg,var(--navy-2) 0%,var(--navy) 60%,var(--blue) 100%)}
.media-ph[data-k="org-development"],.media-ph[data-k="compliance"]{background:linear-gradient(200deg,var(--blue) 0%,var(--navy) 70%)}
.media-ph .ic{position:relative;opacity:.95}
.ph-blade{position:absolute;width:40%;height:140%;top:-20%;inset-inline-start:12%;background:rgba(255,255,255,.09);clip-path:polygon(40% 0,100% 0,60% 100%,0 100%)}
.ph-blade.b2{inset-inline-start:52%;width:22%;background:rgba(255,255,255,.06)}

/* Service cards */
.svc{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);transition:border-color .2s,box-shadow .2s;min-width:0}
.svc:hover{border-color:var(--blue);box-shadow:var(--shadow)}
.svc:hover .media img{transform:scale(1.04)}
.svc-body{display:flex;flex-direction:column;gap:10px;padding:22px 24px 24px;flex:1}
.svc-en{font-family:var(--f-display);font-size:12.5px;letter-spacing:.05em;color:var(--ink-3)}
.svc h3{font-size:20px}
.svc p{color:var(--ink-2);font-size:15.5px}
.svc-go{margin-top:auto;padding-top:8px;display:flex;align-items:center;justify-content:space-between;font-family:var(--f-display);font-weight:600;font-size:15px;color:var(--blue)}
.svc-go .arrowbox{width:40px;height:36px;display:grid;place-items:center;background:var(--tint);color:var(--blue);clip-path:polygon(18% 0,100% 0,82% 100%,0 100%);transition:background .2s,color .2s}
.svc:hover .arrowbox{background:var(--blue);color:#fff}

/* About split */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
.split.top{align-items:start}
@media (max-width:900px){.split{grid-template-columns:1fr;gap:32px}}
.prose{display:grid;gap:14px;max-width:64ch}
.prose p{color:var(--ink-2)}
.prose .lead{font-size:19px;color:var(--ink)}
.about-frame{aspect-ratio:4/3.4;clip-path:polygon(0 0,86% 0,100% 18%,100% 100%,0 100%);border-radius:var(--r)}
.checks{list-style:none;padding:0;display:grid;gap:10px}
.checks li{display:flex;gap:10px;align-items:flex-start}
.checks .ic{color:var(--blue);margin-top:5px}

/* Paths (who we serve) */
.paths{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
@media (max-width:900px){.paths{grid-template-columns:1fr}}
.path{display:flex;flex-direction:column;gap:12px;padding:28px;border-radius:var(--r);background:var(--surface);border:1px solid var(--line);min-width:0}
.path .pic{width:52px;height:52px;border-radius:12px;display:grid;place-items:center;background:var(--tint);color:var(--blue)}
.path h3{font-size:20px}
.path p{color:var(--ink-2);font-size:15.5px}
.path .btn{margin-top:auto;align-self:flex-start}
.path.feature{background:var(--navy);border-color:var(--navy);color:var(--on-dark)}
.path.feature h3{color:#fff}
.path.feature p{color:var(--on-dark-2)}
.path.feature .pic{background:rgba(255,255,255,.1);color:#fff}

/* Vision / mission / values */
.vm{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
@media (max-width:760px){.vm{grid-template-columns:1fr}}
.vm-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:30px;display:grid;gap:12px;align-content:start}
.vm-card .vm-ic{color:var(--blue)}
.vm-card h3{font-size:21px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.vm-card h3 small,.val h3 small{font-size:13px;font-weight:500;color:var(--ink-3);letter-spacing:.03em}
.vm-card p{color:var(--ink-2)}
.vals{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);overflow:hidden}
.val{padding:24px 22px;display:grid;gap:8px;align-content:start;border-inline-start:1px solid var(--line)}
.val:first-child{border-inline-start:0}
.val h3{font-size:17.5px;display:grid;gap:2px}
.val p{font-size:15px;color:var(--ink-2)}
.val-k{font-family:var(--f-display);font-size:13px;color:var(--blue);font-weight:600}
@media (max-width:1000px){.vals{grid-template-columns:repeat(2,minmax(0,1fr))}.val{border-inline-start:0;border-top:1px solid var(--line)}.val:nth-child(-n+2){border-top:0}.val:nth-child(even){border-inline-start:1px solid var(--line)}.val:last-child{grid-column:1/-1}}
@media (max-width:520px){.vals{grid-template-columns:1fr}.val{border-inline-start:0!important;border-top:1px solid var(--line)!important}.val:first-child{border-top:0!important}}

/* Chairman */
.chair{display:grid;grid-template-columns:300px minmax(0,1fr);gap:48px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:40px;position:relative;overflow:hidden}
.chair-photo{aspect-ratio:4/5;border-radius:var(--r-s);overflow:hidden;background:linear-gradient(160deg,var(--navy),var(--blue));display:grid;place-items:center;color:rgba(255,255,255,.85);clip-path:polygon(0 0,100% 0,100% 88%,82% 100%,0 100%)}
.chair-photo img{width:100%;height:100%;object-fit:cover}
.chair-photo .initials{font-family:var(--f-display);font-size:64px;font-weight:600}
.chair-q{color:var(--blue);opacity:.35}
.chair-msg{display:grid;gap:14px}
.chair-msg p{color:var(--ink-2);font-size:17px}
.chair-sign{display:grid;gap:2px;margin-top:8px;padding-top:16px;border-top:1px solid var(--line)}
.chair-sign b{font-family:var(--f-display);font-size:20px;font-weight:600}
.chair-sign span{color:var(--blue);font-family:var(--f-display);font-size:14.5px}
@media (max-width:800px){.chair{grid-template-columns:1fr;padding:24px;gap:26px}.chair-photo{max-width:260px}}

/* Partner band */
.partner{background:var(--navy);color:var(--on-dark);position:relative;overflow:hidden}
.partner::after{content:"";position:absolute;inset-block:-30%;inset-inline-end:-6%;width:38%;background:linear-gradient(160deg,var(--blue),transparent);clip-path:polygon(40% 0,100% 0,60% 100%,0 100%);opacity:.35}
.partner .wrap{position:relative;z-index:1;padding-block:72px;display:grid;gap:16px;max-width:900px;margin-inline:auto;text-align:center;justify-items:center}
.partner h2{color:#fff;font-size:clamp(24px,3vw,34px)}
.partner p{color:var(--on-dark-2);font-size:18px;max-width:62ch}
.partner .tag{font-family:var(--f-display);font-size:19px;color:#fff;font-weight:500}

/* Facts table */
.facts{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.facts th,.facts td{padding:14px 20px;text-align:start;border-bottom:1px solid var(--line);font-size:15.5px;vertical-align:top}
.facts th{width:36%;font-family:var(--f-display);font-weight:500;color:var(--ink-3)}
.facts tr:last-child th,.facts tr:last-child td{border-bottom:0}

/* Clients & testimonials */
.clients{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px}
.client{height:96px;border:1px solid var(--line);background:var(--surface);border-radius:var(--r-s);display:grid;place-items:center;padding:14px;text-decoration:none;color:var(--ink-2);font-family:var(--f-display);font-size:15px;text-align:center;position:relative}
.client img{max-height:62px;width:auto;object-fit:contain;filter:grayscale(1);opacity:.8;transition:filter .2s,opacity .2s}
.client:hover img{filter:none;opacity:1}
.client .chip{position:absolute;top:6px;inset-inline-start:6px}
.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:22px}
.quote{margin:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:28px;display:flex;flex-direction:column;gap:16px;min-width:0}
.quote .ic{color:var(--blue);opacity:.5}
.quote blockquote{margin:0;font-size:17px;color:var(--ink)}
.quote figcaption{margin-top:auto;display:flex;gap:12px;align-items:center}
.quote .av{width:44px;height:44px;border-radius:50%;background:var(--tint);color:var(--blue);display:grid;place-items:center;font-family:var(--f-display);font-weight:600;flex:none}
.quote figcaption b{display:block;font-family:var(--f-display);font-weight:600;font-size:15.5px}
.quote figcaption span{font-size:14px;color:var(--ink-3)}

/* Chips */
.chip{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-display);font-size:12.5px;font-weight:500;background:var(--tint);color:var(--blue);padding:3px 11px;border-radius:99px;line-height:1.6}
.chip-ex{background:var(--gold);color:#1F262C}
.chip-ok{background:var(--ok-bg);color:var(--ok)}

/* Jobs */
.jobs{display:grid;gap:14px}
.job{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 28px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:22px 26px;transition:border-color .2s}
.job:hover{border-color:var(--blue)}
.job h3{font-size:19.5px;display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center}
.job h3 a{color:var(--ink);text-decoration:none}
.job h3 a:hover{color:var(--blue)}
.job p{color:var(--ink-2);font-size:15.5px;margin-top:6px}
.meta{display:flex;flex-wrap:wrap;gap:6px 18px;color:var(--ink-3);font-size:14.5px;margin-top:8px}
.meta span{display:inline-flex;align-items:center;gap:6px}
.meta .ic{color:var(--blue)}
@media (max-width:640px){.job{grid-template-columns:1fr;padding:20px}.job .btn{justify-self:start}}
.jobs-tools{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:22px}
.jobs-tools input{flex:1 1 260px}
.empty{background:var(--surface);border:1px dashed var(--line-2);border-radius:var(--r);padding:44px 28px;text-align:center;display:grid;gap:10px;justify-items:center}
.empty h3{font-size:21px}
.empty p{color:var(--ink-2);max-width:52ch}
.empty .acts{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:10px}
.detail{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:40px;align-items:start}
@media (max-width:980px){.detail{grid-template-columns:1fr}}
.detail-main{display:grid;gap:26px;min-width:0}
.detail-main h2{font-size:21px;margin-bottom:6px}
.side-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:26px;display:grid;gap:14px;position:sticky;top:calc(96px + env(safe-area-inset-top,0px))}
.side-card h2{font-size:20px}
.kv{display:grid;gap:10px}
.kv div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);padding-bottom:10px;font-size:15px}
.kv div:last-child{border-bottom:0;padding-bottom:0}
.kv span{color:var(--ink-3)}

/* Forms */
.form-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:32px;min-width:0}
@media (max-width:560px){.form-card{padding:22px 18px}}
.form-card > h2{font-size:22px;margin-bottom:6px}
.form-card > p.muted{margin-bottom:22px}
.tabs{display:flex;gap:6px;background:var(--tint);padding:5px;border-radius:10px;margin-bottom:26px;flex-wrap:wrap}
.tabs button{flex:1 1 150px;font-family:var(--f-display);font-weight:600;font-size:15px;padding:12px 14px;border:0;border-radius:7px;background:transparent;color:var(--ink-2);cursor:pointer;display:inline-flex;gap:8px;justify-content:center;align-items:center}
.tabs button[aria-selected="true"]{background:var(--surface);color:var(--blue);box-shadow:0 1px 3px rgba(14,63,105,.14)}
.fgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px}
.fgrid .full{grid-column:1/-1}
@media (max-width:640px){.fgrid{grid-template-columns:1fr}}
.fld{display:flex;flex-direction:column;gap:6px;min-width:0}
.fld label{font-family:var(--f-display);font-size:14.5px;font-weight:500;color:var(--ink)}
.fld label .req{color:var(--err)}
.fld label .opt{color:var(--ink-3);font-weight:400;font-size:13px}
.fld input,.fld select,.fld textarea{font:inherit;font-size:16px;color:var(--ink);background:var(--surface);border:1.5px solid var(--line-2);border-radius:8px;padding:11px 13px;width:100%;transition:border-color .2s,box-shadow .2s}
.fld textarea{min-height:120px;resize:vertical;line-height:1.7}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 22%,transparent)}
.fld .hint{font-size:13px;color:var(--ink-3)}
.drop{position:relative;border:1.5px dashed var(--line-2);border-radius:10px;padding:20px;display:flex;gap:14px;align-items:center;background:var(--paper);transition:border-color .2s,background .2s}
.drop:hover,.drop.has{border-color:var(--blue);background:var(--tint)}
.drop .ic{color:var(--blue)}
.drop input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.drop b{font-family:var(--f-display);font-weight:600;font-size:15px;display:block}
.drop span{font-size:13.5px;color:var(--ink-3)}
.drop .fname{color:var(--ink);font-weight:500;word-break:break-all}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;color:var(--ink-2)}
.consent input{margin-top:6px;width:18px;height:18px;accent-color:var(--blue);flex:none}
.form-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:6px}
.alert{border-radius:10px;padding:14px 18px;font-size:15.5px;margin-bottom:20px}
.alert-ok{background:var(--ok-bg);color:var(--ok);border:1px solid color-mix(in srgb,var(--ok) 30%,transparent)}
.alert-err{background:var(--err-bg);color:var(--err);border:1px solid color-mix(in srgb,var(--err) 30%,transparent)}
.ferr{font-size:13.5px;color:var(--err)}

/* Contact cards */
.contact-cards{display:grid;gap:12px}
.cc{display:flex;gap:14px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-s);padding:16px 18px;text-decoration:none;color:var(--ink);min-width:0}
a.cc:hover{border-color:var(--blue)}
.cc .cic{width:42px;height:42px;border-radius:10px;background:var(--tint);color:var(--blue);display:grid;place-items:center;flex:none}
.cc small{display:block;color:var(--ink-3);font-size:13px}
.cc b{font-family:var(--f-display);font-weight:500;font-size:15.5px;word-break:break-word}
.where{background:var(--tint);border-radius:var(--r-s);padding:18px 20px;font-size:15px;color:var(--ink-2);display:flex;gap:12px}
.where .ic{color:var(--blue);margin-top:4px}

/* Articles */
.art{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);transition:border-color .2s;min-width:0}
.art:hover{border-color:var(--blue)}
.art:hover .media img{transform:scale(1.04)}
.art-body{padding:22px 24px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
.art-date{font-size:13.5px;color:var(--ink-3)}
.art h3{font-size:19px}
.art p{color:var(--ink-2);font-size:15.5px}
.art .more{margin-top:auto;font-family:var(--f-display);font-weight:600;color:var(--blue);font-size:15px;display:flex;align-items:center;gap:6px}
.article{max-width:760px;margin-inline:auto}
.article-cover{border-radius:var(--r);margin-bottom:32px;aspect-ratio:16/8}
.article-body{font-size:17.5px;line-height:1.95}
.article-body h2{font-size:23px;margin:34px 0 10px}
.article-body p{margin-bottom:16px;color:var(--ink)}
.article-body ul{padding-inline-start:24px;margin-bottom:16px}
.article-body li{margin-bottom:8px}
.article-body li::marker{color:var(--blue)}
.article-foot{margin-top:40px;padding-top:24px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center}

/* Courses */
.course{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:24px;display:flex;flex-direction:column;gap:10px;min-width:0}
.course h3{font-size:19px}
.course p{color:var(--ink-2);font-size:15.5px}
.course .btn{margin-top:auto;align-self:flex-start}

/* Page head */
.phead{background:var(--navy);color:var(--on-dark);position:relative;overflow:hidden}
.phead::after{content:"";position:absolute;inset-block:-40%;inset-inline-end:-4%;width:30%;background:linear-gradient(160deg,var(--blue),transparent 80%);clip-path:polygon(40% 0,100% 0,60% 100%,0 100%);opacity:.45}
.phead-in{position:relative;z-index:1;padding-block:50px 56px;display:grid;gap:12px}
.phead .eyebrow{color:var(--on-dark-2)}
.phead .eyebrow::before{background:var(--blue-2)}
.phead h1{color:#fff;font-size:clamp(28px,4vw,44px);font-weight:700}
.phead-lead{color:var(--on-dark-2);max-width:64ch;font-size:18px}
.crumbs{font-size:14px;color:var(--on-dark-2);display:flex;gap:8px;flex-wrap:wrap}
.crumbs a{color:var(--on-dark-2);text-decoration:none}
.crumbs a:hover{color:#fff}

/* Service detail */
.svc-hero-media{border-radius:var(--r);aspect-ratio:16/9}
.note{display:flex;gap:12px;background:var(--tint);border-radius:var(--r-s);padding:16px 20px;font-size:15px}
.note .ic{color:var(--blue);margin-top:4px}
.others{display:grid;gap:8px}
.others a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-radius:8px;border:1px solid var(--line);text-decoration:none;color:var(--ink);font-family:var(--f-display);font-size:15px;background:var(--surface)}
.others a:hover{border-color:var(--blue);color:var(--blue)}

/* CTA band */
.cta{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.cta::before{content:"";position:absolute;inset-block:-40%;inset-inline-start:-5%;width:30%;background:linear-gradient(160deg,var(--blue),transparent 80%);clip-path:polygon(40% 0,100% 0,60% 100%,0 100%);opacity:.4}
.cta .wrap{position:relative;padding-block:60px;display:flex;flex-wrap:wrap;gap:24px 40px;align-items:center;justify-content:space-between}
.cta h2{color:#fff;font-size:clamp(22px,2.8vw,30px);max-width:26ch}
.cta p{color:var(--on-dark-2);margin-top:8px;max-width:54ch}
.cta .acts{display:flex;gap:12px;flex-wrap:wrap}

/* Footer */
.ftr{background:var(--navy-2);color:var(--on-dark-2);font-size:15px}
.ftr-grid{display:grid;grid-template-columns:1.4fr 1fr 0.8fr 1.3fr;gap:36px;padding-block:56px 36px}
@media (max-width:980px){.ftr-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.ftr-grid{grid-template-columns:1fr}}
.ftr-brand{display:grid;gap:16px;align-content:start}
.ftr-brand img{background:#fff;border-radius:8px;padding:6px;width:80px;height:auto}
.ftr-h{color:#fff;font-size:16px;margin-bottom:14px}
.ftr-list{list-style:none;padding:0;display:grid;gap:9px}
.ftr a{color:var(--on-dark-2);text-decoration:none}
.ftr a:hover{color:#fff}
.ftr-contact li{display:flex;gap:10px;align-items:flex-start}
.ftr-contact .ic{margin-top:5px;color:var(--blue-2)}
.ftr-contact small{display:block;font-size:12.5px;opacity:.75}
.social{display:flex;gap:8px}
.social a{width:40px;height:40px;border-radius:10px;border:1px solid rgba(255,255,255,.18);display:grid;place-items:center;font-family:var(--f-display);font-size:14px}
.social a:hover{border-color:#fff}
.ftr-bottom{border-top:1px solid rgba(255,255,255,.1);padding-block:18px;font-size:13.5px}

/* WhatsApp */
.wa-float{position:fixed;z-index:40;inset-inline-start:calc(18px + env(safe-area-inset-left,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));width:56px;height:56px;border-radius:50%;background:var(--wa);color:#fff;display:grid;place-items:center;box-shadow:0 6px 18px rgba(0,0,0,.2)}
.wa-float:hover{transform:scale(1.05)}
.split-contact{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
@media (max-width:900px){.split-contact{grid-template-columns:1fr}}
.quote .chip-ex,.course .chip-ex{align-self:flex-start}

/* Language switch */
.lang-btn{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-display);font-weight:600;font-size:14.5px;color:var(--ink);text-decoration:none;border:1.5px solid var(--line);border-radius:8px;padding:8px 12px;flex:none}
.lang-btn:hover{border-color:var(--blue);color:var(--blue)}
.lang-btn .ic{color:var(--blue)}
@media (min-width:1181px){.lang-btn{margin-inline-start:6px}}
@media (max-width:1180px){.lang-btn{margin-inline-start:auto}.menu-btn{margin-inline-start:0}}
/* LTR (English) */
[dir="ltr"] body{line-height:1.7}
[dir="ltr"] .ic-arrow{transform:scaleX(-1)}
[dir="ltr"] .btn:hover .ic-arrow,[dir="ltr"] .qtile:hover .go .ic-arrow{transform:scaleX(-1) translateX(-4px)}
[dir="ltr"] .hero h1{font-size:clamp(30px,4vw,48px);line-height:1.2}
[dir="ltr"] .eyebrow{letter-spacing:.04em}
[dir="ltr"] .hero-frame{clip-path:polygon(0 0,86% 0,100% 22%,100% 100%,0 100%)}
[dir="ltr"] .about-frame{clip-path:polygon(14% 0,100% 0,100% 100%,0 100%,0 18%)}

/* Career development sub-services */
.subs{display:grid;gap:16px}
.sub{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:24px;align-items:start}
.sub .qbadge{width:56px;height:50px}
.sub h3{font-size:19.5px;margin-bottom:6px}
.sub p{color:var(--ink-2);font-size:15.5px}
.sub .checks{margin-top:10px;font-size:15px}
.sub .btn{margin-top:14px}
@media (max-width:560px){.sub{grid-template-columns:1fr;padding:20px}}

/* Compact home */
.qtile p{font-size:14px;color:var(--ink-2);line-height:1.65}
.about-strip{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px 48px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:32px 36px}
@media (max-width:560px){.about-strip{padding:24px 20px}}
.about-strip .prose{flex:1 1 520px;gap:10px}
.about-strip h2{font-size:clamp(22px,2.6vw,30px)}
.about-strip-acts{display:flex;flex-wrap:wrap;gap:10px}

/* ===== Home v3: inspired layout ===== */
/* Top utility bar */
.topbar{background:var(--navy-2);color:var(--on-dark-2);font-size:13px}
.topbar-in{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:36px}
.topbar a{color:var(--on-dark-2);text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.topbar a:hover{color:#fff}
.tb-tag{font-family:var(--f-display);letter-spacing:.03em}
.tb-right{display:flex;align-items:center;gap:18px}
.tb-social{display:inline-flex;gap:10px;padding-inline-start:14px;border-inline-start:1px solid rgba(255,255,255,.18)}
@media (max-width:760px){.tb-tag,.tb-mail{display:none}.topbar-in{justify-content:center}}

/* Video hero */
.vhero{position:relative;isolation:isolate;overflow:hidden;background:var(--navy-2);color:#fff;min-height:clamp(520px,78vh,760px);display:flex;align-items:center}
.vhero-media{position:absolute;inset:0;z-index:-2}
.vhero-media video,.vhero-media img{width:100%;height:100%;object-fit:cover;display:block}
.vhero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(8,38,64,calc(.35 * var(--ov))) 0%,rgba(8,38,64,calc(.72 * var(--ov))) 55%,rgba(8,38,64,calc(.9 * var(--ov))) 100%)}
[dir="ltr"] .vhero::after{background:linear-gradient(270deg,rgba(8,38,64,calc(.35 * var(--ov))) 0%,rgba(8,38,64,calc(.72 * var(--ov))) 55%,rgba(8,38,64,calc(.9 * var(--ov))) 100%)}
.vhero:not(.has-video) .vhero-media{background:radial-gradient(110% 120% at 15% 20%,var(--blue) 0%,var(--navy) 50%,var(--navy-2) 100%)}
.vh-blade{position:absolute;top:-20%;height:140%;background:rgba(255,255,255,.07);clip-path:polygon(38% 0,100% 0,62% 100%,0 100%)}
.vh-blade.b1{inset-inline-end:8%;width:26%}
.vh-blade.b2{inset-inline-end:30%;width:12%;background:rgba(255,255,255,.05)}
.vh-blade.b3{inset-inline-end:-6%;width:18%;background:rgba(62,149,218,.25)}
.vhero-in{padding-block:80px;display:grid;gap:18px;justify-items:start;max-width:var(--wrap);width:100%}
.vhero-in > *{max-width:720px}
.vh-eyebrow{font-family:var(--f-display);font-size:14.5px;font-weight:500;color:#fff;display:inline-flex;gap:8px;align-items:center;justify-self:start;width:fit-content;background:#0B2E4F;border:1px solid rgba(124,192,245,.35);padding:5px 18px 5px 5px;border-radius:99px;box-shadow:0 6px 20px rgba(8,38,64,.35)}
[dir="rtl"] .vh-eyebrow{padding:5px 5px 5px 18px}
.vh-eyebrow img{height:32px;width:32px;object-fit:contain;display:block;background:#fff;border-radius:50%;padding:4px}
.vh-eyebrow b{color:#7CC0F5;font-weight:700}
.vh-eyebrow .vh-sep{width:1px;height:16px;background:rgba(255,255,255,.3);margin-inline:2px}
.vh-eyebrow .vh-dot{color:#E2C07A;font-weight:700}
.vhero h1{color:#fff;font-size:clamp(34px,5vw,60px);font-weight:700;line-height:1.22}
[dir="ltr"] .vhero h1{line-height:1.12}
.vh-lead{color:var(--on-dark-2);font-size:clamp(17px,1.6vw,19.5px);max-width:60ch}
.vh-note{font-size:13px;color:var(--gold);margin-top:8px}

/* Numbered services */
.nsvc-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
@media (max-width:1040px){.nsvc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.nsvc-grid{grid-template-columns:1fr}}
.nsvc{position:relative;display:flex;flex-direction:column;gap:12px;padding:28px 24px 24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);text-decoration:none;color:var(--ink);overflow:hidden;transition:border-color .25s,transform .25s,box-shadow .25s;min-width:0}
.nsvc::before{content:"";position:absolute;inset-inline:0;top:0;height:4px;background:linear-gradient(90deg,var(--blue),var(--navy));transform:scaleX(0);transform-origin:var(--origin,right);transition:transform .3s}
[dir="ltr"] .nsvc{--origin:left}
.nsvc:hover{border-color:var(--blue);transform:translateY(-4px);box-shadow:var(--shadow)}
.nsvc:hover::before{transform:scaleX(1)}
.nsvc-num{font-family:var(--f-display);font-size:46px;font-weight:700;line-height:1;color:transparent;-webkit-text-stroke:1.5px var(--line-2);font-variant-numeric:tabular-nums;transition:-webkit-text-stroke-color .25s}
.nsvc:hover .nsvc-num{-webkit-text-stroke-color:var(--blue)}
.nsvc-ic{position:absolute;top:28px;inset-inline-end:24px;width:50px;height:44px;display:grid;place-items:center;color:var(--blue);background:var(--tint);clip-path:polygon(18% 0,100% 0,82% 100%,0 100%);transition:background .25s,color .25s}
.nsvc:hover .nsvc-ic{background:var(--blue);color:#fff}
.nsvc h3{font-size:20px;margin-top:6px}
.nsvc p{color:var(--ink-2);font-size:15.5px}
.nsvc-go{margin-top:auto;padding-top:6px;display:flex;align-items:center;gap:8px;font-family:var(--f-display);font-weight:600;font-size:15px;color:var(--blue)}

/* Why section */
.why{align-items:center}
.why-frame{aspect-ratio:4/4.4;border-radius:var(--r);clip-path:polygon(0 0,100% 0,100% 86%,84% 100%,0 100%)}
.why-list{list-style:none;padding:0;margin:0;display:grid;gap:0;counter-reset:why}
.why-list li{counter-increment:why;display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:18px;padding-block:16px;border-bottom:1px solid var(--line)}
.why-list li:first-child{border-top:1px solid var(--line)}
.why-list li::before{content:counter(why,decimal-leading-zero);grid-row:span 2;font-family:var(--f-display);font-weight:600;font-size:15px;color:var(--blue);padding-top:2px;font-variant-numeric:tabular-nums}
.why-list b{font-family:var(--f-display);font-weight:600;font-size:17.5px}
.why-list span{color:var(--ink-2);font-size:15.5px}

/* Jobs band */
.jobs-band{background:var(--tint);border-block:1px solid var(--line)}
.jobs-band-in{display:flex;flex-wrap:wrap;align-items:center;gap:18px 28px;padding-block:32px}
.jobs-band-in > div{flex:1 1 360px;min-width:0}
.jb-ic{width:60px;height:56px;display:grid;place-items:center;background:var(--blue);color:#fff;clip-path:polygon(18% 0,100% 0,82% 100%,0 100%);flex:none}
.jobs-band h2{font-size:22px;display:flex;align-items:center;gap:10px}
.jb-count{font-size:14px;background:var(--blue);color:#fff;border-radius:99px;padding:1px 10px;font-variant-numeric:tabular-nums}
.jobs-band p{color:var(--ink-2);margin-top:4px}

/* Client marquee */
.marquee{display:flex;overflow:hidden;gap:0;margin-top:8px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{display:flex;gap:16px;padding-inline-end:16px;flex:none;animation:mq 40s linear infinite}
[dir="rtl"] .marquee-track{animation-name:mq-rtl}
.marquee:hover .marquee-track{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-100%)}}
@keyframes mq-rtl{to{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){.marquee{flex-wrap:wrap;justify-content:center;-webkit-mask-image:none;mask-image:none}.marquee-track{animation:none;flex-wrap:wrap;justify-content:center}.marquee-track[aria-hidden]{display:none}}
.mq-item{position:relative;width:180px;height:92px;flex:none;display:grid;place-items:center;padding:14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-s);font-family:var(--f-display);font-size:15px;color:var(--ink-2);text-align:center}
.mq-item img{max-height:60px;width:auto;object-fit:contain}
.mq-item .chip{position:absolute;top:6px;inset-inline-start:6px}

/* Final CTA */
.final-cta{background:var(--navy);color:#fff;position:relative;overflow:hidden;isolation:isolate}
.final-cta::before,.final-cta::after{content:"";position:absolute;top:-30%;height:160%;z-index:-1;clip-path:polygon(38% 0,100% 0,62% 100%,0 100%)}
.final-cta::before{inset-inline-start:6%;width:18%;background:rgba(62,149,218,.3)}
.final-cta::after{inset-inline-end:4%;width:24%;background:rgba(255,255,255,.05)}
.final-cta-in{padding-block:80px;text-align:center;display:grid;gap:14px;justify-items:center}
.final-cta h2{color:#fff;font-size:clamp(26px,3.4vw,40px)}
.final-cta p{color:var(--on-dark-2);font-size:18px;max-width:52ch}
.topbar a{white-space:nowrap}
@media (max-width:760px){.topbar-in{justify-content:space-between}.tb-right{width:100%;justify-content:space-between}.tb-social{border:0;padding:0}}
/* English: mirror the hero photo/video so people stay opposite the text */
[dir="ltr"] .vhero-media img,[dir="ltr"] .vhero-media video{transform:scaleX(-1)}
[dir="ltr"] .phead-bg img,[dir="ltr"] .band-bg img{transform:scaleX(-1)}

/* Final CTA with background photo */
.final-cta-bg{position:absolute;inset:0;z-index:-2}
.final-cta-bg img{width:100%;height:100%;object-fit:cover;display:block}
.final-cta.has-img::before{inset:0;top:0;height:auto;width:auto;clip-path:none;background:linear-gradient(180deg,rgba(8,38,64,calc(.72 * var(--ov))),rgba(8,38,64,calc(.82 * var(--ov))))}
.final-cta.has-img::after{display:none}

/* ===== Background photos: inner page headers, contact bands, service cards ===== */
.phead{isolation:isolate}
.phead-bg,.band-bg,.nsvc-bg{position:absolute;inset:0;z-index:-2;overflow:hidden}
.phead-bg img,.band-bg img,.nsvc-bg img{width:100%;height:100%;object-fit:cover;display:block}
.phead.has-img::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(8,38,64,calc(0 * var(--ov))) 0%,rgba(8,38,64,calc(.08 * var(--ov))) 30%,rgba(8,38,64,calc(.7 * var(--ov))) 58%,rgba(8,38,64,calc(.88 * var(--ov))) 100%)}
[dir="ltr"] .phead.has-img::before{background:linear-gradient(270deg,rgba(8,38,64,calc(0 * var(--ov))) 0%,rgba(8,38,64,calc(.08 * var(--ov))) 30%,rgba(8,38,64,calc(.7 * var(--ov))) 58%,rgba(8,38,64,calc(.88 * var(--ov))) 100%)}
.phead.has-img::after{display:none}
.phead.has-img h1,.phead.has-img .phead-lead{text-shadow:0 2px 12px rgba(8,38,64,.45)}
@media (max-width:760px){.phead.has-img::before,[dir="ltr"] .phead.has-img::before{background:rgba(8,38,64,calc(.72 * var(--ov)))}}
.phead.has-img .phead-in{padding-block:clamp(90px,9vw,130px) clamp(96px,9.5vw,140px)}
.phead-bg img{object-position:center 35%}

.cta,.partner{isolation:isolate}
.cta.has-img::before,.partner.has-img::after{inset:0;width:auto;height:auto;clip-path:none;opacity:1;background:linear-gradient(180deg,rgba(8,38,64,calc(.74 * var(--ov))),rgba(8,38,64,calc(.86 * var(--ov))));z-index:-1}
.partner .band-bg{z-index:-2}
.partner.has-img .wrap{z-index:1}
/* service cards with photo */
.nsvc{isolation:isolate}
.nsvc.has-img{border-color:transparent;color:#fff;min-height:360px;justify-content:flex-end}
.nsvc.has-img::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(8,38,64,calc(.15 * var(--ov))) 0%,rgba(8,38,64,calc(.55 * var(--ov))) 40%,rgba(8,38,64,calc(.92 * var(--ov))) 100%);transition:background .3s}
.nsvc.has-img:hover::after{background:linear-gradient(180deg,rgba(14,63,105,calc(.35 * var(--ov))) 0%,rgba(14,63,105,calc(.7 * var(--ov))) 40%,rgba(8,38,64,calc(.95 * var(--ov))) 100%)}
.nsvc.has-img .nsvc-bg img{transition:transform .5s}
.nsvc.has-img:hover .nsvc-bg img{transform:scale(1.06)}
.nsvc.has-img h3{color:#fff}
.nsvc.has-img p{color:rgba(255,255,255,.85)}
.nsvc.has-img .nsvc-go{color:#fff}
.nsvc.has-img .nsvc-num{position:absolute;top:24px;inset-inline-start:24px;-webkit-text-stroke-color:rgba(255,255,255,.75)}
.nsvc.has-img .nsvc-ic{background:rgba(255,255,255,.92);color:var(--blue)}
.nsvc.has-img:hover .nsvc-ic{background:var(--blue);color:#fff}
.nsvc.has-img{padding-top:110px}
.nsvc.has-img h3{margin-top:auto}
.nsvc.has-img .nsvc-go{margin-top:6px}

/* Colored words from the texts editor */
.tx-blue{color:var(--blue)}
.tx-gold{color:#9A7425}
.vhero .tx-blue,.phead .tx-blue,.cta .tx-blue,.final-cta .tx-blue,.partner .tx-blue,.nsvc.has-img .tx-blue,.path.feature .tx-blue,.ftr .tx-blue,.topbar .tx-blue{color:#7CC0F5}
.vhero .tx-gold,.phead .tx-gold,.cta .tx-gold,.final-cta .tx-gold,.partner .tx-gold,.nsvc.has-img .tx-gold,.path.feature .tx-gold,.ftr .tx-gold,.topbar .tx-gold{color:#E2C07A}

/* Intro video button + modal */
.play-btn{display:inline-flex;align-items:center;gap:12px;background:none;border:0;color:#fff;font-family:var(--f-display);font-weight:600;font-size:15.5px;cursor:pointer;padding:6px 4px}
.play-ic{position:relative;width:48px;height:48px;border-radius:50%;background:#fff;color:var(--navy);display:grid;place-items:center;flex:none}
.play-ic .ic{margin-left:3px}
.play-ic::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid rgba(255,255,255,.55);animation:pulse 2s ease-out infinite}
@keyframes pulse{0%{transform:scale(.9);opacity:1}100%{transform:scale(1.35);opacity:0}}
.play-btn:hover .play-ic{background:var(--blue-2);color:#fff}
.vmodal{border:0;padding:0;background:transparent;width:min(960px,92vw);max-width:none;overflow:visible}
.vmodal::backdrop{background:rgba(5,20,35,.85)}
.vmodal-frame{aspect-ratio:16/9;width:100%;background:#000;border-radius:12px;overflow:hidden}
.vmodal-frame iframe,.vmodal-frame video{width:100%;height:100%;border:0;display:block}
.vmodal-close{position:absolute;top:-48px;inset-inline-end:0;width:40px;height:40px;border-radius:50%;border:0;background:#fff;color:var(--navy);display:grid;place-items:center;cursor:pointer}

/* Intro video over the "Why ProTalent" photo */
.why-frame.has-video::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,38,64,.05),rgba(8,38,64,.45));pointer-events:none}
.why-play{position:absolute;inset:0;z-index:1;flex-direction:column;justify-content:center;gap:14px;width:100%;padding:0}
.why-play .play-ic{width:84px;height:84px;background:rgba(255,255,255,.95);box-shadow:0 10px 30px rgba(8,38,64,.35)}
.why-play-t{background:rgba(8,38,64,.7);padding:6px 16px;border-radius:99px;font-size:15px}
.why-play:hover .play-ic{transform:scale(1.06)}
.play-ic{transition:transform .2s,background .2s,color .2s}

/* Intro video section (home) */
.vsec-head{text-align:center;margin-inline:auto;justify-items:center}
.vplayer{position:relative;max-width:980px;margin-inline:auto;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:linear-gradient(150deg,var(--navy),var(--blue));box-shadow:var(--shadow);cursor:pointer;isolation:isolate}
.vplayer > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.vplayer:not(.playing)::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(8,38,64,.15),rgba(8,38,64,.55))}
.vplayer-btn{position:absolute;inset:0;width:100%;flex-direction:column;justify-content:center;gap:14px}
.vplayer-btn .play-ic,.vplayer-empty .play-ic{width:92px;height:92px;background:rgba(255,255,255,.95);box-shadow:0 10px 30px rgba(8,38,64,.35)}
.vplayer:hover .play-ic{transform:scale(1.06)}
.vplayer.playing{cursor:default;background:#000}
.vplayer iframe,.vplayer video{position:absolute;inset:0;width:100%;height:100%;border:0}
.vplayer-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;color:#fff;padding:24px;cursor:default}
.vplayer-empty b{font-family:var(--f-display);font-size:20px}
.vplayer-empty span:last-child{max-width:52ch;font-size:14.5px;color:var(--on-dark-2);background:rgba(8,38,64,.6);padding:8px 14px;border-radius:10px}

.why-video{max-width:none;margin:0;width:100%}
.vplayer > video.vposter{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;pointer-events:none}

:root{--ov:1}
.vhero h1,.vhero p,.cta h2,.cta p,.final-cta h2,.final-cta p,.partner h2,.partner p,.nsvc.has-img h3,.nsvc.has-img p{text-shadow:0 2px 14px rgba(8,38,64,.5)}
.tx-navy{color:var(--navy);font-weight:700}
.vhero .tx-navy,.phead .tx-navy,.cta .tx-navy,.final-cta .tx-navy,.partner .tx-navy,.nsvc.has-img .tx-navy,.path.feature .tx-navy,.ftr .tx-navy,.topbar .tx-navy{color:#fff}
.vhero .btn-light{background:var(--blue);color:#fff;border-color:transparent;box-shadow:0 8px 22px rgba(28,120,196,.35)}
.vhero .btn-light:hover{background:var(--blue-2);color:#fff}
.vhero .btn-outline-light{background:var(--navy);color:#fff;border-color:rgba(255,255,255,.35)}
.vhero .btn-outline-light:hover{background:var(--navy-2);border-color:#fff}
.vhero .vh-lead{color:#fff;font-family:var(--f-display);font-weight:500;font-size:clamp(17.5px,1.7vw,20.5px);line-height:1.85;text-shadow:0 2px 10px rgba(8,38,64,.6)}
.phead .crumbs,.phead .crumbs a{color:rgba(255,255,255,.88)}
.phead.has-img .crumbs{text-shadow:0 1px 8px rgba(8,38,64,.6)}

/* Services v2 (home) */
.svc2{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,2fr);gap:22px;align-items:stretch}
.svc2-intro{position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(160deg,#0B2E4F 0%,var(--navy) 60%,#15528A 100%);color:#fff;border-radius:var(--r);padding:36px 30px;display:flex;flex-direction:column;gap:14px}
.svc2-mark{display:none}
.svc2-mark img{width:100%;display:block}
.svc2-kicker{font-family:var(--f-display);font-weight:600;font-size:14px;color:#7CC0F5;letter-spacing:.04em;display:flex;align-items:center;gap:10px}
.svc2-kicker::before{content:"";width:26px;height:3px;border-radius:3px;background:#7CC0F5}
.svc2-intro h2{color:#fff;font-size:clamp(25px,2.4vw,32px);line-height:1.35}
.svc2-intro > p{color:rgba(255,255,255,.82);font-size:16px}
.svc2-facts{list-style:none;margin:6px 0 0;padding:16px 0 0;border-top:1px solid rgba(255,255,255,.15);display:flex;gap:28px}
.svc2-facts b{display:block;font-family:var(--f-display);font-size:26px;color:#fff;line-height:1.2}
.svc2-facts span{font-size:14px;color:rgba(255,255,255,.7)}
.svc2-actions{margin-top:auto;padding-top:10px;display:flex;gap:10px;flex-wrap:wrap}
.svc2-actions .btn-light{background:var(--blue);color:#fff}
.svc2-actions .btn-light:hover{background:var(--blue-2)}
.svc2-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.svc2-card{position:relative;display:flex;flex-direction:column;gap:10px;padding:26px 24px 22px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);text-decoration:none;color:var(--ink);min-width:0;transition:border-color .25s,box-shadow .25s,transform .25s}
.svc2-card::after{content:"";position:absolute;inset-block:22px;inset-inline-start:0;width:4px;border-radius:0 4px 4px 0;background:var(--blue);transform:scaleY(.35);transition:transform .3s}
[dir="rtl"] .svc2-card::after{border-radius:4px 0 0 4px}
.svc2-card:hover{border-color:rgba(28,120,196,.45);box-shadow:var(--shadow);transform:translateY(-3px)}
.svc2-card:hover::after{transform:scaleY(1)}
.svc2-top{display:flex;align-items:center;justify-content:space-between}
.svc2-ic{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:var(--tint);color:var(--blue);transition:background .25s,color .25s}
.svc2-card:hover .svc2-ic{background:var(--navy);color:#fff}
.svc2-num{font-family:var(--f-display);font-weight:700;font-size:15px;color:var(--ink-3,#8A97A3);letter-spacing:.06em}
.svc2-who{align-self:flex-start;font-size:12.5px;font-weight:600;color:var(--navy);background:#EAF2F9;border-radius:99px;padding:3px 12px}
.svc2-card h3{font-size:19.5px;margin:2px 0 0;color:var(--navy)}
.svc2-card > p{color:var(--ink-2);font-size:15px;margin:0}
.svc2-card ul{list-style:none;margin:2px 0 0;padding:12px 0 0;border-top:1px dashed var(--line);display:grid;gap:7px}
.svc2-card li{display:flex;gap:8px;align-items:flex-start;font-size:14.5px;color:var(--ink)}
.svc2-card li svg{flex:none;color:var(--blue);margin-top:4px}
.svc2-go{margin-top:auto;padding-top:8px;display:flex;align-items:center;gap:8px;font-family:var(--f-display);font-weight:600;font-size:15px;color:var(--blue)}
.svc2-card:hover .svc2-go svg{transform:translateX(-4px)}
[dir="ltr"] .svc2-card:hover .svc2-go svg{transform:translateX(4px)}
.svc2-go svg{transition:transform .25s}
@media (max-width:1020px){.svc2{grid-template-columns:1fr}}
@media (max-width:640px){.svc2-grid{grid-template-columns:1fr}.svc2-intro{padding:28px 22px}}

/* Services v2 option 2: rows */
.svr{display:grid;border-top:1px solid var(--line)}
.svr-row{display:grid;grid-template-columns:56px 60px minmax(0,1.4fr) minmax(0,1.3fr) 48px;gap:22px;align-items:center;padding:26px 18px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink);transition:background .25s;border-radius:var(--r-s)}
.svr-num{font-family:var(--f-display);font-weight:700;font-size:30px;color:transparent;-webkit-text-stroke:1.3px var(--line-2)}
.svr-ic{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--tint);color:var(--blue);transition:.25s}
.svr-main b{display:block;font-family:var(--f-display);font-size:20px;color:var(--navy);margin-bottom:4px}
.svr-main span{color:var(--ink-2);font-size:15px}
.svr-chips{display:flex;flex-wrap:wrap;gap:8px}
.svr-chips i{font-style:normal;font-size:13px;background:#EAF2F9;color:var(--navy);border-radius:99px;padding:4px 12px}
.svr-go{width:46px;height:46px;border-radius:50%;border:1px solid var(--line-2);display:grid;place-items:center;color:var(--navy);transition:.25s}
.svr-row:hover{background:var(--navy)}
.svr-row:hover .svr-main b,.svr-row:hover .svr-main span{color:#fff}
.svr-row:hover .svr-num{-webkit-text-stroke-color:#7CC0F5}
.svr-row:hover .svr-ic{background:#fff}
.svr-row:hover .svr-chips i{background:rgba(255,255,255,.12);color:#fff}
.svr-row:hover .svr-go{background:var(--blue);border-color:var(--blue);color:#fff}
@media (max-width:900px){.svr-row{grid-template-columns:48px minmax(0,1fr);gap:14px}.svr-num{display:none}.svr-chips,.svr-go{grid-column:2}.svr-go{display:none}}
/* option 3: tabs */
.svt{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.8fr);gap:22px;margin-top:10px}
.svt-tabs{display:grid;gap:10px;align-content:start}
.svt-tab{display:flex;gap:14px;align-items:center;text-align:start;width:100%;padding:16px 18px;border:1px solid var(--line);background:var(--surface);border-radius:var(--r);cursor:pointer;font:inherit;color:var(--ink);transition:.2s}
.svt-tab b{display:block;font-family:var(--f-display);font-size:16.5px;color:var(--navy)}
.svt-tab small{font-size:13px;color:var(--ink-2)}
.svt-ic{flex:none;width:48px;height:48px;border-radius:12px;display:grid;place-items:center;background:var(--tint);color:var(--blue)}
.svt-tab:hover{border-color:var(--blue)}
.svt-tab.on{background:var(--navy);border-color:var(--navy)}
.svt-tab.on b{color:#fff}.svt-tab.on small{color:rgba(255,255,255,.7)}
.svt-tab.on .svt-ic{background:var(--blue);color:#fff}
.svt-panel{position:relative;overflow:hidden;background:linear-gradient(150deg,#0B2E4F,var(--navy) 55%,#15528A);color:#fff;border-radius:var(--r);padding:38px 36px;display:flex;flex-direction:column;gap:12px;min-height:100%}
.svt-big{position:absolute;inset-inline-end:26px;top:10px;font-family:var(--f-display);font-weight:700;font-size:120px;line-height:1;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.14)}
.svt-kicker{color:#7CC0F5;font-weight:600;font-size:14px}
.svt-panel h3{color:#fff;font-size:clamp(24px,2.3vw,30px)}
.svt-panel > p{color:rgba(255,255,255,.85);font-size:16.5px;max-width:58ch}
.svt-panel ul{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:10px}
.svt-panel li{display:flex;gap:10px;align-items:flex-start}
.svt-panel li svg{flex:none;color:#7CC0F5;margin-top:4px}
.svt-actions{margin-top:auto;padding-top:14px;display:flex;gap:10px;flex-wrap:wrap}
.svt-actions .btn-light{background:var(--blue);color:#fff}
@media (max-width:900px){.svt{grid-template-columns:1fr}.svt-tabs{grid-template-columns:1fr 1fr}.svt-tab{padding:12px}.svt-tab small{display:none}}
/* option 4: navy section */
.svn-sec{background:linear-gradient(160deg,#0B2E4F,var(--navy) 60%,#124A7C)}
.svn-sec h2{color:#fff}
.svn-kicker{font-family:var(--f-display);font-weight:600;font-size:14px;color:#7CC0F5;display:flex;align-items:center;gap:10px}
.svn-kicker::before{content:"";width:26px;height:3px;border-radius:3px;background:#7CC0F5}
.svn-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.svn-card{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:12px;padding:30px 24px 24px;border-radius:var(--r);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);text-decoration:none;color:#fff;transition:.3s;min-width:0}
.svn-num{position:absolute;inset-inline-end:16px;top:6px;font-family:var(--f-display);font-weight:700;font-size:64px;color:transparent;-webkit-text-stroke:1.3px rgba(255,255,255,.16);transition:.3s}
.svn-ic{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--blue);transition:.3s}
.svn-card h3{color:#fff;font-size:19.5px;margin-top:8px}
.svn-card p{color:rgba(255,255,255,.78);font-size:15px}
.svn-go{margin-top:auto;padding-top:8px;display:flex;align-items:center;gap:8px;font-family:var(--f-display);font-weight:600;font-size:15px;color:#7CC0F5}
.svn-card:hover{background:#fff;color:var(--ink);transform:translateY(-6px);box-shadow:0 20px 40px rgba(0,0,0,.25)}
.svn-card:hover h3{color:var(--navy)}.svn-card:hover p{color:var(--ink-2)}
.svn-card:hover .svn-ic{background:var(--navy);color:#fff}
.svn-card:hover .svn-num{-webkit-text-stroke-color:var(--line-2)}
.svn-card:hover .svn-go{color:var(--blue)}
@media (max-width:1020px){.svn-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.svn-grid{grid-template-columns:1fr}}
.svt-panel[hidden]{display:none}
.svt-panel{grid-column:2;grid-row:1}
@media (max-width:900px){.svt-panel{grid-column:1;grid-row:auto}}
.svn-sec .s-head .svn-kicker{color:#7CC0F5}

/* option 5: bento */
.svb{display:grid;grid-template-columns:1.25fr 1fr 1fr;grid-template-rows:auto auto;gap:18px}
.svb-card{display:flex;flex-direction:column;gap:12px;padding:28px 26px 24px;border-radius:var(--r);text-decoration:none;min-width:0;transition:transform .25s,box-shadow .25s;border:1px solid var(--line);background:var(--surface);color:var(--ink)}
.svb-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.svb-1{grid-row:span 2;background:linear-gradient(155deg,#0B2E4F,var(--navy) 55%,#15528A);border:0;color:#fff}
.svb-2{background:var(--blue);border:0;color:#fff}
.svb-4{grid-column:span 2;background:#EAF2F9;border-color:#D3E3F2}
.svb-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.svb-ic{width:56px;height:56px;border-radius:14px;display:grid;place-items:center;background:var(--tint);color:var(--blue)}
.svb-1 .svb-ic,.svb-2 .svb-ic{background:rgba(255,255,255,.14);color:#fff}
.svb-4 .svb-ic{background:#fff}
.svb-who{font-size:12.5px;font-weight:600;border-radius:99px;padding:3px 12px;background:#EAF2F9;color:var(--navy)}
.svb-1 .svb-who,.svb-2 .svb-who{background:rgba(255,255,255,.15);color:#fff}
.svb-4 .svb-who{background:#fff}
.svb-card h3{font-size:20px;color:var(--navy);margin-top:6px}
.svb-1 h3{font-size:clamp(24px,2.3vw,30px)}
.svb-1 h3,.svb-2 h3{color:#fff}
.svb-card p{font-size:15px;color:var(--ink-2);margin:0}
.svb-1 p,.svb-2 p{color:rgba(255,255,255,.85)}
.svb-1 p{font-size:16.5px}
.svb-card ul{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:10px}
.svb-card li{display:flex;gap:10px;color:#fff}.svb-card li svg{flex:none;color:#7CC0F5;margin-top:4px}
.svb-go{margin-top:auto;padding-top:8px;display:flex;align-items:center;gap:8px;font-family:var(--f-display);font-weight:600;font-size:15px;color:var(--blue)}
.svb-1 .svb-go,.svb-2 .svb-go{color:#fff}
@media (max-width:960px){.svb{grid-template-columns:1fr 1fr}.svb-1{grid-row:auto;grid-column:span 2}.svb-4{grid-column:span 2}}
@media (max-width:600px){.svb{grid-template-columns:1fr}.svb-1,.svb-4{grid-column:auto}}
/* option 6: centered circles */
.svc6{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:10px}
.svc6-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:34px 22px 28px;border-radius:var(--r);background:var(--bg,#F5F7FA);text-decoration:none;color:var(--ink);transition:.3s;min-width:0}
.svc6-ring{position:relative;width:112px;height:112px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(from 200deg,var(--blue),var(--navy),#7CC0F5,var(--blue));padding:4px;transition:transform .4s}
.svc6-ic{width:100%;height:100%;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--navy)}
.svc6-num{position:absolute;bottom:-4px;inset-inline-end:-4px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;font-family:var(--f-display);font-weight:700;font-size:13px;border:3px solid #fff}
.svc6-card h3{font-size:19px;color:var(--navy);margin-top:10px}
.svc6-card p{font-size:15px;color:var(--ink-2);margin:0}
.svc6-go{margin-top:auto;padding-top:8px;font-family:var(--f-display);font-weight:600;font-size:15px;color:var(--blue);border-bottom:2px solid transparent;transition:.25s}
.svc6-card:hover{background:#fff;box-shadow:var(--shadow);transform:translateY(-6px)}
.svc6-card:hover .svc6-ring{transform:rotate(-8deg) scale(1.04)}
.svc6-card:hover .svc6-go{border-color:var(--blue)}
@media (max-width:1020px){.svc6{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.svc6{grid-template-columns:1fr}}
/* option 7: split header cards */
.svs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.svs-card{display:flex;flex-direction:column;border-radius:var(--r);overflow:hidden;background:var(--surface);border:1px solid var(--line);text-decoration:none;color:var(--ink);transition:.3s;min-width:0}
.svs-head{position:relative;background:linear-gradient(150deg,#0B2E4F,var(--navy) 60%,#15528A);color:#fff;padding:24px 22px 22px;display:grid;gap:10px;min-height:196px;align-content:start}
.svs-ic{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--blue)}
.svs-num{position:absolute;inset-inline-end:18px;top:14px;font-family:var(--f-display);font-weight:700;font-size:44px;color:transparent;-webkit-text-stroke:1.2px rgba(255,255,255,.25)}
.svs-head h3{color:#fff;font-size:19px;margin:0}
.svs-who{justify-self:start;font-size:12px;font-weight:600;color:#7CC0F5}
.svs-body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:12px;flex:1}
.svs-body p{font-size:15px;color:var(--ink-2);margin:0}
.svs-body ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.svs-body li{display:flex;gap:8px;font-size:14px}.svs-body li svg{flex:none;color:var(--blue);margin-top:4px}
.svs-go{margin-top:auto;padding-top:6px;display:flex;align-items:center;gap:8px;font-family:var(--f-display);font-weight:600;font-size:15px;color:var(--blue)}
.svs-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:rgba(28,120,196,.4)}
.svs-card:hover .svs-head{background:linear-gradient(150deg,var(--navy),var(--blue))}
@media (max-width:1020px){.svs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.svs{grid-template-columns:1fr}}
.svs-num{color:#fff;-webkit-text-stroke:0;opacity:1}

/* lighter end-of-page bands */
:root{--ovb:1}
.cta.has-img::before{background:linear-gradient(270deg,rgba(8,38,64,calc(.82 * var(--ovb))) 0%,rgba(8,38,64,calc(.6 * var(--ovb))) 45%,rgba(8,38,64,calc(.12 * var(--ovb))) 100%)}
[dir="ltr"] .cta.has-img::before{background:linear-gradient(90deg,rgba(8,38,64,calc(.82 * var(--ovb))) 0%,rgba(8,38,64,calc(.6 * var(--ovb))) 45%,rgba(8,38,64,calc(.12 * var(--ovb))) 100%)}
.final-cta.has-img::before,.partner.has-img::after{background:radial-gradient(ellipse 60% 85% at 50% 50%,rgba(8,38,64,calc(.8 * var(--ovb))) 0%,rgba(8,38,64,calc(.5 * var(--ovb))) 55%,rgba(8,38,64,calc(.15 * var(--ovb))) 100%)}
.cta.has-img h2,.cta.has-img p,.final-cta.has-img h2,.final-cta.has-img p,.partner.has-img h2,.partner.has-img p{text-shadow:0 2px 12px rgba(8,38,64,.55)}
@media (max-width:760px){.cta.has-img::before,[dir="ltr"] .cta.has-img::before{background:rgba(8,38,64,calc(.72 * var(--ovb)))}}
/* light footer */
.ftr{background:#fff;color:#3A4A5A;border-top:1px solid #DCE5EE}
.ftr a{color:#3A4A5A}.ftr a:hover{color:var(--blue)}
.ftr-h{color:var(--navy)}
.ftr-contact .ic{color:var(--blue)}
.ftr-brand img{box-shadow:none;padding:0}
.ftr .social a{color:#fff;border-color:var(--blue);background:var(--blue)}
.ftr .social a:hover{background:var(--navy);border-color:var(--navy)}
.ftr-bar{background:var(--navy)}
.ftr-bar .ftr-bottom{border-top:0;color:rgba(255,255,255,.85)}
.ftr .tx-blue{color:var(--blue)}.ftr .tx-navy{color:var(--navy)}.ftr .tx-gold{color:#9a7425}
.ftr{font-size:16px;color:var(--navy)}
.ftr a,.ftr-brand p,.ftr-contact span{color:var(--navy);font-weight:500}
.ftr a:hover{color:var(--blue)}
.ftr-contact small{color:#4E6378;opacity:1;font-size:13px}
.ftr-h{display:inline-block;background:var(--blue);color:#fff;font-size:16.5px;padding:7px 18px;border-radius:8px;margin-bottom:18px}
.ftr-list{gap:11px}
.ftr{background:#fff;border-top:1px solid #DCE5EE}
.body-fig{margin:28px 0;display:grid;gap:10px}
.body-fig img{width:100%;height:auto;border-radius:var(--r);display:block;box-shadow:0 10px 30px rgba(14,63,105,.12)}
.body-fig figcaption{font-size:14px;color:var(--ink-2);text-align:center}

/* books */
.books{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.book{display:grid;grid-template-columns:150px minmax(0,1fr);gap:22px;padding:22px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);align-items:start}
.book-cover{aspect-ratio:3/4;border-radius:10px;overflow:hidden;background:linear-gradient(160deg,var(--navy),var(--blue));display:grid;place-items:center;color:#fff;box-shadow:0 10px 24px rgba(14,63,105,.2)}
.book-cover img{width:100%;height:100%;object-fit:cover}
.book-info{display:flex;flex-direction:column;gap:8px;min-width:0}
.book-info h3{font-size:19px;color:var(--navy)}
.book-author{font-size:14px;color:var(--blue);font-weight:600;margin:0}
.book-info p{font-size:15px;color:var(--ink-2);margin:0}
.book-acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.book-acts small{font-weight:400;opacity:.7;font-size:12px}
@media (max-width:900px){.books{grid-template-columns:1fr}}
@media (max-width:480px){.book{grid-template-columns:110px minmax(0,1fr);gap:14px;padding:16px}}
/* HR templates library */
.frm-tools{display:grid;gap:16px;margin-bottom:26px}
.frm-search{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line-2);border-radius:12px;padding:0 16px;color:var(--ink-2)}
.frm-search:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px rgba(28,120,196,.15)}
.frm-search input{flex:1;border:0;outline:0;background:transparent;font:inherit;font-size:16px;padding:14px 0;color:var(--ink);min-width:0}
.frm-chips{display:flex;gap:8px;flex-wrap:wrap}
.frm-chips button{font:inherit;font-size:14.5px;font-weight:600;color:var(--navy);background:#EAF2F9;border:1px solid transparent;border-radius:99px;padding:7px 16px;cursor:pointer;display:inline-flex;gap:8px;align-items:center}
.frm-chips button i{font-style:normal;font-size:12px;background:#fff;color:var(--blue);border-radius:99px;padding:1px 8px}
.frm-chips button.on{background:var(--navy);color:#fff}.frm-chips button.on i{background:var(--blue);color:#fff}
.frm-groups{display:grid;gap:22px}
.frm-group{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:24px 24px 14px}
.frm-gh{display:flex;gap:14px;align-items:flex-start;margin-bottom:10px}
.frm-gic{flex:none;width:48px;height:48px;border-radius:12px;display:grid;place-items:center;background:var(--navy);color:#fff}
.frm-gh h2{font-size:21px;color:var(--navy);margin:0}
.frm-gh p{margin:4px 0 0;color:var(--ink-2);font-size:14.5px}
.frm-sub{margin-top:14px}
.frm-sub h3{font-size:16.5px;color:var(--blue);display:flex;align-items:center;gap:8px;padding-bottom:6px;border-bottom:2px solid #EAF2F9;margin:0}
.frm-sub h3 i{font-style:normal;font-size:12px;background:#EAF2F9;color:var(--navy);border-radius:99px;padding:1px 9px}
.frm-list{list-style:none;margin:0;padding:0}
.frm{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:14px;align-items:center;padding:13px 4px;border-bottom:1px dashed var(--line)}
.frm:last-child{border-bottom:0}
.frm-ty{font-size:11.5px;font-weight:700;letter-spacing:.03em;border-radius:6px;padding:5px 8px;min-width:58px;text-align:center;color:#fff;background:#6B7A88}
.frm-pdf{background:#C8382F}.frm-word{background:#2B5797}.frm-excel{background:#1E7145}.frm-powerpoint{background:#C4561F}.frm-zip{background:#6B4FA0}
.frm-main{text-decoration:none;color:var(--ink);min-width:0}
.frm-main b{display:block;font-size:15.5px;color:var(--navy)}
.frm-main span{display:block;font-size:13.5px;color:var(--ink-2);margin-top:2px}
.frm-main:hover b{color:var(--blue)}
.frm-meta{font-size:12.5px;color:var(--ink-2);white-space:nowrap}
.frm-dl{display:inline-flex;gap:6px;align-items:center}
@media (max-width:700px){.frm{grid-template-columns:auto minmax(0,1fr);gap:8px 12px}.frm-meta{grid-column:2}.frm-dl{grid-column:2;justify-self:start}}
.frm-detail .frm-card{display:grid;grid-template-columns:150px minmax(0,1fr);gap:28px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:30px}
.frm-big{aspect-ratio:3/4;border-radius:12px;display:grid;place-items:center;align-content:center;gap:8px;color:#fff;background:#6B7A88}
.frm-big b{font-size:15px}
.frm-big.frm-pdf{background:#C8382F}.frm-big.frm-word{background:#2B5797}.frm-big.frm-excel{background:#1E7145}.frm-big.frm-powerpoint{background:#C4561F}.frm-big.frm-zip{background:#6B4FA0}
.frm-dinfo{display:flex;flex-direction:column;gap:14px;align-items:flex-start;min-width:0}
.frm-dinfo h2{font-size:24px;color:var(--navy);margin:0}
.frm-facts{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--ink-2);font-size:14.5px}
.frm-facts li{display:flex;gap:6px;align-items:center}.frm-facts svg{color:var(--blue)}
.frm-detail .frm-card.has-cover{grid-template-columns:300px minmax(0,1fr)}
.frm-cover{position:relative;align-self:start;display:block}
.frm-cover img{display:block;width:100%;height:auto;border-radius:12px;border:1px solid var(--line);box-shadow:0 10px 26px rgba(14,63,105,.16)}
.frm-cover b{position:absolute;inset-inline-start:10px;bottom:10px;font-size:12px;color:#fff;background:#6B7A88;padding:3px 9px;border-radius:6px}
.frm-cover b.frm-pdf{background:#C8382F}.frm-cover b.frm-word{background:#2B5797}.frm-cover b.frm-excel{background:#1E7145}.frm-cover b.frm-powerpoint{background:#C4561F}.frm-cover b.frm-zip{background:#6B4FA0}
@media (max-width:600px){.frm-detail .frm-card{grid-template-columns:1fr;padding:22px}.frm-big{max-width:120px;}.frm-detail .frm-card.has-cover{grid-template-columns:1fr}.frm-cover{max-width:420px}}
#frm-none[hidden],.empty[hidden]{display:none}

/* nav dropdown */
.nav-dd{position:relative}
.nav-dd-t{display:inline-flex;align-items:center;gap:4px}
.nav-caret{display:inline-flex;transition:transform .2s}
.nav-dd-m{position:absolute;top:100%;inset-inline-start:0;min-width:250px;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:0 18px 40px rgba(14,63,105,.16);padding:8px;display:grid;gap:2px;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .2s,transform .2s,visibility .2s;z-index:60}
.nav-dd-m::before{content:"";position:absolute;inset-inline:0;top:-12px;height:12px}
.nav-dd:hover .nav-dd-m,.nav-dd:focus-within .nav-dd-m{opacity:1;visibility:visible;transform:none}
.nav-dd:hover .nav-caret{transform:rotate(180deg)}
.nav .nav-dd-m a{display:flex;align-items:center;gap:10px;padding:10px 12px;font-size:15px;color:var(--navy);border-radius:10px}
.nav .nav-dd-m a svg{color:var(--blue);flex:none}
.nav .nav-dd-m a:hover{background:#EAF2F9;color:var(--blue)}
.nav .nav-dd-m a::after{display:none}
.nav .nav-dd-m .nav-dd-all{border-top:1px solid var(--line);margin-top:4px;padding-top:12px;font-weight:600}
@media (max-width:1180px){
  .nav-dd-m{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;border-radius:0;padding:0 14px 6px;min-width:0;background:transparent}
  .nav-dd-m::before{display:none}
  .nav .nav-dd-m a{font-size:16px;padding:11px 8px;border-bottom:1px solid var(--line);border-radius:0}
  .nav-caret{display:none}
}

.nav-dd-wide{min-width:330px}
.nav .nav-dd-wide > a:not(.nav-dd-sub):not(.nav-dd-all){align-items:flex-start}
.nav-dd-ic{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:#EAF2F9;color:var(--blue)}
.nav .nav-dd-wide a b{display:block;font-size:15px;color:var(--navy)}
.nav .nav-dd-wide a small{display:block;font-size:12.5px;color:var(--ink-2);font-weight:400;line-height:1.5;margin-top:2px}
.nav .nav-dd-m a.nav-dd-sub{padding:6px 12px;padding-inline-start:58px;font-size:14px;color:var(--ink-2)}
.nav .nav-dd-m a.nav-dd-sub svg{width:16px;height:16px}
.nav .nav-dd-wide a:hover .nav-dd-ic{background:var(--blue);color:#fff}
@media (max-width:1180px){.nav .nav-dd-wide a small{display:none}.nav-dd-ic{width:30px;height:30px}.nav .nav-dd-m a.nav-dd-sub{padding-inline-start:46px}}
.nav-dd-plain{min-width:240px}
.nav .nav-dd-plain a{font-weight:500}

.nav .nav-dd-plain a{font-family:var(--f-body,inherit);font-weight:400;font-size:15px;color:var(--ink);padding:9px 14px}
.nav .nav-dd-plain a:hover{color:var(--blue);background:#F2F7FC}
.nav .nav-dd-plain .nav-dd-all{font-weight:400;color:var(--blue)}

.frm-paid{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:700;color:#8A6417;background:#FBF1DC;border-radius:6px;padding:3px 8px}
.frm-price{color:var(--navy);font-size:13.5px;margin-inline-start:6px}
.btn-gold{background:linear-gradient(135deg,#E2C07A,#C9A45C);color:#0B2E4F;border-color:transparent}
.btn-gold:hover{background:linear-gradient(135deg,#EACB8A,#D4AF68);color:#0B2E4F}
.frm-buy{background:#FBF6EA;border:1px solid #EEDDB5;border-radius:12px;padding:16px 18px;display:grid;gap:12px;width:100%}
.frm-buy p{margin:0;color:#5A4515;font-size:15px}
.frm-buy-acts{display:flex;gap:10px;flex-wrap:wrap}
/* hero: shift text slightly toward the empty edge on wide screens */
.vhero-in{position:relative;inset-inline-start:calc(-1 * clamp(0px, (100vw - var(--wrap)) / 3, 170px))}

/* library hub */
.lib-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.lib-tile{display:flex;flex-direction:column;gap:10px;padding:26px 22px 20px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);text-decoration:none;color:var(--ink);transition:transform .25s,box-shadow .25s,border-color .25s;min-width:0}
.lib-ic{width:60px;height:60px;border-radius:16px;display:grid;place-items:center;background:#EAF2F9;color:var(--blue);transition:.25s}
.lib-tile h2{font-size:18.5px;color:var(--navy);margin:6px 0 0}
.lib-tile p{font-size:14.5px;color:var(--ink-2);margin:0}
.lib-foot{margin-top:auto;padding-top:12px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line)}
.lib-n{font-size:13.5px;font-weight:600;color:var(--blue)}
.lib-go{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#EAF2F9;color:var(--navy);transition:.25s}
.lib-tile:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:rgba(28,120,196,.4)}
.lib-tile:hover .lib-ic{background:var(--navy);color:#fff}
.lib-tile:hover .lib-go{background:var(--blue);color:#fff}
@media (max-width:1020px){.lib-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.lib-grid{grid-template-columns:1fr}}

/* courses: badges + booking page */
.cbadges{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.cbadge{font-size:12.5px;font-weight:700;border-radius:99px;padding:3px 12px;line-height:1.7}
.ckind{background:#EAF2F9;color:var(--navy)}
.cfree{background:#E3F4EA;color:#1B6B3A}
.cpaid{background:#FBF1DC;color:#8A6417}
.cclosed{background:#F3E3E3;color:#9B2C2C}
.course h3 a{color:inherit;text-decoration:none}.course h3 a:hover{color:var(--blue)}
.course-page{gap:34px}
.course-info{display:flex;flex-direction:column;gap:18px;min-width:0}
.cfacts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cfacts li{display:flex;gap:12px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.cfacts svg{flex:none;color:var(--blue)}
.cfacts small{display:block;font-size:12.5px;color:var(--ink-2)}
.cfacts b{display:block;color:var(--navy);font-size:15px}
.book-h{font-size:21px;line-height:1.5;margin:0 0 4px}
.book-h span{color:var(--blue)}
@media (max-width:560px){.cfacts{grid-template-columns:1fr}}

/* course cards v2 */
.ccards{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:18px}
.ccard{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:transform .25s,box-shadow .25s,border-color .25s;min-width:0}
.ccard:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:rgba(28,120,196,.35)}
.ccard-top{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 18px;background:linear-gradient(135deg,#0B2E4F,var(--navy));color:#fff}
.ccard-kind{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:600}
.ccard-kind svg{color:#7CC0F5}
.ccard-status{font-size:12px;font-weight:700;border-radius:99px;padding:3px 12px;background:#F3E3E3;color:#9B2C2C}
.ccard-status.free{background:#DDF3E5;color:#16643A}
.ccard-status.paid{background:#F7E7C2;color:#7A5712}
.cbadge.cfile{background:#E3EEF9;color:#0E3F69}
.cp-file{display:flex;gap:10px;align-items:center;background:rgba(255,255,255,.1);border-radius:10px;padding:10px 12px;font-size:14px}
.cp-file b{font-size:14px;font-family:inherit}
.ccard-body{padding:18px 18px 6px;display:flex;flex-direction:column;gap:10px;flex:1}
.ccard-body h3{font-size:18px;line-height:1.5;margin:0}
.ccard-body h3 a{color:var(--navy);text-decoration:none}.ccard-body h3 a:hover{color:var(--blue)}
.ccard-body p{font-size:14.5px;color:var(--ink-2);margin:0}
.ccard-meta{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:7px}
.ccard-meta li{display:flex;gap:8px;align-items:center;font-size:14px;color:var(--ink)}
.ccard-meta svg{flex:none;color:var(--blue)}
.ccard-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px;margin-top:12px;border-top:1px solid var(--line);background:#FAFCFE}
.ccard-price small{display:block;font-size:12px;color:var(--ink-2)}
.ccard-price b{font-size:18px;color:var(--navy)}
.ccard.is-closed{opacity:.85}
/* course page v2 */
.cp-strip{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:20px 22px;display:grid;gap:14px;box-shadow:0 10px 30px rgba(14,63,105,.06)}
.cp-badges .cbadge{font-size:13px}
.cp-facts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.cp-facts li{display:flex;gap:12px;align-items:center}
.cp-ic{flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:#EAF2F9;color:var(--blue)}
.cp-facts small{display:block;font-size:12.5px;color:var(--ink-2)}
.cp-facts b{display:block;font-size:15px;color:var(--navy)}
.cp-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:26px;margin-top:26px;align-items:start}
.cp-main{display:grid;gap:18px;min-width:0}
.cp-main > h2{font-size:22px;color:var(--navy);margin:0}
.cp-steps{background:#F5F9FD;border:1px solid #DCE8F4;border-radius:var(--r);padding:20px 22px}
.cp-steps h3{font-size:17px;color:var(--navy);margin:0 0 12px}
.cp-steps ol{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.cp-steps li{display:flex;gap:12px;align-items:center;font-size:15px}
.cp-steps li b{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;font-size:14px}
.cp-side{position:sticky;top:96px}
.cp-price{background:linear-gradient(160deg,#0B2E4F,var(--navy) 60%,#15528A);color:#fff;border-radius:var(--r);padding:24px;display:flex;flex-direction:column;gap:10px;box-shadow:0 18px 40px rgba(14,63,105,.25)}
.cp-price small{color:rgba(255,255,255,.75);font-size:13.5px}
.cp-price > b{font-family:var(--f-display);font-size:30px;line-height:1.2}
.cp-price > b.is-text{font-size:20px;line-height:1.5}
.cp-note{font-size:13.5px;color:#9EE2B8}
.cp-cta{margin-top:8px;justify-content:center}
.cp-wa{display:flex;gap:8px;align-items:center;justify-content:center;color:#fff;text-decoration:none;font-size:14.5px;padding:8px;border:1px solid rgba(255,255,255,.25);border-radius:10px}
.cp-wa:hover{background:rgba(255,255,255,.08)}
.cp-book{margin:34px auto 0;max-width:880px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:0 14px 36px rgba(14,63,105,.08);scroll-margin-top:100px}
.cp-book-h{display:flex;gap:14px;align-items:center;padding:20px 26px;background:linear-gradient(135deg,var(--navy),var(--blue));color:#fff}
.cp-book-ic{flex:none;width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.15)}
.cp-book-h h2{color:#fff;font-size:22px;margin:0}
.cp-book-h p{margin:2px 0 0;color:rgba(255,255,255,.85);font-size:14.5px}
.cp-book-b{padding:26px}
@media (max-width:900px){.cp-grid{grid-template-columns:1fr}.cp-side{position:static}}
@media (max-width:560px){.cp-book-b{padding:18px}.cp-book-h{padding:16px 18px}}

.ccard-img{display:block;aspect-ratio:16/9;overflow:hidden;background:#EAF2F9}
.ccard-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.ccard:hover .ccard-img img{transform:scale(1.04)}
.cp-img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r);display:block;box-shadow:0 12px 30px rgba(14,63,105,.12)}

.ccard-trainer b{color:var(--navy)}
.cp-trainer{display:flex;gap:16px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px}
.cp-tph{flex:none;width:76px;height:76px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#EAF2F9;color:var(--blue);border:3px solid #fff;box-shadow:0 0 0 2px #D3E3F2}
.cp-tph img{width:100%;height:100%;object-fit:cover}
.cp-trainer small{display:block;font-size:12.5px;color:var(--blue);font-weight:600}
.cp-trainer b{display:block;font-size:18px;color:var(--navy)}
.cp-trainer span{display:block;font-size:14.5px;color:var(--ink-2)}
.nav .nav-dd-plain a.nav-dd-sub2{padding:6px 14px;padding-inline-start:30px;font-size:14px;color:var(--ink-2)}
.frm-list[hidden]{display:none}
.frm-chips a{font-size:14.5px;font-weight:600;color:var(--navy);background:#EAF2F9;border-radius:99px;padding:7px 16px;display:inline-flex;gap:8px;align-items:center;text-decoration:none}
.frm-chips a i{font-style:normal;font-size:12px;background:#fff;color:var(--blue);border-radius:99px;padding:1px 8px}
.frm-chips a:hover{background:#DCEAF6}
.frm-chips a.on{background:var(--navy);color:#fff}.frm-chips a.on i{background:var(--blue);color:#fff}
.frm-subchips a{font-size:13.5px;font-weight:500;background:#fff;border:1px solid var(--line-2)}
.frm-subchips a.on{background:var(--blue);border-color:var(--blue)}
.frm-subdesc{margin:8px 0 0;color:var(--ink-2);font-size:14.5px}

/* company logo on jobs */
.job.job-wl{grid-template-columns:auto minmax(0,1fr) auto}
.jlogo{flex:none;width:var(--s);height:var(--s);border-radius:14px;border:1px solid var(--line);background:#fff;display:grid;place-items:center;overflow:hidden;padding:6px;box-shadow:0 4px 12px rgba(14,63,105,.06)}
.jlogo img{max-width:100%;max-height:100%;object-fit:contain}
.jlogo-txt{background:linear-gradient(150deg,var(--navy),var(--blue));color:#fff;font-family:var(--f-display);font-weight:700;font-size:calc(var(--s) * .42);border:0}
.jlogo-conf{background:#EAF2F9;color:var(--navy);border-color:#D3E3F2}
.job-co{margin:0 0 2px!important;font-size:13.5px!important;color:var(--blue)!important;font-weight:600}
.job-coh{display:flex;gap:14px;align-items:center;margin-bottom:6px}
.job-coh small{display:block;font-size:12.5px;color:var(--ink-2)}
.job-coh b{display:block;font-size:18px;color:var(--navy)}
@media (max-width:700px){.job.job-wl{grid-template-columns:auto minmax(0,1fr)}.job.job-wl > .btn{grid-column:1 / -1;justify-self:start}}
[dir="ltr"] .no-mirror img,[dir="ltr"] .no-mirror video{transform:none!important}

/* payment box */
.pay-box{width:100%;background:#F4F9FE;border:1px solid #CFE2F4;border-radius:14px;padding:18px 20px;display:grid;gap:12px}
.pay-h{display:flex;align-items:center;gap:8px;color:var(--navy,#0E3F69);font-size:17px}
.pay-h svg{color:#1C78C4}
.pay-steps{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.pay-steps li{display:flex;gap:12px;align-items:flex-start}
.pay-steps li>div{flex:1;min-width:0;display:grid;gap:8px}
.pay-steps p{margin:0;color:#24364A;font-size:15px}
.pay-n{flex:none;width:28px;height:28px;border-radius:50%;background:#1C78C4;color:#fff;display:grid;place-items:center;font-weight:700;font-size:14px}
.pay-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:#fff;border:1px solid #D9E6F2;border-radius:10px;padding:8px 12px}
.pay-lbl{color:#4A5868;font-size:14px;min-width:90px}
.pay-val{font-size:17px;color:#0E3F69;letter-spacing:.5px;word-break:break-all}
.pay-copy{margin-inline-start:auto;display:inline-flex;align-items:center;gap:5px;border:1px solid #C9DDF0;background:#EAF3FB;color:#0E3F69;border-radius:8px;padding:5px 10px;font:inherit;font-size:13px;cursor:pointer}
.pay-copy:hover{background:#DCEBF8}
.pay-link{font-size:14px;font-weight:600;color:#1C78C4}
.pay-name{color:#5B6B7C}
.pay-wa{justify-self:start}
.pay-alt{font-size:14px;color:#5B6B7C;align-items:center}
.pay-alt a{font-weight:600}
.cp-side .pay-box{padding:14px;background:rgba(255,255,255,.96)}
.cp-side .pay-lbl{min-width:0}
.cp-side .pay-box small.pay-name,.cp-side .pay-box .pay-lbl{color:#5B6B7C}
.cp-side .pay-box p{color:#24364A}
.pay-terms{margin:0;font-size:12.5px;color:#5B6B7C}.pay-terms a{color:#1C78C4;font-weight:600}
.cp-paynote{display:flex;align-items:center;gap:6px;justify-content:center;font-size:12.5px;color:#CFE3F5;margin-top:-4px}
.cp-book .pay-box{margin-top:14px}
.pay-logo{display:block;height:30px;width:auto;max-width:120px;object-fit:contain}
.pay-lbl:has(.pay-logo){min-width:0;display:flex;align-items:center;background:#fff;border-radius:6px;padding:2px 4px}
.pay-go{margin-inline-start:auto;display:inline-flex;align-items:center;gap:6px;background:#5B2D90;color:#fff;border-radius:8px;padding:7px 14px;font-weight:700;font-size:14px;text-decoration:none}
.pay-go:hover{background:#4A2376;color:#fff}
.pay-vf{background:#E60000;margin-inline-start:6px}.pay-vf:hover{background:#B80000}
.pay-row .pay-copy+.pay-vf{margin-inline-start:6px}
.pay-vf-hint{color:#5B6B7C;font-size:12.5px}
.pay-go[hidden],.pay-vf-hint[hidden]{display:none!important}
.ftr-bar .ftr-bottom{display:flex;flex-wrap:wrap;gap:6px 18px;justify-content:space-between;align-items:center}
.ftr-legal{opacity:.85;font-size:12.5px}
@media (max-width:700px){.ftr-bar .ftr-bottom{padding-bottom:84px}}
/* مجموعات فرعية قابلة للفتح في قائمة مقالات ونماذج */
.nav-grp{display:grid}
.nav .nav-grp-btn{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:9px 14px;font-size:15px;color:var(--ink);border-radius:10px;cursor:pointer;font-family:inherit}
.nav .nav-grp-btn:hover,.nav .nav-grp-btn:focus-visible{background:#F2F7FC;color:var(--blue)}
.nav .nav-grp-btn:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.nav-grp-car{display:inline-flex;transition:transform .2s;color:var(--ink-2)}
.nav-grp-btn[aria-expanded="true"]{color:var(--blue);font-weight:600}
.nav-grp-btn[aria-expanded="true"] .nav-grp-car{transform:rotate(180deg);color:var(--blue)}
.nav-grp-m{display:grid;gap:1px;margin-inline-start:10px;border-inline-start:2px solid #DCE8F4;padding-inline-start:4px;margin-block:2px 4px}
.nav-grp-m[hidden]{display:none}
@media (max-width:1180px){.nav .nav-grp-btn{font-size:16px;padding:11px 8px;border-bottom:1px solid var(--line);border-radius:0}}