/* Triplan Website / Home / Logo Grid
 * Shortcode: [triplan_logo_grid]
 */

.tp-logo-grid {
  overflow: hidden;
  padding: var(--tp-section-spacing-y, 40px) 0 0;
  background: #fff;
  color: var(--tp-900, #1A2B49);
  font-family: var(--tp-body-font, "Poppins", sans-serif);
}

.tp-logo-grid__title {
  margin: 0 0 18px;
  color: var(--tp-900, #1A2B49);
  font-family: var(--tp-heading-font, "Poppins", sans-serif);
  font-size: clamp(2rem, 3vw, 3rem);
  line-height: 1.06;
  font-weight: 800;
  letter-spacing: 0;
  text-align: center;
}

.tp-logo-grid .hexa-container .hexa-box div,
.tp-logo-grid .hexa-container div.hexa-box {
  display: inline-block;
  font-size: initial;
  clip-path: polygon(92.32051% 40%,93.79385% 43.1596%,94.69616% 46.52704%,95% 50%,94.69616% 53.47296%,93.79385% 56.8404%,92.32051% 60%,79.82051% 81.65064%,77.82089% 84.50639%,75.35575% 86.97152%,72.5% 88.97114%,69.3404% 90.44449%,65.97296% 91.34679%,62.5% 91.65064%,37.5% 91.65064%,34.02704% 91.34679%,30.6596% 90.44449%,27.5% 88.97114%,24.64425% 86.97152%,22.17911% 84.50639%,20.17949% 81.65064%,7.67949% 60%,6.20615% 56.8404%,5.30384% 53.47296%,5% 50%,5.30384% 46.52704%,6.20615% 43.1596%,7.67949% 40%,20.17949% 18.34936%,22.17911% 15.49361%,24.64425% 13.02848%,27.5% 11.02886%,30.6596% 9.55551%,34.02704% 8.65321%,37.5% 8.34936%,62.5% 8.34936%,65.97296% 8.65321%,69.3404% 9.55551%,72.5% 11.02886%,75.35575% 13.02848%,77.82089% 15.49361%,79.82051% 18.34936%);
  background: #ccc;
  clip-path: polygon(75.365% 2.089%,26.264% 2.089%,1.628% 50.996%,26.264% 100%,75.365% 100%,100% 50.996%,75.365% 2.089%) !important;
}

.tp-logo-grid .splide__slide {
  height: 323px;
  display: flex;
  align-items: center;
  width: 1334.78px !important;
  padding-top: 8.5em;
  padding-bottom: 3em;
  margin: 0 -16.55em 0 0 !important;
}

.tp-logo-grid .hexa-box:hover {
  transform: scale(1.2);
  position: relative;
  z-index: 99;
}

.tp-logo-grid .hexa-main {
  display: flex;
  --s: 100px;
  --r: 1;
  --h: 0.25;
  --v: 0.35;
  --hc: calc(clamp(0, var(--h), 0.5) * var(--s));
  --vc: calc(clamp(0, var(--v), 0.5) * var(--s) * var(--r));
  --mv: -6px;
  --mh: calc(var(--mv) + (var(--s) - 2 * var(--hc)) / 2);
  --f: calc(2 * var(--s) * var(--r) + 4 * var(--mv) - 2 * var(--vc) - 2px);
  --h: 0.15;
  --v: 0.38;
  --mv: -6px;
  --s: 111.98px;
  --r: 0.84;
}

.tp-logo-grid .hexa-container {
  font-size: 0;
}

.tp-logo-grid .hexa-container div.hexa-box {
  width: var(--s);
  margin: var(--mv) var(--mh);
  margin-bottom: calc(var(--mv) - var(--vc));
  padding: 1px;
  height: 97.32px !important;
  transition: all .3s ease;
}

.tp-logo-grid .hexa-container .hexa-box div {
  width: 100%;
  margin: 0;
  height: 100%;
  margin-bottom: calc(var(--mv) - var(--vc));
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

.tp-logo-grid .hexa-container::before {
  content: "";
  width: calc(var(--s)/ 2 + var(--mh));
  float: left;
  height: calc(97px * 3);
  shape-outside: repeating-linear-gradient(#0000 0 calc(var(--f) - 30px),#000 0 var(--f));
}

.tp-logo-grid .splide__arrows,
.tp-logo-grid ul.splide__pagination {
  display: none !important;
}

.tp-logo-grid .hexa-container div.hexa-box:nth-child(n+8):nth-child(-n+13),
.tp-logo-grid .hexa-container div:nth-child(n+21):nth-child(-n+26) {
  position: relative;
  top: -6em !important;
}

.tp-logo-grid .hexa-container div:nth-child(n+27) {
  position: relative;
  top: -3em !important;
}

.tp-logo-grid ul {
  display: inline-flex;
}
