/* ============ Website styles (Admin → Colors & Style) ============
   Classic = the original design (style.css, no overrides here).
   Modern  = clean, minimal online-store look.
   Bold    = strong, premium look with a full-colour hero.
   All styles use the colour variables, so any colour theme works with any style. */

/* ---------------- MODERN ---------------- */
.d-modern{--serif:"Poppins",var(--sans);--r:12px;--r-sm:10px;
  --shadow:0 1px 2px rgba(var(--head-rgb),.04),0 4px 14px -6px rgba(var(--head-rgb),.12);
  --shadow-lg:0 14px 34px -18px rgba(var(--head-rgb),.28)}
.d-modern h1,.d-modern h2,.d-modern h3,.d-modern h4{font-weight:700;letter-spacing:-.025em;line-height:1.12}
.d-modern h2 em,.d-modern h1 em{font-style:normal;color:var(--red)}
.d-modern .btn{border-radius:10px;letter-spacing:.01em}
.d-modern .topbar{background:var(--head)}
.d-modern .site-header{background:rgba(255,255,255,.9)}
.d-modern .brand b{font-weight:700;letter-spacing:-.02em}
.d-modern .menu a{border-radius:8px}
.d-modern .lang-switch,.d-modern .lang-switch a{border-radius:8px}
.d-modern .hero{background:var(--paper);border-bottom:1px solid var(--line)}
.d-modern .grain{display:none}
.d-modern .hero h1{font-size:clamp(2.3rem,1.2rem + 3.4vw,3.8rem)}
.d-modern .eyebrow{border-radius:8px;background:var(--sand);border-color:transparent}
.d-modern .halo{border-radius:36px;inset:8% 6% 4%;background:linear-gradient(160deg,var(--sand),var(--sand-2));box-shadow:none}
.d-modern .hero-pack{filter:drop-shadow(0 22px 22px rgba(var(--head-rgb),.22))}
.d-modern .hero-chip{border-radius:10px;border:1px solid var(--line)}
.d-modern .hero-stats b{font-weight:700}
.d-modern .marquee{background:var(--sand);color:var(--head);border-block:1px solid var(--line)}
.d-modern .marquee span{font-family:var(--sans);font-style:normal;font-weight:700;font-size:1rem;text-transform:uppercase;letter-spacing:.08em}
.d-modern .marquee svg{color:var(--red)}
.d-modern .kicker{color:var(--red)}
.d-modern .pcard,.d-modern .pkg,.d-modern .card,.d-modern .review,.d-modern .gallery-main,.d-modern .contact-band{border-radius:16px}
.d-modern .pcard{box-shadow:none}
.d-modern .pcard:hover,.d-modern .pkg:hover{box-shadow:var(--shadow-lg)}
.d-modern .pcard-media{background:var(--sand)}
.d-modern .badge,.d-modern .pkg-label{border-radius:6px}
.d-modern .thumb{border-radius:10px}
/* product section: light instead of full colour */
.d-modern .detail-red{background:var(--cream);color:var(--ink)}
.d-modern .detail-red::before{display:none}
.d-modern .detail-red h2,.d-modern .detail-red h3{color:var(--head)}
.d-modern .detail-red .kicker{color:var(--red)}
.d-modern .detail-red .btn-light{background:var(--red);color:#fff}
.d-modern .detail-red .btn-line{color:var(--red)}
.d-modern .detail-red .btn-line:hover{background:var(--red);color:#fff;border-color:var(--red)}
.d-modern .detail-red .price{color:var(--red)}
.d-modern .detail-red .price small{color:var(--muted)}
.d-modern .detail-red .benefits li,.d-modern .detail-red .panel{background:var(--paper);border-color:var(--line)}
.d-modern .detail-red .benefits .ico,.d-modern .detail-red .steps span{background:var(--red);color:#fff}
.d-modern .detail-red .panel h3 svg{color:var(--red)}
.d-modern .detail-red .chips li{background:var(--sand);border-color:var(--line)}
.d-modern .detail-red .steps li+li{border-color:var(--line)}
.d-modern .detail-alt{background:var(--paper)}
.d-modern .benefits .ico{border-radius:10px}
.d-modern .review blockquote{font-family:var(--sans);font-size:1.02rem;font-weight:500}
.d-modern .qa summary{font-family:var(--sans);font-weight:700;font-size:1.08rem}
.d-modern legend{font-family:var(--sans)}
.d-modern .footer{background:var(--head)}
.d-modern .contact-band{border:1px solid var(--line)}

/* ---------------- BOLD ---------------- */
.d-bold{--serif:"Archivo",var(--sans);--r:6px;--r-sm:6px}
.d-bold h1,.d-bold h2,.d-bold h3,.d-bold h4{font-weight:800;letter-spacing:-.02em;line-height:1.05}
.d-bold h2{text-transform:uppercase;letter-spacing:-.01em}
.d-bold h2 em{font-style:normal;color:var(--gold-2)}
.d-bold .btn{border-radius:6px;text-transform:uppercase;letter-spacing:.06em;font-size:.86rem;font-weight:800}
.d-bold .btn-lg{font-size:.92rem}
.d-bold .menu a,.d-bold .lang-switch,.d-bold .lang-switch a{border-radius:6px}
.d-bold .topbar{background:var(--head);letter-spacing:.08em;text-transform:uppercase;font-size:.76rem;font-weight:700}
.d-bold .brand b{font-weight:800;text-transform:uppercase;letter-spacing:.02em}
/* full-colour hero */
.d-bold .hero{background:linear-gradient(135deg,var(--red-3),var(--red) 50%,var(--red-deep));color:#fff}
.d-bold .grain{opacity:.35;background-image:radial-gradient(rgba(255,255,255,.12) 1px,transparent 1.2px);-webkit-mask-image:none;mask-image:none}
.d-bold .hero h1{color:#fff;font-size:clamp(2.2rem,1.1rem + 3.3vw,3.7rem);text-transform:uppercase;letter-spacing:-.02em}
.d-bold .hero .lead{color:rgba(255,255,255,.86)}
.d-bold .eyebrow{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.25);color:#fff;border-radius:6px}
.d-bold .hero .btn-primary{background:#fff;color:var(--red);box-shadow:0 14px 30px -14px rgba(0,0,0,.45)}
.d-bold .hero .btn-primary:hover{background:var(--cream)}
.d-bold .hero-stats b{color:var(--on-red-accent);font-weight:800}
.d-bold .hero-stats li>span{color:rgba(255,255,255,.8)}
.d-bold .halo{background:radial-gradient(circle at 40% 35%,var(--on-red-accent),var(--gold) 60%,var(--gold-2));box-shadow:0 0 0 18px rgba(255,255,255,.07),0 0 0 36px rgba(255,255,255,.04)}
.d-bold .hero-chip{border-radius:6px;font-weight:800}
.d-bold .marquee{background:var(--head)}
.d-bold .marquee span{font-family:var(--serif);font-style:normal;font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:1.05rem}
.d-bold .kicker{color:var(--red);letter-spacing:.22em}
.d-bold .pcard,.d-bold .pkg,.d-bold .card,.d-bold .review,.d-bold .gallery-main,.d-bold .contact-band,.d-bold .panel,.d-bold .score,.d-bold .thumb,.d-bold .pick-group{border-radius:6px}
.d-bold .pcard{border-width:2px;box-shadow:8px 8px 0 rgba(var(--head-rgb),.08)}
.d-bold .pcard:hover{box-shadow:12px 12px 0 rgba(var(--red-rgb),.18)}
.d-bold .pcard-body h3{text-transform:uppercase}
.d-bold .badge,.d-bold .pkg-label{border-radius:4px}
.d-bold .pkg{border-width:2px;border-top:6px solid var(--line)}
.d-bold .pkg.hot{border-top-color:var(--red)}
.d-bold .pkg:hover{box-shadow:10px 10px 0 rgba(var(--red-rgb),.15)}
.d-bold .pkg-price{font-weight:800}
.d-bold .benefits li{border-radius:6px}
.d-bold .benefits .ico{border-radius:6px}
.d-bold .review{border-inline-start:5px solid var(--red)}
.d-bold .review blockquote{font-family:var(--sans);font-weight:600;font-size:1.02rem}
.d-bold .qa summary{font-family:var(--serif);font-weight:800;text-transform:uppercase;font-size:1.02rem;letter-spacing:.01em}
.d-bold .packages{background:var(--sand)}
.d-bold .footer{background:var(--head)}
.d-bold .contact-band{background:var(--gold);box-shadow:10px 10px 0 rgba(0,0,0,.18)}
.d-bold .contact-band h2{color:var(--head);text-transform:uppercase}
.d-bold .contact-band p{color:var(--head);opacity:.8}

/* Urdu keeps its own Nastaliq font in every style */
.lang-ur.d-modern h1,.lang-ur.d-modern h2,.lang-ur.d-modern h3,.lang-ur.d-modern h4,
.lang-ur.d-bold h1,.lang-ur.d-bold h2,.lang-ur.d-bold h3,.lang-ur.d-bold h4,
.lang-ur.d-bold .btn,.lang-ur.d-bold .qa summary,.lang-ur.d-modern .qa summary{font-family:var(--urdu);text-transform:none;letter-spacing:0;line-height:1.9}
.lang-ur.d-bold .marquee span,.lang-ur.d-modern .marquee span{font-family:var(--urdu);text-transform:none;letter-spacing:0}
