/* Ghoonghrat: The Curly Hair Baddies. Deep green, cream and gold from the campaign. */
body.gh{--g1:#122018;--g2:#1d3324;--cream:#f3e6c8;--gold:#e6c07b;--maroon:#7a1f35;--accent:#e6c07b;--bg:#122018;
  background:radial-gradient(120% 60% at 50% 0,#1d3324 0,#122018 60%) fixed,#122018;color:#d6d1bf}
body.gh .sky{display:none}
body.gh h1,body.gh h2,body.gh h3,body.gh strong,body.gh b{color:var(--cream)}
body.gh .nav2{background:rgba(18,32,24,.72);border-color:rgba(230,192,123,.2)}
body.gh .links a[aria-current="page"]{color:var(--gold)}
body.gh .foot{border-color:rgba(230,192,123,.15)}
@media (max-width:1080px){body.gh .navmenu{background:linear-gradient(180deg,#1a2e20,#122018)}}
.urdu{font-family:"Noto Nastaliq Urdu","Jameel Noori Nastaleeq",serif;font-weight:600;line-height:1.9}

.tix{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:54px;padding:0 28px;border-radius:999px;background:var(--gold);color:#122018;font-weight:700;font-size:1rem;box-shadow:0 10px 28px rgba(230,192,123,.22);transition:transform .25s,filter .25s,box-shadow .25s}
.tix:hover{transform:translateY(-2px);filter:brightness(1.05);box-shadow:0 14px 34px rgba(230,192,123,.32)}
.tix-o{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 24px;border-radius:999px;border:1.5px solid rgba(243,230,200,.4);color:var(--cream);font-weight:600;transition:background-color .2s}
.tix-o:hover{background:rgba(243,230,200,.08)}
.nav2 .tix{min-height:40px;padding:0 18px;font-size:.9rem;box-shadow:none}
@media (max-width:1080px){.nav2 .tix{display:flex;width:100%;min-height:48px;margin-top:10px}}

/* Hero */
.gh-hero{padding:clamp(2rem,5vw,3.5rem) 0 clamp(2rem,4vw,3rem);text-align:center}
.gh-kick{color:var(--gold);font-size:.8rem;font-weight:700;letter-spacing:.38em}
.gh-urdu{margin-top:.5rem;color:var(--gold);font-size:clamp(2.2rem,6vw,3.6rem)}
.gh-title{margin-top:-.35em;font-family:"Playfair Display",Georgia,serif;font-weight:600;font-size:clamp(3.4rem,11vw,8rem);line-height:1;letter-spacing:-.01em;color:var(--cream)}
.gh-sub{margin-top:.8rem;color:var(--gold);font-size:clamp(.8rem,1.6vw,1.05rem);font-weight:700;letter-spacing:.34em}
.gh-tag{margin-top:1rem;font-family:"Playfair Display",serif;font-style:italic;font-size:clamp(1.1rem,2vw,1.35rem);color:#cfc6ae}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin-top:1.6rem}
.chips span{padding:.45rem .9rem;border:1px solid rgba(230,192,123,.3);border-radius:999px;background:rgba(243,230,200,.04);color:var(--cream);font-size:.92rem}
.gh-hero .actions{justify-content:center;margin-top:1.6rem}
.count{display:flex;justify-content:center;gap:.6rem;margin-top:1.4rem}
.count div{min-width:4.2rem;padding:.55rem .4rem;border:1px solid rgba(230,192,123,.22);border-radius:14px;background:rgba(18,32,24,.6)}
.count b{display:block;color:var(--gold);font-size:1.6rem;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}
.count small{display:block;margin-top:.3rem;color:#a8a28e;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase}
.count-label{margin-top:.8rem;color:#a8a28e;font-size:.85rem}
.banner{margin-top:clamp(2rem,4vw,3rem);overflow:hidden;border-radius:22px;border:1px solid rgba(230,192,123,.25);box-shadow:0 30px 70px rgba(0,0,0,.35)}
.banner img{width:100%}

/* Who */
.who{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}
.gh-h2{font-family:"Playfair Display",Georgia,serif;font-weight:600;font-size:clamp(2rem,4.4vw,3.2rem);line-height:1.05}
.gh-h2 em{font-style:italic;color:var(--gold)}
.who .big{margin-top:1rem;color:var(--cream);font-size:clamp(1.15rem,2vw,1.4rem);font-weight:600;line-height:1.4}
.who p+p{margin-top:.6rem}

/* ID card maker */
.idc{overflow:hidden;border:2px solid #0f3d24;border-radius:22px;background:#dfeee2;color:#122018;box-shadow:0 24px 50px rgba(0,0,0,.3)}
.idc-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 1.2rem;background:#0f3d24;color:#fff}
.idc-top b{color:#fff;font-size:.95rem;letter-spacing:.14em}
.idc-top .urdu{color:#fff;font-size:1.05rem;line-height:1.6}
.idc-body{display:grid;grid-template-columns:7.5rem minmax(0,1fr);gap:1.1rem;padding:1.2rem}
.idc-photo{display:grid;place-items:center;aspect-ratio:4/5;border:2px solid #0f3d24;border-radius:10px;background:#fff}
.idc-photo svg{width:88%;height:auto}
.idc dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.4rem .9rem;align-content:start;font-size:.95rem}
.idc dt{color:#15703a;font-weight:700}
.idc dd{color:#122018;font-weight:700;word-break:break-word}
.idc .val{transition:color .3s}
.idc .val.flash{color:var(--maroon)}
.maker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem;margin-top:1rem}
.maker label{display:grid;gap:.3rem;color:#cfc6ae;font-size:.82rem;font-weight:600}
.maker input,.maker select{width:100%;min-height:44px;padding:0 .7rem;border:1px solid rgba(230,192,123,.3);border-radius:12px;background:rgba(243,230,200,.05);color:var(--cream);font:inherit;font-size:.95rem}
.maker select option{color:#122018}
.maker-note{margin-top:.7rem;color:#a8a28e;font-size:.88rem}

/* Dhaba menu */
.dhaba{max-width:46rem;margin-inline:auto;padding:clamp(1.5rem,4vw,2.75rem);border:10px solid #6e4424;border-radius:18px;background:#26302a;box-shadow:inset 0 0 60px rgba(0,0,0,.35),0 24px 50px rgba(0,0,0,.3);font-family:"Kalam","Segoe Print",cursive;color:#efe6d0}
.dhaba .small{color:#efe6d0;font-size:1.05rem}
.dhaba h2{font-family:"Kalam","Segoe Print",cursive;font-weight:700;font-size:clamp(2.2rem,6vw,3.6rem);line-height:1.05;color:#f3ecdc}
.dhaba .sub{color:#f2c46b;font-size:1.2rem}
.dhaba .u{display:inline-block;margin:1.6rem 0 .6rem;text-decoration:underline;text-underline-offset:.2em;font-size:1.15rem}
.dhaba ul{display:grid;gap:.55rem}
.dhaba li{display:flex;align-items:baseline;gap:.6rem;font-size:clamp(1.15rem,2.6vw,1.55rem)}
.dhaba li .dots{flex:1;border-bottom:2px dotted rgba(239,230,208,.45);transform-origin:left center}
.dhaba li b{color:#f2c46b;font-weight:700}
.dhaba .entry{margin-top:1.1rem;font-size:clamp(1.3rem,3vw,1.7rem)}
.dhaba .entry b{color:#f2c46b}
.motion .dhaba li{opacity:0;translate:-10px 0;transition:opacity .5s,translate .6s var(--ease);transition-delay:calc(var(--i,0) * 110ms)}
.motion .dhaba li .dots{scale:0 1;transition:scale .8s var(--ease);transition-delay:calc(var(--i,0) * 110ms + .15s)}
.motion .dhaba.in li{opacity:1;translate:0 0}
.motion .dhaba.in li .dots{scale:1 1}

/* House rule */
.rule{display:grid;justify-items:center;gap:.4rem;padding:clamp(2rem,5vw,3.5rem) 1.25rem;border:2px dotted rgba(246,196,79,.6);border-radius:28px;background:#2e3e58;text-align:center}
.eyes{display:flex;gap:clamp(2rem,8vw,5rem);margin-bottom:.6rem}
.eye{position:relative;width:clamp(5rem,14vw,7.5rem)}
.eye svg{width:100%;height:auto;overflow:visible}
.motion .eye .lid{transform-origin:50% 50%;transform-box:fill-box;animation:blink 5s infinite}
@keyframes blink{0%,92%,100%{transform:scaleY(0)}95%{transform:scaleY(1)}}
.rule .urdu{color:#f6c44f;font-size:clamp(2rem,5vw,3rem)}
.rule h2{margin-top:-.4rem;font-family:"Playfair Display",serif;font-weight:600;font-size:clamp(1.9rem,4.5vw,3rem)}
.rule p{color:#f3e6c8;font-size:1.1rem}
.rule small{color:#cdd3de;font-size:.95rem}

/* Campaign strip */
.posters{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(13rem,24vw,17rem);gap:1.1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:1.2rem max(var(--gutter),calc((100vw - 70rem) / 2)) 1.6rem;scroll-padding-inline:max(var(--gutter),calc((100vw - 70rem) / 2));scrollbar-width:thin;scrollbar-color:#6e4424 transparent}
.posters a{scroll-snap-align:start;display:block;overflow:hidden;border-radius:14px;box-shadow:0 16px 34px rgba(0,0,0,.35);transition:transform .45s var(--ease)}
.posters a:nth-child(odd){transform:rotate(-1.4deg)}
.posters a:nth-child(even){transform:rotate(1.2deg)}
.posters a:hover{transform:rotate(0) translateY(-6px) scale(1.02)}
.posters img{width:100%;aspect-ratio:4/5;object-fit:cover}
.posters a.sq img{aspect-ratio:4/5;object-position:50% 40%}

/* Details */
.gdet{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;overflow:hidden;border:1px solid rgba(230,192,123,.22);border-radius:22px;background:rgba(230,192,123,.22)}
.gdet div{padding:1.2rem 1.3rem;background:#16271c}
.gdet dt{color:var(--gold);font-size:.75rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.gdet dd{margin-top:.4rem;color:var(--cream);font-weight:600;line-height:1.35}
.gfinal{text-align:center;padding:clamp(2.5rem,6vw,4rem) 1rem}
.gfinal p{margin:1rem auto 1.6rem;max-width:32rem}

/* Sticky ticket bar on phones */
.gh-bar{display:none}
@media (max-width:700px){
  .gh-bar{position:fixed;left:10px;right:10px;bottom:10px;z-index:65;display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding:.55rem .55rem .55rem 1rem;border:1px solid rgba(230,192,123,.3);border-radius:999px;background:rgba(18,32,24,.92);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 14px 34px rgba(0,0,0,.45)}
  .gh-bar span{color:var(--cream);font-size:.88rem;line-height:1.2}
  .gh-bar span b{display:block;color:var(--gold);font-size:.95rem}
  .gh-bar .tix{min-height:44px;padding:0 18px;font-size:.92rem;box-shadow:none}
  body.gh .wa{bottom:86px}
  body.gh .foot{padding-bottom:70px}
}
@media (max-width:900px){
  .who{grid-template-columns:minmax(0,1fr)}
  .gdet{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:560px){
  .maker{grid-template-columns:minmax(0,1fr)}
  .idc-body{grid-template-columns:5.5rem minmax(0,1fr);gap:.9rem;padding:1rem}
  .idc dl{font-size:.88rem}
  .idc-top{padding:.8rem 1rem}
  .idc-top b{font-size:.8rem}
  .gdet{grid-template-columns:minmax(0,1fr)}
  .count div{min-width:3.7rem}
}
@media (max-width:560px){.idc-top b{font-size:.72rem;letter-spacing:.08em}.idc-top .urdu{font-size:.85rem;white-space:nowrap}}
