:root{--navy:#0c1a47;--blue:#1d5fb8;--pink:#ff2e88;--gold:#ffb703;--green:#18b866;--teal:#10bfd0;--orange:#ff5c1f;--paper:#f4f7ff;--ink:#111a33;--muted:#4d5878;--white:#fff;--display:"Bungee","Impact","Arial Black",sans-serif;--body:"Fredoka","Segoe UI","Trebuchet MS",sans-serif;--urdu:"Noto Nastaliq Urdu","Jameel Noori Nastaleeq","Urdu Typesetting","Noto Naskh Arabic",serif;color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.65;overflow-x:hidden}
a{color:var(--blue)}img{max-width:100%;display:block}.wrap{max-width:1100px;margin:0 auto;padding-inline:16px}
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.12;margin:0;text-wrap:balance}h1{font-size:clamp(2rem,5.4vw,3.4rem)}h2{font-size:clamp(1.45rem,3.4vw,2.1rem);margin-bottom:16px}h3{font-size:1.08rem}p{margin:0 0 14px}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px}
.urdu{font-family:var(--urdu);direction:rtl;line-height:2.15}
.nav{position:sticky;top:0;z-index:50;background:var(--navy);color:#fff;border-bottom:4px solid transparent;border-image:repeating-linear-gradient(90deg,var(--pink) 0 24px,var(--gold) 24px 48px,var(--green) 48px 72px,var(--teal) 72px 96px,var(--orange) 96px 120px) 4;direction:ltr}
.nav .wrap{max-width:1160px;display:flex;align-items:center;gap:20px;padding-block:12px;position:static}.nav a{color:inherit}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}.brand img{width:40px;height:auto}.brand .mk{background:#fff;border-radius:50%;padding:4px;display:grid;place-items:center}.brand span.tx{font-family:var(--display);font-size:1.35rem;letter-spacing:.02em}.brand b{color:var(--gold);font-weight:400}
.nav ul{list-style:none;display:flex;gap:6px;margin:0 0 0 auto;padding:0;flex-wrap:wrap}.nav ul a{text-decoration:none;padding:6px 12px;border-radius:999px;font-weight:500;font-size:.95rem}.nav ul a:hover{background:rgba(255,255,255,.12)}.nav .cta-mini{background:var(--gold);color:var(--navy)}.nav .cta-mini:hover{background:#ffc93a}
.menu-btn{display:none;margin-left:auto;background:none;border:2px solid rgba(255,255,255,.4);color:#fff;border-radius:10px;padding:6px 12px;font:600 .95rem var(--body);cursor:pointer}
@media(max-width:820px){.menu-btn{display:block}.nav ul{display:none;position:absolute;left:0;right:0;top:100%;background:var(--navy);flex-direction:column;padding:12px 16px 18px;gap:4px}.nav.open ul{display:flex}}
.crumbs{font-size:.92rem;padding-top:18px;color:var(--muted)}.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0}.crumbs li+li::before{content:"›";margin-right:6px}
.hero{background:var(--navy);color:#fff;padding-block:42px}.hero .crumbs,.hero .crumbs a{color:#c6cff0}.hero p{color:#d7def5;max-width:62ch}.hero .urdu{color:var(--gold);font-size:1.3rem;max-width:none}
.head{display:grid;grid-template-columns:150px 1fr;gap:28px;align-items:center;margin-top:18px}.head img{width:150px;height:150px;object-fit:cover;border-radius:30px;border:4px solid var(--gold)}.head h1{margin-bottom:12px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 18px}.chip{font-size:.78rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;padding:3px 10px;border-radius:99px;border:2px solid currentColor}
.btn{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-weight:600;padding:12px 22px;border-radius:14px;background:var(--gold);color:var(--ink);border:3px solid #000;box-shadow:5px 5px 0 #000;transition:transform .15s}.btn:hover{transform:translate(-2px,-2px)}
main section{padding-block:44px}.band{background:#fff}
.shots{display:flex;gap:14px;overflow-x:auto;padding:4px 2px 14px;scroll-snap-type:x proximity}.shots img{height:360px;width:auto;max-width:82vw;border-radius:16px;border:3px solid var(--ink);flex:none;scroll-snap-align:start;background:#dfe6f7}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:32px}.prose{max-width:72ch}.prose ul,.prose ol{padding-left:22px;margin:0}.prose li{margin:5px 0}
.feats{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.feat{background:#fff;border:3px solid var(--ink);border-radius:18px;padding:18px 20px}.feat h3{margin-bottom:8px}.feat p{margin:0;color:var(--muted)}.band .feat{background:var(--paper)}
details{background:#fff;border:3px solid var(--ink);border-radius:14px;padding:12px 16px;margin-bottom:10px}summary{font-weight:600;cursor:pointer}details p{margin:8px 0 0;color:var(--muted)}
.urbox{background:var(--navy);color:#fff;border-radius:20px;padding:20px 24px}.urbox h2{font-family:var(--urdu);font-weight:700;line-height:2;color:var(--gold);margin:0}.urbox p{font-family:var(--urdu);direction:rtl;font-size:1.2rem;line-height:2.25;margin:0;text-align:right}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px}.card{display:flex;flex-direction:column;gap:8px;background:#fff;border:3px solid var(--ink);border-radius:20px;padding:16px;text-decoration:none;color:var(--ink);box-shadow:5px 5px 0 var(--ink);transition:transform .15s}.card:hover{transform:translate(-3px,-3px)}.card img{width:88px;height:88px;border-radius:20px;object-fit:cover}.card span{color:var(--muted);font-size:.95rem;line-height:1.45}
footer{background:var(--navy);color:#c6cff0;padding-block:36px 84px;margin-top:24px}footer .wrap{display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;align-items:center}footer nav{display:flex;flex-wrap:wrap;gap:14px}footer a{color:#fff;text-decoration:none}footer a:hover{color:var(--gold)}
.totop{position:fixed;right:18px;bottom:18px;z-index:70;width:54px;height:54px;border-radius:16px;border:3px solid var(--ink);background:var(--gold);color:var(--ink);box-shadow:4px 4px 0 var(--ink);display:grid;place-items:center;cursor:pointer;opacity:0;transform:translateY(20px);pointer-events:none;transition:opacity .25s,transform .25s}.totop.show{opacity:1;transform:none;pointer-events:auto}
html[lang=ur] body{direction:rtl}html[lang=ur] .card b{font-family:var(--body)}html[lang=ur] .prose{font-family:var(--urdu);line-height:2.3;font-size:1.15rem}
@media(max-width:760px){.cols,.feats{grid-template-columns:1fr}.head{grid-template-columns:96px 1fr;gap:16px}.head img{width:96px;height:96px;border-radius:22px}.shots img{height:300px}.btn{padding:11px 16px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
