:root{
  --navy:#0E1F3D; --navy-2:#15294D; --navy-3:#1D3563; --leather:#2E3D4F;
  --silver:#C9CFD8; --silver-hi:#F2F4F7; --silver-lo:#8C97A6;
  --on-dark:#E7EBF1; --on-dark-muted:#A8B3C2;
  --bg:#EEF1F5; --surface:#FFFFFF; --text:#14233D; --muted:#4A586D; --line:#CED5DF;
  --wa:#1FA855;
  --display:"Marcellus", "Times New Roman", Georgia, serif;
  --body:"Poppins", "Segoe UI", system-ui, -apple-system, sans-serif;
  --urdu:"Noto Nastaliq Urdu", "Jameel Noori Nastaleeq", "Urdu Typesetting", serif;
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){--bg:#0A1527;--surface:#11213B;--text:#E4E9F0;--muted:#A3AEBE;--line:#24375A;color-scheme:dark}
}
:root[data-theme="dark"]{--bg:#0A1527;--surface:#11213B;--text:#E4E9F0;--muted:#A3AEBE;--line:#24375A;color-scheme:dark}
*,*::before,*::after{box-sizing:inherit}
html{scroll-behavior:smooth;scroll-padding-top:calc(env(safe-area-inset-top,0px) + 72px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--body);font-size:16px;line-height:1.65;font-weight:400}
img,video{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid #7FA6E8;outline-offset:3px;border-radius:4px}
.wrap{width:min(1160px,100% - 40px);margin-inline:auto}
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.15;margin:0}
h2{font-size:clamp(1.9rem,3.6vw,2.7rem);letter-spacing:.005em}
h3{font-size:1.3rem}
p{margin:0 0 1em}
.lede{font-size:1.08rem;color:var(--muted);max-width:62ch}
.dark{background:var(--navy);color:var(--on-dark);position:relative;isolation:isolate}
.dark::before{content:"";position:absolute;inset:0;background-image:var(--grain);z-index:-1;pointer-events:none}
.dark .lede{color:var(--on-dark-muted)}
.silver-text{background:linear-gradient(180deg,#FFFFFF 0%,#D6DBE2 45%,#9AA5B4 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
section{padding:88px 0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:10px;font:500 .95rem/1 var(--body);padding:14px 20px;border-radius:999px;border:1px solid transparent;text-decoration:none;cursor:pointer;transition:background .2s,border-color .2s,transform .15s}
.btn:active{transform:translateY(1px)}
.btn svg{width:18px;height:18px;flex:none}
.btn-wa{background:var(--wa);color:#fff}
.btn-wa:hover{background:#178F47}
.btn-silver{background:linear-gradient(180deg,#F4F6F9,#C3CAD4);color:var(--navy);border-color:#E6EAF0}
.btn-silver:hover{background:linear-gradient(180deg,#FFFFFF,#D3D9E1)}
.btn-ghost{background:transparent;color:inherit;border-color:currentColor}
.btn-ghost:hover{background:rgba(255,255,255,.08)}

/* Top bar + header */
.topbar{background:#08142A;color:var(--on-dark-muted);font-size:.82rem}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:7px 0;flex-wrap:wrap}
.topbar a{text-decoration:none;color:var(--on-dark)}
.topbar .cities{display:flex;gap:14px}
header.site{position:sticky;top:0;z-index:50;background:rgba(14,31,61,.96);backdrop-filter:blur(8px);color:var(--on-dark);border-bottom:1px solid rgba(201,207,216,.14);padding-top:env(safe-area-inset-top,0px);margin-top:calc(-1 * env(safe-area-inset-top,0px))}
.hdr{display:flex;align-items:center;justify-content:space-between;gap:16px;height:72px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{width:40px;height:auto}
.brand b{font:400 1.25rem/1 var(--display);letter-spacing:.02em}
.brand small{display:block;font-size:.72rem;color:var(--on-dark-muted);margin-top:4px;letter-spacing:.02em}
nav.main ul{list-style:none;display:flex;gap:4px;margin:0;padding:0}
nav.main a{display:block;padding:10px 12px;text-decoration:none;font-size:.92rem;color:var(--on-dark);border-radius:8px}
nav.main a:hover{background:rgba(255,255,255,.07)}
.hdr-actions{display:flex;align-items:center;gap:8px}
.lang{background:transparent;border:1px solid rgba(201,207,216,.4);color:var(--on-dark);border-radius:999px;padding:7px 14px;cursor:pointer;font:500 .85rem var(--body)}
.lang:hover{border-color:var(--silver)}
.menu-btn{display:none;background:none;border:0;color:var(--on-dark);width:44px;height:44px;cursor:pointer}
.hdr .btn-wa{padding:10px 16px}
@media (max-width:980px){
  nav.main{position:fixed;inset:72px 0 auto 0;background:var(--navy);border-bottom:1px solid rgba(201,207,216,.15);display:none;padding:8px 20px 20px;margin-top:env(safe-area-inset-top,0px)}
  nav.main.open{display:block}
  nav.main ul{flex-direction:column}
  nav.main a{padding:14px 8px;font-size:1rem;border-bottom:1px solid rgba(255,255,255,.06)}
  .menu-btn{display:grid;place-items:center}
  .hdr .btn-wa span{display:none}
  .hdr .btn-wa{padding:10px}
}

/* Hero */
.hero{padding:64px 0 80px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}
.hero-shield{width:84px;margin-bottom:22px;opacity:0;transform:translateY(-14px) scale(.92);animation:shieldIn 1.1s cubic-bezier(.2,.7,.2,1) .15s forwards;position:relative}
.hero-shield img{width:100%}
.hero-shield::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.55) 50%,transparent 65%);-webkit-mask:var(--shield-mask) center/contain no-repeat;mask:var(--shield-mask) center/contain no-repeat;background-size:250% 100%;background-position:120% 0;animation:shine 1.6s ease 1.1s forwards}
@keyframes shieldIn{to{opacity:1;transform:none}}
@keyframes shine{to{background-position:-60% 0}}
.hero h1{font-size:clamp(2.6rem,6.4vw,5.2rem);letter-spacing:.01em;line-height:1.02;margin-bottom:22px}
.hero h1 span{display:block}
.hero .lede{font-size:1.12rem;margin-bottom:28px}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:36px}
.need{border-top:1px solid rgba(201,207,216,.18);padding-top:22px}
.need p{font-size:.95rem;color:var(--on-dark-muted);margin-bottom:12px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{background:rgba(255,255,255,.04);border:1px solid rgba(201,207,216,.28);color:var(--on-dark);padding:8px 14px;border-radius:999px;font:400 .88rem var(--body);cursor:pointer}
.chip:hover{border-color:var(--silver);background:rgba(255,255,255,.09)}
.arch{position:relative;justify-self:end;width:min(100%,420px)}
.arch-frame{border-radius:220px 220px 6px 6px;overflow:hidden;border:1px solid rgba(201,207,216,.45);box-shadow:0 0 0 8px rgba(201,207,216,.06),0 0 0 9px rgba(201,207,216,.2);aspect-ratio:3/4;background:var(--navy-2)}
.arch-frame img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.arch-note{position:absolute;left:-28px;bottom:28px;background:var(--surface);color:var(--text);border-radius:10px;padding:12px 16px;font-size:.85rem;line-height:1.4;box-shadow:0 18px 40px rgba(4,10,22,.35);max-width:230px}
.arch-note b{display:block;font:400 1.05rem var(--display)}
@media (max-width:860px){.hero-grid{grid-template-columns:1fr}.arch{justify-self:center;width:min(100%,340px)}.arch-note{left:auto;right:-6px}}

/* Facts strip */
.facts{background:var(--navy-2);color:var(--on-dark);border-top:1px solid rgba(201,207,216,.12)}
.facts .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.fact{padding:22px 18px;border-inline-start:1px solid rgba(201,207,216,.14);font-size:.9rem;color:var(--on-dark-muted)}
.fact:first-child{border-inline-start:0}
.fact b{display:block;color:var(--on-dark);font:400 1.1rem var(--display);margin-bottom:2px}
@media (max-width:760px){.facts .wrap{grid-template-columns:1fr 1fr}.fact:nth-child(3){border-inline-start:0}.fact{border-top:1px solid rgba(201,207,216,.1)}}

/* About */
.about-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:64px;align-items:start}
.about-photo{position:relative}
.about-photo img{border-radius:6px;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 25%}
.about-photo .seal{position:absolute;right:-18px;top:-18px;width:86px;filter:drop-shadow(0 10px 18px rgba(0,0,0,.3))}
.about-copy h2{margin-bottom:22px}
.about-copy p{max-width:64ch}
.values{display:grid;grid-template-columns:1fr 1fr;gap:22px 32px;margin-top:30px;padding-top:28px;border-top:1px solid var(--line)}
.values h3{font-size:1.15rem;margin-bottom:6px}
.values p{color:var(--muted);font-size:.93rem;margin:0}
.mission{margin-top:28px;padding:20px 24px;border-inline-start:3px solid var(--navy-3);background:var(--surface);border-radius:0 8px 8px 0;font-family:var(--display);font-size:1.2rem;line-height:1.5}
@media (max-width:860px){.about-grid{grid-template-columns:1fr;gap:40px}.values{grid-template-columns:1fr}.about-photo{max-width:420px}}

/* Services */
.svc-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:40px}
.svc-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:rgba(201,207,216,.16);border:1px solid rgba(201,207,216,.16);border-radius:14px;overflow:hidden}
.svc{background:var(--navy);padding:30px 18px 26px;text-align:center;cursor:pointer;border:0;color:inherit;font:inherit;display:flex;flex-direction:column;align-items:center;transition:background .25s}
.svc:hover,.svc:focus-visible{background:var(--navy-2)}
.ring{width:108px;height:108px;border-radius:50%;padding:7px;background:linear-gradient(145deg,#F5F7FA,#8E99A8 55%,#DDE2E8);box-shadow:0 10px 24px rgba(0,0,0,.35);margin-bottom:20px}
.ring-in{width:100%;height:100%;border-radius:50%;background:radial-gradient(circle at 50% 35%,#1C3A78,#0B1C40 75%);display:grid;place-items:center;color:#DCE1E8;box-shadow:inset 0 2px 6px rgba(0,0,0,.5)}
.ring svg{width:62px;height:62px;overflow:visible;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.svc h3{font-size:1.18rem;margin-bottom:4px}
.svc .ur{font-family:var(--urdu);font-size:.9rem;color:var(--on-dark-muted);line-height:2;margin-bottom:10px}
.svc ul{list-style:none;padding:0;margin:0 0 16px;font-size:.86rem;color:var(--on-dark-muted);line-height:1.7}
@media (max-width:1100px){.svc-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.svc-grid{grid-template-columns:1fr}}
.svc .more{margin-top:auto;font-size:.82rem;color:var(--silver);border-bottom:1px solid rgba(201,207,216,.4);padding-bottom:2px}

/* Icon animations — each case type moves differently */
.ring svg *{transform-box:view-box}
.play .i-consult .b1{animation:pop .5s cubic-bezier(.3,1.6,.5,1) both}
.play .i-consult .b2{animation:pop .5s cubic-bezier(.3,1.6,.5,1) .35s both}
.play .i-consult .d{animation:typing .9s ease-in-out .8s 3}
.play .i-consult .d2{animation-delay:.95s}.play .i-consult .d3{animation-delay:1.1s}
.i-consult .b1{transform-origin:14px 36px}.i-consult .b2{transform-origin:50px 54px}
@keyframes pop{0%{transform:scale(0);opacity:0}100%{transform:scale(1);opacity:1}}
@keyframes typing{0%,100%{transform:translateY(0)}40%{transform:translateY(-4px)}}

.i-civil .beam{transform-origin:32px 17px}
.play .i-civil .beam{animation:balance 2.6s ease-in-out both}
@keyframes balance{0%{transform:rotate(0)}18%{transform:rotate(-12deg)}42%{transform:rotate(9deg)}62%{transform:rotate(-5deg)}80%{transform:rotate(2deg)}100%{transform:rotate(0)}}

.i-crim .gavel{transform-origin:52px 46px}
.play .i-crim .gavel{animation:strike 1.5s cubic-bezier(.5,0,.3,1) both}
.i-crim .ripple{transform-origin:20px 47px;opacity:0}
.play .i-crim .ripple{animation:ripple .9s ease-out .68s both}
.play .i-crim .block{animation:thud .3s ease .68s both}
@keyframes strike{0%{transform:rotate(0)}25%{transform:rotate(14deg)}45%{transform:rotate(-36deg)}53%{transform:rotate(-29deg)}60%{transform:rotate(-36deg)}78%,100%{transform:rotate(0)}}
@keyframes ripple{0%{transform:scale(.3);opacity:.9}100%{transform:scale(2.6);opacity:0}}
@keyframes thud{50%{transform:translateY(1.5px)}}

.play .i-family .pL{animation:slideL .7s ease-out both}
.play .i-family .pR{animation:slideR .7s ease-out both}
.play .i-family .kid{animation:rise .6s cubic-bezier(.3,1.5,.5,1) .55s both}
.i-family .heart{opacity:0;transform-origin:32px 15px}
.play .i-family .heart{animation:heart 1.8s ease 1s both}
@keyframes slideL{from{transform:translateX(-10px);opacity:0}}
@keyframes slideR{from{transform:translateX(10px);opacity:0}}
@keyframes rise{from{transform:translateY(12px);opacity:0}}
@keyframes heart{0%{opacity:0;transform:translateY(6px) scale(.4)}40%{opacity:1;transform:translateY(0) scale(1.1)}60%{transform:scale(1)}100%{opacity:1;transform:none}}

.i-prop .draw{stroke-dasharray:1;stroke-dashoffset:0}
.play .i-prop .draw{animation:draw 1.2s ease both}
.play .i-prop .d2{animation-delay:.45s}.play .i-prop .d3{animation-delay:.9s}
.play .i-prop .win{animation:lightup .5s ease 1.3s both}
.i-prop .smoke{opacity:0}
.play .i-prop .smoke{animation:smoke 2.2s ease-out 1.4s 2}
.play .i-prop .s2{animation-delay:1.9s}
@keyframes draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes lightup{from{fill:transparent}to{fill:rgba(220,225,232,.85)}}
.i-prop .win{fill:rgba(220,225,232,.85)}
@keyframes smoke{0%{opacity:0;transform:translate(0,0) scale(.6)}30%{opacity:.8}100%{opacity:0;transform:translate(4px,-12px) scale(1.4)}}

.play .i-corp .case{animation:drop .8s cubic-bezier(.3,1.4,.5,1) both}
.i-corp .latch{transform-origin:32px 41px}
.play .i-corp .latch{animation:click .35s ease .8s both}
.i-corp .trend{stroke-dasharray:1;stroke-dashoffset:0}
.play .i-corp .trend{animation:draw .9s ease 1s both}
@keyframes drop{from{transform:translateY(-14px);opacity:0}}
@keyframes click{50%{transform:scale(1.35)}}

.i-over .mer{transform-origin:32px 38px;transform:scaleX(.5)}
.play .i-over .mer{animation:spin 2.4s linear 2}
.play .i-over .mer2{animation:spin2 2.4s linear 2}
.i-over .mer2{transform-origin:32px 38px;opacity:0}
.play .i-over .arc{animation:flow 1.4s linear 3}
.i-over .plane{offset-path:path("M12 22C18 8 46 8 52 20");offset-distance:100%;offset-rotate:auto}
.play .i-over .plane{animation:fly 2.2s ease-in-out both}
@keyframes spin{0%{transform:scaleX(.5)}100%{transform:scaleX(0)}}
@keyframes spin2{0%{transform:scaleX(1);opacity:1}100%{transform:scaleX(.5);opacity:1}}
@keyframes flow{to{stroke-dashoffset:-14}}
@keyframes fly{from{offset-distance:0%}to{offset-distance:100%}}

.i-doc .w{stroke-dasharray:1;stroke-dashoffset:0}
.play .i-doc .w{animation:draw .45s ease both}
.play .i-doc .w2{animation-delay:.35s}.play .i-doc .w3{animation-delay:.7s}.play .i-doc .w4{animation-delay:1.05s}
.i-doc .seal{transform-origin:45px 47px}
.play .i-doc .seal{animation:stamp .55s cubic-bezier(.5,0,.4,1.4) 1.45s both}
@keyframes stamp{0%{transform:scale(2.2) rotate(-25deg);opacity:0}70%{opacity:1}100%{transform:none;opacity:1}}

.i-writ .col{transform-origin:0 50px}
.play .i-writ .col{animation:colup .5s ease-out both}
.play .i-writ .c2{animation-delay:.1s}.play .i-writ .c3{animation-delay:.2s}.play .i-writ .c4{animation-delay:.3s}.play .i-writ .c5{animation-delay:.4s}
.i-writ .dome{stroke-dasharray:1}
.play .i-writ .dome{animation:draw .8s ease .6s both}
.i-writ .flag{transform-origin:32px 10px}
.play .i-writ .flag{animation:wave .6s ease-in-out 1.3s 4 alternate both}
@keyframes colup{from{transform:scaleY(0)}}
@keyframes wave{from{transform:scaleX(.4)}to{transform:scaleX(1)}}

.i-bank .pill{fill:transparent}
.play .i-bank .pill{animation:fillcol .4s ease both}
.play .i-bank .p2{animation-delay:.25s}.play .i-bank .p3{animation-delay:.5s}.play .i-bank .p4{animation-delay:.75s}
.i-bank .coin{opacity:0}
.play .i-bank .coin{animation:coin .9s cubic-bezier(.5,0,.8,.6) 1.1s 2}
.i-bank .rs{transform-origin:32px 19px}
.play .i-bank .rs{animation:click .4s ease 2s both}
@keyframes fillcol{from{fill:transparent}to{fill:rgba(220,225,232,.35)}}
@keyframes coin{0%{opacity:0;transform:translateY(-14px)}25%{opacity:1}100%{opacity:0;transform:translateY(8px)}}

/* Reels */
.reels{margin-top:56px}
.reels-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}
.reels-head h3{font-size:1.35rem}
.reel-track{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;scrollbar-width:thin}
.reel{flex:0 0 220px;scroll-snap-align:start;border-radius:12px;overflow:hidden;border:1px solid rgba(201,207,216,.2);background:#0A1730;cursor:pointer;position:relative;padding:0;color:inherit}
.reel video,.reel img{width:100%;aspect-ratio:1;object-fit:cover}
.reel span{display:block;padding:10px 12px;font-size:.85rem;text-align:start}
.reel-nav{display:flex;gap:6px}
.reel-nav button{width:40px;height:40px;border-radius:50%;border:1px solid rgba(201,207,216,.35);background:transparent;color:var(--on-dark);cursor:pointer;font-size:1.1rem}

/* Process */
.steps{list-style:none;margin:44px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:0;counter-reset:s}
.steps li{position:relative;padding:0 18px 0 0}
.steps li::before{counter-increment:s;content:counter(s);display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--navy-3);font:400 1.1rem var(--display);color:var(--navy-3);background:var(--bg);position:relative;z-index:1;margin-bottom:16px}
:root[data-theme="dark"] .steps li::before{color:var(--silver);border-color:var(--silver-lo)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .steps li::before{color:var(--silver);border-color:var(--silver-lo)}}
.steps li::after{content:"";position:absolute;top:22px;left:44px;right:0;height:1px;background:var(--line)}
.steps li:last-child::after{display:none}
.steps h3{font-size:1.1rem;margin-bottom:6px}
.steps p{font-size:.9rem;color:var(--muted)}
@media (max-width:900px){.steps{grid-template-columns:1fr;gap:22px}.steps li{padding:0 0 0 62px}.steps li::before{position:absolute;left:0;top:0}.steps li::after{left:22px;top:44px;bottom:-22px;right:auto;width:1px;height:auto}}

/* Team */
.team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:20px;margin-top:40px}
.member{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:24px}
.member.lead{grid-column:span 2;display:grid;grid-template-columns:120px 1fr;gap:22px;align-items:start;background:var(--navy);color:var(--on-dark);border-color:var(--navy)}
.member.lead .mrole,.member.lead .mareas{color:var(--on-dark-muted)}
.mono{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font:400 1.3rem var(--display);background:linear-gradient(145deg,#F5F7FA,#9AA5B4);color:var(--navy);margin-bottom:16px}
.member.lead .mono{width:120px;height:auto;background:none;margin:0}
.member h3{font-size:1.2rem;margin-bottom:2px}
.mrole{color:var(--muted);font-size:.9rem;margin-bottom:10px}
.mcity{display:inline-block;font-size:.78rem;padding:3px 10px;border-radius:999px;border:1px solid var(--line);margin-bottom:10px}
.member.lead .mcity{border-color:rgba(201,207,216,.35)}
.mareas{font-size:.88rem;color:var(--muted);margin:0}
.member.todo h3{color:var(--muted);font-style:italic;font-family:var(--body);font-weight:400;font-size:1rem}
@media (max-width:620px){.member.lead{grid-column:auto;grid-template-columns:1fr}.member.lead .mono{width:90px}}

/* Offices */
.off-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin-top:36px}
.map svg{width:100%;height:auto}
.map .route{stroke:rgba(201,207,216,.55);stroke-width:1.5;stroke-dasharray:4 6;fill:none;animation:flow2 3s linear infinite}
@keyframes flow2{to{stroke-dashoffset:-40}}
.pin{cursor:pointer}
.pin .pulse{fill:none;stroke:#DCE1E8;transform-box:fill-box;transform-origin:center;animation:pulse 2.4s ease-out infinite}
.pin .core{fill:#DCE1E8;stroke:var(--navy);stroke-width:3;transition:r .2s}
.pin text{fill:var(--on-dark);font:400 17px var(--display)}
.pin.active .core{fill:#fff;r:11}
@keyframes pulse{0%{transform:scale(.6);opacity:.9}100%{transform:scale(2.6);opacity:0}}
.offices{display:grid;gap:14px}
.office{border:1px solid rgba(201,207,216,.2);border-radius:12px;padding:20px 22px;background:rgba(255,255,255,.02);transition:border-color .25s,background .25s}
.office.active{border-color:var(--silver);background:rgba(255,255,255,.06)}
.office h3{font-size:1.3rem;margin-bottom:2px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.office h3 small{font:400 .78rem var(--body);color:var(--on-dark-muted)}
.office p{color:var(--on-dark-muted);font-size:.92rem;margin:6px 0 12px}
.office .row{display:flex;gap:8px;flex-wrap:wrap}
.office .btn{padding:9px 14px;font-size:.85rem}
@media (max-width:860px){.off-grid{grid-template-columns:1fr}.map{max-width:440px;margin-inline:auto}}

/* FAQ */
.faq{max-width:820px;margin:36px auto 0}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:20px 40px 20px 0;font:400 1.15rem var(--display);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:6px;top:50%;width:12px;height:12px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-70%) rotate(45deg);transition:transform .25s}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq details p{color:var(--muted);padding-bottom:16px;max-width:70ch}

/* Contact */
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:start;margin-top:36px}
.c-list{display:grid;gap:18px}
.c-item b{display:block;font:400 1.1rem var(--display)}
.c-item a{text-decoration:none}
.c-item span{color:var(--muted);font-size:.92rem}
form.inq{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:28px;display:grid;grid-template-columns:1fr 1fr;gap:16px}
form.inq .full{grid-column:1/-1}
form.inq label{display:block;font-size:.85rem;font-weight:500;margin-bottom:6px}
form.inq input,form.inq select,form.inq textarea{width:100%;font:400 1rem var(--body);padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--text)}
form.inq textarea{min-height:120px;resize:vertical}
form.inq .note{font-size:.8rem;color:var(--muted);margin:0}
.err{color:#C2412D;font-size:.82rem;min-height:1em;margin-top:4px}
@media (max-width:860px){.contact-grid{grid-template-columns:1fr}form.inq{grid-template-columns:1fr}}

/* Footer */
footer{padding:64px 0 28px}
.f-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:36px}
footer h3{font-size:1.05rem;margin-bottom:12px}
footer ul{list-style:none;padding:0;margin:0;display:grid;gap:8px;font-size:.9rem;color:var(--on-dark-muted)}
footer ul a{text-decoration:none}
footer ul a:hover{color:var(--on-dark)}
.disclaimer{margin-top:44px;padding-top:22px;border-top:1px solid rgba(201,207,216,.15);font-size:.8rem;color:var(--on-dark-muted);line-height:1.6}
.disclaimer p{max-width:110ch}
@media (max-width:860px){.f-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.f-grid{grid-template-columns:1fr}}

/* Floating buttons + chat */
.fab-stack{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:80;display:flex;flex-direction:column;gap:12px;align-items:flex-end}
.fab{width:58px;height:58px;border-radius:50%;border:0;display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 26px rgba(5,12,28,.35);text-decoration:none}
.fab svg{width:28px;height:28px}
.fab-wa{background:var(--wa);color:#fff}
.fab-chat{background:linear-gradient(145deg,#F5F7FA,#AEB8C5);color:var(--navy);position:relative}
.fab-chat .dot{position:absolute;top:6px;right:6px;width:12px;height:12px;border-radius:50%;background:#2F7BEA;border:2px solid #fff}
.fab-label{background:var(--surface);color:var(--text);font-size:.82rem;padding:7px 12px;border-radius:999px;box-shadow:0 6px 18px rgba(0,0,0,.18);margin-right:4px}
.chat{position:fixed;right:18px;bottom:calc(158px + env(safe-area-inset-bottom,0px));z-index:90;width:min(390px,calc(100vw - 24px));height:min(640px,calc(100% - 180px));background:var(--surface);color:var(--text);border-radius:18px;box-shadow:0 24px 60px rgba(5,12,28,.4);display:flex;flex-direction:column;overflow:hidden;transform-origin:bottom right;transform:scale(.6) translateY(30px);opacity:0;pointer-events:none;transition:transform .28s cubic-bezier(.2,.8,.2,1),opacity .2s}
.chat.open{transform:none;opacity:1;pointer-events:auto}
.chat-h{background:var(--navy);color:var(--on-dark);padding:14px 16px;display:flex;gap:12px;align-items:center}
.chat-h img{width:34px}
.chat-h b{font:400 1.05rem var(--display);display:block}
.chat-h small{color:var(--on-dark-muted);font-size:.75rem}
.chat-h button{margin-inline-start:auto;background:none;border:0;color:var(--on-dark);width:36px;height:36px;cursor:pointer;font-size:1.4rem;line-height:1}
.chat-body{position:relative;flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;background:var(--bg)}
.msg{max-width:86%;padding:10px 14px;border-radius:14px;font-size:.92rem;line-height:1.55;white-space:pre-wrap;word-wrap:break-word}
.msg.bot{background:var(--surface);border:1px solid var(--line);border-bottom-left-radius:4px;align-self:flex-start}
.msg.me{background:var(--navy-3);color:#fff;border-bottom-right-radius:4px;align-self:flex-end}
.msg a{color:inherit;font-weight:500}
.msg.typing{color:var(--muted);font-style:italic}
.quick{display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:6px;padding:8px 12px;border-top:1px solid var(--line);background:var(--surface)}
.quick button{flex:none;white-space:nowrap;background:transparent;border:1px solid var(--line);color:var(--text);border-radius:999px;padding:6px 12px;font:400 .8rem var(--body);cursor:pointer}
.quick button:hover{border-color:var(--navy-3)}
.chat-f{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line);background:var(--surface)}
.chat-f input{flex:1;font:400 .95rem var(--body);padding:10px 14px;border:1px solid var(--line);border-radius:999px;background:var(--bg);color:var(--text)}
.chat-f button{width:42px;height:42px;border-radius:50%;border:0;background:var(--navy-3);color:#fff;cursor:pointer;display:grid;place-items:center}
.chat-note{font-size:.7rem;color:var(--muted);text-align:center;padding:0 12px 8px;background:var(--surface)}

/* Modal */
.modal{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(4,10,22,.7)}
.modal.open{display:flex}
.m-card{background:var(--surface);color:var(--text);border-radius:16px;max-width:860px;width:100%;max-height:calc(100% - 20px);overflow:auto;display:grid;grid-template-columns:320px 1fr;position:relative;animation:mIn .3s cubic-bezier(.2,.8,.2,1)}
@keyframes mIn{from{transform:translateY(20px);opacity:0}}
.m-media{background:var(--navy);display:grid;place-items:center;padding:24px;position:relative;isolation:isolate}
.m-media::before{content:"";position:absolute;inset:0;background-image:var(--grain);z-index:-1}
.m-media video{border-radius:10px;width:100%}
.m-media .ring{width:150px;height:150px}
.m-media .ring svg{width:86px;height:86px}
.m-body{padding:30px}
.m-body h2{font-size:1.9rem;margin-bottom:2px}
.m-body .ur{font-family:var(--urdu);color:var(--muted);line-height:2.2;margin-bottom:14px}
.m-body h3{font-size:1.05rem;margin:18px 0 8px}
.m-body ul{margin:0;padding-inline-start:20px;color:var(--muted);font-size:.93rem}
.m-close{position:absolute;top:10px;right:10px;width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.9);color:var(--navy);font-size:1.4rem;cursor:pointer;z-index:2}
.m-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.m-actions .btn-ghost{color:var(--text)}
@media (max-width:760px){.m-card{grid-template-columns:1fr}.m-media{padding:18px}.m-media video{max-width:260px}}

@media (max-width:600px){.brand small{display:none}.brand b{font-size:1.05rem;white-space:nowrap}.brand img{width:34px}.fab-label{display:none}.chat{right:12px;bottom:calc(150px + env(safe-area-inset-bottom,0px))}}

/* Scroll progress */
.scrollbar{position:absolute;left:0;bottom:-1px;height:2px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,#9AA5B4,#F2F4F7)}

/* Case guides */
.g-tabs{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 12px;margin:32px 0 8px;scrollbar-width:thin}
.g-tab{flex:none;display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.04);border:1px solid rgba(201,207,216,.22);color:var(--on-dark);border-radius:999px;padding:6px 16px 6px 6px;font:400 .9rem var(--body);cursor:pointer;transition:background .2s,border-color .2s}
.g-tab .mini{width:34px;height:34px;border-radius:50%;background:radial-gradient(circle at 50% 35%,#1C3A78,#0B1C40 75%);border:1px solid rgba(201,207,216,.5);display:grid;place-items:center;color:#DCE1E8}
.g-tab .mini svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.g-tab[aria-selected="true"]{background:linear-gradient(180deg,#F4F6F9,#C3CAD4);color:var(--navy);border-color:#fff}
.g-stage{border:1px solid rgba(201,207,216,.18);border-radius:18px;padding:30px;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01))}
.g-head{display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center}
.g-head .ring{margin:0;width:92px;height:92px}
.g-head .ring svg{width:52px;height:52px}
.g-head h3{font-size:1.7rem}
.g-head .where{display:inline-block;margin-top:6px;font-size:.8rem;padding:3px 12px;border-radius:999px;border:1px solid rgba(201,207,216,.3);color:var(--on-dark-muted)}
.g-head p{margin:8px 0 0;color:var(--on-dark-muted);font-size:.95rem}
.g-ctrl{display:flex;gap:8px}
.g-ctrl button{width:44px;height:44px;border-radius:50%;border:1px solid rgba(201,207,216,.35);background:transparent;color:var(--on-dark);cursor:pointer;display:grid;place-items:center;position:relative}
.g-ctrl button:hover{background:rgba(255,255,255,.08)}
.g-ctrl svg{width:18px;height:18px}
.g-ctrl .pp .prog{position:absolute;inset:-1px;width:calc(100% + 2px);height:calc(100% + 2px);transform:rotate(-90deg)}
.g-ctrl .pp .prog circle{fill:none;stroke:#E8ECF2;stroke-width:2;stroke-dasharray:100;stroke-dashoffset:100}
.g-ctrl .pp.running .prog circle{animation:gprog var(--gdur,4.5s) linear forwards}
@keyframes gprog{to{stroke-dashoffset:0}}
.g-track{position:relative;margin:40px 10px 10px;display:grid;grid-template-columns:repeat(5,1fr)}
.g-line{position:absolute;left:10%;right:10%;top:22px;height:3px;background:rgba(201,207,216,.18);border-radius:3px}
.g-fill{height:100%;width:0;background:linear-gradient(90deg,#8C97A6,#F2F4F7);border-radius:3px;transition:width .7s cubic-bezier(.6,0,.2,1)}
.g-token{position:absolute;top:0;width:40px;left:10%;transform:translateX(-50%);transition:left .7s cubic-bezier(.6,0,.2,1);filter:drop-shadow(0 6px 10px rgba(0,0,0,.5));z-index:2;pointer-events:none}
.g-token img{width:100%}
.g-step{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:12px;background:none;border:0;color:var(--on-dark-muted);font:400 .88rem var(--body);cursor:pointer;padding:0 6px;text-align:center;opacity:0;transform:translateY(12px)}
.g-stage.shown .g-step{animation:gstep .5s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes gstep{to{opacity:1;transform:none}}
.g-dot{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--navy);border:2px solid rgba(201,207,216,.3);font:400 1.05rem var(--display);color:var(--on-dark-muted);transition:all .4s}
.g-step.done .g-dot{border-color:#C9CFD8;color:var(--on-dark)}
.g-step.cur .g-dot{background:linear-gradient(180deg,#F4F6F9,#B9C1CC);color:var(--navy);border-color:#fff;box-shadow:0 0 0 6px rgba(201,207,216,.15)}
.g-step.cur{color:var(--on-dark)}
.g-step.cur .g-dot{opacity:0}
.g-detail{margin-top:28px;display:grid;grid-template-columns:1.4fr 1fr;gap:28px;align-items:start;border-top:1px solid rgba(201,207,216,.14);padding-top:24px;min-height:150px}
.g-detail .in{animation:gdet .45s cubic-bezier(.2,.8,.2,1)}
@keyframes gdet{from{opacity:0;transform:translateX(18px)}}
.g-detail small{color:var(--on-dark-muted);font-size:.8rem}
.g-detail h4{font:400 1.45rem var(--display);margin:4px 0 8px}
.g-detail p{color:var(--on-dark-muted);margin:0}
.g-need{background:rgba(255,255,255,.05);border:1px solid rgba(201,207,216,.16);border-radius:12px;padding:16px 18px;font-size:.9rem}
.g-need b{display:block;font:400 1rem var(--display);margin-bottom:4px;color:var(--on-dark)}
.g-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.g-actions .btn{padding:11px 16px;font-size:.88rem}
@media (max-width:760px){
  .g-stage{padding:20px}
  .g-head{grid-template-columns:auto 1fr}
  .g-head .ring{width:72px;height:72px}.g-head .ring svg{width:40px;height:40px}
  .g-head h3{font-size:1.35rem}
  .g-ctrl{grid-column:1/-1}
  .g-track{grid-template-columns:1fr;gap:14px;margin:26px 0 0}
  .g-line{left:22px;right:auto;top:23px;bottom:23px;width:3px;height:auto}
  .g-fill{width:100%!important;height:0;transition:height .7s cubic-bezier(.6,0,.2,1)}
  .g-token{left:22px!important;top:var(--ty,0px);transition:top .7s cubic-bezier(.6,0,.2,1);transform:translate(-50%,-6px);width:36px}
  .g-step{flex-direction:row;text-align:start;padding:0}
  .g-detail{grid-template-columns:1fr}
}

/* Blog */
#blog .b-tools{display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin:30px 0 26px}
.b-cats{display:flex;gap:6px;flex-wrap:wrap}
.b-cats button{background:transparent;border:1px solid var(--line);color:var(--text);padding:7px 14px;border-radius:999px;font:400 .85rem var(--body);cursor:pointer}
.b-cats button[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
.b-search{position:relative;flex:0 1 280px}
.b-search input{width:100%;font:400 .95rem var(--body);padding:10px 14px 10px 38px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--text)}
.b-search svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--muted)}
.b-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.post{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:22px;cursor:pointer;display:flex;flex-direction:column;gap:10px;text-align:start;color:inherit;font:inherit;transition:border-color .2s,transform .2s}
.post:hover{border-color:var(--navy-3);transform:translateY(-3px)}
.post .ptop{display:flex;align-items:center;gap:12px}
.post .ring{width:56px;height:56px;padding:4px;margin:0;box-shadow:0 6px 14px rgba(0,0,0,.2)}
.post .ring svg{width:32px;height:32px}
.post .pcat{font-size:.8rem;color:var(--muted)}
.post h3{font-size:1.18rem;line-height:1.3}
.post p{font-size:.9rem;color:var(--muted);margin:0}
.post .pmeta{margin-top:auto;font-size:.8rem;color:var(--muted);padding-top:8px}
.post.feat{grid-column:span 2;background:var(--navy);color:var(--on-dark);border-color:var(--navy);position:relative;isolation:isolate;overflow:hidden}
.post.feat::before{content:"";position:absolute;inset:0;background-image:var(--grain);z-index:-1}
.post.feat h3{font-size:1.6rem}
.post.feat p,.post.feat .pcat,.post.feat .pmeta{color:var(--on-dark-muted)}
.b-more{display:flex;justify-content:center;margin-top:28px}
.b-more .btn{border-color:var(--line);color:var(--text)}
.b-empty{grid-column:1/-1;text-align:center;color:var(--muted);padding:30px}
@media (max-width:980px){.b-grid{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.b-grid{grid-template-columns:1fr}.post.feat{grid-column:auto}}

/* Reader */
.reader{position:fixed;inset:0;z-index:110;background:var(--bg);color:var(--text);overflow-y:auto;display:none;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
.reader.open{display:block;animation:mIn .35s cubic-bezier(.2,.8,.2,1)}
.r-bar{position:sticky;top:0;z-index:2;background:var(--navy);color:var(--on-dark);display:flex;align-items:center;gap:10px;padding:10px 16px}
.r-bar button,.r-bar a{background:none;border:1px solid rgba(201,207,216,.3);color:inherit;border-radius:999px;padding:8px 14px;font:400 .85rem var(--body);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.r-bar .sp{flex:1}
.r-prog{position:absolute;left:0;bottom:0;height:3px;background:linear-gradient(90deg,#9AA5B4,#fff);width:0}
.r-hero{background:var(--navy);color:var(--on-dark);padding:40px 0 46px;position:relative;isolation:isolate}
.r-hero::before{content:"";position:absolute;inset:0;background-image:var(--grain);z-index:-1}
.r-wrap{width:min(720px,100% - 40px);margin-inline:auto}
.r-hero .ring{width:84px;height:84px;margin-bottom:18px}
.r-hero .ring svg{width:48px;height:48px}
.r-hero h1{font-size:clamp(1.8rem,4.4vw,2.7rem);line-height:1.2;margin-bottom:12px}
.r-hero .meta{color:var(--on-dark-muted);font-size:.88rem}
.r-body{padding:36px 0 20px;font-size:1.04rem;line-height:1.8}
.r-body h3{font-size:1.4rem;margin:30px 0 10px}
.r-body ul{padding-inline-start:22px}
.r-body li{margin-bottom:6px}
.r-cta{margin:30px 0;padding:24px;border-radius:14px;background:var(--navy);color:var(--on-dark);display:grid;gap:12px}
.r-cta b{font:400 1.3rem var(--display)}
.r-cta .row{display:flex;gap:10px;flex-wrap:wrap}
.r-note{font-size:.82rem;color:var(--muted);border-top:1px solid var(--line);padding-top:16px}
.r-rel{padding:10px 0 60px}
.r-rel h2{font-size:1.5rem;margin-bottom:16px}
.r-rel .b-grid{grid-template-columns:1fr}
.r-nav{display:flex;justify-content:space-between;gap:12px;margin:22px 0}
.r-nav button{flex:1;text-align:start;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px;cursor:pointer;color:var(--text);font:400 .9rem var(--body)}
.r-nav button small{display:block;color:var(--muted);font-size:.75rem}
.r-nav button:last-child{text-align:end}

/* Footer */
.f-cta{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:30px 34px;margin-bottom:54px;border-radius:18px;background:linear-gradient(120deg,#1D3563,#13284D);border:1px solid rgba(201,207,216,.2)}
.f-cta h2{font-size:clamp(1.5rem,3vw,2.1rem)}
.f-cta p{margin:6px 0 0;color:var(--on-dark-muted)}
.f-cta .row{display:flex;gap:10px;flex-wrap:wrap}
.f-off li b{display:block;color:var(--on-dark);font-weight:500}
.f-hours{font-size:.85rem;color:var(--on-dark-muted);margin-top:14px}
.legal{margin-top:46px;padding-top:26px;border-top:1px solid rgba(201,207,216,.15);display:grid;grid-template-columns:1fr 1fr;gap:28px}
.legal h3{font-size:1rem;margin-bottom:8px;display:flex;align-items:center;gap:8px}
.legal h3 svg{width:18px;height:18px;flex:none}
.legal p{font-size:.84rem;color:var(--on-dark-muted);line-height:1.7;margin:0 0 8px}
.legal .lnk{background:none;border:0;padding:0;color:var(--on-dark);text-decoration:underline;text-underline-offset:3px;cursor:pointer;font:500 .84rem var(--body)}
.f-bottom{padding-right:76px;margin-top:28px;padding-top:20px;border-top:1px solid rgba(201,207,216,.12);display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;font-size:.8rem;color:var(--on-dark-muted)}
.f-bottom nav{display:flex;gap:16px;flex-wrap:wrap}
.f-bottom button,.f-bottom a{background:none;border:0;padding:0;color:var(--on-dark-muted);font:400 .8rem var(--body);cursor:pointer;text-decoration:none}
.f-bottom button:hover,.f-bottom a:hover{color:var(--on-dark)}
@media (max-width:760px){.legal{grid-template-columns:1fr}.f-cta{padding:24px}}

/* Legal document modal */
.doc .m-card{grid-template-columns:1fr;max-width:760px}
.doc-body{padding:34px 34px 30px}
.doc-body h2{font-size:1.9rem;margin-bottom:4px}
.doc-body .upd{color:var(--muted);font-size:.85rem;margin-bottom:18px}
.doc-body h3{font-size:1.15rem;margin:22px 0 6px}
.doc-body p,.doc-body li{color:var(--muted);font-size:.94rem}
.doc-body ul{padding-inline-start:20px}
.doc-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:18px}
.doc-tabs button{background:transparent;border:1px solid var(--line);color:var(--text);padding:6px 14px;border-radius:999px;font:400 .82rem var(--body);cursor:pointer}
.doc-tabs button[aria-pressed="true"]{background:var(--navy);color:#fff;border-color:var(--navy)}

/* Chat upgrades */
.chat-h .status{display:flex;align-items:center;gap:6px}
.chat-h .sdot{width:8px;height:8px;border-radius:50%;background:#3BC46A;box-shadow:0 0 0 3px rgba(59,196,106,.25)}
.chat-h .sdot.off{background:#E0A43A;box-shadow:0 0 0 3px rgba(224,164,58,.25)}
.chat-h .hbtn{margin-inline-start:0;width:34px;height:34px;border-radius:50%;display:grid;place-items:center}
.chat-h .hbtn:hover{background:rgba(255,255,255,.1)}
.chat-h .hbtn svg{width:18px;height:18px}
.chat-h .hgroup{margin-inline-start:auto;display:flex;gap:2px}
.msg .time{display:block;font-size:.68rem;opacity:.6;margin-top:4px}
.msg.bot.card{background:var(--surface);border-color:var(--navy-3);padding:14px}
.msg.urgent{background:#FFF4F2;border:1px solid #F1B4A8;color:#5A1D12}
:root[data-theme="dark"] .msg.urgent{background:#3A1D18;color:#FCD9D1;border-color:#7A3B30}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .msg.urgent{background:#3A1D18;color:#FCD9D1;border-color:#7A3B30}}
.msg .acts{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.msg .acts a,.msg .acts button{text-align:start;line-height:1.35;font:500 .8rem var(--body);padding:7px 12px;border-radius:999px;text-decoration:none;cursor:pointer;border:1px solid var(--line);background:var(--bg);color:var(--text)}
.msg .acts .wa{background:var(--wa);border-color:var(--wa);color:#fff}
.msg .acts .call{background:#C2412D;border-color:#C2412D;color:#fff}
.dots{display:inline-flex;gap:4px;padding:4px 2px}
.dots i{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:typing 1s infinite}
.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}
.opts{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.opts button{text-align:start;border:1px solid var(--line);background:var(--bg);color:var(--text);border-radius:10px;padding:9px 12px;font:400 .86rem var(--body);cursor:pointer}
.opts button:hover{border-color:var(--navy-3)}
.teaser{position:absolute;right:66px;bottom:4px;width:230px;background:var(--surface);color:var(--text);border-radius:14px 14px 4px 14px;padding:12px 14px;font-size:.85rem;line-height:1.45;box-shadow:0 12px 30px rgba(5,12,28,.3);opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .3s,transform .3s}
.teaser.show{opacity:1;transform:none;pointer-events:auto}
.teaser b{display:block;font:400 1rem var(--display)}
.teaser button{position:absolute;top:4px;right:6px;background:none;border:0;color:var(--muted);cursor:pointer;font-size:1rem}
.fab-chat .badge{position:absolute;top:-2px;right:-2px;min-width:20px;height:20px;border-radius:10px;background:#C2412D;color:#fff;font:600 .72rem/20px var(--body);text-align:center;padding:0 5px}

/* Urdu */
html[lang="ur"] body{font-family:var(--urdu),var(--body);line-height:2.1}
html[lang="ur"] h1,html[lang="ur"] h2,html[lang="ur"] h3,html[lang="ur"] .brand b{font-family:var(--urdu);line-height:1.9}
html[lang="ur"] .hero h1{font-size:clamp(2rem,4.6vw,3.6rem);line-height:1.8}
html[lang="ur"] .office h3 small{font-family:var(--urdu)}
html[dir="rtl"] .arch{justify-self:start}
html[dir="rtl"] #gPrev svg,html[dir="rtl"] #gNext svg{transform:scaleX(-1)}
html[dir="rtl"] .arch-note{left:auto;right:-28px}
html[dir="rtl"] .steps li{padding:0 0 0 18px}
html[dir="rtl"] .steps li::after{left:0;right:44px}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .hero-shield{opacity:1;transform:none}
}

/* =========================================================
   Photo backgrounds, practice-area menu and pages (v1.2)
   To change a photo: replace the matching bg-*.jpg file in
   assets/media/ with your own (keep the same file name).
   ========================================================= */
:root{
  --img-hero:url("/assets/images/backgrounds/hero.jpg");
  --img-practice:url("/assets/images/backgrounds/practice-areas.jpg");
  --img-guides:url("/assets/images/backgrounds/case-guides.jpg");
  --img-offices:url("/assets/images/backgrounds/offices.jpg");
  --img-footer:url("/assets/images/backgrounds/footer.jpg");
  --img-area:url("/assets/images/backgrounds/practice-area-page.jpg");
  --shade:6,13,28;
  --gold:#D9B77A;
}
/* Each dark section: its own photo pinned behind, darkened so text reads clearly */
.dark{background:#070F1F;clip-path:inset(0);--sec-img:var(--img-footer);
  --sec-shade:linear-gradient(rgba(var(--shade),.86),rgba(var(--shade),.86))}
.dark::after{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:var(--sec-img) var(--sec-pos,center)/cover no-repeat;filter:saturate(.8);
  animation:courtZoom 30s ease-in-out infinite alternate;will-change:transform}
.dark::before{background-image:var(--grain),var(--sec-shade)}
@keyframes courtZoom{from{scale:1}to{scale:1.07}}
#home{--sec-img:var(--img-hero);--sec-pos:center 35%;
  --sec-shade:linear-gradient(90deg,rgba(var(--shade),.94) 0%,rgba(var(--shade),.8) 45%,rgba(var(--shade),.52) 100%),linear-gradient(0deg,rgba(var(--shade),.85),transparent 35%)}
#services{--sec-img:var(--img-practice);--sec-pos:center 40%;
  --sec-shade:linear-gradient(180deg,rgba(var(--shade),.9),rgba(var(--shade),.74) 50%,rgba(var(--shade),.92))}
#guides{--sec-img:var(--img-guides);--sec-pos:center 30%;
  --sec-shade:linear-gradient(90deg,rgba(var(--shade),.93),rgba(var(--shade),.78))}
#offices{--sec-img:var(--img-offices);--sec-pos:center 50%;
  --sec-shade:linear-gradient(180deg,rgba(var(--shade),.9),rgba(var(--shade),.76) 50%,rgba(var(--shade),.92))}
footer.dark{--sec-img:var(--img-footer);--sec-pos:center 40%;
  --sec-shade:linear-gradient(180deg,rgba(var(--shade),.86),rgba(var(--shade),.96) 55%)}
@media (max-width:860px){
  #home{--sec-shade:linear-gradient(180deg,rgba(var(--shade),.9),rgba(var(--shade),.8) 45%,rgba(var(--shade),.94))}
}
.dark h1,.dark h2{filter:drop-shadow(0 2px 14px rgba(0,0,0,.5))}
.dark .lede{color:#D3DAE5}
header.site{background:rgba(7,15,31,.82);backdrop-filter:blur(12px) saturate(1.2);-webkit-backdrop-filter:blur(12px) saturate(1.2)}
.facts{background:linear-gradient(rgba(var(--shade),.9),rgba(var(--shade),.93)),var(--img-offices) center 70%/cover}
.office{background:rgba(7,15,31,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.office.active{background:rgba(29,53,99,.55)}
.member.lead,.post.feat{background:linear-gradient(rgba(var(--shade),.88),rgba(var(--shade),.76)),var(--img-guides) center 30%/cover}
.r-hero{background:linear-gradient(90deg,rgba(var(--shade),.94),rgba(var(--shade),.7)),var(--img-hero) center 40%/cover}

/* Hero entrance */
.hero h1,.hero .lede,.hero .hero-ctas,.hero .need{animation:heroRise 1s cubic-bezier(.2,.7,.2,1) both}
.hero .lede{animation-delay:.18s}
.hero .hero-ctas{animation-delay:.3s}
.hero .need{animation-delay:.42s}
.hero .arch{animation:archIn 1.3s cubic-bezier(.2,.7,.2,1) .2s both}
@keyframes heroRise{from{opacity:0;translate:0 26px}}
@keyframes archIn{from{opacity:0;scale:.94;translate:0 30px}}

/* Practice-area tiles: name only, cases slide up on hover */
#services .reels{display:none}
.svc-grid{background:rgba(201,207,216,.18)}
.svc{position:relative;overflow:hidden;min-height:250px;justify-content:center;text-decoration:none;
  background:rgba(7,15,31,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:background .3s}
.svc:hover,.svc:focus-visible{background:rgba(20,40,78,.6)}
.svc .more{margin-top:14px}
.svc-cases{position:absolute;inset:0;padding:24px 20px;display:flex;flex-direction:column;text-align:start;
  background:linear-gradient(180deg,rgba(10,22,46,.97),rgba(6,13,28,.98));border-top:2px solid var(--gold);
  translate:0 101%;transition:translate .45s cubic-bezier(.2,.7,.2,1)}
.svc-cases b{font:400 1.08rem var(--display);color:#fff;margin-bottom:12px}
.svc .svc-cases ul{display:grid;gap:8px;margin:0 0 auto;padding:0;list-style:none;font-size:.87rem;line-height:1.5;color:#C3CCD8}
.svc-cases li{position:relative;padding-inline-start:16px}
.svc-cases li::before{content:"";position:absolute;inset-inline-start:0;top:.55em;width:6px;height:6px;border-radius:50%;background:var(--gold)}
.svc-cases .go{font-size:.84rem;color:var(--gold);margin-top:14px}
@media (hover:hover){.svc:hover .svc-cases,.svc:focus-visible .svc-cases{translate:0 0}}

/* Practice areas mega menu */
nav.main li.has-mega{position:static}
.mega{position:absolute;left:0;right:0;top:100%;z-index:60;background:rgba(7,15,31,.97);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid rgba(217,183,122,.35);
  border-bottom:1px solid rgba(201,207,216,.12);box-shadow:0 30px 60px rgba(0,0,0,.45);
  opacity:0;visibility:hidden;translate:0 -8px;transition:opacity .22s,translate .22s,visibility .22s}
.mega::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:20px}
nav.main li.has-mega:hover .mega,nav.main li.has-mega:focus-within .mega{opacity:1;visibility:visible;translate:0 0}
.mega.shut{display:none}
.mega-grid{width:min(1160px,100% - 40px);margin-inline:auto;display:grid;grid-template-columns:repeat(5,1fr);gap:26px 28px;padding:28px 0 18px}
nav.main .mega a.mega-h{display:flex;align-items:center;gap:10px;padding:0;margin-bottom:8px;font:400 1rem/1.25 var(--display);color:#fff;border-radius:0}
nav.main .mega a.mega-h:hover{background:none;color:var(--gold)}
.mega-ic{width:8px;height:8px;flex:none;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(217,183,122,.18)}
nav.main .mega ul{display:grid;gap:0;flex-direction:initial}
nav.main .mega li a{padding:4px 0;font-size:.84rem;line-height:1.4;color:var(--on-dark-muted);border-radius:0}
nav.main .mega li a:hover{background:none;color:#fff}
.mega-foot{width:min(1160px,100% - 40px);margin-inline:auto;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding:14px 0 22px;border-top:1px solid rgba(201,207,216,.12);font-size:.86rem;color:var(--on-dark-muted)}
nav.main .mega-foot a{display:inline;padding:0;color:var(--gold)}
nav.main .mega-foot a:hover{background:none;text-decoration:underline}
@media (max-width:980px){.mega{display:none}}

/* Practice-area page */
.area{position:fixed;inset:0;z-index:105;overflow-y:auto;background:var(--bg);color:var(--text);display:none;
  padding-bottom:env(safe-area-inset-bottom,0px)}
.area.open{display:block;animation:mIn .35s cubic-bezier(.2,.8,.2,1)}
.a-wrap{width:min(1160px,100% - 40px);margin-inline:auto}
.a-bar{position:sticky;top:0;z-index:3;background:rgba(7,15,31,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  color:var(--on-dark);padding-top:env(safe-area-inset-top,0px);border-bottom:1px solid rgba(201,207,216,.14)}
.a-bar .a-wrap{display:flex;align-items:center;gap:14px;height:60px}
.a-back{background:none;border:1px solid rgba(201,207,216,.35);color:inherit;border-radius:999px;padding:8px 14px;font:500 .86rem var(--body);cursor:pointer}
.a-back:hover{border-color:var(--silver)}
.a-bt{font:400 1.05rem var(--display);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.a-bar .btn-wa{padding:9px 14px;font-size:.86rem}
.a-hero{position:relative;isolation:isolate;overflow:hidden;color:var(--on-dark);padding:64px 0 60px;background:#070F1F}
.a-hero::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--a-img,var(--img-area)) center 35%/cover;filter:saturate(.8);animation:courtZoom 30s ease-in-out infinite alternate}
.a-hero::after{content:"";position:absolute;inset:0;z-index:-1;background-image:var(--grain),linear-gradient(90deg,rgba(var(--shade),.95),rgba(var(--shade),.74))}
.crumb{font-size:.84rem;color:var(--on-dark-muted);margin-bottom:22px}
.crumb a{color:var(--on-dark);text-decoration:none}
.crumb a:hover{text-decoration:underline}
.a-hero .ring{width:84px;height:84px;margin:0 0 18px}
.a-hero .ring svg{width:46px;height:46px}
.a-hero h1{font-size:clamp(2.2rem,5vw,3.6rem);line-height:1.08;margin:0 0 6px}
.a-hero .ur{font-family:var(--urdu);color:var(--gold);font-size:1.1rem;line-height:2.1;margin-bottom:10px}
.a-hero p{max-width:64ch;color:#D3DAE5;font-size:1.05rem}
.a-hero .row{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.a-body{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:52px;padding:56px 0 80px}
.a-body h2{font-size:clamp(1.45rem,2.6vw,1.9rem);margin:0 0 18px}
.area .a-sec{margin-bottom:48px;padding:0}
.a-cases{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.a-cases li{background:var(--surface);border:1px solid var(--line);border-inline-start:3px solid var(--gold);border-radius:10px;padding:16px 18px;font-weight:500;line-height:1.45}
.a-video{border-radius:14px;overflow:hidden;background:#000;aspect-ratio:16/9;max-width:720px}
.a-video video{width:100%;height:100%;object-fit:cover}
.a-docs{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.a-docs li{display:flex;gap:12px;align-items:flex-start;line-height:1.5}
.a-docs li::before{content:"";flex:none;width:20px;height:20px;margin-top:2px;border-radius:5px;border:1.5px solid var(--gold);
  background:linear-gradient(135deg,transparent 45%,var(--gold) 45% 55%,transparent 55%)}
.a-posts{display:grid;gap:10px}
.a-post{display:flex;justify-content:space-between;gap:16px;align-items:baseline;text-decoration:none;padding:14px 0;border-bottom:1px solid var(--line)}
.a-post b{font-weight:500}
.a-post span{font-size:.84rem;color:var(--muted);white-space:nowrap}
.a-post:hover b{text-decoration:underline}
.a-side{position:sticky;top:84px;align-self:start;display:grid;gap:16px}
.a-card{border-radius:14px;padding:22px;border:1px solid var(--line);background:var(--surface)}
.a-card.dk{color:var(--on-dark);border:0;background:linear-gradient(rgba(var(--shade),.9),rgba(var(--shade),.82)),var(--img-practice) center/cover}
.a-card h3{font-size:1.2rem;margin-bottom:8px}
.a-card p{font-size:.9rem;color:var(--muted)}
.a-card.dk p{color:var(--on-dark-muted)}
.a-card .btn{width:100%;justify-content:center;margin-top:10px}
.a-card ul{list-style:none;padding:0;margin:0;display:grid}
.a-card ul a{display:block;padding:9px 0;border-bottom:1px solid var(--line);text-decoration:none;font-size:.92rem}
.a-card ul a:hover{color:var(--gold)}
@media (max-width:900px){.a-body{grid-template-columns:1fr;gap:8px}.a-side{position:static}.a-bar .btn-wa span{display:none}}

/* Scroll reveal (classes added by main.js) */
.rv{opacity:0;translate:0 28px}
.rv.on{opacity:1;translate:none;transition:opacity .8s ease var(--d,0ms),translate .9s cubic-bezier(.2,.7,.2,1) var(--d,0ms)}
@media (prefers-reduced-motion:reduce){
  .dark::after,.a-hero::before{animation:none}
  .rv{opacity:1;translate:none}
  .svc-cases,.mega{transition:none}
}

/* =========================================================
   v1.3: top bar, facts, practice cards, black/blue menus,
   Insights and Contact pages
   ========================================================= */
:root{--blue:#4C8DFF;--blue-hi:#8DB6FF;--ink:#030509}
/* photos show more, text side stays dark */
.dark::after{filter:none}
#home{--sec-shade:linear-gradient(90deg,rgba(var(--shade),.93) 0%,rgba(var(--shade),.72) 42%,rgba(var(--shade),.3) 100%),linear-gradient(0deg,rgba(var(--shade),.8),transparent 30%)}
#services{--sec-shade:linear-gradient(180deg,rgba(var(--shade),.88),rgba(var(--shade),.55) 50%,rgba(var(--shade),.9))}
#guides{--sec-shade:linear-gradient(90deg,rgba(var(--shade),.92),rgba(var(--shade),.62))}
#offices{--sec-shade:linear-gradient(180deg,rgba(var(--shade),.88),rgba(var(--shade),.6) 50%,rgba(var(--shade),.9))}

/* Top bar: its own black strip, clearly separate from the menu */
.topbar{background:var(--ink);color:#AFC0DC;font-size:.82rem;position:relative}
.topbar::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,var(--blue) 30%,var(--blue) 70%,transparent);opacity:.7}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:10px 18px;padding:8px 0;flex-wrap:wrap}
.tb-l,.tb-r{display:flex;align-items:center;gap:10px 16px;flex-wrap:wrap}
.tb-it{display:inline-flex;align-items:center;gap:7px}
.tb-it svg{width:14px;height:14px;color:var(--blue-hi);flex:none}
.tb-free{display:inline-flex;align-items:center;gap:6px;background:var(--blue);color:#fff!important;border-radius:999px;padding:4px 12px;font-weight:500;text-decoration:none}
.tb-free:hover{background:#3A78EA}
.tb-ph{color:#fff!important;font-weight:500}
header.site{background:rgba(8,15,30,.94);border-bottom:1px solid rgba(76,141,255,.22);box-shadow:0 10px 30px rgba(0,0,0,.35)}
@media (max-width:640px){.tb-hours,.tb-ph{display:none}.topbar .wrap{justify-content:center}}

/* Facts: a confident band under the hero */
.facts{background:linear-gradient(180deg,#060B16,#0A1426);border-top:1px solid rgba(76,141,255,.35);border-bottom:1px solid rgba(76,141,255,.2);position:relative;z-index:1}
.facts .wrap{gap:0}
.fact{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:16px;padding:30px 22px;color:#AFC3E8;font-size:.92rem;transition:background .25s}
.fact:hover{background:rgba(76,141,255,.07)}
.fact .f-ic{grid-row:span 2;width:50px;height:50px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 30% 30%,rgba(76,141,255,.35),rgba(76,141,255,.08));border:1px solid rgba(141,182,255,.45);color:#fff}
.fact .f-ic svg{width:22px;height:22px}
.fact b{font:400 1.35rem/1.2 var(--display);color:#fff;margin:0}
.fact span:not(.f-ic){color:#AFC3E8}
@media (max-width:760px){.fact{padding:20px 14px}.fact b{font-size:1.1rem}.fact .f-ic{width:40px;height:40px}}

/* Practice areas: video cards instead of the tile grid */
#services .svc-grid{display:none}
#services .reels{display:block;margin-top:8px}
#services .reels-head h3{display:none}
#services .reels-head{display:none}
.svc-head{align-items:flex-end}
.svc-head .reel-nav{display:flex;gap:8px}
.pc-track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 2px 18px;scrollbar-width:none}
.pc-track::-webkit-scrollbar{display:none}
.pc{flex:0 0 232px;scroll-snap-align:start;border-radius:14px;overflow:hidden;text-decoration:none;color:#fff;
  background:#070C17;border:1px solid rgba(201,207,216,.18);transition:translate .3s,border-color .3s,box-shadow .3s}
.pc-media{aspect-ratio:1/1;position:relative;overflow:hidden;background:#0B1424}
.pc-media video,.pc-media img{width:100%;height:100%;object-fit:cover;display:block}
.pc-fake{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:16px;text-align:center;
  background:radial-gradient(circle at 50% 40%,#2A3B55,#121B2B 70%)}
.pc-fake img{width:30px;height:auto}
.pc-fake small{font-size:.55rem;letter-spacing:.12em;color:#C9D3E2}
.pc-fake .ring{width:74px;height:74px;margin:6px 0}
.pc-fake .ring svg{width:40px;height:40px}
.pc-fake b{font:600 .78rem var(--body);letter-spacing:.06em;text-transform:uppercase}
.pc-fake em{font-style:normal;font-size:.62rem;color:#C9D3E2;line-height:1.5}
.pc-lab{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 14px;background:#0A1222;font-size:.92rem;font-weight:500;border-top:1px solid rgba(201,207,216,.1);transition:background .3s}
.pc-lab i{font-style:normal;color:var(--blue-hi);opacity:0;translate:-6px 0;transition:opacity .3s,translate .3s}
.pc:hover,.pc:focus-visible{translate:0 -6px;border-color:rgba(76,141,255,.7);box-shadow:0 18px 40px rgba(0,0,0,.5),0 0 0 1px rgba(76,141,255,.35)}
.pc:hover .pc-lab,.pc:focus-visible .pc-lab{background:#000}
.pc:hover .pc-lab i,.pc:focus-visible .pc-lab i{opacity:1;translate:none}
.pc-nav{width:42px;height:42px;border-radius:50%;border:1px solid rgba(201,207,216,.45);background:rgba(0,0,0,.35);color:#fff;font-size:1.3rem;cursor:pointer}
.pc-nav:hover{background:#000;border-color:var(--blue)}

/* Menus: black panel, white type, blue accents */
.mega{background:rgba(2,3,6,.97);border-top:1px solid rgba(76,141,255,.55);box-shadow:0 30px 60px rgba(0,0,0,.6)}
.mega-ic{background:var(--blue);box-shadow:0 0 0 4px rgba(76,141,255,.22)}
nav.main .mega a.mega-h:hover{color:var(--blue-hi)}
nav.main .mega li a{color:#B9C3D3}
nav.main .mega li a:hover{color:#fff;text-decoration:underline;text-decoration-color:var(--blue);text-underline-offset:4px}
nav.main .mega-foot a{color:var(--blue-hi)}
.mega-grid.four{grid-template-columns:1.4fr 1fr 1fr 1fr}
.mega-k{font:500 .78rem var(--body);letter-spacing:.04em;color:var(--blue-hi);margin:0 0 10px}
nav.main .mega .ins-t{color:#fff;font-size:.9rem;line-height:1.4;padding:6px 0}
.mega-empty{font-size:.84rem;color:#8E9AAD;line-height:1.5;margin:0}

/* Overlay pages (Insights, Contact) */
.pg{position:fixed;inset:0;z-index:104;overflow-y:auto;background:var(--bg);color:var(--text);display:none}
.pg.open{display:block;animation:mIn .35s cubic-bezier(.2,.8,.2,1)}
.pg .a-hero{padding:56px 0 52px}
.pg .a-hero h1{margin-bottom:10px}
.pg #blog{padding:48px 0 72px}
.pg #blog > .wrap > h2,.pg #blog > .wrap > .lede{display:none}
.pg .pg-sec{padding:0 0 72px}
.pg .pg-sec h2{font-size:clamp(1.5rem,2.6vw,2rem);margin:0 0 18px}
.ev-empty{border:1px dashed var(--line);border-radius:14px;padding:26px;display:flex;gap:16px;justify-content:space-between;align-items:center;flex-wrap:wrap;color:var(--muted)}
.ev{display:grid;grid-template-columns:90px 1fr;gap:18px;padding:18px 0;border-bottom:1px solid var(--line)}
.ev-d{background:#000;color:#fff;border-radius:12px;text-align:center;padding:10px 6px;border-bottom:3px solid var(--blue)}
.ev-d b{display:block;font:400 1.6rem var(--display)}
.btn-blue{background:var(--blue);color:#fff}
.btn-blue:hover{background:#3A78EA}
.btn-dark{background:#000;color:#fff}

/* Contact page */
.c-quick{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.c-quick a{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:12px;background:rgba(0,0,0,.45);border:1px solid rgba(141,182,255,.35);color:#fff;text-decoration:none;font-size:.92rem;backdrop-filter:blur(6px)}
.c-quick a:hover{background:#000;border-color:var(--blue)}
.c-quick svg{width:18px;height:18px;color:var(--blue-hi)}
.c-quick small{display:block;color:#AFC0DC;font-size:.75rem}
.fees{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:-34px;position:relative;z-index:2}
.fee{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:24px;display:flex;flex-direction:column;box-shadow:0 14px 34px rgba(4,10,22,.12)}
.fee.hl{background:#05070C;color:#fff;border-color:var(--blue);box-shadow:0 18px 40px rgba(76,141,255,.22)}
.fee .tag{align-self:flex-start;font-size:.74rem;font-weight:600;background:var(--blue);color:#fff;border-radius:999px;padding:3px 10px;margin-bottom:12px}
.fee h3{font-size:1.25rem}
.fee .dur{font-size:.85rem;color:var(--muted);margin:2px 0 14px}
.fee.hl .dur,.fee.hl p{color:#B9C6DC}
.fee .price{font:400 2rem/1 var(--display);margin-bottom:12px}
.fee.hl .price{color:var(--blue-hi)}
.fee p{font-size:.9rem;color:var(--muted);margin-bottom:18px}
.fee .btn{margin-top:auto;justify-content:center}
.fee:not(.hl) .btn{border-color:var(--text);color:var(--text)}
.book{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:28px;margin-top:20px}
.cal,.slotbox,.bk-form{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:22px}
.cal-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.cal-h b{font:400 1.25rem var(--display)}
.cal-h button{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:none;color:var(--text);cursor:pointer;font-size:1.1rem}
.cal-h button:disabled{opacity:.3;cursor:default}
.cal-g{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;text-align:center}
.cal-g .wd{font-size:.75rem;color:var(--muted);padding:4px 0}
.cal-g button{aspect-ratio:1;border-radius:10px;border:1px solid transparent;background:none;color:var(--text);font:500 .92rem var(--body);cursor:pointer}
.cal-g button:hover:not(:disabled){border-color:var(--blue)}
.cal-g button:disabled{color:var(--muted);opacity:.35;cursor:default;text-decoration:line-through}
.cal-g button.today{border-color:var(--line)}
.cal-g button.sel{background:#000;color:#fff;border-color:var(--blue);box-shadow:inset 0 -3px 0 var(--blue)}
.cal-note{font-size:.8rem;color:var(--muted);margin:12px 0 0}
.seg{display:flex;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:4px;gap:4px;margin-bottom:14px}
.seg button{flex:1;border:0;background:none;border-radius:9px;padding:9px 8px;font:500 .86rem var(--body);color:var(--text);cursor:pointer}
.seg button[aria-pressed="true"]{background:#000;color:#fff}
.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px;max-height:236px;overflow:auto;padding-right:2px}
.slots button{padding:9px 6px;border-radius:9px;border:1px solid var(--line);background:none;color:var(--text);font:500 .86rem var(--body);cursor:pointer}
.slots button:hover:not(:disabled){border-color:var(--blue)}
.slots button:disabled{opacity:.35;cursor:default}
.slots button[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);color:#fff}
.slot-empty{color:var(--muted);font-size:.9rem;padding:8px 0}
.bk-form{margin-top:18px;display:grid;gap:12px}
.bk-form .two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.bk-form label{display:grid;gap:5px;font-size:.84rem;font-weight:500}
.bk-form input,.bk-form select,.bk-form textarea{font:400 .95rem var(--body);padding:11px 12px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--text);width:100%}
.bk-form input:focus,.bk-form select:focus,.bk-form textarea:focus{outline:2px solid var(--blue);outline-offset:1px}
.bk-sum{background:#000;color:#fff;border-radius:12px;padding:14px 16px;font-size:.9rem;line-height:1.5;border-left:3px solid var(--blue)}
.bk-sum small{color:#9FB0CC}
.bk-err{color:#D9534F;font-size:.84rem;min-height:1em;margin:0}
.c-offs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.c-off{border-radius:16px;padding:22px;background:#05070C;color:#fff;border:1px solid rgba(76,141,255,.25)}
.c-off h3{font-size:1.25rem}
.c-off .t{font-size:.8rem;color:var(--blue-hi);margin:2px 0 10px}
.c-off p{color:#B9C6DC;font-size:.9rem;margin:0 0 4px}
.c-off a{color:var(--blue-hi);font-size:.88rem;display:inline-block;margin-top:10px}
@media (max-width:900px){.fees,.book,.c-offs{grid-template-columns:1fr}.fees{margin-top:20px}}
@media (max-width:520px){.bk-form .two{grid-template-columns:1fr}}

/* Front page: blog and contact now live on their own pages */
main #blog,main #contact{display:none}
#faq{padding-top:88px!important}

/* =========================================================
   v1.4: Insights page, dark and easy to read
   ========================================================= */
#insightsPage{background:#05070C;color:#E8EDF5}
#insightsPage .a-hero{padding:60px 0 56px}
#insightsPage #blog{padding:0 0 64px}
#insightsPage #blog .b-tools{position:sticky;top:60px;z-index:2;margin:0 0 30px;padding:16px 0;
  background:rgba(5,7,12,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(141,182,255,.14)}
#insightsPage .b-cats{gap:8px}
#insightsPage .b-cats button{border-color:rgba(255,255,255,.18);color:#D5DDEA;padding:8px 15px;font-size:.88rem}
#insightsPage .b-cats button:hover{border-color:var(--blue)}
#insightsPage .b-cats button[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);color:#fff}
#insightsPage .b-search input{background:#0C1220;border-color:rgba(255,255,255,.18);color:#fff;font-size:.95rem}
#insightsPage .b-search input::placeholder{color:#8C99AD}
#insightsPage .b-search svg{color:#8DB6FF}
#insightsPage .b-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
#insightsPage .post{position:relative;isolation:isolate;overflow:hidden;min-height:270px;padding:26px 26px 22px;gap:12px;border-radius:16px;
  background:linear-gradient(180deg,#0F1A33,#0A1224);border:1px solid rgba(141,182,255,.16);color:#fff;
  transition:translate .3s,border-color .3s,box-shadow .3s}
#insightsPage .post::before{content:"";position:absolute;inset:0;z-index:-1;background-image:var(--grain);opacity:.7}
#insightsPage .post:hover,#insightsPage .post:focus-visible{transform:none;translate:0 -4px;border-color:var(--blue);box-shadow:0 18px 40px rgba(0,0,0,.5)}
#insightsPage .post .ring{width:46px;height:46px;padding:3px}
#insightsPage .post .ring svg{width:26px;height:26px}
#insightsPage .post .pcat{color:var(--blue-hi);font-size:.82rem;font-weight:600}
#insightsPage .post h3{font-size:1.32rem;line-height:1.35;color:#fff;margin-top:4px}
#insightsPage .post p{font-size:.98rem;line-height:1.65;color:#C3CDDC}
#insightsPage .post .pmeta{color:#8E9BB0;font-size:.82rem;border-top:1px solid rgba(255,255,255,.1);padding-top:14px;margin-top:auto}
#insightsPage .post.feat{grid-column:span 2;min-height:320px;padding:34px;justify-content:flex-end;
  background:linear-gradient(0deg,rgba(5,9,18,.96) 30%,rgba(5,9,18,.72)),var(--img-practice) center 35%/cover;border-color:rgba(141,182,255,.3)}
#insightsPage .post.feat h3{font-size:clamp(1.5rem,2.6vw,2rem);line-height:1.25;max-width:26ch}
#insightsPage .post.feat p{font-size:1.05rem;color:#D3DAE5;max-width:60ch}
#insightsPage .post.feat .pmeta{color:#AFC0DC}
#insightsPage .b-more .btn{border-color:rgba(255,255,255,.4);color:#fff}
#insightsPage .b-more .btn:hover{background:#000;border-color:var(--blue)}
#insightsPage .b-empty{color:#B9C6DC}
#insightsPage .pg-sec h2{color:#fff}
#insightsPage .ev-empty{border-color:rgba(141,182,255,.3);color:#B9C6DC;background:#0A1222}
#insightsPage .ev{border-color:rgba(255,255,255,.1)}
#insightsPage .ev h3{color:#fff}
#insightsPage .btn-dark{background:var(--blue)}
@media (max-width:1000px){#insightsPage .b-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){
  #insightsPage .b-grid{grid-template-columns:1fr}
  #insightsPage .post.feat{grid-column:auto;padding:26px}
  #insightsPage #blog .b-tools{position:static}
}

/* Article pages: comfortable reading */
.reader{background:#F6F7F9}
.r-hero{padding:52px 0 54px}
.r-hero h1{font-size:clamp(1.9rem,4.4vw,2.8rem);line-height:1.2}
.r-hero .meta{color:#B9C6DC;font-size:.9rem}
.r-wrap{width:min(700px,100% - 40px)}
.r-body{font-size:1.1rem;line-height:1.85;color:#1C2638;padding-top:44px}
.r-body p{margin:0 0 1.15em}
.r-body h3{font-size:1.55rem;line-height:1.3;margin:42px 0 12px;color:#0E1F3D}
.r-body strong,.r-body b{color:#0E1F3D}
.r-body li{margin-bottom:10px}
.r-body a{color:#2F6FE0}
.r-cta{background:#05070C;border-left:3px solid var(--blue)}
.r-rel{border-top:1px solid var(--line);padding-top:36px}
.r-bar{background:#05070C}
.r-prog{background:linear-gradient(90deg,var(--blue),var(--blue-hi))}
#insBar{position:sticky;top:0;z-index:4}
#insightsPage #blog .b-tools{flex-wrap:nowrap;gap:16px;padding:14px 0}
#insightsPage .b-cats{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;flex:1 1 auto;min-width:0;
  mask-image:linear-gradient(90deg,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,#000 92%,transparent)}
#insightsPage .b-cats::-webkit-scrollbar{display:none}
#insightsPage .b-cats button{flex:none}
#insightsPage .b-search{flex:0 0 260px}
@media (max-width:640px){#insightsPage #blog .b-tools{flex-wrap:wrap}#insightsPage .b-search{flex:1 1 100%}}

/* =========================================================
   v1.5: white facts band, simpler brand, team circles, video size
   ========================================================= */
/* Brand: logo + name only */
.brand b{font-size:1.3rem}
/* Hero: no shield, heading sits higher */
.hero-shield{display:none}
.hero{padding-top:34px}
.hero h1{margin-top:0}
@media (min-width:861px){.hero-grid{align-items:start}.hero .arch{margin-top:6px}}

/* Facts band: white */
.facts{background:#fff;color:var(--text);border-top:0;border-bottom:1px solid #E2E7EF;box-shadow:0 10px 30px rgba(4,10,22,.18)}
.fact{color:#4A586D;border-inline-start-color:#E2E7EF!important}
.fact:hover{background:#F3F7FF}
.fact b{color:#0E1F3D!important}
.fact span:not(.f-ic){color:#4A586D}
.fact .f-ic{background:#0E1F3D;border-color:#0E1F3D;color:#fff;box-shadow:0 0 0 4px rgba(76,141,255,.15)}
@media (max-width:760px){.fact{border-top-color:#E2E7EF!important}}

/* Practice-area page: show the whole square video */
.a-video{aspect-ratio:1/1;width:min(100%,480px);max-width:none;background:#0B1424;border:1px solid var(--line);box-shadow:0 18px 40px rgba(4,10,22,.18)}
.a-video video{object-fit:contain}

/* Team: four circles */
.team-grid.tm-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;margin-top:44px}
.tm{text-align:center;display:flex;flex-direction:column;align-items:center}
.tm-ph{width:min(190px,100%);aspect-ratio:1;border-radius:50%;padding:5px;margin-bottom:18px;
  background:conic-gradient(from 210deg,#4C8DFF,#0E1F3D,#9AA5B4,#4C8DFF);box-shadow:0 16px 34px rgba(4,10,22,.22);transition:translate .3s}
.tm:hover .tm-ph{translate:0 -4px}
.tm-in{width:100%;height:100%;border-radius:50%;overflow:hidden;background:linear-gradient(160deg,#16294D,#0A1428);display:grid;place-items:center;border:3px solid var(--bg)}
.tm-in img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.tm-in .ini{font:400 2.6rem var(--display);color:#E7EBF1}
.tm-in svg{width:46%;height:46%;color:#8DB6FF}
.tm h3{font-size:1.25rem;margin-bottom:2px}
.tm.todo h3{font:italic 400 1rem var(--body);color:var(--muted)}
.tm .mrole{margin-bottom:8px}
.tm .mcity{border-color:var(--blue);color:var(--text)}
.tm .mareas{max-width:28ch;margin-inline:auto}
@media (max-width:900px){.team-grid.tm-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:440px){.team-grid.tm-grid{gap:20px 14px}.tm h3{font-size:1.05rem}}

/* Booking confirmation note */
.bk-done{display:none;background:#EAF7EF;border:1px solid #1FA855;color:#0F5A2E;border-radius:12px;padding:14px 16px;font-size:.92rem;line-height:1.5}
.bk-done.show{display:block}
.bk-done b{display:block;margin-bottom:2px}
.tm-ph{width:190px;height:190px;max-width:100%}
.tm-in{position:relative}
.tm-in img{position:absolute;inset:0}
@media (max-width:440px){.tm-ph{width:140px;height:140px}}

/* =========================================================
   v1.6: About section redesign, booking honeypot
   ========================================================= */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
#about{background:var(--surface);padding:110px 0 100px;position:relative;overflow:hidden}
#about::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,#0E1F3D,var(--blue),#0E1F3D)}
.ab-top{display:grid;grid-template-columns:minmax(160px,.32fr) 1fr;gap:48px;align-items:start;margin-bottom:68px}
.ab-top h2{padding-top:10px}
.ab-quote{margin:0;position:relative;font:400 clamp(1.7rem,3.4vw,2.9rem)/1.18 var(--display);color:var(--text);max-width:24ch;padding-inline-start:46px}
.ab-quote::before{content:"\201C";position:absolute;inset-inline-start:0;top:-.18em;font-size:2.4em;line-height:1;color:var(--blue)}
.ab-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:76px;align-items:start}
.ab-photo{margin:0;position:relative}
.ab-arch{border-radius:260px 260px 10px 10px;overflow:hidden;aspect-ratio:4/5;box-shadow:0 30px 60px rgba(4,10,22,.22);border:1px solid var(--line)}
.ab-arch img{width:100%;height:100%;object-fit:cover;object-position:50% 25%;display:block}
.plate{position:relative;margin:-60px 26px 0;padding:18px 22px;border-radius:10px;color:#fff;
  background:linear-gradient(135deg,#13264A,#05070C);border-top:3px solid var(--blue);box-shadow:0 18px 36px rgba(4,10,22,.35)}
.plate b{display:block;font:400 1.4rem/1.2 var(--display)}
.plate span{display:block;color:var(--blue-hi);font-size:.9rem;margin-top:2px}
.plate small{display:block;color:#AFC0DC;font-size:.8rem;margin-top:6px}
.ab-copy p{font-size:1.05rem;line-height:1.82;color:var(--muted);max-width:62ch}
.ab-copy [data-i18n="aboutBody"] p:first-child{color:var(--text);font-size:1.15rem}
html:not([lang="ur"]) .ab-copy [data-i18n="aboutBody"] p:first-child::first-letter{float:left;font:400 4.4rem/.82 var(--display);margin:8px 12px 0 0;color:var(--text)}
#about .mission{margin-top:30px;border-inline-start:3px solid var(--blue);background:rgba(76,141,255,.07);border-radius:0 10px 10px 0}
#about .values.ab-vals{grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:76px;padding-top:0;border-top:1px solid var(--line)}
#about .ab-vals > div{padding:26px 26px 0 0;border-top:3px solid transparent;margin-top:-2px;transition:border-color .3s}
#about .ab-vals > div:hover{border-top-color:var(--blue)}
#about .ab-vals h3{font-size:1.3rem;margin-bottom:8px}
@media (max-width:900px){
  .ab-top,.ab-grid{grid-template-columns:1fr;gap:28px}
  .ab-photo{max-width:420px}
  #about .values.ab-vals{grid-template-columns:1fr 1fr;gap:0 20px}
}
@media (max-width:520px){#about .values.ab-vals{grid-template-columns:1fr}#about{padding:76px 0}}

/* =========================================================
   v1.7: About heading colour + photo frame, light Insights page
   ========================================================= */
#about h2{color:var(--blue)}
.ab-photo{isolation:isolate;padding:0 22px 22px 0}
.ab-photo::before{content:"";position:absolute;inset:22px 0 0 22px;border:2px solid var(--blue);border-radius:6px;z-index:-1}
.ab-arch{border-radius:6px;aspect-ratio:4/5}
.plate{margin:-54px -6px 0 30px}
html[dir="rtl"] .ab-photo{padding:0 0 22px 22px}
html[dir="rtl"] .ab-photo::before{inset:22px 22px 0 0}

.bk-form .bad{outline:2px solid #D9534F;outline-offset:1px}

/* Insights: white page, image-led cards */
#insightsPage{background:#fff;color:#14233D}
#insightsPage .a-hero{background:#fff;color:#14233D;padding:36px 0 6px}
#insightsPage .a-hero::before,#insightsPage .a-hero::after{display:none}
#insightsPage .a-hero h1{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:#0E1F3D;filter:none;font-size:clamp(2rem,4vw,3rem)}
#insightsPage .a-hero p{color:#4A586D}
#insightsPage .crumb,#insightsPage .crumb a{color:#4A586D}
#insightsPage #blog,#insightsPage #insEvents{display:none}
.in-tools{display:grid;grid-template-columns:1.1fr 1.5fr .9fr .9fr;gap:18px;align-items:end;margin-top:26px;margin-bottom:34px}
.in-f{display:grid;gap:6px}
.in-f > span{font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#8A94A6}
.in-f input,.in-f select{height:46px;border:0;border-radius:4px;background:#EEF1F5;color:#14233D;font:400 .95rem var(--body);padding:0 14px;width:100%}
.in-f input:focus,.in-f select:focus{outline:2px solid var(--blue)}
.in-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.in-tabs button{height:46px;border:0;border-radius:4px;background:#EEF1F5;color:#14233D;font:500 .95rem var(--body);cursor:pointer}
.in-tabs button:hover{background:#E1E7F0}
.in-tabs button[aria-pressed="true"]{background:var(--blue);color:#fff}
.in-count{font-size:.85rem;color:#8A94A6;margin:0 0 14px}
.in-feat{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:30px;margin-bottom:34px;cursor:pointer}
.in-feat .in-img{aspect-ratio:3/2}
.in-feat .in-img img{object-position:50% 22%}
.in-ft h2{font:400 clamp(1.5rem,2.6vw,2.15rem)/1.25 var(--display);color:#2F6FE0;margin:0 0 10px}
.in-feat:hover .in-ft h2{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.in-ft p{color:#4A586D;font-size:1.02rem;line-height:1.7;margin:12px 0 8px;max-width:56ch}
.in-k{font-size:.74rem;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:#8A94A6;margin:12px 0 4px}
.in-ft .in-k{margin-top:0}
.in-m{font-size:.84rem;color:#8A94A6;margin:0}
.in-more{margin-top:18px;border:0;border-radius:4px;background:#0E1F3D;color:#fff;font:600 .92rem var(--body);padding:11px 20px;cursor:pointer}
.in-more:hover{background:var(--blue)}
.in-img{position:relative;overflow:hidden;background:#0B1424;aspect-ratio:4/3}
.in-img img{width:100%;height:100%;object-fit:cover;display:block;transition:scale .5s}
.in-feat:hover .in-img img,.in-card:hover .in-img img{scale:1.04}
.in-ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#C9D3E2;font-size:.85rem;background:radial-gradient(circle at 50% 40%,#2A3B55,#121B2B 70%)}
.in-ph .ring{width:84px;height:84px;margin:0}
.in-ph .ring svg{width:44px;height:44px}
.in-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 24px}
.in-card{cursor:pointer}
.in-card h3{font:400 1.12rem/1.35 var(--display);color:#2F6FE0;margin:0 0 6px}
.in-card:hover h3{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.in-feat:focus-visible,.in-card:focus-visible{outline:2px solid var(--blue);outline-offset:6px}
.in-morebox{display:flex;justify-content:center;margin-top:34px}
.in-evh{font:400 1.6rem var(--display);margin:56px 0 16px;color:#0E1F3D}
.in-empty{background:#F4F6F9;border-radius:6px;padding:22px;color:#4A586D}
.in-date{display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;background:#0E1F3D}
.in-date b{font:400 3rem var(--display)}
#insX{padding-bottom:72px}
@media (max-width:1000px){.in-tools{grid-template-columns:1fr 1fr}.in-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.in-feat{grid-template-columns:1fr}}
@media (max-width:560px){.in-tools{grid-template-columns:1fr}.in-grid{grid-template-columns:1fr}}

/* =========================================================
   v1.8: About banner with photo, white FAQ, white footer CTA
   ========================================================= */
#about{padding:0;background:var(--surface)}
#about::before{display:none}
.ab-band{position:relative;isolation:isolate;overflow:hidden;color:#fff;min-height:560px;display:flex;align-items:center;
  background:linear-gradient(115deg,#0A1630 0%,#11244A 55%,#0A1630 100%)}
.ab-band::before{content:"";position:absolute;inset:0;z-index:-2;
  background:repeating-linear-gradient(120deg,rgba(255,255,255,.035) 0 2px,transparent 2px 46px);
  -webkit-mask-image:linear-gradient(90deg,#000 35%,transparent 70%);mask-image:linear-gradient(90deg,#000 35%,transparent 70%)}
.ab-band::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(120deg,transparent 0 30%,rgba(76,141,255,.10) 30% 44%,transparent 44%)}
.ab-bgimg{position:absolute;top:0;right:0;width:52%;height:100%;object-fit:cover;object-position:50% 22%;z-index:-1;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 30%);mask-image:linear-gradient(90deg,transparent 0%,#000 30%)}
.ab-band-in{position:relative;padding:96px 0;width:min(1160px,100% - 40px)}
.ab-left{max-width:560px}
#about .ab-left h2{display:inline-flex;align-items:center;gap:12px;font:600 .82rem var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--blue-hi);margin:0 0 18px;filter:none}
#about .ab-left h2::before{content:"";width:34px;height:2px;background:var(--blue)}
.ab-big{font:400 clamp(2rem,4.2vw,3.3rem)/1.12 var(--display);color:#fff;margin:0 0 20px}
.ab-lead{color:#C9D4E5;font-size:1.05rem;line-height:1.7;max-width:50ch;margin:0 0 30px}
.ab-ctas{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.ab-ctas .btn{padding:15px 24px}
.ab-call{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none}
.ab-ci{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(141,182,255,.5);color:var(--blue-hi)}
.ab-ci svg{width:20px;height:20px}
.ab-call small{display:block;font-size:.78rem;color:#AFC0DC}
.ab-call b{font-weight:600;font-size:1.02rem}
.ab-call:hover .ab-ci{background:var(--blue);color:#fff;border-color:var(--blue)}
#about .ab-band .plate{position:absolute;right:0;bottom:34px;margin:0;max-width:280px}
.ab-body{padding:80px 0 96px}
.ab-body .ab-copy [data-i18n="aboutBody"]{columns:2 320px;column-gap:56px}
.ab-body .ab-copy p{break-inside:avoid;max-width:none}
#about .ab-body .mission{max-width:820px}
#about .ab-body .values.ab-vals{margin-top:60px}
@media (max-width:900px){
  .ab-band{flex-direction:column;align-items:stretch;min-height:0}
  .ab-bgimg{position:relative;width:100%;height:340px;order:-1;
    -webkit-mask-image:linear-gradient(0deg,transparent 0%,#000 35%);mask-image:linear-gradient(0deg,transparent 0%,#000 35%)}
  .ab-band-in{padding:0 0 64px}
  #about .ab-band .plate{position:static;margin-top:30px}
}

/* Common questions: white */
#faq{background:#fff;color:#14233D}
#faq h2{color:#0E1F3D}
#faq .faq details{border-color:#E2E7EF}
#faq .faq details p{color:#4A586D}

/* "Have a legal problem?" card: white inside the dark footer */
.f-cta{background:#fff;border:0;color:#14233D;box-shadow:0 20px 50px rgba(0,0,0,.35)}
.f-cta h2.silver-text,.f-cta h2{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:#0E1F3D;filter:none}
.f-cta p{color:#4A586D}
.f-cta .btn-ghost{color:#0E1F3D;border-color:#0E1F3D}
.f-cta .btn-ghost:hover{background:#0E1F3D;color:#fff}
@media (max-width:520px){.brand b{font-size:1rem}.brand img{width:34px}.hdr{gap:10px}}
@media (max-width:360px){.brand b{font-size:.9rem}}

/* =========================================================
   v1.10: clean About section — sharp photo left, text right
   ========================================================= */
#about{padding:0!important;background:#F4F6FA;overflow:visible}
.ab-clean{position:relative;isolation:isolate;overflow:clip;
  background:linear-gradient(180deg,#F7F9FC,#EEF2F8)}
.ab-clean::before{content:"";position:absolute;inset:0;z-index:-1;
  background:repeating-linear-gradient(120deg,rgba(14,31,61,.035) 0 1px,transparent 1px 44px);
  -webkit-mask-image:linear-gradient(90deg,transparent 30%,#000);mask-image:linear-gradient(90deg,transparent 30%,#000)}
.ab-c{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:64px;align-items:start;padding:100px 0 104px}
.ab-pic{position:sticky;top:110px;margin:0;border-radius:16px;overflow:hidden;aspect-ratio:4/5;box-shadow:0 30px 60px rgba(4,10,22,.22);background:#0A1630}
.ab-pic img{width:100%;height:100%;object-fit:cover;object-position:50% 22%;display:block}
.ab-pic::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(6,13,28,.88) 100%)}
.ab-cap{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:28px 30px;color:#fff;border-left:4px solid var(--blue)}
.ab-cap > b{display:block;font:400 1.6rem/1.2 var(--display)}
.ab-cap > span{display:block;color:var(--blue-hi);font-size:.95rem;margin-top:2px}
.ab-cap > small{display:block;color:#C9D4E5;font-size:.84rem;margin-top:4px}
.ab-cap .ab-ctas{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:18px}
.ab-cap .btn{padding:12px 20px}
.ab-call{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none}
.ab-ci{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(141,182,255,.6);color:var(--blue-hi)}
.ab-ci svg{width:18px;height:18px}
.ab-call small{display:block;font-size:.74rem;color:#AFC0DC}
.ab-call b{font-weight:600;font-size:.98rem}
.ab-call:hover .ab-ci{background:var(--blue);border-color:var(--blue);color:#fff}
#about .ab-txt h2{color:var(--blue);margin:0 0 14px;filter:none}
.ab-q{font:400 clamp(1.5rem,2.6vw,2.15rem)/1.25 var(--display);color:#0E1F3D;margin:0 0 28px;padding-left:20px;border-left:3px solid var(--blue)}
.ab-txt .ab-copy p{font-size:1.04rem;line-height:1.8;color:#3A4860;max-width:62ch}
.ab-txt .ab-copy [data-i18n="aboutBody"] p:first-child{color:#14233D;font-size:1.1rem}
#about .ab-txt .mission{margin:30px 0 0;background:#fff;border-inline-start:3px solid var(--blue);border-radius:0 10px 10px 0;box-shadow:0 10px 24px rgba(4,10,22,.06)}
#about .ab-txt .values.ab-vals{grid-template-columns:1fr 1fr;gap:16px;margin-top:30px;padding-top:0;border-top:0}
#about .ab-txt .ab-vals > div{background:#fff;border:1px solid #E2E7EF;border-radius:12px;padding:20px 22px;margin:0;border-top:3px solid var(--blue);transition:translate .25s,box-shadow .25s}
#about .ab-txt .ab-vals > div:hover{translate:0 -3px;box-shadow:0 14px 30px rgba(4,10,22,.1)}
#about .ab-txt .ab-vals h3{color:#0E1F3D;font-size:1.15rem;margin-bottom:4px}
#about .ab-txt .ab-vals p{color:#4A586D;font-size:.9rem}
@media (max-width:900px){
  .ab-c{grid-template-columns:1fr;gap:36px;padding:64px 0 72px}
  .ab-pic{position:relative;top:0;max-width:460px}
}
@media (max-width:480px){#about .ab-txt .values.ab-vals{grid-template-columns:1fr}.ab-cap{padding:22px}}

/* v1.11: leaf-shaped photo, values in one row below */
.ab-pic{border-radius:220px 18px 220px 18px;aspect-ratio:4/5}
.ab-pic::after{background:linear-gradient(180deg,transparent 55%,rgba(6,13,28,.85) 100%)}
.ab-cap{border-left:0;padding:26px 34px 40px;text-align:center}
.ab-c{padding-bottom:56px}
.ab-row{padding:0 0 100px}
#about .ab-row .values.ab-vals{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:0;padding:0;border:0}
#about .ab-row .ab-vals > div{background:#fff;border:1px solid #E2E7EF;border-top:3px solid var(--blue);border-radius:12px;padding:22px 22px 24px;margin:0;transition:translate .25s,box-shadow .25s}
#about .ab-row .ab-vals > div:hover{translate:0 -3px;box-shadow:0 14px 30px rgba(4,10,22,.1)}
#about .ab-row .ab-vals h3{color:#0E1F3D;font-size:1.15rem;margin-bottom:6px}
#about .ab-row .ab-vals p{color:#4A586D;font-size:.9rem;margin:0}
@media (max-width:1000px){#about .ab-row .values.ab-vals{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){#about .ab-row .values.ab-vals{grid-template-columns:1fr}.ab-pic{border-radius:140px 14px 140px 14px}}

/* =========================================================
   v1.12: Cinzel lettering, animated hero title, two-line brand,
   footer in a classic chambers layout
   ========================================================= */
/* Brand: Shehar Yar / Usmani */
.brand span{display:flex;flex-direction:column;line-height:1.05}
.brand b{font:600 1.08rem/1.1 "Cinzel",var(--display);letter-spacing:.06em}
.brand small{display:block;font:500 .82rem/1.2 "Cinzel",var(--display);letter-spacing:.32em;color:var(--blue-hi);margin-top:3px;opacity:1}
html[lang="ur"] .brand b,html[lang="ur"] .brand small{font-family:var(--urdu);letter-spacing:0}
@media (max-width:520px){.brand b{font-size:.92rem}.brand small{font-size:.7rem;letter-spacing:.26em}}

/* Hero title */
.hero h1{font-family:"Cinzel",var(--display);font-weight:600;letter-spacing:.03em;line-height:1.04;
  font-size:clamp(2.5rem,6vw,4.9rem);background:none;-webkit-background-clip:border-box;background-clip:border-box;color:#F4F6FA;animation:none}
html[lang="ur"] .hero h1{font-family:var(--urdu);letter-spacing:0;line-height:1.6}
.hero h1 > span{display:block}
.hero h1 > span + span{color:#AFC3E8}
.hero h1.split .hw{display:inline-block;white-space:nowrap}
.hero h1.split .hc{display:inline-block;transform-origin:50% 100%;
  animation:hcIn .9s cubic-bezier(.2,.7,.2,1) both,hcGlint 9s ease-in-out infinite;
  animation-delay:calc(var(--i) * 55ms),calc(1.8s + var(--i) * 85ms)}
@keyframes hcIn{from{opacity:0;transform:translateY(.5em) rotateX(70deg);filter:blur(8px)}}
@keyframes hcGlint{0%,9%,100%{text-shadow:none}4.5%{color:#fff;text-shadow:0 0 18px rgba(141,182,255,.95),0 0 2px #fff}}
.hero h1::after{content:"";display:block;width:0;height:3px;margin-top:18px;background:linear-gradient(90deg,var(--blue),transparent);animation:hcLine 1.2s cubic-bezier(.2,.7,.2,1) 1.1s forwards}
@keyframes hcLine{to{width:120px}}
@media (prefers-reduced-motion:reduce){.hero h1.split .hc{animation:none}.hero h1::after{animation:none;width:120px}}

/* Footer: solid charcoal, five columns, underlined headings */
footer.dark{background:#1E2229}
footer.dark::after,footer.dark::before{display:none}
footer .f-grid.fx{grid-template-columns:1fr 1.25fr 1.1fr 1fr 1.2fr;gap:32px;padding:10px 0 46px}
footer .fx h3{font:600 .82rem var(--body);letter-spacing:.08em;text-transform:uppercase;color:#fff;margin:0 0 22px}
footer .fx h3::after{content:"";display:block;width:22px;height:2px;background:var(--blue);margin-top:9px}
footer .fx ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
footer .fx a,footer .fx li{color:#C9CED6;font-size:.86rem;text-decoration:none;line-height:1.45}
footer .fx a:hover{color:#fff}
footer .fx .f-off li b{display:block;color:#fff;font-weight:500}
footer .fx .f-off li{margin-bottom:6px}
footer .fx p{color:#C9CED6;font-size:.86rem;line-height:1.6;margin:0 0 14px}
footer .fx .f-acc{color:var(--blue-hi);text-decoration:underline;text-underline-offset:3px}
footer .legal{border-top:1px solid rgba(255,255,255,.1);padding-top:26px;gap:32px}
footer .legal h3{font-size:.82rem;color:#E1E5EB}
footer .legal p{font-size:.78rem;color:#9AA2AE}
footer .f-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.1);padding:22px 0 28px;margin-top:20px;font-size:.8rem;color:#9AA2AE}
footer .f-bottom nav{display:flex;flex-wrap:wrap;align-items:center;gap:8px 0}
footer .f-bottom nav > *{padding:0 12px;border-inline-start:1px solid rgba(255,255,255,.35);line-height:1;color:#D7DBE1;font-size:.8rem}
footer .f-bottom nav > *:first-child{padding-inline-start:0;border:0}
footer .f-bottom nav > *:hover{color:#fff}
footer .f-copy{display:inline}
footer .f-mark{width:40px;height:auto;opacity:.75}
@media (max-width:1000px){footer .f-grid.fx{grid-template-columns:repeat(3,1fr)}}
@media (max-width:640px){footer .f-grid.fx{grid-template-columns:1fr 1fr;gap:26px}footer .f-bottom{flex-direction:column;align-items:flex-start}}
footer .f-bottom{padding-right:76px}

/* v1.13: footer lettering + hover motion */
footer .fx h3{font:600 .95rem/1.2 "Cinzel",var(--display);letter-spacing:.12em;text-transform:uppercase}
html[lang="ur"] footer .fx h3{font-family:var(--urdu);letter-spacing:0}
footer .fx h3::after{transition:width .4s cubic-bezier(.2,.7,.2,1)}
footer .fx > div:hover h3::after{width:56px}
footer .fx a,footer .fx li{font-weight:300;letter-spacing:.02em}
footer .fx ul a{position:relative;display:inline-block;transition:color .25s,translate .25s}
footer .fx ul a::before{content:"";position:absolute;inset-inline-start:-14px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--blue);opacity:0;scale:.3;transition:opacity .25s,scale .25s}
footer .fx ul a::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:var(--blue-hi);transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
html[dir="rtl"] footer .fx ul a::after{transform-origin:right}
footer .fx ul a:hover{color:#fff;translate:10px 0}
html[dir="rtl"] footer .fx ul a:hover{translate:-10px 0}
footer .fx ul a:hover::before{opacity:1;scale:1}
footer .fx ul a:hover::after{transform:scaleX(1)}
footer .fx .f-off li{transition:translate .25s}
footer .fx .f-off li:hover{translate:6px 0}
footer .fx .f-acc{text-decoration:none;background:linear-gradient(var(--blue-hi),var(--blue-hi)) 0 100%/100% 1px no-repeat;transition:background-size .3s,color .25s}
footer .fx .f-acc:hover{color:#fff;background-size:0 1px;background-position:100% 100%}
footer .f-bottom nav > *{position:relative;transition:color .25s}
footer .f-bottom nav > *:hover{color:var(--blue-hi)}
footer .f-mark{transition:opacity .3s,transform .6s cubic-bezier(.2,.7,.2,1),filter .3s}
footer .f-mark:hover{opacity:1;transform:rotate(-8deg) scale(1.12);filter:drop-shadow(0 0 12px rgba(76,141,255,.7))}
footer .f-bottom{margin-top:0}
@media (prefers-reduced-motion:reduce){footer .fx ul a,footer .fx ul a::after,footer .f-mark{transition:none}}

/* =========================================================
   v1.14: looping hero lettering, new hero photo frame
   ========================================================= */
@property --ang{syntax:"<angle>";initial-value:0deg;inherits:false}
.hero h1.split .hc{animation:hcLoop 11s cubic-bezier(.2,.7,.2,1) infinite both;animation-delay:calc(var(--i) * 60ms)}
@keyframes hcLoop{
  0%{opacity:0;transform:translateY(.55em) rotateX(75deg);filter:blur(8px)}
  7%{opacity:1;transform:none;filter:blur(0) brightness(1)}
  40%{filter:blur(0) brightness(1);text-shadow:none}
  43%{filter:blur(0) brightness(1.45);text-shadow:0 0 18px rgba(141,182,255,.95)}
  47%{filter:blur(0) brightness(1);text-shadow:none}
  84%{opacity:1;transform:none;filter:blur(0)}
  92%{opacity:0;transform:translateY(-.4em);filter:blur(6px)}
  100%{opacity:0;transform:translateY(-.4em);filter:blur(6px)}
}
.hero h1::after{width:0;animation:hcLine2 11s cubic-bezier(.2,.7,.2,1) .7s infinite both}
@keyframes hcLine2{0%{width:0}10%,80%{width:130px}90%,100%{width:0}}

/* Hero photo: glowing animated frame, gentle zoom, tilt, floating badges */
.hero .arch{width:min(100%,430px);perspective:1100px}
.hero .arch::before{content:"";position:absolute;inset:26px -22px -22px 26px;border:2px solid rgba(76,141,255,.55);border-radius:30px;z-index:-1}
.hero .arch::after{content:"";position:absolute;top:-26px;left:-26px;width:120px;height:120px;z-index:-1;opacity:.55;
  background-image:radial-gradient(rgba(141,182,255,.9) 1.4px,transparent 1.6px);background-size:14px 14px}
.hero .arch-frame{position:relative;border:0;border-radius:30px;aspect-ratio:4/5;padding:4px;
  background:conic-gradient(from var(--ang),#4C8DFF,#C9CFD8 25%,#0E1F3D 50%,#8DB6FF 75%,#4C8DFF);
  animation:spinBorder 7s linear infinite;box-shadow:0 34px 70px rgba(0,0,0,.5);
  transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.hero .arch-frame img{border-radius:26px;animation:heroZoom 18s ease-in-out infinite alternate}
@keyframes spinBorder{to{--ang:360deg}}
@keyframes heroZoom{from{scale:1}to{scale:1.07}}
.hero .arch-frame::after{content:"";position:absolute;inset:4px;border-radius:26px;pointer-events:none;
  background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.16) 45%,transparent 55%) -150% 0/250% 100% no-repeat;animation:sheen 7s ease-in-out 2s infinite}
@keyframes sheen{0%,70%{background-position:-150% 0}100%{background-position:150% 0}}
.hero .arch-note{animation:bob 6s ease-in-out infinite;border-left:3px solid var(--blue)}
.arch-badge{position:absolute;top:34px;right:-30px;display:flex;align-items:center;gap:10px;padding:10px 14px 10px 10px;border-radius:14px;
  background:rgba(7,15,31,.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(141,182,255,.4);
  color:#fff;box-shadow:0 18px 40px rgba(0,0,0,.4);animation:bob 6s ease-in-out 1.5s infinite}
.arch-badge i{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--blue);flex:none}
.arch-badge i svg{width:18px;height:18px}
.arch-badge b{display:block;font:600 .9rem/1.15 "Cinzel",var(--display);letter-spacing:.04em}
.arch-badge small{display:block;color:#AFC3E8;font-size:.74rem}
html[dir="rtl"] .arch-badge{right:auto;left:-30px}
@keyframes bob{0%,100%{translate:0 0}50%{translate:0 -10px}}
@media (max-width:860px){.arch-badge{right:-6px}.hero .arch::before{inset:18px -10px -10px 18px}}
@media (prefers-reduced-motion:reduce){
  .hero h1.split .hc,.hero h1::after{animation:none;opacity:1;width:130px}
  .hero .arch-frame,.hero .arch-frame img,.hero .arch-frame::after,.hero .arch-note,.arch-badge{animation:none}
}

/* =========================================================
   v1.15: full-width hero carousel
   ========================================================= */
#home.hs{position:relative;padding:0!important;height:min(88vh,780px);min-height:580px;overflow:hidden;background:#05070C;clip-path:none}
#home.hs::before,#home.hs::after{display:none}
.hs-keep{display:none!important}
.hs-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity 1.1s ease,visibility 0s linear 1.1s}
.hs-slide.is-on{opacity:1;visibility:visible;z-index:1;transition:opacity 1.1s ease,visibility 0s}
.hs-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;scale:1.08;transition:scale 9s cubic-bezier(.2,.6,.2,1)}
.hs-slide.is-on .hs-bg{scale:1}
.hs-slide::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none}
.hs-slide[data-i="0"] .hs-bg{object-position:0% 30%}
.hs-slide[data-i="0"]::after{background:linear-gradient(90deg,transparent 28%,rgba(6,13,28,.55) 48%,rgba(6,13,28,.86) 72%),linear-gradient(0deg,rgba(6,13,28,.6),transparent 35%)}
.hs-slide[data-i="1"]::after{background:radial-gradient(ellipse at center,rgba(12,7,4,.45),rgba(8,5,3,.82) 75%)}
.hs-slide[data-i="2"]::after{background:linear-gradient(90deg,rgba(6,13,28,.92) 0%,rgba(6,13,28,.68) 45%,rgba(6,13,28,.25) 100%)}
.hs-in{position:relative;z-index:2;height:100%;display:flex;align-items:center;padding:40px 0 70px}
.hs-right{justify-content:flex-end}
.hs-right .hs-box{max-width:570px}
.hs-center{justify-content:center;text-align:center}
.hs-center .hs-box{max-width:760px}
.hs-left .hs-box{max-width:600px}
.hs-box > *{opacity:0;translate:0 28px;transition:opacity .8s ease,translate .9s cubic-bezier(.2,.7,.2,1)}
.hs-slide.is-on .hs-box > *{opacity:1;translate:none}
.hs-slide.is-on .hs-box > :nth-child(2){transition-delay:.15s}
.hs-slide.is-on .hs-box > :nth-child(3){transition-delay:.3s}
.hs-slide.is-on .hs-box > :nth-child(4){transition-delay:.45s}
.hs-slide.is-on .hs-box > :nth-child(5){transition-delay:.6s}
.hs .lede,.hs .hero-ctas,.hs h1{animation:none}
.hs .lede{color:#D3DAE5;max-width:52ch}
.hs-k{font:600 .8rem/1.4 var(--body);letter-spacing:.18em;text-transform:uppercase;color:#C9D4E5;margin:0 0 18px}
.hs-k.line::before{content:"";display:inline-block;width:46px;height:1px;background:currentColor;margin-inline-end:14px;vertical-align:middle}
.hs-t{font:600 clamp(2.3rem,5.2vw,4.3rem)/1.1 "Cinzel",var(--display);color:#fff;margin:0 0 24px;letter-spacing:.02em}
html[lang="ur"] .hs-t{font-family:var(--urdu);line-height:1.75;letter-spacing:0}
html[lang="ur"] .hs-k{letter-spacing:0}
.hero h1::after{display:none!important}
.hs-emb{display:inline-grid;place-items:center;width:62px;height:62px;border:1px solid rgba(255,255,255,.75);rotate:45deg;margin-bottom:30px;color:#fff}
.hs-emb svg{width:28px;height:28px;rotate:-45deg}
.hs-slide.is-on .hs-emb{opacity:1;translate:none;rotate:45deg}
.btn.hs-line{background:transparent;border:1px solid #fff;color:#fff;border-radius:2px;padding:13px 26px;font:600 .82rem var(--body);letter-spacing:.12em;text-transform:uppercase}
.btn.hs-line:hover{background:#fff;color:#0E1F3D}
.hs-arrow{position:absolute;top:50%;z-index:3;width:48px;height:48px;margin-top:-24px;border-radius:50%;display:grid;place-items:center;
  border:1px solid rgba(255,255,255,.55);background:rgba(0,0,0,.22);color:#fff;cursor:pointer;transition:background .25s,border-color .25s,scale .25s}
.hs-arrow svg{width:20px;height:20px}
.hs-arrow:hover{background:var(--blue);border-color:var(--blue);scale:1.06}
.hs-prev{left:22px}.hs-next{right:22px}
.hs-ui{position:absolute;left:0;right:0;bottom:30px;z-index:3;pointer-events:none}
.hs-ui .wrap{display:flex;align-items:center;gap:18px}
.hs-count{color:#C9D4E5;font-size:.88rem;letter-spacing:.1em}
.hs-count b{color:#fff;font-weight:600}
.hs-bar{width:120px;height:2px;background:rgba(255,255,255,.25);overflow:hidden}
.hs-bar i{display:block;height:100%;width:100%;background:var(--blue);transform-origin:left;transform:scaleX(0)}
.hs-bar i.run{animation:hsBar var(--hs-ms,7000ms) linear forwards}
.hs.paused .hs-bar i.run{animation-play-state:paused}
@keyframes hsBar{to{transform:scaleX(1)}}
.hs-scroll{position:absolute;left:50%;bottom:24px;z-index:3;width:26px;height:42px;margin-left:-13px;border:2px solid rgba(255,255,255,.7);border-radius:14px}
.hs-scroll span{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:#fff;animation:hsWheel 1.8s ease-in-out infinite}
@keyframes hsWheel{0%{opacity:0;translate:0 0}30%{opacity:1}100%{opacity:0;translate:0 12px}}
html[dir="rtl"] .hs-prev{left:auto;right:22px}
html[dir="rtl"] .hs-next{right:auto;left:22px}
html[dir="rtl"] .hs-arrow svg{scale:-1 1}
@media (max-width:860px){
  #home.hs{height:auto;min-height:0}
  .hs-slide{position:absolute}
  .hs-slide.is-on{position:relative}
  .hs-in{align-items:flex-end;min-height:min(88vh,720px);padding:120px 0 96px}
  .hs-slide[data-i="0"] .hs-bg{object-position:12% 25%}
  .hs-slide[data-i="0"]::after{background:linear-gradient(180deg,rgba(6,13,28,.1) 15%,rgba(6,13,28,.75) 50%,rgba(6,13,28,.95) 100%)}
  .hs-slide[data-i="2"]::after{background:linear-gradient(180deg,rgba(6,13,28,.35),rgba(6,13,28,.9) 60%)}
  .hs-right,.hs-left{justify-content:flex-start}
  .hs-arrow{top:auto;bottom:22px;margin-top:0;width:40px;height:40px}
  .hs-prev{left:auto;right:70px}.hs-next{right:20px}
  .hs-scroll{display:none}
}
@media (prefers-reduced-motion:reduce){.hs-bg,.hs-slide,.hs-box > *{transition:none}.hs-scroll span{animation:none}}

/* =========================================================
   v1.16: Offices — clean glass layout over the photo
   ========================================================= */
#offices .off-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:stretch;gap:28px;margin-top:40px}
#offices .map{position:relative;border-radius:18px;padding:46px 26px 20px;background:rgba(7,15,31,.55);border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 24px 50px rgba(0,0,0,.35);display:flex;align-items:center}
#offices .map::before{content:"Central Punjab";position:absolute;top:18px;left:24px;font:600 .72rem var(--body);letter-spacing:.16em;text-transform:uppercase;color:#8DB6FF}
#offices .map::after{content:"";position:absolute;inset:0;border-radius:18px;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:40px 40px}
#offices .map ellipse{display:none}
#offices .map .route{stroke:var(--blue-hi);stroke-width:1.6;stroke-dasharray:5 7;opacity:.75}
#offices .pin .pulse{stroke:var(--blue-hi)}
#offices .pin .core{fill:#fff;stroke:#0E1F3D;stroke-width:3}
#offices .pin text{fill:#fff;font:600 16px "Cinzel",var(--display);letter-spacing:.05em}
#offices .pin.active .core{fill:var(--blue)}
#offices .pin.active text{fill:var(--blue-hi)}

#offices .offices{display:flex;flex-direction:column;border-radius:18px;overflow:hidden;background:rgba(7,15,31,.6);border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 24px 50px rgba(0,0,0,.35)}
#offices .office{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:22px;
  padding:26px 28px;margin:0;border:0;border-radius:0;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;
  border-bottom:1px solid rgba(255,255,255,.1);transition:background .3s;cursor:default;translate:none;box-shadow:none;flex:1}
#offices .office:last-child{border-bottom:0}
#offices .office::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--blue);transform:scaleY(0);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
#offices .office.active{background:rgba(76,141,255,.12)}
#offices .office.active::before{transform:scaleY(1)}
.o-n{font:600 1.9rem/1 "Cinzel",var(--display);color:rgba(141,182,255,.45);min-width:2.2ch;transition:color .3s}
#offices .office.active .o-n{color:var(--blue-hi)}
#offices .office h3{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 8px;font:600 1.3rem/1.2 "Cinzel",var(--display);color:#fff;letter-spacing:.03em}
html[lang="ur"] #offices .office h3{font-family:var(--urdu)}
#offices .office h3 small{font:600 .66rem var(--body);letter-spacing:.1em;text-transform:uppercase;color:#CFE0FF;background:rgba(76,141,255,.22);padding:4px 9px;border-radius:999px}
.o-meta{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.o-meta li{display:flex;align-items:center;gap:8px;color:#C3CDDC;font-size:.9rem}
.o-meta svg{width:15px;height:15px;color:var(--blue-hi);flex:none}
.o-meta .tba{color:#8E9BB0;font-style:italic}
.o-act{display:flex;flex-direction:column;gap:8px;align-items:stretch}
.o-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 16px;border-radius:999px;font:500 .84rem var(--body);text-decoration:none;
  color:#fff;border:1px solid rgba(255,255,255,.35);white-space:nowrap;transition:background .25s,border-color .25s,color .25s}
.o-btn svg{width:14px;height:14px;transition:translate .25s}
.o-btn:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.o-btn:hover svg{translate:3px 0}
.o-btn.pri{background:#fff;color:#0E1F3D;border-color:#fff}
.o-btn.pri:hover{background:var(--blue);border-color:var(--blue);color:#fff}
@media (max-width:900px){
  #offices .off-grid{grid-template-columns:1fr}
  #offices .office{grid-template-columns:auto minmax(0,1fr);padding:22px}
  .o-act{grid-column:1 / -1;flex-direction:row}
  .o-act .o-btn{flex:1}
}

/* =========================================================
   v1.17: quieter, more classic finish
   fewer colours, fewer moving parts
   ========================================================= */
:root{--blue:#2F5FBF;--blue-hi:#A9BFE6}
/* no gradient text: solid type */
.silver-text,.dark h1,.dark h2{background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;-webkit-text-fill-color:currentColor!important;filter:none!important}
.dark .silver-text,.dark h1,.dark h2{color:#fff}
.hero h1 > span + span{color:#fff}
/* switch off decorative motion */
.dark::after,.a-hero::before{animation:none!important;scale:1!important}
.hs-bg{scale:1!important;transition:none!important}
.hs-scroll{display:none}
.hero h1.split .hc{animation:none!important;opacity:1!important;transform:none!important;filter:none!important}
.hero h1::after{display:none!important}
.rv{opacity:1!important;translate:none!important}
.map .route,.pin .pulse{animation:none!important}
.pin .pulse{display:none}
.hs-box > *{transition:opacity .6s ease!important;translate:none!important}
.hs-slide.is-on .hs-box > *{transition-delay:0s!important}
/* top bar: plain text link instead of a coloured pill */
.tb-free{background:none!important;padding:0!important;border-radius:0!important;color:#fff!important;text-decoration:underline;text-underline-offset:3px;font-weight:500}
.topbar::after{background:rgba(255,255,255,.12);opacity:1}
header.site{border-bottom:1px solid rgba(255,255,255,.08);box-shadow:none}
/* buttons: one primary style */
.btn-blue{background:#0E1F3D!important;color:#fff!important}
.btn-blue:hover{background:#1A3366!important}
.hs .btn-silver,.btn-silver{background:#fff;color:#0E1F3D;box-shadow:none}
/* practice cards: no glow */
.pc{transition:border-color .2s}
.pc:hover,.pc:focus-visible{translate:none;box-shadow:none;border-color:rgba(255,255,255,.5)}
.pc:hover .pc-lab,.pc:focus-visible .pc-lab{background:#0A1222}
.pc-lab i{display:none}
/* menus: plain */
.mega{box-shadow:0 20px 40px rgba(0,0,0,.35);border-top:1px solid rgba(255,255,255,.15)}
.mega-ic{background:#fff;box-shadow:none;width:6px;height:6px}
/* facts band */
.fact .f-ic{box-shadow:none;background:#0E1F3D}
/* about / insights / offices: no lift effects */
#about .ab-row .ab-vals > div:hover,#insightsPage .post:hover{translate:none!important;box-shadow:none!important}
.in-feat:hover .in-img img,.in-card:hover .in-img img{scale:1}
#offices .pin.active .core{fill:#fff}
#offices .pin.active text{fill:#fff}
#offices .office.active{background:rgba(255,255,255,.06)}
.o-n{color:rgba(255,255,255,.35)}
#offices .office.active .o-n{color:#fff}
#offices .office h3 small{background:rgba(255,255,255,.12);color:#E1E7F0}
/* footer: simple hover */
footer .fx ul a{transition:color .2s}
footer .fx ul a::before,footer .fx ul a::after{display:none}
footer .fx ul a:hover{translate:none;text-decoration:underline;text-underline-offset:3px}
footer .fx .f-off li:hover{translate:none}
footer .fx > div:hover h3::after{width:22px}
footer .f-mark:hover{transform:none;filter:none}
/* team circles: plain ring */
.tm-ph{background:#C9CFD8;box-shadow:none}
.tm:hover .tm-ph{translate:none}
/* chat pulse off */
.fab-chat::after,.fab::after{animation:none!important}
.silver-text{color:inherit}
.a-hero .silver-text{color:#fff}
#insightsPage .a-hero .silver-text{color:#0E1F3D}

/* =========================================================
   v1.18: no duplicate breadcrumbs, no dash lines,
   contact page in the same light style as Insights
   ========================================================= */
.pg .crumb,#area .crumb{display:none}
.hs-k.line::before{display:none}
#about .ab-left h2::before{display:none}
#insightsPage .a-hero{padding-top:44px}

#contactPage{background:#fff;color:#14233D}
#contactPage .a-hero{background:#fff;color:#14233D;padding:44px 0 34px!important}
#contactPage .a-hero::before,#contactPage .a-hero::after{display:none}
#contactPage .a-hero h1,#contactPage .a-hero .silver-text{color:#0E1F3D;font-size:clamp(2rem,4vw,3rem)}
#contactPage .a-hero p{color:#4A586D}
#contactPage .c-quick a{background:#EEF1F5;border:0;color:#14233D;border-radius:6px;backdrop-filter:none;-webkit-backdrop-filter:none}
#contactPage .c-quick a:hover{background:#E1E7F0}
#contactPage .c-quick svg{color:#2F5FBF}
#contactPage .c-quick small{color:#4A586D}
#contactPage .fees{margin-top:8px}
#contactPage .fee{box-shadow:none;border-radius:8px}
#contactPage .fee.hl{background:#0E1F3D;border-color:#0E1F3D;box-shadow:none}
#contactPage .fee.hl .price{color:#fff}
#contactPage .fee .tag{background:#fff;color:#0E1F3D}
#contactPage .cal,#contactPage .slotbox,#contactPage .bk-form{border-radius:8px}
#contactPage .c-off{background:#F4F6F9;border:1px solid #E2E7EF;color:#14233D;border-radius:8px}
#contactPage .c-off .t{color:#2F5FBF}
#contactPage .c-off p{color:#4A586D}
#contactPage .c-off a{color:#2F5FBF}
#contactPage .a-bar .btn{display:none}

/* =========================================================
   v1.19: Case guides on charcoal (no blue photo),
   Offices as one light card with addresses on the map
   ========================================================= */
#guides{background:#15191F}
#guides::after{display:none}
#guides::before{background-image:var(--grain)}

#offices{background:#F4F6FA;color:#14233D;clip-path:none}
#offices::before,#offices::after{display:none}
#offices h2,#offices h2.silver-text{color:#0E1F3D!important}
#offices .lede{color:#4A586D}
#offices .off-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;align-items:stretch;margin-top:36px;
  background:#fff;border:1px solid #E2E7EF;border-radius:10px;overflow:hidden}
#offices .map{background:#F7F9FC;border:0;border-right:1px solid #E2E7EF;border-radius:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;padding:48px 24px 24px}
#offices .map::before{color:#8A94A6}
#offices .map::after{border-radius:0;background-image:linear-gradient(rgba(14,31,61,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(14,31,61,.05) 1px,transparent 1px)}
#offices .map .route{stroke:#8A94A6;opacity:1}
#offices .pin .core{fill:#0E1F3D;stroke:#fff}
#offices .pin.active .core{fill:#2F5FBF}
#offices .pin text{fill:#0E1F3D}
#offices .pin.active text{fill:#0E1F3D}
#offices .pin text.addr{font:400 12.5px var(--body);fill:#4A586D;letter-spacing:0}
#offices .offices{background:#fff;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
#offices .office{grid-template-columns:auto minmax(0,1fr);gap:18px;padding:24px 28px;border-bottom:1px solid #E2E7EF}
#offices .office::before{background:#0E1F3D}
#offices .office.active{background:#F7F9FC}
#offices .o-n{color:#B8C0CC;font-size:1.5rem}
#offices .office.active .o-n{color:#0E1F3D}
#offices .office h3{color:#0E1F3D;font-size:1.2rem}
#offices .office h3 small{background:#EEF1F5;color:#4A586D}
#offices .o-meta li{color:#4A586D}
#offices .o-meta svg{color:#2F5FBF}
#offices .o-meta .tba{color:#8A94A6}
#offices .o-act{grid-column:2;flex-direction:row;gap:10px;margin-top:2px}
#offices .o-btn{padding:7px 14px;font-size:.82rem;color:#0E1F3D;border-color:#C5CEDB}
#offices .o-btn:hover{background:#0E1F3D;border-color:#0E1F3D;color:#fff}
#offices .o-btn.pri{background:#0E1F3D;color:#fff;border-color:#0E1F3D}
#offices .o-btn.pri:hover{background:#1A3366}
@media (max-width:900px){
  #offices .off-grid{grid-template-columns:1fr}
  #offices .map{border-right:0;border-bottom:1px solid #E2E7EF}
  #offices .o-act{grid-column:1 / -1}
}

/* =========================================================
   v1.20: photo outside, light panels inside —
   Case guides and Offices
   ========================================================= */
/* --- Case guides --- */
#guides{background:#070F1F}
#guides::after{display:block}
#guides::before{background-image:var(--grain),var(--sec-shade)}
#guides .g-tabs{scrollbar-width:none}
#guides .g-tabs::-webkit-scrollbar{display:none}
#guides .g-tab{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.25);color:#fff}
#guides .g-tab:hover{background:rgba(255,255,255,.18)}
#guides .g-tab[aria-selected="true"]{background:#fff;color:#0E1F3D;border-color:#fff}
#guides .g-stage{background:#fff;border:0;border-radius:12px;padding:32px;color:#14233D;box-shadow:0 30px 60px rgba(0,0,0,.35)}
#guides .g-head h3{color:#0E1F3D}
#guides .g-head .where{border-color:#D5DCE6;color:#4A586D;background:#F4F6F9}
#guides .g-head p{color:#4A586D}
#guides .g-ctrl button{border-color:#C5CEDB;color:#0E1F3D}
#guides .g-ctrl button:hover{background:#F4F6F9}
#guides .g-ctrl .pp .prog circle{stroke:#0E1F3D}
#guides .g-line{background:#E2E7EF}
#guides .g-fill{background:#0E1F3D}
#guides .g-token{filter:drop-shadow(0 4px 8px rgba(4,10,22,.3))}
#guides .g-step{color:#8A94A6}
#guides .g-step.cur{color:#0E1F3D;font-weight:500}
#guides .g-dot{background:#fff;border-color:#C5CEDB;color:#8A94A6}
#guides .g-step.done .g-dot{border-color:#0E1F3D;color:#0E1F3D}
#guides .g-detail{border-top-color:#E2E7EF}
#guides .g-detail small{color:#8A94A6}
#guides .g-detail h4{color:#0E1F3D}
#guides .g-detail p{color:#4A586D}
#guides .g-need{background:#F4F6F9;border-color:#E2E7EF;color:#14233D}
#guides .g-need b{color:#0E1F3D}
#guides .g-actions .btn-ghost{color:#0E1F3D;border-color:#0E1F3D}
#guides .g-actions .btn-ghost:hover{background:#0E1F3D;color:#fff}

/* --- Offices: three columns joined by a route line --- */
#offices{background:#070F1F;color:#fff;clip-path:inset(0)!important}
#offices::before,#offices::after{display:block}
#offices h2,#offices h2.silver-text{color:#fff!important}
#offices .lede{color:#D3DAE5}
#offices .off-grid{display:block;background:none;border:0;border-radius:0;overflow:visible;margin-top:40px}
#offices .map{display:none}
#offices .offices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:#fff;border:0;border-radius:12px;padding:38px 0 34px;box-shadow:0 30px 60px rgba(0,0,0,.35)}
#offices .office{display:flex;flex-direction:column;align-items:flex-start;gap:0;padding:0 32px;border:0;border-right:1px solid #E2E7EF;background:none!important;cursor:default}
#offices .office:last-child{border-right:0}
#offices .office::before{display:none}
#offices .office::after{content:"";position:absolute;top:22px;left:84px;right:-32px;border-top:1px dashed #C5CEDB}
#offices .office:last-child::after{display:none}
#offices .o-n{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid #C5CEDB;color:#0E1F3D!important;font:600 .95rem "Cinzel",var(--display);margin-bottom:22px;position:relative;z-index:1;transition:background .2s,color .2s}
#offices .office.active .o-n{background:#0E1F3D;border-color:#0E1F3D;color:#fff!important}
#offices .office h3{font-size:1.45rem;margin:0 0 10px;flex-direction:column;align-items:flex-start;gap:8px}
#offices .o-meta{margin-bottom:20px}
#offices .o-act{margin-top:auto;flex-direction:row;flex-wrap:wrap;gap:8px}
@media (max-width:900px){
  #offices .offices{grid-template-columns:1fr;padding:8px 0}
  #offices .office{border-right:0;border-bottom:1px solid #E2E7EF;padding:26px 24px}
  #offices .office:last-child{border-bottom:0}
  #offices .office::after{display:none}
  #offices .o-n{margin-bottom:14px}
}
#guides{clip-path:inset(0)!important}

/* =========================================================
   v1.21: light-grey guide panel; office cards with maps
   ========================================================= */
#guides .g-stage{background:#ECEFF3}
#guides .g-need{background:#fff;border-color:#DDE3EA}
#guides .g-head .where{background:#fff}
#guides .g-dot{background:#fff}
#guides .g-line{background:#D3DAE3}

#offices h2{text-align:center;display:table;margin:0 auto;padding:10px 26px;border:1px solid rgba(255,255,255,.3);border-radius:8px}
#offices .lede{text-align:center;margin-inline:auto!important}
#offices .offices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;background:none;box-shadow:none;padding:0;border-radius:0}
#offices .office.oc{display:flex;flex-direction:column;align-items:stretch;padding:0;gap:0;text-align:center;overflow:hidden;
  border:1px solid rgba(255,255,255,.3);border-radius:10px;background:rgba(10,22,46,.78)!important;transition:border-color .2s}
#offices .office.oc:last-child{border-right:1px solid rgba(255,255,255,.3)}
#offices .office.oc::after,#offices .office.oc::before{display:none}
#offices .office.oc.active{border-color:rgba(255,255,255,.7)}
.oc-vis{height:150px;margin:12px 12px 0;border-radius:6px;overflow:hidden;background:#0E1F3D;position:relative}
.oc-vis iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.oc-vis svg{width:100%;height:100%}
.oc-vis .rt{stroke:rgba(255,255,255,.55);stroke-width:1;stroke-dasharray:3 4;fill:none}
.oc-vis circle{fill:#8A94A6}
.oc-vis circle.me{fill:#fff}
.oc-vis text{fill:#C9D4E5;font:11px var(--body)}
.oc-vis text.me{fill:#fff;font-weight:600}
.oc-body{padding:18px 18px 22px;display:flex;flex-direction:column;flex:1}
#offices .office.oc h3{display:block;margin:0 0 14px;font:400 1.35rem/1.3 var(--display);color:#fff;letter-spacing:0}
#offices .office.oc h3 small{background:none;padding:0;font:400 .9rem var(--body);letter-spacing:0;text-transform:none;color:#C9D4E5}
.oc-body dl{margin:0 0 18px;display:grid;gap:4px}
.oc-body dt{font-size:.85rem;color:#AFC0DC}
.oc-body dd{margin:0 0 10px;color:#fff;font-size:.95rem}
.oc-body dd.tba{color:#C9D4E5}
.oc-act{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:auto}
#offices .oc .o-btn{color:#fff;border-color:rgba(255,255,255,.6);padding:8px 14px;font-size:.84rem}
#offices .oc .o-btn:hover{background:rgba(255,255,255,.1);color:#fff}
#offices .oc .o-btn.pri{background:#2F5FBF;border-color:#2F5FBF;color:#fff}
#offices .oc .o-btn.pri:hover{background:#264F9F}
@media (max-width:900px){#offices .offices{grid-template-columns:1fr}#offices .office.oc{border-bottom:1px solid rgba(255,255,255,.3)!important}}

/* v1.22: contact page on light grey */
#contactPage{background:#EEF1F5}
#contactPage .a-hero{background:#EEF1F5}
#contactPage .c-quick a{background:#fff;border:1px solid #DDE3EA}
#contactPage .c-quick a:hover{background:#F7F9FC}
#contactPage .fee:not(.hl),#contactPage .cal,#contactPage .slotbox,#contactPage .bk-form{background:#fff;border-color:#DDE3EA}
#contactPage .c-off{background:#fff;border-color:#DDE3EA}
#contactPage .seg{background:#EEF1F5}
#contactPage .bk-form input,#contactPage .bk-form select,#contactPage .bk-form textarea{background:#F7F9FC}
#contactPage .fee.hl .btn{background:#fff!important;color:#0E1F3D!important}
#contactPage .fee.hl .btn:hover{background:#E1E7F0!important}

/* v1.23: Insights on light grey; hero title rises in */
#insightsPage{background:#EEF1F5}
#insightsPage .a-hero{background:#EEF1F5}
#insightsPage .in-f input,#insightsPage .in-f select,#insightsPage .in-tabs button{background:#fff;border:1px solid #DDE3EA}
#insightsPage .in-tabs button[aria-pressed="true"]{background:var(--blue);border-color:var(--blue)}
#insightsPage .in-empty{background:#fff}
#home.hero h1.split .hw{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.06em}
#home.hero h1.split .hc{display:inline-block;animation:hcRise .9s cubic-bezier(.2,.75,.2,1) both!important;animation-delay:calc(var(--i) * 45ms)!important}
@keyframes hcRise{from{translate:0 110%}to{translate:0 0}}
@media (prefers-reduced-motion:reduce){#home.hero h1.split .hc{animation:none!important}}

/* v1.24: FAQs after About, two-column layout */
#faq{background:#fff;padding:96px 0!important;border-top:1px solid #E2E7EF}
.fq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:64px;align-items:start}
.fq-side{position:sticky;top:110px}
#faq .fq-side h2{text-align:left;color:#0E1F3D;margin:0 0 12px}
.fq-lede{color:#4A586D;margin:0 0 28px;max-width:34ch}
.fq-card{background:#EEF1F5;border-radius:10px;padding:24px}
.fq-card b{display:block;font:400 1.2rem var(--display);color:#0E1F3D;margin-bottom:6px}
.fq-card p{color:#4A586D;font-size:.92rem;margin:0 0 16px}
#faq .faq{max-width:none;margin:0;counter-reset:fq;border-top:1px solid #E2E7EF}
#faq .faq details{border-bottom:1px solid #E2E7EF;counter-increment:fq}
#faq .faq summary{display:flex;gap:18px;align-items:baseline;padding:22px 48px 22px 0;font:400 1.12rem/1.45 var(--display);color:#0E1F3D}
#faq .faq summary::before{content:counter(fq,decimal-leading-zero);font:500 .82rem var(--body);color:#8A94A6;min-width:2ch}
#faq .faq summary::after{width:18px;height:18px;border:0;transform:translateY(-50%);right:4px;
  background:linear-gradient(#0E1F3D,#0E1F3D) center/14px 1.5px no-repeat,linear-gradient(#0E1F3D,#0E1F3D) center/1.5px 14px no-repeat}
#faq .faq details[open] summary::after{transform:translateY(-50%);background:linear-gradient(#0E1F3D,#0E1F3D) center/14px 1.5px no-repeat}
#faq .faq details p{padding:0 48px 22px 38px;color:#4A586D;line-height:1.75;margin:0}
html[dir="rtl"] #faq .fq-side h2{text-align:right}
html[dir="rtl"] #faq .faq details p{padding:0 38px 22px 48px}
@media (max-width:900px){.fq-grid{grid-template-columns:1fr;gap:28px}.fq-side{position:static}#faq{padding:64px 0!important}}

/* v1.25: prominent light-blue "Free 20-minute consultation" in the top bar */
.topbar .tb-free{background:#BFD7FF!important;color:#0E1F3D!important;padding:5px 14px!important;border-radius:999px!important;text-decoration:none!important;font-weight:600!important;font-size:.82rem}
.topbar .tb-free:hover{background:#D6E5FF!important}
.hs-slide[data-i="2"]::after{background:linear-gradient(90deg,rgba(5,7,10,.88) 0%,rgba(5,7,10,.5) 42%,rgba(5,7,10,0) 70%)!important}
@media (max-width:860px){.hs-slide[data-i="2"]::after{background:linear-gradient(180deg,rgba(5,7,10,.2),rgba(5,7,10,.88) 60%)!important}}

/* v1.26: slide titles rise in letter by letter */
#home .hs-t.split .hw{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.06em}
#home .hs-t.split .hc{display:inline-block;animation:hcRise .85s cubic-bezier(.2,.75,.2,1) both;animation-delay:calc(var(--i) * 32ms)}
@media (prefers-reduced-motion:reduce){#home .hs-t.split .hc{animation:none}}

/* =========================================================
   v1.27: plain, consistent section backgrounds with crisp line art
   charcoal (like the footer) · navy · light grey · white
   ========================================================= */
/* Practice areas: plain charcoal, like the footer */
#services{background:#1E2229}
#services::after,#services::before{display:none}

/* Case guides: navy with a fine drawing of the court */
#guides{background:#0E1F3D}
#guides::before{display:none}
#guides::after{display:block;position:absolute;inset:auto -40px 0 auto;width:min(760px,70%);height:78%;z-index:-1;
  background:url("/assets/images/decor/court-line-art-1.svg") right bottom/contain no-repeat;opacity:.13;animation:none;filter:none}

/* Offices: charcoal with a fine drawing of the scales */
#offices{background:#1E2229}
#offices::before{display:none}
#offices::after{display:block;position:absolute;inset:auto auto 0 -30px;width:min(520px,45%);height:85%;z-index:-1;
  background:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgNDAgNjAwIDU2MCI+PGcgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjRkZGRkZGIiBzdHJva2Utd2lkdGg9IjEuNiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNMzAwLDkwTDMwMCw1MjAgTTE4MCw1NjBMNDIwLDU2MEwzOTAsNTMwTDIxMCw1MzBaIE0yNDAsNTMwTDI2MCw1MjBMMzQwLDUyMEwzNjAsNTMwIE05MCwxNDBMNTEwLDEyMCBNMjc0LDEyOFEzMDAsMTAwIDMyNiwxMjggTTkwLDE0MEwtNSwzNzAgTTkwLDE0MEwxODUsMzcwIE0tMjAsMzcwUTkwLDQ0MCAyMDAsMzcwWiBNNTEwLDEyMEw0MTUsMzUwIE01MTAsMTIwTDYwNSwzNTAgTTQwMCwzNTBRNTEwLDQyMCA2MjAsMzUwWiIvPjxjaXJjbGUgY3g9IjMwMCIgY3k9Ijc4IiByPSIxMiIvPjxjaXJjbGUgY3g9IjMwMCIgY3k9IjEyOCIgcj0iMTYiLz48Y2lyY2xlIGN4PSI5MCIgY3k9IjE0MCIgcj0iOSIvPjxjaXJjbGUgY3g9IjUxMCIgY3k9IjEyMCIgcj0iOSIvPjwvZz48L3N2Zz4=") left bottom/contain no-repeat;opacity:.12;animation:none;filter:none}
#offices .office.oc{background:#262B33!important;border-color:rgba(255,255,255,.18)}
#offices .office.oc.active{border-color:rgba(255,255,255,.5)}
#offices .oc-vis{background:#1A1E25}

/* Contact page: booking area on a navy panel */
#contactPage #bookSec{position:relative;isolation:isolate;overflow:hidden;background:#0E1F3D;border-radius:14px;padding:44px 40px 40px!important;margin:48px 0 64px}
#contactPage #bookSec::before{content:"";position:absolute;right:-30px;bottom:0;width:min(640px,60%);height:70%;z-index:-1;
  background:url("/assets/images/decor/court-line-art-1.svg") right bottom/contain no-repeat;opacity:.12}
#contactPage #bookSec > h2{color:#fff;margin-bottom:10px}
#contactPage #bookSec .cal-note{color:#8A94A6}
#contactPage #bookSec .bk-form .cal-note{color:#6B7789}
.bk-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0 0 26px;padding:0;list-style:none;counter-reset:bs}
.bk-steps li{counter-increment:bs;display:flex;gap:12px;align-items:flex-start;color:#C9D4E5;font-size:.9rem;line-height:1.5}
.bk-steps li::before{content:counter(bs);flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.45);color:#fff;font:600 .8rem var(--body)}
.bk-steps b{display:block;color:#fff;font-weight:600}
@media (max-width:760px){.bk-steps{grid-template-columns:1fr}#contactPage #bookSec{padding:30px 18px 22px!important}}

/* =========================================================
   v1.28: one dark colour across the site — the footer charcoal
   ========================================================= */
:root{--ink2:#1E2229}
header.site{background:rgba(30,34,41,.97)!important;border-bottom:1px solid rgba(255,255,255,.08)}
.topbar{background:#16191E}
.a-bar,.r-bar{background:rgba(30,34,41,.97)!important}
#guides{background:var(--ink2)!important}
#guides::after{opacity:.1}
#home.hs{background:var(--ink2)}
.hs-slide[data-i="0"]::after{background:linear-gradient(90deg,transparent 28%,rgba(30,34,41,.6) 48%,rgba(30,34,41,.9) 72%),linear-gradient(0deg,rgba(30,34,41,.6),transparent 35%)!important}
.mega{background:rgba(22,25,30,.98)!important}
#contactPage #bookSec{background:var(--ink2)}
#contactPage .fee.hl{background:var(--ink2);border-color:var(--ink2)}
#area .a-hero,.a-card.dk{background:var(--ink2)!important}
#area .a-hero::before{opacity:.25}
.ab-cap{background:none}
.fact .f-ic{background:var(--ink2)}
.btn-blue{background:var(--ink2)!important}
.btn-blue:hover{background:#2C323C!important}
.in-more{background:var(--ink2)}
#offices .oc .o-btn.pri{background:#fff;border-color:#fff;color:var(--ink2)}
#offices .oc .o-btn.pri:hover{background:#E1E5EB;color:var(--ink2)}
.chat-head,.chat .head{background:var(--ink2)}

/* =========================================================
   v1.29: Offices — full-width map with a floating office card
   ========================================================= */
#offices .off-grid{display:none}
#offices{padding-bottom:0!important}
#offices::after{display:none}
.om{position:relative;width:100%;margin:40px 0 0;height:min(72vh,580px);min-height:440px;
  border-top:1px solid rgba(255,255,255,.08);background:#1A1E25;overflow:hidden}
.om-map{position:absolute;inset:0;z-index:0}
.om-map .leaflet-tile-pane{filter:grayscale(1) invert(1) brightness(.78) contrast(1.05)}
.om-map .leaflet-container,.om-map.leaflet-container{background:#1A1E25;font:inherit}
.om-map .leaflet-control-attribution{background:rgba(30,34,41,.85);color:#8A94A6;font-size:10px}
.om-map .leaflet-control-attribution a{color:#C9D4E5}
.om-map .leaflet-control-zoom a{background:#262B33;color:#fff;border-color:rgba(255,255,255,.15)}
.om-pin{position:relative;display:block;width:16px;height:16px;border-radius:50%;background:#fff;border:3px solid #1E2229;box-shadow:0 0 0 2px rgba(255,255,255,.5)}
.om-pin.on{background:#BFD7FF;box-shadow:0 0 0 6px rgba(191,215,255,.25)}
.om-lab{position:absolute;left:50%;bottom:22px;translate:-50% 0;white-space:nowrap;font:600 .95rem "Cinzel",var(--display);color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.8);letter-spacing:.04em}
.om-mk{cursor:pointer}
/* fallback drawing when the live map can't load */
.om-svg{width:100%;height:100%;display:block}
.om-svg .gl{stroke:rgba(255,255,255,.05)}
.om-svg .rt{stroke:rgba(255,255,255,.45);stroke-width:1.5;stroke-dasharray:6 7;fill:none}
.om-svg .river{stroke:rgba(191,215,255,.12);stroke-width:2;fill:none}
.om-svg .mk{cursor:pointer}
.om-svg .mk circle{fill:#fff;stroke:#1E2229;stroke-width:3}
.om-svg .mk.on circle{fill:#BFD7FF}
.om-svg .mk text{fill:#fff;font:600 17px "Cinzel",var(--display);letter-spacing:.05em}
/* floating card */
.om-card{position:absolute;z-index:500;top:50%;translate:0 -50%;right:max(20px,calc((100vw - 1160px) / 2));width:min(360px,calc(100% - 40px));
  background:rgba(30,34,41,.94);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.16);border-radius:12px;
  padding:20px 22px 22px;color:#fff;box-shadow:0 24px 50px rgba(0,0,0,.45)}
.om-tabs{display:flex;gap:6px;margin-bottom:18px;flex-wrap:wrap}
.om-tabs button{flex:1;min-width:0;padding:8px 6px;border-radius:6px;border:1px solid rgba(255,255,255,.2);background:none;color:#C9D4E5;font:500 .82rem var(--body);cursor:pointer}
.om-tabs button[aria-selected="true"]{background:#fff;color:#1E2229;border-color:#fff}
.om-card h3{font:400 1.5rem/1.2 var(--display);margin:0 0 14px;color:#fff}
.om-card h3 small{font:400 .88rem var(--body);color:#AFC0DC;margin-inline-start:6px}
.om-card dl{margin:0 0 18px;display:grid;gap:2px}
.om-card dt{font-size:.8rem;color:#8A94A6}
.om-card dd{margin:0 0 10px;font-size:.95rem;color:#fff}
.om-card dd.tba{color:#C9D4E5}
.om-act{display:flex;gap:8px;flex-wrap:wrap}
.om-act a{flex:1;text-align:center;padding:10px 12px;border-radius:999px;font:500 .86rem var(--body);text-decoration:none;border:1px solid rgba(255,255,255,.5);color:#fff;white-space:nowrap}
.om-act a.pri{background:#fff;color:#1E2229;border-color:#fff}
.om-act a:hover{opacity:.9}
@media (max-width:860px){
  .om{height:auto;min-height:0;display:flex;flex-direction:column}
  .om-map{position:relative;height:360px;inset:auto}
  .om-card{position:relative;top:auto;right:auto;translate:none;width:auto;margin:-40px 16px 28px;border-radius:12px}
}
#guides{overflow:clip}

/* =========================================================
   v1.30: practice-area thumbnails (photo, shield, area name, play)
   ========================================================= */
#services .pc-track{gap:22px;padding:30px 6px 26px;perspective:1400px}
.pc.pc2{flex:0 0 clamp(250px,26vw,330px);border:0;background:none;border-radius:0;overflow:visible;transform-style:preserve-3d;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.pc2 .pc-th{position:relative;aspect-ratio:16/10;border-radius:12px;overflow:hidden;background:#262B33 center/cover no-repeat;box-shadow:0 18px 36px rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.14)}
.pc2 .pc-th::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,23,28,.15),rgba(20,23,28,.55) 55%,rgba(20,23,28,.85))}
.pc2 .pc-mark{position:absolute;left:50%;top:44%;translate:-50% -50%;display:flex;flex-direction:column;align-items:center;gap:10px;width:90%;text-align:center}
.pc2 .pc-mark img{width:62px;height:auto;opacity:.92;filter:drop-shadow(0 4px 10px rgba(0,0,0,.5))}
.pc2 .pc-mark b{font:600 1.15rem/1.15 "Cinzel",var(--display);letter-spacing:.06em;text-transform:uppercase;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.6)}
html[lang="ur"] .pc2 .pc-mark b{font-family:var(--urdu);text-transform:none;letter-spacing:0}
.pc2 .pc-play{position:absolute;right:14px;bottom:14px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.7);background:rgba(20,23,28,.55);color:#fff;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.pc2 .pc-play svg{width:16px;height:16px;margin-left:3px}
.pc2 .pc-play:hover{background:#fff;color:#1E2229}
.pc2 .pc-cap{display:flex;justify-content:space-between;align-items:center;padding:14px 4px 0;color:#fff;font:500 .98rem var(--body)}
.pc2 .pc-cap small{color:#8A94A6;font-size:.8rem;font-weight:400}
.pc2:hover .pc-th,.pc2:focus-visible .pc-th{border-color:rgba(255,255,255,.45)}
/* video lightbox */
.vbox{position:fixed;inset:0;z-index:130;background:rgba(10,12,16,.88);display:none;align-items:center;justify-content:center;padding:20px}
.vbox.open{display:flex}
.vbox video{width:min(90vw,78vh,620px);aspect-ratio:1;border-radius:12px;background:#000}
.vbox button{position:absolute;top:18px;right:18px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.6);background:none;color:#fff;font-size:1.4rem;cursor:pointer}
@media (max-width:640px){.pc.pc2{flex-basis:78vw}}

/* =========================================================
   v1.31: Offices — Pakistan relief map with arc locator
   ========================================================= */
#offices .om{display:none}
.pkm{position:relative;margin-top:36px}
.pk-stage{position:relative;height:640px;border-radius:16px;overflow:hidden;
  background:radial-gradient(ellipse at 42% 70%,#2A3240 0%,#1E2229 55%,#16191E 100%);border:1px solid rgba(255,255,255,.1);box-shadow:0 30px 60px rgba(0,0,0,.4)}
.pk-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:44px 44px;
  -webkit-mask-image:radial-gradient(ellipse at 45% 60%,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse at 45% 60%,#000 30%,transparent 75%)}
.pk-map3d{position:absolute;width:560px;height:500px;left:calc(42% - 280px);top:150px;transform:perspective(1300px) rotateX(46deg) rotateZ(-4deg);transform-origin:50% 60%}
.pk-map3d svg{width:100%;height:100%;overflow:visible}
.pk-over{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.pk-over .arc{fill:none;stroke:rgba(205,222,255,.55);stroke-width:2}
.pk-over .tick{stroke:rgba(205,222,255,.45);stroke-width:1.2}
.pk-over .mesh{stroke:rgba(205,222,255,.16);stroke-width:1;fill:none}
.pk-over .md{fill:rgba(205,222,255,.55)}
.pk-over .beam{fill:none;stroke:url(#pkBeam);stroke-width:1.6;opacity:.55}
.pk-over .beam.on{opacity:1;stroke-width:2.2}
.pk-over .glow{fill:none;stroke:#9DB8FF;stroke-width:7;opacity:.12;filter:blur(3px)}
.pk-over .glow.on{opacity:.35}
.pk-node{pointer-events:auto;cursor:pointer}
.pk-node circle.halo{fill:rgba(191,215,255,.15);stroke:rgba(191,215,255,.45)}
.pk-node circle.core{fill:#fff}
.pk-node.on circle.halo{fill:rgba(191,215,255,.3);stroke:#fff}
.pk-node text{fill:#fff;font:500 15px var(--body);paint-order:stroke;stroke:#1E2229;stroke-width:4px}
.pk-node.on text{font-weight:600}
.pk-card{position:absolute;z-index:3;right:28px;top:50%;translate:0 -50%;width:min(340px,calc(100% - 40px));
  background:rgba(38,43,51,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.18);border-radius:14px;padding:14px 14px 18px;color:#fff;box-shadow:0 24px 50px rgba(0,0,0,.45)}
.pk-mini{height:150px;border-radius:9px;overflow:hidden;background:#EEF1F5;position:relative;margin-bottom:14px}
.pk-mini iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.pk-mini svg{width:100%;height:100%;display:block}
.pk-card h3{font:400 1.45rem/1.2 var(--display);margin:0 4px 8px;color:#fff}
.pk-card h3 small{font:400 .86rem var(--body);color:#AFC0DC;margin-inline-start:6px}
.pk-card p{margin:0 4px 4px;color:#D3DAE5;font-size:.92rem}
.pk-card p.tba{color:#AFC0DC}
.pk-act{display:flex;gap:8px;margin:14px 4px 0}
.pk-act a{flex:1;text-align:center;padding:9px 10px;border-radius:999px;font:500 .84rem var(--body);text-decoration:none;color:#fff;border:1px solid rgba(255,255,255,.55);white-space:nowrap}
.pk-act a.pri{border-color:#BFD7FF;box-shadow:0 0 0 1px rgba(191,215,255,.35) inset}
.pk-act a:hover{background:rgba(255,255,255,.08)}
.pk-dots{position:absolute;left:50%;bottom:16px;translate:-50% 0;display:flex;gap:8px;z-index:3}
.pk-dots button{width:34px;height:4px;border:0;border-radius:2px;background:rgba(255,255,255,.25);cursor:pointer;padding:0}
.pk-dots button[aria-selected="true"]{background:#BFD7FF}
@media (max-width:980px){
  .pk-stage{height:auto;padding-bottom:20px}
  .pk-scene{position:relative;height:430px}
  .pk-map3d{width:420px;height:375px;left:calc(50% - 210px);top:110px}
  .pk-card{position:relative;right:auto;top:auto;translate:none;margin:0 auto 30px;width:auto;max-width:420px;margin-inline:16px}
  .pk-dots{position:relative;left:auto;bottom:auto;translate:none;justify-content:center}
}
@media (max-width:480px){.pk-scene{height:360px}.pk-map3d{width:330px;height:295px;left:calc(50% - 165px);top:95px}}

/* =========================================================
   v1.32: typography (Cormorant Garamond + Manrope),
   practice cards play on hover
   ========================================================= */
:root{
  --display:"Cormorant Garamond","Times New Roman",Georgia,serif;
  --body:"Manrope","Segoe UI",system-ui,-apple-system,sans-serif;
}
body{font-family:var(--body);letter-spacing:.005em}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;letter-spacing:.005em}
h2{font-size:clamp(2.1rem,4.2vw,3.2rem);line-height:1.08}
.lede{font-weight:400;line-height:1.7}
.hero h1,.hs-t{font-family:var(--display)!important;font-weight:700!important;letter-spacing:.01em!important;line-height:1.02!important}
.hero h1{font-size:clamp(3rem,7vw,5.6rem)!important}
.hs-t{font-size:clamp(2.6rem,5.8vw,4.8rem)!important}
.hs-k{font-family:var(--body);font-weight:600}
footer .fx h3,#offices .office h3,.o-n,.arch-badge b,.om-lab,.pk-node text{font-family:var(--display)!important}
footer .fx h3{font-weight:700;font-size:1.05rem;letter-spacing:.1em}
.btn,.o-btn,.pk-act a,.in-more{font-family:var(--body);font-weight:600;letter-spacing:.01em}
.brand b,.brand small{font-family:"Cinzel",var(--display)}
html[lang="ur"] h1,html[lang="ur"] h2,html[lang="ur"] h3,html[lang="ur"] .hs-t{font-family:var(--urdu)!important}

/* Practice areas heading rises in */
#services h2.split .hw{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.06em}
#services h2.split .hc{display:inline-block;translate:0 110%}
#services h2.split.go .hc{animation:hcRise .85s cubic-bezier(.2,.75,.2,1) both;animation-delay:calc(var(--i) * 35ms)}

/* cards: video plays on hover, name and line animate */
.pc2 .pc-play{display:none!important}
.pc2 .pc-th video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .45s ease;z-index:1;background:#14171C}
.pc2.playing .pc-th video{opacity:1}
.pc2 .pc-th::before{z-index:2}
.pc2 .pc-mark{z-index:3;transition:translate .45s cubic-bezier(.2,.7,.2,1),opacity .35s}
.pc2 .pc-mark img{transition:opacity .35s,scale .45s}
.pc2 .pc-mark b{font-family:var(--display)!important;font-weight:700;font-size:1.45rem;letter-spacing:.08em;position:relative;padding-bottom:8px}
.pc2 .pc-mark b::after{content:"";position:absolute;left:50%;bottom:0;width:0;height:1.5px;background:#fff;translate:-50% 0;transition:width .45s cubic-bezier(.2,.7,.2,1)}
.pc2:hover .pc-mark b::after,.pc2:focus-visible .pc-mark b::after{width:60%}
.pc2.playing .pc-mark{translate:-50% 30%}
.pc2.playing .pc-mark img{opacity:0;scale:.8}
.pc2.playing .pc-th::before{background:linear-gradient(180deg,rgba(20,23,28,0) 40%,rgba(20,23,28,.85))}
.pc2 .pc-cap{flex-direction:column;align-items:flex-start;gap:3px}
.pc2 .pc-cap span{font:700 1.2rem var(--display);letter-spacing:.01em}
.pc2 .pc-cap small{color:#AFB7C4;font-size:.86rem;transition:color .3s}
.pc2:hover .pc-cap small{color:#fff}
@media (prefers-reduced-motion:reduce){#services h2.split .hc{translate:none;animation:none}}

/* =========================================================
   v1.33: two surface colours only —
   light grey (#EEF1F5) for light areas, footer charcoal (#1E2229) for dark
   ========================================================= */
:root{--lite:#EEF1F5;--ink2:#1E2229}
/* light sections */
#process,#team,#about,#faq,.ab-clean,.ab-body-bg{background:var(--lite)!important}
.ab-clean::before{display:none}
#faq{border-top:0}
.facts{background:var(--lite)!important;border-bottom:1px solid #DDE3EA}
.fact:hover{background:#E4E8EE}
#area,.area,.reader,#insightsPage,#contactPage{background:var(--lite)!important}
#insightsPage .a-hero,#contactPage .a-hero{background:var(--lite)!important}
body{background:var(--lite)}
/* dark sections and bars */
.topbar{background:var(--ink2)!important;border-bottom:1px solid rgba(255,255,255,.1)}
.topbar::after{display:none}
#services,#guides,#offices,footer.dark,#home.hs{background:var(--ink2)!important}
/* hero slide 1: the right side settles into solid charcoal */
.hs-slide[data-i="0"]::after{background:linear-gradient(90deg,rgba(30,34,41,0) 22%,rgba(30,34,41,.75) 40%,#1E2229 56%),linear-gradient(0deg,rgba(30,34,41,.55),transparent 30%)!important}
@media (max-width:860px){.hs-slide[data-i="0"]::after{background:linear-gradient(180deg,rgba(30,34,41,0) 10%,rgba(30,34,41,.8) 45%,#1E2229 70%)!important}}
/* offices: heading and map are one piece */
#offices h2{display:block;border:0;padding:0;margin:0 auto 12px;text-align:center}
.pk-stage{border:0;border-radius:0;box-shadow:none;background:radial-gradient(ellipse at 42% 70%,rgba(255,255,255,.05) 0%,rgba(255,255,255,0) 60%),var(--ink2)}
.pkm{margin-top:10px}
#offices{padding-bottom:20px!important}

/* v1.25: prominent light-blue "Free 20-minute consultation" in the top bar */
.topbar .tb-free{background:#BFD7FF!important;color:#0E1F3D!important;padding:5px 14px!important;border-radius:999px!important;text-decoration:none!important;font-weight:600!important;font-size:.82rem}
.topbar .tb-free:hover{background:#D6E5FF!important}
.hs-slide[data-i="2"]::after{background:linear-gradient(90deg,rgba(5,7,10,.88) 0%,rgba(5,7,10,.5) 42%,rgba(5,7,10,0) 70%)!important}
@media (max-width:860px){.hs-slide[data-i="2"]::after{background:linear-gradient(180deg,rgba(5,7,10,.2),rgba(5,7,10,.88) 60%)!important}}

/* v1.26: slide titles rise in letter by letter */
#home .hs-t.split .hw{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.06em}
#home .hs-t.split .hc{display:inline-block;animation:hcRise .85s cubic-bezier(.2,.75,.2,1) both;animation-delay:calc(var(--i) * 32ms)}
@media (prefers-reduced-motion:reduce){#home .hs-t.split .hc{animation:none}}

/* =========================================================
   v1.27: plain, consistent section backgrounds with crisp line art
   charcoal (like the footer) · navy · light grey · white
   ========================================================= */
/* Practice areas: plain charcoal, like the footer */
#services{background:#1E2229}
#services::after,#services::before{display:none}

/* Case guides: navy with a fine drawing of the court */
#guides{background:#0E1F3D}
#guides::before{display:none}
#guides::after{display:block;position:absolute;inset:auto -40px 0 auto;width:min(760px,70%);height:78%;z-index:-1;
  background:url("/assets/images/decor/court-line-art-1.svg") right bottom/contain no-repeat;opacity:.13;animation:none;filter:none}

/* Offices: charcoal with a fine drawing of the scales */
#offices{background:#1E2229}
#offices::before{display:none}
#offices::after{display:block;position:absolute;inset:auto auto 0 -30px;width:min(520px,45%);height:85%;z-index:-1;
  background:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgNDAgNjAwIDU2MCI+PGcgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjRkZGRkZGIiBzdHJva2Utd2lkdGg9IjEuNiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNMzAwLDkwTDMwMCw1MjAgTTE4MCw1NjBMNDIwLDU2MEwzOTAsNTMwTDIxMCw1MzBaIE0yNDAsNTMwTDI2MCw1MjBMMzQwLDUyMEwzNjAsNTMwIE05MCwxNDBMNTEwLDEyMCBNMjc0LDEyOFEzMDAsMTAwIDMyNiwxMjggTTkwLDE0MEwtNSwzNzAgTTkwLDE0MEwxODUsMzcwIE0tMjAsMzcwUTkwLDQ0MCAyMDAsMzcwWiBNNTEwLDEyMEw0MTUsMzUwIE01MTAsMTIwTDYwNSwzNTAgTTQwMCwzNTBRNTEwLDQyMCA2MjAsMzUwWiIvPjxjaXJjbGUgY3g9IjMwMCIgY3k9Ijc4IiByPSIxMiIvPjxjaXJjbGUgY3g9IjMwMCIgY3k9IjEyOCIgcj0iMTYiLz48Y2lyY2xlIGN4PSI5MCIgY3k9IjE0MCIgcj0iOSIvPjxjaXJjbGUgY3g9IjUxMCIgY3k9IjEyMCIgcj0iOSIvPjwvZz48L3N2Zz4=") left bottom/contain no-repeat;opacity:.12;animation:none;filter:none}
#offices .office.oc{background:#262B33!important;border-color:rgba(255,255,255,.18)}
#offices .office.oc.active{border-color:rgba(255,255,255,.5)}
#offices .oc-vis{background:#1A1E25}

/* Contact page: booking area on a navy panel */
#contactPage #bookSec{position:relative;isolation:isolate;overflow:hidden;background:#0E1F3D;border-radius:14px;padding:44px 40px 40px!important;margin:48px 0 64px}
#contactPage #bookSec::before{content:"";position:absolute;right:-30px;bottom:0;width:min(640px,60%);height:70%;z-index:-1;
  background:url("/assets/images/decor/court-line-art-1.svg") right bottom/contain no-repeat;opacity:.12}
#contactPage #bookSec > h2{color:#fff;margin-bottom:10px}
#contactPage #bookSec .cal-note{color:#8A94A6}
#contactPage #bookSec .bk-form .cal-note{color:#6B7789}
.bk-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0 0 26px;padding:0;list-style:none;counter-reset:bs}
.bk-steps li{counter-increment:bs;display:flex;gap:12px;align-items:flex-start;color:#C9D4E5;font-size:.9rem;line-height:1.5}
.bk-steps li::before{content:counter(bs);flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.45);color:#fff;font:600 .8rem var(--body)}
.bk-steps b{display:block;color:#fff;font-weight:600}
@media (max-width:760px){.bk-steps{grid-template-columns:1fr}#contactPage #bookSec{padding:30px 18px 22px!important}}

/* =========================================================
   v1.28: one dark colour across the site — the footer charcoal
   ========================================================= */
:root{--ink2:#1E2229}
header.site{background:rgba(30,34,41,.97)!important;border-bottom:1px solid rgba(255,255,255,.08)}
.topbar{background:#16191E}
.a-bar,.r-bar{background:rgba(30,34,41,.97)!important}
#guides{background:var(--ink2)!important}
#guides::after{opacity:.1}
#home.hs{background:var(--ink2)}
.hs-slide[data-i="0"]::after{background:linear-gradient(90deg,transparent 28%,rgba(30,34,41,.6) 48%,rgba(30,34,41,.9) 72%),linear-gradient(0deg,rgba(30,34,41,.6),transparent 35%)!important}
.mega{background:rgba(22,25,30,.98)!important}
#contactPage #bookSec{background:var(--ink2)}
#contactPage .fee.hl{background:var(--ink2);border-color:var(--ink2)}
#area .a-hero,.a-card.dk{background:var(--ink2)!important}
#area .a-hero::before{opacity:.25}
.ab-cap{background:none}
.fact .f-ic{background:var(--ink2)}
.btn-blue{background:var(--ink2)!important}
.btn-blue:hover{background:#2C323C!important}
.in-more{background:var(--ink2)}
#offices .oc .o-btn.pri{background:#fff;border-color:#fff;color:var(--ink2)}
#offices .oc .o-btn.pri:hover{background:#E1E5EB;color:var(--ink2)}
.chat-head,.chat .head{background:var(--ink2)}

/* =========================================================
   v1.29: Offices — full-width map with a floating office card
   ========================================================= */
#offices .off-grid{display:none}
#offices{padding-bottom:0!important}
#offices::after{display:none}
.om{position:relative;width:100%;margin:40px 0 0;height:min(72vh,580px);min-height:440px;
  border-top:1px solid rgba(255,255,255,.08);background:#1A1E25;overflow:hidden}
.om-map{position:absolute;inset:0;z-index:0}
.om-map .leaflet-tile-pane{filter:grayscale(1) invert(1) brightness(.78) contrast(1.05)}
.om-map .leaflet-container,.om-map.leaflet-container{background:#1A1E25;font:inherit}
.om-map .leaflet-control-attribution{background:rgba(30,34,41,.85);color:#8A94A6;font-size:10px}
.om-map .leaflet-control-attribution a{color:#C9D4E5}
.om-map .leaflet-control-zoom a{background:#262B33;color:#fff;border-color:rgba(255,255,255,.15)}
.om-pin{position:relative;display:block;width:16px;height:16px;border-radius:50%;background:#fff;border:3px solid #1E2229;box-shadow:0 0 0 2px rgba(255,255,255,.5)}
.om-pin.on{background:#BFD7FF;box-shadow:0 0 0 6px rgba(191,215,255,.25)}
.om-lab{position:absolute;left:50%;bottom:22px;translate:-50% 0;white-space:nowrap;font:600 .95rem "Cinzel",var(--display);color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.8);letter-spacing:.04em}
.om-mk{cursor:pointer}
/* fallback drawing when the live map can't load */
.om-svg{width:100%;height:100%;display:block}
.om-svg .gl{stroke:rgba(255,255,255,.05)}
.om-svg .rt{stroke:rgba(255,255,255,.45);stroke-width:1.5;stroke-dasharray:6 7;fill:none}
.om-svg .river{stroke:rgba(191,215,255,.12);stroke-width:2;fill:none}
.om-svg .mk{cursor:pointer}
.om-svg .mk circle{fill:#fff;stroke:#1E2229;stroke-width:3}
.om-svg .mk.on circle{fill:#BFD7FF}
.om-svg .mk text{fill:#fff;font:600 17px "Cinzel",var(--display);letter-spacing:.05em}
/* floating card */
.om-card{position:absolute;z-index:500;top:50%;translate:0 -50%;right:max(20px,calc((100vw - 1160px) / 2));width:min(360px,calc(100% - 40px));
  background:rgba(30,34,41,.94);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.16);border-radius:12px;
  padding:20px 22px 22px;color:#fff;box-shadow:0 24px 50px rgba(0,0,0,.45)}
.om-tabs{display:flex;gap:6px;margin-bottom:18px;flex-wrap:wrap}
.om-tabs button{flex:1;min-width:0;padding:8px 6px;border-radius:6px;border:1px solid rgba(255,255,255,.2);background:none;color:#C9D4E5;font:500 .82rem var(--body);cursor:pointer}
.om-tabs button[aria-selected="true"]{background:#fff;color:#1E2229;border-color:#fff}
.om-card h3{font:400 1.5rem/1.2 var(--display);margin:0 0 14px;color:#fff}
.om-card h3 small{font:400 .88rem var(--body);color:#AFC0DC;margin-inline-start:6px}
.om-card dl{margin:0 0 18px;display:grid;gap:2px}
.om-card dt{font-size:.8rem;color:#8A94A6}
.om-card dd{margin:0 0 10px;font-size:.95rem;color:#fff}
.om-card dd.tba{color:#C9D4E5}
.om-act{display:flex;gap:8px;flex-wrap:wrap}
.om-act a{flex:1;text-align:center;padding:10px 12px;border-radius:999px;font:500 .86rem var(--body);text-decoration:none;border:1px solid rgba(255,255,255,.5);color:#fff;white-space:nowrap}
.om-act a.pri{background:#fff;color:#1E2229;border-color:#fff}
.om-act a:hover{opacity:.9}
@media (max-width:860px){
  .om{height:auto;min-height:0;display:flex;flex-direction:column}
  .om-map{position:relative;height:360px;inset:auto}
  .om-card{position:relative;top:auto;right:auto;translate:none;width:auto;margin:-40px 16px 28px;border-radius:12px}
}
#guides{overflow:clip}

/* =========================================================
   v1.30: practice-area thumbnails (photo, shield, area name, play)
   ========================================================= */
#services .pc-track{gap:22px;padding:30px 6px 26px;perspective:1400px}
.pc.pc2{flex:0 0 clamp(250px,26vw,330px);border:0;background:none;border-radius:0;overflow:visible;transform-style:preserve-3d;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.pc2 .pc-th{position:relative;aspect-ratio:16/10;border-radius:12px;overflow:hidden;background:#262B33 center/cover no-repeat;box-shadow:0 18px 36px rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.14)}
.pc2 .pc-th::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,23,28,.15),rgba(20,23,28,.55) 55%,rgba(20,23,28,.85))}
.pc2 .pc-mark{position:absolute;left:50%;top:44%;translate:-50% -50%;display:flex;flex-direction:column;align-items:center;gap:10px;width:90%;text-align:center}
.pc2 .pc-mark img{width:62px;height:auto;opacity:.92;filter:drop-shadow(0 4px 10px rgba(0,0,0,.5))}
.pc2 .pc-mark b{font:600 1.15rem/1.15 "Cinzel",var(--display);letter-spacing:.06em;text-transform:uppercase;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.6)}
html[lang="ur"] .pc2 .pc-mark b{font-family:var(--urdu);text-transform:none;letter-spacing:0}
.pc2 .pc-play{position:absolute;right:14px;bottom:14px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.7);background:rgba(20,23,28,.55);color:#fff;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.pc2 .pc-play svg{width:16px;height:16px;margin-left:3px}
.pc2 .pc-play:hover{background:#fff;color:#1E2229}
.pc2 .pc-cap{display:flex;justify-content:space-between;align-items:center;padding:14px 4px 0;color:#fff;font:500 .98rem var(--body)}
.pc2 .pc-cap small{color:#8A94A6;font-size:.8rem;font-weight:400}
.pc2:hover .pc-th,.pc2:focus-visible .pc-th{border-color:rgba(255,255,255,.45)}
/* video lightbox */
.vbox{position:fixed;inset:0;z-index:130;background:rgba(10,12,16,.88);display:none;align-items:center;justify-content:center;padding:20px}
.vbox.open{display:flex}
.vbox video{width:min(90vw,78vh,620px);aspect-ratio:1;border-radius:12px;background:#000}
.vbox button{position:absolute;top:18px;right:18px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.6);background:none;color:#fff;font-size:1.4rem;cursor:pointer}
@media (max-width:640px){.pc.pc2{flex-basis:78vw}}

/* =========================================================
   v1.31: Offices — Pakistan relief map with arc locator
   ========================================================= */
#offices .om{display:none}
.pkm{position:relative;margin-top:36px}
.pk-stage{position:relative;height:640px;border-radius:16px;overflow:hidden;
  background:radial-gradient(ellipse at 42% 70%,#2A3240 0%,#1E2229 55%,#16191E 100%);border:1px solid rgba(255,255,255,.1);box-shadow:0 30px 60px rgba(0,0,0,.4)}
.pk-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:44px 44px;
  -webkit-mask-image:radial-gradient(ellipse at 45% 60%,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse at 45% 60%,#000 30%,transparent 75%)}
.pk-map3d{position:absolute;width:560px;height:500px;left:calc(42% - 280px);top:150px;transform:perspective(1300px) rotateX(46deg) rotateZ(-4deg);transform-origin:50% 60%}
.pk-map3d svg{width:100%;height:100%;overflow:visible}
.pk-over{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.pk-over .arc{fill:none;stroke:rgba(205,222,255,.55);stroke-width:2}
.pk-over .tick{stroke:rgba(205,222,255,.45);stroke-width:1.2}
.pk-over .mesh{stroke:rgba(205,222,255,.16);stroke-width:1;fill:none}
.pk-over .md{fill:rgba(205,222,255,.55)}
.pk-over .beam{fill:none;stroke:url(#pkBeam);stroke-width:1.6;opacity:.55}
.pk-over .beam.on{opacity:1;stroke-width:2.2}
.pk-over .glow{fill:none;stroke:#9DB8FF;stroke-width:7;opacity:.12;filter:blur(3px)}
.pk-over .glow.on{opacity:.35}
.pk-node{pointer-events:auto;cursor:pointer}
.pk-node circle.halo{fill:rgba(191,215,255,.15);stroke:rgba(191,215,255,.45)}
.pk-node circle.core{fill:#fff}
.pk-node.on circle.halo{fill:rgba(191,215,255,.3);stroke:#fff}
.pk-node text{fill:#fff;font:500 15px var(--body);paint-order:stroke;stroke:#1E2229;stroke-width:4px}
.pk-node.on text{font-weight:600}
.pk-card{position:absolute;z-index:3;right:28px;top:50%;translate:0 -50%;width:min(340px,calc(100% - 40px));
  background:rgba(38,43,51,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.18);border-radius:14px;padding:14px 14px 18px;color:#fff;box-shadow:0 24px 50px rgba(0,0,0,.45)}
.pk-mini{height:150px;border-radius:9px;overflow:hidden;background:#EEF1F5;position:relative;margin-bottom:14px}
.pk-mini iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.pk-mini svg{width:100%;height:100%;display:block}
.pk-card h3{font:400 1.45rem/1.2 var(--display);margin:0 4px 8px;color:#fff}
.pk-card h3 small{font:400 .86rem var(--body);color:#AFC0DC;margin-inline-start:6px}
.pk-card p{margin:0 4px 4px;color:#D3DAE5;font-size:.92rem}
.pk-card p.tba{color:#AFC0DC}
.pk-act{display:flex;gap:8px;margin:14px 4px 0}
.pk-act a{flex:1;text-align:center;padding:9px 10px;border-radius:999px;font:500 .84rem var(--body);text-decoration:none;color:#fff;border:1px solid rgba(255,255,255,.55);white-space:nowrap}
.pk-act a.pri{border-color:#BFD7FF;box-shadow:0 0 0 1px rgba(191,215,255,.35) inset}
.pk-act a:hover{background:rgba(255,255,255,.08)}
.pk-dots{position:absolute;left:50%;bottom:16px;translate:-50% 0;display:flex;gap:8px;z-index:3}
.pk-dots button{width:34px;height:4px;border:0;border-radius:2px;background:rgba(255,255,255,.25);cursor:pointer;padding:0}
.pk-dots button[aria-selected="true"]{background:#BFD7FF}
@media (max-width:980px){
  .pk-stage{height:auto;padding-bottom:20px}
  .pk-scene{position:relative;height:430px}
  .pk-map3d{width:420px;height:375px;left:calc(50% - 210px);top:110px}
  .pk-card{position:relative;right:auto;top:auto;translate:none;margin:0 auto 30px;width:auto;max-width:420px;margin-inline:16px}
  .pk-dots{position:relative;left:auto;bottom:auto;translate:none;justify-content:center}
}
@media (max-width:480px){.pk-scene{height:360px}.pk-map3d{width:330px;height:295px;left:calc(50% - 165px);top:95px}}

/* =========================================================
   v1.32: typography (Cormorant Garamond + Manrope),
   practice cards play on hover
   ========================================================= */
:root{
  --display:"Cormorant Garamond","Times New Roman",Georgia,serif;
  --body:"Manrope","Segoe UI",system-ui,-apple-system,sans-serif;
}
body{font-family:var(--body);letter-spacing:.005em}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;letter-spacing:.005em}
h2{font-size:clamp(2.1rem,4.2vw,3.2rem);line-height:1.08}
.lede{font-weight:400;line-height:1.7}
.hero h1,.hs-t{font-family:var(--display)!important;font-weight:700!important;letter-spacing:.01em!important;line-height:1.02!important}
.hero h1{font-size:clamp(3rem,7vw,5.6rem)!important}
.hs-t{font-size:clamp(2.6rem,5.8vw,4.8rem)!important}
.hs-k{font-family:var(--body);font-weight:600}
footer .fx h3,#offices .office h3,.o-n,.arch-badge b,.om-lab,.pk-node text{font-family:var(--display)!important}
footer .fx h3{font-weight:700;font-size:1.05rem;letter-spacing:.1em}
.btn,.o-btn,.pk-act a,.in-more{font-family:var(--body);font-weight:600;letter-spacing:.01em}
.brand b,.brand small{font-family:"Cinzel",var(--display)}
html[lang="ur"] h1,html[lang="ur"] h2,html[lang="ur"] h3,html[lang="ur"] .hs-t{font-family:var(--urdu)!important}

/* Practice areas heading rises in */
#services h2.split .hw{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.06em}
#services h2.split .hc{display:inline-block;translate:0 110%}
#services h2.split.go .hc{animation:hcRise .85s cubic-bezier(.2,.75,.2,1) both;animation-delay:calc(var(--i) * 35ms)}

/* cards: video plays on hover, name and line animate */
.pc2 .pc-play{display:none!important}
.pc2 .pc-th video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .45s ease;z-index:1;background:#14171C}
.pc2.playing .pc-th video{opacity:1}
.pc2 .pc-th::before{z-index:2}
.pc2 .pc-mark{z-index:3;transition:translate .45s cubic-bezier(.2,.7,.2,1),opacity .35s}
.pc2 .pc-mark img{transition:opacity .35s,scale .45s}
.pc2 .pc-mark b{font-family:var(--display)!important;font-weight:700;font-size:1.45rem;letter-spacing:.08em;position:relative;padding-bottom:8px}
.pc2 .pc-mark b::after{content:"";position:absolute;left:50%;bottom:0;width:0;height:1.5px;background:#fff;translate:-50% 0;transition:width .45s cubic-bezier(.2,.7,.2,1)}
.pc2:hover .pc-mark b::after,.pc2:focus-visible .pc-mark b::after{width:60%}
.pc2.playing .pc-mark{translate:-50% 30%}
.pc2.playing .pc-mark img{opacity:0;scale:.8}
.pc2.playing .pc-th::before{background:linear-gradient(180deg,rgba(20,23,28,0) 40%,rgba(20,23,28,.85))}
.pc2 .pc-cap{flex-direction:column;align-items:flex-start;gap:3px}
.pc2 .pc-cap span{font:700 1.2rem var(--display);letter-spacing:.01em}
.pc2 .pc-cap small{color:#AFB7C4;font-size:.86rem;transition:color .3s}
.pc2:hover .pc-cap small{color:#fff}
@media (prefers-reduced-motion:reduce){#services h2.split .hc{translate:none;animation:none}}

/* =========================================================
   v1.33: two surface colours only —
   light grey (#EEF1F5) for light areas, footer charcoal (#1E2229) for dark
   ========================================================= */
:root{--lite:#EEF1F5;--ink2:#1E2229}
/* light sections */
#process,#team,#about,#faq,.ab-clean,.ab-body-bg{background:var(--lite)!important}
.ab-clean::before{display:none}
#faq{border-top:0}
.facts{background:var(--lite)!important;border-bottom:1px solid #DDE3EA}
.fact:hover{background:#E4E8EE}
#area,.area,.reader,#insightsPage,#contactPage{background:var(--lite)!important}
#insightsPage .a-hero,#contactPage .a-hero{background:var(--lite)!important}
body{background:var(--lite)}
/* dark sections and bars */
.topbar{background:var(--ink2)!important;border-bottom:1px solid rgba(255,255,255,.1)}
.topbar::after{display:none}
#services,#guides,#offices,footer.dark,#home.hs{background:var(--ink2)!important}
/* hero slide 1: the right side settles into solid charcoal */
.hs-slide[data-i="0"]::after{background:linear-gradient(90deg,rgba(30,34,41,0) 22%,rgba(30,34,41,.75) 40%,#1E2229 56%),linear-gradient(0deg,rgba(30,34,41,.55),transparent 30%)!important}
@media (max-width:860px){.hs-slide[data-i="0"]::after{background:linear-gradient(180deg,rgba(30,34,41,0) 10%,rgba(30,34,41,.8) 45%,#1E2229 70%)!important}}
/* offices: heading and map are one piece */
#offices h2{display:block;border:0;padding:0;margin:0 auto 12px;text-align:center}
.pk-stage{border:0;border-radius:0;box-shadow:none;background:radial-gradient(ellipse at 42% 70%,rgba(255,255,255,.05) 0%,rgba(255,255,255,0) 60%),var(--ink2)}
.pkm{margin-top:10px}
#offices{padding-bottom:20px!important}

/* =========================================================
   v1.34: complete team, Hafizabad address, compact team and
   office sections that fit on one screen
   ========================================================= */
#team{padding:44px 0 48px!important}
#team h2{font-size:clamp(1.8rem,3vw,2.4rem)}
#team .team-grid.tm-grid{margin-top:26px;gap:22px}
#team .tm-ph{width:150px;height:150px;margin-bottom:14px}
#team .tm h3{font-size:1.15rem}
#team .tm .mrole{font-size:.86rem;margin-bottom:6px;line-height:1.4}
#team .tm .mareas{font-size:.86rem;line-height:1.5}
#team .tm-cities{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin-bottom:8px}
#team .tm-cities .mcity{margin:0}
#team .mcity.soon{background:#0E1F3D;border-color:#0E1F3D;color:#fff}
#team .tm.region .tm-in{background:radial-gradient(circle at 50% 35%,#1C3A78,#0B1C40 75%)}
#team .tm.region .tm-in img{position:static;width:56%;height:auto;object-fit:contain}
@media (max-width:440px){#team .tm-ph{width:120px;height:120px}}

#offices{padding:36px 0 24px!important}
#offices h2{font-size:clamp(1.7rem,2.8vw,2.3rem)}
#offices .lede{margin-top:6px!important;font-size:.98rem;max-width:none}
#offices .pkm{margin-top:18px}
.pk-stage{height:clamp(360px,calc(100vh - 252px),540px)}
.pk-card{padding:12px 12px 14px;width:min(320px,calc(100% - 40px))}
.pk-mini{height:118px;margin-bottom:10px}
.pk-card h3{font-size:1.3rem;margin-bottom:4px}
.pk-act{margin-top:10px}
.pk-dots{bottom:10px}
@media (max-width:980px){
  .pk-stage{height:auto}
  .pk-scene{height:330px}
  .pk-map3d{width:340px;height:304px;left:calc(50% - 170px);top:90px}
}
@media (min-width:981px){.pk-card{right:96px}}

/* =========================================================
   v1.35: smaller type across the site; Case guides section
   fits on one screen
   ========================================================= */
html{font-size:15px}
body{font-size:15px}
section h2{font-size:clamp(1.7rem,2.8vw,2.4rem)!important;line-height:1.15}
.hero h1,[class*=slide] h1{font-size:clamp(2.1rem,4.1vw,3.5rem)!important;line-height:1.08!important}
.lede{font-size:1rem!important}
.hero .lede,[class*=slide] .lede,[class*=slide] p{font-size:1rem}
section{padding-top:64px;padding-bottom:64px}

#guides{padding:34px 0 28px!important}
#guides .lede{margin-top:6px!important;max-width:none}
#guides .g-tabs{margin:16px 0 6px;padding-bottom:8px}
#guides .g-tab{padding:4px 14px 4px 4px;font-size:.84rem}
#guides .g-tab .mini{width:28px;height:28px}
#guides .g-tab .mini svg{width:16px;height:16px}
#guides .g-stage{padding:18px 24px 20px}
#guides .g-head{gap:16px}
#guides .g-head .ring{width:64px;height:64px;padding:5px}
#guides .g-head .ring svg{width:34px;height:34px}
#guides .g-head h3{font-size:1.35rem!important}
#guides .g-head .where{margin-top:3px;font-size:.74rem;padding:2px 10px}
#guides .g-head p{margin-top:4px;font-size:.88rem}
#guides .g-ctrl button{width:38px;height:38px}
#guides .g-track{margin:20px 10px 4px}
#guides .g-line{top:18px}
#guides .g-dot{width:38px;height:38px;font-size:.95rem}
#guides .g-token{width:34px}
#guides .g-step{gap:8px;font-size:.8rem}
#guides .g-detail{margin-top:14px;padding-top:14px;gap:20px;min-height:0}
#guides .g-detail h4{font-size:1.2rem!important;margin:2px 0 4px}
#guides .g-detail p{font-size:.88rem}
#guides .g-need{padding:10px 14px;font-size:.84rem}
#guides .g-need b{font-size:.9rem}
#guides .g-actions{margin-top:12px}
#guides .g-actions .btn{padding:9px 14px;font-size:.82rem}
#home h2.hs-t,#home .hs-t{font-size:clamp(2.1rem,4.1vw,3.5rem)!important;line-height:1.08!important}
.ab-q{font-size:clamp(1.3rem,2vw,1.6rem)!important}
.f-cta h2{font-size:clamp(1.4rem,2.4vw,1.8rem)!important}
/* v1.37: Urdu hero — keep the text on the dark side, off the photo */
html[dir="rtl"] .hs-right{justify-content:flex-start}
html[dir="rtl"] .hs-left{justify-content:flex-end}
html[dir="rtl"] .hs-box{text-align:right}
@media (max-width:860px){html[dir="rtl"] .hs-right,html[dir="rtl"] .hs-left{justify-content:flex-start}}
/* v1.38: responsive polish */
@media (max-width:360px){.facts .wrap{grid-template-columns:1fr}.fact{border-inline-start:0!important}}
img,video,svg,iframe{max-width:100%}
@media (max-width:900px) and (min-width:361px){.facts .wrap{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media (max-width:900px){.fact{align-items:center}}
/* v1.39: low-resolution photos read as a clean, soft backdrop */
.hs-slide[data-i="1"]::after{background:radial-gradient(ellipse at center,rgba(6,13,28,.5),rgba(6,13,28,.8) 80%)!important}
.hs-slide[data-i="2"]::after{background:linear-gradient(90deg,rgba(6,13,28,.92) 0%,rgba(6,13,28,.6) 42%,rgba(6,13,28,.05) 75%)!important}
.hs-slide[data-i="1"] .hs-t{font-style:italic}
/* v1.41: light-grey hover on practice-area and Insights cards */
a.svc,.post,.in-card,.in-feat{transition:background-color .25s,border-color .25s,color .25s}
a.svc:hover,a.svc:focus-visible{background:#E9ECF1!important;border-color:#D5DBE3!important}
a.svc:hover h3,a.svc:focus-visible h3,a.svc:hover .svc-cases b{color:#0E1F3D!important}
a.svc:hover .ur,a.svc:hover .more,a.svc:hover li,a.svc:hover p,a.svc:hover small,a.svc:hover .svc-cases{color:#4A586D!important}
.post:hover,.post:focus-visible,.in-card:hover,.in-card:focus-visible,.in-feat:hover,.in-feat:focus-visible{background:#E9ECF1!important;border-color:#D5DBE3!important}
.post:hover h3,.in-card:hover h3,.in-feat:hover h3,.post:hover h2,.in-card:hover h2,.in-feat:hover h2{color:#0E1F3D!important}
.post:hover p,.post:hover .pcat,.post:hover .pmeta,.in-card:hover p,.in-feat:hover p{color:#4A586D!important}
a.pc{border-radius:14px;transition:background-color .25s}
a.pc .pc-cap{padding:10px 12px 12px;border-radius:0 0 14px 14px;transition:background-color .25s,color .25s}
a.pc:hover .pc-cap,a.pc:focus-visible .pc-cap{background:#E9ECF1}
a.pc:hover .pc-cap span,a.pc:focus-visible .pc-cap span{color:#0E1F3D!important}
a.pc:hover .pc-cap small,a.pc:focus-visible .pc-cap small{color:#4A586D!important}
.in-card,.in-feat{border-radius:10px;overflow:hidden;padding-bottom:12px}
.in-card > :not(.in-img){padding-inline:12px}
.in-card:hover,.in-card:focus-visible,.in-feat:hover,.in-feat:focus-visible{background:#DFE4EB!important}
.in-card:hover h3,.in-feat:hover h3{color:#0E1F3D!important}
/* v1.42: nav hover, hero slide 1 position + entrance animation */
nav.main a{transition:background-color .2s,color .2s}
nav.main a:hover,nav.main a:focus-visible{background:#E9ECF1!important;color:#0E1F3D!important}
.hs-slide[data-i="0"] .hs-in.hs-right{padding-inline-end:clamp(0px,7vw,110px)}
html[dir="rtl"] .hs-slide[data-i="0"] .hs-in.hs-right{padding-inline-end:0;padding-inline-start:clamp(0px,7vw,110px)}
@media (max-width:860px){.hs-slide[data-i="0"] .hs-in.hs-right{padding-inline:0}}
@keyframes hsRise{from{opacity:0;transform:translateY(26px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes hsLine{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes hsSheen{0%{background-position:-150% 0}100%{background-position:250% 0}}
.hs-slide.is-on .hs-box > p,.hs-slide.is-on .hs-box > .hero-ctas,.hs-slide.is-on .hs-box > .hs-line,.hs-slide.is-on .hs-box > .btn{animation:hsRise .9s cubic-bezier(.2,.7,.2,1) both}
.hs-slide.is-on .hs-box > :nth-child(1){animation-delay:.1s}
.hs-slide.is-on .hs-box > :nth-child(3){animation-delay:.55s}
.hs-slide.is-on .hs-box > :nth-child(4){animation-delay:.75s}
.hs-slide.is-on .hero-ctas .btn{transition:transform .25s}
.hs-slide.is-on .hero-ctas .btn:hover{transform:translateY(-2px)}
@media (prefers-reduced-motion:reduce){.hs-slide.is-on .hs-box > *{animation:none!important}}
/* v1.43: no line under the slide-1 label; slide-1 title styled exactly like the other slide titles */
.hero h1::after,.hs-slide .hs-k::after{display:none!important;content:none!important}
#home .hs-slide[data-i="0"] h1,#home .hs-slide[data-i="0"] h1 *{font-family:var(--display)!important;font-weight:700!important;font-style:normal!important;letter-spacing:.01em!important;
  color:#fff!important;-webkit-text-fill-color:#fff!important;background:none!important;text-transform:none!important}
#home .hs-slide[data-i="0"] h1{font-size:clamp(2.1rem,4.1vw,3.5rem)!important;line-height:1.08!important;margin-bottom:22px}
/* v1.45: dark dropdown menus restored; larger hero text */
#home .hs-slide h1,#home .hs-slide .hs-t,#home h2.hs-t{font-size:clamp(2.4rem,4.8vw,4.1rem)!important;line-height:1.06!important}
#home .hs-slide .hs-box > p.lede{font-size:clamp(1rem,1.25vw,1.12rem)!important;line-height:1.65}
#home .hs-slide .hs-k{font-size:clamp(.8rem,1vw,.92rem)}
/* v1.46: animations — How we work + Our team */
#process .steps li,#team .tm{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--k,0) * 140ms)}
#process.anim-in .steps li,#team.anim-in .tm{opacity:1;transform:none}
#process .steps li::before{transform:scale(.4);opacity:0;transition:transform .6s cubic-bezier(.3,1.6,.5,1),opacity .4s,background-color .3s,color .3s;transition-delay:calc(var(--k,0) * 140ms + 150ms)}
#process.anim-in .steps li::before{transform:none;opacity:1}
#process .steps li::after{transform:scaleX(0);transform-origin:left;transition:transform .7s ease;transition-delay:calc(var(--k,0) * 140ms + 350ms)}
html[dir="rtl"] #process .steps li::after{transform-origin:right}
#process.anim-in .steps li::after{transform:none}
@media (max-width:900px){#process .steps li::after{transform:scaleY(0);transform-origin:top}#process.anim-in .steps li::after{transform:none}}
#process .steps li:hover::before{background:#0E1F3D;color:#fff;border-color:#0E1F3D;transform:scale(1.12)}
#process .steps li h3{transition:color .3s}
#process .steps li:hover h3{color:#2F5FBF}
#team .tm-ph{transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s}
#team .tm-in img{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
#team .tm:hover .tm-ph{transform:translateY(-6px);box-shadow:0 18px 34px rgba(14,31,61,.22)}
#team .tm:hover .tm-in img{transform:scale(1.08)}
#team .tm-ph{position:relative}
#team .tm-ph::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid transparent;border-top-color:#2F5FBF;border-right-color:#C9A65A;opacity:0;transition:opacity .3s}
#team .tm:hover .tm-ph::after{opacity:1;animation:tmSpin 1.6s linear infinite}
@keyframes tmSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){#process .steps li,#team .tm,#process .steps li::before,#process .steps li::after{opacity:1!important;transform:none!important;transition:none!important}#team .tm-ph::after{animation:none!important}}
/* v1.47: About us — heading colour matches other headings, plus reveal animations */
#about h2,#about .ab-txt h2{color:#14233D!important;-webkit-text-fill-color:#14233D!important;background:none!important}
#about .ab-pic,#about .ab-txt > *,#about .ab-vals > div{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--k,0) * 120ms)}
#about .ab-pic{transform:translateX(-36px) scale(.97)}
html[dir="rtl"] #about .ab-pic{transform:translateX(36px) scale(.97)}
#about.anim-in .ab-pic,#about.anim-in .ab-txt > *,#about .ab-vals.anim-in > div{opacity:1;transform:none}
#about .ab-txt h2{position:relative;display:inline-block;padding-bottom:8px}
#about .ab-txt h2::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:56px;background:#14233D;border-radius:2px;transform:scaleX(0);transform-origin:left;transition:transform .7s cubic-bezier(.2,.7,.2,1) .45s}
html[dir="rtl"] #about .ab-txt h2::after{left:auto;right:0;transform-origin:right}
#about.anim-in .ab-txt h2::after{transform:none}
#about .ab-vals > div{transition-property:opacity,transform,box-shadow}
#about .ab-vals > div:hover{transform:translateY(-6px)!important;box-shadow:0 18px 34px rgba(14,31,61,.14)}
#about .ab-pic img{transition:transform .8s cubic-bezier(.2,.7,.2,1)}
#about .ab-pic:hover img{transform:scale(1.04)}
@media (prefers-reduced-motion:reduce){#about .ab-pic,#about .ab-txt > *,#about .ab-vals > div{opacity:1!important;transform:none!important;transition:none!important}#about .ab-txt h2::after{transform:none!important}}
/* v1.48: no underline under About us, no blue bar beside the quote */
#about .ab-txt h2::after{display:none!important}
#about .ab-q{border:0!important;border-inline-start:0!important;padding-inline-start:0!important}
#about .ab-q::before,#about .ab-q::after{display:none!important}
#about .ab-q{color:#2F5FBF!important;-webkit-text-fill-color:#2F5FBF!important}

/* v1.50: dark mode only when the switch is on (html.dk) */
html.dk{--bg:#14171C;--surface:#1F242C;--text:#E6EAF0;--muted:#A7B1C0;--line:#2E3540;color-scheme:dark}
html.dk body{background:#14171C!important;color:#E6EAF0}
html.dk #process,html.dk #team,html.dk #about,html.dk #faq,html.dk #blog,html.dk #contact,html.dk #insightsPage,html.dk #insightsPage .a-hero,html.dk #contactPage,html.dk #contactPage .a-hero{background:#14171C!important;color:#E6EAF0!important}
html.dk #about::before{display:none}
html.dk #process h2,html.dk #team h2,html.dk #about h2,html.dk #about .ab-txt h2,html.dk #faq h2,html.dk #faq .fq-side h2,html.dk #blog h2,html.dk #contact h2,html.dk #insightsPage h1,html.dk #insightsPage h2,html.dk #insightsPage .a-hero h1,html.dk #insightsPage .a-hero .silver-text,html.dk #contactPage h1,html.dk #contactPage h2,html.dk #contactPage .a-hero h1,html.dk #contactPage .a-hero .silver-text{color:#F2F4F7!important;-webkit-text-fill-color:#F2F4F7!important;background:none!important}
html.dk #process h3,html.dk #team h3,html.dk #about h3,html.dk #about .ab-txt .ab-vals h3,html.dk #about .ab-row .ab-vals h3,html.dk #insightsPage h3,html.dk #contactPage h3{color:#F2F4F7!important}
html.dk #process .lede,html.dk #process p,html.dk #team .lede,html.dk #team p,html.dk #team .mrole,html.dk #about p,html.dk #about .ab-copy,html.dk #faq p,html.dk #faq .lede,html.dk #insightsPage p,html.dk #contactPage p{color:#A7B1C0!important}
html.dk #about .ab-copy p:first-child,html.dk #about .ab-txt .ab-copy > div > p:first-child{color:#D5DCE6!important}
html.dk #about .ab-q{color:#8DB4FF!important;-webkit-text-fill-color:#8DB4FF!important}
html.dk #about .ab-txt .mission,html.dk #about .ab-row .ab-vals > div,html.dk #about .ab-txt .ab-vals > div,html.dk #faq .fq-card,html.dk #insightsPage .in-empty,html.dk #contactPage .fee:not(.hl),html.dk #contactPage .cal,html.dk #contactPage .slotbox,html.dk #contactPage .bk-form,html.dk #contactPage .c-off,html.dk #contactPage .c-quick a,html.dk form.inq{background:#1F242C!important;border-color:#2E3540!important;color:#E6EAF0!important;box-shadow:none!important}
html.dk #about .ab-row .ab-vals > div,html.dk #about .ab-txt .ab-vals > div{border-top:3px solid #4C7DDB!important}
html.dk #about .ab-txt .mission{color:#E6EAF0!important;border-inline-start-color:#4C7DDB!important}
html.dk #contactPage .c-quick a:hover{background:#262C36!important}
html.dk #contactPage .seg{background:#1F242C!important}
html.dk #contactPage .fee .tag{background:#2E3540!important;color:#E6EAF0!important}
html.dk #contactPage .bk-form input,html.dk #contactPage .bk-form select,html.dk #contactPage .bk-form textarea,html.dk #insightsPage .in-f input,html.dk #insightsPage .in-f select,html.dk #insightsPage .in-tabs button,html.dk form.inq input,html.dk form.inq select,html.dk form.inq textarea,html.dk .b-search input{background:#14171C!important;border-color:#2E3540!important;color:#E6EAF0!important}
html.dk #insightsPage .in-tabs button[aria-pressed="true"],html.dk #insightsPage .in-tabs button[aria-selected="true"]{background:#E6EAF0!important;color:#14171C!important}
html.dk #faq{border-top:1px solid #23282F!important}
html.dk #faq .faq,html.dk #faq .faq details{border-color:#2E3540!important}
html.dk #faq .faq summary{color:#E6EAF0!important}
html.dk #faq .faq summary::after{background:linear-gradient(#E6EAF0,#E6EAF0) center/14px 1.5px no-repeat,linear-gradient(#E6EAF0,#E6EAF0) center/1.5px 14px no-repeat}
html.dk #faq .faq details[open] summary::after{background:linear-gradient(#E6EAF0,#E6EAF0) center/14px 1.5px no-repeat!important}
html.dk #process .steps li::before{background:#14171C!important;color:#C9D3E2!important;border-color:#4A5566!important}
html.dk #process .steps li::after{background:#2E3540!important}
html.dk #process .steps li:hover::before{background:#4C7DDB!important;border-color:#4C7DDB!important;color:#fff!important}
html.dk #process .steps li:hover h3{color:#8DB4FF!important}
html.dk #team .tm-ph{background:#3A4250!important}
html.dk #team .tm-in{border-color:#14171C!important}
html.dk #team .tm .mcity{color:#D5DCE6!important;border-color:#4A5566!important}
html.dk #team .mcity.soon{background:#E6EAF0!important;color:#14171C!important;border-color:#E6EAF0!important}
html.dk #team .tm:hover .tm-ph{box-shadow:0 18px 34px rgba(0,0,0,.45)}
html.dk .in-card:hover,html.dk .in-card:focus-visible,html.dk .in-feat:hover,html.dk .in-feat:focus-visible,html.dk .post:hover,html.dk .post:focus-visible{background:#262C36!important;border-color:#2E3540!important}
html.dk .in-card h3,html.dk .in-feat h3,html.dk .post h3{color:#E6EAF0!important}
html.dk .in-card:hover h3,html.dk .in-feat:hover h3,html.dk .post:hover h3{color:#fff!important}
html.dk .in-card p,html.dk .in-feat p,html.dk .post p,html.dk .post .pcat,html.dk .post .pmeta,html.dk .in-k,html.dk .in-m{color:#A7B1C0!important}
html.dk .post{background:#1F242C!important;border-color:#2E3540!important}
html.dk .reader{background:#14171C!important;color:#E6EAF0!important}
html.dk .reader .r-body,html.dk .reader .r-body p,html.dk .reader .r-body li{color:#C9D3E2!important}
html.dk .reader .r-body h3,html.dk .reader .r-rel h2{color:#F2F4F7!important}
html.dk .reader .r-nav button{background:#1F242C!important;border-color:#2E3540!important;color:#E6EAF0!important}
html.dk .m-card,html.dk .doc .m-card{background:#1F242C!important;color:#E6EAF0!important}
html.dk .doc-body p,html.dk .doc-body li,html.dk .m-body ul{color:#A7B1C0!important}
html.dk .doc-body h2,html.dk .doc-body h3,html.dk .m-body h2,html.dk .m-body h3{color:#F2F4F7!important}
html.dk .chat,html.dk .chat-body,html.dk .chat-f,html.dk .quick,html.dk .chat-note{background:#1A1E25!important;color:#E6EAF0!important}
html.dk .msg.bot{background:#232933!important;border-color:#2E3540!important;color:#E6EAF0!important}
html.dk .facts{background:#1A1E25!important;border-bottom:1px solid #2E3540!important;box-shadow:none!important}
html.dk .fact{color:#A7B1C0!important}
html.dk .fact b,html.dk .fact h3,html.dk .fact strong{color:#F2F4F7!important}
html.dk .fact:hover{background:#232933!important}
html.dk .fact .f-ic{background:#2E3540!important;color:#E6EAF0!important}
html.dk #about .ab-clean{background:#14171C!important}
html.dk #guides .g-stage{background:#1F242C!important;color:#E6EAF0!important;box-shadow:0 30px 60px rgba(0,0,0,.45)!important}
html.dk #guides .g-head h3,html.dk #guides .g-detail h4,html.dk #guides .g-need b,html.dk #guides .g-step.cur{color:#F2F4F7!important}
html.dk #guides .g-head p,html.dk #guides .g-detail p,html.dk #guides .g-step{color:#A7B1C0!important}
html.dk #guides .g-head .where{background:#14171C!important;border-color:#2E3540!important;color:#C9D3E2!important}
html.dk #guides .g-ctrl button{border-color:#4A5566!important;color:#E6EAF0!important}
html.dk #guides .g-ctrl .pp .prog circle{stroke:#E6EAF0!important}
html.dk #guides .g-line{background:#2E3540!important}
html.dk #guides .g-fill{background:#8DB4FF!important}
html.dk #guides .g-dot{background:#14171C!important;border-color:#4A5566!important;color:#A7B1C0!important}
html.dk #guides .g-step.done .g-dot{border-color:#8DB4FF!important;color:#E6EAF0!important}
html.dk #guides .g-detail{border-top-color:#2E3540!important}
html.dk #guides .g-need{background:#14171C!important;border-color:#2E3540!important;color:#C9D3E2!important}
html.dk #guides .g-actions .btn-ghost{color:#E6EAF0!important;border-color:#E6EAF0!important}
html.dk #guides .g-actions .btn-ghost:hover{background:#E6EAF0!important;color:#14171C!important}
html.dk .f-cta{background:#1F242C!important;color:#E6EAF0!important;border:1px solid #2E3540!important}
html.dk .f-cta h2,html.dk .f-cta h2.silver-text{color:#F2F4F7!important;-webkit-text-fill-color:#F2F4F7!important}
html.dk .f-cta p{color:#A7B1C0!important}
html.dk .f-cta .btn-ghost{color:#E6EAF0!important;border-color:#E6EAF0!important}
html.dk .f-cta .btn-ghost:hover{background:#E6EAF0!important;color:#14171C!important}
html.dk{--lite:#14171C!important}
html.dk .ab-body-bg,html.dk #area,html.dk .area{background:#14171C!important;color:#E6EAF0!important}
html.dk .area h1,html.dk .area h2,html.dk .area h3,html.dk .area h4,html.dk #area h2,html.dk #area h3{color:#F2F4F7!important;-webkit-text-fill-color:#F2F4F7!important}
html.dk .area p,html.dk .area li,html.dk .area small,html.dk #area p,html.dk #area li{color:#A7B1C0!important}
html.dk .area [class*=card],html.dk .area [class*=box],html.dk .area aside > div,html.dk .area .a-side > div{border-color:#2E3540!important}
html.dk .fact span,html.dk .fact small,html.dk .fact p{color:#A7B1C0!important}
html.dk #faq b,html.dk #faq .fq-card b,html.dk #faq strong{color:#F2F4F7!important}
html.dk #contactPage small{color:#A7B1C0!important}
html.dk #rContent .r-cta b,html.dk .r-cta b{color:#F2F4F7!important}
html.dk .r-cta{background:#1F242C!important;border:1px solid #2E3540}
/* dark-mode switch in the header */
.dk-switch{background:none;border:0;padding:4px;cursor:pointer;display:inline-flex;align-items:center}
.dk-track{position:relative;width:52px;height:28px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(201,207,216,.4);transition:background .3s,border-color .3s}
.dk-knob{position:absolute;top:2px;left:2px;width:22px;height:22px;border-radius:50%;background:#F2F4F7;display:grid;place-items:center;color:#C9A65A;box-shadow:0 2px 6px rgba(0,0,0,.35);transition:transform .35s cubic-bezier(.3,1.4,.5,1),background .3s,color .3s}
.dk-knob svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;grid-area:1/1;transition:opacity .25s,transform .35s}
.dk-moon{opacity:0;transform:rotate(-60deg)}
.dk-switch[aria-checked="true"] .dk-track{background:#2F5FBF;border-color:#2F5FBF}
.dk-switch[aria-checked="true"] .dk-knob{transform:translateX(24px);background:#0E1F3D;color:#F2E2B0}
.dk-switch[aria-checked="true"] .dk-sun{opacity:0;transform:rotate(60deg)}
.dk-switch[aria-checked="true"] .dk-moon{opacity:1;transform:none}
.dk-switch:focus-visible{outline:2px solid #7FA6E8;outline-offset:2px;border-radius:999px}
html[dir="rtl"] .dk-knob{left:auto;right:2px}
html[dir="rtl"] .dk-switch[aria-checked="true"] .dk-knob{transform:translateX(-24px)}
@media (max-width:420px){.dk-track{width:44px;height:24px}.dk-knob{width:18px;height:18px}.dk-switch[aria-checked="true"] .dk-knob{transform:translateX(20px)}html[dir="rtl"] .dk-switch[aria-checked="true"] .dk-knob{transform:translateX(-20px)}}
/* v1.51: no subtitles under Our team / Offices; prominent office cards; new sub-page bar buttons */
[data-i18n="teamS"],[data-i18n="offS"]{display:none!important}
#team .team-grid.tm-grid{margin-top:20px}
#offices .pkm{margin-top:14px}
.c-off{border:1.5px solid #2F5FBF!important;border-top:4px solid #2F5FBF!important;border-radius:12px!important;box-shadow:0 10px 26px rgba(47,95,191,.12)!important;transition:transform .25s,box-shadow .25s}
.c-off:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(47,95,191,.22)!important}
html.dk .c-off{border-color:#4C7DDB!important;box-shadow:0 10px 26px rgba(0,0,0,.35)!important}
.c-off a{font-weight:600;text-decoration:none!important;display:inline-flex!important;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;background:#2F5FBF;color:#fff!important;margin-top:12px}
.c-off a:hover{background:#244C9B}
.c-off a::before{content:"";width:14px;height:14px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.2-7-11.5A7 7 0 0 1 19 9.5C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.2-7-11.5A7 7 0 0 1 19 9.5C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E") center/contain no-repeat}
.a-back{display:inline-flex!important;align-items:center;gap:10px;border:0!important;background:none!important;padding:4px 10px 4px 4px!important;border-radius:999px!important;font:600 .9rem var(--body)!important;color:#E7EBF1!important;transition:background .2s}
.a-back::before{content:"";width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.1) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 6l-6 6 6 6'/%3E%3C/svg%3E") center/16px no-repeat;transition:background-color .2s,transform .2s}
html[dir="rtl"] .a-back::before{transform:scaleX(-1)}
.a-back:hover{background:rgba(255,255,255,.06)!important}
.a-back:hover::before{background-color:rgba(255,255,255,.22);transform:translateX(-2px)}
.a-bar .btn.btn-silver{display:inline-flex!important;align-items:center;gap:8px;background:linear-gradient(135deg,#2F5FBF,#4C7DDB)!important;color:#fff!important;border:0!important;border-radius:10px!important;padding:10px 16px!important;font-weight:600!important;box-shadow:0 8px 20px rgba(47,95,191,.35);transition:transform .2s,box-shadow .2s}
.a-bar .btn.btn-silver::before{content:"";width:16px;height:16px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M16 3v4M8 3v4M3 10h18'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M16 3v4M8 3v4M3 10h18'/%3E%3C/svg%3E") center/contain no-repeat}
.a-bar .btn.btn-silver:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(47,95,191,.45)}
@media (max-width:560px){.a-bar .btn.btn-silver{padding:9px 12px!important;font-size:.8rem!important}}
/* v1.52: office boxes in the footer charcoal instead of blue */
.c-off{border-color:#1E2229!important;border-top-color:#1E2229!important;box-shadow:0 10px 26px rgba(30,34,41,.14)!important}
.c-off:hover{box-shadow:0 16px 34px rgba(30,34,41,.24)!important}
.c-off .t{color:#1E2229!important}
.c-off a{background:#1E2229!important}
.c-off a:hover{background:#363C47!important}
html.dk .c-off{border-color:#4A5566!important;border-top-color:#C9CFD8!important}
html.dk .c-off .t{color:#C9CFD8!important}
html.dk .c-off a{background:#E6EAF0!important;color:#1E2229!important}
/* v1.53: booking section on the page background; calendar, times and form styled like the office boxes */
#contactPage #bookSec{background:none!important;padding:56px 0 0!important;margin:24px 0 48px!important;border-radius:0!important;overflow:visible!important}
#contactPage #bookSec::before{display:none!important}
#contactPage #bookSec > h2{color:#0E1F3D!important}
#contactPage #bookSec > p,#contactPage #bookSec .lede{color:#4A586D!important}
#contactPage .bk-steps li{color:#4A586D!important}
#contactPage .bk-steps b{color:#14233D!important}
#contactPage .bk-steps li::before{border-color:#1E2229!important;color:#1E2229!important}
#contactPage .cal,#contactPage .slotbox,#contactPage .bk-form{background:#fff!important;border:1.5px solid #1E2229!important;border-top:4px solid #1E2229!important;border-radius:12px!important;box-shadow:0 10px 26px rgba(30,34,41,.14)!important}
#contactPage #bookSec .cal-note{color:#4A586D!important}
.cal-g button:hover:not(:disabled){border-color:#1E2229!important}
.cal-g button.sel{background:#1E2229!important;border-color:#1E2229!important;box-shadow:none!important;color:#fff!important}
.slots button:hover:not(:disabled){border-color:#1E2229!important}
.slots button[aria-pressed="true"]{background:#1E2229!important;border-color:#1E2229!important;color:#fff!important}
.cal-h button{border-color:#1E2229!important;color:#1E2229!important}
.cal-h button:hover:not(:disabled){background:#1E2229!important;color:#fff!important}
html.dk #contactPage #bookSec > h2{color:#F2F4F7!important}
html.dk #contactPage #bookSec > p,html.dk #contactPage .bk-steps li,html.dk #contactPage #bookSec .cal-note{color:#A7B1C0!important}
html.dk #contactPage .bk-steps b{color:#F2F4F7!important}
html.dk #contactPage .bk-steps li::before{border-color:#C9CFD8!important;color:#E6EAF0!important}
html.dk #contactPage .cal,html.dk #contactPage .slotbox,html.dk #contactPage .bk-form{background:#1F242C!important;border-color:#4A5566!important;border-top-color:#C9CFD8!important}
html.dk .cal-g button.sel,html.dk .slots button[aria-pressed="true"]{background:#E6EAF0!important;color:#1E2229!important;border-color:#E6EAF0!important}
html.dk .cal-h button{border-color:#4A5566!important;color:#E6EAF0!important}
#contactPage .bk-sum{background:#1E2229!important;border-left-color:#1E2229!important;border-inline-start-color:#1E2229!important}
.slots .slot-empty{grid-column:1/-1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#contactPage .a-bar .btn.btn-silver{display:none!important}
/* v1.54: contact page — WhatsApp number in the bar, no quick boxes */
#contactPage .c-quick{display:none!important}
.a-wa{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:#fff;font:600 .95rem var(--body);padding:8px 16px 8px 8px;border-radius:999px;background:#1FA855;box-shadow:0 8px 20px rgba(31,168,85,.3);transition:transform .2s,background .2s}
.a-wa:hover{background:#178F47;transform:translateY(-1px)}
.a-wa-ic{width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.18) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm4.5 12.1c-.2-.1-1.5-.7-1.7-.8s-.4-.1-.6.1-.7.8-.8 1-.3.2-.5.1a6.7 6.7 0 0 1-3.3-2.9c-.2-.4.2-.4.7-1.3.1-.2 0-.3 0-.4l-.8-1.8c-.2-.5-.4-.4-.6-.4h-.5a1 1 0 0 0-.7.3 3 3 0 0 0-.9 2.2 5.2 5.2 0 0 0 1.1 2.8 11.9 11.9 0 0 0 4.6 4c1.7.7 2.4.8 3.2.7a2.7 2.7 0 0 0 1.8-1.3 2.2 2.2 0 0 0 .2-1.3c-.1-.1-.3-.2-.5-.3z'/%3E%3C/svg%3E") center/15px no-repeat}
@media (max-width:480px){.a-wa{font-size:.82rem;padding:6px 12px 6px 6px}.a-wa-ic{width:22px;height:22px}}
/* v1.55: time slots and booking form in one box */
#contactPage .bk-card{background:#fff;border:1.5px solid #1E2229;border-top:4px solid #1E2229;border-radius:12px;box-shadow:0 10px 26px rgba(30,34,41,.14);overflow:hidden;align-self:start}
#contactPage .bk-card .slotbox,#contactPage .bk-card .bk-form{border:0!important;border-radius:0!important;box-shadow:none!important;background:transparent!important;margin:0!important}
#contactPage .bk-card .slotbox{padding:22px 22px 16px!important}
#contactPage .bk-card .bk-form{padding:16px 22px 22px!important;border-top:1px solid #E2E7EF!important}
html.dk #contactPage .bk-card{background:#1F242C;border-color:#4A5566;border-top-color:#C9CFD8}
html.dk #contactPage .bk-card .bk-form{border-top-color:#2E3540!important}
#chatSend,#chatNew{display:none!important}
/* v1.56: touch targets + minimum text size for phones/tablets */
.pk-dots button{position:relative}
.pk-dots button::after{content:"";position:absolute;left:-4px;right:-4px;top:-16px;bottom:-16px}
.f-bottom nav button,.f-bottom nav a{padding:10px 4px!important;min-height:40px;display:inline-flex;align-items:center}
.teaser button{width:32px;height:32px;top:0;right:0;display:grid;place-items:center}
.brand small{font-size:12px!important}
#insightsPage .in-f > span,#insightsPage label.in-f > span,.in-f span{font-size:12px!important}
@media (max-width:999px){
  .tb-free,.lang,.hdr .btn-wa,.dk-switch{min-height:40px}
  .lang{min-width:44px}
  .cal-g button{min-height:36px}
  .chat-h button,.m-close{min-width:40px;min-height:40px}
}
.pk-dots button{height:28px!important;background:linear-gradient(rgba(255,255,255,.25),rgba(255,255,255,.25)) center/100% 4px no-repeat!important;border-radius:0!important}
.pk-dots button[aria-selected="true"]{background:linear-gradient(#BFD7FF,#BFD7FF) center/100% 4px no-repeat!important}
.pk-dots button::after{display:none}
.a-bar .btn-wa{min-height:40px;min-width:40px;justify-content:center}
.pk-dots button{height:28px!important;background:linear-gradient(rgba(255,255,255,.25),rgba(255,255,255,.25)) center/100% 4px no-repeat!important;border-radius:0!important}
.pk-dots button[aria-selected="true"]{background:linear-gradient(#BFD7FF,#BFD7FF) center/100% 4px no-repeat!important}
.pk-dots button::after{display:none}
.a-bar .btn-wa{min-height:40px;min-width:40px;justify-content:center}
/* v2: Insights dropdown (3 columns) and Case guides dropdown */
.mega-grid.three{grid-template-columns:1.6fr 1fr 1fr}
.mega-grid.gd-grid{grid-template-columns:repeat(6,1fr)}
@media (max-width:1180px){.mega-grid.gd-grid{grid-template-columns:repeat(3,1fr)}}
/* v2: practice-area video inside each article */
.r-video{margin:30px 0 0;width:min(100%,420px)}
.r-video figcaption{font-size:.78rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--blue,#3366CC);margin-bottom:10px}
.r-video video{display:block;width:100%;aspect-ratio:1/1;border-radius:14px;background:#0B1424;border:1px solid var(--line,#d9dee7);box-shadow:0 18px 40px rgba(4,10,22,.18);object-fit:contain}
#rContent .r-cta b,.r-cta b{color:#F2F4F7}