.easy-img-missing{background:linear-gradient(135deg,rgba(212,175,55,.16),rgba(11,10,9,.92));border:1px solid rgba(212,175,55,.18)}
body[data-easy-edit-image-controls="on"] img[data-img]{filter:blur(var(--easy-img-blur,0));transform:scale(var(--easy-img-scale,1));transform-origin:center;transition:filter .25s ease,transform .25s ease}



  /* Better default media handling */
  img, video, iframe, picture { max-width:100%; }
  img { height:auto; }
  iframe, video { border-radius:18px; }
  input, textarea, select, button { max-width:100%; }

  /* Text animation: top-of-page content is made visible instantly by JS before this class turns on. */
  [data-text-animate]{opacity:1; transform:none; filter:none; will-change:opacity, transform, filter;}
  html.jp-anim-ready [data-text-animate]:not(.jp-text-visible){opacity:0; transform:translateY(18px); filter:blur(3px);}
  html.jp-anim-ready [data-text-animate].jp-text-visible{opacity:1; transform:none; filter:none; transition:opacity .72s ease, transform .72s cubic-bezier(.2,.7,.2,1), filter .72s ease; transition-delay:var(--jp-anim-delay,0ms);}
  .btn, button, a[class*="btn"], .nav-cta{touch-action:manipulation;}

  /* iPad / tablet optimisation */
  @media (min-width:768px) and (max-width:1180px){
    .container,.wrap,.nav-in,nav .inner,.jp-nav-in{max-width:100%!important; padding-left:28px!important; padding-right:28px!important;}
    body{overflow-x:hidden;}
    section,.page-hero{scroll-margin-top:90px;}
    h1{font-size:clamp(44px,7vw,72px)!important; line-height:1.04!important;}
    h2{font-size:clamp(32px,4.8vw,52px)!important; line-height:1.08!important;}
    h3{font-size:clamp(21px,3vw,30px)!important;}
    p,.lead{font-size:clamp(15.5px,1.7vw,18px)!important;}
    .navlinks,.jp-nav-links{gap:14px!important; font-size:13px!important;}
    main .grid, main .cards, main .hero-grid, main .split, main .two-col, main .columns,
    main .contact-grid, main .book-grid, main .offer-grid, main .program-grid, main .testimonial-grid,
    main .pillar-grid, main .benefit-grid, main .problem-grid, main .who-grid, main .why-grid,
    main .for-grid, main .rel-grid, main .stats-grid, main .cards-grid, main .faq-grid{
      gap:22px!important;
    }
  }

  /* Phone optimisation */
  @media (max-width:767px){
    html,body{width:100%; overflow-x:hidden;}
    body{font-size:15px!important; line-height:1.62!important;}
    .container,.wrap,.nav-in,nav .inner,.jp-nav-in{max-width:100%!important; padding-left:18px!important; padding-right:18px!important;}
    nav .inner,.nav-in,.jp-nav-in{min-height:62px!important;}
    section,.page-hero,.hero{scroll-margin-top:80px;}
    .page-hero{padding-top:118px!important; padding-bottom:54px!important;}
    .hero{min-height:auto!important; padding-top:108px!important; padding-bottom:60px!important;}
    h1{font-size:clamp(32px,10.5vw,48px)!important; line-height:1.04!important; letter-spacing:-.04em!important;}
    h2{font-size:clamp(27px,8.8vw,39px)!important; line-height:1.08!important; letter-spacing:-.03em!important;}
    h3{font-size:clamp(20px,6vw,28px)!important; line-height:1.15!important;}
    p,.lead,li{font-size:15.5px!important; line-height:1.68!important;}
    .eyebrow{font-size:11px!important; letter-spacing:.16em!important;}
    .btn, a.btn, button.btn, .nav-cta, a[class*="btn"]{width:100%; justify-content:center; text-align:center; white-space:normal!important; padding-left:18px!important; padding-right:18px!important;}
    main .actions, main .cta-row, main .hero-actions, main .btns{display:flex!important; flex-direction:column!important; align-items:stretch!important; gap:12px!important; width:100%!important;}
    main .grid, main .cards, main .hero-grid, main .split, main .two-col, main .columns,
    main .contact-grid, main .book-grid, main .offer-grid, main .program-grid, main .testimonial-grid,
    main .pillar-grid, main .benefit-grid, main .problem-grid, main .who-grid, main .why-grid,
    main .for-grid, main .rel-grid, main .stats-grid, main .cards-grid, main .faq-grid,
    .ct-row,.picks,.nav-grid,.jp-dropdown-grid{grid-template-columns:1fr!important; gap:16px!important;}
    .card,.glass,.panel,.form-card,.faq,.feature,.pillar,.testimonial,.offer-card{border-radius:20px!important;}
    input,textarea,select{font-size:16px!important;}
    img[data-img]{max-height:none;}
    table{display:block; overflow-x:auto; white-space:nowrap;}
  }

  /* Small phone polish */
  @media (max-width:420px){
    .container,.wrap,.nav-in,nav .inner,.jp-nav-in{padding-left:15px!important; padding-right:15px!important;}
    h1{font-size:clamp(30px,11vw,42px)!important;}
    h2{font-size:clamp(25px,9vw,34px)!important;}
    .btn, a.btn, button.btn{font-size:14px!important;}
  }

  @media (prefers-reduced-motion:reduce){
    [data-text-animate], .reveal, .word{transition:none!important; animation:none!important; opacity:1!important; transform:none!important; filter:none!important;}
  }


/* ═══════════════════════════════════════════════════════════════
   SHARED SITE CHROME  —  variables, base, HEADER, NAV, FOOTER
   Ye sab pehle sirf home.css mein tha, isliye baaki pages pe
   header/footer bilkul unstyled dikh rahe the.
   Ab har page pe same rahega.
   ═══════════════════════════════════════════════════════════════ */

:root{
  --black:#0B0A09;--black2:#141210;--panel:#1A1714;
  --gold:#D4AF37;--gold-bright:#F0CE5A;--gold-deep:#9C7A1E;
  --bone:#F4ECDD;--muted:#B6AB97;--line:rgba(212,175,55,.22);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--black);color:var(--bone);font-family:'Poppins',sans-serif;line-height:1.7;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.05;
  background-image:radial-gradient(rgba(244,236,221,.5) .5px,transparent .5px);background-size:3px 3px}
::selection{background:var(--gold);color:var(--black)}
a{color:inherit;text-decoration:none}
.wrap{max-width:1120px;margin:0 auto;padding:0 32px}

/* entrance animations — SAFE: content hamesha visible rahega.
   Per-page CSS (home.css / about.css) apna fade-in khud handle karti hai. */
/* Homepage pe animation chalti rahegi (body.home).
   Baaki pages pe content hamesha visible — chhupega nahi. */
body:not(.home) .reveal{opacity:1 !important;transform:none !important;filter:none !important}
body:not(.home) .word{opacity:1 !important;transform:none !important}
.word{display:inline-block}

/* Safety net: agar JS 2 sec tak load na ho, sab kuch dikha do */
@keyframes jpForceIn{to{opacity:1;transform:none;filter:none}}
.reveal:not(.in){animation:jpForceIn .4s ease 2s forwards}
.scrawl{font-style:italic;font-weight:500;color:var(--gold)}

/* section headings */
.num{font-weight:600;letter-spacing:2.5px;text-transform:uppercase;font-size:13px;color:var(--gold-deep)}
.sec-title{font-weight:800;text-transform:uppercase;font-size:clamp(27px,4.6vw,50px);line-height:1.04;letter-spacing:-.5px;margin-top:12px}
.sec-title .gold{color:var(--gold)}

/* ── NAVBAR ── */
nav{position:fixed;top:0;left:0;right:0;z-index:9999;background:rgba(11,10,9,.82);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
nav .inner{max-width:1120px;margin:0 auto;padding:15px 32px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.logo{font-weight:800;text-transform:uppercase;font-size:17px;letter-spacing:.3px;white-space:nowrap}
.logo .g{color:var(--gold)}
.logo img{height:32px;display:block}
.navlinks{display:flex;gap:24px;font-weight:500;font-size:14.5px;align-items:center}
.navlinks a{color:var(--muted);transition:color .25s;white-space:nowrap;position:relative}
.navlinks a::after{content:"";position:absolute;left:0;bottom:-5px;width:0;height:2px;background:var(--gold);transition:width .25s}
.navlinks a:hover{color:var(--gold)}
.navlinks a:hover::after{width:100%}
.navlinks a.active{color:var(--gold)}
.navlinks a.active::after{width:100%}
.nav-cta{font-weight:600;font-size:13px;letter-spacing:1px;text-transform:uppercase;border:1px solid var(--gold);color:var(--gold);padding:8px 16px;transition:.25s;white-space:nowrap}
.nav-cta:hover{background:var(--gold);color:var(--black);box-shadow:0 0 22px rgba(212,175,55,.5)}

/* hamburger */
.hamburger{display:none;flex-direction:column;justify-content:center;gap:6px;width:38px;height:38px;background:none;border:0;cursor:pointer;padding:0}
.hamburger span{display:block;width:26px;height:2px;background:var(--gold);transition:.3s;margin:0 auto}
.hamburger.active span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.hamburger.active span:nth-child(2){opacity:0}
.hamburger.active span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* mobile menu */
.mobile-menu{position:fixed;top:0;right:0;height:100dvh;width:min(82vw,330px);background:var(--black2);border-left:1px solid var(--line);
  transform:translateX(105%);transition:transform .38s cubic-bezier(.4,0,.1,1);z-index:280;display:flex;flex-direction:column;padding:96px 34px 40px;gap:4px}
.mobile-menu.open{transform:none}
.mobile-menu a{font-weight:600;font-size:21px;color:var(--bone);padding:14px 0;border-bottom:1px solid rgba(212,175,55,.12);transition:.2s}
.mobile-menu a:hover{color:var(--gold);padding-left:8px}
.mobile-menu .mcta{margin-top:24px;text-align:center;background:var(--gold);color:var(--black);border:0;border-radius:2px;font-weight:700;text-transform:uppercase;letter-spacing:1px;font-size:15px;padding:15px}
.menu-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.6);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:.3s;z-index:260}
.menu-backdrop.show{opacity:1;visibility:visible}

@media(max-width:980px){
  .navlinks{display:none}
  .hamburger{display:flex}
  .nav-cta{display:none}
}

/* ── NAV DROPDOWN ── */
.navlinks .nav-item{position:relative;display:flex;align-items:center}
.navlinks .nav-drop-link{color:var(--muted);transition:color .25s;white-space:nowrap;position:relative;padding-right:14px}
.navlinks .nav-drop-link::before{content:"";position:absolute;right:0;top:50%;width:6px;height:6px;border-right:1.7px solid var(--gold);border-bottom:1.7px solid var(--gold);transform:translateY(-65%) rotate(45deg);opacity:.9;transition:transform .25s,opacity .25s}
.navlinks .nav-drop-link::after{content:"";position:absolute;left:0;bottom:-5px;width:0;height:2px;background:var(--gold);transition:width .25s}
.navlinks .nav-item:hover .nav-drop-link{color:var(--gold)}
.navlinks .nav-item:hover .nav-drop-link::after{width:100%}
.navlinks .nav-item:hover .nav-drop-link::before,
.nav-dropdown.open .nav-drop-link::before{opacity:1;transform:translateY(-35%) rotate(225deg)}
.nav-dropdown-menu{position:absolute;top:calc(100% + 16px);left:50%;transform:translateX(-50%) translateY(8px);min-width:290px;background:#0B0A09;border:1px solid rgba(212,175,55,.38);box-shadow:0 22px 60px rgba(0,0,0,.72);padding:10px;border-radius:10px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .22s ease,transform .22s ease,visibility .22s ease;z-index:10050}
.nav-dropdown-menu::before{content:"";position:absolute;left:0;right:0;top:-18px;height:18px}
.nav-dropdown-menu a{display:block;color:var(--bone);font-size:14.5px;font-weight:500;line-height:1.35;padding:12px 14px;border-radius:7px;white-space:normal;background:transparent}
.nav-dropdown-menu a::after{display:none}
.nav-dropdown-menu a:hover{color:var(--gold);background:rgba(212,175,55,.08)}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu,
.nav-dropdown.open .nav-dropdown-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
nav, nav .inner, .navlinks, .nav-item{overflow:visible}
.nav-dropdown{position:relative;z-index:10060}
.nav-dropdown-menu{z-index:10070;filter:none;backdrop-filter:none}
@media(max-width:980px){.nav-dropdown-menu{display:none}}

/* mobile dropdown */
.mobile-dropdown{border-bottom:1px solid rgba(212,175,55,.12)}
.mobile-dropdown-toggle{width:100%;background:none;border:0;color:var(--bone);font-family:'Poppins',sans-serif;font-weight:600;font-size:21px;text-align:left;padding:14px 0;display:flex;align-items:center;justify-content:space-between;cursor:pointer;transition:.2s}
.mobile-dropdown-toggle:hover{color:var(--gold);padding-left:8px}
.mobile-dropdown-toggle span{color:var(--gold);font-size:16px;transition:transform .25s}
.mobile-dropdown.open .mobile-dropdown-toggle span{transform:rotate(180deg)}
.mobile-submenu{display:none;padding:0 0 10px 14px}
.mobile-dropdown.open .mobile-submenu{display:block}
.mobile-submenu a{font-size:16px;padding:10px 0;color:var(--muted);border-bottom:1px solid rgba(212,175,55,.08)}
.mobile-submenu a:hover{color:var(--gold);padding-left:8px}

/* language toggle */
.langtog{display:inline-flex;border:1px solid var(--gold);border-radius:30px;overflow:hidden;cursor:pointer;font-weight:700;font-size:12px}
.langtog span{padding:6px 12px;transition:.2s;color:var(--gold)}
.langtog span.active{background:var(--gold);color:var(--black)}

/* ── FOOTER ── */
footer{background:var(--black);padding:60px 0 40px;border-top:1px solid var(--line)}
.foot-grid{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:24px}
.foot-logo{font-weight:800;text-transform:uppercase;font-size:22px}
.foot-logo .g{color:var(--gold)}
.foot-logo img{height:34px;display:block}
.socials{display:flex;gap:24px;font-weight:600;letter-spacing:1px;text-transform:uppercase;font-size:13px}
.socials a{color:var(--muted);transition:.25s}
.socials a:hover{color:var(--gold);text-shadow:0 0 14px rgba(212,175,55,.5)}
.copy{text-align:center;color:var(--gold-deep);font-size:12.5px;margin-top:14px;letter-spacing:.4px}
.quote{text-align:center;padding:40px 20px}

/* responsive */
@media(max-width:980px){ .wrap{padding:0 26px} section{padding:84px 0} }
@media(max-width:600px){ .wrap{padding:0 20px} section{padding:68px 0} }