/* Green Pi Interactive City V6.15
   Corporate logo zone, premium animated hotspots, SaaS-grade product cards. */

/* 1) LOGO AREA — more corporate */
.gp-topbar-brand{
  min-width:320px !important;
  max-width:420px !important;
  display:flex !important;
  align-items:center !important;
  gap:14px !important;
  padding:10px 16px 10px 12px !important;
  border-radius:22px !important;
  background:linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,.08)) !important;
  border:1px solid rgba(255,255,255,.20) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18), 0 12px 30px rgba(6,18,26,.10) !important;
  backdrop-filter:blur(12px) saturate(1.08);
  -webkit-backdrop-filter:blur(12px) saturate(1.08);
}
.gp-topbar-logo,
.gp-topbar-logo .custom-logo-link{
  display:flex !important;
  align-items:center !important;
  flex:0 0 auto;
}
.gp-topbar-logo img,
.gp-topbar-logo .custom-logo{
  max-width:180px !important;
  max-height:58px !important;
  width:auto !important;
  height:auto !important;
  filter:drop-shadow(0 6px 12px rgba(0,0,0,.08));
}
.gp-topbar-brand-copy--always{
  display:flex !important;
  flex-direction:column;
  justify-content:center;
  min-width:0;
}
.gp-topbar-brand-copy--always small{
  margin:0 0 2px !important;
  color:rgba(231,249,244,.80) !important;
  font-size:10px !important;
  line-height:1.1 !important;
  font-weight:750 !important;
  letter-spacing:.20em !important;
  text-transform:uppercase;
}
.gp-topbar-brand-copy--always strong{
  color:#fff !important;
  font-size:19px !important;
  line-height:1.15 !important;
  font-weight:820 !important;
  letter-spacing:.01em !important;
  text-shadow:0 1px 10px rgba(0,18,26,.14);
  white-space:nowrap;
}

/* 2) HOTSPOTS — premium animation */
.gp-hotspot{
  width:34px !important;
  height:34px !important;
  filter:drop-shadow(0 8px 18px rgba(11,44,55,.22));
}
.gp-hotspot span{
  inset:9px !important;
  border:2px solid rgba(255,255,255,.95) !important;
  background:radial-gradient(circle at 35% 35%, #bffff0 0%, #64efd1 46%, #35d39a 72%, #20a77d 100%) !important;
  box-shadow:0 0 0 6px rgba(53,211,154,.15), 0 0 0 12px rgba(53,211,154,.08), 0 8px 20px rgba(0,44,38,.22) !important;
  overflow:visible;
}
.gp-hotspot span::before,
.gp-hotspot span::after{
  content:'';
  position:absolute;
  border-radius:50%;
  pointer-events:none;
}
.gp-hotspot span::before{
  inset:-5px;
  border:1px solid rgba(175,255,235,.55);
  box-shadow:0 0 16px rgba(94,237,195,.22);
  animation:gpPremiumHalo 2.6s ease-in-out infinite;
}
.gp-hotspot span::after{
  inset:3px;
  background:radial-gradient(circle, rgba(255,255,255,.96) 0 32%, rgba(255,255,255,0) 62%);
  opacity:.95;
}
.gp-hotspot::before,
.gp-hotspot::after{
  content:'';
  position:absolute;
  border-radius:50%;
  pointer-events:none;
}
.gp-hotspot::before{
  inset:1px;
  border:1px solid rgba(255,255,255,.75) !important;
  animation:gpHotspotPulsePremium 2.8s cubic-bezier(.16,.84,.44,1) infinite;
}
.gp-hotspot::after{
  inset:-4px;
  border:1px solid rgba(133,255,225,.30);
  opacity:.75;
  animation:gpHotspotPulsePremium 2.8s cubic-bezier(.16,.84,.44,1) .65s infinite;
}
.gp-hotspot:hover span,
.gp-hotspot.is-active span{
  background:radial-gradient(circle at 35% 35%, #d8f6ff 0%, #7ee0ff 46%, #49c9f2 72%, #1a9fd2 100%) !important;
  box-shadow:0 0 0 7px rgba(80,213,255,.17), 0 0 0 14px rgba(80,213,255,.07), 0 10px 24px rgba(0,52,95,.26) !important;
}
.gp-hotspot:hover::before,
.gp-hotspot.is-active::before{border-color:rgba(173,233,255,.95) !important}
.gp-hotspot:hover span::before,
.gp-hotspot.is-active span::before{border-color:rgba(173,233,255,.66)}
@keyframes gpHotspotPulsePremium{
  0%{transform:scale(.68);opacity:.92}
  68%{opacity:.16}
  100%{transform:scale(1.95);opacity:0}
}
@keyframes gpPremiumHalo{
  0%,100%{transform:scale(1);opacity:.76}
  50%{transform:scale(1.08);opacity:1}
}

/* 3) PRODUCT CARDS — SaaS style */
.gp-map-dock--products .gp-panel-product-list{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.gp-map-dock--products .gp-panel-product-card{
  display:grid !important;
  grid-template-columns:96px minmax(0,1fr) !important;
  gap:14px !important;
  align-items:start !important;
  padding:14px !important;
  border-radius:22px !important;
  border:1px solid rgba(255,255,255,.14) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.05)),
    radial-gradient(circle at top right, rgba(94,237,195,.14), transparent 38%) !important;
  box-shadow:0 16px 34px rgba(1,12,18,.16), inset 0 1px 0 rgba(255,255,255,.10) !important;
}
.gp-map-dock--products .gp-panel-product-card::before{
  content:'';
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,0) 34%, rgba(95,236,197,.05) 100%);
}
.gp-map-dock--products .gp-panel-product-card__media{
  width:96px !important;
  min-height:96px !important;
  border-radius:18px !important;
  overflow:hidden;
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(237,245,244,.86)) !important;
  box-shadow:0 10px 18px rgba(0,0,0,.10), inset 0 1px 0 rgba(255,255,255,.56) !important;
}
.gp-map-dock--products .gp-panel-product-card__media img{
  width:100%; height:100%; object-fit:cover; display:block;
}
.gp-map-dock--products .gp-product-placeholder{
  display:flex; align-items:center; justify-content:center; width:100%; height:100%;
  font-weight:900; color:#167562; font-size:28px;
}
.gp-map-dock--products .gp-panel-product-card__body{
  min-width:0;
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
  position:relative;
  z-index:1;
}
.gp-map-dock--products .gp-panel-product-card__brand{
  display:inline-flex !important;
  align-items:center;
  width:max-content;
  max-width:100%;
  padding:5px 10px !important;
  border-radius:999px !important;
  border:1px solid rgba(151,245,220,.22) !important;
  background:rgba(79,226,186,.10) !important;
  color:#a6f7df !important;
  font-size:10px !important;
  line-height:1 !important;
  font-weight:850 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase;
}
.gp-map-dock--products .gp-panel-product-card h3{
  margin:0 !important;
  font-size:15px !important;
  line-height:1.25 !important;
  font-weight:840 !important;
  letter-spacing:.005em !important;
}
.gp-map-dock--products .gp-panel-product-card h3 a{
  color:#ffffff !important;
  text-decoration:none !important;
}
.gp-map-dock--products .gp-panel-product-card p{
  margin:0 !important;
  font-size:12px !important;
  line-height:1.55 !important;
  color:rgba(236,247,245,.74) !important;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.gp-map-dock--products .gp-panel-product-card__actions{
  display:flex !important;
  gap:8px !important;
  flex-wrap:wrap !important;
  margin-top:2px;
}
.gp-map-dock--products .gp-panel-product-card__actions a{
  min-height:36px !important;
  padding:0 14px !important;
  border-radius:999px !important;
  font-size:12px !important;
  font-weight:780 !important;
  letter-spacing:.01em;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-decoration:none !important;
}
.gp-map-dock--products .gp-panel-product-card__actions a:first-child{
  border:1px solid rgba(255,255,255,.22) !important;
  color:#14333a !important;
}
.gp-map-dock--products .gp-panel-product-card__actions a:last-child{
  border:1px solid rgba(142,255,225,.62) !important;
  background:linear-gradient(135deg, rgba(56,223,171,.96), rgba(100,235,204,.88)) !important;
  color:#083730 !important;
}
.gp-map-dock--products .gp-panel-product-card:hover{
  transform:translateY(-4px) !important;
  border-color:rgba(94,237,195,.30) !important;
  box-shadow:0 24px 42px rgba(1,12,18,.18), 0 0 0 1px rgba(94,237,195,.10), inset 0 1px 0 rgba(255,255,255,.12) !important;
}
.gp-map-dock--products .gp-panel-product-card:hover .gp-panel-product-card__media{
  transform:translateY(-1px);
}
.gp-map-dock--products .gp-panel-product-card__media,
.gp-map-dock--products .gp-panel-product-card__actions a{
  transition:transform .24s ease, box-shadow .24s ease, border-color .24s ease, filter .24s ease !important;
}

@media (max-width: 1100px){
  .gp-topbar-brand{min-width:250px !important;max-width:310px !important}
  .gp-topbar-logo img,.gp-topbar-logo .custom-logo{max-width:148px !important;max-height:48px !important}
  .gp-topbar-brand-copy--always strong{font-size:16px !important}
}
@media (max-width: 700px){
  .gp-topbar-brand{min-width:0 !important;max-width:210px !important;padding:8px 10px !important;gap:10px !important}
  .gp-topbar-logo img,.gp-topbar-logo .custom-logo{max-width:120px !important;max-height:38px !important}
  .gp-topbar-brand-copy--always small{font-size:9px !important;letter-spacing:.14em !important}
  .gp-topbar-brand-copy--always strong{font-size:13px !important}
  .gp-map-dock--products .gp-panel-product-card{grid-template-columns:78px 1fr !important;padding:12px !important}
  .gp-map-dock--products .gp-panel-product-card__media{width:78px !important;min-height:78px !important}
}
