/* =====================================================================
   ePROTECT360 — Global Presence section                (global-presence.css)

   PART 1  Scoped shell: the few site-wide rules the original section relied on
           (body font, box-sizing reset, section/.wrap/.ctr/.tag/h2/p, button
           reset, focus ring), re-written under .global-presence-section so the
           component looks identical on ANY page, with or without your main CSS.
   PART 2  The homepage's <style id="gp-map"> block, copied verbatim.
           Every class there is already prefixed "gp-", which is its namespace.
           (.gp-pop and .gp-tip are appended to <body> by the script, so they
           cannot be nested under the section and are namespaced by prefix.)

   THEMING   Only the font is exposed. To use your site font instead of Montserrat:
               :root{ --gp-font: "Inter", system-ui, sans-serif; }
   REQUIRES  Montserrat (Google Fonts) loaded by the page — see global-presence.html.
   ===================================================================== */

/* ---------- PART 1 · scoped shell ------------------------------------ */

/* Base typography. Original: body{font:400 16px/1.6 Montserrat,...;color:#0a0f2a}. */
.global-presence-section,
.gp-card{
  font:400 16px/1.6 var(--gp-font,Montserrat,system-ui,-apple-system,"Segoe UI",sans-serif);
  color:#0a0f2a;
}
/* The popup + tooltip are appended to <body> and use font-family:inherit, so give them the same face. */
body > .gp-pop{font-family:var(--gp-font,Montserrat,system-ui,-apple-system,"Segoe UI",sans-serif);font-size:16px;line-height:1.6;font-weight:400}
body > .gp-tip{font-family:var(--gp-font,Montserrat,system-ui,-apple-system,"Segoe UI",sans-serif)}

/* Original: *,*:before,*:after{box-sizing:inherit} on a border-box :root. */
.global-presence-section,.global-presence-section *,.global-presence-section ::before,.global-presence-section ::after,
.gp-card,.gp-card::before,.gp-card *,.gp-card ::before,.gp-card ::after,
body > .gp-pop,body > .gp-pop::before,body > .gp-pop *,body > .gp-tip,body > .gp-tip *{box-sizing:border-box}

/* Original: :focus-visible{outline:3px solid var(--ora);outline-offset:2px}.  :where() keeps specificity at
   zero so .gp-c{outline:none} below still wins exactly as it did on the homepage. */
:where(.global-presence-section,body > .gp-pop) :focus-visible{outline:3px solid #FF6702;outline-offset:2px}

/* Original: button{font:inherit;cursor:pointer} — applies to the popup's close button (.gp-x).
   Declared BEFORE the verbatim .gp-x rule so that rule still sets its own font-size/line-height. */
.gp-x{font:inherit;cursor:pointer}

/* Section shell. Original selectors in comments. */
.global-presence-section{
  padding:110px 0;                                   /* section{padding:110px 0} */
  scroll-margin-top:calc(var(--hh,0px) + 16px);      /* :where([id]){scroll-margin-top:calc(var(--hh) + 16px)} — clears a sticky header if the host page defines --hh */
}
.global-presence-section .gp-wrap{max-width:1240px;margin:0 auto;padding:0 28px}                 /* .wrap */
.global-presence-section .gp-ctr{text-align:center;max-width:680px;margin:0 auto 44px}           /* .ctr  */
.global-presence-section .gp-tag{                                                                /* .tag  (final cascaded values) */
  display:inline-block;padding:6px 14px;border-radius:999px;
  background:#eaf3ff;color:#3C4893;border:1px solid #dfe6f5;font-weight:600;font-size:12px;
}
.global-presence-section .gp-tag::before{                                                        /* .tag:before — glowing dot */
  content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#369FFB;
  margin-right:8px;vertical-align:middle;box-shadow:0 0 8px rgba(54,159,251,.7);
}
.global-presence-section .gp-ctr h2{                                                             /* h2 + #global h2 */
  font-size:clamp(32px,5vw,52px);line-height:1.08;letter-spacing:-.03em;font-weight:600;
  margin:16px 0 14px;color:#3C4893;
}
.global-presence-section .gp-ctr p{color:#5f6a8d;margin:0}                                        /* .ctr p */

@media(min-width:1025px){   /* fluid desktop container (homepage "responsive-width" block) */
  .global-presence-section .gp-wrap{max-width:1760px;padding-left:clamp(28px,4vw,80px);padding-right:clamp(28px,4vw,80px)}
}
@media(max-width:640px){
  .global-presence-section{padding:72px 0}
  .global-presence-section .gp-wrap{padding:0 18px}
}

/* ---------- PART 2 · homepage <style id="gp-map"> — verbatim --------- */
/* ===== Global Presence interactive map (homepage #global) ===== */
.gp-card{--mk:1;position:relative;margin:0;border-radius:26px;overflow:hidden;background:radial-gradient(120% 95% at 50% 0%,#12205a 0%,#070c26 62%,#050817 100%);border:1px solid rgba(54,159,251,.38);box-shadow:0 44px 90px -44px rgba(60,72,147,.75),0 0 60px -30px rgba(54,159,251,.5);opacity:0;transform:translateY(20px);transition:opacity .9s ease,transform .9s ease}
.gp-card.in{opacity:1;transform:none}
.gp-card:before{content:"";position:absolute;left:0;right:0;top:0;height:3px;z-index:2;background:linear-gradient(90deg,#3C4893,#369FFB)}
.gp-stage{position:relative;padding:26px 22px 8px}
.gp-sc{position:relative}
.gp-svg{display:block;width:100%;height:auto;overflow:visible;-webkit-tap-highlight-color:transparent}
.gp-grat path{stroke:#369FFB;stroke-opacity:.14;stroke-width:.5;stroke-dasharray:2 4}
.gp-land{fill:url(#gpP);stroke:#3d7fe0;stroke-width:.8;stroke-linejoin:round;transition:fill .3s,stroke .3s}
.gp-muted .gp-land{fill:url(#gpPm);stroke:#1f3a78}
.gp-c{cursor:pointer;outline:none;transition:opacity .3s}
.gp-c:hover .gp-land,.gp-c.on .gp-land{fill:url(#gpPo);stroke:#9cc7ff;stroke-width:1.1}
.gp-c:focus-visible .gp-land{stroke:#FF6702;stroke-width:1.8}
.gp-svg.has-on .gp-c:not(.on):not(.gp-muted){opacity:.62}
.gp-frame{fill:rgba(54,159,251,.07);stroke:#7fb2ff;stroke-opacity:.6;stroke-width:.9;stroke-dasharray:3 3;pointer-events:none}
.gp-arcs{pointer-events:none}
.gp-ln{stroke-width:calc(.8px*var(--mk));stroke-opacity:.5;stroke-dasharray:2 4;animation:gpDash 18s linear infinite}
.gp-tr{stroke-width:calc(1.6px*var(--mk));stroke-linecap:round;stroke-dasharray:7 93;stroke-dashoffset:7;opacity:.95;animation:gpTr 8s linear infinite}
.gp-tr.gp-w{stroke-width:calc(4.6px*var(--mk));opacity:.2}
@keyframes gpDash{to{stroke-dashoffset:-60}}
@keyframes gpTr{from{stroke-dashoffset:7}to{stroke-dashoffset:-100}}
.gp-m{cursor:pointer}
.gp-s{transform:scale(var(--mk));transition:transform .3s ease}
.gp-m.on .gp-s{transform:scale(calc(var(--mk)*1.3))}
.gp-pin{fill:#369FFB;stroke:#fff;stroke-width:.9;stroke-linejoin:round;filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.55))}
.gp-pin.o{fill:#FF6702}
.gp-pc{fill:#fff}
.gp-pulse{transform-box:fill-box;transform-origin:center;opacity:0;animation:gpPulse 3.8s ease-out infinite}
.gp-gl{transform-box:fill-box;transform-origin:center;opacity:0;animation:gpGl 10s ease-in-out infinite}
@keyframes gpPulse{0%{transform:scale(1);opacity:.55}70%,100%{transform:scale(3.4);opacity:0}}
@keyframes gpGl{0%,58%,100%{opacity:0;transform:scale(.6)}28%{opacity:.95;transform:scale(1.15)}}
.gp-lb{font-family:inherit;font-weight:700;font-size:8px;fill:#ffb27d;paint-order:stroke;stroke:#050817;stroke-width:2.6px;stroke-linejoin:round;pointer-events:none}
/* India zoom inset */
.gp-inset{position:absolute;left:34px;bottom:22px;width:clamp(180px,19%,232px);background:rgba(7,12,38,.92);border:1px solid rgba(54,159,251,.35);border-radius:14px;padding:8px;box-shadow:0 18px 40px -20px rgba(0,0,0,.7);transition:border-color .3s,box-shadow .3s;cursor:pointer}
.gp-inset.on{border-color:#9cc7ff}
.gp-it{display:flex;justify-content:space-between;align-items:baseline;gap:6px;padding:0 3px 6px}
.gp-it b{font-size:12px;color:#fff;font-weight:800}
.gp-it span{font-size:10.5px;color:#9fb0d8;font-weight:600}
.gp-isvg{display:block;width:100%;height:auto}
.gp-isvg .gp-s,.gp-isvg .gp-m.on .gp-s{transform:scale(1)}
.gp-isvg .gp-m:hover .gp-s{transform:scale(1.25)}
.gp-isvg .gp-lb{font-size:9px}
.gp-inset.on .gp-il{fill:url(#gpPo);stroke:#9cc7ff}
/* legend */
.gp-leg{display:flex;flex-wrap:wrap;align-items:center;gap:10px 24px;padding:14px 26px 18px;border-top:1px solid rgba(54,159,251,.25);background:rgba(5,8,23,.7);font-size:13px;font-weight:600;color:#e8eefc}
.gp-li{display:inline-flex;align-items:center;gap:8px}
.gp-li b{display:inline-block;min-width:22px;padding:1px 7px;border-radius:999px;background:rgba(54,159,251,.18);color:#cfe6fe;font-size:11.5px;text-align:center}
.gp-ld{display:inline-block;flex:none}
.gp-ld.b,.gp-ld.o{width:13px;height:13px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);margin:0 2px 3px;background:#369FFB;box-shadow:0 0 0 2px rgba(54,159,251,.25)}
.gp-ld.o{background:#FF6702;box-shadow:0 0 0 2px rgba(255,103,2,.28)}
.gp-ld.s{width:18px;height:11px;border-radius:3px;background:#2a3786;border:1.5px solid #9cc7ff}
.gp-hint{margin-left:auto;color:#9fb0d8;font-weight:500;font-size:12.5px}
.gp-hint .gp-sw{display:none}
/* motion control */
.gp-calm .gp-tr,.gp-calm .gp-ln,.gp-calm .gp-pulse,.gp-calm .gp-gl{animation-play-state:paused}
.gp-calm .gp-tr{opacity:.4}
.gp-off .gp-tr,.gp-off .gp-ln,.gp-off .gp-pulse,.gp-off .gp-gl{animation-play-state:paused}
/* popup + tooltip (appended to <body>) */
.gp-pop{position:fixed;left:0;top:0;z-index:1000;width:340px;max-width:calc(100vw - 24px);background:#0b1230;border:1px solid rgba(54,159,251,.4);border-radius:18px;box-shadow:0 30px 70px -20px rgba(0,0,0,.75),0 0 40px -22px rgba(54,159,251,.6);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(6px) scale(.98);transition:opacity .22s ease,transform .22s ease,visibility 0s linear .22s;overflow:hidden;font-family:inherit;color:#e8eefc}
.gp-pop.show{opacity:1;visibility:visible;pointer-events:auto;transform:none;transition-delay:0s}
.gp-pop:before{content:"";display:block;height:3px;background:linear-gradient(90deg,#3C4893,#369FFB)}
.gp-ph{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:14px 16px 10px;border-bottom:1px solid rgba(54,159,251,.25)}
.gp-ph b{display:block;font-size:17px;line-height:1.25;font-weight:800;color:#fff}
.gp-ph span{display:block;font-size:12px;font-weight:600;color:#9fb0d8;margin-top:2px}
.gp-x{flex:none;width:30px;height:30px;border-radius:50%;border:1px solid rgba(54,159,251,.4);background:transparent;color:#cfe6fe;font-size:20px;line-height:1;padding:0;display:inline-flex;align-items:center;justify-content:center}
.gp-x:hover{background:rgba(54,159,251,.18)}
.gp-pb{max-height:min(380px,calc(100vh - 150px));overflow:auto;overscroll-behavior:contain;padding:4px 16px 16px;scrollbar-width:thin}
.gp-sec{margin-top:12px;padding:10px 12px 12px;border-radius:12px;background:rgba(54,159,251,.08);border:1px solid rgba(54,159,251,.28)}
.gp-sec.o{background:rgba(255,103,2,.08);border-color:rgba(255,103,2,.4)}
.gp-sec p{margin:8px 0 0;font-size:12.5px;color:#9fb0d8}
.gp-sh{display:flex;align-items:center;gap:8px}
.gp-sh strong{font-size:13.5px;font-weight:800}
.gp-sh em{margin-left:auto;font-style:normal;font-size:11.5px;font-weight:700;color:#9fb0d8}
.gp-ki{flex:none;display:inline-block}
.gp-ki.b{width:9px;height:9px;border-radius:50% 50% 50% 0;background:#369FFB;transform:rotate(-45deg)}
.gp-ki.o{width:9px;height:9px;border-radius:50% 50% 50% 0;background:#FF6702;transform:rotate(-45deg)}
.gp-sub{display:flex;align-items:center;gap:6px;margin-top:10px;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#9cc7ff}
.gp-sub span{padding:0 7px;border-radius:999px;background:rgba(54,159,251,.15);border:1px solid rgba(54,159,251,.4);font-size:11px;letter-spacing:0;color:#e8eefc}
.gp-ch{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.gp-ch li{font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(54,159,251,.4);color:#e8eefc}
.gp-ch.o li{border-color:rgba(255,103,2,.55)}
.gp-tip{position:fixed;left:0;top:0;z-index:1001;pointer-events:none;transform:translate(14px,-130%);background:#fff;color:#0a0f2a;border-radius:8px;padding:6px 10px;font-size:12px;line-height:1.3;opacity:0;transition:opacity .15s;white-space:nowrap;font-family:inherit}
.gp-tip.show{opacity:1}
.gp-tip b{display:block;font-weight:700}
.gp-tip span{font-size:10.5px;opacity:.75}
@media(max-width:1100px){.gp-inset{left:22px;bottom:14px}}
@media(max-width:820px){
 .gp-stage{padding:18px 0 4px}
 .gp-sc{overflow-x:auto;-webkit-overflow-scrolling:touch;padding:0 12px;scrollbar-width:none}
 .gp-sc::-webkit-scrollbar{display:none}
 .gp-svg{width:max(100%,720px)}
 .gp-inset{position:relative;left:auto;bottom:auto;width:min(calc(100% - 28px),340px);margin:6px auto 12px}
 .gp-leg{padding:14px 18px 16px;gap:10px 18px}
 .gp-hint{margin-left:0;width:100%}
 .gp-pop{left:12px;right:12px;top:auto;bottom:calc(12px + env(safe-area-inset-bottom,0px));width:auto;max-width:none;transform:translateY(16px)}
 .gp-pop.show{transform:none}
 .gp-pb{max-height:52vh}
}
@media(max-width:740px){.gp-hint .gp-dk{display:none}.gp-hint .gp-sw{display:inline}}
@media(prefers-reduced-motion:reduce){
 .gp-card{opacity:1;transform:none;transition:none}
 .gp-card *,.gp-pop,.gp-tip{animation:none!important;transition:none!important}
 .gp-pulse{display:none}.gp-gl{opacity:.55}
}