.honeycomb-section {
    min-height: 100vh;
    color: white;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 100px;
}

.honeycomb-section__solid-bg {
    background: #002D64;
    position: absolute;
    opacity: 0.91;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    z-index: 0;
    pointer-events: none;
}

.honeycomb-section__image-bg {
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    z-index: -2;
    position: absolute;

}


:root {
--hcft-hex-size: 160px;
--hcft-gap: 30px;
--hcft-sqrt3: 1.7320508075688772;
--hcft-hex-w: calc(var(--hcft-hex-size) * 2);
--hcft-hex-h: calc(var(--hcft-hex-size) * var(--hcft-sqrt3));

--hcft-wrap-break: 720;
}

.hcft-face h1,
.hcft-face h2,
.hcft-face h3,
.hcft-face h4,
.hcft-face h5,
.hcft-face h6,
.hcft-back h1,
.hcft-back h2,
.hcft-back h3,
.hcft-back h4,
.hcft-back h5,
.hcft-back h6
{
margin-bottom:5px;
}

.hcft-face h1:last-child,
.hcft-face h2:last-child,
.hcft-face h3:last-child,
.hcft-face h4:last-child,
.hcft-face h5:last-child,
.hcft-face h6:last-child,
.hcft-back h1:last-child,
.hcft-back h2:last-child,
.hcft-back h3:last-child,
.hcft-back h4:last-child,
.hcft-back h5:last-child,
.hcft-back h6:last-child
{
margin-bottom:0px;
}

.hcft-face p,
.hcft-back p
{
padding-bottom:0px;
}

@media (max-width: 690px) {
:root {
   --hcft-hex-size: 95px;
  --hcft-gap: 20px;
}
.hcft-hex {
  left: 0;
  right: 0;
}

.hcft-face,
.hcft-back {
  font-size: 14px !important;
}
}
.hcft-panel {
width: 100%;
height: 100%;
margin-inline: auto;
display: flex;
justify-content: center;
align-items: center;
}
.hcft-wrap {
width: 100%;
position: relative;
}

.hcft-honeycomb {
position: relative;
border-radius: 12px;
max-width: 100%;
margin: auto;
}

.hcft-hex {
position: absolute;
width: var(--hcft-hex-w);
height: var(--hcft-hex-h);
perspective: 1000px;
transform-origin: center;
will-change: transform;
}

.hcft-hex-inner {
width: 100%;
height: 100%;
transform-style: preserve-3d;
transition: transform 0.45s ease;
color: white;
}

.hcft-hex:not(.hcft__image):hover .hcft-hex-inner {
transform: rotateY(180deg) scale(1.3);
z-index: 2;
}
@media (max-width: 1580px) {
.hcft-hex.hcft__image {
  display: none;
}
}
.hcft-hex:hover {
z-index: 2;
}

.hcft-face {
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
padding: 0.6em;
text-align: center;
font-weight: 300;
clip-path: inherit;
backface-visibility: hidden;
-webkit-backface-visibility: hidden;
transform-style: preserve-3d;
}


.hcft-front {
background-size: 100% 100%;
background-repeat: no-repeat;
color: #fff;
transform: translateZ(1px);
padding: 0 25%;
}

.hcft-front-purple
{
background-image:url("../../../images/HEX_borderPurple.svg");
}
.hcft-front-navy
{
background-image:url("../../../images/HEX_borderNavy.svg");
}
.hcft-front-cobalt
{
background-image:url("../../../images/HEX_borderCobalt.svg");
}
.hcft-front-sky
{
background-image:url("../../../images/HEX_borderSky.svg");
}
.hcft-front-teal
{
background-image:url("../../../images/HEX_borderTeal.svg");
}
.hcft-front-aqua
{
background-image:url("../../../images/HEX_borderAqua.svg");
}
.hcft-front-violet
{
background-image:url("../../../images/HEX_borderViolet.svg");
}
.hcft-front-pink
{
background-image:url("../../../images/HEX_borderPink.svg");
}
.hcft-front-grey
{
background-image:url("../../../images/HEX_borderGrey.svg");
}
.hcft-front-white
{
background-image:url("../../../images/HEX_borderWhite.svg");
}

.hcft-back {
background-size: 100% 100%;
background-repeat: no-repeat;
transform: rotateY(180deg) translateZ(1px);
padding: 0 25%;
}

.hcft-back-purple
{
background-image: url("../../../images/HEX_Purple.svg");
color:white;
}
.hcft-back-navy
{
background-image: url("../../../images/HEX_Navy.svg");
color:white;
}
.hcft-back-cobalt
{
background-image: url("../../../images/HEX_Cobalt.svg");
color:white;
}
.hcft-back-sky
{
background-image: url("../../../images/HEX_Sky.svg");
color:white;
}
.hcft-back-teal
{
background-image: url("../../../images/HEX_Teal.svg");
color:white;
}
.hcft-back-aqua
{
background-image: url("../../../images/HEX_Aqua.svg");
color:white;
}
.hcft-back-violet
{
background-image: url("../../../images/HEX_Violet.svg");
color:white;
}
.hcft-back-pink
{
background-image: url("../../../images/HEX_Pink.svg");
color:white;
}
.hcft-back-grey
{
background-image: url("../../../images/HEX_Grey.svg");
color:white;
}
.hcft-back-white
{
background-image: url("../../../images/HEX_White.svg");
color:black;
}

.hcft-front-image-a {
transform: translateY(-100px) scale(0.95);
}

.hcft-front-image-a .hcft-back {
transform: translateY(-100px) scale(0.95) rotateY(180deg) translateZ(1px);
}

@media (max-width: 1340px) {
.hcft-front-image-a {
  transform: none;
}
}
.hcft-front-image-a__image {
background-image: url("../../../animated-sections/assets/honeycomb/a.png");
}
.hcft-front-image-b__image {
background-image: url("../../../animated-sections/assets/honeycomb/b.png");
}
.hcft-front-image-c__image {
background-image: url("../../../animated-sections/assets/honeycomb/c.png");
}
.hcft-hide {
opacity: 0.5 !important;
}