/* Rekhi Global Export Markets — v1.3.0
   Real world-map image + country highlights. No country data cards.
   --gem-accent, --gem-accent-rgb, --gem-bg, --gem-text, --gem-muted, --gem-surface, --gem-surface-rgb
*/
.rekhi-exp-container{
  --gem-accent:#ff6600;
  --gem-accent-rgb:255,102,0;
  --gem-bg:#0a0a0a;
  --gem-text:#ffffff;
  --gem-muted:#aaaaaa;
  --gem-surface:#141414;
  --gem-surface-rgb:20,20,20;
  --rekhi-accent:var(--gem-accent);
  --rekhi-accent-rgb:var(--gem-accent-rgb);
  --rekhi-bg:var(--gem-bg);
  --rekhi-text:var(--gem-text);
  --rekhi-subtitle:var(--gem-muted);
  --gem-border:rgba(var(--gem-accent-rgb),0.22);
  --gem-radius:18px;
  --gem-font:'Segoe UI',system-ui,-apple-system,sans-serif;
  width:100%;
  max-width:none;
  margin:0;
  padding:clamp(48px,7vw,88px) clamp(16px,4vw,40px);
  box-sizing:border-box;
  font-family:var(--gem-font);
  color:var(--gem-text);
  background:var(--gem-bg);
}

.rekhi-exp-header{
  text-align:center;
  max-width:760px;
  margin:0 auto 36px;
}
.rekhi-exp-title{
  margin:0 0 12px;
  font-size:clamp(1.85rem,4.2vw,2.65rem);
  font-weight:750;
  line-height:1.15;
  letter-spacing:-0.02em;
  color:var(--gem-text);
}
.rekhi-exp-subtitle{
  margin:0 auto;
  max-width:40rem;
  font-size:clamp(1rem,2.2vw,1.125rem);
  line-height:1.55;
  color:var(--gem-muted);
}

/* World map — real image */
.rekhi-exp-world-map{
  display:block;
  width:100%;
  max-width:1180px;
  margin:0 auto;
}
.rekhi-exp-map-glass{
  background:
    radial-gradient(ellipse at 50% 35%,rgba(var(--gem-accent-rgb),0.1),transparent 55%),
    rgba(var(--gem-surface-rgb),0.92);
  border:1px solid var(--gem-border);
  border-radius:calc(var(--gem-radius) + 6px);
  padding:clamp(16px,2.5vw,28px);
  box-shadow:0 16px 48px rgba(0,0,0,.4);
  overflow:hidden;
}
.rekhi-exp-map-frame{
  position:relative;
  width:100%;
  border-radius:var(--gem-radius);
  overflow:hidden;
  background:#07070c;
  isolation:isolate;
}
.rekhi-exp-map-image{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:16/9;
  object-fit:cover;
  object-position:center 45%;
  vertical-align:middle;
  filter:saturate(1.05) contrast(1.05);
}
.rekhi-exp-map-fallback{
  width:100%;
  aspect-ratio:16/9;
  background:
    radial-gradient(ellipse at 30% 40%,rgba(var(--gem-accent-rgb),0.15),transparent 45%),
    radial-gradient(ellipse at 70% 50%,rgba(80,100,140,0.25),transparent 40%),
    #0c1018;
}
.rekhi-exp-map-grid{
  position:absolute;
  inset:0;
  pointer-events:none;
}
.rekhi-exp-map-dot{
  position:absolute;
  transform:translate(-50%,-50%);
  width:18px;
  height:18px;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  pointer-events:auto;
  z-index:2;
  animation:expPulse 2.4s ease-in-out infinite alternate;
  animation-delay:var(--dot-delay,0s);
}
.rekhi-exp-dot-pulse{
  display:block;
  width:12px;
  height:12px;
  margin:3px auto 0;
  border-radius:50%;
  background:var(--gem-accent);
  box-shadow:
    0 0 0 4px rgba(var(--gem-accent-rgb),0.25),
    0 0 20px rgba(var(--gem-accent-rgb),0.65);
}
.rekhi-exp-map-name{
  position:absolute;
  left:50%;
  white-space:nowrap;
  font-size:clamp(.7rem,1.2vw,.82rem);
  font-weight:700;
  letter-spacing:.02em;
  color:var(--gem-text);
  background:rgba(0,0,0,.72);
  border:1px solid rgba(var(--gem-accent-rgb),0.55);
  padding:4px 10px;
  border-radius:999px;
  box-shadow:0 6px 18px rgba(0,0,0,.45);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .18s ease, visibility .18s ease, transform .18s ease;
  z-index:5;
}
.rekhi-exp-map-dot.label-n .rekhi-exp-map-name{ bottom:calc(100% + 8px); top:auto; transform:translate(-50%,6px); }
.rekhi-exp-map-dot.label-s .rekhi-exp-map-name{ top:calc(100% + 8px); bottom:auto; transform:translate(-50%,-6px); }
.rekhi-exp-map-dot.label-e .rekhi-exp-map-name{ left:calc(100% + 10px); top:50%; transform:translate(-6px,-50%); }
.rekhi-exp-map-dot.label-w .rekhi-exp-map-name{ left:auto; right:calc(100% + 10px); top:50%; transform:translate(6px,-50%); }
.rekhi-exp-map-dot:hover .rekhi-exp-map-name,
.rekhi-exp-map-dot:focus-visible .rekhi-exp-map-name,
.rekhi-exp-map-dot.is-active .rekhi-exp-map-name{
  opacity:1;
  visibility:visible;
}
.rekhi-exp-map-dot.label-n:hover .rekhi-exp-map-name,
.rekhi-exp-map-dot.label-n:focus-visible .rekhi-exp-map-name,
.rekhi-exp-map-dot.label-n.is-active .rekhi-exp-map-name{ transform:translate(-50%,0); }
.rekhi-exp-map-dot.label-s:hover .rekhi-exp-map-name,
.rekhi-exp-map-dot.label-s:focus-visible .rekhi-exp-map-name,
.rekhi-exp-map-dot.label-s.is-active .rekhi-exp-map-name{ transform:translate(-50%,0); }
.rekhi-exp-map-dot.label-e:hover .rekhi-exp-map-name,
.rekhi-exp-map-dot.label-e:focus-visible .rekhi-exp-map-name,
.rekhi-exp-map-dot.label-e.is-active .rekhi-exp-map-name{ transform:translate(0,-50%); }
.rekhi-exp-map-dot.label-w:hover .rekhi-exp-map-name,
.rekhi-exp-map-dot.label-w:focus-visible .rekhi-exp-map-name,
.rekhi-exp-map-dot.label-w.is-active .rekhi-exp-map-name{ transform:translate(0,-50%); }
.rekhi-exp-map-dot:focus-visible{
  outline:2px solid var(--gem-accent);
  outline-offset:4px;
  border-radius:50%;
}

/* Always-readable country name strip (avoids Europe pile-up) */
.rekhi-exp-map-legend{
  list-style:none;
  margin:16px 0 0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px 10px;
}
.rekhi-exp-map-legend li{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:7px 12px;
  font-size:.82rem;
  font-weight:650;
  color:var(--gem-text);
  background:rgba(0,0,0,.35);
  border:1px solid rgba(255,255,255,.08);
  border-radius:999px;
}
.rekhi-exp-legend-pin{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--gem-accent);
  box-shadow:0 0 0 3px rgba(var(--gem-accent-rgb),0.22);
  flex-shrink:0;
}

@keyframes expPulse{
  from{ transform:translate(-50%,-50%) scale(1); }
  to{ transform:translate(-50%,-50%) scale(1.12); }
}

/* Shipping Worldwide — full viewport width band */
.rekhi-exp-shipping--full{
  width:100vw;
  max-width:100vw;
  position:relative;
  left:50%;
  right:50%;
  margin-left:-50vw;
  margin-right:-50vw;
  margin-top:clamp(36px,5vw,56px);
  padding:clamp(40px,6vw,72px) clamp(20px,6vw,64px);
  box-sizing:border-box;
  text-align:center;
  background:
    linear-gradient(180deg,rgba(var(--gem-accent-rgb),0.08),transparent 40%),
    rgba(var(--gem-surface-rgb),0.95);
  border-top:1px solid rgba(var(--gem-accent-rgb),0.22);
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.rekhi-exp-shipping-title{
  margin:0 0 28px;
  font-size:clamp(1.1rem,2.5vw,1.45rem);
  font-weight:750;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--gem-accent);
}
.rekhi-exp-icons{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  width:100%;
  max-width:1100px;
  margin:0 auto;
}
.rekhi-exp-icon{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  padding:clamp(22px,3vw,36px) 18px;
  background:rgba(0,0,0,0.28);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:16px;
  color:var(--gem-text);
  transition:border-color .25s ease, color .25s ease, transform .25s ease;
}
.rekhi-exp-icon:hover{
  border-color:rgba(var(--gem-accent-rgb),0.5);
  color:var(--gem-accent);
  transform:translateY(-2px);
}
.rekhi-exp-icon i{
  font-size:clamp(1.6rem,3vw,2rem);
  color:var(--gem-accent);
}
.rekhi-exp-icon span{
  font-size:clamp(.95rem,2vw,1.1rem);
  font-weight:700;
}
.rekhi-exp-icon small{
  font-size:.8rem;
  font-weight:500;
  color:var(--gem-muted);
}

/* Hide legacy country-data UI if cached Elementor markup remains */
.rekhi-exp-stats,
.rekhi-exp-layout,
.rekhi-exp-coverage,
.rekhi-exp-regions,
.rekhi-exp-region-card,
.rekhi-exp-country-list,
.rekhi-exp-grid,
.rekhi-exp-eyebrow,
.rekhi-exp-map-canvas,
.rekhi-exp-map-svg,
.rekhi-exp-land{display:none!important}

@media (max-width:720px){
  .rekhi-exp-icons{grid-template-columns:1fr}
  .rekhi-exp-map-legend{gap:6px}
  .rekhi-exp-map-legend li{font-size:.75rem;padding:6px 10px}
}
@media (prefers-reduced-motion:reduce){
  .rekhi-exp-map-dot{animation:none}
}
@media (hover:none){
  /* Touch: show all names via legend; keep pin tooltips on tap via :focus */
  .rekhi-exp-map-dot:focus .rekhi-exp-map-name{opacity:1;visibility:visible}
}
