.default-item {
  background: linear-gradient(270deg, #253e9d 0%, #385ded 50%, #203587 100%);
  box-sizing: border-box;
  border: 1px solid #233a92;
  position: relative;
}

/* Bordas azuis internas */
.border-top-blue {
  border-top: 2px solid #233a92;
}

.border-left-blue {
  border-left: 2px solid #233a92;
}

.border-right-blue {
  border-right: 2px solid #233a92;
}

.border-bottom-blue {
  border-bottom: 2px solid #233a92;
}

/* Bordas brancas com múltiplas camadas: azul -> preta -> branca -> preta */
.border-top-white {
  border-top: 2px solid white;
  box-shadow: 0 -8px 0 0 #233a92, 0 -14px 0 0 #000, 0 -24px 0 0 white,
    0 -34px 0 0 #000;
}

.border-right-white {
  border-right: 2px solid white;
  box-shadow: 8px 0 0 0 #233a92, 14px 0 0 0 #000, 24px 0 0 0 white,
    34px 0 0 0 #000;
}

.border-bottom-white {
  border-bottom: 2px solid white;
  box-shadow: 0 8px 0 0 #233a92, 0 14px 0 0 #000, 0 24px 0 0 white,
    0 34px 0 0 #000;
}

.border-left-white {
  border-left: 2px solid white;
  box-shadow: -8px 0 0 0 #233a92, -14px 0 0 0 #000, -24px 0 0 0 white,
    -34px 0 0 0 #000;
}

.border-top-white.border-left-white {
  box-shadow: 0 -8px 0 0 #233a92, 0 -14px 0 0 #000, 0 -24px 0 0 white,
    0 -34px 0 0 #000, -8px 0 0 0 #233a92, -14px 0 0 0 #000, -24px 0 0 0 white,
    -34px 0 0 0 #000, -8px -8px 0 0 #233a92, -14px -14px 0 0 #000,
    -24px -24px 0 0 white, -34px -34px 0 0 #000;
}

.border-top-white.border-right-white {
  box-shadow: 0 -8px 0 0 #233a92, 0 -14px 0 0 #000, 0 -24px 0 0 white,
    0 -34px 0 0 #000, 8px 0 0 0 #233a92, 14px 0 0 0 #000, 24px 0 0 0 white,
    34px 0 0 0 #000, 8px -8px 0 0 #233a92, 14px -14px 0 0 #000,
    24px -24px 0 0 white, 34px -34px 0 0 #000;
}

.border-bottom-white.border-left-white {
  box-shadow: 0 8px 0 0 #233a92, 0 14px 0 0 #000, 0 24px 0 0 white,
    0 34px 0 0 #000, -8px 0 0 0 #233a92, -14px 0 0 0 #000, -24px 0 0 0 white,
    -34px 0 0 0 #000, -8px 8px 0 0 #233a92, -14px 14px 0 0 #000,
    -24px 24px 0 0 white, -34px 34px 0 0 #000;
}

.border-bottom-white.border-right-white {
  box-shadow: 0 8px 0 0 #233a92, 0 14px 0 0 #000, 0 24px 0 0 white,
    0 34px 0 0 #000, 8px 0 0 0 #233a92, 14px 0 0 0 #000, 24px 0 0 0 white,
    34px 0 0 0 #000, 8px 8px 0 0 #233a92, 14px 14px 0 0 #000,
    24px 24px 0 0 white, 34px 34px 0 0 #000;
}

@media (max-width: 768px) {
  .border-top-white {
    border-top: 1.5px solid white;
    box-shadow: 0 -5px 0 0 #233a92, 0 -8px 0 0 #000, 0 -14px 0 0 white,
      0 -20px 0 0 #000;
  }

  .border-right-white {
    border-right: 1.5px solid white;
    box-shadow: 5px 0 0 0 #233a92, 8px 0 0 0 #000, 14px 0 0 0 white,
      20px 0 0 0 #000;
  }

  .border-bottom-white {
    border-bottom: 1.5px solid white;
    box-shadow: 0 5px 0 0 #233a92, 0 8px 0 0 #000, 0 14px 0 0 white,
      0 20px 0 0 #000;
  }

  .border-left-white {
    border-left: 1.5px solid white;
    box-shadow: -5px 0 0 0 #233a92, -8px 0 0 0 #000, -14px 0 0 0 white,
      -20px 0 0 0 #000;
  }

  .border-top-white.border-left-white {
    box-shadow: 0 -5px 0 0 #233a92, 0 -8px 0 0 #000, 0 -14px 0 0 white,
      0 -20px 0 0 #000, -5px 0 0 0 #233a92, -8px 0 0 0 #000, -14px 0 0 0 white,
      -20px 0 0 0 #000, -5px -5px 0 0 #233a92, -8px -8px 0 0 #000,
      -14px -14px 0 0 white, -20px -20px 0 0 #000;
  }

  .border-top-white.border-right-white {
    box-shadow: 0 -5px 0 0 #233a92, 0 -8px 0 0 #000, 0 -14px 0 0 white,
      0 -20px 0 0 #000, 5px 0 0 0 #233a92, 8px 0 0 0 #000, 14px 0 0 0 white,
      20px 0 0 0 #000, 5px -5px 0 0 #233a92, 8px -8px 0 0 #000,
      14px -14px 0 0 white, 20px -20px 0 0 #000;
  }

  .border-bottom-white.border-left-white {
    box-shadow: 0 5px 0 0 #233a92, 0 8px 0 0 #000, 0 14px 0 0 white,
      0 20px 0 0 #000, -5px 0 0 0 #233a92, -8px 0 0 0 #000, -14px 0 0 0 white,
      -20px 0 0 0 #000, -5px 5px 0 0 #233a92, -8px 8px 0 0 #000,
      -14px 14px 0 0 white, -20px 20px 0 0 #000;
  }

  .border-bottom-white.border-right-white {
    box-shadow: 0 5px 0 0 #233a92, 0 8px 0 0 #000, 0 14px 0 0 white,
      0 20px 0 0 #000, 5px 0 0 0 #233a92, 8px 0 0 0 #000, 14px 0 0 0 white,
      20px 0 0 0 #000, 5px 5px 0 0 #233a92, 8px 8px 0 0 #000,
      14px 14px 0 0 white, 20px 20px 0 0 #000;
  }
}

@media (max-width: 580px) {
  .border-top-white {
    border-top: 1px solid white;
    box-shadow: 0 -3px 0 0 #233a92, 0 -6px 0 0 #000, 0 -10px 0 0 white,
      0 -14px 0 0 #000;
  }

  .border-right-white {
    border-right: 1px solid white;
    box-shadow: 3px 0 0 0 #233a92, 6px 0 0 0 #000, 10px 0 0 0 white,
      14px 0 0 0 #000;
  }

  .border-bottom-white {
    border-bottom: 1px solid white;
    box-shadow: 0 3px 0 0 #233a92, 0 6px 0 0 #000, 0 10px 0 0 white,
      0 14px 0 0 #000;
  }

  .border-left-white {
    border-left: 1px solid white;
    box-shadow: -3px 0 0 0 #233a92, -6px 0 0 0 #000, -10px 0 0 0 white,
      -14px 0 0 0 #000;
  }

  .border-top-white.border-left-white {
    box-shadow: 0 -3px 0 0 #233a92, 0 -6px 0 0 #000, 0 -10px 0 0 white,
      0 -14px 0 0 #000, -3px 0 0 0 #233a92, -6px 0 0 0 #000, -10px 0 0 0 white,
      -14px 0 0 0 #000, -3px -3px 0 0 #233a92, -6px -6px 0 0 #000,
      -10px -10px 0 0 white, -14px -14px 0 0 #000;
  }

  .border-top-white.border-right-white {
    box-shadow: 0 -3px 0 0 #233a92, 0 -6px 0 0 #000, 0 -10px 0 0 white,
      0 -14px 0 0 #000, 3px 0 0 0 #233a92, 6px 0 0 0 #000, 10px 0 0 0 white,
      14px 0 0 0 #000, 3px -3px 0 0 #233a92, 6px -6px 0 0 #000,
      10px -10px 0 0 white, 14px -14px 0 0 #000;
  }

  .border-bottom-white.border-left-white {
    box-shadow: 0 3px 0 0 #233a92, 0 6px 0 0 #000, 0 10px 0 0 white,
      0 14px 0 0 #000, -3px 0 0 0 #233a92, -6px 0 0 0 #000, -10px 0 0 0 white,
      -14px 0 0 0 #000, -3px 3px 0 0 #233a92, -6px 6px 0 0 #000,
      -10px 10px 0 0 white, -14px 14px 0 0 #000;
  }

  .border-bottom-white.border-right-white {
    box-shadow: 0 3px 0 0 #233a92, 0 6px 0 0 #000, 0 10px 0 0 white,
      0 14px 0 0 #000, 3px 0 0 0 #233a92, 6px 0 0 0 #000, 10px 0 0 0 white,
      14px 0 0 0 #000, 3px 3px 0 0 #233a92, 6px 6px 0 0 #000,
      10px 10px 0 0 white, 14px 14px 0 0 #000;
  }
}