/* Zip Perde custom styles */

.navbar-brand .zip-logo,
.zip-logo {
   max-height: 120px;
   width: auto;
   height: auto;
}
.canvas-menu .logo img,
.offcanvas-header img.zip-logo {
   max-height: 48px;
   width: auto;
}
.zip-logo-footer {
   max-height: 126px;
   width: auto;
   filter: brightness(0) invert(1);
}

.zip-service-card .serv-icon { display: none; }
.zip-service-card {
   overflow: hidden;
   display: flex;
   flex-direction: column;
   height: 100%;
}
.zip-service-card .zip-serv-cover {
   width: 100%;
   height: 260px;
   overflow: hidden;
   flex-shrink: 0;
}
.zip-service-card .zip-serv-cover img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center;
   display: block;
   transition: transform 0.5s ease;
}
.zip-service-card:hover .zip-serv-cover img {
   transform: scale(1.06);
}
.zip-service-card .card-inner {
   flex: 1;
}
.zip-service-card .serv-thumb {
   display: none;
}
.zip-serv-img {
   display: none;
}

/* About timeline */
.zip-timeline {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 20px;
   margin-top: 30px;
}
.zip-timeline-item {
   background: #fff;
   border: 1px solid rgba(0,0,0,0.08);
   border-radius: 12px;
   padding: 18px 16px;
}
.zip-timeline-item .zip-year {
   display: inline-block;
   font-size: 22px;
   font-weight: 700;
   color: var(--primary, #c9a227);
   margin-bottom: 8px;
}
.zip-timeline-item p {
   font-size: 14px;
   line-height: 1.5;
   color: rgba(0,0,0,0.65);
}

@media (max-width: 767px) {
   .zip-timeline {
      grid-template-columns: 1fr;
   }
}

/* World map + location pins */
.zip-map-sec { overflow: hidden; }
.zip-pixel-map-wrap {
   max-width: 1100px;
   margin: 0 auto;
   position: relative;
}
.zip-pixel-map {
   position: relative;
   width: 100%;
   aspect-ratio: 960 / 620;
   background: #0b1220;
   border-radius: 16px;
   overflow: hidden;
   /* border: 1px solid rgba(255,255,255,0.08); */
}
.zip-map-img {
   width: 100%;
   height: 100%;
   object-fit: contain;
   display: block;
   image-rendering: pixelated;
   image-rendering: crisp-edges;
   opacity: 0.9;
   filter: contrast(1.05) brightness(0.95);
}

.zip-map-pin {
   position: absolute;
   transform: translate(-50%, -100%);
   width: 22px;
   height: 32px;
   padding: 0;
   border: 0;
   background: transparent;
   cursor: pointer;
   z-index: 2;
}
.zip-pin-icon {
   position: relative;
   z-index: 2;
   width: 22px;
   height: 32px;
   display: block;
   fill: #A99C88;
   filter: drop-shadow(0 2px 4px rgba(0,0,0,0.45));
   animation: zipPinBounce 2s ease-in-out infinite;
   animation-delay: var(--delay, 0s);
   transition: fill 0.25s ease, transform 0.25s ease;
}
.zip-pin-pulse {
   position: absolute;
   left: 50%;
   bottom: 2px;
   width: 14px;
   height: 14px;
   margin-left: -7px;
   border-radius: 50%;
   background: rgba(169, 156, 136, 0.45);
   animation: zipPinPulse 2s ease-out infinite;
   animation-delay: var(--delay, 0s);
   z-index: 1;
}
.zip-pin-label {
   position: absolute;
   left: 50%;
   bottom: calc(100% + 6px);
   transform: translateX(-50%);
   white-space: nowrap;
   background: rgba(0,0,0,0.88);
   color: #fff;
   font-size: 11px;
   font-weight: 600;
   padding: 5px 9px;
   border-radius: 6px;
   opacity: 0;
   pointer-events: none;
   transition: opacity 0.2s ease;
}
.zip-map-pin:hover .zip-pin-label,
.zip-map-pin.is-active .zip-pin-label,
.zip-map-pin:focus .zip-pin-label {
   opacity: 1;
}
.zip-map-pin:hover .zip-pin-icon,
.zip-map-pin.is-active .zip-pin-icon {
   fill: #c4b8a5;
   transform: scale(1.15);
   animation: none;
}

@keyframes zipPinBounce {
   0%, 100% { transform: translateY(0); }
   50% { transform: translateY(-4px); }
}
@keyframes zipPinPulse {
   0% { transform: scale(0.5); opacity: 0.7; }
   70% { transform: scale(2.2); opacity: 0; }
   100% { transform: scale(2.2); opacity: 0; }
}

.zip-country-list ul {
   list-style: none;
   margin: 0;
   padding: 0;
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   gap: 10px 14px;
}
.zip-country-item {
   color: rgba(255,255,255,0.55);
   font-size: 14px;
   display: inline-flex;
   align-items: center;
   gap: 8px;
   cursor: pointer;
   padding: 6px 12px;
   border-radius: 999px;
   border: 1px solid rgba(255,255,255,0.12);
   transition: color 0.25s ease, background 0.25s ease, border-color 0.25s ease;
}
.zip-country-item i {
   color: #A99C88;
   font-size: 13px;
   transition: color 0.25s ease;
}
.zip-country-item:hover,
.zip-country-item.is-active {
   color: #fff;
   background: rgba(255,255,255,0.08);
   border-color: rgba(255,255,255,0.28);
}
.zip-country-item:hover i,
.zip-country-item.is-active i {
   color: #fff;
}

/* Project cards */
.zip-project-card {
   height: 100%;
   overflow: hidden;
   border-radius: 12px;
}
.zip-project-card .project-media {
   height: 320px;
   overflow: hidden;
   margin: 0;
}
.zip-project-card .project-media img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center;
}
.zip-project-card .project-meta {
   display: none !important;
}
.zip-project-card .project-txt .icon-lg {
   display: none !important;
}
.zip-project-card .project-txt {
   opacity: 0.92 !important;
   filter: none !important;
   visibility: visible !important;
   transform: none !important;
   left: 14px;
   right: 14px;
   bottom: 14px;
   max-width: none;
   width: auto;
   padding: 14px 16px;
   background: rgba(255, 255, 255, 0.94);
   border-radius: 8px;
}
.zip-project-card .project-txt .pt-head {
   margin-bottom: 0;
   padding-bottom: 0;
   border-bottom: 0;
}
.zip-project-card .project-txt .pt-head:before {
   display: none;
}
.zip-project-card .project-txt .pt-head h3 {
   font-size: 16px;
   margin: 0 0 6px;
   line-height: 1.3;
}
.zip-project-card .project-txt .pt-head h3 a {
   color: var(--dark);
}
.zip-project-card .project-txt p {
   font-size: 13px;
   line-height: 1.45;
   margin: 0;
   color: rgba(0, 0, 0, 0.65);
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
}
.zip-project-card:hover .project-txt {
   opacity: 1 !important;
   transform: none !important;
}

/* Blog cards side by side */
.zip-blog-card {
   height: 100%;
   display: flex;
   flex-direction: column;
   background: #fff;
   border: 1px solid rgba(0,0,0,0.08);
   border-radius: 12px;
   overflow: hidden;
   transition: box-shadow 0.3s ease, transform 0.3s ease;
}
.zip-blog-card:hover {
   box-shadow: 0 12px 30px rgba(0,0,0,0.08);
   transform: translateY(-3px);
}
.zip-blog-media {
   position: relative;
   height: 220px;
   overflow: hidden;
}
.zip-blog-media img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: transform 0.4s ease;
}
.zip-blog-card:hover .zip-blog-media img {
   transform: scale(1.05);
}
.zip-blog-tag {
   position: absolute;
   left: 14px;
   top: 14px;
   background: #A99C88;
   color: #fff;
   font-size: 12px;
   font-weight: 600;
   padding: 5px 12px;
   border-radius: 999px;
}
.zip-blog-body {
   padding: 22px 20px 24px;
   display: flex;
   flex-direction: column;
   flex: 1;
}
.zip-blog-meta {
   display: flex;
   flex-wrap: wrap;
   gap: 10px 14px;
   margin-bottom: 12px;
   font-size: 13px;
   color: rgba(0,0,0,0.55);
}
.zip-blog-meta i {
   margin-right: 4px;
}
.zip-blog-body h3 {
   font-size: 18px;
   line-height: 1.4;
   margin: 0 0 18px;
   min-height: 50px;
}
.zip-blog-body h3 a {
   color: inherit;
}
.zip-blog-body .btn {
   margin-top: auto;
   align-self: flex-start;
}

/* References */
.zip-ref-item {
   height: 90px;
   display: flex;
   align-items: center;
   justify-content: center;
   background: #fff;
   border: 1px solid rgba(0,0,0,0.08);
   border-radius: 12px;
   padding: 16px;
}
.zip-ref-item img {
   max-height: 48px;
   max-width: 100%;
   object-fit: contain;
   filter: grayscale(1);
   opacity: 0.75;
   transition: all 0.3s ease;
}
.zip-ref-item:hover img {
   filter: none;
   opacity: 1;
}

.gtranslate_wrapper {
   display: flex;
   align-items: center;
   gap: 4px;
}
.gtranslate_wrapper a img,
.gtranslate_wrapper img {
   width: 24px !important;
   height: auto !important;
}

/* Mobile: languages centered between logo and menu */
@media (max-width: 1199.98px) {
   .header .navbar .container-fluid {
      position: relative;
   }
   .zip-mobile-langs {
      position: absolute;
      left: 59%;
      top: 50%;
      transform: translate(-50%, -50%);
      z-index: 2;
      pointer-events: auto;
   }
   .zip-mobile-langs .gtranslate_wrapper {
      justify-content: center;
      gap: 6px;
   }
   .zip-mobile-langs .gtranslate_wrapper a img,
   .zip-mobile-langs .gtranslate_wrapper img {
      width: 22px !important;
   }
}

@media (max-width: 991px) {
   .zip-pixel-map {
      border-radius: 12px;
   }
   .zip-map-pin {
      width: 18px;
      height: 26px;
   }
   .zip-pin-icon {
      width: 18px;
      height: 26px;
   }
   .zip-pin-label {
      font-size: 10px;
      padding: 3px 6px;
   }
}

@media (max-width: 575px) {
   .zip-map-pin .zip-pin-label {
      display: none;
   }
   .zip-country-item {
      font-size: 12px;
      padding: 5px 10px;
   }
   .zip-pixel-map-wrap {
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
   }
   .zip-pixel-map {
      min-width: 520px;
   }
}